html, body, *{
	margin: 0;
	padding: 0;
}

header{
    height: 25em;
    position: relative;
    background-image: url("/images/top.png");
    background-repeat: no-repeat;
    background-size: 100%;
}

#logo{
    position: absolute;
    left:4em;
    top: 2em;
    height: 20%;
}

#logo img{
    height: 100%;
}

menu{
    position: absolute;
    right:4em;
    top:2em;
}

menu li{
    display: inline;
    padding: 0.5em;
}

header aside{
    position: absolute;
    top:10em;
    width:90%;
    margin-left:5%;
    margin-right:5%;
    text-align: center;
}

main article{
    padding: 3em 10em;
    text-align: center;
}

#back-circuit{
    height:20em;
    background-image: url("/images/back-circuit.png");
    background-repeat: no-repeat;
    background-size: 100%;
}

section article{
    text-align: center;
}

#about{
    clear: both;
}

#about article{
    padding: 3em 10em;
}

#about aside div{
    width:calc(100% / 3);
    float: left;
    text-align: center;
    height:20em;
}
#port{
    clear: both;
}

#port article{
    padding: 3em 10em;
}

#port aside{
    margin-left: 0;
    margin-right: 0;
}

#port aside div{
    width: 31.66%;
    float: left;
    text-align: center;
    height:20em;
    margin-bottom:2.5%;
}

#cv{
    clear:both;
}

#port aside div:nth-child(2), #port aside div:nth-child(5), #port aside div:nth-child(8){
    margin-left:2.5%;   
    margin-right:2.5%;
}

#port aside div:nth-child(1), #port aside div:nth-child(2), #port aside div:nth-child(3){
    margin-top:2.5%;   
}

#snow{
    background-image: url("/images/about/snow.png");
    background-repeat: no-repeat;
    background-size: 100%;
}

#cook{
    background-image: url("/images/about/cook.png");
    background-repeat: no-repeat;
    background-size: 100%;
}

#bass{
    background-image: url("/images/about/bass.png");
    background-repeat: no-repeat;
    background-size: 100%;
}

#port1{
    background-image: url("/images/port/qa2011.png");
    background-repeat: no-repeat;
    background-size: 100%;
}

#port2{
    background-image: url("/images/port/ucd.png");
    background-repeat: no-repeat;
    background-size: 100%;
}

#port3{
    background-image: url("/images/port/agenda7.png");
    background-repeat: no-repeat;
    background-size: 100%;
}

#port4{
    background-image: url("/images/port/edudigital.png");
    background-repeat: no-repeat;
    background-size: 100%;
}

#port5{
    background-image: url("/images/port/eduacademico.png");
    background-repeat: no-repeat;
    background-size: 100%;
}

#port6{
    background-image: url("/images/port/appinfo.png");
    background-repeat: no-repeat;
    background-size: 100%;
}

#port7{
    background-image: url("/images/port/artsana.png");
    background-repeat: no-repeat;
    background-size: 100%;
}

#port8{
    background-image: url("/images/port/unicakoha.png");
    background-repeat: no-repeat;
    background-size: 100%;
}

#port9{
    background-image: url("/images/port/appaudio.png");
    background-repeat: no-repeat;
    background-size: 100%;
}

#cv{
    width:100%;
}

#cv article{
    padding: 3em 10em;
}

#cv aside{
    column-count: 2;
    -webkit-column-count: 2;
    padding-left: 4em;
    padding-right: 4em;
    padding-top: 1.5em;
    padding-bottom: 1.5em;
}

#cv aside h1{
    break-after: column;
    margin-left: calc(100% / 3);
    text-align: right;
    margin-right: 4em;
}

#cv aside h4{
    margin-top: 0.75em;
}

#cv aside ul, #cv aside p{
    margin-bottom: 1em;
}

#contact article{
    height: 7em;
    padding: 1em;
}

#contact img{
    margin-top: 1em;
    height:3em;
}

footer{
        text-align: center;
    padding: 1em;
    height: 2em;
}