/* @font-face {  
    font-family: 'BebasRegular';  
    src: url('font/BEBAS___-webfont.eot');  
    src: url('font/BEBAS___-webfont.eot?#iefix') format('embedded-opentype'),     
    url('font/BEBAS___-webfont.woff') format('woff'),     
    url('font/BEBAS___-webfont.ttf') format('truetype'),     
    url('font/BEBAS___-webfont.svg#BebasRegular') format('svg');  
    font-weight: normal;  
    font-style: normal;  
    }  
 */     
html,body{ 
    font-family: Verdana, Tahoma, 'BebasRegular', Calibri, Arial, San-serif;  
	font-weight: 900;
    width:100%;     
    height:100%;  
}

.navigation {   
    position:fixed;     
    z-index:1;      
    top:20px;  
}  
.navigation li {    
    color:#333333;      
    display:block;      
    padding: 0 10px;    
    line-height:30px;   
    margin-bottom:2px;      
    font-weight:bold;   
    -webkit-transition: all .2s ease-in-out;    
    border-bottom:1px solid black;      
    text-align:left;    
    width:73px;  
}  
.navigation li:hover,
.active {   
    font-size:25px;     
    cursor:pointer;     
    width:100px!important;  
}

.logo {  
    position:fixed;  
    top:50%;  
    left:50%;  
    width:172px;  /* img width */
    margin-top:-41px;  
    margin-left:-223px;  
    z-index:1;  
}


.slide {
    background-attachment: fixed;
    width:100%;
    height:100%;
    position: relative;
    box-shadow:inset 0px 10px 10px rgba(0,0,0,0.3);
}
.wrapper {
    width:960px;
    height:200px;
    margin:0 auto;
    position:relative;
}
.slideno {
    position:absolute;
    bottom:0px;
    left:0px;
    font-size:100px;
    font-weight:bold;
    color:rgba(255,255,255,0.3);
}

.button{
    display:block;
    width:50px;
    height:50px;
    position:absolute;
    bottom:0px;
    left:50%;
    background-color:#333333;
    background-image:url(../images/arrow.png);
    background-repeat:no-repeat;
}
.button:hover{
    background-color:#494949;
    cursor:pointer;
}


/******************************
 SLIDE 1 
*******************************/
#slide1{
    background-color:#D9D6D2;  
	background-image:url(../images/glass.png);
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}
#slide1 .parallaxbg{
    position:absolute;
    right:40px;
    top:40px;
    font-size:28px;
    color:rgba(51,51,51,0.3);
}
/******************************
 SLIDE 2 
*******************************/
#slide2{
    background-color:#77848C;
     
}
#slide2 img:first-child{
    position:absolute;
	top: 0px;
	left: 260px;
	height: 1000px;
}
#slide2 img:nth-child(2){
    position:absolute;
    top:0px;
    left:-300px;
}
 #slide2 img:nth-child(3){
    position:absolute;
    top:600px;
    left:500px;
}
#slide2 img:nth-child(4){  /* window cleaner  */
    position:absolute;
    top:0px;
    left:500px;
	height: 700px;
}
#slide2 img:nth-child(5){
    position:absolute;
    top:600px;
    right:300px;
}
#slide2 img:nth-child(6){
    position:absolute;
    top:600px;
    right:300px;
}
#slide2 img:nth-child(7){
    position:absolute;
    top:400px;
    right:100px;
}
#slide2 img:nth-child(8){
    position:absolute;
    top:100px;
    right:300px;
} /*    */

/****************************** SLIDE 3 *******************************/ 
#slide3 {   
    background-color:#566573;  
}  
#slide3 img:first-child {   
    position:absolute;  
    top: 700px;  
    left: 300px; 
}  
#slide3 img:nth-child(2){   /* cloud1 smallish*/
    position:absolute;      
    top:100px;      
    left:100px;
	height: 60px;	
}  
#slide3 img:nth-child(3){   /* cloud1 small*/
    position:absolute;      
    top:150px;      
    left:-100px;  
}  
#slide3 img:nth-child(4){   /* clouds large */
    position:absolute;      
    top:450px;      
    left:500px; 
}  
#slide3 img:nth-child(5){   /* cloud1 */
    position:absolute;      
    top:200px;      
    right:600px;  
	height: 100px;
}  
#slide3 img:nth-child(6){   
    position:absolute;      
    top:200px;      
    right:300px;  
}
#slide3 img:nth-child(7){   
    position:absolute;      
    top:720px;      
    left:-100px;  
}

/******************************
 SLIDE 4 
*******************************/
 
#slide4{
	background-color:#394A59;  
    background-image:url(../images/building-back.jpg);
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}
#slide4 .parallaxbg{
    position:absolute;
    right:40px;
    top:40px;
    font-size:28px;
    color:rgba(51,51,51,0.3);
}

h1.right {
	text-align:right;
	padding: 10px;
}