html, body{
	height: 100%;
}

body{
	height: 100%;
	width: 100%;
	font-family: "Lucida Grande", Lucida, Verdana, sans-serif;
	font-size: 13px;
	color: #777;
}

#wrapper{
	height: 100%;
}


header{
	width: 100%;
	height: 180px;
	overflow: hidden;
	z-index: 999;
	font-size: 20px;
	font-family: "StMarieThin", "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
	background-color: #ffffff;
	font-weight: bold;
}
	nav{
		width: 100%;
	}
	
		nav h1{
			width: 200px;
			margin: 20px auto;
		}
	
			nav h1 img{
				width: 200px;
			}
	
		nav ul{
			width: 100%;
			text-align: center;
			margin: 0 auto;
		}
	
			nav ul li{
				display: inline;
				width: 9%;
				color: #555;
				text-transform: capitalize;
				margin-right: 30px;
			}
				
				nav ul li:last-child{
					margin: 0;	
				}
	
				nav ul li a{
					text-decoration: none;
					color: #555;
				}
	
					nav ul li a:hover{
						text-decoration: none;
						color: #CB1A25;
					}
					
					nav ul li a.active{
						text-decoration: none;
						color: #CB1A25;
					}
	

	
#container{
	height: 100%
}
	

	#images{
		height: 25%;
		overflow: hidden;
		width: 100%;
	}
	
	#images a{
		display: block;
		text-decoration: none;
		color: #eee;
	}
	
/*------ home transitions ------*/
	
	.nailthumb-container{
		position: relative;
		overflow: hidden;
		margin: 0;
		padding: 0;
	}	
	
		.nailthumb-container figcaption {
			position: absolute;
			background: rgba(0,0,0,1);
			color: white;
			height:  100%;
			width: 100%;
			
			/*Hot sliding action*/
			opacity: 0;
			left: 0;
			top: 0;
			-webkit-transition: all 0.3s ease;
			-moz-transition:    all 0.3s ease;
			-o-transition:      all 0.3s ease;
		}
	
			.nailthumb-container:hover figcaption{
			  opacity: 0.6;
			  background: #222222;
			}
			
			.nailthumb-container figcaption .center
			{
				opacity: 1;
				position: absolute;
				text-align: center;
				margin: auto;
				width: 100%;
				height: 100%;
				margin-top: -15px;
				top:50%;
				font-size:15px;
			}
	
/*------ Images ------*/
	
	#images figure{
		float: left;
		overflow: hidden;
		width: 20%;
		height: 100%;
		
	}
		#images figure img{
			width: 250px;
			margin-left: -15%;
			padding-bottom: 15%;
			min-width: 100px;
			min-height: 100%;
		}
		#images figure img:last-child{
			overflow-x: visible;
		}
		
		#images .home figure img{
			width: 200px;
			margin-left: -20%;
			padding-bottom: 15%;
			min-width: 200px;
			min-height: 100%;
		}
		
/*----Home images--------*/	

	#images.home{
		height: 50%;
		overflow: hidden;
		
	}
		
		#imgleft, #imgright{
			position: absolute;
			overflow: hidden;
			height: 50%;
		}
		
		#imgleft{
			width: 51%;
		}
		
		#imgright{
			right: 0;
			width: 50%;
			z-index: 2;
		}
		
			#imgleft figure{
				width: 25%;
				height: 100%;
			}
			
				#imgleft figure img{
					min-width: 100%;
					min-height: 100%;
				}
						
			#rightimgs{
				height: 50%;
			}
			
				#rightimgs figure{
					width: 50%;
					overflow: hidden;
					height: 100%;
				}
			
					#imgright figure img{
						margin-top: -15%;
						margin-left: -15%;
						width: 130%;
					}
		
		
		#quote{
			height: 50%;
			width: 100%;
			display: block;
			color: #ffffff;
			font-family:"StMarieThin", "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
			overflow: hidden;
			font-size: 16px;
		}	
		
		
		
		
			
		#quote blockquote{
			margin: 12.5% auto 0;
			text-align: center;
			padding: 0 30px;
			position: relative;
			height: 100%;
		}
		
			blockquote .quotes{
				text-transform: uppercase;
			}
		
		
/*--------Basic----------*/		
		
		
	#text{
		width: 70%;
		float: left;
	}	
	
	
		#text article{
			width: 50%;
			min-height: 100%;
			padding: 20px 20px 60px;
			text-align: justify;
			margin: 0 auto 0 30%;
			float: left;
		}
		
			article h2{
				margin-bottom: 40px;
				font-size: 24px;
				font-family: "StMarieThin", "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
				color: #444;
			}
			
			article p{
				margin-top: 20px;
				margin-bottom: 20px;
				line-height: 22px;
			}
			
			article ul ol li{
				
			}
			
		blockquote#basic{
			position: relative;
			right: 0;
			top: 0;
			display: block;
			width: 30%;
			color: #ffffff;
			font-family: "StMarieThin", "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
			letter-spacing: 1px;
			margin: 0 !important;
			float: right;
			font-size: 16px;
		}
			#basic p#quoteText{
				padding: 40px;
				margin: 0;
			}
			
			@media all and (min-width: 1023px) {
			  blockquote {
			    font-size: 19px !important;
			  }
			  #images figure img{
			  	min-width: 300px;
			  }
			  #images .home figure img{
			  	min-width: 250px;
			  }
			}
			
			@media all and (min-width: 1279px) {
			  blockquote {
			  	margin-top: 10% !important;
			    font-size: 22px !important;
			  }
			  #images figure img{
			  	min-width: 350px;
			  }
			}
			
			@media all and (min-width: 1439px) {
			  blockquote {
			  	margin-top: 8% !important;
			    font-size: 25px !important;
			  }
			  #images figure img{
			  	min-width: 450px;
			  }
			}
			
			@media all and (min-width: 1679px) {
			  blockquote {
			  	margin-top: 8% !important;
			    font-size: 28px !important;
			  }
			  #images figure img{
			  	min-width: 500px;
			  }
			}
			
			blockquote#basic{
				margin: 0!important;
			}
	
	
/*-------Contact-------*/
	
	#contactform{
		display: block;
		font: 20px/30px "StMarieThin", "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
		letter-spacing: 1px;
		padding-bottom: 40px;
	}
		#error{
			color: red;
		}
		
		#contactform form section{
			margin-bottom: 10px;
			clear: both;
		}
		
		#contactform form section label{
			display: block;
			width: 100%;
		}
		#contactform form section input{
			display: block;
			width: 100%;
			clear: both;
			padding-top: 5px;
			padding-bottom: 5px;	
		}
		
		.contactSubmit{
			display: block;
			background: #DEDEDE;
			border: 0;
			padding: 6px;
		}
		
/*-------Footer---------*/
footer{
	
	position: fixed;
	bottom: 0;
	height: 60px;
	width: 100%;
	background-color: #eeeeee;
	z-index: 999;
	margin-top: -30px;
	color: #eeeeee;
	clear: both;
	font: bold 12px/30px "StMarieThin", "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
	line-height: 60px;
	color: #555;
	
}
	address{
		padding-left: 180px;
		margin: 14px auto;
		line-height: 60px;
		text-align: center;
		font: bold 12px/30px "StMarieThin", "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
		overflow: hidden;
		margin-right: 180px;
		height: 26px;
		
	}
	
	.blue, blue:visited {
		color: #003A67;
		text-decoration: none;
	}
	
	#social{
		position: absolute;
		right: 0;
		top: 0;
		
		height: 60px;
	}
	
	#social a{

		
		font: bold 12px/30px "StMarieThin", "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
		text-decoration: none;
		color: inherit;
		position: absolute;
		display: block;
		height: 60px;
		line-height: 60px;
		width: 90px;
		text-align: center;
	}
	
	#social a:visited {
		text-decoration: none;
	}
	
	#social a:hover{
		text-decoration: none;
		color: #fff;
	}
	#social a#fbook{
		right: 0px;
	}
	
	#social a#linkin{
		right: 90px;
	}
	#social a#fbook:hover{
		background: #3B5998;
	}
	#social a#linkin:hover{
		background: #9ACCE6;
	}

.noscroll{
	overflow: hidden;
}