/* ---------------------------------------------Global */
@font-face {
    font-family: HelveticaNeue;
    src: url("fonts/HelveticaNeue.woff2");
}

body {
    font-size: 16px;
    font-family: HelveticaNeue, Arial, sans-serif;
    line-height: 1.4em;
    background-color: #336699;
}

/* --------------------------------------------- Top Bar */
.navbar {
    background-color: #FFF;
    border-width: 0;
    margin-bottom: 0px;
    min-height: unset;
    padding: 0;
}

.navbar-header {
    margin-left: 1px !important;
}

.navbar-header a,
.nav.navbar-nav a {
    margin-top: 10px;
    margin-bottom: 10px;
}

.navbar-brand {
    height: unset;
}

.navbar .navbar-header a:link,
.navbar .navbar-header a:visited,
.navbar .navbar-header a:hover,
.navbar .navbar-header a:focus,
.navbar .navbar-header a:active {
    color: #336699;
	
}

/* --------------------------------------------- Menu */
.navbar-nav>li>a {
    padding: 0;
}

.navbar-brand {
    padding: 0;
    margin-right: 15px;
}

.navbar-inverse .navbar-nav>li>a,
.navbar-inverse .navbar-brand {
    color: #336699;
}

.navbar-inverse .navbar-nav>li>a:hover {
    color: #FFCC33;
    background-color: transparent;
}

.navbar-inverse .navbar-nav>li>a:hover,
.navbar-inverse .navbar-nav>li>a:focus,
.navbar-inverse .navbar-nav>.open>a,
.navbar-inverse .navbar-nav>.open>a:hover,
.navbar-inverse .navbar-nav>.open>a:focus {
    color: #336699;
    background-color: transparent;
}

.nav.navbar-nav .glyphicon {
    margin-right: 5px;
}

/* --------------------------------------------- Menu Dropdown */
.nav.navbar-nav .dropdown-menu {
    background-color: #fff;
    margin-top: -1px;
}

.nav.navbar-nav .dropdown-menu>li>a {
    color: #336699;
    font-size: 16px;
    margin: 0;
}

.nav.navbar-nav .glyphicon.glyphicon-chevron-down {
    display: inline-block;
    top: 3px;
}

.nav.navbar-nav .dropdown a {
    margin-right: 20px;
}

.nav.navbar-nav .dropdown-menu>li>a:hover {
    background-color: #FFCC33;
    color: #fff;
}

.navbar-nav .glyphicon.glyphicon-pencil {
    display: none;
}

/* --------------------------------------------- Logo */

.SchemeLogo {
    background-image: url("images/GKN_blue_yell.png");
    width: 283px;
    height: 141px;
    background-size: 283px 141px;
}
/*
.HeaderImage {
    background-image: url("images/GKN1Logo2.png");
	background-repeat:no-repeat;
	background-position: center center;
}
*/

/* --------------------------------------------- Header */
body>header {
    background-color: #FFF;
    padding: 10px 0;
    margin-bottom: 20px;
}

/* --------------------------------------------- Main */
section.Main {
	background-color:#336699;
	border-style: none;
}

section.Main>div.container>.row {
    padding: 25px;
    background-color: white;
    border-radius: 10px;
}

/* ---------------------------------------------Forms */
section#Notes {
    margin-left: 185px;
    margin-top: 20px;
    font-style: italic;
}

.input-lg {
    font-size: 16px;
}

.form-control:focus {
    border-color: #111;
    box-shadow: none;
}

.btn,
button,
.Button,
a.dt-button {
    border-radius: 17px;
    border-width: 1px;
    padding: 9px 25px;
    text-transform: capitalize;
    min-width: 120px;
    font-size: 15px;
    line-height: 1em;
    margin-bottom: 5px;
}

.btn:focus,
button:focus,
.btn:focus,
.btn:active:focus,
.btn.active:focus,
.btn.focus,
.btn:active.focus,
.btn.active.focus {
    outline: none;
}

/* ---------------------------------------------Table Button */
table .btn,
table button {
    padding: 6px 10px;
    font-size: 14px;
    min-width: unset;
    min-width: 60px;
    border-radius: 12px;
}

Table.GridTable {
    width: 100%;
}


Table.GridTable th,
Table.GridTable td {
    padding: 3px;
}

/* ---------------------------------------------Table */
tbody td,
thead th {
    line-height: 1.2rem;
}

table>thead>tr>th {
    background-color: #336699;
    color: white;
}

table.dataTable thead th,
table.dataTable tfoot th {
    font-weight: normal;
}

table.dataTable thead th,
table.dataTable thead td,
table.dataTable.no-footer {
    border-bottom-width: 0;
}

table.dataTable thead .sorting {
    background-image: url("images/sort_both.png")
}

table.dataTable thead .sorting_asc {
    background-image: url("images/sort_asc.png")
}

table.dataTable thead .sorting_desc {
    background-image: url("images/sort_desc.png")
}

Table .btn-link {
    color: #fd3621;
}

Table .btn-link:hover,
Table .btn-link:focus,
Table .btn-link:active {
    color: #FFCC33;
}

/* --------------------------------------------- Primary Button*/
.btn-primary,
a.dt-button,
a.dt-button:not(.disabled) {
    background-color: #336699;
    border-color: #336699;
    color: #fff;
    background-image: none;
    text-align: center;
    outline: none;
    background-image: none;
    text-decoration: none;
}

.btn-primary:hover,
a.dt-button:hover,
a.dt-button:hover:not(.disabled) {
    background-color: #FFCC33;
    border-color: #FFCC33;
    color: fff;
    outline: none;
    background-image: none;
    text-decoration: none;
}

.btn-primary:active,
a.dt-button:active,
a.dt-button:active:not(.disabled),
a.dt-button:active:not(.disabled):hover:not(.disabled) {
    background-color: #336699;
    border-color: #336699;
    color: #fff;
    box-shadow: 0 0 0 0px #ffe5b1;
    outline: none;
    background-image: none;
    text-decoration: none;
}

.btn-primary:active:hover,
a.dt-button:active:hover,
a.dt-button:active:hover:not(.disabled) {
    background-color: #FFCC33;
    border-color: #FFCC33;
    color: #fff;
    box-shadow: 0 0 0 0px #ffe5b1;
    outline: none;
    background-image: none;
    text-decoration: none;
}

.btn-primary:focus,
a.dt-button:focus,
a.dt-button:focus:not(.disabled) {
    background-color: #FFCC33;
    border-color: #FFCC33;
    color: #fff;
    box-shadow: 0 0 0 0px #262626 outline: none;
    background-image: none;
    text-decoration: none;
}

.btn-primary:active:focus,
a.dt-button:active:focus,
.btn-primary:active:focus:not(.disabled) {
    background-color: #FFCC33;
    border-color: #FFCC33;
    color: #fff;
    box-shadow: 0 0 0 3px #ffe5b1;
    outline: none;
    background-image: none;
    text-decoration: none;
}

/* ---------------------------------------------DisabledButton */
.btn-primary[disabled],
.btn-primary[disabled]:hover,
.btn-primary[disabled]:active .btn-primary[disabled]:focus {
    background-color: #a1a1a1;
    border-color: #a1a1a1;
    color: #white;
    box-shadow: 0 0 0 0px #262626;
    outline: none;
    background-image: none;
}

/* --------------------------------------------- Cancel Button */
button.Cancel {
    background-color: white;
    border-color: #262626;
    color: #262626;
}

/* --------------------------------------------- Paginate Button */
.paginate_button,
.paginate_button:hover,
.paginate_button:focus,
.paginate_button:active,
.paginate_button:visited,
.dataTables_wrapper .dataTables_paginate .paginate_button:active,
.dataTables_wrapper .dataTables_paginate .paginate_button.current,
.dataTables_wrapper .dataTables_paginate .paginate_button:hover {
    background-image: none !important;
    background: #fff;
    box-shadow: none;
    outline: none;
    color: #262626 !important;
}

/* ---------------------------------------------Inputs*/
.dataTables_wrapper .dataTables_filter input {
    border: 1px solid #ccc;
    border-radius: 3px;
    padding: 3px 6px;
    font-weight: normal;
    font-size: 14px;
}

.dataTables_wrapper .dataTables_filter input:focus-visible {
    outline: none;
    border: 1px solid #262626;
}

/* --------------------------------------------- Calendar Global and Header Element*/
.ui-datepicker  {
	padding: 0;
}

.ui-datepicker .ui-widget-header {
    background-color: #336699;
    border-width: 0;
	border-radius: 0;
}

.ui-datepicker .ui-widget-header .ui-datepicker-prev.ui-state-hover {
    background-color: #336699;
    top: 2px;
    right: 1px;
    border-width: 0;
    cursor: pointer;
}

.ui-datepicker .ui-widget-header .ui-datepicker-next.ui-state-hover {
    background-color: #336699;
    border-width: 0;
    cursor: pointer;
    top: 2px;
}

.ui-datepicker .ui-datepicker-prev,
.ui-datepicker .ui-datepicker-next {
    background-size: 17px 17px;
    background-repeat: no-repeat;
    background-position: center center;
}

.ui-datepicker .ui-datepicker-prev {
    background-image: url("images/cal-chevron-left.png");
}

.ui-datepicker .ui-datepicker-next {
    background-image: url("images/cal-chevron-right.png");
}

.ui-datepicker-month,
.ui-datepicker-year {
padding: 2px 5px;
}

/* --------------------------------------------- Calendar Main Element*/
.ui-datepicker td span, 
.ui-datepicker td a {
	padding: 5px;
}

.ui-datepicker .ui-widget-content .ui-state-default {
    border-width: 0;
    background-color: #b0b0b0;
}

.ui-datepicker td {
    padding: 1px;
    background-color: white;
}


 .ui-widget-content .ui-state-hover {
    background-color: #FFCC33;
	color: white;
}

.ui-state-active,
.ui-widget-content .ui-state-active,
.ui-widget-header .ui-state-active,
a.ui-button:active,
.ui-button:active,
.ui-button.ui-state-active:hover {
    background-color: #FFCC33;
    border-color: #FFCC33;
    color: white;
}

.ui-state-highlight,
.ui-widget-content .ui-state-highlight,
.ui-widget-header .ui-state-highlight {
    background-color: #336699;
    color: #ffffff;
}

/* --------------------------------------------- Page Specific */
form[name="login"] {
    margin-top: 40px;
}

form[name="login"] p:first-of-type {
    font-weight: 700;
    font-size: 22px;
    margin-bottom: 30px;
}

#membertable_filter,
#xportable_filter {
    margin-bottom: 15px;
}

form[action="pendemo_new.cfm"]>p {
    margin-top: 10px;
    font-weight: bold;
    margin-bottom: 15px;
    font-size: 18px;
}

section.col-xs-12.cold-sm-10.col-md-8 > header + section + section {
	margin-left: 185px;
}

/* --------------------------------------------- Media Queries */
@media (max-width: 1199px) {
	section.col-xs-12.cold-sm-10.col-md-8 > header + section + section {
	margin-left: 155px;
}
}

@media (max-width: 991px) {
	section.col-xs-12.cold-sm-10.col-md-8 > header + section + section {
	margin-left:170px;
}
}

@media (max-width: 767px) {
    .Main {
        padding: 10px;
    }

    .SchemeLogo {
        margin-left: 10px;
    }

    form[name="login"] p:first-of-type {
        margin-bottom: 10px;
    }

    section#Notes {
        margin-left: 0;
    }
	
	section.col-xs-12.cold-sm-10.col-md-8 > header + section + section {
	margin-left: 0;
}
}

/* ---------------------------------------------Headings */
h1 {
    font-weight: 700;
    font-size: 22px;
    margin-bottom: 30px;
    margin-top: 0;
}

/* ---------------------------------------------Messages*/
.SchemeMsgs {
    display: block;
    background-color: #f2dede;
    padding: 12px 16px;
    font-weight: 400;
    margin: 15px 0;
    border-radius: 6px;
	color: #a94442;
}

div.SchemeMsgs>p.SchemeMsgs {
    padding: 0;
    margin: 0;
}

/*--------------------------- Password meter styling updated*/
meter[value="1"]::-webkit-meter-optimum-value {
    background: red;
}

meter[value="2"]::-webkit-meter-optimum-value {
    background: yellow;
}

meter[value="3"]::-webkit-meter-optimum-value {
    background: orange;
}

meter[value="4"]::-webkit-meter-optimum-value {
    background: green;
}

meter[value="1"]::-moz-meter-bar {
    background: red;
}

meter[value="2"]::-moz-meter-bar {
    background: yellow;
}

meter[value="3"]::-moz-meter-bar {
    background: orange;
}

meter[value="4"]::-moz-meter-bar {
    background: green;
}

.alert {
    margin-bottom: 0;
}

/*---------------------------- meter styling for Chrome */
meter {width:130px;}



.feedback {display: block}


.btn.btn-default {
	background-color: #336699;
	border-radius: 3px 3px 0 0;
}

.btn.btn-default:active,
.btn.btn-default:hover,
.btn.btn-default:focus {
	background-color: #FFCC33;
	box-shadow: none;
	border-color: #FFCC33;
	
}



/*---------------------------- meter styling for Chrome
meter {
    width: 100%;
    display: inline-block;
    background: #eeeeee;
    appearance: none;
    -moz-appearance: meter;
    -webkit-appearance: meter;
    height: 0.5em;
    margin: 0 auto 1em;
}


meter::-webkit-meter-bar {
    background: #eeeeee;
    box-shadow: none;
    border-radius: 0;
    border-width: 0;
    height: 0.5em;
}
 */
/* ----------------------------- IE11 meter fix */
@media all and (-ms-high-contrast:none) {
    meter {
        display: none !important;
    }
}