.tree_section { width: 100%; padding: 96px 0 0px; background: url(img/tree.svg) top right -36vw no-repeat; float: left; @media @desktop-down{ background: url(img/tree.svg) top right -30vw no-repeat; background-size: 60vw; } @media @phone-down{ padding: 63px 0 0px; } .welcome_section { width: 100%; text-align: center; h2 { text-align: center; margin: 0 0 56px 0; color: #8C8C8C; font-family: 'Montserrat', sans-serif; font-weight: 500; @media only screen and (max-width: 1700px){ margin: 0 0 40px 0; } @media @phone-down{ font-size: 20px; letter-spacing: 0.1em; margin: 0 0 10px 0; } } h1 { text-align: center; margin: 0 0 27px 0; letter-spacing: 24px; @media only screen and (max-width: 1700px){ margin: 0 0 40px 0; } @media @phone-down{ letter-spacing: 0.25em; margin: 0 0 0px 0; } } .welcome-text { border: 2px solid #8C8C8C; width: 100%; padding: 54px 39px 42px 39px; position: relative; line-height: 1.7; @media @wide-screen-down { line-height: 1.5; } @media @phone-down{ border: 0px; padding: 0px 20px; margin-top: 0px; line-height: 1.7; } h2 { color: @green; position: absolute; top: -51px; left: 0; right: 0; margin: 0 auto; font-family: 'Montserrat', sans-serif; font-weight: 500; font-size: 70px; @media @wide-screen-down { font-size: 50px; top: -42px; } @media @desktop-down{ font-size: 36px; top: -33px; } @media @phone-down{ position: static; padding: 0px; margin-bottom: 10px; } span { background-color: @white; display: inline-block; padding: 13px 52px; @media @desktop-down{ padding: 13px 30px; } @media @phone-down{ font-size: 30px; letter-spacing: 0; } } } } } } .patients--say-block{ width: 100%; padding: 94px 0px 40px; @media @phone-down{ padding: 70px 0px 22px; } .testimonial--carousel{ width: 100%; margin-top: 7px; .container{ position: relative; } .test--slider{ width: 82%; margin: auto; clip-path: polygon(7% 0, 93% 0, 100% 50%, 93% 99%, 7% 100%, 0% 50%); @media @desktop-down{ width: 90%; } @media @phone-down{ width: 86%; } .slick-track{ display: flex; flex-wrap: wrap; .slick-slide{ height: auto; } } .item{ a{ display: block; height: 100%; } img{ width: 100%; height: 100%; object-fit: cover; } } } .slick-arrow{ width: 80px; height: 127px; background-position: center; background-size: contain; background-repeat: no-repeat; @media only screen and (max-width: 1700px){ width: 60px; height: 90px; } @media @wide-screen-down { width: 40px; height: 70px; } @media @phone-down{ width: 30px; height: 30px; } &::before{ display: none; } &.slick-prev{ background-image: url('img/left-angle.svg'); left: 20px; @media only screen and (max-width: 1700px){ left: 60px; } @media @desktop-down{ left: 25px; } @media @tablet-down{ left: 15px; } @media @phone-down{ left: 3px; } } &.slick-next{ background-image: url('img/right-angle.svg'); right: 20px; @media only screen and (max-width: 1700px){ right: 60px; } @media @desktop-down{ right: 25px; } @media @tablet-down{ right: 15px; } @media @phone-down{ right: 3px; } } } } } .test-name-slider { width: 100%; display: block; padding-top: 50px; } .title{ width: 100%; text-align: center; position: relative; .line{ width: 100%; position: relative; text-align: center; display: block; &::before{ position: absolute; content: ''; top: 30%; transform: translateY(-50%); left: 0; right: 0; border-top: 2px solid #8C8C8C; @media @phone-down{ display: none; } } } h5{ color: #8C8C8C; display: inline-block; width: 100%; text-align: center; font-family: 'Montserrat', sans-serif; margin-bottom: 17px; @media @phone-down{ letter-spacing: 0.1em; margin-bottom: 6px; } } h2{ font-family: adobe-garamond-pro, serif; color: #716558; display: inline-block; letter-spacing: 0.25em; padding: 0px 30px; background-color: #ffffff; position: relative; @media @phone-down{ letter-spacing: 0.2em; font-size: 40px; margin-bottom: 13px; } } h4{ font-family: adobe-garamond-pro, serif; color: #716558; display: inline-block; letter-spacing: 0.25em; padding: 0px 30px; background-color: #ffffff; position: relative; @media @phone-down{ font-size: 19px; letter-spacing: 0.18em; } span{ font-family: 'Montserrat', sans-serif; font-weight: 500; } } } .chas-n-pattis-story-block{ width: 100%; display: block; float: left; @media @phone-down{ text-align: center; } .story-col-block{ width: 100%; float: left; padding: 80px 0px; @media @wide-screen-down { padding: 60px 0px 30px 0px; } @media @phone-down{ padding: 40px 0px 30px 0px; } @media @phone-down{ float: none; display: inline-block; margin: auto; width: 83%; } .story-box{ width: 33.33333%; min-height: 526px; clip-path: polygon(50% 0%, 100% 15%, 100% 50%, 100% 85%, 50% 100%, 0 85%, 0 15%); position: relative; background-position: center; background-repeat: no-repeat; background-size: cover; border: 2px solid #ffffff; float: left; @media @wide-screen-down { min-height: 386px; } @media @desktop-down { min-height: 300px; } @media @phone-down{ width: 100%; min-height: 380px; margin-bottom: 25px; clip-path: polygon(50% 0%, 100% 20%, 100% 50%, 100% 80%, 50% 100%, 0 80%, 0 20%); } @media @small-phone-down{ min-height: 320px; } @media @vsmall-phone-down{ min-height: 287px; } &::before{ position: absolute; content: ''; background-color: #716558; opacity: 0.56; top: 0; left: 0; right: 0; bottom: 0; } img{ width: 100%; height: 100%; object-fit: cover; } .story-title{ position: absolute; left: 0; right: 0; text-align: center; padding: 0px 15px; text-transform: uppercase; top: 50%; transform: translateY(-50%); font-family: 'Montserrat', sans-serif; font-weight: 600; color: #ffffff; font-size: 36px; @media only screen and (max-width: 1700px){ font-size: 28px; } @media @desktop-down{ font-size: 22px; } @media @phone-down{ font-size: 20px; letter-spacing: 0.01em; } } } } } .contact--us-block{ width: 100%; padding: 80px 0px 130px; float: left; @media @wide-screen-down { padding: 70px 0px 100px; } @media @tablet-down{ padding: 70px 0px 60px; } @media @phone-down{ padding: 14px 0px 60px; } .contact-content{ width: 100%; padding-bottom: 115px; float: left; @media @wide-screen-down { padding-bottom: 75px; } @media @phone-down{ padding-bottom: 50px; } h5, h2, p{ text-align: center; } h5{ font-family: 'Montserrat', sans-serif; font-weight: 500; color: #8C8C8C; letter-spacing: 0.05em; margin-bottom: 35px; @media @phone-down{ line-height: 1.3; margin-bottom: 17px; } } h2{ color: #7A9C49; font-family: adobe-garamond-pro, serif; letter-spacing: 0.25em; margin-bottom: 33px; @media @wide-screen-down { margin-bottom: 23px; letter-spacing: 0.15em; } @media @phone-down{ letter-spacing: 0em; } } p{ width: 1020px; font-size: 22px; margin: auto; max-width: 100%; line-height: 1.8em; @media @wide-screen-down { font-size: 20px; line-height: 1.5em; } @media @desktop-down { font-size: 18px; } } } .cols-row{ margin: 0px -56px; @media @desktop-down{ margin: 0px -25px; } @media @phone-down{ margin: 0px -20px; } > div{ padding: 0px 56px; float: left; @media @desktop-down{ padding: 0px 25px; } @media @tablet-down{ width: 100%; padding-bottom: 30px; } @media @phone-down{ padding: 0px 20px; padding-bottom: 30px; } } } .contact-detail-box { width: 100%; border: 1px solid #000000; text-align: center; padding: 35px 30px; @media @phone-down{ padding: 0px; padding-top: 30px; } .btn{ @media @phone-down{ width: 100%; } } h3{ letter-spacing: 0.25em; text-align: center; color: #7A9C49; margin-bottom: 20px; @media @wide-screen-down { letter-spacing: 0.2em; } @media @phone-down{ font-size: 47px; margin-bottom: 10px; } } h6{ color: #716558; font-family: 'Montserrat', sans-serif; font-weight: 600; line-height: 1.2; text-align: center; @media @desktop-down { line-height: 1.5; } @media @phone-down{ line-height: 1.3; } } } } .book-appointment-stick{ position: fixed; bottom: 0; left: 0; right: 0; width: 100%; display: none; z-index: 2; @media @phone-down{ display: block; } .btn{ padding: 21px 20px; margin-top: 2em; width: 100%; span.btn-icon { display: inline-block; padding-right: 15px; } } } a.btn{ margin-top:2em; } .mm-page { background: #fff !important; } div#menu.mm-menu_opened { display: block; } div#menu{display:none;} .su-row { display: flex; align-items: center; } .su-column.su-column-size-1-2 { margin-right: 4%; } #page > header { z-index: 99; position: relative; } .chas-n-pattis-story-block .story-col-block .story-box::before { background: none !important; } .mm-panels { font-size:13px; } header#header, main#content { display: grid !important; width: 100%; margin: 0 auto; } // .main_menu ul li:hover > ul{ // border-left: 0; // display: block !important; // } // .main_menu ul li:hover .sub-menu { // display: none; // } .main_menu .close-menu { z-index: 9; } @media screen and (min-width: 1024px){ .main_menu ul li.current-menu-item > a { background-color: #7A9C49; } } @media screen and (max-width: 1024px) { .main_menu ul li .sub-menu .sub-menu { left: 0 !important; } .main_menu { overflow: scroll; } .main_menu ul li > .sub-menu { display: none !important } } .page-id-769 .prosper div { opacity:0; visibility:hidden; } .page-id-768 .trophy div { opacity:0; visibility:hidden; } .background_video { height: 100%; } .background_video iframe { height: 100%; } .main_menu ul li .sub-menu .sub-menu { left: 100%; top: 0; } @media screen and (min-width: 768px){ #prosper-main-cta{ margin-right:2em; } }