/* Author : theme_ocean Template Name: Eduleb - Education HTML Template Version : 1.0 */ /*============================================================= CSS INDEX ============================= 01. GENERAL STYLE (body, link color, section-title, preloader btn, overlay, section-padding etc) 02. START NAVIGATION 03. START HOME DESIGN 04. START COUNTER DESIGN 05. START TOP PROMO STYLE 06. START ABOUT DESIGN 07. START COURSE DESIGN 08. START PARTNER & VIDEO DESIGN 09. START TEAM DESIGN 10. START REVIEWS DESIGN 11. START BLOG DESIGN 12. START FOOTER DESIGN 13. START FREE COURSE+INSTRUCTOR CSS 14. START PRICING DESIGN 15. START CONTACT PAGE DESIGN 16. START FAQ DESIGN 17. START ERROR PAGE DESIGN 18. START SECTION TOP DESIGN =============================================================*/ /* * ---------------------------------------------------------------------------------------- * 01.GENERAL STYLE * ---------------------------------------------------------------------------------------- */ @import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700;800;900&display=swap'); body { color: #4a5355; font-family: "DM Sans", sans-serif; font-size: 16px; font-weight: 400; line-height: 26px; background: #fff; overflow-x: hidden; } html, body { height: 100%;position:relative; } h1, h2, h3, h4, h5, h6 { letter-spacing: 0px; margin: 0px; font-family: "Jost", sans-serif; color: #0b104a; font-weight: 400; } a { font-family: "Jost", sans-serif; text-decoration: none; color: #0b104a; -webkit-transition: all 0.2s ease 0s; transition: all 0.2s ease 0s; } a:hover { color: #fff; text-decoration: none; } a:focus { outline: none; text-decoration: none; } p { margin-bottom: 0; } ul, li { margin: 0; padding: 0; } ::-moz-selection { background: #525fe1; color: #ffffff; } ::selection { background: #525fe1; color: #ffffff; } fieldset { border: 0 none; margin: 0 auto; padding: 0; } /*START PRELOADER DESIGN*/ .preloaders { position: fixed; top: 50%; left: 50%; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; z-index: 99999; transform: translate(-50%, -50%); background: #525fe1; } .loader { width: 106px; height: 56px; display: block; margin: 30px auto; background-image: linear-gradient(#FFF 50px, transparent 0), linear-gradient(#FFF 50px, transparent 0), linear-gradient(#FFF 50px, transparent 0), linear-gradient(#FFF 50px, transparent 0), radial-gradient(circle 14px, #FFF 100%, transparent 0); background-size: 48px 15px , 15px 35px, 15px 35px, 25px 15px, 28px 28px; background-position: 25px 5px, 58px 20px, 25px 17px, 2px 37px, 76px 0px; background-repeat: no-repeat; position: relative; transform: rotate(-45deg); box-sizing: border-box; } .loader::after, .loader::before { content: ''; position: absolute; width: 56px; height: 56px; border: 6px solid #f26b65; border-radius: 50%; left: -45px; top: -10px; background-repeat: no-repeat; background-image: linear-gradient(#FFF 64px, transparent 0), linear-gradient(#FFF 66px, transparent 0), radial-gradient(circle 4px, #FFF 100%, transparent 0); background-size: 40px 1px , 1px 40px, 8px 8px; background-position: center center; box-sizing: border-box; animation: rotation 0.3s linear infinite; } .loader::before { left: 25px; top: 60px; } @keyframes rotation { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } ul{list-style:none;} /*END PRELOADER DESIGN*/ .no-padding { padding: 0 } /*END PRELOADER DESIGN*/ .section-padding {padding:80px 0;} /*START SECTION TITLE DESIGN*/ .section-title{margin-bottom:60px;} .section-title h2 { font-size: 40px; font-weight: 600; margin-top: 0; position: relative; line-height: 50px; } .section-title p{ width:60%; margin:auto; margin-top: 20px; } .section-title b{color:#525fe1;font-weight: 600;} @media only screen and (max-width:768px){ .section-title p{padding-right:0px;margin-bottom: 30px;} } @media only screen and (max-width:480px){ .section-title h2 {font-size:35px;} } /*END SECTION TITLE DESIGN*/ /*START SCROLL TO TOP*/ .topcontrol { background:none; border-radius: 30px; bottom: 5px; border:2px solid #525fe1; box-shadow: 0 1px 10px 0 rgba(0, 0, 0, 0.2); color: #525fe1; cursor: pointer; font-size: 22px; height: 50px; line-height: 47px; opacity: 1; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; position: fixed; right: 5px; text-align: center; -webkit-transition: all 0.2s ease 0s; transition: all 0.2s ease 0s; width: 50px; } .topcontrol:hover { background:#525fe1; border:2px solid #525fe1; color: #000; } /*END SCROLL TO TOP*/ /*START BTN*/ .btn_one { background: #525fe1; border: 1px solid #525fe1; padding: 15px 30px; border-radius: 2px; color: #fff; transition: 0.3s; font-weight: 600; } .btn_one i{margin-right:5px;} .btn_one:hover{ background:#f26b65; color:#fff; border: 1px solid #f26b65; } @media only screen and (max-width:960px){ .btn_one{ padding: 14px 25px; margin-top: 0px; } .btn_one i{margin-right:5px;display:none;} } .btn_two {} .btn_two:hover{} /*END BTN*/ /* * ---------------------------------------------------------------------------------------- * 01.END GENERAL STYLE * ---------------------------------------------------------------------------------------- */ /* * ---------------------------------------------------------------------------------------- * 02.START NAVIGATION * ---------------------------------------------------------------------------------------- */ .col-20{ width: 20%; } .col-60{ width: 60%; } .col-20{ width: 20%; } .site-logo{ width: 150px; } .site-logo a{ display: block; } .site-logo img{ max-width: 80%; } #navigation{ padding: 20px 65px; border-bottom: 1px solid #ddd; } .navigation2{ border-bottom: 0px !important; background:#fff; } @media only screen and (max-width:960px){ #navigation{border-bottom: 0px;} } .navbar-fixed { z-index: 999; position: fixed; opacity: .98; -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=98)"; width: 100%; top: 0; -webkit-animation: fadeInDown 800ms; animation: fadeInDown 800ms; -webkit-backface-visibility: hidden; border-radius: 0px; background: #fff; box-shadow: 10px 15px 18px rgba(23, 23, 36, 0.03); } @media only screen and (max-width:960px){ #navigation.navbar-fixed{display:none;} } #main-menu{ } #main-menu ul{ list-style-type: none; } #main-menu ul li { display: inline-block; padding: 0 15px; position: relative; line-height: 60px; } @media only screen and (max-width:1024px){ #main-menu ul li {padding: 0 6px;} } #main-menu ul li a { position: relative; text-transform: uppercase; color: #0b104a; font-weight: 600; transition: .5s; font-size: 16px; } #main-menu ul li a:hover, #main-menu ul li a:focus{ color: #525fe1; } #navigation .header-btn { padding-right:20px; } /* MOVE NAV LINKS SLIGHTLY LEFT */ #main-menu{ margin-left: -25px; } /* optional: if still not enough, increase -25px to -35px */ @media only screen and (max-width:1024px){ #main-menu{ margin-left: -15px; } } /*------------------------------- # Dropdwon menu --------------------------------*/ #navigation #main-menu ul li ul , #navigation #main-menu ul li ul li ul { background: #525fe1; -webkit-box-shadow: 0 0 10px 3px rgba(0,0,0,.05); box-shadow: 0 0 10px 3px rgba(0,0,0,.05); left: -55px; list-style: outside none none; margin: 0; opacity: 0; -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; padding:10px; position: absolute; text-align: left; top: 120%; -webkit-transition:all 0.5s ease 0s; -o-transition: all 0.5s ease 0s; transition: all 0.5s ease 0s; visibility: hidden; width: 210px; z-index: 999; border-radius: 4px; border-top: 2px solid #525fe1; } #navigation #main-menu .menu-item-has-children { position: relative; margin-right: 20px; } #navigation #main-menu .menu-item-has-children::after { position: absolute; content: "\e64b"; font-family: themify; margin-top: 0px; margin-left: 0; font-size: 10px; right: -10px; top: 0px; color: #0b104a; font-size: 13px; font-weight: 600; } #navigation #main-menu ul li ul li{ position: relative; } #navigation #main-menu ul li ul li ul{ top: 0; right: auto; left: 205px; } #navigation.navbar-fixed #main-menu ul li li a{ color: #fff; } #navigation #main-menu ul li:hover ul, #navigation #main-menu ul li ul li:hover > ul{ opacity: 1; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; visibility: visible; top: 100%; } #navigation #main-menu ul li ul li {display: block; margin: 0; padding: 0;} #navigation #main-menu ul li ul li a { color: #fff; display: block; font-size: 16px; line-height: 30px; font-weight: 600; padding: 5px 12px; position: relative; transition: all 0.3s ease 0s !important; visibility: inherit !important; opacity: inherit !important; text-transform: capitalize; } #navigation #main-menu ul li ul li a:hover{ color: #fff; background-color: #525fe1; text-decoration: none; } @media only screen and (max-width: 991px){ .col-60{ display: none!important; } #sm_menu_ham { display: block; top: 40px; right: 11%; position: absolute; } .sidebar{ padding-top: 100px; } } @media only screen and (max-width: 767px){ .spt-130 { padding-top: 90px; } #mobile_menu{ display: block; width: 100%; } } @media only screen and (max-width: 575px){ #navigation { padding: 30px 20px; } #sm_menu_ham { top: 40px; } } .header-btn{ display: inline-block; font-weight: 600; font-size: 18px; color: #0b104a; transition: .5s; } .header-btn:hover, .header-btn:focus{ color: #525fe1; } /* * ---------------------------------------------------------------------------------------- * 02.END NAVIGATION * ---------------------------------------------------------------------------------------- */ /* * ---------------------------------------------------------------------------------------- * 03.START HOME DESIGN * ---------------------------------------------------------------------------------------- */ .home_bg { height: 850px; position:relative; } @media only screen and (max-width:960px){ .home_bg {height:650px;} } @media only screen and (max-width:480px){ .home_bg {height:800px;} } .hero-text{position:relative;} .hero-text h1 span{color: #525fe1;} .hero-text h1 { color: #0b104a; font-size: 64px; font-weight: 700; letter-spacing: 0; line-height: 74px; padding-top: 250px; margin-bottom: 20px; } @media only screen and (max-width:960px){ .hero-text h1 {padding-top:150px;font-size:64px;line-height:74px;} } @media only screen and (max-width:768px){ .hero-text h1 {padding-top:150px;font-size: 64px;line-height: 74px;} } @media only screen and (max-width:480px){ .hero-text h1 {padding-top:150px;font-size: 34px;line-height:44px;} } .hero-text p { width:80%; font-weight:500; margin-bottom: 30px; } /*SUBSCRIBE FIELD*/ .banner_subs { display: block; position: relative; margin-top: 30px; } @media only screen and (max-width:480px){ .banner_subs {display: none;} } .banner_subs button{border:none;} .home_si { background: #fff; border-radius: 0px; color: #0b104a; display: block; height: 70px; letter-spacing: 1px; margin: 0; padding: 0 60px 0 20px; text-transform: capitalize; width: 100%; } .home_si:focus{ outline:0 none; box-shadow:none; border: 1px solid #525fe1!important; } .home_sb button { background-color: #525fe1; border-radius: 0px; color: #fff; cursor: pointer; display: block; font-size: 20px; height: 60px; position: absolute; right: 5px; top: 5px; padding: 0 20px; width: 25%; transition: 0.3s; } .home_sb button:hover{ color:#fff; background:#f26b65; } /*END SUBSCRIBE FIELD*/ /*END SUBSCRIBE FIELD*/ /* MOVE HERO IMAGE TO BOTTOM */ .hero-text-img{ position: relative; height: 100%; display: flex; align-items: flex-end; } .hero-text-img img{ max-width: 1000px; width: 100%; height: auto; display: block; position: relative; top: 145px; /* increase more if needed */ } .hero-text-img img{ position: relative; } @media only screen and (max-width:960px){ .hero-text-img img{ display: block; width: 80%; margin: 0 auto; top: -30px; /* moves image upward */ } } @media only screen and (max-width:480px){ .hero-text-img img{ width: 85%; top: -20px; /* moves image upward */ } } /*HOME TWO BANNER CSS*/ .hero-text2{position:relative;} .hero-text2 h1 span{color: #f26b65;} .hero-text2 h1 { color: #fff; font-size: 64px; font-weight: 700; letter-spacing: 0; line-height: 74px; padding-top: 250px; margin-bottom: 20px; } @media only screen and (max-width:960px){ .hero-text2 h1 {padding-top:150px;font-size:64px;line-height:74px;} } @media only screen and (max-width:768px){ .hero-text2 h1 {padding-top:150px;font-size: 64px;line-height: 74px;} } @media only screen and (max-width:480px){ .hero-text2 h1 {padding-top:250px;font-size: 34px;line-height:44px;} } .hero-text2 p { width:80%; font-weight:500; margin-bottom: 30px; } .hero-text-img2 { position: absolute; bottom: 0; left:5%; } .hero-text-img2{} @media only screen and (max-width:960px) { .hero-text-img2 img{display:none;} } /*SUBSCRIBE FIELD*/ .banner_subs2 { display: block; position: relative; margin-top: 30px; } @media only screen and (max-width:480px){ .banner_subs2 {display: none;} } .banner_subs2 button{border:none;} .home_si2 { background: #fff; border-radius: 0px; color: #0b104a; display: block; height: 70px; letter-spacing: 1px; margin: 0; padding: 0 60px 0 20px; text-transform: capitalize; width: 100%; } .home_si2:focus{ outline:0 none; box-shadow:none; border: 1px solid #525fe1!important; } .home_sb2 button { background-color: #525fe1; border-radius: 0px; color: #fff; cursor: pointer; display: block; font-size: 20px; height: 60px; position: absolute; right: 5px; top: 5px; padding: 0 20px; width: 25%; transition: 0.3s; } .home_sb2 button:hover{ color:#fff; background:#f26b65; } .home_tag { margin-top: 30px; position: relative; } .home_tag span{color: #fff;} .home_tag a { color: #fff; font-weight: 600; padding: 0 5px; text-decoration: underline; transition: 0.3s; } .home_tag a:hover{color: #f26b65;} /*END SUBSCRIBE FIELD*/ /*END HOME TWO BANNER CSS*/ .home_ps { background: #fff; width: 250px; padding: 20px; border-radius: 5px; box-shadow: 0px 0 30px rgba(1, 41, 112, 0.08); position: absolute; top: 45%; right: 20%; left: 60%; } @media only screen and (max-width:1024px){ .home_ps {display:none;} } @media only screen and (max-width:880px){ .home_ps {display:none;} } @media only screen and (max-width:480px){ .home_ps {left: 35%;display:block} } .home_ps span { color: #2D36BB; background: #ECEDFF; width: 50px; float: left; height: 50px; line-height: 50px; border-radius: 30px; font-size: 20px; text-align: center; margin-right: 15px; } .home_ps h2{font-weight:500;} /* * ---------------------------------------------------------------------------------------- * 03.END HOME DESIGN * ---------------------------------------------------------------------------------------- */ /* * ---------------------------------------------------------------------------------------- * 04.START COUNTER DESIGN * ---------------------------------------------------------------------------------------- */ .count_area { position:relative; margin-top: -60px; padding-bottom:80px; } @media only screen and (max-width:960px) { .count_area {margin-top: 80px;} } .single-counter { background: #fff; border: 1px solid #ddd; border-radius: 20px; padding: 20px; box-shadow: 10px 15px 18px rgba(23, 23, 36, 0.04); } @media only screen and (max-width:960px) { .single-counter{margin-bottom:30px;} } .single-counter span { width: 50px; float: left; height: 50px; line-height: 50px; border-radius: 30px; font-size: 20px; text-align: center; margin-right: 15px; } .single-counter h2 { overflow: hidden; font-weight: 600; margin-bottom: 0; } .single-counter p{overflow: hidden;} .sc_one{color:#F26B65;background:#FFEFEE;} .sc_two{color:#2D36BB;background:#ECEDFF;} .sc_three{color:#57216C;background:#FDF3FA;} .sc_four{color:#448BB7;background:#EAFEFF;} /* * ---------------------------------------------------------------------------------------- * 04.END COUNTER DESIGN * ---------------------------------------------------------------------------------------- */ /* * ---------------------------------------------------------------------------------------- * 05. START TOP PROMO STYLE * ---------------------------------------------------------------------------------------- */ .tp_feature_p3{padding-bottom:50px;} .tp_feature{ background:#282a74; padding-bottom:50px; } .single_tp { margin-bottom: 30px; background: #fff; padding: 40px; box-shadow: 10px 15px 18px rgba(23, 23, 36, 0.03); } .single_tp span { width: 60px; float: left; height: 60px; line-height: 60px; text-align: center; border-radius: 30px; font-weight: 600; font-size: 26px; margin-right: 15px; } @media only screen and (max-width:880px){ .single_tp {margin-bottom:30px;} } .single_tp h3 { font-size: 19px; font-weight: 600; margin-bottom:15px; overflow: hidden; } .single_tp p { overflow: hidden; margin-top:25px; } .sc_one{color:#F26B65;background:#FFEFEE;} .sc_two{color:#525fe1;background:#ECEDFF;} .sc_three{color:#57216C;background:#FDF3FA;} .sc_four{color:#448BB7;background:#EAFEFF;} /* * ---------------------------------------------------------------------------------------- * 05. END TOP PROMO CSS STYLE * ---------------------------------------------------------------------------------------- */ /* * ---------------------------------------------------------------------------------------- * 06.START ABOUT DESIGN * ---------------------------------------------------------------------------------------- */ /* START ABOUT */ .ab_area{ position:relative; overflow:hidden; } .ab_img{ position:relative; } .ab_img img{ width:100%; border-radius:24px; position:relative; z-index:1; box-shadow:0 20px 60px rgba(0,0,0,0.08); } /* FLOATING CARD */ .home_ps2{ background:#fff; width:280px; padding:25px; border-radius:20px; box-shadow:0 20px 60px rgba(0,0,0,0.08); position:absolute; bottom:40px; right:-30px; z-index:2; display:flex; align-items:center; } .home_ps2 span{ color:#fff; background:linear-gradient(135deg,#525fe1,#00b894); width:60px; height:60px; line-height:60px; border-radius:50%; font-size:24px; text-align:center; margin-right:18px; flex-shrink:0; } .home_ps2 h2{ font-size:32px; margin-bottom:5px; color:#0f172a; font-weight:700; } .home_ps2 p{ margin:0; color:#64748b; font-size:15px; } /* CONTENT */ .ab_content{ padding-left:40px; } .ab_content h2{ font-size:48px; line-height:62px; font-weight:800; color:#0f172a; margin-bottom:25px; letter-spacing:-1px; } .ab_content p{ color:#64748b; line-height:32px; margin-bottom:20px; font-size:17px; } .ab_content ul{ margin-top:30px; margin-bottom:40px; } .ab_content ul li{ color:#0f172a; font-weight:600; line-height:38px; font-size:17px; } .ab_content ul li span{ color:#525fe1; margin-right:12px; } /* BUTTON */ .btn_one{ display:inline-flex; align-items:center; gap:10px; background:linear-gradient(135deg,#525fe1,#00b894); color:#fff; padding:16px 32px; border-radius:50px; font-weight:600; transition:0.4s; } .btn_one:hover{ transform:translateY(-5px); color:#fff; box-shadow:0 15px 35px rgba(82,95,225,0.25); } /* RESPONSIVE */ @media only screen and (max-width:991px){ .ab_img{ margin-bottom:70px; } .ab_content{ padding-left:0; } .ab_content h2{ font-size:38px; line-height:52px; } } @media only screen and (max-width:768px){ .ab_content h2{ font-size:32px; line-height:46px; } .ab_content p{ font-size:16px; line-height:30px; } .home_ps2{ width:240px; padding:20px; right:0; } } @media only screen and (max-width:480px){ .ab_content h2{ font-size:28px; line-height:40px; } .home_ps2{ position:relative; width:100%; margin-top:20px; bottom:auto; right:auto; } } /* END ABOUT */ /* START CATEGORY AREA */ .top_cat__area{ padding:100px 0; position:relative; } /* CATEGORY LIST */ .cat_list ul{ display:flex; flex-wrap:wrap; justify-content:center; gap:20px; padding:0; margin:0; } .cat_list li{ list-style:none; transition:0.4s ease; } /* CATEGORY CARD */ .cat_list li a{ display:flex; align-items:center; gap:14px; background:#fff; padding:14px 24px 14px 14px; border-radius:100px; color:#0f172a; font-weight:600; font-size:16px; border:1px solid rgba(0,0,0,0.06); box-shadow:0 10px 30px rgba(0,0,0,0.05); transition:0.4s ease; } /* IMAGE */ .cat_list li a img{ width:52px; height:52px; border-radius:50%; background:#f5f7ff; padding:10px; object-fit:contain; transition:0.4s ease; } /* HOVER */ .cat_list li:hover{ transform:translateY(-6px); } .cat_list li:hover a{ background:linear-gradient(135deg,#525fe1,#00b894); color:#fff; box-shadow:0 20px 40px rgba(82,95,225,0.2); } .cat_list li:hover img{ background:#fff; transform:scale(1.08); } /* SECTION TITLE */ .section-title{ margin-bottom:70px; } .section-title h2{ font-size:52px; line-height:64px; font-weight:800; color:#0f172a; margin-bottom:20px; letter-spacing:-1px; } .section-title p{ max-width:760px; margin:auto; color:#64748b; line-height:32px; font-size:17px; } /* RESPONSIVE */ @media only screen and (max-width:991px){ .section-title h2{ font-size:42px; line-height:54px; } } @media only screen and (max-width:768px){ .top_cat__area{ padding:80px 0; } .section-title{ margin-bottom:50px; } .section-title h2{ font-size:34px; line-height:46px; } .section-title p{ font-size:15px; line-height:28px; } .cat_list li a{ width:100%; justify-content:flex-start; } } @media only screen and (max-width:480px){ .section-title h2{ font-size:28px; line-height:40px; } .cat_list ul{ gap:14px; } .cat_list li{ width:100%; } .cat_list li a{ border-radius:20px; padding:14px 18px; font-size:15px; } .cat_list li a img{ width:45px; height:45px; } } /* END CATEGORY AREA */ /*START HOME TWO CATEGORY CSS*/ .category_two_area{padding-bottom:50px;} .cat_list_two{ text-align:center; padding:15px; border:2px solid #eee; border-radius:15px; margin-bottom:30px; transition: all 0.25s ease-out; transition: 0.3s; } .cat_list_two:hover{border:2px solid #525fe1;} .cat_list_two img { margin-bottom: 20px; width: 100%; } .cat_list_two span { background: #525fe1; color: #fff; padding: 2px 15px; border-radius: 30px; font-weight: 500; /* line-height: 20px; */ font-size: 14px; margin-bottom: 15px; display: inline-block; text-transform: uppercase; letter-spacing: 0.5px; } .cat_list_two h4 a { color: #0b104a; font-weight: 600; margin-bottom: 15px; display: inline-block; transition: 0.3s; } .cat_list_two p{} /*END HOME TWO CATEGORY CSS*/ /* * ---------------------------------------------------------------------------------------- * 06.START ABOUT DESIGN * ---------------------------------------------------------------------------------------- */ /* * ---------------------------------------------------------------------------------------- * 07.START COURSE DESIGN * ---------------------------------------------------------------------------------------- */ .home_course{background:#F9F9F9;padding-bottom:50px;} .single_course { background: #fff; border-radius: 20px; position: relative; box-shadow:10px 15px 18px rgba(23, 23, 36, 0.03); margin-bottom: 30px; text-align:center; } .single_c_img{margin-bottom:20px;position: relative;} .single_c_img img { width: 100%; position: relative; } .single_c_img span { position: absolute; bottom: 60%; left: -2%; background: #525fe1; color: #fff; padding: 2px 10px; border-radius: 5px; transform: rotate(-90deg); transition: 0.3s; } .single_course:hover .single_c_img span{background: #f26b65;} .single_course i { color: #f26b65; margin: 0 1px; } .single_course h4 { margin-bottom: 15px; padding: 0 20px; } .single_course h4 a { font-weight: 600; font-size: 22px; margin-top: 10px; display: block; line-height: 32px; } .single_course h4 a:hover{color:#525fe1;} .single_course p{margin-right:5px;display: inline;} .single_course p span{color:#525fe1;font-weight: 600;} .single_course .price { background: #fff; color: #525fe1; text-align: center; padding: 10px 20px; border-radius: 5px; margin-top: 15px; font-size: 18px; transition: 0.3s; font-family: "Inria Sans", sans-serif; font-weight: 600; border-top: 1px solid #e8e8e9; padding-bottom: 20px; } .single_course:hover .price{color: #f26b65;} .cour_btn{ float: right; margin-top:70px; } @media only screen and (max-width:480px){ .cour_btn { float: none; margin-top:0px; margin-bottom:60px; } } /*START SINGLE COURSE SIDEBAR CSS*/ .course_features{} .course_features h3 { font-weight: 800; margin-bottom: 20px; background: #525fe1; color: #fff; text-align: center; padding: 20px 10px; } .course_features ul{} .course_features ul li { /* font-weight: 600; */ padding-top: 10px; color: #1a2d62; overflow: hidden; font-size: 18px; } .course_features ul li i{ color:#525fe1; margin-right:8px; } .course_features ul li b { font-weight: 800; float: right; background: #525fe1; color: #fff; padding: 5px 10px; overflow: hidden; border-radius: 10px; } .course-content p { margin-bottom: 30px; } .related_course{ margin: 30px 0; box-shadow:0px 10px 40px rgba(0, 0, 0, 0.07); padding:30px; } .related_course h3{ margin-bottom:30px; font-size: 22px; font-weight: 800; } .single_rc{ margin-bottom:30px; padding-bottom:30px; border-bottom:1px solid #eee; } .single_rc img { float: left; margin-right: 15px; margin-bottom: 15px; } .single_rc i{color:#ffbd35;margin-right: 8px;} .single_rc h4 a { color: #1a2d62; font-size: 18px; font-weight: 800; margin: 10px 0; display: block; transition: 0.3s; } .single_rc h4 a:hover{color:#525fe1;} .single_rc span { color: #525fe1; font-weight: 800; font-size: 20px; } .single_langu{} .single_langu input{} .single_langu span a { color: #1a2d62; display: inline-block; font-size: 18px; line-height: 36px; transition: 0.3s; } .single_langu span a:hover{color:#525fe1;} .single_rat a { line-height: 42px; /* font-size: 40px; */ display: inline-block; } /*END SINGLE COURSE SIDEBAR CSS*/ /* START PROGRAM SECTION */ .home_course{ padding:100px 0; background:#f8fafc; } /* TOP AREA */ .cour_btn{ text-align:right; } @media(max-width:991px){ .cour_btn{ text-align:left; margin-top:20px; } } /* COURSE CARD */ .single_course{ background:#fff; border-radius:24px; overflow:hidden; transition:0.4s ease; margin-bottom:30px; border:1px solid rgba(0,0,0,0.05); box-shadow:0 10px 40px rgba(0,0,0,0.05); height:100%; } .single_course:hover{ transform:translateY(-10px); box-shadow:0 25px 60px rgba(0,0,0,0.12); } /* IMAGE */ .single_c_img{ position:relative; overflow:hidden; } .single_c_img img{ width:100%; transition:0.5s ease; } .single_course:hover .single_c_img img{ transform:scale(1.08); } /* TAG */ .single_c_img span{ position:absolute; top:20px; left:20px; background:linear-gradient(135deg,#525fe1,#00b894); color:#fff; padding:10px 18px; border-radius:50px; font-size:14px; font-weight:600; } /* CONTENT */ .course_content{ padding:30px; } /* STARS */ .course_rating{ margin-bottom:18px; } .course_rating i{ color:#f6b93b; margin-right:2px; } /* TITLE */ .course_content h4{ margin-bottom:20px; } .course_content h4 a{ font-size:26px; line-height:40px; color:#0f172a; font-weight:700; transition:0.3s; } .course_content h4 a:hover{ color:#525fe1; } /* META */ .course_meta{ margin-bottom:20px; } .course_meta p{ color:#64748b; margin-bottom:12px; font-size:16px; } .course_meta p span{ color:#525fe1; margin-right:10px; } /* PRICE */ .price{ display:inline-block; background:#eef2ff; color:#525fe1; padding:12px 20px; border-radius:50px; font-weight:600; font-size:15px; } /* RESPONSIVE */ @media only screen and (max-width:768px){ .home_course{ padding:80px 0; } .course_content{ padding:25px; } .course_content h4 a{ font-size:22px; line-height:34px; } } @media only screen and (max-width:480px){ .course_content h4 a{ font-size:20px; line-height:32px; } .single_c_img span{ font-size:13px; padding:8px 14px; } } /* END PROGRAM SECTION */ /* ======================================================= 🔥 PARTNER + VIDEO SECTION (FINAL CLEAN VERSION) ======================================================= */ /* ---------- PARTNER SECTION ---------- */ .partner-section { background: linear-gradient(180deg, #ffffff, #f7f8ff); padding: 80px 40px; border-radius: 20px; box-shadow: 0 20px 60px rgba(0,0,0,0.04); } /* TITLE */ .partner_title { margin-bottom: 40px; } .partner_title h3 { font-size: 42px; font-weight: 800; line-height: 1.2; color: #1a1a2e; margin-bottom: 20px; } .partner_title h3 span { color: #525fe1; } .partner_title p{ font-size:16px; line-height:30px; color:#666; } /* ======================================================= LOGO GRID ======================================================= */ .partner-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 35px; align-items: center; } /* CLEAN LOGO STYLE */ .partner-card { background: transparent; border: none; box-shadow: none; padding: 0; display: flex; align-items: center; justify-content: center; transition: 0.3s ease; } /* REMOVE ALL EFFECTS */ .partner-card::before, .partner-card::after{ display:none; } /* LOGOS */ .partner-card img { width: 100%; max-width: 180px; object-fit: contain; opacity: 1; filter: none; transition: 0.3s ease; } /* SIMPLE HOVER */ .partner-card:hover { transform: translateY(-5px); } .partner-card:hover img { transform: scale(1.04); } /* ======================================================= VIDEO SECTION ======================================================= */ .video-section { margin-top: 120px; position: relative; } /* LIGHT VIDEO CONTAINER */ .video-container { position: relative; border-radius: 28px; overflow: hidden; height: 500px; background: linear-gradient( 135deg, #f4f6ff, #eef1ff ); box-shadow: 0 20px 60px rgba(0,0,0,0.05), 0 30px 80px rgba(82,95,225,0.08); } /* LIGHT OVERLAY */ .video-container::after { content: ""; position: absolute; inset: 0; background: linear-gradient( 180deg, rgba(255,255,255,0.05), rgba(255,255,255,0.1) ); } /* PLAY BUTTON */ .video-play { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 95px; height: 95px; border-radius: 50%; background: #525fe1; display: flex; align-items: center; justify-content: center; font-size: 34px; color: #fff; cursor: pointer; z-index: 2; transition: 0.3s ease; box-shadow: 0 10px 30px rgba(82,95,225,0.2); } /* LIGHT PULSE */ .video-play::before { content: ""; position: absolute; width: 150px; height: 150px; border-radius: 50%; background: rgba(82,95,225,0.12); animation: pulse 2s infinite; } /* SECOND RING */ .video-play::after { content: ""; position: absolute; width: 190px; height: 190px; border-radius: 50%; border: 1px solid rgba(82,95,225,0.15); animation: pulse2 3s infinite; } /* SIMPLE HOVER */ .video-play:hover { transform: translate(-50%, -50%) scale(1.06); } /* ======================================================= ANIMATIONS ======================================================= */ @keyframes pulse { 0%{ transform: scale(0.8); opacity: 0.7; } 70%{ transform: scale(1.4); opacity: 0; } 100%{ opacity: 0; } } @keyframes pulse2 { 0%{ transform: scale(0.9); opacity: 0.4; } 70%{ transform: scale(1.2); opacity: 0; } 100%{ opacity: 0; } } /* ======================================================= RESPONSIVE ======================================================= */ @media (max-width: 1024px){ .partner-grid{ grid-template-columns: repeat(2, 1fr); margin-top: 50px; } .partner_title{ text-align:center; } .partner_title h3{ font-size:36px; } } @media (max-width: 600px){ .partner-grid{ grid-template-columns: repeat(2, 1fr); gap: 25px; } .partner-card img{ max-width: 120px; } .partner_title h3{ font-size:30px; } .video-container{ height: 320px; } .video-play{ width: 75px; height: 75px; font-size: 24px; } } /* * ---------------------------------------------------------------------------------------- * 09.START TEAM DESIGN * ---------------------------------------------------------------------------------------- */ .our-team { border: 1px solid #ddd; padding: 10px; text-align:center; border-radius: 10px; } .our-team .team-content{ position: relative; overflow: hidden; } .our-team .team-content img{ width: 100%; height: auto; transition: all 0.30s linear 0s; } .our-team:hover .team-content img{ transform: scale(1.2,1.2); } .our-team .social-links{ padding: 0; margin: 0; list-style: none; position: absolute; bottom: 0; } .our-team .social-links li{} .our-team .social-links li a { padding: 15px; color: #fff; display: block; background: #525fe1; transition: all 0.3s linear 0s; } .our-team .social-links li a:hover{ color:#fff; background:#f26b65; text-decoration: none; } .our-team .team-prof h3 { font-weight: 600; margin: 15px 0 5px; font-size: 20px; } .our-team .team-prof span{ display: block; } @media only screen and (max-width: 960px){ .our-team{ margin-bottom:30px; } } .sth_det2{} .sth_det2 > span { color: #525fe1; display: inline-block; margin: 10px 5px; } .sth_det2 u{ color: #1a2d62; font-family:"Inria Sans", sans-serif; } /*START SINGLE TEAM DETAILS*/ .template_agent { padding-bottom: 0; } .single_agent{ background: #fff none repeat scroll 0 0; box-shadow: 0px 10px 40px rgba(0, 0, 0, 0.07); margin-bottom: 30px; overflow: hidden; padding: 60px; } .single_agent_image img{ float: left; margin-right: 40px; width: 450px; } @media only screen and (max-width:480px) { .single_agent_image img{ float: left; margin-bottom: 50px; width: 100%; } } .single_agent_content{ } .agent_social { margin-top: 30px; overflow: hidden; } .single_agent_content h4 { text-transform: capitalize; overflow: hidden; font-weight: 800; font-size: 30px; margin-bottom: 5px; } .single_agent_content h5 { border-bottom: 1px solid #eee; color: #525fe1; margin-bottom: 20px; overflow: hidden; padding-bottom: 10px; text-transform: capitalize; } .single_agent_content p{ margin-bottom: 20px; overflow: hidden; } .single_agent_content ul{} .single_agent_content ul li { color: #1a2d62; line-height: 40px; overflow: hidden; font-size: 18px; font-weight: 600; } .single_agent_content i{margin-right:10px;color:#525fe1;} .agent_social ul li{float: left;} .agent_social ul li a{ margin-right: 5px; } .agent_social ul li a i { margin-right: 0; } .agent_social ul li a:hover{background:#525fe1;color:#fff;} /*END SINGLE TEAM DETAILS*/ /* * ---------------------------------------------------------------------------------------- * 09.END TEAM DESIGN * ---------------------------------------------------------------------------------------- */ /* * ---------------------------------------------------------------------------------------- * 10. START REVIEWS DESIGN * ---------------------------------------------------------------------------------------- */ .testi_area { background: url(../img/bg/shape-1.png) no-repeat; background-size: cover; } .testimonial { background: #fff; margin-bottom: 50px; border: 1px solid #ddd; padding: 40px; border-radius: 5px; margin: 0 15px; } .testimonial img { width: 60px; margin-bottom: 20px; } .testimonial_content{} .testimonial_content h3 { font-weight: 600; font-size: 20px; } .testimonial_content i { color: #fff; font-size: 22px; background: #525fe1; margin-right: 4px; border-radius: 30px; padding: 2px; } .testimonial_content p { overflow: hidden; margin-top: 15px; font-size: 22px; line-height: 32px; } .testi_pic_title { margin-top: 20px; background: #FDF3FA; padding: 20px; border-radius: 5px; } .testi_pic_title img { float: left; margin-right: 15px; border-radius: 100px; border: 5px solid #fff; } .testi_pic_title h4 { font-size: 20px; font-weight: 700; margin-bottom: 5px; overflow: hidden; } .testi_pic_title p{overflow: hidden;} .owl-theme{-webkit-transition:0.4s;-o-transition:0.4s;transition:0.4s;} .owl-theme .owl-controls{ width: 100%; height: 50px; display: block!important; opacity: 1; position: absolute; top: 84%; -webkit-transition:0.4s; -o-transition:0.4s; transition:0.4s; } .owl-theme .owl-controls .owl-buttons div { width: 46px; height: 46px; line-height: 38px; opacity: 1; border-radius: 3px; background: #525fe1; border: 1px solid #ededed; border-radius: 30px; display: none; -webkit-transition: 0.4s; -o-transition: 0.4s; transition: 0.4s; -webkit-box-shadow:0px 0px 150px 0px rgba(78, 67, 250, 0.06); box-shadow:0px 0px 150px 0px rgba(78, 67, 250, 0.06); } .owl-theme .owl-controls .owl-buttons div:hover{ background:#f26b65; border:1px solid #f26b65; display:block; } .owl-prev{ position: absolute; left:81%; } .owl-next{ position: absolute; right: 1%; } .owl-prev:after, .owl-next:after{ content: "\e629"; font-family: 'themify'; font-size: 18px; color: #fff; opacity: 1; } .owl-next:after{ content: "\e628"; } @media only screen and (max-width: 768px){ .owl-theme .owl-controls{ margin-top: 20px; } .owl-theme .owl-controls{display:none!important; } } /* * ---------------------------------------------------------------------------------------- * 10.END REVIEWS DESIGN * ---------------------------------------------------------------------------------------- */ /* * ---------------------------------------------------------------------------------------- * 11.START BLOG DESIGN * ---------------------------------------------------------------------------------------- */ .blog_area{ padding-bottom: 50px; } .blog_area_bg{background:rgba(199,201,209,.09);} .single_blog { background: #fff; border-radius:0px; margin-bottom: 30px; border: 1px solid #e8e8e9; -webkit-box-shadow: 10px 15px 18px rgba(23, 23, 36, 0.03); box-shadow: 10px 15px 18px rgba(23, 23, 36, 0.03); } .single_blog img { width: 100%; } .content_box{padding: 35px;} .single_blog h2 { line-height: 32px; font-size: 20px; margin-bottom: 15px; } .single_blog h2 a { color: #1a2d62; font-weight: 600; margin-bottom: 40px; display: block; } .single_blog h2 a:hover{color:#525fe1;} .single_blog p{margin-bottom:0px;} .single_blog span { text-transform: capitalize; margin-bottom: 10px; display: inline-block; } .single_blog span a { color: #525fe1; font-weight: 700; } .single_blog span a:hover{color:#525fe1;} .single_blog_two span{margin-top:0px;} .single_blog_two p{margin-bottom:30px;} .arti_img_two img{ width:100%; margin-bottom:20px; } .arti_btn { color: #525fe1; font-weight: 600; margin-top: 15px; display: inline-block; -webkit-transition: 0.3s; -o-transition: 0.3s; transition: 0.3s; } .arti_btn:hover{ padding-left:10px; color: #525fe1;} .arti_sp{} .arti_sp h2 { margin-top: 30px; font-weight: 700; margin-left: 60px; margin-bottom: 30px; } .arti_sp img{margin-bottom:30px;width:100%;} .arti_sp p{} .share_sp{margin-top: 30px;overflow: hidden;} .share_sp h4{font-weight: 600;margin-bottom: 25px;} .share_sp ul{} .share_sp ul li{float: left;} .share_sp ul li a { color: #fff; transition: 0.3s; padding: 15px; display:block; background: #f4f4f4; background: #525fe1; border-radius: 5px; margin-right: 10px; } .share_sp ul li a:hover{background:#1a2d62;} .share_sp ul li a span{} /*START BLOG SIDEBAR DESIGN*/ .blog_search { background: #fff; box-shadow: 0px 0px 150px 0px rgba(78, 67, 250, 0.06); padding: 10px; border: 1px solid #ededed; } .blog_search input { background: #ebecff; border: 1px solid #ebecff; border-radius: 0; color: #1a2d62; -webkit-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; height: 60px; outline: 0 none; } .blog_search input:focus{box-shadow:none;} /*START NEWSLETTER FORM*/ .newsletter-form { background: #f26b65; padding: 40px; border-radius: 10px; } .newsletter-form h4 { color: #fff; margin-top: 0; margin-bottom: 15px; font-weight: 700; text-transform: capitalize; font-size: 24px; line-height: 34px; } .newsletter-form p{color:#fff;margin-bottom: 30px;} .newsletter-form input { width: 100%; margin-bottom: 20px; height: 50px; padding: 10px; color: #1d293e; border-radius: 2px; border: 0px; } .newsletter-form input:focus{box-shadow:none;} .subscribe button { border:none; width: 100%; } .sub_btn{ background: #525fe1; border-radius: 5px; color: #fff; font-size: 16px; padding: 14px 40px; text-transform: capitalize; -webkit-transition:all 0.3s ease 0s; transition: all 0.3s ease 0s; border-radius: 100px; display: inline-block; font-weight: 500; } .sub_btn:hover, .sub_btn:focus{ background:#fff; color: #1a2d62; } /*END NEWSLETTER FORM*/ /*Popular post*/ .sidebar_title{} .sidebar_title h4 { font-size: 16px; font-weight: 800; text-transform: uppercase; margin-bottom: 20px; padding-bottom: 10px; border-bottom: 1px solid #ededed; } .sidebar-post { background: #fff; border-radius: 5px; margin-bottom: 30px; padding: 30px; box-shadow: 0px 0px 150px 0px rgba(78, 67, 250, 0.06); border: 1px solid #ededed; } .single_popular{ margin-bottom:20px; overflow: hidden; } .single_popular:last-child { margin-bottom: 0; } .single_popular a img { width: 80px; height: 60px; float: left; margin-right: 10px; border-radius: 6px; } .single_popular h5 a { color: #1a2d62; font-size: 16px; -webkit-transition: 0.3s; -o-transition: 0.3s; transition: 0.3s; font-weight: 500; } .single_popular h5 a:hover{color:#554c86;} /*End Popular post*/ /*Start Social media*/ .single_social{} .social_item{ padding:8px 12px; border-radius:4px; } .single_social ul { display: -ms-grid; display: grid; -ms-grid-columns: repeat(2, minmax(0, 1fr)); grid-column-gap: 10px; grid-row-gap: 10px; list-style:none; -ms-grid-columns: minmax(0, 1fr) 10px minmax(0, 1fr); grid-template-columns: repeat(2, minmax(0, 1fr)); } .single_social ul li{} .single_social ul li a{} .single_social ul li a i{color:#fff;font-size:12px;} .item-list{ float: right; color:#fff; font-size:13px; } .b_facebook{background:#1a4fc5;} .b_twitter{background:#00acee;} .b_youtube{background:#f50000;} .b_pinterest{background:#e62e3f;} .b_tumblr{background:#34526f;} .b_rss{background:#e8a50e;} /*End Social media*/ /*Start category*/ .single_category{overflow:hidden;} .item-category{ padding:8px 12px; border-radius:4px; background:#f2f2f2; } .single_category ul { } .single_category ul li { line-height: 32px; float: left; margin: 10px; } .single_category ul li a{ color:#1a2d62; font-size:16px; font-weight:600; text-decoration:underline; } .single_category ul li a sup{color:#525fe1;} /*End category*/ .tag{overflow: hidden;} .tag a { background: #f4f4f4; border: 1px solid #ededed; border-radius: 30px; color: #1a2d62; display: block; float: left; font-size: 14px; font-weight: 600; margin: 6px 4px; padding: 3px 20px; text-transform: capitalize; -webkit-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } .tag a:hover { background: #525fe1; color: #fff; border: 1px solid #525fe1; } .sidebar-banner img{width:100%;} /*START SINGLE BLOG PAGE DESIGN*/ .author_part { margin-bottom: 30px; overflow: hidden; margin-top: 60px; } .single_author { background: #fff none repeat scroll 0 0; padding: 40px; border-radius: 10px; -webkit-box-shadow: 0px 0px 150px 0px rgba(78, 67, 250, 0.06); box-shadow: 0px 0px 150px 0px rgba(78, 67, 250, 0.06); overflow: hidden; border: 1px solid #ededed; } .author_part img { border: 4px solid #ededed; border-radius: 100px; float: left; height: 120px; margin-right: 20px; width: 120px; } .author_part h4 {text-transform: uppercase; font-size: 16px; font-weight:700; letter-spacing: 1px; margin-bottom: 10px; overflow: hidden; } .author_part p { margin-bottom: 0 } .blog_head_title { border-bottom: 1px solid #ededed; margin: 0 0 30px; padding-bottom: 10px; font-weight: 700; text-transform: uppercase; font-size: 18px; } .comments_part { margin-bottom: 60px; } .single_comment { margin-bottom: 30px; background: #fff; padding: 40px; border-radius: 10px; -webkit-box-shadow: 0px 0px 150px 0px rgba(78, 67, 250, 0.06); box-shadow: 0px 0px 150px 0px rgba(78, 67, 250, 0.06); overflow: hidden; border:1px solid #ededed; } .sc_left{margin-left: 100px;} .single_comment_mbnone { margin-bottom: 0px } .single_comment img { border: 4px solid #ededed; border-radius: 100px; float: left; height: 120px; margin-right: 20px; width: 120px; } .single_comment h4 { font-size: 16px; font-weight: 700; letter-spacing: 1px; text-transform: uppercase; margin-bottom: 10px; overflow: hidden; } .single_comment p { margin-bottom: 0;overflow: hidden;} .comment-box {} .comment_form input, .comment_form textarea {} .comment_form textarea {} @media only screen and (max-width:768px) { .comment_form textarea { width: 100% } } /*END SINGLE BLOG PAGE DESIGN*/ /* * ---------------------------------------------------------------------------------------- * 11.END BLOG DESIGN * ---------------------------------------------------------------------------------------- */ /* * ---------------------------------------------------------------------------------------- * 12.START FOOTER DESIGN * ---------------------------------------------------------------------------------------- */ .footer { background:#f5f5fd; } .single_footer{position:relative;} @media only screen and (max-width:960px) { .single_footer{margin-bottom:30px;} } .single_footer img{margin-bottom:20px;} .single_footer h4 { color: #0b104a; margin-top: 0; margin-bottom: 25px; font-weight: 700; text-transform: capitalize; font-size: 20px; } .single_footer p{margin-bottom:30px;} .single_footer ul { margin: 0; padding: 0; list-style: none; } .single_footer ul li{} .single_footer ul li a { color: #0b104a; -webkit-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; line-height: 36px; font-size: 16px; font-weight: 400; text-transform: capitalize; } .single_footer ul li a:hover { color: #525fe1; } .sf_contact{margin-bottom:20px;overflow: hidden;} .sf_contact span { color: #525fe1; font-size: 22px; float: left; margin-top: 5px; margin-right: 20px; } .sf_contact p { overflow: hidden; margin-bottom:0; } .sf_contact p a{color: #525fe1;} .sf_contact p a:hover{color: #f26b65;} .footer_menu{float: right;} @media only screen and (max-width:480px){ .footer_menu { float: left; margin-top: 20px; } } .footer_menu ul{list-style:none;} .footer_menu ul li{float:left;} .footer_menu ul li a { color: #fff; padding: 0px 10px; -webkit-transition: 0.3s; -o-transition: 0.3s; transition: 0.3s; } .footer_menu ul li a:hover{ color:#525fe1; text-decoration: underline; } .social_profile {margin-top:10px;} @media only screen and (max-width:960px) { .social_profile{margin-bottom:30px;overflow: hidden;} } .social_profile ul{ list-style: outside none none; margin: 0; padding: 0; } .social_profile ul li{float:left;} .social_profile ul li a { text-align: center; border: 0px; text-transform: uppercase; -webkit-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; margin-right: 10px; font-size: 16px; color: #000; display: block; width: 40px; height: 40px; line-height: 40px; border-radius: 30px; box-shadow: 0 6px 0 #E7EAFA,15px 30px 68px rgba(156,160,185,.56); background: #fff; } @media only screen and (max-width:768px) { .social_profile ul li a{margin-right:10px;margin-bottom:10px;} } @media only screen and (max-width:480px) { .social_profile ul li a{ width:40px; height:40px; line-height:40px; } } .social_profile ul li a:hover{ color:#fff; } .f_facebook:hover{background:#3B5998;} .f_twitter:hover{background:#1A90D9;} .f_instagram:hover{background:#FF5252;} .f_linkedin:hover{background:#0e76a8;} .foot_img{width:100%;} .foot_copy{ background:#e8e8ff; padding:20px 0; } .foot_copy p { text-align: center; font-weight: 500; } /* * ---------------------------------------------------------------------------------------- * 12.END FOOTER DESIGN * ---------------------------------------------------------------------------------------- */ /* * ---------------------------------------------------------------------------------------- * 13. START FREE COURSE+INSTRUCTOR CSS * ---------------------------------------------------------------------------------------- */ .insfreecourse { padding-top:0px; padding-bottom:50px; } .single_ins { position: relative; padding: 80px 40px; overflow: hidden; margin-bottom: 30px; border-radius: 5px; } .single_ins::before { position: absolute; width: 100%; height: 100%; background: #1a1936; content: ""; left: 0; top: 0; opacity: 0.6; } .single_ins_content {position: relative;} .single_ins_content h4 { font-weight: 400; font-size: 18px; color: #fff; text-transform: capitalize; } .single_ins_content h1 { color: #fff; font-weight: 600; margin-bottom: 10px; } .single_ins_content p{margin-bottom: 40px;color: #fff;} .single_ins_img{} .single_ins_img img { width: 50%; } /* * ---------------------------------------------------------------------------------------- * 13. END FREE COURSE+INSTRUCTOR CSS * ---------------------------------------------------------------------------------------- */ /* * ---------------------------------------------------------------------------------------- * 14.START PRICING DESIGN * ---------------------------------------------------------------------------------------- */ .pricing-content{} .single-pricing{ background:#fff; padding:40px 20px; border-radius:5px; position:relative; z-index:2; border:1px solid #eee; box-shadow: 0 10px 40px -10px rgba(0,64,128,.09); transition:0.3s; } @media only screen and (max-width:480px) { .single-pricing {margin-bottom:30px;} } .single-pricing:hover{ box-shadow:0px 60px 60px rgba(0,0,0,0.1); z-index:100; transform: translate(0, -10px); } .price-label { color: #fff; background: #525fe1; font-size: 16px; width: 100px; margin-bottom: 15px; display: block; -webkit-clip-path: polygon(100% 0%, 90% 50%, 100% 100%, 0% 100%, 0 50%, 0% 0%); clip-path: polygon(100% 0%, 90% 50%, 100% 100%, 0% 100%, 0 50%, 0% 0%); margin-left: -20px; position: absolute; } .price-head h2 { font-weight: 600; margin-bottom: 0px; text-transform: capitalize; font-size: 26px; } .price-head span { display: inline-block; background:#525fe1; width: 6px; height: 6px; border-radius: 30px; margin-bottom: 20px; margin-top: 15px; } .price { font-weight: 500; font-size: 50px; margin-bottom: 0px; } .single-pricing{} .single-pricing h5 { font-size: 14px; margin-bottom: 0px; text-transform: uppercase; } .single-pricing ul{ list-style: none; margin-bottom: 40px; margin-top: 30px; } .single-pricing ul li{line-height: 35px;} .single-pricing-white{background: #232434} .single-pricing-white ul li{color:#fff;} .single-pricing-white h2{color:#fff;} .single-pricing-white h1{color:#fff;} .single-pricing-white h5{color:#fff;} /* * ---------------------------------------------------------------------------------------- * 14.END PRICING DESIGN * ---------------------------------------------------------------------------------------- */ /* * ---------------------------------------------------------------------------------------- * 15.START CONTACT PAGE DESIGN * ---------------------------------------------------------------------------------------- */ .contact label { margin-bottom: 5px; font-weight: 700; color: #1a2d62; } .contact input { background: #ebecff; border: 1px solid #ebecff; border-radius: 0px; -webkit-box-shadow: none; box-shadow: none; color: #1a2d62; font-size: 16px; font-weight: 400; height: 70px; padding: 10px 10px 10px 30px; width: 100%; margin-bottom: 30px; } .contact textarea { background: #ebecff; border: 1px solid #ebecff; border-radius: 0px; -webkit-box-shadow: none; box-shadow: none; color: #1a2d62; font-size: 16px; font-weight: 400; padding: 10px 10px 10px 30px; width: 100%; margin-bottom:30px; } .contact input:focus { background: #f4f4f4; border: 1px solid #fff; -webkit-box-shadow: none; box-shadow: none; outline: 0 none; color: #1a2d62; } .contact textarea:focus { background: #f4f4f4; border: 1px solid #fff; -webkit-box-shadow: none; box-shadow: none; color: #1a2d62; } .contact button{border:none;} .single_address{ padding:40px; } @media only screen and (max-width:480px) { .single_address{margin-bottom:30px; } } .single_address i { font-size: 42px; margin-bottom: 20px; display: inline-block; } .single_address h4{ text-transform: capitalize; margin-bottom: 20px; font-weight: 700; } .single_address p{} .sa_one {background: #FFEFEE;} .sa_two {background: #ECEDFF;} .sa_three {background: #EAFEFF;} .map{} .map iframe { width: 100%; background: #fff; height: 600px; box-shadow: 0px 10px 40px rgba(0, 0, 0, 0.06); padding: 20px; margin-left: 30px; } @media only screen and (max-width:880px) { .map iframe {margin-left:0px; } } /* * ---------------------------------------------------------------------------------------- * 15.END CONTACT PAGE DESIGN * ---------------------------------------------------------------------------------------- */ /* ---------------------------------------------------------------------------------------- * 16.START FAQ DESIGN * ---------------------------------------------------------------------------------------- */ .faq_img img{width:100%;} @media only screen and (max-width:960px) { .faq_img{margin-top:60px;} } .accordion{margin-right:30px;} @media only screen and (max-width:960px) { .accordion{margin-right:0px;} } .accordion-item { border: 1px solid #e8e8e9; margin-bottom: 15px; -webkit-box-shadow: 0px 0px 150px 0px rgba(78, 67, 250, 0.06); box-shadow: 0px 0px 150px 0px rgba(78, 67, 250, 0.06); background: #fff; margin-bottom: 20px; } .accordion-body{} .accordion-item:not(:first-of-type) { border-top: 1px solid #FFEFEE; } .accordion-header { background: #ECEDFF !important; padding: 7px 0; -webkit-box-shadow: none; box-shadow: none; } .accordion-button { background:none!important; color: #0b104a !important; font-weight: 700; font-size:20px; } .accordion-button:not(.collapsed) { color:#0b104a!important; -webkit-box-shadow: none !important; box-shadow: none !important; } .accordion-button:focus{-webkit-box-shadow: none !important;box-shadow: none !important;} /* ---------------------------------------------------------------------------------------- * 16.END FAQ DESIGN * ---------------------------------------------------------------------------------------- */ /* * ---------------------------------------------------------------------------------------- * 17.START ERROR PAGE DESIGN * ---------------------------------------------------------------------------------------- */ .error_page{} .error_page h2 { font-weight: 800; margin: 30px 0; font-size: 50px; } .error_page p { margin-bottom: 40px; font-weight: 500; width: 50%; margin: auto; margin-bottom: 40px; } /* * ---------------------------------------------------------------------------------------- * 17.END ERROR PAGE DESIGN * ---------------------------------------------------------------------------------------- */ /* * ---------------------------------------------------------------------------------------- * 18.START SECTION TOP DESIGN * ---------------------------------------------------------------------------------------- */ .section-top { padding-top:150px; position: relative; background: url(../img/bg/section-top.jpg); background-size: cover; background-position: center; padding-bottom: 90px; } .section-top-title { position: relative; } @media only screen and (max-width:480px) { .section-top-title { width: 100% } } .section-top-title h1 { margin-bottom: 10px; text-transform: capitalize; font-weight: 700; font-size: 50px; } .section-top-title ul {} .section-top-title ul li {color: #0b104a !important;display: inline-block; } .section-top-title ul li a { color: #525fe1!important;font-weight: 600; } .section-top-title ul li a:hover { color: #525fe1!important } /* * ---------------------------------------------------------------------------------------- * 18.END SECTION TOP DESIGN * ---------------------------------------------------------------------------------------- */ /* ====================================================== LIGHT BLUE + GREEN THEME NAVBAR NOT TOUCHED ====================================================== */ /* MAIN BACKGROUNDS */ .home_bg, .partner-section, .home_course, .top_cat__area, .ab_area, .testi_area, .footer, .tp_feature { background: linear-gradient( 135deg, #eef6ff 0%, #dbeafe 35%, #dcfce7 70%, #f0fdf4 100% ) !important; position: relative; overflow: hidden; } /* SOFT GLOW */ .home_bg::before, .home_course::before, .ab_area::before, .top_cat__area::before { content: ""; position: absolute; width: 500px; height: 500px; top: -200px; right: -150px; background: radial-gradient( circle, rgba(16,185,129,0.08), transparent 70% ); z-index: 0; } /* CONTENT ABOVE */ .home_bg > *, .home_course > *, .ab_area > *, .top_cat__area > * { position: relative; z-index: 2; } /* ====================================================== TEXT COLORS ====================================================== */ .hero-text h1, .hero-text2 h1, .section-title h2, .partner_title h3, .ab_content h2, .single_footer h4, .single_course h4 a, .single_tp h3 { color: #0f172a !important; } /* PARAGRAPHS */ .hero-text p, .hero-text2 p, .section-title p, .partner_title p, .ab_content p, .single_course p, .single_footer p, .single_tp p { color: #475569 !important; } /* GREEN HIGHLIGHTS */ .hero-text h1 span, .hero-text2 h1 span, .partner_title h3 span, .section-title b { color: #10b981 !important; } /* ====================================================== BUTTONS ====================================================== */ .btn_one { background: linear-gradient( 135deg, #10b981, #14b8a6 ) !important; border: none !important; color: #fff !important; border-radius: 14px; box-shadow: 0 10px 25px rgba(16,185,129,0.18); } /* BUTTON HOVER */ .btn_one:hover { background: linear-gradient( 135deg, #14b8a6, #0ea5e9 ) !important; color: #fff !important; } /* ====================================================== REMOVE ORANGE COLORS ====================================================== */ .single_course i, .single_blog span a, .sf_contact p a:hover, .home_tag a:hover { color: #10b981 !important; } /* REMOVE ORANGE BACKGROUNDS */ .sc_one, .sa_one, .single_c_img span, .home_sb button:hover, .home_sb2 button:hover, .newsletter-form { background: linear-gradient( 135deg, #10b981, #14b8a6 ) !important; border-color: #10b981 !important; } /* ====================================================== LIGHT GLASS CARDS ====================================================== */ .single_course, .single_tp, .single-counter, .testimonial, .single_blog, .our-team { background: rgba(255,255,255,0.6) !important; backdrop-filter: blur(12px); border: 1px solid rgba(255,255,255,0.5) !important; box-shadow: 0 10px 40px rgba(15,23,42,0.06) !important; } /* ====================================================== PARTNER LOGOS ====================================================== */ .partner-card img, .partner img { opacity: 1; filter: none; } /* ====================================================== FOOTER ====================================================== */ .footer { border-top: 1px solid rgba(15,23,42,0.06); } /* FOOTER LINKS */ .single_footer ul li a { color: #334155 !important; } .single_footer ul li a:hover { color: #10b981 !important; } /* ====================================================== SOCIAL ICONS ====================================================== */ .social_profile ul li a { background: rgba(255,255,255,0.7) !important; color: #0f172a !important; box-shadow: 0 5px 20px rgba(15,23,42,0.06) !important; } /* ====================================================== MOBILE ====================================================== */ @media(max-width:768px){ .section-title h2, .hero-text h1, .hero-text2 h1 { font-size: 38px !important; line-height: 50px !important; } .partner-grid { grid-template-columns: repeat(2,1fr); } } /* ========================================= NAV RIGHT FEATURES ========================================= */ .nav-flex{ width:80%; display:flex; align-items:center; } /* KEEP MENU IN SINGLE LINE */ /* ONLY MAIN NAV MENU */ #main-menu > ul{ display:flex; align-items:center; flex-wrap:nowrap; } /* SMALLER MENU SPACING */ /* ONLY TOP LEVEL ITEMS */ #main-menu > ul > li{ padding:0 10px; } /* PREVENT TEXT BREAK */ #main-menu ul li a{ white-space:nowrap; } /* RIGHT SIDE */ .nav-right-features{ flex-shrink:0; } /* MENU */ #main-menu{ flex:1; } #main-menu ul{ display:flex; align-items:center; margin:0; } /* RIGHT SIDE */ .nav-right-features{ display:flex; align-items:center; gap:18px; margin-left:auto; } /* LANGUAGE */ .language-switch{ display:flex; align-items:center; gap:6px; } .language-switch a{ color:#0b104a; font-size:14px; font-weight:700; } .language-switch a.active{ color:#10b981; } .language-switch span{ color:#94a3b8; } /* BUTTON */ .machines-switch{ height:50px; display:flex; align-items:center; justify-content:center; padding:0 22px; border-radius:50px; background: linear-gradient( 135deg, #10b981, #14b8a6 ); color:#fff !important; font-size:14px; font-weight:600; transition:0.3s; box-shadow: 0 10px 25px rgba(16,185,129,0.2); } .machines-switch i{ margin-right:8px; } .machines-switch:hover{ transform:translateY(-2px); } /* MOBILE */ @media(max-width:991px){ .nav-right-features{ display:none; } } /* FIX DROPDOWN DIRECTION */ #main-menu ul li ul{ display:block !important; } #main-menu ul li ul li{ display:block !important; width:100%; } /* FIX DROPDOWN TEXT OVERFLOW */ #navigation #main-menu ul li ul{ width:260px; } #navigation #main-menu ul li ul li a{ white-space:normal; line-height:24px; padding:10px 14px; display:block; } /* ===================================================== CLEAN PREMIUM PROGRAM CARDS ===================================================== */ .home_course{ background:#f8fbff !important; } /* SIMPLE CARD */ .single_course{ border:none !important; border-radius:24px !important; overflow:hidden; background:#ffffff !important; box-shadow: 0 10px 30px rgba(15,23,42,0.06) !important; transition:0.35s ease; } /* HOVER */ .single_course:hover{ transform:translateY(-8px); box-shadow: 0 20px 45px rgba(15,23,42,0.12) !important; } /* IMAGE */ .single_c_img{ overflow:hidden; } .single_c_img img{ transition:0.4s ease; } .single_course:hover .single_c_img img{ transform:scale(1.05); } /* TAG */ .single_c_img span{ top:18px !important; left:18px !important; transform:none !important; border-radius:50px !important; background:#10b981 !important; padding:8px 16px !important; font-size:12px !important; letter-spacing:0.5px; } /* CONTENT */ .course_content{ padding:28px !important; } /* TITLE */ .course_content h4 a{ font-size:24px !important; line-height:34px !important; font-weight:700 !important; color:#0f172a !important; } /* META */ .course_meta p{ color:#475569 !important; font-size:15px !important; } /* PRICE */ .price{ margin-top:20px; border-radius:12px !important; background:#ecfdf5 !important; color:#10b981 !important; font-weight:700 !important; border:none !important; } /* REMOVE GREEN LABEL INSIDE PROGRAM IMAGE */ .single_c_img span{ display:none !important; } /* REMOVE PARTNER VIDEO SECTION */ .vid_area{ display:none !important; } /* ========================================== AKWABA WHY SECTION ========================================== */ .akwaba_why{ background:#f7fbff; position:relative; } /* TOP */ .akwaba_top{ margin-bottom:70px; } .akwaba_badge{ display:inline-block; background:#10b981; color:#fff; padding:10px 24px; border-radius:100px; font-size:13px; font-weight:700; letter-spacing:1px; margin-bottom:25px; } .akwaba_top h2{ font-size:54px; line-height:1.2; color:#071c3d; font-weight:800; margin-bottom:20px; } .akwaba_top h2 span{ color:#10b981; display:block; } .akwaba_top p{ max-width:720px; margin:auto; color:#5c6b80; font-size:18px; line-height:1.9; } /* IMAGE */ .why_image_wrap{ position:relative; } .why_image_wrap img{ border-radius:30px; box-shadow: 0 20px 60px rgba(0,0,0,0.12); } /* FLOAT CARD */ .floating_card{ position:absolute; right:-20px; bottom:40px; background:#071c3d; color:#fff; padding:30px; border-radius:24px; width:230px; box-shadow: 0 20px 50px rgba(0,0,0,0.2); } .floating_card h3{ font-size:42px; color:#10b981; margin-bottom:10px; } /* RIGHT CONTENT */ .why_content{ padding-left:40px; } .why_item{ display:flex; align-items:flex-start; gap:25px; margin-bottom:30px; background:#fff; border-radius:24px; padding:28px; transition:0.4s; box-shadow: 0 10px 30px rgba(0,0,0,0.05); } .why_item:hover{ transform:translateY(-6px); } .why_item span{ min-width:70px; height:70px; border-radius:18px; background: linear-gradient( 135deg, #10b981, #14b8a6 ); display:flex; align-items:center; justify-content:center; color:#fff; font-size:28px; } .why_item h4{ font-size:24px; margin-bottom:10px; color:#071c3d; } .why_item p{ margin:0; color:#667085; line-height:1.8; } /* STRIP */ .akwaba_strip{ margin-top:70px; display:grid; grid-template-columns:repeat(4,1fr); gap:20px; } .strip_box{ background:#071c3d; color:#fff; padding:24px; border-radius:18px; text-align:center; font-weight:600; transition:0.3s; } .strip_box:hover{ background:#10b981; transform:translateY(-5px); } /* MOBILE */ @media only screen and (max-width:991px){ .akwaba_top h2{ font-size:38px; } .why_content{ padding-left:0; margin-top:50px; } .floating_card{ right:10px; bottom:10px; width:180px; padding:20px; } .floating_card h3{ font-size:30px; } .akwaba_strip{ grid-template-columns:1fr; } .why_item{ flex-direction:column; } } /* ====================================================== PREMIUM TESTIMONIAL SECTION ====================================================== */ .testi_area{ background: linear-gradient( 135deg, #f5f9ff, #eef7f5 ); } /* CARD */ .premium_card{ position: relative; background: #ffffff; border-radius: 30px; padding: 40px 35px; margin-bottom: 30px; overflow: hidden; transition: 0.4s; box-shadow: 0 15px 50px rgba(0,0,0,0.06); border: 1px solid rgba(0,0,0,0.04); } /* HOVER */ .premium_card:hover{ transform: translateY(-10px); box-shadow: 0 25px 70px rgba(0,0,0,0.12); } /* SPECIAL CARDS */ .green_card{ background: linear-gradient( 135deg, #0f766e, #10b981 ); color: #fff; } .dark_card{ background: linear-gradient( 135deg, #071126, #0b2447 ); color: #fff; } /* QUOTE ICON */ .quote_icon{ position: absolute; top: 25px; right: 25px; font-size: 28px; opacity: 0.12; } /* TOP */ .top_review{ display: flex; align-items: center; gap: 18px; margin-bottom: 25px; } /* IMAGE */ .top_review img{ width: 75px; height: 75px; border-radius: 50%; object-fit: cover; border: 4px solid rgba(16,185,129,0.15); } /* NAME */ .top_review h4{ font-size: 22px; font-weight: 700; margin-bottom: 5px; } /* ROLE */ .top_review span{ font-size: 14px; opacity: 0.8; } /* TEXT */ .premium_card p{ font-size: 16px; line-height: 30px; margin-bottom: 25px; } /* STARS */ .stars{ font-size: 20px; letter-spacing: 4px; color: #facc15; } /* WHITE TEXT */ .green_card h4, .green_card span, .green_card p, .dark_card h4, .dark_card span, .dark_card p{ color: #fff !important; } /* MOBILE */ @media only screen and (max-width:768px){ .premium_card{ padding: 30px 25px; } .top_review{ flex-direction: column; align-items: flex-start; } } /* ========================================== AKWABA CTA ========================================== */ .akwaba_cta{ background: linear-gradient( 135deg, #071126, #0b2447 ); } /* BOX */ .cta_box{ background: linear-gradient( 135deg, rgba(16,185,129,0.12), rgba(255,255,255,0.03) ); border-radius: 35px; padding: 70px; border: 1px solid rgba(255,255,255,0.08); backdrop-filter: blur(10px); } /* CONTENT */ .cta_content span{ color: #10b981; font-size: 14px; font-weight: 700; letter-spacing: 2px; display: inline-block; margin-bottom: 20px; } .cta_content h2{ color: #fff; font-size: 56px; line-height: 1.2; font-weight: 800; margin-bottom: 20px; } .cta_content p{ color: rgba(255,255,255,0.75); font-size: 18px; line-height: 34px; } /* BUTTONS */ .cta_buttons{ display: flex; flex-direction: column; gap: 20px; align-items: flex-end; } /* WHATSAPP */ .whatsapp_btn{ background: #10b981; color: #fff; padding: 18px 35px; border-radius: 100px; font-weight: 700; display: inline-flex; align-items: center; gap: 12px; transition: 0.3s; } .whatsapp_btn:hover{ background: #fff; color: #071126; } /* MOBILE */ @media only screen and (max-width:991px){ .cta_box{ padding: 45px; } .cta_content h2{ font-size: 38px; } .cta_buttons{ align-items: flex-start; margin-top: 35px; } } @media only screen and (max-width:480px){ .cta_box{ padding: 30px; } .cta_content h2{ font-size: 30px; } } /* ========================================== AKWABA TRUST SECTION ========================================== */ .akwaba_trust{ background: linear-gradient( 180deg, #ffffff, #f5fbff ); } /* BOX */ .trust_box{ background:#fff; border-radius:30px; padding:45px 30px; text-align:center; margin-bottom:30px; transition:0.4s; box-shadow: 0 15px 50px rgba(0,0,0,0.06); border: 1px solid rgba(0,0,0,0.04); } /* HOVER */ .trust_box:hover{ transform: translateY(-10px); box-shadow: 0 25px 70px rgba(0,0,0,0.12); } /* ICON */ .trust_icon{ width:90px; height:90px; margin:auto; border-radius:24px; background: linear-gradient( 135deg, #10b981, #14b8a6 ); display:flex; align-items:center; justify-content:center; margin-bottom:25px; } .trust_icon i{ color:#fff; font-size:34px; } /* NUMBER */ .trust_box h3{ font-size:46px; font-weight:800; color:#071126; margin-bottom:10px; } /* TEXT */ .trust_box p{ color:#667085; font-size:17px; margin:0; } /* MOBILE */ @media only screen and (max-width:768px){ .trust_box{ padding:35px 25px; } } /* ========================================== PREMIUM HERO ========================================== */ .premium_home{ position: relative; overflow: hidden; padding-top: 180px; padding-bottom: 120px; background: linear-gradient( 135deg, #eef8ff 0%, #f5fbff 45%, #eefcf7 100% ); } /* SHAPES */ .hero_shape{ position:absolute; border-radius:50%; filter:blur(80px); z-index:1; } .hero_shape1{ width:420px; height:420px; background:rgba(16,185,129,0.18); top:-120px; left:-120px; } .hero_shape2{ width:380px; height:380px; background:rgba(59,130,246,0.15); bottom:-100px; right:-100px; } /* CONTENT */ .premium_hero_content{ position:relative; z-index:5; } /* TAG */ .hero_tag span{ display:inline-flex; align-items:center; gap:10px; background:#ffffff; padding:12px 22px; border-radius:100px; font-size:14px; font-weight:700; color:#0f172a; box-shadow: 0 10px 30px rgba(0,0,0,0.06); margin-bottom:28px; } /* TITLE */ .premium_hero_content h1{ font-size:68px; line-height:1.1; font-weight:800; color:#071c34; margin-bottom:25px; } .premium_hero_content h1 span{ color:#10b981; } /* TEXT */ .premium_hero_content p{ font-size:18px; line-height:32px; color:#4b5563; max-width:620px; margin-bottom:35px; } /* BUTTONS */ .hero_btns{ display:flex; align-items:center; gap:18px; margin-bottom:45px; flex-wrap:wrap; } .hero_whatsapp{ display:inline-flex; align-items:center; gap:10px; padding:16px 24px; border-radius:14px; background:#fff; color:#111827; font-weight:700; text-decoration:none; box-shadow: 0 10px 30px rgba(0,0,0,0.08); transition:0.3s; } .hero_whatsapp:hover{ transform:translateY(-4px); color:#10b981; } /* STATS */ .hero_stats{ display:flex; gap:20px; flex-wrap:wrap; } .hero_stat_box{ background:#ffffff; padding:25px 35px; border-radius:24px; min-width:180px; box-shadow: 0 15px 40px rgba(0,0,0,0.08); } .hero_stat_box h2{ font-size:38px; color:#10b981; margin-bottom:8px; } .hero_stat_box p{ margin:0; font-size:15px; line-height:24px; color:#4b5563; } /* RIGHT IMAGE */ .premium_hero_image{ position:relative; z-index:5; text-align:center; } .premium_hero_image img{ width:100%; max-width:560px; border-radius:35px; position:relative; z-index:3; } /* FLOAT CARDS */ .floating_card{ position:absolute; display:flex; align-items:center; gap:14px; background:#ffffff; padding:18px 24px; border-radius:20px; box-shadow: 0 15px 40px rgba(0,0,0,0.10); z-index:5; } .floating_card i{ width:55px; height:55px; border-radius:14px; display:flex; align-items:center; justify-content:center; background: linear-gradient( 135deg, #10b981, #14b8a6 ); color:#fff; font-size:22px; } .floating_card h4{ font-size:18px; margin-bottom:4px; color:#071c34; } .floating_card p{ margin:0; font-size:14px; color:#6b7280; } /* CARD POSITIONS */ .card_one{ top:40px; left:-30px; } .card_two{ bottom:40px; right:-20px; } /* MOBILE */ @media only screen and (max-width:991px){ .premium_home{ padding-top:140px; text-align:center; } .premium_hero_content h1{ font-size:48px; } .hero_btns{ justify-content:center; } .hero_stats{ justify-content:center; } .premium_hero_image{ margin-top:60px; } .card_one{ left:0; } .card_two{ right:0; } } @media only screen and (max-width:600px){ .premium_hero_content h1{ font-size:38px; } .hero_stat_box{ width:100%; } .floating_card{ position:relative; margin-top:20px; } .card_one, .card_two{ top:auto; bottom:auto; left:auto; right:auto; } } /* ========================================= MOBILE HERO FIX ========================================= */ @media only screen and (max-width:768px){ .home_bg{ height:auto !important; padding:140px 0 80px; background-position:center !important; } .hero-text{ text-align:center; } .hero-text h1{ font-size:38px !important; line-height:48px !important; padding-top:0 !important; margin-bottom:18px; } .hero-text p{ width:100% !important; font-size:16px; line-height:28px; margin-bottom:30px; } .hero-text-img{ position:relative !important; right:auto !important; bottom:auto !important; text-align:center; margin-top:50px; } .hero-text-img img{ display:block !important; width:100%; max-width:320px; margin:auto; } .home_ps{ position:relative !important; left:auto !important; right:auto !important; top:auto !important; bottom:auto !important; width:100%; max-width:260px; margin:25px auto 0; padding:18px; border-radius:20px; } .home_ps span{ width:50px; height:50px; line-height:50px; font-size:18px; } .home_ps h2{ font-size:26px; } } /* EXTRA SMALL MOBILE */ @media only screen and (max-width:480px){ .home_bg{ padding:120px 0 60px; } .hero-text h1{ font-size:30px !important; line-height:40px !important; } .hero-text p{ font-size:15px; line-height:26px; } .hero-text-img img{ max-width:260px; } } /* MOBILE HERO IMAGE FULL HEIGHT */ @media only screen and (max-width:768px){ .hero-text-img{ margin-top:40px; margin-bottom:-80px; } .hero-text-img img{ width:100% !important; max-width:100% !important; height:auto; display:block; margin:0 auto; } .home_bg{ overflow:hidden; padding-bottom:0 !important; } } /* EXTRA SMALL MOBILE */ @media only screen and (max-width:480px){ .hero-text-img{ margin-bottom:-60px; } } /* ========================================= UNIVERSITIES MOBILE CLEAN FIX ========================================= */ @media only screen and (max-width:768px){ .partner-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:25px; align-items:center; } .partner-card{ background:none !important; box-shadow:none !important; padding:0 !important; border:none !important; display:flex; align-items:center; justify-content:center; } /* SAME SIZE ALL LOGOS */ .partner-card img{ width:100%; max-width:120px !important; height:70px !important; object-fit:contain; margin:auto; display:block; } } /* INCREASE UNIVERSITY LOGO SIZE MOBILE */ @media only screen and (max-width:768px){ .partner-card img{ max-width:300px !important; height:90px !important; object-fit:contain; } } /* ========================================= MOBILE HEADER LOGO FIX ========================================= */ @media only screen and (max-width:768px){ #navigation{ padding:16px 18px !important; min-height:auto !important; } .site-logo{ width:auto !important; } .site-logo img{ max-width:120px !important; height:auto !important; display:block; } /* REMOVE EXTRA BIG HEADER HEIGHT */ .navbar-light{ min-height:auto !important; } .row{ align-items:center; } /* MOBILE MENU ICON POSITION */ #sm_menu_ham{ top:28px !important; } } /* FIX MOBILE MENU ICON POSITION */ @media only screen and (max-width:768px){ #sm_menu_ham{ position:absolute !important; right:20px !important; top:45px !important; transform:none !important; } } /* ========================= AKWABA PREMIUM ABOUT LIGHT VERSION ========================= */ .akw-premium-about{ padding:120px 0; background:#ffffff; overflow:hidden; } .akw-about-left{ padding-right:40px; } .akw-mini-title{ display:inline-block; padding:10px 24px; background:#eef5ff; border-radius:50px; color:#005eff; font-size:14px; font-weight:700; letter-spacing:1px; margin-bottom:25px; } .akw-main-title{ font-size:60px; line-height:70px; color:#111; font-weight:800; margin-bottom:30px; } .akw-main-text{ color:#666; font-size:18px; line-height:32px; margin-bottom:45px; } .akw-feature-wrapper{ margin-bottom:45px; } .akw-single-feature{ display:flex; gap:20px; margin-bottom:30px; } .akw-feature-icon{ width:75px; height:75px; background:linear-gradient(135deg,#00c2ff,#005eff); border-radius:22px; display:flex; align-items:center; justify-content:center; flex-shrink:0; } .akw-feature-icon i{ color:#fff; font-size:30px; } .akw-feature-content h4{ color:#111; font-size:24px; margin-bottom:10px; } .akw-feature-content p{ color:#666; line-height:28px; margin:0; } .akw-btn-group{ display:flex; gap:20px; flex-wrap:wrap; } .akw-main-btn{ background:linear-gradient(135deg,#00c2ff,#005eff); color:#fff; padding:17px 38px; border-radius:14px; font-size:17px; font-weight:600; text-decoration:none; transition:0.4s; } .akw-main-btn:hover{ color:#fff; transform:translateY(-5px); } .akw-border-btn{ border:2px solid #dbe5f2; color:#111; padding:17px 38px; border-radius:14px; font-size:17px; font-weight:600; text-decoration:none; transition:0.4s; } .akw-border-btn:hover{ background:#005eff; color:#fff; border-color:#005eff; } /* RIGHT IMAGE */ .akw-about-right{ position:relative; text-align:center; } .akw-about-right img{ width:100%; max-width:520px; border-radius:30px; } .akw-floating-box{ position:absolute; background:#fff; padding:25px; border-radius:22px; box-shadow:0 20px 40px rgba(0,0,0,0.08); } .akw-floating-box h2{ color:#005eff; font-size:40px; font-weight:800; margin-bottom:8px; } .akw-floating-box p{ margin:0; color:#555; } .akw-box-one{ top:40px; left:-10px; } .akw-box-two{ bottom:40px; right:-10px; } /* ========================= SERVICES SECTION ========================= */ .akw-services-area{ padding:120px 0; background:#f8fbff; } .akw-section-head{ text-align:center; margin-bottom:70px; } .akw-section-head span{ color:#005eff; font-size:15px; font-weight:700; letter-spacing:1px; } .akw-section-head h2{ font-size:54px; line-height:64px; color:#111; margin-top:15px; font-weight:800; } .akw-service-card{ background:#fff; padding:45px 35px; border-radius:30px; box-shadow:0 10px 40px rgba(0,0,0,0.06); transition:0.4s; margin-bottom:30px; height:100%; } .akw-service-card:hover{ transform:translateY(-10px); } .akw-service-icon{ width:85px; height:85px; border-radius:24px; background:linear-gradient(135deg,#00c2ff,#005eff); display:flex; align-items:center; justify-content:center; margin-bottom:30px; } .akw-service-icon i{ color:#fff; font-size:34px; } .akw-service-card h3{ font-size:28px; margin-bottom:18px; color:#111; font-weight:700; } .akw-service-card p{ color:#666; font-size:17px; line-height:30px; } /* ========================= COUNTER SECTION ========================= */ .akw-counter-area{ padding:100px 0; background:linear-gradient(135deg,#005eff,#00c2ff); } .akw-counter-box{ text-align:center; padding:30px; } .akw-counter-box h2{ color:#fff; font-size:65px; font-weight:800; margin-bottom:10px; } .akw-counter-box p{ color:#fff; font-size:20px; margin:0; } /* ========================= MOBILE RESPONSIVE ========================= */ @media only screen and (max-width:991px){ .akw-premium-about{ padding:80px 0; } .akw-about-left{ padding-right:0; margin-bottom:60px; } .akw-main-title{ font-size:42px; line-height:54px; } .akw-section-head h2{ font-size:38px; line-height:50px; } .akw-floating-box{ position:relative; top:auto; bottom:auto; left:auto; right:auto; margin-top:20px; } } @media only screen and (max-width:767px){ .akw-main-title{ font-size:32px; line-height:42px; } .akw-main-text{ font-size:16px; line-height:30px; } .akw-single-feature{ flex-direction:column; } .akw-btn-group{ flex-direction:column; } .akw-main-btn, .akw-border-btn{ width:100%; text-align:center; } .akw-section-head h2{ font-size:30px; line-height:42px; } .akw-counter-box h2{ font-size:42px; } .akw-counter-box p{ font-size:16px; } } .single_footer a img{ width:180px; max-width:100%; height:auto; display:block; } #main-menu ul li.active > a{ font-weight:700; color:#005eff !important; } /* ===================================================== INDIA COMPLETE SECTION ===================================================== */ .india_complete_section{ position: relative; padding: 120px 0; background: #f8f9fc; overflow: hidden; } /* ===================================================== HEADING ===================================================== */ .india_big_heading{ max-width: 950px; margin: auto; margin-bottom: 80px; } .india_top_badge{ display: inline-block; background: #ff7b00; color: #fff; font-size: 14px; font-weight: 700; padding: 12px 28px; border-radius: 50px; letter-spacing: 1px; margin-bottom: 25px; } .india_big_heading h1{ font-size: 58px; line-height: 72px; font-weight: 800; color: #111; margin-bottom: 25px; } .india_big_heading p{ font-size: 18px; line-height: 34px; color: #555; } /* ===================================================== ROWS ===================================================== */ .india_row_space{ margin-bottom: 120px; } .india_large_image{ position: relative; overflow: hidden; border-radius: 30px; box-shadow: 0 20px 60px rgba(0,0,0,0.08); } .india_large_image img{ width: 100%; height: 620px; object-fit: cover; border-radius: 30px; transition: 0.5s; } .india_large_image:hover img{ transform: scale(1.05); } /* ===================================================== TEXT CONTENT ===================================================== */ .india_text_content{ padding-left: 30px; } .india_small_heading{ display: inline-block; color: #ff7b00; font-size: 15px; font-weight: 700; letter-spacing: 2px; margin-bottom: 18px; } .india_text_content h2{ font-size: 46px; line-height: 60px; font-weight: 800; color: #111; margin-bottom: 25px; } .india_text_content p{ font-size: 17px; line-height: 32px; color: #555; margin-bottom: 20px; } /* ===================================================== TICK LIST ===================================================== */ .india_tick_list{ margin-top: 25px; padding: 0; list-style: none; } .india_tick_list li{ font-size: 17px; color: #222; margin-bottom: 18px; font-weight: 600; } /* ===================================================== INFO GRID ===================================================== */ .india_info_grid{ display: grid; grid-template-columns: repeat(2,1fr); gap: 25px; margin-top: 35px; } .india_info_box{ background: #fff; padding: 28px; border-radius: 22px; box-shadow: 0 10px 40px rgba(0,0,0,0.06); transition: 0.4s; } .india_info_box:hover{ transform: translateY(-8px); } .india_info_box h4{ font-size: 22px; font-weight: 700; margin-bottom: 14px; color: #111; } .india_info_box p{ font-size: 15px; line-height: 28px; margin: 0; } /* ===================================================== CENTER HEADING ===================================================== */ .india_center_heading{ margin-bottom: 70px; } .india_center_heading span{ display: inline-block; color: #ff7b00; font-size: 15px; font-weight: 700; letter-spacing: 2px; margin-bottom: 18px; } .india_center_heading h2{ font-size: 50px; line-height: 66px; font-weight: 800; color: #111; margin-bottom: 20px; } .india_center_heading p{ max-width: 750px; margin: auto; font-size: 17px; line-height: 32px; color: #555; } /* ===================================================== COURSE SECTION ===================================================== */ .india_courses_wrapper{ margin-bottom: 130px; } .india_course_card{ background: #fff; padding: 45px 35px; border-radius: 30px; text-align: center; margin-bottom: 30px; transition: 0.4s; box-shadow: 0 10px 50px rgba(0,0,0,0.05); height: 100%; } .india_course_card:hover{ transform: translateY(-10px); } .india_course_icon{ width: 95px; height: 95px; line-height: 95px; text-align: center; background: #fff3e8; border-radius: 50%; margin: auto; margin-bottom: 30px; font-size: 42px; } .india_course_card h3{ font-size: 28px; font-weight: 700; color: #111; margin-bottom: 18px; } .india_course_card p{ font-size: 16px; line-height: 30px; color: #666; } /* ===================================================== UNIVERSITIES ===================================================== */ .india_university_wrapper{ margin-bottom: 130px; } .india_university_card{ background: #fff; border-radius: 30px; overflow: hidden; margin-bottom: 35px; box-shadow: 0 10px 50px rgba(0,0,0,0.06); transition: 0.4s; } .india_university_card:hover{ transform: translateY(-10px); } .india_university_card img{ width: 100%; height: 260px; object-fit: cover; } .india_university_content{ padding: 35px; } .india_university_content h3{ font-size: 30px; font-weight: 700; color: #111; margin-bottom: 18px; } .india_university_content p{ font-size: 16px; line-height: 30px; color: #555; margin-bottom: 20px; } .india_university_content ul{ padding: 0; list-style: none; } .india_university_content ul li{ margin-bottom: 12px; font-size: 16px; color: #222; font-weight: 600; } /* ===================================================== PROCESS SECTION ===================================================== */ .india_process_wrapper{ margin-bottom: 130px; } .india_step_card{ background: #fff; padding: 45px 30px; border-radius: 28px; text-align: center; box-shadow: 0 10px 45px rgba(0,0,0,0.05); transition: 0.4s; margin-bottom: 30px; } .india_step_card:hover{ transform: translateY(-10px); } .india_step_number{ width: 85px; height: 85px; line-height: 85px; margin: auto; margin-bottom: 25px; background: linear-gradient(135deg,#ff7b00,#ffb347); color: #fff; font-size: 30px; font-weight: 800; border-radius: 50%; } .india_step_card h3{ font-size: 28px; font-weight: 700; margin-bottom: 18px; color: #111; } .india_step_card p{ font-size: 16px; line-height: 30px; color: #666; } /* ===================================================== CTA SECTION ===================================================== */ .india_big_cta{ background: linear-gradient(135deg,#ff7b00,#ffb347); padding: 70px; border-radius: 35px; overflow: hidden; } .india_cta_content span{ display: inline-block; color: #fff; font-size: 15px; font-weight: 700; letter-spacing: 2px; margin-bottom: 18px; } .india_cta_content h2{ font-size: 48px; line-height: 62px; font-weight: 800; color: #fff; margin-bottom: 22px; } .india_cta_content p{ font-size: 18px; line-height: 34px; color: rgba(255,255,255,0.9); } .india_cta_buttons{ text-align: right; } .india_apply_btn{ display: inline-block; background: #fff; color: #111; padding: 18px 40px; border-radius: 50px; font-size: 16px; font-weight: 700; text-decoration: none; margin-right: 15px; transition: 0.4s; } .india_apply_btn:hover{ background: #111; color: #fff; } .india_whatsapp_btn{ display: inline-block; background: #111; color: #fff; padding: 18px 40px; border-radius: 50px; font-size: 16px; font-weight: 700; text-decoration: none; transition: 0.4s; } .india_whatsapp_btn:hover{ background: #fff; color: #111; } /* ===================================================== RESPONSIVE ===================================================== */ @media only screen and (max-width:991px){ .india_complete_section{ padding: 80px 0; } .india_big_heading h1{ font-size: 40px; line-height: 54px; } .india_center_heading h2{ font-size: 38px; line-height: 52px; } .india_text_content{ padding-left: 0; margin-top: 40px; } .india_text_content h2{ font-size: 34px; line-height: 48px; } .india_large_image img{ height: auto; } .india_info_grid{ grid-template-columns: 1fr; } .india_cta_buttons{ text-align: left; margin-top: 35px; } .india_big_cta{ padding: 45px 30px; } .india_cta_content h2{ font-size: 34px; line-height: 48px; } } @media only screen and (max-width:767px){ .india_big_heading h1{ font-size: 32px; line-height: 46px; } .india_big_heading p{ font-size: 16px; line-height: 30px; } .india_center_heading h2{ font-size: 30px; line-height: 44px; } .india_course_card, .india_university_card, .india_step_card{ border-radius: 22px; } .india_apply_btn, .india_whatsapp_btn{ width: 100%; text-align: center; margin-bottom: 15px; margin-right: 0; } } .india_university_card img{ width: 100% !important; aspect-ratio: 938 / 375 !important; object-fit: cover !important; object-position: center !important; display: block; }/* UNIVERSITY IMAGE FIX */ .india_university_card{ overflow: hidden; border-radius: 25px; } .india_university_card img{ width: 100% !important; height: auto !important; aspect-ratio: 938 / 375 !important; object-fit: cover !important; display: block !important; } /* REMOVE OLD FIXED HEIGHT */ .india_university_content{ padding: 30px; } .india_university_card{ overflow: hidden; border-radius: 0 !important; } .india_university_card img{ border-radius: 0 !important; } /* ========================================= DARK BLUE PREMIUM COURSE DESIGN ========================================= */ .ug_courses_section{ padding: 110px 0; background: #f4f7fc; } /* HEADING */ .ug_courses_heading{ text-align: center; max-width: 850px; margin: auto; margin-bottom: 70px; } .ug_courses_heading span{ display: inline-block; background: rgba(16,42,67,0.08); color: #102a43; padding: 10px 24px; border-radius: 50px; font-size: 14px; font-weight: 700; letter-spacing: 2px; margin-bottom: 22px; } .ug_courses_heading h2{ font-size: 58px; line-height: 70px; font-weight: 800; color: #102a43; margin-bottom: 24px; } .ug_courses_heading p{ font-size: 17px; line-height: 32px; color: #52606d; } /* GRID */ .ug_courses_section .row{ row-gap: 30px; } /* CARD */ .ug_course_card{ background: #ffffff; border-radius: 28px; padding: 40px; position: relative; overflow: hidden; transition: 0.4s; border: 1px solid #dde7f0; height: 100%; box-shadow: 0 12px 40px rgba(16,42,67,0.06); } /* TOP BORDER */ .ug_course_card::before{ content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 6px; background: linear-gradient(to right,#102a43,#1f4e79); } /* HOVER */ .ug_course_card:hover{ transform: translateY(-10px); box-shadow: 0 20px 50px rgba(16,42,67,0.12); } /* ICON */ .ug_course_icon{ width: 82px; height: 82px; border-radius: 22px; background: linear-gradient(135deg,#102a43,#1f4e79); display: flex; align-items: center; justify-content: center; color: #fff; font-size: 32px; margin-bottom: 28px; } /* TITLE */ .ug_course_card h3{ font-size: 30px; line-height: 42px; font-weight: 700; color: #102a43; margin-bottom: 26px; } /* LIST */ .ug_course_card ul{ list-style: none; padding: 0; margin: 0; } .ug_course_card ul li{ position: relative; padding-left: 32px; margin-bottom: 16px; color: #52606d; font-size: 16px; line-height: 28px; font-weight: 500; } /* CUSTOM CHECK */ .ug_course_card ul li::before{ content: "\f00c"; font-family: "Font Awesome 6 Free"; font-weight: 900; position: absolute; left: 0; top: 3px; width: 20px; height: 20px; line-height: 20px; text-align: center; border-radius: 50%; background: rgba(16,42,67,0.1); color: #102a43; font-size: 10px; } /* MOBILE */ @media only screen and (max-width:991px){ .ug_courses_heading h2{ font-size: 46px; line-height: 58px; } } @media only screen and (max-width:767px){ .ug_courses_section{ padding: 80px 0; } .ug_courses_heading{ margin-bottom: 50px; } .ug_courses_heading h2{ font-size: 34px; line-height: 46px; } .ug_courses_heading p{ font-size: 16px; line-height: 30px; } .ug_course_card{ padding: 30px 24px; border-radius: 22px; } .ug_course_icon{ width: 70px; height: 70px; font-size: 28px; } .ug_course_card h3{ font-size: 24px; line-height: 36px; } .ug_course_card ul li{ font-size: 15px; line-height: 26px; } } /* ========================================= INTERACTIVE USER AREA - FINAL SPACING VERSION ========================================= */ .ug_interaction_area{ position: relative; margin-top: 80px; margin-left: 25px; margin-right: 25px; padding: 60px 30px; background: linear-gradient(135deg,#102a43,#1f4e79); border-radius: 28px; overflow: hidden; width: auto; box-sizing: border-box; } /* GLOW EFFECTS */ .ug_interaction_area::before{ content: ""; position: absolute; width: 260px; height: 260px; border-radius: 50%; background: rgba(255,255,255,0.06); top: -120px; right: -120px; } .ug_interaction_area::after{ content: ""; position: absolute; width: 200px; height: 200px; border-radius: 50%; background: rgba(255,255,255,0.04); bottom: -90px; left: -90px; } /* CONTENT */ .ug_interaction_content{ position: relative; z-index: 2; text-align: center; max-width: 780px; margin: auto; } /* BADGE */ .ug_live_badge{ display: inline-flex; align-items: center; justify-content: center; gap: 10px; background: rgba(255,255,255,0.12); color: #fff; padding: 10px 22px; border-radius: 100px; font-size: 13px; font-weight: 600; margin-bottom: 24px; flex-wrap: wrap; } .ug_live_badge span{ width: 10px; height: 10px; border-radius: 50%; background: #00ff88; animation: pulseGlow 1.5s infinite; } /* TITLE */ .ug_interaction_content h3{ font-size: 52px; line-height: 66px; font-weight: 800; color: #fff; margin-bottom: 22px; } /* TEXT */ .ug_interaction_content p{ font-size: 17px; line-height: 32px; color: rgba(255,255,255,0.85); margin-bottom: 35px; } /* BUTTON AREA */ .ug_interaction_buttons{ display: flex; justify-content: center; gap: 18px; flex-wrap: wrap; } /* BUTTONS */ .ug_primary_btn, .ug_secondary_btn{ display: inline-flex; align-items: center; justify-content: center; padding: 16px 30px; border-radius: 100px; font-size: 15px; font-weight: 700; text-decoration: none; transition: 0.4s; } .ug_primary_btn{ background: #fff; color: #102a43; } .ug_primary_btn:hover{ background: #f3f6fb; color: #102a43; transform: translateY(-4px); } .ug_secondary_btn{ background: rgba(255,255,255,0.12); border: 1px solid rgba(255,255,255,0.2); color: #fff; } .ug_secondary_btn:hover{ background: #fff; color: #102a43; transform: translateY(-4px); } /* ANIMATION */ @keyframes pulseGlow{ 0%{ transform: scale(1); opacity: 1; } 50%{ transform: scale(1.4); opacity: 0.5; } 100%{ transform: scale(1); opacity: 1; } } /* TABLET */ @media only screen and (max-width:991px){ .ug_interaction_content h3{ font-size: 42px; line-height: 56px; } } /* MOBILE */ @media only screen and (max-width:767px){ .ug_interaction_area{ margin-left: 12px; margin-right: 12px; padding: 40px 15px; border-radius: 22px; margin-top: 55px; } .ug_live_badge{ font-size: 12px; padding: 9px 16px; } .ug_interaction_content h3{ font-size: 28px; line-height: 40px; } .ug_interaction_content p{ font-size: 15px; line-height: 28px; } .ug_interaction_buttons{ flex-direction: column; gap: 14px; } .ug_primary_btn, .ug_secondary_btn{ width: 100%; padding: 15px 18px; font-size: 14px; } } /* ========================================= CONTACT PAGE CSS ========================================= */ .akw_contact_hero{ padding: 120px 0 90px; background: linear-gradient(135deg,#102a43,#1f4e79); text-align: center; } .akw_contact_hero_content span{ display: inline-block; background: rgba(255,255,255,0.12); color: #fff; padding: 10px 22px; border-radius: 100px; font-size: 13px; font-weight: 700; letter-spacing: 2px; margin-bottom: 25px; } .akw_contact_hero_content h1{ font-size: 68px; line-height: 82px; color: #fff; font-weight: 800; margin-bottom: 25px; } .akw_contact_hero_content p{ max-width: 850px; margin: auto; font-size: 18px; line-height: 34px; color: rgba(255,255,255,0.85); } /* MAIN CONTACT */ .akw_contact_section{ padding: 110px 0; background: #f5f7fb; } .akw_contact_left{ padding-right: 30px; } .akw_contact_tag{ display: inline-block; color: #1f4e79; font-size: 14px; font-weight: 700; letter-spacing: 2px; margin-bottom: 20px; } .akw_contact_left h2{ font-size: 52px; line-height: 66px; color: #102a43; font-weight: 800; margin-bottom: 25px; } .akw_contact_left p{ font-size: 17px; line-height: 32px; color: #52606d; margin-bottom: 40px; } /* INFO BOX */ .akw_contact_info_box{ display: flex; gap: 22px; background: #fff; border-radius: 24px; padding: 28px; margin-bottom: 22px; box-shadow: 0 10px 35px rgba(0,0,0,0.05); } .akw_contact_icon{ min-width: 72px; height: 72px; border-radius: 20px; background: linear-gradient(135deg,#102a43,#1f4e79); display: flex; align-items: center; justify-content: center; color: #fff; font-size: 28px; } .akw_contact_text h4{ font-size: 24px; font-weight: 700; color: #102a43; margin-bottom: 10px; } .akw_contact_text p{ margin: 0; font-size: 16px; line-height: 28px; } /* FORM */ .akw_contact_form_area{ background: #fff; padding: 50px; border-radius: 30px; box-shadow: 0 15px 50px rgba(0,0,0,0.06); } .akw_form_heading h3{ font-size: 42px; color: #102a43; font-weight: 800; margin-bottom: 15px; } .akw_form_heading p{ font-size: 16px; line-height: 30px; color: #52606d; margin-bottom: 35px; } .akw_input_box{ margin-bottom: 24px; } .akw_input_box label{ display: block; font-size: 15px; font-weight: 600; color: #102a43; margin-bottom: 10px; } .akw_input_box input, .akw_input_box select, .akw_input_box textarea{ width: 100%; border: 1px solid #d9e2ec; background: #f8fafc; border-radius: 18px; padding: 18px 20px; font-size: 15px; color: #102a43; outline: none; transition: 0.3s; } .akw_input_box input:focus, .akw_input_box select:focus, .akw_input_box textarea:focus{ border-color: #1f4e79; background: #fff; } .akw_submit_btn{ width: 100%; border: none; background: linear-gradient(135deg,#102a43,#1f4e79); color: #fff; padding: 18px; border-radius: 18px; font-size: 16px; font-weight: 700; transition: 0.4s; } .akw_submit_btn:hover{ transform: translateY(-4px); } /* WHATSAPP */ .akw_whatsapp_area{ padding-bottom: 110px; background: #f5f7fb; } .akw_whatsapp_box{ background: linear-gradient(135deg,#102a43,#1f4e79); padding: 55px; border-radius: 32px; } .akw_whatsapp_text span{ color: rgba(255,255,255,0.75); font-size: 14px; letter-spacing: 2px; font-weight: 700; } .akw_whatsapp_text h2{ font-size: 48px; line-height: 60px; color: #fff; font-weight: 800; margin: 15px 0; } .akw_whatsapp_text p{ color: rgba(255,255,255,0.85); font-size: 17px; line-height: 32px; } .akw_whatsapp_btn{ display: inline-flex; align-items: center; gap: 12px; background: #fff; color: #102a43; padding: 18px 34px; border-radius: 100px; text-decoration: none; font-size: 16px; font-weight: 700; } /* MOBILE */ @media only screen and (max-width:767px){ .akw_contact_hero{ padding: 90px 0 70px; } .akw_contact_hero_content h1{ font-size: 38px; line-height: 50px; } .akw_contact_hero_content p{ font-size: 15px; line-height: 28px; } .akw_contact_section{ padding: 70px 0; } .akw_contact_left{ padding-right: 0; margin-bottom: 40px; } .akw_contact_left h2{ font-size: 34px; line-height: 46px; } .akw_contact_form_area{ padding: 30px 20px; border-radius: 22px; } .akw_form_heading h3{ font-size: 30px; } .akw_whatsapp_box{ padding: 35px 22px; border-radius: 24px; text-align: center; } .akw_whatsapp_text h2{ font-size: 32px; line-height: 44px; } .akw_whatsapp_btn{ width: 100%; justify-content: center; margin-top: 20px; } } /* ========================================= PREMIUM FOOTER CSS ========================================= */ .akw_new_footer{ background: #081b2e; padding: 100px 0 40px; position: relative; overflow: hidden; } /* ABOUT */ .akw_footer_about img{ width: 180px; margin-bottom: 25px; } .akw_brand_badge{ display: inline-block; background: rgba(255,255,255,0.08); color: #7fb3ff; padding: 10px 18px; border-radius: 100px; font-size: 13px; font-weight: 700; margin-bottom: 22px; } .akw_footer_about h3{ font-size: 34px; line-height: 46px; color: #fff; font-weight: 800; margin-bottom: 22px; } .akw_footer_about p{ color: rgba(255,255,255,0.72); font-size: 16px; line-height: 31px; margin-bottom: 20px; } /* SOCIAL */ .akw_footer_social{ display: flex; align-items: center; gap: 14px; margin-top: 30px; } .akw_footer_social a{ width: 48px; height: 48px; border-radius: 50%; background: rgba(255,255,255,0.08); display: flex; align-items: center; justify-content: center; color: #fff; text-decoration: none; transition: 0.4s; } .akw_footer_social a:hover{ background: #1f4e79; transform: translateY(-5px); } /* BOX */ .akw_footer_box{ background: rgba(255,255,255,0.03); border: 1px solid rgba(255,255,255,0.06); padding: 35px; border-radius: 28px; height: 100%; } /* TITLE */ .akw_footer_title{ display: flex; align-items: center; gap: 12px; color: #fff; font-size: 20px; font-weight: 700; margin-bottom: 28px; } .akw_footer_title span{ font-size: 26px; } /* INFO */ .akw_footer_info h4{ color: #7fb3ff; font-size: 22px; font-weight: 700; margin-bottom: 14px; } .akw_footer_info p{ color: rgba(255,255,255,0.72); font-size: 15px; line-height: 30px; margin-bottom: 25px; } /* CONTACT */ .akw_footer_contact_line{ display: flex; gap: 15px; margin-bottom: 18px; color: rgba(255,255,255,0.78); font-size: 15px; line-height: 28px; } .akw_footer_contact_line i{ color: #7fb3ff; margin-top: 5px; } /* DIVIDER */ .akw_footer_divider{ width: 100%; height: 1px; background: rgba(255,255,255,0.08); margin: 35px 0; } .akw_mt{ margin-top: 10px; } /* BOTTOM */ .akw_footer_bottom{ margin-top: 70px; padding-top: 35px; border-top: 1px solid rgba(255,255,255,0.08); } .akw_footer_bottom p{ color: rgba(255,255,255,0.65); font-size: 15px; line-height: 30px; margin: 0; } .akw_footer_bottom h5{ color: #fff; font-size: 16px; line-height: 30px; font-weight: 600; margin: 0; } /* MOBILE */ @media only screen and (max-width:991px){ .akw_footer_box{ margin-top: 30px; } } @media only screen and (max-width:767px){ .akw_new_footer{ padding: 70px 0 30px; } .akw_footer_about h3{ font-size: 28px; line-height: 40px; } .akw_footer_box{ padding: 28px 22px; border-radius: 22px; } .akw_footer_title{ font-size: 18px; } .akw_footer_info h4{ font-size: 20px; } .akw_footer_bottom{ text-align: center; } .akw_footer_bottom h5{ margin-top: 15px; font-size: 15px; } } /* FORCE NEW FOOTER COLOR */ .footer.akw_new_footer{ background: linear-gradient(135deg,#0f172a,#1e293b) !important; } /* INNER BOXES */ .footer.akw_new_footer .akw_footer_box{ background: rgba(255,255,255,0.04) !important; border: 1px solid rgba(255,255,255,0.08) !important; } /* BADGE */ .footer.akw_new_footer .akw_brand_badge{ background: rgba(96,165,250,0.12) !important; color: #93c5fd !important; } /* TITLES */ .footer.akw_new_footer .akw_footer_info h4{ color: #93c5fd !important; } /* ICONS */ .footer.akw_new_footer .akw_footer_contact_line i{ color: #93c5fd !important; } /* SOCIAL */ .footer.akw_new_footer .akw_footer_social a:hover{ background: #2563eb !important; } /* ========================================= PG COURSES PAGE CSS ========================================= */ .pg_courses_hero{ position: relative; padding: 130px 0 110px; background: linear-gradient(135deg,#0f172a,#1e3a5f); overflow: hidden; } .pg_courses_hero::before{ content: ""; position: absolute; width: 420px; height: 420px; background: rgba(255,255,255,0.05); border-radius: 50%; top: -180px; right: -120px; } .pg_courses_hero::after{ content: ""; position: absolute; width: 280px; height: 280px; background: rgba(255,255,255,0.04); border-radius: 50%; bottom: -120px; left: -80px; } .pg_courses_hero_content{ position: relative; z-index: 2; } .pg_courses_hero_content span{ display: inline-block; background: rgba(255,255,255,0.12); color: #dbeafe; padding: 12px 24px; border-radius: 100px; font-size: 13px; font-weight: 700; letter-spacing: 2px; margin-bottom: 28px; } .pg_courses_hero_content h1{ font-size: 72px; line-height: 88px; font-weight: 800; color: #fff; margin-bottom: 28px; } .pg_courses_hero_content p{ max-width: 860px; margin: auto; color: rgba(255,255,255,0.82); font-size: 18px; line-height: 34px; } /* ========================================= PG COURSES SECTION ========================================= */ .pg_courses_section{ padding: 110px 0; background: #f4f7fb; } .pg_courses_section .row{ row-gap: 30px; } .pg_course_card{ position: relative; background: #fff; border-radius: 30px; padding: 38px; overflow: hidden; height: 100%; transition: 0.4s; border: 1px solid #e6edf5; box-shadow: 0 10px 35px rgba(0,0,0,0.04); } .pg_course_card:hover{ transform: translateY(-10px); box-shadow: 0 18px 50px rgba(0,0,0,0.08); } .pg_course_card::before{ content: ""; position: absolute; width: 140px; height: 140px; background: rgba(30,58,95,0.05); border-radius: 50%; top: -60px; right: -60px; } .pg_course_icon{ width: 88px; height: 88px; border-radius: 24px; background: linear-gradient(135deg,#0f172a,#1e3a5f); display: flex; align-items: center; justify-content: center; color: #fff; font-size: 32px; margin-bottom: 28px; position: relative; z-index: 2; } .pg_course_content{ position: relative; z-index: 2; } .pg_course_content h3{ font-size: 32px; line-height: 42px; color: #0f172a; font-weight: 800; margin-bottom: 18px; } .pg_course_content p{ color: #52606d; font-size: 16px; line-height: 31px; margin-bottom: 22px; } .pg_course_content ul{ padding: 0; margin: 0; list-style: none; } .pg_course_content ul li{ position: relative; padding-left: 32px; margin-bottom: 14px; color: #334e68; font-size: 15px; font-weight: 500; } .pg_course_content ul li::before{ content: "\f058"; font-family: "Font Awesome 6 Free"; font-weight: 900; position: absolute; left: 0; top: 0; color: #2563eb; } /* ========================================= RESEARCH SECTION ========================================= */ .pg_research_section{ padding-bottom: 120px; background: #f4f7fb; } .pg_research_box{ background: linear-gradient(135deg,#0f172a,#1e3a5f); border-radius: 38px; padding: 70px; overflow: hidden; position: relative; } .pg_research_box::before{ content: ""; position: absolute; width: 350px; height: 350px; background: rgba(255,255,255,0.05); border-radius: 50%; top: -180px; right: -140px; } .pg_research_content{ position: relative; z-index: 2; } .pg_research_content span{ display: inline-block; color: #bfdbfe; font-size: 14px; font-weight: 700; letter-spacing: 2px; margin-bottom: 18px; } .pg_research_content h2{ font-size: 58px; line-height: 72px; color: #fff; font-weight: 800; margin-bottom: 25px; } .pg_research_content p{ color: rgba(255,255,255,0.82); font-size: 17px; line-height: 33px; margin-bottom: 38px; } .pg_research_buttons{ display: flex; gap: 18px; flex-wrap: wrap; } .pg_apply_btn, .pg_explore_btn{ display: inline-flex; align-items: center; justify-content: center; padding: 18px 34px; border-radius: 100px; text-decoration: none; font-size: 15px; font-weight: 700; transition: 0.4s; } .pg_apply_btn{ background: #fff; color: #0f172a; } .pg_apply_btn:hover{ background: #e2e8f0; color: #0f172a; transform: translateY(-4px); } .pg_explore_btn{ background: rgba(255,255,255,0.1); border: 1px solid rgba(255,255,255,0.18); color: #fff; } .pg_explore_btn:hover{ background: #fff; color: #0f172a; transform: translateY(-4px); } .pg_research_image{ position: relative; z-index: 2; } .pg_research_image img{ width: 100%; height: 460px; object-fit: cover; border-radius: 30px; } /* ========================================= MOBILE RESPONSIVE ========================================= */ @media only screen and (max-width:991px){ .pg_courses_hero_content h1{ font-size: 54px; line-height: 68px; } .pg_research_content h2{ font-size: 44px; line-height: 58px; } } @media only screen and (max-width:767px){ .pg_courses_hero{ padding: 90px 0 70px; } .pg_courses_hero_content h1{ font-size: 38px; line-height: 50px; } .pg_courses_hero_content p{ font-size: 15px; line-height: 28px; } .pg_courses_section{ padding: 70px 0; } .pg_course_card{ padding: 28px 22px; border-radius: 22px; } .pg_course_icon{ width: 72px; height: 72px; font-size: 28px; border-radius: 20px; } .pg_course_content h3{ font-size: 25px; line-height: 36px; } .pg_course_content p{ font-size: 15px; line-height: 28px; } .pg_research_section{ padding-bottom: 70px; } .pg_research_box{ padding: 35px 20px; border-radius: 24px; } .pg_research_content h2{ font-size: 34px; line-height: 46px; } .pg_research_content p{ font-size: 15px; line-height: 28px; } .pg_research_buttons{ flex-direction: column; } .pg_apply_btn, .pg_explore_btn{ width: 100%; } .pg_research_image img{ height: 260px; margin-top: 30px; border-radius: 22px; } } /* ========================================= PHD PAGE CSS ========================================= */ .phd_hero_section{ position: relative; padding: 130px 0 110px; background: linear-gradient(135deg,#081b2e,#163b63); overflow: hidden; } .phd_hero_section::before{ content: ""; position: absolute; width: 420px; height: 420px; background: rgba(255,255,255,0.05); border-radius: 50%; top: -180px; right: -120px; } .phd_hero_section::after{ content: ""; position: absolute; width: 260px; height: 260px; background: rgba(255,255,255,0.04); border-radius: 50%; bottom: -120px; left: -80px; } .phd_hero_content{ position: relative; z-index: 2; } .phd_hero_content span{ display: inline-block; background: rgba(255,255,255,0.12); color: #dbeafe; padding: 12px 24px; border-radius: 100px; font-size: 13px; font-weight: 700; letter-spacing: 2px; margin-bottom: 28px; } .phd_hero_content h1{ font-size: 72px; line-height: 88px; color: #fff; font-weight: 800; margin-bottom: 28px; } .phd_hero_content p{ max-width: 860px; margin: auto; color: rgba(255,255,255,0.82); font-size: 18px; line-height: 34px; } /* FEATURES */ .phd_features_section{ padding: 100px 0 60px; background: #f4f7fb; } .phd_feature_card{ background: #fff; border-radius: 30px; padding: 40px; text-align: center; transition: 0.4s; margin-bottom: 30px; border: 1px solid #e6edf5; box-shadow: 0 10px 35px rgba(0,0,0,0.04); } .phd_feature_card:hover{ transform: translateY(-10px); } .phd_feature_icon{ width: 90px; height: 90px; margin: auto auto 28px; border-radius: 26px; background: linear-gradient(135deg,#081b2e,#163b63); display: flex; align-items: center; justify-content: center; color: #fff; font-size: 34px; } .phd_feature_card h3{ font-size: 30px; color: #081b2e; font-weight: 800; margin-bottom: 18px; } .phd_feature_card p{ color: #52606d; font-size: 16px; line-height: 30px; } /* PROGRAMS */ .phd_programs_section{ padding: 50px 0 110px; background: #f4f7fb; } .phd_section_heading{ margin-bottom: 60px; } .phd_section_heading span{ display: inline-block; color: #2563eb; font-size: 14px; font-weight: 700; letter-spacing: 2px; margin-bottom: 16px; } .phd_section_heading h2{ font-size: 58px; line-height: 72px; color: #081b2e; font-weight: 800; margin-bottom: 20px; } .phd_section_heading p{ max-width: 780px; margin: auto; color: #52606d; font-size: 17px; line-height: 32px; } .phd_programs_section .row{ row-gap: 30px; } .phd_program_card{ background: #fff; border-radius: 30px; padding: 40px; height: 100%; border: 1px solid #e6edf5; box-shadow: 0 10px 35px rgba(0,0,0,0.04); transition: 0.4s; } .phd_program_card:hover{ transform: translateY(-8px); } .phd_program_top{ display: flex; align-items: center; gap: 20px; margin-bottom: 24px; } .phd_program_icon{ width: 82px; height: 82px; border-radius: 24px; background: linear-gradient(135deg,#081b2e,#163b63); display: flex; align-items: center; justify-content: center; color: #fff; font-size: 30px; } .phd_program_top h3{ font-size: 28px; color: #081b2e; font-weight: 800; margin-bottom: 8px; } .phd_program_top span{ color: #2563eb; font-size: 14px; font-weight: 600; } .phd_program_card p{ color: #52606d; font-size: 16px; line-height: 31px; margin-bottom: 24px; } .phd_program_card ul{ padding: 0; margin: 0; list-style: none; } .phd_program_card ul li{ position: relative; padding-left: 32px; margin-bottom: 14px; color: #334e68; font-size: 15px; font-weight: 500; } .phd_program_card ul li::before{ content: "\f058"; font-family: "Font Awesome 6 Free"; font-weight: 900; position: absolute; left: 0; top: 0; color: #2563eb; } /* CTA */ .phd_cta_section{ padding-bottom: 120px; background: #f4f7fb; } .phd_cta_box{ background: linear-gradient(135deg,#081b2e,#163b63); border-radius: 38px; padding: 70px; position: relative; overflow: hidden; } .phd_cta_box::before{ content: ""; position: absolute; width: 320px; height: 320px; background: rgba(255,255,255,0.05); border-radius: 50%; right: -120px; top: -120px; } .phd_cta_content{ position: relative; z-index: 2; } .phd_cta_content span{ display: inline-block; color: #bfdbfe; font-size: 14px; font-weight: 700; letter-spacing: 2px; margin-bottom: 16px; } .phd_cta_content h2{ font-size: 56px; line-height: 70px; color: #fff; font-weight: 800; margin-bottom: 22px; } .phd_cta_content p{ color: rgba(255,255,255,0.82); font-size: 17px; line-height: 32px; } .phd_cta_buttons{ display: flex; justify-content: flex-end; gap: 18px; flex-wrap: wrap; position: relative; z-index: 2; } .phd_apply_btn, .phd_contact_btn{ display: inline-flex; align-items: center; justify-content: center; padding: 18px 34px; border-radius: 100px; text-decoration: none; font-size: 15px; font-weight: 700; transition: 0.4s; } .phd_apply_btn{ background: #fff; color: #081b2e; } .phd_apply_btn:hover{ background: #dbeafe; color: #081b2e; transform: translateY(-4px); } .phd_contact_btn{ background: rgba(255,255,255,0.1); border: 1px solid rgba(255,255,255,0.18); color: #fff; } .phd_contact_btn:hover{ background: #fff; color: #081b2e; transform: translateY(-4px); } /* MOBILE */ @media only screen and (max-width:991px){ .phd_hero_content h1{ font-size: 56px; line-height: 70px; } .phd_section_heading h2, .phd_cta_content h2{ font-size: 44px; line-height: 58px; } } @media only screen and (max-width:767px){ .phd_hero_section{ padding: 90px 0 70px; } .phd_hero_content h1{ font-size: 38px; line-height: 50px; } .phd_hero_content p{ font-size: 15px; line-height: 28px; } .phd_features_section{ padding: 70px 0 40px; } .phd_feature_card{ padding: 30px 22px; border-radius: 22px; } .phd_feature_card h3{ font-size: 24px; } .phd_programs_section{ padding: 40px 0 70px; } .phd_section_heading h2{ font-size: 34px; line-height: 46px; } .phd_program_card{ padding: 28px 22px; border-radius: 22px; } .phd_program_top{ flex-direction: column; align-items: flex-start; } .phd_program_top h3{ font-size: 24px; } .phd_cta_section{ padding-bottom: 70px; } .phd_cta_box{ padding: 35px 22px; border-radius: 24px; } .phd_cta_content h2{ font-size: 34px; line-height: 46px; } .phd_cta_buttons{ justify-content: flex-start; flex-direction: column; margin-top: 25px; } .phd_apply_btn, .phd_contact_btn{ width: 100%; } } /* REMOVE GAP BETWEEN NUMBER LINES */ .akw_footer_contact_line{ margin-bottom: 4px !important; gap: 10px; align-items: flex-start; } .akw_footer_contact_line i{ margin-top: 3px; } /* INDIA OFFICE LAST TEXT WHITE */ .akw_footer_support_text{ color: #93c5fd; font-size: 15px; line-height: 30px; font-weight: 500; margin-top: 22px; } .akw_footer_white_text{ color: #ffffff; font-size: 16px; line-height: 30px; font-weight: 600; margin-top: 25px; } .akw_social_name{ color: rgba(255,255,255,0.75); font-size: 18px; font-weight: 1000; margin-left: 8px; } /* ========================================= COURSE SELECTION PROCESS ========================================= */ .course_selection_process{ padding: 110px 0; background: #f4f7fb; } /* HEADING */ .course_process_heading{ margin-bottom: 70px; } .course_process_heading span{ display: inline-block; color: #2563eb; font-size: 14px; font-weight: 700; letter-spacing: 2px; margin-bottom: 18px; } .course_process_heading h2{ font-size: 58px; line-height: 72px; color: #081b2e; font-weight: 800; margin-bottom: 22px; } .course_process_heading p{ max-width: 760px; margin: auto; color: #52606d; font-size: 17px; line-height: 32px; } /* CARDS */ .course_selection_process .row{ row-gap: 30px; } .course_process_card{ position: relative; background: #fff; border-radius: 32px; padding: 40px 30px; text-align: center; height: 100%; transition: 0.4s; overflow: hidden; border: 1px solid #e6edf5; box-shadow: 0 12px 35px rgba(0,0,0,0.04); } .course_process_card:hover{ transform: translateY(-10px); box-shadow: 0 20px 50px rgba(0,0,0,0.08); } /* NUMBER */ .course_process_number{ position: absolute; top: 20px; right: 24px; font-size: 58px; font-weight: 800; color: rgba(37,99,235,0.08); line-height: 1; } /* ICON */ .course_process_icon{ width: 95px; height: 95px; margin: auto auto 28px; border-radius: 28px; background: linear-gradient(135deg,#081b2e,#163b63); display: flex; align-items: center; justify-content: center; color: #fff; font-size: 34px; position: relative; z-index: 2; } /* TITLE */ .course_process_card h3{ font-size: 28px; line-height: 38px; color: #081b2e; font-weight: 800; margin-bottom: 18px; } /* TEXT */ .course_process_card p{ color: #52606d; font-size: 16px; line-height: 30px; margin: 0; } /* MOBILE */ @media only screen and (max-width:767px){ .course_selection_process{ padding: 70px 0; } .course_process_heading{ margin-bottom: 45px; } .course_process_heading h2{ font-size: 36px; line-height: 48px; } .course_process_heading p{ font-size: 15px; line-height: 28px; } .course_process_card{ padding: 32px 22px; border-radius: 24px; } .course_process_number{ font-size: 44px; } .course_process_icon{ width: 78px; height: 78px; border-radius: 22px; font-size: 28px; } .course_process_card h3{ font-size: 24px; line-height: 34px; } .course_process_card p{ font-size: 15px; line-height: 28px; } } /* ========================================= ADMISSION PROCESS PAGE CSS ========================================= */ .admission_hero_section{ padding: 130px 0 110px; background: linear-gradient(135deg,#081b2e,#163b63); text-align: center; } .admission_hero_content span{ display: inline-block; background: rgba(255,255,255,0.12); color: #fff; padding: 12px 24px; border-radius: 100px; font-size: 13px; font-weight: 700; letter-spacing: 2px; margin-bottom: 28px; } .admission_hero_content h1{ font-size: 68px; line-height: 84px; color: #fff; font-weight: 800; margin-bottom: 28px; } .admission_hero_content p{ max-width: 850px; margin: auto; color: rgba(255,255,255,0.82); font-size: 18px; line-height: 34px; } /* PROCESS */ .admission_process_section{ padding: 110px 0; background: #f4f7fb; } .admission_section_heading{ margin-bottom: 65px; } .admission_section_heading span{ color: #2563eb; font-size: 14px; font-weight: 700; letter-spacing: 2px; } .admission_section_heading h2{ font-size: 58px; line-height: 72px; color: #081b2e; font-weight: 800; margin: 18px 0; } .admission_section_heading p{ max-width: 760px; margin: auto; color: #52606d; font-size: 17px; line-height: 32px; } .admission_process_section .row{ row-gap: 30px; } .admission_step_card{ position: relative; background: #fff; border-radius: 30px; padding: 40px 30px; height: 100%; overflow: hidden; transition: 0.4s; border: 1px solid #e6edf5; box-shadow: 0 10px 35px rgba(0,0,0,0.04); } .admission_step_card:hover{ transform: translateY(-10px); } .admission_step_number{ position: absolute; top: 20px; right: 24px; font-size: 58px; font-weight: 800; color: rgba(37,99,235,0.08); } .admission_step_icon{ width: 88px; height: 88px; border-radius: 24px; background: linear-gradient(135deg,#081b2e,#163b63); color: #fff; display: flex; align-items: center; justify-content: center; font-size: 32px; margin-bottom: 28px; } .admission_step_card h3{ font-size: 30px; color: #081b2e; font-weight: 800; margin-bottom: 18px; } .admission_step_card p{ color: #52606d; font-size: 16px; line-height: 30px; } /* DOCUMENTS */ .admission_documents_section{ padding: 110px 0; background: #fff; } .admission_documents_image img{ width: 100%; height: 620px; object-fit: cover; border-radius: 34px; } .admission_documents_content{ padding-left: 40px; } .admission_documents_content span{ color: #2563eb; font-size: 14px; font-weight: 700; letter-spacing: 2px; } .admission_documents_content h2{ font-size: 54px; line-height: 68px; color: #081b2e; font-weight: 800; margin: 22px 0; } .admission_documents_content p{ color: #52606d; font-size: 17px; line-height: 33px; margin-bottom: 35px; } .admission_document_item{ display: flex; align-items: center; gap: 14px; margin-bottom: 20px; } .admission_document_item i{ width: 36px; height: 36px; border-radius: 50%; background: #dbeafe; color: #2563eb; display: flex; align-items: center; justify-content: center; } .admission_document_item span{ color: #102a43; font-size: 16px; font-weight: 600; letter-spacing: 0; } /* CTA */ .admission_cta_section{ padding-bottom: 120px; background: #fff; } .admission_cta_box{ background: linear-gradient(135deg,#081b2e,#163b63); border-radius: 38px; padding: 70px; } .admission_cta_content span{ color: #bfdbfe; font-size: 14px; font-weight: 700; letter-spacing: 2px; } .admission_cta_content h2{ font-size: 52px; line-height: 66px; color: #fff; font-weight: 800; margin: 20px 0; } .admission_cta_content p{ color: rgba(255,255,255,0.82); font-size: 17px; line-height: 32px; } .admission_cta_btn{ display: inline-flex; align-items: center; justify-content: center; background: #fff; color: #081b2e; padding: 18px 34px; border-radius: 100px; text-decoration: none; font-size: 15px; font-weight: 700; transition: 0.4s; } .admission_cta_btn:hover{ transform: translateY(-4px); color: #081b2e; } /* MOBILE */ @media only screen and (max-width:767px){ .admission_hero_section{ padding: 90px 0 70px; } .admission_hero_content h1{ font-size: 38px; line-height: 50px; } .admission_hero_content p{ font-size: 15px; line-height: 28px; } .admission_process_section{ padding: 70px 0; } .admission_section_heading h2{ font-size: 36px; line-height: 48px; } .admission_step_card{ padding: 30px 22px; border-radius: 24px; } .admission_step_card h3{ font-size: 24px; } .admission_documents_section{ padding: 70px 0; } .admission_documents_image img{ height: 320px; border-radius: 24px; margin-bottom: 35px; } .admission_documents_content{ padding-left: 0; } .admission_documents_content h2{ font-size: 36px; line-height: 48px; } .admission_cta_section{ padding-bottom: 70px; } .admission_cta_box{ padding: 35px 22px; border-radius: 24px; text-align: center; } .admission_cta_content h2{ font-size: 34px; line-height: 46px; } .admission_cta_btn{ width: 100%; margin-top: 25px; } } /* ========================================= VISA ASSISTANCE PAGE CSS ========================================= */ .visa_hero_section{ padding: 130px 0 110px; background: linear-gradient(135deg,#081b2e,#163b63); text-align: center; } .visa_hero_content span{ display: inline-block; background: rgba(255,255,255,0.12); color: #fff; padding: 12px 24px; border-radius: 100px; font-size: 13px; font-weight: 700; letter-spacing: 2px; margin-bottom: 28px; } .visa_hero_content h1{ font-size: 68px; line-height: 84px; color: #fff; font-weight: 800; margin-bottom: 28px; } .visa_hero_content p{ max-width: 850px; margin: auto; color: rgba(255,255,255,0.82); font-size: 18px; line-height: 34px; } /* SUPPORT */ .visa_support_section{ padding: 110px 0; background: #f4f7fb; } .visa_support_image img{ width: 100%; height: 620px; object-fit: cover; border-radius: 34px; } .visa_support_content{ padding-left: 40px; } .visa_support_content span{ color: #2563eb; font-size: 14px; font-weight: 700; letter-spacing: 2px; } .visa_support_content h2{ font-size: 54px; line-height: 68px; color: #081b2e; font-weight: 800; margin: 22px 0; } .visa_support_content p{ color: #52606d; font-size: 17px; line-height: 33px; margin-bottom: 35px; } .visa_support_item{ display: flex; align-items: center; gap: 14px; margin-bottom: 20px; } .visa_support_item i{ width: 36px; height: 36px; border-radius: 50%; background: #dbeafe; color: #2563eb; display: flex; align-items: center; justify-content: center; } .visa_support_item span{ color: #102a43; font-size: 16px; font-weight: 600; } /* PROCESS */ .visa_process_section{ padding: 110px 0; background: #fff; } .visa_heading{ margin-bottom: 65px; } .visa_heading span{ color: #2563eb; font-size: 14px; font-weight: 700; letter-spacing: 2px; } .visa_heading h2{ font-size: 58px; line-height: 72px; color: #081b2e; font-weight: 800; margin: 18px 0; } .visa_heading p{ max-width: 760px; margin: auto; color: #52606d; font-size: 17px; line-height: 32px; } .visa_process_section .row{ row-gap: 30px; } .visa_step_card{ position: relative; background: #f8fbff; border-radius: 30px; padding: 40px 30px; height: 100%; border: 1px solid #e6edf5; transition: 0.4s; } .visa_step_card:hover{ transform: translateY(-10px); } .visa_step_number{ position: absolute; top: 20px; right: 24px; font-size: 58px; font-weight: 800; color: rgba(37,99,235,0.08); } .visa_step_icon{ width: 88px; height: 88px; border-radius: 24px; background: linear-gradient(135deg,#081b2e,#163b63); color: #fff; display: flex; align-items: center; justify-content: center; font-size: 32px; margin-bottom: 28px; } .visa_step_card h3{ font-size: 28px; color: #081b2e; font-weight: 800; margin-bottom: 18px; } .visa_step_card p{ color: #52606d; font-size: 16px; line-height: 30px; } /* DOCUMENTS */ .visa_documents_section{ padding-bottom: 120px; background: #fff; } .visa_documents_box{ background: linear-gradient(135deg,#081b2e,#163b63); border-radius: 38px; padding: 70px; } .visa_documents_content span{ color: #bfdbfe; font-size: 14px; font-weight: 700; letter-spacing: 2px; } .visa_documents_content h2{ font-size: 52px; line-height: 66px; color: #fff; font-weight: 800; margin: 20px 0; } .visa_documents_content p{ color: rgba(255,255,255,0.82); font-size: 17px; line-height: 32px; margin-bottom: 35px; } .visa_document_item{ display: flex; align-items: center; gap: 14px; margin-bottom: 20px; } .visa_document_item i{ width: 34px; height: 34px; border-radius: 50%; background: rgba(255,255,255,0.12); color: #fff; display: flex; align-items: center; justify-content: center; } .visa_document_item span{ color: #fff; font-size: 16px; font-weight: 500; } .visa_documents_image img{ width: 100%; height: 460px; object-fit: cover; border-radius: 28px; } /* CTA */ .visa_cta_section{ padding-bottom: 120px; background: #fff; } .visa_cta_box{ background: #f4f7fb; border-radius: 38px; padding: 80px; } .visa_cta_box span{ color: #2563eb; font-size: 14px; font-weight: 700; letter-spacing: 2px; } .visa_cta_box h2{ font-size: 56px; line-height: 70px; color: #081b2e; font-weight: 800; margin: 22px 0; } .visa_cta_box p{ max-width: 760px; margin: auto; color: #52606d; font-size: 17px; line-height: 32px; } .visa_cta_btn{ display: inline-flex; align-items: center; justify-content: center; margin-top: 35px; background: linear-gradient(135deg,#081b2e,#163b63); color: #fff; padding: 18px 38px; border-radius: 100px; text-decoration: none; font-size: 15px; font-weight: 700; transition: 0.4s; } .visa_cta_btn:hover{ transform: translateY(-4px); color: #fff; } /* MOBILE */ @media only screen and (max-width:767px){ .visa_hero_section{ padding: 90px 0 70px; } .visa_hero_content h1{ font-size: 38px; line-height: 50px; } .visa_hero_content p{ font-size: 15px; line-height: 28px; } .visa_support_section{ padding: 70px 0; } .visa_support_image img{ height: 320px; border-radius: 24px; margin-bottom: 35px; } .visa_support_content{ padding-left: 0; } .visa_support_content h2{ font-size: 36px; line-height: 48px; } .visa_process_section{ padding: 70px 0; } .visa_heading h2{ font-size: 36px; line-height: 48px; } .visa_step_card{ padding: 30px 22px; border-radius: 24px; } .visa_step_card h3{ font-size: 24px; } .visa_documents_section{ padding-bottom: 70px; } .visa_documents_box{ padding: 35px 22px; border-radius: 24px; } .visa_documents_content h2{ font-size: 34px; line-height: 46px; } .visa_documents_image img{ height: 260px; border-radius: 22px; margin-top: 30px; } .visa_cta_section{ padding-bottom: 70px; } .visa_cta_box{ padding: 35px 22px; border-radius: 24px; } .visa_cta_box h2{ font-size: 34px; line-height: 46px; } } /* ========================================= TRAVEL & ACCOMMODATION PAGE CSS ========================================= */ .travel_hero_section{ padding: 130px 0 110px; background: linear-gradient(135deg,#081b2e,#163b63); text-align: center; } .travel_hero_content span{ display: inline-block; background: rgba(255,255,255,0.12); color: #fff; padding: 12px 24px; border-radius: 100px; font-size: 13px; font-weight: 700; letter-spacing: 2px; margin-bottom: 28px; } .travel_hero_content h1{ font-size: 68px; line-height: 84px; color: #fff; font-weight: 800; margin-bottom: 28px; } .travel_hero_content p{ max-width: 900px; margin: auto; color: rgba(255,255,255,0.82); font-size: 18px; line-height: 34px; } /* INTRO */ .travel_intro_section{ padding: 110px 0; background: #f4f7fb; } .travel_intro_image img{ width: 100%; height: 650px; object-fit: cover; border-radius: 34px; } .travel_intro_content{ padding-left: 40px; } .travel_intro_content span{ color: #2563eb; font-size: 14px; font-weight: 700; letter-spacing: 2px; } .travel_intro_content h2{ font-size: 56px; line-height: 70px; color: #081b2e; font-weight: 800; margin: 22px 0; } .travel_intro_content p{ color: #52606d; font-size: 17px; line-height: 33px; margin-bottom: 25px; } .travel_feature_item{ display: flex; align-items: center; gap: 14px; margin-bottom: 20px; } .travel_feature_item i{ width: 36px; height: 36px; border-radius: 50%; background: #dbeafe; color: #2563eb; display: flex; align-items: center; justify-content: center; } .travel_feature_item span{ color: #102a43; font-size: 16px; font-weight: 600; } /* SERVICES */ .travel_services_section{ padding: 110px 0; background: #fff; } .travel_section_heading{ margin-bottom: 65px; } .travel_section_heading span{ color: #2563eb; font-size: 14px; font-weight: 700; letter-spacing: 2px; } .travel_section_heading h2{ font-size: 58px; line-height: 72px; color: #081b2e; font-weight: 800; margin: 18px 0; } .travel_section_heading p{ max-width: 760px; margin: auto; color: #52606d; font-size: 17px; line-height: 32px; } .travel_services_section .row{ row-gap: 30px; } .travel_service_card{ background: #f8fbff; border-radius: 30px; padding: 40px 30px; height: 100%; border: 1px solid #e6edf5; transition: 0.4s; } .travel_service_card:hover{ transform: translateY(-10px); box-shadow: 0 18px 45px rgba(0,0,0,0.08); } .travel_service_icon{ width: 88px; height: 88px; border-radius: 24px; background: linear-gradient(135deg,#081b2e,#163b63); color: #fff; display: flex; align-items: center; justify-content: center; font-size: 32px; margin-bottom: 28px; } .travel_service_card h3{ font-size: 28px; line-height: 38px; color: #081b2e; font-weight: 800; margin-bottom: 18px; } .travel_service_card p{ color: #52606d; font-size: 16px; line-height: 30px; } /* IMPORTANCE */ .travel_importance_section{ padding-bottom: 120px; background: #fff; } .travel_importance_box{ background: linear-gradient(135deg,#081b2e,#163b63); border-radius: 38px; padding: 70px; } .travel_importance_content span{ color: #bfdbfe; font-size: 14px; font-weight: 700; letter-spacing: 2px; } .travel_importance_content h2{ font-size: 52px; line-height: 66px; color: #fff; font-weight: 800; margin: 20px 0; } .travel_importance_content p{ color: rgba(255,255,255,0.82); font-size: 17px; line-height: 32px; margin-bottom: 24px; } .travel_importance_item{ display: flex; align-items: center; gap: 14px; margin-bottom: 18px; } .travel_importance_item i{ width: 34px; height: 34px; border-radius: 50%; background: rgba(255,255,255,0.12); color: #fff; display: flex; align-items: center; justify-content: center; } .travel_importance_item span{ color: #fff; font-size: 16px; font-weight: 500; } .travel_importance_image img{ width: 100%; height: 480px; object-fit: cover; border-radius: 28px; } /* CTA */ .travel_cta_section{ padding-bottom: 120px; background: #fff; } .travel_cta_box{ background: #f4f7fb; border-radius: 38px; padding: 80px; } .travel_cta_box span{ color: #2563eb; font-size: 14px; font-weight: 700; letter-spacing: 2px; } .travel_cta_box h2{ font-size: 56px; line-height: 70px; color: #081b2e; font-weight: 800; margin: 22px 0; } .travel_cta_box p{ max-width: 760px; margin: auto; color: #52606d; font-size: 17px; line-height: 32px; } .travel_cta_btn{ display: inline-flex; align-items: center; justify-content: center; margin-top: 35px; background: linear-gradient(135deg,#081b2e,#163b63); color: #fff; padding: 18px 38px; border-radius: 100px; text-decoration: none; font-size: 15px; font-weight: 700; transition: 0.4s; } .travel_cta_btn:hover{ transform: translateY(-4px); color: #fff; } /* MOBILE */ @media only screen and (max-width:767px){ .travel_hero_section{ padding: 90px 0 70px; } .travel_hero_content h1{ font-size: 38px; line-height: 50px; } .travel_hero_content p{ font-size: 15px; line-height: 28px; } .travel_intro_section{ padding: 70px 0; } .travel_intro_image img{ height: 320px; border-radius: 24px; margin-bottom: 35px; } .travel_intro_content{ padding-left: 0; } .travel_intro_content h2{ font-size: 36px; line-height: 48px; } .travel_services_section{ padding: 70px 0; } .travel_section_heading h2{ font-size: 36px; line-height: 48px; } .travel_service_card{ padding: 30px 22px; border-radius: 24px; } .travel_service_card h3{ font-size: 24px; line-height: 34px; } .travel_importance_section{ padding-bottom: 70px; } .travel_importance_box{ padding: 35px 22px; border-radius: 24px; } .travel_importance_content h2{ font-size: 34px; line-height: 46px; } .travel_importance_image img{ height: 260px; border-radius: 22px; margin-top: 30px; } .travel_cta_section{ padding-bottom: 70px; } .travel_cta_box{ padding: 35px 22px; border-radius: 24px; } .travel_cta_box h2{ font-size: 34px; line-height: 46px; } } /* ========================================= HEADER APPLY + WHATSAPP BUTTONS ========================================= */ .header_action_buttons{ display: flex; align-items: center; gap: 12px; } .header_apply_btn{ display: inline-flex; align-items: center; justify-content: center; background: #0b2f57; color: #ffffff; padding: 13px 24px; border-radius: 100px; font-size: 14px; font-weight: 700; text-decoration: none; transition: 0.35s ease; white-space: nowrap; } .header_apply_btn:hover{ background: #123f73; color: #ffffff; transform: translateY(-3px); } .header_whatsapp_btn{ width: 46px; height: 46px; border-radius: 50%; background: #25D366; color: #ffffff; display: inline-flex; align-items: center; justify-content: center; font-size: 22px; text-decoration: none; transition: 0.35s ease; box-shadow: 0 10px 25px rgba(37,211,102,0.35); } .header_whatsapp_btn:hover{ color: #ffffff; transform: translateY(-3px) scale(1.05); box-shadow: 0 14px 32px rgba(37,211,102,0.45); } /* MOBILE */ @media only screen and (max-width:991px){ .header_action_buttons{ gap: 8px; } .header_apply_btn{ padding: 11px 18px; font-size: 13px; } .header_whatsapp_btn{ width: 42px; height: 42px; font-size: 20px; } } /* HEADER LOGO + DIA DOT FOUNDATION BADGE */ .header_logo_brand{ display: flex; flex-direction: column; align-items: flex-start; justify-content: center; } .header_logo_brand a{ display: block; } .header_logo_brand img{ max-width: 130px; height: auto; display: block; } .header_brand_badge{ margin-top: 10px !important; margin-left: -25px !important; display: inline-block; background: rgba(82,95,225,0.10); color: #0b104a; padding: 4px 10px; border-radius: 50px; font-size: 10px; font-weight: 800; line-height: 1.2; white-space: nowrap; letter-spacing: 0.2px; } /* MOBILE */ @media only screen and (max-width:960px){ .header_logo_brand img{ max-width: 115px; } .header_brand_badge{ font-size: 9px; padding: 4px 8px; } } /* ========================================= ABOUT PAGE EXTRA SECTIONS ========================================= */ .akw-who-area{ padding: 100px 0; background: #ffffff; } .akw-who-card{ background: linear-gradient(135deg,#081b2e,#163b63); border-radius: 34px; padding: 50px; height: 100%; } .akw-who-card span{ display: inline-block; color: #bfdbfe; font-size: 13px; font-weight: 800; letter-spacing: 2px; margin-bottom: 18px; } .akw-who-card h2{ color: #ffffff; font-size: 42px; line-height: 54px; font-weight: 800; margin-bottom: 22px; } .akw-who-card p{ color: rgba(255,255,255,0.82); font-size: 16px; line-height: 30px; margin: 0; } .akw-pathway-grid{ display: grid; grid-template-columns: repeat(2,1fr); gap: 22px; padding-left: 30px; } .akw-pathway-item{ background: #f4f7fb; border: 1px solid #e6edf5; border-radius: 22px; padding: 22px; display: flex; align-items: center; gap: 14px; } .akw-pathway-item i{ width: 34px; height: 34px; min-width: 34px; border-radius: 50%; background: #dbeafe; color: #2563eb; display: flex; align-items: center; justify-content: center; } .akw-pathway-item span{ color: #102a43; font-size: 15px; font-weight: 700; line-height: 24px; } /* PRESENCE */ .akw-presence-area{ padding: 100px 0; background: #ffffff; } .akw-presence-area .row{ row-gap: 30px; } .akw-presence-card{ height: 100%; background: #f8fbff; border: 1px solid #e6edf5; border-radius: 30px; padding: 40px 30px; transition: 0.4s; } .akw-presence-card:hover{ transform: translateY(-8px); box-shadow: 0 18px 45px rgba(0,0,0,0.08); } .akw-presence-card h3{ font-size: 30px; color: #081b2e; font-weight: 800; margin-bottom: 18px; } .akw-presence-card p{ color: #52606d; font-size: 16px; line-height: 30px; margin: 0; } /* VISION */ .akw-vision-area{ padding: 100px 0; background: #f4f7fb; } .akw-vision-area .row{ row-gap: 30px; } .akw-vision-card{ height: 100%; background: #ffffff; border-radius: 30px; padding: 42px 32px; border: 1px solid #e6edf5; transition: 0.4s; } .akw-vision-card:hover{ transform: translateY(-8px); box-shadow: 0 18px 45px rgba(0,0,0,0.08); } .akw-vision-card span{ display: inline-flex; width: 58px; height: 58px; border-radius: 18px; align-items: center; justify-content: center; background: linear-gradient(135deg,#081b2e,#163b63); color: #ffffff; font-size: 18px; font-weight: 800; margin-bottom: 24px; } .akw-vision-card h3{ font-size: 30px; color: #081b2e; font-weight: 800; margin-bottom: 18px; } .akw-vision-card p{ color: #52606d; font-size: 16px; line-height: 30px; margin: 0; } /* SMALL FIXES */ .akw-section-head p{ max-width: 760px; margin: 18px auto 0; color: #52606d; font-size: 17px; line-height: 32px; } /* MOBILE */ @media only screen and (max-width:767px){ .akw-who-area, .akw-presence-area, .akw-vision-area{ padding: 70px 0; } .akw-who-card{ padding: 34px 24px; border-radius: 24px; margin-bottom: 30px; } .akw-who-card h2{ font-size: 32px; line-height: 42px; } .akw-pathway-grid{ grid-template-columns: 1fr; padding-left: 0; gap: 16px; } .akw-presence-card, .akw-vision-card{ border-radius: 24px; padding: 32px 24px; } .akw-presence-card h3, .akw-vision-card h3{ font-size: 25px; } } /* ========================================= MAURITIUS PREMIUM LIGHT DESIGN ========================================= */ .mauritius_future_area{ padding: 120px 0; background: #f4f8fc; overflow: hidden; } .mauritius_future_box{ background: linear-gradient(135deg,#ffffff,#f8fbff); border-radius: 45px; padding: 70px; box-shadow: 0 30px 80px rgba(0,0,0,0.08); position: relative; overflow: hidden; } /* BACKGROUND SHAPES */ .mauritius_future_box::before{ content:""; position:absolute; width:420px; height:420px; border-radius:50%; background:rgba(37,99,235,0.06); top:-180px; right:-180px; } .mauritius_future_box::after{ content:""; position:absolute; width:320px; height:320px; border-radius:50%; background:rgba(14,165,233,0.05); bottom:-140px; left:-140px; } /* CONTENT */ .mauritius_content{ position: relative; z-index: 2; } .mauritius_live_tag{ display:inline-flex; align-items:center; gap:12px; background:#eff6ff; padding:14px 22px; border-radius:100px; color:#2563eb; font-size:13px; font-weight:700; letter-spacing:1px; margin-bottom:32px; } .mauritius_live_tag span{ width:10px; height:10px; border-radius:50%; background:#00c853; animation:livePulse 1.5s infinite; } .mauritius_content h1{ font-size:78px; line-height:86px; font-weight:900; color:#081b2e; margin-bottom:28px; letter-spacing:-3px; } .mauritius_content p{ color:#52606d; font-size:17px; line-height:33px; margin-bottom:24px; } /* COURSES */ .mauritius_course_wrap{ display:grid; grid-template-columns:repeat(2,1fr); gap:18px; margin-top:40px; } .mauritius_course_card{ background:#ffffff; border:1px solid #e6edf5; border-radius:26px; padding:24px; transition:0.4s; box-shadow:0 10px 30px rgba(0,0,0,0.04); } .mauritius_course_card:hover{ transform:translateY(-8px); box-shadow:0 18px 45px rgba(0,0,0,0.08); } .mauritius_course_card i{ width:62px; height:62px; border-radius:20px; background:linear-gradient(135deg,#2563eb,#0ea5e9); color:#ffffff; display:flex; align-items:center; justify-content:center; font-size:24px; margin-bottom:20px; } .mauritius_course_card span{ color:#081b2e; font-size:17px; font-weight:700; line-height:28px; } /* BUTTONS */ .mauritius_btns{ display:flex; align-items:center; gap:18px; margin-top:45px; flex-wrap:wrap; } .mauritius_primary_btn{ background:linear-gradient(135deg,#081b2e,#163b63); color:#ffffff; padding:18px 36px; border-radius:100px; text-decoration:none; font-size:15px; font-weight:700; transition:0.4s; } .mauritius_primary_btn:hover{ transform:translateY(-4px); color:#ffffff; } .mauritius_secondary_btn{ background:#ffffff; border:1px solid #dbe4ef; color:#081b2e; padding:18px 36px; border-radius:100px; text-decoration:none; font-size:15px; font-weight:700; transition:0.4s; } .mauritius_secondary_btn:hover{ transform:translateY(-4px); background:#f4f7fb; color:#081b2e; } /* IMAGE SIDE */ .mauritius_visual_side{ position:relative; height:760px; } .main_mauritius_image{ position:absolute; right:0; width:88%; height:100%; } .main_mauritius_image img{ width:100%; height:100%; object-fit:cover; border-radius:38px; box-shadow:0 25px 60px rgba(0,0,0,0.18); } /* FLOATING CARDS */ .mauritius_small_card{ position:absolute; background:rgba(255,255,255,0.95); border-radius:24px; padding:24px; box-shadow:0 18px 45px rgba(0,0,0,0.12); } /* TOP */ .top_card{ top:40px; left:0; width:250px; display:flex; align-items:center; gap:16px; } .mini_flag{ width:62px; height:62px; border-radius:18px; background:#eff6ff; display:flex; align-items:center; justify-content:center; font-size:30px; } .top_card h4{ font-size:24px; font-weight:800; color:#081b2e; margin-bottom:4px; } .top_card p{ margin:0; color:#64748b; font-size:14px; } /* BOTTOM */ .bottom_card{ bottom:40px; left:40px; width:240px; text-align:center; } .bottom_card h2{ font-size:58px; font-weight:900; color:#081b2e; margin-bottom:8px; } .bottom_card span{ color:#64748b; line-height:24px; } /* SIDE FLOAT */ .mauritius_vertical_float{ position:absolute; right:-20px; top:50%; transform:translateY(-50%); background:#ffffff; border-radius:28px; padding:28px 20px; width:130px; text-align:center; box-shadow:0 18px 45px rgba(0,0,0,0.12); } .mauritius_vertical_float i{ font-size:40px; color:#2563eb; margin-bottom:18px; } .mauritius_vertical_float p{ margin:0; color:#52606d; line-height:26px; font-size:13px; } /* ANIMATION */ @keyframes livePulse{ 0%{ transform:scale(1); opacity:1; } 50%{ transform:scale(1.5); opacity:0.5; } 100%{ transform:scale(1); opacity:1; } } /* MOBILE */ @media only screen and (max-width:767px){ .mauritius_future_area{ padding:70px 0; } .mauritius_future_box{ padding:35px 22px; border-radius:26px; } .mauritius_content h1{ font-size:46px; line-height:54px; letter-spacing:-1px; } .mauritius_content p{ font-size:15px; line-height:29px; } .mauritius_course_wrap{ grid-template-columns:1fr; } .mauritius_btns{ flex-direction:column; align-items:stretch; } .mauritius_primary_btn, .mauritius_secondary_btn{ width:100%; text-align:center; } .mauritius_visual_side{ height:auto; margin-top:50px; } .main_mauritius_image{ position:relative; width:100%; height:auto; } .main_mauritius_image img{ height:360px; border-radius:24px; } .mauritius_small_card, .mauritius_vertical_float{ position:relative; top:auto; left:auto; right:auto; bottom:auto; transform:none; width:100%; margin-top:18px; } } /* FIX FRENCH NAV OVERLAP */ #main-menu ul{ display:flex; align-items:center; gap:5px; flex-wrap:nowrap; } #main-menu ul li a{ font-size:14px; padding:10px 0; white-space:nowrap; } .nav-flex{ display:flex; align-items:center; justify-content:space-between; gap:20px; } .nav-right-features{ margin-left:20px; flex-shrink:0; } /* OPTIONAL SMALLER SIZE FOR FRENCH */ html[lang="fr"] #main-menu ul li a{ font-size:13px; } @media only screen and (max-width:991px){ .site-navigation{ position:relative; } .language-switch{ position:absolute; left:60%; top:50px; transform:translateX(-50%); display:flex !important; align-items:center; justify-content:center; gap:10px; z-index:9999; } .language-switch a{ color:#00c896 !important; font-size:15px; font-weight:700; text-decoration:none; } .language-switch span{ color:#888; } } /* DESKTOP LANGUAGE */ .nav-right-features .language-switch{ display:flex; align-items:center; gap:8px; } /* MOBILE LANGUAGE HIDDEN IN DESKTOP */ .mobile-language{ display:none; } /* MOBILE */ @media only screen and (max-width: 991px){ /* hide desktop language */ .nav-right-features .language-switch{ display:none; } /* show mobile language */ .mobile-language{ display:flex; justify-content:center; align-items:center; gap:8px; margin:15px 0; font-weight:600; } }