@charset "UTF-8";
/* --------------------- NEW LHH SITE ----------------------- */
/* --------------------- TEXT ----------------------- */

 body{
   	 background-color: #9c8a79;
	 font-family: 'Pontano Sans', sans-serif;
	 font-size:10pt;
	 color:black;
	 line-height:100%;
     padding-top: 100px;
     overflow-x: hidden;
 }

a{
	color:#2663ff;
	text-decoration:none;
}

 a:hover {
	color: #FFF;
}

 a:active {
	color: #FFF;
}

  a.head{
    font-size:26px;
    line-height: 40px;
}

  a.nav{
   	margin-right: 15px;
    font-size:14px;
    line-height: 25px;
}
  
  a.popup{
    font-family:'Fondamento', Palatino, serif;
	font-size:16px;
    line-height: 25px;
}

.title{
    text-decoration: underline;
    font-style: italic;
}

.popup{
	text-align: center;
	padding-top: 20px;
}

	figcaption { 
    font-size: 9pt;
    padding: 5px 20px 0px 20px;
    line-height: 12pt;
       opacity: 0;
    -webkit-transition: opacity 0.2s ease-out;  
      -moz-transition: opacity 0.2s ease-out;  
       -ms-transition: opacity 0.2s ease-out;  
        -o-transition: opacity 0.2s ease-out;  
          transition: opacity 0.2s ease-out;  
}

figure {
	width:100%;
    margin: 0;
}

figure:hover figcaption {
    display: block;
    opacity: 1; 
}

/* --------------------- HEADER ----------------------- */
 
header{
    z-index:100;
  	position:fixed;
  	top:0;
    padding-top: 25px;
  	left:0;
  	width:100%;
    height: 100px;
  	overflow: hidden;
  	background-color:transparent;
    font-family:'Fondamento', Palatino, serif;
    text-align: center;
    background: none;
    transition: top 0.2s ease-in-out;
}

.nav-up {
    top: -100px;
}

/* --------------------- MAIN PAGE -----------------------*/

#main{
	position:absolute;
	width:100%;
	margin: 0;
	z-index:-1;
	height:auto;
	overflow:auto;
	padding: 50px 0 80px 0;
    text-align: center;
}

#img1{
    margin-top: 100px;
	width: 32%;
	max-width:275px;
	display:inline-block;
}
#img1 img{
	width:100%;
}
	
#img2{
    margin-top: 100px;
	width:46%;
	max-width:400px;
	display:inline-block;
}
#img2 img{
	width:100%;
}

#img3{
    margin-left:0;
    margin-top: 100px;
	width:70%;
	max-width:600px;
	display:inline-block;
}
#img3 img{
	width:100%;
}
	
#img4{
    margin-left:0;
    margin-top: 100px;
	width:80%;
	max-width:700px;
	display:inline-block;
}
#img4 img{
	width:100%;
}
	
#img5{
    margin-left:0;
    margin-top: 100px;
	width:100%;
	max-width:900px;
	display:inline-block;
}
#img5 img{
	width:100%;
}

.closeleft{
	text-align: center;
	padding-right: 10%;
}

.closeright{
    text-align: center;
    padding-left: 10%;
}
.left{
    text-align: center;
    padding-right: 30%;
}

.right{
    text-align: center;
    padding-left: 30%;
}


/* --------------------- CONTENT PAGES ----------------------- */

#content{
	position:absolute;
	width:100%;
	z-index:-1;
	text-align:center;
	height:auto;
	overflow:auto;
	padding: 0px 0 80px 0;
}

#content-text{
    padding-top: 100px;
    width: 50%;
    margin: 0 auto;
	max-width:800px;
    overflow-x:auto;
    text-align: left;
    line-height: normal;
}

#content img{
	width:70%;
    height: auto;
	max-width: 1300px;
    padding-top: 200px;
}

.video {
    padding-top: 100px;
    text-align: center;
}


/* --------------------- POPUP CONTACT ----------------------- */

.dhtmlwindow{
position: absolute;
border: 1px dashed #2663ff;
visibility: hidden;
background-color: white;
}

.drag-handle{ /*CSS for Drag Handle*/
padding: 5px;
background-color: #FFF;
cursor: move;
overflow: hidden;
width: auto;
filter:progid:DXImageTransform.Microsoft.alpha(opacity=100);
-moz-opacity: 1;
opacity: 1;
}


.drag-handle .drag-controls{ /*CSS for controls (min, close etc) within Drag Handle*/
position: absolute;
right: 1px;
top: 2px;
cursor: hand;
cursor: pointer;
}

* html .drag-handle{ /*IE6 and below CSS hack. Width must be set to 100% in order for opaque title bar to render*/
width: 100%;
}

/* --------------------- IMAGE RESIZE ----------------------- */

@media screen and (max-width: 1200px){/* for screens smaller then 850px, set the font size smaller */

}
@media screen and (max-width: 800px){/* for screens smaller then 850px, set the font size smaller */

}
@media screen and (max-width: 600px){/* for screens smaller then 850px, set the font size smaller */

}