.hero {
    display: flex;
    justify-content: center;
    align-items: center;
    background: linear-gradient(128deg, rgba(0,0,0,0.08476894175639005) 13%, rgba(0,0,0,0.40129555240064774) 44%, rgba(0,0,0,0.6449930313922444) 83%), url(/images/heroBackground.jpg);
    background-size: cover;
    background-position: initial;
    background-repeat: no-repeat;
    color: #fefefe;
    height: 15rem;
}

@media (max-width: 576px) {
    .hero {
        height: 10rem;
    }
}

.hero-title {
    font-size: 4rem;
}

@media (max-width: 576px) {
   .hero-title {
        font-size: 3rem;
    }
}

.booking-box {
  position: relative;
  z-index: 1;
  bottom: 25px;
  background: white;
}


.form-group {
    margin: 15px auto !important;
}

.booking-button-searh {
    width: 100%;
    margin-top: 25px;
}

.margin-top-3n5 {
    margin: 3.5rem auto;
}

@media (max-width: 576px) {
    .margin-top-3n5 {
        margin: 1.5rem auto;
    }
}

body {
    color: #505050;
}

.img-fluid {
    max-width: 100%;
    height: auto;
}

p {
    font-size: 13px !important;
}

ul {
    list-style: none !important;
    padding-left: 8px !important;
}

.margin-y-2 {
    margin-top: 2rem;
    margin-bottom: 2rem;
}

.room-list {
    box-shadow: 0 .5rem 1rem rgba(0,0,0,.15) !important;
    border-radius: .25rem !important;
    padding-bottom: 1.2rem;
    padding-top: 1.2rem;
}

.booking-row {
    margin-left: 0;
    margin-right: 0;
}

.margin-bottom-0 {
    margin-bottom: 0 !important;
}

.paddin-bottom-0 {
    padding-bottom: 0 !important;
}

.text-right {
    text-align: right !important;
}

.text-red {
    color: #ff3c3c !important;
}

.booking-button-container {
    margin-top: 5rem;
}

.booking-button {
    width: 40%;
}

.booking-title {
    display: inline-block;
    margin-right: 7px;
}

@media (max-width: 576px) {
    .booking-button-container {
        margin-top: 1rem;
    }

    .booking-button {
        width: 100%;
    }
}

.badge {
    position: relative;
    top: -3px;
    border-radius: 6px;
}

.btn-link:hover, .btn-link:focus {
    text-decoration: underline;
}

.btn-link {
    color: #166dba !important;
}

.sweet-alert .divbutton {
    background-color: #8cd4f5;
    color: white;
    border: 0;
    box-shadow: none;
    font-size: 15px;
    font-weight: 300;
    -webkit-border-radius: 4px;
    border-radius: 5px;
    padding: 7px 32px;
    margin: 15px 5px 0 5px;
    cursor: pointer
}

    .sweet-alert .divbutton:focus {
        outline: 0;
        box-shadow: 0 0 2px rgba(128,179,235,0.5),inset 0 0 0 1px rgba(0,0,0,0.05)
    }

    .sweet-alert .divbutton:hover {
        background-color: #7ecff4
    }

    .sweet-alert .divbutton:active {
        background-color: #5dc2f1
    }

    .sweet-alert .divbutton.cancel {
        background-color: #c1c1c1
    }

    .sweet-alert .divbutton.cancel:hover {
        background-color: #b9b9b9
    }

    .sweet-alert .divbutton.cancel:active {
        background-color: #a8a8a8
    }

    .sweet-alert .divbutton.cancel:focus {
        box-shadow: rgba(197,205,211,0.8) 0 0 2px,rgba(0,0,0,0.0470588) 0 0 0 1px inset !important
    }

    .sweet-alert .divbutton[disabled] {
        opacity: .6;
        cursor: default
    }

    .sweet-alert .divbutton.confirm[disabled] {
        color: transparent
    }

        .sweet-alert .divbutton.confirm[disabled] ~ .la-ball-fall {
            opacity: 1;
            visibility: visible;
            transition-delay: 0
        }

    .sweet-alert .divbutton::-moz-focus-inner {
        border: 0
    }

    .error {
        color: red;
    }

    .valida {
        color: green;
    }

    .detail-reservation-box {
        box-shadow: 0 .5rem 1rem rgba(0,0,0,.15) !important;
        border-radius: .25rem !important;
    }

    .card-detail p {
        margin-bottom: 0;
    }

    hr {
        margin-top: 15px !important;
        margin-bottom: 15px !important;
    }

    .col-affected {
        margin-left: 10px;
        margin-right: 10px;
    }


.responsive-image {
  object-fit: cover;
  max-height: 220px;
  height: 100%;
  width: 100%;
}