@charset "utf-8";
/* CSS Document */

article, section, aside, hgroup, nav,  header, footer, figure, figcaption {display: block;}


* {padding: 0; margin: 0; border: 0; text-decoration: none;}
object, embed, a {outline:0 }
ul{list-style:none;}

		/*** The essential CSS for the layout ***/
		html, body { margin: 0pt;}
		
body,td,th,p,div { color:#444444; font-family: 'Montserrat', sans-serif;}
body { background:#fff; }
h1, h2, h3, h4, h5 {font-family: 'Montserrat', sans-serif;}
p { font-size:14px;}



#container a:hover, #container a:focus, #container a.active {  text-decoration:none}
.clear { clear:both}
.float-r { float:right}
.float-l { float:left}

#container { width:100%; margin:0 auto; overflow:hidden}
header { position: fixed; z-index:99999; width:100%; height:200px;
-webkit-transition: height 0.3s;
    -moz-transition: height 0.3s;
    transition: height 0.3s;}
header #logo { padding-top:15px}
header #logo img { width:180px; -webkit-transition: width 0.3s; -moz-transition: width 0.3s; transition: width 0.3s;}
/*header #bgheader {background: url(../imagenes/bg-header2.png) repeat-x;   width:100%; height:300px; position:absolute; top:0; left:0; z-index:0;
-webkit-transition: opacity 0.3s;
    -moz-transition: opacity 0.3s;
    transition: opacity 0.3s;}*/
header.active #bgheader 
{ width:100%; height:200px; position: absolute; top:0; left:0; z-index:0;
-webkit-transition: opacity 0.3s;
    -moz-transition: opacity 0.3s;
    transition: opacity 0.3s;	
background: -moz-linear-gradient(top, rgba(0,0,0,0.60) 0%, rgba(0,0,0,0) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, rgba(0,0,0,0.60) 0%,rgba(0,0,0,0) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, rgba(0,0,0,0.60) 0%,rgba(0,0,0,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a6000000', endColorstr='#00000000',GradientType=0 ); /* IE6-9 */}
	
header.active {  height:60px;}
header.active #logo { padding-top:10px} 
header.active #logo img { width:150px }
header.active #bgheader {opacity:1; background:#389779; height:80px; z-index:9999}
header .row { margin-bottom:0}
header nav, header #logo { z-index:99991; position:relative}
header.active nav { margin-top:22px}

.wrap { max-width:1200px; margin:0 auto;}
.wrap2 { max-width:900px; margin:0 auto;}

.shad {-webkit-box-shadow: 0 3px 5px 0 rgba(0,0,0,0.3);
box-shadow: 0 3px 5px 0 rgba(0,0,0,0.3);}
.shad2 {-webkit-box-shadow: 0 6px 5px 0 rgba(0,0,0,0.3);
box-shadow: 0 6px 5px 0 rgba(0,0,0,0.3);}

.grad {/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#000000+0,000000+100&0.65+0,0+100;Neutral+Density */
background: -moz-linear-gradient(top,  rgba(0,0,0,0.60) 0%, rgba(0,0,0,0) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(0,0,0,0.60) 0%,rgba(0,0,0,0) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(0,0,0,0.60) 0%,rgba(0,0,0,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a6000000', endColorstr='#00000000',GradientType=0 ); /* IE6-9 */
    width: 100%; height: 600px; position: absolute; z-index: 999;
}



nav { margin-top:22px }
nav ul { text-align:right; }
nav ul li { display: inline-block;   position:relative; height:30px; margin:0 1%; text-transform:uppercase; font-weight:500;}
nav ul li:last-child {margin-right: 0}
nav ul li a { color:#fff; text-decoration:none; display:block; line-height:25px; font-size:14px;  padding:5px; }
nav ul li a:hover {color:#63C5A5}
nav ul li.serv a:hover, nav ul li.serv a.active { color:#fff; background-color: #444536; -webkit-border-radius: 10px 10px 0 0;
border-radius: 10px 10px 0 0;}

#menresp { position: absolute; left: 0px; top: 20px; margin: 0; width: 100%; padding-left: 5%; background: #389779}
a.open-menu {color: #fff;font-size: 32px; display: block}
#menresp ul {background: #389779; width: 100%; text-align: left; margin-top: 40px}



#banimg { position:relative; z-index:0  }
#slider { margin:0 auto;}
#slider img { width:100%}
#slider .item { position:relative; cursor:pointer}
#slider .capt { position:absolute;  top:40%; background:none; text-align:center; width: 100%;  z-index: 9991}
#slider .capt h4 { color:#FFF; font-size:45px; display:block; margin:10px 0; font-weight: 600 }
#slider .capt h5 { color:#fff;  font-size:24px; display:block; margin:10px 0 0; font-weight: 400 }

#sliderN { margin:0 auto;}
#sliderN img { width:100%}
#sliderN .item { position:relative; cursor:pointer}
#sliderN .capt { position:absolute;  top:40%; background:none; text-align:center; width: 100%;  z-index: 9991}
#sliderN .capt h4 { color:#FFF; font-size:40px; display:block; margin:10px 0; font-weight: 600 }
#sliderN .capt h5 { color:#fff;  font-size:30px; display:block; margin:10px 0 0; font-weight: 300 }


#owl-demo1 { position:relative}
#owl-demo1 .owl-nav { top:45%; position:absolute; color:#fff; text-indent:-99999px; width:100%}
.owl-prev{ left:1%; bottom:7%; position:absolute; color:#fff; font-size:0;  transform: rotate(180deg);}
/*.owl-prev:before { content:"\f104"; font-family:fontawesome; color:#000; font-size:20px}*/
.owl-prev:before { content: url("../images/arrow1.png"); filter: invert(100%); }
.owl-next{ right:1%; bottom:7%; position:absolute; color:#fff; font-size:0; text-align:right }
.owl-next:before {content: url("../images/arrow1.png"); filter: invert(100%);}
#owl-demo1 .item { position:relative; width:100%}


.owl-dots { position:absolute; z-index:999999999999; bottom:1%; text-align:center; width:100%;}
.owl-dot { display:inline-block; margin:0 5px; color:#333}
.owl-dot:before { content:"\f111"; font-family:fontawesome; font-size:18px}
.owl-dot.active:before { content:"\f111"; color: #fff; font-family:fontawesome; font-size:20px }

#quienes {text-align: center}
h2 {font-weight: 300}
p {font-weight: 300}
hr.lin1 {background: #000; max-width: 180px; display: block; border: none; height: 2px; margin: 40px auto}
hr.lin2 {background: #000; max-width: 150px; display: block; border: none; height: 2px; margin: 40px auto}
hr.lin3 {background: #000; max-width: 150%; display: block; border: none; height: 1px; margin: 2px auto}
body .mt-5 {margin-top: 100px !important} 
body .mb-5 {margin-bottom: 100px !important} 
body .mt-4 {margin-top: 60px !important} 
body .mb-4 {margin-bottom: 60px !important} 
body .mt-3 {margin-top: 30px !important} 
body .mb-3 {margin-bottom: 30px !important} 
.pad5 {padding: 3%}
.container-2 {max-width: 800px; margin: 0 auto}
body a {color: #000}
body a:hover {color: #000}
.c-block {margin: 0 auto}

.bx1 { max-width: 900px; margin: 0 auto; position: relative; overflow: hidden; -webkit-box-shadow: 0 3px 5px 0 rgba(0,0,0,0.2); box-shadow: 0 3px 5px 0 rgba(0,0,0,0.2);}
.bx1 .cont1 {background: #f3f3f3; position: absolute; top: 0; left: 0; width: 50%; height: 100%; padding: 5%}
.bx1 .cont1 h4 {margin: 30px 0 0}
.bx1 .boxtit {position: absolute; right: 0; bottom: 20px}
.boxtit {background: #f3f3f3; padding: 5px 20px; display: inline-block; text-transform: uppercase;}
.boxtit a {color: #000}
.boxtit:hover {background: #333; color: #fff}
.boxtit:hover a {color: #fff}
.bx2 {height: 250px; overflow: hidden}
#n-fincas .boxtit {margin: 0 auto; position: relative; top: -20px; display: block; max-width: 200px; text-align: center; }
#n-vinos .boxtit {position: absolute; bottom: 20px; right: 15px}

#contacto {padding: 60px 0}
#contacto  .wrap {background: #f3f3f3; max-width: 1000px}
#contacto .cont2 {text-align: center; padding: 5%}
#contacto .cont2 h4 {text-transform: uppercase}
#contacto input { margin: 10px 0}
#contacto .pict {width: 100%; height: 100%; overflow: hidden; position: relative}
#contacto .pict img {height: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%)}
button.enviar {background: #e7e7e7; padding: 10px 60px; margin: 20px auto; display: inline-block}
button.enviar:hover {background: #333; color: #fff}
.copy {text-align: center; color: #ededed; margin: 30px 0; font-size: 12px}

.shad {-webkit-box-shadow: 0 3px 5px 0 rgba(0,0,0,0.2);
box-shadow: 0 3px 5px 0 rgba(0,0,0,0.2);}

footer { padding:10px 0 5px; margin:0; background:#389779; color:#fff }
body footer a {color: #fff}
body footer a:hover {color: #fff}
body .copy a {color: #fff}
/*#wap {position: fixed; font-size: 50px; bottom: 40px; right: 20px }*/
.watsappbutton {position:fixed; bottom:5%; right:2%; background-color:#707070; width: 60px;height: 60px;border-radius: 50%;z-index: 99999;}
hr.lin3 {background: #fff; max-width: 100%; display: block; border: none; height: 1px; margin: 2px auto}

#pop {text-align: center}
#pop #logomod img {width: 150px; display: block; margin: 20px auto}
#pop h2 {text-transform: uppercase; margin: 30px 0; font-weight: 300}
#pop h4 {text-transform: uppercase; font-size: 20px; font-weight: 300;}
#pop .boxtit {display: inline-block; margin: 20px; width: 100% ; max-width: 150px}
#pop #si {float: right}
#pop #no {float: left}

#slider.noslide .owl-controls {display: none}
#slider.noslide .capt h5 {font-weight: 300; margin-top: 60px}
.conoce {text-transform: uppercase; margin: 20px 0; display: block}
.inst .p-5 p { max-width: 500px; margin: 0 auto; display: block; line-height: 170%}
.inst .p-5 .conoce { max-width: 500px; margin: 0 auto; display: block; }

#topfincas {position: relative; z-index: 9999}
#topfincas .nav-tabs {text-align: center; display: block !important; }
#topfincas .nav-tabs li {display: inline-block; width: auto; margin: 0 2%; vertical-align: top}
#topfincas .nav-tabs li a {display: block;text-transform: uppercase; font-weight: 700;  padding: 20px 0}
#topfincas .nav-tabs li a.active {border-bottom: 3px solid #000000}
#topfincas .boxpad {padding-bottom: 20px}
#topfincas .boxpad:nth-child(3) {padding-bottom: 0} 
.pictmask {width: 100%; height: 100%; overflow: hidden}
#topfincas .pictmask img {height: auto}
.text-underline {text-decoration: underline; font-weight: 400}
.text-bold-underline {text-decoration: underline; font-weight: 600}


@media (max-width: 600px) {
    
    .wrap {padding: 5%}
    .bx1 {background: #f3f3f3; padding-bottom: 40px}
    .bx1 .cont1 {position: relative; width: 100%; height: auto}
    .boxtit {background: #e7e7e7;}
    .bx1 .boxtit {position: relative; bottom: inherit; right: inherit;  padding: 20px 40px}
    #n-fincas .boxtit { top: -20px}
    .bx2 {height: 200px}
    #n-vinos .brand {width: 100%}
    #contacto .pict img {position: relative; width: 100%; height: auto}
    footer nav ul {text-align: left}


body .mt-5 {margin-top: 20px !important} 
body .mb-5 {margin-bottom: 20px !important} 
body .mt-4 {margin-top: 30px !important} 
body .mb-4 {margin-bottom: 30px !important} 
body .mt-3 {margin-top: 15px !important} 
body .mb-3 {margin-bottom: 15px !important} 

nav ul li.nav-item { margin:3px 0}
nav ul li { display:block; color:#fff; padding:0; height:auto !important; margin:3px 0}
nav ul li:hover ul { display: inherit}
nav ul li ul { position:relative; background:none; padding:3px; top:0; left:0; display:none}
nav ul li ul li { }
header { position: relative; background:#389779; height:auto !important }
#logo { text-align:left; margin:0 0 0 90px; padding: 0 !important;}
#slider .capt { top:20%; text-align:center}
#slider .capt h4 { font-size:36px}
.row-eq-height {display: block !important; height: inherit}
    #slider .owl-nav {display: none}
    .pictmask {margin-bottom: 20px}

#n-vinos .boxtit {
    position: relative;
    bottom: inherit;
    right: inherit;
    padding: 20px;
    text-align: center;
    max-width: 300px;
    margin: 0 auto;    

}
    



@-webkit-keyframes fadein { 
    from {
        opacity:0;
    }
    to {
        opacity:1;
    }
}


.gutter-40.row {
  margin-right: -15px;
  margin-left: -15px;
}
.gutter-40 > [class^="col-"], .gutter-40 > [class^=" col-"] {
  padding-right: 15px;
  padding-left: 15px;
}
.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } 
.embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

.jumbotron {
    color: inherit;
    background-color: #000;
    height: 100%;
    overflow: hidden;
    position: relative;}
video {
    position: absolute;
    top: -25px;
    left: 0;
    width: auto;
    height: 115%;
}

