body{font-family: FreightTextProMedium-Regular; font-weight:400; font-size: 1rem; line-height:1.4rem; }      
div{box-sizing: border-box;}
a{cursor: pointer;}
a:hover{opacity:.75; }

#logo{ position: absolute; width:100%; height:auto; top: 50%;  transform: translateY(-50%); z-index:100000;display:block; text-align: center}
#logo img{ width:80%; min-width:280px; margin-left: auto; margin-right: auto;}
#bottomlogo{width:100%; height:auto; z-index:100000;display:block; text-align: center}
#bottomlogo img{ width:80%; min-width:280px; margin-left: auto; margin-right: auto;}
#videoheader{z-index:1;top:46px;}

#namegenerator .textwrapper{padding-top:5% !important; padding-bottom:5% !important;}
#namegenerator .q{display:none;}
#namegenerator .q li {margin-top:7px;}
#namegenerator .q li a{font-weight:400; font-family: Sucrose-BoldTwo; display: inline-block; padding-left:0px; color:#F2E5C2; line-height:30px;}
#namegenerator ul{list-style: none; display: inline-block; text-align:left; margin-left:0px; margin-bottom:0px;}

#namegenerator .q li a.active{color:#F2E5C2; }
#namegenerator .q li a.active:hover{color:#F2E5C2; opacity:1;}
#namegenerator .q li a.active:active{color:#F2E5C2; }
#namegenerator .q li a div.chk{display:table-cell; height:30px; width:25px;background-image:url(../images/checkbox.png);background-position: 0 0; background-repeat:no-repeat; }
#namegenerator .q li a.active div.chk{background-position: -25px 0px !important;}
#namegenerator .q li a div.q-text{display: table-cell; padding-left:5px;font-size:1.5rem;}
#namegenerator .q a.next{margin-top:20px !important; padding-left:45px;padding-right:45px; }

#twitter-badge {
    position: absolute;
    top: -37px;
	left: 0;
}

#twitter-badge img {
    width: 200px;
	height: 173px;
}

.nutr-desc {
    margin-top: 15px;
    text-align: center;
}

#top-bar{position: absolute;}
#header-bar{margin-top:0px !important;}

.cell img{display:block; max-width:100%; height:auto; width:100%;}
		
 .textwrapper{
	margin: 0px; 
	padding:12%; 
	padding-top:7%; 
	padding-bottom:7%; 
	text-align: center; 
	width:100%;   
	position: relative; 
	top: 50%;  
	transform: translateY(-50%); 
	-webkit-transform: translateY(-50%);
/*	-ms-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-o-transform: translateY(-50%);
	-webkit-transform: translate3d(0,-50%,0);
	*/
}

.info h2{font-family: Sucrose-BoldTwo; font-weight: 400; font-size:2.0rem; line-height:2.0rem;}
.info h3{font-family: Sucrose-BoldTwo; font-weight: 400; font-size:1.2rem; line-height:2rem;}
.cell.info1{background-color:#574C40; color:#F2E5C2; }
.cell.info2{background-color:#F2E5C2; color:#574C40; }
/*.cell.info */
a.btn{text-decoration:none; padding:5px;padding-left: 25px; padding-right:25px; margin:0;font-weight:bold;color:#F2E5C2;background-color:#DA6826; font-size: 1rem; font-family: Sucrose-BoldTwo; display:block; margin-top:20px; display:inline-block;}
hr{background-color:#DA6826; height:5px; width:15%; border: 0; outline:0; margin-top:0px;}
#namegenerator h2{color:#DA6826;}
#namegenerator h3{color:#F2E5C2;}


.large-12.cell.info.info2.desc {
	background-color:#574C40; 
	color:#F2E5C2;
}

.title-bar-title{margin-left:auto; margin-right:auto; margin-top:7px; margin-bottom:7px;}
.title-bar{background-color:#574C40 !important;}

#recipes h3{text-align:center; font-family: Sucrose-BoldTwo; font-weight: 400; font-size:2.8rem; line-height:2.8rem; }
#recipes h4{text-align:center; font-family: Sucrose-BoldTwo; font-weight: 400; font-size:1.0rem; line-height:1.0rem; }

#recipes .ingredients{ }
#recipes .directions {}
#recipes .nutrition{padding-top:40px !important; padding-bottom:40px !important; }


#recipes .ingredients img{display:block; max-width:100%; height:auto; width:100%;}
#recipes .ingredients img.icon{display: block; height: auto; width: 15%; max-width: 60px; min-width: 20px; padding-top:0px; padding-bottom:5%; margin-left: auto; margin-right:auto;}

#recipes .directions img.icon{display: block; height: auto; width: 25%; max-width: 80px; min-width: 65px; padding-top:0px; padding-bottom:6px;margin-left: auto;margin-right:auto;}
#recipes .nutrition img.icon{padding-top:30px; padding-bottom:30px;margin-left: auto;margin-right:auto;}






#recipes .ingredients ul{ list-style: none;  margin: 0px; margin-bottom:30px; margin-top:40px; }
#recipes .ingredients ul li{margin:0px 0;  padding-left:10% !important; padding-right:10% !important; padding-top:10px !important; padding-bottom:10px !important;} 
#recipes .ingredients ul li:nth-child(odd){background-color:#ffffff;}
#recipes .ingredients ul li:nth-child(even){background-color: #F5EEDE ;}

#recipes .ingredients h3{color:#574C40;}
#recipes .ingredients h4{color:#574C40;}


#recipes .directions {background-color:#574C40;color:#F2E5C2;}
#recipes .directions h3{color:#F2E5C2;}
#recipes .directions h4{color:#F2E5C2;margin-bottom:10px;}


#recipes .nutrition h3{color:#574C40;}
#recipes .nutrition h4{color:#574C40;}
#recipes .nutrition .subhead{color:#574C40; text-align:center; font-family: Sucrose; font-weight: 400; font-size:1.5rem; line-height:1rem; }

#recipes .nutrition dl {margin-bottom:0px; margin-left:5%; margin-right:5%;}
#recipes .nutrition dl dt {font-weight: normal; margin-right:5%; padding-left: 5%; padding-top:10px; padding-bottom:10px; width:40%; display: inline-block;}
#recipes .nutrition dl dd { margin:2px 0; padding:5px 0; display: inline-block; width: 25%;}
#recipes .nutrition dl:nth-child(even){background-color:#F5EEDE;}
#recipes .nutrition dl:nth-child(odd){background-color: #ffffff;}

#foot{margin-top:30px; margin-left:10%; margin-right:10%; margin-bottom:30px;}
#foot a, #foot a:hover, #foot a:active, #foot a:visited{color:#0a0a0a !important; text-decoration: none; font-size: .8em;}
#foot a:hover{text-decoration: underline;}


#recipes h4.orange{color:#DA6826;}
#recipes h4.left{text-align:left;} 
.cell{padding:0 !important;position:relative;z-index:100000}
#scrollarrow{position:fixed; bottom:10px; display:block ;z-index:10000000;}
.call a,.call a:hover, .call a:active, .call a:visited{color:#0a0a0a !important; text-decoration:none;}
.call{cursor: pointer;}
.textwrapper.safari #bottomlogo{padding-top:7% !important; }


.desc .textwrapper.safari{display:inline-block; position: relative;transform: translateY(0%)}
.ingredients .textwrapper.safari{display:block;position:relative;transform:translateY(0%);}
.directions .textwrapper.safari{display:block;position:relative;transform:translateY(0%);}




@media(max-width: 720px){
	 #videoheader{top:0px !important;}
	 .ingredients{padding-left: 0px !important;padding-right: 0px !important;}
	 .nutrition{padding-left: 5% !important; padding-right:5% !important;}
	.directionstext{padding-top:0px !important; }
	.textwrapper.safari{transform:unset; top:0;}
	.info .textwrapper{padding-top:10%; padding-bottom:10%;}
	#namegenerator .textwrapper{width:100%; margin-left:auto; margin-right:auto;}
	
	#twitter-badge {
		position: absolute;
		top: -18px;
		left: 0;
	}
	
	#twitter-badge img {
		width: 100px;
		height: 86px;
	}
	
}

@media(min-width: 720px){
	#namegenerator .textwrapper{width:70%; margin-left: auto; margin-right:auto;}

	 #videoheader{top:46px !important;}
	 .ingredients{padding-left: 15% !important;padding-right: 15% !important;}
	 .directionsicon{display: inline-block !important; margin-bottom:-7px;}
	 .directionstitle{display: inline-block !important;}
	 .directionstitle h4{line-height: .5rem !important;}
	 .ingredientsicon{display: inline-block !important;margin-bottom:-3px;}
	 .ingredientstitle{display: inline-block !important;}
	 .ingredientstitle h4{line-height: .5rem !important;}

	 #recipes .ingredients img.icon{min-width:55px !important; width:40% !important; margin-right:10px !important;}
	 #recipes .directions img.icon{min-width:75px !important; width:40% !important; margin-right:10px !important;}

	.directionstext{padding-left: 15% !important; padding-right:15% !important; padding-top:0px !important; }
	.nutrition{padding-left:11% !important; padding-right: 11% !important;}


	.next{position:absolute; bottom:15%;right:2%;}
	.desc .textwrapper{font-weight:800;}

.textwrapper.safari{position:absolute;}


.textwrapper.safari	.next{right:10%; bottom:25%;}
.textwrapper.safari #generatorimg{width: 45% !important; margin-bottom:-4% !important;margin-top:5% !important;}


}

@media(max-width: 1280px){
/*	#scrollarrow{position:fixed; bottom:10px; display:block; right:2%;z-index:10000000;}*/
}


@media(min-width: 1280px){
/*	#scrollarrow{right:2%;}*/
}