@charset "UTF-8";
/*@import url(reset.css);*/




html, body {
	background: #ffffff;
	margin: 0;
	
	color:#000000;
	text-rendering: optimizeLegibility; 
	-webkit-font-smoothing: antialiased; 
	font-smoothing: antialiased;
}

#wrapper{ 
	position: relative; 
	width: 100%; 
	min-height:100%;	
}

#preload{
	position: absolute; 
	top: -999px; 
	left: -999px; 
	/*width: 106px; 
	height: 106px;*/ 
	overflow: hidden;
}

#lightBoxWrapper{ /*controla a animacao scrool*/
	position: fixed; top: 0; left:0; width: 100%; height: 100%; background: #ffffff; z-index: 1000; opacity:1;
	/*-moz-transition: opacity 1.20s linear; -webkit-transition: opacity 1.2s linear; 
	-o-transition: opacity 1.2s linear; transitions: opacity 1.2s linear; */
}


#center {
	
	width: 1020px;
	height:auto;
	margin-right: auto;
	margin-left: auto;
	/*background: #cccccc;*/
	/*overflow: hidden;*/
}



.vertical-space {
	height: 150px;
	
}

.vertical-space-100 {
	height: 100px;
	
}

.vertical-space-50 {
	height: 50px;
	
}

.vertical-space-produtos {
	height: 185px;
	
}


.clear 
	{	
		clear:both;
		/*height: 65px;*/
			
	}


/**********************  TEXTO  ***********************/
h1
{
	
	font-family: 'Playfair Display', serif; 
	font-size: 50px;
	line-height: 50px;
	font-weight:normal;
	/*text-transform: uppercase;*/
	text-align: center;
	
	
	transition: all .3s linear;
	-webkit-transition: all .3s linear;
	-moz-transition: all .3s linear;
	-o-transition: all .3s linear;
	
}





h2
{
	
	font-family: 'Raleway', Helvetica, Arial, sans-serif; 
	font-size: 16px;
	padding: 20px;
	font-weight: 400;
	line-height: 25px;
	margin-top: 60px;
	margin-bottom: 60px;
	text-align: left;
	
	transition: all .3s linear;
	-webkit-transition: all .3s linear;
	-moz-transition: all .3s linear;
	-o-transition: all .3s linear;
		
}

h3
{
	
	font-family: 'Raleway', Helvetica, Arial, sans-serif; 
	font-size: 25px;
	line-height: 33px;
	font-weight: 400;
	/*text-transform: uppercase;*/
	text-align: center;
	color:#FFF;
	
	transition: all .3s linear;
	-webkit-transition: all .3s linear;
	-moz-transition: all .3s linear;
	-o-transition: all .3s linear;	
}

h4
{
	
	font-family: 'Playfair Display', serif;  
	font-size: 70px;
	line-height: 70px;
	font-weight:normal;
	
	
	/*text-transform: uppercase;*/
	margin-top: 0px;
	margin-bottom: 30px;
	text-align: center;
	color: #FFFFFF;
	

}

h5
{
	
	font-family: 'Playfair Display', serif; 
	font-size: 22px;
	padding: 20px;
	font-weight: 400;
	line-height: 30px;
	margin-top: 60px;
	margin-bottom: 60px;
	text-align:center; 
	color:#99d3da;
	
	transition: all .3s linear;
	-webkit-transition: all .3s linear;
	-moz-transition: all .3s linear;
	-o-transition: all .3s linear;
		
}

p 
{
	
	font-family: 'Raleway', Helvetica, Arial, sans-serif; 
	font-size: 14px;
	padding: 22px;
	font-weight: 400;
	line-height: 20px;
	margin-top: 50px;
	margin-bottom: 50px;
	text-align: left;
	
	
		
}

p a
{
	
	color:#fff;
		
}

/*

.text_container {
  text-align: left;
  width: 1020px;

}
.text_container p {
  cursor: default !important;
  
}
*/

.section{
	 
  width: 1020px;
  height: 60px;
  color: #000;
  cursor: pointer;
  margin-bottom: 3px;
	
}

/*********************** ANIMACAO ***********/

showme, showme1, showme2, showme3, showme4, showme5 {
	opacity: 0;
	margin-top: 30px;
	display: block;
	-moz-transition: all .5s ease;  
	-webkit-transition: all .5s ease;   	
	-o-transition: all .5s ease; 
	transition: all .5s ease;		
}

showme1{

	-moz-transition-delay: .1s; 
	-webkit-transition-delay: .1s;
	-o-transition-delay: .1s; 
	transition-delay: .1s;

}


showme2{
		
	-moz-transition-delay: .5s; 
	-webkit-transition-delay: .5s;
	-o-transition-delay: .5s; 
	transition-delay: .5s;
}

showme3{
		
	-moz-transition-delay: 1s; 
	-webkit-transition-delay: 1s;
	-o-transition-delay: 1s; 
	transition-delay: 1s;
}

showme4{
		
	-moz-transition-delay: 1.5s; 
	-webkit-transition-delay: 1.5s;
	-o-transition-delay: 1.5s; 
	transition-delay: 1.5s;
}

showme5{
		
	-moz-transition-delay: 2s; 
	-webkit-transition-delay: 2s;
	-o-transition-delay: 2s; 
	transition-delay: 2s;
}

.goAnim showme, .goAnim showme1, .goAnim showme2, .goAnim showme3, .goAnim showme4, .goAnim showme5  {

	margin-top: 0; 
	opacity: 1;
}




/**********************  LINHAS e LOGO  ***********************/

hr {

	align: center;
	width: 180px;
	border: solid 1px #000000;
	margin-top:30px;
	margin-bottom:100px;

}

.linha {

	align: center;
	width: 139px;
	border-bottom: dotted 1px #000000;
	margin-top:0px;
	margin-bottom:60px;
	margin-left:auto;
	margin-right:auto;

}

.logo {

	width: 106px;
	float: center;
	margin-left: auto;
    margin-right: auto;
		
	-moz-transition: all .3s ease; 
	-webkit-transition:  all .3s ease; 
	-o-transition:  all .3s ease; 
	-ms-transition: all .3s ease;
	transition:  all .3s ease;
}

.logo img {
		width: 100%;
}


.separador {
	
	width: 1020px;
	height: 80px;
	margin-top:0px;
	text-align: center;
	margin-left:auto;
	margin-right:auto;
	overflow: hidden;
	
}
/*
.rotate45 {		
	-moz-transform: rotate(45deg); 
	-webkit-transform:  rotate(45deg); 
	-o-transform:  rotate(45deg); 
	-ms-transform: rotate(45deg);
	transform:  rotate(45deg);
}

*/



/**********************  MENU  ***********************/

.menu{
	top: -160px;
	position: fixed;
	z-index: 100;
	width: 100%;
	height:160px;
	background-color:transparent;
	-moz-transition: all 1.5s ease; 
	-webkit-transition:  all 1.5s ease; 
	-o-transition:  all 1.5s ease; 
	-ms-transition: all 1.5s ease;
	transition:  all 1.5s ease;
	opacity: 0;
	
}

.menu-center{
	width: 1020px;
	margin: 0 auto;
}

.menu ul li{
	
	font-family: 'Raleway', Helvetica, Arial, sans-serif; 
	font-size: 18px;
	padding: 20px;
	font-weight: 500;
	display: inline;
	/* text-transform: uppercase; */
	text-align: left;
	padding: 0px 40px 0px 0px;
	
}

#last{
	padding-right: 0;
}


.menu ul li a{
	
	text-decoration: none;
	color:#fff;
	
	transition: all .15s linear;
	-webkit-transition: all .15s linear;
	-moz-transition: all .15s linear;
	-o-transition: all .15s linear;
	
}

.font-menu{ /* add class quando scroll aos menus */
	font-size: 14px;

	transition: all .15s linear;
	-webkit-transition: all .15s linear;
	-moz-transition: all .15s linear;
	-o-transition: all .15s linear;
}

.menu ul li a:hover{
	
	/*text-decoration:underline;*/
	color:#99d3da;
	
	
}

.fixed {
	position:fixed;
	top:0px;
	height:160px;
	z-index: 100;
	opacity: 1;
	-webkit-transition:background-color 1s all ease; 
	-webkit-transition: 1s all ease;
	-moz-transition: 1s all ease;
	transition: 1s all ease;
	
}

.cor {
	position:fixed;
	top:-100px;
	background-color: rgba(0, 0, 0, 1);
	z-index: 100;
	opacity: 1;
	-webkit-transition:background-color 1s all ease; 
	-webkit-transition: 1s all ease;
	-moz-transition: 1s all ease;
	transition: 1s all ease;
	/*
	-webkit-box-shadow: 0px 0px 16px rgba(0, 0, 0, 0.5);
	-moz-box-shadow: 0px 0px 16px rgba(0, 0, 0, 0.5);
	box-shadow: 0px 0px 16px rgba(0, 0, 0, 0.5);
	*/
	-moz-transition: all .75s ease; 
	-webkit-transition:  all .75s ease; 
	-o-transition:  all .75s ease; 
	-ms-transition: all .75s ease;
	transition:  all .75s ease;

	
}

.menu coluna {
	width: 42%;
	float: left;
	
	-moz-transition: all .2s ease; 
	-webkit-transition:  all .2s ease; 
	-o-transition:  all .2s ease; 
	-ms-transition: all .2s ease;
	transition:  all .2s ease;

}

.menu coluna-logo {
	width: 16%;
	float: left;
	margin-top: 38px;
	
	-moz-transition: all .2s ease; 
	-webkit-transition:  all .2s ease; 
	-o-transition:  all .2s ease; 
	-ms-transition: all .2s ease;
	transition:  all .2s ease;

}

.logo-menu {
	margin-top: -150px;
	width: 65px;
	
	float: center;
	margin-left: auto;
    margin-right: auto;
	
	-moz-transition: all 1s ease; 
	-webkit-transition:  all 1s ease; 
	-o-transition:  all 1s ease; 
	-ms-transition: all 1s ease;
	transition:  all 1s ease;
}

.logo img {
		width: 100%;
}

.fixo {
	margin-top:50px;
		
	-moz-transition: all 1s ease; 
	-webkit-transition:  all 1s ease; 
	-o-transition:  all 1s ease; 
	-ms-transition: all 1s ease;
	transition:  all 1s ease;
	
}

.apoios-menu {
	
	width: 632px;
	
	float: center;
	margin-left: auto;
    margin-right: auto;
	
	-moz-transition: all 1s ease; 
	-webkit-transition:  all 1s ease; 
	-o-transition:  all 1s ease; 
	-ms-transition: all 1s ease;
	transition:  all 1s ease;
}

.apoios-menu img {
		width: 100%;
}



/**********************  MENU MOBILE  ***********************/


.menu-mobile{
	top: -450px;
	position: fixed;
	z-index: 101;
	width: 100%;
	height:auto;
	
	
}





.menu-mobile ul li{
	
	font-family: 'Raleway', Helvetica, Arial, sans-serif; 
	font-size: 24px;
	font-weight: 500;
	display: block;
	line-height: 50px;
	text-align: right;
	padding: 0px;
	margin-right: 40px;
	
}

.menu-mobile ul li a{
	text-decoration: none;
	color:#fff;
	
}

.menu-mobile ul li a:hover{
	text-decoration: underline;
}

/**********************  FUNDOS  ***********************/

#backimage {
	position: relative; 
	width: 100%;
	min-height:100%;
	
}



.backimage{
	
	background: url(../img/back.jpg); 
	height: 100%;
	min-width: 100%;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	margin:0;
	padding: 0;
	/*background-attachment: fixed;*/
	background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;


}

.backfazemos{
	
	background: url(../img/backfazemos.jpg); 
	height: 400px;
	min-width: 100%;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	margin:0;
	padding: 0;
	/*background-attachment: fixed;*/
	background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;


}
.backimagemap{
	
	background: url(../img/backmap.png)no-repeat center center; 
	height: 300px;
	min-width: 100%;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	margin:0;
	padding: 0;
	background-attachment: fixed;
	/*background-attachment: fixed;*/

}


.cinza{
	
	width: 100%;
	height: auto;
	background-color:#b3ffdc; /* e4ecf9 #77fdef; 09c187 0ecba1 #22d0c3  #7fb2f0  89cbdb */ 
	
}

.blue{
	
	width: 100%;
	height: auto;
	background-color:#a5fdf6; /*#a5fdf6 83fff5 99d3da*/ 
	
}


.red{
	
	width: 100%;
	height: auto;
	background-color:#fb767e; /*#fc847f #ff4949 #f46464 #fb767e*/ 
	overflow:auto;
}

.beije{
	
	width: 100%;
	height: auto;
	background-color:#fff441; /* feea00  #fc847f #ff4949 #f46464*/ 
	overflow:auto;
}

.verde{
	
	width: 100%;
	height: auto;
	background-color:#87fdbc ; /*#5affa1 */ 
	
}


.violeta{
	
	width: 100%;
	height: auto;
	background-color:#e1baff; /*  fd75ff  8b318c  */ 
	
}



.amarelo{
	
	width: 100%;
	height: auto;
	background-color:#feea00;
	
}

.branco{
	
	width: 100%;
	height: auto;
	background-color:#fff;
	
}

.preto{
	
	width: 100%;
	height: auto;
	background-color:#0b0b0b; /* 2d2d2c #262626*/
	
}



/**********************  COLUNAS  ***********************/


.intro 
	{
		width: 700px;
		float: center;
		margin-left: auto;
    	margin-right: auto;
	}


.coluna1 
	{
		width:255px;
		float:left;
		margin-left: auto;
    	margin-right: auto;
		overflow:hidden; /*auto*/
	}

.coluna2 
	{
		width:50%;
		float:left;
		margin-left: auto;
    	margin-right: auto;
		overflow:hidden; /*para nao incluir o overflow tenho de incluir <br> para nivelar as colunas*/
		
}
.coluna3 
	{
		width:340px;
		height:auto;
		float:left;
		color:#000;
		margin-left: auto;
    	margin-right: auto;
		
		
}


/********************** QUEMM SOMOS  ***********************/

#quemsomos {
	
	width: 1020px;
	margin-right: auto;
	margin-left: auto;
	/*background: #cccccc;*/
	
}

/********************** DESTAQUES  ***********************/

#destaques {
	
	width:100%;
	height: auto;
	
}

.box3{
	display: inline-block;
	position:  relative;
	width: 25%;
	float: left;
}

.box3:before{
	content: "";
	display: block;
	padding-top: 100%; /* initial ratio of 1:1*/
}

.box4{
	display: inline-block;
	position:  relative;
	width: 50%;
	float: left;
}

.box4:before{
	content: "";
	display: block;
	padding-top: 50%; /* initial ratio of 2:1*/
}

.box5{
	display: inline-block;
	position:  relative;
	width: 12.5%;
	float: left;
}

.box5:before{
	content: "";
	display: block;
	padding-top: 200%; /* initial ratio of 1:2*/
}

.destaque1{
	position:  absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	background: url(../img/destaques/01_small.jpg)no-repeat center center; 
	height: 100%;
	min-width: 100%;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	
	-moz-transition: all .3s ease; 
	-webkit-transition:  all .3s ease; 
	-o-transition:  all .3s ease; 
	-ms-transition: all .3s ease;
	transition:  all .3s ease;

}

.destaque2{
	position:  absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	background: url(../img/destaques/02_small.jpg)no-repeat center center; 
	height: 100%;
	min-width: 100%;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	
	-moz-transition: all .3s ease; 
	-webkit-transition:  all .3s ease; 
	-o-transition:  all .3s ease; 
	-ms-transition: all .3s ease;
	transition:  all .3s ease;

}

.destaque3{
	position:  absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	background: url(../img/destaques/03_small.jpg)no-repeat center center; 
	height: 100%;
	min-width: 100%;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	
	-moz-transition: all .3s ease; 
	-webkit-transition:  all .3s ease; 
	-o-transition:  all .3s ease; 
	-ms-transition: all .3s ease;
	transition:  all .3s ease;

}

.destaque4{
	position:  absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	background: url(../img/destaques/04_small.jpg)no-repeat center center; 
	height: 100%;
	min-width: 100%;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	
	-moz-transition: all .3s ease; 
	-webkit-transition:  all .3s ease; 
	-o-transition:  all .3s ease; 
	-ms-transition: all .3s ease;
	transition:  all .3s ease;

}

.destaque5{
	position:  absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	background: url(../img/destaques/05_small.jpg)no-repeat center center; 
	height: 100%;
	min-width: 100%;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	
	-moz-transition: all .3s ease; 
	-webkit-transition:  all .3s ease; 
	-o-transition:  all .3s ease; 
	-ms-transition: all .3s ease;
	transition:  all .3s ease;

}

.destaque6{
	position:  absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	background: url(../img/destaques/06_small.jpg)no-repeat center center; 
	height: 100%;
	min-width: 100%;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	
	-moz-transition: all .3s ease; 
	-webkit-transition:  all .3s ease; 
	-o-transition:  all .3s ease; 
	-ms-transition: all .3s ease;
	transition:  all .3s ease;

}

.destaque7{
	position:  absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	background: url(../img/destaques/07_small.jpg)no-repeat center center; 
	height: 100%;
	min-width: 100%;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	
	-moz-transition: all .3s ease; 
	-webkit-transition:  all .3s ease; 
	-o-transition:  all .3s ease; 
	-ms-transition: all .3s ease;
	transition:  all .3s ease;

}

.destaque8{
	position:  absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	background: url(../img/destaques/08_small.jpg)no-repeat center center; 
	height: 100%;
	min-width: 100%;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	
	-moz-transition: all .3s ease; 
	-webkit-transition:  all .3s ease; 
	-o-transition:  all .3s ease; 
	-ms-transition: all .3s ease;
	transition:  all .3s ease;

}

#destaques span{
	width:100.1%;
	height:100.1%;
	background-color:#000;
	top: 0;
	left: 0;
	color:#000;	
	font-weight:bold;
	position:absolute;
	text-align: center;
	display: table;


	
	opacity: 0.75;
		
	-moz-transition: all .3s ease; 
	-webkit-transition:  all .3s ease; 
	-o-transition:  all .3s ease; 
	-ms-transition: all .3s ease;
	transition:  all .3s ease;
}

#destaques span:hover  {
	opacity: 0;
			
}



/**********************  PRODUTOS  ***********************/


#produtos {
	
	width: 1020px;
	margin-right: auto;
	margin-left: auto;
	/*background: #cccccc;*/
	/*overflow: hidden;*/
}

.container {

   position: relative;
   float: left;
   width: 50%;
   padding-top: 50%; /* 1:1 Aspect Ratio - 50% */
   
}

.container2 {

   position: relative;
   float: left;
   width: 33%;
   padding-top: 33%; /* 1:1 Aspect Ratio - 50% */
}



.catalogo 
	{
		width: 500px;
		float: center;
		margin-left: auto;
    	margin-right: auto;
		text-align: center;
	}




pdf a {
	
	font-family: 'Playfair Display', serif; 
	font-size: 30px;
	line-height: 30px;
	font-weight: 400;
	color: #000;
	text-align:center; 
	text-decoration:none;
	background-color: #a5fdf6;		
	/*border: 3px solid black;*/
	
	text-align: center;
	padding: 25px;
	transition: all .4s linear;
	-webkit-transition: all .4s linear;
	-moz-transition: all .4s linear;
	-o-transition: all .4s linear;	

}

pdf a:hover  {
	
	
	color: #fff;
	background-color: #000;
	
	
	transition: all .3s linear;
	-webkit-transition: all .3s linear;
	-moz-transition: all .3s linear;
	-o-transition: all .3s linear;	
	
	z-index:100;

	
}

span, span2, span3, spanvinhos{
	width:50%;
	background-color:transparent;	
	color:#000;	
	font-weight:bold;
	position:absolute;
	text-align: left;
	display: table;

	-moz-transition: all .3s ease; 
	-webkit-transition:  all .3s ease; 
	-o-transition:  all .3s ease; 
	-ms-transition: all .3s ease;
	transition:  all .3s ease;
	

}



span, spanvinhos{
	top:0;
	left:auto;
	
}

span2{
	
	left:auto;
	bottom: 0;
	
}

span3{
	top:70%;
	left:auto;

	
}


span a, span2 a, span3 a, spanvinhos a  {
	
	font-family: 'Playfair Display', serif; 
	font-size: 30px;
	line-height: 30px;
	font-weight: 400;
	text-align:left;
	padding: 15px;
	border: 3px solid black;
	color: #000;
	text-decoration:none;
				
				
	 display:table-cell;
   /* vertical-align:bottom;*/

	transition: all .3s linear;
	-webkit-transition: all .3s linear;
	-moz-transition: all .3s linear;
	-o-transition: all .3s linear;	

	
}

span a, spanvinhos a {
	padding-bottom: 90px;
	
	}
span2 a {
	padding-top: 90px;
	
	}
	
span3 a {
	padding-top: 70px;
	
	}

span:hover, span2:hover, span3:hover, spanvinhos:hover {
	color: #fff;
	background-color: #000;

	-moz-transition: all .3s ease; 
	-webkit-transition:  all .3s ease; 
	-o-transition:  all .3s ease; 
	-ms-transition: all .3s ease;
	transition:  all .3s ease;
	z-index:100;

			
}


span a:hover, span2 a:hover, span3 a:hover, spanvinhos a:hover {
	color: #fff;
	z-index:100;		
}

.wine{
	position:  absolute;
	top: 15%;
	left: 23%;
	bottom: 0;
	right: 0;
	background: url(../img/wine.png)no-repeat left top; 
	height: 95%;
	max-width: 95%;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
}
.wine:hover{
	position:  absolute;
	top: 15%;
	left: 23%;
	bottom: 0;
	right: 0;
	background: url(../img/wine_hover.png)no-repeat left top; 
	height: 95%;
	max-width: 95%;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	

}


.cutlery{
	position:  absolute;
	overflow:hidden;
	top: 5%;
	left: 20%;
	bottom: 0;
	right: 0;
	background: url(../img/cutlery.png)no-repeat left top; 
	height: 75%;
	max-width: 95%;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;

}

.cutlery:hover{
	position:  absolute;
	overflow:hidden;
	top: 5%;
	left: 20%;
	bottom: 0;
	right: 0;
	background: url(../img/cutlery_hover.png)no-repeat left top; 
	height: 75%;
	max-width: 95%;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;

}

.misc {
	position:  absolute;
	overflow:hidden;
	top: 10%;
	left: 35%;
	
	background: url(../img/misc.png)no-repeat center center; 
	height: 100%;
	width: 65%;
	
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;



}

.misc:hover {
	
	
	background: url(../img/misc_hover.png)no-repeat center center; 

	
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;



}



.gourmet {
	position:  absolute;

	top: 35%;
	left: 20%;
	bottom: 0;
	right: 0;
	background: url(../img/gourmet2.png)no-repeat left top; 
	height: 95%;
	width: 95%;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
}

.gourmet:hover {
	position:  absolute;

	top: 35%;
	left: 20%;
	bottom: 0;
	right: 0;
	background: url(../img/gourmet2_hover.png)no-repeat left top; 
	height: 95%;
	width: 95%;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;

}

		

.crystal{
	position:  absolute;
	top: 0%;
	left: 8%;

	background: url(../img/crystal.png)no-repeat center center; 
	height: 95%;
	width: 95%;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;


}

.crystal:hover{
	
	background: url(../img/crystal_hover.png)no-repeat center center; 

	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;


}

/**********************  VIDEO  ***********************/
#video{

	position: relative; 
	width: 856px; /* 100%!important;  */
	height: auto; /*auto !important;*/
	margin: 0 auto;
	/* background: #cccccc; */
	
}



/**********************  NEWS  ***********************/

#news {
	
	width: 1020px;
	margin-right: auto;
	margin-left: auto;
	/*background: #cccccc;*/
	/*overflow: hidden;*/
}

#news img {
	
	width: 100%;
	margin-top: 30px;
	padding: 20px;
}




/**********************  CONTACTOS  ***********************/

#contactos{
	
	width: 1020px;/*100%*/
	margin-right: auto;
	margin-left: auto;
	/*background: #cccccc;*/
	/*overflow: hidden;*/
	/*border-bottom: solid 4px #ffffff;*/
}


/********************** MAPA GOOGLE ***********************/

#mapa{
	
	width: 100%;
	height: 470px;
	margin-right: auto;
	margin-left: auto;
}

#map_canvas {
        width: 100%;
        height: 320px;
		background-color:#83fff5;

}

/**********************  COMPROMISSO  ***********************/


#compromisso {
	
	width: 1020px;
	margin-right: auto;
	margin-left: auto;
	
}



/**********************  RESPONSABILIDADE  ***********************/


#responsabilidade {
	
	width: 1020px;
	margin-right: auto;
	margin-left: auto;
	
}


/********************** PARCEIROS ***********************/


#parceiros {
    width: 1020px;
	margin-right: auto;
	margin-left: auto;	

}

#parceiros  img{
    width: 100%;
}


/**********************  NOTA RODAPE  ***********************/


#nota {
	
	width: 100%;
	height: auto;
	/* background: #f26346; /*  83fff5 */ 
	text-align: center;
	
	
}



/**********************  RODAPE  ***********************/


#rodape {
	
	width: 700px;
	height: 300px;
	
	margin-right: auto;
	margin-left: auto;
	
	
	
	
}

#rodape a {
	text-decoration:none;				
}


#rodape img {
	text-decoration:none;				
	opacity: 0.65;
	
}

#rodape img:hover {
	opacity: 1;
	
}

/**********************  MOBILE  ***********************/

@media only screen and (max-device-width: 1024px) {
    .backimage, .backfazemos {
        background-attachment: scroll;
    }
}

@media (max-width: 1020px) {

	
	.menu-center{
		width: 100%;
	}
	#center 
	{
		width: 100%;
	}
	#quemsomos 
	{
		width: 100%;
	}
	
	#produtos
	{
		width: 100%;
		
	}
	
	#news
	{
		width: 100%;
	}
	
	#news img {
	
		margin-top: 0px;
	
	}
	
	#contactos {
		width: 100%;
	}
	
	.coluna1 
	{
		width:25%;
		
	}
	
	barra{
	position: relative;
	width: 100%;
	height: auto;
	float: left;
	margin-top: 0px;
	margin-left: 0px;
	
	-moz-transition: all .3s ease; 
	-webkit-transition:  all .3s ease; 
	-o-transition:  all .3s ease; 
	-ms-transition: all .3s ease;
	transition:  all .3s ease;
	}
	
	#compromisso {
		width: 100%;
	}
	
	#responsabilidade {
		width: 100%;
	}
	
	#rodape {
		width: 100%;
	}
	
	.backimage
	{
		width: 100%;
	}

	
	p {
		margin-top: 30px;
		margin-bottom: 30px;
	}

	.intro {
		width:100%;
	}
	
	 {
		padding: 20px;
	}

	h4 {
		font-size: 50px;
		line-height: 50px;
	}
	.logo {
		width:90px;
	}

	hr {
	width: 140px;
	margin-bottom: 70px;
	}

	.separador {
	width: 100%;
	}
	
}

@media (max-width: 800px) {
	
		.wine {
	
	top: 20%;
	left: 30%;
	height: 75%;
	width: 70%;
}

.crystal {
	
	top: 12%;
	left: 40%;
	height: 80%;
	width: 79%;
}

.gourmet {
	
	top: 25%;
	left: 40%;
	height: 80%;
	width: 80%;
}

.cutlery  {
	
	top: 25%;
	left: 20%
	height: 100%;
	width: 80%;
}



	
	.container, .container2 {

   position: relative;
   float: center;
   width: 80%;
   padding-top: 80%; /* 1:1 Aspect Ratio */
   margin-bottom:40px;
}´







span, span2, span3, spanvinhos {
	left: 20px;
	top: 0;
	

}

span2 a, span3 a {
	padding-top: 15px;
	padding-bottom: 90px;
	
}
	

	.menu {
	
	top:-260px;
	

	}

	.menu-mobile{
	top: -270px;
	position: fixed;
	-moz-transition: all .3s ease; 
	-webkit-transition:  all .3s ease; 
	-o-transition:  all .3s ease; 
	-ms-transition: all .3s ease;
	transition:  all .3s ease;
	}

	.hide-menu-mobile {
	top: -270px;
	position: fixed;
	-moz-transition: all .3s ease; 
	-webkit-transition:  all .3s ease; 
	-o-transition:  all .3s ease; 
	-ms-transition: all .3s ease;
	transition:  all .3s ease;
	}

	.complete-hide-menu-mobile {
	top: -350px;
	position: fixed;
	-moz-transition: all .3s ease; 
	-webkit-transition:  all .3s ease; 
	-o-transition:  all .3s ease; 
	-ms-transition: all .3s ease;
	transition:  all .3s ease;
	}


	.show-menu-mobile {
	top: 0px;
	position: fixed;
	background-color:#000;
	-moz-transition: all .3s ease; 
	-webkit-transition:  all .3s ease; 
	-o-transition:  all .3s ease; 
	-ms-transition: all .3s ease;
	transition:  all .3s ease;
	}
.coluna2 
	{
		width:100%;
		
		
	}

	.coluna3 
	{
		width:100%;
		
		float:center;
	}
.vertical-space-produtos {
	height: 65px;
	
}

	.catalogo {
	width: 100%;
	

}
pdf a  {
	
	
	font-size: 20px;
	line-height: 60px;


}
#video{

	width: 100%; 

	
}

}




@media (max-width: 500px) {
.wine {
	
	top: 20%;
	left: 45%;
	height: 80%;
	width: 79%;
}
	.crystal {
	
	top: 27%;
	left: 45%;
	height: 80%;
	width: 79%;
}

.gourmet {
	
	top: 42%;
	left: 45%;
	height: 90%;
	width: 80%;
}

.cutlery  {
	
	top: 45%;
	left: 20%
	height: 100%;
	width: 80%;
}
	
	

	

	
	.coluna1  {
		width:100%;
		float:center;
	}
	h1 {
		font-size: 40px;
		line-height: 45px;
		padding: 20px;
	}
	h2 {
		font-size: 14px;
		line-height: 22px;
		margin-top: 30px;
		margin-bottom: 30px;
		padding: 20px;
	}
	h3 {
		font-size: 22px;
		line-height: 24px;
		padding: 20px;
	}
	h4 {
		font-size: 40px;
		line-height: 40px;
		padding: 20px;
	}
	p {
		font-size: 14px;
		margin-top: 30px;
		margin-bottom: 30px;
		text-align: center;
		padding: 20px;
	}

	

}





