* {
margin:0;
padding:0;
}

aside, footer, address, section {
display:block;
}

img, iframe, video, embed {
max-width:100%!important;
}

a {
color:#01619e;
text-decoration:underline;
}

a:hover {
text-decoration:none;
}

section p {
font:1.2em Arial;
padding:0.2em 0;
}

#page {
width:100%;
background:#fff;
font-size:100%;
font-family:Arial, Tahoma;
}

#main {
width:100%;
margin-top:4em;
border-bottom:2px dashed #aaa;
}

.layout {
width:800px;
margin:0 auto;
text-align:center;
overflow:hidden;
}

footer {
width:100%;
background:#fefefe;
padding-top:1.5em;
}

section {
text-align:left;
width:49%;
margin:0 1% 0 0;
float:left;
}

/*  Adaptive -------------  */

/*   800px  */

@media screen and (max-width: 800px), only screen and (max-device-width:800px) {
    
.layout {
width:760px;
}
}

/*  768px  */

@media screen and (max-width: 768px), only screen and (max-device-width:768px) {
    
.layout {
width:720px;
}
}

/*  640px  */

@media screen and (max-width: 640px), only screen and (max-device-width:640px) {
    
.layout {
width:600px;
}

section {
width:100%;
float:none;
margin:1em 0;
}
}


/*  600px  */

@media screen and (max-width: 600px), only screen and (max-device-width:600px) {
    
.layout {
width:540px;
}

section {
width:100%;
float:none;
margin:1em 0;
}
}


/*  480px  */

@media screen and (max-width: 480px), only screen and (max-device-width:480px) {
    
.layout {
width:430px;
}

section {
width:100%;
float:none;
margin:1em 0;
}
}

/*  360px  */

@media screen and (max-width: 360px), only screen and (max-device-width:360px) {
    
.layout {
width:340px;
}

section {
width:100%;
float:none;
margin:1em 0;
}
}

/*  320px  */

@media screen and (max-width: 320px), only screen and (max-device-width:320px) {
    
.layout {
width:280px;
}

section {
width:100%;
float:none;
margin:1em 0;
}
}