@charset "utf-8";

body{
    width: 95%;
    min-width: 640px;
    max-width: 960px;
    margin: 0 auto;
}



nav > ul > li{
    flex: 1 1 auto;
}

@media screen and (max-width: 480px){
    
    /*mobile*/
    body{
        width: 100%;
    }

}

@media screen and (min-width: 481px){
    
    /*desktop*/
    
    body{
        width: 95%;
        min-width: 640px;
        max-width: 960px;
    }

    nav > ul{
    display: flex;
    flex-flow: row nowrap;
    }

    img{
        max-width: 100%;
    }
}

main {
  display: flex;
  gap: 15px;
}

article {
  flex: 3;
}

aside {
  flex: 1;
}

@media screen and (max-width: 768px) {
  main {
    flex-direction: column;
  }
}