/* Custom Fonts */

@font-face {
    font-family: 'GothamThin';
    src: url('../fonts/GothamThin.eot');
    src: url('../fonts/GothamThin.eot') format('embedded-opentype'),
         url('../fonts/GothamThin.woff2') format('woff2'),
         url('../fonts/GothamThin.woff') format('woff'),
         url('../fonts/GothamThin.ttf') format('truetype'),
         url('../fonts/GothamThin.svg#GothamThin') format('svg');
}

@font-face {
    font-family: 'GothamLight';
    src: url('../fonts/GothamLight.eot');
    src: url('../fonts/GothamLight.eot') format('embedded-opentype'),
         url('../fonts/GothamLight.woff2') format('woff2'),
         url('../fonts/GothamLight.woff') format('woff'),
         url('../fonts/GothamLight.ttf') format('truetype'),
         url('../fonts/GothamLight.svg#GothamLight') format('svg');
}

body {
    width: 100%;
    height: 100%;
    font-family: 'GothamThin',"Helvetica Neue",Helvetica,Arial,sans-serif;
    color: #fff;
    background:url(../img/pattern.png) repeat scroll;
}

html {
    width: 100%;
    height: 100%;
}

h1, h2, h3, h4, h5, h6 {
    margin:0;
    text-transform: uppercase;
    font-family: 'GothamLight',"Helvetica Neue",Helvetica,Arial,sans-serif;
    font-weight: normal;
    letter-spacing: 1px;
}

p {
    margin: 0 0 25px;
    font-size: 18px;
    line-height: 1.5;
}

p strong{
	font-family: 'GothamLight',"Helvetica Neue",Helvetica,Arial,sans-serif;
    font-weight: normal;
}
a{
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-ms-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	transition: all 0.3s ease;	
}
a:hover{
	text-decoration:none;
}

#wrapper{
	width:100%;
	height:100%;
	top:0;
	left:0;
	padding:0;
	display:block;
	overflow:hidden;
}
@media(max-width:720px) {
	#wrapper{
		padding-bottom:180px;
	}
}

/* Header & Right */

#header, #right{
	padding:30px 15px;
	height:100%;
	position: relative;
	background:url(../img/pattern-dark.png) repeat fixed;
	z-index:5;
}

#header h1{
	position:fixed;
	margin:0;
	bottom:30px;
	margin-left:66px;
}

#header h1 a{
	width:174px;
	height:20px;
	background:url(../img/logo.png) no-repeat;
	background-size:cover;
	text-indent:-9999px;
	white-space: nowrap;
	overflow: hidden;
	float: left;
	outline:none;
}
#right .overlay{
	width:100%;
	height:100%;
	position:absolute;
	left:0;
	top:0;
	background:url(../img/delfo.png) no-repeat;
	background-size:cover;
}

/* Navigation */

ul.nav{
	margin-top:21px;
}
ul.nav li{
	text-transform: uppercase;
	font-size:40px;
	text-align:right;
	margin:0;
	padding:0;
}
ul.nav li a{
	color:#b3b3b3;
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-ms-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	transition: all 0.3s ease;
	margin:0;
	padding:0;
	outline:none;
}
ul.nav li a:hover{
	color:#ffffff;
	background:none;
	outline:none;
}

ul.nav li.select a{
	color:#ffffff;
}

@media(max-width:1588px) {
	#header h1{
		margin-left:42px;
	}
	ul.nav li{
		font-size:37px;
	}	
}

@media(max-width:980px) {
	#header h1{
		margin-left:42px;
	}
	ul.nav li{
		font-size:37px;
	}	
}

@media(max-width:720px) {
	#header{
		width:100%;
		margin:0;
		height:auto;
		padding:15px;
		text-align:center;
	}
	ul.nav{
		position:relative;
		margin:0 0 20px 0;
		text-align:center;
		display:block;
	}
	ul.nav li{
		display:inline-block;
		font-size:18px;
		font-family: 'GothamLight',"Helvetica Neue",Helvetica,Arial,sans-serif;
		padding-right:15px;
		background:url(../img/separator.png) no-repeat right center;
		background-size:12px 23px;
	}
	ul.nav li.last{
		padding:0;
		background:none;
	}
	#header h1{
		position:relative;
		display:block;
		bottom:inherit;
		margin-left:0;
		overflow:hidden;
		left:50%;
		margin:0 0 30px -79px;
		width:159px;
		height:17px;
		background:url(../img/logo-interiors.png) no-repeat;
		background-size:cover;
		text-indent:-9999px;
	}
	#header h1 a{
		display:none;
	}
}
@media(max-width:950px) {
	#right{
		display:none;
	}
}

/* Content */

#content{
	height:100%;
	overflow:auto;
	padding-top:15px;
	padding-bottom:15px;
	float:left;
}

body.home #content{
	padding:0 !important;	
}

#content h1.interiors{
	width:159px;
	height:17px;
	background:url(../img/logo-interiors.png) no-repeat;
	background-size:cover;
	text-indent:-9999px;
	white-space: nowrap;
	overflow: hidden;
	float:right;
	margin-bottom:30px;
}

#content h1.logo{
	position:relative;
	float:left;
	display:none;
}

#content h1.logo a{
	width:174px;
	height:20px;
	background:url(../img/logo.png) no-repeat;
	background-size:cover;
	text-indent:-9999px;
	white-space: nowrap;
	overflow: hidden;
	float: left;
	outline:none;
}

@media(max-width:720px) {
	#content{
		padding:15px;
		width:100%;	
	}
	body.home #content{
		padding:0;	
	}
	#content h1.interiors{
		display:none;
	}	
	#content h1.logo{
		display:block;
		margin:20px 0 20px -87px;
		left:50%;
	}
	#content h1.fixed{
		position:fixed;
		bottom:20px;
	}
	body.home h1.logo{	
	}
}

/* Showcase Home */

ul.showcase{
	margin:0;
	padding:0;
	list-style-type:none;
	float:left;
}

ul.showcase li{
	margin:0 0 15px 0;
	padding:0;
	position:relative;
}

ul.showcase li.last{
	margin-bottom:0;
}

ul.showcase li a{
	display:block;
}

ul.showcase li a img{
	width:100%;
}

ul.showcase li a h2{
	position:absolute;
	left:15px;
	bottom:15px;
	color:#fff;
	text-shadow:1px 1px 3px #000000;
	font-size:14px;
	font-weight:normal;
	z-index:9999;
}

ul.showcase li a .overlay{
	position:absolute;
	width:100%;
	height:100%;
	top:0;
	left:0;
	background:none;
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-ms-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	transition: all 0.3s ease;
}
ul.showcase li a:hover .overlay{
	background:rgba(28,42,58,0.6);
}

/* Portfolio */
/* Portfolio */

ul.portfolio{
	margin:0;
	padding:0;
	list-style-type:none;
	float:left;
}

ul.portfolio li{
	width:31%;
	margin:0 3.5% 3.5% 0;
	padding:0;
	position:relative;
	float:left;
}

ul.portfolio li.third{
	margin-right:0;
}

ul.portfolio li a img{
	width:100%;
}

ul.portfolio li a .overlay{
	position:absolute;
	width:100%;
	height:100%;
	top:0;
	left:0;
	background:rgba(28,42,58,0.8);
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-ms-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	transition: all 0.5s ease;
	text-align:center;
	overflow:hidden;
}

ul.portfolio li a .overlay p{
	line-height:156px;
	color:#ffffff;
	font-size:50px;
	opacity:1;
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-ms-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	transition: all 0.5s ease;
}

ul.portfolio li a .overlay h3{
	color:#ffffff;
	font-size:18px;
	text-align:left;
	font-weight:normal;
	left:10px;
	bottom:10px;
	position:absolute;
	opacity:0;
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-ms-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	transition: all 0.5s ease;
}

ul.portfolio li a:hover .overlay p{
	opacity:0;
}

ul.portfolio li a:hover .overlay h3{
	opacity:1;
}

ul.portfolio li a:hover .overlay{
	background:rgba(28,42,58,0.5);
}

.lb-caption{
	font-family: 'GothamLight',"Helvetica Neue",Helvetica,Arial,sans-serif;
	font-weight:normal !important;	
}

@media(max-width:1335px) {
	ul.portfolio li a .overlay p{
		line-height:100px;
	}	
}
@media(max-width:450px) {
	ul.portfolio li{
		width:100%;
		margin:0 0 15px 0;
		padding:0;
		position:relative;
		float:left;
	}	
	ul.portfolio li a .overlay p{
		line-height:222px;
		font-size:120px;
	}
}

/* Curriculum */

ul.curriculum{
	margin:0;
	padding:0;
	list-style-type:none;
	float:left;
	width:100%;
}

ul.curriculum li{
	float:left;
	width:45%;
	position:relative;
	margin-right:10%;
}

ul.curriculum li.last{
	margin-right:0;
}

ul.curriculum li img{
	width:100%;
}

ul.curriculum li .overlay{
	position:absolute;
	width:100%;
	height:100%;
	top:0;
	left:0;
	background:rgba(28,42,58,0.8);	
}

ul.curriculum li h2{
	font-weight:normal;
	font-size:42px;
}
ul.curriculum li h3{
	font-weight:normal;
	font-family: 'GothamThin',"Helvetica Neue",Helvetica,Arial,sans-serif;
	font-size:28px;
	text-transform:none;
}
ul.curriculum li p{
	margin-top:45px;
}

@media(max-width:980px) {
	ul.curriculum li h2{
		font-weight:normal;
		font-size:30px;
	}
	ul.curriculum li h3{
		font-size:20px;
	}
	ul.curriculum li p{
		font-size:14px;
		margin-top:20px;
	}
}
@media(max-width:480px) {
	ul.curriculum li{
		width:100%;
		margin-right:0;
		text-align:center;
	}
	ul.curriculum li h2{
		margin-top:20px;
		font-size:42px;
	}
	ul.curriculum li h3{
		font-size:28px;
	}
	ul.curriculum li p{
		font-size:18px;
		margin-top:40px;
	}
}

.chi-sono{
	float:left;
	margin-top:40px;
}
.chi-sono h4{
	font-weight:normal;
	font-size:22px;
	color:#b3b3b3;
}
.chi-sono p{
	font-family: 'GothamThin',"Helvetica Neue",Helvetica,Arial,sans-serif;
	font-size:14px;
	margin-top:10px;
}

/* Skills Animation */

#resumeProficiencies {
	float: left;
	clear: right;
	width: 100%;
	margin: 20px 0px 30px 0px;
}

#resumeProficiencies h4{
	margin-bottom:20px;
}

#resumeProficienciesTop {
	float: left;
	clear: right;
	width: 100%;
	margin: -5px 0px 0px 0px;
	text-align: left;
	font-family: 'GothamLight',"Helvetica Neue",Helvetica,Arial,sans-serif;
}

#resumeProficienciesBottom {
	float: left;
	clear: right;
	width: 100%;
	margin: 2px 0px 0px 0px;
}

.progress {
	background:#b3b3b3; 
	height:20px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;  
}

.rhinoceros, .autocad, .maxwell, .photoshop, .coreldraw, .cinema, .word, .excel, .indesign, .illustrator, .sketchup {

 -webkit-transition: width 6.50s ease !important;
 -moz-transition: width 6.50s ease !important;
   -o-transition: width 6.50s ease !important;
      transition: width 6.50s ease !important;
 }
 
/* Contact Area */
 
#contact-area {
	float:left;
	width:100%;
}

#contact-area h3{
	text-align:center;
	font-weight:normal;
	text-transform:none;
}

#contact-area p{
	line-height:26px;
}
#contact-area p a{
	color:#b3b3b3;
}
#contact-area p a:hover{
	color:#fff;
}

#contact-area p i{
	margin:0 15px 0 0;
}

@media(max-width:720px) {
	#contact-area p{
		text-align:center;
	}
	#contact-area p i{
		margin:0 5px 0 0;
	}
}

#contact-area input, #contact-area textarea {
	padding: 5px;
	width: 100%;
	font-size: 1.4em;
	margin: 0px 0px 10px 0px;
	border: 2px solid #b3b3b3;
	background:none;
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-ms-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	transition: all 0.5s ease;
}

#contact-area textarea {
	height: 200px;
}

#contact-area textarea:focus, #contact-area input:focus {
	border: 2px solid #ffffff;
}

#contact-area input.submit-button {
	width: 100px;
	float: right;
	font-family: 'GothamLight',"Helvetica Neue",Helvetica,Arial,sans-serif;
}
#contact-area input.submit-button:hover{
	background:#ffffff;
	color:#1c2a3a;	
}
label {
	float: left;
	text-align: right;
	margin-right: 15px;
	width: 100px;
	padding-top: 5px;
	font-size: 1.4em;
}

/* Servizi */
.servizi{
	float:left;
	width:100%;
}
.servizi p{
	font-size:16px;
	line-height:20px;
}
.servizi .row{
	margin:0;
	padding:0;
	list-style-type:none;
	float:left;
	margin:5px 0 0 0;
}
.servizi .row .thumbnail{
	text-align:center;
	padding:10px;
	border:none;
	background:none;
	height:100%;
	border-radius:0;
	margin-bottom:5px;
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-ms-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	transition: all 0.3s ease;	
}

.servizi .row .thumbnail h4{
	color:#ffffff;
	text-transform:none;	
}
.servizi .row .thumbnail:hover{
	background:#b3b3b3;	
}
.servizi .row .thumbnail:hover h4{
	color:#1C2A3A;
}
.servizi .row .thumbnail img{
	margin-bottom: 10px;
	width:100%;
}
.servizi h3{
	margin:50px 0 15px 0;
	text-align:center;
	float:left;
	width:100%;
	font-size:28px;
}
.servizi .jumbotron{
	float:left;
	padding:0 15px;
	margin:15px 15px 5px 15px;
	background:none;
	border:2px solid #b3b3b3;
}
.servizi .jumbotron h1{
	font-size:20px;
	margin:15px 0;
}
.right{
	text-align:right;
}

/* Slider Home */
.box{
  background-size:cover;
}
@media(max-width:720px) {
	.box{
		height:300px !important;
		background-size:cover !important;
	}
}