/*
Theme Name: Latest Human Animal Develop
Theme URI: https://thehumananimal.net
Author: Gabriel Ward
Author URI: https://wordpress.org/
Description: This theme is clean, blog-focused, and designed for clarity. 
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: black, blue, gray, pink, purple, white, yellow, dark, light, two-columns, left-sidebar, fixed-layout, responsive-layout, accessibility-ready, custom-background, custom-colors, custom-header, custom-menu, editor-style, featured-images, microformats, post-formats, rtl-language-support, sticky-post, threaded-comments, translation-ready
Text Domain: Latest Human Animal Develop

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.
*/


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

* {
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
body {
	font: normal 100%/1.9 'Merriweather', sans-serif;
	color: #222;
	background: #F0F0F0;
	-webkit-font-smoothing: antialiased;
}

html, body {
	height: 100%;
}

.postBackground, .postContent {
	
}

h1, h3 {
	font-family: "Lato", sans-serif;
}

img {
	/*padding: 5px;*/
}

a {
	text-decoration: none;
}

/* Main Layout Styles
================================ */

.main-header {
	transition: .2s;
  	-moz-transition: .2s;
  	-webkit-transition: .2s;
	position: relative;
	padding-top: 10px;
	padding-bottom: 10px;
	margin-bottom: 10px;
	height: 125px;
	background: #2c3135;
	text-align: center;
}

.box-shadow {
	-webkit-box-shadow: 0 1px 3px #bbb;  /* Safari 3-4, iOS 4.0.2 - 4.2, Android 2.3+ */
  	-moz-box-shadow:    0 1px 3px #bbb;  /* Firefox 3.5 - 3.6 */
  	box-shadow:         0 1px 3px #bbb;  /* Opera 10.5, IE 9, Firefox 4+, Chrome 6+, iOS 5 */
}

.main-logo  {
	text-align: center;
	position: relative;
	font-family: 'Lato', sans-serif;
	font-size: 1em;
	width: 100%;
	color: black;
}

.main-nav {
	width: 100%;
	position: absolute;
    z-index: 5;
	padding: 11px 0;
	margin: 0;
}

h1 {
  font-size: 1.7em;
  /* 2x body copy size = 32px */
  line-height: 1.15;
  /* 45px / 36px */
}

h1.site-title a,
h3.byline a {
	text-decoration: none;
	color: #fff;
}

.site-title,
.byline {
	padding: 0;
	margin: 0;
	-webkit-transition: all 0.4s ease-in-out 0s;
	transition: all 0.4s ease-in-out 0s;
}

.site-title a {
	transition: -webkit-transform .15s ease-in;
}

.site-title a:hover {
	display: block;
	-webkit-transform: scale(1.1);
}

.main-logo a {
	color: blue;

}

.main-nav {
	text-align: center;
	
}

.main-nav li:last-child {
	margin-right: 0;
}

.main-nav a {
	display: block;
	position: relative;
	color: #fff;
	border-radius: 2px;
	text-decoration: none;
	padding: 0 15px;
	font-family: 'Lato', sans-serif;
}

.main-nav-scrolled {
  position: fixed;
  width: 100%;
  top: 0;
}

.main-nav-scrolled {
	background: #2c3135;
	margin-top: 0;
	z-index: 10;
	box-shadow: 0 2px 3px rgba(0,0,0,.4);
}

.site-name {
	position: fixed;
	z-index: 10;
	font-family: "Lato", sans-serif;
	margin-top: -164px;
	margin-left: 2%;
	display: none;
	color: #fff;
	text-decoration: none;
}

/*.site-name:hover {
	color: #02c14e;
}*/

.excerpt .img-container img {
	margin: 0;
}

.footerContainer {
	text-align: center;
	position: relative;
	height: 60px;
}

p.author {
	width: 100%;
	position: absolute;
    top: 10%;
    display: block;
    -webkit-transform: translateY(-10%);
    -ms-transform: translateY(-10%);
    transform: translateY(-10%);
}

.articleTitle {
	text-align: center;
}

.image {
	text-align: center;
	position: relative;
	display: block;
	overflow: hidden;
}

.text {
    max-width: 100%;
	max-height: 100%;
    background: rgba(121, 151, 241, 0.7);
    position: absolute;
    margin: 0 auto;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    opacity: 0;
    transition: opacity 0.2s ease;
    text-align: center;
    font-size: 3em;
}

.text p {
    position: absolute;
    top: 45%;
    left: 30%;
    -webkit-transform: translateY(-45%), translateX(-30%);
    -ms-transform: translateY(-45%), translateY(-30%);
    transform: translateY(-45%), translateX(-30%);
    margin: 0 auto;
    padding: 0 15%;
    font-size: 2em;
    color: white;
    font-family: 'Lato', sans-serif;
    width: 40%;
}

.text:hover {
	opacity: 1;
}

#storyText {
	padding: 0 5%;
}

.pageTitle h1, .postContent p {
	margin: 0;
	padding: 0;
}

.pageTitle h1 {
	padding: 0;
}

.postContent p {
	margin-bottom: 10px;
}

.postContent p:last-child {
	margin-bottom: 30px;
}

.postContent a {
	color: #003399;
	text-decoration: none;
}

.pageTitle {
	margin: 0 auto;
	padding: 
}

.pageTitle h3 {
	font-size: 1.15;
	line-height: 1.2;
	margin: 0 0 10px 0;
	color: #003399;;
}

.excerpt {
	text-align: left;
	position: relative;
	padding: 10%;
	background: white;
	padding: 0;
	min-height: auto;
}

.moretag {
	text-decoration: none;
}

.moretag:visited {
	color: black;
}

.excerpt h2 {
	margin-bottom: 0px;
}

.excerpt h3 {
	color: #F96436;
	margin: 0 0 4px;
}

.excerpt p {
		margin: 0;
  		font-size: 0.925em;
  		line-height: 1.6;
}

.col-group:nth-child(3n+3) div.excerpt {
	border-right: 0;
}

.postBackground {
	width: 100%;
	max-width: 50em;
	margin: 0 auto 40px;
	background: #fff;
}

.pageTitle,
.postContent {
	margin: 0 auto; 
	width: 95%;
	max-width: 36.5em;
}

.pageTitle {
	padding-top: 40px;
}

h1 {
	padding: 0;

}

.post-link {
	text-align: center;
	padding-bottom: 40px;
}

.post-link a {
	text-decoration: none;
	padding: 50px 0;
	margin: 0 10px;
	color: #000;
}

.footerContainer {
	width: 100%;
	height: 142px;
	text-align: center;
	margin: 50 auto;
	background: #2c3135;
	color: white;
	position: relative;
	transition: opacity 0.1s ease;
}

.footerContainer p {
	font-size: 0.7em;
	position: absolute;
    top: 30%;
    -webkit-transform: translateY(-30%);
    -ms-transform: translateY(-30%);
    transform: translateY(-30%);
}

/* Imagery
================================ */

.feat-img img {
	width: 100%;
	height: auto;
	display: block;
}

.postImgCon .post-img {
	width: 100%;
}

.post-img img {
	display: block;
	width: 100%;
	height: auto;
	margin: 0 auto;
}

.group:after {
	content: "";
	display: table;
	clear: both;
}

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

/* - - - - - - - Header - _ - - - - - */
	
	body {
		margin-top: 75px;
	}

	.wrapper {
		height: auto;
	}

	.main-header {
		height: 55px;
		position: fixed;
		top: 0;
		width: 100%;
		z-index: 100;
	}

	.main-logo {
		top: 0;
	}

	.byline {
		display: none;
	}

	.main-nav {
		display: none;
	}

	.main-logo {
		top: 0;
	}

	#nav-icon1 {
		 width: 30px;
		 height: 20px;
		 position: relative;
		 -webkit-transform: rotate(0deg);
		 -moz-transform: rotate(0deg);
		 -o-transform: rotate(0deg);
		 transform: rotate(0deg);
		 -webkit-transition: .5s ease-in-out;
		 -moz-transition: .5s ease-in-out;
		 -o-transition: .5s ease-in-out;
		 transition: .5s ease-in-out;
		 cursor: pointer;
		 z-index: 1000;
		 top: -20px;
		 left: 90%;
	}

	#nav-icon1 span {
		display: block;
		position: absolute;
		height: 2px;
		width: 60%;
		background: #fff;
		border-radius: 9px;
		opacity: 1;
		left: 0;
		-webkit-transform: rotate(0deg);
		-moz-transform: rotate(0deg);
		-o-transform: rotate(0deg);
		transform: rotate(0deg);
		-webkit-transition: .25s ease-in-out;
		-moz-transition: .25s ease-in-out;
		-o-transition: .25s ease-in-out;
		transition: .25s ease-in-out;
		z-index: 100;
	}

	#nav-icon1 span:nth-child(1) {
		top: 0px;
	}

	#nav-icon1 span:nth-child(2) {
		top: 5px;
	}

	#nav-icon1 span:nth-child(3) {
		top: 10px;
	}

	#nav-icon1.open span:nth-child(1) {
		top: 8px;
		-webkit-transform: rotate(135deg);
		-moz-transform: rotate(135deg);
		-o-transform: rotate(135deg);
		transform: rotate(135deg);
	}

	#nav-icon1.open span:nth-child(2) {
		opacity: 0;
		left: -60px;
	}

	#nav-icon1.open span:nth-child(3) {
		top: 8px;
		-webkit-transform: rotate(-135deg);
		-moz-transform: rotate(-135deg);
		-o-transform: rotate(-135deg);
		transform: rotate(-135deg);
	}

	.overlay {
		display: none;
		position: fixed;
		top: 0;
		left: 0;
		height: 100%;
		width: 100%;
		background: rgba(131,191,251,0.9);
		overflow: auto;
		font-family: 'Lato', sans-serif;
		text-align: center;
		margin-top: 0 auto;
		z-index: 100;
	}

	.overlay ul {
		list-style: none;
		padding: 0;
		margin: 0 auto;
		display: block;
		height: 100%;
		position: relative;
		font-size: 2em;
		width: 100%;
		padding-top: 17%;
		text-align: center;
	}

	.overlay ul li {
		display: block;
		height: 20%;
		height: calc(100% / 5);
		min-height: 54px;
		margin: 0 auto;
	}

	.overlay ul li a {
		display: block;
		color: #fff;
		text-decoration: none;
		width: 100%;
	}

	.overlay ul li:last-child {
		margin-right: 0;
	}

	.overlay ul li a:hover,
	.overlay ul li a:focus {
		color: #e3fcb1;
		background: white;
		width: 100%;
		cursor: pointer;
	}

	/* - - - - - - - Front Page - - - - - - - */ 

	.metaSlider {
		width: 80%;
		margin: 0 auto 15px;
		padding: 0;
	}

	.frontContainer {
		width: 80%;
		margin: 0 auto 15px;
		padding: 0;
	}

	.frontContainer .excerpt {
		width: 100%;
		float: left;
	}

	.frontContainer .img-container  {
		width: 100%;
		margin: 0 auto;
	}

	.frontContainer .excerpt h3 {
		padding: 15px 15px 0;
	}

	.frontContainer .excerpt p {
		padding: 0 15px 15px;
	}

	/* - - - - - - - Blog Page - - - - - - - */ 
	
	.articleContainer {
		width: 80%;
		margin: 0 auto 10px;
		padding: 0;
		background: red;
	}

	.col-group {
		width: 100%;
		float: left;
		vertical-align: top;
		padding: 0;
	}

	.articleContainer:nth-child(2n+2) .col-group {
		padding-left: 0;
	}

	.col-group .excerpt {
		padding: 5%;
		min-height: 70px;
	}
}

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

	/* Main Layout Styles
	================================ */

	/* - - - - - - - Header - - - - - - - */ 

	.bottomBorder {
		margin-bottom: 50px;
	}

	.main-header {
		margin-bottom: 50px;
	}

	h1 {
    font-size: 2.5em;
    /* 2.5x body copy size = 40px */
    line-height: 1.125;
  }

  .site-title {
  	letter-spacing: 0.12em;
  }

	.main-nav {
		background: #2c3135;
	}
	

	.main-nav li {
		display: inline-block;
	}
	.main-banner {
		background: #dfe2e4;
		text-align: center;
		padding: 50px 15px;
		margin-bottom: 20px;
	}

	.main-nav a:before, .site-name:before {
		content: "";
		position: absolute;
		width: 100%;
		height: 2px;
		bottom: 0;
		left: 0;
		background-color: #fff;
		visibility: hidden;
		-webkit-transform: scaleX(0);
		transform: scaleX(0);
		-webkit-transition: all 0.3s ease-in-out 0s;
		transition: all 0.3s ease-in-out 0s;
	}

	.main-nav a:hover:before, .site-name:hover:before {
		visibility: visible;
		-webkit-transform: scaleX(1);
		transform: scaleX();
	}

	/* - - - - - - - Front Page - - - - - - - */ 

	.pageMain, .metaSlider {
		width: 90%;
		max-width: 1050px;
		margin: 0 auto;
	}

	.metaSlider {
		margin: auto auto 1%;
		padding: 0.20%;
	}

	.frontContainer {
		width: 32.6%;
		float: left;
		margin-right: 1%;	
		-webkit-transition: all 0.4s ease-in-out 0s;
	transition: all 0.4s ease-in-out 0s;
	}

	.frontContainer:nth-child(3n+3) {
		margin-right: 0;
	}

	.col-group, .front-col {
  		width: 100%;
    	float: left;
    	vertical-align: top;
		overflow: hidden;
  	}

  	

  	.front-col .excerpt h3 {
		padding: 15px 4% 0;
	}

	.front-col .excerpt p {
		padding: 0 4% 15px;
		font-size: 0.975em;
  		line-height: 1.55;
	}

	.front-colTxt {
		min-height: 180px;
	}

	/* - - - - - - - Blog Page - - - - - - - */ 

	.wrapper {
		min-height: 100%;
		/* equal to footer height */
 		margin-bottom: -60px; 
	}

	.wrapper:after {
  		content: "";
  		display: block;
	}

	.footerContainer, .wrapper:after {
		height: 60px; 
	}

	.articleContainer {
  		width: 32.5%;
  		float: left;
  		margin: 0 8px 8px 0;
  		-webkit-transition: all 0.4s ease-in-out 0s;
	transition: all 0.4s ease-in-out 0s;
  	}

  	.articleContainer:nth-child(3n+3) {
		margin-right: 0;

	}
  
  	.col-group {
	  	width: 100%;
	  	margin: 0;
	  	vertical-align: top;
	  	padding: 0;
	  	overflow: hidden;
  	}

  	.col-group .excerpt {
		background: white;
		padding: 5%;
		min-height: 200px;
	}

  	.pageMain .col-group .excerpt p {
  		font-size: 0.975em;
  		line-height: 1.55;
  	}

  /*article.col-group:nth-child(4n+1) {
  		margin-left: 10%;
  	
  }
  article.col-group:nth-child(4n+4) {
  		margin-right: 10%;
  }*/
}

@media screen and (min-width: 1000px) {
	
	.metaSlider {
		margin: auto auto 10px;
	}

	h1 {
    font-size: 3em;
    /* 3x body copy size = 48px */
    line-height: 1.05;
    /* keep to a multiple of the 20px line height 
    and something more appropriate for display headings */
  }
	
	.col-group {
  		width: 100%;
  		margin: 0;
  		vertical-align: top;
  		padding: 0;
	}

	.front-col .excerpt {
  		min-height: 250px;
  	}

	.col-group .excerpt {
	 	
	 }

  	.col-group:nth-child(3n+3) {
  		margin-right: 0;
  	}

  	.excerpt p {
  		font-size: 1em;
  	}
} 

.img-container img {
	width: 100%;
	display: block;
	height: auto;
}

.emailSubscribe .es_lablebox {
	width: 50px;
	float: left;
}

div.emailSubscribe .es_textbox {
	float: left;
	background: gold;
}

div.emailSubscribe .es_textbox {
	float: left;
	background: gold;
}

/* Body Content */

h3 {
	line-height: 1.25;
}

@media (min-width: 40em) {
  .postContent p {
    font-size: 1.05em;
    /* equivalent to 16px */
    line-height: 1.95;
    /* equivalent to 22px */
  }

   h3 {
    font-size: 1.3em;
    /* 1.5x body copy size = 24px */
    line-height: 1.2;
  }

  

  .byline {
  	letter-spacing:  0.05em;
  }
}

@media (min-width: 50em) {
  .postContent p {
    font-size: 1.1em;
    /* equivalent to 16px */
    line-height: 1.9;
    /* equivalent to 22px */
  }

  h3 {
    font-size: 1.35em;
    /* 1.75x body copy size = 28px */
    line-height: 1.2;
  }

   
}

.pquote {
	float: right;
	width: 100px;
}

#portfolioOverlay {
	background: rgba(0, 0, 0, 0.7);
	width: 100%;
	position: fixed;
	top: 0;
	left: 0;
	bottom: 0;
	display: none;
	z-index: 1000;
}

#portfolioOverlay {
	text-align: center;
}

#portfolioOverlay img {
	width: 50%;
	height: auto;
	margin: 0 auto;
	background: gold;
}

#portfolioGallery img {
	float: left;
	display: block;
	width: 33%;
	height: auto;

}

#portfolioOverlay p {
	color: white;
	
}


blockquote {
	color: red;
	display: block;
	width: 100%;
	margin: 0 auto -20px;
}



@media screen and (min-width: 768px) {
	.quoteLeft {
	display: block;
	width: 45%;
	float: left;
	margin-left: -3em;
	margin-right: 40px;
	padding: 0;
}

.quoteRight {
	display: block;
	width: 45%;
	float: right;
	margin-right: -3em;
	margin-left: 40px;
	padding: 0;
}
}

#comment, 
.comment-form-author input, 
.comment-form-email input {
	background: #f0f0f0;
	border: solid 1px transparent;
	box-shadow: inset rgba(56,61,67,0.2) 0 0 3px;
	padding: 7px;
}

#submit {
	color: #fff;
	background: #3c3c3b;
	font-size: .8em;
	padding: 12px 25px;
	border: none;
}

#submit:hover {
	background: #000;
}

.comment-form-comment label, 
.comment-form-author label, 
.comment-form-email label {
	display: block;
	font-size: 0.8em;
	margin-bottom: 5px;
}

.comment-form-email input {
	margin-bottom: 10px;
}

.comment-form-url {
	display: none;
}

.heroBanner {
	max-width: 1050px; 
	width: 90%;
	height: 60%;
	margin: 0 auto 30px;
	overflow-y: hidden;
	overflow-x: hidden;
}

.custom-pagination {
	text-align: center;
}

.custom-pagination span,
.custom-pagination a {
  display: inline-block;
  padding: 2px 10px;
}
.custom-pagination a {
  background-color: #ebebeb;
  color: #ff3c50;
}
.custom-pagination a:hover {
  background-color: #ff3c50;
  color: #fff;
}
.custom-pagination span.page-num {
  margin-right: 10px;
  padding: 0;
}
.custom-pagination span.dots {
  padding: 0;
  color: gainsboro;
}
.custom-pagination span.current {
  background-color: #ff3c50;
  color: #fff;
}

.flex-active-slide { position:relative;}
.flexslider .caption {

	    background-color: rgba(255,255,255,0.4);
	    color:#000;
	    position:absolute;
	    bottom: 0;
	    right:50px;
	    padding:30px;

}
.flexslider .slides .caption img {height:auto; width: auto;}

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

	.flexslider .caption { width:100%; height:100%; right:0; position:relative; padding:10px; }

}

/*----- Contact Us Page ------*/

#ninja_forms_form_1_all_fields_wrap,
.contactContainer {
	max-width: 30.5em;
	width: 98%;
	margin: 0 auto;
	padding-top: 30px;
}

.contactContainer p {
	margin-bottom: 10px;
}

form {
	padding: 0;
}

#ninja_forms_field_1,
#ninja_forms_field_2,
#ninja_forms_field_3 {
	margin: 0 auto;
}

#ninja_forms_field_1_label {
	font-family: 'Merriweather', sans-serif;
}

input[type='text'],
textarea {
	background: red; background: #f0f0f0;
    border: solid 1px transparent;
    box-shadow: inset rgba(56,61,67,0.2) 0 0 3px;
    padding: 12px 16px;
}

input[type='submit'] {
	background: #373D42;
	color: #fff;
	padding: 12px 16px;
	margin-bottom: 30px;
}

.bottomMargin {
	margin-bottom: 30px;
}

.dating_for_human_book {
	text-align: center;
	margin: 0 auto;
	width: 80%;
}

.dating_for_human_book img {
	display: block;
	margin: 0 auto;
	margin-bottom: 30px;
	width: 100%;
}