@charset "utf-8";

@font-face {  
    font-family: 'BebasRegular';  
    src: url('font/bebas.eot');  
    src: url('font/bebas.eot?#iefix') format('embedded-opentype'),     
    url('font/bebas.woff') format('woff'),     
    url('font/bebas.ttf') format('truetype'),     
    url('font/bebas.svg#BebasRegular') format('svg');  
    font-weight: normal;  
    font-style: normal;  
    }
	
@font-face {
	font-family: 'raleway';
	src:url(font/raleway.ttf);
	}  
     
html,body{ 
    font-family: 'raleway';    
    width:100%;     
    height:100%;  
}

.navigation {
	position: fixed;
	z-index: 50;
	top: 50%;
	background-color: rgba(0,0,0,0.6);
	padding: 10px;
}  
.navigation li {
	display: block;
	padding: 0;
	margin-bottom: 10px;
	-webkit-transition: all .2s ease-in-out;
	-moz-transition: all .2s ease-in-out;
	transition: all .2s ease-in-out;
	width: 15px;
	height: 15px;
	border: 2px solid #ff540d;
	margin-top: 10px;
	border-radius: 50%;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
} 


 
.navigation .home_icon {
	background-image: url(../images/slide_home_icon.png);
	border: 2px solid rgba(255,255,255,0)!important;
	background-repeat: no-repeat;	
	
}

.navigation .home_icon:hover, .home_icon.active {
background-color: rgba(255,255,255,0)!important;
}

.navigation li:hover,.active {
	cursor: pointer;
	background-color: rgba(255,255,255,1);
}


.navigation li[tooltip]:hover:after {
	content: attr(tooltip);
	font-family: raleway;
	font-size: 18px;
	line-height: 35px;
	color: #ff540d;
	background-color: rgba(0,0,0,0.8);
	display: block;
	position: absolute;
	left: 60px;
	width: 100px;
	text-align: center;
	
	}

.slide {
	background-attachment: fixed;
	width: 100%;
	height: 100%;
	position: relative;
	overflow: hidden;
}
#bg_girl {
	position: absolute;
	left: 0px;
	top: 0px;
	z-index: 10;
	height: 100%;
	width: 100%;
	background-size: cover;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	
}

.slide_content_main {
	/* [disabled]background-color: rgba(153,153,153,1); */
	height: auto;
	width: 70%;
	position: absolute;
	left: 10%;
	z-index: 30;
	bottom: 75px;
}
.slide_content {
	height: 60%;
	width: 70%;
	position: absolute;
	left: 15%;
	top: 25%;
	z-index: 30;
	
}
.slide_content h1 {
	font-size: 55px;
}

.slide_content p {
	font-size: 18px;
	text-align: justify;
	display: block;
	width: 60%;
	margin-top: 20px;
}
.slide_content a {
	line-height: 40px;
	color: rgba(255,255,255,1);
	text-align: center;
	display: block;
	height: 40px;
	width: 200px;
	text-decoration: none;
	font-size: 18px;
	margin-top: 30px;
}
.mix_fruit_head {
	color: #000000;
}
.apple_head {
	color: #acb801;
}

.strawberry_head {
	color: #ff0606;
}
.orange_head {
	color: #ff7200;
}


.apple_link {
	background-color: #acb801;
}
.strawberry_link {
	background-color: #ff0606;
}
.orange_link {
	background-color: #ff7200;
}




.wrapper {
	width: 960px;
	height: 200px;
	position: relative;
	/* [disabled]background-color: rgba(204,102,153,0.5); */
	margin-top: 0px;
	margin-right: auto;
	margin-bottom: 0;
	margin-left: auto;
}

.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;
	z-index: 20;
}
.button:hover{
    background-color:#494949;
    cursor:pointer;
}



/******************************
 SLIDE 1 
*******************************/
#slide1{
	background-color: rgba(233,244,254,1);
     
}

.multi_fruit {
	background-image: url(../images/girls/fruits_girl.png);
	}
	
	
#slide1 img:first-child {   
  	position: absolute;
	top: 0px;
	left: 100%;
	z-index: 5; 
}  
#slide1 img:nth-child(2){   
   position: absolute;
	top: 230px;
	left: -450px;
	z-index: 5;  
}  
#slide1 img:nth-child(3){   
  position: absolute;
	top: 120px;
	left: 200px;
	z-index: 5;  
}  
#slide1 img:nth-child(4){   
    position: absolute;
	top: -350px;
	left: 500px;
	z-index: 5; 
}  
#slide1 img:nth-child(5){   
    position:absolute;      
    top:240px;      
    left:96%;  
	z-index: 5;
}  

@media only screen and (min-width: 1440px) {
	
#slide1 img:first-child {   
  	position: absolute;
	top: -30px;
	left: 125%;
	z-index: 5; 
}  
#slide1 img:nth-child(2){   
   position: absolute;
	top: 330px;
	left: -700px;
	z-index: 5; 
}  
#slide1 img:nth-child(3){   
  position: absolute;
	top: -50px;
	left: 100px;
	z-index: 5;  
}  
#slide1 img:nth-child(4){   
    position: absolute;
	top: -380px;
	left: 600px;
	z-index: 5; 
}  
#slide1 img:nth-child(5){   
    position:absolute;      
    top:250px;      
    left:100%;  
	z-index: 5;
} 
	
	
	 }
	 

@media only screen and (min-width: 1850px) {
	
#slide1 img:first-child {   
  	position: absolute;
	top: 0px;
	left: 155%;
	z-index: 5; 
}  
#slide1 img:nth-child(2){   
   position: absolute;
	top: 400px;
	left: -110%;
	z-index: 5; 
}  
#slide1 img:nth-child(3){   
  position: absolute;
	top: 150px;
	left: 0px;
	z-index: 5;  
}  
#slide1 img:nth-child(4){   
    position: absolute;
	top: -400px;
	left: 800px;
	z-index: 5; 
}  
#slide1 img:nth-child(5){   
    position:absolute;      
    top:450px;      
    left:105%;  
	z-index: 5;
} 
	
	
	 }	
	
	

/******************************
 SLIDE 2 
*******************************/
#slide2{
	background-color: #fbffc5;
	
}

.apple_girl {
	background-image: url(../images/girls/apple_girl.png);
	}

#slide2 img:first-child{
	position: absolute;
	top: 100px;
	left: 140%;
	z-index: 5;
}

#slide2 img:nth-child(2){
	position: absolute;
	top: 100px;
	left: 20%;
	z-index: 5;
}
#slide2 img:nth-child(3){
	position: absolute;
	top: 100px;
	left: -320px;
	z-index: 5;
}
#slide2 img:nth-child(4){
	position: absolute;
	top: 100px;
	left: 60%;
	z-index: 5;
}


@media only screen and (min-width: 1440px) {
	
	#slide2 img:first-child{
	position: absolute;
	top: 100px;
	left: 160%;
	z-index: 5;
}

#slide2 img:nth-child(2){
	position: absolute;
	top: 100px;
	left: 1%;
	z-index: 5;
}
#slide2 img:nth-child(3){
	position: absolute;
	top: 100px;
	left: -500px;
	z-index: 5;
}
#slide2 img:nth-child(4){
	position: absolute;
	top: 100px;
	left: 80%;
	z-index: 5;
}
	
	
	}
	
	
@media only screen and (min-width: 1850px) {
	
	#slide2 img:first-child{
	position: absolute;
	top: 100px;
	left: 200%;
	z-index: 5;
}

#slide2 img:nth-child(2){
	position: absolute;
	top: 100px;
	left: -12%;
	z-index: 5;
}
#slide2 img:nth-child(3){
	position: absolute;
	top: 100px;
	left: -750px;
	z-index: 5;
}
#slide2 img:nth-child(4){
	position: absolute;
	top: 100px;
	left: 120%;
	z-index: 5;
}
	
	
	}

/******************************
 SLIDE 3 
*******************************/

#slide3 {
	background-color: #ffdede;
} 

.strawberry_girl {
	background-image: url(../images/girls/strawberry_girl.png);
	}
 
#slide3 img:first-child {   
  	position: absolute;
	top: 0px;
	left: 100%;
	z-index: 5; 
}  
#slide3 img:nth-child(2){   
   position: absolute;
	top: 140px;
	left: -450px;
	z-index: 5;  
}  
#slide3 img:nth-child(3){   
  position: absolute;
	top: 70px;
	left: 200px;
	z-index: 5;  
}  
#slide3 img:nth-child(4){   
    position: absolute;
	top: -450px;
	left: 500px;
	z-index: 5; 
}  
#slide3 img:nth-child(5){   
    position:absolute;      
    top:120px;      
    left:90%;  
	z-index: 5;
}  

@media only screen and (min-width: 1440px) {
	
#slide3 img:first-child {   
  	position: absolute;
	top: -30px;
	left: 130%;
	z-index: 5; 
}  
#slide3 img:nth-child(2){   
   position: absolute;
	top: 200px;
	left: -700px;
	z-index: 5; 
}  
#slide3 img:nth-child(3){   
  position: absolute;
	top: 80px;
	left: 200px;
	z-index: 5;  
}  
#slide3 img:nth-child(4){   
    position: absolute;
	top: -450px;
	left: 700px;
	z-index: 5; 
}  
#slide3 img:nth-child(5){   
    position:absolute;      
    top:120px;      
    left:90%;  
	z-index: 5;
} 
	
	
	 }
	 

@media only screen and (min-width: 1850px) {
	
#slide3 img:first-child {   
  	position: absolute;
	top: 0px;
	left: 130%;
	z-index: 5; 
}  
#slide3 img:nth-child(2){   
   position: absolute;
	top: 200px;
	left: -110%;
	z-index: 5; 
}  
#slide3 img:nth-child(3){   
  position: absolute;
	top: 120px;
	left: 0px;
	z-index: 5;  
}  
#slide3 img:nth-child(4){   
    position: absolute;
	top: -400px;
	left: 800px;
	z-index: 5; 
}  
#slide3 img:nth-child(5){   
    position:absolute;      
    top:120px;      
    left:90%;  
	z-index: 5;
} 
	
	
	 }


/******************************
 SLIDE 4 
*******************************/
 
#slide4{
	background-color: #ffe8c7;
}

.orange_girl {
	background-image: url(../images/girls/orange_girl.png);
	}
	
#slide4 img:first-child {   
  	position: absolute;
	top: 0px;
	left: 85%;
	z-index: 5; 
}  
#slide4 img:nth-child(2){   
   position: absolute;
	top: 140px;
	left: -450px;
	z-index: 5;  
}  
#slide4 img:nth-child(3){   
  position: absolute;
	top: 120px;
	left: 200px;
	z-index: 5;  
}  
#slide4 img:nth-child(4){   
    position: absolute;
	top: -430px;
	left: 500px;
	z-index: 5; 
}  
#slide4 img:nth-child(5){   
    position:absolute;      
    top:230px;      
    left:96%;  
	z-index: 5;
}  

@media only screen and (min-width: 1440px) {
	
#slide4 img:first-child {   
  	position: absolute;
	top: 30px;
	left: 110%;
	z-index: 5; 
}  
#slide4 img:nth-child(2){   
   position: absolute;
	top: 200px;
	left: -700px;
	z-index: 5; 
}  
#slide4 img:nth-child(3){   
  position: absolute;
	top: 120px;
	left: 70px;
	z-index: 5;  
}  
#slide4 img:nth-child(4){   
    position: absolute;
	top: -420px;
	left: 600px;
	z-index: 5; 
}  
#slide4 img:nth-child(5){   
    position:absolute;      
    top:170px;      
    left:95%;  
	z-index: 5;
} 
	
	
	 }
	 

@media only screen and (min-width: 1850px) {
	
#slide4 img:first-child {   
  	position: absolute;
	top: 50px;
	left: 145%;
	z-index: 5; 
}  
#slide4 img:nth-child(2){   
   position: absolute;
	top: 200px;
	left: -110%;
	z-index: 5; 
}  
#slide4 img:nth-child(3){   
  position: absolute;
	top: 160px;
	left: -140px;
	z-index: 5;  
}  
#slide4 img:nth-child(4){   
    position: absolute;
	top: -400px;
	left: 800px;
	z-index: 5; 
}  
#slide4 img:nth-child(5){   
    position:absolute;      
    top:350px;      
    left:108%;  
	z-index: 5;
} 
	
	
	 }	
