/* Theme Name: Oncoplastic Surgical Centre Theme URI: # Author: Sk Version: 1.0 */ /* Start - Main Style */ *{margin:0px; padding:0px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } html{ width:100%; height:100%; margin:0px; padding:0px;scroll-behavior: smooth; overflow-x:hidden; } body{ margin:0px; padding:0px;background:#fff; font-family:var(--bodyfont); overflow-x: hidden;} p{ margin:0px; padding:0px; } address, blockquote, dd, div, dl, dt, fieldset, form, frame, frameset{ margin:0; padding:0; border: 0px; outline: none; } label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin:0px; padding:0; outline:none; border:0;} a{ text-decoration:none; border: 0px; outline: none; transition:all .5s} a:hover, a:focus, a:active{ transition:all .5s } a img{ border:none; outline: none;} a:focus {outline:none; } border{ border-collapse:collapse;} hr{ height:1px; background:#333333; border:none;} img { max-width: 100%; height: auto;} strong{font-weight:bold;} button,input,select,option,textarea {outline: 0 !important;pointer-events:all;font-family:inherit;font-size:100%;} ::-moz-selection { color: #fff; background:var(--main-clr);} ::selection { color: #fff; background: var(--main-clr);} @font-face { font-family: 'HelveticaNeue'; src: url('assets/fonts/HelveticaNeue-Black.eot'); src: url('assets/fonts/HelveticaNeue-Black.eot?#iefix') format('embedded-opentype'), url('assets/fonts/HelveticaNeue-Black.woff2') format('woff2'), url('assets/fonts/HelveticaNeue-Black.woff') format('woff'), url('assets/fonts/HelveticaNeue-Black.ttf') format('truetype'), url('assets/fonts/HelveticaNeue-Black.svg#HelveticaNeue-Black') format('svg'); font-weight: 900; font-style: normal; font-display: swap; } @font-face { font-family: 'HelveticaNeue'; src: url('assets/fonts/HelveticaNeue-Heavy.eot'); src: url('assets/fonts/HelveticaNeue-Heavy.eot?#iefix') format('embedded-opentype'), url('assets/fonts/HelveticaNeue-Heavy.woff2') format('woff2'), url('assets/fonts/HelveticaNeue-Heavy.woff') format('woff'), url('assets/fonts/HelveticaNeue-Heavy.ttf') format('truetype'), url('assets/fonts/HelveticaNeue-Heavy.svg#HelveticaNeue-Heavy') format('svg'); font-weight: 800; font-style: normal; font-display: swap; } @font-face { font-family: 'HelveticaNeue'; src: url('assets/fonts/HelveticaNeue-Bold.eot'); src: url('assets/fonts/HelveticaNeue-Bold.eot?#iefix') format('embedded-opentype'), url('assets/fonts/HelveticaNeue-Bold.woff2') format('woff2'), url('assets/fonts/HelveticaNeue-Bold.woff') format('woff'), url('assets/fonts/HelveticaNeue-Bold.ttf') format('truetype'), url('assets/fonts/HelveticaNeue-Bold.svg#HelveticaNeue-Bold') format('svg'); font-weight: 700; font-style: normal; font-display: swap; } @font-face { font-family: 'HelveticaNeue'; src: url('assets/fonts/HelveticaNeue-Roman.eot'); src: url('assets/fonts/HelveticaNeue-Roman.eot?#iefix') format('embedded-opentype'), url('assets/fonts/HelveticaNeue-Roman.woff2') format('woff2'), url('assets/fonts/HelveticaNeue-Roman.woff') format('woff'), url('assets/fonts/HelveticaNeue-Roman.ttf') format('truetype'), url('assets/fonts/HelveticaNeue-Roman.svg#HelveticaNeue-Roman') format('svg'); font-weight: 400; font-style: normal; font-display: swap; } @font-face { font-family: 'HelveticaNeue'; src: url('assets/fonts/HelveticaNeue-Medium.eot'); src: url('assets/fonts/HelveticaNeue-Medium.eot?#iefix') format('embedded-opentype'), url('assets/fonts/HelveticaNeue-Medium.woff2') format('woff2'), url('assets/fonts/HelveticaNeue-Medium.woff') format('woff'), url('assets/fonts/HelveticaNeue-Medium.ttf') format('truetype'), url('assets/fonts/HelveticaNeue-Medium.svg#HelveticaNeue-Medium') format('svg'); font-weight: 500; font-style: normal; font-display: swap; } @font-face { font-family: 'HelveticaNeue'; src: url('assets/fonts/HelveticaNeue-Light.eot'); src: url('assets/fonts/HelveticaNeue-Light.eot?#iefix') format('embedded-opentype'), url('assets/fonts/HelveticaNeue-Light.woff2') format('woff2'), url('assets/fonts/HelveticaNeue-Light.woff') format('woff'), url('assets/fonts/HelveticaNeue-Light.ttf') format('truetype'), url('assets/fonts/HelveticaNeue-Light.svg#HelveticaNeue-Light') format('svg'); font-weight: 300; font-style: normal; font-display: swap; } @font-face { font-family: 'HelveticaNeue'; src: url('assets/fonts/HelveticaNeue-UltraLight.eot'); src: url('assets/fonts/HelveticaNeue-UltraLight.eot?#iefix') format('embedded-opentype'), url('assets/fonts/HelveticaNeue-UltraLight.woff2') format('woff2'), url('assets/fonts/HelveticaNeue-UltraLight.woff') format('woff'), url('assets/fonts/HelveticaNeue-UltraLight.ttf') format('truetype'), url('assets/fonts/HelveticaNeue-UltraLight.svg#HelveticaNeue-UltraLight') format('svg'); font-weight: 200; font-style: normal; font-display: swap; } @font-face { font-family: 'HelveticaNeue'; src: url('assets/fonts/HelveticaNeue-Thin.eot'); src: url('assets/fonts/HelveticaNeue-Thin.eot?#iefix') format('embedded-opentype'), url('assets/fonts/HelveticaNeue-Thin.woff2') format('woff2'), url('assets/fonts/HelveticaNeue-Thin.woff') format('woff'), url('assets/fonts/HelveticaNeue-Thin.ttf') format('truetype'), url('assets/fonts/HelveticaNeue-Thin.svg#HelveticaNeue-Thin') format('svg'); font-weight: 100; font-style: normal; font-display: swap; } @font-face { font-family: 'SFProDisplay'; src: url('assets/fonts/SFProDisplay-Regular.eot'); src: url('assets/fonts/SFProDisplay-Regular.eot?#iefix') format('embedded-opentype'), url('assets/fonts/SFProDisplay-Regular.woff2') format('woff2'), url('assets/fonts/SFProDisplay-Regular.woff') format('woff'), url('assets/fonts/SFProDisplay-Regular.ttf') format('truetype'), url('assets/fonts/SFProDisplay-Regular.svg#SFProDisplay-Regular') format('svg'); font-weight: normal; font-style: normal; font-display: swap; } /*variables--*/ :root{ --bodyfont: 'HelveticaNeue', sans-serif; --headfont: 'HelveticaNeue', sans-serif; --fs-100:100px; --fs-80:80px; --fs-70:70px; --fs-60:60px; --fs-65:65px; --fs-50:50px; --fs-48:48px; --fs-46:46px; --fs-45:45px; --fs-42:42px; --fs-40:40px; --fs-38:38px; --fs-36:36px; --fs-30:30px; --fs-26:26px; --fs-24:24px; --fs-23:23px; --fs-22:22px; --fs-21:21px; --fs-20:20px; --fs-18:18px; --fs-17:17px; --fs-16:16px; --fs-14:14px; --main-clr:#e272a5; --seconday-color:#e272a5; --body-font-color:#555861; --light-blue-color:#e4f3f3; --light-bg:#f3f9fb; --deep-blue:#0c85aa; --gray-color:#555861; --deep-bg:#1D3053; /* #555861; */ --new-bg:#1D3053; } body{ font-family:var(--bodyfont); } h1{ margin: 0px; padding: 0px; font-weight:400; font-size:var(--fs-48); color:var(--main-clr); font-family:var(--headfont); padding:0 0 30px 0 } h1 em{ font-weight:400; font-style:italic; } h2{ margin: 0px; font-size: var(--fs-48); color: var(--body-font-color); font-weight: 300; padding: 0 0 30px 0; line-height: 1.3; font-family:var(--headfont); } h2 span{ font-weight:900 } h2 span{ font-weight:500 } h2 em{ font-weight:400; } h3{ font-size:var(--fs-30); padding:0 0 30px 0; color: var(--body-font-color); font-weight:300; line-height:1.5 } h4{ font-weight: 300; font-size: var(--fs-20); padding:0 0 30px 0; } h5{font-size:var(--fs-20); padding:0 0 30px 0; } h6{ font-size:var(--fs-14); padding:0 0 20px 0; color:rgba(0,0,0,0.5) ; text-transform:uppercase; letter-spacing:3px; font-weight:500 ; margin:0 } p{ font-size:var(--fs-20); line-height:1.4; font-weight: 300 ; text-align: justify; padding:0 0 30px 0; color:var(--body-font-color); } .btncn{ position:relative; display: inline-block; padding:15px 40px 16px; font-size: var(--fs-18); font-weight:500; border-radius:0; text-align: center; letter-spacing: 3px; margin:15px 0; text-transform:uppercase; border:2px solid var(--seconday-color); } .btncn-default{ background: var(--main-clr); color: #fff; border-color:var(--main-clr); } .btncn-secondary{ background: var(--seconday-color); color: #fff; border-color:var(--seconday-color); } .btncn-default:hover{ background:#df649c; border-color:#df649c; } .btncn-secondary:hover{ background: #df649c; color:#fff; border-color:#df649c; } .buttonGroup{ display:flex; gap:15px } .dark-bg .btncn-default:hover{ background:#fff; border-color:#fff;color:var(--main-clr) } .btncn-default i, .btncn-secondary i{ margin:0 0 0 10px } .section{ padding:100px 0 } .section-light{ background:var(--light-blue-color); } .light-section{ background:var(--light-bg); } .dark-section{ } .no-padding-top{ padding-top:0 } .hoverImage{ overflow:hidden; position:relative; } .hoverImage:after{ content:''; position:absolute; width:100%; height:100%; top:0; left:0; background: linear-gradient(45deg, var(--seconday-color) 0%, transparent 100%); opacity:0; transition:all .5s } .hoverImage:hover:after{ opacity:1; transition:all .5s } .hoverImage img{ width:100%; transition:all .5s } .hoverImage:hover img{ transform:scale(1.1); transition:all .5s } .g-5, .gx-5 { --bs-gutter-x: 5rem;} .g-4, .gx-4 { --bs-gutter-x: 3rem;} .section-heading{ margin:0 0 30px 0 } .text-center p{ text-align:center; } .light-bg{ background:#f5f5f7 } .dark-bg{ background:var(--main-clr); } .text-clr-main,.text-clr-main *{color: var(--body-font-color);} .mobile{ display:none; } .deep-bg{ background:var(--deep-bg); } /*HEADER*/ @media (min-width: 1700px) { .container{ max-width:1420px } .header .container { max-width: 1680px; } } .headerTop{ background:var(--new-bg); padding:7px 0; } .headerTop p{ color:var(--white-color); font-weight:300; padding:0; font-size:var(--fs-18); } .headerTop p a{ color:var(--white-color); font-weight:600 } .headerTop p a:hover{ color:var(--seconday-color); } .headerTop ul{ margin:0; padding:0; list-style:none; } .headerTop ul li{display:inline-block;vertical-align:top;padding:0 22px;position:relative; color:#fff;font-weight:300;font-size:var(--fs-18);} .headerTop ul li a{ color:#fff } .headerTop ul li a:hover{ color:var(--seconday-color); } .headerTop ul li:before{ content:''; position:absolute; left:0; top:4px; width:1px; height:19px; background:#fff; } .headerTop ul li:first-child:before{ display:none; } .headerMian{width: 100%; transition: all .5s; background: #fff} .header{position: relative;z-index: 99;} .headerMian{transition:all .5s;} .logo{ width:200px; transition:all .5s; } .headerHolder{ display:flex; align-items:center; justify-content:space-between; padding:0 0 0 73px; } .navigation nav ul{ display:flex; align-items:center; margin:0; padding:0; list-style:none; } .navigation nav > ul > li > a{padding-left: 22px;padding-right: 22px} .navigation {align-self: stretch;} .navigation nav, .navigation nav > ul,.navigation nav > ul > li,.navigation nav > ul > li> a {height: 100%;} .navigation nav > ul > li> a {display: flex;flex-direction: column;justify-content: center;} .navigation nav ul li a{font-weight:300;font-size: var(--fs-21);position: relative;color: #000000;z-index: 10;} .navigation nav ul li a:hover{ font-weight:400 } ul.dropdown-menu-holder{ flex-wrap:wrap; gap: 0 !important; row-gap: 30px !important; width: 100%; border: none; justify-content: space-between;align-items:flex-start; } ul.dropdown-menu-holder li { width:31%; } ul.dropdown-menu-holder li ul{ display:block; } .section-parent-menu{ width:100% } .section-parent-menu{ margin:0 -10px; padding:0 0 0 340px } .fixed .section-parent-menu{ padding:0 0 0 260px } .fixed{position:fixed;top:0;left:0;width:100%;background: rgba(255, 255, 255, 0.851);box-shadow:0 4px 4px rgba(0,0,0,0.1); z-index: 999} .fixed .bookAppointment a{padding: 30px 50px; transition:all .5s } @media only screen and (min-width:1200px){ .headerMian a{position:relative;z-index: 10;} .headerMian:hover a{pointer-events:all;} .mega-menu-wrapper{ position: absolute; z-index: 9; inset: 0 0 auto; width: 100vw; max-width: 100vw; background:rgba(255, 255, 255, 0.851); padding:30px 10px 4rem; transition: all 0s ease, padding 0s ease; box-shadow: 0 10px 10px 4px rgba(0, 0, 0, .05); top: 100%; opacity: 0; visibility: hidden; } .navigation nav ul li:hover .mega-menu-wrapper{ opacity:1.0; visibility:visible; transition:all 0s ; background:rgba(255, 255, 255, 0.851); } ul.dropdown-menu-holder li a{ font-size:var(--fs-20) !important; font-weight:600!important; margin:0 0 15px 0; display:block; } ul.dropdown-menu-holder li ul li a{ font-size: 16px !important; padding:5px 0; display:block; font-weight:300 !important; margin:0 } ul.dropdown-menu-holder li ul li{ width:100% } .mega-menu-wrapper a:hover{ font-weight:500 } .navigation nav ul li.normal-menu { position: relative;} ul.sub-menu{flex-direction: column; position: absolute; z-index: 9; inset: 0 0 auto; width: 100%; background:rgba(255, 255, 255, 0.851); box-shadow: 0 10px 10px 4px rgba(0, 0, 0, .05); top: 100%; opacity: 0; visibility: hidden; width:250px; padding:15px !important; z-index:-9 } .navigation ul li:hover ul.sub-menu{ visibility:visible; opacity:1.0; z-index:9 } .navigation ul li ul.sub-menu li a{line-height:1.5!important;display:block;padding:5px 0;color:#000; } .navigation ul li ul.sub-menu li a:hover{ font-weight:500} ul.sub-menu li {width: 100%;} } .mean-container .mean-nav ul li li li a{ padding: 0.5em 15% !important; } .headerRight{ display:flex; align-items:center; } .phoneNumber a{font-family:var(--bodyfont);font-weight: 500;color: #000000;font-size: var(--fs-21);} .phoneNumber a:hover{ color:var(--seconday-color); } .phoneNumber a i{font-size:80% ; display: none;} .phoneNumber a span{margin-left:20px} .whatsapp a{ color:#fff; font-size:24px; display:block; width:45px; height:45px; border-radius:50%; background:#52c869; text-align:center; line-height:45px; margin:0 10px 0 50px } a.meanmenu-reveal{display:none}.mean-container .mean-bar{float:left;width:100%;position:relative;background:#0c1923;padding:4px 0;min-height:42px;z-index:999999}.mean-container a.meanmenu-reveal{width:22px;height:22px;padding:13px 13px 11px;position:absolute;top:0;right:0;cursor:pointer;color:#fff;text-decoration:none;font-size:16px;text-indent:-9999em;line-height:22px;font-size:1px;display:block;font-family:Arial,Helvetica,sans-serif;font-weight:700}.mean-container a.meanmenu-reveal span{display:block;background:#fff;height:3px;margin-top:3px}.mean-container .mean-nav{float:left;width:100%;background:#0c1923;margin-top:44px}.mean-container .mean-nav ul{padding:0;margin:0;width:100%;list-style-type:none}.mean-container .mean-nav ul li{position:relative;float:left;width:100%}.mean-container .mean-nav ul li a{display:block;float:left;width:90%;padding:1em 5%;margin:0;text-align:left;color:#fff;border-top:1px solid #383838;border-top:1px solid rgba(255,255,255,.5);text-decoration:none;text-transform:uppercase}.mean-container .mean-nav ul li li a{width:80%;padding:1em 10%;border-top:1px solid #f1f1f1;border-top:1px solid rgba(255,255,255,.25);opacity:.75;filter:alpha(opacity=75);text-shadow:none!important;visibility:visible}.mean-container .mean-nav ul li.mean-last a{border-bottom:0;margin-bottom:0}.mean-container .mean-nav ul li li li a{width:70%;padding:1em 15%}.mean-container .mean-nav ul li li li li a{width:60%;padding:1em 20%}.mean-container .mean-nav ul li li li li li a{width:50%;padding:1em 25%}.mean-container .mean-nav ul li a:hover{background:#252525;background:rgba(255,255,255,.1)}.mean-container .mean-nav ul li a.mean-expand{margin-top:1px;width:26px;height:32px;padding:12px!important;text-align:center;position:absolute;right:0;top:0;z-index:2;font-weight:700;background:rgba(255,255,255,.1);border:0!important;border-left:1px solid rgba(255,255,255,.4)!important;border-bottom:1px solid rgba(255,255,255,.2)!important}.mean-container .mean-nav ul li a.mean-expand:hover{background:rgba(0,0,0,.9)}.mean-container .mean-push{float:left;width:100%;padding:0;margin:0;clear:both}.mean-nav .wrapper{width:100%;padding:0;margin:0}.mean-container .mean-bar,.mean-container .mean-bar *{-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box}.mean-remove{display:none!important} .mean-container a.meanmenu-reveal span{ background:var(--main-clr); } .mean-container .mean-nav{ background:var(--main-clr); } .mean-container .mean-bar { position: absolute; left: 0; width: 100%; float: none; z-index: 99; top: 35px; background: var(--top-header-bg);} .mean-container a.meanmenu-reveal{ color:var(--main-clr); } /* a{ text-decoration:none; border: 0px; outline: none; transition:none;} a:hover, a:focus, a:active{ transition:none; }*/ .mean-container a.meanmenu-reveal{ border:1px solid var(--main-clr); padding: 8px 13px 9px; margin-top:-14px; border-radius: 4px;} .mean-container .mean-nav{ margin-top:55px } .fixed .mean-container .mean-nav{ margin-top:36px } .mean-container .mean-nav ul li a{ font-family:var(--bodyfont); } .mean-container .mean-nav ul li:first-child a{ border:none; } .mean-container .mean-nav ul li a.mean-expand{ border:none !important; background:transparent !important; } .mean-nav{ box-shadow: -50vw 0 0 var(--main-clr), 50vw 0 0 var(--main-clr); } .bookAppointment a{padding: 52px 50px;display:block;background: var(--main-clr);color:#fff;position:relative;margin: 0 0 0 50px;font-size: var(--fs-18);font-weight: 400;text-transform: uppercase;letter-spacing: 1px;transition:all .5s} .bookAppointment a i{ margin:0 10px 0 0 } .bookAppointment a:after{ content:''; position:absolute; width:999em; left:100%; top:0 ; background:var(--main-clr); height: 100%;transition: all .5s;} .bookAppointment a:hover,.bookAppointment a:hover:after{background:var(--seconday-color);} @media only screen and (max-width: 1800px) { .logo{ width:340px } .navigation nav > ul > li > a{padding-left: 12px;padding-right: 12px;} .bookAppointment a{ font-size:16px } .navigation nav ul li a{ font-size:18px; } .phoneNumber a{ font-size:18px; } .headerTop ul li{ font-size:16px } .headerMian .btncn{ padding:13px 20px } .whatsapp a{ margin:0 15px } ul.dropdown-menu-holder li a{ font-size:18px !important } .section-parent-menu{ padding:0 0 0 270px } .fixed .section-parent-menu{ padding:0 0 0 240px } } @media only screen and (max-width: 1500px) { .headerHolder{ padding:0 } .bookAppointment a{ padding:45px 25px; margin: 0 0 0 30px; } } @media only screen and (max-width: 1399px) { .header .container { width:98%; max-width:100% } .logo{ width:180px } .phoneNumber a{ font-size:16px; margin:0 15px 0 0 } .navigation nav > ul > li > a{padding-left: 7px;padding-right: 7px;} .bookAppointment a{ margin:0 ; } .section-parent-menu{ padding:0 0 0 185px } .fixed .section-parent-menu{ padding:0 0 0 200px } .bookAppointment a{ padding: 35px 25px; } .fixed .bookAppointment a{ padding: 28px 25px; } } @media only screen and (max-width: 1199px) { .bookAppointment a{ margin:0 65px 0 20px } .headerHolder{ position:relative; } .section-parent-menu{ padding:0 0 0 0 } .mean-container a.meanmenu-reveal{ margin-top:-6px } a, a:hover{ transition:none; } .mean-container a.meanmenu-reveal{ background:#fff ; border-radius: 0; border: none;} .mean-container .mean-nav ul li li a{ padding:15px 10%; font-size:14px !important } .fixed .mean-container a.meanmenu-reveal{ margin-top:-3px } .bookAppointment a:after{ display:none; } .headerMian{position:static;} } @media only screen and (max-width: 991px) { .phoneNumber span{ display:none; } .phoneNumber a i{ display:block; } .phoneNumber a{ width:40px; height:40px; background:var(--seconday-color); color:#fff ; display: flex; align-items:center; justify-content:center; } .phoneNumber a:hover{ background:var(--main-clr); color:#fff } .mean-container .mean-nav{ margin-top:54px } .fixed .mean-container .mean-nav{ margin-top:46px } } @media only screen and (max-width: 767px) { .phoneNumber a span{ display:none; } .phoneNumber a i{ display:block; } .bookAppointment a span{ display:none; } .logo{ width:120px } .fixed .logo{ width:120px } .phoneNumber a{display: flex; align-items: center; justify-content: center; width:38px; height:38px; border-radius:4px; background:var(--seconday-color); color:#fff; text-align:center; line-height:38px; } .whatsapp a{ width:38px; height:38px; line-height:38px;} .bookAppointment a{ display: flex; align-items: center; justify-content: center; width:40px; height:40px; border-radius:4px; background:var(--seconday-color); color:#fff; text-align:center; line-height:38px; padding:0 } .bookAppointment a i{ margin:0 } .headerTop p{ font-size:14px } .header .container{ padding:0px 10px; } .bookAppointment a{ margin:0 56px 0 0 } .whatsapp a{ margin:0 5px } .fixed{ position:static; } .mean-container a.meanmenu-reveal{ padding: 6px 13px 7px; } .mean-container .mean-nav{ margin-top:42px } } /*END HEADER*/ /*START BANNER*/ .banner{background: var(--main-clr);position: relative;min-height: 750px;} .bannerImage img{ width:100% } .bannerImage {min-height: 750px} .bannerImage iframe { width: 100vw;height: 100vw;position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);} .bannerCaption{position:absolute;width:100%;left:0;top:50%;transform: translateY(-50%);z-index: 2;/* min-height: 750px; */} .bannerCaption h2{ font-weight:900; color:#fff; font-size:24px; letter-spacing:0.2rem; text-transform:uppercase;font-family:var(--bodyfont); } .bannerCaption h1{ color:#fff; font-size:70px; padding:0 0 30px 0;letter-spacing:-0.025rem; font-weight:300 } .bannerCaption h1 span{ font-weight:500 } .banner:after{content:'';position:absolute;left:0;width: 50%;min-height: 915px;background: rgba(0,0,0,0.5);top: 0;z-index: 1} /*END BANNER*/ /*WELCOME SECTION*/ .welcomeSection{ background:var(--new-bg); padding:100px 0 } .welcomeContent p{ color:#fff; font-weight:300; font-size:var(--fs-18); line-height:1.6; text-align: justify; text-align-last: center; } .welcomeContent p:last-child{ padding:0 } .welcomeContent h2{ color:#fff;font-weight:300; font-size:var(--fs-60); padding-bottom:40px; } .welcomeContent h2 span{ font-weight:500 } .welcomeSection .btncn-secondary{ color:#fff; border-color:var(--main-clr); background:transparent; } .welcomeSection .btncn-secondary:hover{ background:var(--main-clr); } .welcomeContent h6{ color:rgba(255, 255, 255, 0.70); padding-bottom:40px; font-size:var(--fs-14); font-weight:500 } .meetSec{background:var(--new-bg);} .meetSec h2{ color:#fff } .meetSecLeft h2 {font-size: var(--fs-60); } .meetTabNav ul li {width: 100%; margin: 0; overflow: hidden; } .meetTabNav .nav-link {font-size: var(--fs-24); border: 0; color:#95969b; font-family:var(--bodyfont); font-weight:300; text-transform: uppercase; letter-spacing: 2px; position:relative; padding:25px 10px 25px 40px; line-height:1; margin-left: -40px; transition: 0.5s; } .meetTabNav .nav-link::before{content: "\f111"; font-family: 'Font Awesome\ 6 Free'; font-size:18px; font-weight: 900; position: absolute; left:1px; top: 24px; color: #e272a5; line-height:30px } .meetTabNav .nav-link.active,.meetTabNav .nav-link:hover {margin-left:0;opacity:1;color:#fff; background: transparent;} .meetTabNav ul {border: 0; } .meetTabThumb {position: relative; } .meetTabThumb img {display: block; width: 100%; } a.meetTabThumbLink {position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; } .meetPlayBtn {font-size: 40px; color: #fff; border-radius: 50%; border: 1px solid #fff; width: 120px; height: 120px; display: flex; align-items: center; justify-content: center; } a.meetTabThumbLink:hover {background: #00000075; } .meetTabText {padding: 0 0 0 0; } .meetTabText h3 {color: var(--main-clr); padding-bottom: 10px; } .meetTabText p{text-align: justify; color: #fff} .meetTabText ul{ margin:0; padding:0; list-style:none; } .meetTabText li li{ display:block; } .meetTabText ul li a{ display:block ; font-size:var(--fs-24); font-weight:300; padding:0 0 20px 0; color:#fff } .meetTabText ul li a:hover{ color:var(--main-clr); } .meetTabContent{ display:flex; gap:45px; width: calc(100% + 30px); margin-left: -30px; } .meettabImage{ max-width:390px; width:100%; flex-shrink:0 } .meetSec .accordion-body{ padding:0; border-radius:0; background:transparent; } .meetSecRight .accordion-item{ background:transparent; border: none;} .meetTabText h4{ color:#fff; font-size:var(--fs-24); font-weight:400; color:#fff; line-height:1.5; margin:0; padding-bottom:20px; } .meetTabText p{ font-size:var(--fs-18); font-weight:300 } .welcomeSection{ position:relative; } .rightImage{ position:absolute; right:0; bottom:100px; } .treatmentPage{ position:relative; } .treatmentPage .meetTabContent{ gap:85px } .treatmentPage .meetTabContent{ width:100%; margin:0 } .treatmentSlider{ background:#eeeeef } .treatmentSlider .contant-slider-holder{ background:transparent; } .treatmentSlider .contant-slider-holder{ padding:0 0 0 65px } /*END WELCOME SECTION*/ /*SERVICE SECTION*/ .serviceSlider{ margin:20px 0 0 0 } .serviceSlider .slick-slide { margin: 0 10px; } .serviceSlider .slick-list { margin: 0 -10px; overflow:visible; } .serviceItem h3{ padding:25px 0 0 0; font-family: 'AvenirRoman'; } .serviceItem a{ color:var(--main-clr); } .serviceItem a:hover{ color:var(--seconday-color); } .serviceItem{ opacity:0.3; pointer-events: none; transition:all .5s; } .serviceItem h3{ display:none; color: #000000} .serviceSlider .slick-active .serviceItem{ opacity:1.0; pointer-events: inherit;transition:all .5s; } .serviceSlider .slick-active .serviceItem h3{ display:block; } .serviceSlider .slick-prev{ position:absolute; top:-100px; right:45px; background:transparent; border:none; font-size:30px; opacity:0.1; transition:all .5s;} .serviceSlider .slick-next{ position:absolute; top:-100px; right:0px; background:transparent; border:none; font-size:30px; opacity:0.1; transition:all .5s;} .serviceSlider .slick-next:hover, .serviceSlider .slick-prev:hover{ opacity:1; transition:all .5s } /*END SERVICE SECTION*/ /*CONTENT SECTION*/ .ratingSection{ padding:40px 0 0 0 } .ratingSection h4{ font-size:var(--fs-20); padding:0 0 0; font-weight:300; } .number{ font-size:var(--fs-42); font-weight:500; } .absolutBtn{ position:absolute; top:30px; right:30px; z-index:12 } .contentBottom{ } .contentHolder ul{ margin:0; padding:0 0 0 0; list-style:none; } .contentHolder ul li{ font-family: var(--cabinetGrotesk); font-weight:300 ; font-size:var(--fs-24); } .contentHolder ul li a{ color:var(--body-font-color); padding: 20px 0 20px 0; display: block; border-bottom: 1px solid #c1c6d4; position: relative; font-weight: 300} .contentHolder ul li a:after{ content:''; position:absolute; width:0%; height:1px; background:#c1c6d4; bottom:-1px; left:0 ; transition: all .5s;} .contentHolder ul li a:hover:after{width:100%; background: var(--seconday-color); transition: all .5s;} .contentHolder ul li a:before{ content:'\f061' ; font-family: 'FontAwesome'; position:absolute; right:0; top:25px; color:var(--body-font-color);} .contentHolder ul li a:hover{ color:var(--seconday-color); } .contentHolder ul li a:hover:before{ color:var(--seconday-color); } .contentHolder:not(:last-child){ padding:0 0 130px 0 } .contentSection h2 strong{ font-weight:500 } .contentSliderSection{ background:url(assets/images/content-slider-bg.jpg) no-repeat; background-size:cover; } .contant-slider-holder{ background:rgba(255,255,255,0.77); padding:100px; } .contentSlider .slick-prev{ position:absolute; font-size:25px; border:none; outline:none; background:transparent; color:#a2a2a2; bottom:25px; right:80px; left:inherit; z-index:9 } .contentSlider .slick-next{ position:absolute; font-size:25px; border:none; outline:none; background:transparent; color:#a2a2a2; bottom:25px; right:10px; } .contentSlider .slick-prev:hover, .contentSlider .slick-next:hover{ color:var(--body-font-color); } /*CONTENT SECTION END*/ /*new parent*/ .new-patient h2{font-size:var(--fs-60);} .new-patient h3{font-weight: 400;letter-spacing: 0.1rem} /*NEW PARENT END*/ /*HOME GALLERY*/ .dark-bg .section-heading h2{ color:#fff ; font-size: var(--fs-60);} .dark-bg .section-heading p{ color:#fff; text-align:justify; text-align-last: center;} .home-gallery-holder{ margin-top:15px } .buttonGroupCenter{ justify-content:center; margin:40px 0 0 0; display:flex; } .dark-bg .btncn-secondary{ color:#fff } .spacial-padding{ padding-bottom:450px; } /*END HOME GALLERY*/ /*DUEL BG SECTION*/ .duel-bg{ background: linear-gradient(to bottom, var(--new-bg) 48%,#ffffff 48%); padding-top: 0} .duel-bg-rotate{ background: linear-gradient(to top, var(--new-bg) 48%,#ffffff 48%); padding-top: 0} .sp-section{ position:relative; } .sp-section-bottom{ position:absolute; width:100%; bottom:0; z-index:1 ; left: 0; display: flex; justify-content: flex-end; align-items: flex-end;} .sp-section-bottom h2{ margin:0; padding:0 65px 30px ; font-size:var(--fs-60); color:#fff; font-weight:500 } .sp-section-bottom .btncn{ margin:0; padding:40px 45px; font-size:var(--fs-22); } .sp-section-bottom .btncn i{margin: 0 15px 0 0} .vidPopup{ position:relative; } .vidBtn{ position:absolute; bottom:40px; left:45px; } .vidBtn a{ color:#fff; display:inline-block; vertical-align:middle; font-size:var(--fs-48); font-weight:300 } .vidBtn a span{ font-weight:500 } .vidBtn a i{ font-size:100px; margin:0 28px 0 0 ; vertical-align:middle;} .vidBtn a:hover{ color:var(--main-clr); } /*END DUEL BG SECTION*/ /*APPOINTMENT */ .appointmentSticker{ background:var(--deep-blue); padding:55px 65px; display:flex; align-items:center; justify-content:space-between; } .appointmentSticker h2{ padding:0 } .appointmentSticker h2{ color:#fff; } /*END APPOINTMENT*/ /*DOCTOR SLIDER*/ @media screen and (min-width: 991px) { .doctorSliderNav .slick-list{ padding-right:250%; margin-right:-250%; } .doctorSliderNav .slick-slide{ position:relative ; width:400px } .doctorSliderNav .slick-slide img{ transition: all .5s; width:100%; height:380px; object-fit:cover; object-position:top; transition-delay:0.5s; filter: grayscale(100%);opacity:0.2} .doctorSliderNav .slick-slide.slick-active img{ transition: all .5s; width:100%; height:488px; transition-delay:0.5s; filter: grayscale(0%);opacity:1 } .doctorSliderNav .slick-slide.slick-active + div{ padding-left:0; } .doctorSliderNav .slick-slide{ transition:all .5s } .doctorSliderNav .slick-track{ display:flex; align-items:center; } } .doctorSliderNav .slick-slide { margin: 0 8px; } .doctorSliderNav .slick-list { margin: 0 -8px; } .doctorSliderNav .slick-prev{ position:absolute; left:-160px; bottom:30px; border:none; outline:none ; background:transparent; font-size: 25px; opacity: 0.5} .doctorSliderNav .slick-next{ position:absolute; left:-100px; bottom:30px; border:none; outline:none ; background:transparent; font-size: 25px; opacity: 0.5} .doctorSliderNav .slickButton:hover{ opacity:1.0 } .doctorItem h2{ font-weight:400 } .doctorItem h4{ font-size:var(--fs-24); text-transform:uppercase; margin:0; padding:0 0 15px 0;color:var(--seconday-color); } .doctorItem h6{ font-size:var(--fs-18); text-transform: uppercase; letter-spacing: 1px; margin: 0} /*END DOCTOR SLIDER*/ /*PARTNERS START*/ .partnerLogoHolder{ padding:50px 0; background:#fff } .partnersLogoRow{display:flex;gap:35px;align-items:center; justify-content: space-between;} .partnersLogoImg img {margin: 0 auto; display: block; } .partnersHd h6{font-size:var(--fs-18);} @media only screen and (max-width:991px){ .partnersLogoRow{flex-wrap:wrap;justify-content:center;gap: 30px; justify-content: center;} .partnersLogoItem {width: calc(50% - 15px); } } /*PARTNERS END*/ /*HOME FORM SECTION*/ .full-section-form-holder{ position:relative; } .full-section-form-holder:after{ content:''; position:absolute; top:0; left:0; width:55%; height: 100%; z-index: 1; background:var(--new-bg); opacity: 0.8; } /* background:rgba( 85,88,97,0.80) */ .hmfrmcon { position:relative; z-index:2 } .formHolderDark{position: relative;z-index:3} .formHolderBg{position:absolute;width:100%;height:100%;top:0;left:0;z-index:-2} .formHolderBg img{width:100%;height:100%;object-fit:cover;object-position:bottom right} .formGroup{ display:flex; gap:30px; } .homeFormHolder{ padding:25px 0 0 0 } .homeFormHolder input[type=text], .homeFormHolder input[type=email], .homeFormHolder input[type=tel], .homeFormHolder select{ width:100% !important; background:transparent !important; border:none !important; border-bottom:1px solid #aaafaf !important; font-size:14px !important; text-transform:uppercase !important; letter-spacing:2px !important; font-weight:300 !important; color:#aaafaf !important; margin: 0 0 30px 0 !important; border-radius: 0px !important; } .homeFormHolder select { appearance: auto !important; } .homeFormHolder .inputHolder{ width:100% } .homeFormHolder ::placeholder { color: #aaafaf !important; opacity: 1 !important; } .homeFormHolder ::-ms-input-placeholder { color: #aaafaf !important;} .homeFormHolder input[type=submit]{ padding:22px 45px !important; background:var(--seconday-color) !important; border:none !important; outline:none !important; cursor:pointer !important; font-weight:500 !important; font-size:var(--fs-18) !important; transition:all .5s !important; margin-top:10px !important; text-transform:uppercase !important; color:#fff !important; letter-spacing:2px !important; border-radius: 0px !important; } .homeFormHolder input[type=submit]:hover{ background:var(--light-blue-color) !important; color:#000 !important; transition:all .5s !important; } .formHolderDark h2{ color:#fff } .formHolderDark p{ color:#fff ; text-align:left; line-height:1.6} .hmfrmcon{ padding:0 90px 0 0 } .formHolderDark .section-heading{ padding:0; margin:0 } .formHolderDark .bgImage{ width:43%; position:absolute; top:0; right:0; height:100% } .formHolderDark .bgImage img{ width:100%; height:100%; object-fit:cover; } .formHolderDark{ position:relative; overflow:hidden; } .sideImage{ margin-bottom:-1px; margin-left:-120px } /*END HOME FORM SECTION*/ /*Team */ .teamHolder{ margin:60px 0 0 0 } .teamImage img{ width:280px; height:280px; border-radius:50% ; } .teamBox h3{ font-size:var(--fs-36); padding:0 0 15px 0 } .teamImage{ overflow:hidden; width:300px; height:300px; border-radius:50%; padding:10px; border:1px solid var(--deep-blue); transition:all .5s; margin:0 auto 45px ; } .teamImage:hover{ transform:scale(1.1); transition:all .5s; } .midBtn .btncn-default{ background:var(--deep-blue); border-color:var(--deep-blue); } .midBtn .btncn-default:hover{ background:var(--seconday-color); border-color: var(--seconday-color); } /*End Team*/ /*REVIEW SECTION*/ .reviewSlider{ margin:30px 0 0 0 } .reviewSlider .slick-slide { margin: 0 8px; } .reviewSlider .slick-list { margin: 0 -8px; } .reviewItem{ text-align:center; padding:55px 45px; background:var(--light-blue-color); } .star{ font-size:20px; color:var(--seconday-color); margin:0 0 20px 0 } .reviewItem p{ text-align:center; } .reviewItem h6{ font-size:16px; color:var(--body-font-color); margin:0; padding:0; text-transform:uppercase; font-weight:400 ; letter-spacing: 1px} .btn-view{ text-decoration:underline; text-underline-offset:5px; font-size:var(--fs-18); color:#000000 } .btn-view:hover{ color:var(--seconday-color); } .reviewSlider .slick-prev{ position:absolute; font-size:25px; border:none; outline:none; background:transparent; width:43px; height:59px; background:var(--main-clr); color:#fff; left:-55px; top:50%; transform:translateY(-50%); transition: all .5s} .reviewSlider .slick-next{ position:absolute; font-size:25px; border:none; outline:none; background:transparent; width:43px; height:59px; background:var(--main-clr); color:#fff; right:-55px; top:50%; transform:translateY(-50%); transition: all .5stransition: all .5s} .reviewSlider .slick-prev:hover, .reviewSlider .slick-next:hover{ color:#fff; background:var(--seconday-color); transition: all .5s} #reviewtxt .modal-body {padding:30px 35px 35px} .reviewModalClose {position: absolute;top: 0px;right: 0px;transform: translate(50%, -50%);background: #ff0000;width: 31px;height: 31px;display:flex;align-items:center;justify-content:center;line-height:1;border: 0;border-radius: 11px;font-size:18px;color: #fff;z-index:9;} .modal-backdrop.show {opacity: 0.9;} #reviewtxt .modal-dialog {max-width: 700px;text-align: center;} #reviewtxt h3 {margin-bottom: 10px;} #reviewtxt .star {margin-bottom:10px} #reviewtxt .modal-body {max-height: calc(100vw - 150px);overflow: auto;} .more_txt {font-size: 16px;display: block;color: #ff0000; margin: 15px 0;font-weight: bold;} .reviewSlider .slick-track {display: flex;align-items: stretch;} .reviewSection .slick-slide > div,.reviewItem {height: 100%;} .more_txt:hover {color: #003380;} .reviewSection .btncn-secondary{ border-color:var(--main-clr); } .reviewSection .btncn-secondary:hover{ border-color:var(--seconday-color); } /*END REVIEW SECTION*/ /*TREATMENT PAGE*/ .main-content-center p{ text-align:justify; text-align-last:center; } .traement-dark{ background:var(--main-clr); } .text-white p, .text-white h2{ color:#fff } /*INNER BANNER*/ .innerBanner{ position:relative; } .banerImageHolder{ position:relative;} .bannerImage img{ width:100%; } .innerbannerContent{ position:absolute; width:100%; left:0; top:50%; transform:translateY(-50%); padding:20px } .innerbannerContent .bannerButtonGroup{ justify-content:center; } .innerbannerContent h2{ font-size:var(--fs-70); color:#fff; padding:0 0 30px 0; } /*{text-shadow:5px 9px 28px rgb(0 0 0), 5px 9px 28px rgb(0 0 0), 5px 9px 28px rgb(0, 0, 0)}*/ .innerbannerContent .btncn-white{ color:var(--body-font-color); } .innerbannerContent .btncn-white:hover{ color:#fff; background: var(--seconday-color);} .halfInnerBanner{ position:relative; display:flex; justify-content:flex-end; } .halfBannerImage{ width:50%; } .halfBannerImage img{ width:100% } .halfBannerCaption{ position:absolute; top:50%; transform:translateY(-50%); width:100%; left:0 } .halfBannerCaption h1{ font-size:var(--fs-70); color:var(--body-font-color); } .partnetSectionTreatment{ padding:0 0 75px 0 } @media only screen and (max-width: 1400px) { .innerBanner{ padding:0 0 0 0 } .innerbannerContent h2{ font-size:50px; } } @media only screen and (max-width: 991px) { .innerbannerContent h2{ font-size:40px; padding:0 0 30px 0 } .bannerImage img{ height:430px; object-fit:cover; } } @media only screen and (max-width: 767px) { .innerbannerContent h2{ font-size:32px } .innerbannerContent .btncn-white{ padding:13px 15px } } /*END INNER BANNER*/ /*PAGINATION SECTION*/ .pagination{ padding:40px 0 0 0 } .pagination ul{ display:flex; justify-content:center; margin:0; padding:0; list-style:none; gap:30px; } .pagination ul li{ font-family:var(--bodyfont); font-size:var(--fs-18); text-transform:uppercase; letter-spacing:1px ; color:rgba(0,0,0,0.4); position:relative; } .pagination ul li:after{ content:''; position:absolute; background:#cdcdcd; width:6px; height:6px; border-radius:50%; right: -18px; top: 10px; } .pagination ul li:last-child:after{ display:none; } .pagination ul li a{ color:rgba(0,0,0,0.4); } .pagination ul li a:hover{ color:var(--main-clr); } @media only screen and (max-width: 991px) { .pagination{ padding:25px 0 0 0 } } /*END PAGINATION SECTION*/ /*BLOG SECTION*/ .blogCategory{ padding:20px 30px ; display:flex; align-items:center; background: #fcf8fa} .blogCategory span{ font-family:var(--bodyfont); font-size:var(--fs-30); font-weight:300; padding:0 12px 0 0 } .blogCategory select{ width:100%; border:none; background:transparent; font-family:var(--bodyfont); font-size:var(--fs-30); font-weight:300; appearance: none; -webkit-appearance: none; -moz-appearance: none; background-image:url(assets/images/downArrow.png); background-repeat:no-repeat; background-position: 100% center;} .blogCategory select option{} .blogPostRepeater{ margin:35px 0 } .blogPostContent h4{ padding:25px 0 15px 0; font-size:var(--fs-22); } a.postReadMore{ font-size:var(--fs-14); color:var(--seconday-color); font-weight:500; text-decoration:underline; text-underline-offset:5px } a.postReadMore:hover{ color:var(--main-clr); } .blogPostContent{ margin:0 0 30px 0 } .blogPostContent a h4{ color:#000; font-size:var(--fs-18); line-height:1.5 } .blogTop{ background:#f5f5f7; padding:15px 20px 15px 35px; margin:0 0 45px 0 ; display:flex; justify-content:space-between; align-items: center;} .sortBy{ font-weight:500; color:var(--body-font-color); font-size:var(--fs-18); } .categotyDropdown{ width:325px; } .categotyDropdown select{ width:100%; background:transparent; border:none; border-bottom:1px solid #bcbec0 ; padding: 10px 0; font-weight:500; color:var(--body-font-color); font-size:var(--fs-18);} @media only screen and (max-width: 991px) { .blogPostContent h4{ padding-top:0 } .blogPostContent{ margin:0 0 30px 0 } .blogCategory{ padding:20px 15px } .blogCategory span{ font-size:16px } .blogCategory select{ font-size:16px } .blogPostContent .hoverImage{ margin-bottom:15px } } @media only screen and (max-width: 767px) { .blogCategory select{ background-size:16px } } /*END BLOG SECTION*/ /*BLOG DETAILS BANNER*/ /*.blogdetails h1{ font-size:var(--fs-48); padding:0 0 50px 0 } .pageContent h2{ font-size:var(--fs-42); padding:0 0 35px 0 ; text-transform: none;font-weight:400;color:var(--main-clr);font-family:var(--headfont);} */ @media only screen and (max-width: 1199px) { .blogdetails h1{ font-size:40px ; padding: 0 0 20px 0} } @media only screen and (max-width: 1199px) { .blogdetails h1{ font-size:36px } } /*END BLOG DETAILS BANNER*/ /*BLOG DETAILS*/ .pageContent p{ font-size:var(--fs-18);} .pageContent h3{ padding-top:10px;color:var(--body-font-color);font-family:var(--headfont);font-size:var(--fs-36);font-weight:300 } /*END BLOG DETAILS*/ /*BLOG DETAILS SIDEBAR*/ .brdholder{ text-align:right; } .darksidebar-bg{ } .sidebarFormHolder{ padding:0; margin:5px 0 0 60px} .sidebarFormHolder h2{font-weight: 300;} .sidebarImage img{ width:100% } .sidebar{ overflow: auto; position: -webkit-sticky; position: sticky; top: 100px; min-height: 200px; z-index:1; } .sidebarContent{ padding:55px ; background: var(--deep-blue);} .sidebar h3{ color:var(--body-font-color); font-weight:300; font-family:var(--bodyfont); font-size:var(--fs-42); } .sidebar p{ text-align:center; font-weight:400; font-size:16px; } .sidebar-form .inputHolder{} .sidebar-form .inputHolder input[type=text], .sidebar-form .inputHolder input[type=email], .sidebar-form .inputHolder input[type=tel], .sidebar-form .inputHolder select{ width:100% !important; background:transparent !important; border:none !important; border-bottom:1px solid rgba(255,255,255,0.6) !important; font-size:14px !important; text-transform:uppercase !important; letter-spacing:2px !important; font-weight:300 !important; color: rgba(255,255,255,0.6) !important; margin: 0 0 20px 0 !important; border-radius: 0 !important; box-shadow: none !important;} .sidebar-form .inputHolder select { appearance: auto !important; } .sidebar-form .inputHolder select option { color: #686e77 !important; } .sidebar-form .inputHolder { width:100% } .sidebar-form .inputHolder ::placeholder { color:rgba(255,255,255,0.6); opacity: 1; } .sidebar-form .inputHolder ::-ms-input-placeholder { color: rgba(255,255,255,0.6);} .formGroup{ } .sidebar-form input[type=submit]{ padding:20px 45px !important; background:var(--seconday-color) !important; border:none !important; outline:none !important; cursor:pointer !important; font-weight:500 !important; font-size:var(--fs-18) !important; transition:all .5s !important; margin: 15px auto !important; display: block !important; border-radius: 0 !important; color: #fff !important; color: #fff !important; text-transform: uppercase !important;} .sidebar-form input[type=submit]:hover{ opacity: 0.8 !important; transition:all .5s !important; } .sidesticky{ position:sticky; top:0; overflow:auto; } .breadcumb.main{ background:#eeeeef } .breadcumb{ padding:17px 10px 15px; } .breadcumb ul{ display:flex; justify-content:flex-end; margin:0; padding:0; list-style:none; column-gap: 30px;} .breadcumb ul li{ font-family:var(--bodyfont); font-size:var(--fs-14); text-transform:uppercase; letter-spacing:0.2em ; color:rgba(0,0,0,0.4); position:relative; text-align:center; } .breadcumb ul li:after{ content:'/'; position:absolute; color:#cdcdcd; border-radius:50%; right: -18px; top: 0px; } .breadcumb ul li:last-child:after{ display:none; } .breadcumb ul li a{ color:rgba(0,0,0,0.4); } .breadcumb ul li a:hover{ color:var(--main-clr); } .sidebarContent h2, .sidebarContent p { color:#fff; line-height:1.6 } .callToBook{ background:var(--seconday-color); text-align:center; } .callToBook a{ display:block; padding:20px; font-weight:500; font-size:var(--fs-24); text-transform:uppercase; color:#fff; letter-spacing:1px } .callToBook a i{ margin:0 10px 0 0 } .breadcumb.main ul{ justify-content:center; } .introSection h6{ padding-bottom:30px } .introSection p{ text-align: justify; text-align-last: center; } @media only screen and (max-width: 991px) { .sidebarFormHolder{ margin:0 } .sidebar{ margin-top:45px; } .breadcumb ul{ justify-content:center; } } @media only screen and (max-width: 767px) { .sidebarFormHolder{ padding:0 } .sidebarContent{ padding:30px } .sidebar{ margin-top:10px } .breadcumb ul{ flex-wrap:wrap; } } /*END BLOG DETAILS SIDEBAR*/ /*GALLERY*/ .twentytwenty-horizontal .twentytwenty-handle:before, .twentytwenty-horizontal .twentytwenty-handle:after, .twentytwenty-vertical .twentytwenty-handle:before, .twentytwenty-vertical .twentytwenty-handle:after { content: " "; display: block; background: white; position: absolute; z-index: 30; -webkit-box-shadow: 0px 0px 12px rgba(51, 51, 51, 0.5); -moz-box-shadow: 0px 0px 12px rgba(51, 51, 51, 0.5); box-shadow: 0px 0px 12px rgba(51, 51, 51, 0.5); } .twentytwenty-horizontal .twentytwenty-handle:before, .twentytwenty-horizontal .twentytwenty-handle:after { width: 3px; height: 9999px; left: 50%; margin-left: -1.5px; } .twentytwenty-vertical .twentytwenty-handle:before, .twentytwenty-vertical .twentytwenty-handle:after { width: 9999px; height: 3px; top: 50%; margin-top: -1.5px; } .twentytwenty-before-label, .twentytwenty-after-label, .twentytwenty-overlay { position: absolute; top: 0; width: 100%; height: 100%; } .twentytwenty-before-label, .twentytwenty-after-label, .twentytwenty-overlay { -webkit-transition-duration: 0.5s; -moz-transition-duration: 0.5s; transition-duration: 0.5s; } .twentytwenty-before-label, .twentytwenty-after-label { -webkit-transition-property: opacity; -moz-transition-property: opacity; transition-property: opacity; } .twentytwenty-before-label:before, .twentytwenty-after-label:before { color: white; font-size: 13px; letter-spacing: 0.1em; } .twentytwenty-before-label:before, .twentytwenty-after-label:before { position: absolute; background: rgba(255, 255, 255, 0.2); line-height: 38px; padding: 0 20px; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; } .twentytwenty-horizontal .twentytwenty-before-label:before, .twentytwenty-horizontal .twentytwenty-after-label:before { top: 50%; margin-top: -19px; } .twentytwenty-vertical .twentytwenty-before-label:before, .twentytwenty-vertical .twentytwenty-after-label:before { left: 50%; margin-left: -45px; text-align: center; width: 90px; } .twentytwenty-left-arrow, .twentytwenty-right-arrow, .twentytwenty-up-arrow, .twentytwenty-down-arrow { width: 0; height: 0; border: 6px inset transparent; position: absolute; } .twentytwenty-left-arrow, .twentytwenty-right-arrow { top: 50%; margin-top: -6px; } .twentytwenty-up-arrow, .twentytwenty-down-arrow { left: 50%; margin-left: -6px; } .twentytwenty-container { -webkit-box-sizing: content-box; -moz-box-sizing: content-box; box-sizing: content-box; z-index: 0; overflow: hidden; position: relative; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; } .twentytwenty-container img { max-width: 100%; position: absolute; top: 0; display: block; } .twentytwenty-container.active .twentytwenty-overlay, .twentytwenty-container.active :hover.twentytwenty-overlay { background: rgba(0, 0, 0, 0); } .twentytwenty-container.active .twentytwenty-overlay .twentytwenty-before-label, .twentytwenty-container.active .twentytwenty-overlay .twentytwenty-after-label, .twentytwenty-container.active :hover.twentytwenty-overlay .twentytwenty-before-label, .twentytwenty-container.active :hover.twentytwenty-overlay .twentytwenty-after-label { opacity: 0; } .twentytwenty-container * { -webkit-box-sizing: content-box; -moz-box-sizing: content-box; box-sizing: content-box; } .twentytwenty-before-label { opacity: 0; } .twentytwenty-before-label:before { content: attr(data-content); } .twentytwenty-after-label { opacity: 0; } .twentytwenty-after-label:before { content: attr(data-content); } .twentytwenty-horizontal .twentytwenty-before-label:before {left: 10px; } .twentytwenty-horizontal .twentytwenty-after-label:before { right: 10px; } .twentytwenty-vertical .twentytwenty-before-label:before { top: 10px; } .twentytwenty-vertical .twentytwenty-after-label:before { bottom: 10px; } .twentytwenty-overlay { -webkit-transition-property: background; -moz-transition-property: background; transition-property: background; background: rgba(0, 0, 0, 0); z-index: 25; } .twentytwenty-overlay:hover { background: rgba(0, 0, 0, 0.5); } .twentytwenty-overlay:hover .twentytwenty-after-label { opacity: 1; } .twentytwenty-overlay:hover .twentytwenty-before-label { opacity: 1; } .twentytwenty-before {z-index: 20; } .twentytwenty-after { z-index: 10; } .twentytwenty-handle { height: 38px; width: 38px; position: absolute; left: 50%; top: 50%; margin-left: -22px; margin-top: -22px; border: 3px solid white; -webkit-border-radius: 1000px; -moz-border-radius: 1000px; border-radius: 1000px; -webkit-box-shadow: 0px 0px 12px rgba(51, 51, 51, 0.5); -moz-box-shadow: 0px 0px 12px rgba(51, 51, 51, 0.5); box-shadow: 0px 0px 12px rgba(51, 51, 51, 0.5); z-index: 40; cursor: pointer; } .twentytwenty-horizontal .twentytwenty-handle:before { bottom: 50%; margin-bottom: 22px; -webkit-box-shadow: 0 3px 0 white, 0px 0px 12px rgba(51, 51, 51, 0.5); -moz-box-shadow: 0 3px 0 white, 0px 0px 12px rgba(51, 51, 51, 0.5); box-shadow: 0 3px 0 white, 0px 0px 12px rgba(51, 51, 51, 0.5); } .twentytwenty-horizontal .twentytwenty-handle:after { top: 50%; margin-top: 22px; -webkit-box-shadow: 0 -3px 0 white, 0px 0px 12px rgba(51, 51, 51, 0.5); -moz-box-shadow: 0 -3px 0 white, 0px 0px 12px rgba(51, 51, 51, 0.5); box-shadow: 0 -3px 0 white, 0px 0px 12px rgba(51, 51, 51, 0.5); } .twentytwenty-vertical .twentytwenty-handle:before { left: 50%; margin-left: 22px; -webkit-box-shadow: 3px 0 0 white, 0px 0px 12px rgba(51, 51, 51, 0.5); -moz-box-shadow: 3px 0 0 white, 0px 0px 12px rgba(51, 51, 51, 0.5); box-shadow: 3px 0 0 white, 0px 0px 12px rgba(51, 51, 51, 0.5); } .twentytwenty-vertical .twentytwenty-handle:after { right: 50%; margin-right: 22px; -webkit-box-shadow: -3px 0 0 white, 0px 0px 12px rgba(51, 51, 51, 0.5); -moz-box-shadow: -3px 0 0 white, 0px 0px 12px rgba(51, 51, 51, 0.5); box-shadow: -3px 0 0 white, 0px 0px 12px rgba(51, 51, 51, 0.5); } .twentytwenty-left-arrow { border-right: 6px solid white; left: 50%; margin-left: -17px; } .twentytwenty-right-arrow { border-left: 6px solid white; right: 50%; margin-right: -17px; } .twentytwenty-up-arrow { border-bottom: 6px solid white; top: 50%; margin-top: -17px; } .twentytwenty-down-arrow { border-top: 6px solid white; bottom: 50%; margin-bottom: -17px; } /*END GALLERY*/ /*CONTACT ICON*/ .iconHolder{ margin:10px 0 30px 0 } .iconList{ display:flex; align-items:center; margin:0 0 40px 0 } .iconListIcon{ width:26px; flex-shrink:0; margin:0 25px 0 0; color:var(--main-clr); font-size:18px } .iconListText{ font-size:var(--fs-18); color:var(--body-font-color); font-family:var(--bodyfont); } .iconListText a{ color:var(--body-font-color); } .iconListText a:hover{ color:var(--seconday-color); } .mapHolder{ margin:0 0 45px 0 } .mapHolder { overflow: hidden; padding-top: 56.25%; position: relative; border: 0px solid #777777; display: block;} .mapHolder iframe { position: absolute; top: 0; left: 0; border: 0; width: 100%; height: 100%; } .openingHr td{ padding:5px 5px 5px } .openingHr h2{ font-size:var(--fs-36); } @media only screen and (max-width:767px){ .iconListIcon{ margin:0 10px 0 0 } } /*END CONTACT ICON*/ /*TREATMENT BOX*/ .treatmentImage{ margin:0 0 30px 0 ; overflow: hidden; position: relative;} .treatmentImage img{ width:100% ; transition: all .5s;display:block;} .treamentHolder{ position:relative; } .treamentHolder h3{ color:var(--body-font-color); transition:all .5s } .treamentHolder a:hover h3{ color:var(--seconday-color); transition:all .5s } .treamentCaption{ position:absolute; top:50%; transform:translateY(-50%); text-align:center; padding:30px; width: 100%; left: 0; opacity: 0; visibility: hidden;transition: all .5s;} .treamentCaption ul{ margin:0; padding:0; list-style:none; } .treamentCaption ul li{ float:none; font-size:var(--fs-20); margin:12px 0 } .treamentCaption ul li a{color:#fff; } .treamentHolder *{ box-sizing:border-box; } .treamentHolder:hover .treatmentImage img{filter: blur(65px); transition: all .5s;} .treamentHolder:hover .treamentCaption{ opacity:1.0; visibility:visible; transition: all .5s;} .pageContent .btncn { margin:25px 0 50px 0; } .treatmentContentHolder h2{ text-transform:none; } .treatmentContentHolder .btncn-white{ border:1px solid var(--body-font-color); } .treatmentBoxHolder{ display:flex; background:#f7f7f7; } .treatmentContent{ width:50%; display:flex; align-items:center; padding:45px } .treatmentContent ul{ margin:0; padding:0; list-style:none; } .treatmentContent ul li{ font-size:var(--fs-20); color:var(--body-font-color); font-weight:400; padding:10px 0 } @media only screen and (max-width:1399px){ .treatmentContent{ padding:30px; } } @media only screen and (max-width:991px){ .treamentHolder{ margin-bottom:30px; } .treatmentImage{ margin:0 0 20px 0 } } @media only screen and (max-width:767px){ .treatmentBoxHolder{ flex-direction:column; } .treatmentContent{ width:100%; padding:5px 30px 30px } .treatmentBoxHolder{ margin-bottom:25px } } /*PINK SECTION*/ .pink-section{ background:var(--seconday-color); text-align:center; } .pink-section h2{ color:#fff } .pink-section .btncn-default{ background:var(--main-clr); } .pink-section .buttonGroupCenter{ margin:0 } .pink-section .btncn-default:hover{ background:transparent; } /*TREATMENT GALLERY*/ .treatmentGallery h2{ text-transform:none; } /*ACCRIDIAN SECTION*/ .accordian-new h3 { font-family: var(--bodyfont); font-weight: 400; font-size: var(--fs-24); color: var(--body-font-color); cursor: pointer; margin-bottom: 0; position: relative; padding: 30px 30px 30px 0; } .ui-accordion-content-new { } .ui-accordion-header-active-new{} .accordian-new h3:focus { outline: 0} .accordian-new h3:after { content: "\f063"; font-family: 'FontAwesome'; position: absolute; right: 0; top: 30px; font-size: 24px; color: #000000; font-weight: 300; transition: .5s} .inneraccordina-area { padding: 10px 0 45px 0; } .accordian-new h3.ui-accordion-header-active-new:after { transform: rotate(180deg); color: #3b3b3b} .accordianarea-new .accordian h3.ui-accordion-header-active-new:after { transform: rotate(-180deg); color: #f05824} .ui-accordion-content-new { padding: 0px 0px 30px 0; display: none} .ui-accordion-content-new p { text-align: justify;} .faqSection h2{ text-transform:none; } .accroContent{ border-bottom:1px solid #d3d3d3; } @media only screen and (max-width:767px){ .accordian-new h3{ padding: 15px 30px 15px 0; } .accordian-new h3:after{ top:17px; font-size:17px } } /*BEFORE AFTER SLIDER*/ .beforeAfterSlider{ width:100%; margin:0 auto; } .beforeAfterSlider .slick-slide { margin: 0 40px; } .beforeAfterSlider .slick-list { margin: 0 -40px; } .beforeAfterSlider .slick-prev{ position:absolute; top:50%; transform:translateY(-50%); left:-50px; font-size:30px; border:none; outline:none; background:transparent; color:#fff } .beforeAfterSlider .slick-next{ position:absolute; top:50%; transform:translateY(-50%); right:-50px; font-size:30px; border:none; outline:none; background:transparent; color:#fff } .beforeAfterSlider .slick-prev:hover, .beforeAfterSlider .slick-next:hover{ color:var(--body-font-color); } .beforeAfterSlider .slick-center{ transform:scale(1.3); transition:all .5s; transition-delay:0.5s } .beforeAfterSlider .slick-track{ padding:60px 0; overflow:visible; } .sp-hover .btncn-default:hover{ background:transparent; border-color:var(--seconday-color); } @media only screen and (max-width:1199px){ .beforeAfterSlider .slick-slide { margin: 0 25px; } .beforeAfterSlider .slick-list { margin: 0 -25px; } .beforeAfterSlider .slick-track{ padding:40px 0 } } @media only screen and (max-width:767px){ .beforeAfterSlider .slick-center{ transform:scale(1.0); transition:all .5s; } .beforeAfterSlider{ margin:0 auto; width:75% } .beforeAfterSlider .slick-track{ padding:10px 0 } .beforeAfterSlider .slick-prev{ left:-40px } .beforeAfterSlider .slick-next{ right:-40px } } /*FOOTER*/ .footer{ background:var(--new-bg); } .footBottom{ padding:45px 0; } .ftbtm{ justify-content:space-between; align-items:center; display: flex;} .copyright{ font-size:14px; color:rgba(255,255,255,0.42) ; text-transform: uppercase; letter-spacing: 2px; font-weight: 300} .footerTop{ padding:85px 0 50px 0; } .footerTopContent{ display:flex; justify-content:space-between; } .footerwidget_1{ width:36%; } .footerwidget_2{ width:29%; } .footerwidget_3{ width:25%; } .footerIconListHolder{ display: grid; grid-template-columns: auto auto; gap:10px; row-gap:25px; } .footerIconList{ font-size:var(--fs-16); font-weight:300 ; color: #fff;} .footerIconList a{ color: #fff; } .footerIconList i{ margin:0 10px 0 0 } .footerIconList a:hover{ color:var(--seconday-color); } .footerLogo img{ filter: grayscale(1) brightness(100); margin:0 0 30px 0 } .footerTopContent h2{ color:#fff ; font-size: var(--fs-36); font-weight: 300; line-height: 1.4; padding: 0 0 25px 0} .footerTopContent p{ color:#fff; font-size:var(--fs-16); font-family:var(--bodyfont); line-height:1.6; padding:0 0 30px 0 ; font-weight: 300} .footerTopContent p strong{ font-weight:700 } .btnnSocialGrp{ display:flex; align-items:center; margin:15px 0 0 0 } .btnnSocialGrp .btncn-secondary{ color:#fff } .footerTop .btncn-light:hover{ background:#6daff3 } .footerTop h2{ font-size:var(--fs-36); padding:0 0 30px 0 } .social{ margin:50px 0 0 0; } .social ul{ margin:0; padding:0; list-style:none; display: flex; gap: 24px} .social ul li a{ display:block ; color:#fff; font-size:20px; } .social ul li a:hover{ color:var(--seconday-color); } .footerTopContent p a{ color:#fff } .footerTopContent p a:hover{ color:var(--seconday-color); } .footerTopContent table{ width:100%; } .footerTopContent table td{ color:#fff ; font-size:var(--fs-16); font-family:var(--bodyfont); line-height:1.8; font-weight: 300} .footerTopContent table td:first-child{ padding-right:20px; } .addressHolder{ display:flex; gap:15px; justify-content:space-between; } .addressBox p{ padding-bottom:0; line-height:2 } .addressBox p span{ font-weight:500 } .breadcumb.mobile{ background:var(--light-blue-color); } .blogSection{ padding-bottom:0 ; padding-top: 45px} .blogdetails h1{ color:var(--body-font-color); } .boxCta h3{ margin:0; padding:25px 0; font-size:var(--fs-36); } .boxCta p{ padding-bottom:0 } .sidebarFormHolder .sidebarContent{ background:url(assets/images/sidebar-form-bg.jpg) no-repeat; background-size:cover; } .deep-bg.faqSection h2{ color:#fff } .deep-bg.faqSection h2 span{ color:#fff } .deep-bg .accordian-new h3{ color:#fff; font-weight:300 } .deep-bg .ui-accordion-content-new p{ color:#fff; font-weight:300 } .deep-bg .accordian-new h3:after{ color:#fff } .deep-bg .accordian-new h3.ui-accordion-header-active-new:after{ color:#fff } .accroContent { border-bottom: 1px solid #777981;} .gallery-con .hoverImage{ cursor:pointer; } .gallery-con .hoverImage a{ display:block; } .gallery-holder{ position:relative; margin-top:45px; } .gallery-holder .more-link{ position:absolute; right:0; top:-120px; } @media only screen and (max-width:1399px){ .footerwidget_3{ width:30% } } @media only screen and (max-width:1199px){ .footerTopContent h2{ font-size:36px } .footerTop{ padding:45px 0 } .footBottom{padding: 15px 0} .footerTopContent{ display:block; } .footerwidget_1{ width:100%; } .footerwidget_2{ width:100%; margin:30px 0 10px 0} .footerwidget_3{ width:100%; } } @media only screen and (max-width:767px){ .footerTopContent h2{ font-size:32px } .enquiryBtn a{ padding:15px 20px } .ftbtm{ flex-direction:column; align-items: center;} .copyright{ padding-bottom:15px } .btnnSocialGrp{ flex-direction:column; } .social{ margin:10px 0 0 0 } .footerTopContent h2{ font-size:24px } .copyright{ text-align:center; } } /*FOOTER END*/ /*RESPONSIVE CSS*/ .desktop{ display:block; } .mobile{ display:none; } @media only screen and (max-width:1500px){ :root{ --fs-60: 50px; --fs-48: 40px; } .bannerCaption h1{ font-size:60px } .meetSecLeft h2{ font-size:50px; } .footerIconList{ font-size:14px } .footerTopContent p{ font-size:14px } } @media only screen and (max-width:1399px){ :root{ --fs-60: 45px; --fs-48: 38px; --fs-42: 34px; --fs-18:16px; } /* .bannerCaption h1{ font-size:80px }*/ .contant-slider-holder{ padding:50px } .bannerCaption h2{ font-size:20px } .welcomeSection{ padding:50px 0 } .section{ padding:50px 0 } .contentHolder:not(:last-child){ padding:0 0 50px 0 } .btncn{ padding: 15px 25px 13px; } .duel-bg{ padding-top:0 } .sp-section-bottom .btncn{ padding: 30px 45px; } .reviewSlider { padding:0 50px } .reviewSlider .slick-prev{ left:0 } .reviewSlider .slick-next{ right:0 } .no-padding-top{ padding-top:0 } .halfBannerCaption h1{ font-size:60px } .bannerCaption h1{ font-size:50px } .meetSecLeft h2{ font-size:40px } .meetTabNav .nav-link{ padding: 20px 10px 20px 40px; } .treatmentSlider .contant-slider-holder{ padding:30px; } } @media only screen and (max-width:1199px){ :root{ --fs-60: 35px; --fs-36: 27px; --fs-30: 25px; --fs-24: 18px; --fs-22: 18px; } .logo{ width:300px; position:relative; z-index:9999 } .welcomeLeft, .welcomeRight{ width:50% } .g-5, .gx-5{ --bs-gutter-x: 3rem; } .welcomeContent{ gap:120px } .buttonGroup{ flex-direction:column; } .buttonGroup a{ margin:0 } .contentHolder ul li a{ font-size:20px; padding:12px 0 } .sp-section-bottom h2{ padding:0 30px 20px } .sp-section-bottom .btncn{ padding:25px 25px } .formHolderDark .align-items-center { align-items: flex-end !important;} .formHolderDark p br{ display:none; } .formHolderDark h2{ font-size:30px } .hmfrmcon{ padding-top:50px; padding-bottom:50px } .ratingSection h4{ font-size:16px } .number{ font-size:26px } .phoneNumber, .bookAppointment a{ position:relative; z-index:9999 } .halfBannerCaption h1{ font-size:50px; padding:0 0 15px 0 } .innerbannerContent{top:50%} .navigation{ visibility:hidden; } .meettabImage{ max-width:280px } .vidBtn a i{ font-size:70px; margin:0 10px 0 0 } .footerIconListHolder{ display:flex; flex-wrap:wrap; } .footerIconList{ width:100% } .addressHolder{ flex-wrap:wrap; } .addressBox{ width:100% } .fixed .section-parent-menu{ padding:0 } } @media only screen and (max-width:991px){ :root{ --fs-30: 22px; } .bannerCaption h1{ font-size:45px } .bannerCaption h2{ font-size:15px } .welcomeContent{ flex-direction:column; gap: 10px} .welcomeLeft, .welcomeRight{ width:100% } .serviceSlider{ margin:0 } .serviceSlider .slick-next{ bottom:0; top:inherit; left:53%; right:inherit; } .serviceSlider .slick-prev{ bottom:0; top:inherit; left: 47%; right: inherit;} .serviceSlider { padding-bottom:60px; } .ratingSection{ padding:10px 0 0 0 } .sp-section-bottom h2{ font-size:24px } .sp-section-bottom .btncn{ font-size:16px } .doctorSliderNav .slick-slide.slick-current{ outline:2px solid var(--seconday-color); outline-offset:-2px } .doctorItemNav{ display:block !important; } .desktop{ display:none; } .mobile{ display:block; } .doctorSliderNav .slick-next{ left: inherit; right: 0; bottom:inherit; top:50%; transform:translateY(-50%); } .doctorSliderNav .slick-prev{right: inherit; left: 0; bottom:inherit; top:50%; transform:translateY(-50%); } .doctorSliderNav { padding:0 50px } .hmfrmcon{ padding-right:0; padding-left:0 } .beforeAfterSlider{ width:85% } .halfBannerCaption h1{ font-size:42px } .formHolderBg {position: static; margin: 0 0 50px 0; } .formHolderDark::after {width: 100%; } .formHolderDark {padding-top: 0; background: var(--deep-blue); } .formHolderBg img {aspect-ratio: 1.38; } .contentHolder ul li a:before{ top:12px; } .appointmentSticker{ padding:30px; flex-wrap: wrap; text-align: center; justify-content: center;} .teamHolder{ margin:10px 0 0 0 } .midBtn{ margin-top:0 !important } .welcomeLeft h2 br{ display:none; } .welcomeLeft:after{ display:none; } .g-5, .gy-5 { --bs-gutter-y: 0rem !important;} .partnetSectionTreatment{ padding:0 0 50px 0 } .banner:after{ width:60% } .logo{ width:200px; } .meetTabContent{ width:100%; margin:0 } .meetSec .tab-content>.tab-pane {display: block; opacity: 1; } .meetSec .accordion-button{ text-transform:uppercase; font-weight:500; box-shadow:none !important; outline: none !important;} .meetSec .accordion-button:not(.collapsed){ background:var(--main-clr); color:#fff } .meetSec h3.accordion-header{ margin-bottom:10px; padding-bottom:0 } .meetTabContent{ padding:30px 0; gap:15px } .vidBtn a{ font-size:30px } .vidBtn a i{ font-size:50px } .contentHolder h2{ padding-top:25px } .formHolderDark::after{ display:none; } .boxCta{ margin-bottom:30px } .social{ margin:30px 0 50px 0 } .treatmentSlider .contant-slider-holder{ padding:50px; } } @media only screen and (max-width:767px){ :root { --fs-60: 36px; --fs-48: 30px; --fs-42: 26px; --fs-18: 16px; --fs-20: 17px; } .container{ padding:0 30px } .bannerCaption h1{ font-size:42px } .btncn{ font-size:15px; padding: 15px 20px 15px; } .btncn-default i, .btncn-secondary i{ margin:0 5px 0 0 } .serviceSlider .slick-next{ left:60% } .serviceSlider .slick-prev{ left:40% } .number{ margin-bottom:10px } .reviewSlider .slick-prev{ left:-30px; } .reviewSlider .slick-next{ right:-30px } .reviewSlider{ padding:0 20px } .reviewItem{ padding:30px } .contentHolder ul li a:before{ top:12px } .sp-section-bottom{ position: static; background: var(--main-clr); flex-direction: column; align-items: center; box-shadow: -50vw 0 0 var(--main-clr), 50vw 0 0 var(--main-clr), -50vw -65px 0 var(--main-clr), 50vw -65px 0 var(--main-clr); padding-bottom: 30px; padding-top: 25px; } .sp-section-bottom h2{ padding:15px; text-align:center; } .sp-section-bottom .btncn{ font-size:15px } .mean-container a.meanmenu-reveal{ margin-top:-7px } .headerMian{ padding-top:5px; padding-bottom:5px } .phoneNumber a{ margin: 0 4px 0 0; } .bookAppointment a{ margin: 0 40px 0 0; } .mean-container a.meanmenu-reveal{ right:-10px !important ; top: -20px} .headerHolder{ gap:5px; } .phoneNumber a{ width:34px; height:34px } .bookAppointment a{ width:34px; height:34px } .mean-container .mean-nav{ margin-top:0 } .welcomeLeft:after{ display:none; } .logo{ width:170px } .innerbannerContent h2{ font-size:40px } .innerbannerContent{ padding:0 } .g-5, .gy-5{--bs-gutter-y: 1rem;} .treamentHolder h3{ padding:0; margin:0 } .pageContent h2{ font-size:30px; } .accordian-new h3{ font-weight:500; font-size:18px; } .blogTop{ padding:15px; flex-direction:column; justify-content:center; align-items:center; } .categotyDropdown select{ width:100% } .sortBy{ width:100%; } .categotyDropdown{ width:100% } .blogPostContent a h4{ margin:0 } .fixed .bookAppointment a { padding: inherit; } /*.mean-container a.meanmenu-reveal{background: transparent;margin-top:0;color:#fff } .mean-container a.meanmenu-reveal {background: transparent; } .mean-container a.meanmenu-reveal span {background: #fff; }*/ .halfBannerImage{ width:100% } .halfBannerCaption{ text-align:center; position: static; transform: translate(0); padding: 15px 0} .halfInnerBanner{ display:block; } .formGroup{ flex-wrap:wrap; gap:0 } .iconList{ margin:0 0 20px 0 } .blogSection{ padding:30px 0 } .categotyDropdown select{ background-size:24px 24px } .categotyDropdown{ margin:0 } .bannerCaption{ text-align:center; } .bannerCaption h1{ font-size:36px; text-align:center; } .mean-container .mean-nav { margin-top: 16px; } .meetTabContent{ display:block; } .meettabImage{ max-width:100%; margin:0 0 25px 0 } .vidPopup img{ height:280px; object-fit:cover; } .vidBtn{ left:15px; bottom:15px; } .vidBtn a{ font-size:24px; } .vidBtn a i{ font-size:35px; } .contentSlider .slick-prev{ bottom:-35px; right:inherit; left:0; } .contentSlider .slick-next{ bottom:-35px; right:0; left:inherit; } .treatmentSlider .contant-slider-holder{ padding:30px } .gallery-holder .more-link{ position:static; } .gallery-holder{ margin-top:0 } } /* End - Main Style */ .banner { position: relative; width: 100%; height: 100vh; /* Full viewport height */ background: var(--main-clr); overflow: hidden; } /* Video container */ .bannerImage { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 0; overflow: hidden; } /* Video container */ .innerBanner .bannerImage { position: unset; width: 100%; min-height: 300px; max-height: 566px; height: 556px; } .innerBanner .bannerImage img { width: 100%; min-height: 100%; object-fit: cover; } .bannerImage .videoWrapper { position: absolute; top: 50%; left: 50%; width: 177.77vh; /* Maintains 16:9 aspect ratio */ height: 100vh; transform: translate(-50%, -50%); pointer-events: none; } /* Fallback for image if video isn't available */ .bannerImage img { width: 100%; height: 100%; object-fit: cover; } /* YouTube iframe */ .bannerImage iframe { border: 0; } /* Content over the video */ .bannerCaption { position: absolute; top: 50%; left: 0; width: 100%; transform: translateY(-50%); z-index: 2; padding: 0 2rem; color: white; } .bannerCaption h2 { font-weight: 900; font-size: 24px; letter-spacing: 0.2rem; text-transform: uppercase; font-family: var(--bodyfont); color: #fff; } .bannerCaption h1 { font-size: 70px; padding-bottom: 30px; letter-spacing: -0.025rem; font-weight: 300; color: #fff; } .bannerCaption h1 span { font-weight: 500; } /* Optional overlay for contrast */ .banner::after { content: ''; position: absolute; left: 0; top: 0; width: 50%; height: 100%; background: rgba(0, 0, 0, 0.5); z-index: 1; } @media (max-width: 768px) { .banner { height: 59vh; max-height: 502px; min-height: 0; } .bannerImage .videoWrapper { width: 177.77vh; height: 190px; } .bannerImage iframe { width: 100%; /* height: 100%; */ position: absolute; top: -30px; left: 50%; transform: translate(-50%, -50%); } .bannerCaption h1 { font-size: 36px; } .bannerCaption h2 { font-size: 16px; } .banner::after { width: 100%;} }