@font-face {
    font-family: 'BebasNeueRegular';
    src: url('fonts/BebasNeue-webfont.eot');
    src: url('fonts/BebasNeue-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/BebasNeue-webfont.woff') format('woff'),
         url('fonts/BebasNeue-webfont.ttf') format('truetype'),
         url('fonts/BebasNeue-webfont.svg#BebasNeueRegular') format('svg');
    font-weight: normal;
    font-style: normal;
}

  scroll-behavior: smooth;

/* CSS reset */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td { 
	margin:0;
	padding:0;
}
html,body {
	margin:0;
	padding:0;
	width:100%;
	background: #444444;
}

body{
	font-family: Constantia, Palatino, "Palatino Linotype", "Palatino LT STD", Georgia, serif;
	font-family: 'PT Sans Narrow';
	background: #444444;
	font-weight: 400;
	font-size: 15px;
	color: #aa3e03;
}

table {
	border-collapse:collapse;
	border-spacing:0;
}
fieldset,img { 
	border:0;
}
input{
	border:1px solid #b0b0b0;
	padding:3px 5px 4px;
	color:#979797;
	width:190px;
}
address,caption,cite,code,dfn,th,var {
	font-style:normal;
	font-weight:normal;
}
ol,ul {
	list-style:none;
}
caption,th {
	text-align:left;
}
h1,h2,h3,h4,h5,h6 {
	font-size:100%;
	font-weight:normal;
}
q:before,q:after {
	content:'';
}
abbr,acronym { border:0;
}
/* General Demo Style */

a{
	text-decoration: none;
}
.container{
	position: relative;
	text-align: center;
}
.clr{
	clear: both;
}
.container > header{
	padding: 30px 30px 10px 20px;
	margin: 0px 20px 10px 20px;
	position: relative;
	display: block;
	text-shadow: 1px 1px 1px rgba(0,0,0,0.2);
    text-align: left;
}
.container > header h1{
	font-family: 'BebasNeueRegular', 'Arial Narrow', Arial, sans-serif;
	font-family: 'PT Sans Narrow';
	font-size: 35px;
	line-height: 35px;
	position: relative;
	font-weight: 400;
	color: #fff;
	text-shadow: 1px 1px 1px rgba(0,0,0,0.3);
    padding: 0px 0px 5px 0px;
}
.container > header h1 span{

}
.container > header h2, p.info{
	font-size: 16px;
	font-style: italic;
	color: #f8f8f8;
	text-shadow: 1px 1px 1px rgba(0,0,0,0.6);
}


/* Header Style */
.site-topbar {
	font-family: Arial, sans-serif;
	line-height: 24px;
	font-size: 11px;
	margin-bottom:-50px;
	height:45px;
	width: 100%;
	background: #8145b1;
	color:#fb9a28;
	opacity: 1;
	text-transform: uppercase;
	z-index: 9999;
	position: relative;
	-moz-box-shadow: 1px 0px 2px #000;
	-webkit-box-shadow: 1px 0px 2px #000;
	box-shadow: 1px 0px 2px #000;
}
.site-topbar a{
	padding: 0px 10px;
	letter-spacing: 1px;
	color: #ddd;
}
.site-topbar a:hover{
	color: #fff;
}


.site-container-wrap {width:100%; max-width:1250px; margin:0 auto; padding:0}
.site-container-wrap-content {width:100%; padding:0 0px; margin:0 auto;}

.site-maincontent-wrap-a {width:100%; max-width:1100px; margin:0 auto; padding:0}

.header-topbar-left1 {width:44%; float:left; display: block; padding:18px 0 0 0; margin:0; text-align:right }
.header-topbar-left2 {display:none}
.header-topbar-center {width:12%; float:left; display: block; padding:0; margin:0; text-align:center}
.header-topbar-right1 {width:44%; float:left; display: block; padding:18px 0 0 0; margin:0; text-align:left}
.header-topbar-right2 {display:none}


/* About Divs*/
.about-section-div-a-inner1 {display:block; float:left; margin:0 auto; padding:100px 20% 100px 20%}
.about-section-div-a-inner2 {padding: 100px 25px 0 25px}

ul.home-about-divs{list-style:none; text-align: left; padding:0; margin:0; width:100%}
ul.home-about-divs li{margin:0;margin-bottom:0;padding-bottom:0;border:0; width:100%; vertical-align:top; text-align:left; overflow:hidden;padding:0;border-bottom:none}
ul.home-about-divs li img{width:100%; max-width:100%; padding-bottom:0; margin-bottom:0; border-bottom:0; display:block}
ul.home-about-divs li:nth-child(1) {display: block;float:left;margin: 0;width: 50%; padding:0;background:url(http://cookingincolco.com/images/fades/fade_black4.png);clear:both}
ul.home-about-divs li:nth-child(2) {display: block;float:left;margin: 0;width: 50%; padding:0;clear:none}


/* Brands Box */
.brand-overview-mobile {display: none}


ul.home-brands-grid{list-style:none; text-align: left; padding:0; margin:0; width:100%}
ul.home-brands-grid li{margin:0;margin-bottom:0;padding-bottom:0;border:0; width:100%; vertical-align:top; text-align:left; overflow:hidden;padding:0;border-bottom:none}
ul.home-brands-grid li img{width:100%; max-width:100%; padding-bottom:0; margin-bottom:0; border-bottom:0;}
ul.home-brands-grid li a {padding:0; margin:0}
ul.home-brands-grid li:nth-child(1) {display: block;float:left;margin: 0 5% 75px 0;width: 30%;  padding:0;}
ul.home-brands-grid li:nth-child(2) {display: block;float:left;margin: 0 5% 75px 0%;width: 30%;  padding:0;}
ul.home-brands-grid li:nth-child(3) {display: block;float:left;margin: 0 0 75px 0%;width: 30%;  padding:0;}
ul.home-brands-grid li:nth-child(4) {display: block;float:left;margin: 0 5% 75px 0;width: 30%;  padding:0}
ul.home-brands-grid li:nth-child(5) {display: block;float:left;margin: 0 5% 75px 0;width: 30%;  padding:0;}
ul.home-brands-grid li:nth-child(6) {display: block;float:left;margin: 0 0 75px 0%;width: 30%;  padding:0;}



/* News Stories - Grid */
ul.home-news-grid{list-style:none; text-align: left; padding:0; margin:0; width:100%}
ul.home-news-grid li{margin:0;margin-bottom:0;padding-bottom:0;border:0; width:100%; vertical-align:top; text-align:left; overflow:hidden;padding:0;border-bottom:none}
ul.home-news-grid li img{width:100%; max-width:100%; padding-bottom:0; margin-bottom:0; border-bottom:0;}
ul.home-news-grid li:nth-child(1) {display: block;float:left;margin: 0 4% 0 0;width: 48%;  padding:0;clear:both}
ul.home-news-grid li:nth-child(2) {display: block;float:left;margin: 0 0 0 0;width: 48%;  padding:0;clear:none}


/* Career Divs */
ul.home-career-divs{list-style:none; text-align: left; padding:0; margin:0; width:100%}
ul.home-career-divs li{margin:0;margin-bottom:0;padding-bottom:0;border:0; width:100%; vertical-align:top; text-align:left; overflow:hidden;padding:0;border-bottom:none}
ul.home-career-divs li img{width:100%; max-width:100%; padding-bottom:0; margin-bottom:0; border-bottom:0; display:block}
ul.home-career-divs li:nth-child(1) {display: block;float:left;margin: 0;width: 50%; padding:0;background:#DFDFDF;clear:both}
ul.home-career-divs li:nth-child(2) {display: block;float:left;margin: 0;width: 50%; padding:0;background:#080808;clear:none}


/* Contact Divs */
ul.home-contact-divs{list-style:none; text-align: left; padding:0; margin:0; width:100%}
ul.home-contact-divs li{margin:0;margin-bottom:0;padding-bottom:0;border:0; width:100%; vertical-align:top; text-align:left; overflow:hidden;padding:0;border-bottom:none}
ul.home-contact-divs li img{width:100%; max-width:100%; padding-bottom:0; margin-bottom:0; border-bottom:0; display:block}
ul.home-contact-divs li:nth-child(1) {display: block;float:left;margin: 0 30% 0 0;width: 35%; padding:0;background:#ffffff;clear:both}
ul.home-contact-divs li:nth-child(2) {display: block;float:left;margin: 0;width: 35%; padding:0;background:#ffffff;clear:none}

.contact-section-div-a-inner1 {display:block; float:left; margin:0 auto; padding:100px 13% 100px 13%}



@media screen and (max-width: 1200px) {

ul.home-brands-grid li:nth-child(1) {display: block;float:left;margin: 0 4% 20px 0;width: 48%;  padding:0;clear:both}
ul.home-brands-grid li:nth-child(2) {display: block;float:left;margin: 0 0 20px 0;width: 48%;  padding:0;clear:none}
ul.home-brands-grid li:nth-child(3) {display: block;float:left;margin: 0 4% 20px 0;width: 48%;  padding:0;clear:both}
ul.home-brands-grid li:nth-child(4) {display: block;float:left;margin: 0 0 20px 0;width: 48%;  padding:0;clear:none}
ul.home-brands-grid li:nth-child(5) {display: block;float:left;margin: 0 4% 20px 0;width: 48%;  padding:0;clear:both}
ul.home-brands-grid li:nth-child(6) {display: block;float:left;margin: 0 0 20px 0;width: 48%;  padding:0;clear:none}

.about-section-div-a-inner1 {display:block; float:left; margin:0 auto; padding:100px 25px 100px 25px}
.about-section-div-a-inner2 {padding: 100px 25px 0 25px}

}



@media screen and (max-width: 1150px) {
	.site-container-wrap {max-width:100%; width:100%;  margin:0 auto; padding:0}
	.site-container-wrap-content {width:100%; padding:0 0px}
	
	.header-topbar-left1 {display:none}
	.header-topbar-left2 {width:20%; float:left; display: block; padding:12px 0 0 0; margin:0 0 0 5%; text-align: left}
	.header-topbar-center {width:50%; float:left; display: block; padding:0; margin:0; text-align:center}
	.header-topbar-right1 {display:none}
	.header-topbar-right2 {width:20%; float:left; display: block; padding:12px 0 0 0; margin:0 5% 0 0; text-align:right}
	
	
	/* News Stories - Grid */
ul.home-news-grid{list-style:none; text-align: left; padding:0; margin:0; width:100%}
ul.home-news-grid li{margin:0;margin-bottom:0;padding-bottom:0;border:0; width:100%; vertical-align:top; text-align:left; overflow:hidden;padding:0;border-bottom:none}
ul.home-news-grid li img{width:100%; max-width:100%; padding-bottom:0; margin-bottom:0; border-bottom:0;}
ul.home-news-grid li:nth-child(1) {display: block;float:left;margin: 0 0 0 0;width: 100%;  padding:0;clear:both}
ul.home-news-grid li:nth-child(2) {display: block;float:left;margin: 0 0 0 0;width: 100%;  padding:100px 0 0 0;clear:both}
	
}




@media screen and (max-width: 775px) {
.brand-overview-mobile {display: block;margin: 0;width: 100%; padding:0;background:#FFFFFF;}

ul.home-brands-grid li:nth-child(1) {display: block;float:left;margin: 0 0 20px 0;width: 100%;  padding:0;clear:both}
ul.home-brands-grid li:nth-child(2) {display: block;float:left;margin: 0 0 20px 0;width: 100%;  padding:0;clear:both}
ul.home-brands-grid li:nth-child(3) {display: block;float:left;margin: 0 0 20px 0;width: 100%;  padding:0;clear:none;}
ul.home-brands-grid li:nth-child(4) {display: block;float:left;margin: 0 0 20px 0;width: 100%;  padding:0;clear:both}
ul.home-brands-grid li:nth-child(5) {display: block;float:left;margin: 0 0 20px 0;width: 100%;  padding:0;clear:none}
ul.home-brands-grid li:nth-child(6) {display: block;float:left;margin: 0 0 20px 0;width: 100%;  padding:0;clear:both;}

ul.home-about-divs li:nth-child(1) {display: block;float:left;margin: 0;width: 100%; padding:0;clear:both}
ul.home-about-divs li:nth-child(2) {display: block;float:left;margin: 0;width: 100%; padding:0;clear:none}

ul.home-career-divs li:nth-child(1) {display: block;float:right;margin: 0;width: 100%; padding:0;background:#DFDFDF;clear:both}
ul.home-career-divs li:nth-child(2) {display: block;float:left;margin: 0;width: 100%; padding:0;clear:both}

ul.home-contact-divs li:nth-child(1) {display: block;float:left;margin: 0;width: 100%; padding:0;background:#FFFFFF;clear:both}
ul.home-contact-divs li:nth-child(2) {display: block;float:left;margin: -100px 0 0 0;width: 100%; padding:0;clear:none}

	/* News Stories - Grid */
ul.home-news-grid{list-style:none; text-align: left; padding:0; margin:0; width:100%}
ul.home-news-grid li{margin:0;margin-bottom:0;padding-bottom:0;border:0; width:100%; vertical-align:top; text-align:left; overflow:hidden;padding:0;border-bottom:none}
ul.home-news-grid li img{width:100%; max-width:100%; padding-bottom:0; margin-bottom:0; border-bottom:0;}
ul.home-news-grid li:nth-child(1) {display: block;float:left;margin: 0 0 0 0;width: 100%;  padding:0;clear:both}
ul.home-news-grid li:nth-child(2) {display: block;float:left;margin: 0 0 0 0;width: 100%;  padding:100px 0 0 0;clear:both}
	
}


@media screen and (max-width: 550px) {
	
	.header-topbar-left1 {display:none}
	.header-topbar-left2 {width:13%; float:left; display: block; padding:12px 0 0 0; margin:0 0 0 2%; text-align: left}
	.header-topbar-center {width:70%; float:left; display: block; padding:0; margin:0; text-align:center}
	.header-topbar-right1 {display:none}
	.header-topbar-right2 {width:13%; float:left; display: block; padding:12px 0 0 0; margin:0 2% 0 0; text-align:right}
}


/* Media Queries */
@media screen and (max-width: 767px) {
	.container > header{text-align: center;}
}



.site-topbar-links, a.site-topbar-links {color: #677dd3; font-size:1.8em; letter-spacing:1px; font-weight:500; margin:0px 3px 0 3px;font-family: 'GilSans'; font-style:none}
.site-logo-right-a {display:block}
.site-topbar-links:hover, a.site-topbar-links:hover {color: #555555}

.site-menu-links {color: #4B4A49; font-size:2.45em; letter-spacing:1px; font-weight:500; margin:0 5px;font-family: 'GilSans';}



/* The Overlay (background) */
.overlay {
    /* Height & width depends on how you want to reveal the overlay (see JS below) */    
    height: 0;
    width: 100%;
    position: fixed; /* Stay in place */
    z-index: 100000; /* Sit on top */
    left: 0;
    top: 0;
	background: url(../images/grid1.png);
    background-color: rgb(0,0,0); /* Black fallback color */
    background-color: rgba(0,0,0, 0.95); /* Black w/opacity */
    overflow-x: hidden; /* Disable horizontal scroll */
    transition: 0.3s; /* 0.5 second transition effect to slide in or slide down the overlay (height or width, depending on reveal) */
	
}


.overlay2 {
    /* Height & width depends on how you want to reveal the overlay (see JS below) */    
    height: 0;
    width: 100%;
    position: fixed; /* Stay in place */
    z-index: 10000; /* Sit on top */
    left: 0;
    top: 0;
	background: url(../images/grid1.png);
    background-color: rgb(255,255,255); /* White fallback color */
    background-color: rgba(255,255,255, 0.97); /* White w/opacity */
    overflow-x: hidden; /* Disable horizontal scroll */
    transition: 0.3s; /* 0.5 second transition effect to slide in or slide down the overlay (height or width, depending on reveal) */
	
}

/* Position the content inside the overlay */
.overlay-content {
    position: relative;
    top: 15%; /* 25% from the top */
    width: 100%; /* 100% width */
    text-align: center; /* Centered text/links */
    margin-top: 30px; /* 30px top margin to avoid conflict with the close button on smaller screens */
}

/* The navigation links inside the overlay */
.overlay a {
    padding: 8px;
    text-decoration: none;
    font-size: 36px;
    color: #818181;
    display: block; /* Display block instead of inline */
    transition: 0.3s; /* Transition effects on hover (color) */
}

/* When you mouse over the navigation links, change their color */
.overlay a:hover, .overlay a:focus {
    color: #f1f1f1;background:url(../images/fades/fade_black6.png);
}

/* Position the close button (top right corner) */
.closebtn {
    position: absolute;
    top: 20px;
    right: 45px;
    font-size: 60px !important; /* Override the font-size specified earlier (36px) for all navigation links */
}



/* When the height of the screen is less than 450 pixels, change the font-size of the links and position the close button again, so they don't overlap */
@media screen and (max-height: 450px) {
    .overlay a {font-size: 20px}
    .closebtn {
        font-size: 40px !important;
        top: 15px;
        right: 35px;
    }
}







/* FONT FACES */
@font-face {
    font-family: 'GilSans';
    font-weight: 300;
    font-style: normal;
    src: url('fonts/gil_-webfont.woff') format('woff');
}



@font-face {
    font-family: 'Gibson';
    font-weight: 300;
    font-style: normal;
    src: url('fonts/28A4C0_0_0.eot');
    src: url('fonts/28A4C0_0_0.eot?#iefix') format('embedded-opentype'),
         url('fonts/28A4C0_0_0.woff') format('woff'),
         url('fonts/28A4C0_0_0.ttf') format('truetype'),
         url('fonts/28A4C0_0_0.svg#wf') format('svg');
}




@font-face {
    font-family: 'Gibson';
    font-weight: 300;
    font-style: italic;
    src: url('fonts/28A4C0_1_0.eot');
    src: url('fonts//28A4C0_1_0.eot?#iefix') format('embedded-opentype'),
         url('fonts/28A4C0_1_0.woff') format('woff'),
         url('fonts/28A4C0_1_0.ttf') format('truetype'),
         url('fonts/28A4C0_1_0.svg#wf') format('svg');
}
@font-face {
    font-family: 'Gibson';
    font-weight: 500;
    font-style: normal;
    src: url('fonts/28A4C0_5_0.eot');
    src: url('fonts/28A4C0_5_0.eot?#iefix') format('embedded-opentype'),
         url('fonts/28A4C0_5_0.woff') format('woff'),
         url('fonts/28A4C0_5_0.ttf') format('truetype'),
         url('fonts/28A4C0_5_0.svg#wf') format('svg');
}
@font-face {
    font-family: 'Gibson';
    font-weight: 500;
    font-style: italic;
    src: url('fonts/28A4C0_7_0.eot');
    src: url('fonts/28A4C0_7_0.eot?#iefix') format('embedded-opentype'),
         url('fonts/28A4C0_7_0.woff') format('woff'),
         url('fonts/28A4C0_7_0.ttf') format('truetype'),
         url('fonts/28A4C0_7_0.svg#wf') format('svg');
}
@font-face {
    font-family: 'Gibson';
    font-weight: 700;
    font-style: normal;
    src: url('fonts/28A4C0_6_0.eot');
    src: url('fonts/28A4C0_6_0.eot?#iefix') format('embedded-opentype'),
         url('fonts/28A4C0_6_0.woff') format('woff'),
         url('fonts/28A4C0_6_0.ttf') format('truetype'),
         url('fonts/28A4C0_6_0.svg#wf') format('svg');
}

@font-face {
    font-family: 'GibsonBold';
    font-weight: 700;
    font-style: normal;
    src: url('fonts/28A4C0_4_0.eot?#iefix') format('embedded-opentype'),
         url('fonts/28A4C0_4_0.woff') format('woff'),
         url('fonts/28A4C0_4_0.ttf') format('truetype'),
         url('fonts/28A4C0_4_0.svg#wf') format('svg');
}
@font-face {
    font-family: 'GibsonBold';
    font-weight: 700;
    font-style: italic;
    src: url('fonts/28A4C0_2_0.eot');
    src: url('fonts/28A4C0_2_0.eot?#iefix') format('embedded-opentype'),
         url('fonts/28A4C0_2_0.woff') format('woff'),
         url('fonts/28A4C0_2_0.ttf') format('truetype'),
         url('fonts/28A4C0_2_0.svg#wf') format('svg');
}
@font-face {
    font-family: 'Gibson';
    font-weight: 700;
    font-style: italic;
    src: url('fonts/28A4C0_3_0.eot');
    src: url('fonts/28A4C0_3_0.eot?#iefix') format('embedded-opentype'),
         url('fonts/28A4C0_3_0.woff') format('woff'),
         url('fonts/28A4C0_3_0.ttf') format('truetype'),
         url('fonts/28A4C0_3_0.svg#wf') format('svg');
}
@font-face {
    font-family: 'Gibson';
    font-weight: 900;
    font-style: normal;
    src: url('fonts/28A4C0_4_0.eot');
    src: url('fonts/28A4C0_4_0.eot?#iefix') format('embedded-opentype'),
         url('fonts/28A4C0_4_0.woff') format('woff'),
         url('fonts/28A4C0_4_0.ttf') format('truetype'),
         url('fonts/28A4C0_4_0.svg#wf') format('svg');
}
@font-face {
    font-family: 'Gibson';
    font-weight: 900;
    font-style: italic;
    src: url('fonts/28A4C0_2_0.eot');
    src: url('fonts/28A4C0_2_0.eot?#iefix') format('embedded-opentype'),
         url('fonts/28A4C0_2_0.woff') format('woff'),
         url('fonts/28A4C0_2_0.ttf') format('truetype'),
         url('fonts/28A4C0_2_0.svg#wf') format('svg');
}