@import url('https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400&display=swap');
@font-face {font-family: regFont;  src: url(UKNumberPlate.ttf);}
body,html{width:100%;height:100%}
@media print {
body,html{width:auto;height:auto; font-family: 'Open Sans', sans-serif;}
} 
body{font-family: 'Open Sans', sans-serif!important; font-weight:300!important}

.linen{color:white;border-color:#929ba6;background:#a7b2be url(../../images/fabric.png);background:url(../../images/fabric.png),-webkit-gradient(linear,left top,left bottom,from(#5d656e),to(#a7b2be)) repeat-x,#a7b2be;background:url(../../images/fabric.png),-webkit-linear-gradient(top,#5d656e,#a7b2be) repeat-x,#a7b2be;background:url(../../images/fabric.png),-moz-linear-gradient(top,#5d656e,#a7b2be) repeat-x,#a7b2be;background:url(../../images/fabric.png),-ms-linear-gradient(top,#5d656e,#a7b2be) repeat-x,#a7b2be;background:url(../../images/fabric.png),-o-linear-gradient(top,#5d656e,#a7b2be) repeat-x,#a7b2be;background:url(../../images/fabric.png),linear-gradient(top,#5d656e,#a7b2be) repeat-x,#a7b2be}



.top_nav{z-index:9}
#navBox a{margin-top:10px}
.title{font-weight:700; color:#333; margin-bottom:5px}
.pageTitle{background-color:#fff; display:inline-block; border:1px solid #d9d9db; border-bottom-left-radius:20px; border-top-right-radius:20px; color:#77879c; padding:10px 40px}
.popupTitle{background-color:#2a3f54; color:#fff; padding:10px}
.popupTitle h3{font-size:18px; color:#CCC}
.nopadding{padding:0px 0px 0px 10px}
.alert-info{background-color:#2a3f54}
.bg-info{background-color:#2a3f54; color:#fff}
.badge-info{background-color:#2a3f54!important; color:#fff!important}
.text-info{color:#2a3f54!important}
.text-info-title{color:#2a3f54!important; background:#fff!important; border:1px solid rgba(42,63,84,0.32); border-radius: 2px}
.alert-secondary{border:1px solid #2a3f54; background-color:#f5f5f5}
.alert-warning{background-color:rgba(224,128,4, .80); color:#fff}
.alert-default{background-color:#fff; color:#333; border-color:#ccc}
.card-outline-info{border-color:#2a3f54}
.spacer{clear:both; width:100%; display:block; height:25px}
.enrep_content{margin-top:60px; padding-bottom:80px}

.bg-info{background-color:#2a3f54!important;border-color:#2a3f54!important}
.btn-info{background-color:#2a3f54;border-color:#2a3f54}
.btn-info:hover{background-color:#fff; border-color:#2a3f54; color:#2a3f54!important}
.btn-info-alt{border:1px solid #ffffff}
.list-group-item-action:hover{background-color:#2a3f54; color:#fff}
.btn.btn-info,input.btn-info{cursor:pointer}
.input-group-addon.info {color: #fff; background-color: #2a3f54!important; border-color: #2a3f54;}
.btn-default,.alert .btn-default{background-color:#fff; color: #333; border-color: #ccc;}
.badge-default,.alert .badge-default{background-color:#fff; color: #333; border: 1px solid #ccc; padding:5px 10px 5px 10px; 
font-size:16px}
.card-header{background-color:#f8f8f8; border-color:#ccc; color:#333; font-weight:bold; font-size:14px}
.card-header:hover{background-color:#2a3f54; color:#fff}

input::-webkit-input-placeholder,textarea::-webkit-input-placeholder {color: #ccc!important;}
input:-moz-placeholder,textarea:-moz-placeholder {color: #ccc!important;}
input::-moz-placeholder,textarea::-moz-placeholder {color: #ccc!important;}
input:-ms-input-placeholder,textarea:-ms-input-placeholder {color: #ccc!important;}
input:focus::-webkit-input-placeholder {color: transparent!important;}



.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active, a.ui-button:active, .ui-button:active, .ui-state-active.ui-button:hover{color:#fff; background:#2a3f54;}
.ui-sortable-placeholder {border: 1px dashed #900; height: 45px; width: 100%; background: #fff; opacity:0.6}
.list-group a{display:block;text-align:center}
.list-group a.disabled{background:rgba(204,0,0,0.4);color:#333}
kbd{background-color:#2a3f54}
table .status_colour,.no-sort{position:relative; padding:0px!important; margin:0px!important; width:15px!important}

table div {position: relative!important; height: 100%!important}
table .color {width:3px; height:40px!important; position:absolute; left:0}
#datatable,#datatables,#listTable,#assetTable td{vertical-align: middle!important}

.fileIcon{margin:2px;}
.fileIcon>a{font-size:80px;}
.fileIcon>a>p{font-size:14px; line-height:14px!important; margin:0px}

.fileIcon_small{margin:10px;}
.fileIcon_small a{font-size:50px;}
.fileIcon_small>a>p{font-size:14px; line-height:14px!important; margin:0px}
.fileIcon_small:hover,.fileIcon_small:hover>a{background-color:#2a3f54; color:#fff!important;}
.formoptions>.active,.formoptions>.active>a{background-color:#2a3f54!important; color:#fff!important;}
.formoptions>.active:hover,.formoptions>.active:hover>a{background-color:#fff!important; color:#2a3f54!important;}


table.dataTable.fixedHeader-floating, table.dataTable.fixedHeader-locked {background-color: white; margin-top: 0 !important; margin-bottom: 0 !important;}
table.dataTable.fixedHeader-floating {position: fixed !important;top: 55px !important}
table.dataTable.fixedHeader-locked {position: absolute !important;}
@media print {table.fixedHeader-floating {display: none;}}
div.FixedHeader_Cloned table {position:fixed!important; top: 90px !important}
.table-responsive {display: table;}

@media (max-width: 767px) {.table-responsive thead {display: none;}
.table-responsive tr,.table-responsive th,.table-responsive td {display: block;}
.table-responsive td {border-top: none;}
.table-responsive tr td:first-child {border-top: 1px solid #ddd;font-weight: bold;}
}

.tab-content{width:100%; background-color:#fff; min-height:80%; border-bottom:1px solid #dddddd;  border-left:1px solid #dddddd;  border-right:1px solid #dddddd}
 
.s1{border-top-left-radius:5px; border-bottom-left-radius:5px;}
.s1,.s2,.s3,.sa,.sa1{height:30px; position: relative; float:left; padding:4px 5px; font-size:16px; color:#fff;}
.s1:hover,.s2:hover,.s3:hover,.sa:hover,sa1:hover,.s1:focus,.s2:focus,.s3:focus,.sa:focus,.sa1:focus{color:#fff}
.s2,.s3,.sa{margin-left:-25px; text-indent:25px; padding-left:20px;}
.s1{background-color:#666; z-index:4!important}
.s1:after {content:""; position: absolute; top:0; left:100%; height:0; width:0; border-width: 15px; border-style:solid; border-color:#666; border-top-color:transparent; border-bottom-color:transparent; border-right-color:transparent; z-index:4!important;}
.s2{background-color:#999; z-index:3!important}
.s2:after {content:""; position: absolute; top:0; left:100%; height:0; width:0; border-width: 15px; border-style:solid; border-color:#999; border-top-color:transparent; border-bottom-color:transparent; border-right-color:transparent; z-index:3!important;}
.s3{background-color:#CCC; z-index:2!important}
.s3:after {content:""; position: absolute; top:0; left:100%; height:0; width:0; border-width: 15px; border-style:solid; border-color:#CCC; border-top-color:transparent; border-bottom-color:transparent; border-right-color:transparent; z-index:2!important;}
.sa{background-color:#2a3f54; z-index:1!important}
.sa:after {content:""; position: absolute; top:0; left:100%; height:0; width:0; border-width: 15px; border-style:solid; border-color:#2a3f54; border-top-color:transparent; border-bottom-color:transparent; border-right-color:transparent; z-index:1!important;}
.sa1{background-color:#2a3f54; z-index:1!important}
.sa1:after {content:""; position: absolute; top:0; left:100%; height:0; width:0; border-width: 15px; border-style:solid; border-color:#2a3f54; border-top-color:transparent; border-bottom-color:transparent; border-right-color:transparent; z-index:1!important;}


/* Landscape phones and down */
@media (max-width: 480px) {
.s1{border-top-left-radius:0px; border-bottom-left-radius:0px; paddong:0px}
.s1,.s2,.s3,.sa,.sa1{line-height:17px; height:20px; position: relative; float:left; padding:2px 5px 2px 5px; margin:2px; font-size:10px; color:#fff;}
.s1:hover,.s2:hover,.s3:hover,.sa:hover,sa1:hover,.s1:focus,.s2:focus,.s3:focus,.sa:focus,.sa1:focus{color:#fff}
.s2,.s3,.sa{margin-left:0px; text-indent:0px; padding-left:0px; padding:2px 5px 2px 5px;}
.s1{background-color:#666; z-index:4!important}
.s1:after {border:none}
.s2{background-color:#999; z-index:3!important}
.s2:after {border:none}
.s3{background-color:#CCC; z-index:2!important}
.s3:after {border:none}
.sa{background-color:#2a3f54; z-index:1!important}
.sa:after {border:none}
.sa1{background-color:#2a3f54; z-index:1!important}
.sa1:after{border:none}

}

.card-flip { -webkit-perspective: 1000px; perspective: 1000px;}
.card-flip,.front,.back {width: 100%; height: 330px;  clear:both}
.flip {-webkit-transition: 0.6s; transition: 0.6s; -webkit-transform-style: preserve-3d; transform-style: preserve-3d; position: relative;}
.front,.back { -webkit-backface-visibility: hidden; backface-visibility: hidden; position: absolute; top: 0; left: 0;}
.front {z-index: 2; -webkit-transform: rotateY(0deg); transform: rotateY(0deg);}
.back {-webkit-transform: rotateY(180deg); transform: rotateY(180deg);}
.card-flip>.flip>.front>.card{height:300px!important;}
.card-flip>.flip>.back>.card{height:300px!important;}
@media (max-width: 480px) {
.card-flip,.front,.back {width: 100%; height: 450px; margin-bottom:30px}	
}
.rounded-circle{padding:3px; border:1px solid #ccc}


.filterButtons{cursor:pointer}
.buttons-html5,  .buttons-print{ display: inline-block; font-weight: normal; line-height: 1.25; text-align: center; white-space: nowrap; vertical-align: middle; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; border: 1px solid transparent; padding: 0.5rem 1rem; font-size: 1rem; border-radius: 0.25rem; -webkit-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; color: #292b2c; background-color: #fff; border-color: #ccc;}

.btn-primary:hover {color: #fff; background-color: #025aa5; border-color: #01549b;}
.btn-disabled{background-color:transparent!important}
.child>ul{padding: 0; list-style-type: none;}


#ui-datepicker-div{ width:579px !important; height:570px !important; margin:0 auto !important; position:fixed !important; left:50% !important; top:50% !important; margin-left:-250px !important; margin-top:-290px !important;}
.ui-datepicker {z-index:9999999 !important; }
.ui-datepicker-trigger{background-color:#2a3f54!important; border-color:#2a3f54!important; color:#fff; border:1px solid #ffffff; cursor:pointer; margin:0px!important;padding:0px 10px 0px 10px!important; }
.ui-datepicker-trigger i{margin:0px!important;padding:0px!important;}
.ui-datepicker-trigger:hover{background-color:#ffffff!important; border-color:#2a3f54!important; color:#2a3f54; border:1px solid #2a3f54}
input.hasDatepicker,input.datepicker  {position:relative!important; margin-right: 5px; width: -webkit-calc(100% - 21px); width: -moz-calc(100% - 21px); width: -o-calc(100% - 21px); width: -ms-calc(100% - 21px); width: calc(100% - 21px); z-index: 10!important}
.datepickerAddon{position:relative!important; margin-right: 5px; width: -webkit-calc(100% - 21px); width: -moz-calc(100% - 21px); width: -o-calc(100% - 21px); width: -ms-calc(100% - 21px); width: calc(100% - 21px); z-index: 10!important}

.icheckbox_flat,.iradio_flat { display: inline-block; *display: inline; vertical-align: middle; margin: 0; padding: 0; width: 20px; height: 20px; background: url(flat.png) no-repeat; border: none; cursor: pointer;}
.icheckbox_flat {background-position: 0 0;}
.icheckbox_flat.checked {background-position: -22px 0;}
.icheckbox_flat.disabled {background-position: -44px 0; cursor: default;}
.icheckbox_flat.checked.disabled {background-position: -66px 0;}
.iradio_flat {background-position: -88px 0;}
.iradio_flat.checked {background-position: -110px 0;}
.iradio_flat.disabled {background-position: -132px 0; cursor: default;}
.iradio_flat.checked.disabled {background-position: -154px 0;}

@media (-o-min-device-pixel-ratio: 5/4), (-webkit-min-device-pixel-ratio: 1.25), (min-resolution: 120dpi) {
.icheckbox_flat,.iradio_flat {background-image: url(flat@2x.png); -webkit-background-size: 176px 22px; background-size: 176px 22px;}
 }

.icheckbox_flat-blue,.iradio_flat-blue {display: inline-block; *display: inline; vertical-align: middle; margin: 0; padding: 0; width: 20px; height: 20px; background: url(../../images/blue.png) no-repeat; border: none; cursor: pointer;}

.icheckbox_flat-blue {background-position: 0 0;}
.icheckbox_flat-blue.checked {background-position: -22px 0;}
.icheckbox_flat-blue.disabled {background-position: -44px 0; cursor: default;}
.icheckbox_flat-blue.checked.disabled {background-position: -66px 0;}
.iradio_flat-blue {background-position: -88px 0;}
.iradio_flat-blue.checked {background-position: -110px 0;}
.iradio_flat-blue.disabled {background-position: -132px 0; cursor: default;}
.iradio_flat-blue.checked.disabled {background-position: -154px 0;}

@media (-o-min-device-pixel-ratio: 5/4), (-webkit-min-device-pixel-ratio: 1.25), (min-resolution: 120dpi) {
.icheckbox_flat-blue,.iradio_flat-blue {background-image: url(blue@2x.png); -webkit-background-size: 176px 22px; background-size: 176px 22px;}
}
.icheckbox_flat-aero,.iradio_flat-aero {display: inline-block; *display: inline; vertical-align: middle; margin: 0; padding: 0; width: 20px; height: 20px; background: url(aero.png) no-repeat; border: none; cursor: pointer;}

.icheckbox_flat-aero {background-position: 0 0;}
.icheckbox_flat-aero.checked {background-position: -22px 0;}
.icheckbox_flat-aero.disabled {background-position: -44px 0; cursor: default;}
.icheckbox_flat-aero.checked.disabled {background-position: -66px 0;}
.iradio_flat-aero {background-position: -88px 0;}
.iradio_flat-aero.checked {background-position: -110px 0;}
.iradio_flat-aero.disabled {background-position: -132px 0; cursor: default;}
.iradio_flat-aero.checked.disabled {background-position: -154px 0;}

@media (-o-min-device-pixel-ratio: 5/4), (-webkit-min-device-pixel-ratio: 1.25), (min-resolution: 120dpi) {
.icheckbox_flat-aero,.iradio_flat-aero {background-image: url(aero@2x.png); -webkit-background-size: 176px 22px; background-size: 176px 22px;}
}

.icheckbox_flat-grey,.iradio_flat-grey {display: inline-block; *display: inline; vertical-align: middle; margin: 0; padding: 0; width: 20px; height: 20px; background: url(grey.png) no-repeat; border: none; cursor: pointer;}
.icheckbox_flat-grey {background-position: 0 0;}
.icheckbox_flat-grey.checked {background-position: -22px 0;}
.icheckbox_flat-grey.disabled {background-position: -44px 0; cursor: default;}
.icheckbox_flat-grey.checked.disabled {background-position: -66px 0;}
.iradio_flat-grey {background-position: -88px 0;}
.iradio_flat-grey.checked {background-position: -110px 0;}
.iradio_flat-grey.disabled {background-position: -132px 0; cursor: default;}
.iradio_flat-grey.checked.disabled {background-position: -154px 0;}

@media (-o-min-device-pixel-ratio: 5/4), (-webkit-min-device-pixel-ratio: 1.25), (min-resolution: 120dpi) {
.icheckbox_flat-grey,.iradio_flat-grey {background-image: url(grey@2x.png); -webkit-background-size: 176px 22px;background-size: 176px 22px;    }
}

.iCheck-helper{position: absolute; top: 0%; left: 0%; display: block; width: 100%; height: 100%; margin: 0px; padding: 0px; background: rgb(255, 255, 255); border: 0px; opacity: 0;}

.switchery {background-color: #fff; border: 1px solid #dfdfdf; border-radius: 20px; cursor: pointer; display: inline-block; height: 30px; position: relative; vertical-align: middle; width: 50px; -moz-user-select: none; -khtml-user-select: none; -webkit-user-select: none; -ms-user-select: none; user-select: none; -webkit-box-sizing: content-box; -moz-box-sizing: content-box; box-sizing: content-box; -webkit-background-clip: content-box; background-clip: content-box;}
.switchery > small {background: #fff; border-radius: 100%; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.4); height: 30px; position: absolute; top: 0; width: 30px;}
.switchery-small {border-radius: 20px; height: 20px; width: 33px;}
.switchery-small > small {height: 20px; width: 20px;}
.switchery-large {border-radius: 40px; height: 40px; width: 66px;}
.switchery-large > small {height: 40px;  width: 40px;}


.input-group-addon.primary {
    color: rgb(255, 255, 255);
    background-color: rgb(50, 118, 177);
    border-color: rgb(40, 94, 142);
}
.input-group-addon.success {
    color: rgb(255, 255, 255);
    background-color: rgb(92, 184, 92);
    border-color: rgb(76, 174, 76);
}
.input-group-addon.info {
    color: rgb(255, 255, 255);
    background-color: rgb(57, 179, 215);
    border-color: rgb(38, 154, 188);
}
.input-group-addon.warning {
    color: rgb(255, 255, 255);
    background-color: rgb(240, 173, 78);
    border-color: rgb(238, 162, 54);
}
.input-group-addon.danger {
    color: rgb(255, 255, 255);
    background-color: rgb(217, 83, 79);
    border-color: rgb(212, 63, 58);
}
.input-group-addon.secondary {border:1px solid #cbcbcb; background-color:#ffffff; color:#282a2b; cursor:pointer}

.option-label{color:#2a3f54!important; font-weight:bold!important;}
#overlay {
    position: fixed; /* Sit on top of the page content */
    display: none; /* Hidden by default */
    width: 100%; /* Full width (cover the whole page) */
    height: 100%; /* Full height (cover the whole page) */
    top: 0; 
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0,0,0,0.5); /* Black background with opacity */
    z-index: 1010; /* Specify a stack order in case you're using a different order for other elements */
    cursor: pointer; /* Add a pointer on hover */
}

#overlay #text{position: absolute; top: 50%;
    left: 50%;    
    transform: translate(-50%,-50%);
    -ms-transform: translate(-50%,-50%);
}


.input-group{ z-index:0!important}

.dropdown-item{font-size:14px;}
.dropdown-item:hover{background-color:#2a3f54; color:#fff}

.datebox{border-top-right-radius:5px; border-bottom-left-radius:5px; border-top-left-radius:15px; border-bottom-right-radius:15px}
.green_border{border:3px solid #28961F}
.diaryTable tbody {max-height:200px;display:inline-block; overflow:auto}
.cell_full{background-color:#2a3f54;border-color:#2a3f54;color:#fff; }
.cell_empty{background-color:#fff; color: #333; border-color: #ccc;}

.btn-circle.btn-xl {
    width: 70px;
    height: 70px;
    padding: 10px 16px;
    border-radius: 35px;
    font-size: 24px;
    line-height: 1.33;
}

.btn-circle {
    width: 30px;
    height: 30px;
    padding: 6px 0px;
    border-radius: 15px;
    text-align: center;
    font-size: 12px;
    line-height: 1.42857;
}

.nplate {display:block; font-family: regFont!important; background-image:url(../../images/plate.png); width:150px; height:35px; text-align:center; font-size:20px; text-transform:uppercase; line-height:35px; background-repeat:no-repeat; color:#0A0A0B; }

.select2-results__option:disabled {color:#2a3f54!important; font-weight:bold!important;}
.select2-container .select2-selection--single {height:38px!important; line-height:37px!important}
.select2-container--default .select2-selection--single .select2-selection__rendered{line-height:37px!important}
.select2-container--default .select2-selection--single .select2-selection__arrow {height:34px!important}
#logbox{width:320px}


.alert-primary {
  color: #004085;
  background-color: #cce5ff;
  border-color: #b8daff;
}

.alert-primary hr {
  border-top-color: #9fcdff;
}

.alert-primary .alert-link {
  color: #002752;
}

.alert-secondary {
  color: #383d41;
  background-color: #e2e3e5;
  border-color: #d6d8db;
}

.alert-secondary hr {
  border-top-color: #c8cbcf;
}

.alert-secondary .alert-link {
  color: #202326;
}

.alert-success {
  color: #155724;
  background-color: #d4edda;
  border-color: #c3e6cb;
}

.alert-success hr {
  border-top-color: #b1dfbb;
}

.alert-success .alert-link {
  color: #0b2e13;
}

.alert-info {
  color: #fff;
  background-color: #2a3f54;
  border-color: #bee5eb;
}
}

.alert-info hr {
  border-top-color: #abdde5;
}

.alert-info .alert-link {
  color: #062c33;
}

.alert-warning {
  color: #856404;
  background-color: #fff3cd;
  border-color: #ffeeba;
}

.alert-warning hr {
  border-top-color: #ffe8a1;
}

.alert-warning .alert-link {
  color: #533f03;
}

.alert-danger {
  color: #721c24;
  background-color: #f8d7da;
  border-color: #f5c6cb;
}

.alert-danger hr {
  border-top-color: #f1b0b7;
}

.alert-danger .alert-link {
  color: #491217;
}

.alert-light {
  color: #818182;
  background-color: #fefefe;
  border-color: #fdfdfe;
}

.alert-light hr {
  border-top-color: #ececf6;
}

.alert-light .alert-link {
  color: #686868;
}

.alert-dark {
  color: #1b1e21;
  background-color: #d6d8d9;
  border-color: #c6c8ca;
}

.alert-dark hr {
  border-top-color: #b9bbbe;
}

.alert-dark .alert-link {
  color: #040505;
}
.border-primary {
  border-color: #007bff !important;
}

.border-secondary {
  border-color: #6c757d !important;
}

.border-success {
  border-color: #28a745 !important;
}

.border-info {
  border-color: #17a2b8 !important;
}

.border-warning {
  border-color: #ffc107 !important;
}

.border-danger {
  border-color: #dc3545 !important;
}

.border-light {
  border-color: #f8f9fa !important;
}

.border-dark {
  border-color: #343a40 !important;
}

.border-white {
  border-color: #fff !important;
}

.row-striped{padding:8px 0; margin:0 3px}
.row-striped:nth-of-type(odd){
  background-color: #efefef;
}

.row-striped:nth-of-type(even){
  background-color: #ffffff;
}

.arrow-right {
  background-color: #1A2733;
  
  height: 100px;
  left: -53px;
  position: absolute;
  top: -53px;
  width: 100px;
  
  -webkit-transform: rotate(-45deg);
}

/*.arrow-right {
	width: 0; 
	height: 0; 
	border-bottom: 80px solid transparent;

	border-left: 80px solid #444;
  margin-left: 0;
  position: absolute;
  top: 0;
}*/

/*.arrow-right::after {
  background-color: transparent;
  box-shadow: 0 6px 6px 1px black;
  content: "";
  display: block;
  height: 0px;
  left: -102px;
  position: absolute;
  top: 39px;
  width: 115px;

  
  -webkit-transform: rotate(-45deg);
}*/

.arrow-right span {
  color: #f5f5f5;
  font-family: sans-serif;
  font-size: 11px;
  left: 9px;
  top: 65px;
  position: absolute;
  width: 80px;
}
body{width: 100%!important;} .container{width: 100%!important;}.body{width: 100%!important;} .right_col{width: 100%!important;}
.main_container{width: 100%!important;}


