<style>
 /* misc start */
*{margin:0px;padding:0px}
body{font-family:"Lucida Sans Unicode", "Lucida Grande", sans-serif;}
.media1140px{background-color:#EFEF34;}
.media768px{background-color:#EFEF34;}
.media480px{background-color:#EFEF34;}
.media300px{background-color:#EFEF34;}
.media1140px, .media768px, .media480px, .media300px{padding:15px;}p{margin:0 0 20px 0;}.clearb{clear:both;}
/* misc end */

/* header start */
#mainHeader{background-color:#82EAFF;padding:0.5em;overflow:auto;}

/* to make our logo resize automatically */
#responsiveLogo{width:100%;}
#responsiveLogo img{max-height: 100%; max-width: 100%; }
/* header end */

/* navigation start */
nav{float:left;width:100%;}
nav ul{list-style-type:none;padding:0;}

nav ul li{}
nav ul li a{background-color:#650d11;border:thin solid #fff;color:#fff;display:block;height:2em;line-height:2em;text-align:center;text-decoration:none;
width:100%;}
nav ul li a:hover{background-color:#ffffff;color:#650d11;}
/* navigation end */

/* middle section start */
#mainSection{
background-color: #D9F8F2;
float: left;
width: 96%;
}
		
#sideBox1{
background-color: #C9A449;
width: 96%;
}
		
#mainSection, #sideBox1{
background-color:#650d11;
color:#fff;			
overflow: auto;
padding:2%;
}
/* middle section end */
		
/* footer start */
footer{	
background-color:#EFEF34;
height:50px;
line-height:50px;
text-align:center;
width:100%;
}
/* footer end */

/* @media start */
/* noneed to specify for smartphones, that's our default layout */
/* -7 inch tablets-This CSS will apply for devices with the minimum width of 480 pixels 
*/
@media only screen and (min-width: 480px)
{
#mainHeader {background-color:#EFEF34;}nav ul li{float:left;width:25%;}
}
/* @media end */
</style>