﻿*
{
	margin:0px;
	padding:0px;
	border:0px;
	font-family: 'Roboto', sans-serif, Arial;
	font-size:1em;
    line-height:1.3;
}
body{background:#F6F6F6}

/* Theme Colors */
.themeDarkBg{background-color:#222a35}
.themeBlueBg{background-color:#0073aa}
.themeClrWhite{color:#fff}
.themeClrBlue{color:#2d318a}
.themeClrPrime{color:#666645}
.themeClrSec{color:#666645}
.bgGray{background:#f7f7f7}

.clrGreen{color:#139a32}
.clrRed{color:#c31515}
.themewhiteBg{background-color:#fff}
/*#sidebar{width:180px;position:fixed}*/
#content{width:100%}

::-webkit-scrollbar {
  width: 5px;
}
::-webkit-scrollbar-track {
    background: #333;
}

header {display: flex;position: fixed;width: 100%;height: 70px;background: #222a35;color: #fff;justify-content: center;align-items: center;-webkit-tap-highlight-color: rgba(0,0,0,0); font-weight:bold; z-index:999 }
#nav-container {position: fixed;height: 100vh;width: 100%;pointer-events: none; z-index:9999}
#nav-container .bg {position: absolute;top: 70px;left: 0;width: 100%;height: calc(100% - 70px);visibility: hidden;opacity: 0;transition: .3s;background: #000;}
#nav-container:focus-within .bg {visibility: visible;opacity: .6;}
#nav-container * {visibility: visible;}
.button {position: relative;display: flex;flex-direction: column;justify-content: center;z-index: 1;-webkit-appearance: none;border: 0;background: transparent;border-radius: 0;height: 70px;width: 30px;cursor: pointer;pointer-events: auto;margin-left: 25px;touch-action: manipulation;  -webkit-tap-highlight-color: rgba(0,0,0,0);}
.icon-bar {display: block;width: 100%;height: 3px;background: #fff;transition: .3s;}
.icon-bar + .icon-bar {margin-top: 5px;}
#nav-container:focus-within .button {pointer-events: none; cursor: pointer;}
#nav-container:focus-within .icon-bar:nth-of-type(1) {transform: translate3d(0,8px,0) rotate(45deg);}
#nav-container:focus-within .icon-bar:nth-of-type(2) {opacity: 0;}
#nav-container:focus-within .icon-bar:nth-of-type(3) {transform: translate3d(0,-8px,0) rotate(-45deg);}
#nav-content {margin-top: 70px;padding: 20px;width: 90%;max-width: 300px;position: absolute;top: 0;left: 0;height: calc(100% - 70px); overflow-y:scroll; background: #222a35;pointer-events: auto;-webkit-tap-highlight-color: rgba(0,0,0,0);transform: translateX(-100%); transition: transform .3s;  will-change: transform; contain: paint;}

/*#nav-content ul {height: 100%;display: flex;flex-direction: column;}
#nav-content li a {padding: 10px 5px;display: block;text-transform: uppercase;text-decoration:none; color:#fff; transition: color .1s;}*/
#nav-content li .dash{background-image:url(../images/icons/dashboard.png);background-repeat:no-repeat;background-position:10px center; padding-left:40px}
#nav-content li .master{background-image:url(../images/icons/masters.png);background-repeat:no-repeat;background-position:10px center; padding-left:40px}
#nav-content li .trx{background-image:url(../images/icons/transaction.png);background-repeat:no-repeat;background-position:10px center; padding-left:40px}
#nav-content li .other{background-image:url(../images/icons/other.png);background-repeat:no-repeat;background-position:10px center; padding-left:40px}
#nav-content li .tools{background-image:url(../images/icons/tools.png);background-repeat:no-repeat;background-position:10px center; padding-left:40px}
#nav-content li .config{background-image:url(../images/icons/config.png);background-repeat:no-repeat;background-position:10px center; padding-left:40px}
#nav-content li .reps{background-image:url(../images/icons/reps.png);background-repeat:no-repeat;background-position:10px center; padding-left:40px}
#nav-content li .logout{background-image:url(../images/icons/logout.png);background-repeat:no-repeat;background-position:10px center; padding-left:40px}
/*#nav-content li a.enq{background-image:url(../images/icons/enq.png);background-repeat:no-repeat;background-position:10px center; padding-left:40px}
#nav-content li a.portfol{background-image:url(../images/icons/portfolio.png);background-repeat:no-repeat;background-position:10px center; padding-left:40px}
#nav-content li a.career{background-image:url(../images/icons/resume.png);background-repeat:no-repeat;background-position:10px center; padding-left:40px}
#nav-content li a.testimonials{background-image:url(../images/icons/testimonials.png);background-repeat:no-repeat;background-position:10px center; padding-left:40px}
#nav-content li a.email{background-image:url(../images/icons/draft.png);background-repeat:no-repeat;background-position:10px center; padding-left:40px}
#nav-content li a.logout{background-image:url(../images/icons/logout.png);background-repeat:no-repeat;background-position:10px center; padding-left:40px}
#nav-content li a:hover {color: #555;}
#nav-content li.small{margin-top: auto; margin-bottom:30px; color:#fff!important  }
#nav-content li.small a{color:#fff !important  }
#nav-content li ul{margin-left:30px}
#nav-content li ul li{font-size:0.9em; }
#nav-content li ul li  a{color:#f2f2f2}*/
ul{list-style:none}

#nav-container:focus-within #nav-content {transform: none;}



.formPanel{background-color:#fff;border:solid 1px #e5e5e5;width:99%}
.titleLine{margin-bottom:0.6em;height:1px;background:#e5e5e5;display:block;width:100%}
.formTitle{color:#ffffff;padding:0.7em; font-weight:700 }


.col_50p{width:50%; float:left}
.box_200{height:300px; width:300px; float:left; display:table; text-align:center}
.neo-box{height:280px; width:280px; border-radius:4px; background-color:#ffffff;box-shadow: 9px 9px 16px rgb(163,177,198,0.6), -9px -9px 16px  rgba(255,255,255, 0.5); display:table-cell; vertical-align:middle}
/*=================================================Login Page============================*/
#logWrap{width:400px; margin:0 auto; background:#fff; border-radius:10px;}
#otpConfirm{width:400px; margin:0 auto; background:#fff; border-radius:10px;}
.logBox{border: 1px solid #888888; border-radius:10px; padding: 10px; -webkit-box-shadow: 10px 10px 14px -3px rgba(255,255,255,0.31);
-moz-box-shadow: 10px 10px 14px -3px rgba(255,255,255,0.31);
box-shadow: 10px 10px 14px -3px rgba(255,255,255,0.31); }
        
.captionLogin{display:block;color:#555;font-family:Tahoma, Arial;font-size:1.2em;}
.textBoxLogin{padding:0.6em; border:none; border-bottom:1px solid #585858; border-radius:5px; display:block; resize:none; width:97% ; font-size:0.9em;  color:#585858 }
.buttonFormLogin{background-color:#222a35; color:#fff; font-size:1.2em; padding:10px 15px; border-radius:5px; cursor:pointer; }
.buttonFormLogin:hover{background:#404041}

.buttonFormResend{background-color:#222a35; color:#fff; font-size:0.9em; padding:8px 12px; border-radius:5px; cursor:pointer; }
/*.assignHeadAnch{background-color:#22A78C; color:#fff; font-size:0.8em; padding:6px 10px; text-decoration:none; border-radius:5px;}*/
.assignHeadAnch{display:block; text-decoration:none; background:url(../images/icons/tick-gray.png) no-repeat center center; height:32px; width:32px }

.headAnch{background-color:#2d318a; color:#fff; font-size:1em; padding:6px 10px; cursor:pointer; text-decoration:none}
.headGenderImg{height:18px; width:18px}
.logotxt{width:400px}

#siteCredit{position:fixed; bottom:0; background:#333; width:100%; text-align:center}
#siteCredit span{color:#fff}
#siteCredit a{color:#22A78C; text-decoration:none}

#loginBg{background:#ffffff; background-attachment:fixed; background-size:cover}

#userStatus{position:absolute; top:25px; right:20px}
#userStatus div{min-width:100px; text-align:center; border:3px solid #FFF; padding:5px; border-radius:25px}


.popList{position:absolute; background:#fff; box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px; width:100%; max-width:400px }
.popList li{display:block; list-style:none;background:linear-gradient(#fff, #f2f2f2); padding:8px 12px; cursor:pointer  }
.popList li a{display:block; text-decoration:none; color:#555;  }
.popList li:hover{background:#afdbad; color:#000}

#wrStatus{padding:5px; font-size:0.9em; font-weight:600}
.wrStFR{background:url(../images/icons/wGreen.png) no-repeat left center; padding-left:24px; color:#555}
.wrStPR{background:url(../images/icons/wYellow.png) no-repeat left center; padding-left:24px; color:#555}
.wrStNil{background:url(../images/icons/wRed.png) no-repeat left center; padding-left:24px; color:#555}
.wrStUS{background:url(../images/icons/wBlue.png) no-repeat left center; padding-left:24px; color:#555}


.wbStatusBlue{ background-color:#1e3beb; border-radius:50%; display:block; height:20px; width:20px }
.wbStatusYellow{background-color:#ed9c0c; border-radius:50%; display:block; height:20px; width:20px}
.wbStatusGreen{background-color:#222a35; border-radius:50%; display:block; height:20px; width:20px}

.formTable{max-width:600px; border-collapse: collapse;}
.formTable td, th {border: 1px solid #dddddd;text-align: left;	padding: 8px;}
.formTable th{background:#ccc}
.hrScroll{width:100%}



/*====================== Accordion Menu ===========================*/

.accordion {width: 100%;max-width: 360px;margin: 0px auto 0px;-webkit-border-radius: 4px;-moz-border-radius: 4px;border-radius: 4px;}
.accordion .link {cursor: pointer;display: block; text-transform: uppercase; text-decoration:none; padding: 15px 15px 15px 42px;color: #fff;font-size: 14px;font-weight: 700;border-bottom: 1px solid #CCC;position: relative;-webkit-transition: all 0.4s ease;-o-transition: all 0.4s ease;transition: all 0.4s ease;}
.accordion li:last-child .link {border-bottom: 0;}
.accordion li.open .link {color: #fff;}
/*.accordion li a, .accordion li div.link {display: block;text-transform: uppercase;text-decoration: none;color: #fff;transition: color .1s;}*/

.accordion li .link:hover{color: #555;}
 /*=================== Submenu ===============*/
.submenu {display: none;font-size: 14px;}
.submenu li {border-bottom: 1px solid #4b4a5e;}
.submenu a {display: block;text-decoration: none;color: #d9d9d9;padding: 12px;padding-left: 42px;-webkit-transition: all 0.25s ease;-o-transition: all 0.25s ease;transition: all 0.25s ease;}




ul.tabs {margin: 0;padding: 0;float: left;list-style: none;height: 32px;border-bottom: 1px solid #333;width: 100%;}
ul.tabs li {float: left;margin: 0;cursor: pointer;padding: 0px 21px;height: 31px;line-height: 31px;border-top: 1px solid #333;border-left: 1px solid #333;border-bottom: 1px solid #333;background-color: #333;color: #ccc;overflow: hidden;position: relative;}
.tab_last {border-right: 1px solid #333;}
ul.tabs li:hover {background-color: #ccc;color: #333;}
ul.tabs li.active {background-color: #fff;color: #333;border-bottom: 1px solid #fff;display: block; font-weight:600 }
.tab_container {border: 1px solid #333;border-top: none;clear: both;float: left;width: 100%;background: #fff;overflow: auto;}
.tab_content {padding: 20px;display: none;}
.tab_drawer_heading {display: none;}


#brandImage{}
#resendNote{color:red; font-size:0.9em}

#menuBranding{width:150px; position:absolute; bottom:50px; left:calc(50%-75px)}
#menuBranding img{width:100%}

#masterBranding{width:80px; position:fixed; top:10px; right:10px; z-index:999;}
#masterBranding img{width:100%}
#respBranding{width:150px;}
#respBranding img{width:100%}

/* ===================== Media Queries Starts here ==================== */
@media screen and (max-width: 1140px) {
    .col_50p{width:100%; float:none}
}
@media screen and (max-width: 800px) 
{
    .scroll{overflow-x: scroll; overflow-y: hidden;}
    .extra_float{clear:both;}
    .w50{width:100%}
    .hrScroll{overflow-y:scroll}
 }

@media screen and (max-width: 768px) 
{
    .logotxt{width:100%}
    #logWrap{width:95%}
    #brandImage{ display:none }
    
}
@media screen and (max-width: 640px) 
{
    .box_200{height:auto; width:100%; float:none; display:block; }
    .neo-box{height: auto ;display:block; width:100%}
    .resp-padding{padding:20px}
    .formTable{width:600px}
    
}
@media screen and (max-width: 480px) 
{
    .logo{width:100px; height:auto}
    .tabs {display: none;}
    .tab_drawer_heading {background-color: #ccc;color: #fff;border-top: 1px solid #333;margin: 0;padding: 5px 20px;display: block;cursor: pointer;-webkit-touch-callout: none;-webkit-user-select: none;-khtml-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;}
    .d_active {background-color: #666;color: #fff;}
}
