/**
 * All of the CSS for your public-facing functionality should be
 * included in this file.
 */


/************************************************/
/* CALLOUT STYLES 				                */
/************************************************/
/*.fusion-callout{ border: 1px solid black; margin-bottom: 30px; }
.fusion-callout .callout-content{ padding: 30px; }
.fusion-callout h2, .fusion-callout h3, .fusion-callout h4, .fusion-callout h5, .fusion-callout h6{ margin: 0; }
.fusion-callout .callout-content p{ margin-top: 16px; }

.fusion-callout.image-align-left img{ padding: 30px; width: 40%; }
.fusion-callout.image-align-left .callout-content{ display: inline-block; width: 60%; }*/


/************************************************/
/* CALLOUT BUTTON STYLES 				        */
/************************************************/
.fusion-callout-button{ padding: 20px; }
.fusion-callout .callout-content h5{ margin: 0; /*color: #9cbf43 !important;*/ }
.fusion-callout .callout-content h1, .fusion-callout .callout-content h2, .fusion-callout .callout-content h3, .fusion-callout .callout-content h4, .fusion-callout .callout-content h5, .fusion-callout .callout-content h6{ color: #9cbf43 !important; }
.fusion-callout.dark-style .callout-content h1, 
.fusion-callout.dark-style .callout-content h2, 
.fusion-callout.dark-style .callout-content h3, 
.fusion-callout.dark-style .callout-content h4, 
.fusion-callout.dark-style .callout-content h5, 
.fusion-callout.dark-style .callout-content h6{ color: inherit !important; }
.fusion-callout h3{ margin: 0; margin-bottom: 5px; }
.fusion-callout .callout-content{ margin-top: 10px; }

.fusion-callout .callout-content-header h3{ color: #999999; }

.fusion-callout-video h3{ margin: 0; margin-bottom: 5px; }
.fusion-callout-video .callout-content-header h3{ color: #999999; }
.fusion-callout .callout-content h5{ font-size: 20px; }

/*******************
Ask the Expert
*******************/

/************************************************/
/* ASK THE EXPERT CAROUSEL STYLES 				*/
/* Some styles for my test carousel callouts 	*/
/************************************************/

.ate-carousel-wrapper {
    border: 1px solid #a7a9ab;
	height: 396px;
	margin-bottom: 20px;
    overflow: hidden;
	position:relative;
}

.ate-carousel-items {
	left:-115px;
    position: absolute;
	top:0;
}

.ate-carousel-items .ate-question {
	background-color: #eeeeee;
	color: #a7a9ab;
    display: inline-block;
	font-size:14px;
	height: 305px;
    margin: 30px 20px 0 20px;
    padding: 40px;
    width: 435px;
    overflow: hidden;
}

.ate-question .button {
	background-color: #cccccc;
	border-radius: 4px;
	color: #ffffff;
	display:inline-block;
	font: bold 16px 'Open Sans';
	margin-top:10px;
	padding: 6px 20px;
}

.ate-top {
	height:160px;
	margin-bottom:8%;
}

.ate-top > .ate-thumb {
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
	display: inline-block;
	margin-right:20px;
    height: 150px;
    width: 150px;
}

.ate-top > .ate-thumb + .ate-content {
    display: inline-block;
    width: 180px;
	vertical-align:top;
}

.post-content .ate-content p{ margin-top: 10px; word-wrap: break-word; }

.favorite-tag {
	background: url('images/favorite-icon-small.png') no-repeat left center;
	background-size: 18px;
	color: #f8a91a;
	display:block;
	font: bold 14px/22px 'Open Sans';
	margin-bottom: 4%;
	padding-left: 24px;
}

.ate-meta {
    display: inline-block;
	font-family: 'Open Sans';
	margin-right: 2%;
    width: 40%;
    vertical-align: top;
    margin-left:10px;
}

.ate-meta p { font-size: 14px; }

/* ACTIVE QUESTION */
.ate-active-question {
	left: 18%;
	position:absolute;
	top:10px;
	z-index:1;
}

.transition-out {
	animation: atetransition 200ms;
	animation-timing-function: ease-in-out;
}

/* Chrome, Safari, Opera */ 
@-webkit-keyframes atetransition {
    0%   { transform:scale(1,1); opacity: 1;}
    50%  { transform:scale(0.9,0.9); opacity: 0.5;}
    100% { transform:scale(1,1); opacity: 1;}
} 

/* Standard syntax */ 
@keyframes atetransition {
    0%   { transform:scale(1,1); opacity: 1;}
    50%  { transform:scale(0.85,0.85); opacity: 0.5;}
    100% { transform:scale(1,1); opacity: 1;}
}

.ate-active-question .ate-question {
	background-color: #ffffff;
	border:1px solid #a7a9ab;
    box-shadow: 0 0 20px rgba(0,0,0,0.25);
	font-size:16px;
	height: 350px;
    padding: 40px;
    width: 500px;
}

.ate-active-question .ate-top { height: 200px; }

.ate-active-question .ate-top > .ate-thumb {
    height: 200px;
    width: 200px;
}

.ate-active-question .ate-top > .ate-thumb + .ate-content { width: 180px; }

.ate-active-question .favorite-tag {
	background-size: 18px;
	font: 16px/24px;
	padding-left: 30px;
}

.ate-question .button { font-size: 14px; }
.ate-active-question .ate-question .button {
    background-color: #f68520;
	font-size: 16px; 
}

/* ATE NAV */
.ate-carousel-wrapper .ate-nav {
	background-color: #404041;
	background-position: center center;
	background-repeat: no-repeat;
	border-radius: 18px;
	display:block;
	height:36px;
	margin-top: -32px;
/*
	position:absolute;
	top:50%;
*/
	width:36px;
}

.ate-carousel-wrapper .ate-nav-prev {
	background-image: url('images/arrow-icon-left.png');
    float: left;
/*	left: 19%;*/
}

.ate-carousel-wrapper .ate-nav-next {
	background-image: url('images/arrow-icon-right.png');
    float: right;
/*	right: 160px;*/
}

.ate-carousel-wrapper .ate-nav{
/*
    top: initial;
    bottom: 45px;
    z-index: 100;
*/
}

.ate-arrows {
    position: absolute;
    width: 500px;
    left: 18%;
    bottom: 40px;
    z-index: 100;
    vertical-align: top;
    padding: 0 10px 5px 10px;
}

.ate-bullets {
	bottom:0;
	left:0;
    margin-top: 20px;
	position:absolute;
    text-align: center;
    width: 100%;
}

.ate-bullets > span {
	background-color: #ffffff;
    border: 1px solid #404041;
    border-radius: 6px;
    display: inline-block;
    height: 12px;
    margin: 2px;
    width: 12px;
}

.ate-bullets > span.active { background-color: #404041; }

/* ATE RESPONSIVE */
@media only screen and (max-width: 767px){
	.ate-carousel-wrapper { overflow:visible; }
	.ate-active-question {
	    left: 50%;
		margin-left:-250px;
    	top: 0;
	}
	.ate-carousel-items { visibility: hidden; }
	
	.ate-carousel-wrapper .ate-nav { z-index:2; }
	.ate-carousel-wrapper .ate-nav-prev { left: -18px; }
	.ate-carousel-wrapper .ate-nav-next { right: -18px; }
}

@media only screen and (max-width: 523px){
	.ate-carousel-wrapper { height: 540px; }
	
	.ate-active-question {
	    left: 0;
		margin-left: 0;
	}
	
	.ate-active-question .ate-question {
		height: 490px;
		padding: 30px;
		width:100%;
	}	
	
	.ate-active-question .ate-top { height: 280px; }
	
	.ate-active-question .ate-top > .ate-thumb {
		height:150px;
		width: 100%;
	}
	
	.ate-active-question .ate-top > .ate-thumb + .ate-content {
		margin-top:20px;
		width: 100%; 
	}
	
	.ate-meta { width: 100%; }
	.ate-active-question .ate-question > .button {
		font-size: 14px;
		padding: 10px 16px;
	}
}

@media only screen and (max-width: 479px){
	.ate-carousel-wrapper {	height: 620px; }	
	.ate-active-question .ate-question { height: 560px; }
	.ate-active-question .ate-top { height: 360px; }
}

@media only screen and (max-width: 359px){
	.ate-carousel-wrapper {	height: 660px; }	
	.ate-active-question .ate-question { height: 620px; }
	.ate-active-question .ate-top { height: 420px; }
}

/* 
Blog
*/
.fusion-cp-blog-shortcode{ border-top: 2px solid #f8a91a; border-bottom: 2px solid #f8a91a; padding-top: 20px; }
.fusion-cp-blog-shortcode.fusion-blog-layout-medium .fusion-post-slideshow{ width: 220px; }
.fusion-cp-blog-shortcode .fusion-post-medium{ border-bottom: 1px solid #a7a9ab; margin-bottom: 20px; font-size: 14px; line-height: 22px; }
.fusion-cp-blog-shortcode .fusion-post-medium:last-child{ border-bottom: none; }

.fusion-cp-blog-shortcode .favorite-tag{ display: inline-block; margin-bottom: 10px; }
.fusion-cp-blog-shortcode .fusion-flexslider .slides{ margin-bottom: 10px; }
.fusion-cp-blog-shortcode .fusion-flexslider .slides img{ min-height: 200px; }







/*
blog search
*/
.post-list-header {
	border-bottom: 1px solid #f4851f;
	margin: 10px 0 20px 0;
    padding-bottom: 10px;
}

.post-filter-wrapper { float: right; }

.post-filter-wrapper select {
    display: inline-block;
    vertical-align: top;
}

.post-filter-wrapper .searchform {
    display: inline-block;
}

.post-filter-wrapper select {
    background-color: #eeeeee;
    border-color: #dddddd;
    border-radius: 3px;
    color: #070e12;
    font: normal 14px/20px 'Open Sans';
    margin-right: 10px;
}

#wrapper .post-filter-wrapper .search-table .search-field input {
	border-color: #070e12;
	border-radius: 3px;
	margin-right:10px;
	padding:0 10px;
	width: 450px;
}

#wrapper .post-filter-wrapper .search-table .search-button input[type="submit"] {
	background-color: #f4851f;
	border-radius: 3px;
}

.post-wrapper a,
.post-wrapper a:hover { color: #070e12; }

.post-wrapper .post-image-wrapper {
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
    height: 184px;
    overflow: hidden;
    vertical-align: top;
    width: 100%;
}

.post-wrapper.post-featured .post-image-wrapper {
    display: inline-block;
    height: 330px;
	width: 330px;
}

.post-wrapper.post-featured .post-content-wrapper {
    border: 1px solid #a7a9ab;
    border-left: none;
    display: inline-block;
	height:330px;
    padding: 20px 40px;
    vertical-align: top;
    width: 340px;
}

.post-wrapper .post-content-wrapper p { margin-bottom: 10px; }
.post-wrapper .post-content-wrapper .view-count {
	display:block;
	font: bold 14px/20px 'Open Sans';
}

@media only screen and (max-width: 767px){
	.fusion-page-title-bar.fusion-page-title-bar-archive h2 {
		font-size: 16px;
		line-height:22px;
	}
	.post-wrapper {
		display: block;
		margin: 4% auto !important;
		max-width: 330px;
		vertical-align: top;
		width: 100%;
	}
	
	.post-wrapper.post-featured {
		display: block;
		margin: 0 auto;
		max-width: 330px;
	}
	
	.post-wrapper .post-image-wrapper {
		max-width: 330px;
		width: 100%;
	}
	
	.post-wrapper.post-featured .post-content-wrapper {
		border-left: 1px solid #a7a9ab;
		border-top: none;
		display:block;
		height:auto;
		max-width:330px;
		padding: 20px;
		width:100%;
	}
}




/*
Video
*/
.video-green .post-list-header{ border-radius: 10px; border: none; background: #9cbf43; padding: 10px; }
.video-green .title-heading-left{ color: #9cbf43; }
#wrapper .video-green .post-filter-wrapper .search-table .search-button input[type="submit"]{ background-color: #000; }

.video h4{ margin: 8px 0; }

.latest-fa h2{ color: #999999 !important; }
.fa-stuff h5{ margin: 0; }
.fa-stuff h4{ margin-bottom: 0; color: #9cbf43 !important; }

/* download popup */

.download-popup {
    position: fixed;
    width: 300px;
    height: 100px;
    top: 50%;
    left: 50%;
    background-color: #ffffff;
    z-index: 100;
    text-align: center;
    border: 1px solid #f58018;
    box-shadow: 0 0 36px rgba(0,0,0,0.5);
    line-height: 94px;
    margin-left: -150px;
    margin-top: -50px;
}

.layover .download-popup {
	line-height: 24px;
	margin-left: -200px;
    padding: 0px 20px;
    height: 160px;
    width: 400px;
}

.layover {
    background-color: rgba(0,0,0,0.5);
    position: fixed;
    top: 0;
    left: 0;
    z-index: 99;
}

/*
Newsletter
*/

.latest-newsletter { border: 1px solid #a7a9a8; }

.latest-newsletter .newsletter-image {
	display: inline-block; 
	text-align: center;
	vertical-align: top;
	width: 40%; 
}

.latest-newsletter .newsletter-image > a {
    width: 100%;
    height: 280px;
    display: inline-block;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.latest-newsletter .newsletter-stuff {
	display: inline-block;
	padding-left: 20px;
	width: 60%;
}

.newsletter-item .post-date,
.latest-newsletter .post-date {
    color: #a7a9ab;
    font-style: italic;
}

@media only screen and (max-width: 767px){
	.latest-newsletter .newsletter-image,
	.latest-newsletter .newsletter-stuff {
		display: block;
		padding-left: 0;
		width: 100%;
	}
}