body {font-family: Lato, sans-serif !important;}

h1 {
    font-family: "Futura";
    font-style: normal;
    font-weight: 400;
}

h2 {
    font-family: "Futura";
    font-style: normal;
    font-weight: 400;
}

/*HKP icons*/
@font-face {
    font-family: 'hkp-icons';
    src:  url('../fonts/hkp-icons/hkp-icons.eot?7eoy33');
    src:  url('../fonts/hkp-icons/hkp-icons.eot?7eoy33#iefix') format('embedded-opentype'),
    url('../fonts/hkp-icons/hkp-icons.ttf?7eoy33') format('truetype'),
    url('../fonts/hkp-icons/hkp-icons.woff?7eoy33') format('woff'),
    url('../fonts/hkp-icons/hkp-icons.svg?7eoy33#icomoon') format('svg');
    font-weight: normal;  font-style: normal;
}

[class^="icon-"], [class*=" icon-"] {
    font-family: 'hkp-icons' !important;
    speak: none;
    font-style: normal;font-weight: normal;font-variant: normal;
    text-transform: none;line-height: 1;
    /* Better Font Rendering */
    -webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;
}

.icon-truck:before {content: "\e901";}
.icon-trailer:before {content: "\e900";}

.bg-hkp-blue {
    background-color: #0068A0;
    color: white;
}

.brand > span {
    color: black;
    font-style: italic;
    font-family: 'Futura', sans-serif !important;
}

.brand > span > strong{
    color: black;
    font-style: italic;
    font-family: 'Futura', sans-serif !important;
    font-weight: 700;
}

.panel-title > a {
    color: black !important;
}

.pageheader {margin-bottom: 0;right:10px;}
.pageheader h2 {margin-bottom: 8px;font-size: 28px;}

.page {
    padding: 10px 2px 10px 10px;
}

.row {
    margin-right: 0;
    margin-left: 0;
}

.tile {
    margin-bottom: 10px;
}

.nopad {
    padding:0 0 0 0;
}

.modal-body {
 margin-left: 20px;
 margin-right: 10px;
}

.col-md-1,.col-md-2,.col-md-3,.col-md-4,.col-md-5,.col-md-6,.col-md-7,.col-md-8,.col-md-9,.col-md-10,.col-md-11,.col-md-12,
.col-sm-1,.col-sm-2,.col-sm-3,.col-sm-4,.col-sm-5,.col-sm-6,.col-sm-7,.col-sm-8,.col-sm-9,.col-sm-10,.col-sm-11,.col-sm-12,
.col-xs-1,.col-xs-2,.col-xs-3,.col-xs-4,.col-xs-5,.col-xs-6,.col-xs-7,.col-xs-8,.col-xs-9,.col-xs-10,.col-xs-11,.col-xs-12 {
    padding-left: 0;
    padding-right: 10px;
}

.page-core {
    background-color: rgba(255, 255, 255, 0.5); !important;
}

.btn-lightred {
    background-color: #E1343F !important;
}

#header .nav-right > li > a,
#header .nav-left > li > a {
    color: rgba(0, 0, 0, 0.7);
}

#header .nav-right > li > a:hover,
#header .nav-left > li > a:hover {
    color: #E1343F !important;
}

#header .search .form-control {
    color: black !important;
    border-color: rgba(0, 0, 0, 0.2);
}

#header .search .form-control::-webkit-input-placeholder {
    color: rgba(0, 0, 0, 0.3);
}

#header .search .form-control::-moz-placeholder {
    color: rgba(0, 0, 0, 0.3);
}

#header .search .form-control:-moz-placeholder {
    color: rgba(0, 0, 0, 0.3);
}

#header .search .form-control:-ms-input-placeholder {
    color: rgba(0, 0, 0, 0.3);
}

#header .search .form-control:focus {
    border-color: black !important;
}

#header .search .form-control:focus::-webkit-input-placeholder {
    color: black !important;
}

#header .search .form-control:focus::-moz-placeholder {
    color: black !important;
}

#header .search .form-control:focus:-moz-placeholder {
    color: black !important;
}

#header .search .form-control:focus:-ms-input-placeholder {
    color: black !important;
}

#header .search:after {
    color: rgba(0, 0, 0, 0.3);
}

#header .branding .brand {
    color: #4a555b;
    background-image: url(../images/hkp-logo.png);
}

#sidebar accordion .panel-group .panel > .panel-heading .panel-title,
#sidebar #sidebar-wrap:before accordion .panel-group .panel > .panel-heading .panel-title {
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

#sidebar accordion .panel-group .panel > .panel-heading .panel-title > a,
#sidebar #sidebar-wrap:before accordion .panel-group .panel > .panel-heading .panel-title > a {
    color: black;
}

#sidebar accordion .panel-group .panel > .panel-heading .panel-title > a:hover,
#sidebar #sidebar-wrap:before accordion .panel-group .panel > .panel-heading .panel-title > a:hover {
    color: rgba(0, 0, 0, 0.8);
}

#sidebar accordion .panel-group .panel.closed > .panel-heading,
#sidebar #sidebar-wrap:before accordion .panel-group .panel.closed > .panel-heading {
    background-color: rgba(0, 0, 0, 0.05);
}

#sidebar accordion .panel-group .panel.closed > .panel-heading .panel-title > a,
#sidebar #sidebar-wrap:before accordion .panel-group .panel.closed > .panel-heading .panel-title > a {
    color: rgba(0, 0, 0, 0.8);
}

#sidebar accordion .panel-group .panel.closed > .panel-heading .panel-title > a:hover,
#sidebar #sidebar-wrap:before accordion .panel-group .panel.closed > .panel-heading .panel-title > a:hover {
    color: #333333;
}

#sidebar accordion .panel-group .panel .panel-body,
#sidebar #sidebar-wrap:before accordion .panel-group .panel .panel-body {
    color: #E1343F !important;
}

#sidebar .summary .media .media-body,
#sidebar #sidebar-wrap:before .summary .media .media-body {
    color: rgba(0, 0, 0, 0.3);
}

#sidebar .summary .media .media-body .media-heading,
#sidebar #sidebar-wrap:before .summary .media .media-body .media-heading {
    color: black !important;
}

li.open > a, li:hover > a {color: #0067A6;text-decoration: none;}

#sidebar #navigation > li.open > i,
#sidebar #navigation > li:hover > i {
    color: rgba(0, 0, 0, 0.7);
}

.dataTables_wrapper table.table-custom > thead td.sorting:hover,
.dataTables_wrapper table.table-custom > thead th.sorting:hover {
    color: #E1343F;
    border-color: #E1343F;
    background-color: #fafafa;
}

#sidebar #navigation > li.active > a {
    background-color: #355F8E;
    color: white;
}

#sidebar #navigation > li.active > i {
    color: white;
}

#sidebar #navigation > li a {
    color: black;
}

#sidebar #navigation .dropdown > ul {
    background-color: rgba(0, 0, 0, 0.1);
}

#sidebar #navigation .dropdown > ul li:hover > a,
#sidebar #navigation .dropdown > ul li.active > a {
    color: #E1343F;
}

#sidebar #navigation .submenu.open > a {
    color: rgba(0, 0, 0, 0.7) !important;
}

#sidebar #navigation .submenu > ul {
    background-color: transparent;
}

#navigation > li.active > a {
    background-color: #355F8E;
}

#loading-bar .bar {
    background-color: #355F8E;
}

#loading-bar-spinner .spinner-icon {
    border-top-color: #355F8E;
    border-left-color: #355F8E;
}

#loading-bar .peg {
    -webkit-box-shadow: #355F8E 1px 0 6px 1px;
    box-shadow: #355F8E 1px 0 6px 1px;
}

#navigation .dropdown > ul li:hover a,
#navigation .dropdown > ul li.active a {
    color: #E1343F;
}

.pageheader .page-bar .page-breadcrumb > li:not(:first-child) > a:hover {
    color: #E1343F;
}

.sidebar-sm #sidebar,
.sidebar-xs #sidebar,
.hz-menu #sidebar {
    border-right: 0;
}

.sidebar-sm #sidebar #navigation,
.sidebar-xs #sidebar #navigation,
.hz-menu #sidebar #navigation {
    border-right: 0;
}

.sidebar-sm #sidebar #navigation li > a,
.sidebar-xs #sidebar #navigation li > a,
.hz-menu #sidebar #navigation li > a {
    font-weight: 400;
}

/*Vertically aligned modals*/
.modal-center {text-align: center;}
@media screen and (min-width: 768px) {
    .modal-center:before {display: inline-block;vertical-align: middle;content: " ";height: 100%;}
}
.modal-center .modal-dialog {display: inline-block;text-align: left;vertical-align: middle;}

/*Outdated browser styles*/
#outdated {
    display:none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 170px;
    text-align: center;
    text-transform: uppercase;
    z-index: 1500;
    /*color: #fff;*/
    background-color: #ed9b40;
}

#outdated #btnUpdateBrowser {
    display: block;
    position: relative;
    padding: 10px 20px;
    margin: 30px auto 0;
    color:inherit;
    width: 230px;
    text-decoration: none;
    border: 2px solid #fff;
    background-color: #ffe5d5;
    cursor: pointer
}

#outdated #btnUpdateBrowser:hover {
    color: #f25648;
    background-color: #fff
}

#outdated .last {
    position: absolute;
    top: 10px;
    right: 25px;
    width: 20px;
    height: 20px
}

#outdated #btnCloseUpdateBrowser {
    display: block;
    position: relative;
    width: 100%;
    height: 100%;
    text-decoration: none;
    color: inherit;
    font-size: 36px;
    line-height: 36px
}

table.table-hover tr:hover td{
    cursor: pointer;
}