#maskFromVine a:hover{

	background: white;
	box-shadow: black 0px 2px 2px;
} 
#maskFromVine a:hover .image-card__image div{

background: rgba(155, 34, 66, 0.647059);
}
#maskFromVine a .image-card__image div{
	transition:all 1s;
}
#maskFromVine a .image-card__image div span{
	visibility: hidden;
}
#maskFromVine a:hover .image-card__image div span{
	visibility: visible;
}

#maskFromVine a .image-card__image{
	text-align: center;
}#maskFromVine a .image-card__image span{
	margin-top: 25%;
}
#contactForm #center{
	width: 100%;
}
#contactForm #center div{
	display: inline-block;
	width: 45%;
}
#contactForm #center div input{
	width: 100%;
	border-radius: 5px;
	border: 1px solid silver;
	padding: 2%;
}
#contactForm #center label{
	    font-family: 'brandon-grotesque', sans-serif;
    font-style: normal;
    font-weight: 700;
    font-size: 100%;
    line-height: 1.4;
    font-size: 1.15rem;
    color: #656a70;
}
#contactForm #center textarea{
	border-radius: 5px;
	border: 1px solid silver;
	width: 100%;
	padding: 2%;
}
#btnEnviar{
	color: white;
	font-weight: bold;
	background: gray;
	border: 0px;
	padding: 1%;
	border-radius: 5px;
	font-size: 1.15rem;
}
#btnEnviar:hover{
	background: #9b2242;
}
#formFiltroWine select{
	padding: 2%;
	border-radius: 5px;
	width: 100%;
}
.formFiltroWineRow .col-md-3{
	width: 21%;
	display: inline-block;
	height: 400px;
	padding-top-bottom: 2%;
	padding-left:1%;	
	padding-right:1%;	
	margin-left: 4%;
	margin-top: 2%;
	float: left;
	cursor: pointer;
}
.formFiltroWineRow .col-md-3:hover{ 
	border: 0;
	box-shadow:0px 10px 15px black;
}
.formFiltroWineRow .col-md-3 img{
	width: 100%;
	height: auto;
}
#bespokeImage{
	padding-bottom: 5%;
}
#bespokeImage .col-md-3{
	width: 20%;
	margin-left: 3%;
	display: inline-block;
	float: left;
	margin-top: 3%;
	padding-top:3%;
	padding-bottom:3%;
	padding-left: 1%;
	padding-right: 1%;
	border: 1px solid silver;
	cursor: pointer;
}
#bespokeImage .col-md-3 img{
	width: 100%; 
}

#bespokeImage .col-md-3:hover{ 
	border: 0;
	box-shadow:0px 10px 15px black;
}
#GalleryImage{
	padding-bottom: 5%;
}
#GalleryImage .col-md-3{
	width: 20%;
	margin-left: 3%;
	display: inline-block;
	float: left;
	margin-top: 3%;
	padding-top:3%;
	padding-bottom:3%;
	padding-left: 1%;
	padding-right: 1%;
	border: 1px solid silver;
	cursor: pointer;
}
#GalleryImage .col-md-3 img{
	width: 100%; 
}

#GalleryImage .col-md-3:hover{ 
	border: 0;
	box-shadow:0px 10px 15px black;
}

#FirstImgContent{
	margin-top: 100px;
	width: 100%;
	height: 870px;
	background: url(../img/index/BackgroundPrincipal.jpg) no-repeat center center fixed;
	  -webkit-background-size: cover;
	  -moz-background-size: cover;
	  -o-background-size: cover;
	  background-size: cover;
	background-size: cover;
	text-align: center;
	color: white;
	margin-bottom: -43px;
	font-size: 1.7em;
}
#FirstImgContent img{
	width: 100%;
}
#FirstImgContent p{
	height: 300px;
	line-height: 300px;
	font-weight: bold;
}
#FirstImgContent h1{
font-weight: bold;
font-size: 5rem;
}
#FirstImgContent h2{
font-weight: bold;
}
#discover img{
width:50px;
transition:0.51s all;
	text-decoration: none;
}
#discover a{
	color: white;
	cursor: pointer;
	text-decoration: none;
}
#discover:hover img{
	padding-top: 1%;
	text-decoration: none;
}


#FirstImgContentAboutUs{
	margin-top: 100px;
	width: 100%;
	height: 470px;
	background: url(../img/AboutUs/home.jpg) no-repeat center center fixed;
	background-position: 0px -120px;
	  -webkit-background-size: cover;
	  -moz-background-size: cover;
	  -o-background-size: cover;
	  background-size: cover;
	background-size: cover;
	text-align: center;
	color: white;
	font-size: 1.25em;
	font-size: 1.5em;
}
#FirstImgContentAboutUs img{
	width: 100%;
}
#FirstImgContentAboutUs p{
	width: 100%;
	height: 110px;
	line-height: 110px;
}
#FirstImgContentAboutUs h1{
	font-weight: bold;
	font-size: 5rem;
}
#FirstImgContentAboutUs h2{
	font-weight: bold;
	font-size: 2.4rem;
}

#AboutUs{
	font-size: 1.6em;
	padding-top: 5%;
	padding-bottom: 15%;
	text-align: center;
	color: #cccccc;
}
#AboutUs h1{
	color: black;
	font-weight: 700;
}
#AboutUs #first{
	color:#32393d;
	font-size: 1.25em;
	line-height: 1.3;
}
#AboutUs #second{
	color:#32393d;
	font-size: 1.15em;
}
#OurBrands{
	margin-bottom: -45px;
	ackground-repeat: no-repeat;
    background-position: bottom center;
    background-size: cover;
    padding: 2rem 0 4rem;
	background: url(../img/index/barrels.jpg) no-repeat center center;
	  -webkit-background-size: cover;
	  -moz-background-size: cover;
	  -o-background-size: cover;
	  background-size: cover;
	background-size: cover;
	overflow: hidden;
}
#OurBrands div{
	font-size:1.5em;
	display: inline-block;
	width: 50%;
	float: left;
}
#OurBrands #textContent{
	padding: 5%;
}
#OurBrands #img1 img{
	float: right;
	margin-top: 5%;
}
#OurBrands #img2 img{
	float: left;
	margin-top: -25%;
	margin-bottom: 15%;
}
#OurBrands img{
	width: 70%;
}
#OurUniqueMask{
	background-image: linear-gradient(#101820, rgba(16,24,32,0.75));
	padding-top: 10%;
}
#OurUnique{
	margin-bottom: -1px;
	background: url(../img/index/distribution.jpg) no-repeat center center fixed;
	  -webkit-background-size: cover;
	  -moz-background-size: cover;
	  -o-background-size: cover;
	  background-size: cover;
	background-size: cover;
	color: white;
}
#OurUnique .col-md-12{
	text-align: center;
}
#OurUnique .col-md-12 hr{
	width: 3%;
	border: 0px;
	height: 2px;
	background-color: #48525c;
	color: red;
}
#OurUnique .col-md-12 button{
	border: 1px solid white;
	padding: 1%;
}
#OurUnique .col-md-12 button:hover{
	background: white;
}
#OurUnique .col-md-12 button:hover a{
	color: black;
}
#OurUnique .col-md-12 button a{
	color: white;
}
#OurUnique .col-md-6 #number{
	margin-bottom: 12%;
	display: inline-block;
	float: left;
	background: #48525c;
	border-radius: 10px;
	padding: 1%;
	margin-left: 3%;
	margin-top: 5%;
	height: 140px;
	width: 30%;
	text-align: center;
	font-weight: bold;
}
#OurUnique .col-md-6 #number p{
	font-size: 0.8em;
}
#OurUnique .col-md-6 #number h1{
	font-size: 4em;
}

#FromVine{
	overflow: hidden;
	padding-top: 3%;
	padding-bottom: 3%;
	background: url(../img/index/divider-bg.gif) no-repeat center center;
	background-size: 200px 250px;
	background-position: 50% 5%;
	 
}
#FromVine .col-md-4{
	padding: 2%;
	float: left;
}
#FromVineOver{
	background: url(../img/index/wallpaper.jpg) no-repeat center center fixed;
	  -webkit-background-size: cover;
	  -moz-background-size: cover;
	  -o-background-size: cover;
	  background-size: cover;
	background-size: cover;
	
	 
}
#FromVine .col-md-4:hover{
	background: white;
	box-shadow: black 0px 2px 2px;
}

#FromVine .col-md-4:hover{
	background: white;
	box-shadow: black 0px 2px 2px;
}
#FromVine .col-md-4:hover span{
	visibility: visible;
}
.contentIMG{
	text-align: center;
	width: 100%;
	height: 200px;
}

#FromVine .col-md-4:hover .contentIMG div{
	background: rgba(155,34,66,0.65);
}
.contentIMG div{
	transition: 1s all;
}
#img1{
	background-image: url(../img/FromVine/1.png);
	background-size: cover;
}
#img2{
	background-image: url(../img/FromVine/2.png);
	background-size: cover;
}
#img3{
	background-image: url(../img/FromVine/3.png);
	background-size: cover;
}
.contentIMG span{
	visibility: hidden;
	line-height: 200px;
	border: 1px solid #d6d6d6;
	padding: 3%;
	border-radius: 5px;
	font-size: 1.3em;
	color: #d6d6d6;
	cursor: pointer;
}
.contentIMG span:hover{
	background: #d6d6d6;
	color: black;
}
#FromVine h1{
	font-weight: bold;
	font-family: 'minion-pro', serif;
	font-size: 2em;
}
#FromVine .col-md-12{
	font-family: 'minion-pro', serif;
	text-align: center;
	font-size: 1.8em;
	font-weight: bold;
}
#FromVine .col-md-4{
	margin-top: 3%;
	font-size: 1.5em;
}
#FromVine .col-md-4 h2{
	font-weight: bold;
}
#FromVine .col-md-4 img{
	width: 100%;
}
#ExploreOurMask{
	padding-bottom: 5%;
	padding-top: 5%;
	background: rgba(45, 46, 38, 0.7);

}

#ExploreOur{
	margin-bottom: -2px;
	overflow: hidden;
	z-index: 0;
	color: white;
	background: url(../img/index/knowledge.jpg) no-repeat center center fixed;
	  -webkit-background-size: cover;
	  -moz-background-size: cover;
	  -o-background-size: cover;
	  background-size: cover;
	  font-size: 1.5em;
}
#ExploreOur h2{
	text-align: right;
	font-size: 2em;
}
#ExploreOur .col-md-6 button{
	border: 1px solid white;
	padding: 2%;
}
#ExploreOur .col-md-6 button:hover{
	background: white;
}
#ExploreOur .col-md-6 button:hover a{
	color: #635953;
}
#ExploreOur .col-md-6 button a{
	color: white;
}
#Footer{
	padding-top: 5%;
	padding-bottom: 5%;
	background:#101820;
	color: white;
	z-index: 900;
	font-size: 1.5em;
}
.brush{
	background: red;
}
.TopHeader{
	top: 0;
	background: transparent;
	width: 100%;
	position: fixed;
	z-index: 9999;
}
.TopHeaderBack{
	background: white;
}
.header{
	margin-top: 2%;
}
.header #logo img{
	width: 100%;
}
.brush{
background: transparent;}
.header ul{
	list-style: none;
	display: inline-block;
	float: right;
	text-align: right;
	width: 100%;
}
.header ul li{
	list-style: none;
	display: inline-block;
	font-size: 1.1rem;
	font-weight: bold;
	margin-left: 3%;
}
.header ul li input{
	width: 100px;
}
.header ul li a{
	color: gray;
	text-decoration: none;
}
.header #SecondMenu li{
	font-size: 1em;
	margin-left: 3%;
}
.header #SecondMenu li a{
	color: #32393d;
}
.header #SecondMenu li a:hover{
	color: #9b2242;
}
#FirstImgContent{
	margin-top: 100px;
	width: 100%;
	height: 870px;
	background: url(../img/index/BackgroundPrincipal.jpg) no-repeat center center fixed;
	  -webkit-background-size: cover;
	  -moz-background-size: cover;
	  -o-background-size: cover;
	  background-size: cover;
	background-size: cover;
	text-align: center;
	color: white;
	margin-bottom: -43px;
	font-size: 1.7em;
}
#FirstImgContent img{
	width: 100%;
}
#FirstImgContent p{
	height: 300px;
	line-height: 300px;
	font-weight: bold;
}
#FirstImgContent h1{
font-weight: bold;
font-size: 5rem;
}
#FirstImgContent h2{
font-weight: bold;
}
#discover img{
width:50px;
transition:0.51s all;
}
#discover a{
	color: white;
	cursor: pointer;
	text-decoration: none;
}
#discover:hover img{
	padding-top: 1%;
}


#FirstImgContentAboutUs{
	margin-top: 100px;
	width: 100%;
	height: 470px;
	background: url(../img/AboutUs/home.jpg) no-repeat center center fixed;
	background-position: 0px -120px;
	  -webkit-background-size: cover;
	  -moz-background-size: cover;
	  -o-background-size: cover;
	  background-size: cover;
	background-size: cover;
	text-align: center;
	color: white;
	font-size: 1.25em;
	font-size: 1.5em;
}
#FirstImgContentAboutUs img{
	width: 100%;
}
#FirstImgContentAboutUs p{
	width: 100%;
	height: 110px;
	line-height: 110px;
}
#FirstImgContentAboutUs h1{
	font-weight: bold;
	font-size: 5rem;
}
#FirstImgContentAboutUs h2{
	font-weight: bold;
	font-size: 2.4rem;
}

#AboutUs{
	font-size: 1.6em;
	padding-top: 5%;
	padding-bottom: 15%;
	text-align: center;
	color: #cccccc;
}
#AboutUs h1{
	color: black;
	font-weight: 700;
}
#AboutUs #first{
	color:#32393d;
	font-size: 1.25em;
	line-height: 1.3;
}
#AboutUs #second{
	color:#32393d;
	font-size: 1.15em;
}
button{
	background: transparent;
	border-radius: 4px;
	padding: 2%;
	border: 1px solid #9b2242;
	font-family: 'brandon-grotesque';
	font-style: normal;font-weight: 700;
	transtion:all 250ms;
	text-transform: uppercase;
	display: inline-block;
	cursor: pointer;
	white-space: nowrap;
	line-height: 1;
	outline: 0;
	font-weight: bold;
	color: #9b2242;
}
button a{
	color: #9b2242;
	text-decoration: none;
}
button:hover{
	background: #9b2242;
	color: white;
}
button:hover a{
	color: white;
	text-decoration: none;
}
#OurBrands{
	margin-bottom: -45px;
	ackground-repeat: no-repeat;
    background-position: bottom center;
    background-size: cover;
    padding: 2rem 0 4rem;
	background: url(../img/index/barrels.jpg) no-repeat center center;
	  -webkit-background-size: cover;
	  -moz-background-size: cover;
	  -o-background-size: cover;
	  background-size: cover;
	background-size: cover;
	overflow: hidden;
}
#OurBrands div{
	font-size:1.5em;
	display: inline-block;
	width: 50%;
	float: left;
}
#OurBrands #textContent{
	padding: 5%;
}
#OurBrands #img1 img{
	float: right;
	margin-top: 5%;
}
#OurBrands #img2 img{
	float: left;
	margin-top: -25%;
	margin-bottom: 15%;
}
#OurBrands img{
	width: 70%;
}
#OurUniqueMask{
	background-image: linear-gradient(#101820, rgba(16,24,32,0.75));
	padding-top: 10%;
}
#OurUnique{
	margin-bottom: -1px;
	background: url(../img/index/distribution.jpg) no-repeat center center fixed;
	  -webkit-background-size: cover;
	  -moz-background-size: cover;
	  -o-background-size: cover;
	  background-size: cover;
	background-size: cover;
	color: white;
}
#OurUnique .col-md-12{
	text-align: center;
}
#OurUnique .col-md-12 hr{
	width: 3%;
	border: 0px;
	height: 2px;
	background-color: #48525c;
	color: red;
}
#OurUnique .col-md-12 button{
	border: 1px solid white;
	padding: 1%;
}
#OurUnique .col-md-12 button:hover{
	background: white;
}
#OurUnique .col-md-12 button:hover a{
	color: black;
}
#OurUnique .col-md-12 button a{
	color: white;
}
#OurUnique .col-md-6 #number{
	margin-bottom: 12%;
	display: inline-block;
	float: left;
	background: #48525c;
	border-radius: 10px;
	padding: 1%;
	margin-left: 3%;
	margin-top: 5%;
	height: 140px;
	width: 30%;
	text-align: center;
	font-weight: bold;
}
#OurUnique .col-md-6 #number p{
	font-size: 0.8em;
}
#OurUnique .col-md-6 #number h1{
	font-size: 4em;
}

#FromVine{
	overflow: hidden;
	padding-top: 3%;
	padding-bottom: 3%;
	background: url(../img/index/divider-bg.gif) no-repeat center center;
	background-size: 200px 250px;
	background-position: 50% 5%;
	 
}
#FromVine .col-md-4{
	padding: 2%;
	float: left;
}
#FromVineOver{
	background: url(../img/index/wallpaper.jpg) no-repeat center center fixed;
	  -webkit-background-size: cover;
	  -moz-background-size: cover;
	  -o-background-size: cover;
	  background-size: cover;
	background-size: cover;
	
	 
}
#FromVine .col-md-4:hover{
	background: white;
	box-shadow: black 0px 2px 2px;
}

#FromVine .col-md-4:hover{
	background: white;
	box-shadow: black 0px 2px 2px;
}
#FromVine .col-md-4:hover span{
	visibility: visible;
}
.contentIMG{
	text-align: center;
	width: 100%;
	height: 200px;
}

#FromVine .col-md-4:hover .contentIMG div{
	background: rgba(155,34,66,0.65);
}
.contentIMG div{
	transition: 1s all;
}
#img1{
	background-image: url(../img/FromVine/1.png);
	background-size: cover;
}
#img2{
	background-image: url(../img/FromVine/2.png);
	background-size: cover;
}
#img3{
	background-image: url(../img/FromVine/3.png);
	background-size: cover;
}
.contentIMG span{
	visibility: hidden;
	line-height: 200px;
	border: 1px solid #d6d6d6;
	padding: 3%;
	border-radius: 5px;
	font-size: 1.3em;
	color: #d6d6d6;
	cursor: pointer;
}
.contentIMG span:hover{
	background: #d6d6d6;
	color: black;
}
#FromVine h1{
	font-weight: bold;
	font-family: 'minion-pro', serif;
	font-size: 2em;
}
#FromVine .col-md-12{
	font-family: 'minion-pro', serif;
	text-align: center;
	font-size: 1.8em;
	font-weight: bold;
}
#FromVine .col-md-4{
	margin-top: 3%;
	font-size: 1.5em;
}
#FromVine .col-md-4 h2{
	font-weight: bold;
}
#FromVine .col-md-4 img{
	width: 100%;
}
#ExploreOurMask{
	padding-bottom: 5%;
	padding-top: 5%;
	background: rgba(45, 46, 38, 0.7);

}

#ExploreOur{
	margin-bottom: -2px;
	overflow: hidden;
	z-index: 0;
	color: white;
	background: url(../img/index/knowledge.jpg) no-repeat center center fixed;
	  -webkit-background-size: cover;
	  -moz-background-size: cover;
	  -o-background-size: cover;
	  background-size: cover;
	  font-size: 1.5em;
}
#ExploreOur h2{
	text-align: right;
	font-size: 2em;
}
#ExploreOur .col-md-6 button{
	border: 1px solid white;
	padding: 2%;
}
#ExploreOur .col-md-6 button:hover{
	background: white;
}
#ExploreOur .col-md-6 button:hover a{
	color: #635953;
}
#ExploreOur .col-md-6 button a{
	color: white;
}

#Footer{
	padding-top: 5%;
	padding-bottom: 5%;
	background:#101820;
	color: white;
	z-index: 900;
	font-size: 1.5em;
}
#Footer img{
	width: 100%;
}
#Footer .col-md-6 {
	text-align: center;
}
#Footer .col-md-6 ul li{
	display: inline-block;
	list-style: none;
	margin-right: 4.5%;
}
#Footer .col-md-6 ul li a{
	text-decoration: none;
	color: white;
} 
#Footer .col-md-3 ul li{
	display: inline-block;
	list-style: none;
	margin-right: 2%;
}
#Footer .col-md-3 ul li a{
	text-decoration: none;
	color: white;
} 
   .black_overlay{
        display: none;
        position: absolute;
        top: 0%;
        left: 0%;
        width: 2000px;
        height: 100%;
        background-color: black;
        z-index:1001;
        -moz-opacity: 0.8;
        opacity:.80;
        filter: alpha(opacity=80);
    }
    .white_content {
        display: none;
        position: fixed;
        top: 25%;
        left: 25%;
        width: 50%;
        height: 50%;
        padding: 16px;
        border: 16px solid #9b2242;
        background-color: white;
        z-index:1002;
        overflow: auto;
    }

    
   



.box {
  width: 40%;
  margin: 0 auto;
  background: rgba(255,255,255,0.2);
  padding: 35px;
  border: 2px solid #fff;
  border-radius: 20px/50px;
  background-clip: padding-box;
  text-align: center;
}

.overlay {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: rgba(0, 0, 0, 0.7);
  transition: opacity 500ms;
  visibility: hidden;
  opacity: 0;
}
.overlay:target {
  visibility: visible;
  opacity: 1;
}

.popup {
  margin: 10% auto;
  padding: 20px;
  background: #fff;
  border-radius: 5px;
  width: 30%;
  position: relative;
  transition: all 5s ease-in-out;
    height:auto;
}

.popup h2 {
  margin-top: 0;
  color: #333;
  font-family: Tahoma, Arial, sans-serif;
}
.popup .close {
  position: absolute;
  top: 20px;
  right: 30px;
  transition: all 200ms;
  font-size: 30px;
  font-weight: bold;
  text-decoration: none;
  color: #333;
}
.popup .close:hover {
  color: #06D85F;
}
.popup .content {
max-height:100%;
  
}

@media screen and (max-width: 700px){
  .box{
    width: 70%;
  }
  .popup{
    width: 70%;
  }
}