@font-face {
    font-family: "Lulo";
    src: url("../fonts/LuloClean.ttf");
}

@font-face {
    font-family: "Futura";
    src: url("../fonts/futura.ttf");
}

* {
    box-sizing: border-box;
}

div{
    align-content: center;
    vertical-align: center;
}

.item1{
    background-color: #fad001;
    color:#121212;
    flex: 1;
    text-align: center;
}

.item2{
    background-color: #027abe;
    color:#121212;
    flex: 1;
    text-align: center;
}

.item3{
    background-color: #eea8c8;
    color:#121212;
    flex: 1;
    text-align: center;
}

.item4{
    background-color: #37a95b;
    color:#121212;
    flex: 1;
    text-align: center;
}

.item5{
    background-color: #dc2c21;
    color:#121212;
    flex: 1;
    text-align: center;
}

.item6{
    background-color: #121212;
    color:#fafafa;
    flex: 1;
    text-align: center;
}

.item6 img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    overflow: hidden;
}

/* set style for buttons */
button {
    background-color: transparent;
    font-family: 'Futura';
    font-size: 1.5vw;
    padding: 2.2% 8%;
    border: 0.5vw solid #121212;
    cursor: pointer;
}
  
button:hover {
    background-color: #121212;
    font-family: 'Futura';
    font-size: 1.5vw;
    color: #fafafa;
    padding: 2.2% 8%;
    border: 0.5vw solid #121212;
    cursor: pointer;
}