/*estilo para smarphone*/
html {
background-color: #300606;
color:#FFFFFF;
font-family: 'Segoe UI', 'Open Sans', Arial, Helvetica, sans-serif;
font-weight: 400;
margin:4px;
padding: 4px;
background-color: #000000;
}
body {
margin: 0px;
padding: 4px;
}
#page-wrap:after { content: "Smartphone Layout";}
footer {display: none;}
header {
background-color: #FF0097;
color: #FFF;
padding: 4px;
margin: 4px;
text-align: center;
}
#flex {
height: auto;
display: -webkit-flex;
display: flex;
-webkit-flex-direction:column;
flex-direction: column;
/*min-height: 80%;*/
}
/*menĂº horizontal*/
#flex nav {
/*flex: 1 6 20%;*/
order:1;
background-color: #0000FF;
/*background-color: #ccf;
background-color: #339933;*/
margin: 4px;
padding: 8px;
font-size: large;
font-style: italic;
/*line-height: 4;*/
}
nav ul {
list-style-type: none;
margin: 0;
padding: 0;
}
nav ul li {
display: inline;
margin: 5px;
}
nav ul li a {
color: #FFFF00;
background-color: eaeaea;
}
nav ul li a:hover {
color: #FFFFFF;
background-color: ##2AFCFF;
}
#flex article {
/*flex:3 1 60%;*/
order: 2;
background-color:#FFA500;
margin: 4px;
padding: 8px;
}
#flex aside {
/*flex: 1 6 20%;*/
order: 3;
background-color: #D83A3A;
margin: 4px;
padding: 8px;
font-size: large;
line-height: 120%;
}
.inicio {
height: 20px;
width: 20px;
margin-left: 15px;
float:none;
text-align: center;
font-size: large;
font-variant: small-caps;
}
/* figure*/
img {display: block; margin: 0 auto;}