@charset "utf-8";
/* CSS Document */

html, body {font: 100% 'PT Sans', Arial, Helvetica, sans-serif;  margin: 0 !important; padding: 0 !important; color: #000; background:#F7F7F7;position: relative;  }
h1, h2, h3, h4, h5, h6 {  margin: 0; padding: 0; }

/* GLOBAL */
#top-bar{ background: #FFF; height:48px;  margin: 0; padding:10px 0; width:100%;   box-shadow: 7px 7px 15px #ccc; text-align: center; position:absolute; top:0; left:0; z-index:10000;}
.logos{  margin: 0 auto; height:48px; }
.logged .logos{ float:right; }
.logos img{  max-height:48px; }
#top-bar.logged #client-logo{ float:left; height:48px;}
#top-bar.logged #logo{ float:right; height:48px; }
#page-container {  position: relative;  min-height: 100vh; margin: 0; padding: 0; }
#content-wrap {	 margin: 0 !important; padding: 0 0 60px 0 !important;     }
.inner-container{ width:1100px; margin: 0 auto; }
.section{  text-align:left;  margin:0; }
.section.login{ padding-top:200px; }
.footer{  background:#333;  text-align:center; height:60px;  width:100%;  position: absolute; bottom: 0; }
.footer p{  color:#FFF; margin: 20px 0 0 0; font-size:1em;  }
.footer a, .footer a:visited{  color:#FFF; text-decoration:none; }

/* LOGIN */
#signin-form{ margin:0 auto 0 auto;  background:#FFF; border:solid 1px #DDDDDD; padding:30px; width: 550px; text-align:left; } 
#signin-form h1{ margin: 0 0 20px 0; padding: 0;  font-size:1.2em; line-height: 120%; text-transform: uppercase; }
#signin-form p{ margin: 0 0 20px 0; padding: 0; font-size:1em; line-height: 120%;}

/* portal */
.logged-nav{ width:100%; margin:0 0 30px 0; padding-top:98px;}
.logged-nav .breadcrumbs{ float:left; font-size:0.86em; padding-top:7px; }
.logged-nav .breadcrumbs, .logged-nav .breadcrumbs a{ color:#000; text-decoration:none; }
.logged-nav .nav{ float:right; margin:0; }
.logged-nav .nav .alerts-box { float:left; margin:0 15px 0 0; width: 40px; height: 24px;   padding: 0; font-size: 2em;  color: inherit; position:relative;}
.logged-nav .nav .alerts-box i{  color: #333; position:absolute; top:-5px; left:0; }
.logged-nav .nav .alerts-box .count{  color: inherit; position:absolute; top:-8px; right:2px; padding-top:2px;  height: 18px;  width: 20px; text-align:center; font-size:0.40em !important;  background-color: #de7139;  border-radius: 50%;  display: inline-block; color:#FFF;}
.logged-nav .nav .alerts-box a { position:absolute; top:0; left:0; width:100%; height:100%; }
.logged-nav .nav .hamburger { float:left; padding: 0;  }
#sidr-right ul li a{ width:100%  !important;  }
#sidr-right ul li a i{ margin:10px 15px 0 5px !important; padding:0; float:left; font-size:2em; width:40px;  }
#sidr-right ul li a span{ float:left;margin:0 0 0 0 !important; padding:0;  }
.response{ padding-top:100px; }
.content{ background:#FFF; border:solid 1px #DDDDDD; padding:20px; width: 100%; text-align:left;  margin-bottom:100px; box-sizing:border-box; } 
.content.left{ width:73% !important; float:left;}
.right-container{ width:25% !important;  float:right;}
.right-container .content{   margin-bottom:20px;  }
.right-container .content .dz-message{ text-align:center; font-size:0.86em; min-height: auto !important;}
.right-container .content  .dropzone{ min-height: auto !important;}
.content .header{ margin:0 0 20px 0;}
.content .header i{ font-size:2.4em; float:left; margin:0 20px 0 0;}
.content .header h2{  float:left; padding-top:5px; }
.content .header p{  float:right; padding:5px 0 0 0 !important; margin:0 !important; line-height:1; }
.content .header p i{  font-size:1em;  margin:0 0 0 0; float:none;}
.content h1, .content h2, .content h3, .content h4, .content h5, .content h6{ margin:0; padding:0; } 
.content h1, .content h2, .content h3, .content h4, .content h5, .content h6{ text-transform:uppercase; font-weight:500; } 
.content h1{ font-size:1.5em;  } 
.content h2{ font-size:1.4em;  } 
.content h3{ font-size:1.3em;  } 
.content h4{ font-size:1.2em;  } 
.content h5{ font-size:1.1em;  } 
.content h6{ font-size:1.0em;  } 
.content p{ font-size:1em;  } 

.table_header, .table_header2{ width:100%; padding:7px 0; text-align:left; background:#fff; box-sizing: border-box;}
.table_header p, .table_header2 p{ color:#333; margin: 0 0 0 0; padding: 1%; font-size:1em; float:left; font-weight:700; }
.table_row, .table_row2{ width:100%;box-sizing: border-box; padding:7px 0;  text-align:left; background:#fff;}
.table_row:nth-child(even), .table_row2:nth-child(even){ background:#f7f7f7;}
.table_row p, .table_row2 p{ color:#000; margin: 0 0 0 0; padding: 0 1%; font-size:1em; float:left;  }
.table_row p .fas, .table_row2 p .fas{ font-size:1.3em; margin:4px 5px 0 0; }
.case_header p, .case_header2 p { margin: 0 0 7px 0; }
.table_header2 p, .table_row2 p{ padding: 0 10px;  box-sizing: border-box;  }

.comment{ width:100%; padding:20px 40px; text-align:left; background:#f7f7f7; box-sizing: border-box; }
.comment.alt{ background:#fff; }
.comment-left{ width:60%; float:left; margin-bottom:20px; }
.comment-left .fas{ font-size:2.5em; float:left; }
.comment-left .author{ font-size:1em; font-weight:bold; padding:7px 0 0 0; margin:0 0 0 20px; float:left; }
.comment-right{ width:40%; margin:0;  float:right; text-align:right;}
.comment-right p.date{ padding:7px 0 0 0; margin:0; ; }
p.p-label { float:left; width:30%; margin-right:10px; text-align:right; }
p.label-text { float:left; width:60%;  }


/*form */
form label{ font-size:1.1em; margin:0 0 20px 0; font-weight:bold;}
form input[type=text], form input[type=number], form textarea, form input[type=password], form select{width:96%; background:#fff; border:2px solid #CCCCCC; padding:10px 1%; outline:none; margin:5px 0 20px 0; position:relative; -webkit-border-radius:5px; -moz-border-radius:5px;font-family:'PT Sans', Arial, Helvetica, sans-serif; font-size:1em; -webkit-transition: border-color .5s ease-in-out; -moz-transition: border-color .5s ease-in-out; -o-transition: border-color .5s ease-in-out;  transition: border-color .5s ease-in-out; }
form input[type=text]:focus, form input[type=number]:focus, form textarea:focus , form input[type=password]:focus, form select:focus {border-color:#de7139; -webkit-transition: border-color .5s ease-in-out; -moz-transition: border-color .5s ease-in-out; -o-transition: border-color .5s ease-in-out;  transition: border-color .5s ease-in-out;}
.button {border:none; background:#de7139; border:0; color:#fff; font-weight:100; text-decoration:none; font-size:1em;   -webkit-appearance: none; text-transform:uppercase; margin:0; padding:10px 25px; text-align:center;  border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px;  float:right;}
.button:hover { cursor:pointer; }
.err p{ color:#990000; margin:0 0 5px 0; }
a.button, a.button:hover { color:#FFF; }
input[type="text"]:disabled, textarea:disabled, select:disabled {
  background: #dddddd;
}
.button.left { float:left; }
.highlight{ background:#f7f7f7; padding:20px; box-sizing: border-box;}

.form-col{ background: #f7f7f7; border:solid 1px #ccc; padding:20px 2%; width:44%; float:left; margin: 0 0 30px 0; }
.form-col.right{ float:right; }
.form-col.full{ width:96%; }
.half{ width:45% !important; float:left; }
.margin-right{ margin-right: 2% !important; }
p.left{float:left; width:auto;}
.form-col label .fas{ font-size:1.5em !important; }

/* TOGGLES */
.switch-label{ width: 40%; float:left; font-weight:bold; font-size:1.1em;}
.switch-label.autowidth{ width: auto; margin-right:1%;}
.switch{ width: 40%; float:left; }
.toggle {position: absolute;  margin-left: -9999px;  visibility: hidden;}
.toggle + label {display: block; position: relative; cursor: pointer; outline: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none;}
input.toggle-round + label {padding: 2px; width: 40px; height: 15px; background-color: #dddddd; -webkit-border-radius: 60px; -moz-border-radius: 60px; -ms-border-radius: 60px; -o-border-radius: 60px; border-radius: 60px;}
input.toggle-round + label:before, input.toggle-round + label:after {display: block; position: absolute; top: 1px; left: 1px; bottom: 1px; content: "";}
input.toggle-round + label:before {right: 1px; background-color: #f1f1f1; -webkit-border-radius: 60px; -moz-border-radius: 60px; -ms-border-radius: 60px; -o-border-radius: 60px; border-radius: 60px; -webkit-transition: background 0.4s; -moz-transition: background 0.4s; -o-transition: background 0.4s;
  transition: background 0.4s;}
input.toggle-round + label:after {width: 18px; background-color: #fff; -webkit-border-radius: 100%; -moz-border-radius: 100%; -ms-border-radius: 100%; -o-border-radius: 100%; border-radius: 100%; -webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.3); -moz-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.3);  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.3); -webkit-transition: margin 0.4s; -moz-transition: margin 0.4s; -o-transition: margin 0.4s; transition: margin 0.4s;}
input.toggle-round:checked + label:before {background-color: #de7139;}
input.toggle-round:checked + label:after {margin-left: 24px;}
.field label{float:right; margin-right: 5px;}

/* spacers, floats, misc */
.spacer_0 {float:none; clear:both; height:0px;}
.spacer_5 {float:none; clear:both; height:5px;}
.spacer_10 {float:none; clear:both; height:10px;}
.spacer_20 {float:none; clear:both; height:20px;}
.spacer_30 {float:none; clear:both; height:30px;}
.spacer_40 {float:none; clear:both; height:40px;}
.spacer_50 {float:none; clear:both; height:50px;}
a{ text-decoration:none; cursor:pointer; color:#de7139; }
a img { border:0; }
.hide{ display:none;}
.web-hide{ display:none !important;}
p{ line-height:130%; }
.darkGrey{ background:#E7E7E7; }
.darkGreen{ background:#de7139; }
.lightGrey{ background:#F7F7F7; }
.fltrt{ float:right; }
.fltlft{ float:left; }
.underline{ border-bottom:solid 1px #CCC; margin-bottom:30px;}
.line{ border-bottom:dotted 1px #CCC; margin-bottom:20px; }
.required{ color:#990000; }
.helper{ font-style:italic; font-weight:normal; font-size:0.86em; }
.margin10left{ margin-left:10px  !important;}
.margin20right{ margin-right:20px  !important;}
.case-active { color:#006600  !important; }
.case-closed { color:#900 !important; }
.case-onhold { color:#FF6600  !important; }

/* Global Device Styles - Upto Ipad Landscape */
@media only screen and (max-width : 1100px) {
	.web-hide{ display:block !important;}
	.mobile-hide{ display:none;}
	.inner-container{ width:92%;}	
	.margin20right{ margin-right:0  !important;}

	/* portal */
	#top-bar{ height:30px !important; text-align:center;}
	#client-logo{ height:24px !important;  float:left !important; margin-right:20px;}
	#logo, .logo{ height:24px !important; float:left !important; margin-right:20px; }
	#logo, .logo.end{ margin-right:0; }
	
	 .logos{  margin: 0 auto !important; height:30px !important; }
	.logged .logos{ float:none; }
	.logos img{  max-height:30px !important; }
	
	.hamburger{ padding:0  !important; margin-top:5px !important;}
	
	#content-wrap {	padding: 0 !important; min-height:auto;  }
	.footer{  position:relative; height:auto; padding:20px 0; }	
	
	.section.login{ padding-top:70px; margin-bottom:20px; }
	#signin-form{ margin:0 auto 0 auto !important;  padding:30px; width: 100% !important; box-sizing: border-box;  } 
	
	.logged-nav{ margin:0 0 20px 0; padding-top:78px }
	.content{ padding:10px;  } 	
	.content.left{ width:100% !important; float:none; box-sizing:border-box; }
	.content .header p{  float:right; padding:20px 0 0 0 !important; margin:0 !important; line-height:1; }
	.right-container{ width:100% !important; float:none; box-sizing:border-box; }
		
	.content .header{ margin:0 0 20px 0;}
	.content .header h2{  width:75%; margin:0; padding:12px 0 0 0;}
	.content h1, .content h2, .content h3, .content h4, .content h5, .content h6{ margin:0; padding:0; } 
	.content h1, .content h2, .content h3, .content h4, .content h5, .content h6{ text-transform:uppercase; font-weight:500;  font-size:1em; } 
	.content p{ font-size:0.86em; } 	
		
	.table_row p{ width:54% !important; padding: 5px 0 5px 2%;  float:left; }
	.table_row p.tableLabel{ font-weight:700;width:34% !important;}
	
	.comment{ width:100%; padding:20px 6%;}
	.comment-left, .comment-right, .form-col  { float:none;width:100%; display:block;margin-bottom:10px; }
	.comment-left .fas{ font-size:1.5em; }
	.comment-left .author{ font-size:0.86em;  }
	.comment-right p.date{font-size:0.86em; text-align:left;  }
	.form-col  { float:none;width:100%; display:block;margin-bottom:10px; box-sizing:border-box; }
	
	.response .button{   -webkit-appearance: none; position:fixed; bottom:0; width:100%; left:0; padding:10px 0; z-index:100000; border-radius:0; -webkit-border-radius:0; -moz-border-radius:0;  font-size:1.2em; }
}