/*
Theme Name: Dairy Farmers
Theme URI: http://dairyfarmers.com.au/
Author: Mar Manay
Author URI: http://www.marmanay.com
Description: Wordpress Theme for Dairy Farmers
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: dairy-farmers
Tags:
*/

/* Changes */
h1 {margin-bottom:50px;}
h4 {margin-bottom:30px;}
blockquote {
    padding:30px 0;
    border:0;
    margin:0;
    font-size:14px;
    position:relative;
    color:#515151;
}
blockquote ~ blockquote:before {
    content:"";
    position:absolute;
    left:0;
    top:0;
    width:50px;
    border-top:2px solid #001a70;
}
blockquote cite {
    font-size:16px;
    font-style:italic;
    margin:0 0 12px;
    display:block;
}
blockquote cite strong {
    font-style:normal;
    display:block;
}
.location-list {
    margin:30px -25px 15px;
}
.location-list li {
    font-family: AvenirNextCn,Arial,Helvetica,sans-serif;
    text-transform:uppercase;
    color:#adadad;
    padding:0 25px;
}
.location-list li.active {color:#243288;}
.location-list li a {
    	color:#adadad;
	text-decoration:none;
}
.location-list li.active a {color:#243288;}

#video-page {
    background: #000;
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 100%;
    visibility: hidden;
    overflow: hidden;
    z-index: 20;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}
#video-page .video {
    text-align: center;
    height: 100%;
}
#video-page .video .xclose {
    background: url("images/bg-close-white.png") no-repeat scroll center center;
    height: 44px;
    width: 44px;
    position: absolute;
    text-indent: -9999px;
    top: 20px;
    right: 20px;
    -webkit-transform: rotate(0);
    -moz-transform: rotate(0);
    -o-transform: rotate(0);
    -ms-transform: rotate(0);
    transform: rotate(0);
    -webkit-transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;
}
#video-page .video .xclose:hover {
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    transform: rotate(360deg);
    -webkit-transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;
}
#video-page iframe {
    width: 100%;
    height: 100%;
}
body.video-active #video-page {
    visibility: visible;
    left: 0;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}



/* Ajax Content */
#ajax-page {
    background: #fff;
    height: 100%;
    position: fixed;
    top: 0;
    left: 100%;
    right: 0;
    visibility: hidden;
    overflow-y:auto;
    z-index: 20;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}
#ajax-page #loader {
    background: url("images/loader.gif") no-repeat scroll center center;
    width:30px;
    height:30px;
    text-indent:-9999px;
}
#ajax-page #loader[style*="block"] ~ * {opacity:0;}
#ajax-page .ajax-box {
    height: 100%;
    max-width: 770px;
    margin: 0 auto;
    padding:50px 100px 0 80px;
}
#ajax-page .xclose {
    background: url("images/bg-close.png") no-repeat scroll center center;
    height: 44px;
    width: 44px;
    z-index: 1000;
    position: fixed;
    text-indent: -9999px;
    top: 50px;
    right: 50px;
    -webkit-transform: rotate(0);
    -moz-transform: rotate(0);
    -o-transform: rotate(0);
    -ms-transform: rotate(0);
    transform: rotate(0);
    -webkit-transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;
}
#ajax-page .xclose:hover {
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    transform: rotate(360deg);
    -webkit-transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;
}
#ajax-page .back {
    background: url("images/bg-previous.png") no-repeat scroll center center;
    height: 50px;
    width: 30px;
    z-index: 1000;
    position: absolute;
    top: 50px;
    left: 50px;
    text-indent:-9999px;
}
body.ajax-active #ajax-page {
    visibility: visible;
    left:240px;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}



/* Get in touch */
.get-in-touch {
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}
body.lightbox-active .get-in-touch {
    left: 0 !important;
}
body.lightbox-active .get-in-touch .xclose {
    position: fixed !important;
}



/* Fixes ------------------------------------------------------------ */

a[href^="tel"]{
    color:#001a70;
    text-decoration:none;
}
.panel.bottom a[href^="tel"]{
    color:#111111;
}

#header .mobmenu {
	position:fixed;
	-webkit-transition:left 0.2s ease;
	-moz-transition:left 0.2s ease;
	transition:left 0.2s ease;
}
.offset #wrapper #header .mobmenu {left:250px;}

.home-products > a,
.home-farmers > a {
    position:absolute;
    left:0;top:0;right:0;bottom:0;
    z-index:1;
}

#content {overflow:hidden;}
#content .home-page .home-milk-matters .img-milk-matters {
	left:0;
	right:0;
	-webkit-transform:none;
	-moz-transform:none;
	transform:none;
}
#content .home-page .home-milk-matters .img-milk-matters img {
	position:absolute;
	left:50%;
	-webkit-transform:translate(-50%,0);
	-moz-transform:translate(-50%,0);
	transform:translate(-50%,0);
}
#content .home-page .home-video {background-position:center center;}

#content .pagecontent.category {
    position:relative;
}
#content .pagecontent.category .back {
    background: #001a70 none repeat scroll 0 0;
    color: #ffffff;
    font-size: 13px;
    font-weight: bold;
    left: 0;
    line-height: 1;
    padding: 8px 20px 8px 15px;
    position: absolute;
    text-decoration: none;
    text-transform: uppercase;
    top: 0;
    z-index:10;
}

#content .product h1 {margin:0 0 30px}
#content .product-detail .sidebar {width:100%;}
#content .product .product-list .product-box {}
#content .product .product-list .product-box .product-img {
    text-align:center;
    padding:10px 0 60px;
    height: 360px;
      line-height: 290px;
    overflow:hidden;
}
#content .product .product-list .product-box .product-img img {
    width:auto;
    max-height:100%;
    max-width:80%;
}
#content .product-detail {height:100%;}
#content .product-detail .product-related ul li .product-rel img {
    height:180px;
    width:auto;
    max-width:none;
}
#content .product-detail .product-related ul li:nth-child(3) ~ li {
    display: none !important;
}
#content .product-detail .sidebar .product-image {
    background:none;
}

#content .our-story {background:none;}
#content .our-story .pagecontent {
        /* background: rgba(255, 255, 255, 0.4); */
        background: linear-gradient(to bottom, rgba(255,255,255,0.95) 0%, rgba(255,255,255,0) 100%);
    	background-size:cover;
    	padding-bottom:75%;
	min-height:1200px;
}


@media (min-width: 1490px) {
	/*#content .product-detail .product-related {margin-right:-120px;}*/
}
@media (max-width: 991px) {
    body.ajax-active #ajax-page {left: 0}
    #content .product .product-list .product-box .product-img img {max-width:80%;}

}

@media (max-width: 767px) {
    	h1 {font-size:60px;}
    	#ajax-page .ajax-box { padding: 60px 50px 0 50px;}
    	#ajax-page .back {left:5px;top:10px;}
    	#ajax-page .xclose {top:10px; right:20px;}
	#content .home-page .home-milk-matters .img-milk-matters img {position:relative;}

	#content .product h1 {margin:0 auto 30px}
	#content .product-detail .product-related ul li:nth-child(2) ~ li {display: none !important;}
}
@media (max-width: 640px) {
	#content .imgbox .btn-play {left:45%;}
}

@media (max-width: 479px) {
	h1 {font-size:50px;}
   	#ajax-page .ajax-box { padding: 60px 20px 0 20px;}
   	.location-list {margin:30px -12px 15px;}
    	.location-list li {padding:0 12px 10px;}

	.home #header .logo {width:70px;}
	#content .imgbox .btn-play {left:40%;}
	#content .home-page .home-milk-matters .title-milk-matters {right:15px;z-index:2;}
}