/*

    cColours

    Dark Blue: #005288
    Tellow: #FFC221
    Lihgt Blue: #53BCEB
    Cool Gray: #4D4F53
    */



@media screen and (min-width: 0px) and (max-width: 1366px) {
  .small-container { display: block; }  /* show it on small screens */
    .large-container {
        display: none;
    }
}

@media screen and (min-width: 1366px) and (max-width: 2560px) {
  .large-container { display: block; }   /* hide it elsewhere */
  .small-container {
        display: none;
    }
}

body {
}

/* Set padding to keep content from hitting the edges */
.body-content {
    padding-left: 15px;
    padding-right: 15px;
}

h1, h2, h3, h4, h5, h6
{
    color:#595959;
}

p{
    color:#595959;
}

.loading, .loading-long
{
    background-color:#EB7E36;
    line-height:60px;
    height:60px;
    color:White;
    font-weight:bold;
    padding-left:15px;
    padding-right:15px;
    margin-left:20px;
    vertical-align:middle;
    text-align:center;
    margin:0 auto;
    display:none;
    position:fixed;
    top:0px;
    right:0px;
    z-index:9999;
    border:1px solid #E07B38;
    width:200px;
}

.loading-long
{
    background-color:#BA4848;    
}

/* Set width on the form input elements since they're 100% wide by default */


/* styles for validation helpers */
.field-validation-error {
    color: #b94a48;
}

.field-validation-valid {
    display: none;
}

input.input-validation-error {
    border: 1px solid #b94a48;
}

input[type="checkbox"].input-validation-error {
    border: 0 none;
}

.validation-summary-errors {
    color: #b94a48;
}



.validation-summary-valid {
    display: none;
}

.logo-container
{
    padding-left:10px;
    width:240px;
    font-size:1.4em;
    color:#EBEBEB;
    margin:0;
}

.fixed-footer
{
    position:fixed;
    bottom:0;
    right:0;
    left:0;
    text-align:center;
    background-color:#F2F2F2;
    border-top:1px solid #E6E6E6 ;
    margin:0 !important;
    padding-top:5px;
    padding-bottom:5px;
}


/*======================================================
Side Bar
======================================================*/
.sidebar ul
{
    float:left;
    list-style-type:none;
    margin:0;
    padding:0 !important;
    position:absolute;
    width:240px;
    background-color:#FAFAFA;
    border-right:1px solid #E6E6E6 ;
    bottom:0;
    /*height:100000px;*/
    top:60px;
    /*min-height:100%;*/
    /*display:inline;*/

    /*HACK*/
    margin-bottom: -60%;
    padding-bottom: 60%; 
}

.sidebar ul > li
{
    display:inline;
    line-height:50px;
    height:45px;
    width:100%;
}

.sidebar ul > li > a, .side-bar ul > li > a:visited
{
    display:block;
    float:left;
    width:auto;
    color:#636363;
    line-height:45px;
    height:45px;
    padding-left:30px;
    padding-right:20px;
    width:100%;
}

.sidebar ul > li > a:hover
{
    text-decoration:none;
}

.sidebar ul > li > a:hover
{
    background-color:#D1D1D1;
    color:#4A4A4A;
}

.sidebar ul > li.active a 
{
    background-color:#005288;
    color:#F5F5F5;
}

.sidebar-header
{
    display:block;
    float:left;
    width:auto;
    color:#636363;
    line-height:52px;
    height:52px !important;
    padding-left:20px;
    padding-right:20px;
    width:100%;
    text-align:left;
    border-bottom:1px solid #E3E3E3;
    border-top:1px solid #E3E3E3;
    background-color:#E3E3E3;
    font-size:1.2em;
    font-weight:600;
}

.side-bar-logo
{
    position: fixed;
    left: 0;
    bottom: 20px;
    /*background-color:#F0F0F0 !important;*/
    width:239px;
    text-align:center;
    padding-bottom:20px;
    padding-top:20px;
    /*border-top:1px solid #E3E3E3;*/
    border-right:1px solid #E3E3E3 !important;
    z-index:999;
}

/*======================================================
Right Side Bar
======================================================*/

.sidebar-right
{
   width:280px;
    float:right;
    width:auto;
    position:fixed;
        bottom:0px;
    height:100%;
    top:60px;
    right:0;
    border-left:1px solid #E6E6E6 ;
    
}
.sidebar-right ul
{
    list-style-type:none;
    margin:0;
    padding:0px !important;
    width:100%;
    
    width:280px;
    background-color:#FAFAFA;
    
    font-size:0.7em;

     z-index:999;
}

.sidebar-right ul > li
{
    display:inline;
    width:100%;
        line-height:20px;
    height:25px;
}

.sidebar-right ul > li > a, .sidebar-right-bar ul > li > a:visited
{
    display:block;
    float:right;
    width:auto;
    color:#636363;
    height:25px;
    padding-left:10px;
    padding-right:10px;
    width:100%;
}

.sidebar-right ul > li > a:hover
{
    text-decoration:none;
}

.sidebar-right ul > li > a:hover
{
    background-color:#D1D1D1;
    color:#4A4A4A;
}

.sidebar-right ul > li.active a 
{
    background-color:#005288;
    color:#F5F5F5;
}

.sidebar-right-header
{
    display:block;
    float:left;
    width:auto;
    color:#636363;
    line-height:52px;
    height:52px !important;
    padding-left:20px;
    padding-right:20px;
    width:100%;
    text-align:center;
    border-bottom:1px solid #E3E3E3;
    border-top:1px solid #E3E3E3;
    background-color:#f8f8f8;
}

.sidebar-right-logo
{
    position: fixed;
    left: 0;
    bottom: 0px;
    background-color:#F0F0F0 !important;
    width:240px;
    text-align:center;
    padding-bottom:20px;
    padding-top:20px;
    border-top:1px solid #E3E3E3;
    border-right:1px solid #E3E3E3;
    z-index:999;
}

/*======================================================
Filter Bar
======================================================*/
.filterbar ul
{
    float:left;
    width:auto;
    list-style-type:none;
    margin:0;
    padding:0px !important;
}

.filterbar ul > li
{
    display:inline;
    line-height:50px;
    height:45px;
    width:100%;
}

.filterbar ul > li > a, .filterbar ul > li > a:visited
{
    display:block;
    float:left;
    width:auto;
    color:#636363;
    line-height:45px;
    height:45px;
    padding-left:20px;
    padding-right:20px;
    width:100%;
}

.filterbar ul > li.active a 
{
    background-color:#428bca;
    color:#F5F5F5;
}

.filterbar ul > li.header
{
    font-size:1.5em;
    text-transform:uppercase;
}

.filterbar ul > li.header > a, .filterbar ul > li.header > a:visited
{
    padding-left:0px !important;
}


/*======================================================

======================================================*/
@media screen and (min-width: 0px) and (max-width: 400px) {
  #my-content { display: block; }  /* show it on small screens */
}

@media screen and (min-width: 401px) and (max-width: 1024px) {
  #my-content { display: none; }   /* hide it elsewhere */
}
.body
{
    margin-top:60px;
    margin-bottom:25px;
}

.body-sml
{
    margin-top:30px;
    
}

.login-container
{
    background-color:#fff;
    width:450px; margin:0 auto; margin-top:100px;
    border:0px solid #EBEBEB;
    padding-bottom:100px;
    text-align:center;
}

.wid-300
{
    width:300px !important;
}

.wid-450 {
    width: 450px !important;
}

.login-form
{
    margin-left:0px;
}

.login-form td
{
    padding:5px;
}

.login-form input[type=text]
{
    width:450px;
}

/*.login-forgot {
    background: none;
    border: none;
    color: #0066ff;
    text-decoration: underline;
    cursor: pointer;
}*/

.body-sidebar
{
        margin-left:240px;
    
}

.body-pad
{
    padding-top:10px;
    padding-left:20px;
}

.navbar-inverse .navbar-inner !important;
{
    background-color:green;
}

.activity-container
{
    overflow-y:scroll;
    overflow-y:auto;
}

/*======================================================
    Main Menu
======================================================*/
.main-menu
{
     background-color:#4D4F53;
     line-height:60px;
     min-height:60px;
     border-bottom:0px solid #D6D6D6;
     font-size:1.0em;
     position:fixed;
     top:0;
     left:0;
     right:0;
     z-index:1001;
}

.main-menu-right
{
    font-size:0.8em;
}

.main-menu-sml
{
     background-color:#3B3B3B;
     line-height:30px;
     min-height:30px;
     border-bottom:0px solid #D6D6D6;
     font-size:1.3em;
     position:fixed;
     top:0;
     left:0;
     right:0;
     z-index:1001;
}

.main-menu-ul
{
    float:left;
    width:auto;
    list-style-type:none;
    margin:0;
    padding:0px !important;
}

.main-menu-ul > li
{
    display:inline;
    line-height:60px;
    height:60px;
}

.main-menu-sml-ul > li
{
    display:inline;
    line-height:30px;
    height:30px;
}

.main-menu-ul > li > a, .main-menu-ul > li > a:visited
{
    display:block;
    float:left;
    width:auto;
    color:#C2C2C2;
    line-height:60px;
    height:60px;
    padding-left:20px;
    padding-right:20px;
}

.main-menu-sml-ul > li > a, .main-menu-sml-ul > li > a:visited
{
    display:block;
    float:left;
    width:auto;
    color:#C2C2C2;
    line-height:30px;
    height:30px;
    padding-left:20px;
    padding-right:20px;
}

.main-menu-right  li a
{
        padding-left:5px;
    padding-right:5px;
}

.main-menu-ul > li > a:hover
{
    text-decoration:none;
}

.main-menu-ul > li > a:hover
{
    background-color:#005288;
    color:#fff;
    border-bottom:2px solid #53BCEB;
}

.main-menu-logo > a:hover
{
    border-bottom:none !important;
}

.main-menu-ul > li.active a
{
    background-color:#005288;
    color:#EBEBEB;
    border-bottom:2px solid #53BCEB;
}

.main-menu-logo a {
    padding-left:0px !important;
    background-color:#fff;
    margin:0 !important;
    padding-right:0px !important;
    text-align:center
}

    .main-menu-logo a:hover
    {
        background-color:#fff !important;
    }

/*
    Sub Menu
    */
.sub-menu
{
     background-color:#E8E8E8;
     line-height:30px;
     min-height:30px;
     border-bottom:1px solid #A8A8A8;
     clear:none;

}

.sub-menu-ul
{
    float:left;
    width:auto;
    list-style-type:none;
    padding-left:0;
}

.sub-menu-ul > li
{
    display:inline;
    line-height:30px;
    height:30px;
}

.sub-menu-ul > li > a, .sub-menu-ul > li > a:visited
{
    display:block;
    float:left;
    width:auto;
    color:#696969;
    line-height:30px;
    height:30px;
    padding-left:10px;
    padding-right:10px;
}

.sub-menu-ul > li > a:hover
{
    text-decoration:none;
}

.sub-menu-ul > li > a:hover
{
    background-color:#DEDEDE;
    color:#0468BA;
    border-bottom:1px solid #0468BA;
}

/*=============================================================
    Dashboard
=============================================================*/
.dashboard-container
{
    margin-top:10px;
}

.dashblock
{
    width:180px;
    height:80px;
    padding:10px;
    float:left;
    margin-right:2px;
}

.dashblock-header
{
    padding:0px;
    width:100%;
    margin:0px;
    text-align:center;
    font-size:1.2em;
    color:#F2F2F2;
    
}

.dashblock-figure
{
    padding:0px;
    margin:0px;
    text-align:center;
    font-size:2em;
    color:#F2F2F2;
    clear:both;
}



.dashblock-depot, .dashblock-gray
{
    background-color:#CCCCCC;
    border:1px solid #BABABA;
}

.dashblock-vehicles, .dashblock-yellow
{
     background-color:#F9C301;
    border:1px solid #FFBB00;
}

.dashblock-drivers, .dashblock-blue
{
     background-color:#22297A;
    border:1px solid #3B418C;
}

.dashblock-red, .dashblock-unresolved
{
     background-color:#DA251C;
    border:1px solid #C7241C;
}



.navbar
{
    border-radius:0 !important;
    border-left:0 !important;
    margin-bottom:0px;
}

.pagination
{
    margin:0 !important;
}

.table-top td
{
    vertical-align:top;
}

/*=============================================================
    Input form
=============================================================*/

.input-form td
{
    padding:3px;
    padding-left:5px;
}

.input-form th
{
    font-weight:bold;
    text-align:center;
}

.input-form-40 td
{
    height:40px;

}

.input-form th
{
    border-bottom:1px solid #E6E6E6;
    text-align:left;
    font-size:1.3em;
    padding-left:20px;
}

.input-form td:first-child
{
    font-weight:bold;
    padding-right:20px;
    background-color:#FAFAFA;
    border-right:1px solid #E6E6E6;
    text-align:right;
}


.input-form input[type=text]
{
    padding:3px;
    border:1px solid #D4D4D4;
}

.input-form-input-medium, .input-form-input-medium input[type=text]
{
    width:300px;
}

.input-form textarea
{
    padding:3px;
    width:100%;
    
    border:1px solid #D4D4D4;
}

.input-form select
{
    padding:3px;
    min-width:250px;
    border:1px solid #D4D4D4;
}

.input-form-login
{
    font-size:1.2em;
}

.bs-callout
{
    padding:20px;
}

.bs-callout-med
{
    width:600px;
}

.bs-callout-danger
{
    background-color:#fdf7f7;
    border-left:5px solid #eed3d7;
    
}

.bs-callout-danger h4
{
    Color:#b94a48;
    font-size:18px;
}



.textarea-large
{
    width:100%;
    right:auto;
    height:200px;
}

/*=============================================================
    DateForm Control1 - Similar version to bootstrap used for dates in the grid
=============================================================*/

.dateform-control:-moz-placeholder {
  color: #999999;
}

.dateform-control::-moz-placeholder {
  color: #999999;
}

.dateform-control:-ms-input-placeholder {
  color: #999999;
}

.dateform-control::-webkit-input-placeholder {
  color: #999999;
}

.dateform-control {
  /*display: block;*/
  width: 100%;
  height: 34px;
  padding: 0px 2px;
  font-size: 11px;
  line-height: 1.428571429;
  color: #555555;
  vertical-align: middle;
  background-color: #ffffff;
  border: 1px solid #cccccc;
  border-radius: 4px;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
          box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  -webkit-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
          transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
  width: 70px;
}

.dateform-control:focus {
  border-color: #66afe9;
  outline: 0;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(102, 175, 233, 0.6);
          box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(102, 175, 233, 0.6);
}

.dateform-control[disabled],
.dateform-control[readonly],
fieldset[disabled] .dateform-control {
  cursor: not-allowed;
  background-color: #eeeeee;
}

.tdDateForm {
    width: 150px;
}

.tdSubscriberForm {
    min-width:250px;
}

.tdDriverForm {
    min-width:130px;
}

.unresolved
{
    border:3px solid #f0ad4e;
    padding:20px;
    border-radius:4px;
    background-color:#DA251C;
}

.label-yellow
{
    background-color:#F9C301;
}

.label-orange
{
    background-color:#E0A43A;
}

.label-red
{
    background-color:#DA251C;
}

.label-none
{
    background-color:#fff;
    border:1px solid #EBEBEB;
    color:#575757;
}

.label-40
{
    display:block;
    font-size:0.9em;
    width:50px;
}

.label-20
{
    display:block;
    font-size:0.9em;
    width:30px;
}



.navbar-right
{
    margin-right:20px !important;
}

.cell-expired
{
    background-color:#BA6E6E;
    color:white;
    padding:2px !important;
}

.cell-warning
{
    background-color:#C9844F;
    color:white;
     padding:2px !important;
}

input[readonly="true"], input[readonly="readonly"], input[readonly]
{
    background-color:#E8E8E8;
}

.text-area-01
{
    height:100px !important;
}

/*=============================================================
    Analysis Reports
=============================================================*/

.td-value-alignment {
    text-align:right;
    width:30px;
}

.month-header
{
    font-size:3em;
    text-align:center;
    background-color:#F2F2F2;
    border:1px solid #E0E0E0;
}

.feature-header
{
    font-size:1.5em;
    width:400px;
    text-align:center;
    background-color:#F2F2F2;
    border:1px solid #E0E0E0;
    margin-top:5px;
    margin-bottom:5px;
}

.lbl-subscriberselection
{
    overflow:hidden;
}

.div-subscriberselection label {
    display: inline;
    padding-left: 5px;
    text-indent: -5px;
}
.div-subscriberselection input {
    width: 13px;
    height: 13px;
    padding: 0px;
    margin:0;
    vertical-align: bottom;
    position: relative;
    top: -1px;
    *overflow: hidden;
}

.custom-errors {
    padding:20px;
    background-color:#fdf7f7;
    width:100%;
    border-left:5px solid #eed3d7;
    color: red;
}

.custom-success {
  background-color: #dff0d8;
  padding:20px;
  width:100%;
  border-left:5px solid #DCDCDC;
}


.DriveRiskBlue {
    color:white;
    background-color: #264271;

}