/* CSS Document */
@import url("font-awesome/css/font-awesome.min.css");
@import url("reset.css");
/* ---------- GENERAL ---------- */

* {
	box-sizing: border-box;
}
*:before, *:after {
	box-sizing: border-box;
}
html{
	height: 100%;
}
body {
	background: #EEE;
	color: #606468;
	font: 13px sans-serif, Arial;
	margin: 0px 15px;
	height: 100%;
}

a {
	color: #4aaee7;
	text-decoration: none;
}

a:hover {
	text-decoration: underline;
}

input[type="text"], input[type="password"], input[type="number"], input[type="email"], input[type="tel"], input[type="button"], input[type="submit"], select, textarea, button {
	border: none;
	font-family: sans-serif, Arial;
	padding: 0;
	-webkit-appearance: none;
}
p {
	line-height: 1.5em;
}

.clearfix {
	*zoom: 1;
}
.clearfix:before, .clearfix:after {
	content: ' ';
	display: table;
}
.clearfix:after {
	clear: both;
}
.nowrap{
	white-space: nowrap;
}



/* ---------- LOGIN ---------- */
#loginBody {
	background-color: #e4eff4;
	font: 87.5%/1.5em sans-serif, Arial;
}
#loginContainer {
	display: table;
	left: 50%;
	position: absolute;
	margin-top: 2%;
	-webkit-transform: translate(-50%, -0%);
		-ms-transform: translate(-50%, -0%);
			transform: translate(-50%, -0%);
}

#loginContainerRegister {
    display: table;
    left: 50%;
    position: absolute;
    margin-top: 10%;
    -webkit-transform: translate(-50%, 0%);
        -ms-transform: translate(-50%, 0%);
            transform: translate(-50%, 0%);
}
.containerWithSlick {
	width: 840px !important;
}
.loginWithSlick{
	width: 50% !important;
}
#loginAd {
	color: white;
	vertical-align: middle;
	display:table-cell;
	background-color: #2c4e60;
	padding: 35px 50px;
	border-radius: 0px 5px 5px 0px;
	text-align: center;
	width: 50% !important;
}
#slickContainer{
	display: block;
	max-width: 320px;
}
#slickElement{
	padding: 5px;
	margin: auto;
}
#loginAd h1{
	font-size: 18px;
}
#loginAd h2{
	font-size: 15px;
	padding-top: 10px;
}
#loginAd .screenshot img{
	margin: 20px 0px;
	cursor: pointer;
	max-width: 283px;
}
#login {
	display:table-cell;
}
#loginBrand {
	background-color: #fff;
	padding: 20px 50px 10px 50px;
	border-radius: 5px 0px 0px 0px;
	text-align: center;
}
#loginBrand img{
	max-height: 100px;
	max-width: 280px;
}
#loginSignUp{
	margin-top:-5px;
	padding: 35px;
	border-radius: 0px 0px 5px 5px;
	background-color: #1571c1;
	color:#ffffff;
	text-align: center;
}
#loginSignUp a{
	color: #FFD700;
	font-weight:bold;
}
#loginDetails {
	border-top: 1px solid #f1f5f6;
	background-color: #f7fbfc;
	padding: 35px 50px;
	border-radius: 0px 0px 5px 5px;
}
#loginDetails h1{
	font-weight: bold;
}
#login form span {
	background-color: #363b41;
	border-radius: 3px 0px 0px 3px;
	color: #606468;
	display: block;
	float: left;
	height: 50px;
	line-height: 50px;
	text-align: center;
	width: 50px;
}

#login .fa, #login .fas{
	color: #888b8e;
}
#login form input, #login form select {
	height: 50px;
}
#login form input[type="checkbox"] {
	height: auto;
	margin: 10px 5px 5px 0px;

}

#login form p{
	margin-bottom: 1.25em;
}
#login form input[type="email"], #login form input[type="password"], #login form input[type="text"], #login form input[type="tel"], #login form select  {
	border: 1px solid #3b4148;
	border-radius: 0px 3px 3px 0px;
	background-color: #FFF;
	color: #606468;
	font-size: 14px;
	letter-spacing: 1px;
	padding: 0 16px;
	width: 270px;
}
#login form input[name="txtFirstname"]{
	width:135px;
	border-radius:0px;
}
#login form input[name="txtSurname"]{
	width:135px;
	margin-left: -4px;
}
form input[type="button"], form input[type="submit"], button {
	border-radius: 3px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	background-color: #4aaee7;
	color: #FFF;
	font-size: 14px;
	letter-spacing: 1px;
	font-weight: normal;
	margin-top: .5em;
	margin-bottom: 1em;
	min-width: 200px;
	cursor: pointer;
	min-height: 40px;
}
#login form input[type="submit"] {
	border-radius: 3px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	background-color: #4aaee7;
	color: #FFF;
	font-size: 14px;
	letter-spacing: 1px;
	font-weight: normal;
	margin-top: .5em;
	margin-bottom: 1em;
	width: 320px; /*set ""#login .warning" to the same */
	cursor: pointer;
}

#login form input[name="selMobilePrefix"]{
	width:75px;
	border-radius:0px;
	padding-left: 83px!important;
	color:white;
	background-color: transparent;
	height: 50px;
}

.shortMobile{
	width: 166px!important;
	border-radius:0px;
}

#login form input[type="submit"]:hover {
	background-color: #39a6e5;
}
#login .warning{
	width: 320px;
	margin: 0px 0px 20px 0px;
}

#login > p {
	text-align: center;
}

#login > p span {
	padding-left: 5px;
}
#login .my-error-class {
	display:block;
	padding-top: 4px;
	padding-bottom: 4px;
	color:#de553e;  /* red */
}
#login .my-valid-class {
	color:#00CC00; /* green */
}
/* ---------- END LOGIN ---------- */



/* ---------- MAIN MENU ---------- */
#mainMenu{
	float: left;
	height: 36px;
	width: 100%;
	margin: 0px;
	padding: 0px;
}
#mainMenu ul {
	display: table;
	float: left;
	width: 100%;
	font-size: 14px;
	padding: 0;
	margin: 0;
	list-style-type: none;
}
#mainMenu ul li{
	display: table-cell;
	text-align: center;
}
#mainMenu a{
	padding: 10px;
}
.menuOff{
	font-weight: 200;
	display: block;
	background-color: #363B41;
}
.menuOff:hover{
	text-decoration: none;
	background-color: #484E56;
}
.menuOn{
	font-weight: 200;
	display: block;
	background-color: #4aaee7;
	color: #FFF;
}
.menuOn:hover{
	text-decoration: none;
	background-color: #39a6e5;
}
/* ---------- END MAIN MENU ---------- */





/* ---------- SUB MENU ---------- */
#subMenu{
	float: left;
	height: 30px;
	line-height: 30px;
	width: 100%;
	background-color: #e4eff4;
	padding-left: 10px;
	margin-bottom: 10px;
}
#subMenu a{
	color: #5ca1ad;
}
/* ---------- END SUB MENU ---------- */




/* START tablesort CSS */
table.tablesorter thead tr .header {
	background-image: url(../../images/sort_bg.gif);
	background-repeat: no-repeat;
	background-position: center right;
	cursor: pointer;
}
table.tablesorter thead tr .header:hover {
	background-color: #39a6e5;
}
table.tablesorter thead tr .headerSortUp {
	background-image: url(../../images/sort_asc.gif);
}
table.tablesorter thead tr .headerSortDown {
	background-image: url(../../images/sort_desc.gif);
}
table.tablesorter thead .filter {
	width: 95%;
	height: inherit;
	margin: 0px;
	padding: 2px;
	background-color: #fff;
	border: 1px solid #bbb;
	color: #333;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-transition: height 0.1s ease;
	-moz-transition: height 0.1s ease;
	-o-transition: height 0.1s ease;
	transition: height 0.1s ease;
}
/* END tablesort CSS */


/* START Modal Box CSS */
#lean_overlay {
	position: fixed;
	z-index:100;
	top: 0px;
	left: 0px;
	height:100%;
	width:100%;
	background: #000;
	display: none;
}
.modalContainer{
	-webkit-border-radius:7px;
	-moz-border-radius:7px;
	-ms-border-radius:7px;
	-o-border-radius:7px;
	border-radius:7px;
	background-color:#FFF;
	height: 100%;
	width: 100%;
}
.modalContainer thead tr th{
	padding:15px 20px;
	border-bottom:1px solid #ecf0f1;
	-webkit-border-top-left-radius:5px;
	-moz-border-top-left-radius:5px;
	-ms-border-top-left-radius:5px;
	-o-border-top-left-radius:5px;
	border-top-left-radius:5px;
	-webkit-border-top-right-radius:5px;
	-moz-border-top-right-radius:5px;
	-ms-border-top-right-radius:5px;
	-o-border-top-right-radius:5px;
	border-top-right-radius:5px;
	color: #35495d;
	font-size: 20px;
	font-weight: bold;
	width: 100%;
	text-align: left;
}
.modalContainer tbody tr td{
	padding: 20px;
	color: black;
	font-size: 14px;
}
.modalContainer tfoot tr td{
	padding: 15px;
	-webkit-border-bottom-left-radius:5px;
	-moz-border-bottom-left-radius:5px;
	-ms-border-bottom-left-radius:5px;
	-o-border-bottom-left-radius:5px;
	border-bottom-left-radius:5px;
	-webkit-border-bottom-right-radius:5px;
	-moz-border-bottom-right-radius:5px;
	-ms-border-bottom-right-radius:5px;
	-o-border-bottom-right-radius:5px;
	border-bottom-right-radius:5px;
	background-color:#ecf0f1;
	text-align:right;
	white-space: nowrap;
}
.modalContainer .modalBtn{
	padding: 0px 10px;
	font-size: 12px;
	margin: 0px !important;
	min-width: 50px;
	min-height: 35px;
	box-sizing: content-box;
}
.modalContainer .modalBtn:hover{
	background-color: #39a6e5;
}

/* END Modal Box CSS */



#outerContainer{
	background-color: #FFF;
	height: 100%;
	width: 100%;
	min-width: 430px;
	max-width: 2000px;
	margin: 0 auto;
}
#header{
	float: left;
	height: 75px;
	width: 100%;
	background: #FFFFFF;
}
#headerImage{
	margin: 8px;
	cursor: pointer;
}
#innerContainer{
	float: left;
	width: 100%;
}
#content{
	background: #FFFFFF;
	width: 100%;
}
table{
	border-spacing: 0px;
	border-collapse: separate;
}
table td{
	padding: 4px;
}

#innerContainer form input[type="text"], #innerContainer form input[type="tel"], #innerContainer form input[type="number"], #innerContainer form input[type="email"], #innerContainer form input[type="password"], #innerContainer form input[type="tel"], #innerContainer form select{
	height: 40px;
	border: 1px solid #DDD;
	border-radius: 0px;
	background-color: #FFF;
	color: #606468;
	font-size: 13px;
	padding: 0px 10px;
}
#innerContainer form textarea {
	border: 1px solid #DDD;
	border-radius: 0px;
	background-color: #FFF;
	color: #606468;
	font-size: 13px;
	padding: 8px;
}


form input[type="button"]:hover, form input[type="submit"]:hover, form button:hover {
	background-color: #39a6e5;
}
.circliful{
	margin: 0px 5px 10px 5px;
	padding: 0px 10px 25px 10px;
	float: left;
}
.circliful:hover{
	background-color: #f7fbfc;
	cursor: pointer;
}
.smallField{
	width: 80px;
}
.longField{
	width: 350px;
}

.info{
	display: block;
	margin: 10px;
	padding: 20px;
	color:#32718e;
	background-color: #d8edf8;
	border-collapse: separate !important;
	border-radius: 4px;
	border: 1px solid #bce8f1;
	font-size: 14px;
}
.success{
	display: block;
	margin: 10px 10px 35px 10px;
	padding: 20px;
	color:#5c905b;
	background-color: #dff0d7;
	border-collapse: separate !important;
	border-radius: 4px;
	border: 1px solid #d7ebc8;
	font-size: 14px;
}
.warning{
	display: block;
	margin: 10px;
	padding: 20px;
	color:#b23230;
	background-color: #ecc8c4;
	border-collapse: separate !important;
	border-radius: 4px;
	border: 1px solid #c89292;
	font-size: 14px;
}

.btnSmall{
	min-width: 50px !important;
	margin: 5px 5px 5px 0px !important;
	padding: 6px 20px !important;
	font-size: 12px !important;
	font-family: 'FontAwesome' !important;
}
.btnGrey{
	background-color: #a8bbbf !important;
}
.btnGrey:hover{
	background-color: #9db2b7 !important;
}
.btnRed{
	background-color: #B63A2A !important;
}
.btnRed:hover{
	background-color: #A63526 !important;
}
table.tblBox thead tr{
	background-color: #4aaee7;
	color: #FFF;
}
table.tblBox thead tr th{
	border: 1px solid #279ee2;
	text-align: left;
	padding: 10px;
}
table.tblBox tbody tr td{
	border-bottom: 1px solid #D3D3D3;
	padding: 10px;
}
table.tblBox tbody tr:hover{
	cursor: pointer;
	background-color: #e4eff4;
}
tr.tblBoxClone:hover{
	background-color: #e4eff4;
}
tr.tblBoxClone td{
	border-bottom: 1px solid #D3D3D3;
	padding: 10px;
}
.maxWidth{
	width: 100%;
}
.maxHeight{
	height: 100%;
}
.vtop{
	vertical-align: top;
}
.marginAuto{
	margin: auto;
}
.tacenter{
	text-align: center;
}
.taright{
	text-align: right;
}
.taleft{
	text-align: left;
}
.dispInline{
	display: inline;
}
.dispNone{
	display: none;
}
.vHidden{
	visibility: hidden;
}
.noMargin{
	margin: 0px;
}
.pad10{
	padding: 10px;
}
.padLeft0{
	padding-left: 0px;
}
.padLeft10{
	padding-left: 10px;
}
.padTop0{
	padding-top: 0px;
}
.padRight10{
	padding-right: 10px;
}
.fleft{
	float: left;
}
.fright{
	float: right;
}
.divideH{
	width: 100%;
	background-color:#D3D3D3;
	margin:10px 0px;
}
.greyText{
	color: #606468;
}
.frightusername {
	float: right;
	margin: 30px;
	font-weight: 700;
	font-size: 14px;
}
.reportCount {
	color:#1A1919;
	font-size: 12px;
	font-weight:bold;
	margin: 10px 0px 10px 0px;
}


form.booking-form fieldset {
	padding: 10px 20px;
	padding-right: 130px !important;
}

@media (min-width: 1300px) {
	#fsScoring{max-width: calc(100% - 460px);}
}
#fsRecomm{min-width:440px;}
#fsRecomm .form-main{width:100%;}

form .form-main textarea {
	height: 100px;
}
form .form-bottom button.btn {
	min-width: 105px;
}

.form-top {
	overflow: hidden;
	text-align: left;
}

.form-top h3 {
	margin-top: 20px;
	font-size: 20px;
	font-weight: 400;
	color: #000;
	line-height: 28px;
}
.form-top h4 {
	margin: 2px 0px 0px 0px;
	font-size: 13px;
	color:#de553e;  /* red */
	line-height: 14px;
}
.form-top p {
	color: #747a83;
	font-size: 14px;
	font-weight: 400;
}

.form-main {
	display:inline-block;
	text-align: left;
}
.form-main input[type="number"]{
	margin-left: 20px;
	/* float: right; */
	padding: 10px !important;
	font-size: 15px !important;
}
.form-main input[type="text"]{
	font-size: 15px !important;
}
.form-row{
	padding: 15px 0px;
}
.form-row span {
	color: #555;
	font-weight: 400;
	font-size: 16px;
	line-height: 40px;
}
.spQuestions{
	display: inline-block; /*can't alter the width of span without this */
}
.mandatory:after {
	content: " *";
	color: #CD0000;
	font-size: 18px;
}

#content form input[type="number"]:focus,
#content form input[type="text"]:focus,
#content form textarea:focus,
#content form textarea.form-control:focus {
	border: solid 1px #b3e0f9;
	box-shadow: 0 0 5px 1px #c7e7f9;
	outline: none; /* doesn't work on textarea without this */
}

.checkable-group span {
	line-height: 50px;
	vertical-align: top;
}
.checkable-group span input[type="text"]{
	vertical-align: top;
}
.no-label label { display: none;}

.btn-Download{
	vertical-align:top;
	width: 280px;
	height: 90px;
	background-image: url('../images/btn_Download2.png');
	background-repeat: no-repeat;
	background-position: left center;
	text-align: right;
	font-size: 18px !important;
	padding-right: 20px !important;
}
.my-error-class {
	display: block;
	padding-top: 4px;
	color:#de553e; /* red */
	font-size: 14px !important;
}
.my-error-classContainer{
	background-color: #FFF4F4;
}
#content form .form-row input.my-error-classElement,
#content form .form-row textarea.my-error-classElement{
	background-color: #F2DEDE;
	border: solid 1px #EBCCCC;
}
#content form .form-row input.my-error-classElement:focus,
#content form .form-row textarea.my-error-classElement:focus{
	box-shadow: 0 0 5px 1px #edd5d5;
	outline: none; /* doesn't work on textarea without this */
}
.lblReadonly{
	font-size: 22px;
	line-height: 40px;
	color: black;
	/*float: right;*/
	margin-left: 30px;
}
.lblReadonlyTA{
	font-size: 14px;
	line-height: 22px;
	color: black;
	border: 1px solid #e9e9e9;
	width: 100%;
	display: inline-block;
	min-width: 330px;
	min-height: 90px;
	padding: 10px;
}
.reviewResult{
	font-size: 30px;
	text-align: center;
}
.reviewResult h6{
	font-size: 16px;
}
ul.checkbox{
	margin: 0;
	padding: 0;
	list-style: none;
}

ul.checkbox li{
	display:inline-block;
	width: 365px;
	overflow: hidden;
}
fieldset#fsClientAnalysisMultiSelect{
	padding-right: 0px !important;
}
fieldset#fsPermissions{
	margin-bottom: 0px;
	padding-bottom: 0px;
}
fieldset#fsPermissions .form-row{
	padding-top: 0px;
	padding-bottom: 0px;
}
fieldset#fsButtonContainer{
	margin-top: 0px;
	padding-top: 0px;
}
 /* Testimonials */
 #testimonials {
	margin-left: 5px;
	width: 310px;
	vertical-align: middle;
	background-color: white;
	border-radius: 5px;
	padding:1.2em 1.2em 2em 1.2em;
}
#testimonials h2 {
	color: white;
	font-weight: 300;
}

#testimonials p {
color: white;
	font-size:1.2em;
}
#testimonials blockquote {
	border:none;
	text-align: left;
	font-size:1em;
	color: #4d4d4d;
	line-height: 1.4;
	margin: 2em 0;
}
#testimonials .avatar img {
	border-radius: 50%;
	float:left;
	display:inline;
	margin-right:1em;
	width:65px;
	height:65px;
	max-width: 150px;
	max-height: 150px;
	background-color: white;
}
#testimonials .avatar p {
	text-align: left;
	color: #5d5d5d;
	font-weight: 900;
 }
#testimonials .avatar .subHeading{
	color: #5d5d5d;
	font-weight: 700;
	font-size: .8em;
}
 #testimonials .logo img{
	padding-top: 2em;
	margin: 0px auto;
	display: block;
 }



/***********SELECT2**********/

.select2-results ul li {
	display: block !important;
}
.select2-results__option  {
	font-family: Arial !important;
	font-size:12px !important;
	padding: 2px 0 2px 5px !important;
}
.select2-container {
	min-width:150px;
}
.select2-results__options {
	display: block !important;
}
.select2-container--default .select2-selection--single{
	text-align: left;
}
/***********END SELECT2**********/


/*START MultiSelect CSS */
.ui-multiselect { padding:2px 0 2px 4px; text-align:left;overflow:hidden; }
.ui-multiselect span.ui-icon { float:right }
.ui-multiselect-single .ui-multiselect-checkboxes input { position:absolute !important; top: auto !important; left:-9999px; }
.ui-multiselect-single .ui-multiselect-checkboxes label { padding:5px !important }

.ui-multiselect-header { margin-bottom:3px; padding:3px 0 3px 4px }
.ui-multiselect-header ul { font-size:0.9em }
.ui-multiselect-header ul li { float:left; padding:0 10px 0 0 }
.ui-multiselect-header a { text-decoration:none }
.ui-multiselect-header a:hover { text-decoration:underline }
.ui-multiselect-header span.ui-icon { float:left }
.ui-multiselect-header li.ui-multiselect-close { float:right; text-align:right; padding-right:0 }

.ui-multiselect-menu { display:none; padding:3px; position:absolute; z-index:12000; text-align: left }
.ui-multiselect-checkboxes { position:relative /* fixes bug in IE6/7 */; overflow-y:auto }
.ui-multiselect-checkboxes label { cursor:default; display:block; border:1px solid transparent; font-size:1em !important; padding:3px 1px }
.ui-multiselect-checkboxes label input { position:relative; top:1px }
.ui-multiselect-checkboxes li { clear:both; font-size:0.9em !important; }
.ui-multiselect-checkboxes li.ui-multiselect-optgroup-label { text-align:center; font-weight:bold; border-bottom:1px solid }
.ui-multiselect-checkboxes li.ui-multiselect-optgroup-label a { display:block; padding:3px; margin:1px 0; text-decoration:none }

.custom-multiselect .ui-state-default{
	background-color: #FFFFFF !important;
	background-image: none !important;
	height: 27px;
}
.custom-multiselect .ui-corner-all{
	border-radius: 2px;
}

/* remove label borders in IE6 because IE6 does not support transparency */
* html .ui-multiselect-checkboxes label { border:none }


[data-register-extra="1"] {
	visibility:hidden;
}
#login form input[type="submit"][disabled]{
	background-color:#ffffff;
	color:#bdbbb9;
	border:1px solid #dedddc;
	pointer-events:none;
}
.pAbs{
	position: absolute;
}
#macFooter{
	line-height:30px;
}
#macFooter span:first-of-type a{
	color:#60646F;
}

.supportEmailText{
	padding: 5px 0px 5px 0px;
}

@media print{
	.ui-multiselect-menu {display: none;}
}
/* END MultiSelect CSS */



@media (max-width: 767px) {
	.form-bottom { padding-bottom: 25px; }
	form .form-bottom button.btn { margin-bottom: 5px; }
  button { min-width: 50px; min-height: 20px; }

	.reviewResult{
		font-size: 24px;
		text-align: center;
	}
}
@media only screen and (max-width : 839px) {
	.containerWithSlick {
		width: 420px !important;
	}
	#loginAd {
		display:none;
	}
	#loginBrand {
		border-radius: 5px 5px 0px 0px;
	}
	#loginDetails {
		border-radius: 0px 0px 5px 5px;
	}
}
@media print {
	body{
		font-size: 11px;
	}
	.hidePrint{
		display: none;
	}
	.showPrint{
		display: table-row;
	}
	.maxWidthOnPrint{
		width: 100%;
	}
}
.dispNone{
	display: None;
}