/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
 *	
 *	Annie's Frozen Yogurt (anniesfrozenyogurt.com)
 *	
 *	Description: Primary CSS for anniesfrozenyogurt.com
 *	Author: Jordan Slominski (jordanslominski.com)
 *	Date created: 1-29-2012
 *	Date last revised: 2-18-2012
 *
 * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */

/* Global element styles */

html { /*background: url(../img/bg_html-1.jpg) repeat;*/background: #ffffff url(../img/bg_html-2.jpg) top center no-repeat; /*width: 100%;*/ }
body { /*background: url(../img/bg_body-1.jpg) top center no-repeat;*/ /*width: 100%;*/ }
p, li { font-family: 'Lato', Helvetica, sans-serif; font-size: 13px; line-height: 18px; color: #505050; display: block; }
h1 {  }
h2 { font-family: 'Oswald', Helvetica, sans-serif; font-size: 20px; line-height: 24px; color: #404040; }
h3 { font-family: 'Oswald', Helvetica, sans-serif; font-size: 18px; line-height: 20px; color: #303030; -webkit-transition: color 0.3s ease-in-out; -moz-transition: color 0.3s ease-in-out; transition: color 0.3s ease-in-out; }
h3:hover { color: /*#6dc395*/ #4eab7a; }
h4 {
	font-family: 'Lato', Helvetica, sans-serif;
	/*font-size: 16px;*/font-size: 18px;
	line-height: 20px;
	font-style: italic;
	/*font-weight: bold;*/font-weight: 300;
	/*color: #c21f71;*/color: #707070;
	border-bottom: 1px solid #ffffff;
	padding: 20px 0;
}
hr { border-top: 1px dashed #d0d0d0; border-bottom: 1px dashed #ffffff; border-left: none; border-right: none; margin: 25px 0; height: 0px; width: 100%; float: left; clear: both; }
article, aside, figure, footer, header, hgroup, menu, nav, section { display: block; }


/* Header */
header {
	/*background: url(../img/bg_header.png) bottom center;*/
	height: 138px;
	font-family: 'Lato', Helvetica, sans-serif;
	font-size: 13px;
}
header h1 { background: url(../img/logo.png) no-repeat;
	float: left;
	width: 162px;
	height: 138px;
	margin-left: 11px;
	text-indent: -9999px;
}


/* Main navigation */
nav { float: right; margin-top: 81px; }
nav ul { list-style: none; }
nav ul li {
	float: left;
	font-size: 0.85em;
	font-weight: 700;
	text-transform: uppercase;
	display: inline;
	padding: 2px 20px 2px 8px;
	border-left: 4px solid #ec529d;
	-webkit-transition: border-left 0.3s ease-in-out;
	-moz-transition: border-left 0.3s ease-in-out;
	transition: border-left 0.3s ease-in-out;
}
nav ul li a {
	/*color: #797979;*/color: #937182/*#a08593*/;
	text-decoration: none;
	-webkit-transition: color 0.3s ease-in-out;
	-moz-transition: color 0.3s ease-in-out;
	transition: color 0.3s ease-in-out;
}
nav ul li:hover { border-left: 4px solid #f8aad0; }
nav ul li:hover a { color: #6dc395; }



/* Page titles/slogans */
div#page-title { width: 700px; height: 63px; float: left; clear: left; /*padding-bottom: 15px;*/ }
div#page-title h2 { font-family: 'Oswald', Helvetica, sans-serif; font-size: 28px; line-height: 28px; color: #303030; text-shadow: white 1px 0 0; margin: 10px 0 0 21px; /*margin-left: 21px;*/ }


/* Phone number in header */
div#phone { float: left; width: 180px; /*padding-top: 26px;*/padding-top: 14px; }
div#phone img { padding-left: 10px; }
div#phone p { color: /*#959595*/#937182; display: block; margin: -20px 0 0 48px; }


/* "Home" page content rotator */
div#slider {
	background: url(../img/bg_slider.png) no-repeat;
	height: 376px;
	width: 880px;
	float: left;
}
div#slider img {
	background: #c0e6c8;
	height: 280px;
	width: 790px;
	margin: 14px 0 0 45px;
	-webkit-border-radius: 6px 6px 6px 6px;
	-moz-border-radius: 6px 6px 6px 6px;
	border-radius: 6px 6px 6px 6px;
	border: 1px solid #ffffff;
	float: left;
	display: block;
}



/* Content module styles */
div.module, div#home-left img, div#home-right img {
	background: #ffffff;
	border: 1px solid #f0f0f0;
	-webkit-box-shadow: inset 0 2px 4px #909090;
	-moz-box-shadow: inset 0 2px 4px #909090;
	box-shadow: inset 0 2px 4px #909090;
	-webkit-border-radius: 10px 10px 10px 10px;
	-moz-border-radius: 10px 10px 10px 10px;
	border-radius: 10px 10px 10px 10px;
	float: left;
	position: relative;
	z-index: 1;
}
div.module h3 { padding-bottom: 20px; }




div#home-left img, div#home-right img { padding: 10px; height: 75px; width: 75px; }



div.module.full { padding: 20px; width: 840px; }
div.module.full img { /*background: #ffffff;*/ float: left; /*padding: 0 20px 0 0; border-radius: 5px;*/ }
div.module.full div { float: left; }



div#home-left { float: left; width: 414px; border-right: 1px dashed #d0d0d0; padding-right: 25px; }
div#home-left img { float: left; margin: 0 15px 0 0; }
div#home-left h3 { padding-bottom: 10px; margin-left: 112px; border-bottom: 1px solid #d0d0d0; width: 300px; }
div#home-left p { padding-top: 10px; border-top: 1px solid #ffffff; }
div#home-right { float: left; width: 414px; border-left: 1px dashed #ffffff; padding-left: 25px; }
div#home-right img { float: right !important; margin: 0 0 0 15px; }
div#home-right h3 { padding-bottom: 10px; border-bottom: 1px solid #d0d0d0; width: 300px; }
div#home-right p { padding-top: 10px; border-top: 1px solid #ffffff; }





footer { background: url(../img/bg_footer.png) no-repeat top center; width: 880px; height: 100px; margin-top: 25px; float: left; }
footer p { color: #9b9b9b; text-align: center; padding: 25px 0 0; }
footer p img { padding: 0 0 25px; }





p.first-paragraph { border-top: 1px dashed #d0d0d0; padding-top: 20px; }



div#wrapper { margin: 0 auto; padding: 0 40px; width: 880px; }



/* Contact Form */
form {  }
label { font-family: 'Lato', Helvetica, sans-serif; font-size: 16px; color: #404040; width: 180px; padding: 20px 10px 10px 0; display: inline-block; text-align: right; }
input, textarea { padding: 5px; border: 1px solid #d0d0d0; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; -webkit-transition: box-shadow 0.3s ease-in-out; -moz-transition: box-shadow 0.3s ease-in-out; transition: box-shadow 0.3s ease-in-out; }
textarea { margin-top: 20px; }
input:hover, textarea:hover { box-shadow: 0 0 10px #e0e0e0; }
.textarea * { vertical-align: top; }
input[type="submit"] { font-family: 'Lato', Helvetica, sans-serif; font-size: 16px; color: #ffffff; text-transform: uppercase; background: #6dc395; border: none; text-align: center; margin: 20px 0 0 230px; padding: 10px 15px; -webkit-transition: background 0.3s ease-in-out; -moz-transition: background 0.3s ease-in-out; transition: background 0.3s ease-in-out; font-weight: bold; text-shadow: 0 0 1px #5CB887; -webkit-border-radius: 8px; -moz-border-radius: 8px; border-radius: 8px; border: 1px solid #5CB887; }
input[type="submit"]:hover { background: #88CFA9; cursor: pointer; border: 1px solid #6dc395; }


/* Contact Module */
div#contact-module { float: right; border-left: 1px dashed #e0e0e0; padding-left: 20px; margin-top: 20px; width: 340px; height: 490px; }
div#contact-module h2 { padding: 0 0 15px; border-bottom: 1px solid #ffffff; }
div#contact-module p { padding: 15px 0; }
/*div#contact-module div#map { padding: 10px; background: #f0f0f0; border: 1px solid #d0d0d0; -webkit-border-radius: 3px 3px 3px 3px; -moz-border-radius: 3px 3px 3px 3px; border-radius: 3px 3px 3px 3px; }
div#contact-module div#map iframe { border: 1px solid #d0d0d0; -webkit-border-radius: 3px 3px 3px 3px; -moz-border-radius: 3px 3px 3px 3px; border-radius: 3px 3px 3px 3px; }*/


/* Contact Form */
div#contact-form { float: left; width: 459px; padding-right: 20px; margin-top: 20px; }




p.no-border { border: none; }

table { margin-top: 10px; }
table tr {  }
table tr td { width: 50%; vertical-align: middle; padding: 15px; }
table tr td p, p.larger { font-family: 'Lato', Helvetica, sans-serif; font-size: 20px; line-height: 20px; font-weight: 300; color: #505050; margin-top: 15px; }



p.contact-button { font: 400 15px 'Lato', Helvetica, sans-serif; color: #ffffff; text-shadow: 0 1px 0 #3d9656; background: #6dc395; padding: 5px 20px; border-radius: 5px; }
p.contact-button:hover { background: #88cfa9; cursor: pointer; }



div.pages {
	background: #f0f0f0;
	padding: 10px;
	border: 1px solid #d0d0d0;
	float: left;
	-webkit-border-radius: 3px 3px 3px 3px;
	-moz-border-radius: 3px 3px 3px 3px;
	border-radius: 3px 3px 3px 3px;
	position: relative;
}
div.pages:before, div.pages:after {
	z-index: -1;
  	position: absolute;
  	content: "";
  	bottom: 15px;
  	left: 10px;
  	width: 50%;
  	top: 80%;
  	max-width: 300px;
  	background: rgba(0, 0, 0, 0.7);
  	-webkit-box-shadow: 0 15px 10px rgba(0,0,0, 0.7);
  	-moz-box-shadow: 0 15px 10px rgba(0, 0, 0, 0.7);
  	box-shadow: 0 15px 10px rgba(0, 0, 0, 0.7);
  	-webkit-transform: rotate(-3deg);
  	-moz-transform: rotate(-3deg);
  	-o-transform: rotate(-3deg);
  	-ms-transform: rotate(-3deg);
  	transform: rotate(-3deg);
}
div.pages:after {
  	-webkit-transform: rotate(3deg);
  	-moz-transform: rotate(3deg);
  	-o-transform: rotate(3deg);
  	-ms-transform: rotate(3deg);
  	transform: rotate(3deg);
  	right: 10px;
  	left: auto;
}
div.pages img {
	background: none;
	border: 1px solid #d0d0d0;
	margin: 0 !important;
	padding: 0 !important;
	-webkit-border-radius: 3px 3px 3px 3px;
	-moz-border-radius: 3px 3px 3px 3px;
	border-radius: 3px 3px 3px 3px;
}




/* color: #7d5268; */