@charset "utf-8";
/* CSS Document */
/************************ ESTILOS SITIO ****************************/
p  {
	font-size:.84em !important;
}
/**********************  HEADER ***********************/
header {
	width:100%;
	height:70px;
	margin:0 auto;
	/*position:absolute;
	top:0;
	left:0;*/
	background:rgba(255,255,255,.9);
	z-index:5000;
}
#logo {
	width:20%;
	height:55px;
	padding-top:15px;
	float:left;
	text-align:center;
	/*background:#FFF;*/
}
#logo img {
	max-height:80%;
	margin:0 auto;
	padding-left:30px;
}
/**/
#menumov {
	display:none !important;
}
#menumovil {
	display:none !important;
}
/**/
nav {
	width:60%;
	height:70px;
	float:left;
	color:#B84B1F;
	/*background:#FFF;*/
}
#menu ul {
	width:90%;
	margin:0 auto;
}
#menu ul li {
	height:35px;
	padding-top:35px;
	display:inline-block;
}
#menu ul li a {
	margin:0 10px;
	font-size:.9em;
	padding:3px 0;
	border-top:1px solid rgba(255,255,255,0);
	border-bottom:1px solid rgba(255,255,255,0);
	transition:all 500ms ease-in-out;
	-webkit-transition:all 500ms ease-in-out;
	-moz-transition:all 500ms ease-in-out;
}
#menu ul li a:hover{
	border-top:1px solid #B84B1F;
	border-bottom:1px solid #B84B1F;
}
/**/
header #social {
	width:18%;
	height:47px;
	float:right;
	padding:23px 0 0 2%;
	display:inline-block;
}
header #social img {
	width:25px;
	margin:10px 10px 0 0;
	border:1px solid #B84B1F;
}
/**************************************/
#cont1 {
	width:100%;
	height:100vh;
	border-bottom:6px solid #B84B1F;
}
/** BANNER INDEX **/
.pic-wrapper {
  position: absolute;
  width: 100%;
  height: 100%;
  overflow: hidden;
}
/**/
.pic-wrapper h2 {
	width:80%;
	margin:0 auto;
	position:relative;
	top:130px;
	text-align:center;
	font:1.8em 'Oswald Light';
	color:#FFF;
	font-weight:bold;
	letter-spacing:1px;
}
.pic-wrapper h4 {
	width:80%;
	margin:0 auto;
	position:relative;
	top:150px;
	text-align:center;
	font-size:1.1em;
	color:#FFF;
	line-height:1.5em;
}
/**/
figure {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  /*animation*/
  
  animation: slideShow 24s linear infinite 0s;
  -o-animation: slideShow 24s linear infinite 0s;
  -moz-animation: slideShow 24s linear infinite 0s;
  -webkit-animation: slideShow 24s linear infinite 0s;
}

figurecaption {
  position: absolute;
  top: 50%;
  left: 50%;
  color: #fff;
}

.pic-1 {
  	opacity: 1;
  	background:url(../img/bg-40.png), url(../img/mercuria-banner1.jpg) no-repeat center center;
  	-webkit-background-size:contain, cover;
  	-moz-background-size:contain, cover;
  	-o-background-size:contain, cover;
  	background-size:contain, cover;
	
	background-position:top, center;
	background-repeat:repeat, no-repeat;
}

.pic-2 {
  	animation-delay: 6s;
  	-o-animation-delay: 6s;
  	-moz--animation-delay: 6s;
  	-webkit-animation-delay: 6s;
  	background:url(../img/bg-40.png), url(../img/mercuria-banner2.jpg);
  	-webkit-background-size:contain, cover;
  	-moz-background-size:contain, cover;
  	-o-background-size:contain, cover;
  	background-size:contain, cover;
	
	background-position:top, center;
	background-repeat:repeat, no-repeat;
}
.pic-3 {
  	animation-delay: 12s;
  	-o-animation-delay: 12s;
  	-moz--animation-delay: 12s;
  	-webkit-animation-delay: 12s;
  	background:url(../img/bg-40.png), url(../img/mercuria-banner3.jpg) no-repeat center center;
  	-webkit-background-size:contain, cover;
  	-moz-background-size:contain, cover;
  	-o-background-size:contain, cover;
  	background-size:contain, cover;
	
	background-position:top, center;
	background-repeat:repeat, no-repeat;
}

.pic-4 {
  animation-delay: 18s;
  -o-animation-delay: 18s;
  -moz--animation-delay: 18s;
  -webkit-animation-delay: 18s;
  	background:url(../img/bg-40.png), url(../img/mercuria-banner4.jpg) no-repeat center center;
  	-webkit-background-size:contain, cover;
  	-moz-background-size:contain, cover;
  	-o-background-size:contain, cover;
  	background-size:contain, cover;
	
	background-position:top, center;
	background-repeat:repeat, no-repeat;
}
/* keyframes*/

@keyframes slideShow {  0% {
 opacity: 0;
 transform:scale(1);
 -ms-transform:scale(1);
}
 5% {
 opacity: 1
}
 25% {
 opacity: 1;
}
 30% {
 opacity: 0;
 transform:scale(1.1);
 -ms-transform:scale(1.1);
}
 100% {
 opacity: 0;
 transform:scale(1);
 -ms-transformm:scale(1);
}
}
@-o-keyframes slideShow {  0% {
 opacity: 0;
 -o-transform:scale(1);
}
 5% {
 opacity: 1
}
 25% {
 opacity: 1;
}
 30% {
 opacity: 0;
 -o-transform:scale(1.1);
}
 100% {
 opacity: 0;
 -o-transformm:scale(1);
}
}
@-moz-keyframes slideShow {  0% {
 opacity: 0;
 -moz-transform:scale(1);
}
 5% {
 opacity: 1
}
 25% {
 opacity: 1;
}
 30% {
 opacity: 0;
 -moz-transform:scale(1.1);
}
 100% {
 opacity: 0;
 -moz-transformm:scale(1);
}
}
@-webkit-keyframes slideShow {  0% {
 opacity: 0;
 -webkit-transform:scale(1);
}
 5% {
 opacity: 1
}
 25% {
 opacity: 1;
}
 30% {
 opacity: 0;
 -webkit-transform:scale(1.1);
}
 100% {
 opacity: 0;
 -webkit-transformm:scale(1);
}
}
/** BANNER INTERIOR **/
#contbanner {
	width:100%;
	height:386px;
	padding:0;
	background:#B84B1F;
}
/**/
#control {
	width:90%;
	overflow:auto;
	margin:0 auto;
	position:relative;
	top:-230px;
	z-index:3000;
}
#control #prev {
	cursor:pointer;
	float:left;
}
#control #next {
	cursor:pointer;
	float:right;
}
/**/
#banner {
	width:100%;
	margin:0 auto;
	text-align:center;
	color:#FFF;
}
#banner h2 {
	width:80%;
	margin:0 auto;
	position:relative;
	top:130px;
	font:1.8em 'Oswald Light';
	font-weight:bold;
	letter-spacing:1px;
}
#banner h4 {
	width:80%;
	margin:0 auto;
	position:relative;
	top:150px;
	font-size:1.1em;
	line-height:1.5em;
}
/**/
#banner #banner1 {
	width:100%;
	height:380px;
	background-image:url(../img/bg-40.png), url(../img/mercuria-banner1.jpg);
	background-size:contain, cover;
	background-position:top, center;
	background-repeat:repeat, no-repeat;
}
#banner #banner2 {
	width:100%;
	height:380px;
	background-image:url(../img/bg-40.png), url(../img/mercuria-banner2.jpg);
	background-size:contain, cover;
	background-position:top, center;
	background-repeat:repeat, no-repeat;
}
#banner #banner3 {
	width:100%;
	height:380px;
	background-image:url(../img/bg-40.png), url(../img/mercuria-banner3.jpg);
	background-size:contain, cover;
	background-position:top, center;
	background-repeat:repeat, no-repeat;
}
#banner #banner4 {
	width:100%;
	height:380px;
	background-image:url(../img/bg-40.png), url(../img/mercuria-banner4.jpg);
	background-size:contain, cover;
	background-position:top, center;
	background-repeat:repeat, no-repeat;
}

/*************** CONTENIDO DOS TEXTO PRESENTACION ************************/
#cont2 {
	width:100%;
	overflow:auto;
	padding:60px 0 0px 0;
	text-align:center;
}
#cont2 h1 {
	width:80%;
	margin:0 auto 20px auto;
	font:1.8em 'Oswald Light';
	color:#B84B1F;
	text-align:center;
}
#cont2 p {
	width:80%;
	margin:0 auto 20px auto;
	text-align:justify;
	color:#444;
	line-height:1.7em;
}
#bgIndex {
	width:100%;
	height:250px;
	overflow:hidden;
	margin-top:30px;
	background-image:url(../img/mercuria-background-index.jpg);
	background-position:top;
	background-repeat:no-repeat;
	background-size:cover;
}
/** CONT DOS EMPRESA **/
.flexbox {
	width:90%;
	margin:0 auto 40px auto;
	display:box;
	box-orient:horizontal;
	display:-webkit-box;
	-webkit-box-orient:horizontal;
	display:-ms-box;
	-ms-box-orient:horizontal;
	display:-moz-box;
	-moz-box-orient:horizontal;
	display:-o-box;
	-o-box-orient:horizontal;
}
.flexbox> div {
	box-flex:1;
	-webkit-box-flex:1;
	-ms-box-flex:1;
	-moz-box-flex:1;
	-o-box-flex:1;
}
.flexbox div {
	width:300px;
	margin:0 10px;
	text-align:center;
}
.flexbox div img {
}
.flexbox div h3 {
	margin:10px auto;
	font:1.8em 'Oswald Light';
	color:#B84B1F;
}
.flexbox div p {
	text-align:justify;
	color:#444;
	line-height:1.4em;
}
.flexbox div h6 {
	margin:10px auto;
	font-size:.8em;
	text-align:center;
	color:#444;
	line-height:.7em;
}
/*************** CONTENIDO TRES EMPRESA ************************/
#cont3 {
	width:100%;
	padding:30px 0 0px 0;
	text-align:center;
}
#cont3 div {
	width:100%;
	height:250px;
	overflow:hidden;
	background-image:url(../img/mercuria-background-empresa.jpg);
	background-position:top;
	background-repeat:no-repeat;
	background-size:cover;
}
#cont3 h3 {
	width:80%;
	margin:40px auto 20px auto;
	font:1.8em 'Oswald Light';
	color:#B84B1F;
	text-align:center;
}
#cont3 p {
	width:80%;
	margin:0 auto;
	text-align:justify;
	color:#444;
	line-height:1.7em;
}
#cont3 a {
	width:auto;
	display:inline-block;
	margin-bottom:7px;
	color:#444;
	padding-bottom:3px;
	border-bottom:1px solid #F1F1F1;
}
#cont3 a:hover {
	color:#B84B1F;
	border-bottom:1px solid #B84B1F;
}
#cont3 p:last-child {
	margin-bottom:40px;
}
/** CONTACTO **/
#mapa {
	width:100%;
	border-top:6px solid #B84B1F;
}
/***********************  FOOTER ************************/
footer {
	width:100%;
	height:220px;
	overflow:auto;
	background:#222;
	border-top:6px solid #B84B1F;
}
footer ul {
	width:80%;
	margin:0 auto;
	padding:30px 0;
}
footer ul li {
	width:30%;
	display:block;
	margin:0;
	font-size:.75em;
	color:#999;
}
footer #social {
	width:80%;
	margin:0 auto;
}
footer #social img {
	width:23px;
	margin:0 10px 0 0;
	border:1px solid #FFF;
}
/*********************** CONTACTO ************************/
#contContacto {
	width:100%;
}
#contacto {
	width:80%;
	height:auto;
	overflow:auto;
	margin:30px auto;
}
#contacto h2 {
	margin:30px 0 10px 0;
	font-size:1em;
	color:#B84B1F;
	font-weight:bold;
}
#contacto p {
	margin-bottom:10px;
	font-size:.8em;
	color:#444;
	line-height:1.4em;
}
#contacto form {
	width:65%;
	float:left;
	margin:40px 0;
}
#contacto form div:nth-child(1) {
	width:50%;
	float:left;
}
#contacto form div:nth-child(2) {
	width:50%;
	float:right;
}
#contacto form label {
	display:block;
	font-size:.8em;
	color:#444;
}
#contacto form input {
	width:90%;
	display:block;
	margin:5px 0 20px 0;
	padding:5px;
	font-size:.8em;
	color:#222;
	background:#F1F1F1;
	border:1px solid #777;
}
#contacto form textarea {
	width:90%;
	display:block;
	margin:5px 0 5px 0;
	padding:5px;
	font-size:.8em;
	color:#222;
	background:#F1F1F1;
	border:1px solid #777;
}
#contacto .btn {
	width:100px;
	cursor:pointer;
	display:inline;
	padding:4px;
	font-size:.8em;
	color:#B84B1F;
	font-weight:bold;
	text-transform:uppercase;
	background:#F1F1F1;
	border:1px solid #B84B1F;
	transition:all 500ms ease-in-out;
	-webkit-transition:all 500ms ease-in-out;
	-moz-transition:all 500ms ease-in-out;
}
#contacto .btn:hover {
	color:#FFF;
	background:#B84B1F;
}
::-moz-placeholder{ font-size:.85em; color:#999; font-style:italic;}
input:focus::-moz-placeholder { color:rgba(0,0,0,0); }
textarea:focus::-moz-placeholder { color:rgba(0,0,0,0); }

::-webkit-placeholder{ font-size:.85em; color:#999; font-style:italic;}
input:focus::-webkit-input-placeholder { color:rgba(0,0,0,0); }
textarea:focus::-webkit-input-placeholder { color:rgba(0,0,0,0); }

::-ms-placeholder{ font-size:.85em; color:#999; font-style:italic;}
input:focus::-ms-input-placeholder { color:rgba(0,0,0,0); }
textarea:focus::-ms-input-placeholder { color:rgba(0,0,0,0); }
/**/
#info {
	width:30%;
	float:right;
	margin:40px 0;
	font-size:.9em;
	color:#777;
}
#info img {
	max-width:60%;
	margin-bottom:10px;
}
/**/
#mapa {
	clear:both;
	border-top:6px solid #B84B1F;
	border-bottom:6px solid #B84B1F;
}