*{margin:0;padding:0;}
#box{margin:50% auto;width:900px;height:800px;background:green;border:2px solid black}
header{width:100%;height:100px;}
#content{width:100%;height:600px;}


/**     layout 1     **/
#layout #header-left{width:50%;height:100px;background:#5F5F5F;float:left;}
#layout #header-right{width:50%;height:100px;background:pink;float:left;}

#layout #content1{width:50%;height:200px;background:yellow;float:left;}
#layout #content2{width:50%;height:200px;background:orange;float:left;}
#layout #content3{width:50%;height:200px;background:black;float:left;}
#layout #content4{width:50%;height:200px;background:white;float:left;}
#layout #content5{width:100%;height:200px;background:red;float:left;}

#layout #footer-left{width:33.3%;height:100px;background:black;float:left;}
#layout #footer-center{width:33.3%;height:100px;background:white;float:left;}
#layout #footer-right{width:33.3%;height:100px;background:black;float:left;}

footer{width:100%;height:100px;}