html { height: 100%; }

body { 
    margin: 0;
    height: 100%;
    
    position: relative;
    left:0;
    
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.container {
    min-width: 1044px;
    font-family: "Oswald", Arial, sans-serif;
    margin-bottom: 20px;
}

.open-menu {
    left: 303px;
    overflow-x: hidden;
}

.temp-bg {
    position: fixed;
    left: 50%;
    margin-left: -700px;
    top: 0; 
    z-index:-1;
    
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.move-bg {
    left: 239px;
    margin: 0;
}

.global-nav {
    min-width: 1044px;
    width: 100%;
    top: 0;
    left: 0;
    height: 26px;
    line-height: 26px;
    font-weight: normal;
    color: #DC090B;
    text-align: center;
    text-transform: uppercase;
    background: #161616;
    margin: 0 auto;
}

.global-nav span a { 
    color: #dd000f; 
    opacity: 1;
}

.global-nav a { 
    color: #fff;
    text-decoration: none;
    margin: 0 8px;
    opacity: 0.8;
}

.global-nav a:hover {
    opacity: 1;   
}

.nav0 {
    position: absolute;
    left: 5px;
    z-index: 100;
    opacity: 1;
    top: 0;
    min-width: 
}

.nav0 .logo {
    position: absolute;
    left: 5px;
    top: 58px;
}

.nav1 .nav-btn {
    position: absolute;
    left: 30px;
    top: 14px;
    color: #fff;
    text-decoration: none;
    text-transform: uppercase;
    font-size: 14px;
    margin: 0 10px;
    opacity: 1;
    
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.move-nav-btn {
    left: -50px !important;
}

.nav1 .nav-btn:before {
    content: "\f0c9";
    font-family: FontAwesome;
    font-style: normal;
    font-weight: normal;
    text-decoration: inherit;
    color: #fff;
    font-size: 18px;
    position: absolute;
    left: -25px;
    top: 0px;
}

.open-menu .nav1 .nav-btn:before {
	content: "\f00d";
}

.nav-side ul.primary a.submenu:after {
    content: "\f078";
    font-family: FontAwesome;
    font-style: normal;
    font-weight: normal;
    text-decoration: inherit;
    color: #fff;
    font-size: 18px;
    float:right;
}

.nav-side ul.primary a.submenu.open:after {
    content: "\f077";
}

.nav1 {
    background: #000000;
    margin: 0 auto;
    text-align: center;
    display: block;
    padding: 12px 0;
    position: relative;
}

.nav1 .container {
    margin: 2px 185px 0 90px;
    min-width: inherit;
    max-height: 18px;
    overflow-y: visible;
}

.nav1 a {   
    color: #fff;
    text-decoration: none;
    text-transform: uppercase;
    font-size: 17px;
    margin: 0px 14px;
    opacity: 0.8;
    display: inline-block;
    line-height: 18px;
}

.nav1 a:hover {
    opacity: 1;   
}

.nav1 .search {
    width: 0;
    text-align: left;
    top: 10px;
    background: #000;
    position: absolute;
    opacity: 1;
    right: 210px;
    cursor: pointer;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.expand-search {
    width: 71% !important; 
    border-bottom: 1px solid #fff;
}

.nav1 .search input {
    background: #000;
    border: none;
    color: #fff;
    text-transform: uppercase;
    font-family: "Oswald", Arial, sans-serif;
    font-size: 14px;
    border-bottom: none;
    width: 100%;
    outline: none;
}

.nav1 .search i {
    content: "\f002";
    font-family: FontAwesome;
    font-style: normal;
    font-weight: normal;
    text-decoration: inherit;
    color: #fff;
    font-size: 20px;
    position: absolute;
    top: 3px;
    display: block;
    right: -28px;
    opacity: 1;
}

.nav1 .search.expand-search i  {
    content: "\f00d";
}


.nav1 .social {
    position: absolute;
    right: 7px;
    display: block;
    top: 7px;
}

.nav1 .social a {
    position: relative;
    border-radius: 50%;
    width: 30px;
    height: 30px;
    display: inline-block;
    text-align: center;
    margin: 0px 4px;
    opacity: 0.9;
}

.nav1 .social a:hover {
    opacity: 1;
}

.nav1 .social a:before {
    font-family: FontAwesome;
    font-style: normal;
    font-weight: normal;
    text-decoration: inherit;
    color: #fff;
    font-size: 14px;
    position: absolute;
    left: 0px;
    top: 6px;
    display: block;
    right: 0px;
}

.nav1 .social .ico-facebook { background: #3b5998; }
.nav1 .social .ico-twitter { background: #4197cc; }
.nav1 .social .ico-google { background: #527fa4; } /* #dd4b39 */
.nav1 .social .ico-youtube { background: #d61827; }

.nav1 .social .ico-facebook:before { content: "\f09a"; }
.nav1 .social .ico-twitter:before { content: "\f099"; }
.nav1 .social .ico-google:before { content: "\f16d"; } /* \f0d5 */
.nav1 .social .ico-youtube:before { content: "\f16a"; }

.featured {
	background: #d6d6d6;
    position: relative;
    margin: 0 auto;
    overflow: hidden;
    height: 110px;
     font-family: Arial, Helvetica, sans-serif;
}

.featured .bx-wrapper {
    max-width: none !important;   
    padding-right: 40px;
    padding-left: 300px;
}

.featured .bx-pager {
    display:none;   
}

.featured ul {
    text-align: left;
    display: block;
    height: 110px;
    margin-left: 280px;
}

.featured li {
    display: inline-block;
    text-align: left;
    margin-right: 0;
    height: 110px;
    padding-right: 0;
    width: 226px !important;
    margin-right: 10px;
}

.featured li a {
    opacity: 1;
    display: table;
    width:235px;
    margin: 0;
    padding: 0;
}

.featured li:hover a {
    opacity: 0.8;
}

.featured li img {
    background: #ccc;
    width: 90px;
    height: 90px;
    display: table-cell;
    vertical-align: middle;
    margin: 0;
    padding: 0;
}

.featured li p {
    width: 145px;
    font-size: 14px;
    margin: 0 0 0 15px;
    color: #000;
    display: table-cell;
    vertical-align: middle;
    padding: 0 15px 0 6px;
    font-family: "Oswald", Arial, sans-serif;
}

.featured .controls {
    background: #fff;
    position: absolute;
    right: 0;
    width: 40px;
    height: 100%;
    top: 0;
}

.featured .controls a {
    position: relative;
    display: block;
    width: 45px;
    height: 56px;
    color: #000;
    text-indent: 50px;
}

.featured .controls a:hover:before {
    color: #dc000e;
}

.featured .controls a:before {
    font-family: FontAwesome;
    font-style: normal;
    font-weight: normal;
    color: #000;
    font-size: 24px;
    position: absolute;
    display: block;
    top: 15px;
    left: 0px;
    right: 0;
    text-align: center;
    margin: 0 auto;
    text-decoration: none;
    text-indent: 0px;
}

.featured .controls .arrow-left:before {
    content: "\f104";   
}

.featured .controls .arrow-right:before {
    content: "\f105";   
}



.nav-side {
    position: absolute;
    background: #000;
    margin: 0;
    padding: 0 20px 30px 20px;
    color: #fff;
    z-index: 2000;
    min-height: 100%;
    /*left: -267px;*/
    display: none;
}

.nav-side .search input[type=text] {
    width: 100%;
    max-width:246px;
    box-sizing: border-box;
    background: #000;
    border: none;
    border-bottom: 1px solid #fff;
    padding: 0 0 8px;
    margin: 15px 0 20px 0;
    outline: none;
    color: #fff;
    font-family: "Oswald", Arial, sans-serif;
    font-size: 14px;
    text-transform: uppercase;
}

.nav-side .search {
    position: relative;
}

.nav-side .search:after {
    content: "\f002";
    font-family: FontAwesome;
    font-style: normal;
    font-weight: normal;
    text-decoration: inherit;
    color: #fff;
    font-size: 16px;
    position: absolute;
    top: 17px;
    display: block;
    right: 10px;
    opacity: 1;
}

.nav-side ul {
    font-family: "Oswald", Arial, sans-serif;
    list-style: none;
    padding: 0;
    margin: 0;   
}

.nav-side ul li {
    text-transform: uppercase;
    font-size: 14px;
    line-height: 35px; 
}


.nav-side ul.last {
    margin-top: 10px;   
}

.nav-side ul.last li {
    font-size: 10px;
    line-height: 24px;
}


.nav-side ul li a {
    color: #fff;
    opacity: 0.8;
    text-decoration: none;
}

.nav-side ul li a:hover {
    opacity: 1;
}

.nav-side > .primary > li > span {
    color:#dc000e;
    opacity:1;
}
.nav-side > .primary > li > span.close:after {
	content: "\f067";
    font-family: FontAwesome;
    font-style: normal;
    font-weight: normal;
    text-decoration: inherit;
    color: #F1EE3E;
    font-size: 18px;
    float: right;
}

.nav-side > .primary > li > span.open:after {
	content: "\f068";
	font-family: FontAwesome;
    font-style: normal;
    font-weight: normal;
    text-decoration: inherit;
    color: #F1EE3E;
    font-size: 18px;
    float: right;
    cursor: pointer;
}

.navigation.nav-side span.icon {
    position: absolute;
    left:0;
}

.nav-side > .primary > li > ul li:last-child {
    margin-bottom: 0;   
}

.nav-side .secondary {
    display: none;
}
ul.secondary {
    padding-left: 25px;
}
.nav-side .secondary li {
    line-height: 35px;   
}

.nav-side .secondary li a {

}

.nav-side .close-btn {
    position: absolute;
    top: 10px;
    right: 10px;
    cursor: pointer;
    opacity: 1;
    background: url('../images/ico-close.svg') no-repeat;
    stroke: #fff;
    width: 25px;
    height: 25px;
    background-size: contain;
}

.nav-side .close-btn:hover {
    opacity: 0.8;
}



div.container > div.section.nav0 > a.logo {
    position: absolute;
    top: 60px;
    left: 0px;
    width: 276px;
    height: 118px;
    background: url('../images/joblo-logo-2016.png') top left no-repeat;
}
div.container > div.section.nav0 > a.blurb-of-the-day.today {
    left: 160px;
    position: absolute;
    top: 74px;
}
/**

.nav-side .close-btn:before {
    content: "\f00d";
    font-family: FontAwesome;
    font-style: normal;
    font-weight: normal;
    color: #fff;
    font-size: 18px;
    position: absolute;
    display: block;
    text-align: right;
}

**/



/* Navigation Menu - Background */
.navigation {
  /* critical sizing and position styles */
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 999;
  max-width: 263px;
  overflow: auto;
}


.navigation::-webkit-scrollbar {
    width: 12px;
}

.navigation::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); 
    border-radius: 10px;
}

.navigation::-webkit-scrollbar-thumb {
    border-radius: 10px;
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5); 
}


/* Navigation Menu - List items */
.nav-item {
  /* non-critical appearance styles */
  width: 267px;
}

/* Site Wrapper - Everything that isn't navigation */
.site-wrap {
  /* Critical position and size styles */
  min-height: 100%;
  min-width: 100%;
  background: #000000 url(../../../img/redesign-joblo-2012/top/joblo-seamless-bg.jpg) top left repeat;
  position: relative;
  top: 0;
  bottom: 100%;
  left: 0;
  z-index: 1;
}

/* Nav Trigger */
.nav-trigger {
  /* critical styles - hide the checkbox input */
  position: absolute;
  clip: rect(0, 0, 0, 0);
}

label[for="nav-trigger"] {
  /* critical positioning styles */
  position: fixed;
  left: 15px; top: 15px;
  z-index: 2;
  
}

/* Make the Magic Happen */
.nav-trigger + label, .site-wrap {
  transition: left 0.2s;
}

.nav-trigger:checked ~ .site-wrap {
  left: 303px;
  box-shadow: 0 0 5px 5px rgba(0,0,0,0.5);
}

body {
    /* Without this, the body has excess horizontal scroll when the menu is open */
  overflow-x: hidden;
}

.stick {
    margin-top: 0 !important;
    position: fixed;
    top: 0;
    z-index: 10000;
    width: 100%;
    display: inline-block;
    height: 23px !important;
}

ul.primary > li > ul.close {
	display: none;
}

.nav-side ul li a.red {
	color: #dc000e !important;
	opacity: 1 !important;
}
#main-rollover {
	position: absolute;
    width: 100%;
    height: auto;
    background-color: #FFF;
    z-index: 99;
    top: 44px;
    font-size: 0;
    display: none;
    padding-bottom: 20px;
}
#main-rollover .item-spacer-logo {
 display: inline-block;
    vertical-align: top;
    width: 223px;

}
#main-rollover .container-main-rollover
{
	width: 100%;
	max-width: 1534px;
}
#main-rollover .item {
	display: inline-block;
	width: 165px;
	vertical-align: top;
}
#main-rollover .item h3 {
	margin-bottom: 8px;
}
#main-rollover .item h3 a {
	font-size: 16px;
	color:#dc000e;
	opacity: 1 ;
}
#main-rollover .item h3 a:hover {
	opacity: 0.8;
}
#main-rollover .item .block {
	display: inline-block;
}

	
#main-rollover .item .block a  {
	opacity: 1 ;
}
#main-rollover .item .block a:hover  {
	opacity: 0.8 ;
}
#main-rollover .item .block a img {
	display: block;
	vertical-align: top;
}
#main-rollover .item .block a.more {
	color: #dc000e;
    font-size: 12px;
    width: 115px;
    height: 100%;
    display: block;
    vertical-align: top;
    margin: 0 14px;
    text-align: center;
    line-height: 30px;
}

/* image with text
#main-rollover .item .feature {
	display: inline-flex;
}
#main-rollover .item .feature img {
	width: 73px;
	height: 100%;
	display: inline-block;
	vertical-align: top;
}
#main-rollover .item .feature .content {
	display: inline-block;
	vertical-align: top;
}
#main-rollover .item .feature .content span.title {
	color: #000;
    font-size: 12px;
    display: block;
    text-align: left;
    padding: 0 14px 5px;
}
#main-rollover .item .feature a {
	color:#dc000e;
	font-size: 12px;
	display: block;
	text-align: left;
}
*/

.nav1 a.sub-nav {
	
}

.nav1 a.sub-nav.open {
    color: #dc000e;
    opacity: 1;
    position: relative;
}

.nav1 a.sub-nav.open:after {
    content: "";
    position: absolute;
    top: 24px;
    left: 50%;
    margin-left: -3px;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 6px 8px 6px;
    border-color: transparent transparent #fff transparent;
    z-index: 9999;
}

/********** fix complex background ads ***********/
div#cmn_dynBg_lt,
div#cmn_dynBg_rt {
    top: 180px !important;
}

div#cmn_dynBg_lt.stick,
div#cmn_dynBg_rt.stick {
    top: 47px !important;
}


#mh_gallery .container {
    min-width: inherit !important;
}


@media (max-width: 900px) {
	.nav1.stick .container  {
	    visibility: hidden !important;
	}
}