/* @override http://customers.hopus.net/css/hopus.css */
.containerWrapper {
 background-color:#fff !important;
 background:#111 url('/img/menu-separator.jpg') repeat-x 0 0px;
}

#header {
 background: transparent url('/img/hopus-logo.png') no-repeat 0 5px;
 margin-top: 15px;
}

#header a h1 {
 width:171px;
 height: 67px;
 margin-bottom: 30px;
}

#header a h1 span { display:none; }

#nav .content {
 padding-top: 0;
 padding-left: 60px;
 margin-top: 37px;
}

#subnav ul {
 display:inline;
 list-style: none;
 padding: 0;
 margin-top:15px;
 border-bottom: 1px solid #444;
 width:100%;
}

#subnav ul li {
 display:inline;
 float:left;
 margin: 0 3px 0 0;
 padding:7px 0;
}

#subnav ul li a.active {
 background-color:#fff;
 color:#282e32;
 font-weight:bold !important;
 border: 1px solid #444;
 border-bottom: 3px solid #fff;
}

#subnav ul li a {
 -moz-border-radius-topleft:7px;
 -moz-border-radius-topright:7px;
 -webkit-border-top-left-radius:7px;
 -webkit-border-top-right-radius:7px;
 border-radius-top-left:7px;
 border-radius-top-right:7px;
 background-color: #f3f3f3;
 color:#444;
 font-weight:normal !important;
 padding: 8px 14px;
 margin-right:1px;
 text-decoration:none;
 font-size:14px;
 font-family: Arial, "Helvetica Neue", Helvetica, Geneva, sans-serif;
 font-weight:bold;
 border:1px solid #d9d9d9;
 border-bottom:0 solid #464c54;
 letter-spacing:0;
}

#nav .content ul {
 list-style:none;
 padding-left:0;
 padding:0;
 margin:0;
 width:427px;
}

#nav .content ul li {
 display:inline;
 margin:0 5px;
 float:left;
}

#nav .content ul li a {
 color:#323232;
 text-decoration:none;
 padding:4px 8px;
 -moz-border-radius: 10px;
 -webkit-border-radius: 10px;
 font-size:16px;
 font-weight:bold;
 text-transform:capitalize;
}

#nav div.content.column.span-18 ul.column.last {
 width:142px;
 float:right;
 display:inline;
}

#nav div.content.column.span-18 ul.column.last li a {
 color:#e63021;
 text-align:right;
 font:bold 15px "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
}
#nav div.content.column.span-18 ul.column.last li a:hover {
 color: white;
 text-align: right;
 font: bold 13px "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
 background-color: #e63021;
}

input#date.datepicker.hasDatepicker {
 margin-top:8px;
}
#nav .content ul li a:hover {
 border-color:#ccc;
 background-color:#EAEAEA;
}

#nav .content ul li a.active {
 background-color:#e63021;
 -moz-border-radius:10px;
 -webkit-border-radius:10px;
 color:#fff;
}

#twofaForm label {
 line-height:30px;
 float:left;
 width:300px;
 margin-bottom:10px;
}

#twofaForm div.inner {
 margin-top:200px;
 margin-bottom:300px;
 border: 3px ridge #ccc;
 padding: 30px 20px;
 background-color: black;
 text-shadow: #000000 0 0 0;
 -moz-border-radius: 10px;
 -webkit-border-radius: 10px;
}

#twofaForm div.inner.column div label {
 color: silver;
 font-size: 1.4em;
}

#twofaForm div.inner.column div {
 float:left;
 margin-bottom:10px;
}

#twofaForm {
 width:450px;
 margin:auto;
}

input#two_facode {
 font-size:1.6em;
 width:90px;
 margin:1px;
}





#loginForm label {
 line-height:30px;
 float:left;
 width:100px;
}

input#password {
 font-size:1.6em;
 width:170px;
 margin:1px;
}

input#login {
 font-size:1.6em;
 margin:0;
 width:170px;
}

#loginForm div.inner {
 margin-top:200px;
 margin-bottom:300px;
 border: 3px ridge #ccc;
 padding: 30px 20px;
 background-color: black;
 text-shadow: #000000 0 0 0;
 -moz-border-radius: 10px;
 -webkit-border-radius: 10px;
}

#loginForm div.inner.column div label {
 color: silver;
 font-size: 1.4em;
}

label.checkboxLabel {
 line-height:auto;
 float:none;
 width:auto;
 font-weight:normal;
 font-size:13px;
}

#loginForm div.inner.column div {
 float:left;
 margin-bottom:10px;
}

#loginForm {
 width:400px;
 margin:auto;
}

#footer {
 background:transparent url('/img/footer-bg.jpg') repeat-x 0 -15px;
 height:100px;
 width:100%;
 float:left;
 margin-top:250px;
}

#footer div {
 margin:0 auto;
 width:950px;
 text-align:center;
 padding-top: 0px;
 margin-top : 60px;
 color: silver;
 font-size: 1em;
 font-weight: bold;
}

#footer a:hover, #footer a:visited {
 color:#ccc;
}

#footer div a {
 color:#999;
}

.infoBox h3 {
 color:#444;
 text-shadow:0 1px 1px #fff;
 text-align:center;
 padding:0;
 margin-bottom:15px;
 font:bold 2em "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
}

.infoBox {
 padding: 15px;
 border-radius:8px;
 -moz-border-radius:8px;
 -webkit-border-radius:8px;
 margin-top: 29px;
 background-color:#F7F89B;
 border-bottom: 2px solid #e8e8e8;
 margin-left: 10px;
 font-size: 13px;
}

fieldset {
 border-radius:6px;
 -moz-border-radius:6px;
 -webkit-border-radius:6px;
 margin-top: 15px;
}

.coolButton {
 margin-top:15px;
 padding:6px;
 color:white;
 background-color: #1cb223;
 border-radius:6px;
 -moz-border-radius:6px;
 -webkit-border-radius:6px;
 border:3px solid #147825;
 font:bold 15px Arial, "Helvetica Neue", Helvetica, Geneva, sans-serif;
}

.coolButtonSmall {
 padding:2px;
 color:white;
 margin-left:5px;
 background-color: #444;
 border-radius:6px;
 -moz-border-radius:6px;
 -webkit-border-radius:6px;
 border:2px solid #444;
 font:bold 11px Arial, "Helvetica Neue", Helvetica, Geneva, sans-serif;
}

.buttonApc:hover {
 color:#fff;
}
.buttonApc {
 text-decoration:none;
 padding:4px;
}

.buttonOn:hover { border-color:#2CEF34; }

.buttonOff:hover { border-color:#FF6F6F; }

.buttonOff {
 background-color:#f00;
 border-color:#8F0000;
}

.buttonReboot:hover { border-color:#FFE38F; }

.buttonReboot {
 background-color:#e63021;
 border-color:#CFA833;
}

input#email, input#subject { width:100%; }

.ui-datepicker-trigger {
 margin-top:4px;
 position:relative;
 left:-19px;
}

input,select,textarea {
 float:left;
 color:#444;
 margin-bottom:0 !important;
 font: bold 15px/17px "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
 letter-spacing:0;
 margin-top:0 !important;
}

div.formRow {margin-bottom:10px;}

span.formHelper {
 color:#999;
 font-size:80%;
 float:left;
}

ul.ticks li {
 list-style-type:none;
 list-style-image:url('/img/tick.png');
 font-weight: bold;
}

table.roundedCorner {
border-collapse:collapse;
font-family:"Lucida Sans Unicode","Lucida Grande",Sans-Serif;
font-size:12px;
margin:auto;
text-align:left;
}

table.roundedCorner td { vertical-align:top; }

table.roundedCorner th.roundedCornerTopRight {
	border-radius-topright:8px;
	-moz-border-radius-topright:8px;
	-webkit-border-radius-topright:8px;
}

table.roundedCorner th.roundedCornerTopLeft {
	border-radius-topleft:8px;
	-moz-border-radius-topleft:8px;
	-webkit-border-radius-topleft:8px;
}

table.roundedCorner td.roundedCornerBottomLeft {
	border-radius-bottomleft:8px;
	-moz-border-radius-bottomleft:8px;
	-webkit-border-radius-bottomleft:8px;
}

table.roundedCorner td.roundedCornerBottomRight {
	border-radius-bottomright:8px;
	-moz-border-radius-bottomright:8px;
	-webkit-border-radius-bottomright:8px;
}

table.roundedCorner thead th {
 background:#464C54 none repeat scroll 0 0;
 color:#fff;
 font-size:15px;
 font-weight:bold;
 padding:8px;
}

table.roundedCorner tfoot td {
 background:#F3F3F3 none repeat scroll 0 0;
 border-top:1px solid #ddd;
 color:#666699;
 padding:8px;
}

table.roundedCorner tbody td {
 background:#F1F1F1 none repeat scroll 0 0;
 border-top:1px solid #fff;
 color:#666;
 padding:8px;
}

table.roundedCorner tbody tr:hover td { background:#D9D9D9 none repeat scroll 0 0; }

.transitHeader {
 width:930px;
 border:1px solid #ccc;
 float:left;
 padding:10px;
 -moz-border-radius: 12px;
 -webkit-border-radius: 12px;
 border-radius:12px;
 margin-bottom:15px;
}

.transitHeader h2 {
 float:left;
 margin:0;
}

.transitHeader .transitSelector {
 float:right;
 margin-top:5px;
}

.SrcProbeHeader {
 width:400px;
 border:1px solid #ccc;
 float:left;
 padding:10px;
 -moz-border-radius: 12px;
 -webkit-border-radius: 12px;
 border-radius:12px;
 margin-bottom:15px;
}

.DstProbeHeader {
 width:400px;
 border:1px solid #ccc;
 float:right;
 padding:10px;
 -moz-border-radius: 12px;
 -webkit-border-radius: 12px;
 border-radius:12px;
 margin-bottom:15px;
}

.DstProbeHeader .dstProbeSelector {
 float:right;
 margin-top:5px;
}

.SrcProbeHeader .srcProbeSelector {
 float:left;
 margin-top:5px;
}


div.timeline
{
 background-color:#e63021;
 height:5px;
 width:99.3%;
 float:left;
 z-index:10;
 margin-top:-30px;
}

div.timelineArrow
{
 color:#e63021;
 float:right;
 font-size:40px;
 font-weight:bold;
 z-index:20;
 margin-top:-62px;
}

div.timelinebox { float:left; width:100%; }

ul.timeline {
 padding-left:0;
 margin-top:5px;
 width:100%;
 z-index:100;
}

ul.timeline li {
 display:inline;
 list-style:none;
 padding-right:110px;
}

/*ul.timeline li.week { padding-right:160px; }
ul.timeline li.month { padding-right:220px; }
*/
ul.timeline li a
{
 -moz-border-radius:8px;
 -webkit-border-radius:8px;
 border-radius:8px;
 background-color:#e63021;
 color:#ffffff;
 font-size:16px;
 text-decoration:none;
 padding:6px 10px;
 font-size:13px;
 font-weight:bold;
}

ul.timeline li a.active
{
 color:#fff;
 background-color:#444;
}

ul.graphList
{ 
list-style:none; 
padding-left: 110px;
}


#smstexte { width:100%; }
