.items-table td {
    color: #2B2A35;
    margin-top: 1px;
    font-size: 18px;
    font-family: Lato, "Helvetica Neue", HelveticaNeue, Helvetica, Arial, sans-serif;
}

.items-table {
    width: 100%;
}

.form-container {
    width: 1188px;
}

.offset-md-3 {
    margin-left: 20%;
}

.form-label {
    color: #2B2A35;
    margin-top: 10px;
    font-size: 15px;
    font-family: Lato, "Helvetica Neue", HelveticaNeue, Helvetica, Arial, sans-serif;
}

.total {
    width: 68.5%;
    margin-left: 21.3%;
    background: white;
    padding-right: 10px;
    color: #2B2A35;
    margin-top: 20px;
    font-size: 18px;
    font-family: Lato, "Helvetica Neue", HelveticaNeue, Helvetica, Arial, sans-serif;
}

.col-md-8 {
    background: white;
}

.col-md-4 {
    background: white;
}

.col-md-2 {
    background: white;
    padding-top: 36px;
}

.col-md-6 {
    background: white;
}

label.chckbox {
    display: contents;
    color: #fafdf4;
    color: #2B2A35;
    margin-top: 10px;
    font-size: 15px;
    font-family: Lato, "Helvetica Neue", HelveticaNeue, Helvetica, Arial, sans-serif;
}

h2#productTitle {
    color: #2B2A35;
    margin-top: 4px;
    font-size: 18px;
    font-family: Lato, "Helvetica Neue", HelveticaNeue, Helvetica, Arial, sans-serif;
    margin-left: 8px;
}

.totaltext {
    margin-left: 55%;
}

@media (min-width: 1024px) and (max-width: 1240px) {
    .form-container {
        width: 995px;
    }

    .col-md-8.support {
        margin-left: 12px !important;
        width: 538px !important;
    }

    button.btn.btn-primary.mt-2 {
        font-size: 13px;
    }

    .totaltext {
        margin-left: 45%;
    }
}


@media only screen and (min-width : 1400px) {
    .form-container {
        width: 1275px;
    }

    .offset-md-3 {
        margin-left: 25%;
    }

    .total {
        margin-left: 24.6%;
        width: 49.8%;
    }

    iframe {
        margin-left: 24.6% !important;
        width: 49.8% !important;
    }

    .support {
        width: 645px !important;
        margin-top: -9px !important;
        margin-left: -5px !important;
    }
}

@media only screen and (min-width : 768px) and (max-width: 1040px) {
    .form-container {
        width: 1032px;
    }

    .support {
        width: 696px !important;
        margin-left: 0% !important;
    }

    iframe {
        margin-left: 0% !important;
        width: 100% !important;
    }

    .offset-md-3 {
        margin-left: 0%;
    }

    .total {
        width: 100%;
        margin-left: 0% !important;
    }
}

@media screen and (max-width: 767px) {
    .form-container {
        width: 357px;
    }

    .offset-md-3 {
        margin-left: 0%;
    }

    .total {
        width: 100%;
        margin-left: 0%;
        display: block;
    }

    iframe {
        margin-left: 0% !important;
        width: 100% !important;
    }

    .support {
        width: 370px !important;
        margin-left: 0% !important;
    }
}

@media only screen and (min-width : 320px) and (max-width: 360px) {
    .form-container {
        width: 284px !important;
    }

    .support {
        width: 351px !important;
        margin-left: 0% !important;
    }

    .total {
        width: 100%;
        margin-left: 0%;
        display: block;
    }

    iframe {
        margin-left: 0% !important;
        width: 100% !important;
        min-width: 0;
    }
}


@media only screen and (min-width : 361px) and (max-width: 375px) {
    .form-container {
        width: 339px;
    }

    .support {
        width: 351px !important;
        margin-left: 0% !important;
    }
}


@media only screen and (min-width : 419px) and (max-width: 440px) {
    .form-container {
        width: 393px;
    }

    .support {
        width: 406px !important;
    }
}


@media only screen and (min-width : 400px) and (max-width: 414px) {
    .form-container {
        width: 379px;
    }

    .support {
        width: 388px !important;
        margin-left: 0% !important;
    }

    .offset-md-3 {
        margin-left: 0%;
    }

    .total {
        width: 100%;
        margin-left: 0%;
        display: block;
    }

    iframe {
        margin-left: 0% !important;
        width: 100% !important;
        min-width: 0 !important;
    }
}

@media only screen and (min-width : 441px) and (max-width: 480px) {
    .form-container {
        width: 389px;
    }

    .offset-md-3 {
        margin-left: 0%;
    }

    .total {
        width: 100%;
        margin-left: 0%;
        display: block;
    }

    iframe {
        margin-left: 0% !important;
        width: 100% !important;
    }

    .support {
        width: 400px !important;
        margin-left: 0% !important;
    }
}
.custom-select {
    width: 100%;
    padding: 10px;
    border: 1px solid #ccc;
    border-radius: 5px;
    font-size: 16px;
    color: #2B2A35;
    background-color: white;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
    transition: border-color 0.3s, box-shadow 0.3s;
}

    .custom-select:focus {
        border-color: #673AB7;
        box-shadow: 0 0 5px rgba(103, 58, 183, 0.5);
        outline: none;
    }
.page-container {
    max-width: 1000px;
    margin: 0 auto 2em auto;
    padding-left: 1em;
    padding-right: 1em;
}

.grid {
    display: block;
}

    .grid > * {
        padding: 1rem;
    }

@media (min-width: 768px) {
    .grid {
        display: grid;
        grid-auto-rows: 1fr;
        grid-template-columns: 1fr 1fr;
    }
}