HOD2018_website/themes/HOD2k18/static/css/style-old.scss

$breakpoint-phone: 600px;
$breakpoint-tablet: 900px;
$breakpoint-normal-screen: 1200px;
$breakpoint-big-screen: 1800px;

 body {
   margin:0;
   padding:0;
   background: #000001;
   color: #37ffad;
   font-family: monospace;
   width:100%;
   @media screen and (max-width: $breakpoint-normal-screen) {
     display:flex;
     flex-wrap: wrap;
   }
   header{
     flex:1 1 100%;
   }
   main{
    display: flex;
    justify-content: center;
    @media screen and (max-width: $breakpoint-normal-screen) {
      flex-wrap: wrap;
    }

     article{
       max-width:42em;
       margin:auto;
     }
     aside{
       border:solid 1pt yellow;
       padding:2em 3em;
       max-width: 42em;

     }
   }

   section{
     width:100%;
     ul{
       display: flex;
       list-style-type: none;
       flex-wrap: wrap;
       width:80%;
       margin:auto;
       li{
         display:flex;
         .orario{
           width:4em;
           background:red;
           height:1.3em;
           color:white;
           display: flex;
           justify-content: center;
         }
       h4{
         margin:0 1em;
         /*
         a{
         {{ range .Site.RegularPages }}
           # {{ replace .Title " " "_" }}:target > .descrizione-talk{
             display: block;
           }
         {{ end }}
       }*/
       }
       flex:1 1 80%;
       margin-bottom: 0.7em;
       height:4em;
       text-decoration:none;
       border:solid 1pt white;
       }
     }

   }

   @media screen and (max-width: $breakpoint-phone) {
     main{
       margin: 0 5% 0 5%;
     }
   }
 }

header {
  background-color: yellow;
}