/*CSS Document*/


@media only screen
and (min-width :800 px)
and (max-width : 1280px) {
        div#container{ width: 1280px }
        header { font-size: 50% }
		
        section { width: 800px }
        aside { width: 150px }
        footer { width: 600px }
}
@media only screen
and (min-width : 768px)
and (max-width : 1024px) {
        div#container{ width: 850px }
		
        header { font-size: 50% }
        section { width: 580px }
        aside { width: 130px }
        footer { width: 600px }
}
@media only screen
and (min-width : 480px)
and (max-width : 800px) {
        div#container { width: 800px }
		
        header { font-size: 80% }
        section { width: 480px }
        aside { width: 150px }
        footer { width: 630px }
}
@media only screen
and (min-width : 320px)
and (max-width : 667px) {
        div#container { width: 450px; }
		
        header { font-size: 70%; }
        section { width: 400px; padding: 0; margin: 0; border: 0 }
        aside { display: none }
        footer { width: 440px }
@media only screen
and (min-width : 320px)
and (max-width : 480px) {
        div#container { width: 400px; }
		
        header { font-size: 70%; }
        section { width: 400px; padding: 0; margin: 0; border: 0 }
        aside { display: none }
        footer { width: 360px;
	           height:140px;}
}

}
@media only screen
and (min-width: 310px)
and (max-width: 320px) {
        div#container { width: 300px; }
		
        header { font-size: 40%; text-align: center }
        header span { display: block }
        nav { text-align: center }
        nav a { margin: 0 3px }
        nav a:first-child { margin: 0 3px }
        section { width: 300px; padding: 0; margin: 0; border: 0 }
        aside { display: none }
        footer { display: none }
}