/**
 * Media Queries CSS
******************************************/

/*****************************************
 * TABLE OF CONTENTS:
 * 
 * #00 - VIEWPORT FIX
 * #01 - LAYOUTS       (max-width: 1100px)
 *                     (max-width:  750px)
 *                     (max-width:  550px)
 * #02 - MENU          (max-width:  700px)
 * #03 - ENTRY         (max-width:  450px)
 * #04 - LOOP-NAV      (max-width:  700px)
 * #05 - COMMENTS      (max-width:  700px)
 * 
 *****************************************/

 /* Make Responsive */
#container{
	max-width: 100%;
	min-width: 100%;
}
 
/* === #00 - VIEWPORT FIX === 
 * Does the same thing as <meta name="viewport" content="width=device-width">
 * for Windows 8 "Snapped" views in IE10+
 * @link http://core.trac.wordpress.org/ticket/25888
 * @link http://blog.teamtreehouse.com/thinking-ahead-css-device-adaptation-with-viewport
 */
@-ms-viewport {
	width: device-width;
}
@viewport {
	width: device-width;
}


/* === #01 - LAYOUTS === */
@media screen and (min-width: 1420px){
	#menu-primary-items {
		display: none;
	}
}
@media screen and (max-width: 1420px){
	.vertical-menu{
		display: none;
	}
	#fa-slideshow-widget-2{
		float: none;
		margin: 0 auto;
	}
	#fa-slideshow-widget-2 .FA_slider{
		left: -2rem;
	}
}

/* = Force to 2 columns = */
@media screen and (max-width: 1100px){
	.plural.col-active #content .content-entry-wrap > .entry{
		width: 50%;
	}
	.widget-home .entry-wrap .wrap{
		height: 29rem;
	}
	#perfect-quotes-2 blockquote, #perfect-quotes-2 q {
		padding-left: 5rem;
	}
	.FA_slider .FA_navigation {
		display: none !important;
	}
	#fa-slideshow-widget-2 .FA_slider, #fa-slideshow-widget-2 .FA_slider .FA_featured_articles{
		width: 60rem !important;
	}
	.breadcrumb{
		font-size: 0.7em;
	}
	.wpcf-col {
		float: none;
		clear: both;
		width: 100%;
	}
	.wpcf-col1 {
		padding-right: 0;
	}
}
@media screen and (max-width: 950px){
	.singular .entry .entry-wrap > .wrap{
		padding: 40px;
		padding: 4rem;
	}
}
/* = Force to 1 columns = */
@media screen and (max-width: 750px){
	.plural.col-active #content .content-entry-wrap > .entry{
		width: 100%;
	}
	.widget-home{
		width: 100%;
	}
	.widget-home#tag_cloud-2 .entry-wrap{
		margin-bottom: 4rem;
	}
	.widget-home .entry-wrap .wrap {
		display: block;
		width: auto;
		height: auto;
		padding: 4rem !important;
	}
	.widget-home .entry-wrap .wrap ul.perfect-quotes, .widget-home .entry-wrap .wrap .tagcloud{
		display: block;
		vertical-align: auto;
	}
	div.wpcf7{
		font-size: 0.8em;
		padding: 2rem 3rem !important;
	}
	.wpcf7-form-control.wpcf7-captchar {
		width: 50%;
	}
}
/* Padding + Margin */
@media screen and (max-width: 550px){
	#site-title{
		padding: 30px 20px 20px;
		padding: 3rem 2rem 2rem;
	}
	#site-description{
		padding: 5px 20px;
		padding: 0.5rem 2rem;
	}
	#main{
		padding: 20px 0 20px 20px;
		padding: 2rem 0 2rem 2rem;
	}
	.loop-meta,
	.widget-home .entry-wrap{
		margin: 0 20px 20px 0;
		margin: 0 2rem 2rem 0;
	}
	.content-entry-wrap,
	#fa-slideshow-widget-2 .FA_slider{
		padding-right: 20px !important;
		padding-right: 2rem !important;
	}
	.plural.col-active .content-entry-wrap > .entry{
		margin-bottom: 20px;
		margin-bottom: 2rem;
		padding: 0 20px 20px 0;
		padding: 0 2rem 2rem 0;
	}
	.loop-pagination .page-numbers{
		padding: 5px 10px;
		padding: 0.5rem 1rem;
	}
	.entry .entry-wrap > .wrap,
	.singular .entry .entry-wrap > .wrap{
		padding: 20px;
		padding: 2rem;
	}
	.singular .entry-title{
		margin-bottom: 20px;
		margin-bottom: 2rem;
	}
	.more-link{
		margin-left: -32px;
	}
	.loop-nav{
		margin: 20px auto;
		margin: 2rem auto;
	}
	/* Comments */
	#comments-template{
		padding-bottom: 20px;
		padding-bottom: 2rem;
		margin-bottom: 20px;
		margin-bottom: 2rem;
	}
	
	.breadcrumb{
		padding: 20px 20px 0;
		padding: 2rem 2rem 0;
	}
	
	/* Grid Accordion */
	.accordionGen
	{
		padding-bottom: 45px;
	}
	.accordion{
		width: 100%;
		margin-bottom: 0;
	}
	.accordion li{
		position: relative;
		width: 100%;
		line-height: 0;
		margin-bottom: 5px;
	}
	.accordion a{
		width: 100%;
	}
	.accordion img{
		width: 100%;
	}
	.accordion .caption
	{
		width: 100%;
		bottom: 0;
		background-color: #000;
		opacity: 0.7;
	}
	.accordion .caption p.desc
	{
		display: none;
	}
}


/* === #02 - MENU ===  */
@media screen and (max-width: 800px){

	/* Menu Primary 1st Level */
	#menu-primary li a{
		background: #2D2720;
		background: rgba(0, 0, 0, 0.3);
	}
	/* Fix */
	.menu-dropdown .sub-menu li:hover > .sub-menu,
	.menu-dropdown .sub-menu li.focus > .sub-menu{
		top: 0;
		margin-left: 0;
	}
	.menu-dropdown .sub-menu{
		box-shadow: none;
	}

	/* === Menu Toggle: no-js === */
	#menu-primary .menu-toggle a{
		color: #fff;
		font-family: 'Open Sans','Trebuchet MS', sans-serif;
	}
	#menu-primary:target .menu-toggle{
		border-bottom: 1px solid #444;
		border-bottom-color: rgba(0,0,0,0.1);
	}
	#menu-primary:target .menu-items{
		display: block;
	}
	#menu-primary:target .menu-toggle-open{
		display: none;
	}
	#menu-primary:target .menu-toggle-close{
		display: inline;
	}
	
	/* css/base/menus-media-queries.min.css */
	.menu-toggle{font-weight:700;line-height:1.8em;padding:.9rem;width:100%;height:47px;height:4.7rem}.menu-toggle .screen-reader-text{position:inherit;left:auto;top:auto}.menu-toggle a:focus,.menu-toggle a:hover{opacity:.8}.menu-toggle a:before{content:"\f203";font-family:dashicons;font-weight:400;font-size:20px;font-size:2rem;vertical-align:top;margin-right:5px;-webkit-font-smoothing:antialiased}.menu-toggle a.menu-toggle-close:before,.menu-toggle-active .menu-toggle a:before{content:"\f158"}.mobile-menu-active .menu-dropdown li:hover>.sub-menu{left:auto}.menu-toggle{display:block}#menu-primary .menu-items,.menu-toggle .menu-toggle-close{display:none}.menu-toggle-active.menu-container{border-bottom:0}.menu-toggle-active .menu-items{display:block}.menu-toggle-active .menu-toggle{border-bottom:1px solid #ccc}.menu-toggle-active>.wrap{display:block}.menu-dropdown:after{content:".";display:block;height:0;clear:both;visibility:hidden}.menu-dropdown>.wrap{display:block;margin-right:0;width:100%}.menu-dropdown ul li.menu-item-has-children>a:before,.menu-dropdown ul li.menu-item-open-children>a:before{content:"";position:inherit;right:auto}.menu-dropdown li{display:block;width:100%}.menu-dropdown .sub-menu{width:100%;border:none}.menu-dropdown .sub-menu li a,.menu-dropdown li a{width:100%;border:none;border-bottom:1px solid #ccc;background:#eee}.menu-dropdown .sub-menu li a{background:0 0}.menu-dropdown .sub-menu,.menu-dropdown .sub-menu li.focus>.sub-menu,.menu-dropdown .sub-menu li:focus>.sub-menu,.menu-dropdown .sub-menu li:hover>.sub-menu,.menu-dropdown li.focus>.sub-menu,.menu-dropdown li:focus>.sub-menu,.menu-dropdown li:hover>.sub-menu{opacity:1;left:auto;top:auto;position:inherit}/*.menu-dropdown .sub-menu li a:before,.menu-dropdown .sub-menu li.menu-item-has-children>a:before,.menu-dropdown .sub-menu li.menu-item-open-children>a:before{content:"\f460 ";font-family:dashicons;vertical-align:top;padding:0;margin-right:.5rem;float:none;position:inherit;right:auto;-webkit-font-smoothing:antialiased}.menu-dropdown .sub-menu .sub-menu li a:before{content:"\f460 \f460 ";font-family:dashicons;vertical-align:top;padding:0;margin-right:.5rem;float:none;-webkit-font-smoothing:antialiased}.menu-dropdown .sub-menu .sub-menu .sub-menu li a:before{content:"\f460 \f460 \f460 "}.menu-dropdown .sub-menu .sub-menu .sub-menu .sub-menu li a:before{content:"\f460 \f460 \f460 \f460 "}.menu-dropdown .sub-menu .sub-menu .sub-menu .sub-menu .sub-menu li a:before{content:"\f460 \f460 \f460 \f460 \f460 "}.menu-dropdown .sub-menu .sub-menu .sub-menu .sub-menu .sub-menu .sub-menu li a:before{content:"\f460 \f460 \f460 \f460 \f460 \f460 "}.menu-dropdown .sub-menu .sub-menu .sub-menu .sub-menu .sub-menu .sub-menu .sub-menu li a:before{content:"\f460 \f460 \f460 \f460 \f460 \f460 \f460 "}.menu-dropdown .sub-menu .sub-menu .sub-menu .sub-menu .sub-menu .sub-menu .sub-menu .sub-menu li a:before{content:"\f460 \f460 \f460 \f460 \f460 \f460 \f460 \f460 "}.menu-dropdown .sub-menu .sub-menu .sub-menu .sub-menu .sub-menu .sub-menu .sub-menu .sub-menu .sub-menu li a:before{content:"\f460 \f460 \f460 \f460 \f460 \f460 \f460 \f460 \f460 "}.menu-dropdown .sub-menu .sub-menu .sub-menu .sub-menu .sub-menu .sub-menu .sub-menu .sub-menu .sub-menu .sub-menu li a:before{content:"\f460 \f460 \f460 \f460 \f460 \f460 \f460 \f460 \f460 \f460 "}*/

	.menu-toggle-active .menu-toggle{
		border-bottom-color: rgba(0,0,0,0.1);
	}
	.menu-dropdown li a,
	.menu-dropdown .sub-menu,
	.menu-dropdown .sub-menu li a{
		border-bottom-color: rgba(0,0,0,0.1);
	}
	.menu-dropdown .sub-menu li a{
		background:#fffae1 !important;
		padding: 1.2rem 1.2rem 1.2rem 3.5rem !important;
	}

	#menu-primary li a:hover,
	#menu-primary li a:focus{
		background: #E67E22 !important;
		color: #fff !important;
	}
	
	#menu-primary .mlp_language_box li,
	#menu-primary .mlp_language_box li a{
		width: auto;
	}
	
	#menu-footer .menu-container li a {
		margin-bottom: 1rem;
	}
}

/* === #02bis - FA_SLIDER ===  */
@media screen and (max-width: 700px){	
	/* Slideshow fits to screen */
	#fa-slideshow-widget-2 .FA_slider{
		width: 100% !important;
		height: auto !important;
		padding-right: 4rem;
		left: auto;
	}
	#fa-slideshow-widget-2 .FA_slider .FA_featured_articles,
	.FA_featured_articles .FA_article,
	.FA_featured_articles .FA_article .FA_wrap,
	.FA_overall_container_title_nav .FA_featured_articles .FA_article .FA_caption {
		position: static !important;
		width: 100% !important;
		height: auto !important;
		max-height: 443px;
	}
	.FA_featured_articles .FA_article,
	.FA_overall_container_title_nav .FA_featured_articles .FA_article .FA_caption {
	}
	.FA_overall_container_title_nav .FA_featured_articles .FA_article .image_container,
	.FA_overall_container_title_nav .FA_featured_articles .FA_article .image_container img{
		float: none !important;
		max-width: 100% !important;
	}

}


/* === #03 - ENTRY === */
@media screen and (max-width: 450px) {
	.singular .entry-byline .entry-author{
		display: block;
	}
	.singular .entry-content .alignleft,
	.singular .entry-content .alignright{
		max-width: 50%;
	}
}


/* === #04 - LOOP-NAV === */
@media screen and (max-width: 700px) {
	.loop-nav .prev{
		width: 100%;
	}
	.loop-nav .next{
		width: 100%;
		padding-right: 0;
		padding-left: 30px;
		padding-left: 3rem;
		text-align: left;
	}
	.loop-nav .next a:after{
		right: auto;
		left: 0;
	}
}


/* === #05 - COMMENTS === */
@media screen and (max-width: 700px) {
	#respond .comment-form-author,
	#respond .comment-form-email,
	#respond .comment-form-url{
		width: 100%;
		margin-right: 0;
		float: none;
	}
	#respond #submit{
		float: none;
	}
}


@media screen and (max-width: 800px) {
}

/* === #06 - QUOTES === */
@media screen and (max-width: 1000px) {
	.page-template-template-quotes .wrap-perfect-quotes > div, .page-template-template-quotes .wrap-perfect-quotes > .entry-perfect-quote-col1 {
		border-right: none;
		margin-bottom: 30px;
		margin-bottom: 3rem;
		padding: 0 0 30px;
		padding: 0 0 3rem;
		border-bottom: 1px dashed #c9c9c7;
		width: 100%;
		float: none;
		clear: both;
	}
	.page-template-template-quotes hr.separator {
		display: none;
	}
	.page-template-template-quotes .wrap-perfect-quotes blockquote {
		padding-left: 20px;
		padding-left: 2rem;
	}
	.page-template-template-quotes .wrap-perfect-quotes blockquote:before, q:before {
		font-size: 1em;
	}
}