/* Copyright (C) YOOtheme GmbH, http://www.gnu.org/licenses/gpl.html GNU/GPL */

/*
 * Responsive Style Sheet - Defines base styles for mobile devices
 */


/* Responsive Utility Classes
----------------------------------------------------------------------------------------------------*/

.hidden-desktop { display: none; }

/* Only Phones */
@media (max-width: 767px) {
	.hidden-desktop { display: block; }
	.hidden-phone { display: none; }
	.custom-logo, .custom-logo-en, .custom-logo-es {
		/*width: 560px;
		height: 100px;*/
		width: 250px;
		height: 60px;
		background: url(../../../../images/logo_responsive_full.png) 0% 100% no-repeat;
		background-size: contain;
	}
	#header{
		position: fixed;
		z-index: 900;
		background: #E9EAEA;
		background: -webkit-linear-gradient(top, #f6f6f6, #E9EAEA);
		background: -moz-linear-gradient(top, #f6f6f6, #E9EAEA);
		background: -o-linear-gradient(top, #f6f6f6, #E9EAEA);
		background: linear-gradient(to bottom, #f1f1f1, #ECEBEC);
		margin: 0;
		border-radius: 0;
		width: 100%;
	}

	#top-a, #main{margin-top: 75px;}

}

/* Only Tablets (Portrait) */
@media (min-width: 768px) and (max-width: 959px) {
	.hidden-desktop { display: block; }
	.hidden-tablet { display: none; }
}


/* Responsive Content
----------------------------------------------------------------------------------------------------*/

#header-responsive { display: none; }


/* Layout Breakpoints
----------------------------------------------------------------------------------------------------*/

/* All except large Screens */
@media (max-width: 1220px) {

	#banner { display: none; }

}

/* Only Phones and Tablets (Portrait) */
@media (max-width: 959px) {

	/* Layout */
	#maininner,
	#sidebar-a,
	#sidebar-b {
		width: 100%;
		left: auto;
		right: auto;
	}

}

/* Only Tablets (Portrait) and Phones (Landscape) */
@media (min-width: 480px) and (max-width: 959px) {

	/* Layout */
	.width16,
	.width20,
	.width25,
	.width40,
	.width60,
	.width75,
	.width80 { width: 50%; }

	.wk-slideshow .width20{width: 20%;}
	.wk-slideshow .width80{width: 80%;}	
	.wk-slideshow h1{font-size:20x !important; line-height:20px !important; margin-top:-6px !important;}
	.wk-slideshow h1 span.title{font-size: 40px !important; line-height: 40px !important;}
	.wk-slideshow .nav{display:none;}

	.width50 .width50 { width: 100%; }

	.sidebars-1 #sidebar-a .width100,
	.sidebars-1 #sidebar-b .width100 { width: 50%; }

	#sidebar-a .width100:nth-child(odd):last-child,
	#sidebar-b .width100:nth-child(odd):last-child,
	.width20:nth-child(odd):last-child { width: 100%; }

	.sidebars-2 #sidebar-a,
	.sidebars-2 #sidebar-b { width: 50%; }
	.sidebars-2.sidebar-b-left:not(.sidebar-a-left) #sidebar-a { float: right; } /* Keep Sidebar order */

	.grid-gutter > .grid-box:nth-child(n+3) > * { margin-top: 30px; }

	/* Tools */
	.width50 .align-left,
	.width50 .alignleft,
	.width50 .align-right,
	.width50 .alignright {
		margin: 0 auto 15px auto;
		float: none;
	}

}

/* Only Phones */
@media (max-width: 767px) {

	/* Layout */
	.width33,
	.width66 { width: 100% !important; }

	/* Header */
	#header-responsive { display: block; }

	#header-responsive .logo,
	#header-responsive .searchbox {
		display: inline-block;
		width: 45%;
		vertical-align: middle;
	}

	#header-responsive .logo { margin-right: 10%; }

	#header-responsive .searchbox {
		-moz-box-sizing: border-box;
		-webkit-box-sizing: border-box;
		box-sizing: border-box;
	}

	/* Menu */
	.menu-responsive {
		width: 100%;
		font-size: 14px;
	}


}

/* Only Phones (Landscape) */
@media (min-width: 480px) and (max-width: 767px) {
}

/* Only Phones (Portrait) */
@media (max-width: 479px) {

	.wk-slideshow{display:none;}

	/* Base */
	body { word-wrap: break-word; }

	/* Layout */
	.width16,
	.width20,
	.width25,
	.width40,
	.width50,
	.width60,
	.width75,
	.width80 { width: 100%; }

	.grid-gutter > .grid-box:nth-child(n+2) > * { margin-top: 30px; }

	/* Tools */
	.align-left,
	.alignleft,
	.align-right,
	.alignright {
		margin: 0 auto 15px auto;
		float: none;
	}

}


/* Fix Viewport for IE10 Snap Mode
----------------------------------------------------------------------------------------------------*/

@media (max-width: 400px) {
	@-ms-viewport{
		width: 320px;
	}
	.wk-slideshow .nav{display:none;}
	.wk-slideshow{display:none;}
}