.new-reservation {
    background: #eae9e7 url(/img/home-back.jpg) center center;
    background-size: cover;
    /*height: 700px;*/
}
.new-reservation .nr-inner {
    max-width: 1360px;
    margin: 0 auto;
    padding-top: 40px;
}
.new-reservation .nr-inner h3 {
    font-weight: 700;
    font-size: 24px;
    line-height: 40px;
    font-family: "Roboto Slab", sans-serif;
    color: #0C0A08;
    text-align: center;
    max-width: 440px;
    margin: 0 auto;
}
.new-reservation .nr-inner .nr-desc {
    font-family: Satoshi, sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 30px;
    max-width: 640px;
    text-align: center;
    margin: 20px auto 0;
    color: #0C0A08;
}
.new-reservation .reservation-button:hover {
    background: #E05200;
    text-shadow: none;
    box-shadow: none;
}
.new-reservation .reservation-button {
    background: #FF640A;
    border: 0;
    margin-top: 32px;
    width: 100%;
    font-family: Satoshi, sans-serif;
    font-weight: 500;
    font-size: 14.8px;
    line-height: 20px;
}

.new-reservation .nr-accept {
    margin-top: 20px;
    display: flex;
    justify-content: center;
}
.new-reservation .nr-accept p a {
    color: #0C0A08;
    font-weight: 700;
}
.new-reservation .nr-accept p {
    font-family: Satoshi, sans-serif;
    font-weight: 400;
    font-size: 14px;
    line-height: 26px;
    color: #55514E;
    margin: 0;
}
.new-reservation .nr-truck-party img {
    height: 200px;
}
.new-reservation .nr-truck-party {
    text-align: center;
    margin-top: 64px;
}
.new-reservation .nr-boxes .nr-box p {
    font-family: Satoshi, sans-serif;
    font-weight: 400;
    font-size: 14px;
    line-height: 26px;
}
.new-reservation .nr-boxes .nr-box img {
    margin-bottom: 4px;
}
.new-reservation .nr-boxes .nr-box h3 {
    font-family: "Roboto Slab", sans-serif;
    font-weight: 700;
    font-size: 20px;
    line-height: 34px;
    width: 100%;
    margin-bottom: 12px;
}
.new-reservation .nr-boxes .nr-box {
    background: #F5F4F4;
    padding: 40px;
    text-align: center;
}
.new-reservation .nr-boxes {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(400px, 1fr));
    border-radius: 8px;
    overflow: hidden;
    grid-gap: 2px;
}

.filters-errors-outline {
    outline: 2px solid #B2001E;
    border-radius: 10px;
}
.new-reservation .filters-top-errors {
    background: #B2001E;
    margin-bottom: 7px;
    padding: 2px 6px 4px 6px;
    color: white;
    opacity: 0.8;
    border-radius: 4px;
    font-family: Satoshi, sans-serif;
    font-weight: 400;
    font-size: 14px;
    line-height: 26px;
    display: none;
}

.nr-form {
    max-width: 640px;
    margin: 32px auto 0;
}
.form-booking {
    position: relative;
}
.nr-form .form-booking > label {
    left: 30px;
    font-weight: 400;
    font-family: Satoshi, sans-serif;
    font-size: 16px;
    color: #55514E;
    width: auto;
}
.form-booking > label {
    position: absolute;
    top: 10px;
    left: 0;
    width: 100%;
    height: 100%;
    padding: 1rem 0.75rem;
    overflow: hidden;
    text-align: start;
    text-overflow: ellipsis;
    white-space: nowrap;
    pointer-events: none;
    border: 1px solid transparent;
    transform-origin: 0 0;
    transition: font-size 0.1s ease-in-out, transform 0.1s ease-in-out, color 0.1s ease-in-out;
}
.form-booking > label {
    font-size: 15px;
    line-height: 22px;
    font-family: "NewMontserrat-Regular", sans-serif;
    padding: 12px 20px 12px 16px;
    color: #80808A;
    height: 52px;
}
.form-booking > .form-select {
    margin-bottom: 0 !important;
}
.form-booking > .form-control:focus {
    border-color: rgba(238, 237, 236, 0.52) !important;
}
.form-booking > .form-control:focus ~ label, .form-booking > .form-control:not(:placeholder-shown) ~ label, .form-booking > .form-control-plaintext ~ label, .form-booking > .form-select ~ label {
    opacity: 1;
    font-size: 13.2px;
    color: #8A8480;
    transform: scale(1) translateY(-1.1rem);
}
.form-booking > .form-control, .form-booking > .form-control-plaintext, .form-booking > .form-select {
    height: calc(5.5rem + 5px);
    line-height: 1.25;
}
.nr-form .form-booking .number-input {
    padding: 25px 47px 0 !important;
    font-size: 16px;
    font-weight: 400;
    font-family: Satoshi, sans-serif;
    color: #0C0A08;
}
.nr-form .form-select, .nr-form .form-booking.select .form-select {
    background-color: transparent !important;
    border-radius: 10px 10px 0 0;
    /*border: 1px solid #E4E4E7;*/
    width: 100%;
    padding: 25px 45px !important;
}
.nr-form .form-booking.select {
    height: 60px;
    background: white url("/img/search.svg") no-repeat 15px 50%;
    border: 1px solid #ECECEE;
    border: 0;
    border-radius: 10px 10px 0 0;
}
.nr-form .filters .form-booking.select .form-select, .nr-form .listings-side .form-booking.select .form-select {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: right 1.75rem center;
    background-size: 16px 12px;
    height: 60px;
}
.nr-form .filters .form-booking.nr-name input {
    background: white url("/img/nr-name.svg") no-repeat 15px 50%;
    border: 0;
    /*border-top: 1px solid rgba(238, 237, 236, 0.52);*/
    box-shadow: none;
    border-radius: 10px 10px 0 0;
    height: 68px;
    margin: 0;
}
.nr-form .filters .form-booking.nr-email input {
    background: white url("/img/nr-email.svg") no-repeat 15px 50%;
    border: 0;
    border-top: 1px solid #e7e5e4;
    box-shadow: none;
    border-radius: 0;
    height: 68px;
    margin: 0;
}
.nr-form .filters .form-booking.nr-phone input {
    background: white url("/img/nr-phone.svg") no-repeat 15px 50%;
    border: 0;
    border-top: 1px solid #e7e5e4;
    box-shadow: none;
    border-radius: 0 0 10px 10px;
    height: 68px;
    margin: 0;
}
.nr-form .filters .form-booking.nr-email {
    border-left: 1px solid white;
    border-right: 1px solid white;
}
.nr-form .filters .form-booking.nr-phone {
    border-left: 1px solid white;
    border-right: 1px solid white;
    border-radius: 0 0 10px 10px;
}

@media(max-width: 991px) {
    .new-reservation .nr-inner {
        padding: 40px 24px;
    }
    .new-reservation .nr-accept p {
        text-align: center;
    }
}

@media(max-width: 450px) {
    .new-reservation .nr-boxes {
        grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    }
    .new-reservation .nr-truck-party img {
        height: unset;
        width: 100%;
    }
}
