/*!
 * Branding CSS for the demo site
 */


/*  HEADER AND FOOTER - Master Page  */

/* Header */
body { color: #000; font-family: 'Roboto', sans-serif; }
nav.navbar-default { background-color: #fff; color: #000; font-size: 0.9em; font-weight: 300; }
.navbar-brand img { max-width: 150px; }
.navbar-header { width: 100%; }
.navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:hover, .navbar-default .navbar-nav > .active > a:focus { background-color: #fff; }
nav.navbar-default ul.nav li a { padding: 10px 15px; text-decoration: none; }
nav.navbar-default ul.nav li.active a { border-bottom: 5px solid #fcbb00; font-weight: 700; }
nav.navbar-default ul.nav li:hover a { border-bottom: 5px solid #fcbb00; color: #000; }

nav.navbar-default ul.nav li.langactive a { border-bottom: 5px solid #fcbb00; cursor: none; }
nav.navbar-default ul.nav li.langdisabled a img { opacity: 0.3; }
nav.navbar-default ul.nav li.langdisabled a:hover img { opacity: 1; }

.breadcrumbs { background-color: #e8e8e8; border-top: 2px solid #000; box-shadow: inset 0 10px 10px -10px #9F9FA3; font-weight: 300; margin-top: -2px; padding: 5px 0px; }

.UserProfileBtn { display: block; font-weight: bold; position: absolute; top: 20px; right: 50px; z-index: 999999; }
.UserProfileBtn .glyphicon { color: #72aeab; font-size: 1.5em; }
.UserProfileBtn a { color: #777; display: block; }
.UserProfileBtn a:hover .glyphicon { color: #fcbb00; }
.UserProfileBtn a:hover { text-decoration: none; }

/* Footer */
.footer { border-top: 3px solid #72aeab; box-shadow: 0 -10px 10px -10px #9F9FA3; color: #000; font-size: 0.9em; font-weight: 300; padding-top: 20px; z-index: 1000; }
.footer a { color: #000; text-decoration: none; }
.footer p { margin: 0px; padding: 0px; }
.footer .copyright { background-color: #e8e8e8; color: #000; margin-top: 10px; padding: 5px 0px; }


/*  KX CONTENT - Content within the Kx frame  */

/* Global */
#PageContent { padding-top: 10em; padding-bottom: 20px; }
#PageContent .Navigation { clear: both; display: block; padding: 20px 30px; }
#PageContent .btn { border-radius: 0px; color: #fff; min-width: 100px; }
#PageContent .btn:hover { color: #000; }
#PageContent .btn-default { color: #888; min-width: 100px; }
#PageContent .btn-default:hover { color: #888; }
#PageContent .btn-primary { background-color: #fcbb00; border: 2px solid #c79400; border-top: none; border-left: none; border-right: none; text-decoration: none; }
#PageContent .btn-primary:hover { background-color: #FDE399; border: 2px solid #c79400; border-top: none; border-left: none; border-right: none; }
#PageContent .btn-secondary { background-color: #72aeab; border: 2px solid #527775; border-top: none; border-left: none; border-right: none; text-decoration: none; }
#PageContent .btn-secondary:hover { background-color: #c6dedd; border: 2px solid #527775; border-top: none; border-left: none; border-right: none; }
#PageContent .btn-tertiary { background-color: #a5ad18; border: 2px solid #63670e; border-top: none; border-left: none; border-right: none; text-decoration: none; }
#PageContent .btn-tertiary:hover { background-color: #dbdea2; border: 2px solid #63670e; border-top: none; border-left: none; border-right: none; }
#PageContent .btn-danger { background-color: #d9534f; border: 2px solid #b42c27; border-top: none; border-left: none; border-right: none; text-decoration: none; }
#PageContent .btn-danger:hover { background-color: #f0b9b8; border: 2px solid #b42c27; border-top: none; border-left: none; border-right: none; }

#PageContent h1 { text-align: center; }
#PageContent h1 img { margin: 0px auto 10px auto; padding: 0 15px; width: 100%; }
#PageContent h1, h2 { color: #303030; font-weight: 700; }
#PageContent h3 { color: #72aeab; font-size: 1.1em; font-weight: 700; }
#PageContent label { color: #444; }
#PageContent a { color: #a5ad18; font-weight: 500; outline: none; text-decoration: underline; }
#PageContent input[type="text"],
#PageContent input[type="password"],
#PageContent textarea,
#PageContent select { border: 1px solid #aaa; color: #333; border-radius: 0px; font-size: 0.9em; resize: none; }

#PageContent input[type="radio"],
#PageContent input[type="checkbox"] { cursor: pointer; }
#PageContent ul { list-style-type: disc; padding: 0 0 0 20px; }
#PageContent .alert { border-radius: 0px; }

#PageContent .jumbotron-primary input[type="text"]:disabled { background-color: #e8e8e8; }

#PageContent .greenText { color: #a5ad18; font-weight: 500; }
#PageContent .glyphicon { color: #a5ad18; font-size: 2em; }
#PageContent .glyphicon:hover { cursor: pointer; }

#PageContent .radioButton { display: block; margin-bottom: 15px; }
#PageContent .radioButton:hover { cursor: pointer; }
#PageContent .radioButton input { display: none; }
#PageContent .radioButton.KxError label { color: #a94442; }
#PageContent .radioButton label { color: #333; display: inline-block; width: 100%; }
#PageContent .radioButton input:hover { cursor: pointer; }
#PageContent .radioButton label:hover { cursor: pointer; }
#PageContent .radioButton label::before { border: 2px solid #333; border-radius: 50%; color: #fff; content: " "; display: inline-block; height: 13px; width: 13px; margin: 3px 10px; float: left; }
#PageContent .radioButton input:checked + label::before { border: 2px solid #a5ad18; background-color: #a5ad18; color: #fff; }

#PageContent .jumbotron-secondary .radioButton label { color: #fff; display: inline-block; width: 100%; }
#PageContent .jumbotron-secondary .radioButton label::before { border: 2px solid #fff; border-radius: 0px; color: #fff; content: " "; display: inline-block; height: 13px; width: 13px; margin: 3px 10px; float: left; }
#PageContent .jumbotron-secondary select,
#PageContent .jumbotron-secondary textarea { background-color: #303030; color: #fff; }

#PageContent .jumbotron-secondary .inductionQuestions .alert-error { background-color: #f2dede; border-color: #ebccd1; border-radius: 0px; color: #a94442; padding: 15px; }

#PageContent .inlineCheckbox label { display: inline-block; float: left; margin-left: 12px; margin-top: 2px; width: 80% !important; }
#PageContent .inlineCheckbox input { cursor: pointer; display: inline-block; float: left; width: 20px; }

#PageContent .socialInput .glyphicon { display: inline-block; margin-right: 5px; }
#PageContent .socialInput input { display: inline-block; width: 80% !important; }

#PageContent .processRating div { text-align: center; }
#PageContent .processRating img { max-width: 50px; }

#PageContent .input-group .input-group-addon { background-color: transparent; border: none; margin: 0; padding: 0 0 0 10px; }
#PageContent .input-group .input-group-addon .fa { color: #72aeab; font-size: 2em; }

#PageContent .noPadding { padding: 0; }

.ui-datepicker { z-index: 5 !important; }

/* Login */
#PageContent .jumbotron h1 { font-size: 28px; }
#PageContent .jumbotron h2 { font-size: 18px; }
#PageContent .jumbotron p { font-size: 1em; }
#PageContent .jumbotron-primary { background-color: #fff; border: 1px solid #aaa; border-radius: 0px; margin-bottom: 15px; padding: 15px 25px; }
#PageContent .jumbotron-primary input[type="text"],
#PageContent .jumbotron-primary select,
#PageContent.Login .jumbotron-primary input[type="password"] { background-color: #fff; }
#PageContent .jumbotron-secondary { background-color: #303030 !important; border-radius: 0px; color: #fff; margin-bottom: 15px; padding: 15px 25px; }
#PageContent .jumbotron-secondary label { color: #fff; margin-top: 0; }
#PageContent .jumbotron-secondary h1,
#PageContent .jumbotron-secondary h2,
#PageContent .jumbotron-secondary h3 { color: #fff; }
#PageContent .jumbotron-secondary input.form-control { background-color: #303030; border: 1px solid #fff; color: #fff; }
#PageContent .jumbotron-secondary input:focus .form-control { border-radius: 0px; }
#PageContent.Login .jumbotron-secondary label { width: 35%; }

/* User Profile */
#PageContent .UserProfile { background-color: #eee; padding: 30px; }
#PageContent .UserProfile .btn { margin-bottom: 20px; }

#PageContent .UserProfile .profilemenu { padding-right: 40px; }
#PageContent .UserProfile .profilemenu .imgWrap { border: 2px solid #72aeab; }
#PageContent .UserProfile .profilemenu .imgWrap img { height: auto; width: 100%; max-height: 240px; }

#PageContent .UserProfile .profilemenu a { color: #888; display: block; padding: 15px; text-decoration: none; }
#PageContent .UserProfile .profilemenu a:first-child { margin-top: 20px; }
#PageContent .UserProfile .profilemenu a.active { color: #fff; background-color: #72aeab; }
#PageContent .UserProfile .profilemenu a:hover { color: #fff; background-color: #72aeab; }
#PageContent .UserProfile .profilemenu a .fa { display: inline-block; text-align: center; padding-right: 25px; width: 40px; }

#PageContent .UserProfile .profilecontent { background-color: #fff; padding: 20px; }

#PageContent .UserProfile .profilecontent .input-group .input-group-addon { border-width: 1px !important; border-style: solid !important; font-size: 1em; min-width: 50px; padding-right: 7px !important; }
#PageContent .UserProfile .profilecontent .input-group .input-group-addon .fa { color: #fff; }
#PageContent .UserProfile .profilecontent .input-group #socialprofile-1 { background-color: #fff; border-color: #aaa; }
#PageContent .UserProfile .profilecontent .input-group #socialprofile-1 .fa { color: #0198E1; }
#PageContent .UserProfile .profilecontent .input-group #socialprofile-2 { background-color: #25D366; border-color: #25D366; }
#PageContent .UserProfile .profilecontent .input-group #socialprofile-3 { background-color: #3b5998; border-color: #3b5998; }
#PageContent .UserProfile .profilecontent .input-group #socialprofile-4 { background-color: #1DA1F2; border-color: #1DA1F2; }
#PageContent .UserProfile .profilecontent .input-group #socialprofile-5 { background-color: #e95950; border-color: #e95950; }
#PageContent .UserProfile .profilecontent .input-group #socialprofile-6 { background-color: #45668e; border-color: #45668e; }
#PageContent .UserProfile .profilecontent .input-group #socialprofile-7 { background-color: #E6162D; border-color: #E6162D; }
#PageContent .UserProfile .profilecontent .input-group #socialprofile-8 { background-color: #bb0000; border-color: #bb0000; }
#PageContent .UserProfile .profilecontent .input-group #socialprofile-9 { background-color: #000; border-color: #000; }


/* Progress bar */
#PageContent .progressBar { font-size: 0.7em; text-align: center; margin-bottom: 15px; }
#PageContent .progressBar div:after { background: #e8e8e8; content: ''; height: 3px; left: 0; position: absolute; top: 2em; z-index: 10; width: 100%; }
#PageContent .progressBar div span { border-bottom: 2px solid; border-radius: 50%; display: block; font-size: 1.3em; margin: 5px auto; padding: 5px 10px; position: relative; width: 30px; z-index: 100; }
#PageContent .progressBar div span.backStep { background-color: #72aeab; border-color: #527775; border-bottom: 2px solid; border-radius: 0%; color: #fff; padding: 8px 10px; }
#PageContent .progressBar div span.backStep + p { text-decoration: underline; }
#PageContent .progressBar div span.disabled { background-color: #e8e8e8; border-color: #9F9FA3; color: #9F9FA3; }
#PageContent .progressBar div span.active { background-color: #fcbb00; border-color: #c79400; color: #fff; }
#PageContent .progressBar div span.active + p { text-decoration: underline; }
#PageContent .progressBar .glyphicon:hover { cursor: default; }

#PageContent .fa-smile-o { color: #a5ad18; }
#PageContent .fa-meh-o { color: #fcbb00; }
#PageContent .fa-frown-o { color: #b42c27; }


/* Contracts */
#PageContent .OfferAccept .jumbotron-primary { min-height: 300px; }
#PageContent .OfferAccept .jumbotron-secondary { min-height: 230px; }

/* Inductions */
#PageContent.inductions { min-height: 650px; }
#PageContent.inductions h1 { text-align: left !important; }

#PageContent.inductions .table.arrivalSlots td { text-align: center; }
#PageContent.inductions .table.arrivalSlots td span[disabled="disabled"]::before { color: red; content: "\e090"; display: block; font-family: 'Glyphicons Halflings'; font-weight: bold; height: 100%; width: 100%; }
#PageContent.inductions .table.arrivalSlots td span[disabled="disabled"] input { display: none; }

#PageContent.inductions iframe { padding: 20px; width: 100%; }
#PageContent.inductions #googlemaps { height: 100%; width: 100%; position: absolute; top: 0; left: 0; z-index: 0; /* Set z-index to 0 as it will be on a layer below the contact form */ }
#PageContent.inductions #googlemaps .gm-bundled-control { display: none; height: 100%; left: 50%; right: 50%; bottom: 0px; z-index: 1000; width: 200px; }
#PageContent.inductions #googlemaps .gm-bundled-control .gm-svpc { margin: 40px; }
#PageContent.inductions .inductionQuestions { padding: 10px; }
#PageContent.inductions .inductionQuestions p { color: #fcbb00; font-weight: bold; margin: 0; padding: 0; }
#PageContent.inductions .inductionQuestions ul { list-style-type: none; padding: 10px 0 0 0; }
#PageContent.inductions .inductionQuestions ul li input { display: none; }
#PageContent.inductions .inductionQuestions ul li label { color: #fff; display: inline-block; font-weight: normal; margin-left: 0; width: 90%; }
#PageContent.inductions .inductionQuestions ul li:hover { cursor: pointer; }
#PageContent.inductions .inductionQuestions ul li:hover input { cursor: pointer; }
#PageContent.inductions .inductionQuestions ul li:hover label { color: #72aeab; cursor: pointer; }


/* Requests */
#PageContent .Requests .requestForm .form-group { display: block; margin: 10px 0; }


@media screen and (max-width: 1000px) {
    #PageContent { padding-top: 13em; }
}

@media screen and (max-width: 991px) {
    #PageContent .jumbotron-primary { min-height: 0px !important; }
}

@media screen and (max-width: 980px) {
    #PageContent .jumbotron-primary { min-height: 0px; }
}

@media screen and (min-width: 980px) {
    #PageContent .setheightJumbotron { min-height: 440px; }
}

@media screen and (max-width: 767px) {
    #PageContent { padding-top: 6em; }
    #PageContent .progressBar div:after { background: none; }
    #PageContent .progressBar div span.backStep { display: none; }
    #PageContent .progressBar div span.backStep + p { display: none; }
    #PageContent .progressBar div span.disabled { display: none; }
    #PageContent .progressBar div span.disabled + p { display: none; }
    #PageContent .progressBar div span.active { display: none; }
    #PageContent .progressBar div span.active + p { display: none; }
    #PageContent .progressBar div span.active.mobileVisible { display: block; }
    #PageContent .progressBar div span.active.mobileVisible + p { display: block; }

    #PageContent .OfferAccept .jumbotron-primary { min-height: 200px; }
    #PageContent .OfferAccept .jumbotron-secondary { min-height: 200px; }
}

@media screen and (max-width: 765px) {
    nav.navbar-default ul.nav li.active a { background-color: #fcbb00; border: none; }
    nav.navbar-default ul.nav li:hover a { background-color: #fcbb00; border-bottom: 0px; }
}


/* KxError */
#PageContent input[type="text"].KxError,
#PageContent input[type="password"].KxError,
#PageContent textarea.KxError,
#PageContent select.KxError { background-color: #f6e9eb; border: 1px solid #a94442; color: #a94442; }
#PageContent input[type="radio"].KxError,
#PageContent input[type="checkbox"].KxError { color: #a94442; }

#PageContent input[type="text"].KxError::-webkit-input-placeholder, 
#PageContent input[type="password"].KxError::-webkit-input-placeholder, 
#PageContent textarea.KxError::-webkit-input-placeholder, 
#PageContent select.KxError::-webkit-input-placeholder { /* Chrome/Opera/Safari */ color: #cb8e8d; }

#PageContent input[type="text"].KxError::-moz-placeholder, 
#PageContent input[type="password"].KxError::-moz-placeholder, 
#PageContent textarea.KxError::-moz-placeholder, 
#PageContent select.KxError::-moz-placeholder { /* Firefox 19+ */ color: #cb8e8d; }

#PageContent input[type="text"].KxError:-ms-input-placeholder, 
#PageContent input[type="password"].KxError:-ms-input-placeholder, 
#PageContent textarea.KxError:-ms-input-placeholder, 
#PageContent select.KxError:-ms-input-placeholder { /* IE 10+ */ color: #cb8e8d; }

#PageContent input[type="text"].KxError:-moz-placeholder, 
#PageContent input[type="password"].KxError:-moz-placeholder, 
#PageContent textarea.KxError:-moz-placeholder, 
#PageContent select.KxError:-moz-placeholder { /* Firefox 18- */ color: #cb8e8d; }