﻿#portalNav{ clear:both; float:left; width:100%; margin:20px 0px 0px 0px; height:30px; border-bottom:4px solid #3A6AAD; background-image:url(/content/images/portal/portalnav_bg.png); background-repeat:no-repeat; background-position:top left; font-size:13px;}
#portalNav ul{ float:left;}
#portalNav ul li{ float:left; display:block; height:30px; list-style-type:none;}
#portalNav ul li a{ margin:6px 0px 0px 5px; width:120px; height:24px; display:block; text-align:center; line-height:180%; color:#FFF; background:url(/content/images/portal/portalnav_item_bg.png) top left no-repeat; font-weight:bold; font-size:14px; text-decoration:none;}
#portalNav ul li a.activeBuilderNav{ background:url(/content/images/portal/portalnav_active_bg.png) top left no-repeat;}

#portalAttention {margin: 15px 0 0 0; border: 1px solid #FF6D06;float: left;clear: both;width:958px;}
#portalAttention .headline { font-weight: bold; font-size: 13px;background: #FF6D06;color: #FFF;padding: 5px 10px; }
#portalAttention .content {padding: 5px;line-height: 150%;font-size: 13px;}
#portalAttention .content ul {margin: 0px 0px 0px 20px}
#portalAttention .code { font-family: monospace;}

.leftContainer { float: left;width: 740px; margin: 15px 0 0 0;clear: left;}
.leftContainer.border { border: 1px solid #A8CBF7;}
.leftContainer .headline { font-weight: bold; font-size: 13px;background: #D6E4F3;color: #3A6AAD;padding: 5px 10px; }

.rightContainer { float: right;clear: right;width: 200px;margin: 15px 0 0 0;border: 1px solid #A8CBF7;}
.rightContainer .headline { font-weight: bold; font-size: 13px;background: #D6E4F3;color: #3A6AAD;padding: 5px; }
.rightContainer .content { padding: 5px;line-height: 150%;font-size: 13px;}
.rightContainer .listItems li{ list-style: none;margin: 8px 5px;}
 
table.listTable {border: 1px solid #A8CBF7;width: 100%;border-collapse: collapse;}
.listTable .firstrow {background: #D6E4F3; color: #3A6AAD; border-top: 1px solid #A8CBF7!important;}
.listTable .lastcol { text-align: right;}
.listTable tr { border-top: 1px solid #D6E4F3;}
.listTable th { text-align: left;padding: 5px 8px;font-size: 13px;}
.listTable td { padding: 8px;}

.monitorTable #thType {width: 45px;}
.monitorTable #thInterval {width: 70px;}
.monitorTable #thLastCheckStatus {width: 75px; }
.monitorTable #thLastOutageDate {width: 140px;}
.monitorTable #thAction { width: 75px; }

.userTable #thStatus {width: 45px;}
.userTable #thType { width: 75px; }
.userTable #thAction { width: 75px; }
.userTable #thSms { width: 80px; }
.userTable #thPhone { width: 80px; }
.userTable #thName { width: 140px; }

.sampleLinksTable textarea { width: 620px; font-family: monospace;}
.sampleLinksTable td { padding-right: 10px;}

.reportFilter { margin: 0px 0px 15px 0px;}
.reportFilter .label {width: 80px;display: inline-block; font-weight: bold;padding: 3px 0px 0px 0px;}
.reportFilter input[type=text] {width: 200px;padding: 1px;}
.reportFilter select {width: 206px;padding: 1px;}
.reportFilter .filter { float: left;width: 320px;height: 30px;}
.reportFilter a { float: left;margin: 2px 0px 0px 0px; line-height: 150%}

.checkResultReport {}

.notificationReport .date { width: 120px;}
.notificationReport .via { width: 40px;}
.notificationReport .type { width: 40px;}
.notificationReport .user { width: 120px;}
.notificationReport .action { width: 40px;}
.notificationReport .message { display: none;}

.outageReport .date {width: 120px;}
.outageReport .location {width: 160px;}
.outageReport .duration {width: 60px;}
.outageReport .action {width: 40px;}
.outageReport .details { display: none;}

.uptimeChart { margin: 0px 0px 15px 0px;}
.uptimeChart .chartHeader {border-top: 1px solid #A8CBF7!important;}
.uptimeChart .chartHeader td { width: 30%;text-align: center; }
.uptimeChart .chartHeader .key { color: #333;font-weight: bold; font-size: 14px;}
.uptimeChart .chartHeader .value {color: #3A6AAD; font-size: 20px;margin: 5px 0 0 0;}

table.messageTable td { line-height: 130%;}
table.messageTable td.child { vertical-align: top;padding: 3px;}
table.messageTable td.firstCol { width: 80px;font-weight: bold;}

.formTable { margin: 10px;}
.formTable td{ padding: 0px 10px 10px 0px; text-align: left;vertical-align: top;line-height: 200%;}
.formTable td.firstcol { width: 100px;}
.formTable input[type=text], .formTable input[type=password] { width:200px; padding:2px;}
.formTable select{ width:208px; padding:2px;}
.formTable div.relation { display: inline; }
.formTable textarea{ width:400px; height:150px; padding:2px;}
.formTable .linkButton { line-height: 100%!important;padding: 5px 20px!important;}
.formTable .subHeading { font-weight: bold;}
.formTable input[readonly] {background-color:#f0f0f0;border: 1px solid #ccc;}
.formTable textarea[readonly] {background-color:#f0f0f0;border: 1px solid #ccc;}
.formTable #AlertPhoneCountryCode { width: 65px;margin-right: 5px;}
.formTable #AlertSmsCountryCode { width: 65px;margin-right: 5px;}
.formTable #AlertPhoneNumber { width: 130px;}
.formTable #AlertSmsNumber { width: 130px;}

table.notificationSetting td { padding: 0px 10px;text-align: center;}
table.notificationSetting .notifyMethod { }
table.notificationSetting td.notifyfirstcol { text-align: left!important;padding: 0px 10px 0px 0px!important;}

.settingsBlock h4{ font-weight: bold;font-size: 13px;color: #333;margin: 10px 0px 10px 10px;}
.settingsBlock .formTable { margin: 0px 20px 20px 20px!important;}
.settingsBlock .formTable td.firstcol { width: 120px;}
.settingsBlock .locationList {float: left; width: 200px;}
.settingsBlock .locationItem { float: left; }

.settingsBlock table.plansTable td { width: 14%!important;}
.settingsBlock table.plansTable td.first { padding: 0px 0px 0px 8px!important; width: 16%!important;}
.settingsBlock table.plansTable tr.colorA {background: #F4F4F4!important;}
.settingsBlock table.plansTable tr.colorB {background: #FFFFFF!important;}
.settingsBlock select#TimeZone { width: 300px;}
.settingsBlock .invoiceList li { float: left;width: 180px;margin: 5px 0 5px 20px; list-style-type:none;}

.settingsBlock #affiliateLink {padding: 5px 10px;margin-bottom: 10px; width: 400px; font-weight: bold; color: #3A6AAD; font-size: 13px; border: 1px solid #999; background-color: #FFFADD; text-decoration: none; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; }

.settingsBlock ul { margin-left: 30px; }
.settingsBlock li { margin: 5px 0 5px 0px; }
.settingsBlock div { margin: 5px 0px 5px 10px;line-height: 150%;}

.settingsBlock .maintenanceHours { margin: 8px 0px 0px 0px;}
.settingsBlock .maintenanceHours input[type=text] { width: 70px;}

.settingsBlock input[type=text] { width:200px; padding:2px;}
.settingsBlock table.earningsTable { margin: 0px 10px;}
.settingsBlock table.earningsTable tr.header { font-weight: bold; }
.settingsBlock table.earningsTable tr.header td { text-align: center; }
.settingsBlock table.earningsTable td { padding: 5px 10px;background: #F4F4F4;text-align: right;}
.settingsBlock table.earningsTable td.earning { font-weight: bold;color: green;}

.formErrorMessage { line-height: 170%; margin: 5px 0px 0px 10px;}

table.portalLoginBox {margin: 10px 0px}
table.portalLoginBox td { padding: 5px 10px 5px 0px;line-height: 150%;}
table.portalLoginBox input[type=text], table.portalLoginBox input[type=password] { width: 200px;padding: 1px 2px;}
table.portalLoginBox input[type=submit] { padding: 2px 20px;}

.activationForm input[type=text] { width: 250px; padding: 2px;}
.activationForm .linkButton { font-weight: bold;margin: 10px 0px;line-height: 150%}

#paginationContainer {margin:10px 0px 0px 0px;}
#paginationContainer #pageNumber {width: 30px;}

.bold { font-weight: bold;}
.red { color: red;}
.green { color: green;}
.gray { color: gray;}
.orange { color: #FF6D06;}

.noDisplay { display: none;}
.hidden { visibility: hidden;}

/* css for timepicker */
.ui-timepicker-div .ui-widget-header { margin-bottom: 8px; }
.ui-timepicker-div dl { text-align: left; }
.ui-timepicker-div dl dt { height: 25px; margin-bottom: -25px; }
.ui-timepicker-div dl dd { margin: 0 10px 10px 65px; }
.ui-timepicker-div td { font-size: 90%; }
.ui-tpicker-grid-label { background: none; border: none; margin: 0; padding: 0; }

.ui-timepicker-rtl{ direction: rtl; }
.ui-timepicker-rtl dl { text-align: right; }
.ui-timepicker-rtl dl dd { margin: 0 65px 10px 10px; }
