﻿body {
}
/********************** Login CSS **************************/
#login{ padding:110px 0 0 0;}
#login .panel{ max-width:376px; margin:0 auto; height:auto;  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.09); border-radius:0; border:0px solid #e5e8ed;}
#login .panelNote { max-width: 376px;margin: 0 auto;height: auto;box-shadow: none;background-color: transparent;border-radius: 0;border: 0px;font-size: 12px;}

.loginform{ padding:0px 10px 16px 10px;}
.loginform .form-control{ width:100%; *width:94%; *padding:0px 6px;}
.login-panel{ background:#FFF;}
.login-panel .panel-heading{ max-height:100px; height:100%; padding:0px; position:relative; border-bottom:4px solid #ccc;}
.login-panel .panel-heading .logo{text-align:left;}
.login-panel .panel-heading .key{ position:absolute; right:12px; top:17px;}

#login label {font-weight: normal; font-size:13px; color:#333;}

#login .btn{text-transform:uppercase;}
.loginfooter{ padding:5px 0px; text-align:center; font-size:13px; bottom: 0px; color: #fff; width: 100%;position: absolute;}

/***Naviation***/

#header{ background:#fff; height:74px; position:fixed; z-index:10000; min-width:320px; width:100%; 
-webkit-box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.20); -moz-box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.20); box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.20); }

.navhd{ float:left;}
.logo{ padding:0px; margin:0; float:left; width:220px; text-align:center; height:72px; overflow:hidden; }
.logo img{ max-width:100%; height:auto; padding:8px 10px 10px 10px;}

.navbarlink{float:right; width:62px; height:74px;border-left:1px solid #dddddd;}
.navbarlink a{ width:61px; height:74px; background:url(images/navbarlink.png) center center no-repeat; display:block;}
.navbarlink a:hover{ background:#bdb4af url(images/navbarlink.png) center center no-repeat;}

.navbar-right{margin:0;}
.top-nav{ padding:0;}
.top-nav > li {display: inline-block; float:left;}
.top-nav li a{border-left:1px solid #dddddd; height:74px; padding:0; line-height:74px; z-index:10000; }
.top-nav > li > a:hover, .top-nav > li > a:focus, .top-nav > .open > a, .top-nav > .open > a:hover, .top-nav > .open > a:focus { background-color:#fff; border:none; border-left:1px solid #dddddd; }
.top-nav > li > a:hover{z-index:100;}
.top-nav > .open > a:focus, .top-nav > .open > a:hover, .top-nav > .open > a:visited{ z-index:10000;}


.top-nav li a.company, .top-nav li a.msg, .top-nav li a.bell{ width:64px; text-align:center;}
.top-nav li a.company{ background:url(images/ic-company.png) no-repeat center;}
.top-nav li a.msg{ background:url(images/ic-mail.png) no-repeat center;}
.top-nav li a.bell{ background:url(images/ic-bell.png) no-repeat center;}
.top-nav li a .bedge{ background:#f36427; border:none; font-size:9px; color:#fff; position:absolute; padding:0px 2px; min-width:16px; height:16px; border-radius:50%;  
-webkit-border-radius:50%; -moz-border-radius:50%; text-align:center; line-height:15px; right:12px; top:14px; font-family: 'OpenSansSemibold'; font-weight:normal;
-webkit-box-shadow: 1px 1px 1px rgba(255, 255, 255, 1); -moz-box-shadow: 1px 1px 1px rgba(255, 255, 255, 1); box-shadow: 1px 1px 1px rgba(255, 255, 255, 1);}

.top-nav a.user{ padding:0px 15px; font-size:12px;  color:#7c7c7c;}
.top-nav a.user:hover, .top-nav a.user:focus{color:#7c7c7c;}
.top-nav a span.user-img{ width:38px; height:40px; border:1px solid #d6d6d6; margin:14px 10px 0px 0; float:left; padding:0; border-radius:50%; }
.top-nav a span.user-img img{ vertical-align:top; border-radius:50%;}
.drpar{ padding-left:10px; vertical-align:1px;}

.top-nav li .dropdown-menu{border:none; background-color:#fff; border-top:1px solid #dddddd;  margin:-1px 0 0 0; padding:0; border-radius:0;
/* max-height:300px; overflow:hidden;*/
 box-shadow:0px 3px 4px rgba(0, 0, 0, 0.12); -webkit-box-shadow:0px 3px 4px rgba(0, 0, 0, 0.12); 
-ms-box-shadow:0px 3px 4px rgba(0, 0, 0, 0.12); -moz-box-shadow:0px 3px 4px rgba(0, 0, 0, 0.12); }
.top-nav li .dropdown-menu li a{ border-left:none; height:auto ; line-height:100% ; white-space:inherit;}


.message-dropdown{ min-width:400px;}
.message-dropdown li{ border-top:1px solid #ebebeb;}
.message-dropdown li:first-child{ border:none;}
.message-dropdown li a{padding:10px 10px !important; color:#666666; font-size:13px !important; display:block; text-decoration:none;}
.message-dropdown li a:hover{text-decoration:none;}
.message-dropdown li .hd { position:relative; padding-bottom:6px;}
.message-dropdown li .hd b{display:inline-block; width:230px; overflow:hidden; font-family: "OpenSansSemibold"; font-weight:normal; font-size:13px; 
white-space: nowrap; line-height:16px; text-overflow:ellipsis;}
.message-dropdown li .hd span{font-size:11px; font-family:"OpenSansRegular"; color:#7e7e7e; position:absolute; right:0; top:1px;}
.message-dropdown li .data{font-size:12px; font-family:"OpenSansRegular";}
.message-dropdown li a:hover{background-color:#f5f5f5; color:#666666;}

.viewall{color:#097bc3; font-size:13px; text-align:center; /*border-top:1px solid #ebebeb;*/ padding:10px 0px;}

.userdropdown{left:1px !important;}
.userdropdown li a{ padding:10px 10px; color:#666666; font-size:13px;}
.userdropdown li a img{ margin-right:10px ;}
.userdropdown li a.logout{ border-top:1px solid #dfdfdf;}
.userdropdown li a:hover{ background:#f5f5f5; color:#666666;}

.company-dropdown{ padding:8px 0px !important;}
.company-dropdown li a{ height:auto !important; line-height:100% !important; padding:9px 14px; color:#666666; font-size:13px;}
.company-dropdown a:hover{ background:#f5f5f5 !important; color:#666666 !important;; }
.company-dropdown a.active{color:#e26733 !important;}

.alert-dropdown{min-width:400px;}
.alert-dropdown li{ border-top:1px solid #ebebeb; }
.alert-dropdown li p{width:370px; overflow:hidden; white-space: pre-line; text-overflow:ellipsis; line-height:16px;}
.alert-dropdown li:first-child{ border:none;}
.alert-dropdown li a{ padding:10px 10px; color:#666666; font-size:13px; }
.alert-dropdown a:hover{background:#f5f5f5 !important; color:#666666 !important; }
/***Navigation End***/


/****************************** Arrowlistmenu ********************************/
.sidebar{ z-index:9999;  height: 100%; overflow:auto !important; padding: 0 !important; position: fixed; width:40px; color:#FFF; /*left:0;*/
transition: all ease 0.4s; -moz-transition: all ease 0.4s; -webkit-transition: all ease 0.4s;}

.sidebar:hover{width:220px;}

.content-liquid-full{  margin: 0 auto 0 40px;padding: 90px 5px 14px 10px;transition: all ease 0.4s;-moz-transition: all ease 0.4s;-webkit-transition: all ease 0.4s;font-size: 12px;}
body.collapsed-sidebar .content-liquid-full {margin-left:220px;}
body.collapsed-sidebar .sidebar{width:220px;} 
body.collapsed-sidebar .sidebar-menu h3 b, .sidebar:hover .sidebar-menu h3 b{display:inline-block; /* white-space:nowrap; overflow:hidden;*/ margin-left:40px;}
body.collapsed-sidebar .sidebar-menu h3 span, .sidebar:hover .sidebar-menu h3 span{display:inline-block;}
body.collapsed-sidebar .sidebar-list li, .sidebar:hover .sidebar-list li{ display:block;}

.collapse-sidebar{z-index:9990; position:relative; color:#FFF; }
 
.sidebar-menu{ padding-top:74px; }
.sidebar-menu h3{ font-size:14px; position:relative; min-width:220px;}
.sidebar-menu h3 a{color:#BECFE0; text-decoration:none; display:block; background:url(images/trans-sep.png) repeat-x bottom; min-height: 40px;
    line-height: 1;
    padding: 10px 22px 10px 0px; outline:none; transition: all 0.25s linear; -moz-transition: all 0.25s linear; -webkit-transition: all 0.25s linear;}
.sidebar-menu b{font-family:"OpenSansRegular", Arial;}
.sidebar-menu h3:hover, .sidebar-menu h3.active{background:url(images/trans-hov.png) repeat; color:#fff;}
.sidebar-list{ min-width:220px; padding:0px; list-style:none; background:url("images/trans-sep.png") repeat-x bottom;}
.sidebar-list li{ list-style-type:none; display:none; background:url(images/leftbar-arrow.png) 16px 11px no-repeat; }
.sidebar-list li a{ display:block;  border-bottom:none;  padding:6px 10px 6px 30px; 
text-decoration:none; color:#BECFE0; font-size:13px; transition: all ease 0.4s; -moz-transition: all ease 0.4s; -webkit-transition: all ease 0.4s;}
.sidebar-list li a:hover, .sidebar-list li.active a{color:#fff; background:url(images/trans-sub.png) repeat;}
.sidebar-menu h3.openheader{background:#415160; }
.sidebar-menu h3 span{ background:url(images/menu-close.png) 0px 0px no-repeat; position:absolute; top:50%; margin-top:-6px; right:14px; width:12px; height:12px; 
display:block;}
.sidebar-menu h3.openheader span{ background:url(images/menu-open.png) 0px 0px no-repeat;}
.dahshboardSelected{background:#415160; }

.sidebar-menu h3 .pos-service{ background:url(images/ic-services.png) center no-repeat;}
.sidebar-menu h3 .marketing{ background:url(images/ic-marketing.png) center no-repeat;}
.sidebar-menu h3 .reporting{ background:url(images/ic-reporting.png) center no-repeat;}
.sidebar-menu h3 .rolodex{ background:url(images/ic-rolodex.png) center no-repeat;}
.sidebar-menu h3 .chat{ background:url(images/ic-chat.png) center no-repeat;}
.sidebar-menu h3 .clock{ background:url(images/ic-clock.png) center no-repeat;}
.sidebar-menu h3 .agreements{ background:url(images/ic-agreement.png) center no-repeat;}
.sidebar-menu h3 .pos-sale{ background:url(images/ic-sale.png) center no-repeat;}
.sidebar-menu h3 .admin{ background:url(images/ic-admin.png) center no-repeat;}

.sidebar-menu h3 i{display:inline-block; position:absolute; top:0; text-align:center; left:0px; margin:auto;     width: 38px;
    height: 38px;
    line-height: 38px; }
.sidebar-menu h3 b, .sidebar-menu h3 span{display:none;}


/*******************Arrowlistmenu End ************************/
body .login-panel .panel-heading{border-bottom:4px solid #343434;}
@media only screen and (max-width: 767px) {
  .logo{text-align:center;}	
.sidebar {display:none;}

body.collapsed-sidebar .sidebar {right: 0; /*left:0px; */ display:block; box-shadow: 5px 5px 10px rgba(0,0,0,.2);}
body.collapsed-sidebar .content-liquid-full { margin-left:0px; width:100%;}
body.collapsed-sidebar{ overflow:hidden;}

.navhd{ float:none; display:block; clear:both; overflow:hidden; }
#login .panel{border:none !important;}
#login{ padding:0; position:relative; min-height:100%; height:auto !important; background:#FFF;}
#login .login-panel{ border-radius:0; border-bottom:1px solid #ececec !important; max-width:none !important; box-shadow:none !important;}
.loginform{ padding:0;}	
.loginfooter{ padding: 2px 0px;text-align: center;font-size: 13px;color: #fff; width: 100%;position: absolute; margin-bottom: 14px;}
}