.mainbody { /* the main page*/
    background-color:#000;
	width:100%;
	padding:0px;
	margin:0px;
	text-align:center;
	opacity:1;
	z-index:1;
	
	
}

.header { /* the background colour of the center of the page*/
position:relative;
	background-color:transparent;
	width:100%;
padding:0px;
	opacity:1;
	z-index:1;
	
}
.panel { /* the background colour of the center of the page*/
	background-color:#fff;
	padding:20px;	
}
.panel1 { /* the background colour of the center of the page*/
	background-color:#eee;
	padding:20px;	
}
.panel2 { /* the background colour of the center of the page*/
	background-color:#fff;
	padding:20px;	
}
.panel3 { /* the background colour of the center of the page*/
	background-color:#333;
	padding:20px;
	color:#FFF;	
}



/*DESKTOP*/
@media (min-width: 415px) {
	.header {
		height:300px;
	}
	.mobile {
	visibility:hidden;
	width:0px;
	height:0px;
}
}



/*IPHONES*/
@media (max-width: 414px) {
.header {
		height:100px;
	}
.desktop {
	visibility:hidden;
	width:0px;
	height:0px;
}
}