body { background-color : mistyrose; }
h1 { color : purple; }
hr { border : 5px solid yellow; }
h2 { font-size : 40px;
    font-family:serif;
    color : green;
    text-shadow : 3px 3px 3px red }
div {
    background : skyblue;
    padding : 10px;
    border : 5px solid gold;
    background-image: url("media/휴머노이드 변천사.png") ;
    background-repeat: repeat-x;}
h3 {text-shadow :3px 3px 3px red;}

html,body{
    padding : 0px;
    margin : 0px;
    height : 100%
}
body{
    flex-direction: column;
    height:100%;
}
header{
    height: 20%;
    background-color: lightpink;
    overflow: visible;
    height:auto;
}
main{
    height:72%;
    flex-direction: row;
    flex:1;
}
nav{
    width:20%; height: 100%;
    background-color : lightyellow;
    float:left;
    overflow:hidden;
}

section{
    width:80%; height:100%;
    background-color:lightblue;
    float:left;
    overflow: hidden;
}

footer{
    height : 8%;
    background: yellow;
    clear: left;
    overflow: hidden;
}