body{

	margin: 0;

	padding: 0;

	min-width: 320px;		

	

}





#rotatorWrap{

	width: 960px;

	/*background: transparent url(../images/assets/crosslines.png) repeat; */

	position: relative;

	padding: 0;

	margin: 0 auto;

	overflow: hidden;

}



.itemContainer{

	position: absolute;

	width: 100%;

	height: 100%;	

	margin: 0;

	padding: 0;

	-webkit-transform-origin: left top;

    -moz-transform-origin: left top;

    -ms-transform-origin: left top;

    -o-transform-origin: left top;

    transform-origin: left top;



}





.rotatorItem{

	display: block;

	padding: 0;

	position: relative;

	float: left;

	width: 100%;

	height: 100%;

	opacity: 0;

	-webkit-backface-visibility: hidden;

    -webkit-transform-origin: left top;

    -moz-transform-origin: left top;

    -ms-transform-origin: left top;

    -o-transform-origin: left top;

    transform-origin: left top;

}

.rotatorItem img{

	padding: 0;

	margin: 0;

	z-index: 1000;

	/*display: none;*/

}



.rotatorItem .caption{

	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;	

	font-size: 1.2em;

	position: absolute;

	top: 20px;

	left: 30px;

	z-index: 1001;

	color: #fff;

}



.rotatorItem .caption p{

	/*text-shadow: 1px 1px 4px rgba(255, 255, 255, 0.8);	*/

	display: inline-block;

	position: relative;

	float: left;

	clear: left;

	margin-top: 4px;

	background: #EFEFEF;

	color: #666;

	padding: 10px;

	opacity: 0;

	z-index: 1002;

}



.rotatorItem .caption .wpTitle1{

	margin-top: 120px;

	margin-left: 540px;

	font-size: 1.2em;

	background: #9ACD32;

	color: #FFF;	

}

.rotatorItem .caption .wpTitle2{

	margin-left: 540px;

	font-size: .8em;

	background: #9ACD32;

	color: #FFF;	

}



.rotatorItem .caption .lycheeTitle1{

	margin-left: 180px;

	margin-top: 100px;

}

.rotatorItem .caption .lycheeTitle2{

	margin-left: 180px;

}





.rotatorItem .caption .style1{

	font-size: 1.2em;

	background: #FF7F50;

	color: #FFF;

	margin-top: 100px;

	margin-left: 500px;

}

.rotatorItem .caption .style2{

	font-size: 1em;

	background: #A0522D;

	color: #FFF;

	margin-left: 500px;	

}

.rotatorItem .caption .style3{

	font-size: .8em;

	background: #B8860B;

	color: #FFF;

	margin-left: 500px;	

}



.wp1{

	position: absolute;

	left: 120px;

	top: 80px;

}	

.wp2{

	position: absolute;

	left: 360px;

	top: 180px;

}	



.rotatorItem .quote{

	color: #fff;

	width: 800px;

	font-size: 1.8em;

	text-align: center;

	font-family: proxima-nova, Helvetica Neue, Helvetica, Arial, sans-serif;	

	line-height: 150%;

	padding: 3.6em 2em 2em 1em;

	text-shadow: 1px 1px 4px rgba(255, 255, 255, 0.8);

}

.rotatorItem .quote p{

	opacity: 0;

}

.rotatorItem .quote p.author{

	font-size: .6em;

	font-style: italic;

	text-align: center;

	margin-top: 20px;

}



/*.rotatorItem p.author{

	font-size: 1em;

	color: #FFF;

	font-style: italic;

	text-align: center;

}

*/

.blueColor{

	background: #00BDEE;

	color: #FFF;

}

.orangeColor{

	background: #F08080;

	color: #FFF;

}

.greenColor{

	color: #FFF;	

	background: #9ACD32;    

}





.arrowButton{    

	width: 100%;

	cursor: pointer;  

	position: absolute;

	z-index: 1003;

	top: 170px;

}            

.arrowButton .prevArrow{

	background: url(../images/assets/prev.png) no-repeat; 

	width: 40px;

	height: 80px;      

	position: absolute;

	left: 12px;        

} 

.arrowButton .nextArrow{                 

	background: url(../images/assets/next.png) no-repeat;

	width: 40px;

	height: 80px;

	position: absolute;

	/*top: 170px;*/

	right: 12px;	          

} 



/* change the width of the slider in your own responsive media query */



@media only screen and (min-width: 960px) {

	#rotatorWrap{

		width: 960px;

	}



	.rotatorItem .quote{

		width: 900px;

		font-size: 1.8em;

		padding: 3.6em 5em 2em 1em;

	}

	.rotatorItem .quote p{

		opacity: 0;

	}

	.rotatorItem .quote p.author{

		font-size: .6em;

		margin-top: 20px;

	}	

body {line-height:140%;}
body h1 {font-family: 'Trebuchet MS', Helvetica, sans-serif;  color:#9DC3D6; font-size:55px; padding-top:20px; margin-bottom:20px; margin-left:10px; }
body h2 {color:#633E31; font-size:20px; margin-left:0px; font-weight:600;font-family: 'Trebuchet MS', Helvetica, sans-serif;margin-top:20px;margin-bottom:20px;}
body h3 {font-size:18px; font-family: 'Trebuchet MS', Helvetica, sans-serif;color:#BEB856;}
body p {font-family: 'Trebuchet MS', Helvetica, sans-serif;  color:#7B6E3A; font-size:16px; margin-top:0px; }
#rotatorWrap {margin-bottom:20px;}
#slhistoryh2 {float:right;margin-right:133px;}
#submitRecipe {float:right; margin-bottom:20px;}
#submitrecipeform label {font-family: 'Trebuchet MS', Helvetica, sans-serif;  color:#7B6E3A; font-size:16px; margin-top:0px;}
#submitProfile {float:right; margin-bottom:20px;}
#container {width:960px; margin:0 auto; border-style:solid;}

#branding {height:70px;}

#nav {height:40px; background-color:#BEB856;  margin-bottom:20px;}

#nav ul {padding-top:8px;}

#nav li {list-style-type: none; display:inline;}

#nav li a {margin-left:30px;font-family: 'Trebuchet MS', Helvetica, sans-serif;   }

#nav a {text-decoration:none;font-size:20px; }

#nav a:link {color:#633E31; }      /* unvisited link */

#nav a:visited {color:#633E31;}  /* visited link */

#nav a:hover {color:#FFC;}  /* mouse over link */

#nav a:active {color:#C54626;}  /* selected link */

#nav .orange a {color:#C54626;}

#nav .orange a:visited {color:#C54626;}  /* visited link */

#nav .orange a:hover {color:#FFC;}  /* mouse over link */

#nav .orange a:active {color:#C54626;}  /* selected link */

#profilePic {margin-left:10px;}
#logo {margin-left:280px;}


#siteMap {clear:both;height:40px; background-color:#BEB856; color:#fff; }
#siteMap p {color:#C54626; margin-left:10px; padding-top:10px;}
#siteMap a {text-decoration:none; color:#633E31; font-size:12px;}
#siteMap a:hover {color:#FFC;}

/*about & profile*/


#leftAbout {width:280px; float:left; background-color:#FFF;margin-left:10px; margin-right:10px; margin-top:20px;}
#leftAbout p {font-weight:600;}
#bigRightAbout {width:660px; float:right; background-color:#FFF; margin-top:20px; margin-bottom:20px;}
#rightAbout {width:430px; float:left; background-color:#FFF;margin-left:10px; margin-right:10px;}
#farRightAbout{width:190px; float:right; background-color:#FFF;margin-left:10px; margin-right:10px;}

/*shopping list*/



#leftCol1 {width:460px; float:left; margin-left:10px; margin-right:10px; background-color:#FFF;}
#leftCol1-shoplist{width:370px; float:left; margin-left:10px; margin-right:10px; background-color:#FFF;}

#rightCol1ShoplistRight {margin-bottom:20px;}
#leftCol1-shoplist form {clear:both;}
#leftCol1-shoplist input {margin-left:20px;margin-bottom:20px;}
.slistL {float:left;
	border: 1px solid #9DC3D6;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px;
	-moz-box-shadow: 2px 2px 3px #666;
	-webkit-box-shadow: 2px 2px 3px #666;
	box-shadow: 2px 2px 3px #666;
	font-size: 20px;
	padding: 4px 7px;
	outline: 0;
	-webkit-appearance: none;
	margin-bottom:20px;}
.slistR {float:right;
	border: 1px solid #9DC3D6;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px;
	-moz-box-shadow: 2px 2px 3px #666;
	-webkit-box-shadow: 2px 2px 3px #666;
	box-shadow: 2px 2px 3px #666;
	font-size: 20px;
	padding: 4px 7px;
	outline: 0;
	-webkit-appearance: none;
	margin-bottom:20px;}
	
	#submitShoppingList{margin-right:20px;}
	input.slistL:focus {
	border-color: #633E31;
}
	input.slistR:focus {
	border-color: #633E31;
}
#rightCol1-shoplist{width:570px; float:right; background-color:#fff;}
#rightCol1ShoplistMiddle {width:265px;float:left; background-color:#fff;margin-left:10px; margin-right:10px;}
#rightCol1ShoplistRight {width:265px;float:right; background-color:#fff; margin-left:10px; margin-right:10px;}
#rightCol1 {width:460px; float:right; margin-left:10px; margin-right:10px;} 
#subNav {height:40px; background-color:#FFF;;  margin-bottom:20px;}
#subNav ul {padding-top:8px;}
#subNav li {list-style-type: none; display:inline;}
#subNav li a {margin-left:20px;font-family: 'Trebuchet MS', Helvetica, sans-serif;   }
#subNav a {text-decoration:none;  font-size:20px;}
#subNav a:link {color:#9DC3D6;}      /* unvisited link */
#subNav a:visited {color:#9DC3D6;}  /* visited link */
#subNav a:hover {color:#633E31;}  /* mouse over link */
#subNav a:active {color:#66F;}  /* selected link */

input.text-input {
	border: 1px solid #9DC3D6;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px;
	-moz-box-shadow: 2px 2px 3px #666;
	-webkit-box-shadow: 2px 2px 3px #666;
	box-shadow: 2px 2px 3px #666;
	font-size: 20px;
	padding: 4px 7px;
	outline: 0;
	-webkit-appearance: none;
	margin-bottom:20px;
}
input.text-input:focus {
	border-color: #633E31;
}
.form p {font-family: 'Trebuchet MS', Helvetica, sans-serif; color:#633E31; font-size:18px;}
.pushit {
	cursor: pointer;
	outline: none;
	background-color:#633E31;
	color: #fff;
}
 
.pushit:hover {
	background-color: #9DC3D6;
	color: #633E31;
}
input {
	color:#C44326;
	padding: 7px;
	border: 1px solid #CCC;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	-webkit-transition: all 0.4s ease-in-out;
	-moz-transition: all 0.4s ease-in-out;
	-o-transition: all 0.4s ease-in-out;
}

#instructions {
 display: block; float:right; margin-top:10px;
     width: 600px;
     height: 120px;
     padding: 8px;
     border: 4px solid #9DC3D6;
     line-height: 130%;
     font-size: 13px;
	 color:#633E31;
	 background-color:#FFF;
	 border-radius:10px;
	 font-weight:600; margin-bottom:20px;
}


/*.item {float:left;}*/


#subNav2 { width:680px; float:right; border-top-width:6px; margin-right:270px;
  border-top-style:solid;
  border-top-color:#9DC3D6; margin-bottom:20px;}
#submitButtons{clear:both;float:left; }
#submitIngredients {margin-right:105px;}
#addR {float:right;margin-right:275px}



.eItem{float:left;}
.guessPrice{float:right; }
#unUsed {border:none;box-shadow:none;}



/*add Recipe*/


.submit {float:right; margin-right:250px; margin-bottom:20px;}
.add {clear:both; float:right; margin-bottom:20px; }

/*add Menu*/






/*when logged in*/
#loggedInAs {float:right;margin-right:10px;margin-top:10px; color:#633E31; font-size:14px;font-weight:600; font-family:"Arial Black", Gadget, sans-serif;}
#loggedInAs a {text-decoration:none;}
#printArea {margin-top:20px;}
#printbut {background-color:green;color:white;}
#printthis {margin-bottom:20px;}
#backbut {background-color:green;color:yellow;}
.styleprints {width:500px;font-size:18px;color:#633E31; font-family:Trebuchet MS, Helvetica, sans-serif;}

#itemTitle {float:left;}
#priceTitle{float:right;margin-right:57px;}
#stotal {border-top:thick double #BEB856;margin-top:10px;padding-top:10px;}
.importPrice{float:right;margin-right:75px;}
#listTitle {margin-left:343px;}


#close {float:right; cursor: pointer;cursor: hand;}

#newItem {border:none;}
#newPrice{border:none;}
.editable {cursor: pointer;cursor: hand;clear:both;}

#rightMenuMiddle {width:150px; float:left;}
#rightMenuRight  {width:230px; float:right;}



.textBlock { display: block; float:right; margin-top:10px;
     width: 600px;
     height: 120px;
     padding: 8px;
     border: 4px solid #9DC3D6;
     line-height: 130%;
     font-size: 13px;
	 color:#633E31;
	 background-color:#FFF;
	 border-radius:10px;
	 font-weight:600; margin-bottom:20px;}
}



@media screen and (min-width: 768px) and (max-width: 959px) {

	#rotatorWrap, .fullImage{ 

		width: 768px; 

	}



	.rotatorItem .caption .style1, .rotatorItem .caption .style2, .rotatorItem .caption .style3{

		margin-left: 360px;

		padding: 8px;

	}

	.rotatorItem .caption .style1{

		margin-top: 60px; 

	}

	.rotatorItem .quote{

		width: 700px;

		padding: 2.4em 1.5em 2em 1.2em;

	}

	.wp1{

		width: 200px;

		height: 200px;

		left:100px;

		top: 80px;

	}	

	.wp2{

		width: 100px;

		height: 100px;

		left: 290px;

		top: 160px;

	}	

	.rotatorItem .caption .wpTitle1{

		margin-top: 100px;

		margin-left: 400px;

		font-size: 1em;

		padding: 8px;

	}

	.rotatorItem .caption .wpTitle2{

		margin-left: 400px;

		font-size: .8em;

		padding: 8px;

	}



}



@media screen and (min-width: 480px) and (max-width: 767px) {

	#rotatorWrap, .fullImage{

		width: 480px;

	}	



	.rotatorItem .caption .style1, .rotatorItem .caption .style2, .rotatorItem .caption .style3{

		margin-left: 180px;

		font-size: .7em;

		padding: 6px;

	}

	.rotatorItem .caption .style1{

		margin-top: 20px; 

		font-size: .8em;

	}



	.rotatorItem .quote{

		font-size: 1.2em;

		padding: 2em 1.5em 2em 1.5em;		

		width: 420px;

	}	



	.wp1{

		width: 128px;

		height: 128px;

		top: 50px;

		left: 50px;

	}	

	.wp2{

		width: 64px;

		height: 64px;

		left: 170px;

		top: 100px;

	}	

	.rotatorItem .caption .wpTitle1{

		margin-top: 40px;

		margin-left: 220px;

		font-size: .8em;

		padding: 6px;

	}

	.rotatorItem .caption .wpTitle2{

		margin-left: 220px;

		font-size: .8em;

		padding: 6px;

	}



}



@media only screen and (min-width: 320px) and (max-width: 479px) {

	#rotatorWrap, .fullImage{

		width: 320px;

	}



	.rotatorItem .caption .style1, .rotatorItem .caption .style2, .rotatorItem .caption .style3{

		margin-left: 80px;

		font-size: .6em;

		padding: 4px;

	}

	.rotatorItem .caption .style1{

		margin-top: 10px; 

	}



	.rotatorItem .quote p.author{

		/*margin-top: 0px;*/

	}



	.rotatorItem .quote{

		font-size: .8em;

		width: 260px;

		padding: 2em 1.5em 1em 1.5em;

	}	

	

	.wp1{

		width: 100px;

		height: 100px;

		top: 24px;

		left: 30px;

	}	

	.wp2{

		width: 50px;

		height: 50px;

		left: 120px;

		top: 60px;

	}	

	.rotatorItem .caption .wpTitle1{

		margin-top: 20px;

		margin-left: 160px;

		font-size: .6em;

		padding: 6px;

	}

	.rotatorItem .caption .wpTitle2{

		margin-left: 160px;

		font-size: .6em;

		padding: 6px;

	}



	

}