
/*
Note: The best way to structure the use of media queries is to create the queries
near the relevant code. For example, if you wanted to change the styles for buttons
on small devices, paste the mobile query code up in the buttons section and style it
there.
*/

@import url(https://fonts.googleapis.com/css?family=Oswald:400,300,700);

.container {
	width: 90%;
	padding: 0;
	font-family: 'Open Sans', sans-serif;

}

.section{
	margin: 2rem 0 2rem;
}

.section.header{
	
}

.section.header.bg{
	margin-top: 0;
	padding: 1rem 0;
}

.section.header.fixed{
	position: fixed;
	z-index: 5000;
	top: 0;
	left: 0;
	width: 100%;
}

.section.header .logo{
	font-size: 0;
}

.section.header .logo img{
	height: 45px;
}

.section.header .info{
	line-height: 140%;
	float: right;
}

.section.header .info span{
	display: block;
	text-align: right;
	font-family: Arial, sans-serif; 
	 
	text-transform: uppercase;
	font-weight: 700;
}

.section.header .info a{
	font-size: 1.8rem;
	color: #000;
	font-family: Arial, sans-serif;
	 
	font-weight: 600;
}

.section.after-fixed{
	margin-top: 9rem;
}

.section.menu{
	
}

.section.content{
	
}

.section.footer{
	margin-bottom: 0;
}

.section.footer a{
	
}

.section.footer a:hover{
	
}

.section.footer ul{
	list-style: none;
	margin-bottom: 0;
}

.section.footer ul li{
	margin-bottom: 0;
	line-height: 120%;
}

.section.bg{
	padding: 2rem 0;
}

.section.footer ul li{
	margin-bottom: 0;
}

.add-bottom{
	margin-bottom: 20px;
}

.add-top{
	padding-top: 20px;
}

.add-half-bottom,
.half-bottom{
	margin-bottom: 10px;
}

.remove-bottom{
	margin-bottom: 0px;
}

.remove-top{
	margin-top: 0px;
}

.google-maps {
    position: relative;
    padding-bottom: 75%;
    height: 0;
    overflow: hidden;
}
.google-maps iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100% !important;
    height: 100% !important;
}

.video-container {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 30px; height: 0; overflow: hidden;
}
 
.video-container iframe,
.video-container object,
.video-container embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.owl-carousel .item{
	margin: 0 0.5rem;
}

h1{
	font-size: 2.5rem;
	font-family: 'Open Sans', sans-serif;
}

h2{
	font-size: 2.5rem;
	font-family: 'Open Sans', sans-serif;
	font-weight: 700;
	color: #fff;
	letter-spacing: 0.1rem;
    padding: 1rem 1.3rem;
    margin-top: 1rem;
    text-transform: uppercase;
    background: url(../img/slice.jpg) left top no-repeat red;
    background-size: auto 100%;
    text-shadow: 0 0 1rem #000;
}

h3{
	font-size: 1.8rem;
	font-family: Arial, sans-serif;;
	text-align: center;
	text-transform: uppercase;
	padding: 1rem;
	font-weight: 700;
	letter-spacing: .05rem;
	font-family: 'Open Sans', sans-serif;
	border-bottom: 1px solid #ccc;
}

h3 strong{
	font-weight: 700;
	font-size: 1.6rem;
	color: #777;
}

h4{
	font-size: 1.3rem;
	font-family: Arial, sans-serif;
	font-weight: 600;
	text-align: center;
	margin: 1rem;
}

#galleria h4{
	font-size: 1.6rem;
	font-family: Arial, sans-serif;
	font-weight: 600;
	text-align: center;
	background: #000;
	color: #fff;
	padding: 1rem 0;
	margin: 0;
	
}

h5{
	font-size: 2.5rem;
	font-family: Arial, sans-serif;
	color: #323232;
	font-weight: 700;
	display: block;
	background: #ccc;
	text-align: center;
	margin-bottom: 1rem;
}

h6{
	font-size: 2.6rem;
	text-align: center;
	font-family: 'Open Sans', sans-serif;
	font-weight: 700;
	color: #fff;
	letter-spacing: 0.1rem;
	background: red;
    text-transform: uppercase;
    margin-bottom: .5rem;
}

h6 strong{
	font-size: 3srem;
	text-align: center;
	font-family: 'Open Sans', sans-serif;
	font-weight: 700;
	color: #fff;
	letter-spacing: 0.1rem;
	background: red;
    text-transform: uppercase;
    margin-bottom: .5rem;
}

h7{
	display: block;
	text-transform: uppercase;
	font-weight: bold;
	margin-bottom: 1rem;
}

h7 span {
    background: red;
    border-radius: 10rem;
    padding: .5rem .7rem;
    color: #fff;
}

h8, h8 a{
	display: block;
	text-transform: uppercase;
	font-weight: bold;
	margin-bottom: .5rem;
	color: #59AE33;
}

.numeros{
	font-weight: bold;
	display: inline-block;
	font-size: 1.6rem;
	margin: 0  0 1.5rem 2.8rem;
}

.red{
	background: red;
} 


h4 span{
	color: #fff;
}


.promo{
	font-size: 2.3rem;
	text-align: center;
	display: block;
	font-family: Arial, sans-serif;
	font-weight: 600;
	margin-bottom: 1rem;
}

.caption{
	font-size: 1.2rem;
	text-align: center;
}

.mobile{
	display: block;
}

.no-mobile{
	display: none;
}

.shadow{
	-webkit-box-shadow: 0px 1px 15px #888888;
	-moz-box-shadow: 0px 1px 15px #888888;
	box-shadow: 0px 1px 15px #888888;
}

.gris{
	background: #efefef;
}

.black{
	background: #000;
	color: #fff;
}

.banner{
	font-size: 0;
}

.fb{
	color: #fff;
	font-size: 3rem;
	margin-right: 1rem;
}

.fb:hover{
	color: #133783;
}

.tw{
	color: #fff;
	font-size: 3rem;
	margin-right: 1rem;
}

.tw:hover{
	color: #46A1EC;
}

.in{
	color: #fff;
	font-size: 3rem;
	margin-right: 1rem;
}

.in:hover{
	color: #BE408F;
}

.yt{
	color: #fff;
	font-size: 3rem;
	margin-right: 1rem;
}

.yt:hover{
	color: #FF0000;
}

input[type="submit"]{
	background: red;
	color: #fff !important;
}

.no-border{
	border-bottom: 0;
}

label{
	font-size: 1.3rem;
	margin-bottom: .1rem;
}

input, textarea, select{
	margin-bottom: .5rem;
	font-size: 1.3rem;
	color: black !important;
}

input[type="text"], input[type="email"], select, input[type="tel"]{
	height: 30px;
}

textarea{
	min-height: 40px;
}

.wine{
	background: #8a0d10;
}

.top form{
	background: rgba(0, 0, 0, 0.7);
	padding: 1rem;
	margin: 1rem;
	border-radius: .5rem;
}
.top{
	padding-top: 5%;
}
.lines{
	border-bottom: 1px solid #ccc;
	border-top: 1px solid #ccc;
}

.contacto{
	font-family: 'Open Sans', sans-serif;
	font-weight: 700;
	text-transform: uppercase;
	text-align: center;
	font-size: 2rem;
	line-height: 110%;
	display: block;
	color: #fff;
	margin-bottom: 1rem;
}
.banner{
	background: url(../img/bg-general.jpg) left top no-repeat;
	background-size: 150% auto;
}

.black h5{
	font-family: 'Oswald', sans-serif;
	font-size: 2rem;
}

.special{
	min-height: 18rem;
}

.small p{
	font-size: 1.3rem;
}

.head h4{
	font-size: 2.3rem;
	line-height: 110%;
	text-align: center;
	display: inline-block;
    border: 1px solid #ccc;
    border-radius: .5rem;
    padding: .5rem 1rem;
    background: #ebebeb
}

.head h4 a{
	text-decoration: none;
	color: #000;
}

.head ul{
	display: inline-block;
	
}

.menu li{
	list-style-type: none;
	float: left;
}


.head-mobile h4{
	font-size: 1.3rem;
}

.section.social.fixed{
	position: fixed;
	z-index: 5000;
	top: 0px;
	right: 0;
	width: 140px;
	float: right;
}
	
.section.social.fixed a{
	text-decoration: none;
	float: right;
}

.section.social.fixed i{
	font-size: 2rem !important;
	color: #fff !important;
	display: block;
	padding: 0.8rem 1rem;
	text-decoration: none;
	box-shadow: 0rem 0rem .3rem #000;
}
.section.whatsapp.fixed{
	position: fixed;
	z-index: 5000;
	top: 0px;
	left: 0px;
    width: 140px;
    float: right;
}
	
.section.whatsapp.fixed a{
	text-decoration: none;
	float: left;
}

.section.whatsapp.fixed i{
	font-size: 2rem !important;
	color: #fff !important;
	display: block;
	padding: 0.8rem 1rem;
	text-decoration: none;
	box-shadow: 0rem 0rem .3rem #000;
}
.tnx{
	display: block;
	background: rgba(255, 255, 255, 0.9);
	height: 15rem;
	color: #000;
	padding: 1rem;
	
}

.versiones img{
	display: block;
	margin: auto;
}

.phones span{
	background: red;
	border-radius: 10rem;
	padding: .5rem .7rem;
}

#versiones ul{
	list-style: none; 
}

#versiones li { 
    padding-left: 1.3em;
    text-indent: -1.2em;
    margin-bottom: 0.7rem;
    line-height: 1.4;
}

#versiones li:before {
    content: "ï€Œ ";
    color: #D0112B;
    font:normal normal normal 14px/1 FontAwesome;
}

.tab li img{
	width: 45%;
    display: block;
    margin: auto;
}

ul.color-select-list{
	list-style: none;
}

ul.color-select-list li{
	display: inline-block;
}

ul.color-select-list li a{
	display: inline-block;
	width: 40px;
	height: 40px;
	border: 1px solid #ccc;
}

th{
	background: #ccc;
}

th:first-child, td:first-child {
	padding-left: 1.5rem;
}

.tabla table{
	overflow: scroll;
}

.imageContainer a {
  width: 100%;
  display: inline-block;
  position: relative;
}

.imageContainer a:after {
  position: absolute;
  top: 0; left: 0; right: 0; bottom: 0;
  background: rgba(0,0,0,0.5);
  content: 'ï€Ž';
  font-family:'FontAwesome';
  display: flex;
  justify-content: center;
  align-items: center;
  color: white;
  font-size: 10rem;
  opacity: 0;
  transition: opacity .5s;
}

.imageContainer a:hover:after {
  opacity: 1;
}

.imageContainer img {
  max-width: 100%;
  vertical-align: top;
}

.btn{
	background: red;
	color: #fff;
	text-decoration: none;
	padding: .5rem 1rem;
	border-radius: 1.5rem;
	margin-bottom: 1rem;
}

/* Tooltip container */
.tooltip {
    position: relative;
    display: inline-block;
    cursor:pointer;
    -webkit-user-select: none;  /* Chrome all / Safari all */
	-moz-user-select: none;     /* Firefox all */
	-ms-user-select: none;      /* IE 10+ */
	user-select: none;          /* Likely future */  
    
}

/* Tooltip text */
.tooltip .tooltiptext {
	display: none;
    background-color: #fff;
    color: #000;
    text-align: center;
    padding: 10px 10px;
    border-radius: 6px;
    width: 240px;
    top: 120%;
    left: 50%;
    margin-left: -55px;
    position: absolute;
    z-index: 1;
    line-height: 160%;
    border: 1px solid #ccc;
}

/* Larger than mobile */
@media (min-width: 400px) {

	
}

/* Larger than phablet (also point when grid becomes active) */
@media (min-width: 450px) {
	.top{
	padding-top: 50%;
}
	
}

/* Larger than phablet (also point when grid becomes active) */
@media (min-width: 600px) {
	.top{
	padding-top: 50%;
}
	
}

/* Larger than tablet */
@media (min-width: 750px) {
	.container {
    	width: 85%;
    }
    
    .section.header .logo img{
	    height: auto;
    }
    
    .section.header .info{
    	position: absolute;
		right: 0;
		top: 0;
	    line-height: 160%;
    }
    
    .section.header .info span{
	    font-size: 2.0rem;
    }
    
    .section.header .info a{
	    font-size: 1.8rem;
    }
    
    .section.after-fixed{
		margin-top: 12.8rem;
	}
    
    .section.footer ul li:last-child{
	    float: right;
    }
    
    .section.footer ul li{
		display: inline-block;
		margin-right: 1.0rem;
	}
	
	.no-mobile{
		display: block;
	}
	
	.mobile{
		display: none;
	}
	.banner{
	background: url(../img/bg-general.jpg) left top no-repeat;
	background-size: 110% auto;
	}
	.tnx{
	display: block;
	background: rgba(255, 255, 255, 0.9);
	height: 35rem;
	color: #000;
	padding: 1rem;
	
	}
	.banner{
	background: url(../img/bg-general.jpg) left top no-repeat;
	background-size: 100% auto;
	min-height: 450px;
	}
	.top{
	padding-top: 0;
}
#galleria .columns{
	margin-left: 0;
}

#galleria .six.columns{
	width: 50%;
}

#galleria .four.columns{
	width: 33.33%;
}
h2{
	font-size: 3.5rem;
}
h8, h8 a{
	display: block;
	text-transform: uppercase;
	font-weight: bold;
	text-align: left;
	margin-bottom: .5rem;
	color: #59AE33;
	font-size: 1.2rem;
}
h7, h7 a{
    display: -webkit-box;
    text-transform: uppercase;
    font-weight: bold;
    margin-bottom: .3rem;
    font-size: 1.3rem;
    text-align: left;
}	
}

/* Larger than desktop */
@media (min-width: 1000px) {
	.container{
		max-width: 1200px;
	}
}

/* Larger than Desktop HD */
@media (min-width: 1200px) {}