@import url('https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300..800;1,300..800&display=swap');

body {
    -webkit-font-smoothing: antialiased;
    -webkit-overflow-scrolling: touch;

    .btn-danger {
        background: #496294;
        border: none;
    }

    .btn-danger:hover, btn-danger::backdrop {
        background: #496294;
        opacity: 0.9;
    }

    .btn-dark {
        color: white;
        border-radius: 1em
    }

    .btn-dark:hover, .btn-dark:focus {
        opacity: 0.5;
    }

    .selectblock:hover, .selectblock:focus {
        rotate: 1deg;
        border-color: #496294;
        border-width: 2px;
        border-style: solid;
    }

    .custominput {
        background: none;
        border: none;
        border-bottom: 1px;
        border-bottom-style: solid;

        font-size: 24px;
    }

    .nb {
        height: 70px;
        margin-left: 20px;

        position: static;
    }

    .nb img {
        height: 23px;
        width: 146px;
    }

    .nb input {
        color: #F4F6F8;
        font-size: 14px;

        background: none;
        outline: #000;
        outline-style: solid;
        outline-width: 1px;

        padding-left: 3vw;
        margin-left: 3vw;
    }

    .nb a {
        padding-right: 24px;

        font-weight: 500;
        font-size: 18px;

        color: #000;
        text-decoration: none;
    }

    .il {
        margin-top: 20px;
        padding-bottom: 2px;
        margin-left: 20px;
    }

    .il h1 {
        font-weight: 600;
        font-size: 48px;
    }

    .il h2 {
        font-weight: 600;
        font-size: 18px;
    }

    .il button {
        font-weight: 600;
    }

.card {
    background-color: white;

    min-height: 200px;
    margin-left: 20px;
    margin-top: 10px;

    border: none;
}

    #sm {
        padding-top: 20px;
        padding-bottom: 5px;
        padding-left: 5px;
    }

    #med {
        padding-top: 10px;
        padding-bottom: 15px;
        padding-left: 10px;
    }

    #lg {
        min-width: 450px;

        padding-top: 10px;
        padding-bottom: 60px;
        padding-left: 10px;
    }

    .card h1 {
        padding-bottom: 10px;

        font-weight: 600;
        font-size: 20px;
    }

    .card h2 {
        font-weight: 600;
        font-size: 14px;

        padding-bottom: 5px;
    }

    .card form {
        padding-bottom: 10px;

        border: none;
        outline: none;
    }

    .card input {
        width: 80%;

        font-weight: 600;
        font-size: 12px;

        background: #F4F6F8;

        border: none;
    }

    .card p {
        font-weight: 200;
        font-size: 12px;

        padding-bottom: 50px;
    }

    #sm p {
        font-weight: 450;
    }

    #lg {
        background: url('/img/banner.png');
    }

    #med p {
        width: 70%;
    }

    #lg h1 {
        font-size: 24px;
        color: #F4F6F8;

        width: 190px;
        padding-bottom: 0;
        margin-bottom: 25%;
        padding-left: 5px;
    }

    .bttns {
        bottom: 10%;
        right:0;

        position: absolute;
    }

    .card a {
        font-weight: 200;
        font-size: 14px;

        margin-right: 1vw;
        min-width: 140px;
        width: 20%;
        max-width: 160px;

    }

    #lg a {
        font-weight: 550;

        background-color: white;
        color: #000;
        border: none;

        left: 5%;
    }

}
