@import "normalize.css";
@import "skeleton.css";

body {	
	font-weight:400;
	color: #333;
	background: url(../images/bg.jpg) repeat-x;
	-webkit-font-smoothing: antialiased; 
	-webkit-text-size-adjust: 100%;
	overflow-x: hidden;
	font-family: 'Open Sans', Arial, Helvetica, sans-serif;	
}
/*font size: html is set to 62.5% so that all the REM measurements throughout Skeleton
are based on 10px sizing. So 1.5rem = 15px :) body font-size is set to 1.5em*/
/* heading styles over-riding skeleton */
h1 { font-size: 1.75em; line-height: 44px; color:#96c04e; font-weight: 700; }
.home h1 {font-size: 2em; font-weight: 400; }
h2 { font-size: 1.5em; line-height: 36px; color:#7f7f7f; font-weight: 400;  }
h3 { font-size: 1.75em; color: #96c04e; font-weight: 700;	margin-top: 30px;}

p { margin: 0 0 1.5em 0; line-height: 170%;}
em { font-style: italic; }
strong { font-weight: bold;}
img, object, video {max-width: 100%; height: auto; display:block;}
img { max-width: 100%; width: auto; border: 0; -ms-interpolation-mode: bicubic;}
hr { border: solid #ff7a00; border-width: 1px 0 0; clear: both; margin: 30px auto; height: 0; width:80%;}

/* links */
a:link, a:visited { 
	color: #7ea241; 
	text-decoration: none; 
	outline: 0;
}
a:hover, a:active { color: #96c04e; }

.align-left{float: left;}
.align-center{text-align: center;}
.align-right{float: right}
.imageLeft {float: left;	margin: 2%;}
.imageRight {float:right; margin: 2%; padding:8px; border:1px solid #c1de7e;}
.imageCenter {margin:2% auto;}

header {margin:0 auto; padding: 0;	width: 100%; z-index: 4;  background:rgba(255,255,255,.9);}
#logo {	height: 125px;	margin:0;	}

#social {text-align:right; margin-top:1em;}
#social p, #social2 p {margin:0;}
#social img, #social2 img {display:inline; text-align:right;}
#social a img, #social2 a img{margin-bottom:4px;}
#social a img:hover, #social2 a img:hover{margin-bottom:2px;}
#social img.logo, #social2 img.logo {padding: .75em 1%;}
#social img.icon, #social2 img.icon {padding: .75em .5%;}

.nav-container {width: 100%; background-color:#9cc623;}
nav {	
	width: 100%;
	text-align:center;	
	font-size: 1.125em;
	/*font-family: 'PT Sans', Arial, sans-serif;	*/
	text-transform:uppercase;
	font-weight:700;
	position: relative;	
	z-index: 10;	
}
nav ul {
	padding: 0;
	margin: 0 auto;
	list-style:none;
}
nav li {
	display: inline;	
	padding:0 5.25%;
	margin:0; 
}
nav a {	
	display: inline-block;
	padding: .5em 0;
	text-decoration: none;		
}

nav a:link, nav a:visited {color:#fff;} 
nav a:hover, nav a:active {color:#e0f8a1;}

nav a#pull {display: none;}

.content {padding: 2.5em 0;}
.content.home {text-align:center; margin: .25em auto 0 auto; padding: 0 0 2.5em 0;width:90%;}
.home h1 {margin-bottom:0;}
.photoset-grid {margin-bottom:3em; }
.photoset-grid1, .photoset-grid2, .photoset-grid3, .photoset-grid4 {margin-bottom:2em; }
.photoset-grid1 .photoset-row, .photoset-grid2 .photoset-row, .photoset-grid3 .photoset-row {overflow:visible!important;}
.photoset-grid1 img, .photoset-grid2 img, .photoset-grid3 img {margin-bottom:5px; }
.logos {text-align:center; margin-top: 3em;}
.logos img {display:inline;}
.video-container {position: relative; padding-bottom: 56.25%;  padding-top: 35px; height: 0; overflow: hidden; margin-bottom: 3rem; }
.video-container iframe {position: absolute; top:0; left: 0; width: 100%; height: 100%;}
.testimonial { color:#7f7f7f; padding: 2em 10%; font-style:italic; }
.form-label {width:46%; padding:.5em 2%; float:left; text-align:right;}
.form-input {width:50%; float:left; text-align:left;}
.contact-submit {margin: 1em auto;}

footer {width: 100%;	display: block;	background-color:#8eb41f;	font-weight:400;}
.footerMiddle {color:#fff; padding: 1.5em 0 0 0;	margin: 0;	position: relative;}
footer a:link, footer a:visited {color:#fff;}
footer a:hover, footer a:active {}
.footerBottomText {	min-height: 60px; position: relative;}
footer #social2 {text-align:right;}
#copyright {color: rgba(255,255,255,.7); margin: 1.5em 0; font-size: .85em;}
#copyright a, #copyright span {color:rgba(255,255,255,.7);}
#copyright a:hover, #copyright a:active{border:0;}

/* Clearfix */
.clearfix:before,
.clearfix:after {
    content: " ";
    display: table;
}
.clearfix:after {
    clear: both;
}
.clearfix {
    *zoom: 1;
}

/*media queries*/
@media screen and (max-width: 1140px) {
/* ipad portrait */
  .whats-new {position:absolute;right:-5em;}
  nav ul li {padding:0 3.5%; }  
	
	.content {-webkit-overflow-scrolling : touch;}	
	header {-webkit-overflow-scrolling : touch;}
	
}


/* mobile devices */
@media only screen and (max-width: 767px) {
  header {position:relative;}
  .content.home {margin-top:0;}
  .whats-new {display:none;}
  h1 { font-size: 1.5em;}
  .home h1 { font-size: 1.5em;}
  h2 { font-size: 1.25em;}
	
	nav ul {
		display: none;
		height: auto;
	}
	nav li {
		display: block;		
		width: 100%;
	}
	nav li a {
    width: 100%;
		border-bottom: 1px solid #e0f8a1;
		text-align: left;	
	}
	nav a#pull {
		display: block;		
		width: 100%;
		position: relative;
	}
	nav a#pull:after {
		content:"";
		background: url('../images/nav-icon.png') no-repeat;
		width: 30px;
		height: 30px;
		display: inline-block;
		position: absolute;
		right: 15px;
		top: 10px;
	}

.imageLeft {float: none;	margin: 2% auto; max-width:96%;}
.imageRight {float:none; margin: 2% auto; max-width:96%;}
#social p, #social2 p, #copyright, #phone {text-align:center;}
#logo img, #phone img {margin:0 auto;}

}
@media screen and (max-width: 480px) {
.content.home {text-align:left;}	
#copyright {font-size:1em;}
#social2 img.logo {padding: .75em 1%;}
#social2 img.icon {padding: .75em 2%;}

}