/*#region General CSS  */

/* fonts css */
@font-face {
    font-family: Roboto;
    src: url(/fonts/Roboto-Regular.ttf);
}

@font-face {
    font-family: Roboto-Bold;
    src: url(/fonts/Roboto-Bold.ttf);
}

@font-face {
    font-family: Roboto-Regular;
    src: url(/fonts/Roboto-Regular.ttf);
}

@font-face {
    font-family: Roboto-Light;
    src: url(/fonts/Roboto-Light.ttf);
}

@font-face {
    font-family: Roboto-LightItalic;
    src: url(/fonts/Roboto-LightItalic.ttf);
}

.fw-bold {
    font-family: Roboto-Bold;
    color: black;
}

body h1,
h2,
h3,
h4,
h5,
h6,
p,
a,
button,
div,
span,
small {
    font-family: Roboto;
    overflow-wrap: break-word;
}

.badge-info {
    background-color: #17a2b8;
    position: relative;
    top: 0px;
}

.md-container {
    max-width: 940px;
}

main {
    /* background-image: url(/images/ibiza/ibiza-pattern-layer.png); */
}

/**/
.bx-content h1 {
    font-size: 63px !important;
}

img.navbar-brand {
    width: 250px;
}
/**/
.inner-content {
    background-color: #fff;
}

.cursor-pointer {
    cursor: pointer;
}
/* main-box css */
.main-box-content {
    position: absolute;
    /*top: 40%;*/
    /* top: 50%; */
    top: 60%;
}

    .main-box-content h1 {
        /* font-size: 90px; */
        font-size: 70px;
        /* text-shadow: 0px 0px 6px BLACK; */
    }

/* btn-css */
button.btn.pink-btn {
    border: 3px solid #f42765;
    color: #f42765;
    background: #fff;
}

button.btn.basic-btn {
    border: 3px solid #000;
    color: #000;
    background: #fff;
}

a.btn.basic-btn {
    border: 3px solid #000;
    color: #000;
    background: #fff;
}

/* color css */
.text-pink {
    color: #f42765 !important;
}

.text-black {
    color: #000 !important;
}

.bg-dark-brown {
    background-color: #231f20 !important;
}

.bg-pink {
    background-color: #f42765 !important;
}

.bg-black {
    background-color: #000 !important;
}

.bg-red {
    background-color: #ee1d24 !important;
}

.bg-green {
    background-color: #159447 !important;
}

.border-pink {
    border-color: #f42765 !important;
}

.border-black {
    border-color: #000 !important;
}

.heading-shadow {
    text-shadow: 3px 4px BLACK;
}

.text-shadow {
    text-shadow: 2px 1px BLACK;
}

.text-green {
    color: #159447 !important;
}

body > main > div.footer.py-3 > footer > div > div:nth-child(1) > img {
    width: 90%;
}

.pay-rego-fee-btns {
    width: 205px;
}

/*#endregion General CSS  */

/*#region Nav Bar CSS  */
.find-job-btn {
    letter-spacing: 3px;
}

/*#endregion Nav Bar CSS  */

/*#region BG IMAGES CSS  */
.pink-ibiza-overlay {
    background-image: url(/images/ibiza/ibiza-pattern-layer-3.png);
}

.main-ibiza-overlay {
    background-image: url(/images/ibiza/ibiza-pattern-layer.png);
}

.background-size-contain {
    background-size: contain;
}

.background-size-cover {
    background-size: cover;
}
/*#endregion BG IMAGES CSS  */

/*#region Signup Modal CSS */

/* signup modal css */
.modal .form-section {
    width: 40%;
    margin: 0 auto;
}

.modal h1.fw-bold.text-pink {
    font-size: 4.6vw;
}

@media only screen and (max-width: 767px) {

    body > main > div.footer.py-3 > footer > div > div:nth-child(1) > img {
        width: 50%;
    }

    footer li.list-group-item a.text-pink {
        font-family: "Roboto-Light" !important;
    }

    footer li + li::before {
        content: " | ";
        color: #f42765;
    }

    .iconbox-style-1 .bx-content h1 {
        font-size: 43px !important;
        text-align: center !important;
    }

    ul.list-group.border-0 {
        display: block;
        float: left !important;
        width: 100%;
    }

    li.list-group-item.border-0.p-0 {
        display: inline;
        margin: 0px 10px;
        background: transparent;
    }
    /* h1.fw-bold.text-pink.main-banner {
    font-size: 55px !important;
    line-height: 55px;
    word-spacing: 1px;
    position: relative;
    top: -60px;
  }  */
    /* h1.fw-bold.text-pink {
    font-size: 32px !important;
    line-height: 50px;
  } */
    h1.fw-bold.text-white.main-banner {
        /*font-size: 40px !important;*/
        font-size: 36px !important;
        line-height: 55px;
        word-spacing: 1px;
        position: relative;
        /* Commented -60 px because text of banner HIRE MODELS is overlap eye of the model */
        /* top: -60px; */
        top: 0;
        /* text-shadow: 0px 0px 4px #000 */
    }

    h1.fw-bold.text-white {
        font-size: 32px !important;
        line-height: 50px;
    }

    .section-3 .iconbox-style-1 .bg-img {
        width: 80% !important;
        justify-content: center;
    }

    .section-3 .bx-content p {
        text-align: center !important;
    }

    .signupModal {
        width: 100% !important;
        padding: 0 !important;
    }

        .signupModal .modal-fullscreen {
            width: 100% !important;
        }

            .signupModal .modal-fullscreen .form-section {
                width: 100%;
                margin: 0 auto;
            }

                .signupModal .modal-fullscreen .form-section .text-sm-start {
                    text-align: left !important;
                }

                .signupModal .modal-fullscreen .form-section br {
                    display: none;
                }

    .signinModal {
        width: 100% !important;
        padding: 0 !important;
    }

        .signinModal .modal-fullscreen {
            width: 100% !important;
        }

            .signinModal .modal-fullscreen .form-section {
                width: 100%;
                margin: 0 auto;
            }

                .signinModal .modal-fullscreen .form-section .text-sm-start {
                    text-align: left !important;
                }

                .signinModal .modal-fullscreen .form-section br {
                    display: none;
                }
}

.text-danger {
    font-family: Roboto;
    font-size: 13px;
    color: #f42765;
}

/* .modal .form-section label small {
  display: block;
} */

/* signup modal css end */
/*#endregion Signup Modal CSS */

/*#region Form CSS */
/* form css */
.form-section input[type="text"],
.form-section input[type="email"],
.form-section input[type="tel"],
.form-section input[type="password"],
.form-section select {
    border-bottom: 1px solid #000 !important;
    border-radius: 0;
    border: none;
    font-size: 13px;
}

.form-section textarea {
    font-size: 13px;
}

.form-section label {
    font-size: 13px;
    text-transform: uppercase;
}

@media only screen and (max-width: 767px) {
    .popup .form-section .form-check {
        font-size: 13px !important;
    }

    .popup .form-section label {
        font-size: 13px;
        text-transform: uppercase;
    }

    .form-section label {
        font-size: 10px;
        text-transform: uppercase;
    }
}

.form-section input[type="text"]:focus,
.form-section select:focus {
    box-shadow: none;
}

textarea.form-control {
    border: 1px solid;
    resize: none;
    border-radius: 0;
}

.form-section input::placeholder {
    font-size: 13px;
}

.k-widget.k-timepicker.k-header.form-select {
    padding: 0;
    border: none !important;
    box-shadow: none !important;
}

    .k-widget.k-timepicker.k-header.form-select span.k-picker-wrap {
        background: none;
        border: none;
        border-bottom: 1px solid;
    }

        .k-widget.k-timepicker.k-header.form-select span.k-picker-wrap input#strStartTime {
            background: none !important;
            border: none !important;
        }

        .k-widget.k-timepicker.k-header.form-select span.k-picker-wrap:hover {
            background: none !important;
            box-shadow: none !important;
        }

.k-autocomplete.k-state-focused,
.k-dropdown-wrap.k-state-focused,
.k-multiselect.k-header.k-state-focused,
.k-numeric-wrap.k-state-focused,
.k-picker-wrap.k-state-focused,
.k-textbox:focus {
    box-shadow: none;
}
/* switch btn css */
.switch-btn .switch {
    position: relative;
    display: inline-block;
    width: 80px;
    height: 25px;
}

    .switch-btn .switch input {
        opacity: 0;
        width: 0;
        height: 0;
    }

.switch-btn .slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #f993b2;
    -webkit-transition: 0.4s;
    transition: 0.4s;
}

    .switch-btn .slider:before {
        position: absolute;
        content: "";
        height: 25px;
        width: 35px;
        left: 1px;
        border-radius: 25px !important;
        bottom: 0px;
        background-color: #f42765;
        -webkit-transition: 0.4s;
        transition: 0.4s;
        border: 1px solid;
    }

.switch-btn input:checked + .slider {
    background-color: #f993b2;
}

.switch-btn input:focus + .slider {
    box-shadow: 0 0 1px #2196f3;
}

.switch-btn input:checked + .slider:before {
    -webkit-transform: translateX(35px);
    -ms-transform: translateX(35px);
    transform: translateX(35px);
}

/* Rounded sliders */
.switch-btn .slider.round {
    border-radius: 34px;
}

    .switch-btn .slider.round:before {
        border-radius: 50%;
    }
/* table css */
.view-jobs-tab .table > thead {
    border-bottom: 2px solid #787777 !important;
}

/* tabs btns css */
.tab-btns-section .btn {
    border: 2px solid #f42765;
}
/*#endregion Form CSS */

/*#region HOMEPAGE CSS */
/* ################################# HOMEPAGE CSS ################################ */

.home-main-banner {
    background-image: url("/images/ibiza/home-banner-one-new.jpg");
    height: 85vh;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    position: relative;
}

.home-main-banner-two {
    background-image: url("/images/ibiza/home-banner-two-new.jpg");
    height: 85vh;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    position: relative;
    
}

.home-main-banner-three {
    background-image: url("/images/ibiza/home-banner-three-new.jpg");
    height: 85vh;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    background-position-y: -370px;
    position: relative;
    
}

.home-main-banner-four {
    background-image: url("/images/ibiza/home-banner-four.jpg");
    /*height: 85vh;*/
    height: 125vh;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    /*background-position-y: -370px;*/
    background-position-y: -110px;
    position: relative;
}

@media only screen and (max-width: 767px) {
    .home-main-banner-two {
        height: 475px;
    }
    .home-main-banner-three {
        height: 475px;
        background-position-y: 0px;
    }
    .home-main-banner-four {
        height: 475px;
        background-position-y: 0px;
    }

}
/* intro section css */
.intro-content h1 {
    /* font-size: 63px; */
    /*font-size: 50px;*/
    font-size: 44px;
    font-family: 'Roboto-Bold';
}

.intro-content p {
    font-size: 18px;
    line-height: 22px;
    margin: 0px 5%;
}

.intro-content div {
    font-size: 20px;
    line-height: 26px;
    margin: 0px 5%;
}

@media only screen and (max-width: 767px) {
    .intro-content p {
        font-size: 16px;
    }
}
/* stats section css */
.stats-section .countbx {
    border: 3px solid #f42765;
    padding: 0px 20px 5px 20px;
}

    .stats-section .countbx h5 {
        font-size: 50px;
        margin: 0;
    }

    .stats-section .countbx span {
        font-size: 35px;
        line-height: 20px;
    }

/* sectionthree css */
.section-3 .icon img {
    width: 90px;
}

.section-3 .img-box-bg-1 {
    background-image: url("/images/ibiza/img-box-bg-1.jpg");
}

.section-3 .PS-faded-icon {
    background-image: url("/images/ibiza/PS-faded-icon.png");
    /* background-image: url("/images/ibiza/PS-t2.png"); */
}

.section-3 .PS-t {
    background-image: url("/images/ibiza/PS-t.png");
}

.section-3 .PS-t2 {
    background-image: url("/images/ibiza/PS-t2.png");
}

.section-3 .img-box-bg-2 {
    background-image: url("/images/ibiza/img-box-bg-2.jpg");
}

.section-3 .partistaff-faded-text-bg {
    background-image: url("/images/ibiza/partistaff-faded-text-bg.png");
}

.section-3 .partistaff-faded-pink-bg {
    background-image: url("/images/ibiza/PS-faded-pink.png");
}

.section-3 .partistaff-watermark-bg {
    background-image: url("/images/ibiza/partistaff-watermark.png");
}

.section-3 .img-box-bg-3 {
    background-image: url("/images/ibiza/img-box-bg-3.jpg");
}

.section-3 .PS-faded-pink {
    background-image: url("/images/ibiza/PS-faded-pink.png");
}

.section-3 .img-box-bg-4 {
    background-image: url("/images/ibiza/img-box-bg-4.png");
}

.section-3 .yatch-bg {
    background-image: url("/images/ibiza/yatch-bg.jpg");
}

.section-3 .yatch2-bg {
    background-image: url("/images/ibiza/yatch2-bg.jpg");
}

.section-3 .jet-bg {
    background-image: url("/images/ibiza/jet-bg.jpg");
}

.section-3 .vila-bg {
    background-image: url("/images/ibiza/vila-bg.jpg");
}

.section-3 .vila2-bg {
    background-image: url("/images/ibiza/vila2-bg.jpg");
}

.section-3 .jet2-bg {
    background-image: url("/images/ibiza/jet2-bg.jpg");
}

.section-3 .jet3-bg {
    background-image: url("/images/ibiza/jet3-bg.jpg");
}

.section-3 .farm-house-bg {
    background-image: url("/images/ibiza/farm-house-bg.jpg");
    background-position: unset !important;
}

.section-3 .fast-jetski-bg {
    background-image: url("/images/ibiza/fast-jetski-bg.jpg");
    background-position: unset !important;
}

.section-3 .ferrari-bg {
    background-image: url("/images/ibiza/ferrari-bg.png");
    background-position: unset !important;
}

.section-3 .concert-bg {
    background-image: url("/images/ibiza/concert-bg.jpg");
    background-position: unset !important;
}

.section-3 .bg-img {
    padding: 45px 13px !important;
}

.section-3 .iconbox-style-1 .bg-img {
    background-size: contain;
    display: flex;
    /* width: 400px; */
    flex-direction: column;
    margin: 0 auto;
    vertical-align: middle;
    width: 80%;
}

.section-3 .bg-img {
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    height: 100%;
}

.section-3 .flex-box-item {
    width: 33.33%;
    /* height: 500px; */
    height: 380px;
}

    .section-3 .flex-box-item.below-heading h1 {
        font-size: 55px;
        line-height: 52px;
    }

    .section-3 .flex-box-item.above-heading h1 {
        font-size: 55px;
        line-height: 52px;
    }

.section-3 .bx-content p {
    font-size: 18px;
    padding: 0 10px;
    font-family: "Roboto-Light";
    line-height: 20px;
}

.slider-section .intro-content p {
    font-size: 18px;
    padding: 0 10px;
    font-family: "Roboto-Light";
    line-height: 20px;
}

.section-3 .flex-box-item .bx-action-btn button {
    border: 3px solid;
}

.section-3 .flex-box-item .bx-action-btn a {
    border: 3px solid;
}
/* category section css */
/* separator with heading css */
.category-items .cat-img-1 {
    background-image: url("/images/ibiza/cat-img-1.png");
}

.category-items .cat-img-2 {
    background-image: url("/images/ibiza/cat-img-2.png");
}

.category-items .cat-img-3 {
    background-image: url("/images/ibiza/cat-img-3.png");
}

.category-items .cat-img-4 {
    background-image: url("/images/ibiza/cat-img-4.png");
}

.category-items .cat-img-5 {
    background-image: url("/images/ibiza/cat-img-5.png");
}

.category-items .c-item-bx {
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
    width: 180px;
    height: 180px;
}

.ba-doted-separator {
    margin: 0 25px;
}

.ba-doted-separator-dark {
    margin: 0 25px;
    letter-spacing: 3px;
}
/* banner section css */
.banner-section .ban-heading h1 {
    font-size: 63px;
    font-family: 'Roboto-Bold';
}

.banner-section p {
    font-size: 18px;
    font-family: "Roboto-Light";
}

.bg-img.ibz-bg-logo-dark {
    background: #241e20;
}

    .bg-img.ibz-bg-logo-dark .bnr-content {
        background-image: url(/images/ibiza/partistaff-faded-text-bg-2.png);
        background-position: center;
        background-repeat: no-repeat;
        background-size: contain;
        height: 300px;
    }

.bnr-action-btn button {
    border: 4px solid;
    font-size: 28px;
}

.banner-section.sunset-bg {
    background-image: url(/images/ibiza/sunset-bg.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: inherit;
    height: 700px;
}

    .banner-section.sunset-bg h1 {
        font-size: 50px;
    }

/* testimonial section css */
.testimonials-section {
    background-image: url(/images/ibiza/ibiza-pattern-layer-3.png);
    /* background-position: center; */
    background-size: contain;
    /* background-repeat: no-repeat; */
}

    .testimonials-section h1 {
        font-size: 63px;
    }

    .testimonials-section h5 {
        font-size: 19px;
    }

    .testimonials-section p {
        font-size: 16px;
        margin: 0px 1%;
    }


/* legal section css */
.legal-section {
    background-image: url(/images/ibiza/ibiza-pattern-layer-3.png);
    /* background-position: center; */
    background-size: contain;
    /* background-repeat: no-repeat; */
}

    .legal-section h1 {
        font-size: 63px;
    }

    .legal-section h5 {
        font-size: 19px;
    }

    .legal-section p {
        font-size: 16px;
        margin: 0px 1%;
    }
/* slick clide css */

.slider {
    width: 90%;
    margin: 0 auto;
}

.slick-slide {
    margin: 0px 5px;
}

    .slick-slide img {
        width: 100%;
    }

.slick-prev:before,
.slick-next:before {
    color: black;
}

.slick-slide {
    transition: all ease-in-out 0.3s;
}

/* .slider {
  width: 80%;
  margin: 0 auto;
}
.slick-slide {
  margin: 0px 15px;
}

.slick-slide img {
  width: 100%;
}

.slick-prev:before,
.slick-next:before {
  color: #f42765;
}

.slick-slide {
  transition: all ease-in-out 0.3s;
} */
/* staff rating css */
.staff-rating-slider .reviews-bx {
    display: none;
    position: absolute;
    top: 35%;
    left: 0;
    right: 0;
    z-index: 1;
}

.staff-rating-slider .img-bx {
    cursor: pointer;
    border: 4px solid #f42765;
}

    .staff-rating-slider .img-bx:hover img {
        opacity: 0.7;
    }

    .staff-rating-slider .img-bx:hover + .reviews-bx {
        display: block;
        transition: all ease-in-out 0.3s;
    }
/* cta css */

.cta-form input::placeholder {
    color: #fff;
}

.cta-form button {
    border: 3px solid #f42765;
    background: #fff;
    color: #f42765;
    font-size: 22px;
}

/* contactus section */
/* .contact-us-section {
  background-image: url("/images/ibiza/flamingo-tube-bath.png");
  background-repeat: no-repeat;
  background-size: contain;
  background-position: right;
} */
.contact-side-img {
    position: absolute;
    right: 0;
    bottom: 0;
    width: 28%;
}

    .contact-side-img img {
        width: 100%;
    }
/* footer css */
input.subs-email-fields {
    border: 0;
    border-bottom: 2px dotted #f42765;
    margin: 10px 0px;
}

    input.subs-email-fields input:focus {
        outline: none;
        border: none;
    }
/* footer css starts*/
footer img.footer_logo {
    width: 220px;
}

.footer {
    background-image: url(/images/ibiza/ibiza-pattern-layer-4.png);
    background-size: cover;
    background-position: bottom;
}

footer li.list-group-item {
    background: transparent;
}

    footer li.list-group-item a.text-pink {
        font-family: "Roboto-Light" !important;
        font-size: 13px;
    }

footer h6.fw-bold {
    letter-spacing: 2px;
}

.footer-bottom {
    background: rgb(240 240 240 / 60%);
    width: 100vw;
}

    .footer-bottom p {
        font-size: 14px;
        word-spacing: 2px;
        text-transform: capitalize;
        margin: 5px;
    }

        .footer-bottom p a {
            color: #f42765;
            font-size: 16px;
            text-decoration: none;
        }

    .footer-bottom span {
        text-transform: capitalize;
        font-weight: 700;
    }
/* footer css ends*/

.intro-section {
    background-image: url(/images/ibiza/ibiza-pattern-layer.png);
    background-size: cover;
}

@media only screen and (max-width: 767px) {
    .testimonials-section h1 {
        font-size: 36px;
    }

    .my-main-navbar button.navbar-toggler {
        border: none;
        margin: 2% 0;
    }

    .testimonials-section p {
        font-size: 10px;
        margin: 0px 0px !important;
    }

    .testimonials-section h5 {
        font-size: 12px;
    }

    .testimonials-section h4 {
        font-size: 18px;
    }

    .legal-section h1 {
        font-size: 36px;
    }


    .legal-section p {
        font-size: 10px;
        margin: 0px 0px !important;
    }

    .legal-section h5 {
        font-size: 12px;
    }

    .legal-section h4 {
        font-size: 18px;
    }

    .my-main-navbar {
        margin: 0 0;
    }

    .home-main-banner {
        height: 475px;
    }

        .home-main-banner .ps-icon img {
            display: none;
        }

    .main-box-content h1 {
        font-size: 40px !important;
        /* padding: 15px; */
    }
    /* section-one css */

    section.intro-section h1 {
        /*font-size: 40px;*/
        font-size: 36px;
    }

    .stats-section {
        margin: 30px 0;
    }

        .stats-section .countbx {
            width: 25%;
            padding: 0;
        }

            .stats-section .countbx h5 {
                font-size: 30px;
            }

            .stats-section .countbx span {
                font-size: 16px;
            }

    /* section-second css */

    .section-3 {
        margin: 0px 0;
    }

        .section-3 .flex-box-item {
            width: 100%;
            height: 340px;
        }

        .section-3 .iconbox-style-1 .bg-img {
            padding: 0 !important;
        }

        .section-3 .flex-box-item.iconbox-style-1 {
            text-align: center !important;
            height: 400px;
            padding-right: 0 !important;
            padding-left: 0 !important;
        }

            .section-3 .flex-box-item.iconbox-style-1 .icon img {
                width: 70px;
                height: 70px;
            }
    /* slider section css */
    .slider-section .centeral-heading img {
        width: 15%;
        object-fit: contain;
    }

    .slick-slide div div {
        margin: 0 !important;
    }

    .slick-arrow {
        display: none !important;
    }

    .slick-dots li {
        background: none;
    }

        .slick-dots li button:before {
            color: #f42765;
            opacity: 1;
        }
    /* banner section css */
    .banner-section {
        padding: 50px 0px !important;
    }

        .banner-section.sunset-bg {
            background-position: center;
            height: 600px;
        }

        .banner-section .bnr-content {
            padding: 0 !important;
        }

            .banner-section .bnr-content .centeral-heading img {
                width: 15%;
                object-fit: contain;
            }

    .ban-heading h1 {
        font-size: 64px !important;
        line-height: 65px;
        font-weight: bold;
    }

    .bg-img.ibz-bg-logo-dark .bnr-content {
        height: 400px;
    }

    .bnr-action-btn.text-center {
        margin: 15px 0;
    }
    /* testimonials css */
    .testimonials-section {
        padding: 20px !important;
    }

        .testimonials-section .testi-text {
            width: 100% !important;
            padding: 0 !important;
        }

        .testimonials-section b {
            font-size: 15px;
            margin: 10px 0;
            display: block;
        }

    /* legal css */
    .legal-section {
        /* padding: 20px !important; */
    }

        .legal-section .testi-text {
            width: 100% !important;
            padding: 0 !important;
        }

        .legal-section b {
            font-size: 15px;
            margin: 10px 0;
            display: block;
        }
    /* form-section css */
    .cta-form {
        width: 100% !important;
        padding: 0 !important;
    }

        .cta-form button {
            font-size: 13px;
        }

        .cta-form input {
            font-size: 13px !important;
        }

    .contact-side-img {
        position: relative;
        width: 100%;
    }

    .mbl-hide {
        display: none;
    }
}

div#infographic div {
    display: flex;
    justify-content: center;
}

div#infographic img {
    width: 70%;
}

.section-FAQ button.accordion-button {
    font-weight: 600;
    font-size: 22px;
}

    .section-FAQ button.accordion-button.collapsed {
        background-color: transparent;
        color: #000000;
    }

.section-FAQ .accordion-body {
    font-size: 1.2rem;
}

.section-FAQ .nav-link {
    color: #000;
}

    .section-FAQ .nav-link.active {
        color: #f42765;
    }

.section-FAQ .accordion-item {
    border-bottom: var(--bs-accordion-border-width) solid #000000;
}

.section-FAQ .nav-pills .nav-link {
    border-bottom: 3px solid #000;
}

.section-FAQ .nav-link.active {
    border-bottom: 3px solid #f42765;
}

.section-FAQ .accordion-button:not(.collapsed)::after {
    background-image: url('/images/ibiza/accordion-arrow.svg');
}


.section-FAQ .accordion-button::after {
    background-image: url('/images/ibiza/accordion-arrow.svg');
}

.accordion-button:focus {
    box-shadow: none;
}

.accordion-body a {
    color: #000;
    font-weight: bold;
}

/*########################## HOME PAGE CSS END ################################# */
/*#endregion HOMEPAGE CSS */

/*#region CONCIERGE PAGE CSS */
/* #################################   CONCIERGE PAGE CSS    ############################################ */
.concierge-main-banner {
    background-image: url("/images/ibiza/concierge-banner-img.jpg");
    height: 700px;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: inherit;
    position: relative;
}

.concierge-intro-section.bg-img .bnr-content {
    background-image: url("/images/ibiza/ibz-bg-logo-white-paded.jpg");
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    /* height: 300px; */
}

.bnr-content.p-5 .ban-heading {
    width: 70%;
    margin: 0 auto;
}

.concierge-intro-section h1 {
    font-size: 55px !important;
}

.concierge-intro-section .bnr-content p {
    font-size: 18px;
}

.concierge-intro-section .bnr-content button {
    font-size: 22px;
}

.concierge-page .section-3 .bg-img {
    padding: 30px 40px;
}

.concierge-page .before-footer {
    background-image: url("/images/ibiza/ibiza-pattern-layer-3.png");
    background-size: cover;
}

    .concierge-page .before-footer p {
        font-size: 40px;
        font-family: "Roboto-Light";
    }

    .concierge-page .before-footer h1 {
        font-size: 4rem;
    }

    .concierge-page .before-footer h2 {
        font-size: 3rem;
    }

@media only screen and (max-width: 1024px) {
    .concierge-page .before-footer h2 {
        font-size: 1.5rem;
        margin-bottom: 1px;
    }
    /* .concierge-intro-section h1 {
    font-size: 45px;
  } */

    .concierge-main-banner {
        height: 375px;
        background-size: cover;
    }

    .concierge-intro-section.bg-img .bnr-content {
        background-position: top;
        background-size: contain;
        background-repeat: no-repeat;
    }

    .concierge-intro-section .bnr-content p {
        font-size: 16px;
        line-height: 18px;
    }

    .concierge-page .section-3 .bg-img {
        padding: 20px;
    }

    .ba-doted-separator-dark {
        font-size: 15px;
        letter-spacing: 3px;
    }

    .bg-img.ibz-bg-logo-dark .bnr-content {
        background-image: url(/images/ibiza/partistaff-faded-text-bg.png);
        background-position: center;
        background-repeat: no-repeat;
        background-size: 65%;
        height: 400px;
    }
}

@media only screen and (max-width: 767px) {
    .bnr-content.p-5 .ban-heading {
        width: 100% !important;
    }

    .concierge-intro-section h1 {
        font-size: 30px !important;
        line-height: 35px;
    }

        .concierge-intro-section h1 br {
            display: none;
        }

    .concierge-page .section-3 .bg-img h1 {
        font-size: 40px;
    }

    .concierge-page section.banner-section.sunset-bg {
        display: flex;
        align-items: center;
        background-size: cover;
        height: 400px;
        background-position: center center;
    }

    .concierge-page .before-footer {
        padding: 20px !important;
    }

        .concierge-page .before-footer h1 {
            font-size: 35px;
        }

        .concierge-page .before-footer p {
            font-size: 30px;
        }
}
/*#endregion CONCIERGE PAGE CSS */

/*#region CONCIERGE ENQUIRY PAGE CSS */

.conciergeEnquiryModal .modal-body .logo-img img {
    width: 80%;
}

.conciergeEnquiryModal .form-section {
    width: 60%;
    margin: 0 auto;
}

.conciergeEnquiryModal{
    position: sticky;
}

    .conciergeEnquiryModal .form-section label {
        font-size: 24px;
        letter-spacing: 3px;
        /* font-family: Roboto-Light; */
    }

    .conciergeEnquiryModal .form-section .form-check {
        margin-bottom: 18px;
        padding: 0 !important;
        display: flex;
        align-items: baseline;
        gap: 12px;
    }

        .conciergeEnquiryModal .form-section .form-check .form-check-input[type="radio"] {
            border-radius: 0;
            border: 1px solid;
        }

    .conciergeEnquiryModal .form-section .form-check-label {
        text-transform: initial;
        font-family: Roboto;
    }

    .conciergeEnquiryModal .form-section textarea.form-control::placeholder {
        font-family: "Roboto-Light";
        font-size: 24px;
        font-style: italic;
    }

.conciergeEnquiryModal .submit-btn-row button {
    font-size: 25px;
    letter-spacing: 5px;
}

.conciergeEnquiryModal .regarding-text h4 {
    line-height: 38px;
    font-size: 30px;
}

.conciergeEnquiryModal .create-account-btn a {
    font-family: "Roboto-Light";
}

.conciergeEnquiryModal .enquire-about-label {
    flex: 0 0 auto;
    width: 33.33333333%;
}

.conciergeEnquiryModal .enquire-about-field {
    flex: 0 0 auto;
    width: 66.66666667%;
}

@media only screen and (max-width: 767px) {
    .conciergeEnquiryModal .form-section {
        width: 100%;
    }

    .conciergeEnquiryModal .modal-body .logo-img img {
        width: 50%;
    }

    .conciergeEnquiryModal .form-section label {
        font-size: 13px;
    }

    .conciergeEnquiryModal .form-section .form-check {
        align-items: center;
        margin-bottom: 2px;
        display: flex;
        text-align: left;
    }

        .conciergeEnquiryModal .form-section .form-check .form-check-input[type="radio"] {
            margin-left: 0px;
            margin-right: 5px;
        }

    .conciergeEnquiryModal .form-section .form-check-label {
        letter-spacing: inherit;
    }

    .conciergeEnquiryModal .regarding-text h4 {
        font-size: 18px;
        line-height: 20px;
    }

    .conciergeEnquiryModal .form-section textarea.form-control::placeholder {
        font-size: 14px;
    }

    .conciergeEnquiryModal .submit-btn-row button {
        font-size: 20px;
        letter-spacing: 5px;
    }

    .conciergeEnquiryModal .remove-br br {
        display: none;
    }
}

/*#endregion CONCIERGE ENQUIRY PAGE CSS */

/*#region PRIVATE CLIENT MODELS PAGE CSS */
/* #################################   PRIVATE CLIENT MODELS PAGE CSS STARTS    ############################################ */
.pcm-main-banner {
    background-image: url("/images/ibiza/find-staff-banner-bg.jpg");
    height: 700px;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: inherit;
    position: relative;
}

.pcm-intro-section.bg-img .bnr-content {
    background-image: url("/images/ibiza/partistaff-faded-text-pink-bg.png");
    background-color: #ffcccc;
    background-position: center;
    background-repeat: no-repeat;
    background-size: 85%;
    /* height: 300px; */
}

.pcm-main-banner .ps-icon img {
    width: 70px;
}

.pcm-intro-section .faded-text-pink {
    left: 0;
    right: 0;
}

.pcm-intro-section div img {
    width: 100%;
    opacity: 0.04;
}

.pcm-intro-section h1 {
    font-size: 55px !important;
}

.pcm-intro-section .bnr-content p {
    font-size: 18px;
}

.pcm-intro-section .ban-heading h5 {
    line-height: 35px;
}

    .pcm-intro-section .ban-heading h5.para-text {
        margin: 0px 20%;
    }

    .pcm-intro-section .ban-heading h5.para-text-second {
        margin: 0px 26%;
    }

.pcm-main-banner.faded-text-pink {
    left: 0;
    right: 0;
}
/* #################################   PRIVATE CLIENT MODELS PAGE CSS STARTS    ############################################ */
/*#endregion PRIVATE CLIENT MODELS PAGE CSS */

/*#region BOOKER AGENTS PAGE CSS */
/* #################################   BOOKER AGENTS PAGE CSS STARTS    ############################################ */

.ba-main-banner {
    background-image: url("/images/ibiza/ba-main-banner.jpg");
    height: 700px;
    background-repeat: no-repeat;
    background-size: cover;
    /* background-position: ; */
    position: relative;
}

.ba-intro-section.bg-img .bnr-content {
    background-image: url("/images/ibiza/partistaff-faded-text-pink-bg.png");
    background-color: #fff;
    background-position: center;
    background-repeat: no-repeat;
    background-size: 85%;
    /* height: 300px; */
}

.ba-main-banner .ps-icon img {
    width: 70px;
}

.ba-intro-section .faded-text-pink {
    left: 0;
    right: 0;
}

.ba-intro-section div img {
    width: 100%;
    opacity: 0.04;
}

.ba-intro-section h1 {
    font-size: 55px !important;
}

.ban-heading .heading-desc {
    width: 60%;
    margin: 0 auto;
    font-size: 17px;
}

.ba-intro-section .bnr-content p {
    font-size: 18px;
}

.ba-intro-section .ban-heading h5 {
    line-height: 35px;
}

    .ba-intro-section .ban-heading h5.para-text {
        margin: 0px 20%;
    }

.ba-main-banner.faded-text-pink {
    left: 0;
    right: 0;
}
/* #################################   BOOKER AGENTS PAGE CSS ENDS    ############################################ */
/*#endregion BOOKER AGENTS PAGE CSS */

/*#region LEARN MORE PAGE CSS */
/* #################################   LEARN MORE PAGE CSS STARTS    ############################################ */
.learn-more-page .bnr-content.p-5 .ban-heading {
    width: 70%;
    margin: 0 auto;
}

.learn-more-page .signup-section {
    /* width: 940px; */
    margin: 30px 30px;
    background: #fff;
    position: relative;
    left: 0;
    right: 0;
    top: 25%;
}

.learn-more-page .section-3 .bg-img {
    padding: 30px 40px;
}

.learn-more-page .before-footer {
    background-image: url("/images/ibiza/ibiza-pattern-layer.png");
    background-size: contain;
}

    .learn-more-page .before-footer p {
        font-size: 40px;
        font-family: "Roboto-Light";
    }

    .learn-more-page .before-footer h1 {
        font-size: 4rem;
    }

    .learn-more-page .before-footer h2 {
        font-size: 3rem;
    }

.learn-more-page .form-section label {
    font-size: inherit;
    text-transform: uppercase;
    letter-spacing: 2px;
}

.learn-more-page .signup-button {
    letter-spacing: 10px;
    line-height: 40px;
    font-size: 24px;
}

.learn-more-page .signup-section .form-check-input {
    border-radius: 0px;
    border: 1px solid #000;
}

@media only screen and (max-width: 767px) {
    .ba-main-banner {
        height: 400px;
        background-position: center;
    }

    .pcm-main-banner {
        height: 400px;
        background-position: center;
    }

    .learn-more-page .signup-section {
        margin: 0;
    }

    .ba-intro-section h1 {
        font-size: 36px !important;
        line-height: 40px;
    }

    .pcm-intro-section h1 {
        font-size: 36px !important;
        line-height: 40px;
    }

    .ban-heading .heading-desc {
        width: 100%;
    }

    .signup-section .ps-black-logo {
        width: 60%;
    }

    .learn-more-page .form-section label {
        font-size: 12px;
    }

    .learn-more-page .signup-button {
        font-size: 12px;
        letter-spacing: 2pz;
    }

    .learn-more-page .cta-form {
        width: 80% !important;
        padding: 0 !important;
    }

    .learn-more-page .subs-form-sec h4 {
        font-size: 15px;
    }

    .terms-agree-text a small {
        line-height: 16px;
        display: block;
        font-size: 12px;
    }

    .pcm-main-banner .ps-icon img {
        display: none;
    }

    .ba-main-banner .ps-icon img {
        display: none;
    }

    .learn-more-hr {
        opacity: 1 !important;
        margin: 10px 50px;
        border-top: 2px solid #000;
        padding: 5px;
    }
}
/* #################################   LEARN MORE PAGE CSS ENDS  ############################################ */
/*#endregion LEARN MORE PAGE CSS */

/*#region INNER PAGES CSS */
/*################################# INNER PAGES CSS   ############################################## */
main.inner-page {
    /* background-image: url(/images/ibiza/ibiza-pattern-layer.png); */
    position: absolute;
    width: 100%;
}

    main.inner-page .my-main-navbar nav.navbar {
        padding: 1.5rem;
    }
/*#endregion INNER PAGES CSS */

/*#region INNER PAGES HOME CSS */
/*################################# INNER PAGES HOME CSS   ############################################## */
main.inner-page-home {
    /* background-image: url(/images/ibiza/ibiza-pattern-layer.png); */
    position: absolute;
    width: 100%;
}

    main.inner-page-home .my-main-navbar nav.navbar {
        padding: 1.5rem;
    }

@media only screen and (max-width: 767px) {
    main.inner-page-home .my-main-navbar nav.navbar {
        /* padding-top: 1rem; */
        padding: 15px 0;
        justify-content: start;
        align-items: start !important;
    }

        main.inner-page-home .my-main-navbar nav.navbar a.logo-anchor {
            margin: 0 auto;
        }

    main.inner-page .my-main-navbar nav.navbar {
        /* padding-top: 1rem; */
        padding: 15px 0;
        justify-content: start;
        align-items: start !important;
    }

        main.inner-page .my-main-navbar nav.navbar a.logo-anchor {
            margin: 0 auto;
        }
}
/*#endregion INNER PAGES HOME CSS */

/*#region PROFILE PAGE CSS */
/* ################################## PROFILE PAGE CSS ############################################ */
.profile-page .section-heading h2 {
    font-size: 40px;
}
/* profile form css */
.profile-page .form-section label {
    font-size: 15px;
    text-transform: uppercase;
    letter-spacing: 2px;
    font-family: Roboto-Light;
}

    .profile-page .form-section label.fw-bold {
        font-family: Roboto-Bold;
    }

.profile-page .form-section input::placeholder,
.profile-page .form-section textarea {
    font-size: 13px;
    font-style: italic;
    font-family: Roboto-Light;
    color: #ccc;
}

.profile-page .form-section .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='%23f42765' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
}

.profile-page .profile-main-image .profile-img {
    width: 100%;
}

.profile-page .profile-main-image .delete-icon {
    position: absolute;
    bottom: 5px;
    right: 10px;
}

.profile-page .p-images-sec .delete-icon {
    position: absolute;
    bottom: 5px;
    right: 10px;
}

.profile-page .p-images-sec .item {
    width: 30%;
    height: 95px;
    position: relative;
}


@media only screen and (max-width: 767px) {
    .profile-page .p-images-sec .item {
        width: 100%;
    }
}

    .profile-page .p-images-sec .item img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

.profile-page .p-images-sec .item-three.item input {
    opacity: 0;
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: 1;
}

.profile-page .p-images-sec .item-three.item {
    position: relative;
}

.profile-page .p-images-sec .item-three .box {
    width: 100%;
    z-index: 0;
    height: 100%;
    border: 2px solid;
    display: flex;
    align-items: center;
    justify-content: center;
    border-style: groove;
    border-color: black;
}

.profile-page .profile-main-image .item-three .box {
    width: 100%;
    height: 250px;
    /* height: 100%; */
    border: 2px solid;
    display: flex;
    align-items: center;
    justify-content: center;
    border-style: groove;
    border-color: black;
}

.profile-page .p-images-sec .p-bio-section textarea {
    border: 1px solid;
    resize: none;
    border-radius: 0;
}

.profile-page .contact-now-btn {
    font-size: 20px;
}

@media only screen and (max-width: 767px) {
    .profile-page .contact-now-btn {
        font-size: 15px;
    }
}

.login-modal {
    padding: 0;
}

.justify-content-end {
    justify-content: end;
}

.text-pink {
    color: #f42765;
}

.text-pink-bold {
    color: #f42765;
    font-family: Roboto-Bold;
}

.no-line {
    text-decoration: none;
}


.signup-modal {
    padding: 0;
}

.sign-up-options {
    text-transform: capitalize !important;
}

.form-select-pink {
    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='%23f42765' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
}

.login-modal h1 {
    background: none !important;
    color: #f42765 !important;
    font-weight: 600 !important;
    font-size: 30px !important;
    text-transform: initial !important;
}

.login-modal p {
    font-size: 16px;
    margin: 4px 0;
}

.signup-modal h1 {
    background: none !important;
    color: #f42765 !important;
    font-weight: 600 !important;
    font-size: 30px !important;
    text-transform: initial !important;
}

.signup-modal p {
    font-size: 16px;
    margin: 4px 0;
}


.signup-modal .col-md-4 {
    flex: 0 0 auto;
    width: 33.33333333%;
}

.signup-modal .col-md-8 {
    flex: 0 0 auto;
    width: 66.66666667%;
}

@media only screen and (max-width: 767px) {
    .signup-modal .col-md-4 {
        flex: 0 0 auto;
        width: 40%;
    }

    .signup-modal .col-md-8 {
        flex: 0 0 auto;
        width: 60%;
    }
}

.signup-modal .form-section .row {
    margin: 13px 0;
}

.signup-modal .col-md-12 {
    width: 100%;
    flex: 0 0 auto;
}

.signup-modal .form-section input[type="text"],
.form-section input[type="email"],
.form-section input[type="tel"],
.form-section input[type="password"],
.form-section input[type="number"] .form-section select {
    border-bottom: 1px solid #000 !important;
    border-radius: 0;
    border: none;
}

.signup-modal .d-grid {
    display: grid !important;
}

.signup-modal .submit-btn {
    background: #f42765;
    border: none;
    color: #fff;
    padding: 10px;
}

.signup-modal .form-section .form-check input {
    margin: 0 5px !important;
    border-radius: 0;
}


.signup-modal .form-section .form-check .agree input {
    margin: 0 0px !important;
    border-radius: 0;
}

.my-3 {
    margin: 10px 0;
}

.gap-3 {
    gap: 1rem !important;
}

.signin-btns button {
    background: none;
    color: #000;
    border: 1px solid;
}

.login-modal-body .col-md-4 {
    flex: 0 0 auto;
    width: 33.33333333% !important;
}

.login-modal-body .col-md-8 {
    flex: 0 0 auto;
    width: 66.66666667% !important;
}

@media only screen and (max-width: 767px) {
    /* .login-modal-body .col-md-4 {
    flex: 0 0 auto;
    width: 40% !important;
  } 

  .login-modal-body .col-md-8 {
    flex: 0 0 auto;
    width: 60% !important;
  } */
}

.login-modal .form-section .row {
    margin: 13px 0;
}

.login-modal .col-md-12 {
    width: 100%;
    flex: 0 0 auto;
}

.login-modal .form-section input[type="text"],
.form-section input[type="email"],
.form-section input[type="tel"],
.form-section input[type="password"],
.form-section input[type="number"] .form-section select {
    border-bottom: 1px solid #000 !important;
    border-radius: 0;
    border: none;
}

.login-modal .d-grid {
    display: grid !important;
}

.login-modal .submit-btn {
    background: #f42765;
    border: none;
    color: #fff;
    padding: 10px;
}

.popup-content form {
    width: 100% !important;
}

.login-modal .form-section .form-check input {
    margin: 0 5px !important;
    border-radius: 0;
}

.delete {
    position: absolute;
    display: block;
    bottom: 5px;
    right: 5px;
    width: 20px;
    height: 26px;
    background: url("/images/ibiza/delete-icon.png") no-repeat;
    z-index: 2;
    border-radius: 5px;
}

.delete-shortlist {
    display: block;
    /*position: absolute;
    bottom: 5px;
    right: 5px;*/
    width: 20px;
    height: 26px;
    background: url("/images/ibiza/delete-icon.png") no-repeat;
    z-index: 2;
    border-radius: 5px;
}

.view-shortlist-tab .delete-icon {
    position: relative !important;
    display: block;
    bottom: 5px;
    right: 5px;
    width: 20px;
    height: 26px;
    background: url("/images/ibiza/delete-icon.png") no-repeat;
    z-index: 2;
    border-radius: 5px;
}

.profile-main-image {
    position: relative;
}

    .profile-main-image a {
        display: block;
    }

    .profile-main-image img {
        max-width: -webkit-fill-available;
    }

    .profile-main-image a.delete {
        position: absolute;
        bottom: 5px;
        right: 5px;
        width: 20px;
        height: 26px;
        background: url("/images/ibiza/delete-icon.png") no-repeat;
        z-index: 2;
        border-radius: 5px;
    }

.client-profile-main-image a.delete {
    background: url("/images/ibiza/delete-icon-black.png") no-repeat !important;
    /*background-color: #fff !important;*/
}

.client-profile-multi-image a.delete {
    background: url("/images/ibiza/delete-icon-black.png") no-repeat !important;
}

input.date-picker {
    text-align: left;
    background-image: url("/images/ibiza/calander-icon.png");
    cursor: pointer;
    background-position: right center;
    background-size: contain;
    background-repeat: no-repeat;
    padding-right: 18px;
    /* width: 287px; */
}


/*#region Profile Membership Badges CSS*/



.profile-badge-diamond {
    position: relative;
    top: 8px;
    left: 170px;
    background-color: #ffffff;
    margin-bottom: -20px;
    font-size: 100px;
}

.profile-badge-gold {
    position: relative;
    top: 8px;
    left: 150px;
    border: 1px black solid;
    background-color: #ffd700;
    height: 100px;
    border-radius: 50%;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    width: 100px;
    margin-bottom: -20px;
}

.profile-gold-text {
    position: absolute;
    top: 24px;
    left: 11px;
    font-size: 30px;
    font-weight: bold;
}

.profile-gold-vip-text {
    position: absolute;
    top: 100px;
    left: 30px;
    font-size: 25px;
    font-weight: bold;
}

.profile-diamond-text {
    position: absolute;
    top: 115px;
    left: 30px;
    font-size: 30px;
    font-weight: bold;
}

@media only screen and (max-width: 767px) {
    .profile-badge-diamond {
        position: relative;
        top: 0px;
        left: 80px;
        background-color: #ffffff;
        margin-bottom: 5px;
        font-size: 60px;
    }

    .profile-diamond-text {
        position: absolute;
        top: 65px;
        left: 10px;
        font-size: 30px;
        font-weight: bold;
    }

    .profile-badge-gold {
        position: relative;
        top: 0px;
        left: 80px;
        border: 1px black solid;
        background-color: #ffd700;
        height: 100px;
        border-radius: 50%;
        -moz-border-radius: 50%;
        -webkit-border-radius: 50%;
        width: 100px;
        margin-bottom: 20px;
    }
}
/*#endregion Profile Membership Badges CSS*/

/*#endregion PROFILE PAGE CSS*/

/*#region PREVIEW PROFILE PAGE CSS*/

.profile-desc {
    padding: 15px 50px 25px 0px;
}


    .profile-desc small {
        font-size: 14px;
        display: block;
    }


.staff-info-result {
    text-transform: uppercase;
    letter-spacing: 3px;
    font-size: 14px;
}


.profile-agency-logo {
    width: 20%;
    position: absolute;
    top: 0;
    right: 10px;
}

/*#endregion PREVIEW PROFILE PAGE CSS*/

/*#region CLIENT PAGES CSS */
/* ###########################CLIENT PAGES CSS ####################################################### */
.list-user-img {
    position: relative;
}

    .list-user-img .online-icn {
        position: absolute;
        height: 12px;
        width: 12px;
        background: #009444;
        border-radius: 100%;
        left: -3px;
        top: 25px;
    }

    .list-user-img .offline-icn {
        position: absolute;
        height: 12px;
        width: 12px;
        background: #000;
        border-radius: 100%;
        left: -3px;
        top: 25px;
    }

.list-user-actions {
    font-size: 13px;
}

    .list-user-actions svg {
        font-size: 16px;
    }

.list-user-name {
    font-size: 13px;
}
/* .nav-tab-btns-section li.nav-item {
  border: 1px solid #f42765;
} */
.nav-tab-btns-section li.nav-item {
    width: 33.33%;
}

    .nav-tab-btns-section li.nav-item .nav-link {
        /* border: none !important; */
        /* color: #eeeeee7a !important; */
        letter-spacing: 3px;
        font-family: 'Roboto-Light';
        font-size: 14px;
    }

        .nav-tab-btns-section li.nav-item .nav-link.active {
            color: #fff !important;
            font-weight: 'Roboto-Bold';
            font-weight: bold;
        }

    .nav-tab-btns-section li.nav-item.active {
        color: #fff !important;
        font-weight: 'Roboto-Bold';
        font-weight: bold;
    }

.view-jobs-tab table thead th {
    font-size: 18px;
}

.view-jobs-tab table .td-small-actions {
    line-height: 13px;
}

    .view-jobs-tab table .td-small-actions small {
        display: inline-block;
        font-size: 13px;
    }

.view-jobs-tab tbody tr {
    border-bottom: 2px solid #787777 !important;
}

    .view-jobs-tab tbody tr td {
        padding: 20px 10px;
        font-family: 'Roboto-Regular';
    }

.table.apps_recieved_table tr {
    border: none;
}

    .table.apps_recieved_table tr td {
        border: none;
    }

.apps_recieved_table tr.details td {
    padding: 10px !important;
    /* padding: 0px !important; */
}
/*.for-desktop .list-usr {
  width: 15%;
}*/
.for-desktop .list-usr .list-user-name {
    font-size: 16px;
    width: 60px;
    margin: 3px auto;
}

.for-desktop .list-usr .list-user-img {
    position: relative;
    width: 100px;
    margin: 0 auto;
}

.user-images-list .list-usr .list-user-img img {
    width: 100px;
    height: 100px;
    border-radius: 100%;
    border: 3px solid #f42765;
    margin: 0 auto;
}

.for-desktop .list-usr {
    width: 25%;
}

@media only screen and (max-width: 767px) {
    .for-mobile .list-usr {
        width: 33.3%;
    }

    .for-mobile .nav-tab-btns-section li.nav-item .nav-link {
        padding: 0 !important;
        font-size: 12px;
        letter-spacing: 1px;
    }

    .for-mobile .view-jobs-tab .d-flex .d-item:nth-child(1) {
        width: 20%;
    }

    .for-mobile .tab-box-two {
        display: none;
    }

        .for-mobile .tab-box-two .inner-four-box .d-item {
            width: 25% !important;
        }

    .for-mobile .view-jobs-tab h6 {
        font-size: 13px;
    }

    .for-mobile .view-jobs-tab {
        font-size: 13px;
    }

    .for-mobile .tab-box-two .inner-four-box .d-item h6 {
        font-size: 11px;
    }

    .for-mobile .list-user-img {
        position: relative;
        width: 100px;
        margin: 0 auto;
    }

    .for-mobile .user-images-list .list-usr .list-user-img img {
        width: 100px;
        height: 100px;
        object-fit: cover;
    }

    .for-mobile .list-usr .list-user-name {
        font-size: 16px;
        width: 60px;
        margin: 3px auto;
    }
    /*.for-mobile .user-images-list .list-usr {
    width: 20%;
  }*/
    .for-mobile .job-detail-box {
        position: absolute;
        width: 80%;
        left: 0;
        right: 0;
        top: 15px;
        background: #fff;
        margin: 5px auto;
    }

    .for-mobile .job-detail-card .close-icon {
        position: absolute;
        right: 10px;
        font-size: 18px;
        top: 5px;
    }

    .for-mobile .job-detail-card .jdc-desc .p-img-sec img {
        width: 50px;
        height: 50px;
    }

    .for-mobile .job-detail-card .jdc-desc .p-img-sec .online-icn {
        position: absolute;
        height: 10px;
        width: 10px;
        background: #009444;
        border-radius: 100%;
        left: -5px;
        top: 15px;
    }

    .for-mobile .job-list-card-box {
        height: 450px;
        padding: 5px;
        overflow: auto;
    }

    .refine-search-form label {
        letter-spacing: 2px;
    }

    .refine-search-form input,
    .refine-search-form select {
        padding: 0px !important;
    }

        .refine-search-form input[type="radio"] {
            border-radius: 0;
            border: 1px solid;
            height: 15px;
            color: #f42765;
            width: 15px;
            margin-right: 5px;
        }
}
/*#endregion CLIENT PAGES CSS */

/*#region FIND STAFF PAGE CSS */
/* #########################################  FIND STAFF PAGE CSS  ################################################################ */
main.search-model-page.inner-page {
    position: inherit;
}
/* .findstaff-main-banner {
  background-image: url("../../images/ibiza/find-staff-banner-bg.jpg");
  height: 850px;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  position: relative;
} */

/* section.find-staff-section {
  width: 940px;
  margin: 0 auto;
  background: #fff;
  position: absolute;
  left: 0;
  right: 0;
  top: 25%;
} */
.findstaff-main-banner {
    height: 100%;
}

    .findstaff-main-banner img {
        height: 100%;
        width: 100%;
    }

section.find-staff-section {
    margin: 0 auto;
    background: #fff;
    width: 80%;
    margin: 0 auto;
    margin-top: -720px;
    height: 100%;
    min-height: 1100px;
    position: relative;
}

.alert-dialog {
    padding: 20px;
    /* background-color: #f42765;
  color: white; */
    /* background-color: #f42765; */
    color: black;
}

#colorbox,
#cboxOverlay,
#cboxWrapper {
    overflow: visible !important;
}

.filters-box label {
    letter-spacing: 1px;
}

.filters-box button {
    font-family: "Roboto-Light";
    text-transform: uppercase;
    letter-spacing: 3px !important;
}

.filters-box .filter-fields input {
    border-radius: 0;
    border: 2px solid;
}

.search-model-page .concierge-banner-section {
    /* margin-top: 5% !important; */
}

.staff-box-1 .staff-name label {
    text-transform: uppercase;
    letter-spacing: 2px;
}

section.find-staff-section .staff-desc {
    line-height: 18px;
}

.staff-img img {
    width: 100%;
}

@media only screen and (max-width: 1024px) {
    section.find-staff-section {
        height: 900px;
    }
}

@media only screen and (max-width: 768px) {
    section.find-staff-section {
        height: 700px;
        width: 100% !important;
    }

    .find-staff-section .sorting-top-filter {
        display: none !important;
    }
}

@media only screen and (max-width: 767px) {
    /* section.find-staff-section-mbl {
    display: block !important;
    width: 80%;
    margin: 0 auto;
    background: #fff;
    position: absolute;
    left: 0;
    right: 0;
    top: 35%;
  } */
    .findstaff-main-banner {
        height: 450px;
    }

        .findstaff-main-banner img {
            object-fit: cover;
        }

    section.find-staff-section {
        height: 100%;
        min-height: 100%;
        margin-top: -260px;
        margin-bottom: 50px;
    }

        section.find-staff-section .staff-desc {
            display: none;
        }

        section.find-staff-section .staff-ratings {
            font-size: 12px;
            gap: 3px !important;
        }

        section.find-staff-section .staff-name {
            font-size: 12px;
        }
    /* .findstaff-main-banner {
    background-size: 150%;
    background-position: top;
    height: 700px;
  } */
    .search-model-page .concierge-banner-section {
        margin-top: inherit !important;
    }
}
/*#endregion FIND STAFF PAGE CSS */

/*#region STAFF BOOKINGS PAGE CSS */
/*########################################## STAFF BOOKINGS PAGE ######################################################## */
.staff-bookings-page .section-heading h1 {
    font-size: 40px !important;
}

.table.booked_jobs_table tr {
    border: none;
}

    .table.booked_jobs_table tr td {
        border: none;
    }

.booked_jobs_table tr.details td {
    padding: 0 !important;
}

.job-list-card {
    cursor: pointer;
}

.job-list-card-action .main-btn {
    width: 50%;
    text-align: center;
}

.main-btn small {
    display: block;
    font-size: 11px;
    line-height: 1;
}

.job-list-card .close-icon {
    font-size: 12px;
}

@media only screen and (max-width: 767px) {
    /* .for-mobile .nav-tab-btns-section li.nav-item .nav-link {
        padding: 0 !important;
        font-size: 10px;
        letter-spacing: 1px;
    } */

    .for-mobile .view-jobs-tab .d-flex .d-item:nth-child(1) {
        width: 20%;
    }

    .for-mobile .tab-box-two .inner-four-box .d-item {
        width: 25% !important;
    }

    .for-mobile .view-jobs-tab h6 {
        font-size: 13px;
    }

    .for-mobile .view-jobs-tab {
        font-size: 13px;
    }

    .for-mobile .tab-box-two .inner-four-box .d-item h6 {
        font-size: 11px;
    }

    .px-5 {
        padding: 2px;
    }
}
/*#endregion STAFF BOOKINGS PAGE CSS */

/*#region IMAGE POP UP IN PROFILE PHOTO CSS */
/* #########################################  IMAGE POP UP IN PROFILE PHOTO CSS START ################################################################ */

body.popup .wrap {
    display: block;
}

body.popup .content {
    padding: 15px;
    text-transform: inherit;
    margin: 0 0 10px 0;
    font-size: inherit;
}

.vsb {
    margin-bottom: 15px;
}

.photo-upload-c1 {
    float: left;
    width: 45%;
    padding: 0 20px 0 0;
}

.photo-upload-c2 {
    float: left;
    width: 55%;
}

.col-xs-6 {
    width: 50%;
}

.w100 {
    width: 100%;
}

.file-upload {
    display: flex;
}

.fu-button.btn.btn-default {
    line-height: 19px;
    margin-left: 5px;
    border: 2px solid #221f20;
    background: #221f20;
    color: #ffffff;
    outline: 0;
    box-shadow: none;
}

#photoInput {
    position: absolute;
    top: auto;
    left: 0;
    margin: 0;
    padding: 0;
    font-size: 25px !important;
    cursor: pointer;
    opacity: 0;
}

.preview-wrap .preview {
    border: 1px solid #ccc;
    float: left;
    height: 130px;
    width: 130px;
    margin: 0 20px 10px 0;
    position: relative;
    overflow: hidden;
}

#image {
    width: 130px;
    margin-left: -5px;
    margin-top: -4px;
}

.pdb-sm {
    padding-bottom: 5px;
}

.cropper-wrap img {
    height: auto;
    width: 100%;
}
/* New popup */
.photo-upload {
    margin: auto;
    width: 100%;
    text-align: center;
    background-color: #000;
    color: #fff;
}

.photo-upload-heading {
    font-family: Roboto;
    font-size: 40px;
    color: #f42765;
    font-weight: bolder;
}

.photo-upload-b {
    font-weight: bold;
}

.photo-btn-browse {
    color: #fff;
    width: 200px;
}

.photo-upload-logo img {
    width: 250px;
}
/* #########################################  IMAGE POP UP IN PROFILE PHOTO CSS ENDS ################################################################ */
/*#endregion IMAGE POP UP IN PROFILE PHOTO CSS */

/*#region SEARCH MODELS CSS */
/* #########################################  SEARCH MODELS CSS STARTS ################################################################ */

.sort-by {
    font-size: 14px;
    color: #221f20;
    text-transform: uppercase;
    line-height: 28px;
    letter-spacing: 3px;
    display: inline-block;
    vertical-align: middle;
}

.dot-available {
    height: 25px;
    width: 25px;
    background-color: #579E5C;
    border-radius: 50%;
    display: inline-block;
    position: relative;
    top: 5px;
    left: 5px;
    border: 2px solid #fff;
    box-shadow: 0px 0px 4px #000;
}

.staff-list-view {
    display: inline-block;
    font-size: 18px;
    color: #221f20;
    background: #f3f3f3;
    padding: 5px 8px;
    margin: 0 5px;
    vertical-align: middle;
    line-height: 22px;
}

    .staff-list-view:focus,
    .staff-list-view:hover {
        color: #221f20;
        background: #f3f3f3;
    }

    .staff-list-view.active {
        background: #dddddd;
    }

.listview .staff-photo-wrap {
    float: left;
    width: 150px;
}

.listview .staff-item .bio {
    display: block;
    float: left;
    width: calc(100% - 150px);
}

.listview .staff-button,
.listview .admin-button {
    float: right;
}

.listview .staff-item .btn {
    display: inline-block;
}

.pull-right {
    float: right !important;
}

.iconbox-style-1 .bx-content h1 {
    font-size: 43px !important;
}

/* #########################################  SEARCH MODELS CSS ENDS ################################################################ */
/*#endregion SEARCH MODELS CSS */

/*#region BREAD CRUMB CSS */

/* #########################################  BREAD CRUMB CSS STARTS ################################################################ */
.breadcrumb {
    padding: 0;
    background-color: transparent;
    border-radius: 0;

    display: flex;
    align-items: center;
}

    .breadcrumb li a {
        color: #221f20;
        text-transform: uppercase;
        letter-spacing: 4px;
        font-weight: 400;
        text-decoration: none;
    }

    .breadcrumb li.active {
        color: #f42765;
        text-transform: uppercase;
        letter-spacing: 5px;
        font-weight: 400;
        text-decoration: none;
        font-size: 1.2em;
    }

    .breadcrumb li.boat {
        font-size: 1.0em;
    }

    .breadcrumb li.villa {
        font-size: 1.0em;
    }

    .breadcrumb > li + li:before {
        color: #221f20;
    }
/* #########################################  BREAD CRUMB CSS ENDS ################################################################ */
/*#endregion BREAD CRUMB CSS */

/*#region ADMIN SECTION CSS */

.content-header.title-border {
    box-shadow: 0 2px #221f20;
}

.content-header {
    margin-bottom: 2px;
    position: relative;
}

.page-title {
    background: #221f20;
    font-size: 16px;
    color: #ffffff !important;
    text-transform: uppercase;
    line-height: 20px;
    padding: 6px 15px;
    display: inline-block;
}

.form-group .flabel {
    text-align: right;
    font-weight: bold;
    padding-right: 5px;
    width: auto;
}

.form-group .newlabel {
    text-align: left;
    font-weight: bold;
    width: auto;
    /* padding: 5px; */
}

.form-group .flabel.norm {
    font-weight: normal;
}

.login-private .private-menu {
    display: none;
    position: absolute;
    right: 0;
    top: 35px;
    width: 100%;
    max-width: 165px;
    z-index: 2;
}

.login-private .dropdown-menu,
.login-private-mobile .dropdown-menu {
    background: rgba(255,255,255,0.9);
    right: 0;
    left: auto;
    width: 213px;
    padding: 5px 0;
    border-radius: 0;
    text-align: center;
    border: 0;
    box-shadow: none;
}

    .login-private .dropdown-menu li a,
    .login-private-mobile .dropdown-menu li a {
        color: #221f20;
        text-transform: uppercase;
        font-weight: bold;
        letter-spacing: 1px;
        margin-bottom: 10px;
        padding: 10px 10px 10px 10px;
    }

        .login-private .dropdown-menu li a:hover {
            color: #ee373d;
            text-decoration: none;
            background-color: #f5f5f5;
        }

    .login-private-mobile .dropdown-menu li a {
        color: #fff;
    }

        .login-private-mobile .dropdown-menu li a:hover {
            background: transparent !important;
        }

.btn-admin {
    text-transform: uppercase;
}

.admin-requests {
    margin-left: -5px;
    margin-right: -5px;
}

    .admin-requests .req-type {
        padding: 0 5px 0 5px;
        margin-bottom: 10px;
    }

    .admin-requests h4 {
        background: none repeat scroll 0 0 #ddd;
        margin: 0;
        padding: 8px;
        text-transform: uppercase;
    }

    .admin-requests h6 {
        background: none repeat scroll 0 0 #ddd;
        margin: 0;
        padding: 8px;
        text-transform: uppercase;
    }

    .admin-requests .request {
        border: 1px solid #999;
        margin: 5px 0 0;
        position: relative;
    }

        .admin-requests .request.deleted {
            background: none repeat scroll 0 0 #ffdab9;
        }

        .admin-requests .request.cancelled {
            background: none repeat scroll 0 0 #eaeaea;
        }

        .admin-requests .request.booking-cancelled.staff {
            background: none repeat scroll 0 0 #FFF084;
        }

        .admin-requests .request.booking-cancelled.client {
            background: none repeat scroll 0 0 #FFC6DB;
        }

        .admin-requests .request.debt {
            background-image: url('../images/rebranding/failed_payment.png');
            background-repeat: repeat;
            background-size: 19px;
            background-position: left top;
        }

        .admin-requests .request img {
            float: left;
            border: 1px solid #ddd;
            height: 45px;
            margin: 5px;
            width: 45px; /*36*/
        }

        .admin-requests .request .text {
            width: 100%;
            padding: 0 0 0 48px;
            margin: 5px 0 5px 0;
        }

        .admin-requests .request .conv,
        .admin-requests .request .sms,
        .admin-requests .request .currency,
        .admin-requests .request .delete-request,
        .admin-requests .request .cancel-request,
        .admin-requests .request .cancel-booking {
            background-image: none;
            background-position: center center;
            background-repeat: no-repeat;
            height: 32px;
            position: absolute;
            top: 2px;
            width: 32px;
        }

        .admin-requests .request .conv {
            right: 5px;
        }

        .admin-requests .request:hover .conv {
            background-image: url("/images/rebranding/icon_mail.png");
        }

        .admin-requests .request .sms {
            right: 38px;
        }

        .admin-requests .request:hover .sms {
            background-image: url("/images/rebranding/icon_sms.jpg");
        }

        .admin-requests .request:hover .currency {
            right: 35px;
            top: 35px;
            background-image: url("/images/rebranding/icon_dollar.png");
        }

        .admin-requests .request .delete-request,
        .admin-requests .request .cancel-booking {
            right: 5px;
            top: 25px;
        }

    .admin-requests .application .request:hover .delete-request,
    .admin-requests .invitation .request:hover .delete-request {
        background-image: url("/images/rebranding/trash_icon.png");
    }

    .admin-requests .request:hover .cancel-booking {
        background-image: url("/images/rebranding/cancel_small.png");
    }

/*#endregion ADMIN SECTION CSS */

/*#region Pop Up Modal CSS */
/* #########################################  Pop Up Modal CSS STARTS ################################################################ */
.popup-modal h1 {
    font-size: 7vw !important;
}

.popup-modal h3 {
    font-size: 3.5vw !important;
}

.popup-modal .roboto-light {
    font-family: Roboto-Light !important;
}

.popup-modal .photo-upload-logo-popup {
    width: 300px;
}

.popup-modal .inv-sent-text {
    letter-spacing: 3px;
}

.popup-modal .inv-sent-btn {
    letter-spacing: 4px;
}
/* #########################################  Pop Up Modal CSS ENDS ################################################################ */
/*#endregion Pop Up Modal CSS */

/*#region STAFF PAGE CSS  */
.job-detail-card .jdc-desc .p-img-sec {
    position: absolute;
    top: 20px;
    right: 10px;
}

    .job-detail-card .jdc-desc .p-img-sec img {
        width: 80px;
        height: 80px;
        border-radius: 100%;
        border: 3px solid #f42765;
        object-fit: cover;
    }

    .job-detail-card .jdc-desc .p-img-sec .online-icn {
        position: absolute;
        height: 18px;
        width: 18px;
        background: #009444;
        border-radius: 100%;
        left: -10px;
        top: 15px;
    }

#refine .form-section input[type="text"],
#refinembl .form-section input[type="text"] {
    height: 25px;
    font-size: 10px;
}

#refine .form-section select,
#refinembl .form-section select {
    height: 30px;
    font-size: 10px;
}


#refine .form-section input[type="checkbox"] {
    border-radius: 0;
    width: 15px;
    border: 2px solid #f42765;
    height: 15px;
    padding: 0 !important;
}

#refine input.date-picker,
#refinembl input.date-picker {
    /* width: auto !important; */
}

.job-list-navbar {
    height: auto;
    overflow-y: auto;
}

.c-red {
    color: red;
}

.c-white {
    color: white;
}

#refine .form-section input[type="radio"] {
    border-radius: 0;
    width: 15px;
    border: 2px solid #f42765;
    height: 15px;
    padding: 0 !important;
}
/*#endregion STAFF PAGE CSS  */

/*#region FIND JOB CSS  */
.btn-refine-search {
    letter-spacing: 3px;
}

.filter-form div {
    padding: 10px 5px 5px 10px;
}

.filter-form .filter-label {
    text-align: end;
}

.filter-form label input {
    margin-right: 10px;
}

.filter-form .vst {
    text-align: center;
}

.job-box-badge-diamond {
    position: relative;
    top: 8px;
    left: 75px;
    /*border: 1px black solid;*/
    background-color: #ffffff;
    /*height: 35px;
    border-radius: 50%;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    width: 35px;*/
    margin-bottom: -20px;
    font-size: 30px;
}

.job-box-badge-gold {
    position: relative;
    top: 8px;
    left: 75px;
    border: 1px black solid;
    background-color: #ffd700;
    height: 35px;
    border-radius: 50%;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    width: 35px;
    margin-bottom: -20px;
}

.job-box-gold-text {
    position: absolute;
    top: 10px;
    left: 5px;
    font-size: 10px;
    font-weight: bold;
}

.job-box-diamond-text {
    position: absolute;
    top: 35px;
    left: 7px;
    font-size: 10px;
    font-weight: bold;
}

@media only screen and (max-width: 767px) {
    .job-box-badge-diamond {
        position: relative;
        top: 8px;
        left: 60px;
        /*border: 1px black solid;*/
        background-color: #ffffff;
        /*height: 35px;
    border-radius: 50%;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    width: 35px;*/
        margin-bottom: -20px;
        font-size: 30px;
    }

    .job-box-badge-gold {
        position: relative;
        top: 8px;
        left: 60px;
        border: 1px black solid;
        background-color: #ffd700;
        height: 35px;
        border-radius: 50%;
        -moz-border-radius: 50%;
        -webkit-border-radius: 50%;
        width: 35px;
        margin-bottom: -20px;
    }
}
/*#endregion FIND JOB CSS  */
/*#region Loader CSS  */
#loadingScreen {
    background: url(/images/rebranding/loading.gif) no-repeat scroll center center #fff;
    display: none;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    opacity: 0.8;
    outline: none !important;
    position: fixed;
    z-index: 9;
}
/*#endregion Loader CSS  */

/*#region ADMIN SECTION CSS */
/* admin */
.k-grid {
    margin-bottom: 20px;
}

.kendo-grid th.k-header,
.kendo-grid tbody td {
    padding: 7px;
}

.kendo-grid .k-grid-header th.k-header,
.kendo-grid .k-grid-header th.k-header * {
    color: #221f20;
    text-transform: uppercase;
    font-size: 11px;
    line-height: 17px;
}

.kendo-grid th.k-header[data-field=Id] {
    min-width: 35px;
}

.kendo-grid th.k-header[data-field=JobDate] {
    min-width: 90px;
}

.kendo-grid th.k-header[data-field=Promo] {
    min-width: 60px;
}

.kendo-grid th.k-header[data-field=Positions] {
    min-width: 48px;
}

.kendo-grid th.k-header[data-field=Booked] {
    min-width: 70px;
}

.kendo-grid th.k-header[data-field=ApplicationCount] {
    min-width: 42px;
}

.kendo-grid th.k-header[data-field=IsPublished] {
    min-width: 42px;
}

.kendo-grid th.k-header[data-field=FailedPaymentCount] {
    min-width: 50px;
}

.kendo-grid th.k-header[data-field=Packages] {
    min-width: 70px;
}

.kendo-grid th.k-header[data-field=IsCreditCardVerified] {
    min-width: 68px;
}

.kendo-grid th.k-header[data-field=Type] {
    min-width: 45px;
}

.kendo-grid th.k-header[data-field=Debt] {
    min-width: 48px;
}

.kendo-grid th.k-header[data-field=Credit] {
    min-width: 58px;
}

.kendo-grid th.k-header[data-field=BranchId] {
    min-width: 68px;
}

.kendo-grid th.k-header[data-field=HasPendingSections] {
    min-width: 75px;
}

.kendo-grid th.k-header[data-field=IsNoShow] {
    min-width: 68px;
}

.kendo-grid th.k-header[data-field=Rating] {
    min-width: 53px;
}

.kendo-grid th.k-header[data-field=Comment] {
    min-width: 72px;
}

.kendo-grid th.k-header[data-field=RevieweeName] {
    min-width: 78px;
}

.kendo-grid th.k-header[data-field=ReviewerName] {
    min-width: 67px;
}

.kendo-grid th.k-header[data-field=JobId] {
    min-width: 55px;
}

.grid-thumb {
    width: 36px;
    height: 36px;
}

.k-grid td .btn-error {
    border: 2px solid #ee373d;
    background: #ee373d;
    line-height: 18px;
    font-size: 11px;
    display: block;
    min-height: 18px;
    color: #ffffff;
    padding: 2px 4px;
}

.k-animation-container .k-group label {
    line-height: 100%;
    height: 17px;
    margin: 10px 10px 0 0;
    font-size: 12px;
}

    .k-animation-container .k-group label input[type=radio] {
        vertical-align: middle;
        margin-top: -1px;
        margin-right: 3px;
    }

.k-edit-form-container .k-primary, .k-popup .k-primary {
    color: #221f20;
}

.k-animation-container .k-button:hover,
.k-animation-container .k-list-container .k-state-focused,
.k-animation-container .k-dropdown .k-input {
    background-color: #221f20;
    color: #ffffff;
}

.admin-modal-popup {
    display: flex;
    padding: 10px;
}
/*#endregion ADMIN SECTION CSS */

/*#region Pop Up Modal CSS */
/* #########################################  Pop Up Modal CSS STARTS ################################################################ */
.popup-modal h1 {
    font-size: 7vw !important;
}

.popup-modal h3 {
    font-size: 3.5vw !important;
}

.popup-modal .roboto-light {
    font-family: Roboto-Light !important;
}

.popup-modal .photo-upload-logo-popup {
    width: 300px;
}

.popup-modal .inv-sent-text {
    letter-spacing: 3px;
}

.popup-modal .inv-sent-btn {
    letter-spacing: 4px;
}
/* #########################################  Pop Up Modal CSS ENDS ################################################################ */
/*#endregion Pop Up Modal CSS */

/*#region Payment Info CSS  */
.payment-box .box-content {
    position: relative;
}

.payment-box .box-content {
    cursor: pointer;
}

    .payment-box .box-content .packages-radio-section input {
        height: 100%;
        width: 100%;
        border-radius: 0;
        /*position: absolute;*/
        left: 0;
        right: 0;
        top: 0;
        opacity: 0;
    }
/*#endregion Payment Info CSS  */

/*#region Message Screen CSS  */

.chat-pill.chat-message-status-sent small.my-0 {
    font-weight: bold;
}

.chatlist-client {
    border-top: 1px solid #000 !important;
}

.chat-box {
    width: 400px;
    height: 300px;
    /* border: 1px solid #ccc; */
    overflow-y: scroll;
    padding: 10px;
    overflow-x: hidden;
}

    .chat-box .chat-pill {
        width: 80%;
    }

    .chat-box .message {
        display: flex;
        margin-bottom: 10px;
        margin: 10px 0;
    }

    .chat-box .sent {
        flex-direction: row-reverse;
    }

    .chat-box .message-body {
        /* background-color: #c0c0c0;
      border-radius: 10px;
      max-width: 70%;
      width: 100%;
      padding: 5px 15px; */
        background-color: #c0c0c0;
        border-radius: 10px;
        /* max-width: 70%;
      min-width: 30vh; */
        width: 100%;
        padding: 5px 15px;
    }

    .chat-box .received .message-body {
        border: 1px solid #c0c0c0;
        background: none;
        /* width: 100vh; */
        /* width: 100vh; */
    }

    .chat-box .profile-pic {
        width: 40px;
        height: 40px;
        border-radius: 50%;
        margin: 0 5px;
    }

.message-input textarea {
    border: 1px solid #d7d7d7 !important;
    border-radius: 20px !important;
    color: #212529 !important;
    font-size: 13px;
}

.message-input .msg-send-btn-sec button {
    padding: 5px 35px;
}

/* region GROUP CHAT IMAGE */

.group-img img.profile-pic:nth-child(2) {
    transform: translateX(-75%);
}

.group-img img.profile-pic:nth-child(3) {
    transform: translateX(-150%);
}

.group-img img.profile-pic:nth-child(4) {
    transform: translateX(-225%);
}

.group-img img.profile-pic:nth-child(5) {
    transform: translateX(-300%);
}

.group-img img.profile-pic:nth-child(6) {
    transform: translateX(-375%);
}
/* endregion GROUP CHAT IMAGE */

/* width */
.chat-box::-webkit-scrollbar {
    width: 0px;
}

/* Track */
.chat-box::-webkit-scrollbar-track {
    background: #f1f1f1;
}

/* Handle */
.chat-box::-webkit-scrollbar-thumb {
    background: #888;
}

    /* Handle on hover */
    .chat-box::-webkit-scrollbar-thumb:hover {
        background: #555;
    }

/* chat listing item css */
.chat-list-box {
    height: 500px;
    overflow-y: auto;
    overflow-x: hidden;
}

    /* width */
    .chat-list-box::-webkit-scrollbar {
        width: 0px;
    }

    /* Track */
    .chat-list-box::-webkit-scrollbar-track {
        background: #f1f1f1;
    }

    /* Handle */
    .chat-list-box::-webkit-scrollbar-thumb {
        background: #888;
    }

        /* Handle on hover */
        .chat-list-box::-webkit-scrollbar-thumb:hover {
            background: #555;
        }

.p-img.c-child-list-item .p-img-item {
    position: relative;
    display: inline-block;
}

.p-img.c-child-list-item .online-icn {
    position: absolute;
    height: 10px;
    width: 10px;
    background: #009444;
    border-radius: 100%;
    right: 0px;
    top: 2px;
}

.p-img.c-child-list-item img {
    border-radius: 100%;
    width: 40px;
    border: 2px solid #f42765;
    border-radius: 100%;
}

.c-list-item.active {
    background: #eee;
    border-width: 2px;
}

.c-list-item {
    width: 100%;
    border-top: 1px solid;
    margin: 0 auto;
    height: 60px;
}

.c-child-list-item {
    width: 30%;
}

    .c-child-list-item.group-img img {
        border: 2px solid #f42765;
        border-radius: 100%;
        width: 40px;
        border: 2px solid #f42765;
        border-radius: 100%;
    }
/* 
        .c-child-list-item.group-img img:nth-child(2) {
            margin: -30px;
        } */

.accept-decline-bar .light-pink-bar {
    background: #fcebf0;
}

.accept-decline-bar .p-img .p-img-item {
    display: inline-block;
    position: relative;
}

    .accept-decline-bar .p-img .p-img-item img {
        width: 60px;
        border: 2px solid #f42765;
        border-radius: 100%;
    }

    .accept-decline-bar .p-img .p-img-item .offline-icn {
        position: absolute;
        height: 12px;
        width: 12px;
        background: #000;
        border-radius: 100%;
        left: -3px;
        top: 12px;
    }

.accept-decline-bar .light-pink-bar .bar-action-btns {
    font-size: 10px;
    letter-spacing: 2px;
    font-family: "Roboto-Light";
}

.accept-decline-bar .light-pink-bar h6 {
    font-size: 13px;
}

.chat-unread {
    display: none !important;
}

@media only screen and (max-width: 500px) {
    #btnYes {
        font-size: 12px;
    }

    #btnNo {
        font-size: 12px;
    }
}

@media only screen and (max-width: 767px) {
    .chat-box-section {
        display: none;
    }

    .chat-box.d-flex.flex-column {
        width: 100%;
    }

    /* .chat-box .message-body {
        width: 35vh !important;
    } */

    .chat-list-box .p-img.c-child-list-item img {
        width: 58px;
    }
}


/*#endregion Message Screen CSS  */


/*#region Client Review Popup CSS  */

.review-popup {
}
/*.review-staff .logo-heading {
        width: 350px;
    }*/

.review-client h1 {
    font-weight: bold;
}

.review-popup .profile-pic {
    width: 200px;
    height: 200px;
    border-radius: 50%;
    margin: 0 5px;
}


.review-client {
    background-color: #e03f67;
    width: 100%;
    text-align: center !important;
    position: relative;
    color: #000 !important;
}

    .review-client .logo-heading {
        width: 50%;
    }

    .review-client .p-circle-image .p-img-item img {
        width: 80px;
    }

    .review-client .comment-box textarea::placeholder {
        color: #000;
        font-weight: unset;
        font-family: "Roboto-Light";
    }

    .review-client .total-earned-field h5 {
        letter-spacing: 3px;
        margin: 15px 0;
        font-family: "Roboto-Light";
        font-size: 18px;
    }

    .review-client .ps-bottom-icon img {
        width: 50px;
    }

    .review-client .ps-bottom-icon {
        position: absolute;
        bottom: 30px;
        right: 20px;
    }

    .review-client .submit-btn-sec input {
        font-family: "Roboto-Light";
        letter-spacing: 5px;
        font-size: 20px;
        padding: 5px 50px;
    }


.comment-box textarea.form-control {
    text-align: center;
    font-style: italic;
}



.review-client .total-earned-div {
    padding: 0 60px;
}

@media only screen and (max-width: 500px) {
    .review-client #ratingStars img {
        width: 35px;
    }

    .review-client .submit-btn-sec input {
        font-family: "Roboto-Light";
        letter-spacing: 5px;
        font-size: 15px;
        padding: 3px 25px;
    }

    .review-client .ps-icon {
        display: none;
    }
}


/*#endregion Client Review Popup CSS  */



/*#region Staff Review Popup CSS  */

.review-popup {
}
/*.review-staff .logo-heading {
      width: 350px;
  }*/

.review-staff h1 {
    font-weight: bold;
}

.review-popup .profile-pic {
    width: 200px;
    height: 200px;
    border-radius: 50%;
    margin: 0 5px;
}


.review-staff {
    background-color: #fff;
    width: 100%;
    text-align: center !important;
    position: relative;
    color: #000 !important;
}

    .review-staff .logo-heading {
        width: 50%;
    }

    .review-staff .p-circle-image .p-img-item img {
        width: 80px;
    }

    .review-staff .comment-box textarea::placeholder {
        color: #000;
        font-weight: unset;
        font-family: "Roboto-Light";
    }

    .review-staff .total-earned-field h5 {
        letter-spacing: 3px;
        margin: 15px 0;
        font-family: "Roboto-Light";
        font-size: 18px;
    }

    .review-staff .ps-bottom-icon img {
        width: 50px;
    }

    .review-staff .ps-bottom-icon {
        position: absolute;
        bottom: 30px;
        right: 20px;
    }

    .review-staff .submit-btn-sec input {
        font-family: "Roboto-Light";
        letter-spacing: 5px;
        font-size: 20px;
        padding: 5px 50px;
    }


    .review-staff .total-earned-div {
        padding: 0 60px;
    }

    .review-staff .info-section label {
        letter-spacing: 3px;
    }

    .review-staff .info-section {
        font-size: 18px;
    }

@media only screen and (max-width: 500px) {
    .review-staff #ratingStaffStars img {
        width: 35px;
    }

    .review-staff .total-earned-field h5 {
        font-size: 14px;
        letter-spacing: 2px;
    }

    .review-staff .submit-btn-sec input {
        font-family: "Roboto-Light";
        letter-spacing: 5px;
        font-size: 15px;
        padding: 3px 25px;
    }
}


/*#endregion Staff Review Popup CSS  */



/*#region Review Screen CSS  */
.comment-td {
    width: 30%;
}

.star-img {
    width: 20px
}

@media only screen and (max-width: 500px) {
    .star-img {
        width: 10px
    }

    .rborder {
        border-right: 1px solid #000;
    }

    .revmbl {
        font-size: 13px;
    }
}

.review-name,
.review-name a {
    font-size: 14px;
    font-weight: bold;
    color: #221f20;
    line-height: 18px;
    text-transform: uppercase;
    letter-spacing: 2px;
}

.review-date {
    margin-bottom: 10px;
}

.review-desc {
    margin-bottom: 10px;
}

.staff-review .rating {
    margin: 25px 0;
}
/*#endregion Review Screen CSS  */

.light-gray-bg {
    background-color: lightgray;
}

/*#region whatsapp button CSS  */

.custom-whatsapp {
    display: inline-block;
    padding: 12px;
    border-radius: 8px;
    background-color: #25D366;
    color: #fff;
    text-decoration: none;
    font-family: 'Roboto-Bold';
    font-size: 16px;
}

a.custom-whatsapp:hover {
    color: white !important;
}
/*#endregion whatsapp button CSS  */

/*#region Tooltip CSS  */
/* Tooltip container */
.tooltip1 {
    position: relative;
    display: inline-block;
    /*border-bottom: 1px dotted black;*/ /* If you want dots under the hoverable text */
}

    /* Tooltip text */
    .tooltip1 .tooltiptext {
        visibility: hidden;
        width: 100px;
        background-color: black;
        color: #fff;
        text-align: center;
        padding: 5px 0;
        border-radius: 6px;
        /* Position the tooltip text - see examples below! */
        position: absolute;
        z-index: 1;
        font-size: 10px;
    }

    /* Show the tooltip text when you mouse over the tooltip container */
    .tooltip1:hover .tooltiptext {
        visibility: visible;
    }
/*#endregion Tooltip CSS  */


/*#region Whatsapp Floating Button CSS  */



.whatsapp-float{
    position: fixed;
    width: fit-content;
    height: 50px;
    bottom: 30px;
    right: 40px;
    background-color: #25d366;
    color: #FFF;
    border-radius: 50px;
    text-align: center;
    font-size: large;
    box-shadow: 2px 2px 3px #999;
    z-index: 100;
    text-decoration: none;
    padding: 12px;
    display: flex;
}

a.whatsapp-float:hover {
    color: white !important;
}

.i-whatsapp-float{
	margin-top:-5px;
}


@media only screen and (max-width: 500px) {
        
    .whatsapp-float{
        width:50px;
        height:50px;
        bottom:20px;
        right:10px;
        font-size:large;

        position:fixed;
        background-color:#25d366;
        color:#FFF;
        border-radius:50px;
        text-align:center;
        box-shadow: 2px 2px 3px #999;
        z-index:10;
        text-decoration: none;
        padding: 0;
        display: block;
    }
        
    .i-whatsapp-float{
        margin-top:5px;
    }


}
/*#endregion Whatsapp Floating Button CSS  */

/*#region intro-btns Button CSS  */
.intro-btns {
    display: inline-block;
    padding: 20px;
    border-radius: 5px;
    text-decoration: none;
    font-family: 'Roboto-Bold';
    font-size: 16px;
}

/*#endregion intro-btns Button CSS  */


/*** Blog Listing ***/
.blog-category-list {
    margin: 20px 0;
}

    .blog-category-list a {
        display: inline-block;
        color: #221f20;
        font-size: 16px;
        line-height: 18px;
        text-transform: uppercase;
        font-weight: 500;
        letter-spacing: 1px;
        padding: 5px 10px;
        margin-bottom: 10px;
    }

        .blog-category-list a.selected {
            color: #ee373d;
        }

.blog-post-item {
    display: block;
    position: relative;
    width: 100%;
    min-height: 480px;
    padding-bottom: 30px;
    margin-bottom: 20px;
    box-shadow: 5px 4px 10px 1px rgba(204, 204, 204, 0.5);
    -moz-box-shadow: 5px 4px 10px 1px rgba(204, 204, 204, 0.5);
    -webkit-box-shadow: 5px 4px 10px 1px rgba(204, 204, 204, 0.5);
    -o-box-shadow: 5px 4px 10px 1px rgba(204, 204, 204, 0.5);
}

.blog-date {
    position: absolute;
    left: 30px;
    top: 15px;
    height: 60px;
    width: 60px;
    border-radius: 50%;
    background: linear-gradient(to right, #ee343f, #ee373d);
    color: #ffffff;
    text-align: center;
    padding: 10px;
}

.blog-date-day {
    font-size: 22px;
    font-weight: bold;
    line-height: 22px;
}

.blog-date-month {
    font-size: 14px;
    line-height: 16px;
}

.blog-banner-wrap {
    overflow: hidden;
}

    .blog-banner-wrap .blog-banner {
        width: 100%;
        height: auto;
    }

.blog-title {
    color: #221f20;
    font-size: 18px;
    line-height: 20px;
    text-transform: uppercase;
    font-weight: bold;
    letter-spacing: 1px;
    padding: 15px;
    margin: 0;
}

.blog-excerpt {
    color: #221f20;
    font-size: 14px;
    padding: 0 15px;
}

.blog-categories {
    color: #ee373d;
    font-size: 13px;
    text-transform: uppercase;
    font-weight: 500;
    padding: 0 15px;
}
/*** Blog Details ***/
.blog-detail .blog-banner {
    width: 100%;
}

.blog-detail-category {
    margin: 15px 0;
}

    .blog-detail-category .blog-detail-date {
        color: #221f20;
        display: inline-block;
    }

    .blog-detail-category .blog-categories {
        display: inline-block;
    }

.blog-detail-share {
    border-bottom: 1px solid #221f20;
    padding-bottom: 20px;
}

.blog-detail-title {
    color: #221f20;
    font-size: 24px;
    line-height: 24px;
    text-transform: uppercase;
    font-weight: bold;
    letter-spacing: 1px;
    margin: 20px 0;
}

.blog-detail-prev-next {
    padding-top: 20px;
    margin-top: 30px;
    border-top: 1px solid #221f20;
}

    .blog-detail-prev-next a {
        max-width: 40%;
    }

        .blog-detail-prev-next a .text {
            font-size: 15px;
            color: #221f20;
            text-transform: uppercase;
            letter-spacing: 1px;
            font-weight: 500;
        }

    .blog-detail-prev-next .blog-link-title {
        color: #ee373d;
        font-weight: bold;
        font-size: 18px;
    }

.blog-detail img {
    width: 100%;
    height: auto;
}

.blog-detail h2 {
    font-size: 18px;
    margin-bottom: 10px;
}


/*#region Blog CSS  */
/* Style for the blog card container */
/* Style for the container holding the blog cards */
.blog-cards-container {
    display: flex;
    flex-wrap: wrap;
    /* justify-content: space-between; */
    font-family: "Roboto-Regular" !important;
}

/* Style for each individual blog card */
.blog-card {
    flex: 0 0 calc(32% - 10px);
    margin: 10px;
    overflow: hidden;
    display: inline;
    /* flex-direction: column; */
    /* align-items: center; Center content horizontally */
    position : relative;
    box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.2);
}
@media only screen and (max-width: 767px) {
    .blog-card {
        flex: auto;
    }
    .section-heading {
        font-size: small !important;
    }
}
.blog-title{
    font-family: "Roboto-Bold" !important;
}

/* Style for the blog image with a specific height and center vertically */
/* .blog-image {
    height: 300px; 
    display: flex;
    justify-content: center; 
    align-items: center; 
    overflow: hidden;
} */

.blog-image {
    /* height: 345px; */
    display: inline;
    /* flex-flow: column-reverse; */
}

/* Style for the blog details (date, author, title, description) */
.blog-details {
    flex: 2;
    padding: 0 10px 0 10px;
    margin-right: auto;
    font-size: 14px;
}

@media only screen and (max-width: 767px) {
    .blog-details {
        margin-top: 20px;
    }
}

.blog-date {
    color: #999;
}

.blog-author {
    color: #999;
}

.blog-details-cards-container {
    font-family: "Roboto-Regular" !important;
    width: 100%;
    display: inline-block;
    box-sizing: border-box;
    padding: 0 15px;
}

.blog-detail-card {
    margin: 10px;
    overflow: hidden;
    align-items: center; /* Center content horizontally */
    position: relative;
    box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.2);
    width: 33.33%;
    display: inline-block;
}

.blog-title {
    font-size: 30px;
    margin: 10px 0;
    line-height: 30px;
}

.blog-title-main {
    font-size: 30px;
    margin: 10px 0;
    max-height: 36px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: block;
    width: auto;
    line-height: 35px;
    white-space: nowrap;
}

.blog-description {
    max-height: 36px; /* Limit description to two lines (30px per line) */
    overflow: hidden;
    text-overflow: ellipsis; /* Add ellipsis (...) to indicate truncation */
    font-size: 14px;
    display: block;
    font-family: Roboto-Light;
    width: auto;
    white-space: nowrap;
}

/* Style for the "Read More" button */
.read-more {
    font-size: 11px;
    text-decoration: none;
    font-family: Roboto-Regular;
}

/* Style for the "Read More" button on hover */
.read-more:hover {
    background-color: red;
    color: black;
    
}
.blog-more {
    padding: 10px;
    margin-right: auto;
    margin-left: 15px;
    margin-top: auto;
}

.banner-image {
    width: 100%; /* Ensure the div stretches to the full width of its container */
    overflow: hidden; /* Hide any content that extends beyond the div */
    height: 250px; /* Set the height of the banner image */
}

.banner-image img {
    width: 100%; /* Make the image width match the div's width */
    height: 100%; /* Make the image height match the div's height */
    object-fit: cover; /* Maintain the aspect ratio while covering the div */
}
/* Style for the container for your blog content */
.blog-detail-container {
    background-color: rgba(255, 255, 255, 0.8); /* Add a semi-transparent background for readability */
}



.blog-page .p-images-sec .delete-icon {
    position: absolute;
    bottom: 5px;
    right: 10px;
}

.blog-page .p-images-sec .item {
    width: 30%;
    height: 95px;
    position: relative;
}

    .blog-page .p-images-sec .item img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

.blog-page .p-images-sec .item-three.item input {
    opacity: 0;
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: 1;
}

.blog-page .p-images-sec .item-three.item {
    position: relative;
}

.blog-page .p-images-sec .item-three .box {
    width: 100%;
    z-index: 0;
    height: 100%;
    border: 2px solid;
    display: flex;
    align-items: center;
    justify-content: center;
    border-style: groove;
    border-color: black;
}



.blog-page .blog-main-image .blog-img {
    width: 100%;
}

.blog-page .blog-main-image .delete-icon {
    position: absolute;
    bottom: 5px;
    right: 10px;
}

.blog-page .blog-main-image .item-three .box {
    width: 100%;
    height: 250px;
    /* height: 100%; */
    border: 2px solid;
    display: flex;
    align-items: center;
    justify-content: center;
    border-style: groove;
    border-color: black;
}


.blog-main-image {
    position: relative;
}

    .blog-main-image a {
        display: block;
    }

    .blog-main-image img {
        max-width: -webkit-fill-available;
    }

    .blog-main-image a.delete {
        position: absolute;
        bottom: 5px;
        right: 5px;
        width: 20px;
        height: 26px;
        background: url("/images/ibiza/delete-icon.png") no-repeat;
        z-index: 2;
        border-radius: 5px;
    }

    .blog-slider{
        height: 520px;
        width: 86% !important;
    }

    .blog-slider.slick-slider{
        display: flex !important;
    }

    .blog-slider.slick-initialized .slick-slide{
        display: inline-table;
    }
    .blog-slider .slick-dots{
        display: none !important;
    }
    .blog-body{
        font-family: 'Roboto-Light' !important;
    }

    .social_icons {
        padding: 18px;
    }
    
    .ck-editor__editable_inline {
        min-height: 400px;
    }
/*#endregion Blog CSS  */




/*#region Boat CSS Start*/

.boat-list-view {
    display: inline-block;
    font-size: 18px;
    color: #221f20;
    background: #f3f3f3;
    padding: 5px 8px;
    margin: 0 5px;
    vertical-align: middle;
    line-height: 22px;
}

    .boat-list-view:focus,
    .boat-list-view:hover {
        color: #221f20;
        background: #f3f3f3;
    }

    .boat-list-view.active {
        background: #dddddd;
    }

#boat-list hr {
    border: 1px solid #000 !important;
    margin: 2rem 0 !important;
}


.boat-main h1 {
    font-size: 4rem;
    font-weight: bolder;
}

    .boat-main h1 span {
        color: #f42765;
    }

.action-container {
    display: flex;
    justify-content: center;
    gap: 30px;
}
@media (max-width: 800px) {
    .action-container {
        display: flex;
        justify-content: center;
        gap: 10px;
        flex-direction: column;
        align-items: center;
    }

        .action-container a {
            width: 80%;
        }
}

a.btn.bt-btn {
    min-width: 192px;
    text-align: center;
    background-color: black;
    border-radius: 0px;
    color: #fff;
    border: 0px solid;
    font-size: 20px;
    height: 50px;
    align-items: center;
    display: flex;
    justify-content: center;
}

a.btn.btn.bt-btn.ybtn-b {
    background-color: #f42765;
}

a.btn.bt-btn.xbtn-b {
    background-color: #fff !important;
}

.custom-bottom{
    bottom: 80px;
}

@media (max-width: 767px) {
    .custom-bottom{
        bottom: 100px;
    }
}
.carousel-control-next-icon, .carousel-control-prev-icon {
    display: inline-block;
    width: 52rem !important;
    height: 100%;
    background-repeat: no-repeat;
    background-position: 50%;
    background-size: 100% 100%;
}

.boat-enquire-list-btn {
    border: 1px solid;
    font-family: 'Roboto-regular';
    letter-spacing: 3px;
    font-size: .8rem;
}
    .boat-enquire-list-btn:hover {
        border: 1px solid #000;
    }


@media only screen and (max-width: 767px) {
    .boat-enquire-details-btn {
        border: 1px solid;
        font-family: 'Roboto-regular';
        letter-spacing: 3px;
        font-size: .8rem;
    }

}


.carousel-control-next, .carousel-control-prev {
    width: 20%;
    height: 100%;
    opacity: 1 !important;
}

.like-mark {
    position: absolute;
    bottom: 5px;
    left: 10px;
    z-index: 999;
}

.carousel-item {
    transition-duration: 500ms;
}

@media only screen and (max-width: 767px) {
    .feature img {
        width: 30%;
    }


    .carousel-mobile {
        height: 45vh;
    }

    .carousel-mobile-inner {
        height: 100%;
    }

    .m-text-sm {
        font-size: 16px;
    }
}

@media only screen and (min-width: 767px) {

    /*.carousel-mobile {
        height: 70vh;
    }*/

    .carousel-mobile-inner {
        height: 100%;
    }
}
    .staff-img {
        position: relative;
    }

    /*#endregion Boat CSS End*/

/*#region Villa CSS Start*/

.villa-list-view {
    display: inline-block;
    font-size: 18px;
    color: #221f20;
    background: #f3f3f3;
    padding: 5px 8px;
    margin: 0 5px;
    vertical-align: middle;
    line-height: 22px;
}

    .villa-list-view:focus,
    .villa-list-view:hover {
        color: #221f20;
        background: #f3f3f3;
    }

    .villa-list-view.active {
        background: #dddddd;
    }

#villa-list hr {
    border: 1px solid #000 !important;
    margin: 2rem 0 !important;
}


.villa-main h1 {
    font-size: 4rem;
    font-weight: bolder;
}

    .villa-main h1 span {
        color: #f42765;
    }

.action-container {
    display: flex;
    justify-content: center;
    gap: 30px;
}


a.btn.bt-btn {
    min-width: 192px;
    text-align: center;
    background-color: black;
    border-radius: 0px;
    color: #fff;
    border: 0px solid;
    font-size: 20px;
    height: 50px;
    align-items: center;
    display: flex;
    justify-content: center;
}

a.btn.btn.bt-btn.ybtn-b {
    background-color: #f42765;
}

.carousel-control-next-icon, .carousel-control-prev-icon {
    display: inline-block;
    width: 52rem !important;
    height: 100%;
    background-repeat: no-repeat;
    background-position: 50%;
    background-size: 100% 100%;
}

.villa-enquire-list-btn {
    border: 1px solid;
    font-family: 'Roboto-regular';
    letter-spacing: 3px;
    font-size: .8rem;
}

    .villa-enquire-list-btn:hover {
        border: 1px solid #000;
    }



.carousel-control-next, .carousel-control-prev {
    width: 20%;
    height: 100%;
    opacity: 1 !important;
}

.like-mark {
    position: absolute;
    bottom: 5px;
    left: 10px;
    z-index: 999;
}

.carousel-item {
    transition-duration: 500ms;
}

@media only screen and (max-width: 767px) {
    .action-container {
        display: flex;
        justify-content: center;
        gap: 10px;
        flex-direction: column;
        align-items: center;
    }

        .action-container a {
            width: 80%;
        }

    .villa-enquire-details-btn {
        border: 1px solid;
        font-family: 'Roboto-regular';
        letter-spacing: 3px;
        font-size: .8rem;
    }

    .feature img {
        width: 30%;
    }


    .carousel-mobile {
        height: 45vh;
    }

    .carousel-mobile-inner {
        height: 100%;
    }

    .m-text-sm {
        font-size: 16px;
    }
}

@media only screen and (min-width: 767px) {

    /*.carousel-mobile {
        height: 70vh;
    }*/

    .carousel-mobile-inner {
        height: 100%;
    }
}

.staff-img {
    position: relative;
}



section.find-villa-section {
    margin: 0 auto;
    background: #fff;
    width: 80%;
    margin: 0 auto;
    margin-top: 0px;
    height: 100%;
    min-height: 1100px;
    position: relative;
}

section.find-villa-section .staff-desc {
    line-height: 18px;
}

.staff-img img {
    width: 100%;
}

@media only screen and (max-width: 1024px) {
    section.find-villa-section {
        height: 900px;
    }
}

@media only screen and (max-width: 768px) {
    section.find-villa-section {
        height: 700px;
        width: 100% !important;
    }

    .find-villa-section .sorting-top-filter {
        display: none !important;
    }
}

.findvilla-main-banner {
    height: 100%;
}

    .findvilla-main-banner img {
        height: 100%;
        width: 100%;
        margin-top: -650px;
    }

@media only screen and (max-width: 767px) {
    /* section.find-villa-section-mbl {
    display: block !important;
    width: 80%;
    margin: 0 auto;
    background: #fff;
    position: absolute;
    left: 0;
    right: 0;
    top: 35%;
  } */
    .findvilla-main-banner {
        height: 450px;
    }

        .findvilla-main-banner img {
            object-fit: cover;
            margin-top: -260px;
        }

    section.find-villa-section {
        height: 100%;
        min-height: 100%;
        margin-top: -260px;
        margin-bottom: 50px;
    }

        section.find-villa-section .staff-desc {
            display: none;
        }

        section.find-villa-section .staff-ratings {
            font-size: 12px;
            gap: 3px !important;
        }

        section.find-villa-section .staff-name {
            font-size: 12px;
        }

        .details-like-mark {
            margin-bottom: 40px;
        }
}

/*#endregion Villa CSS End*/

/* #region client-chat-screen Start*/
.head-style{
    text-transform: uppercase;
    letter-spacing: 3px;
}
/*#endregion client-chat-screen End*/

/*#region Member Packages CSS start*/
.box-inner-content {
    font-size: 16px;
}
.packages-text small {
    display: inline-block;
    font-size: 14px;
}
.promo-text{
    letter-spacing: 3px;
}
.card-section-text{
    letter-spacing: 2px;
    font-family: 'Roboto-Light';
    font-size: 14px;
}
.activate-btn-text{
    letter-spacing: 2px;
    font-family: 'Roboto-Bold';
    width: 300px;
    height: 35px;
}
.payment-box{
    padding: 20px 90px 0 90px;
}
@media only screen and (max-width: 767px) {
    .box-inner-content {
        font-size: 12px;
    }
    .payment-box{
        padding: 20px 15px 0 15px;
    }
    .card-section-text{
        font-size: 12px;
    }
    .mobile-font-twelve{
        font-size: 12px !important;
    }
}
    /*#endregion Member Packages CSS end*/

    /* #region Sticky menu for mobile version */
    .sticky-mobile-menu {
        position: fixed;
        bottom: 0;
        left: 0;
        width: 100%;
        background-color: #fff; /* Background color */
        box-shadow: 0 -2px 5px rgba(0, 0, 0, 0.1); /* Shadow for depth */
        z-index: 1000; /* Ensure it stays on top */
        padding: 10px 0;
    }

    .sticky-mobile-menu .col {
        padding: 5px;
    }

    .sticky-mobile-menu a {
        color: #000; /* Default text color */
        transition: color 0.3s ease; /* Smooth hover effect */
    }

    .sticky-mobile-menu a:hover {
        color: #007bff; /* Hover color (blue) */
    }

    .sticky-mobile-menu .small {
        font-size: 12px; /* Smaller text for labels */
        margin-top: 5px; /* Space between icon and text */
    }

    /* Theme-specific hover effects */
    .sticky-mobile-menu a:hover i {
        transform: scale(1.1); /* Slightly enlarge icons on hover */
        transition: transform 0.3s ease;
    }
    
    /* Unread Messages Counter */
    .badge {
        font-size: 10px; /* Smaller font size for the counter */
        padding: 3px 6px; /* Padding for the badge */
        border-radius: 50%; /* Circular badge */
        position: absolute;
        top: 8px;
    }
    /* #endregion Sticky menu for mobile version */