/* CSS Document */

/* theopenhouse
   concept & realized: Stormadv creativelab
   
   © 2014 Stormadv creativelab

 */
 
/* ###### FONT ###### */

@font-face {
    font-family: 'gardenscregular';
    src: url('../font/gardensc/gardensc_03_1-webfont.eot');
    src: url('../font/gardensc/gardensc_03_1-webfont.eot?#iefix') format('embedded-opentype'),
         url('../font/gardensc/gardensc_03_1-webfont.woff2') format('woff2'),
         url('../font/gardensc/gardensc_03_1-webfont.woff') format('woff'),
         url('../font/gardensc/gardensc_03_1-webfont.ttf') format('truetype'),
         url('../font/gardensc/gardensc_03_1-webfont.svg#gardenscregular') format('svg');
    font-weight: normal;
    font-style: normal;

}

/* ###### regole generiche ###### */

input{width:297px;
	  height:17px;
	  border:0;
	  background:rgba(255,255,255,0.6);
	  padding:3px;
	  font-family: 'gardenscregular';
	  }
	 
::-webkit-input-placeholder {
   font-family: 'gardenscregular';
   color: #333;
}

:-moz-placeholder { /* Firefox 18- */
   font-family: 'gardenscregular';  
}

::-moz-placeholder {  /* Firefox 19+ */
   font-family: 'gardenscregular'; 
}

:-ms-input-placeholder {  
   font-family: 'gardenscregular';  
}

input:focus::-webkit-input-placeholder { color:transparent; }
input:focus:-moz-placeholder { color:transparent; } /* FF 4-18 */
input:focus::-moz-placeholder { color:transparent; } /* FF 19+ */
input:focus:-ms-input-placeholder { color:transparent; } /* IE 10+ */

textarea:focus::-webkit-input-placeholder { color:transparent;  }
textarea:focus:-moz-placeholder { color:transparent;  } /* FF 4-18 */
textarea:focus::-moz-placeholder { color:transparent;  } /* FF 19+ */
textarea:focus:-ms-input-placeholder { color:transparent;  } /* IE 10+ */



/* ###### struttura ###### */
.logo{
	width:160px;
	height:230px;
	position:absolute;
	top:0px;
	left:50px;
	background: rgba(255,255,255,0.7) url(../img/logo.png) no-repeat -1px 35px;
	z-index:99;

	}
	
.cont-master{
	width: auto;
	height:750px;
	position:relative;
	
	}



/* ###### MENU' ###### */

.cont-menu{
	width:100%;
	height:100px;
	position:relative;
	margin-bottom:20px;
	background-color:rgba(0,0,0,0.8);
	z-index:998;
	}
	
.cont-logo-menu{
	width:80px;
	height:100px;
	position:absolute;
	right:0px;
	background: url(../img/log-menu.png) no-repeat;
	z-index:999;
	}
	
.line-logo-menu{
	width:6px;
	height:2000px;
	position:absolute;
	bottom:100px;
	right:33px;
	background-color:rgba(0,0,0,0.7);
	z-index:5;
	}
	
/* ###### SOCIAL ###### */

.cont-social{
	width:130px;
	height:30px;
	position:absolute;
	right:60px;
	top:0px;
	z-index:10;
	}
	
.list-soc{
	list-style:none;
	display: inline;
	top:0px;
		
	
	}
	
.soc-f{
	width:30px;
	height:30px;
	position: relative;
	float:left;
	background: url(../img/soc-f.png) no-repeat;
	z-index:1;
	transition:all 0.4s ease-out;
	-ms-transition:all 0.4s ease-out;
	-moz-transition:all 0.4s ease-out;
	-webkit-transition:all 0.4s ease-out;
	opacity:1;
	cursor:pointer;

	}
	
.soc-f:hover{opacity:0.5;}

.soc-t{
	width:30px;
	height:30px;
	position: relative;
	float:left;
	margin-left:2px;
	background: url(../img/soc-t.png) no-repeat;
	z-index:1;
	transition:all 0.4s ease-out;
	-ms-transition:all 0.4s ease-out;
	-moz-transition:all 0.4s ease-out;
	-webkit-transition:all 0.4s ease-out;
	opacity:1;
	cursor:pointer;

	}
	
.soc-t:hover{opacity:0.5;}

.soc-in{
	width:30px;
	height:30px;
	position: relative;
	float:left;
	background: url(../img/soc-in.png) no-repeat;
	z-index:1;
	transition:all 0.4s ease-out;
	-ms-transition:all 0.4s ease-out;
	-moz-transition:all 0.4s ease-out;
	-webkit-transition:all 0.4s ease-out;
	opacity:1;
	cursor:pointer;

	}
.soc-in:hover{opacity:0.5;}
	
.soc-y{
	width:30px;
	height:30px;
	position:absolute;
	background: url(../img/soc-y.png) no-repeat;
	z-index:1;
	transition:all 0.4s ease-out;
	-ms-transition:all 0.4s ease-out;
	-moz-transition:all 0.4s ease-out;
	-webkit-transition:all 0.4s ease-out;
	opacity:1;
	cursor:pointer;

	}
.soc-y:hover{opacity:0.5;}

/* ###### COMPANY PROFILE ###### */


.box-master{
	width:750px;
	height:400px;
	position:absolute;
	top:290px;
	left:150px;
	background:rgba(0,0,0,0.8);
	
    }

.img-cp{
	width:300px;
	height:300px;
	position:absolute;
	top:50px;
	left:70px;
    }
	

.box-text-cp{
	width:300px;
	height:300px;
	position:absolute;
	top:50px;
	left:380px;
	color:#FFF;

    }

.text-cp{	
	font-size:12px;
	text-align:justify;
	color:#FFF;
	padding:0px;
	margin:0;
	
	
    }
	
	

/* ###### SHOWROOM ###### */


.box-master-sr{
	width:800px;
	height:450px;
	position:absolute;
	bottom:170px;
	margin-left:50px;
	background:rgba(0,0,0,0.8);
	
    }
	
.g-th{
	width:250px;
	height:250px;
	position:relative;
	background:red;
	float:left;
	margin:10px;
	cursor:pointer;
	opacity:1;
	transition:all 0.4s ease-in;
	-ms-transition:all 0.4s ease-in;
	-moz-transition:all 0.4s ease-in;
	-webkit-transition:all 0.4s ease-in;
	
    }
	
.g-th:hover{opacity:0.5;}

.fr-left{
	width:50px;
	height:100px;
	position:absolute;
	top:370px;
	left:260px;
	background:url(../img/arrow-left.png) no-repeat;
	cursor:pointer;
	opacity:1;
	transition:all 0.4s ease-in;
	-ms-transition:all 0.4s ease-in;
	-moz-transition:all 0.4s ease-in;
	-webkit-transition:all 0.4s ease-in;
    }
.fr-left:hover{ opacity:0.5; background:rgba(255,255,255,0.5) url(../img/arrow-left.png) no-repeat}

.fr-right{
	width:50px;
	height:100px;
	position:absolute;
	top:370px;
	right:325px;
	background: url(../img/arrow-right.png) no-repeat;
	cursor:pointer;
	opacity:1;
	transition:all 0.4s ease-in;
	-ms-transition:all 0.4s ease-in;
	-moz-transition:all 0.4s ease-in;
	-webkit-transition:all 0.4s ease-in;
	
    }
	
.fr-right:hover{ opacity:0.5; background:rgba(255,255,255,0.5) url(../img/arrow-right.png) no-repeat}

.box-thumb{
	width:810px;
	height:540px;
	position:absolute;
	
}


/* ###### BRANDS ###### */

.box-master-br{
	width:810px;
	height:510px;
	position:absolute;
	bottom:80px;
	margin-left:250px;
	overflow:hidden;
	background:rgba(0,0,0,0.8);
	
    }
	

.box-br-total{
	width:810px;
	height:510px;
	background:green;
	
    }
	
.box-br{
	width:150px;
	height:150px;
	position:relative;
	float:left;
	margin-left:10px;
	margin-top:10px;
	background:transparent;
	cursor:pointer;
	opacity:1;
	transition:opacity 0.4s ease-out;
	-ms-transition:opacity 0.4s ease-out;
	-moz-transition:opacity 0.4s ease-out;
	-webkit-transition:opacity 0.4s ease-out;
	
    }
.box-br:hover{opacity:0.5;}

.box-br-pul{
	width:150px;
	height:150px;
	position: absolute;

	left:320px;
	top:220px;
	background: #FFF;
	opacity:1;
	z-index:98
	
    }
	

/* ###### CONTATTI ###### */

.box-master-con{
	width:750px;
	height:400px;
	position:absolute;
	top:290px;
	left:150px;
	background:rgba(0,0,0,0.8);
}
.map{
	width:300px;
	height:300px;
	position:absolute;
	top:50px;
	left:70px;
}
.box-text-con {
	width:300px;
	height:auto;
	position:absolute;
	top:255px;
	left:380px;
	color:#FFF;
}
.text-con {	
	font-size:14px;
	text-align:justify;
	color:#FFF;
	padding:0px;
	margin:0;
}
.box-form-con {
	width:300px;
	height:170px;
	position:absolute;
	top:50px;
	left:380px;
}

.input-nome, .controls.nome { position:absolute; top:0px; }
.input-mail, .controls.mail { position:absolute; top:27px; }
.input-text, .controls.msg	{ position:absolute; top:54px; }
.input-text, .controls.msg textarea { 
	width:292px;
	height:70px; 
    resize:none;
	background:rgba(255,255,255,0.6);
	border:1px solid transparent;
	padding:3px; 
    font-family: 'gardenscregular'; 
	font-size:12px;
}
.controls input { 
	border:1px solid transparent;
	width: 292px;
}
.controls span.help-block.error { 
	width: 150px;
	display: block;
	position: absolute;
	top: 1px;
	right: 1px;
	padding: 3px;
	color: #fff;
	z-index: 9999;
	font-size: 11px;
	text-align: right;
}


.controls input.error, .controls textarea.error { 
	border: 1px solid red;
}
.message { 
	position: absolute;
	top: 170px;
	left: 0;
	width: 300px;
	color: #fff;
}
.message .success { background-color: green; padding: 3px; }
.message .error { background-color: red; padding: 3px; }

.btn-form{
	width:80px;
	height:25px;
	position:absolute;
	top:136px;
	right:0px;
	border:1px solid #FFF;
	cursor:pointer;
	opacity:1;
	transition:opacity 0.3s ease-in;
	-moz-transition:opacity 0.3s ease-in;
	-webkit-transition:opacity 0.3s ease-in;
	-ms-transition:opacity 0.3s ease-in;
	text-transform: uppercase;
}
.btn-form:hover{ opacity:0.6;}