/*
* Skeleton V1.1
* Copyright 2011, Dave Gamache
* www.getskeleton.com
* Free to use under the MIT license.
* http://www.opensource.org/licenses/mit-license.php
* 8/17/2011
*/

/* Table of Content
==================================================
	#Site Styles
	#Page Styles
	#Media Queries
	#Font-Face */

/* #Site Styles
================================================== */

body {font-size: 12px; color: #333; font-family: "Helvetica Neue", "Lucinda Grande","Arial", sans-serif; line-height: 1.6em; background: #ebebeb;}

h1,h2,h3,h4,h5,h6 {}

h1 {}
h2 {}
h2.pagetitle {font-size: 4em;color: #77a22f; margin: 0; padding: 25px 10px 25px 10px;}
h3 {font-size: 3em;color: #77a22f; margin: 0; padding: 50px 0 0 0;}
h3.news-sub-cat-title {text-align: left;}
h5.teamtitle {font-size: 1.2em;color: #666; margin: 0; padding: 0 0 25px 0; font-weight: 200; font-style: italic;}


p {font-weight: 200; font-size: 1.2em;}

a {text-decoration: none; color: #77a22f;}
a:hover {color: #C800FF;}
a:visited {color: #90a36f;}

a.callout {font-size: 0.6em !important;  padding: 5px 10px; background: #77a22f; color: #fff; text-transform: uppercase; float: right; margin-top: 20px;}
a.callout:hover {background: #333; color: #77a22f;}

a.calloutbtn { background: #77a22f; color: #fff; text-transform: uppercase; padding: 10px; font-size: 0.8em; text-align: center;}

.xsmall {font-size: 0.7em; color: #999; text-transform: uppercase; padding: 0; margin: 0;}

.container {background: #fff; padding: 0 15px;}
ul {padding: 0;margin: 0;}
li {padding: 0;margin: 0;}

.pad {padding: 25px;}
.copycallout {font-size: 1.8em; font-style: italic; font-weight: 200; line-height: 1.6em; color: #666; padding-bottom: 10px; border-bottom: 1px solid #77a22f; float: left;}
.contactcallout {font-size: 1.8em; font-style: italic; font-weight: 200; line-height: 1.6em; color: #666; padding-bottom: 10px; border-bottom: 1px solid #77a22f; float: left;}

.content {padding-top: 75px;}
.herocontent {padding-top: 25px;}
.leftcontent {padding-top: 25px;}


      
        

#map_canvas {height: 100%;margin: 0px;padding: 0px; height:400px;}
#selecter {max-width: 300px; float: right;}
select#placeSelect {color: #77a22f; padding: 5px; font-size: 1.5em;}
.project-map-head {font-size: 2.5em;color: #77a22f; margin: 0; padding: 0 0 0 0;}

#newsletter-home {position:absolute; top:75px;background: none;color: #fff; padding: 15px; }
#newsletter-home h3 {font-family: "Helvetica Neue", "Lucinda Grande","Arial", sans-serif; color: #fff; font-size: 3.5em; padding-bottom: 0.3em; font-weight: 200;}
#newsletter-home input { font-size: 1.7em; padding: 1em; width: 80%; font-weight: 300; background: none;color: #666; border: 1px solid rgba(255,255,255,0.5); margin: 0.2em;}
#newsletter-home input:focus {background: rgba(255,255,255,0); color: #fff; border: none; color: #fff;border: 1px solid rgba(255,255,255,0.5);}

#newsletter-home [placeholder]:focus::-webkit-input-placeholder {
  transition: opacity 0.2s 0.3s ease; 
  opacity: 0;
}

.single-post-list {margin-bottom: 25px;}
.post-meta {width: 100%; margin: 0 0 10px 0; padding: 0; float: left; border-bottom: 1px solid #ebebeb;}
span.thedate {font-size: 0.9em; color: #999; text-align: left; margin: 0; padding: 0; }
span.thecategories {text-align: right; color: #666; font-size: 0.9em;margin: 0; padding: 0;}
ul.post-categories {float: right; margin: 0; padding: 0;}
ul.post-categories li {float: left; margin: 0; padding: 0; margin-left: 10px;}
ul.post-categories li a {color: #ccc;}



.single-post h3 {font-size: 1.8em;color: #77a22f; margin: 0; padding: 0 0 10px 0;}


.mzero {margin: 0 auto; max-width: 940px;}
#topbar {float: right; width: 100%;}
#menuwrap {float: right;}



.main { background: none; padding: 25px 35px 20px 25px; font-size: 1em;}

#logo {position: absolute; top:0; left:0; z-index: 1111;}
#logo2 {float: left; margin: 0; padding: 20px 0 0 0;}

#intro {height: 600px;background: #000 url(../images/fleming-intro2.jpg) 50% 0 no-repeat fixed;margin: 0 auto; padding: 0;}
#introteam {height: 300px;background:url(../images/fleming-team-large2.jpg) 50% 0 no-repeat fixed;margin: 0 auto; padding: 0;}
#bg-profile {height: 600px;background: #000 url(../images/nelson-profile.jpg) 50% 0 no-repeat fixed;margin: 0 auto; padding: 0;}
#bg-contact {height: 300px;background: #000 url(../images/bg-contact-300.jpg) 50% 0 no-repeat fixed;margin: 0 auto; padding: 0;}

ul#bgchanger {max-width: 300px;  float:right;padding: 10px 0 0 0;}
ul#bgchanger li {float: left;-webkit-border-radius: 8px;
-moz-border-radius: 8px;
border-radius: 8px;
cursor: pointer;
display: inline-block;
height: 16px;
margin: 0px 5px;
background: #ccc;
text-indent: -9999px;
width: 16px;

}

#recent-news {padding-top: 25px}

.featured {font-size: 1.5em; padding: 25px 0 10px 0;  margin:25px 0; line-height: 1.8em; background: #fff; border-top: 1px solid #77a22f; border-bottom: 1px solid #77a22f; }

.calloutwrap {margin: 0;}





.menu {float: right; padding: 8px 0 0 0; margin: 0;} 
li.menu-item a {padding: 10px 25px; display: block; margin: 0; float: left; font-size: 0.8em; text-transform: uppercase; color: #666;}  
li.menu-item a:hover {color:#77a22f;} 
li.menu-item a.active {color:#77a22f;} 
li.menu-item a.current {color:#77a22f;}   
a#active-top {color: #77a22f;}

.menuwrap2 {list-style: none; z-index: 9999;}
.menu2 li {float: left;}


#contactform {border-left: 1px solid #77a22f; float: right; padding-left: 15px; margin-top: 25px;}
.contactlist {font-size: 1.2em; padding: 0 0 25px 0; color: #666;  margin-top: 25px;} 
.gfield_label {font-size: 1.2em;}
.gfield input {padding: 3px !important;font-size:1.6em !important;}
.gform_button {padding: 10px !important;font-size:1.6em !important; background: #77a22f !important; color:#fff !important; border:none; font-size: 1.4em !important; cursor: pointer !important; text-transform: uppercase !important;}

#contactform ul {list-style: none;}
#contactform ul li {padding: 10px; border-top: 1px solid #ccc;}
#contactform ul li a {float: right; text-transform: uppercase;}
#contactform ul li.department {border-top:none; padding-top: 20px; font-size: 1.5em;color: #77a22f; margin: 0; }

.footer p {font-size: 0.9em; text-align: center;}   
.footer-home {font-size: 1.4em; line-height: 1.4em;}

ul.news-cats {list-style: none;}
ul.news-cats li {padding: 10px; border-top: 1px solid #ccc;}

/* #Page Styles
================================================== */

a.slidelink {font-size:1.5em; background:#fff; padding:15px; float:right; margin-top:25px; text-transform: uppercase;}

.project-info-wrap {background: #fff; z-index: 1000;}
.project-info-wrap h3 {margin: 10px 0 0 0; padding: 0; font-size: 2.5em;}

.entry-sidebar {background: #fff;}
.entry-data {padding: 15px; border-left: 1px solid #ccc; margin-top: 20px;}
ul.entry-data li {margin-bottom: 10px;}

ul.projects {list-style: none;margin: 0; padding: 0;}


ul.projects li img {margin: 0; padding: 0; border: none;line-height: 0; vertical-align: top;}
ul.projects li p {margin: 0; padding: 0;}
ul.projects li {float: left; width: 400px; background: #ebebeb;  box-shadow: 1px 1px 1px #cccccc; background: #fff; padding: 0; height: 200px;}
a.project-link {padding: 10px; background: #fff; font-size: 1.8em; position: relative; top:150px;}
ul.projects li:hover {background: #ccc;}

ul.project-overview {list-style: none; padding: 1em;}
li.cleared {clear: both;} 
ul.project-tags {list-style: none; display: inline; font-size: 1em;}
ul.project-tags li {float: left !important; margin-right: 3px;}
ul.project-tags li:after {
    content: ', '
}

ul.project-tags li:last-of-type:after {
    content:''
}

/* PROJECT PAGE ======== */
p.project-excerpt {font-style: italic;}
.list-item-head {text-transform: uppercase; font-size: 0.8em; color: #999; clear:both;}

.project-desc { text-align: left; background: #fff;}

ul.projectimg {list-style: none; margin-top: 50px; background: #fff; padding: 10px; float: left;}
ul.projectimg li {width: 50px; height: 50px; float: left; margin: 5px; background: #ccc;}

/* PHOTO FEED PAGE ======== */
#photo-feed {margin-left: 0; }
.instagram-badge {float: right;}
.photo-feed-head {font-size: 2em;color: #77a22f; margin: 0; padding: 0 0 0 0; font-style: normal;}

/* TEAM PAGE ======== */
ul.related-projects li {}

#singleteam {padding-left: 0;}
#teammemberinfo {float: right; background: #fff;}
#teamimg {position: absolute; left:25%; z-index: 1;}
#teammemberwrap {margin-left: 0;}
#tmcontent {margin-left: 0;}


::-webkit-input-placeholder {
   color: #ebebeb;
}

:-moz-placeholder { /* Firefox 18- */
   color: #ebebeb; 
}

::-moz-placeholder {  /* Firefox 19+ */
   color: #ebebeb; 
}

:-ms-input-placeholder {  
   color: #ebebeb;  
}
/* #Media Queries
================================================== */

	/* Smaller than standard 960 (devices and browsers) */
	@media only screen and (max-width: 959px) {}

	/* Tablet Portrait size to standard 960 (devices and browsers) */
	@media only screen and (min-width: 768px) and (max-width: 959px) {}

	/* All Mobile Sizes (devices and browser) */
	@media only screen and (max-width: 767px) {
		
		body {background: #fff;}
		img {max-width: 100%;}
		
		.container {padding: 0;}
		
		#camerawrap {height: 200px;}
		#camerawrap-ct {height: 200px;}
		ul.project li {}
		#intro {height: 300px; background-position: center bottom;}
		#bg-profile {height: 300px;}
		#bg-contact {height: 300px;}
		#introteam {display: none;}
		.calloutwrap {text-align: center;}
		a.callout {display: block; clear: both; float:left;min-width:280px; text-align: center; margin-top: 0;}
		ul#bgchanger {max-width: 300px;  float:right;padding: 10px 0 10px 0;}
		.copycallout {padding-top: 25px; font-size: 1.4em;}
		.herocontent {padding-top: 10px;}
		.contactcallout {font-size: 1.4em;}
		#newsletter-home {position:absolute; top:75px;}
		
		#teammemberinfo {margin-top: 400px;}
		
		#teammemberinfo .pad { padding-left: 0;}
		
		#contactform {border-top: 1px solid #77a22f; border-left: none; float: left; padding-left: 0;}
		
		a.slidelink {font-size: 1em;}
		
		.prev {position: absolute; top: 100px; left:0;}
		.next {position: absolute; top: 100px; right:0;}
	
	}

	/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
	@media only screen and (min-width: 480px) and (max-width: 767px) {}

	/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
	@media only screen and (max-width: 479px) {
	.project-map-head {padding-top: 10px; float: left;}
		#selecter {float: left; margin-top:10px;}
		.instagram-badge {float: left;}
		
	}
	
	/* All Desktop Sizes (devices and browser) */
	@media only screen and (min-width: 800px) {
	#menu {}	
	#camerawrap {height: 500px;}
	#camerawrap-ct {height: 300px; margin-top: 10px;}
	#moveup {background: #fff; margin-top: -50px; float: left;}
	.innercontent {padding: 25px; float: left;}
	
	h3.teamname {font-size: 4em;}
	h5.teamtitle {font-size: 2em; padding-top: 10px; color: #999;}
	#teammemberimg {margin-left: 0;}
	#newsletter-home {margin-top:150px;}
	}
	


a#active {color: #77a22f; font-weight: bold; }
	
.menu-link {
	display: none;
	float: right;
	text-decoration: none;
	padding: 0;
}
.menu { 
	float: right; max-width: 60em;
	-webkit-transition: all 0.3s ease-out;  
	-moz-transition: all 0.3s ease-out;
	-ms-transition: all 0.3s ease-out;
	-o-transition: all 0.3s ease-out;
	transition: all 0.3s ease-out; 
}
.menu ul { 
	padding: 0px;
	margin: 0px;
	list-style: none;
	position: relative;
	display: inline-table;
}
.menu > li > ul.sub-menu {
	min-width: 10em;
	padding: 4px 0;
	background-color: #f4f4f4;
	border: 1px solid #CCC;
	border: 1px solid rgba(0, 0, 0, 0.2);
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	-webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
	-moz-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
	box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
	-webkit-background-clip: padding-box;
	-moz-background-clip: padding;
	background-clip: padding-box;
}
.menu ul:after {
	content: ""; clear: both; display: block;
}
.menu ul li {
	padding: 0px;
}
.menu > ul > li { 
	display: inline-block;
}
.menu ul li a { 
	display: block;
	text-decoration: none;
	color: #666;
	font-size: .9em;
}
.menu ul li > a { 
	padding: 1em; font-size: 0.8em; text-transform: uppercase; margin-right: 10px;
}

.menu ul li > a:hover {color: #77a22f; }
.menu ul ul { 
	display: none; 
	position: absolute; 
	top:100%;
	min-width: 160px;
	background-color: #f4f4f4;
	border: 1px solid #CCC;
	border: 1px solid rgba(0, 0, 0, 0.2);
	-webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
	-moz-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
	box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
}
.menu ul li:hover > ul {
	display: block;
}
.menu ul ul > li {
	position: relative;
}
.menu ul ul > li a {
	padding: 5px 15px 5px 10px;
	height: auto;
	background-color: #f4f4f4;
	-webkit-transition: background-color 0.2s ease-out;  
	-moz-transition: background-color 0.2s ease-out;
	-ms-transition: background-color 0.2s ease-out;
	-o-transition: background-color 0.2s ease-out;
	transition: background-color 0.2s ease-out; 
}
.menu ul ul > li a:hover {
	background-color: #000000;
	background-color: rgba(174, 92,16, 0.9);
	color: #fff;
}
.menu ul ul ul {
	position: absolute; 
	left: 100%; 
	top:0;
}


@media screen and (max-width: 768px) {
    
    a.menu-link {
		display: block;
		color: #fff;
		background-color: none;
		padding:10px 0 10px 10px;
		position: fixed; top:0; right:0; z-index: 1000;
		
	}
	.menu {
		clear: both;
		min-width: inherit;
		float: none;
		position: fixed; top:0; left:0; z-index: 999;
		width: 100%;
	}
	.menu, .menu > ul ul {
		overflow: hidden;
		max-height: 0;
		background-color: #ffffff;
		position: fixed; top:0; left:0;
	}
	.menu > li > ul.sub-menu {
	padding: 0px;
	border: none;
	-webkit-border-radius: 0px;
	-moz-border-radius: 0px;
	border-radius: 0px;
	-webkit-box-shadow: none;
	-moz-box-shadow: none;
	box-shadow: none;
	-webkit-background-clip: padding-box;
	-moz-background-clip: padding;
	background-clip: padding-box;
	
	}
	.menu.active, .menu > ul ul.active {
		max-height: 55em;
	}
	.menu ul {
		display: inline;
	}
	.menu > ul {
		border-top: 1px solid #808080;
	}
	.menu li, .menu > ul > li {
		display: block;
	}
	.menu li a {
		color: #000;
		display: block;
		padding: 0.8em; font-size: 2em;
		border-bottom: 1px solid #808080;
		position: relative;
	}	
.menu ul li > a { 
	padding: 1em; font-size: 1em; text-transform: uppercase;
}
	
	.menu li.has-submenu > a:after {
		content: '+';
		position: absolute;
		top: 0;
		right: 0;
		display: block;
		font-size: 1.5em;
		padding: 0.55em 0.5em;
	}
	.menu li.has-submenu > a.active:after {
		content: "-";
	}
	.menu ul ul > li a {
		background-color: #e4e4e4;
		height:58px;
		
		padding: 19px 18px 19px 30px;
	}
	.menu ul ul, .menu ul ul ul {
		display: inherit;
		position: relative;
		left: auto; top:auto;
		box-shadow: none; 
		border:none;
	}
}

a#active {color: #fff; margin: 0 0 0 0 !important;  font-weight: 300; } 
a.secondary {background: #77a22f; color:#fff !important; margin: 0 0 0 0 !important; padding: 15px 20px !important;} 
a.secondary:hover {background: #fff; color:#77a22f !important; margin: 0 0 0 0 !important; padding: 15px 20px !important;} 
