﻿.topBarbase{
	background-color: #ddd;
	position:relative;
	z-index: 1000;
    width:100%;
}
.notificationIconbase{
	text-align: right;
    padding-top: 4px;
    height: 32px;
    border-left: 1px gray solid;
    margin-top: 5px;
    float: right;
    width: 90%;
}
.logOuticonbase {
    text-align: left;
    padding-top: 6px;
    min-height: 30px;
    line-height: 30px;
}

.logoCarrier{
	border-right: 1px #877 solid;
    height: 32px;
    margin: 5px 0px;
    text-align: center;
}
.companyLogo{
	padding-top: 5px;
    float: left;
    width: 25%;
    text-align: -webkit-right;
    text-align:right
	}

.logoCarrier img{
max-width: 120px;
}
.companyLogo img{
max-width: 85px !important;
}
.companyName{
	float: right;
    width: 75%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    border-right: 1px #877 solid;
    min-height: 32px;
    margin: 5px 0px;
    text-align: -webkit-left;
    padding-bottom: 5px;
    padding-top: 8px;
    padding-right: 5px;
    font-size: 12px;
    height: 32px;
    padding-left: 8px;
    cursor:pointer;
}
.scroll{
	width: 80%;
    margin: 5px auto;
    height: 40px;
    border: 1px #877 solid;
    border-radius: 40px;
}

.social-circle {
    width: 25px;
    height: 25px;
    border-radius: 50%;
    padding-top: 0px;
    color: #FFFFFF;
    margin: 0px 3px 0px 3px;
    display: inline-block;
    position: relative;
    cursor: pointer;
    text-align: center;
    font-size: 13px;
    line-height: 25px;
}

.circle-color-alert {
    background-color: red;
}
.circle-color2 {
    background-color: #8ada55;
}
.circle-color1 {
    background-color: #0069b4;
}
.circle-color3 {
    /*background-color: #ff9900;*/
    background-color:#ff756a;
}
.circle-color4 {
    background-color: #999999;
}
.circle-color5 {
    background-color: #2196f3;
}

.alertIconon{
    opacity:1
}
.alertIconoff{
    opacity:0
}
.out{
    cursor: pointer;
    text-align: left;
    font-size: 16px;
}

.out:hover{
    cursor:pointer;
    color:red;
}


.NormalMode{display:block;}
.SearchMode{display:none;}


.notoficationCircle{
	width: 22px;
    height: 22px;
    background-color: #e83232;
    color: white;
    border-radius: 50%;
    text-align: center;
    font-size: 9px;
    position: absolute;
    top: -6px;
    right: -12px;
    line-height: 22px;
    font-weight: 700;
    z-index: 500;
}
.profileImg{
	width: 25px;
	height: 25px;
	background-color:none;
	border-radius: 50%;
	margin-top: 7px;
	display: inline-block;
}
.profileImg img{
	/*width: 45px;
	height: 45px;
	background-color:none;
	border-radius: 50%;*/
    width:30px;
	height:30px;
	background-color:none;
	border-radius: 50%;
}
.logedUser{
	font-size: 12px;
    display:block;
}
.logedName{text-align:right;padding-top: 5px;overflow: hidden;
    text-overflow: ellipsis;
    display:block;
    width: 100%;
    white-space: nowrap;}
.logedDesig{text-align: right;
    overflow: hidden;
    text-overflow: ellipsis;
    display: inline-block;
    width: 100%;
    white-space: nowrap;}


/* Left Side Menu Css  */
.menuDropHolder .panel-group .panel + .panel {
    margin-top: 0px !important;
}

.menuDropHolder .panel-group .panel {
    margin-bottom: 1px;
    border-radius: 0px;
}

.menuDropHolder .panel {
    margin-bottom: 20px;
    background-color: #fbfbfb;
    border: 0px solid transparent;
    border-radius: 4px;
    -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, .05);
    box-shadow: 0 1px 1px rgba(0, 0, 0, .05);
}

.menu-circle {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    color: #FFFFFF;
    margin: 0px 5px 0px 5px;
    font-size: 14px;
    display: inline-block;
    position: relative;
    text-align: center;
    line-height: 30px;
}
.pageTitleholder{
	width: 80%;
	float:left;
	height:50px;
}
.formSearchBase{
	width: 20%;
	float:right;
	height:50px;
	padding-right:20px;
	text-align:right;
}
.dataContainer {
    background-color: #fdfcfc;
    padding:0px 10px;
}






.downLogo{
	text-align: center;
    padding: 12px 0px;
    background-color: #d3eef5;
    position: absolute;
    bottom: 135px;
    width: 100%;
    transition:all 0.4s ease-in-out;
}

.downLogoshifter{
	bottom:45px;
}


/* Body Wrapper Css*/
.bodyWrapper{
	position:relative;
    overflow-x:hidden;
    margin:0 auto;
    width:100%;
}
.leftSideWrapper{
	width: 15.7%;
	height: 100vh;
	background-color:#13abd6;
	float:left;
	position:fixed;
	/*transition: all 0.2s ease-in-out;*/ 
	overflow: hidden;
	margin-left:0%;
}
.FormWrapper{
	width: 84.3%;
	min-height: 100vh;
	background-color:#fbfbfb;
	float: right;
	transition: all 0.2s ease-in-out;
}
.leftSideWrapperClose{
	width:15.7%;
	margin-left: -15.7%;
	
}
.FormWrapperFull{
	width:100%;
	}
.menuDropHolder{
	width: 100%;
	height:auto;
}

.hclose{
	display: none;
}	
.Headertoggle{
	display:none;
	width: 25px;
	height: 25px;
	text-align: center;
	line-height: 25px;
	color:#fff;
	background-color: #bbc1c1;
	vertical-align: -webkit-baseline-middle;
	cursor: pointer;
}

.captionBar {
    height: 50px;
    background-color: gray;
    position: fixed;
    width: 83.6%;
    z-index: 900;
    transition: all 0.2s ease-in-out; 
}
.PageTitle{
	margin-left: 30px;
    padding-top: 12px;
    color: #fff;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 18px;
	}

 .panelSearch{
 	width: 35px;
    height: 35px;
    background-color: silver;
    text-align: -webkit-center;
    line-height: 35px !important;
    color: white;
    margin-top: 7px;
    cursor: pointer;
    transition: all 0.2s ease-in-out; 
 } 

 .panelSearch:hover{
 	background-color: orange;
 }  

 .captionBarfull {
    height: 50px;
    background-color: gray;
    position: fixed;
    width: 100%;
    z-index: 900;
    transition: all 0.2s ease-in-out;
}

.formborder {
    border: 1px solid #c0bebe;
    border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    padding: 10px 10px 20px 10px;
    margin-top: 15px;
    margin-bottom: 100px;
    min-height: 180px;
}

.microPH{
        cursor: pointer;
    width: 50px;
    height: 50px;
    text-align: -webkit-center;
    line-height: 50px!important;
    background-color: #a9a9a99c;
    border-radius: 50%;
}

.mCSB_inside > .mCSB_container {
    margin-right: 5px;
}


.minbartop {
    background-image:none !important; 
    background-size: 100% 100%;
    float: left !important;
    display: block !important;
    height: 46px !important;
    width: 35px !important;
    margin-left: -1.0% !important;
    background-color: orange !important;
    text-align: -webkit-center !important;
    line-height: 46px !important;
    color: #fff !important;
    font-size: large !important;
}

.theme-config{top:48px;}
.row.formhead .col-sm-4.iconmargin.text-center {width: 20%;text-align:right;}

.headbar a:hover,.headbar a:focus {
    color: #fff;
    text-decoration:none;
}
.sliderHack{background-image:none !important;height:auto!important}


.accordion .panel {
    margin-bottom: 0px;
    border-radius: 0;
    border-bottom: 1px solid #efefef;
}

.panel-group .panel+.panel {
    margin-top: 0px;
}

.btn-icon-search, .btn-icon {
    font-size: 12px;
   
}

/*For Layout test Only Start */
/*if the client need to stratch the page on full screen remove this section*/

/*.bodyWrapper{max-width:1366px;position:relative;overflow-x:hidden;margin:0 auto;}
.leftSideWrapper{width: 228px;float: left;background-color: aliceblue;position: fixed;z-index: 500;height: 100vh;margin-left: 0%;margin-top:44px;transition: all 0.2s ease-in-out;}
.FormWrapper{width: 1137px;float: right;background-color: #fff;min-height: 100vh;margin-left: 0px;transition: all 0.2s ease-in-out;margin-top:44px;}
.topBarbase {background-color: #ddd;position: fixed;z-index: 1000;width:1366px;}
.captionBar {height: 50px;background-color: gray;position: fixed;width:1105px;z-index: 900;transition: all 0.2s ease-in-out;}
.leftSideWrapperClose{width:200px;margin-left:-200px;position:absolute;}
.FormWrapperFull{width:100%;background-color:#fff;min-height:100vh;margin-left:0%;transition:all 0.2s ease-in-out}
.captionBarfull{height: 50px;background-color: gray;position: fixed;width: 1352px;z-index: 900;transition: all 0.2s ease-in-out;}*/






    .pageyScroll{overflow-y:hidden;}
    .bodyWrapper{width:100%;}
    .leftSideWrapper{width:16.5%;float:left;background-color:aliceblue;position:fixed;z-index:500;height:100vh;margin-left:0%;margin-top:44px;transition:all 0.2s ease-in-out;}
    .FormWrapper{width:83.5%;float:left;background-color:#fff;min-height:100vh;margin-left:16.5%;transition:all 0.2s ease-in-out;margin-top:44px}
    .leftSideWrapperClose{width:16.5%;margin-left:-16.5%;position:fixed;transition:all 0.2s ease-in-out;}
    .FormWrapperFull{width:100%;float:left;background-color:#fff;min-height:100vh;margin-left:0%;transition:all 0.2s ease-in-out}
    .topBarbase {background-color: #ddd;position:fixed;z-index: 1000;width: 100%;}
    .captionBar {height: 50px;background-color: gray;position: fixed;width: 83.6%;z-index: 900;transition: all 0.2s ease-in-out;}
    .captionBarfull{height: 50px;background-color: gray;position: fixed;width:100%;z-index: 900;transition: all 0.2s ease-in-out;}



@media (max-width:1366px) {
.minbartop {margin-left: -1.8% !important;}
}


@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation:landscape) {
 	.logoCarrier {
    border-right: 1px #877 solid;
    height: 35px;
    margin: 5px 0px;
    text-align: center;
}

.companyLogo {
    padding-top: 5px;
    float: left;
    width: 40%;
}

.companyName {
    float: right;
    width: 60%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    border-right: 1px #877 solid;
    min-height: 32px;
    margin: 5px 0px;
    text-align: -webkit-left;
    padding-bottom: 5px;
    padding-top: 10px;
    padding-right: 5px;
    font-size: 12px;
    height: 35px;
    padding-left: 8px;
}


.social-circle {
    width: 25px;
    height: 25px;
    border-radius: 50%;
    padding-top: 0px;
    color: #FFFFFF;
    margin: 0px 5px 0px 5px;
    font-size: medium;
    display: inline-block;
    position: relative;
}

.logoCarrier img {
    max-width: 125px;
}

.scroll {
    width: 80%;
    margin: 5px auto;
    height: 35px;
    border: 1px #877 solid;
    border-radius: 40px;
}

.profileImg {
    width: 35px;
    height: 35px;
    border-radius: 50%;
    margin-top: 5px;
    display: inline-block;
}

.profileImg img {
    width: 35px;
    height: 35px;
    border-radius: 50%;
}

.headbar {
    padding-left: 15px !important;
}


.leftSideWrapper{
	width: 20%;
	height: 100vh;
	margin-left:0%;
}
.FormWrapper{
	width: 80%;
	min-height: 100vh;
}
.leftSideWrapperClose{
	width:20%;
	margin-left: -20%;
}
.FormWrapperFull{
	width:100%;
}


/*For Layout test Only Start */
   .leftSideWrapper{width:25%;float:left;background-color:aliceblue;position:fixed;z-index:500;height:100vh;transition:all 0.2s ease-in-out;margin-left:0%;margin-top:45px}
   .FormWrapper{width:75%;float:left;background-color:#ffffff;min-height:100vh;margin-left:25%;transition:all 0.2s ease-in-out;margin-top:45px}
   .leftSideWrapperClose{width:25%;margin-left:-25%}
   .FormWrapperFull{width:100%;float:left;background-color:#ffffff;min-height:100vh;margin-left:0%;transition:all 0.2s ease-in-out}
/*For Layout test Only End */

.headbar {padding-left: 0px !important;}
.theme-config{top:50px;}
.out{cursor: pointer;text-align:-webkit-center;}
.minbartop {margin-left: 0.2% !important;}
}



@media only screen and (max-width: 768px) {
	
   .Headertoggle{display: inline-block;}
   .headbar{padding-left:0px !important;}


.captionBar {
    height: 50px;
    background-color: gray;
    position: fixed;
    width: 100%;
    z-index: 900;
    transition: all 0.2s ease-in-out;
}

.social-circle {
    width: 25px;
    height: 25px;
    text-align: -webkit-center;
}

.leftSideWrapperClose{
	width:60%;
	margin-left:0%;
}
.FormWrapperFull{
	width:100%;
	margin-left:60%;
    float:inherit; 
	}




.companyLogo {
    padding-top: 5px;
    float: left;
    width: 50%;
    text-align: -webkit-right;
}

.companyName {
    float: right;
    width: 50%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    border-right: 0px #877 solid;
    min-height: 32px;
    margin: 0px 0px;
    text-align: -webkit-left;
    padding-bottom: 5px;
    padding-top: 20px;
    padding-right: 5px;
    font-size: 12px;
    height: 41px;
    padding-left: 8px;
}

#holder{
	   padding-bottom: 10px;
	}

.hopen{
	display: block;
}

/* ----------------------------------------- Old Layout Modified Start------------------------------------------*/

.headbar {
    padding-left: 0px !important;
}	
/* ----------------------------------------- Old Layout Modified End------------------------------------------*/

.profileImg {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    margin-bottom: 3px;
    display: inline-block;
}


/*For Layout test Only Start */
.leftSideWrapper{width:80%;margin-left:-80%;position:fixed}
.FormWrapper{width:100%;float:left;min-height:100vh;margin-left:0%;transition:all 0.2s ease-in-out}
.leftSideWrapperClose{width:80%;margin-left:0%;overflow-y:scroll;position:fixed;margin-top:44px}
.FormWrapperFull{width:100%;float:inherit;min-height:100vh;margin-left:80%;transition:all 0.2s ease-in-out}
/*For Layout test Only End */

  .logedUser{display:none}
  .notificationIconbase {text-align:center;}
  .companyName,{border:none}
  .Headertoggle{display:none;}
  .theme-config{top:48px;}
  .out{cursor: pointer;text-align: -webkit-right;}

  .btn-icon-search, .btn-icon {font-size: 11px;}

  .minbartop{margin-left: 0.2% !important;}
}

@media only screen and (max-width: 414px){
    .Headertoggle{display:inline-block;}
    .logoCarrier {
    border-right: 0px #877 solid;
    height: 41px;
    margin: 5px 0px;
    text-align: -webkit-center;
}
.logedUser{display:block}
.notificationIconbase {
    text-align: -webkit-center;
    padding-top: 10px;
    border-left:0px;
}
.FormWrapper{margin-top:40px}
/* ----------------------------------------- Old Layout Modified Start------------------------------------------*/
.headbar {
    padding-left: 0px !important;
}
.formhead h1 {
    display: inline-block !important;
    width: 80% !important;
    font-size: 14px !important;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}

.row.formhead .col-sm-4.iconmargin.text-center {
    text-align: -webkit-left;
}
/* ----------------------------------------- Old Layout Modified End------------------------------------------*/
#topminimize {display: block;}
.theme-config {display: none;}
.out {cursor: pointer;text-align: -webkit-left;}
}



.screenresizer{
	width: 35px;
    height: 50px;
    position: fixed;
    top: 51px;
    background-color: #FFC107;
    z-index: 1000;
    cursor: pointer;
    text-align: center;
    line-height: 51px;
    font-size: 16px;
    color: #fff;
}

/* Down menu */
.downMenuHolder{
	width: 100%;
    position: fixed;
    bottom: 0;
    z-index: 5000;
}
.keying{
	width: 50px;
	height: 25px;
	background-color: red;
	cursor: pointer;
	position: absolute;
	top: -25px;
	right: 10px;
	text-align: center;
	color:#fff;
    padding-top:4px;
}

.keyingSearch{
	width: 30px;
    height: 25px;
    background-color: #FF9800;
    cursor: pointer;
    position: absolute;
    top: 0px;
    left: -30px;
    text-align: center;
    color: #fff;
    padding-top: 4px;
}


.menuItemHolder{
  height:75px;
  background: rgb(38, 81, 109);
  transition: all 0.2s ease-in-out;
  overflow: hidden;
}




.searchHolderopen{
	right:0px !important;
}

.menuItemHoldercol{
	height:0px;
}

/* Slider */

.slick-prev:before {
    content: '<';
}

.slick-next:before {
    content: '>';
}

.slick-prev:before, .slick-next:before {
    font-family: 'slick';
    font-size: 20px;
    line-height: 1;
    opacity: .75;
    color: white;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.slick-prev {
    left: -35px;
}

.slick-prev:before, .slick-next:before {
    font-family: 'slick';
    font-size: 20px;
    line-height: 1.3;
    opacity: .75;
    color: white;
    -webkit-font-smoothing: antialiased;
    width: 30px;
    height: 30px;
    background-color: red;
    border-radius: 50%;
    display: inline-block;
    -moz-osx-font-smoothing: grayscale;
}


.menubox{
	width: 100px;
	height: 100px;
	background-color: lightblue;
}

.displayWidth{width:80%;margin: 0  auto}

@media only screen and (max-width: 900px) {
	.displayWidth{width:60%;margin: 0  auto}
	}


.mCSB_scrollTools {
    position: absolute;
    width: 5px;
    height: auto;
    left: auto;
    top: 0;
    right: 0;
    bottom: 0;
}

.mCSB_inside > .mCSB_container {
    margin-right: 0px;
}
.slick-slide{
    width: 102px;
    height: 99px;
    text-align: -webkit-center;
    background-color: #2196f345;
    border-right: 1px white solid;
    padding-top:0px;
}
.slick-slide a{color:white}


#leftmenu h4 {
    font-weight: normal !important;
    font-size: 15px !important;
    margin-bottom: 0px !important;
    display: inline-block;
    padding: 8px 5px;
    background-color: slategray;
    width: 100%;
    color: #fff;
}

.Quicksearch{
    width: 350px;
    height: 100px;
    position: absolute;
    background-color: #cccccc;
    right: -350px;
    top: 130px;
    transition: all 0.2s ease-in;
    z-index: 3000;
}

.quickSearchformHolder{
    width: 80%;
    margin:10px auto;
    color:#fff;
}

.activeDownmenu{
    background-color: #00BCD4;
}

.minbartop {
    background-image:none !important; 
    background-size: 100% 100%;
    float: left;
    display: block;
    height: 46px;
    width: 35px;
    margin-left: -1%;
    background-color: orange;
    text-align: -webkit-center;
    line-height: 46px;
    color: #fff;
    font-size: large;
    text-align:center;
}

.midnav-hide-button {
    background-color: #60dac8 !important;
    position: absolute;
    padding: 5px 20px 0px 20px !important;
    border-radius: 0px !important;
    font-size: 16px;
    margin-top: -28px!important;
    color: #fff;
    cursor: pointer;
    z-index: -1 !important;
    right: 60px;
}

.fixed-buttonbar {
    background-color: #26516d !important;
}
.midnav li a.active {
    background: #366aad !important;
    height: 100px;
}
.midnav li a {
    border-right: 1px solid #a7a7a7;
    height: 90px;
}
.owl-carousel .owl-wrapper-outer {
    background-color: #2196f345;
}

.accordion .panel {
    margin-bottom: 1px !important;
    border-radius: 0;
    border-bottom: 0px solid #efefef;
}  

.accordion .panel-heading {
    background: none;
    padding: 8px 15px !important;
}
	


.skin-1 .navbar {background-color: #188809 !important;}
.skin-1 .owl-carousel .owl-wrapper-outer {background-color: #43a9746b !important;}
.skin-1 .downLogo {background-color: #9ef3b3;}
.skin-1 .midnav-hide-button {background-color: #60dac8 !important;}

.skin-2 .owl-carousel .owl-wrapper-outer {background-color: #bb652b45;}
.skin-2 .downLogo {background-color: #e2c6a1;}
.skin-2 .midnav-hide-button {background-color: #60dac8 !important;}

.skin-3 .minbartop {background-color: #70193d!important}
.skin-3 .owl-carousel .owl-wrapper-outer {background-color: #ce8ea875;}
.skin-3 .downLogo {background-color: #fbbdd7;}
.skin-3 .midnav-hide-button {background-color: #60dac8 !important;}

.skin-4 .minbartop {background-color: slategrey !important;}
.skin-4 .owl-carousel .owl-wrapper-outer {background-color: #01172945;}
.skin-4 .midnav li a.active {background: #92b4ce82 !important;}
.skin-4 .midnav-hide-button {background-color: #60dac8 !important;}

/*Dash Board Hack*/
.right_col_align {
    width: 98% !important;
    margin: 5px auto !important;
    text-align: center;
}

.famenu {
    color: #254271;
    margin: 0 5px 0 0px !important;
    
}

.welcome-page-background {
    background: url(../images/welcomepage.png) 0 0;
    background-size: cover !important;
    min-height: 100vh;
}


/*Over Riding Css*/
.accordion-inner {
    padding: 0px !important;
    background-color: #fff;
    max-height: 300px;
    overflow-y: auto;
    overflow-x: hidden;
    width: 95%;
    margin: 0px auto;
}

.accordion-body{
    background-color: rgba(177, 194, 210, 0.39);
    padding-top: 5px;
    padding-bottom: 5px;
}
.accordion-inner h4 {
    margin: 0px 0 0px 0px !important;
}

.accordion-inner ul li a {
    padding-left: 10px !important;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    display: inline-block;
}

.accordion-inner ul li {
    padding: 5px !important;
}

.accordion-group {
    border-bottom: 1px solid #cccccc !important;
}

#btnSearchCI{
	display: inline;
    margin-top: 15px;
    padding: 3px 10px;
}

.handsontable.listbox tr td.current, .handsontable.listbox tr:hover td {
    background: #2196f3 !important;
    color: #fff !important;
}