/* ---------- Landscape Tablet ---------- */

/* ---------- Landscape iPad ---------- */
@media screen and (max-width: 1169px){
	img, iframe {
		max-width:100%;	
	}
	/* Header */
	header #logo{
		margin-top:0px;
		width:40%;
	}
	header nav ul{
		max-width:58%;
    	margin-top:44px;
	}
	header ul li{
		margin:0 0 12px;
		/*float:left;*/
	}
	
	/* Footer */
	footer{
		text-align:center;
	}
	footer nav{
		display:inline-block;
		float:none;
	}
	footer a#belaroma{
		float:none;
		margin:-20px auto 30px;
	}
	footer #copyRight{
		float:none;
	}
	footer #cstech{
		float:none;
		margin: 20px auto 0;
	}
	
	/* Home */
	#content #ctaList li h2{
		font-size:17px;
	}
	input#captcha {
		float: none;
		margin: 10px 0;
		width: 97%;
	}
	
}


/* ---------- Portrait Note/Portrait iPad ---------- */
@media screen and (max-width: 768px){
	header #logo img{
		height:auto;
		width:100%;
	}
	header nav{
		height: auto;
		padding: 4% 0;
	}
	header #logo {
		height: auto;
		margin: 0 0 0 25%;
		width: 46%;
	}
	header nav ul{
		float:none;
		left:50%;
		margin:0 0 0 -140px;
		position:absolute;
		min-width:280px;
		top:51px;
	}
	header nav ul li{
		border-left:none;
		display:none;
		float:none;
		margin:0;
	}
	header ul li:nth-child(2n), header ul li:nth-child(5), header ul li:nth-child(6){
		border:none;
		clear:both;
		margin:0;
	}	
	header nav ul li a, header nav ul li:last-child a{
		background:#FFF;
		border-bottom:1px solid #EEE;
		display:block;
		float:none;
		padding:14px 0 10px;
		text-align:center;
		color:#2f8558;
		text-transform:normal;
	}
	header nav ul li a:hover, header nav ul li.selected a{
		background:#2f8558;
		border-bottom:1px solid #eee;
		color:#fff;
		text-decoration:none;
	}
	header nav ul li:nth-child(2){
		border-top: 2px solid #fff;
	}
	header nav ul li#displayMenu, header nav ul li:first-child{
		background:url(../images/icon-dropdownMenu.png) no-repeat 0 0;
		display:block;
		height:15px;
		position:absolute;
		right:0;
		text-indent:-99999px;
		top:-27px;
		width:19px
	}
	header nav ul li#displayMenu a, header nav .menu a[title="Menu"] {
		background:none;
		border:none;
		display:block;
	}
	
	/* Footer */
	footer{
		padding:20px 0;
	}
	footer nav{
		display:block;
		float:none;
		margin:0 0 15px;
	}
	footer nav li{
		border-left:none;
		float:none;
		width:100%;
	}
	footer nav li:after{
		content:"—";
		color:#e8e4df;
	}
	footer nav li:last-child:after{
		content:"";
	}
	footer nav li a, footer nav ul li:first-child a{
		display:block;
		float:none;
		font-size:15px;
		padding:4px 0 2px;
		text-align:center;
		text-transform:normal;
	}
	footer nav li a:hover, footer nav ul li:first-child a:hover{
		color:#1A1818;
		text-decoration:none;
	}
	footer a#belaroma{
		float:none;
		margin:0 auto 15px;
	}
	footer #copyRight{
		display:block;
		float:none;
		line-height:140%;
		margin:0 0 15px;
		text-align:center
	}
	footer #copyRight br{
		display:block;
	}
	footer #cstech{
		float:none;
		margin:0 auto;
	}
	
	/* Home */
	#content #ctaList{
		margin:0;
	}
	#content #ctaList li{
		margin:0 0 20px 4%;
		width:47%;
	}
	#content #ctaList li:nth-child(2n + 1){
		clear:left;
		margin-left:0;
	}
	#content #ctaList li h2{
		font-size:22px;
		padding:10% 5% 5%;
	}
	#content #ctaList li p{
		padding:0 0 10%;
	}
	#content ul, #content ol {
		padding:0;	
	}
	/* Blends */
	.blendsLeft {
		float:none;
		margin:10px auto;
		width:auto;	
		text-align:center;
	}
	.blendRight {
		width:auto;
		float:none;
		padding:2.5%;
		margin:2.5% auto;
	}
	.blendsLeft img{
		margin: 20px auto;
	}
	#content .locale span {
		display:block;	
	}
	#content .locale li > span:first-child {
		border:none;
	}
	#content .locale span .seperator {
		display:none;
	}
	#content span.wpcf7-not-valid-tip-no-ajax, #content span.wpcf7-not-valid-tip, #content div.wpcf7-response-output, #content div.wpcf7-validation-errors {
		width:98%;	
	}
	.merch .Half, .merch .Full {
		float: none;
		margin: 0;
		width: 100%;
	}
	.merch h2 {
		min-height:0px;	
	}
	.col {
		text-align:center;
		float: none;
		width: 100%;
	}
	.col h2 {
		text-align:center;	
	}
	#content #gallery li {
		width:45%;	
	}

	
}

/* ---------- Landscape iPhone 5 ---------- */
@media screen and (max-width: 568px){	
	/* Header */
	header {
		overflow: hidden;
	}
	header > img {
		margin: 0 0 0 -20%;
		width: 200%;
		max-width:200%;
	}
	header #logo {
		height: auto;
		margin: 0 0 0 20%;
		width: 60%;
	}
	header nav {
		height: auto;
		padding: 10% 0;
	}
	/* Content */
	#content{
		padding:26px 20px;
	}
	h1{
		font-size:20px;
		margin:0 auto 23px;
		width:100%;
	}
	#content p, #content a{
		font-size:15px;
		text-align:center;
	}
	#content ul li, #content ol li {
		font-size:15px;	
	}
	#content ul li strong, #content ol li strong {
		font-size:18px;	
	}
	a#backToTop{
		background:url(../images/icon-backToTop.png) center top;
		display:block;
		height:66px;
		margin: 25px auto 20px;
		text-indent:-99999px;
		width:66px;
	}
	a#backToTop:hover{
		background-position:center bottom;
	}
	
	/* Home */
	#content #ctaList{
		margin:0;
	}
	#content #ctaList li{
		margin:0 0 20px 4%;
		width:48%;
	}
	#content #ctaList li:nth-child(2n + 1){
		margin-left:0;
	}
	.blendRight h2 {
		text-align:center;
	}
	input[type="text"],input[type="tel"],input[type="number"], input[type="email"], input[type="password"], input.input-text, select, textarea {
		max-width:97%;	
	}
	label{
		text-align:left;	
	}
	#content .info > li {
		text-align:center;	
	}
	.left, form {
		float: none;
		margin: 20px auto;
		width: auto;
	}

}


/* ---------- Landscape iPhone 3 and 4 Phone ---------- */
@media only screen and (max-width: 480px){ /* Make the 568px?? */
	header #logo {
		height: auto;
		margin: 0 0 0 17%;
		width: 75%;
	}
	/* Home */
	#content #ctaList li{
		margin:0 0 20px;
		width:100%;
	}
	#content #ctaList li a:hover h2{
		background-size:100% 100%;
	}
	.merchLeft, .merchRight {
		float:none;
		width:auto;
		margin:10px 0;
	}
	.merch h2 {
		text-align:center;
	}
}

/* ---------- Portrait oPhone ---------- */
@media only screen and (max-width: 320px){
	header #logo {
		height: auto;
		display:block;
		margin: 0 auto;
		width: 100%;
	}

}