@charset "UTF-8"


body {
    padding: 0%;
    margin: 0%;
    font-family: 'Roboto', sans-serif;
}

.container {
    width: 82%;
    background-color:#c2b5ff;
    margin: auto; 
    border: 1px solid transparent
}

.navi {
display: flex;
justify-content: center;
align-items: center;
list-style: none;
color: #9fb8da;
}


.navi a {
    float: left;
  display: block;
  color: #3642c4;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
}

.navi >li {
padding-right: 2%;
}

.navi li a:link, a:active {
color: #ed008c);
text-decoration: none;
}

.navi li a:hover, a:visited {
color: rgb(209, 48, 193);
border-bottom: 1px solid aqua;
}

.main{
    background-color: rgb(162, 140, 221);
    min-height: 300px;

}

.aside-left {
    min-width: 50%;
    min-height: 450px;
    background-color: #88aee4;
    float: left;
    padding: 1%;
    box-sizing: border-box;
    margin:1% 0%;
    font-family: 'Roboto', sans-serif;
}

.aside-right {
    min-width: 50%; 
    min-height: 450px;
    background-color: rgb(77, 124, 186);
    float: right;
    padding: 1%;
    box-sizing: border-box;
    margin:1% 0%;
}

.row {
    
    padding: 10px;
    display: flex;
    justify-content: center;
}

.column {
max-width: 50%;
min-height: 200px;
padding: 1%;
background-color: rgb(161, 210, 227);
box-sizing: border-box;
border-radius: 5px;

}

.footer{
    min-width: 30%;
    padding: 1%;
    min-height: 50px;
    background-color: rgb(220, 220, 220);
    display: flex;
    box-sizing: border-box;
    justify-content: center;
    font-family: 'Roboto', sans-serif;
}

img.one {
    height: auto;
    width: auto;


}

.noob{
float:left;
margin: right 5px;
}

@media (max-width:992px){
    .row{
        display: block;
    }
    .column{
        width: 100px;
        margin: 10px auto;
        
    }
    .aside-left{
        float: none;
        width: 100%;
        margin: 10px auto;
    }
    .aside-right{
        float: none;
        width: 100%;
        margin: 10px auto;
    }
    .navi{
        display: block;
    }
}