/*
Theme Name: Olivo Lite Child
Theme URI: https://www.quemalabs.com/theme/olivo-lite/
Version: 1.0.3
Description: Olivo Lite Child Theme
Author: Tresa Horney
Author URI: https://tresahorney.com
Template: olivo-lite
License: GNU General Public License v2 or later
License URI: LICENSE
Tags: portfolio, photography, two-columns, custom-background, threaded-comments, custom-menu, featured-images, sticky-post, translation-ready
Text Domain: olivo-lite-child
*/

 /* Added Custom Styles */
 html { font-size: 1.125em; }
.olivo-site-wrap > .container {
	width: 100%;
    z-index: 1000;
    padding: 0;
}
.olivo-site-wrap > .container .row {
	width: 100%;
	margin:auto;
	padding: 0;
}
 .olivo-sidenav .olivo-site-wrap > .container .row {
	
	margin:auto;
	padding: 20px;
}
 /* Header and Primary Menu - top bar and vertical */
 #header{    
		background: rgba(255,255,255,.54);
	}
.olivo-sidenav #header {
    margin: 14.88888888888889rem 0 0 0;
}
.site-title a:hover {
	color:#227aa5;	
}
.olivo-site-wrap::after {
/*  	background:  url(https://moderncultivator.com/wp-content/uploads/2017/11/mc-logo.png) no-repeat; */
	background: url(https://moderncultivator.com/wp-content/uploads/2017/11/modern-cultivator-logo.png) no-repeat;
 	content: "";
    background-size: 30%;
    background-position: top center;
    /*width: 100%;*/
    position: absolute;
    display: inline-block;
    top: 10px;
    left: -250px;
    z-index: -10;
    width: 100%;
    height:454px;
 }
 .olivo-sidenav .olivo-site-wrap::after  {
 	background-size: 90%;
 	background-position: top right;
    top: 10px;
    left: 10px;
     width: 33%;
    height:454px;
 }
.olivo-site-wrap > .container {
	z-index: 1000;
}
.logo_container .site-title,
.logo_container .ql_logo {
	font-size: 1.4em;
	line-height:125%;
}
.olivo-sidenav #jqueryslidemenu ul.nav > li > a, 
.olivo-sidenav-out #jqueryslidemenu ul.nav > li > a {
    padding: 0.5em;
    font-size: 1em;
}
#jqueryslidemenu ul.nav > li > a {  
	font-size: 1em;
	text-transform: uppercase;
}
.nav > li > a,
.widget #menu-social li a {
	color:#565656;
}
#primary-menu li.active {
	border: solid 1px #acb535;
	color: #acb535;
}
.olivo-sidenav #primary-menu li.active {
	border: none;
	color: #acb535;
	font-weight: 900;
}
.page-header::before, .post-header::before {
    bottom: 0px;
}

.page-title,
.post-header .post-title {background: none;}
.read-more::before {
	top: 90%;
    right: -3%;
    width: 103%;
}
/* Misc text styles and formats */
blockquote {
	margin: 15px 0 0 25px;
}
 form{
 	 width: 50%;
    float: left;
}
/* Customized Images including figure and figcaption */
.template-about video {
    display: block;
    margin: auto;
    width: 100%;
}
.template-about figure {
  display: inline-block;
  position: relative;
  left: 0;
  -moz-transform:rotate(-5deg);
  -webkit-transform:rotate(-5deg);
  -ms-transform:rotate(-5deg);
  transform:rotate(-5deg);
}
.template-about figure.alignright{ float:right;}
.template-about figure.alignleft{ float:left;}
.template-about figure.aligncenter{ float:center;}

.template-about img {
  border-color: white /* for an acceptable IE result*/;
  border-width: 15px;
  -moz-border-image: url(https://tobias-reinhardt.de/img/frame.png) 15 stretch;
  border-image: url(https://tobias-reinhardt.de/img/frame.png) 15 stretch;
  border-style: solid;
  margin: auto;
}

/**********************************************************
* If a caption is supplied the image needs a little space 
* at the bottom to include the caption within the frame
***********************************************************/
.template-about img.hasCaption {
  padding-bottom: 50px;
}
.template-about figcaption {
  position: absolute;
  left: 14px;
  right: 14px;
  bottom: 13px;
  background-color: white;
  text-align: center;
  color: #08a2ad;
  font-family: 'Reenie Beanie', cursive;
  font-size: 30px;
  padding: 10px;
}
/* Footer styles */
footer {
	background: linear-gradient( rgba(214, 178, 96, 0.45), 
	rgba(214, 178, 96, 1),
	rgba(249, 220, 12, 1) ), 
	url(https://moderncultivator.com/wp-content/uploads/2017/11/yellow-cats.jpg) repeat-x;
	background-size: contain;
}
.footer-wrap .container {width: 100%;}
.sub-footer {
	background: rgba(255,255,255,.468); 
	color: #596a6b;
	padding-top: 20px;
}
footer .nav > li {
	display: inline-block;
}
#footer-menu ul li {
    display: block;
}
.footer-wrap h3 {
	margin-top: 0;
	padding-top: 0;
}

.nav_social {
    position: relative;
    text-align: left; 
    float: none;
}

/*
/* ALL MEDIA QUERIES */
/*-----------------------------------------------------------------------------------------------------------------------------------------------------------
*
*/
@media screen and (max-width: 1269px) {
	#header { padding-top: 9.25rem; }
	.olivo-sidenav #header {
	    margin: 11.888889rem 0 0 0;
	}

	.olivo-sidenav .logo_container .site-title, 
	.olivo-sidenav-out .logo_container .site-title,
	.logo_container .site-title, 
	.logo_container .site-title  {
    	padding-right: 0px;
    	z-index: 0;
	}
	.olivo-sidenav .olivo-site-wrap::after,
	.olivo-site-wrap::after {
        background-size: 23%;
	    background-position: top center;
	    left: 0;
	    width: 100%;
	}
	.olivo-sidenav #ql_nav_btn,
	#ql_nav_btn {z-index: 100000;right: 0;}
	#ql_nav_btn i {font-size: 1.6em;}
	 #header{    
		background:none;
	}
}
@media screen and (max-width:1024px){
	.olivo-sidenav .olivo-site-wrap::after,
	.olivo-site-wrap::after {
        background-size: 33%;
	}
	.row {margin: 0;}
	#header { padding-top: 11.888889rem; }
}
@media screen and (max-width:768px){
	.logo_container .ql_logo {padding: 4px 0;}
	.olivo-sidenav .olivo-site-wrap::after, .olivo-site-wrap::after {
	    background-size: 40%;
	}
	.footer-wrap h3 {
		padding-top: 20px;
		text-align: center;
	}
}
@media screen and (max-width:767px){
	/*-----------------------------*/
	/*
	==========================================
	Navigation Menu
	==========================================
	*/
	#header #ql_nav_collapse {
	  float:left;
	  width:100%;
	}

	.olivo-sidenav #primary-menu li.active {
		border: solid 1px #acb535;
		color: #acb535;
		font-weight: 100;
	}
}

@media screen and (max-width:570px){
	#cf,
	#cf img { 
		float: none !important;
		margin: auto !important;
	}
}

@media screen and (max-width: 414px) {
	
	.olivo-sidenav .olivo-site-wrap::after, 
	.olivo-site-wrap::after {
	    background-size: 70%;
	}
	.alignright,
	.alignleft {
		float: none;
		clear: both;
	}
}
#cf {
  position:relative;
  height:277px;
  width:300px;
  margin:0;
  float:right;
}

#cf img {
  position:absolute;
  left:0;
  /*-webkit-transition: opacity 1s ease-in-out;
  -moz-transition: opacity 1s ease-in-out;
  -o-transition: opacity 1s ease-in-out;
  transition: opacity 1s ease-in-out;*/
  -webkit-animation-name: cfFadeInOut;
    -webkit-animation-timing-function: ease-in-out;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-duration: 8s;
    -moz-animation-name: cfFadeInOut;
    -moz-animation-timing-function: ease-in-out;
    -moz-animation-iteration-count: infinite;
    -moz-animation-duration: 8s;
    -o-animation-name: cfFadeInOut;
    -o-animation-timing-function: ease-in-out;
    -o-animation-iteration-count: infinite;
    -o-animation-duration: 8s;
    animation-name: cfFadeInOut;
    animation-timing-function: ease-in-out;
    animation-iteration-count: infinite;
    animation-duration: 8s;

}

@keyframes cfFadeInOut {
  0% {
    opacity:1;
  }
  17% {
    opacity:1;
  }
  25% {
    opacity:0;
  }
  92% {
    opacity:0;
  }
  100% {
    opacity:1;
  }
}
#cf img.top {
animation-name: cf3FadeInOut;
animation-timing-function: ease-in-out;
animation-iteration-count: infinite;
animation-duration: 10s;
animation-direction: alternate;
}
#cf img:nth-of-type(1) {
  animation-delay: 6s;
}
#cf img:nth-of-type(2) {
  animation-delay: 4s;
}
#cf img:nth-of-type(3) {
  animation-delay: 2s;
}
#cf img:nth-of-type(4) {
  animation-delay: 0;
}
