﻿
#contact-form   { max-width:700px; }
#contact-form-title { width:100%; color:#F68B1F; font-size:35px; padding:10px; }
#contact-form textarea { width: 100%; margin-top: 10px; height: 245px; }
#lobby { margin-bottom: 15px; }
#lobby #body { max-width: 800px; margin: 40px auto 0; text-align: center;}
#lobby #body p { color: #231f20; font-size: 85%;}
#ContactButton { color:#ffffff; text-decoration:none; font-size:130%; display:inline-block; background-color:#F68B1F; border-radius:5px; padding:10px 30px 6px 30px; float:left; }
section { padding-bottom: 108px; }
.has-scrollbar { padding-bottom: 0;}

.treatmentsWrapper {max-width: 1170px; margin: 0 auto; text-align: center;}
.treatmensImgOuter { margin: 0 -15px;}
.treatmentBox {position: relative; padding: 0 16px;}
.treatmentItemImg {position: relative;}
.treatmentItemImg img {width: 100%;}
.treatmentItemTitle {position: absolute; bottom: 32px; right: 50%; color: #fff; white-space: nowrap;
    transform: translateX(50%); -webkit-transform: translateX(50%); -ms-transform: translateX(50%);}
.treatmentItemTitle h3 { font-size: 200%; font-family: 'almoni-tzar-aaa-400'; font-weight: bold;}
.innerTreatmentTextBox { text-align: right; }
/*Inner Treatment Page*/
#categoryView {max-width: 1170px; padding: 0;}
.innerTreatmentBody #lobby { margin-bottom: 0; padding-bottom: 20px;}
.innerTreatmentBannerBox { max-width: 1054px; padding: 10px 0 60px; margin: 0 auto;}
.innerTreatmentBody .innerTreatmentWrapper { padding-top: 60px;}
.innerTreatmentBody p {font-size: 80%; line-height: 1.2; color: #231f20;}
.innerTreatmentBody .innerTreatmentContent { max-width: 1054px; height: 127px; position: relative; overflow: hidden; margin: 0 auto;}
.innerTreatmentBody .innerTreatmentContent:after { content: ''; position: absolute; width: 100%; height: 80px; bottom: 0; right: 50%;  opacity: 1; 
    transform: translateX(50%); -webkit-transform: translateX(50%); -ms-transform: translateX(50%);
    transition: all 200ms ease-in-out; -webkit-transition: all 200ms ease-in-out; -o-transition: all 200ms ease-in-out;
    background: -webkit-gradient(linear, left bottom, left top, color-stop(30%, rgba(255,255,255,0.8)), color-stop(100%, rgba(255, 255, 255, 0)), to(rgba(243,244,246,1)));
    background: -o-linear-gradient(bottom, rgba(255,255,255,0.8) 30%, rgba(255, 255, 255, 0) 100%, rgba(243,244,246,1) 100%);
    background: linear-gradient(0deg, rgba(255,255,255,0.8) 30%, rgba(255, 255, 255, 0) 100%, rgba(243,244,246,1) 100%);}
.innerTreatmentBody .innerTreatmentContent.toggled:after { opacity: 0;}
.btnBox { display: inline-block; text-align: center;}
.innerTreatmentBody button.generalBtn.readMoreBtn {width: 290px; background: none; border: 1px solid #231f20; color: #000; margin: 5px auto 0; font-size: 90%;
    letter-spacing: 0.72px;}
.innerTreatmentBody button.generalBtn.readMoreBtn:hover, .innerTreatmentBody button.generalBtn.readMoreBtn:focus {background: none;}
.treatmentsWrapper.category-20 .btnBox { display: none;}
.treatmentsWrapper.category-20 .innerTreatmentContent { height: 100%;}
.treatmentsWrapper.category-20 .innerTreatmentContent:after { content: none;}
.treatmentsWrapper.category-20 .innerTreatmentTextBox { max-width: 800px; text-align: center; margin: 0 auto;}
.treatmentsWrapper.category-20 .innerTreatmentContent {text-align: center;}
.treatmentsWrapper.category-20 .innerTreatmentTextBox:first-child { margin-left: auto;}

#categoryView-items {margin: 0; padding: 100px 0 50px; direction: ltr;}
#categoryView-items .catalogItemBox-Container {padding: 0 12px; margin-bottom: 90px;}
#categoryView-items .catalogItemBox .catalogItemBox-image {background-size: cover; padding-bottom: 309px;}
#categoryView-items .catalogItemsList.row { max-width: 100%;}
#categoryView-items .catalogItemBox { padding: 0; margin-bottom: 0;}
#categoryView-items .catalogItemBox-button {display: none;}
#categoryView-items .catalogItemBox .catalogItemBox-title { font-size: 100%; font-family:inherit;}

@media (min-width: 1025px) {
    .treatmentBox {width: 33%;}

    .innerTreatmentBody .innerTreatmentContent { text-align: right;}
    .innerTreatmentTextBox {display: inline-block; max-width: 390px; vertical-align: top; }
    .innerTreatmentTextBox:first-child { margin-left: 166px;} 
}

@media(min-width: 991px){
    #SiteFooterContainer {background-color: #f2f3f6;}
}

@media(min-width: 768px) {
    .treatmentBox { display: inline-block;}
    .treatmentItemImg:before { content: ''; position: absolute; width: 100%; height: 80px; bottom: 8px; right: 50%; transform: translate(50%); -webkit-transform: translate(50%);
        -ms-transform: translate(50%); pointer-events: none;
        background-image: -webkit-gradient(linear, left bottom, left top, from(rgba(0, 0, 0, 0.9)), to(rgba(255, 255, 255, 0)));
        background-image: -o-linear-gradient(bottom, rgba(0, 0, 0, 0.9), rgba(255, 255, 255, 0));
        background-image: linear-gradient(to top, rgba(0, 0, 0, 0.9), rgba(255, 255, 255, 0))}
    .treatmentItemImg:after { content: ''; position: absolute; width: 100%; height: 8px; bottom: 0; right: 50%; transform: translate(50%); -webkit-transform: translate(50%); 
        -ms-transform: translate(50%);     
        background-image: -webkit-gradient(linear, right top, left top, from(#f1d7a0), to(#e2b86e));
        background-image: -o-linear-gradient(right, #f1d7a0, #e2b86e);
        background-image: linear-gradient(to left, #f1d7a0, #e2b86e);}

    #categoryView-items .catalogItemBox-Container { width: 33.333%}
}

@media(max-width: 1170px) {
    #categoryView { max-width: 90%;}
}

@media (max-width: 1024px) {
    section { padding-bottom: 50px; }
}

@media(max-width: 991px) {

    #PageBreadCrumps { display: none;}
    #lobby { margin-bottom: 30px;}
    #lobby #body { max-width: 600px;}

    .treatmentsWrapper { padding-bottom: 135px;}
    .treatmensImgOuter { margin: 0;}
    .treatmentBox { padding: 0 8px;}
    .treatmentItemImg:before { bottom: 4px;}
    .treatmentItemImg:after { height: 4px;}
    .treatmentItemTitle {bottom: 20px;}
    .treatmentItemTitle h3 { font-size: 150%;}
    #categoryView-items .catalogItemBox .catalogItemBox-title { font-size: 90%; }
    #SiteGrid { 
    background-image: -webkit-gradient(linear, left bottom, left top, from(#f2f3f6), to(#f7f7f7));
    background-image: -o-linear-gradient(bottom, #f2f3f6, #f7f7f7);
    background-image: linear-gradient(to top, #f2f3f6, #f7f7f7);}

    #SiteFooter .footerContact { padding-bottom: 38px;}

    /*Inner Treatment page*/
    .innerTreatmentBody #headline { max-width: 380px; margin: 0 auto;}
    .innerTreatmentBody #headline h1 { font-size: 250%; line-height: 1;}
    .innerTreatmentBannerBox img{ height: 175px; width: 100%;}
    .innerTreatmentBody .innerTreatmentWrapper { padding-top: 40px;}
    .innerTreatmentBody .innerTreatmentContent:after { 
        background: -webkit-gradient(linear, left bottom, left top, color-stop(30%, rgba(243,244,246,0.8)), color-stop(100%, rgba(243,244,246,0.2)), to(rgba(243,244,246,1)));
        background: -o-linear-gradient(bottom, rgba(243,244,246,0.8) 30%, rgba(243,244,246,0.2) 100%, rgba(243,244,246,1) 100%);
        background: linear-gradient(0deg, rgba(243,244,246,0.8) 30%, rgba(243,244,246,0.2) 100%, rgba(243,244,246,1) 100%);
    }
    .innerTreatmentBody button.generalBtn.readMoreBtn { margin-top: 25px;}
    #categoryView-items { padding: 50px 0;}
    #categoryView-items .catalogItemBox .catalogItemBox-image { padding-bottom: 89%;}
    #categoryView-items .catalogItemBox-Container { margin-bottom: 50px;}
}

@media(min-width: 768px) and (max-width: 1024px) {
    .treatmentBox { width: 28%;} 
}

@media(min-width: 768px) and (max-width: 990px) {
    .treatmentsWrapper.innerTreatmentMain { padding:0 40px;}
    #categoryView-items { padding-bottom: 100px;}

    #categoryView-items .catalogItemBox .catalogItemBox-image { margin-bottom: 3px;}
    #categoryView-items .catalogItemBox .catalogItemBox-title { font-size: 70%;}

}

@media (max-width: 767px) {
    #PageBreadCrumps { display: none; }
    #lobby { margin-bottom: 5px; }
    #lobby #body { width: 90%;}
    #subheadline h2 {letter-spacing: -4px;}
    .innerTreatmentBannerBox { padding: 0 0 40px;}
    .innerTreatmentBannerBox img { height: 140px;}
    #categoryView-items .catalogItemBox .catalogItemBox-title { font-size: 70%; }

    .catalogItemBox .catalogItemBox-image { margin-bottom: 5px; }
    .treatmentsWrapper { padding-bottom: 0;}
    .treatmentBox { padding: 0; margin-bottom: 25px;}
    .treatmentBox:last-child { margin-bottom: 0;}
    .treatmentItemTitle { bottom: 50%; right: 75%; transform: translate(50%, 50%); -webkit-transform: translate(50%, 50%); -ms-transform: translate(50%, 50%);}

    /*Inner Treatment Page*/
    .innerTreatmentBody #lobby { padding-bottom: 30px;}
    .innerTreatmentBody #headline h1 { font-size: 230%; }
    .innerTreatmentBody .innerTreatmentContent { text-align: right;}
    .innerTreatmentBody .GridWrapper { padding: 0; width: 100%;}

    #categoryView-items .catalogItemBox-Container { width: 50%; padding: 0 8px; margin-bottom: 20px;}
    .row > div.catalogItemBox-Container { border: none;}
}


#PageView #PageBreadCrumps { margin-top: 0; padding-top: 30px; }
#PageView #lobby { height: 350px; background-color: #f2f3f6; margin: 0; padding: 0; }
#PageView .grid-text { max-width: unset; position: relative; margin: -85px auto 60px auto; background: #fff; min-height: 100px; }
#PageView #subheadline { padding-top: 0; }
#PageView .grid-text { padding: 70px 160px; }
#PageView .grid-text .grid-text-content h2 { font-size: 200%; font-weight: 500; text-transform: uppercase; position: relative; margin-bottom: 30px; }
#PageView .grid-text .grid-text-content h2:after { content: ""; position: absolute; bottom: -10px; left: 0; width: 80px; height: 8px; background: linear-gradient(-45deg, #f1d7a0, #e2b86e, #f1d7a0, #e2b86e); background-size: 400% 400%; -webkit-animation: Gradient 15s ease infinite; -moz-animation: Gradient 15s ease infinite; animation: Gradient 15s ease infinite; }
#PageView .grid-text .grid-text-content p { font-size: 70%; color: #231f20; text-shadow: 0 0 0 #bcbcbc; line-height: 1.65; }

@media (max-width: 1024px) {
    #PageView #lobby { height: 325px; }
    #PageView #subheadline { padding-top: 25px; }
    #PageView .grid-text { padding: 50px 100px; }
}

@media (max-width: 767px) {
    #PageView #lobby { height: 275px; }
    #PageView .grid-text { padding: 30px; }
    #PageView .grid-text .grid-text-content h2 { font-size: 7vw; }
    #PageView #subheadline { padding-top: 50px; }
}