@layer header;

@import "./bootstrap.min.css" layer(header);

@import url(filtretheme.css);
@import url(colors.css);
body {

    background-image: url('../img/bg-page.jpg');
    background-position: top left;
    background-repeat: no-repeat;
    background-size: 100%;
}


.price-hide-on-list {
    background: none;
    padding: 10px;
}

.price-hide-on-list .price-start {
    color: #fff !important;
    margin: 5px !important;
}


.col {
    flex: 1 0 0%;
}


/****************************28*11********************************************/


.text-end {
    display: inline-flex;
    justify-content: end;
}

.item-thumb,
figure,
.carousel-module .carousel .item figure {
    z-index: 0 !important
}






.property-item .voyage-header .item-body,
.property-item .be-produit-header .item-body,
.property-item .hotel-header .item-body {
    display: initial;
}

@media only screen and (min-width: 767px) {
    .property-item .item-body {
        width: 100%;
        padding-bottom: 0;
    }

    #be-produit,
    #voyage,
    #hotel {
        display: flex;
    }

    .image-block {
        height: 100%;
        display: contents;
    }

    .photo-voyage,
    .photo-be-produit,
    .photo-hotel {
        height: 100%;
        width: 370px !important;
        object-fit: cover;
        position: relative;
        border-radius: 4px 0 0 4px;
    }

    #be-produit .hidden-gird-cell,
    #hotel .hidden-gird-cell {
        display: flex !important;
        flex-direction: column;
        justify-content: space-between;
        text-align: end;
    }

    #voyage .item-body,
    #be-produit .item-body,
    #hotel .item-body {
        display: flex !important;
    }

    #flex-col {
        display: flex !important;
        flex-direction: column;
        justify-content: space-between;
    }
}

@media ( max-width: 767px) {
    .photo-voyage,
    .photo-hotel {
        max-height: 180px;
        object-fit: cover;
    }
}

#voyage .item-body .rating,
#be-produit .item-body .rating,
#hotel .item-body .rating {
    line-height: inherit;
    margin-left: 5px;
}

#be-produit .item-body .label,
#hotel .item-body .label {
    text-align: left;
    white-space: initial;
    margin-bottom: 2px;
}


#availibility_voyage,
#availibility_car,
#availibility_hotel {
    font-size: 22px;

}

:root .table-general tbody .tr-options .td-price .media .media-right .booking.btn-booking {

    background-color: #e99000 !important;
}

:root .table-general tbody .tr-options .td-price .media .media-left .box-price .price {
    color: #006ab4 !important;
}


#voyage .item-body .property-location {
    margin: 10px 0 10px 0;

}

.price .old-price {
    color: red !important;
    text-decoration: line-through;
}


/*******/
h1, h2, h3, h4, h5 {
    line-height: initial !important
}


ul#tools_2 {
    margin-top: 30px;
    margin-bottom: 30px
}


ul#tools_2 li a i,
ul#tools_2 li form i {
    font-size: 26px;
    position: absolute;
    left: 15px;
    top: 13px;
    margin: 0;
    padding: 0;
    line-height: 1;
    color: #00335a;
    text-align: left;
}

.property-location .fa {
    color: #e59300 !important
}

.multiselect__option--highlight {

    background: #0ba8d0 !important;
}

#voyage .price h3 {
    /* color: #006ab4 !important;*/
    font-weight: bold;
    font-size: 20px;
}

.modal {
    z-index: 999999999
}

.advance-search-header {

    padding: 12px;
    background: var(--var-primary);
    margin-top: 5px;
}

.form-control[readonly] {
    background-color: #fff;

}
.dropdown-toggle::after{
    display: none;
}


.property-item {

    box-shadow: none;
    padding: 0;
    border: 1px solid #eee;
    border-radius: 4px;
}

.property-listing .item-wrap {

    margin-bottom: 30px;
}

.sidebar-white .widget {
    background: linear-gradient(125deg, rgb(26 101 175 / 10%), rgba(251, 176, 59, .1));
   border-radius:4px;
    box-shadow: 0 8px 15px rgba(0, 0, 0, 0.1);

}
.property-item .item-body{
    padding:12px
}

.avn-btn,.btn-primary , .btn-secondary.btn-long , .btn-success , .advanced-search-mobile .advance-fields .btn{
    border-radius: 4px;
    background-color: var(--var-yellow) !important;
    font-weight: 500;
    font-size: 16px;
    color: #000 !important;
    text-transform: capitalize;
    line-height: 1;
    padding: 16px 32px;


    gap: 10px;
    transition: .5s;
    position: relative;
    overflow: hidden;
    z-index: 1;
    white-space: nowrap;
    border: 1px solid var(--var-yellow) !important;  ;
    display: flex;
    align-items: center;
    justify-content: center;
}

.typeahead__result .typeahead__list .typeahead__item a span.row i {
    width: auto;
}
.avn-btn,.btn-primary:hover , .btn-primary:active , .btn-primary:active:hover  , .btn-secondary.btn-long:hover , .btn-success:hover , .advanced-search-mobile .advance-fields .btn:hover {
    background-color: #ffffff !important;
    border: 1px solid var(--var-primary) !important ;
    color: var(--var-primary) !important ;

}

.btn-secondary{
    border-radius: 4px;
    background-color: var(--var-theme);
    font-weight: 500;
    font-size: 16px;

    text-transform: capitalize;
    line-height: 1;
    padding: 16px 32px;

    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    transition: .5s;
    position: relative;
    overflow: hidden;
    z-index: 1;
    white-space: nowrap;
    border: none;
    color:#fff
}


.hotel-prices{
    padding:12px
}

.hotel-prices hr {

    margin-top: 0;
    margin-bottom: 0;
}

.hotel-prices .form-group {

    margin-bottom: 0;
}

.widget-info,.payment-side-block {
    border: 1px solid #eee;
    border-radius: 6px;
    box-shadow: none;
}
.info-title .info-title-left {
    font-size: 22px;

    color:#000;
    font-weight: 500;
    line-height: 1.2;
    transition: .35s;
    margin-bottom: 15px;
}

.form-control{

    border-radius: 4px !important;

height:50px;


    font-weight: 400;

/*
    border: 1px solid #eee !important;*/
}
.typeahead__container .typeahead__field input, .typeahead__container .typeahead__field textarea, .typeahead__container .typeahead__field [contenteditable], .typeahead__container .typeahead__field .typeahead__hint, .typeahead__container .typeahead__field .typeahead__label-container {
    height: 50px;
}
.search-long .search-btn .btn {
   background: var(--var-yellow);
    height: 51px !important;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: .5s;
    position: relative;
    overflow: hidden;
    z-index: 1;
    border: none;
    color: black;
}


.search-long .search-btn .btn:before{

    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 3px solid transparent;
    box-sizing: border-box;
    transition: all 0.8s ease;
}

.search-long .search-btn .btn:hover {

    background-color: transparent;
    color: var(--var-yellow);
}


.search-long .search-btn .btn:hover:before {

    border-color: var(--var-yellow);
    border-radius: 4px;
    stroke-dasharray: 15, 310;
    stroke-dashoffset: 48;
    animation: borderAnimation 1.5s cubic-bezier(0.19, 1, 0.22, 1) forwards;
}

@keyframes borderAnimation {
    0% {
        clip-path: inset(0 0 98% 0);
    }
    25% {
        clip-path: inset(0 98% 0 0);
    }
    50% {
        clip-path: inset(98% 0 0 0);
    }
    75% {
        clip-path: inset(0 0 0 98%);
    }
    100% {
        clip-path: inset(0 0 0 0);
    }
}









#tarifs .search-long input{
    border:1px solid transparent;
}
.text-crope {
    font-size: 14px;
    font-weight: 500;
    display: block;
    color: #000;
    margin-bottom: 4px;
}

.item-body .property-location {
    font-weight: 700;
    color: #94A1B9;
}

.bottom-ratings .fa, .top-ratings .fa {
    color: #F4B01B;
    font-size: 12px;
    letter-spacing: 3px;
}

.scrolltop-btn .fa-angle-up {
    font-weight: 600;
}

.scrolltop-btn {

    background-color: var(--var-secondary);
}

.tagcloud a {

    font-weight: 300;
    color: var(--var-primary);
    border: 1px solid var(--var-primary);
}
.tagcloud a:hover {

    background-color: var(--var-primary);
    border: var(--var-primary);
}

label{
    font-size: 12px;
    line-height: 12px;
}

.property-item .property-title a {
    font-weight: 800;
    font-size: 18px;
    color: #000;
}


.liste-pensions {

    padding-bottom: 0;
    border-bottom: 1px solid #dee2e6;
}
.liste-pensions .nav-tabs {
display: flex;
    flex-wrap: nowrap;
    background-color: #fff;
    overflow-x:auto;
    overflow-y:hidden !important;
}

.liste-pensions .nav-tabs > li a {
    margin-bottom: 0;
    border: none;
    font-weight: 600;
    font-size: 16px;
    color: #94A1B9;
    white-space: nowrap;
}


.liste-pensions .nav-tabs > li.active > a,.nav-tabs > li.active > a,
.liste-pensions .nav-tabs > li.active > a:hover,.nav-tabs > li.active > a:hover,
.liste-pensions .nav-tabs > li.active > a:focus,.nav-tabs > li.active > a:hover{
    color: var(--var-primary);
    border: 1px solid transparent;
    background: transparent !important;


    border-bottom: 2px solid;
}


.membership-content {


    border: 1px solid #eee;
    border-radius: 4px;
}

input[type=checkbox], input[type=radio] {
    margin: 0;

}

.detail-block {

    border: 1px solid #eee;
    border-radius: 6px;
}

.detail-title .title-left {

    font-size: 22px;
    margin: 10px;
    color: var(--var-primary) !important;
}

.property-description ul {

    padding-left: 0 !important;
}
.modal-content {

    border-radius: 6px;
}

.modal-header {
    background-color: #fff;
    border-radius: 6px 6px 0 0;
}

.modal-header > * , .modal-header .close .fa{

    color: #000 !important;
    font-size: 20px !important;
    font-weight: 600 !important;
}

.step.info-detail label.form-check-label{
    padding-left: 8px;
}


.step .form-group label{
    color: var(--var-primary);
}

.avn-price-table.avn-style15 > .avn-tables > .avn-table > .header {

    background: var(--var-secondary) !important;
    padding: 18px !important;
    height: auto !important;
}

.header-detail .item-price {
    color: var(--var-secondary);
}

.pt-vente-select {
    background: #fff;
}

.payment-side-block .input-group{
    flex-wrap: nowrap;
}
.payment-side-block .input-group .input-group-append {
    background: var(--bs-cyan);
    color: #fff;
    border-radius: 0 4px 4px 0;
}

.payment-side-block .item-thumb > img {
    border-radius: 4px;
}


/*mobile**/

.advanced-search-mobile {

    box-shadow: 0 2px 2px rgba(0, 0, 0, 0.2);
    background-color: #fff;
    border: 1px solid var(--var-secondary);
    border-radius: 6px;
}
#mobile-destination, #mobile-sejour {

    color: #000 !important;
    font-weight: 500;
}
#mobile-occupations {

    color: #000 !important;
    font-weight: 600;
}

.margtop15{
    top:0 !important
}

.pagination-main .pagination li.active a {

    background-color: var(--var-theme);
    border-radius: 4px;
}
@media (max-width: 991px) {
    .property-item .btn {

        font-size: 14px;
        padding: 12px 24px;
    }

   .stikynavbar{
       width: 100%;
        margin:0 !important;
    }
    .form-control{



            border: 1px solid #eee !important;
    }
}


@media (max-width: 767px) {
    .property-listing.list-view .property-item .item-body {
        padding: 0;
    }

}


.my-col-auto .title-prix{
    display: flex;

    align-items: baseline;
justify-content: space-between;
    gap: 10px;
}

.my-col-auto .title-prix span.prix-list-sht{
    text-align: end;
}

.daterangepicker.show-calendar .drp-buttons {

    display: flex;
    align-content: center;
    align-items: center;
    justify-content: space-around;
    flex-wrap: nowrap;
    width: 100%;
}

/*.recap-total {

    background: green;
    color: #fff;
    padding: 5px;
    border-radius: 4px;
}*/

@media (max-width: 767px) {
    .container {
        width: 100%;
        padding:0 20px
    }
}

#sidebar-mobile{
    padding:20px
}

@media (max-width: 991px) {
    #sidebar-mobile .modal-header {

        background-color: #fff !important;
    }
}
/*btn modal**/

.btn.btn-primary.add-room-filtrev2.btn-block {
    padding:14px !important;
    background: #fff !important;
    color:#6c757d !important;
    border:1px solid #6c757d !important;
}
.btn.btn-primary.add-room-filtrev2.btn-block:hover {
    color:#fff !important;
    background-color:#6c757d !important;
    border-color:#6c757d !important
}


.property-item .cell {

    width: 100% !important;

}

.sort-tab .bootstrap-select .btn.btn-default {

    font-size: 12px !important;
}

/*login**/
.login-register-block {
    border: 1px solid #eee;
    border-radius: 6px;
}
.login-register-block .input-pass::before,.login-register-block .input-user::before {

    background: var(--var-secondary);
    color: #fff !important;
}

.login-register-block .field-group {
    border: none;
}
.login-register-block .input-icon {
    border: 1px solid #eee;
    margin-bottom: 20px;
}
.login-register-block .input-icon input {
    padding-left: 50px;
}

.login-register-block .input-icon + .input-icon {
    border-top: none;
}
.user-dashboard-full .form-control{
    height:45px !important;
}
.slick-slide img {
    border-radius: 6px;
}

.invoice-form .input-group-addon {
    border: none;
}
.input-icon + .input-icon {
    border-top: 1px solid transparent;
}


@media (max-width: 992px) {
    .sticky-advanced-search {
        position: relative;

    }
}


.property-item:hover img , .property-item:hover img {
    transform: scale(1.04);
    transition: all .3s;
}



.payment-side-block .recap-total {
    color: red;
}


.property-item .image-block .item-thumb {
    overflow: hidden;
}


.avn-price-table.avn-style15 > .avn-tables > .avn-table > .avn-btn-main > .avn-btn {
    background-color: var(--var-yellow) !important;
color: #000 !important;
    border: none  !important;


}
