@import(theme.min.css);
*{font-family:Arial, Helvetica, sans-serif}
.btn { /* just for this demo. */
    margin-top: 5px;
}
.well{background-color:#ffffff}
.row{margin-top:10px;}
body{background-color:#F8F8F8;}

a{text-decoration:none !important;}

.panel-title{padding-left:15px;}

.btn-arrow-right,
.btn-arrow-left {
    position: relative;
    padding-left: 18px;
    padding-right: 18px;
}
.btn-arrow-right {
    padding-left: 36px;
}
.btn-arrow-left {
    padding-right: 36px;
}
.btn-arrow-right:before,
.btn-arrow-right:after,
.btn-arrow-left:before,
.btn-arrow-left:after { /* make two squares (before and after), looking similar to the button */
    content:"";
    position: absolute;
    top: 5px; /* move it down because of rounded corners */
    width: 22px; /* same as height */
    height: 22px; /* button_outer_height / sqrt(2) */
    background: inherit; /* use parent background */
    border: inherit; /* use parent border */
    border-left-color: transparent; /* hide left border */
    border-bottom-color: transparent; /* hide bottom border */
    border-radius: 0px 4px 0px 0px; /* round arrow corner, the shorthand property doesn't accept "inherit" so it is set to 4px */
    -webkit-border-radius: 0px 4px 0px 0px;
    -moz-border-radius: 0px 4px 0px 0px;
}
.btn-arrow-right:before,
.btn-arrow-right:after {
    transform: rotate(45deg); /* rotate right arrow squares 45 deg to point right */
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
}
.btn-arrow-left:before,
.btn-arrow-left:after {
    transform: rotate(225deg); /* rotate left arrow squares 225 deg to point left */
    -webkit-transform: rotate(225deg);
    -moz-transform: rotate(225deg);
    -o-transform: rotate(225deg);
    -ms-transform: rotate(225deg);
}
.btn-arrow-right:before,
.btn-arrow-left:before { /* align the "before" square to the left */
    left: -11px;
}
.btn-arrow-right:after,
.btn-arrow-left:after { /* align the "after" square to the right */
    right: -11px;
}
.btn-arrow-right:after,
.btn-arrow-left:before { /* bring arrow pointers to front */
    z-index: 1;
}
.btn-arrow-right:before,
.btn-arrow-left:after { /* hide arrow tails background */
    background-color: white;
}
.nav>li>a{text-align:center;}


.navbar-default .navbar-nav>li>a{width:114px; box-shadow:#3c3c3b -1px 0px; border:1px solid #202020; border-top:none; border-bottom:none; padding: 8px 22px;color:#ffffff !important;}
.navbar-default .navbar-nav>li>a>i{ color:#1c1c1c; text-shadow:#3d3d3d 2px 1px; font-size:42px;}

.navbar a:hover{padding:0px; background-color:#303030 !important; display:block; height:78px;   padding: 8px 22px;    box-shadow: inset #161616 0px 0px 18px 2px, #3c3c3b -1px 0px !important;}
.navbar-default .navbar-nav>.active>a, .navbar-default .navbar-nav>.active>a:focus, .navbar-default .navbar-nav>.active>a:hover{position:relative; overflow:hidden; padding:0px; background-color:#303030; color:#ffffff;    padding: 8px 22px;    box-shadow: inset #161616 0px 0px 18px 2px; text-shadow: 0px 0px 2px #181818}
.navbar-default .navbar-nav>.active>a:after, .navbar-default .navbar-nav>.active>a:focus:after, .navbar-default .navbar-nav>.active>a:hover:after{content:"\f062"; font-family:fontawesome; position:absolute; left:46px; bottom:-12px; font-size: 24px; color:#f9f9f9;}
.navbar-default .navbar-nav>.active>a i, .navbar-default .navbar-nav>.active>a:focus i, .navbar-default .navbar-nav>.active>a:hover i{color:white;}
.navbar-default .navbar-nav>li>a:hover>i{color:#96c11f;}
.navbar-default .navbar-nav>li>a:focus, .navbar-default .navbar-nav>li>a:hover{color:#ffffff !important;}
.navbar-default .navbar-nav>.open>a, .navbar-default .navbar-nav>.open>a:focus, .navbar-default .navbar-nav>.open>a:hover{position:relative; overflow:hidden; padding:0px; background-color:#303030; color:#ffffff;    padding: 8px 22px;    box-shadow: inset #161616 0px 0px 18px 2px; text-shadow: 0px 0px 2px #181818}
.navbar-default .navbar-nav>.open>a i, .navbar-default .navbar-nav>.open>a:focus i, .navbar-default .navbar-nav>.open>a:hover i{color:#96c11f;}
/*.navbar-default .navbar-nav>.open>a:after, .navbar-default .navbar-nav>.open>a:focus:after, .navbar-default .navbar-nav>.open>a:hover:after{content:"\f062"; font-family:fontawesome; position:absolute; left:46px; bottom:-12px; font-size: 24px; color:#f9f9f9;}
*/.message-alerts{}
.message-alerts  > i {font-size:10px;}
.dropdown-menu>li:hover>a,.dropdown-menu>li>a:hover{background-color:#96c11f !important; box-shadow:none !important; display:inline-block !important; height:auto !important; width:100%;}

#logout{float: none !important;  display: inline-block; padding: 0px; margin: 8px 12px;}
#logout i{cursor:pointer; font-size:22px !important;}
#logout i:hover{color:#ffffff;}

.customer-name{text-transform:capitalize; color:#ffffff; diplay:inline-block; border-right:2px solid #3c3c3b; padding:0px 10px;}
.customer-logo{border-left:2px solid #3c3c3b; padding:0px 10px;}
.nationalgrid{color:#0148ac; background-color:#ffffff; border-radius:4px; padding:4px;}
.contact{height:40px; position:relative;margin: 16px; width: 136px !important; display:inline-block !important;}
a.contact:hover{height:40px !important; background-color:#96c11f !important; box-shadow:none !important}
.contact i {font-size:30px !important; position:absolute; left: 10px; top: 7px; text-shadow:none !important}
a.contact span{    display: block; margin: 3px 25px;}
.phone-number{color:#ffffff; font-size:18px;}
.phone-number i{color:#96c11f !important; font-size:15px !important; margin:5px;}

table th{ background-color:#3c3c3b !important; color:#ffffff;}
table.dataTable thead .sorting:after, table.dataTable thead .sorting_asc:after, table.dataTable thead .sorting_desc:after, table.dataTable thead .sorting_asc_disabled:after, table.dataTable thead .sorting_desc_disabled:after{color:#ffffff; opacity:1;}
table.dataTable thead .sorting_desc:after{color:#96c11f;}
table.dataTable thead .sorting_asc:after{color:#96c11f;}

.message-alerts i{font-size:18px !important;}
.alerter .message-alerts{background-color:#3d3d3d; padding:5px; margin:5px; border-radius:4px; display:block; color:#ffffff; width:48px; cursor:pointer}
.alerter .message-alerts span{display:none;}
.alerter .message-alerts:hover{background-color:#96c11f;}
.message-alerts:hover i{color:#3d3d3d;}

.cal-logo{margin: 11px 34px 0px 20px;}
.navbar{margin-bottom:0px;}
.title-area{background-color:#f5f5f5 !important; padding:20px 0px;}


/* Customer VIEW */
.panel-body.address span{display:block}


/* CCS callouts */
.bs-callout {
    padding: 20px;
    margin: 20px 0;
    border: 1px solid #eee;
    border-left-width: 5px;
    border-radius: 3px;
}
.bs-callout h4 {
    margin-top: 0;
    margin-bottom: 5px;
}
.bs-callout p:last-child {
    margin-bottom: 0;
}
.bs-callout code {
    border-radius: 3px;
}
.bs-callout+.bs-callout {
    margin-top: -5px;
}
.bs-callout-default {
    border-left-color: #777;
}
.bs-callout-default h4 {
    color: #777;
}
.bs-callout-primary {
    border-left-color: #96c11f;
}
.bs-callout-primary h4 {
    color: #96c11f;
}
.bs-callout-success {
    border-left-color: #5cb85c;
}
.bs-callout-success h4 {
    color: #5cb85c;
}
.bs-callout-danger {
    border-left-color: #d9534f;
}
.bs-callout-danger h4 {
    color: #d9534f;
}
.bs-callout-warning {
    border-left-color: #f0ad4e;
}
.bs-callout-warning h4 {
    color: #f0ad4e;
}
.bs-callout-info {
    border-left-color: #5bc0de;
}
.bs-callout-info h4 {
    color: #5bc0de;
}