/* Structure */
body {
    background-color: tan;
    font-family: Arial, Helvetica, sans-serif;
}

.all-sections {
    flex-wrap: wrap;
    background-color: cornflowerblue;
}

/* Typography */
h1 {
    text-align: center;
    background-color: cornflowerblue;
    color:white;
}
h3 {
    text-align: center;
    font-size: x-large;
}

.columns {
    background-color: white;
    padding: 10px;
    margin: 10px;
    border: 10px;
}


footer {
    text-align: center;
    background-color: cornflowerblue;
    height: 75px;
    border: 5px solid black;
    display: flex;
    justify-content: center;
    align-items: center;
}
/*Color Picker*/
.shape {
    width: 100px;
    height: 100px;
    background-color: grey;
    clip-path: polygon(50% 0%, 61% 35%, 98% 35%, 68% 57%, 79% 91%, 50% 70%, 21% 91%, 32% 57%, 2% 35%, 39% 35%);
    margin-top: 10px;
}
.color-picker {
    display: none;
    margin-top: 10px;
}
.button {
    margin-top: 10px;
    padding: 5px 10px;
    cursor: pointer;
}
/* Larger Resolution */
@media only screen and (min-width: 768px) {

.columns {
    width: 30%;
    height: 300px;
}

.all-sections{
    display: flex;
}

label {
    display: inline-block;
}

}