/*@charset "utf-8"; /* DETAILS ================================================== Theme Name: Magical Moments ABA - Home ================================================== */ /*..............embedded fonts..............*/ /* font-family: "Montserrat", sans-serif; */ /* Google Fonts now enqueued in functions.php */ /*..............embedded fonts..............*/ /*..............custom fonts..............*/ @font-face { font-family: 'Nighty'; src: url('../fonts/Nighty.eot'); src: url('../fonts/Nighty.eot?#iefix') format('embedded-opentype'), url('../fonts/Nighty.woff2') format('woff2'), url('../fonts/Nighty.woff') format('woff'), url('../fonts/Nighty.ttf') format('truetype'), url('../fonts/Nighty.svg#Nighty') format('svg'); font-weight: normal; font-style: normal; font-display: swap; } :root { --primary-font: "Nighty"; --secondary-font: "Nunito Sans", sans-serif; --tertiary-font: "Poppins", sans-serif; --transition-common: all 0.5s ease; } /*..............custom fonts..............*/ /*..............common styles..............*/ /* body { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } */ html { overflow-x: hidden; scroll-padding-top: 100px;} /* body { margin: 0; padding: 0; font-family: var(--secondary-font); font-size: clamp(1rem, 0.885rem + 0.308vw, 1.25rem); font-weight: 400; color:#333333; overflow-x: hidden; background: #DEF3FF; } */ body { margin: 0; padding: 0; font-family: var(--secondary-font); font-size: clamp(1rem, 0.885rem + 0.308vw, 1.25rem); font-weight: 400; color:#333333; overflow-x: hidden; background: #CCEFFF; } h1, h2, h3, h4, h5, h6 { font-weight: 400; margin:0 0 24px; padding:0; color: #333333; font-family: var(--primary-font); line-height: .8; letter-spacing: 0.01px;} h1{ font-size: clamp(3.125rem, 2.1154rem + 4.4872vw, 7.5rem); /* 120px 50px*/ } h2{ font-size: clamp(2.5rem, 1.9231rem + 2.5641vw, 5rem); /* 80px 40px*/ } h3{ font-size: clamp(1.875rem, 1.3846rem + 2.1795vw, 4rem); /* 64px 30px*/ } h4{ font-size: clamp(1.75rem, 1.4615rem + 1.2821vw, 3rem); /* 48px 28px*/ } h5{ font-size: clamp(1.25rem, 1.135rem + 0.308vw, 1.5rem); /* 24px */ } h6{ font-size: clamp(1rem, 0.885rem + 0.308vw, 1.25rem) /* 20px */ } p{ margin:0 0 24px; line-height: 1.4; } p:last-child { margin-bottom: 0; } img{ max-width: 100%; user-select: none; -webkit-user-drag: none; height: auto;} figure { margin: 0; } a, img{ border:0; text-decoration: none; outline: none;} a, a:link, a:visited, a:focus, a:hover { color: #FF1654; outline: none; text-decoration: none; transition:all 0.3s ease 0s;} a:hover{ text-decoration:none;} input, textarea, select, .form-control { font-family: var(--secondary-font); font-weight: 400; outline: none; background: #FFFFFF1A !important; font-size: clamp(1rem, 0.942rem + 0.154vw, 1.125rem) !important; color: #ffffff !important; } input[type="submit"]{font-family: var(--secondary-font); font-weight: 300; transition:all 0.3s ease 0s; outline: none; backdrop-filter: blur(15px) } input:not([type="submit"]) { height: 56px !important;} select, .form-select { appearance: none; -webkit-appearance: none; height: 56px !important; padding-right: 40px !important; background-image: url(../images/btm-arrow.svg); background-repeat: no-repeat; background-position: center right 20px; background-size: 20px; font-weight: 300; font-size: 16px !important; padding: 10px 20px; color: #ffffff !important; border: 1px solid #FFFFFF33 !important; border-radius: 12px; outline: none; box-shadow: none !important; } input.form-control, textarea.form-control, select.form-control { box-shadow: none !important; resize: none; padding: 15px 20px !important; border: 1px solid #FFFFFF33 !important; background: #FFFFFF1A; } textarea.form-control{ height: 120px !important; } input.form-control, select.form-control { border-radius: 12px; } select.form-control option, select option { color: #000 !important; } textarea.form-control { border-radius: 12px; } form label { transition: all 0.4s; } .form-floating>label { background-color: #ffffff; padding: 0 6px; font-family: var(--secondary-font); font-weight: 400; color: #ffffff; line-height: 1; height: auto; transform: scale(1) translateY(20px) translateX(14px); transition: all 0.4s; background: transparent; overflow: initial; font-size: 16px; } input[type="checkbox"] { width: 18px; height: 18px !important; border: 1px solid #FF1654 !important; border-radius: 3px !important; } label.form-check-label { font-size: clamp(0.875rem, 0.76rem + 0.308vw, 1.125rem); margin-bottom: 0 !important; } .form-check-input:checked[type=checkbox] { background-color: #FF1654 !important; } ::placeholder { color: #ffffff !important; opacity: 1; display: none; } ::-ms-input-placeholder { color: #ffffff !important; display: none; } textarea.form-control::placeholder { color: #ffffff !important; display: none; } .form-floating>.form-control-plaintext~label, .form-floating>.form-control:focus~label, .form-floating>.form-control:not(:placeholder-shown)~label, .form-floating>.form-select~label { background-color: #6A4C93; transform: translateY(-11px) translateX(14px); height: auto; line-height: 1; font-size: 14px; color: #ffffff; padding: 3px 10px; border-radius: 20px; border: 1px solid #FFFFFF33; } .contact-page-section .form-floating>.form-control-plaintext~label, .contact-page-section .form-floating>.form-control:focus~label, .contact-page-section .form-floating>.form-control:not(:placeholder-shown)~label, .contact-page-section .form-floating>.form-select~label { background-color: #ffffff; } .form-floating>.form-control-plaintext~label::after, .form-floating>.form-control:focus~label::after, .form-floating>.form-control:not(:placeholder-shown)~label::after, .form-floating>.form-select~label::after { padding: 0 !important; display: none; } /*CF7*/ form .labelanime label { background-color: #6A4C93; transform: translateY(-11px) translateX(14px); height: auto; line-height: 1; font-size: 14px; color: #ffffff; padding: 3px 10px; border-radius: 20px; border: 1px solid #FFFFFF33; } .contact-page-section form .labelanime label { background-color: #ffffff; } .contact-form-wrap .form-floating>label { color: #7F7C75; } .contact-form-wrap form .labelanime label { transform: translateY(-11px) translateX(14px); background-color: #FFF; color: #525252; padding: 3px 5px; border: 1px solid #ffffff00; } /* span.wpcf7-spinner.spinner-border.spinner-border-sm.ajax-loader { position: absolute; top: 20px; left: -13px; bottom: 41%; width: 15px; min-width: 15px; height: 15px; z-index: 2; max-height: 20px; max-width: 20px; border: 1px solid #ffffff; opacity: 1 !important; background-color: transparent !important; border-right-color: #00000000 !important; display: unset; transform: unset; } span.wpcf7-spinner.spinner-border.spinner-border-sm.ajax-loader::before{display: none;} */ .wpcf7-not-valid-tip { color: #ff6565; font-size: .7em; font-weight: normal; display: block; } /* --- CF7 acceptance / SMS opt-in checkbox --- */ .wpcf7-acceptance .wpcf7-list-item { display: block; margin: 0; } .wpcf7-acceptance .wpcf7-list-item label { display: flex; align-items: flex-start; gap: 12px; margin: 0; cursor: pointer; font-family: var(--secondary-font); } .wpcf7-acceptance input[type="checkbox"] { appearance: none; -webkit-appearance: none; flex: 0 0 auto; width: 22px !important; height: 22px !important; margin: 0; padding: 0; background: #FFF !important; border: 1px solid #D8D8D8 !important; border-radius: 5px !important; cursor: pointer; transition: var(--transition-common); } .wpcf7-acceptance input[type="checkbox"]:hover { border-color: #FF1654 !important; } .wpcf7-acceptance input[type="checkbox"]:checked { background-color: #FF1654 !important; border-color: #FF1654 !important; background-image: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='13'%20height='13'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='%23ffffff'%20stroke-width='3'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpolyline%20points='20%206%209%2017%204%2012'%3E%3C/polyline%3E%3C/svg%3E") !important; background-repeat: no-repeat !important; background-position: center !important; background-size: 13px !important; } .wpcf7-acceptance .wpcf7-list-item-label { color: #525252; font-family: var(--secondary-font); font-weight: 400; font-size: clamp(0.875rem, 0.76rem + 0.308vw, 1rem); line-height: 1.45; } /* --- CF7 acceptance / SMS opt-in checkbox --- */ /* --- only use for wordpress (Image alignment) --- */ .alignleft , .alignnone{float:left; margin:0 15px 10px 0;} .alignright{float:right; margin:0 0 10px 15px;} .aligncenter{margin:10px auto; display:block;} /* --- only use for wordpress (Image alignment) --- */ /* --- Button Styles --- */ .btn { justify-content: space-between; font-family: var(--secondary-font); overflow: hidden; position: relative; z-index: 1; transition: all 0.6s ease; -webkit-transition: all 0.6s ease; -moz-transition: all 0.6s ease; -ms-transition: all 0.6s ease; -o-transition: all 0.6s ease; display: inline-flex; align-items: center; vertical-align: top; color: #fff !important; font-size: clamp(1rem, 0.911rem + 0.238vw, 1.125rem); line-height: 1.2; border-radius: 60px; font-weight: 600; border: none !important; background-color: #1982C4 !important; justify-content: center; padding: 0; height: 56px; padding: 16px 18px 16px 40px; transform: translateZ(0) !important; backface-visibility: hidden;} .btn::before { width: calc(100% - 50px); height: 100%; content: ""; position: absolute; left: 0; border-radius: 0 60px 60px 0; background-color: #00A6FB; z-index: -1; transition: all 1s ease; -webkit-transition: all 1s ease; -moz-transition: all 1s ease; -ms-transition: all 1s ease; -o-transition: all 1s ease; } .btn::after { content: ''; position: relative; width: 20px; height: 20px; background: url(../images/arrow.svg ); background-size: contain; background-repeat: no-repeat; background-position: center; margin-left: 52px; transition: all 0.6s ease; -webkit-transition: all 0.6s ease; -moz-transition: all 0.6s ease; -ms-transition: all 0.6s ease; -o-transition: all 0.6s ease;} .btn:hover, .btn:first-child:active { transform: translate(0px, 0px); transition: all 0.6s ease; -webkit-transition: all 0.6s ease; -moz-transition: all 0.6s ease; -ms-transition: all 0.6s ease; -o-transition: all 0.6s ease; color: #FFF !important; } .btn:hover::before, .btn:first-child:active::before { left: -105%; } .btn:hover::after, .btn:first-child:active::after { transform: translate(-20px, 0px) rotate(180deg); } .btn.btn-purple { background-color: #6A4C93 !important; } .btn.btn-purple::before { background-color: #7678ED; } .btn-orange { background-color: #D85700 !important; } .btn-orange::before { background-color: #FF6700; } .btn-green { background-color: #78A72E !important; } .btn-green::before { background-color: #8AC926; } .btn-red { background-color: #A11037 !important; } .btn-red::before { background-color: #FF1654; } .btn input { position: absolute; /* visibility: hidden; */ opacity: 0; width: 100%; height: 100%; border-radius: 50px; left: 0; border: none; } .btn.btn-white { background-color: #6A4C93 !important; color: #3A235E !important; font-weight: 600; } .btn.btn-white::before { background-color: #FFF; } .btn.btn-white:hover { color: #FFF !important; } .btn.btn-white::after { position: absolute; right: 18px; } .footer-top .btn.btn-purple { color: #3A235E !important; font-weight: 600; width: 100%; } .footer-top .btn.btn-purple::before { background-color: #FFF; } .footer-top .btn.btn-purple:hover { color: #FFF !important; } .footer-top .btn.btn-purple::after { position: absolute; right: 18px; } /* --- Button Styles --- */ /* --- checkbox and radio button Styles --- */ .builder_radiobox ul li label{ font-weight: normal;} .builder_radiobox ul li input[type="radio"]{ opacity: 0;} .builder_radiobox ul li input[type="radio"]:empty ~ label{ position:relative; float:left; cursor:pointer; -webkit-user-select:none; -moz-user-select:none; -ms-user-select:none; user-select:none; padding: 0 0 0 22px;} .builder_radiobox ul li input[type="radio"]:empty ~ label:before{ position:absolute; display:block; top:2px; bottom:0; left:0; content:""; width:16px; height:16px; background:url(../images/radiobutton.png) left top no-repeat;} .builder_radiobox ul li input[type="radio"]:checked ~ label:before{ background:url(../images/radiobutton.png) left bottom no-repeat;} /* --- checkbox and radio button Styles --- */ /*..............common styles..............*/ .common-padd { padding-top: 100px; padding-bottom: 100px; } .common-padd-bottom { padding-bottom: 100px; } .common-padd-top { padding-top: 100px; } .mt-30 { margin-top: 30px; } .mt-40 { margin-top: 40px; } .mt-50 { margin-top: 50px; } .mb-16 { margin-bottom: 16px; } .mb-24 { margin-bottom: 24px; } .mb-30 { margin-bottom: 30px; } .mb-40 { margin-bottom: 40px; } .mb-50 { margin-bottom: 50px; } .p-relative { position: relative; } .p-absolute { position: absolute; } .grecaptcha-badge { visibility: hidden; } /*..............common styles..............*/ /*-----scroll-bar-design----------*/ /* width */ ::-webkit-scrollbar {width: 6px; height: 4px; } /* Track */ ::-webkit-scrollbar-track {box-shadow: inset 0 0 2px #FF1654; } /* Handle */ ::-webkit-scrollbar-thumb {background: #FF1654; border-radius: 10px; } /*-----scroll-bar-design----------*/ /*-----Header design----------*/ .main-header { padding: 20px 0; z-index: 999; width: 100%; left: 50%; transform: translateX(-50%); position: fixed; -webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -ms-transition: all 0.4s ease; -o-transition: all 0.4s ease; transition: all 0.4s ease; top: 0; } .main-header .main-menu { margin-right: 40px; } .manu-part, .main-menu { flex: 1;} .header-row { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; -webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -ms-transition: all 0.4s ease; -o-transition: all 0.4s ease; transition: all 0.4s ease; } .main-menu ul { margin: 0; padding: 0; list-style: none; display: flex; flex-wrap: wrap; align-items: center; gap: 20px; } .main-menu ul li:not(:last-child) { margin-right: 0; } .main-menu ul li a { display: block; color: #424242; font-size: clamp(1rem, 0.885rem + 0.308vw, 1.25rem); position: relative; -webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -ms-transition: all 0.4s ease; -o-transition: all 0.4s ease; transition: all 0.4s ease; font-family: var(--secondary-font); } .main-menu > ul > li.current-menu-item > a { color: #6A4C93; font-weight: 700;} /* .main-menu ul li ul.sub-menu li a::before{ opacity: 0; content: ""; width: 0%; height: 1px; position: absolute; bottom: 7px; border-radius: 10px;-webkit-transition: all 0.4s ease ; -moz-transition :all .4s ease ; -ms-transition :all .4s ease ; -o-transition :all .4s ease ; transition :all .4s ease;} */ .main-menu ul li.menu-item-has-children a { opacity: 1; content: ""; width: 100%; } .main-menu > ul > li:hover > a{ color: #6A4C93;} .main-menu > ul > li:hover > a::before, .main-menu ul li.menu-item.current-menu-item > a::before { transform: scale(1); opacity: 1; } .main-menu ul li span {margin-left: 10px; } .main-header.relative_header {background-color: #000000; } .main-menu { position: relative; } .lava-lamp { position: absolute; top: 0; bottom: 0; height: 42px; background: #E5D8F6; border-radius: 50px; opacity: 0; transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1); pointer-events: none; transform: scaleX(1.2); margin: auto 0; } .lava-lamp.active { opacity: 1; } /*------css for new dropdown sub-menu start--------*/ .main-menu ul li.menu-item-has-children a:after { -webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -ms-transition: all 0.4s ease; -o-transition: all 0.4s ease; transition: all 0.4s ease; content: ""; position: absolute; top: 40%; box-sizing: border-box; height: 8px; width: 8px; border-style: solid; border-color: #353132; border-width: 0px 1px 1px 0px; transform: rotate(45deg) translate(0, -50%); transition: border-width 150ms ease-in-out; -webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -ms-transition: all 0.4s ease; -o-transition: all 0.4s ease; transition: all 0.4s ease; right: 6px; margin: 0 auto; } .main-menu ul li.menu-item-has-children:hover a:after {-webkit-transition: all 0.4s ease;-moz-transition: all 0.4s ease;-ms-transition: all 0.4s ease;-o-transition: all 0.4s ease;transition: all 0.4s ease; border-color: #FF1654; } .main-menu ul li.current-menu-item.menu-item-has-children > a::after { border-color: #FF1654; } .main-menu ul li.menu-item-has-children a {padding-right: 20px; } .main-menu ul.sub-menu li a:after{display: none!important;} .main-menu ul{margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline;} .main-menu ul li { display: flex; justify-content: center; align-items: center; position: relative; perspective: 1000px; z-index: 100; color: #FFFFFF; -webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -ms-transition: all 0.4s ease; -o-transition: all 0.4s ease; transition: all 0.4s ease; z-index: 0; } .main-menu ul.sub-menu { position: absolute; width: 250px; display: block; margin-top: 0; padding: 6px 20px; border-radius: 10px; box-shadow: 0 15px 12px #0000005e; overflow: hidden; -webkit-transition: all .4s ease; -moz-transition: all .4s ease; -ms-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease } .main-menu ul.sub-menu li { margin: 0!important; padding: 0 } .main-header .header-wrap ul li .sub-menu li a { color: #424242; padding: 13px 16px; border-radius: 8px; background-color: transparent; transition: var(--transition-common);} .main-header .header-wrap ul li .sub-menu li a::before{ display: block !important; content: ""; position: absolute; z-index: 1; top: 0; bottom: 0; left: -2px; margin: auto 0; width: 4px; height: 0; background: #6A4C93; border-radius: 50px; pointer-events: none; -webkit-transition: var(--transition-common); -moz-transition: var(--transition-common); -ms-transition: var(--transition-common); -o-transition: var(--transition-common); transition: var(--transition-common);} .main-header .header-wrap ul li .sub-menu li a::after { display: block !important; content: ""; position: absolute; z-index: 1; top: 0; bottom: 0; right: -2px; margin: auto 0; width: 4px; height: 0; background: #6A4C93; border: 0 !important; transform: none !important; border-radius: 50px; pointer-events: none; -webkit-transition: var(--transition-common); -moz-transition: var(--transition-common); -ms-transition: var(--transition-common); -o-transition: var(--transition-common); transition: var(--transition-common); } .main-menu ul li.out .sub-menu { opacity: 0; transform: scaleY(0) translateZ(0); visibility: hidden; } .main-menu ul li.menu-item-has-children { z-index: 1; } .main-header .header-wrap ul li .sub-menu li a:hover { background-color: #E5D8F6; color: #6A4C93; box-shadow: none; font-weight: 700; } .main-header .header-wrap ul li .sub-menu li a:hover::before, .main-header .header-wrap ul li .sub-menu li a:hover::after{ height: calc(100% - 24px);} header .main-menu ul>li { position: relative; cursor: pointer; padding: 20px 10px; } header .main-menu ul .sub-menu { background: #FFFFFF; position: absolute; left: 0; top: 100%; transform-origin: 50% 0; transform: scaleY(0) translateZ(0); opacity: 0; transition: transform 0.3s, opacity 0.3s; width: 236px; overflow: hidden; padding: 8px; box-shadow: 0px 5px 20px 0px #00000014; opacity: 1; visibility: hidden; display: unset } header .main-menu ul .sub-menu li { display: block; position: relative; cursor: pointer; background-color: #FFFFFF; -webkit-transition: all .8s ease; -moz-transition: all .8s ease; -ms-transition: all .8s ease; -o-transition: all .8s ease; transition: all .8s ease; } .main-header .header-wrap ul li .sub-menu li::before{ content: ""; background-image: url(../images/submenu-icon.svg); background-size: 35px !important; background-repeat: no-repeat !important; background-position: center !important; position: absolute; z-index: 1; top: 0; right: 16px; bottom: 0; margin: auto 0; width: 35px; height: 32px; pointer-events: none; opacity: 0; transition: var(--transition-common);} header .main-menu ul .sub-menu li:not(:last-child) { margin-bottom: 2px !important;} .main-header .header-wrap ul li .sub-menu li:hover::before{ opacity: 1;} /* header .main-menu ul li ul::before {content: ""; width: 100%; height: 100%; position: absolute; top: -12px; left: 0; background-color: #FF1654; } */ header .main-menu ul li:hover ul { box-shadow: 0px 4px 10px 0px #00000014;opacity: 1; transform: scaleY(1) translateZ(0); visibility: visible; display: unset; transition: transform 0.3s, opacity 0.3s ease-out; } /*------css for new dropdown sub-menu end--------*/ .main-header .logo { transform: scale(1); transform-origin: left center; max-width: 230px; -webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -ms-transition: all 0.4s ease; -o-transition: all 0.4s ease; transition: all 0.4s ease; } .main-header.fixed .logo { -webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -ms-transition: all 0.4s ease; -o-transition: all 0.4s ease; transition: all 0.4s ease; max-width: 150px;} .nav_btn { color: #FFFFFF; font-size: 22px; text-align: right; display: none; } .nav_close { display: none; color: #FFFFFF; } .main-header.fixed { padding: 10px 0; position: fixed; width: 100%; box-shadow: 0 0 12px rgb(0 0 0 / 12%); transition: all 0.4s; -ms-transition: all 0.4s; -webkit-transition: all 0.4s; background: #def3ffe3; backdrop-filter: blur(6px); } .main-header.fixed .header-wrap { border-radius: 0; max-width: 100%; width: 100%; } /*==========mobile menu=========*/ .main-header .hdr-rt { display: flex; align-items: center; justify-content: flex-end; } .main-header .hdr-rt.hdr-lt { gap: 50px; justify-content: flex-end; } .main-header .user-sec {margin-left: 100px;display: flex;align-items: center; } .menu-has-children.menu-has-children-open span img {transform: rotate(180deg);-webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -ms-transition: all 0.4s ease; -o-transition: all 0.4s ease; transition: all 0.4s ease;} .menu-has-children span img {transform: rotate(0deg); -webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -ms-transition: all 0.4s ease; -o-transition: all 0.4s ease; transition: all 0.4s ease; } .mobile-menu-container ul.sub-menu {position: relative; max-height: 0; overflow: hidden; transition: max-height 0.6s ease-out;} .mobile-menu-container ul.sub-menu.sub-menu-open {transform: scaleY(1); max-height: 300px;} /* ~~~~~~~~~~ mobile menu styling ~~~~~~~~~~ */ .mobile-menu-container{ position: fixed; z-index: 1; top: -100vh; left: 0; right: 0; background: #CCEFFF; height: calc(100vh + 40px); opacity: 0; -webkit-transition: all .35s ease-in-out; -moz-transition: all .35s ease-in-out; -o-transition: all .35s ease-in-out; transition: all .35s ease-in-out; display: none; z-index: -1;} .mobile-menu-open .mobile-menu-container{ top: 0; transform: translateY(0); opacity: 1;} .mobile-menu-open .mobile-menu-container { top: -40px; transform: translateY(0); opacity: 1; } .mobile-menu-container .inner-container{ padding-top: 160px; height: 100vh; height: 100svh; overflow-y: auto; position: relative;} .mobile-menu { max-width: 100%; padding-left: 24px; padding-right: 24px; padding-top: 0px; padding-bottom: 50px; margin: 0 auto; text-align: center; position: relative; z-index: 5;} .mobile-menu ul{ margin: 0; padding: 0; list-style: none;} .mobile-menu ul li{ display: block; padding-top: 8px; margin-top: 8px;} .mobile-menu ul li a { display: block; font-size: 30px; color: #00A6FB; padding: 4px 0; } .mobile-menu > ul > li { border-top: 1px solid #0089D133; } .mobile-menu > ul > li:first-child{ border-color: transparent;} .mobile-menu ul li.menu-item-has-children > a{padding-right: 15px;} /* ===== mobile menu animation ===== */ .mobile-menu ul li{opacity: 0;-webkit-transform: translateX(-150px);transform: translateX(-150px);-webkit-transition: -webkit-transform 0.4s, opacity 0.4s;transition: transform 0.4s, opacity 0.4s;} .mobile-menu-open .mobile-menu ul li {opacity: 1;-webkit-transform: translateX(0);transform: translateX(0);} .mobile-menu-open .mobile-menu ul li:nth-child(1) {-webkit-transition-delay: 0.16s;transition-delay: 0.16s;} .mobile-menu-open .mobile-menu ul li:nth-child(2) {-webkit-transition-delay: 0.24s;transition-delay: 0.24s;} .mobile-menu-open .mobile-menu ul li:nth-child(3) {-webkit-transition-delay: 0.32s;transition-delay: 0.32s;} .mobile-menu-open .mobile-menu ul li:nth-child(4) {-webkit-transition-delay: 0.40s;transition-delay: 0.40s;} .mobile-menu-open .mobile-menu ul li:nth-child(5) {-webkit-transition-delay: 0.48s;transition-delay: 0.48s;} .mobile-menu-open .mobile-menu ul li:nth-child(6) {-webkit-transition-delay: 0.54s;transition-delay: 0.54s;} /* ===== mobile menu animation ===== */ .mobile-menu-open .mobile-menu ul li.btn { margin: 0 auto; padding: 5px 5px; max-width: 150px;} .mobile-menu-open .mobile-menu ul li.btn a{color: #FFFFFF;} /*=========mobile menu===========*/ /*for header css*/ /* ~~~~~~~~~~ hamburger menu styling ~~~~~~~~~~ */ .hamburger-nav{ display: none; } /*when turns close icon*/ .ham { cursor: pointer; -webkit-tap-highlight-color: transparent; transition: transform 400ms; -moz-user-select: none; -webkit-user-select: none; -ms-user-select: none; user-select: none; } .hamRotate.active { transform: rotate(45deg); } .hamRotate180.active { transform: rotate(180deg); } .line { fill:none; transition: stroke-dasharray 400ms, stroke-dashoffset 400ms; stroke:#704790; stroke-width:3.5; stroke-linecap:round; } .ham6 .top { stroke-dasharray: 41 172; } .ham6 .middle { stroke-dasharray: 41 111; transform: translateX(1px); } .ham6 .bottom { stroke-dasharray: 41 172; transform: translateX(1px);} .ham6.active .top { stroke-dashoffset: -132px; } .ham6.active .middle { stroke-dashoffset: -71px; } .ham6.active .bottom { stroke-dashoffset: -132px; } /*when turns close icon*/ /* ~~~~~~~~~~ hamburger menu styling ~~~~~~~~~~ */ .mobile-menu-container .bg-image { right: 0; bottom: -5%; max-width: 50%; width: 100%; pointer-events: none; } .mobile-menu-container .bg-image img{ display: block; width: 100%;} .mobile-menu-container .site-line { max-width: 60%; bottom: 10px; width: 100%; pointer-events: none; } .mobile-menu-container .site-line .site-dot-line { width: 100%; opacity: 0.5;} .mobile-menu-container .site-line .star4 { width: 8vw; bottom: auto; top: -15px; transform: scale(0); } .mobile-menu-open .mobile-menu-container .site-line .star4 { transform: scale(1); } /*-------------------------------{[[[[[[[[| 0 || 0 |]]]]]]]]}-------------------------------*/ /*---------------------------{[[[[[[[[[[[[| < || > |]]]]]]]]]]]]}---------------------------*/ /*-------------------------------{[[[[[[[[| 0 || 0 |]]]]]]]]}-------------------------------*/ /*===== Home page start ====*/ /* Home Banner */ .top-cloud, .top-cloud img { width: 100%; min-height: 100vh; object-fit: cover; } .banner { min-height: 100vh; min-height: 100svh; padding-top: 210px; padding-bottom: 100px; position: relative; display: flex; z-index: 1; } .top-cloud::before { content: ""; position: absolute; left: 0; right: 0; bottom: 0; background: linear-gradient( to top, #CCEFFF 0%, #CCEFFF 40%, rgba(204, 239, 255, 0) 100% ); width: 100%; height: 80px; } .banner .container{ position: relative; z-index: 5;} .text-box h1 { line-height: .9; } .text-box p { max-width: 1175px; margin: 0 auto 24px; } .child-row { margin: 84px 0 72px; } .child-row .banner-child { height: 100%; background: #FFF; border-radius: 350px; overflow: hidden; display: flex; align-items: flex-end; position: relative; } .child-row .banner-child img { width: 100%; height: 95%; object-fit: cover; object-position: top center; } .child-row .child-inner { height: 100%; } .child-row .child-inner { position: relative; } .child-row .child-inner::before { content: ''; position: absolute; top: -7px; left: -12px; right: 12px; bottom: -7px; border: 2px solid #000; border-radius: 360px; } .child-row .col-lg-3:nth-child(odd) { transform: translate(0, 60px); } .child-row .col-lg-3:nth-child(odd) .tape { transform: translate(-50%, 0) rotateY(0deg); } .child-row .col-lg-3:nth-child(1) .banner-child { background-color: #FF6700; } .child-row .col-lg-3:nth-child(1) .child-inner::before { border-color: #FF6700; } .child-row .col-lg-3:nth-child(2) .banner-child { background-color: #7678ED; } .child-row .col-lg-3:nth-child(2) .child-inner::before { border-color: #7678ED; } .child-row .col-lg-3:nth-child(3) .banner-child { background-color: #FF1654; } .child-row .col-lg-3:nth-child(3) .child-inner::before { border-color: #FF1654; } .child-row .col-lg-3:nth-child(4) .banner-child { background-color: #8AC926; } .child-row .col-lg-3:nth-child(4) .child-inner::before { border-color: #8AC926; } .tape { position: absolute; top: -53px; left: 50%; z-index: 2; transform: translate(-50%, 0) rotateY(180deg); } .ban-arrow { top: 280px; right: 14px; max-width: 26vw; } .cloud-wrap { position: absolute; bottom: 100px; display: flex; z-index: 2; gap: 0; animation: scroll 70s linear infinite; } .cloud-wrap img { width: 100vw; position: relative; margin-left: -100px;} /* Home Banner */ /* insurances section start */ .insurances-section { padding-bottom: 200px; } .marquee { display: flex; overflow: hidden; user-select: none; gap: 10px; } .marquee__group { flex-shrink: 0; display: flex; align-items: center; justify-content: space-between; gap: 10px; min-width: auto; animation: scroll 70s linear infinite reverse; } /* .marquee__group span { border-radius: 10px; padding: 24px 26px; transition: all 0.3s ease; background: #FFFFFF; height: inherit; min-width: 168px; display: flex; align-items: center; justify-content: center; border: 1px solid #FFCADB; box-shadow: 0px -5px 0px 0px #FFCADB inset; } */ .marquee__group span { background-image: url(../images/logo-bg.svg); background-position: center; background-size: 100% 100%; background-repeat: no-repeat; text-align: center; padding: 25px 39px; } .marquee__group span img { mix-blend-mode: darken; height: 30px; max-width: 120px; object-fit: contain; } .marquee__group.rev { animation: scroll 70s linear infinite; } .insurances-logos-wrap { gap: 10px; display: flex; flex-direction: column; } .insurances-logos-wrap::after { content: ''; position: absolute; background: linear-gradient(90deg, rgb(204 239 255) 0%, rgb(204 239 255 / 65%) 12.65%, #ffffff00 35.42%, #ffffff00 65.78%, rgb(204 239 255 / 65%) 84.68%, rgb(204 239 255) 100%); top: 0; bottom: 0; left: 0; right: 0; pointer-events: none; } @keyframes scroll { from { transform: translateX(0); } to { transform: translateX(calc(-100% - 2rem)); } } /* insurances section start */ /* Together Section */ .together-section { padding-bottom: 130px; } .together-img-box { -webkit-mask-image: url(../images/vector6.svg); mask-image: url(../images/vector6.svg); -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; -webkit-mask-size: 100%; mask-size: 100%; -webkit-mask-position: top; mask-position: top; background: transparent; width: calc(100% + 48px); margin: 0 0 0 -48px; } .together-img-box figure { position: relative; overflow: inherit; padding: 0 0 103%; } .together-img-box figure img { position: absolute; top: 0; bottom: 0; left: 0; right: 0; height: 100%; width: 100%; object-fit: cover; object-position: bottom; } .together-icon1 { width: calc(100% + 23px); right: 13px; top: 0; z-index: -1; } .together-icon1 img { width: 100%; } .together-icon2 { width: calc(100% + 30px); right: -4px; top: -9px; } .together-icon2 img { width: 100%; } /* Together Section */ /* qute Section */ .bottom-qute-section { padding-bottom: 55px; } /* qute Section */ main { position: relative; } .bg-image1 { bottom: 0; right: 0; max-width: 36vw; pointer-events: none; } .bg-image2 { top: 0; left: 0; max-width: 39vw; } .bg-image3 { bottom: -3.9vw; right: 0px; z-index: -1; max-width: 30vw; } .site-line1 { width: 90%; max-width: 1620px; bottom: -80px; left: 52%; transform: translate(-50%, 0); pointer-events: none; } .site-line1 .site-dot-line { width: 100%; } .star1 { right: -10px; top: -0.5vw; width: 1.9vw; } .star2 { left: -14px; bottom: 124px; width: 3.9vw; } .star3 { right: 345px; bottom: 82px; width: 3.9vw; } .site-line2 { width: 90%; max-width: 1620px; top: -280px; left: 53.2%; transform: translate(-50%, 0); z-index: 1; pointer-events: none; } .star4 { right: 63%; width: 2.56vw; bottom: 62px; } .site-line3 { width: 90%; max-width: 1617px; bottom: 100px; left: 52%; transform: translate(-50%, 0); pointer-events: none; } .site-line3 .site-dot-line { width: 95%; } .star5 { left: 51%; width: 3.9vw; top: 20px; } .star6 { right: 45px; width: 3.9vw; top: 330px; } .site-line4 { width: 90%; max-width: 1570px; bottom: -64px; left: 55%; transform: translate(-50%, 0); pointer-events: none; } .site-line4 .site-dot-line { width: 75.3%; } .footer-bottom-image-adjustment .bg-image3 { bottom: -4vw;} /*===== Home page start ====*/ /* Footer Section */ .footer-shape { margin-bottom: -4px; z-index: 0; position: relative; width: 100%; } .footer-shape img.footer-shape-bottom { min-width: 100%; max-width: 100%; vertical-align: bottom;} .footer-shape img.footer-shape-small { position: absolute; bottom: 4.4vw; left: 3.9vw; max-width: 15vw; } .footer-shape .lottie-shape { position: absolute; bottom: 4.4vw; left: 3.9vw; max-width: 15vw; } footer { background: #6A4C93; } .footer-top { padding: 40px 0 80px; } footer #f-logo-img { max-width: 309px; margin: 0 0 48px -16px; } .foot-col h4 { color: #FFF; margin-bottom: 30px; } .foot-col h5 { color: #FFF; font-family: var(--secondary-font); font-weight: 600; margin: 0 0 16px; } footer ul.footer-menu { list-style: none; padding: 0; margin: 0; } footer ul.footer-menu li { line-height: 1.2; } footer ul.footer-menu li:not(:last-child) { margin-bottom: 16px; } footer ul.footer-menu li a { position: relative; color: #FFF; text-transform: capitalize; font-family: var(--secondary-font); font-weight: 400; background-image: linear-gradient(#cf303000 95%, #8AC926 0, #8AC926); background-position-y: bottom; background-repeat: no-repeat; background-size: 0 100%; text-decoration: none; transition: background-size .3s cubic-bezier(.79, .01, .22, .99) 0s, background-position 0s step-end .3s, color .3s; font-size: clamp(1rem, 0.942rem + 0.154vw, 1.125rem); } footer ul.footer-menu li a:hover { color: #8AC926; background-position-x: right; background-position-y: bottom; background-size: 100% 100%; } .ban-form h2 { font-size: clamp(1.75rem, 1.3462rem + 1.7949vw, 3.5rem); color: #FFF; margin-bottom: 40px; } .contact-list { padding: 0; margin-bottom: 32px; list-style: none; } .contact-list li { display: flex; align-items: center; } .contact-list li:not(:last-child) { margin-bottom: 16px; } .contact-list li .contact-icon img { filter: brightness(0) invert(1); transition: all 0.5s ease; width: auto; height: 23px;} .contact-list li:hover .contact-icon img { animation: bouncing 0.5s 0.3s; filter: brightness(1) invert(0); } .contact-list li:hover .contact-icon::after { transform: scale(0); } .contact-list li:hover .contact-dtls a { background-position-x: right; background-position-y: bottom; background-size: 100% 100%;} .contact-icon { width: 60px; height: 60px; display: flex; align-items: center; justify-content: center; padding: 10px; flex: 0 0 auto; margin-right: 16px; z-index: 1; position: relative; } .contact-icon:before { content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: linear-gradient(135.51deg, #CFF1FF 0%, #53C5FF 99.13%); border-radius: 17px; z-index: -1; } .contact-icon::after { content: ''; position: absolute; top: 2px; left: 2px; right: 2px; bottom: 2px; background: #6A4C93; border-radius: 15px; z-index: -1; transition: all .5s ease-in-out; } .contact-dtls label { display: block; color: #FFFFFF; font-weight: 600; font-size: clamp(1.125rem, 1.0385rem + 0.3846vw, 1.5rem); line-height: 1.4; } .contact-dtls a, .contact-dtls p { color: #FFF; } .contact-dtls a { background-image: linear-gradient(#cf303000 95%, #FFF 0, #FFF); background-position-y: bottom; background-repeat: no-repeat; background-size: 0 100%; text-decoration: none; transition: background-size .3s cubic-bezier(.79, .01, .22, .99) 0s, background-position 0s step-end .3s, color .3s; } @keyframes bouncing { from, to { transform: scale(1, 1); } 25% { transform: scale(0.9, 1.1); } 50% { transform: scale(1.1, 0.9); } 75% { transform: scale(0.95, 1.05); } } footer .btn.btn-purple { background-color: #3A235E !important; } footer .footer-media ul li { display: block; } footer .footer-media ul li:not(:first-child) { margin: 0 0 0 8px; } footer .footer-media ul li a { display: block; width: 40px; height: 40px; border: 1px solid #FFFFFF4D; background: #FFFFFF1A; border-radius: 50px; display: flex; justify-content: center; align-items: center; position: relative; z-index: 1; } footer .footer-media ul {padding: 0; margin: 0 0 20px; display: flex; list-style: none; } footer .footer-media ul li a::before {content: ""; width: 100%; height: 100%; position: absolute; background-color: #FFF; border-radius: 50px; z-index: -1; transform: scale(0); -webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -ms-transition: all 0.4s ease; -o-transition: all 0.4s ease; transition: all 0.4s ease; } footer .footer-media ul li a img{ filter: brightness(0) invert(1); -webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -ms-transition: all 0.4s ease; -o-transition: all 0.4s ease; transition: all 0.4s ease;} footer .footer-media ul li a:hover::before { transform: scale(1); -webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -ms-transition: all 0.4s ease; -o-transition: all 0.4s ease; transition: all 0.4s ease; } footer .footer-media ul li a:hover{ border-color:transparent; } footer .footer-media ul li a:hover img{filter: brightness(1) invert(0);-webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -ms-transition: all 0.4s ease; -o-transition: all 0.4s ease; transition: all 0.4s ease;} .end-footer .container { padding: 30px 0 40px; border-top: 1px solid #FFFFFF1A; } .end-footer .lft-box h6 { margin: 0; color: #E8DEFF; font-weight: 400; margin-bottom: 4px; font-size: clamp(1rem, 1rem + 0vw, 1rem); font-family: var(--secondary-font); line-height: 1; } .end-footer .lft-box p { margin: 0; font-size: 12px; color: #E8DEFF;} .end-footer .lft-box p a{ color: #E8DEFF; position: relative; background-image: linear-gradient(#cf303000 95%, #E8DEFF 0, #E8DEFF); background-position-y: bottom; background-repeat: no-repeat; background-size: 0 100%; text-decoration: none; transition: background-size .3s cubic-bezier(.79, .01, .22, .99) 0s, background-position 0s step-end .3s, color .3s; } .end-footer .lft-box p a:hover { background-position-x: right; background-position-y: bottom; background-size: 100% 100%; } .end-footer .right-box p { margin: 0; text-align: right; color: #E8DEFF; font-size: clamp(1rem, 1rem + 0vw, 1rem); } .end-footer .right-box p a {color: #E8DEFF; position: relative; background-image: linear-gradient(#cf303000 95%, #E8DEFF 0, #E8DEFF); background-position-y: bottom; background-repeat: no-repeat; background-size: 0 100%; text-decoration: none; transition: background-size .3s cubic-bezier(.79, .01, .22, .99) 0s, background-position 0s step-end .3s, color .3s; } .end-footer .right-box p a:hover { background-position-x: right; background-position-y: bottom; background-size: 100% 100%; } /* Footer Section */ /* ================== Page ==> About ================= */ .inner-banner { background-image: url(../images/inner-banner-2.png); background-repeat: no-repeat; background-position: center bottom; background-size: cover; min-height: 550px; padding-top: 230px; position: relative;} .inner-banner::before { content: ""; position: absolute; z-index: 3; left: 0; right: 0; bottom: -16px; background: linear-gradient(to top, #CCEFFF 0%, #CCEFFF 40%, rgba(204, 239, 255, 0) 100%); width: 100%; height: 80px; pointer-events: none; } .inner-banner .cloud-wrap { bottom: -10px; opacity: 0.5;} .inner-banner .container{ position: relative; z-index: 5 !important;} .breadcumb-wrap .breadcrumb { justify-content: center; align-items: center;} .breadcumb-wrap .breadcrumb a{ display: block;} .breadcumb-wrap li.breadcrumb-item.active { color: #333333; } .breadcumb-wrap .breadcrumb-item+.breadcrumb-item::before { padding-right: 16px; } .breadcumb-wrap .breadcrumb-item+.breadcrumb-item { padding-left: 16px; } .breadcumb-wrap .breadcrumb a:has(img) { line-height: 0; margin: -2px 0 0; } .approach-heading h2{margin-bottom: 50px;} .approach-text-box{background-image: url(../images/approach-cloud.svg) ; background-position: center; background-size: 100% 100%; background-repeat: no-repeat; text-align: center; padding: 67px 90px; margin-bottom: 38px;} .approach-text-box h2 { margin: 12px 0; } .curve-line { width: calc(100% + 39px); left: -58px; z-index: 1; top: -6px; } .approach-content { margin: 0 auto; max-width: 507px;} .approach-icon2 { width: 100%; left: -3px; top: -11px; } .approach-img-box{ -webkit-mask-image: url(../images/approach-vector.svg); mask-image: url(../images/approach-vector.svg); -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; -webkit-mask-size: 100%; mask-size: 100%; -webkit-mask-position: top; mask-position: top; background: #7DD3FF; } .approach-img-box figure { position: relative; overflow: inherit; padding: 0 0 141%; } .approach-img-box figure img { position: absolute; top: 0; bottom: 0; left: 0; right: 0; height: 100%; width: 100%; object-fit: cover; object-position: bottom; } .white-child-bg { position: absolute; width: calc(100% + 32px); margin-left: -57px; } .white-child-img { width: calc(100% + 57px); margin-left: -57px; -webkit-mask-image: url(../images/vector10.svg); mask-image: url(../images/vector10.svg); -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; -webkit-mask-size: 100%; mask-size: 100%; -webkit-mask-position: top; mask-position: top; padding: 0 10px; z-index: 5; } .white-child-img figure { position: relative; overflow: inherit; padding: 0 0 136%; } .white-child-img figure img { position: absolute; top: 0; bottom: 0; left: 5px; right: 0; height: 100%; width: 100%; object-fit: cover; object-position: top; } .app-line-1 { width: 7.86vw; position: absolute; top: 50px; left: -8vw; } .app-line-1 img { width: 100%; } .app-line2 { position: absolute; right: -141px; bottom: 4vw; max-width: 11vw; } .app-line2 img { width: 100%; } .children-sec { position: relative; z-index: 1; } .child-content .btn.btn-white::after{position: relative; right: 0;} .child-content .btn.btn-white { background-color: #6A4C93 !important;} .child-star { position: absolute; top: 9vw; z-index: 1; left: -10px; } .vector-line1 { position: absolute; right: 170px; top: 160px; max-width: 120px;} .vector-line2 { position: absolute; right: 87px; bottom: 55px; width: 5.4vw;} .children-sec-bottom { position: absolute; right: 0; bottom: -2px; left: 0; line-height: 0; transform: translateZ(0);} .children-sec-bottom img{ display: block; min-width: 100%; max-width: 101%; vertical-align: bottom;} .therapy-sec{position: relative;} .therapy-white-box { padding: 80px; background: #FFF; border-radius: 35px; border: 2px dashed #00A6FB; text-align: center; }.therapy-white-box { padding: 80px; background: #FFF; border-radius: 35px; border: 2px dashed #00A6FB; text-align: center; } .scene { position: relative; width: 80%; max-width: 852px; height: auto; margin: -10px auto 0; } .line-svg { position: absolute; top: 50%; left: 0; transform: translateY(-50%); width: 100%; height: 58px; } .pen-wrap { position: absolute; width: 120px; height: 120px; pointer-events: none; left: -31px; top: -69px; } .pen-wrap svg { width: 100%; height: 100%; } .purpose-img-box1 { position: relative; width: 100%; max-width: 336px; } .purpose-img-box1 .purpose-mask { -webkit-mask-image: url(../images/vs1.svg); mask-image: url(../images/vs1.svg); -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; -webkit-mask-size: 100%; mask-size: 100%; -webkit-mask-position: top; mask-position: top; background: #7DD3FF; width: 100%;} .purpose-img-box1 .purpose-mask figure { position: relative; overflow: inherit; padding: 0 0 93%; } .purpose-img-box1 .purpose-mask figure img { position: absolute; top: 0; bottom: 0; left: 0; right: 0; height: 100%; width: 100%; object-fit: cover; object-position: bottom; } .purpose-icon1 { width: 100%; left: -7px; top: -8px; } .purpose-icon1 img { width: 100%; } .purpose-img-box2 { position: relative; width: 100%; max-width: 427px; margin-left: -58px; } .purpose-img-box2 .purpose-mask { -webkit-mask-image: url(../images/vs2.svg); mask-image: url(../images/vs2.svg); -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; -webkit-mask-size: 100%; mask-size: 100%; -webkit-mask-position: top; mask-position: top; background: #7DD3FF; width: 100%; } .purpose-img-box2 .purpose-mask figure { position: relative; overflow: inherit; padding: 0 0 93%; } .purpose-img-box2 .purpose-mask figure img { position: absolute; top: 0; bottom: 0; left: 0; right: 0; height: 100%; width: 100%; object-fit: cover; object-position: bottom; } .purpose-icon2 { width: calc(100% + 9px); left: -12px; top: -6px; } .purpose-icon2 img { width: 100%; } .purpose-img-box3 { position: relative; width: 100%; } .purpose-img-box3 .purpose-mask { -webkit-mask-image: url(../images/vs3.svg); mask-image: url(../images/vs3.svg); -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; -webkit-mask-size: 100%; mask-size: 100%; -webkit-mask-position: top; mask-position: top; background: #7DD3FF; width: 100%; } .purpose-img-box3 .purpose-mask figure { position: relative; overflow: inherit; padding: 0 0 82%; } .purpose-img-box3 .purpose-mask figure img { position: absolute; top: 0; bottom: 0; left: 0; right: 0; height: 100%; width: 100%; object-fit: cover; object-position: bottom; } .purpose-icon3 { width: calc(100% - 14px); left: 9px; top: 20px; } .purpose-icon3 img { width: 100%; } .teaching-sec { padding: 250px 0 150px; } .teaching-sec h2 { margin-bottom: 50px; } .teaching-bg1 { bottom: 10px; max-width: 39vw; pointer-events: none; left: 0; } .teaching-bg2 { position: absolute; right: 15%; top: 38%; } .teaching-row .col-lg-10:nth-child(even) { margin-left: auto; } .teaching-row .col-lg-10:not(:last-child) { margin-bottom: 50px; } .teaching-card { background-color: #FFF; padding: 70px; border-radius: 32px; box-shadow: 10px 10px 0 #6A4C93; } .teaching-row .col-lg-10:nth-child(even) .teaching-card { box-shadow: 10px 10px 0 #FF6700; } .pt-200 { padding-top: 200px; } .bg-blue { background-color: #99DDFF; } .leaders-sec { padding-bottom: 150px; background-image: url(../images/bg-bg.png); background-size: 100%; background-repeat: no-repeat; background-position: bottom; } .leader-slider { overflow: hidden; padding: 50px 0 0; } .leader-img-box { width: 100%; max-width: 284px; position: relative; margin: 0 auto 48px; } .leader-img-box figure { position: relative; padding: 0 0 100%; border-radius: 50%; overflow: hidden; } .leader-img-box figure img { position: absolute; top: 0; bottom: 0; left: 0; right: 0; height: 100%; width: 100%; object-fit: cover; object-position: center; transition: var(--transition-common); } .leader-content { text-align: center; } .leader-content h4 { margin-bottom: 8px; } .leader-content h4.l-name { color: #00A6FB; margin-bottom: 16px; } .leader-content span { color: #76A1B7; display: block; margin-bottom: 12px; } .leader-box a{ color: #424242;} .leader-box:hover .leader-img-box figure img { transform: scale(1.05); } .leader-slider .swiper-slide:nth-child(3n+1) .leader-img-box svg path { fill: #8AC926; } .leader-slider .swiper-slide:nth-child(3n+2) .leader-img-box svg path { fill: #FF1654; } .leader-slider .swiper-slide:nth-child(3n+3) .leader-img-box svg path { fill: #FF6700; } .swiper-button-next, .swiper-button-prev { margin: 0 !important; width: 50px; height: 50px; background: #FFF; box-shadow: 2px 2px 0px 0px #00A6FB; border: 1px solid #00A6FB; overflow: hidden; -webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -ms-transition: all 0.4s ease; -o-transition: all 0.4s ease; transition: all 0.4s ease; border-radius: 50px; } .swiper-button-next:after, .swiper-button-prev:after { display: none; } .swiper-button-next img, .swiper-button-prev img { -webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -ms-transition: all 0.4s ease; -o-transition: all 0.4s ease; transition: all 0.4s ease; width: 24px; } .swiper-button-prev img { transform: rotate(180deg); } .swiper-button-next { right: -36px; } .swiper-button-prev { left: -36px; } .swiper-button-next::before, .swiper-button-prev::before { display: block; content: ''; width: 100%; height: 100%; position: absolute; background: #00A6FB; z-index: -1; -webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -ms-transition: all 0.4s ease; -o-transition: all 0.4s ease; transition: all 0.4s ease; right: -100%; top: 100%; border-radius: 50px; } .swiper-button-next:hover, .swiper-button-prev:hover { background: #00A6FB; transition-delay: 0.3s; box-shadow: 0px 0px 0px 0px #00A6FB;} .swiper-button-next:hover::before, .swiper-button-prev:hover::before { right: 0%; top: 0%; } .swiper-button-next:hover img, .swiper-button-prev:hover img { filter: brightness(0) invert(1); } .swiper-pagination .swiper-pagination-bullet { background: #317fc1; opacity: 1; transition: all 0.4s ease; } .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active { background: #00a6fb; width:25px; border-radius:15px } .swiper-pagination { bottom: 0 !important; position: relative; margin-top: 12px; } .leader-img-box .blob { position: absolute; left: 49%; top: 50%; transform: translate(-50%, -50%); z-index: 1; overflow: inherit; z-index: -1; animation: blobRotate 100s linear infinite;} .leader-img-box .blob path { animation: blob 10s ease-in-out infinite; } .team-popup-card .modal-dialog { max-width: 1305px; width: calc(100% - 30px); margin-left: auto; margin-right: auto; } .team-popup-card .modal-content { background-color: transparent; border: 0; border-radius: 0; } .team-popup-card .shap-image{ margin-bottom: -2px; transform: translateZ(0);} .team-popup-card .modal-body { background: #CCEFFF; padding: 30px 15px 25px 70px; border-radius: 0 0 50px 50px; z-index: 5; } .team-popup-card .shap-image img{ min-width: 100%; vertical-align: top;} .team-popup-card .shap-image{ margin-bottom: -2px; line-height: 0; overflow: hidden; } .team-popup-card .shap-image img{ display: block; width: 100%; height: auto; backface-visibility: hidden; -webkit-backface-visibility: hidden; } .team-popup-card .leader-img-box { max-width: 94%; padding: 2% 7%; margin: 0 0 35px; } .team-popup-card .leader-img-box .blob{ width: 100%; height: 100%;} .team-popup-card .leader-img-box .blob path { fill: #8AC926;} .team-popup-card .modal-body .leader-content { max-height: 575px; overflow: auto; padding-right: 55px; padding-left: 5px; padding-bottom: 15px; } .team-popup-card .leader-content span{ margin-bottom: 30px;} .team-popup-card .modal-body .leader-content p:not(:last-child) { margin-bottom: 16px; } .team-popup-card button.btn-close { position: absolute; z-index: 99; display: flex; align-items: center; justify-content: center; width: 90px; height: 90px; right: 0; top: 15px; background: url(../images/close-mask.svg); background-position: center !important; background-repeat: no-repeat !important; background-size: cover !important; opacity: 1; padding: 0; transition: var(--transition-common); } .team-popup-card button.btn-close::before { content: ""; background: #00A6FB; position: absolute; z-index: 1; inset: 0; margin: auto; width: 0; height: 0; border-radius: 50%; transition: var(--transition-common); } .team-popup-card button.btn-close img{ max-width: 30%; position: relative; z-index: 2; transition: var(--transition-common);} .team-popup-card button.btn-close:hover::before{ width: calc(100% - 5px); height: calc(100% - 5px);} .team-popup-card button.btn-close:hover img{ transform: rotate(90deg);} /*-----scroll-bar-design----------*/ /* width */ .team-popup-card .modal-body .leader-content::-webkit-scrollbar {width: 10px; height: 10px; } /* Track */ .team-popup-card .modal-body .leader-content::-webkit-scrollbar-track {box-shadow: none; } /* Handle */ .team-popup-card .modal-body .leader-content::-webkit-scrollbar-thumb {background: #6EB7D9; border-radius: 20px; } /*-----scroll-bar-design----------*/ @keyframes blobRotate { 0% { transform: translate(-50%, -50%) rotate(0deg); } 100% { transform: translate(-50%, -50%) rotate(360deg); } } @keyframes blob { 0% { d: path("M4.18576 131.734C16.6377 90.916 51.8219 38.8476 83.6217 18.829C135.501 -13.83 158.464 -0.0452887 226.063 30.0446C293.661 60.1345 326.572 115.378 321.489 159.597C316.406 203.816 275.992 259.832 247.97 281.384C222.401 301.05 173.33 321.821 108.273 314.495C43.215 307.169 61.6473 252.896 29.2387 226.633C-8.69797 195.891 -0.603402 147.433 4.18576 131.734Z"); } 33% { d: path("M1.24246 147.239C8.05667 105.005 39.0644 40.587 70.8642 20.5684C122.743 -12.0906 157.144 -2.85055 224.742 27.2393C292.341 57.3292 308.731 117.739 308.731 161.337C308.731 205.847 249.63 275.878 224.742 292.239C188.242 316.234 141.742 336.239 95.5151 316.234C45.873 294.752 30.7423 264.739 16.4812 228.373C-1.34534 182.914 -1.37192 163.443 1.24246 147.239Z"); } 50% { d: path("M15 125C32 78 62 28 96 12C148 -14 172 6 238 40C304 74 334 130 326 175C318 220 270 268 240 290C210 312 158 338 88 322C18 306 38 252 8 222C-22 192 -2 172 15 125Z"); } 66% { d: path("M8 138C24 86 56 32 90 16C142 -10 168 4 234 38C300 72 332 126 325 170C318 214 274 264 244 286C215 308 162 332 94 320C26 308 44 254 12 226C-20 198 -8 190 8 138Z"); } 100% { d: path("M4.18576 131.734C16.6377 90.916 51.8219 38.8476 83.6217 18.829C135.501 -13.83 158.464 -0.0452887 226.063 30.0446C293.661 60.1345 326.572 115.378 321.489 159.597C316.406 203.816 275.992 259.832 247.97 281.384C222.401 301.05 173.33 321.821 108.273 314.495C43.215 307.169 61.6473 252.896 29.2387 226.633C-8.69797 195.891 -0.603402 147.433 4.18576 131.734Z"); } } .rbts-section.common-padd { padding-bottom: 200px; } .rbts-slider { overflow: hidden; } .rbts-box { padding:0 32px 32px; position: relative; } .rbts-box::before { background: #FFF; content: ''; position: absolute; width: 100%; display: block; height: calc(240px); left: 0; bottom: 0; z-index: -1; border-radius: 30px; } .rbts-box .rbts-img-box { -webkit-mask-image: url(../images/rbts-shape.svg); mask-image: url(../images/rbts-shape.svg); -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; -webkit-mask-size: 100%; mask-size: 100%; -webkit-mask-position: top; mask-position: top; background: #7DD3FF; width: 100%; margin-bottom: 20px; } .rbts-box .rbts-img-box figure { position: relative; overflow: inherit; padding: 0 0 114%; } .rbts-box .rbts-img-box figure img { position: absolute; top: 0; bottom: 0; left: 0; right: 0; height: 100%; width: 100%; object-fit: cover; object-position: center; transition: var(--transition-common);} .rbts-box:hover .rbts-img-box figure img { transform: scale(1.05); } .rbts-box .rbts-content h5 { font-size: clamp(1.25rem, 0.904rem + 0.923vw, 2rem); text-align: center; color: #00A6FB; margin: 0 0 4px; } .rbts-box .rbts-content .rbts-list { display: flex; align-items: center; justify-content: center; gap: 30px; } .rbts-box .rbts-content .rbts-list span { position: relative; } .rbts-box .rbts-content .rbts-list span:not(:first-child)::before { position: absolute; content: ''; display: block; width: 7px; height: 7px; border-radius: 50%; background: #8AC926; top: 50%; left: -19px; transform: translate(0, -50%); } .rbts-box .rbts-content p { font-size: clamp(1rem, 0.942rem + 0.154vw, 1.125rem); text-align: center; } .rbts-section .swiper-button-next { right: -74px; } .rbts-section .swiper-button-prev { left: -74px; } .rbts-section .swiper-button-next, .rbts-section .swiper-button-prev { top: 35%; } /* ================== Page ==> About ================= */ /* ================== Page ==> Careers ================= */ .part-img-box { -webkit-mask-image: url(../images/vector9.svg); mask-image: url(../images/vector9.svg); -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; -webkit-mask-size: 100%; mask-size: 100%; -webkit-mask-position: top; mask-position: top; background: transparent; width: calc(100% + 48px); margin: 0 0 0 -48px; } .part-img-box figure { position: relative; overflow: inherit; padding: 0 0 77%; } .part-img-box figure img { position: absolute; top: 0; bottom: 0; left: 0; right: 0; height: 100%; width: 100%; object-fit: cover; object-position: bottom; } .part-icon { width: calc(100% + 24px); right: 26px; top: 2px; z-index: -1; } .part-icon img { width: 100%; } .core-box { display: flex; align-items: center; gap: 24px; background: #FFF; padding: 40px; border: 2px dashed #00A6FB; border-radius: 35px; min-height: 232px; height: calc(100% - 24px); margin-bottom: 24px; transition: var(--tertiary-font);} .core-icon { width: 130px; aspect-ratio: 1; flex: 0 0 auto; display: flex; align-items: center; justify-content: center; position: relative;} .core-icon svg { position: absolute; z-index: -1; width: 100%; height: auto; } .core-icon img { width: 60px; aspect-ratio: 1; object-fit: contain; } .core-text h4 { margin-bottom: 16px; } .core-text p { color: #424242; } .core-section.common-padd { padding-bottom: 150px; } .core-top-shape { width: calc(100% + 10px); top: -2px; left: -5px; transform: translateZ(0);} .core-top-shape img { width: 100%; display: block; vertical-align: top;} .core-box:hover .core-icon{ animation: bouncing 0.5s 0.3s;} .core-row { z-index: 2; } .core-row .col-lg-6:nth-child(2) .core-box .core-icon svg path { fill: #FF799D; } .core-row .col-lg-6:nth-child(3) .core-box .core-icon svg path { fill: #FF9F5E; } .core-row .col-lg-6:nth-child(4) .core-box .core-icon svg path { fill: #6CCCFD; } .core-row .col-lg-6:nth-child(5) .core-box .core-icon svg path { fill: #AFABF6; } .core-row .col-lg-6:nth-child(6) .core-box .core-icon svg path { fill: #FFF381; } .footer-shape.dark-color { pointer-events: none; position: relative; z-index: inherit;} .footer-shape.dark-color::before { content: ""; position: absolute; z-index: -1; inset: 0; background: #99ddff; } /* ================== Page ==> Careers ================= */ /* ================== Page ==> Contact ================= */ .contact-form-wrap { background: #FFF; border: 2px dashed #00A6FB; border-radius: 35px; padding: 50px; } .contact-form-wrap input.form-control, .contact-form-wrap textarea.form-control, .contact-form-wrap select.form-control { border: 1px solid #D8D8D8 !important; color: #000 !important; } .contact-form-wrap h2 { margin-bottom: 30px; } .contact-map-box { border: 10px solid #B9E6FF; border-radius: 30px; padding: 76px 88px; margin: 0 auto; background: #FFF; } .contact-map-box h4 { margin: 0 0 8px; } .contact-map-box .map-pointer-list { padding: 0; list-style: none; margin: 0; } .contact-map-box .map-pointer-list li:not(:last-child) { margin-bottom: 16px; } .contact-map-box .map-pointer-list li { display: flex; align-items: center; font-weight: 400; color: #424242; cursor: pointer; } .contact-map-box .map-pointer-list li img { width: 42px; height: 42px; object-fit: contain; margin-right: 10px; } .contact-map-box .map-pointer-list li a { display: flex; align-items: center; color: #424242; text-decoration: none; } .contact-map-hotspot { position: relative; overflow: hidden; border-radius: 30px; border: 10px solid #F0FAFF; width: calc(100% + 14.5%); } .contact-map-hotspot .map-hotspot { position: absolute; transform: translate(-50%, -50%); z-index: 1; } .contact-map-hotspot .map-hotspot.is-right { transform: translate(50%, -50%); } .contact-map-hotspot .map-hotspot:hover, .contact-map-hotspot .map-hotspot.show-toggle { z-index: 10; } .contact-map-hotspot .map-hotspot__label { position: absolute; padding: 8px 5px 8px; text-align: center; width: 110px; max-width: 110px; background-color: white; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2); line-height: 1.45em; z-index: 2; border-radius: 50px; user-select: none; opacity: 0; transition: all 0.1s linear; left: 50%; bottom: 45px; transform: translate(-50%, 0); pointer-events: none; } .contact-map-hotspot .map-hotspot__label h6 { margin: 0; font-weight: 600; font-family: var(--secondary-font); font-size: clamp(1rem, 1rem + 0vw, 1rem); } .contact-map-hotspot .map-hotspot__label::before { content: ''; position: absolute; border-left: none; border-top: 15px solid #000; background: transparent; border: none; width: 0px; height: 0px; border-style: solid; border-width: 10px 10px 0px 10px; border-color: #ffffff transparent transparent transparent; bottom: -9px; left: calc(50% - 10px); } .map-hotspot:hover .map-hotspot__label { opacity: 1; z-index: 2; } .map-hotspot.show-toggle .map-hotspot__label { z-index: 2; opacity: 1; } .contact-map-hotspot .map-hotspot .map-hotspot__button { position: relative; width: 30px; z-index: 1; } .contact-map-hotspot .map-hotspot .map-hotspot__button img { width: 100%; height: 100%; object-fit: contain; } .contact-map-hotspot .map-hotspot .map-hotspot__button:before { content: ''; position: absolute; border-radius: 100%; width: 100%; height: 5px; background: #FFF; bottom: -3px; z-index: -1; animation: blink-border 2s infinite; } @keyframes blink-border { 0% { transform: scaleX(.6) scaleY(1); } 50% { transform: scaleX(1) scaleY(1.2); } 100% { transform: scaleX(.6) scaleY(1); } } .information-icon { background: #FFFFFF; width: 120px; aspect-ratio: 1; display: flex; align-items: center; justify-content: center; border-radius: 20px; margin: 0 auto 20px; } .information-icon img { width: 56px; aspect-ratio: 1; object-fit: contain; } .information-dtls { text-align: center; } .information-dtls h4 { margin-bottom: 16px; color: #333333; } .information-dtls a { background-image: linear-gradient(#cf303000 95%, #424242 0, #424242); background-position-y: bottom; background-repeat: no-repeat; background-size: 0 100%; text-decoration: none; transition: background-size .3s cubic-bezier(.79, .01, .22, .99) 0s, background-position 0s step-end .3s, color .3s; color: #424242; } .information-dtls a:hover { background-position-x: right; background-position-y: bottom; background-size: 100% 100%; } .information-box { padding: 20px 20px 90px; } .info-shape { position: absolute; z-index: -1; width: 100%; height: 98%; bottom: 0; left: 0; } .info-line { position: absolute; z-index: -1; width: 95%; bottom: 0; left: 3%; } .information-row .col-xl-4:nth-child(2) .information-box .info-shape path { fill: #C4CCFF; } .information-row .col-xl-4:nth-child(2) .information-box .info-line path { stroke: #7482E3; } .information-box:hover .information-icon img{ animation: bouncing 0.5s 0.3s;} .information-box:hover .info-shape{ animation: bouncing 0.5s 0.3s;} .information-box:hover .info-line{ animation: bouncing 0.5s 0.3s;} /* ================== Page ==> Contact ================= */ /* ================== Page ==> Services ================= */ .comprehensive-section h2 { margin-bottom: 30px; } .comprehensive-box { display: flex; flex-direction: column; height: 100%; } .comprehensive-text { margin: -168px 0 0; padding: 80px 32px 60px; text-align: center; background: #FFFFFF; border: 2px dashed #00A6FB; height: 100%; z-index: 1; position: relative; border-radius: 200px 200px 32px 32px; } .comprehensive-img { padding: 0 0 114%; position: relative; overflow: hidden; border-radius: 32px 32px 0 0; } .comprehensive-img img { width: 100%; height: 100%; object-fit: cover; position: absolute; top: 0; left: 0; transition: all 0.5s ease;} .comprehensive-box:hover .comprehensive-img img { transform: scale(1.1); } .container-custom { max-width: 1200px; margin: 0 auto; } .guiding-section { padding-bottom: 82px; } .guiding-svg { width: 100%; max-width: 1105px; margin: 0 auto; } .guiding-svg img { width: 100%; height: 100%; object-fit: contain; } .guiding-steps { max-width: 335px; position: absolute; } .guiding-steps h5 { font-weight: 800; color: #00A6FB; font-family: var(--secondary-font); margin: 0 0 8px; } .guiding-steps-wrap .guiding-steps p span { font-weight: 800; color: #6A4C93; } .guiding-steps-wrap .guiding-steps:nth-child(1) { top: 49px; left: 555px; } .guiding-steps-wrap .guiding-steps:nth-child(2) { top: 365px; left: -80px; text-align: right; max-width: 293px; } .guiding-steps-wrap .guiding-steps:nth-child(3) { top: 335px; right: -110px; } .guiding-steps-wrap .guiding-steps:nth-child(4) { bottom: 3px; right: 490px; text-align: right; } .landing-guiding-section .guiding-steps-wrap .guiding-steps:nth-child(4) { max-width: 365px; } /* ================== Page ==> Services ================= */ /* ================== Element Image ================= */ .part-element1 { max-width: 11vw; left: 10.5%; top: 140px; } .paer-element1 img { width: 100%; } .part-element2 { max-width: 8vw; right: 5.4%; top: 90px; } .part-element2 img { width: 100%; } .part-element3 { max-width: 10vw; left: 8%; top: 200px; } .paer-element3 img { width: 100%; } .part-element4 { max-width: 12vw; top: 154px; left: 6%; } .part-element4 img { width: 100%; } .part-element5 { max-width: 11vw; right: 5.4%; top: 202px; } .part-element5 img { width: 100%; } .part-element6 { max-width: 8vw; right: 7.4%; bottom: 62px; } .part-element6 img { width: 100%; } .part-element7 { max-width: 12vw; left: 5.5%; top: 140px; } .paer-element7 img { width: 100%; } .part-element8 { max-width: 10vw; left: 8%; top: 320px; } .part-element8 img { width: 100%; } .part-element9 { max-width: 11vw; right: 3.4%; bottom: 390px; } .part-element9 img { width: 100%; } .part-element10 { max-width: 7vw; left: 7%; top: 46%; } .part-element10 img { width: 100%; } .part-element11 { max-width: 7vw; right: 10%; bottom: 22%; transform: rotate(-35deg);} .part-element11 img { width: 100%; } .part-element12 { max-width: 7vw; right: 5.2%; top: 50px; } .part-element12 img { width: 100%; } .part-element13 { max-width: 12vw; right: 6.2%; top: 157px; } .part-element13 img { width: 100%; } .part-element14 { max-width: 12vw; right: 6.2%; top: 64px; } .part-element14 img { width: 100%; } .part-element15 { max-width: 11vw; left: 6%; top: 41.5%; } .part-element15 img { width: 100%; } .part-element16 { max-width: 8vw; left: 8.1%; bottom: 104px; } .part-element16 img { width: 100%; } .part-element17 { max-width: 12vw; right: 6.2%; top: 18%; } .part-element17 img { width: 100%; } .part-element18 { max-width: 10vw; top: 39.6%; right: 5%; } .part-element18 img{ width: 100%;} .part-element19 { max-width: 10vw; bottom: 32%; left: 6%; } .part-element19 img{ width: 100%;} .part-element20 { max-width: 12vw; right: 6.2%; top: 18%; } .part-element20 img { width: 100%; } .part-element21 { max-width: 10vw; bottom: 30%; left: 5%; } .part-element21 img{ width: 100%;} .landing-conatact-sec .part-element1 { max-width: 11vw; left: 10.5%; top: 106px; } .landing-core-sec .part-element16 { max-width: 11vw; left: 9.1%; bottom: 84px; } .landing-why-sec .part-element11 { max-width: 11vw; right: 4.5%; bottom: 19%; } /* ================== Element Image ================= */ /* ================== Landing Page ================= */ .contact-info-wrap h4 { color: #00A6FB; } .call-btm { display: flex; align-items: center; border: 2px dashed #00A6FB; padding: 16px; width: 100%; max-width: 336px; border-radius: 15px; } .call-btm .call-icon { width: 57px; height: 47px; display: flex; align-items: center; justify-content: center; background: url(../images/bg-svg.svg); margin-right: 16px; flex: 0 0 auto; } .call-btm a { font-family: var(--primary-font); font-size: clamp(1.25rem, 0.904rem + 0.923vw, 2rem); color: #333333; background-image: linear-gradient(#cf303000 calc(100% -1px), #00A6FB 0, #00A6FB); background-position-y: bottom; background-repeat: no-repeat; background-size: 0 100%; text-decoration: none; transition: background-size .3s cubic-bezier(.79, .01, .22, .99) 0s, background-position 0s step-end .3s, color .3s;} .call-btm:hover .call-icon{ animation: bouncing 0.5s 0.3s;} .call-btm a:hover{ background-position-x: right; background-position-y: bottom; background-size: 100% 100%;} .approach-items-outer .approach-item:nth-child(odd) .row{ flex-direction: row-reverse;} .approach-items-outer .approach-item:last-child{ padding-bottom: 0;} .landing-info-sec p strong { color: #3A235E; font-weight: 600; } .landing-info-sec .part-element2 { top: 15%; right: 12%; } .why-img-box { -webkit-mask-image: url(../images/why2.svg); mask-image: url(../images/why2.svg); -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; -webkit-mask-size: 100%; mask-size: 100%; -webkit-mask-position: top; mask-position: top; background: transparent; width: calc(100% + 48px); margin: 0 0 0 -48px; } .why-img-box figure { position: relative; overflow: inherit; padding: 0 0 81%; } .why-img-box figure img { position: absolute; top: 0; bottom: 0; left: 0; right: 0; height: 100%; width: 100%; object-fit: cover; object-position: bottom; } .why-icon { width: calc(100%); left: -26px; top: 24px; z-index: -1; } .why-icon img { width: 100%; } .info-img-box1 { -webkit-mask-image: url(../images/info2.svg); mask-image: url(../images/info2.svg); -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; -webkit-mask-size: 100%; mask-size: 100%; -webkit-mask-position: top; mask-position: top; background: transparent; width: calc(100% - 9px); margin: 0 0 0 9px; } .info-img-box1 figure { position: relative; overflow: inherit; padding: 0 0 93%; } .info-img-box1 figure img { position: absolute; top: 0; bottom: 0; left: 0; right: 0; height: 100%; width: 100%; object-fit: cover; object-position: bottom; } .info-icon1 { width: calc(100% - 34px); right: 21px; top: -13px; z-index: -1; } .info-icon1 img { width: 100%; } .info-img-box2 { -webkit-mask-image: url(../images/info3.svg); mask-image: url(../images/info3.svg); -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; -webkit-mask-size: 100%; mask-size: 100%; -webkit-mask-position: top; mask-position: top; background: transparent; width: 100%; margin: 0; } .info-img-box2 figure { position: relative; overflow: inherit; padding: 0 0 114%; } .info-img-box2 figure img { position: absolute; top: 0; bottom: 0; left: 0; right: 0; height: 100%; width: 100%; object-fit: cover; object-position: bottom; } .info-icon2 { width: calc(100% - 24px); left: -4px; top: -9px; z-index: -1; } .info-icon2 img { width: 100%; } .landing-service-sec .testimonial-wraper .section-title { max-width: 1055px; margin-bottom: 30px;} .testimonial-slider-outer { padding: 80px 35% 80px 50px; background: #ffffff; margin-right: -40%; border: 2px dashed #00A6FB; border-radius: 50px; } .testimonial-image-outer { margin-left: 15%;} .landing-testimonial-image{ -webkit-mask-image: url(../images/landing-testimonial-mask.svg);mask-image: url(../images/landing-testimonial-mask.svg);-webkit-mask-repeat: no-repeat;mask-repeat: no-repeat;-webkit-mask-size: 100%;mask-size: 100%;-webkit-mask-position: top;mask-position: top;background: #7DD3FF;width: 100%;} .landing-testimonial-image figure { position: relative; overflow: inherit; padding: 0 0 121%; } .landing-testimonial-image figure img { position: absolute; z-index: 1; inset: 0; width: 100%; height: 100%; object-fit: cover; } .testimonial-image-outer .testimonial-image-border { width: calc(100% + 8px); height: 100%; left: -8px; top: -9.1px; } .testimonial-image-outer .testimonial-image-border img{ width: 100%;} .landing-testimonial-slider .swiper-slide{ height: auto;} .landing-testimonial-card { padding-bottom: 3px; height: 100%; display: flex; flex-direction: column;} .landing-testimonial-card .review-content{ flex: 1;} .landing-testimonial-card .review-content p{ margin-bottom: 8px;} .landing-testimonial-card .testimonial-text { overflow: hidden; transition: max-height 0.4s ease; } .landing-testimonial-card .read-toggle { display: inline-block; color: #7678ED; font-weight: 700; background-image: linear-gradient(#cf303000 95%, #7678ED 0, #7678ED); background-repeat: no-repeat; background-position-x: right; background-position-y: bottom; background-size: 100% 100%; transition: background-size .3s cubic-bezier(.79, .01, .22, .99) 0s, background-position 0s step-end .3s, color .3s; font-size: clamp(1rem, 0.942rem + 0.154vw, 1.125rem); margin: 10px auto 0; cursor: pointer;} .landing-testimonial-card .read-toggle:hover{ background-position-y: bottom; background-repeat: no-repeat; background-size: 0 100%;} .landing-testimonial-card:not(:has(.testimonial-text.clamped)) .read-toggle { display: none !important; } .landing-testimonial-card .author-details { flex: 0 0 auto; margin-top: 22px; height: 50px; display: flex; align-items: center; gap: 10px; margin-left: 45%; padding-left: 32px; border-left: 2px solid #E3E3E3; } .landing-testimonial-card .author-details h4 { margin-bottom: 0; color: #00A6FB; } .landing-testimonial-card .author-details span { color: #704790; font-style: italic; font-weight: 700; text-transform: capitalize; } .testimonial-slider-outer .slider-arrow-row { position: absolute; z-index: 1; bottom: 5px; left: calc(45% - 130px); gap: 10px; } .testimonial-slider-outer .swiper-button-next, .testimonial-slider-outer .swiper-button-prev { position: relative; inset: 0; } .landing-service-box { display: flex; border: 2px dashed #6A4C93; border-radius: 35px; padding: 32px; margin: 32px 0; box-shadow: 6px 6px 0 #6A4C93; background: #CCEFFF; } .landing-service-box .landing-service-img { width: 31.5%; flex: 0 0 auto; border-radius: 20px; overflow: hidden; margin: -64px 0 0; } .landing-service-box .landing-service-img figure { border-radius: 20px; overflow: hidden; padding: 0 0 72%; position: relative; } .landing-service-box .landing-service-img figure img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; } .landing-service-text { padding: 0 0 0 24px; display: flex; flex-direction: column; justify-content: center; } .landing-service-text h4 { margin-bottom: 14px; color: #222222; } .landing-service-text p { margin-bottom: 0; font-size: clamp(1rem, 0.942rem + 0.154vw, 1.125rem); } .landing-service-text p:not(:last-child) { margin-bottom: 8px; } .landing-service-row .col-lg-12:nth-child(even) .landing-service-box { flex-direction: row-reverse; box-shadow: -6px 6px 0 #6A4C93;} .landing-service-row .col-lg-12:nth-child(even) .landing-service-box .landing-service-text { padding: 0 24px 0 0; } .landing-why-sec { padding-bottom: 200px; } .landing-why-sec h4 { color: #6A4C93; } .part-icon1 { width: calc(100% - 33px); left: 12px; top: 2px; z-index: -1; } .part-img-box1 { -webkit-mask-image: url(../images/vss1.svg); mask-image: url(../images/vss1.svg); -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; -webkit-mask-size: 100%; mask-size: 100%; -webkit-mask-position: top; mask-position: top; background: transparent; width: calc(100% - 11px); margin: 0 0 0 11px;} .part-img-box1 figure { position: relative; overflow: inherit; padding: 0 0 91.4%; } .part-img-box1 figure img { position: absolute; top: 0; bottom: 0; left: 0; right: 0; height: 100%; width: 100%; object-fit: cover; object-position: bottom; } .magical-cloud { max-width: 996px; text-align: center; margin: 0 auto; padding: 106px 117px; background-image: url(../images/clouds1.svg); background-repeat: no-repeat; background-size: 100% 100%; background-position: center; } .landing-faq-sec .cloud{ z-index: 2; width: 100%;} .landing-faq-sec .cloud img{ width: 100%;} .landing-faq-sec .cloud1 { max-width: 35%; bottom: 5%; left: 0; } .landing-faq-sec .cloud2 { max-width: 25%; bottom: 4%; left: 15%; } .landing-faq-sec .cloud3 { max-width: 45%; bottom: -5%; right: 5%; } .landing-faq-sec .cloud4 { max-width: 35%; bottom: -10%; right: 20%; } .faq-icon1 { width: calc(100% - 38px); right: 0; top: 40px; z-index: -1; } .faq-img-box1 { -webkit-mask-image: url(../images/vss3.svg); mask-image: url(../images/vss3.svg); -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; -webkit-mask-size: 100%; mask-size: 100%; -webkit-mask-position: top; mask-position: top; background: transparent; width: calc(100% - 21px); margin: 0; } .faq-img-box1 figure { position: relative; overflow: inherit; padding: 0 0 118.4%; } .faq-img-box1 figure img { position: absolute; top: 0; bottom: 0; left: 0; right: 0; height: 100%; width: 100%; object-fit: cover; object-position: bottom; } .accordion-item { background-color: transparent; border: 2px dashed transparent; border-top: 0; border-radius: 50px 30px 50px 30px !important; overflow: hidden; transition: all .3s ease;} .landing-faq-sec .accordion-item:not(:last-child){ margin-bottom: 20px;} .landing-faq-sec .accordion-button{ justify-content: space-between; gap: 20px; background: #99DDFF; padding: 10px 10px 10px 24px; border-radius: 50px 30px 50px 30px !important; box-shadow: none !important; color: #424242; font-weight: 700; font-family: var(--secondary-font); font-size: clamp(1rem, 0.885rem + 0.308vw, 1.25rem); line-height: 1.1;} .landing-faq-sec .accordion-button::after{ display: none;} .landing-faq-sec .accordion-button .icon{ display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; flex: 0 0 auto; background-color: #FFFFFF; border: 1px solid #00A6FB; border-radius: 50%; box-shadow: 2px 2px 0px 0px #00A6FB; transition: all .3s ease;} .landing-faq-sec .accordion-button .icon img{ width: 16px; transition: all .3s ease;} .landing-faq-sec .accordion-body { padding: 20px 30px; } .accordion-item:has(.accordion-button:not(.collapsed)){ background: #ffffff; border-radius: 32px !important; border-color: #00A6FB;} .landing-faq-sec .accordion-button:hover{ background-color: #00A6FB; color: #FFFFFF;} .landing-faq-sec .accordion-button:not(.collapsed){ background-color: #00A6FB; border-radius: 35px !important; color: #FFFFFF;} .landing-faq-sec .accordion-button:not(.collapsed) .icon, .landing-faq-sec .accordion-button:hover .icon{ background-color: #00A6FB; border-color: #FFFFFF; box-shadow: 2px 2px 0px 0px #FFFFFF; } .landing-faq-sec .accordion-button:not(.collapsed) .icon img { transform: rotate(-180deg); } .landing-faq-sec .accordion-button:not(.collapsed) .icon img, .landing-faq-sec .accordion-button:hover .icon img{ filter: brightness(0) invert(1);} .my-100 { margin-top: 120px; margin-bottom: 120px; } /* ================== Landing Page ================= */ /* ================== BLOG Page ================= */ .blog-section .row{ row-gap: 25px;} .blog-card{ height: 100%; background: url(../images/blog-bg.svg); background-position: center !important; background-size: 100% 100% !important; background-repeat: no-repeat !important; transition: var(--transition-common);} .blog-card a{ display: block; padding: 30px 30px 70px 20px;} .blog-card .blog-image{ -webkit-mask-image: url(../images/blog-image-mask.svg); mask-image: url(../images/blog-image-mask.svg); -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; -webkit-mask-size: 100%; mask-size: 100%; -webkit-mask-position: top; mask-position: top; margin-bottom: 24px;} .blog-card .blog-image figure { position: relative; padding-bottom: 73%; } .blog-card .blog-image figure img { position: absolute; z-index: 1; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: var(--transition-common);} .blog-card .date{ margin-bottom: 10px;} .blog-card .date p, .date{ color: #76A1B7; font-weight: 600;} .blog-card h4{font-size: clamp(1.25rem, 1.0769rem + 0.77vw, 2rem); margin-bottom: 10px;} .blog-card .short-dis p{ display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; color: #424242;} .blog-card:hover{ transform: translateY(-10px);} .blog-card:hover .blog-image figure img{ transform: scale(1.05);} .blog-section .part-element2 { top: 45%; } .blog-section .part-element3 { top: auto; bottom: 3%;} .blog-details-section .inner-content { max-width: 1300px; margin: -350px auto 0; } .blog-details-section .inner-content .blog-details-thumbnail{ background: url(../images/blog-details-imag-mask.svg); background-position: center !important; background-size: 100% 100% !important; background-repeat: no-repeat !important; margin-bottom: 30px;} .blog-details-section .inner-content .blog-details-thumbnail .post-thumbnail { -webkit-mask-image: url(../images/blog-details-imag-mask.svg); mask-image: url(../images/blog-details-imag-mask.svg); -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; -webkit-mask-size: 100% 100%; mask-size: 100% 100%; -webkit-mask-position: center; mask-position: center; position: relative; padding-bottom: 58%; transform: scale(0.97 , 0.95); margin-bottom: 0 !important;} .blog-details-section .inner-content .blog-details-thumbnail .post-thumbnail img { position: absolute; z-index: 1; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: var(--transition-common);} .blog-details-section .details-content ul{ padding: 24px; background: #B5E3F8; border-radius: 20px; margin-bottom: 16px; list-style: none;} .blog-details-section .details-content ul li{ position: relative; padding-left: 50px;} .blog-details-section .details-content ul li::before{ content: ""; position: absolute; z-index: 1; left: 0; background: url(../images/details-list.svg); background-position: center !important; background-size: 100% 100% !important; background-repeat: no-repeat !important; width: 30px; height: 30px;} .blog-details-section .details-content ul li:not(:last-child){ margin-bottom: 16px;} .blog-details-section .date *{ color: #76A1B7; font-weight: 600;} .blog-details-section .app-line-1 { left: 8vw; top: 24%; } .blog-details-section .app-line-1 path{ fill: #FF799D;} .blog-details-section .app-line-2{ position: absolute; left: 10vw; bottom: 5%; width: 7.86vw;} /*-------------------------------------------------------------- Pagination --------------------------------------------------------------*/ .pagination { justify-content: center; align-items: center; gap: 8px; margin-top: 50px;} .page-item{ outline: none !important; box-shadow: none !important;} .page-numbers { display: flex; align-items: center; justify-content: center; width: 48px; height: 48px; color: #424242 !important; font-weight: 600; font-size: clamp(1rem, 0.9712rem + 0.129vw, 1.125rem); background: transparent !important; border: 0; border-radius: 0; padding: 0; isolation: isolate; box-shadow: none !important;} .page-numbers::before { content: ""; position: absolute; z-index: -1; inset: 0; background: url(../images/pegination.svg); background-position: center !important; background-size: 100% 100% !important; background-repeat: no-repeat !important; width: 100%; height: 100%; transform: scale(0); transition: var(--transition-common); margin: auto; pointer-events: none;} .page-numbers:hover, .page-numbers.current{ color: #fff !important;} .page-numbers:hover::before, .page-numbers.current::before{ transform: scale(1);} /* .page-numbers.current::before{ transform: scale(1.1);} */ a.next.page-numbers, a.prev.page-numbers { background: #FFF !important; border: 1px solid #80B4CC; border-radius: 20px !important; } a.next.page-numbers::before, a.prev.page-numbers::before{ display: none;} a.next.page-numbers::after, a.prev.page-numbers::after { content: ""; width: 0; height: 2px; background: #3A235E; position: absolute; z-index: 1; top: 50%; transform: translateY(-50%); pointer-events: none; transition: var(--transition-common); opacity: 0; } a.prev.page-numbers::after{ left: 15px;} a.next.page-numbers::after{ right: 16px; } a.next.page-numbers img, a.prev.page-numbers img{ width: 16px; height: 16px; transition: var(--transition-common);} a.next.page-numbers:hover::after, a.prev.page-numbers:hover::after{ width: 20px; opacity: 1;} a.prev.page-numbers:hover img{ transform: translateX(-5px);} a.next.page-numbers:hover img{ transform: translateX(5px);} /* ================== BLOG Page ================= */ /*Media Query css*/ @media only screen and ( min-width:1699px ) { .together-col-left { margin: 0; } } @media only screen and ( min-width:1599px ) { .container { max-width: 1440px !important;} } @media only screen and ( max-width:1799px ) { /*---------------------------{[[ Home Page start ]]}---------------------------*/ .ban-arrow { top: 240px; right: 14px; max-width: 26vw; } .site-line1 { max-width: 1420px; } .site-line2 { max-width: 1420px; top: -270px; left: 51.2%; } .site-line2 { /* max-width: 1420px; top: -270px; */ left: 53.2%; top: -27%; max-width: 85%; } .site-line3 { max-width: 1387px; bottom: 150px; left: 52%; } .site-line4 { /* max-width: 1290px; */ bottom: -54px; left: 55%; max-width: 74%;} /*---------------------------{[[ Home Page End ]]}---------------------------*/ /* ---------------------------{[[ About Page start ]]}---------------------------*/ .app-line2 { position: absolute; right: -58px; bottom: 0vw; max-width: 10vw; } .teaching-sec { padding: 200px 0 150px; } .teaching-bg2 { position: absolute; right: 10%; top: 36%; } /* ---------------------------{[[ About Page End ]]}---------------------------*/ /* ================== Element Image ================= */ .part-element1 { max-width: 11vw; left: 4.5%; top: 140px; } .part-element2 { max-width: 8vw; right: 1%; top: 20px; } .part-element3 { max-width: 10vw; left: 3%; top: 160px; } .part-element4 { max-width: 12vw; top: 154px; left: 1%; } .part-element5 { max-width: 11vw; right: 2.4%; top: 202px; } .part-element6 { max-width: 8vw; right: 1%; bottom: 54px; } .part-element7 { max-width: 12vw; left: 1.5%; top: 100px; } .part-element8 { max-width: 10vw; left: 3%; top: 320px; } .part-element9 { max-width: 11vw; right: 1.4%; bottom: 330px; } .part-element10 { max-width: 7vw; left: 2%; top: 45%; } .part-element11 { max-width: 7vw; right: 3%; bottom: 22%; } .part-element13 { max-width: 12vw; right: 6.2%; top: 135px; } .part-element14 { max-width: 10vw; right: 1.2%; top: 25px; } .part-element15 { max-width: 11vw; left: 1%; top: 43.5%; } .part-element16 { max-width: 8vw; left: 2.1%; bottom: 74px; } .part-element17 { max-width: 10vw; right: 2.2%; top: 14%; } /* ================== Element Image ================= */ .blog-details-section .app-line-1, .blog-details-section .app-line-2{ left: 1%;} } @media only screen and ( max-width:1599px ) { .main-header .logo { transform: scale(1); transform-origin: left center; max-width: 190px; } /* ---------------------------{[[ Home Page start ]]}---------------------------*/ .inner-banner { min-height: 460px; } /* ---------------------------{[[ Home Page End ]]}---------------------------*/ /* ---------------------------{[[ About Page start ]]}---------------------------*/ .vector-line1 { position: absolute; right: 170px; top: 160px; max-width: 7vw; } .vector-line2 { position: absolute; right: 87px; bottom: 55px; width: 7.4vw; } .child-star { position: absolute; top: 9vw; z-index: 1; left: -10px; width: 5vw; } .teaching-card { padding: 50px; } .teaching-row .col-lg-10:not(:last-child) { margin-bottom: 40px; } .approach-icon2 { width: 96%; left: -3px; top: -11px; } .rbts-section .swiper-button-next { right: -54px; } .rbts-section .swiper-button-prev {left: -54px;} .rbts-section .swiper-button-next, .rbts-section .swiper-button-prev{ top: 30%;} .therapy-white-box { padding: 60px; } .purpose-img-box1 { position: relative; width: 100%; max-width: 308px; } .purpose-img-box2 { position: relative; width: 100%; max-width: 400px; margin-left: -46px; } .teaching-sec h2 { margin-bottom: 36px; } /* ---------------------------{[[ About Page End ]]}---------------------------*/ /* ---------------------------{[[ Services Page start ]]}---------------------------*/ .comprehensive-text { padding: 80px 32px 30px; } /* ---------------------------{[[ Services Page End ]]}---------------------------*/ /* ---------------------------{[[ Contact Page start ]]}---------------------------*/ .core-box { min-height: 216px; } .contact-map-box { padding: 56px 78px; } /* ---------------------------{[[ Contact Page End ]]}---------------------------*/ /* ================== Element Image ================= */ .part-element12 { max-width: 9vw; right: 5.2%; top: 50px; } /* ================== Element Image ================= */ .blog-details-section .inner-content .blog-details-thumbnail{ max-width: 85%; margin: 0 auto 30px;} } @media only screen and ( max-width:1399px ) { .main-menu ul { gap: 15px; } .main-header .logo { max-width: 160px; } .common-padd { padding-top: 80px; padding-bottom: 80px; } .common-padd-top { padding-top: 80px; } .pt-200 { padding-top: 120px; } /* ---------------------------{[[ Home Page start ]]}---------------------------*/ .banner { padding-top: 160px; padding-bottom: 50px; } .insurances-section { padding-bottom: 100px; } .site-line1 { bottom: -50px; left: 50%; transform: translate(-50%, 0); } .site-line2 { max-width: 1420px; top: -200px; left: 51.2%; } .site-line3 { max-width: 1387px; bottom: 70px; left: 54%; } .site-line4 { /* max-width: 940px; */ bottom: -24px; left: 50%; } .insurances-section { padding-bottom: 80px; } /* ---------------------------{[[ Home Page End ]]}---------------------------*/ /* ---------------------------{[[ About Page start ]]}---------------------------*/ .star3 { right: 345px; bottom: 38px; width: 3.9vw; } .star6 { right: 45px; width: 3.9vw; top: 250px; } .team-popup-card button.btn-close { width: 80px; height: 80px; } .approach-text-box h2 { margin: 0; } .rbts-box { padding: 0 24px 24px; position: relative; } .rbts-box::before { border-radius: 20px; } .rbts-section .swiper-button-next { right: -35px; } .rbts-section .swiper-button-prev { left: -35px; } .rbts-section .swiper-button-next, .rbts-section .swiper-button-prev { top: 20%; } .purpose-img-box1 { position: relative; width: 100%; max-width: 260px; } .purpose-img-box2 { position: relative; width: 100%; max-width: 400px; margin-left: -40px; } .teaching-sec { padding: 130px 0 100px; } .teaching-bg2 { position: absolute; right: 10%; top: 36%; max-width: 5vw; } /* ---------------------------{[[ About Page End ]]}---------------------------*/ /* ---------------------------{[[ Services Page start ]]}---------------------------*/ .guiding-wrap { transform: scale(.8); margin: -60px 0; } .comprehensive-text { padding: 80px 20px 20px; margin: -128px 0 0; } /* ---------------------------{[[ Therapy Page End ]]}---------------------------*/ /* ---------------------------{[[ Contact Page start ]]}---------------------------*/ .core-icon { width: 110px; } .core-icon img { width: 44px; aspect-ratio: 1; object-fit: contain; } .core-box { min-height: 160px; padding: 24px; gap: 16px; border-radius: 24px; } .contact-map-box { padding: 35px 35px; } .contact-map-box .map-pointer-list li img { width: 32px; height: 32px; object-fit: contain; margin-right: 10px; } .contact-map-hotspot .map-hotspot .map-hotspot__button { transform: scale(.8); } .information-icon { width: 100px; border-radius: 20px; margin: 0 auto 20px; } .information-icon img { width: 50px; } .info-line { width: 95%; bottom: 0; left: 3%; height: 72%; } .info-shape { height: 97%; bottom: 0; left: 0; } /* ---------------------------{[[ Contact Page End ]]}---------------------------*/ /* ================== Element Image ================= */ .part-element4 { max-width: 12vw; top: 84px; left: 1%; } .part-element5 { max-width: 11vw; right: 2.4%; top: 112px; } .part-element8 { max-width: 10vw; left: 3%; top: 180px; } .part-element10 { max-width: 7vw; left: 1%; top: 43%; } .part-element11 { max-width: 7vw; right: 2%; bottom: 22%; } .part-element13 { max-width: 10vw; right: 6.2%; top: 95px; } /* ================== Element Image ================= */ .blog-details-section .app-line-2{ left: auto; right: 15px; top: 48%; bottom: auto;} .landing-why-sec { padding-bottom: 180px; } } @media only screen and ( max-width: 1199px ) { .swiper-button-next, .swiper-button-prev { width: 45px; height: 45px; } /* ===========mobile nav========== */ .main-header { padding: 15px 0; } .hamburger-nav { display: inline-block; margin: 0 0 0 15px; border-radius: 50%; overflow: hidden; isolation: isolate; position: relative;} .hamburger-nav::before{ content: ""; position: absolute; inset: 0; margin: auto; width: 0; height: 0; background-color: #0089D1; z-index: -1; border-radius: 50%; transition: var(--transition-common);} .hamburger-nav .ham { width: 60px; height: 60px; } .hamburger-nav.ham-motion::before { width: 100%; height: 100%; } .hamburger-nav.ham-motion .line{ stroke: #fff; } .mobile-menu ul li a.btn { display: inline-block; padding: 15px 20px;} .mobile-menu-container{display: block;} .header-section .right-panel{ -ms-flex-pack: end!important; justify-content: flex-end!important; } .mobile-menu-logo{max-width: 50px; margin: 0 auto; text-align: center; display: none;} .mobile-menu ul li a, .mobile-menu ul li a, .mobile-menu ul li { font-size: 20px; text-align: left; text-transform: uppercase; } .mobile-menu ul li a::before{ content: ""; display: block; background: url(../images/mobile-menu-star.svg); background-position: center !important; background-size: 100% !important; background-repeat: no-repeat !important; width: 0; height: 24px; transition: var(--transition-common); opacity: 0; pointer-events: none;} .mobile-menu ul li:hover>a, .mobile-menu ul li.current_page_item>a { background: #FFFFFF; box-shadow: -3px -3px 0px 0px #86C5E2; color: #FF1654; border-radius: 20px;padding-left: 16px;} .mobile-menu ul li:hover>a, .mobile-menu ul li.current_page_item>a { background: #FFFFFF; box-shadow: -3px -3px 0px 0px #86C5E2; color: #FF1654; border-radius: 20px;padding-left: 16px;} .mobile-menu ul li:hover>a, .mobile-menu ul li.current_page_item>a{ box-shadow: none;} .mobile-menu ul li:hover>a::before, .mobile-menu ul li.current-menu-item>a::before { width: 24px; opacity: 1; margin-right: 8px;} /* .mobile-menu ul li ul.sub-menu li {margin: 11px 0;padding: 0 20px;} */ .mobile_menu_btn{margin-top: 30px;} .mobile_menu_btn a.btn.plbig{padding-left: 50px;} .contact_icon { width: 41px; height: 41px; top: 5px; left: 4px; font-size: 20px; } .mobile_menu_btn a.plbig{margin-right: 15px;} .common-padd-xl-top { padding-top: 140px; padding-bottom: 60px; } .mobile-menu ul li span {margin-left: 10px; } .main-menu, .main-header .hdr-rt.mob-hide { display: none; } .mobile-menu ul li.menu-item-has-children.menu-open:after {transform: rotate(225deg); transition: border-width 150ms ease-in-out; -webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -ms-transition: all 0.4s ease; -o-transition: all 0.4s ease; transition: all 0.4s ease; top: 15px; } .mobile-menu ul li a { padding: 15px 0; font-family: var(--secondary-font); font-size: 20px; color: #424242; display: flex; align-items: center;} header .mobile-menu ul {max-width: 750px;margin: 0 auto;} header span.dropdown-icon-menu.active::before { transform: rotate(227deg); top: 17px } header span.dropdown-icon-menu::before { content: ""; position: absolute; top: 12px; right: calc(50% - 6px); box-sizing: border-box; height: 12px; width: 12px; border-style: solid; border-color: #424242; border-width: 0 2px 2px 0; transform: rotate(45deg); transition: border-width 150ms ease-in-out; -webkit-transition: all .4s ease; -moz-transition: all .4s ease; -ms-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; margin: 0 auto; } header span.dropdown-icon-menu { margin-left: 10px; content: ""; position: absolute; top: 15px; box-sizing: border-box; height: 40px; width: 40px; transform: rotate(0deg); transition: border-width 150ms ease-in-out; -webkit-transition: all .4s ease; -moz-transition: all .4s ease; -ms-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; left: unset; right: 5px; margin: 0 auto; z-index: 9999; display: flex; justify-content: center; align-items: center; } .mobile-menu-container ul.sub-menu { position: relative; max-height: 0; overflow: hidden; transition: max-height .6s ease-out; border-radius: 10px; margin-top: 8px; padding: 8px; background: #fff; box-shadow: 0px 5px 20px 0px #00000014; } .mobile-menu-container ul.sub-menu.sub-menu-open { transform: scaleY(1); max-height: 300px;} .mobile-menu ul li.menu-item-has-children > a{padding-right: 0;} /* ===========mobile nav========== */ .top-cloud, .top-cloud img { width: 100%; min-height: 75vh; object-fit: cover; } /* ---------------------------{[[ Home Page start ]]}---------------------------*/ .banner { min-height: 72vh; min-height: 72svh; } .text-box { max-width: 800px; margin: 0 auto; } .site-line1{ bottom: -75px;} .site-line2{ top: -160px;} .contact-icon { width: 55px; height: 55px; margin-right: 10px; } .contact-list .contact-dtls a{ font-size: 17px;} /* ---------------------------{[[ Home Page end ]]}---------------------------*/ /* ---------------------------{[[ About Page start ]]}---------------------------*/ .white-child-bg { position: absolute; width: calc(100% + 12px); margin-left: -36px; } .curve-line { width: calc(100% + 15px); left: -28px; z-index: 1; top: -6px; } .approach-icon2 { width: 93%; left: 3px; top: -6px; } .vector-line1 { position: absolute; right: 120px; top: 110px; max-width: 7vw; } .vector-line2 { position: absolute; right: 37px; bottom: 45px; width: 7.4vw; } .approach-text-box { padding: 67px 62px; } .leader-img-box { margin: 0 auto 38px; } .app-line2 { position: absolute; right: 0px; bottom: -6vw; max-width: 10vw; } .white-child-img { width: calc(100% + 37px); margin-left: -37px; } .curve-line { width: calc(100% + 19px); left: -33px; z-index: 1; top: -6px; } .therapy-white-box { padding: 50px; } .teaching-card { padding: 36px; } .teaching-row .col-lg-10:not(:last-child) { margin-bottom: 30px; } .team-popup-card .modal-body { padding: 20px 15px 20px 35px; } .team-popup-card .leader-img-box { padding: 0 5%; } .team-popup-card .modal-body .leader-content { max-height: 480px; overflow: auto; padding-right: 20px; padding-bottom: 10px; } .swiper-button-next { right: -16px; } .swiper-button-prev { left: -16px; } .rbts-section .swiper-button-prev{ left: -30px;} .rbts-section .swiper-button-next { right: -25px; } /* ---------------------------{[[ About Page end ]]}---------------------------*/ /* ---------------------------{[[ Services Page start ]]}---------------------------*/ .guiding-svg { width: 100%; max-width: 920px; margin: 0 auto; } .guiding-steps { max-width: 260px; position: absolute; } .guiding-steps-wrap .guiding-steps:nth-child(1) { top: 49px; left: 40%; } .guiding-steps-wrap .guiding-steps:nth-child(2) { top: 286px; left: -74px; text-align: right; max-width: 260px; } .guiding-steps-wrap .guiding-steps:nth-child(3) { top: 275px; right: -62px; } .guiding-steps-wrap .guiding-steps:nth-child(4) { bottom: 13px; right: 42%; text-align: right; } .comprehensive-section .container { max-width: 720px; } .comprehensive-text { padding: 80px 30px 80px; margin: -170px 0 24px; } /* ---------------------------{[[ Services Page end ]]}---------------------------*/ /* ---------------------------{[[ Contact Page start ]]}---------------------------*/ .core-text h4 { margin-bottom: 10px; } .contact-map-box { padding: 24px 24px; border: 6px solid #B9E6FF; border-radius: 24px; } .contact-map-box p { margin-bottom: 16px; } .contact-map-box .map-pointer-list li:not(:last-child) { margin-bottom: 14px; } .contact-map-hotspot { border-radius: 20px; border: 6px solid #F0FAFF; width: calc(100% + 14.5%); } .information-box { padding: 20px 20px 90px; max-width: 380px; margin: 0 auto; } /* ---------------------------{[[ Contact Page end ]]}---------------------------*/ /* ================== Element Image ================= */ .part-element6 { max-width: 10vw; right: 10%; bottom: 54px; } .part-element9 { max-width: 11vw; right: 1.4%; bottom: 280px; } .part-element7 { max-width: 12vw; left: 7.5%; top: 100px; } .part-element16 { max-width: 9vw; left: 2.1%; bottom: 35px; } .part-element17 { max-width: 10vw; right: 2.2%; top: 11%; } /* ================== Element Image ================= */ /* LANDING PAGE RESPONSIVE START HERE */ .my-100 { margin-top: 85px; margin-bottom: 85px; } .inner-banner.landing-banner{ min-height: 400px; padding-top: 100px; padding-top: 170px;} .contact-form-wrap{ padding: 40px;} .call-btm a{ font-size: 26px;} /* .testimonial-slider-outer{ margin-left: 0;} */ .landing-faq-sec .accordion-body { padding: 20px; } .rbts-section.common-padd { padding-bottom: 170px; } /* LANDING PAGE END HERE */ /* ================== BLOG Page ================= */ .blog-details-section .inner-content .blog-details-thumbnail{ margin-bottom:25px} /* ================== BLOG Page ================= */ } @media only screen and ( max-width: 991px ) { h1, h2, h3, h4, h5, h6 { margin: 0 0 16px; } .mb-24 { margin-bottom: 16px; } .mb-30 { margin-bottom: 16px; } .common-padd { padding-top: 60px; padding-bottom: 60px; } .common-padd-top { padding-top: 60px; } .common-padd-bottom{ padding-bottom: 60px;} .pt-200 { padding-top: 80px; } .btn { padding: 0; height: 48px; padding: 12px 14px 12px 20px; } .btn::before { width: calc(100% - 40px); } .btn::after { margin-left: 26px; } .tape { position: absolute; top: -53px; left: 50%; z-index: 2; transform: translate(-50%, 0) rotateY(180deg) scale(.8); } .top-cloud, .top-cloud img { width: 100%; min-height: 70vh; object-fit: cover; } .slider-arrow-row.show-mobile-arrow { display: flex !important; justify-content: center; gap: 15px; margin-top: 25px;} .slider-arrow-row.show-mobile-arrow .swiper-button-next, .slider-arrow-row.show-mobile-arrow .swiper-button-prev { display: flex; position: relative; inset: 0; } /* ---------------------------{[[ Home Page start ]]}---------------------------*/ .banner { padding-top: 180px; min-height: 80vh; min-height: 80svh; } .site-line1, .site-line2, .site-line3, .site-line4{ display: none;} .inner-banner { min-height: 400px; padding-top: 160px; } .child-row .col-lg-3:nth-child(odd) .tape { transform: translate(-50%, 0) rotateY(0deg) scale(.8); } .child-row .child-inner::before { content: ''; position: absolute; top: -6px; left: -7px; right: 5px; bottom: -6px; border: 2px solid #000; border-radius: 360px; } .ban-arrow { top: 200px; right: -6px; max-width: 26vw; } .insurances-section .row { flex-direction: column-reverse; } .welcome-text-box { margin-bottom: 20px; text-align: center; } .welcome-text-box h2 { margin: 0 0 10px; } .bg-image1 { bottom: 125px; right: 0; max-width: 48vw; pointer-events: none; } .insurances-logos-wrap { -webkit-mask-image: linear-gradient( to right, transparent 0%, rgba(0,0,0,0.2) 8%, rgba(0,0,0,0.6) 15%, black 25%, black 75%, rgba(0,0,0,0.6) 85%, rgba(0,0,0,0.2) 92%, transparent 100% ); mask-image: linear-gradient( to right, transparent 0%, rgba(0,0,0,0.2) 8%, rgba(0,0,0,0.6) 15%, black 25%, black 75%, rgba(0,0,0,0.6) 85%, rgba(0,0,0,0.2) 92%, transparent 100% ); } .together-section .justify-content-between { justify-content: center !important; } .together-text-box { max-width: 70%; text-align: center; margin: 0 auto 40px; } .bottom-qute-section.common-padd { padding-bottom: 120px; } .bg-image2 { top: 24%; left: 0; max-width: 55vw; } .bg-image3 { bottom: -6.9vw; right: 0px; z-index: -1; max-width: 40vw; } .footer-bottom-image-adjustment .bg-image3{ bottom: -8vw;} /* ---------------------------{[[ Home Page end ]]}---------------------------*/ /* ---------------------------{[[ About Page start ]]}---------------------------*/ .children-sec { padding-top: 100px; } .children-sec .row { flex-direction: column-reverse; } .child-girl { max-width: 460px; margin: 30px auto 0; } .child-content { text-align: center; max-width: 500px; margin: 0 auto; } .vector-line1 { display: none; } .vector-line2 { position: absolute; right: 37px; bottom: 45px; width: 13.4vw; } .child-star { position: absolute; top: 10vw; z-index: 1; left: 10vw; width: 8vw; } .approach-heading h2 { margin-bottom: 40px; text-align: center; } .white-child-img { width: 380px; margin: 0 auto; text-align: center; } .white-child-bg { position: absolute; width: 380px; left: 55.5%; transform: translate(-50%, 0); } /* .white-child-img figure { padding: 0 0 151%; } .white-child-img figure img { transform: scale(0.9); } */ .approach-content { margin: 15px auto; max-width: 507px; text-align: center; } .curve-line { width: 384px; left: 49%; z-index: 1; top: -5px; transform: translate(-50%, 0); text-align: center; } .therapy-white-box { padding: 36px; border-radius: 25px; } .purpose-box { text-align: center; margin: 0 auto 40px; max-width: 460px; } .purpose-img-box2 { position: relative; width: 100%; max-width: 325px; margin-left: -32px; } .purpose-img-box3 { position: relative; width: 80%; margin: 0 auto; } .teaching-sec { padding: 100px 0 80px; } .team-popup-card .modal-body .row{ justify-content: center;} .team-popup-card button.btn-close { width: 70px; height: 70px; top: 0; } .team-popup-card .leader-content span { margin-bottom: 20px; } .swiper-button-next, .swiper-button-prev { display: none; top: 56%; } .rbts-section .swiper-button-next, .rbts-section .swiper-button-prev { top: 34%; } .rbts-section.common-padd { padding-bottom: 110px; } /* ---------------------------{[[ About Page end ]]}---------------------------*/ /* ---------------------------{[[ Services Page start ]]}---------------------------*/ .guiding-svg { width: 100%; max-width: 660px; margin: 0 auto; } .guiding-wrap { transform: scale(.8); margin: -20px 0; } .guiding-steps { max-width: 220px; position: absolute; } .guiding-steps-wrap .guiding-steps:nth-child(1) { top: 10px; left:42%; } .guiding-steps-wrap .guiding-steps:nth-child(2) { top: 184px; left: -64px; text-align: right; max-width: 220px; } .guiding-steps-wrap .guiding-steps:nth-child(3) { top: 186px; right: -62px; } .guiding-steps-wrap .guiding-steps:nth-child(4) { bottom: -5px; text-align: right; } .guiding-section.common-padd { padding-bottom: 80px; } /* ---------------------------{[[ Services Page end ]]}---------------------------*/ /* ---------------------------{[[ Careers Page start ]]}---------------------------*/ .core-section.common-padd { padding-bottom: 100px; } /* ---------------------------{[[ Careers Page end ]]}---------------------------*/ /* ---------------------------{[[ Contact Page start ]]}---------------------------*/ .part-img-box { width: 100%; margin: 0; } .part-icon { width: 94%; right: 14px; top: 2px; z-index: -1; } .contact-map-hotspot { border-radius: 20px; border: 6px solid #F0FAFF; width: 100%; } .contact-map-box { padding: 24px 24px; border: 6px solid #B9E6FF; border-radius: 24px; max-width: 70%; margin: -80px auto 0; text-align: center; } /* span.wpcf7-spinner.spinner-border.spinner-border-sm.ajax-loader { position: absolute; top: 18px; left: -19px; bottom: 41%; width: 12px; min-width: 12px; height: 12px; z-index: 2; max-height: 12px; max-width: 12px; border: 1px solid #ffffff; opacity: 1 !important; background-color: transparent !important; border-right-color: #00000000 !important; display: unset; transform: unset; } */ .information-section.common-padd { padding-bottom: 60px; } /* ---------------------------{[[ Contact Page end ]]}---------------------------*/ /* ---------------------------{[[ Footer start ]]}---------------------------*/ footer #f-logo-img { max-width: 309px; margin: 0 auto 40px; } footer ul.footer-menu { list-style: none; padding: 0; margin: 0 0 40px; } footer ul.footer-menu li { line-height: 1.2; text-align: center; } footer ul.footer-menu li:not(:last-child) { margin-bottom: 20px; } footer .footer-media ul { padding: 0; margin: 0px 0 30px; justify-content: center; } .contact-list li { display: flex; align-items: center; justify-content: center; flex-direction: column; } .contact-list li:not(:last-child) { margin-bottom: 35px; } .contact-icon { margin: 0 0 15px; } .contact-dtls { text-align: center; } .foot-col h5 { margin: 0 0 16px; text-align: center; } .foot-col h4 { margin-bottom: 20px; text-align: center; } .ban-form h2 { margin-bottom: 20px; } .btn.btn.btn-white.w-100::before { background-color: #FFF; width: calc(100% - 50px); } .lft-box { text-align: center; } .end-footer .right-box p { margin: 8px 0 0; text-align: center; } .footer-top { padding: 40px 0 40px; } /* ---------------------------{[[ Footer end ]]}---------------------------*/ /* ================== Element Image ================= */ .part-element1 { max-width: 14vw; left: 1.5%; top: 80px; } .part-element2 { max-width: 9vw; right: 1%; top: 5px; } .part-element3 { max-width: 10vw; left: 2%; top: 40px; } .part-element4 { max-width: 12vw; top: 8px; left: 1%; } .part-element5 { max-width: 11vw; right: 1.4%; top: 72px; } .part-element6 { max-width: 15vw; right: 2%; bottom: 14px; } .part-element7 { max-width: 15vw; left: 2.5%; top: 60px; } .part-element8 { max-width: 10vw; left: 3%; top: 80px; } .part-element9 { max-width: 11vw; right: 1.4%; bottom: 210px; } .part-element10 { max-width: 11vw; left: 4%; top: 27%; } .part-element11 { max-width: 14vw; right: 6%; bottom: 14%; } .part-element12 {max-width: 12vw;right: 5.2%;top: 20px;} .part-element13 { max-width: 11vw; right: 6.2%; top: 75px; } .part-element15 { max-width: 14vw; left: 4%; top: 19.5%; } .part-element16 { max-width: 10vw; left: 2.1%; bottom: 25px; } .part-element17 { max-width: 10vw; right: 1.2%; top: 8%; } /* ================== Element Image ================= */ /* LANDING PAGE RESPONSIVE START HERE */ .inner-banner.landing-banner { min-height: 330px; padding-top: 150px; } .landing-conatact-sec { padding-top: 20px; } .contact-form-wrap{ padding: 30px 25px;} .landing-conatact-sec .contact-info-wrap { margin-top: 25px; text-align: center; } .landing-conatact-sec .call-btm { margin: 0 auto; } .landing-why-sec .row { justify-content: center !important; } .landing-why-sec .info-wraper { margin-top: 25px; text-align: center; } .approach-items-outer .row { justify-content: center !important; row-gap: 25px; text-align: center;} .testimonial-slider-outer{ margin-right: 0; padding: 45px 30px;} .testimonial-image-outer { margin-left: 0; margin-bottom: 25px;} .landing-service-sec .testimonial-row{ justify-content: center;} .landing-testimonial-card .author-details { margin: 15px auto 0; padding: 0; border: 0; height: auto;} /* .landing-service-sec .swiper-pagination .swiper-pagination-bullet { background: #9cdcfd; } .landing-service-sec .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active { background: #00a6fb; } */ .my-100 { margin-top: 60px; margin-bottom: 60px; } .landing-faq-sec .row { justify-content: center !important; } /* .landing-faq-sec .col-xl-5.col-md-8{ width: 80%;} */ .landing-faq-sec .cloud-img-box { margin-bottom: 85px;} .landing-faq-sec .accourdion-wraper h2{ text-align: center;} .landing-why-sec { padding-bottom: 140px; } /* LANDING PAGE END HERE */ /* ================== BLOG Page ================= */ .blog-details-section .inner-content { margin: -260px auto 0; } .blog-details-section .app-line-1{ width: 10vw; top: 15%; left: 10px;} .blog-details-section .app-line-2{ width: 15vw;top: 32%;} /* ================== BLOG Page ================= */ } @media only screen and ( max-width: 767px ) { .common-padd { padding-top: 40px; padding-bottom: 40px; } .common-padd-top { padding-top: 40px; } .main-header .logo { max-width: 110px; } .main-header.fixed .logo { max-width: 90px; } /* .hamburger-nav { display: inline-block; margin: -30px -20px -30px -13px; transform: scale(0.7); } */ .hamburger-nav .ham { width: 50px; height: 50px; } .btn { padding: 0; height: 42px; padding: 10px 14px 10px 15px; } .btn::after { width: 18px; height: 18px; } .btn::before { width: calc(100% - 42px); } .btn:hover::after, .btn:first-child:active::after { transform: translate(-10px, 0px) rotate(180deg); } form .btn{ padding: 10px 20px 10px 22px;} .pt-200 { padding-top: 60px; } p { margin: 0 0 16px; } header .mobile-menu ul { max-width: 100%; margin: 0 auto; } /* ---------------------------{[[ Home Page start ]]}---------------------------*/ .banner { padding-top: 110px; min-height: 100vh; min-height: 100svh; padding-bottom: 30px; } .text-box p { max-width: 1175px; margin: 0 auto 15px; } .inner-banner { min-height: 310px; padding-top: 130px; } .child-row { margin: 55px 0 0; row-gap: 60px; } .child-row .col-lg-3:nth-child(odd) { transform: translate(0, 0); } .child-row .child-inner::before { top: -5px; left: -7px; right: 6px; bottom: -5px; } .together-img-box { width: 100%; margin: 0; } .together-icon1 { width: 94%; right: 12px; top: 0; z-index: -1; } .together-icon2 { width: 93%; right: 9px; top: -8px; } .bg-image1 { bottom: -185px; right: 0; max-width: 73vw; pointer-events: none; } .together-text-box { max-width: 99%; text-align: center; margin: 90px auto 21px; } .bg-image2 { top: 36%; left: 0; max-width: 72vw; } .ban-form h2 { max-width: 300px; margin: 0 auto 20px; } .footer-bottom-image-adjustment .bg-image3{ bottom: -7vw;} /* ---------------------------{[[ Home Page end ]]}---------------------------*/ /* ---------------------------{[[ About Page start ]]}---------------------------*/ .white-child-img { width: 300px; margin: 0 auto; text-align: center; } .white-child-bg { position: absolute; width: 300px; left: 56.5%; transform: translate(-50%, -3px); } .curve-line { width: 302px; left: 48%; z-index: 1; top: -6px; transform: translate(-50%, 0); text-align: center; } .approach-content { margin: 20px auto 30px; max-width: 507px; text-align: center; } .approach-img-box { max-width: 320px; margin: 0 auto; } .approach-icon2 { width: 320px; left: 50%; top: 0; transform: translate(-53%, -10px); } .children-sec { padding-top: 60px; } .child-girl { max-width: 260px; margin: 30px auto 0; } .vector-line2 { position: absolute; right: 16px; bottom: 6vw; width: 15.4vw; } .therapy-white-box { padding: 20px; border-radius: 16px; } .approach-text-box { padding: 58px 30px; max-width: 320px; margin: 0 auto 30px; } .purpose-box { text-align: center; margin: 0 auto 24px; max-width: 460px; } .purpose-icon1 { width: 100%; left: -7px; top: -4px; } .purpose-img-box1 { position: relative; width: 100%; max-width: 160px; } .purpose-icon2 { width: calc(100% + 9px); left: -7px; top: -7px; } .purpose-img-box2 { position: relative; width: 100%; max-width: 200px; margin-left: -20px; } .purpose-img-box3 { position: relative; width: 90%; margin: 0 auto; } .teaching-sec { padding: 60px 0 50px; } .teaching-sec h2 { margin-bottom: 20px; } .teaching-card { padding: 24px; border-radius: 20px; } .teaching-card { box-shadow: 6px 6px 0 #6A4C93; } .teaching-row .col-lg-10:not(:last-child) { margin-bottom: 20px; } .teaching-row .col-lg-10:nth-child(even) .teaching-card { box-shadow: 6px 6px 0 #FF6700; } .teaching-bg1 { display: none; } .children-sec-bottom { position: absolute; bottom: -1px; line-height: 0; } .team-popup-card .leader-img-box{ max-width: 100%;} /* .team-popup-card .modal-dialog{ max-height: calc(100dvh - 150px); display: flex; flex-direction: column;} .team-popup-card .modal-body, .team-popup-card .modal-body .row{ height: 100%;} */ .team-popup-card button.btn-close { width: 55px; height: 55px; } .team-popup-card .modal-body { padding: 25px 15px 15px 15px; border-radius: 0 0 25px 25px; } .team-popup-card .modal-body .leader-content { max-height: 450px; padding-right: 15px; } /* ---------------------------{[[ About Page end ]]}---------------------------*/ /* ---------------------------{[[ Services Page start ]]}---------------------------*/ .guiding-svg { display: none; } .guiding-wrap { transform: scale(1); margin: 0; } .guiding-steps { max-width: 90% !important; position: relative; top: auto !important; left: auto !important; right: auto !important; bottom: auto !important; text-align: center !important; background: #FFF; padding: 20px; margin: 0 auto; margin-bottom: 16px; border-radius: 14px; border: 2px dashed #00A6FB;} .comprehensive-section .container { max-width: 320px; } .comprehensive-text { padding: 80px 20px 40px; margin: -150px 0 24px; border-radius: 140px 140px 24px 24px; } /* ---------------------------{[[ Services Page end ]]}---------------------------*/ /* ---------------------------{[[ Contact Page start ]]}---------------------------*/ .core-box { min-height: 160px; padding: 15px; gap: 12px; border-radius: 24px; flex-direction: column; text-align: center; height: calc(100% - 16px); margin-bottom: 16px;} .core-icon { width: 90px; } .core-icon img { width: 38px; aspect-ratio: 1; object-fit: contain; } .contact-form-wrap { border-radius: 16px; padding: 24px 20px; } .contact-map-box { padding: 20px 20px; border: 6px solid #B9E6FF; border-radius: 20px; max-width: 100%; margin: 10px auto 0; text-align: center; } .contact-map-hotspot .map-hotspot .map-hotspot__button { position: relative; width: 15px; z-index: 1; } .contact-map-box .map-pointer-list li img { width: 22px; height: 22px; object-fit: contain; margin-right: 10px; } .contact-map-hotspot .map-hotspot__label { padding: 6px 5px 6px; width: 90px; max-width: 110px; bottom: 29px; } .contact-map-hotspot .map-hotspot__label h6 { font-size: 14px; } .information-box { padding: 10px 20px 70px; max-width: 320px; margin: 0 auto 30px; } .information-icon { width: 80px; border-radius: 15px; margin: 0 auto 14px; } .information-icon img { width: 40px; } .info-line { width: 95%; bottom: 0; left: 3%; height: 78%; } .info-shape { height: 105%; bottom: 0; left: 0; } /* span.wpcf7-spinner.spinner-border.spinner-border-sm.ajax-loader { top: 15px;} */ /* ---------------------------{[[ Contact Page end ]]}---------------------------*/ /* ---------------------------{[[ Footer start ]]}---------------------------*/ footer #f-logo-img { max-width: 190px; margin: 0 auto 40px; } .end-footer .container { padding: 20px 14px 20px; } .end-footer .lft-box h6 { margin-bottom: 14px; line-height: 1.3; } .end-footer .right-box p { margin: 18px 0 0; text-align: center; } /* ---------------------------{[[ Footer end ]]}---------------------------*/ /* ================== Element Image ================= */ .part-element1 { max-width: 16vw; left: 2.5%; top: 20px; } .part-element2 { display: none; } .part-element3 { max-width: 13vw; left: 2%; top: 26px; } .part-element4 { max-width: 16vw; top: 8px; left: 1%; } .part-element5 { max-width: 14vw; right: 1.4%; top: 32px; } .part-element6 { max-width: 19vw; right: 2%; bottom: 34px; } .part-element7 { max-width: 15vw; left: 2.5%; top: 80px; } .part-element8 { max-width: 15vw; left: 2%; top: 25px; } .part-element9 { display: none;} .part-element10 { max-width: 13vw; left: 3%; top: 28%;} .part-element11 { display: none;} .part-element12 { max-width: 13vw; right: 3.2%; top: 10px;} .part-element13 { display: none; } .part-element14 { max-width: 18vw; right: 2.2%; top: 8px; } .part-element16 { max-width: 15vw; left: 2.1%; bottom: 15px; } .part-element17 { max-width: 15vw; right: 1.2%; top: 5%; } /* ================== Element Image ================= */ /* LANDING PAGE RESPONSIVE START HERE */ .my-100 { margin-top: 30px; margin-bottom: 30px; } .why-img-box { margin: 0; width: 100%; } .why-icon { width: 92%; left: 23px; top: 15px; } .testimonial-slider-outer{ text-align: center; padding: 30px 15px; border-radius: 15px;} .landing-testimonial-slider { padding-bottom: 3px;} .landing-testimonial-card .author-details{ margin: 20px auto 0; padding: 0; border-left: 0; height: auto;} .testimonial-slider-outer .slider-arrow-row { position: static; display: none !important; } .testimonial-slider-outer .slider-arrow-row>*{ display: flex;} .testimonial-image-outer { max-width: 90%; margin: 0 auto 25px; } .landing-service-box { border-radius: 15px; flex-wrap: wrap; justify-content: center; padding: 25px 20px;} .landing-service-box .landing-service-img{ width: 75%; margin-bottom: 25px;} .landing-service-text{ width: 100%; text-align: center; padding: 0;} .landing-service-row .col-lg-12:nth-child(even) .landing-service-box .landing-service-text{ padding: 0;} .magical-cloud { padding: 30px 12px; background: #FFF; border: 2px dashed #00A6FB; border-radius: 20px; } /* .landing-faq-sec .col-xl-5.col-md-8{ width: 100%;} */ .landing-faq-sec .cloud-img-box { margin-bottom: 50px; } .landing-faq-sec .cloud1 { max-width: 30%; bottom: 0; } .landing-faq-sec .cloud2 { max-width: 20%; bottom: 0; left: 12%; } .landing-faq-sec .cloud3 { max-width: 35%; bottom: 0; } .landing-faq-sec .cloud4 { max-width: 25%; bottom: -15px; right: 20%; } .approach-item.common-padd-bottom{ padding-bottom: 30px;} .landing-why-sec { padding-bottom: 100px; } /* LANDING PAGE RESPONSIVE END HERE */ /* ================== BLOG Page ================= */ .blog-details-section .inner-content { margin: -190px auto 0; } .blog-details-section .details-content ul { padding: 20px 15px; border-radius: 16px; } .blog-details-section .details-content ul li { padding-left: 37px; } .blog-details-section .details-content ul li::before { width: 25px; height: 25px; } .blog-details-section .app-line-2{ top: 25%;} } @media only screen and ( max-width: 576px ) { .bottom-qute-section .site-line3{ opacity: 0;} /* ---------------------------{[[ About Page start ]]}---------------------------*/ .team-popup-card .modal-dialog{ margin-top: 30px; margin-bottom: 30px; } .team-popup-card .modal-body .leader-content { max-height: none; padding-right: 0; text-align: center !important;} .team-popup-card .modal-body .leader-content::-webkit-scrollbar {width: 6px; height: 6px; } /* ---------------------------{[[ About Page ]]}---------------------------*/ } @media only screen and ( max-width: 575px ){ .hamburger-nav{ margin: 0;} .hamburger-nav .ham { width: 45px; height: 45px; } .mobile-menu-container .inner-container{ padding-bottom: 80px; padding-top: 120px; overflow: hidden; height: calc(100svh + 30px);} .mobile-menu { height: calc(100vh - 190px); overflow: auto; padding-top: 10px;} .mobile-menu-container .inner-container .btns-wrap { position: absolute; z-index: 99; bottom: 15px; right: 0; left: 0; padding: 0 24px;} .mobile-menu-container .inner-container .btns-wrap::before { content: ""; position: absolute; inset: auto 0 -50px 0; width: 100%; height: 160px; background: linear-gradient(180deg, rgb(205 238 254 / 4%) 0%, rgb(205 238 254) 50%, rgb(205 238 254) 100%); z-index: 1; } .mobile-menu-container .inner-container .btns-wrap .btn { width: 100%; height: 56px; padding: 16px; font-size: 18px; z-index: 5;} .mobile-menu-container .inner-container .btns-wrap .btn::after { position: absolute; right: 12px; width: 20px; height: 20px; } .mobile-menu-container .bg-image { bottom: 2%; max-width: 60%; } .mobile-menu-container .site-line .star4{ width: 55px;} .mobile-menu-container .site-line { max-width: 52%; bottom: 12%; } .mobile-menu-container .site-line .site-dot-line{ opacity: 1;} .mobile-menu-container { height: calc(100vh + 30px); } .mobile-menu-open .mobile-menu-container { top: -30px; } .footer-shape .lottie-shape{ max-width: 20vw;} .bottom-qute-section { padding-bottom: 100px;} .white-child-bg{ top: 5px;} .white-child-img figure img{ transform: scale(0.98); margin-left: -10px;} .curve-line{ top: -5px;} } @media only screen and ( max-width: 479px ) { .insurances-logos-wrap { -webkit-mask-image: linear-gradient( to right, transparent 0px, black 15px, black calc(100% - 15px), transparent 100% ); mask-image: linear-gradient( to right, transparent 0px, black 15px, black calc(100% - 15px), transparent 100% );} .marquee{ overflow: visible;} .landing-service-box { padding: 25px 15px; box-shadow: 4px 4px 0 #6A4C93;} .landing-service-row .col-lg-12:nth-child(even) .landing-service-box { flex-direction: row-reverse; box-shadow: -4px 4px 0 #6A4C93; } .landing-service-box .landing-service-img{ width: 100%;} .info-icon2 { left: 5px; top: -7px; } .blog-details-section .app-line-1 { top: 8%; left: 5px; } .blog-details-section .app-line-2 { top: 15%; right: 5px; } .common-padd.default-section{ padding-bottom: 60px;} .curve-line{ left: 47%;} /* ---------------------------{[[ About Page start ]]}---------------------------*/ .rbts-box .rbts-content h5{ font-size: 25px;} } @media only screen and ( max-width: 439px ) { /* ---------------------------{[[ About Page start ]]}---------------------------*/ .team-popup-card .modal-body .col-8{ width: 80%;} /* ---------------------------{[[ About Page end ]]}---------------------------*/ } @media only screen and ( max-width: 419px ) { .main-header .logo { max-width: 100px; } .main-header .btn { font-size: 15px; height: 40px; padding: 8px 10px 8px 13px; } .main-header .btn::before { width: calc(100% - 32px); } .main-header .btn::after{ margin-left: 18px;} .mobile-menu-container .site-line{ max-width: 50%;} .mobile-menu-container .site-line .star4 { width: 42px; top: -10px; opacity: 0.6;} /* ---------------------------{[[ About Page start ]]}---------------------------*/ /* .team-popup-card .modal-body .leader-content{ max-height: 330px;} */ .curve-line{ left: 46%;} } @media only screen and ( max-width: 399px ){ .curve-line{ left: 45%;} } /*Media Query css*/