/*  wid - Wellness Individual Details */

.header-reserve-your-spa-btn {
   height: 48px;
   width: 238px;
   padding:6px;
}
.btn-font-styles{    
    font-family: "FreightSansProSemibold";
    font-size: 17px;
    font-weight: 600;
    line-height: 22px;
    text-align: center;      
}
.wid-container{
    background-color:#F7F8F6;
    padding:40px 0;
    
    
}


/* CSS For Section Overview */
.overview-section-div{
    max-width:760px;
    height:756px;
    text-align:left;
    float:left;
    position: relative;
    margin-bottom: 40px;
}
.overview-section-p{
    margin-right:106px;
}
.overview-section-btn-download-broucher{
    padding-top:12px;
    height:48px;
    width:240px; 
    text-align:center;  
}
.overview-section-btn-reserve-your-spa{
    padding:12px;   
    height:48px;
    width:240px; 
}
#offers{
    margin-left:-40px;
}
.available-offers-div{
    position: absolute;
    /* margin-top: 57px; */
    width: 712px;
    max-height: 327px;
    /* padding-top: 24px; */
    color: #FFFFFF;
    bottom: 0px;
    /* top: 100%; */
    display:none;
} 
.hr-line-solid{
    height: 1px;
    width: 712px;
    background-color: rgba(37,40,45,0.16);
}
.available-offers-image-text-div{
    width:600px;
    height:240px;
    background-color:white; 
    box-shadow: 0 4px 6px 0 rgba(131, 134, 163, 0.12); 
    margin-bottom:40px;
    margin-left:40px;                
}
.available-offers-image-text-div.fullwidth{    
    width:712px;
}
.available-offers-image-text-div:hover{
box-shadow: 0 20px 44px 0 rgba(131, 134, 163, 0.25);
}

.available-offers-image{
    width:200px;
    height:100%;
    float:left;
}
.available-offers-image.fullwidth{
    width:240px;
}
.available-offers-image img{
    object-fit: cover;
} 
.available-offers-text-content{
    width:400px;
    height:100%;
    padding-left:20px;
    padding-top:20px;
    display:inline-block;
    font-family: FreightSansProBook-Regular;
    color:black;
}
.available-offers-image-text-div.fullwidth .available-offers-text-content{
    width:470px;
}
.available-offers-btn-view-details{
    height: 35px;
    width: calc(100% - 20px);
    float:left;
    padding-top: 7px;    
    opacity: 0.7;
    text-align: center;       
    box-sizing: border-box;      
    border: 1px solid #232323;
    border-radius: 2px;
    box-shadow: 0 0 3px -1px rgba(37,40,45,0.7);        
}
.available-offers-buttons{
    visibility:hidden;
}
.available-offers-image-text-div:hover .available-offers-buttons{
    visibility:visible;
}
.available-offers-btn-view-details:hover{
    opacity: 1;
}
.available-offers-btn-book-this-offer{
    height: 35px;
    width: calc(100% + 80px);
    margin-left: 20px;
    margin-right:20px;
    padding-top: 7px;    
    text-align: center;    
    border-radius: 2px;
    display: inline-block;        
}
#offers .carousel-indicators {
    display:none;
}
.carousel-control-next{
    top:0px;
    right:0px;
}
#offers .outbox-next-icon {
    width: 66px;
    height: 66px;
    padding:23px;
    opacity:0.6;
}

.overview-side-image-div{
    max-width:564px;
    height:756px;
    display: flex;
}
.overview-side-image-div img{
    object-fit: cover;
}


/* CSS For Section Relax and Opul */
.relax-and-opul-div{
    padding:40px;
    /* margin-top:40px; */
    background-color:white;
    height:240px;
    /* max-width:1284px; */
    box-shadow: 0 4px 6px 0 rgba(131, 134, 163, 0.12); 
}
.relax-and-opul-content{
    margin-top:10px;
    /* font-family:FreightSansProBook-Regular; */
    /* max-width:951px; */
    /* height:87px; */
    text-align:left;
    height: 100%;
}
.relax-and-opul-content li{
    margin-top:12px;
}
.relax-and-opul-block{
    height:100%;
   display: flex;
   justify-content: start;
    margin-left:60px;
}
.relax-and-opul-block:first-child{
    margin-left:0px;
    width: 100%;
    height: 100%;
    min-height: 125px;
}

 
/* .relax-and-opul-block-one{
    width:222px;
}
.relax-and-opul-block-two{
    width:197px;
}
.relax-and-opul-block-three{
    width:187px;
    margin-left:60px;
}
.relax-and-opul-block-four{
    width:225px;
    margin-left:60px;
} */
.relax-and-opul-block-ul{
    list-style-type: none;
    padding: 0px;
    padding: 0;
    margin: 0;
    height: 100%;
    min-width: 300px;
}
.relax-and-opul-block-ul  li{
    flex: 1 0 25%;
    /* max-height: 20px; */
}
.relax-and-opul-block-ul  li i{
    /* display:table-cell; */
}
/* CSS For Section Our Treatments */
.our-treatments-div{
    padding:42px 40px 0px 40px;
    margin-top:40px;
    background-color:white;
    height:auto;
    max-width:1284px;
    box-shadow: 0 4px 6px 0 rgba(131,134,163,0.12);
}
/* acp for accordian pane */
.acp-card-header{
    background-color: white;
    border-bottom-style: none;
    border-top-style: dashed;
    border-top-color: rgba(0, 0, 0, 0.125);
    border-top-width: 1px;
    padding-left:0px;
    padding-top:23px;cursor: pointer;                                        
}
.acp-card-header-text{
    font-size:22px;
    font-family:FreightSansProBook-Regular ;
    line-height: 34px;
}
.acp-plus-icon{
    float: right;
    font-size: 16px;
    line-height: 16px;
    font-weight: 300;
    padding-right: 12px;
    padding-top: 9px;
    padding-bottom: 20px;
}
.accordion{
    margin-top:26px;
}
.accordion .card-body{
    padding: 0px 0px 40px 0px !important;
}
.accordion .card-body ul{
    margin-bottom:0px;
}

/* CSS For Accordian Our Treatments [ aot ]  */
.aot-collapseone-blockone{
    max-width:1204px ; 
    height:251px;
    padding:40px;    
    background-color: #F7F8F6;
    margin-bottom:4px;
    cursor:pointer;
}
.aot-collapseone-blockone-div-one{
    float:left;
    max-width:720px ;
    height:auto;
}
.aot-collapse-div{
    position: relative;
    min-width:100% ; 
    min-height:218px;
    padding-top:40px;
    padding-left:40px;  
    padding-bottom:40px;  
    background-color: #F7F8F6;margin-bottom:4px;
    cursor:pointer;
    display:inline-table;
}
.aot-collapse-div-content{
    float:left;
    max-width:720px ;
    height:auto;
    display:table-cell
}
.res-ur-spa-hidn-btn-div{
    position: absolute;
    right: 0;
    bottom: 40px;
    float:right;
    display:table-cell;
}
.hidden-reserve-your-spa-btn{   
    height: 48px;
    width: 238px;
    border: 1px solid #FFFFFF;
    border-radius: 4px; 
    color: white; 
    text-align: center;
    padding-top: 12px;  
    margin-left: 154px; 
    margin-right: 40px;
    /* float:left; */
    display: inline-block;
}
.aot-collapse-titles{
    font-size:17px;
    line-height:22px;
    font-family:FreightSansProSemibold;
    color: #25282D;
    margin-bottom:12px;    
}
.aot-collapse-subtext-p{
    color: #25282D;
    font-size: 17px;
    line-height: 21px;
    font-family: FreightSansProBook-Regular;
    margin-bottom:8px;
}
.aot-collapse-subtext-prize{
    color: #25282D;
    font-size: 17px;
    line-height: 21px;
    font-family: FreightSansProBook-Regular;
    margin-top:12px;
    margin-bottom:0px;
}
/* CSS For Accordian Spa Practices [ asp ]  */
.spa-practice{
    padding:42px 40px 0px 40px;
    margin-top:40px;
    background-color:white;
    height:auto;
    max-width:1284px;
    margin-bottom:80px;
    box-shadow: 0 4px 6px 0 rgba(131,134,163,0.12);
}
#aspt-collapseOne .card-body li{
    display:table;
}
#aspt-collapseOne .card-body span{
    display:table-cell;
}
ul.relax-and-opul-block-ul>li>br{
   display: none;
}

/* ##################################################################################### */
        /* CSS For IPAD 768px View */
/* ##################################################################################### */

@media only screen and (max-width: 992px) {
    .wid-container{        
        padding-left:40px; 
        padding-right:40px;        
    }
    .overview-section-div{
        max-width:78%;
        height:800px;  
    }    
    .overview-side-image-div {
        width: 176px;
        /* height: 508px; */
        height: 800px; 
        /* padding-top: 40px; */
        float: right;
        /* margin: auto;   */  
        margin-right:-40px;      
    }
    .available-offers-image {
        width: 160px;       
    }
    .available-offers-btn-view-details{
        height: 34px;
        width: calc(100% - 16px);
    }    
    .available-offers-btn-book-this-offer{
        height: 34px;
        width: 100%;
        margin-left:16px;
    }
    .hr-line-solid{
        width:auto;
    }
    .relax-and-opul-div{
        /* min-height:550px; */
        /* margin-top:40px; */
        padding:20px;
        height: unset;
    }    
    .available-offers-image-text-div{
        width:480px;
    }
    .available-offers-image-text-div.fullwidth{
        width:520px;
    }
    .available-offers-image.fullwidth {
        width: 200px;
    }
    .available-offers-text-content {
        width: 320px;
        padding-left:16px;
    }
    .available-offers-buttons{
        visibility: visible;
    }
    
    .relax-and-opul-content {
        margin-top: 15px;
    }
    .relax-and-opul-block{
        min-width:50%;
        margin-left:0px;
        flex-wrap: wrap;
    }
    .relax-and-opul-block-ul{
       flex: 1 0 50%;
    }
    .relax-and-opul-block:nth-child(3),
    .relax-and-opul-block:nth-child(4){
        margin-top:20px;
    }
    /* .relax-and-opul-block-three{ 
        margin-left: 0px;
        margin-right: 35px;
        margin-top: 20px;
    }
    .relax-and-opul-block-four{ 
        margin-top: 20px;       
        margin-left:0px;
    } */
    .aot-collapse-div{
        padding:40px;
    }
    .hidden-reserve-your-spa-btn{
        margin-left: 0px;       
        float: right;
    }
    .carousel-control-next{
        display:none;
        top:0px;
        right:0px;
    }
    
}

/* ##################################################################################### */
        /* CSS For Mobile View */
/* ##################################################################################### */

@media only screen and (max-width: 600px) {
    .wid-container{        
        padding-left:20px; 
        padding-right:20px;        
    }
    .header-reserve-your-spa-btn {        
        width: 312px;        
    }
    .overview-section-div{
        max-width:100%;
        height:auto;
        margin-bottom:40px;
    }
    .overview-section-text{
        text-align:center;
    }  
    .overview-section-p{
        margin-right: 20px;
        margin-left: 20px;
    }
    .overview-section-btn-download-broucher{
       margin-right: auto;
       margin-left: auto;
    }
    .overview-section-btn-reserve-your-spa{
        margin-right: auto;
        margin-left: auto;
    }

    .overview-side-image-div {
        width: calc(100% + 40px);
        height: 300px;
        float: left; 
        margin-left: -20px;
        margin-right: -20px;
        margin-bottom: 40px;              
    }
    .hr-line-solid{
        width:auto;
    }
    .available-offers-div{
        width:100%;
        position: inherit;
        max-height: unset;
        margin-top:40px;
    }
    
    .available-offers-image-text-div,.available-offers-image-text-div.fullwidth{
        width:100%;
        height:auto;
        margin-bottom:40px;
    }
   
   
    .available-offers-image,.available-offers-image.fullwidth{
        width:100%;
        height:247px;
    }
    .available-offers-image img{
        object-fit: cover;
    }
    .available-offers-text-content {
        width: calc(100% - 40px);
    }
    .available-offers-buttons{
        visibility: visible;
    }
   
    .available-offers-btn-view-details{
        width:100%;
        height:35px;
        display:inline-block !important;        
    }
    .available-offers-btn-book-this-offer{
        margin-left: 16px;
        margin-right: 16px;
        margin-bottom: 20px;
        width: calc(100% - -80px);
        height:35px; 
        display:inline-block !important;       
    }
    #offers .carousel-indicators {
        display:block;
        text-align: center;   
        margin-bottom:0px;
        bottom:-16px;
        margin-left:40px;
        margin-right:auto;     
    }   
    .relax-and-opul-block{
       flex-direction: column;
        /* height:500px; */
        /* margin-top:40px; */
    }
    .relax-and-opul-block:nth-child(3),
    .relax-and-opul-block:nth-child(4){
        margin-top:0px;
    }
    .relax-and-opul-block-three{
        margin-left:0px;
        margin-top: 0px;
    }
    .relax-and-opul-block-four{
        margin-left:0px;
        margin-top: 0px;
    }
    .relax-and-opul-content li {
        margin-top: 6px;
        /* max-height: 26px; */
        /* white-space: nowrap; */
        display: flex;
    }
    .relax-and-opul-content li i{
       line-height: 27px;
    }
   
    .our-treatments-div {
        padding-top: 20px;
        padding-left: 20px;
        padding-right: 20px;
        padding-bottom: 0px;
    }
    .accordion{
        margin-top:16px;
    }
    .aot-collapse-div-content{
        margin-bottom:80px;
    }
    .res-ur-spa-hidn-btn-div {
        right: 20px;
        left: 20px;
        bottom:20px;
    }
    .hidden-reserve-your-spa-btn {
        float:none;
        margin-left: auto;
        margin-right: auto;
        margin-top: 0px;
        display:inline-block !important;
        width:100%
    }
    .aot-collapse-div {   
        max-width: 100%;    
        height:325px;
        padding:20px;
    }
    .aot-collapse-subtext-p {
        margin-bottom: 28px;
    }
    .spa-practice{
        padding-left: 20px;
        padding-right: 10px;
        padding-top: 20px;
        margin-bottom: 40px;
        padding-bottom: 0px;
    }
    .spa-practice li{
        padding-right: 20px;
        padding-bottom: 12px;
    }
    .acp-plus-icon{        
        padding-right: 20px;       
    }

}

@media only screen and (min-width:1366px){
    .spa_1366 .overview-side-image-div{
        max-width: unset;
    }

    .spa_1366{
        padding:0 40px;
    }
}

