body{
margin:0;
padding:0;
}

#lahat{
width:100%;
padding-bottom:5%;
margin:0;
background-color:black;
}

#header{
opacity:0.6;
float:left;
width:100%;
background-color:#ffffff;
-webkit-transition:.5s;
 -moz-transition:.5s; 
 -ms-transition:.5s;
 -o-transition:.5s; 
 transition:.5s;
}

#header:hover{
opacity:1;
}

#header img{
margin-left:3%;
margin-top:.7%;
float:left;
width:130px;
text-align:right;
}

a {
color:#a2a2a2;
font-family:"Lucida Sans Unicode";
-webkit-transition:.5s;
 -moz-transition:.5s; 
 -ms-transition:.5s;
 -o-transition:.5s; 
 transition:.5s;
}

a:hover{
color:#FFA873;
}

#header ul
{
margin-right:4%;
list-style:none;
float:right;
font-size:120%;
}

#header ul li
{
display:inline;
margin-left:20px;
}

#header ul li a
{
text-decoration:none;
}

#wall{
width:100%
position:relative;
overflow:hidden;
float:left;
}

#wall img{
width:100%;
}

#des{
font-family:"Lucida Sans Unicode";
width:45%;
float:left;
position:absolute;
margin-top:20%;
margin-left:6%;
margin-bottom:3%;
margin-right:1%;
}

#des h1{
color:#FF6200;
font-size:450%;
}

#des p{
margin-top:-5%;
color:#ffffff;
font-size:150%;
}

#q, #w{
color:#FF6200;
}

#arrow{
width:4%;
float:left;
margin:-7% 48%;
}

#arrow img:{
width:50%;
 }

#baba{
width:100%;
padding-bottom:.3%;
float:left;
background-color:white;
width:100%;
opacity:.5;
-webkit-transition:2s;
 -moz-transition:2s; 
 -ms-transition:2s;
 -o-transition:2s; 
 transition:2s;
}

#baba:hover{
opacity:1;
}

.cont{ width:32.8%; height:650px; float:left; margin:3.5px;}
.cont1{ width:32.8%; height:650px; float:left; margin:3.5px;}

.mask1 {
    position:relative;
    height:100%;
    width:100%;
    overflow:hidden;
    float:left;
}
.mask1 img {
    position:absolute;
    height:100%;
    left:-30%;
    margin-top:0%;
    margin-left:-50%;
}

.caption1 {  
    background-color:#FF6200;  
    position: absolute;  
    color: #1240ab;  
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    padding: 4px 20px 4px 15px; 
    opacity: 0;
    -webkit-transition: all 300ms ease-out;  
    -moz-transition: all 300ms ease-out;  
    -o-transition: all 300ms ease-out;  
    -ms-transition: all 300ms ease-out;  
    transition: all 300ms ease-out;   
}  

.caption1 h3, .caption2 h3, .caption3 h3{
color:#FFA073;
font-size:450%;
}

.caption1 p, .caption2 p, .caption3 p{
color:#FFFFFF;
}
.mask1:hover .caption1 {  
    opacity: 0.8;  
} 

.mask2 {
    position:relative;
    height:100%;
    width:100%;
	padding-left:0;
    overflow:hidden;
    float:left;
}
.mask2 img {
    position:absolute;
    height:100%;
    left:-50%;
    margin-top:0%;
    margin-left:-50%;
}

.caption2 {  
    background-color:#FF6200;  
    position: absolute;  
    color:#1240ab;  
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    padding: 4px 20px 4px 15px;
    opacity: 0;
    -webkit-transition: all 300ms ease-out;  
    -moz-transition: all 300ms ease-out;  
    -o-transition: all 300ms ease-out;  
    -ms-transition: all 300ms ease-out;  
    transition: all 300ms ease-out;   
}  

.mask2:hover .caption2 {  
    opacity: 0.8;  } 
	
.mask3 {
    position:relative;
	height:100%;
    width:100%;
    overflow:hidden;
    float:left;
}
.mask3 img {
    position:absolute;
    height:100%;
    left:-30%;
    margin-top:0%;
    margin-left:-50%;
}

.caption3 {  
    background-color:#FF6200;  
    position: absolute;  
    color:#1240ab;  
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    padding: 4px 20px 4px 15px;
    opacity: 0;
    -webkit-transition: all 300ms ease-out;  
    -moz-transition: all 300ms ease-out;  
    -o-transition: all 300ms ease-out;  
    -ms-transition: all 300ms ease-out;  
    transition: all 300ms ease-out;   
}  

.mask3:hover .caption3 {  
    opacity: 0.8;  } 
.mask4 {
    position:relative;
	height:100%;
    width:100%;
    overflow:hidden;
    float:left;
	
.mask1 {
    position:relative;
    height:180px;
    width:240px;
    overflow:hidden;
    float:left;
    margin:15px;
}
.mask1 img {
    position:absolute;
    height:300px;
    width:400px;
    top:50%;
    left:50%;
    margin-top:-150px; /* half the height */
    margin-left:-200px; /*half the width */
}

.caption1 {  
    background-color:#FF6200;  
    position: absolute;  
    color: #fff;  
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    padding: 4px 20px 4px 15px; 
    font-size:0.8em;
    opacity: 0;
    -webkit-transition: all 300ms ease-out;  
    -moz-transition: all 300ms ease-out;  
    -o-transition: all 300ms ease-out;  
    -ms-transition: all 300ms ease-out;  
    transition: all 300ms ease-out;   
}  

.mask1:hover .caption1 {  
    opacity: 1;  
}  
.mask2 {
    position:relative;
    height:180px;
    width:240px;
    overflow:hidden;
    float:left;
    margin:15px;
}
.mask2 img {
    position:absolute;
    height:300px;
    width:400px;
    top:50%;
    left:50%;
    margin-top:-150px; /* half the height */
    margin-left:-200px; /*half the width */
}

.caption2 {  
    background-color: #FF6200;  
    position: absolute;  
    color: #fff;  
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    padding: 4px 20px 4px 15px; 
    font-size:0.8em;
    opacity: 0;
    -webkit-transition: all 300ms ease-out;  
    -moz-transition: all 300ms ease-out;  
    -o-transition: all 300ms ease-out;  
    -ms-transition: all 300ms ease-out;  
    transition: all 300ms ease-out;   
}  

.mask2:hover .caption2 {  
    opacity: 1;  
}  
.mask3 {
    position:relative;
    height:180px;
    width:240px;
    overflow:hidden;
    float:left;
    margin:15px;
}
.mask3 img {
    position:absolute;
    height:300px;
    width:400px;
    top:50%;
    left:50%;
    margin-top:-150px;
    margin-left:-200px;
}

.caption3 {  
    background-color: #FF6200;  
    position: absolute;  
    color: #fff;  
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    padding: 4px 20px 4px 15px; 
    font-size:0.8em;
    opacity: 0;
    -webkit-transition: all 300ms ease-out;  
    -moz-transition: all 300ms ease-out;  
    -o-transition: all 300ms ease-out;  
    -ms-transition: all 300ms ease-out;  
    transition: all 300ms ease-out;   
}  

.mask3:hover .caption3 { opacity: 1;  }
