
*{
	box-sizing: border-box;
	margin: 0;
	padding: 0;

  
}


body{

font-family: Arial, Helvetica, sans-serif;
font-size:30px;
line-height:1.5;
color:#333;
background-image:url(top1.jpg);

background-size:100%;







}



#burgerM{
  
  display:none;
  
  
  
  
}


.navs{
  
  display:none;
  
  
  
  
}

.closebtn{
  
  display:none;
  
  
}

.sidenav{
  
  display:none;
  
}



.wrapper{
  position:sticky;
  top:0;
  z-index:-1;
  
}

.wrapper2{
  
  position:sticky;
  top: 0;
  z-index:-1;
  width:100%;
  background-color:grey;
 /* height:650px;*/
  
  
  
  
  
}




  img{
	max-width:100%;
	margin-bottom:40px;
	
	}
	
	hi,h2{
		margin-bottom:15px;

}
.container{
	display:flex;
	max-width:2000px;
	margin: 0 auto;
	padding: 0 30px;
	}

.navbar{

  margin-top:0;
	color:white  /*#FB2056#fff*/;
 /* text-decoration:underline;
  text-decoration-color:#FB2056;*/
	height:120px;
	}
	ul{
		list-style-type: none;
		}
		
  .navbar .logo{
			font-size: 58px;
			font-weight: bold;
			text-decoration:underline;
  text-decoration-color:#FB2056;
			}
			.navbar .container{
				display:flex;
				justify-content:space-between;
				align-items:center;
				height:100%;
       position:relative;
        top:-670px;
        
}





.navbar a{
  /*text-decoration:underline;
  text-decoration-color:#FB2056;*/

	color:white/*#FB2056 #fff*/;

	text-decoration:none;
	font-size:58px;
	font-weight:bold;
	



}
.navbar a:hover {
	color:black;
	background-color:lightgrey;


}




.navbar ul{
	display:flex;


}
.navbar ul li{
	margin-left:0;

}
.header{
	
	color:white;
  
	min-height:375px;

}

 h1 {
	font-size:4rem;
	font-weight: bold;
	line-height: 1.2;


}



  .header img{
	max-width:750px;
	margin-top:60px;
	margin-bottom:60px;
	


}

.header .container{

	display:flex;
	align-items:center;
	justify-content:space-between;
	
	padding-bottom:100px;
	
	
	

}

h2{
  
  color:#FB2056;
  
}



#topPic{
  
  border-radius:25px;
  
  
  
}


.boxes .container{

  
  display:flex;
  justify-content:space-between;
  background-color:white;
  
  
  
}
.boxes .container1{
  
  margin-top:-250px;
  
  display:flex;
  justify-content:space-between;
  background-color:white;
  
  
  
}






.box{
	flex: 1;
	
	background-color:white;
    font-size:35px;
	color:#343434;
	border-radius:10px;
	margin: 80px 40px;
/*	padding: 60px 80px;*/
/*	min-width:200px;*/


}

.box1{
	flex: 1;
  
  background-color:white;
    font-size:5px;
	color:#343434;
	border-radius:10px;
	margin: 300px 40px 0;
/*	padding: 80px 80px;*/
	


}

.boxTop{

  text-align:center;
}


  
.text3{
 position:relative;
 top:-40px;

 margin-top:-850px;
 background:white;
 padding-top:300px;
 padding-bottom:450px;
  

}











.shop{
  
  width:100%;
  height:680px;
  position:sticky;
  top:0;
  /*z-index:-1;*/
  margin-top:-10px;
  overflow:visible;
  
  
}

.shop2{
  
  width:100%;
  height:845px;
  position:sticky;
  top:0;
  /*z-index:-1;*/
  margin-top:-10px;
  overflow:visible;
  
  
  
}
/*make camelion and chetah pics different sizes*/

#pic1{
  
  height:450px;
  
  
  
  
}

#pic2{
  
 height:550px;
  
  
  
}


/*add spaces between title and text on adaptatif text*/

#screens{
  
  padding-bottom:60px;

}


.lastPage{
  
  width:100%;
  height:770px;
  z-index:2;
  position:sticky;
  top:-20px;
  background:#FB2056;
  
  
  
}

.cursive{
  
font-family:cursive;
font-size:55px;
text-align:center;
  
}

.stats{
  
  color:white;
  text-align:center;
  
  
  
}

.send{
	background:#FB2056/*#0a51cc*/;
	width:40%;
	text-align:center;
	margin: 0 auto;
	position:relative;
	top:-500px;
	font-size:25px;

/*	padding: 15px 20px;*/
	border-radius:10px;
	font-weight:bold;

}



.footer{
  
  /*width:100%;
  height:100px;*/
  text-indent:10px;
  padding-top:30px;
  padding-bottom:30px;

  z-index:2;
  position:sticky;
  top:0;
  background:black;
  
  
  
  
  
  
}


.spacer{
  
  
        
  padding-bottom:750px;
  padding-top:60px;
  position:relative;
  top:-200px;
  opacity:0;
  
  
  
  
  
}


@media ( max-width: 1700px){

    body{
        font-size:25px;
        
        
    }
    
    .header h1{
        
        font-size:3rem;
    }
    
 /*   .container{
        
        min-width:500px;
        
        
        
    }*/
    .navbar .logo{
        
        font-size:x-large;
        
    }
    
    
    .navbar{
        height:60px;
        
    }
    .navbar a{
        
        font-size:29px;
    }
    
.navbar ul li{
    
    margin-left:20px;
    
}


  .header img{
	/*max-width:500px;*/
	margin: 60px auto 40px auto;
	
	padding-left:20px;


}


.box{
    font-size:25px;
    
    margin: 40px 20px;
	padding: 30px 140px;
    
    
    
}

.box1{
    font-size:25px;
    
    margin: 40px 20px;
	padding: 30px 340px;
    
    
    
}











 
 
    
    
}





@media (max-width: 1300px) {
  
  /*switch from paralax to no paralax*/
  
 .text3{
   
   padding-bottom:0;
 }
  
  
  
  
  
  
  
 .wrapper{
   position:relative;
   top:0;
   
   
   
   
 }
  
  
  .shop{
   position:relative;
   top:0;
   
   
   
   
 }
  
  
  
  .wrapper2{
   position:relative;
   top:100px;
   z-index:10;
  
  
  
  }
  
  
  .shop2{
   position:relative;
   top:0;
   
   
   
   
 }
  
  
.text3{
  
  padding-bottom:130px;
  
  
  
  
  
}



.lastPage{
  
  position:relative;
  top:250px;
  z-index:20;
  
  
}
  
 .footer{
  
  position:relative;
  top:230px;
  z-index:10;
  
  
}



.spacer{
  
  display:none;
  
  
}
  
  
}




@media (max-width: 1100px) {
	
	body{
		font-size:30px;
		



}

.container{
    
    max-width:1100px;
    
    
    
}

.navbar a{
	
	font-size:30px;


}


.box{
    font-size:20px;
	
	margin: 20px 10px;
	padding: 20px 20px 50px;
	


}

.box1{
    font-size:20px;
	
	margin: 20px 10px;
	padding: 20px 20px 50px;
	


}




.header img {
    
    max-width:400px;
    
}







}






@media (max-width: 760px) {
  
  
  
  
  .footer{
  
  position:relative;
  top:230px;
  z-index:10;
  
  
}

  
  
  
  
  a:hover {
  opacity: .3/* !important*/;
  background-color:yellow /*!important*/;
  }
	
	
	#burger{
		font-size:50px;
        cursor:pointer;
        position:fixed;left:10px;top:5px;
        background:white;
        z-index: 2;



}

#burgerM{
		font-size:50px;
        cursor:pointer;
        
        background:white;
        z-index: 2;



}
	
	/* The side navigation menu */
.sidenav {
  height: 100%;/*  change for portrait orientation  */
  width: 0; /* 0 width - change this with JavaScript */
  position: fixed;/* Stay in place */
  z-index: 20; /* Stay on top */
  top:1px;
  /*left:10px;*/
  background-color:darkorange;/*#111; */
  opacity:0.95;
  overflow-x: hidden; /* Disable horizontal scroll */
  padding-top: 60px; /* Place content 60px from the top */
  transition: 0.5s; /* 0.5 second transition effect to slide in the sidenav */
}

/* The navigation menu links */
.sidenav a {
  padding: 2px 2px 2px 8px;
  text-decoration: none;
  font-size: 30px;
  color: black;/*lightgrey;*/
    display: block;
  transition: 0.3s;
}


/* Position and style the close button (top right corner) */
.sidenav .closebtn {
  position: absolute;
  top: 0;
  right: 40px;
  font-size: 36px;
  margin-left: 10px;
}

  
/*END OF BURGER*/
    
	
	
	
	.header .container{
		flex-direction:column;
		padding-top: 20px;
		text-align:center;


}

  .header img{
	margin-bottom:20px;
	max-width:350px;


}


.boxes .container{
	display:block;
	text-align: center;


}

.name{
	margin-left: 0;


}



/*.footer{
  
  position:relative;
  top:180px;
  z-index:10;
  
  
}*/





}

   

@media (max-width: 550px) {
  
 /*  .footer{
  
  display:none;
  
  
}*/
  
  
  
  
  
 
   .lastPage{
    height:1000px;
   
   
 }

	
	
	
	  
		



.nav{
	display:flex;
	
	flex-direction:column;
	background:#a1c3ff;
	font-size:10px;
	padding-right:10px;
	text-decoration:underline;
  
	


}
.navbar{
	height:150px;
  text-decoration:none;

}



.navbar a{
  
  text-decoration:none;
 
  
  
  
  
  
}


#homeLink{
    display:none;
    
    
}

.footer .container{
	flex-direction:column;
	


}
.phone{
	margin-top:10px;


}







}





@media (max-width: 400px) {

  
  
  
  
  .send{
    
    
  margin-top:70px;
  }
  
  
  
  
  .lastPage{
    height:1200px;
   
   
 }

  
  
	
	.navbar{
		height:150px;


}
	
/*	.navbar .container{
	flex-direction:column;
	}*/
	


.navbar.a{
    
    
    
    font-size:10px;
}
	


.box{
	
	padding:0;


}
.container {
	padding: 20px 0 0 0;


}
.header .container{
	
	padding-left:10px;


}

.logo{
	padding:3px;

}








}
			

