@charset "utf-8";
/* CSS Document */

@import url('https://fonts.googleapis.com/css?family=Inknut+Antiqua');


.p-left-5 {
	margin-left: -5px;
}

.p-left-10 {
	margin-left: -10px;
}

.p-left-11 {
	margin-left: -11px;
}

.p-right-5 {
	margin-right: -5px;
}

.p-right-10 {
	margin-right: -10px;
}

.pad-right-15 {
	padding-right: 15px;
}

.cabecera {
	height: 15px;
	margin: 15px;
	width: 100%;
}

.row.no-gutter {
  margin-left: 0;
  margin-right: 0;
}

.row.no-gutter [class*='col-']:not(:first-child),
.row.no-gutter [class*='col-']:not(:last-child) {
  padding-right: 0;
  padding-left: 0;
}

	
.shadow {
  color: #DCDCDC;
  font-family: 'Inknut Antiqua', serif;
  text-shadow:
    -3px -3px 0 #222,
    3px -3px 0 #222,
    -3px 3px 0 #222,
    3px 3px 0 #222,
    4px 4px 0 #555,
    5px 5px 0 #555;

  line-height: 0.8em;
  letter-spacing: 0.05em;
  margin:0;
  text-align: center;
}

.shadows {

  font-family: 'Inknut Antiqua', serif;
  text-shadow:
    -1px -1px 0 #222,
	-2px -2px 0 #222,
	1px 1px 0 #555,
	2px 2px 0 #555,
	3px 3px 0 #555;
  letter-spacing: 0.05em;
}

.vcenter {
    display: inline-block;
    vertical-align: middle;
    float: none;
}
	


.navbar {
	z-index: 9;
	position:fixed;
	text-align: center;
	width: 100%;

}

#myNavbar ul {
	
	margin-top: 20px;

}

#myNavbar li a {
	font-family: 'Inknut Antiqua', serif;
	font-size:0.9vmax;
	color: #D2DBFF;
	padding: 0px 20px 15px 20px;
	margin: 0px;
	background-color: transparent;
	letter-spacing: 0.08em;

}

#myNavbar li a:hover {
	background-color: transparent;
}

#myNavbar li a:active {
	background-color: transparent;
}

#myNavbar li a:visited {
	background-color: transparent;
}

#menu li.active a {
	color: white; 
}

.navbar-nav {
	z-index: 1000;
}

 .navbar-nav > li {
    float: left;
	display: inline-block;
    vertical-align: bottom;
  }

.separador {
	padding: 0px;
	margin: 0px;
	color: white;
}

  #site-logo {
    position: relative;
    vertical-align: bottom;
    bottom: -40px;
	opacity: 0.0;
  }
  
  #site-logo a {
    margin-top: -15px;

  }

h1 {
	font-family: 'Inknut Antiqua', serif;
	Font-size: 4vmax;
	font-weight: 600;
	color: #111;
}

#lenguaje {
	background: rgba(0,0,0,0.6);
	margin-top: -10px !important;
}

#lenguaje li {

}

.dropdown a {
	font-family: 'Open Sans', sans-serif !important;
	font-weight: 300;
	float: right !important;
}
.dropdown-menu {
	min-width: 0px;
}

.navbar-right {
	margin-right: 100px;
}

.active a {
	color: white !important;
}

#section0 {
	background-color: black;
}

/*-- Secccion 1 --*/

.section1 {
	background-image: url(../img/Bag-Slide1.jpg);
	background-size: cover;
	background-repeat:no-repeat;
	background-position: center; 
	object-fit: contain;
	background-color: black;
}

.section1 p {
	color: white;
	font-size: 16px;
	font-family: 'Open Sans', sans-serif;
	font-weight: 300;
	line-height: 1.5;
	letter-spacing: 0.7px;
	opacity: 0.0;
	animation-delay: 4s;
}

.divisor {
	opacity: 0.0;
	animation-delay: 4s;
	width: 45vmax;
	margin: 15px;
}

img.LogoLanding {
	animation-delay: 2s;
	opacity: 0.0;
	animation-duration: 4s;
	width: 45vmax;
	max-width: 451px;
}

.section2 h1 {
	text-align: center;
	opacity: 0.0;
	}



.section2 {
	background-image: url(../img/Bag-Slide2.jpg);
	background-size: cover;
	background-repeat:no-repeat;
	background-position: center; 
	object-fit: contain;
	background-color: black;
	height: 90%;
}

.section2 img { 

	opacity: 0.0;
}

.section2 p { 
	padding: 100px 0px;
	color: white;
	font-size: 18px;
	font-family: 'Open Sans', sans-serif;
	opacity: 0.0;

}

.s2-botella {
	animation-delay: 1s;
	animation-duration: 5;
	width: 100%;
	max-width: 250px;
	height: auto;
}

.estriborRon {
	width: 100%;
	max-width: 491px;
	height: auto;
}


/*seccion 3*/


.section3 {
	background-image: url(../img/Bag-Slide3.jpg);
	background-size: cover;
	background-repeat:no-repeat;
	object-fit: contain;
	background-color: black;
}

.section3 p {
	font-family: 'Open Sans', sans-serif;
	font-size: 1.3vmax;
	color: white;
	margin-top: -10px;

}

#s3-separador {
	height: 20px;
}

.s3-tcultivo, .s3-tmolienda, .s3-tfermentacion, .s3-tdestilacion {
	font-family: 'Inknut Antiqua', serif;
	font-size: 24px;
	margin-bottom: 0px;
	margin-top: 0px;
	color: white;
	line-height: 1em;
	letter-spacing: 0.08em;
}



.section3 h1 {
	text-align: center;
	opacity: 0.0;
	
}

.section3 hr {
	width: 45%;
	border-color: #DCDCDC;
	border-width: 4px;
	opacity: 0.0;
	animation-delay: 0.5s;
}

.s3-cultivo, .s3-molienda, .s3-fermentacion, .s3-destilacion {
	width: 100%;
	height: 100%;
	opacity: 0.0;
	border: 3px solid #ccc;
}

.s3-cultivo {
	animation-delay: 1s;
}

.s3-molienda {
	animation-delay: 2.2s;
}

.s3-fermentacion {
	animation-delay: 1.4s;
}

.s3-destilacion {
	animation-delay: 1.8s;
}


#a-cultivo {
	opacity: 0.0;
	animation-delay: 3.0s;
}

#a-molienda {
	opacity: 0.0;
	animation-delay: 3.5s;
}

#a-fermentacion {
	opacity: 0.0;
	animation-delay: 4.0s;
}

#a-destilacion {
	opacity: 0.0;
	animation-delay: 4.5s;
}


/*SECCION 4*/

.section4 {
	background-image: url(../img/Bag-Slide4.jpg);
	background-size: cover;
	background-repeat:no-repeat;
	object-fit: contain;
	background-color: black;
}

.section4 input, textarea, select {
	width: 100%;
	margin: 3px 3px;;
	padding: 10px 10px;
    border: 1px solid #CBCBCB;
	color: white;
	background: rgba(0,0,0,0.6);
	resize: none;
	border-radius: 5px;
}

.section4 p {
	color: white;
	text-align: center;

}


form {
	opacity: 0.0;
	animation-delay: 1s;
}

select:required:invalid {
  color: gray;
}
option[value=""][disabled] {
  display: none;
}



.section4 input {
	height: 50px;
}

.section4 button {
	text-align: right;
	background: rgba(0,0,0,0.6);
	 text-shadow: none;
	 color: white;
}
.section4 h1 {
	margin-top: 25%;
	text-align:center;
	opacity: 0.0;
	animation-duration: 2s;
	letter-spacing: 0.08em;
}

#direccion {
	padding: 10px;
	margin: 0px auto;
	transition: opacity;
	transition-duration: 2s;
	transition-delay: 1s;
	opacity: 0.0;
	border-radius: 10px;
	font-size: 1.2em;
}

#direccion span {
	font-size: 1.5em;
	text-shadow:
	-1px -2px 0 #000,  
   -1px -1px 0 #000,  
    1px -1px 0 #000,
    -1px 1px 0 #000,
     1px 1px 0 #000,
	 1px 2px 0 #000;
}

#gmap_canvas {
	margin-left: auto;
	margin-right: auto;
	border-style: solid;
	border-color: rgba(208,208,208,1.00);
	border-width: 5px;
	border-radius: 10px;
}

#mapa {
	width: 100%;
	margin-left: auto;
	margin-right: auto;
	margin-top: 25%;
	transition: opacity;
	transition-duration: 2s;
	transition-delay: 1s;
	opacity: 0.0;
}

.section.active #mapa {
	opacity: 1.0;
}

.section.active #direccion {
	opacity: 1.0;
}

footer {
	text-align: center;
	font-size: 0.85em;
	margin-top: 30px;
	margin-left: auto;
	margin-right: auto;
	padding-left: 15%;
	padding-right: 15%;
	padding-top: 1px;
	padding-bottom: 25px;
}


/*Galeria*/

#section5 {
	background-image: url(../img/Bag-Slide5.jpg);
	background-size: cover;
	background-repeat:no-repeat;
	object-fit: contain;
	background-color: black;
}


#galeria {
	margin: auto;
	width: 80%;
	max-width: 600px;
	height: 80%;
	padding: 30px;
	border-radius: 10px;
	background: rgba(0,0,0,0.5);
	opacity: 0.0;
	animation-delay: 1.2s;
}

#section5 h1 {
	text-align: center;
	margin-top: -30px;
	opacity: 0.0;

}

#section5 hr {
	width: 50%;
	border-color: #DCDCDC;
	border-width: 4px;
	opacity: 0.0;
	animation-delay: 0.5s;
	padding-bottom: 15px;
	

}







/*Media queri para telefonos*/

@media (max-width: 768px) { 
	
	/*	Navbar*/
	.navbar-nav {
		background-color: rgba(0,0,0,0.8);
		
	}
	#myNavbar ul{
		margin-top: 0px;
	}
	
	.navbar-right{
		
		float: none !important;
		margin: 0px;
	}
	
	#navcollapsed {
		margin-top: 0px;
	}
	#myNavbar li a {
	font-size: 9px;
	}
	
	.navbar-toggle {
		background-image: url(../img/boton.png);
		background-repeat: no-repeat;
		background-position: center;
	}
	
	/*Intro*/

	.section1 p {
		font-size: 13px;

	}


	/*Nuestro Ron*/

	.s2-botella {
		width: 30%;
		max-width: 130px;
	}
	.estriborRon {
		width: 100%;
		max-width: 350px;
		height: auto;
	}
	.section2 p {
		font-size: 13px;
		padding-top: 25px;
		padding-bottom: 50px;
	}


	/*Elaboracion	*/

	.s3-cultivo, .s3-molienda, .s3-fermentacion, .s3-destilacion {
		width: 70px;
		height: auto;
		border: 1px solid #ccc;
	}

	.s3-tcultivo, .s3-tmolienda, .s3-tfermentacion, .s3-tdestilacion {
		font-size: 13px;
		margin-bottom: -5px;
		margin-top: 0px;
	}
	
	.section3 h1 {
		font-size: 3.8vmax;
	}

	.section3 p {
		font-family: 'Open Sans', sans-serif;
		font-size: 10px;
		color: white;

	}

	#a-cultivo, #a-fermentacion {
		margin: 0px -10px 0px 0px;
		padding: 0px 0px 0px 10px;
	}

	#a-destilacion, #a-molienda {
		margin: 0px 0px 0px -10px;
		padding: 0px 10px 0px 0px;

	}

	/*	Galeria*/

	
	#galeria {
		height: 100%;
	}
	
	#section5 h1 {
	margin-top: 10px;
	font-size: 6vmax;
	
	}
	
	#section5 hr {
	padding-bottom: 2px;	
	}
	/*Contacto*/
	
	.section4 input, textarea, select {
		padding: 5px;
		margin: 2px;
		width: 82%;
		height: 23px;
		font-size: 9.5px;
	
	}
	.section4 textarea {
		height: 90px;
	}
	
	.section4 button {
	text-align: center;
	}
	
	#mapa {
		display: none;
	}
	
	#direccion {
		font-size: 11px;
		margin-bottom: 0px;
	}
	#direccion span {
		font-size: 11px;
		margin-bottom: 0px;
		padding-bottom: 0px;
	}
	
	footer {
		font-size: 8.5px;
		margin-top: 3px;
		padding-left: 5%;
		padding-right: 5%;
			
	}


}


