.banner {
     width: 100%;
     height: 100vh;
     font-size: 30px;
     overflow: hidden 
}
 .banner .image img {
     position: absolute;
     top: 0;
     left: 5%;
     height: 100%;
     object-fit: contain;
     object-position: center;
}
 .banner .vignette {
     position: absolute;
     top:0;
     left:0;
     width: 100%;
     height: 100vh;
     z-index: 3;
}
 .cta {
     position: absolute;
     top: 0;
     text-align: center;
     top: 50%;
     transform: translateY(-50%);
     right: 0px;
     width: 50%;
     text-transform: uppercase;
     z-index: 4;
}
 @media (max-width: 700px) {
     .banner .image {
         position: relative;
         width: 100%;
         height: 100%;
    }
     .banner .image img {
         left: 0%;
         width: 100%;
         height: 100%;
    }
     .cta {
         text-align: center;
         top: unset;
         bottom: 5%;
         right: 0;
         width: 100%;
         transform: unset;
    }
     .cta h1 {
         font-size: 21px;
    }
     #newsletter {
         display: none;
    }
}
 img {
     max-width: 100%;
    ;
}
 main, article {
     max-width: 825px;
     margin: 0 auto;
     margin-top: 100px;
     padding: 0 20px;
}
 .columns {
     column-count: 3;
}
.columns li {
     text-align: center;
     margin-bottom: 30px;
     line-height: 1;
     max-width: 200px;
     }
 @media (max-width: 700px) {
     .columns {
         column-count: 1;
    }
}