/* fonts generated */
@import url('font-faces.css');

@import url('normalize.css');
@import url('controles/header.css');
@import url('controles/footer-20200617.css');

html, body {
    height: 100%;
    font-size: 16px;
}

body {
  width: 100%;
	background: url("../assets/bg-fondo.jpg") repeat scroll 50% 0px #FFF;
  overflow-x: hidden;
}

p {
  font: 400 1.0625em/140% 'Ubuntu',  Arial, Helvetica, sans-serif;
  color: #505c6b;
  text-align: left;
  margin: 1em 0;

}

.button {
    text-decoration: none;
    cursor: pointer;
    -moz-user-select: none;
    padding: 0px 0.25em;
    border: 0px none;
}
/*.csstransitions.csstransforms*/ .button {
    transition: transform 0.3s ease-in 0s;
}
/*.csstransitions.csstransforms*/ .button:hover, /*.csstransitions.csstransforms*/ .button:focus {
    transition-duration: 0.2s;
    transition-timing-function: ease-out;
    transform: scale(0.95);
}


/* common */
header {
    position: fixed;
    top: -5px;
    width: 100%;
	min-height: 46px;
	background-color: #a71117;
	border-bottom: 3px solid rgba(255, 255, 255, 0.75);
	-webkit-box-shadow: 0px 1px 5px 0px rgba(0, 0, 0, 0.5);
	-moz-box-shadow:    0px 1px 5px 0px rgba(0, 0, 0, 0.5);
	box-shadow:         0px 1px 5px 0px rgba(0, 0, 0, 0.5);
	z-index: 100;
}

#main-content {
    position: relative;
    width: 100%;
	text-align: center;
	overflow: hidden;
	z-index: 1;
}
	/* Contenido secciones */
    #body-content {
        display: inline-block;
        position: relative;
        width: 100%;
		max-width: 1024px;
		height: auto;
        margin: 56px auto 35px;
    }
	/* Imagenes fondos */
	#bg-images {
		position: absolute;
		top: 0;
		left: 50%;
		width: 1840px;
		height: 100%;
		transform: translateX(-50%);
		max-width: 1840px;
	}

	#bg-images .bg-madera {
		position: absolute;
		top: 0;
		width: 100%;
		max-width: 448px;
		height: 522px;
		max-height: 50%;
	}
		.bg-madera-left {
			left: 0;
		}
		.bg-madera-right {
			right: 0;
		}
		.bg-madera img {
			margin: 0px auto;
			max-width: 100%;
			height: auto;
		}
	#bg-images .bg-avena {
		position: absolute;
		bottom: 50px;
		width: 100%;
		max-height: 50%;
		display: none;
	}
	.bg-avena-left-back {
		background: url('../assets/bg-avena-left_02.png');
		background-repeat: no-repeat;
		width: 50% !important;
		height: 100%;
		left: 0;
		background-position: 0 center;
	}

	.bg-avena-right-back {
		background: url('../assets/bg-avena-right_02.png');
		background-repeat: no-repeat;
		width: 50% !important;
		height: 100%;
		right: 0;
		background-position: 100% center;
	}
		.bg-avena-left {
			left: 0;
			max-width: 447px;
			height: 472px;
		}
		.bg-avena-right {
			right: 0;
			margin-bottom: 140px;
			max-width: 420px;
			height: 340px;
		}
		.bg-avena img {
			margin: 0px auto;
			max-width: 100%;
			height: auto;
		}
	/* Velado */
	.content__shadow {
		display: none;
		width: 100%;
		height: 100%;
		background-color: rgba(255, 255, 255, 0.65);
		position: fixed;
		left: 0px;
		top: 0px;
		z-index: 4;
	}
		.content__shadow.is-active {
			display: block;
		}

footer {
	position: relative;
	height: auto;
	overflow: hidden;
	width: 100%;
	background-color: #f1f1f1;
	padding-bottom: 10px;
	-webkit-box-shadow: 2px 2px 13px 0px rgba(192, 120, 27, 0.25);
	-moz-box-shadow:    2px 2px 13px 0px rgba(192, 120, 27, 0.25);
	box-shadow:         2px 2px 13px 0px rgba(192, 120, 27, 0.25);
	z-index: 3;
}

@media screen and (max-width: 63.938em) { /* << 1023 */
	#body-content { margin-top: 92px; }
}
@media screen and (max-width: 44.938em) { /* << 719 */
	#body-content { margin-top: 38px; }
}

@media screen and (min-width: 64em) { /* 1024 >> */
	#main-content {
		min-width: 1024px;
	}
}

.banner {
    height: 0px;
    background: rgb(0, 73, 64);
    position: relative;
    z-index: 1;
}

.logo__wrapper {
    max-width: 920px;
    height: 100%;
    position: relative;
    margin: 0px auto;
}

.logo--adamfoods {
    width: 19%;
    position: absolute;
     top: -29px;
    right: -240px;
    outline: none;
}

.logo--adamfoods img {
    max-width: 100%;
    height: auto;
}


@media screen and (min-width: 979px) {
    .bg-avena {
		display: block;
	}
}

@media screen and (min-width: 1840px) {
    #bg-images {
		width: 100%;
		max-width: none;
	}
}