/*
Theme Name: ByP
Theme URI: http://www.reformabranding.com
Author: the Reforma Branding team
Author URI: http://www.reformabranding.com/
Description: ByP Theme
Version: 1.2
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: black, green, white, light, dark, two-columns, three-columns, left-sidebar, right-sidebar, fixed-layout, responsive-layout, custom-background, custom-header, custom-menu, editor-style, featured-images, flexible-header, full-width-template, microformats, post-formats, rtl-language-support, sticky-post, theme-options, translation-ready, accessibility-ready
Text Domain: byp

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.
*/

/*******************************************************fonts******************************************************/
@font-face
{
	font-family: 'gothamhtf-bold';
	src: url('fonts/gothamhtf-bold.eot?#iefix') format('embedded-opentype'),
	     url('fonts/gothamhtf-bold.otf')  format('opentype'),
		url('fonts/gothamhtf-bold.woff') format('woff'),
		url('fonts/gothamhtf-bold.ttf')  format('truetype'),
		url('fonts/gothamhtf-bold.svg#gothamhtf-bold') format('svg');
	font-weight: normal;
	font-style: normal;
}

@font-face
{
	font-family: 'myriadpro-regular';
	src: url('fonts/myriadpro-regular.eot?#iefix') format('embedded-opentype'),
	     url('fonts/myriadpro-regular.otf')  format('opentype'),
		url('fonts/myriadpro-regular.woff') format('woff'),
		url('fonts/myriadpro-regular.ttf')  format('truetype'),
		url('fonts/myriadpro-regular.svg#myriadpro-regular') format('svg');
	font-weight: normal;
	font-style: normal;
}

@font-face
{
	font-family: 'gotham-bold';
	src: url('fonts/gotham-bold.eot?#iefix') format('embedded-opentype'),
	     url('fonts/gotham-bold.woff') format('woff'),
		url('fonts/gotham-bold.ttf')  format('truetype'),
		url('fonts/gotham-bold.svg#gotham-bold') format('svg');
	font-weight: normal;
	font-style: normal;
}

@font-face
{
	font-family: 'gotham-book';
	src: url('fonts/gotham-book.eot?#iefix') format('embedded-opentype'),
	     url('fonts/gotham-book.woff') format('woff'),
		url('fonts/gotham-book.ttf')  format('truetype'),
		url('fonts/gotham-book.svg#gotham-book') format('svg');
	font-weight: normal;
	font-style: normal;
}
/******************************************************************************************************************/

/*******************************************************general****************************************************/
*
{
	margin: 0;
	padding: 0;
	border: 0;
}

html, body
{
	height: 100%;
}

#main
{
	width: 100%;
	min-height: 100%;
}

section
{
	position: absolute;
	top: 80px;
	bottom: 0;
	left: 0;
	width: 100%;
	z-index: 1;
}

.active
{
	display: block;
}

.inactive
{
	display: none;
}

.right_animation_hidden, .right_animation_visible, .left_animation_hidden, .left_animation_visible
{
	-webkit-animation-timing-function: ease-out;
	-webkit-animation-duration: 350ms;
	-moz-animation-timing-function: ease-out;
	-moz-animation-duration: 350ms;
	animation-timing-function: ease-out;
	animation-duration: 350ms;
}

.right_animation_hidden
{
	-webkit-transform: translate3d(0,0,0);
	-webkit-animation-name: right_animation_hidden;
	-moz-transform: translateX(0);
	-moz-animation-name: right_animation_hidden;
	transform: translateX(0);
	animation-name: right_animation_hidden;
}

.right_animation_visible
{
	-webkit-transform: translate3d(100%,0,0);
	-webkit-animation-name: right_animation_visible;
	-moz-transform: translateX(100%);
	-moz-animation-name: right_animation_visible;
	transform: translateX(100%);
	animation-name: right_animation_visible;
}

.left_animation_hidden
{
	-webkit-transform: translate3d(0,0,0);
	-webkit-animation-name: left_animation_hidden;
	-moz-transform: translateX(0);
	-moz-animation-name: left_animation_hidden;
	transform: translateX(0);
	animation-name: left_animation_hidden;
}

.left_animation_visible
{
	-webkit-transform: translate3d(-100%,0,0);
	-webkit-animation-name: left_animation_visible;
	-moz-transform: translateX(-100%);
	-moz-animation-name: left_animation_visible;
	transform: translateX(-100%);
	animation-name: left_animation_visible;
}

@-webkit-keyframes right_animation_hidden
{
	from { -webkit-transform: translate3d(0,0,0); }
     to { -webkit-transform: translate3d(-100%,0,0); }
}

@-moz-keyframes right_animation_hidden
{
	from { -moz-transform: translateX(0); }
     to { -moz-transform: translateX(-100%); }
}

@keyframes right_animation_hidden
{
	from { transform: translateX(0); }
     to { transform: translateX(-100%); }
}

@-webkit-keyframes right_animation_visible
{
	from { -webkit-transform: translate3d(100%,0,0); }
	to { -webkit-transform: translate3d(0,0,0); }
}

@-moz-keyframes right_animation_visible
{
	from { -moz-transform: translateX(100%); }
	to { -moz-transform: translateX(0); }
}

@keyframes right_animation_visible
{
	from { transform: translateX(100%); }
	to { transform: translateX(0); }
}

@-webkit-keyframes left_animation_hidden
{
	from { -webkit-transform: translate3d(0,0,0); }
     to { -webkit-transform: translate3d(100%,0,0); }
}

@-moz-keyframes left_animation_hidden
{
	from { -moz-transform: translateX(0); }
     to { -moz-transform: translateX(100%); }
}

@keyframes left_animation_hidden
{
	from { transform: translateX(0); }
     to { transform: translateX(100%); }
}

@-webkit-keyframes left_animation_visible
{
	from { -webkit-transform: translate3d(-100%,0,0); }
     to { -webkit-transform: translate3d(0,0,0); }
}

@-moz-keyframes left_animation_visible
{
	from { -moz-transform: translateX(-100%); }
     to { -moz-transform: translateX(0); }
}

@keyframes left_animation_visible
{
	from { transform: translateX(-100%); }
     to { transform: translateX(0); }
}

.prev_big, .next_big
{
	width: 44px;
	height: 75px;
	position: absolute;
	top: 50%;
	margin-top: -37px;
	cursor: pointer;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
}

.prev_small, .next_small
{
	width: 30px;
	height: 51px;
	position: absolute;
	top: 82%;
	margin-top: -25px;
	cursor: pointer;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
}

.prev_small
{
	background-image: url('images/prev.png');
	left: 3%;
}

.next_small
{
	background-image: url('images/next.png');
	right: 3%;
}

.prev_big
{
	background-image: url('images/prev.png');
	left: 5%;
}

.next_big
{
	background-image: url('images/next.png');
	right: 5%;
}

.td_left
{
	padding: 0 3% 0 12%;
}

.td_right
{
	padding: 0 12% 0 3%;
}

.td_lonely
{
	padding: 0 35% 0 35%;
}

article
{
	width: 100%;
	height: 100%;
	position: relative;
	background-repeat: no-repeat;
	background-position: top center;
	background-size: cover;
}
/******************************************************************************************************************/

/*******************************************************header*****************************************************/
header
{
	width: 100%;
	height: 80px;
	position: relative;
	z-index: 2;
}

header nav, header nav ul
{
	width: 100%;
	height: 100%;
}

header nav ul
{
	text-align: justify;
	background-color: #3C4FA1;
}

header nav ul:after
{
	content: '';
	display: inline-block;
	width: 100%;
}

header nav ul li
{
	display: inline-block;
	width: 120px;
	text-align: center;
	position: relative;
	height: 100%;
}

header nav ul li a
{
	display: block;
	width: 100%;
	height: 100%;
	font-family: myriadpro-regular;
	font-size: 11pt;
	letter-spacing: 1px;
	font-weight: normal;
	color: #FFFFFF;
	text-transform: uppercase;
	text-decoration: none;
	line-height: 80px;
}

header nav ul li a:hover
{
	text-decoration: underline;
}

header nav ul li:hover ul
{
	height: auto;
}

#mobile_logo
{
	width: 74px;
	height: 60px;
	background-image: url('images/logo.png');
	background-repeat: no-repeat;
	background-position: center center;
	background-size: 74px auto;
	margin: 0 auto;
	display: none;
}

#mobile_logo a
{
	display: block;
	width: 100%;
	height: 100%;
}

#menu_icon
{
	width: 60px;
	height: 60px;
	position: absolute;
	top: 0;
	left: 0;
	background-image: url('images/menu_icon.png');
	background-repeat: no-repeat;
	background-position: center center;
	background-size: 19px auto;
	cursor: pointer;
	display: none;
}

.logo
{
	width: 180px;
	height: 111px;
	vertical-align: top;
	background-image: url('images/logo.png');
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
}

.facebook
{
	background-image: url('images/facebook.png');
	background-repeat: no-repeat;
	background-position: center center;
}

header nav ul li ul
{
	position: absolute;
	top: 100%;
	left: 0;
	width: 100%;
	height: 0px;
	overflow: hidden;
}

header nav ul li ul:after
{
	display: block;
	vertical-align: top;
	height: 0;
}

header nav ul li ul li a
{
	line-height: normal;
	text-transform: none;
	font-size: 10pt;
	padding: 5px 0;
}
/******************************************************************************************************************/

/****************************************************slide inicio**************************************************/
#slide
{
	width: 100%;
	height: 100%;
	position: relative;
	overflow: hidden;
	background-color: #3C4FA1;
}

#slide li
{
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	background-repeat: no-repeat;
	background-position: top center;
	background-size: auto 100%;
}
/******************************************************************************************************************/

/*****************************************************quienes somos************************************************/
#post-21 ul
{
	width: 100%;
	height: 100%;
	position: relative;
	overflow: hidden;
}

#post-21 ul li
{
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	background-repeat: no-repeat;
	background-position: top center;
	background-size: cover;
}

#post-21 ul li h1
{
	font-family: gotham-bold;
	font-size: 15pt;
	font-weight: normal;
	color: #FFFFFF;
	text-transform: uppercase;
	margin-top: 7%;
}

#post-21 ul li table
{
	margin-top: 3%;
}

#post-21 ul li table tr td
{
	font-family: gotham-book;
	font-size: 12pt;
	font-weight: normal;
	color: #FFFFFF;
	vertical-align: top;
	width: 50%;
}

#post-21 ul li table tr td p
{
	margin-top: 20px;
}

.subpage_thumbnail
{
	display: none;
	width: 100%;
}

.subpage_thumbnail img
{
	width: 100%;
	display: block;
}
/******************************************************************************************************************/

/***************************************************productos menu*************************************************/
#post-35 ul
{
	width: 100%;
	height: 100%;
}

#post-35 ul li
{
	display: inline-block;
	background-repeat: no-repeat;
	background-position: center center;
	box-sizing: border-box;
	background-color: #D5D4D0;
}

#post-35 ul li a
{
	text-decoration: none;
}

.product_menu
{
	width: 50%;
	border-right: 1px solid #FFFFFF;
}

.product_menu_lonely
{
	width: 100%;
	border-top: 1px solid #FFFFFF;
}

.products_menu_modal
{
	width: 100%;
	height: 100%;
	text-align: center;
	font-family: gotham-bold;
	font-size: 20pt;
	font-weight: normal;
	color: #FFFFFF;
	text-transform: uppercase;
	opacity: 0;
	-webkit-transition: opacity 0.3s ease-in-out;
	-moz-transition: opacity 0.3s ease-in-out;
	-ms-transition: opacity 0.3s ease-in-out;
	-o-transition: opacity 0.3s ease-in-out;
	transition: opacity 0.3s ease-in-out;
}

.product_menu .products_menu_modal
{
	background: rgba(60,79,161,0.55);
}

.product_menu_lonely .products_menu_modal
{
	background: rgba(215,166,46,0.55);
}

.products_menu_modal:before
{
	content: '';
	display: inline-block;
	vertical-align: middle;
	height: 100%;
}

#post-35 ul li:hover .products_menu_modal
{
	opacity: 1;
}
/******************************************************************************************************************/

/******************************************************productos***************************************************/
.category
{
	position: relative;
	width: 100%;
	height: 100%;
	overflow: hidden;
}

.category li
{
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	background-repeat: no-repeat;
	background-position: top center;
	background-size: cover;
	background-color: #D5D4D0;
	font-size: 0;
}

.category li article
{
	width: 50%;
	height: 100%;
	display: inline-block;
	vertical-align: top;
}

.category .info
{
	font-size: 0;
}

.category .info:before
{
	content: '';
	display: inline-block;
	vertical-align: middle;
	height: 100%;
}

.cat_info_container
{
	display: inline-block;
	vertical-align: middle;
	width: 100%;
	box-sizing: border-box;
	padding: 3% 10%;
}

.cat_info_container h1
{
	font-family: gotham-bold;
	font-size: 25pt;
	font-weight: normal;
	color: #FFFFFF;
	text-transform: uppercase;
	
}
.cat_info_container p
{
	font-family: gotham-book;
	font-size: 14pt;
	font-weight: normal;
	color: #FFFFFF;
	margin-top: 40px;
}

#cat-2 .cat_info_container
{
	background: rgba(215,166,46,0.72);
}

#cat-3 .cat_info_container, #cat-4 .cat_info_container
{
	background: rgba(60,79,161,0.83);
}

.product_lonely article
{
	width: 100%!important;
}

.product_lonely .product_thumbnail
{
	background-size: cover;
}

.product_thumbnail
{
	width: 100%;
	height: 70%;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: auto 90%;
}

.product_info
{
	width: 100%;
	height: 30%;
	text-align: center;
	box-sizing: border-box;
	border-right: 1px solid #FFFFFF;
	padding: 3% 10%;
}

.product_info h2
{
	font-family: gotham-bold;
	font-size: 14pt;
	font-weight: normal;
	color: #FFFFFF;
	text-transform: uppercase;
	margin-bottom: 10px;
}

.product_info p
{
	font-family: gotham-book;
	font-size: 11pt;
	font-weight: normal;
	color: #FFFFFF;
}

#cat-2 .odd .product_info, #cat-3 .pair .product_info, #cat-4 .pair .product_info
{
	background-color: #D7A62E;
}

#cat-2 .pair .product_info, #cat-3 .odd .product_info, #cat-4 .odd .product_info
{
	background-color: #3C4FA1;
}
/******************************************************************************************************************/

/******************************************************recetas*****************************************************/
#recetario_logo
{
	position: fixed;
	width: 90px;
	height: 55px;
	top: 10%;
	left: 50%;
	margin-left: -45px;
	background-image: url('images/logo.png');
	background-repeat: no-repeat;
	background-position: center center;
	background-size: 90px auto;
	z-index: 2;
}

#recetario_logo a
{
	display: block;
	width: 100%;
	height: 100%;
}

.recipe_thumbnail
{
	position: relative;
}

.recipe_thumbnail img
{
	width: 100%;
	display: block;
}

.recipe_title
{
	position: absolute;
	width: 100%;
	padding: 80px 50px;
	box-sizing: border-box;
	top: 25%;
	left: 0;
	font-family: GothamHTF-Bold;
	font-size: 30pt;
	font-weight: normal;
	color: #FFFFFF;
}

.recipe_content
{
	padding: 100px 50px;
	box-sizing: border-box;
}

.recipe_content table tr td
{
	width: 50%;
	vertical-align: top;
}

.recipe_content table tr td h2
{
	font-family: gotham-bold;
	font-size: 28pt;
	font-weight: normal;
	color: #FFFFFF;
	margin-bottom: 30px;
}

.recipe_content table tr td p
{
	font-family: Gotham-book;
	font-size: 18pt;
	font-weight: normal;
	color: #FFFFFF;
	text-align: justify;
	letter-spacing: 2px;
}

#post-160 .pair .recipe_title
{
	background: rgba(215,166,46,0.81);
}

#post-160 .odd .recipe_title
{
	background: rgba(60,79,161,0.78);
}

#post-160 .pair .recipe_content
{
	background-color: #3C4FA1;
}

#post-160 .odd .recipe_content
{
	background-color: #D7A62E;
}
/******************************************************************************************************************/

/*****************************************************contacto*****************************************************/
#post-39
{
	text-align: right;
}

#post-39:before
{
	content: '';
	display: inline-block;
	vertical-align: middle;
	height: 100%;
}

#post-39 form
{
	display: inline-block;
	vertical-align: middle;
	background: rgba(215,166,46,0.78);
	padding: 20px;
	margin-right: 10%;
	text-align: left;
	font-family: gotham-bold;
	font-size: 12pt;
	font-weight: normal;
	color: #FFFFFF;
}

#post-39 table
{
	width: 350px;
}

#post-39 table tr th
{
	text-transform: uppercase;
	text-align: center;
	font-weight: normal;
	font-size: 13pt;
}

#post-39 table tr td
{
	padding: 5px 0;
}

#post-39 table tr td input[type="text"], #post-39 table tr td textarea
{
	width: 100%;
}

#post-39 table tr td textarea
{
	height: 100px;
}

#post-39 table tr td input[type="submit"]
{
	font-family: gotham-bold;
	font-size: 11pt;
	font-weight: normal;
	color: #FFFFFF;
	text-transform: uppercase;
	background-color: #3C4FA1;
	padding: 2px 5px;
	border-radius: 3px;
}

#post-39 p
{
	font-family: gothamhtf-bold;
	font-weight: normal;
	font-size: 11pt;
	color: #FFFFFF;
	position: absolute;
	left: 0;
	bottom: 5%;
	text-align: left;
	background: rgba(215,166,46,0.78);
	padding: 20px;
}

#contact_alert
{
	text-align: center;
}
/******************************************************************************************************************/

/********************************************************footer****************************************************/
footer
{
	width: 100%;
	height: 60px;
	margin-top: -60px;
	font-size: 0;
	display: none;
}

#mobile_facebook
{
	display: inline-block;
	vertical-align: middle;
	width: 60px;
	height: 60px;
	background-image: url('images/facebook_mobile.png');
	background-repeat: no-repeat;
	background-position: center center;
	background-size: 20px auto;
}

#mobile_facebook a
{
	display: block;
	width: 100%;
	height: 100%;
}

footer p
{
	font-family: GothamHTF-Bold;
	font-size: 6pt;
	font-weight: normal;
	color: #3C4FA1;
	display: inline-block;
	vertical-align: middle;
}
/******************************************************************************************************************/

/******************************************************responsive**************************************************/
@media screen and (max-width: 925px)
{
	header nav ul li
	{
		width: 90px;
	}
	
	header nav ul li a
	{
		font-size: 8pt;
	}
	
	.recipe_title
	{
		padding: 40px 20px;
		font-size: 20pt;
	}
	
	.recipe_content table tr td h2
	{
		font-size: 15pt;
		margin-bottom: 15px;
	}
	
	.recipe_content
	{
		padding: 50px 20px;
	}
	
	.recipe_content table tr td p
	{
		font-size: 12pt;
	}
}

@media screen and (max-width: 745px)
{
	header
	{
		position: fixed;
		top: 0;
		left: 0;
		height: 60px;
		border-bottom: 1px solid #3C4FA1;
		background-color: #FFFFFF;
	}
	header nav
	{
		position: fixed;
		width: 100%;
		height: 100%;
		top: 0;
		background: rgba(60,79,161,0.73);
		text-align: center;
		right: 100%;
		-webkit-transition: right 0.3s ease-in-out;
		-moz-transition: right 0.3s ease-in-out;
		-ms-transition: right 0.3s ease-in-out;
		-o-transition: right 0.3s ease-in-out;
		transition: right 0.3s ease-in-out;
	}
	
	header nav:before
	{
		content: '';
		display: inline-block;
		vertical-align: middle;
		height: 100%;
	}
	
	#menu-item-49, .logo, .facebook, #menu-item-51 ul, #post-39 p
	{
		display: none;
	}
	
	header nav ul
	{
		background: transparent;
		width: 50%;
		height: auto;
		display: inline-block;
		vertical-align: middle;
	}
	
	header nav ul li
	{
		display: block;
		width: auto;
		height: auto;
		padding: 0;
		border-bottom: 1px solid #FFFFFF;
		padding: 5px 0;
	}
	
	header nav ul li a
	{
		line-height: normal;
		font-size: 10pt;
	}
	
	#mobile_logo, #menu_icon, footer, .subpage_thumbnail
	{
		display: block;
	}
	
	section
	{
		position: static;
		top: auto;
		left: auto;
		width: 100%;
		box-sizing: border-box;
		padding: 85px 0 60px 0;
	}
	
	#slide
	{
		height: 200px;
	}
	
	#slide .inactive
	{
		display: none!important;
	}
	
	article, #post-21 ul, #post-21 ul li, #post-35 ul, #post-35 ul li
	{
		position: static;
		height: auto;
		overflow: visible;
	}
	
	#post-21 ul li
	{
		background-image: none!important;
		background-color: #D7A62E;
	}
	
	.inactive
	{
		display: block;
	}
	
	.prev_big, .next_big, .prev_small, .next_small
	{
		display: none!important;
	}
	
	#post-21 ul li h1
	{
		font-size: 10pt;
		text-align: center;
	}
	
	#post-21 ul li table tr td
	{
		display: block;
		width: 100%;
		font-size: 8pt;
		padding: 10px;
		box-sizing: border-box;
	}
	
	#post-35 ul li
	{
		display: block;
		width: 100%;
		height: 150px!important;
		background-size: auto 50%;
	}
	
	.products_menu_modal
	{
		opacity: 1;
		font-size: 10pt;
	}
	
	.product_menu_lonely
	{
		border: 0;
	}
	
	#post-39 table
	{
		width: 100%;
	}
	
	#post-39 table tr th
	{
		font-size: 10pt;
	}
	
	#post-39 form
	{
		font-size: 8pt;
		display: block;
		width: 80%;
		margin: 0 auto;
		box-sizing: border-box;
	}
	
	#post-39
	{
		padding: 20px 0;
	}
	
	#post-39:before
	{
		height: 0;
	}
	
	.category
	{
		height: auto;
		overflow: visible;
	}
	
	.category li
	{
		position: static;
		height: auto;
	}
	
	.category li article
	{
		width: 100%;
		border: 0;
	}
	
	.category .info
	{
		height: 250px;
	}
	
	.cat_info_container
	{
		padding: 10px 5px;
	}
	
	.cat_info_container h1
	{
		font-size: 10pt;
		text-align: center;
	}
	
	.cat_info_container p
	{
		font-size: 6pt;
		margin-top: 5px;
		text-align: justify;
	}
	
	.product_thumbnail
	{
		height: 200px;
	}
	
	.product_info
	{
		background-color: transparent!important;
	}
	
	.product_info h2
	{
		font-size: 10pt;
	}
	
	.product_info p
	{
		font-size: 8pt;
	}
	
	#cat-2 .pair, #cat-2 .odd, #cat-4 .pair, #cat-4 .odd
	{
		background-color: #3C4FA1;
	}
	
	#cat-4 .cat_info_container
	{
		background: rgba(215,166,46,0.72);
	}
	
	#cat-3 .pair, #cat-3 .odd
	{
		background-color: #D7A62E;
	}
	
	#recetario_logo
	{
		width: 45px;
		height: 28px;
		top: 2%;
		margin-left: -23px;
		background-size: 45px auto;
	}
	
	.recipe_title
	{
		padding: 20px 10px;
		font-size: 12pt;
	}
	
	.recipe_content table tr td h2
	{
		font-size: 10pt;
		margin-bottom: 10px;
	}
	
	.recipe_content
	{
		padding: 30px 10px;
	}
	
	.recipe_content table tr td p
	{
		font-size: 6pt;
		letter-spacing: normal;
	}
}
/******************************************************************************************************************/