#main-content.clientsarea .container {
	width: 56%;
	/*width: 95%;*/
	padding-top:5px;
	padding-bottom: 50px;
	color: #333;
	background-color: #F8F8F8;
	background: #F8F8F8; /* Old browsers */
	background: -webkit-linear-gradient(top, #FEFEFE 0%, #BBBBBB 100%); /* Chrome10+,Safari5.1+ */
	background: -moz-linear-gradient(   top, #FEFEFE 0%, #BBBBBB 100%); /* FF3.6+ */
	background: -ms-linear-gradient(    top, #FEFEFE 0%, #BBBBBB 100%); /* IE10+ */
	background: -o-linear-gradient(     top, #FEFEFE 0%, #BBBBBB 100%); /* Opera 11.10+ */
	background: linear-gradient(  to bottom, #FEFEFE 0%, #BBBBBB 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FEFEFE', endColorstr='#BBBBBB', GradientType=0); /* IE6-9 */ 
}

#main-content.clientsarea .container::before {
	content: "";
	position: absolute;
	top: 0px;
	height: 0;
	width: 0;
	background-color: transparent;
}

#main-content.clientsarea .page-wastecert .container { padding-bottom: 0; }

.client_logo {
	float: left;
	margin: 5px 15px;
	max-width: 100%;
}
.client_logo img {
	max-width: 100%;
	height: auto;
}

#main-content.clientsarea .col1_3 { float: left; width: 30%; margin-right: 3%; }
#main-content.clientsarea .col2_3 { float: left; width: 66%; }
#main-content.clientsarea .col1_2 { float: left; width: 50%; }
#main-content.clientsarea .col1_1 { width: 100%; }
#main-content.clientsarea .col1_4 { float: left; width: 25%; }

.clientsarea .minibutton { font-size: 14px; line-height: 16px; font-weight: bold; padding: 0; margin: 0; }
.clientsarea .footnote { font-size: 12px; line-height: 14px; }
.clientsarea .textcenter { text-align: center; }
.clientsarea .strong { font-weight: bold; }

.hideme, .clientsarea .hideme { display: none !important; }

.backlink { font-size: 14px; font-weight: bold; }

.clientbar {
	width: 95%;
	text-align: center;
}

.legalNote { font-size: 14px; }
.legalNote p { line-height: 18px; }

.color-red {
	color: #FF0000;
}

/*.userSelectorBlock {*/
/*	text-align: right;*/
/*	padding: 5px;*/
/*	border: 1px solid #AAAAAA;*/
/*	background-color: rgba(255,255,255,0.5);*/
/*	float: right;*/
/*}*/


/* ****************** */
/* Login Form */

/*.login form {
    margin-top: 20px;
    margin-left: 0px;
    padding: 26px 24px 46px;
    font-weight: 400;
    overflow: hidden;
    background: #FFF none repeat scroll 0% 0%;
    box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.13);
}*/

.clientsarea #login {
	padding-top: 0;
}
.clientsarea .login form {
	margin-top: 0;
	padding: 10px;
}
.clientsarea .login form input {
	margin: 0;
}



/* ****************** */
/* button */

.clientsarea .button-primary,
.clientsarea .button {
    background-color: #FC3;
    border-color: #FC3;
    border-radius: 5px;
	border: 0px none;
	outline: 0px none;
    padding: 5px 8px;
    color: #000;
    text-shadow: none;
    text-decoration: none;
    display: inline-block;
}
.clientsarea .button-primary,
.clientsarea .button { line-height: 18px; margin: 5px 10px 10px; }
.clientsarea .button-primary:hover,
.clientsarea .button:hover {
    background-color: #000;
    border-color: #FC3;
    color: #FC3 !important;
}
.clientsarea .btnSubmit { font-size: 16px; cursor: pointer; }
/*.clientsarea label { font-size: 12px; font-weight: bold; margin-top: 5px; }*/

.clientsarea h2 { font-size: 18px; font-weight: bold; margin-top: 5px; }

.bordered { border: 1px solid #000000; }





.formclientselect {
	padding: 5px;
}
.formclientselect h2 {
	font-size: 18px;
	line-height: 20px;
}

.formclientselect #selectedUser { min-width: 200px;}




.clientInfoBox {
	background-color: #FFFFFF;
	padding: 20px;
	margin: 15px;
}
.clientInfoBox h3 { font-size: 16px; line-height: 18px; font-weight: bold; padding: 0; margin: 0; }
.clientInfoBox p { font-size: 14px; line-height: 16px; font-weight: bold; padding: 0; margin: 0; }
.clientInfoBox .minibutton { display: block; float: right; }





.formEmails h3 { font-size: 14px; line-height: 16px; font-weight: bold; padding: 0; margin: 0; text-align: center; }
.emailList { margin: 0 15px; }
.emailList div { margin: 5px 0 10px; }
.emailList a { display: inline-block; text-align: center; padding: 1px; background-color: #FFFFFF; border:1px solid #EEEEEE; width: 100%; }
.adminlogged .emailList a { width: 80%; }
.adminlogged .emailList form { display: inline-block; width: 15%; }
.emailAdd { margin: 0 15px; }
.formEmails .minibutton { display: block; float: right; }
#newEmailAddressBox { text-align: center; }




/*.formClient {*/
/*	font-size: 14px;*/
/*	line-height: 16px;*/
/*	padding: 0 10px;*/
/*}*/
/*.formClient label { font-size: 12px; font-weight: bold; margin-top: 5px; }*/
/* .formClient button { line-height: 18px; margin: 5px 10px 10px; }*/



#myequipmentbox {
	position:absolute;top: 10px; right:10px; text-align: center; width: 300px; height: 150px;
}
#myequipmentbox img { width: auto; height: auto; max-width: 100%; max-height: 100%; }



.clientActions { padding: 15px; text-align: center; display: block; position: relative; }
.clientActions .actionbox { position:relative; display: inline-block; width: 180px; height: 120px; margin-right: 10px; margin-bottom: 10px; border:1px solid #EEEEEE; overflow: hidden; }
.clientActions .actionTitle { position: relative; display: block; width:100%; height: 100%; text-align: center; }
.clientActions .boxtitle { position: absolute; bottom: 0; display: block; width:100%; background-color: rgba(0,0,0,0.5); color: #FFFFFF; text-align: center; font-size: 12px; font-weight: bold; }
.clientActions .hovertitle { position: absolute; top: -70px; display: block; width:100%; background-color: rgba(255,255,255,0.9); color: #000000; text-align: center; font-size: 12px; font-weight: bold; transition: all 0.4s ease-out 0s; line-height: 18px; }
.clientActions .actionTitle:hover .hovertitle { top: 20px; }
.clientActions .clearfix { width: 1080px; }

/*.safari .clientActions { display: table; }
.safari .clientActions .actionbox { display: table-cell; }*/

.clientUpgrades { padding: 15px; text-align: center; }
.clientUpgrades .actionbox { position:relative; display: inline-block; width: 200px; height: 120px; margin-right: 10px; margin-bottom: 10px; border:1px solid #EEEEEE; }
.clientUpgrades .actionTitle { position: relative; display: block; width:100%; height: 100%; text-align: center; }
.clientUpgrades .boxtitle { position: absolute; bottom: 0; display: block; width:100%; background-color: rgba(0,0,0,0.5); color: #FFFFFF; text-align: center; font-size: 12px; font-weight: bold; }
.clientUpgrades .boxprice { position: absolute; top: 0; display: block; width:100%; background-color: rgba(255,255,255,1.0); color: #fc3; text-align: center; font-size: 12px; font-weight: bold; }


#mygtmainlink { position:relative; display: inline-block; width: 302px; height: 196px; margin-right: 10px; margin-bottom: 10px; border:1px solid #EEEEEE; overflow: hidden; text-align: center; }
#mygtmainlink img { border: 1px solid rgba(0,0,0,0.3); }
#mygtmainlink .boxtitle { position: absolute; bottom: 0; display: block; width:100%; background-color: rgba(0,0,0,0.5); color: #FFFFFF; text-align: center; font-size: 16px; font-weight: bold; }


.formLvlList {
	
}
.formLvlList .listbox {
	max-height: 150px;
	overflow-y: scroll;
	background-color: rgba(255,255,255,0.5);
}
.listbox .resrow {
	font-size: 12px;
	min-height: 30px;
}
.listbox .resrow a { font-weight: bold; }
.listbox .resrow span {  }


.LvlResults {
	max-width: 350px;
	margin: 10px auto;
}
.LvlResults .resrow {}
.LvlResults .resrow label { display: inline-block; min-width: 120px; }
.LvlResults .resrow span { display: inline-block; min-width: 120px; text-align: center; }


#greaseVis { max-width: 500px; margin: 10px auto; }

#content #pageLevel .colFirst { width: 40%; }
#content #pageLevel .colLast { width: 60%; }

#greaseVis .title { text-align: center; font-size: 12px; font-weight: bold; }
#greaseVis .greaselvlbox { position: relative; min-height: 250px; background-color: #A8C6FE; border: 1px solid #333333; }
#greaseVis #greasecap,
#greaseVis #greasesediment {
	position: absolute; width: 100%; height: 15%; overflow: hidden;
	background-size: cover;
	transition: all 0.4s ease-out 0.1s;
}
#greaseVis #greasecap { top:0; background: transparent url(images/grease.png) bottom center no-repeat; }
#greaseVis #greasesediment { bottom:0; background: transparent url(images/sediment.png) top center no-repeat; }
#greaseVis #greaselvlbox .cont,
#greaseVis #greasecap .cont { position: relative; height: 100%; /*background-color: rgba(200,180,180,0.4);*/ }
#greaseVis #wastelabel          { display: block; position: absolute; top: 45%; width: 100%; text-align: center; margin: 0; text-shadow: 0px 0px 5px #FFFFFF; }
#greaseVis #lvlChartNote      { display: block; position: absolute; top: 40%; width: 100%; text-align: center; margin: 0; text-shadow: 0px 0px 5px #FFFFFF; color: #FF0000; font-size: 13px; }
#greaseVis #greasecaplabel      { display: block; position: absolute; top: 5px; width: 100%; text-align: center; margin: 0; text-shadow: 0px 0px 5px #FFFFFF; }
#greaseVis #greasesedimentlabel { display: block; position: absolute; bottom: 5px; width: 100%; text-align: center; margin: 0; text-shadow: 0px 0px 5px #FFFFFF; }

#greaseVis .greaseliner { background: transparent url(images/grease-liner.png) top center no-repeat; background-size: contain; position: absolute; top: 0; left: -16px; height: 100%; width: 30px; }

#pageLevel #lvlFootnote { display: block; margin-top: 25px; width: 100%; text-align: center; margin: 0; color: #FF0000; font-size: 16px; }




.formTreatList { position: relative; }
.clientTreatList { position: relative; }
.formTreatList h2 { text-align: center; }
.clientTreatList h2 { text-align: center; }
.clientTreatList h2.larger { font-size: 42px; }
.clientTreatList table , .formTreatList table { width: 90%; margin: 0 auto; border: 1px solid #333; z-index: 45; }
.clientTreatList table td , .formTreatList table td { text-align: center; padding: 10px 5px; }
.clientTreatList table .title td , .formTreatList table .title td { font-weight: bold; }

.clientTreatList .dccnumber { font-weight: bold; text-shadow: 0 0 2px #FC3; }

.clientTreatList .checkMark { font-weight: bold; font-size: 12px; }
.clientTreatList .checkMarkNo { font-weight: bold; font-size: 12px; color: #888888; }
.formTreatList .yearbg { display: none; }
.clientTreatList .yearbg { position: absolute; top: 40%; font-size: 200px; font-weight: bold; color: rgba(100,100,100,0.3); text-align: center; width: 100%; z-index:0; }







.LicenceResults { }
.LicenceResults {
	max-width: 400px;
	margin: 10px auto;
}
.wide100 { max-width: 500px; }
.LicenceResults table { margin-left: auto; margin-right: auto; }
.LicenceResults .resrow td { padding: 5px 10px;}
.LicenceResults .resrow label { display: inline-block; min-width: 120px; }
.LicenceResults .resrow label.bigger { font-size: 14px; }
.LicenceResults .resrow span { display: inline-block; min-width: 120px; text-align: center; }
.LicenceResults .highlight { color: #F00; font-weight: bold; }
.wide100 .resrow td { padding: 10px 20px;}

.otherResults { margin: 20px auto; text-align: center; }







.formCert {}
.formCert .col_left { text-align: center; }
.formCert .col_right { text-align: center; }
.formCert .insrow { padding: 0 0 5px; }
.formCert .reportfield { min-width: 300px; min-height: 150px;  }
.formCert .description { font-size: 12px; }



#wasteCert {  }
#wasteCert { position: relative; background: transparent url(images/cert-bg.jpg) center center no-repeat; background-size: cover; padding: 10px; }

#wasteCert {  }

#wasteCert h2 { text-align: center; font-size: 36px; padding: 10px auto 20px; }
#wasteCert .certRef { position: absolute; top: 20px; right: 15px; text-align: center; }
#wasteCert .certRef .value { text-align: center; color: #F00; }

#wasteCert .schedDate {}
#wasteCert .cleanDate {}

#wasteCert .clientInfoBox { background-color: rgba(255,255,255,1); }

#wasteCert .schedDate .resrow,
#wasteCert .cleanDate .resrow { padding-bottom: 5px; text-align: center; }
#wasteCert .schedDate .resrow .valuedate,
#wasteCert .cleanDate .resrow .valuedate { display: block; margin: 0 20%; background-color: rgba(255,255,255,0.9); }

#wasteCert .valuetd { display: block; margin: 0 15px; background-color: rgba(255,255,255,0.8); text-align: center; }

#wasteCert .legalNote p { text-align: center; font-weight: bold; font-size: 13px; line-height: 15px; }
#wasteCert .refInfo p { text-align: right; font-weight: normal; font-size: 11px; line-height: 13px; }

#wasteCert .refInfo { margin-top: 50px; }

#wasteCert .signatureBox { margin-top: 20px; }
#wasteCert .signaturenote { text-align: center; font-weight: bold; }
.certfootnote { text-align: center; color: #FF0000; font-size: 18px; }



#clientPlan {  }

#clientPlan .col1_3.col_first { width: 26%; }
#clientPlan .col1_3.col_middle { width: 38%; }
#clientPlan .col1_3.col_last { width: 26%; }
#clientPlan .col1_2.col_last { width: 46%; }

#clientPlan .resrow {  }
#clientPlan .col1_3 .resrow label { display: inline-block; width: 55%;  }
#clientPlan .col1_3 .resrow span.valuetd { display: inline-block; width: 40%; min-height: 27px; text-align: center; font-size: 14px; background-color: rgba(255,255,255,0.6);  }

#clientPlan .col1_2 .resrow label { display: inline-block; padding: 2px 10px; }
#clientPlan .col1_2 .resrow span.valuetd { display: inline-block; padding: 2px 10px; font-size: 14px; background-color: rgba(255,255,255,0.6); text-align:center;  }
#clientPlan .col1_2 .resrow span.width30pc { width: 30%; min-height: 27px; text-align: center;  }
#clientPlan .col1_2 .resrow .width60pc { width: 60%;  }


#clientPlan { padding-top: 0; }
#clientPlan .bordered { margin-top: 15px; }

#clientPlan .resbox { background-color: rgba(255,255,255,0.6); display: block; width: 100%; text-align: left; padding: 8px; }
#clientPlan .resbox label { color: #888888; font-size: 0.8em; }
#clientPlan .valuetext { padding: 5px; display: block; }


#clientDevice .widthfull { width: 100%; }
#clientDevice .resrow .labtd { padding-left: 10px; }
#clientDevice .resrow label { display: inline-block; padding: 2px 10px; }
#clientDevice .col1_3 .resrow label { width: 55%; }
#clientDevice .resrow span.valuetd { display: inline-block; padding: 2px 10px; font-size: 14px; background-color: rgba(255,255,255,0.6);  }
#clientDevice .col1_3 .resrow span.valuetd { width: 40%; text-align: center; }
#clientDevice .resrow .valuetd { padding: 1px; font-size: 13px; }
#clientDevice .resrow .valuetd .valuebox { display: block; padding: 2px 5px; font-size: 13px; background-color: rgba(255,255,255,0.6); text-align: center; min-width: 50px; min-height: 20px;  }




#clientWatres {  }

#clientWatres {}
#clientWatres .certRef { text-align: center; }
#clientWatres .certRef label { width: 50%; display: inline-block; }
#clientWatres .certRef .valuetd { display: inline-block; padding: 2px 10px; font-size: 14px; background-color: rgba(255,255,255,0.6); width: 40%; }

#clientWatres .legalNote p { text-align: center; font-size: 13px; line-height: 15px; }
#clientWatres .refInfo p { text-align: right; font-weight: normal; font-size: 11px; line-height: 13px; }

#clientWatres .signaturenote { text-align: center; font-weight: bold; }
#clientWatres .certfootnote { text-align: center; font-weight: normal; max-width: 800px; margin: 10px auto; }

#clientWatres .clientInfoBox { padding: 5px 15px; text-align: center; background-color: rgba(255,255,255,0.6); max-width: 600px; margin: 10px auto; }
#clientWatres .resrow { padding: 0 15px; }
#clientWatres .col1_2 .resrow label { display: inline-block; padding: 2px 10px; width: 55%; }
#clientWatres .col1_2 .resrow span.valuetd { display: inline-block; padding: 2px 10px; font-size: 14px; background-color: rgba(255,255,255,0.6); width: 40%; text-align: center; }
#clientWatres .col1_2 .resrow span.width30pc { width: 30%; text-align: center;  }
#clientWatres .col1_2 .resrow .width60pc { width: 60%;  }


#clientWatres .resblock label { display: block; padding: 2px 10px; }
#clientWatres .resblock .valuetd { display: block; padding: 2px 10px; font-size: 14px; background-color: rgba(255,255,255,0.6); min-height: 100px; }



.sessionnotice { display: block; padding: 5px 10px; background-color: rgba(255,200,200,0.2); color: #FF0000; border: 1px solid #FF0000; margin: 5px auto; }



.input-text-small {
	width: 70px;
}
.input-text-wide {
	width: 100%;
}

/* ****************************************************************************** */
/* Reminders */
/* ****************************************************************************** */
.client-reminder-box {
	width: calc(100% - 15px);
	padding: 10px;
	background-color: #ffffff;
	margin: 15px 15px 15px 0;
}
.client-reminder-box .reminder-state {
    text-transform: uppercase;
    font-size: 0.7em;
    font-weight: bold;
    margin-right: 10px;
}
.reminder-links {}
.reminder-preview-box {
	transition: all 0.4s;
	height: auto;
	overflow: hidden;
}
.active .reminder-preview-box {
	height: 0;
	padding: 0;
}
.reminder-preview {
	width: 100%;
	padding: 3px;
	background-color: #f8f8f8;
	border: 1px solid #f0f0f0;
}
.client-reminder-box .reminder-view-box {
	border: 1px solid transparent;
	background-color: #f8f8f8;
	transition: all 0.4s;
	height: 0;
	padding: 0;
	overflow: hidden;
}
.active .reminder-view-box {
	padding: 3px;
	height: auto;
	border: 1px solid #e0e0e0;
}
.reminder-meta {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: flex-start;
	padding: 4px;
	border-bottom: 1px solid #e0e0e0;
}
.reminder-meta-item {
	font-size: 11px;
	margin: 0 10px 5px 0;
}
.reminder-meta-item-value {
	font-size: 13px;
	font-weight: 600;
}
.reminder-content {
	padding: 5px 10px;
	font-size: 14px;
}

.reminder-anchor {
	position: relative;
}
.reminder-view-wrap {
	position: absolute;
	width: 500px;
    max-width: 98vw;
	background-color: #ffffff;
	border: 1px solid #dddddd;
	padding: 10px;
	border-radius: 10px;
    z-index: 9;
}
.reminder-view-wrap .reminder-meta span {
	display: inline;
}
.reminder-actions {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    padding: 4px;
    border-top: 1px solid #e0e0e0;
}
.reminder-actions .button {
    margin: 5px 10px;
}
.reminder-actions .button,
.reminder-date-box {
    cursor: pointer;
}
.reminder-anchor.rescheduled { }
.reminder-anchor.rescheduled .reminder-date-box,
.reminder-anchor.rescheduled .reminder-meta-item-date {
    text-decoration: line-through;
}
.reminder-meta-item-result {
    color: #ff0000;
}


/* ****************************************************************************** */
/* ****************************************************************************** */
/* ****************************************************************************** */
/* media requests */





@media (max-width: 768px) {
	
	.adminlogged { }
	
	
	#main-content.clientsarea .col1_2,
	#main-content.clientsarea .col1_3,
	#main-content.clientsarea .col2_3,
	#main-content.clientsarea .col1_4 {
		width: 100%;
	}
	
	
	
	
}
@media (max-width: 550px) {
	
	#greaseVis { margin: 10px 10px; }
	
	#myequipmentbox {
		display: none;
	}

	
}