@import url('https://fonts.googleapis.com/css2?family=Courgette&display=swap');

.landinghead        {
    font-family:    Courgette, cursive;
    text-align:     center;
    font-size:      min(7.2vw, 32pt);
}
.landingtext        {
    font-family:    Merriweather, serif;
    text-align:     left;
    font-size:      14pt;
}
.landingform        {
    background:     var(--box-background);
    border:         var(--border);
    border-radius:  var(--border-radius);
    margin:         18px auto;
    padding:        12px 0;
}
.landingform>input  {
    width:          90%;
    margin:         2px auto;
    font-size:      14pt;
}
.landingsmall       {
    background:     var(--box-background);
    border:         var(--border);
    border-radius:  var(--border-radius);
    margin:         18px auto;
    padding:        8px 4px;
    font-size:      10pt;
}

#media              {
    display:        inline-block;
    margin-top:     1vw;
}
#media video        {
    width:          90vw;
    max-width:      400px;
    border:         var(--border);
    border-radius:  var(--border-radius);
}
#benefits, #cta, #testimonials {
    display:        inline-block;
    vertical-align: top;
    margin:         20px 0;
}

#benefits ul {
    list-style: none;
    padding: 0;
}

#benefits ul li {
    background: #e2e2e2;
    margin: 5px 0;
    padding: 10px;
}

#cta                {
    border:         var(--border);
    border-radius:  var(--border-radius);
    padding:        4px 8px;
}

form {
    display: flex;
    flex-direction: column;
    align-items: center;
}

form label {
    margin: 10px 0 5px;
}

form input {
    width:          260px;
    padding: 5px;
    margin-bottom: 10px;
}

form button {
    padding: 10px 20px;
    background-color: #24408F;
    color: white;
    border: none;
    cursor: pointer;
}

form button:hover {
    background-color: #0056b3;
}

blockquote {
    padding-left: 10px;
    font-style: italic;
}