/*common CSS*/
*{padding:0;outline:0}
body{font-family:arial;font-size:13px}
.clear{clear:both}
/*Header Start*/
#wrapper{width:100%;height:600px;border:1px solid black}
#header{width:100%;height:50px;background:#D9A0F6;border:1px solid black}
#content{width:100%;height:500px}
#box{width:400px;height:400px;background:#BEB0FB;color:#181A1E;border:1px solid black;padding:2px;float:left}
#box1{width:200px;height:200px;background:#F6A0BD;float:right;border:1px solid black}
#footer{width:100%;height:50px;background:#D9A0F6;border:1px solid black}
/*smartphones(portrait and landscape)----*/
@media only screen
and (min-device-width:100px)
and (max-device-width:300px){
/*style*/
body{background:#F6D9A0;font-size:50px;}
}
/*laptops(portrait and landscape)----*/
@media only screen
and (min-device-width:300px)
and (max-device-width:900px){
/*style*/
body{background:#444041;font-size:50px;}
}
}