/* STYLESHEET FILE DESCRIPTION: Styles for Support / System status */

#heading {margin-bottom: 40px;}


/* SOCIAL
#########################################*/
#social {
	height: 50px;
	background-color: #8cc63f;
}

#social .wrap {
	margin: 15px 20px 0 0;
	float: right;
}

#social .wrap a {
	margin-left: 20px;
	color: #3b6801;
	display: inline-block;
}

#social .wrap a span {
	margin-left: 30px;
	border-color: rgba(59,104,1,0.5);
}

#social .wrap a:hover {
	color: #fff !important;
}

#social .wrap a:hover span {
	border-color: rgba(255,255,255,0.5);
}

#social .wrap a em {
	width: 25px;
	height: 24px;
	margin-top: -4px;
	background-color: #3b6801;
	display: block;
	position: absolute;
    -webkit-transition: background-color .2s ease-in-out;
    -o-transition: background-color .2s ease-in-out;
    -moz-transition: background-color .2s ease-in-out;
    transition: background-color .2s ease-in-out;

}

#social .wrap a:hover em {
	background-color: #fff;
}

#social .wrap .rss em {background-image: url('/images/sections/support/index-news-rss.png')}


/* ALL OK
#########################################*/
#allok {
	width: 500px;
	height: 110px;
	margin: 40px 0 0 130px;
	background: url('/images/sections/support/status-allok.png') no-repeat;
}

#allok h3,
#allok p {margin-left: 125px;}

#allok h3 {
	padding-top: 20px;
	padding-left: 9px;
	font-size: 22px;
	color: #62961d;
}

#allok p {
	font-size: 14px;
	line-height: 18px;
	color: #000;
}


/* ISSUES
#########################################*/
#systemstatus {
	min-height: 500px;
	margin-top: 40px;
	padding-bottom: 20px;
}

/* Item */
#systemstatus .item {
	min-height: 110px;
	padding: 20px 100px 20px 80px;
}

#systemstatus .specs {
	width: 160px;
	position: absolute;
}

#systemstatus .specs .date {
	width: 160px;
	margin-top: 10px;
	text-align: right;
	font-size: 14px;
	color: #999;
}

#systemstatus .specs .type {
	margin-top: 10px;
	font-size: 14px;
	line-height: 16px;
	text-align: right;
	text-transform: uppercase;
	color: #999;
}

#systemstatus .specs .status {
	margin-top: 10px;
	margin-right: -3px;
	padding-top: 10px;
	border-top: 1px solid #e6e6e6;
	text-align: right;
}

#systemstatus .specs .status .marker {
	width: 10px;
	height: 10px;
	margin: 3px 5px 0 5px;
	border-radius: 10px;
	background-color: #ff6601;
	float: right;
}

#systemstatus .specs .status .text {
	font-size: 12px;
	color: #ff6601;
}

#systemstatus .heading,
#systemstatus .description,
#systemstatus .updates,
#systemstatus .services {
	margin-left: 180px;
}

#systemstatus .heading {
	padding: 10px;
	font-size: 16px;
	line-height: 21px;
	color: #4d4d4d;
	display: block;
	background: #ccc;
	border-radius: 6px;
}

#systemstatus .description {
	margin-top: 20px;
	padding-left: 10px;
	color: #000;
}

#systemstatus .description a {
	text-decoration: underline;
}

#systemstatus .updates {
	padding: 10px 10px 0 10px;
}

#systemstatus .updates h3 {
	margin-bottom: 10px;
	color: #035caa;
	font-size: 14px;
	text-transform: uppercase;
}

#systemstatus .updates li {
	margin-left: 20px;
	margin-bottom: 8px;
	line-height: 18px;
}

#systemstatus .updates .date {
	width: 160px;
	text-align: right;
	font-size: 14px;
	color: #999;
}

#systemstatus .updates .delimiter {
	margin: 0 5px 0 5px;
	color: #035caa;
	display: inline-block;
}

#systemstatus .updates .text {
	color: #000;
}

/* Statuses */
#systemstatus .item.closed .status .text {color: #62961d;}
#systemstatus .item.closed .status .marker {background-color: #62961d;}

#systemstatus .item.issue .specs .type {color: #ff6c0d;}
#systemstatus .item.issue .specs .status {border-color: #ffd2b5;}
#systemstatus .item.issue .heading {background-color: #ffd2b5; color: #612600;}

#systemstatus .item.maintenance .specs .type {color: #035caa;}
#systemstatus .item.maintenance .specs .status {border-color: #a4c1db;}
#systemstatus .item.maintenance .heading {background-color: #a4c1db; color: #001e38;}

#systemstatus .item.closed .specs .type {color: #999;}
#systemstatus .item.closed .specs .status {border-color: #e6e6e6;}
#systemstatus .item.closed .heading {background-color: #e6e6e6; color: #4d4d4d;}
#systemstatus .item.closed .description {color: #999;}
#systemstatus .item.closed .updates h3 {color: #666;}
#systemstatus .item.closed .updates .text,
#systemstatus .item.closed .updates .date,
#systemstatus .item.closed .updates .delimiter {color: #999;}

/* Services */
#systemstatus .services {
	margin-top: 10px;
	padding-left: 10px;
	color: #999;
}

#systemstatus .services em:last-child {display: none;}

#systemstatus .services a {
	color: #666 !important;
}

#systemstatus .services a > span {
	border-bottom: 1px solid rgba(0,0,0,0.3);
}

#systemstatus .services a:hover {
	color: #f34f0a !important;
}

#systemstatus .services a:hover > span {
	border-color: rgba(243,79,10,0.5);
}

/* ARCHIVE
#########################################*/
#systemstatus h2.archive {
	margin: 20px 0 0 90px;
	color: #0e5bb5;
}

#systemstatus .archive-item {
	margin: 20px 100px 20px 80px;
}

#systemstatus .archive-item .description {
	display: none;
}

#systemstatus .archive-item .heading {
	padding-top: 7px;
	color: #035caa;
	background: none;
}

#systemstatus .archive-item .heading a {
	color: #035caa !important;
}

#systemstatus .archive-item .heading a > span {
	border-bottom: 1px dotted rgba(3,92,170,0.5);
}

#systemstatus .archive-item .heading a:hover {
	color: #f34f0a !important;
}

#systemstatus .archive-item .heading a:hover > span {
	border-color: rgba(243,79,10,0.5);
}

#systemstatus .archive-item .heading em {
	width: 11px;
	height: 10px;
	margin-left: 5px;
	background: url('/images/sections/support/status-archive-more.png') no-repeat 0 3px;
	display: inline-block;
}

#systemstatus .archive-item {
	min-height: 73px;
	border: 1px solid #ccc;
	border-radius: 6px;
	background: url('/images/sections/support/status-archive.png') repeat-y;
}

#systemstatus .archive-item .services {
	margin-top: -3px;
	margin-bottom: 10px;
}