ok
Direktori : /proc/thread-self/root/home2/selectio/www/salemgovtitialumni.in/assets/css/ |
Current File : //proc/thread-self/root/home2/selectio/www/salemgovtitialumni.in/assets/css/style.css |
/*----------------------------------------------------------------------------------- Template Name: Ustudy-Education & LMS HTML5 Template Template URI: https://thepixelcurve.com/ Description: A Library of Responsive Bootstrap5, HTML5, and CSS3 Website Templates Author: Raistheme Author URI: https://thepixelcurve.com/ Version: 1.0 ----------------------------------------------------------------------------------- CSS INDEX =================== 01. Theme default CSS 02. Header CSS 2.1. Header Top CSS 2.2. Header Bottom CSS 2.3 Offcanvas Menu CSS 03. Hero CSS 04. Category CSS 05. Offer CSS 06. Courses CSS 07. Counter CSS 08. Brand CSS 09. Testimonial CSS 10. Blog CSS 11. CTA CSS 12. Features CSS 13. About CSS 14. Video CSS 15. Form CSS 16. Program CSS 17. Admission CSS 18. Blog List CSS 19. Blog Details CSS 20. Courses Grid CSS 21. Courses Details CSS 22. Team CSS 23. Team Single CSS 24. Event CSS 25. Page Banner CSS 26. FAQ CSS 27. Error CSS 28. Login Register CSS 29. Class CSS 30. Contact CSS 31. Footer CSS 31.1. Footer Widget CSS -----------------------------------------------------------------------------------*/ /*----------------------------------------*/ /* 01. Theme default CSS /*----------------------------------------*/ /*-- Google Font --*/ @import url("https://fonts.googleapis.com/css2?family=Nanum+Myeongjo:wght@700;800&family=Outfit:wght@300;400;500;600;700;800&family=Schoolbell&display=swap"); /*-- Common Style --*/ *, *::after, *::before { box-sizing: border-box; margin: 0; padding: 0; } body { font-size: 15px; line-height: 1.75; font-weight: 400; font-family: "Outfit", sans-serif; color: #666666; outline: none; visibility: visible; overflow-X: hidden; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; color: ""; } body[dir="rtl"] { text-align: right; } h1, h2, h3, h4, h5, h6 { font-family: "Outfit", sans-serif; color: #2f2a55; font-weight: 700; margin-top: 0; line-height: 1.5; margin-bottom: 0; } h1 { font-size: 36px; } @media only screen and (max-width: 767px) { h1 { font-size: 30px; } } h2 { font-size: 30px; } @media only screen and (max-width: 767px) { h2 { font-size: 24px; } } h3 { font-size: 24px; } @media only screen and (max-width: 767px) { h3 { font-size: 20px; } } h4 { font-size: 18px; } h5 { font-size: 16px; } h6 { font-size: 14px; } p { margin-bottom: 0; } a, button { color: inherit; display: inline-block; line-height: inherit; text-decoration: none; cursor: pointer; } a, button, img, input { transition: all 0.3s linear; outline: 0; } a:focus, button:focus, img:focus, input:focus { outline: 0; } a:focus { color: none; outline: none; text-decoration: none; } a:hover { text-decoration: none; color: #1cb098; } ul, ol { padding: 0; list-style: none; margin: 0; } button, input[type="submit"] { cursor: pointer; } input::-webkit-input-placeholder, textarea::-webkit-input-placeholder { opacity: 1; } input:-moz-placeholder, textarea:-moz-placeholder { opacity: 1; } input::-moz-placeholder, textarea::-moz-placeholder { opacity: 1; } input:-ms-input-placeholder, textarea:-ms-input-placeholder { opacity: 1; } img { max-width: 100%; } /*-- Common Classes --*/ .section, .main-wrapper { float: left; width: 100%; } /*--Custom Container--*/ @media only screen and (min-width: 1600px) { .custom-container { padding: 0 50px; } } /*--Tab Content & Pane Fix--*/ .tab-content { width: 100%; } .tab-content .tab-pane { display: block; height: 0; max-width: 100%; visibility: hidden; overflow: hidden; opacity: 0; } .tab-content .tab-pane.active { height: auto; visibility: visible; opacity: 1; overflow: visible; -webkit-animation: up 0.7s ease-out; animation: up 0.7s ease-out; } @-webkit-keyframes up { 0% { opacity: 0; transform: translateY(50px); } 100% { opacity: 1; transform: translateY(0px); } } @keyframes up { 0% { opacity: 0; transform: translateY(50px); } 100% { opacity: 1; transform: translateY(0px); } } /*--Section Spacing--*/ .section-padding { padding-top: 120px; padding-bottom: 120px; } @media only screen and (max-width: 1199px) { .section-padding { padding-top: 100px; padding-bottom: 100px; } } @media only screen and (max-width: 991px) { .section-padding { padding-top: 80px; padding-bottom: 80px; } } @media only screen and (max-width: 767px) { .section-padding { padding-top: 60px; padding-bottom: 60px; } } .section-padding-02 { padding-top: 120px; } @media only screen and (max-width: 1199px) { .section-padding-02 { padding-top: 100px; } } @media only screen and (max-width: 991px) { .section-padding-02 { padding-top: 80px; } } @media only screen and (max-width: 767px) { .section-padding-02 { padding-top: 60px; } } .section-padding-03 { padding-top: 110px; } @media only screen and (max-width: 1199px) { .section-padding-03 { padding-top: 100px; } } @media only screen and (max-width: 991px) { .section-padding-03 { padding-top: 80px; } } @media only screen and (max-width: 767px) { .section-padding-03 { padding-top: 60px; } } /*--Section Title--*/ .section-title .title { font-size: 48px; line-height: 60px; font-family: "Outfit", sans-serif; font-weight: 600; color: #2f2a55; } @media only screen and (max-width: 767px) { .section-title .title { font-size: 35px; line-height: 45px; } } @media only screen and (max-width: 449px) { .section-title .title { font-size: 30px; line-height: 40px; } } .section-title .title span { position: relative; } .section-title .title span::before { content: ""; position: absolute; left: 0; bottom: -25px; background-image: url(../images/shape/text-shape2.png); background-repeat: no-repeat; background-position: center bottom; width: 100%; height: 100%; } .section-title-2 .sub-title { font-size: 30px; line-height: 40px; font-weight: 400; color: #ff5562; } .section-title-2 .title { font-size: 60px; line-height: 70px; font-family: "Outfit", sans-serif; font-weight: 600; color: #12283b; } @media only screen and (max-width: 1199px) { .section-title-2 .title { font-size: 48px; line-height: 60px; } } @media only screen and (max-width: 767px) { .section-title-2 .title { font-size: 35px; line-height: 45px; } } .section-title-3 .sub-title { font-size: 18px; line-height: 30px; font-weight: 500; color: #9a9a9a; position: relative; } .section-title-3 .sub-title::before { content: ""; position: absolute; left: 50%; bottom: -15px; background: #f6520a; width: 110px; height: 2px; transform: translateX(-50%); } .section-title-3 .title { font-size: 40px; line-height: 52px; font-family: "Outfit", sans-serif; font-weight: 600; color: #1e1e1e; margin-top: 25px; } @media only screen and (max-width: 767px) { .section-title-3 .title { font-size: 36px; line-height: 45px; } } /*--Swiper Pagination--*/ .swiper-pagination .swiper-pagination-bullet { border-radius: 50%; background-color: #e1e1e1; width: 12px; height: 12px; transition: all 0.3s linear; opacity: 1; } .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active { background-color: #1cb098; } /*-- Preloader Styles --*/ #preloader { position: fixed; top: 0; left: 0; right: 0; bottom: 0; background-color: #ffffff; z-index: 999999; } #preloader .preloader { width: 50px; height: 50px; display: inline-block; padding: 0px; text-align: left; box-sizing: border-box; position: absolute; top: 50%; left: 50%; } #preloader .preloader span { position: absolute; display: inline-block; width: 50px; height: 50px; border-radius: 50%; background-color: #1cb098; -webkit-animation: preloader 1.3s linear infinite; animation: preloader 1.3s linear infinite; } #preloader .preloader span:last-child { -webkit-animation-delay: -0.8s; animation-delay: -0.8s; } #preloader .preloader.preloader-02 span { background-color: #ff5562; } @-webkit-keyframes preloader { 0% { transform: scale(0, 0); opacity: 0.5; } 100% { transform: scale(1, 1); opacity: 0; } } @keyframes preloader { 0% { transform: scale(0, 0); opacity: 0.5; } 100% { transform: scale(1, 1); opacity: 0; } } /*----------------------------------------*/ /* 02. Elements CSS /*----------------------------------------*/ /*-- /* 2.4 - Form CSS /*----------------------------------------*/ label { display: block; line-height: 1; margin-bottom: 10px; font-weight: 400; text-transform: capitalize; } /*Input Field & Select*/ input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]):not([type="file"]), textarea { border: 1px solid #ebebeb; box-shadow: none; color: #415674; border-radius: 4px; background-color: #ffffff; margin-bottom: 0; padding: 10px 25px; max-width: 100%; width: 100%; font-size: 13px; line-height: 30px; font-weight: 700; transition: all 0.3s linear; } input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]):not([type="file"]):focus, textarea:focus { outline: none; border-color: #1cb098; } input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]):not([type="file"])::-webkit-input-placeholder, textarea::-webkit-input-placeholder { opacity: 0.95; font-size: 13px; color: #898c94; font-weight: 600; } input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]):not([type="file"]):-moz-placeholder, textarea:-moz-placeholder { opacity: 0.95; font-size: 13px; color: #898c94; font-weight: 600; } input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]):not([type="file"])::-moz-placeholder, textarea::-moz-placeholder { opacity: 0.95; font-size: 13px; color: #898c94; font-weight: 600; } input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]):not([type="file"]):-ms-input-placeholder, textarea:-ms-input-placeholder { opacity: 0.95; font-size: 13px; color: #898c94; font-weight: 600; } .form-check label { margin-bottom: 0; } .form-check-input { width: 20px; height: 20px; margin-right: 10px; margin-top: 0; } .form-check-input:focus, .form-check-input:active { box-shadow: none; } .form-check-input:checked { background-color: #1cb098; border-color: #1cb098; } /*-- /* 2.3 - Button CSS /*----------------------------------------*/ .btn-margin { margin-top: 40px; } .btn-wrap { display: flex; flex-wrap: wrap; margin: -5px; } .btn-wrap .btn { margin: 5px; } .btn { display: inline-block; position: relative; overflow: hidden; background-color: #1cb098; border-color: transparent; color: #ffffff; border-radius: 4px; font-size: 16px; font-family: "Outfit", sans-serif; font-weight: 700; height: 50px; line-height: 48px; padding: 0px 40px; border-width: 0; border-style: solid; box-shadow: none; transition: all 0.3s ease 0s; cursor: pointer; } .btn:focus, .btn:focus:active { box-shadow: none; } .btn:hover { box-shadow: none; background: #111a24; color: #ffffff; } .btn-round { border-radius: 100px; } .btn-square { border-radius: 0; } .btn-primary { background-color: #1cb098; border-color: #1cb098; color: #ffffff; } .btn-primary:hover { background-color: #1cb098; border-color: #1cb098; } .btn-secondary { background-color: #f8db5e; border-color: #f8db5e; color: #ffffff; } .btn-secondary:hover { background-color: #f8db5e; border-color: #f8db5e; } .btn-white { background-color: #ffffff; border-color: #ffffff; color: #2f2a55; box-shadow: 11px 10px 38px 0 rgba(46, 63, 99, 0.15); } .btn-white:hover { color: #ffffff; } /*----------------------------------------*/ /* 02. Header CSS /*----------------------------------------*/ /*-- /* 2.1 - Header Top CSS /*----------------------------------------*/ .header-top-section { background: #0e2a47; padding: 10px 0; } @media only screen and (max-width: 767px) { .header-top-section { display: none; } } .header-top-section .header-top-content p { font-size: 14px; line-height: 24px; font-weight: 400; color: #ffffff; } .header-top-section .header-top-content p span { font-weight: 700; color: #f8db5e; } .header-section-02 .header-top-section { background: #ff5562; overflow: hidden; padding: 15px 0; } .header-section-02 .header-top-section .header-top-wrap { display: flex; align-items: center; justify-content: space-between; } .header-section-02 .header-top-section .header-top-wrap .header-top-info ul li { display: inline-block; position: relative; font-size: 12px; font-weight: 400; color: #ffffff; } .header-section-02 .header-top-section .header-top-wrap .header-top-info ul li span { font-weight: 600; margin-left: 5px; } .header-section-02 .header-top-section .header-top-wrap .header-top-info ul li i { font-size: 16px; margin-right: 5px; } .header-section-02 .header-top-section .header-top-wrap .header-top-info ul li + li { padding-left: 30px; margin-left: 25px; } .header-section-02 .header-top-section .header-top-wrap .header-top-info ul li + li::before { content: ""; position: absolute; left: 0; top: 50%; background: #ff7781; transform: translateY(-50%); width: 1px; height: 15px; } .header-section-02 .header-top-section .header-top-wrap .header-social .social li { display: inline-block; } .header-section-02 .header-top-section .header-top-wrap .header-social .social li + li { margin-left: 15px; } .header-section-02 .header-top-section .header-top-wrap .header-social .social li a { height: 30px; width: 30px; line-height: 30px; text-align: center; background: #e54c58; border-radius: 50%; font-size: 15px; color: #ffffff; } .header-section-05 .header-top-section { background: #0e2a47; } .header-section-05 .header-top-section .header-top-wrap .header-top-info ul li { font-size: 14px; } .header-section-05 .header-top-section .header-top-wrap .header-top-info ul li i { font-size: 14px; margin-right: 5px; } .header-section-05 .header-top-section .header-top-wrap .header-top-info ul li + li { padding-left: 0px; margin-left: 30px; } .header-section-05 .header-top-section .header-top-wrap .header-top-info ul li + li::before { display: none; } .header-section-05 .header-top-section .header-top-wrap .header-social .social li + li { margin-left: 0px; } .header-section-05 .header-top-section .header-top-wrap .header-social .social li a { background: transparent; font-size: 16px; color: #ffffff; } .header-section-05 .header-top-section .header-top-wrap .header-social .social li a:hover { color: #dc3545; } /*-- /* 2.2 - Header Bottom CSS /*----------------------------------------*/ .header { position: absolute; top: 0; left: 0; width: 100%; z-index: 999; border-bottom: 1px solid #e1e1e1; background: #ffffff; transition: all 0.3s linear; } @media only screen and (max-width: 991px), only screen and (max-width: 767px) { .header-bottom-section { padding: 15px 0; } } .header-bottom-section .header-bottom-wrap { display: flex; align-items: center; justify-content: space-between; } .header-logo { flex-shrink: 0; } @media only screen and (max-width: 1199px) { .header-logo a img { width: 130px; } } .header-logo-menu { display: flex; align-items: center; justify-content: space-between; } .header-menu { position: relative; padding-left: 20px; margin-left: 50px; } @media only screen and (max-width: 1399px) { .header-menu { margin-left: 35px; } } .header-menu::before { content: ""; position: absolute; left: 0px; top: 50%; transform: translateY(-50%); background: #ebebeb; width: 1px; height: 50px; } .header-menu .main-menu { display: flex; } .header-menu .main-menu > li { position: relative; padding: 30px 25px; } @media only screen and (max-width: 1399px) { .header-menu .main-menu > li { padding: 30px 10px; } } .header-menu .main-menu > li a { font-size: 16px; font-family: "Outfit", sans-serif; font-weight: 500; color: #2f3034; text-transform: capitalize; } .header-menu .main-menu > li .menu-icon::after { content: '\f16c'; font-family: "flaticon"; font-size: 10px; color: #2f3034; margin-left: 5px; transition: all 0.3s linear; } .header-menu .main-menu > li.active-menu > .menu-icon::after { color: #1cb098; } .header-menu .main-menu > li.active-menu > a { color: #1cb098; } .header-menu .main-menu > li:hover > .menu-icon::after { color: #1cb098; } .header-menu .main-menu > li:hover > a { color: #1cb098; } .header-menu .main-menu > li:hover > .sub-menu { opacity: 1; visibility: visible; top: 100%; } .header-menu .main-menu > li .sub-menu { position: absolute; left: 0; top: 110%; width: 270px; background: #ffffff; box-shadow: 0 2px 29px rgba(0, 0, 0, 0.05); padding: 20px 0; border-top: 3px solid #1cb098; opacity: 0; z-index: 99; visibility: hidden; transition: all 0.3s linear; } .header-menu .main-menu > li .sub-menu li { padding: 0; } .header-menu .main-menu > li .sub-menu li a { padding: 5px 25px; font-size: 16px; font-family: "Outfit", sans-serif; font-weight: 500; display: block; position: relative; z-index: 1; } .header-menu .main-menu > li .sub-menu li.active > a { color: #1cb098; } .header-menu .main-menu > li .sub-menu li:hover > a { color: #1cb098; } .header-meta { display: flex; align-items: center; white-space: nowrap; } .header-search { min-width: 450px; width: 100%; position: relative; margin-right: 35px; flex-grow: 1; } @media only screen and (min-width: 1400px) and (max-width: 1650px), only screen and (max-width: 1399px) { .header-search { min-width: 310px; margin-right: 40px; } } @media only screen and (max-width: 1199px) { .header-search { min-width: 220px; margin-right: 20px; } } .header-search input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]):not([type="file"]) { background-color: #f3f3f3; padding: 0 20px; height: 55px; width: 100%; border: 1px solid transparent; color: #93a1a2; font-size: 15px; font-weight: 400; border-radius: 5px; padding-right: 40px; } .header-search input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]):not([type="file"]):focus { outline: none; border-color: #1cb098; } .header-search input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]):not([type="file"])::-webkit-input-placeholder { font-size: 15px; font-weight: 400; color: #93a1a2; } .header-search input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]):not([type="file"]):-moz-placeholder { font-size: 15px; font-weight: 400; color: #93a1a2; } .header-search input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]):not([type="file"])::-moz-placeholder { font-size: 15px; font-weight: 400; color: #93a1a2; } .header-search input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]):not([type="file"]):-ms-input-placeholder { font-size: 15px; font-weight: 400; color: #93a1a2; } .header-search button { width: 55px; height: 55px; line-height: 55px; border: 0; background: none; position: absolute; top: 0; right: 0; color: #020202; font-size: 17px; } .header-search button:hover { color: #1cb098; } .header-cart .cart-btn { position: relative; border: 0; background: none; padding: 0; padding-right: 7px; margin-left: 20px; padding-left: 20px; padding-top: 4px; } @media only screen and (max-width: 991px) { .header-cart .cart-btn { margin-left: 0px; padding-left: 0px; margin-right: 20px; padding-right: 20px; } } .header-cart .cart-btn::before { position: absolute; content: ''; top: 50%; transform: translateY(-50%); left: 0px; width: 1px; height: 40px; background-color: #dedfe0; } @media only screen and (max-width: 991px) { .header-cart .cart-btn::before { left: auto; right: 0; } } .header-cart .cart-btn i { font-size: 18px; color: #322d58; transition: all 0.3s linear; } .header-cart .cart-btn .count { width: 17px; height: 17px; line-height: 17px; text-align: center; background-color: #1cb098; display: block; font-size: 11px; color: #ffffff; border-radius: 50%; position: absolute; top: 0; right: 0; } @media only screen and (max-width: 991px) { .header-cart .cart-btn .count { right: 10px; } } .header-cart .cart-btn:hover i { color: #1cb098; } .header-cart .dropdown-cart { min-width: 370px; padding: 30px; border-radius: 10px; box-shadow: 11px 10px 38px 0 rgba(46, 63, 99, 0.15); border: 0; left: 50% !important; transform: translateX(-78%) !important; top: 57px !important; } @media only screen and (max-width: 1199px) { .header-cart .dropdown-cart { left: 0 !important; } } @media only screen and (max-width: 991px), only screen and (max-width: 767px) { .header-cart .dropdown-cart { left: auto !important; right: -65px !important; transform: translateX(0) !important; } } .cart-items { max-height: 280px; overflow-y: auto; } .single-cart-item { display: flex; align-items: center; position: relative; } .single-cart-item + .single-cart-item { margin-top: 30px; } .single-cart-item .item-image img { border-radius: 50%; } .single-cart-item .item-content { flex: 1; padding-right: 25px; padding-left: 20px; } .single-cart-item .item-content .title { font-size: 16px; font-weight: 600; color: #2f2a55; line-height: 1.3; } .single-cart-item .item-content .quantity { font-size: 14px; color: #1cb098; } .single-cart-item .btn-close { position: absolute; width: 5px; height: 5px; top: 0; right: 5px; } .cart-total { display: flex; justify-content: space-between; margin-top: 25px; } .cart-total .label { font-size: 18px; font-weight: 600; color: #2f2a55; } .cart-total .value { font-size: 18px; font-weight: 700; color: #1cb098; } .cart-btns { display: flex; justify-content: space-between; margin-top: 25px; } .cart-btns .btn { width: 48%; } .header-login .link { font-size: 14px; font-weight: 500; color: #2f2a55; position: relative; display: inline-block; border: 0; padding: 0; background: none; } .header-login .link i { font-size: 18px; color: #1cb098; margin-right: 3px; } .header-login .link + .link::before { content: '/'; font-size: 14px; font-weight: 500; color: #818c91; margin: 0 5px; } .header-login .link:hover { color: #1cb098; } .header-toggle button { background: none; border: 0; padding: 0; } .header-toggle button span { width: 25px; height: 2px; background: #1cb098; margin: 5px 0; display: block; } .header-toggle button span:last-child { margin-bottom: 0; } .header-section-02 { border-bottom: 0; } .header-section-02 .header-menu { padding-left: 0px; margin-left: 0px; } .header-section-02 .header-menu::before { display: none; } .header-section-03 .header-menu .main-menu > li.active-menu > .menu-icon::after { color: #ff5562; } .header-section-03 .header-menu .main-menu > li.active-menu > a { color: #ff5562; } .header-section-03 .header-menu .main-menu > li:hover > .menu-icon::after { color: #ff5562; } .header-section-03 .header-menu .main-menu > li:hover > a { color: #ff5562; } .header-section-03 .header-menu .main-menu > li .sub-menu { border-top: 3px solid #ff5562; } .header-section-03 .header-menu .main-menu > li .sub-menu li.active > a { color: #ff5562; } .header-section-03 .header-menu .main-menu > li .sub-menu li:hover > a { color: #ff5562; } .header-section-03 .header-btn .btn { height: 40px; line-height: 38px; border-radius: 35px; background: #ff5562; padding: 0 40px; margin-left: 20px; } .header-section-03 .header-btn .btn:hover { background: #f8db5e; } .header-section-03 .header-login .link i { color: #ff5562; } .header-section-03 .header-login .link:hover { color: #ff5562; } .header-section-03 .header-cart .cart-btn .count { background-color: #ff5562; } .header-section-03 .header-cart .cart-btn:hover i { color: #ff5562; } .header-section-03 .single-cart-item .item-content .quantity { color: #ff5562; } .header-section-03 .cart-total .value { color: #ff5562; } .header-section-03 .cart-btns .btn-3 { background: #ff5562; } .header-section-03 .cart-btns .btn-3:hover { background: #f8db5e; } .header-section-04 .header-menu { margin-left: auto; } .header-section-04 .header-menu .main-menu > li.active-menu > .menu-icon::after { color: #f6520a; } .header-section-04 .header-menu .main-menu > li.active-menu > a { color: #f6520a; } .header-section-04 .header-menu .main-menu > li:hover > .menu-icon::after { color: #f6520a; } .header-section-04 .header-menu .main-menu > li:hover > a { color: #f6520a; } .header-section-04 .header-menu .main-menu > li .sub-menu { border-top: 3px solid #f6520a; } .header-section-04 .header-menu .main-menu > li .sub-menu li.active > a { color: #f6520a; } .header-section-04 .header-menu .main-menu > li .sub-menu li:hover > a { color: #f6520a; } .header-section-04 .header-cart { position: relative; margin-right: 30px; padding-right: 30px; } .header-section-04 .header-cart::before { position: absolute; content: ''; top: 50%; transform: translateY(-50%); right: 0px; width: 1px; height: 40px; background-color: #dedfe0; } .header-section-04 .header-cart .cart-btn { margin-left: 0; padding-left: 0; } .header-section-04 .header-cart .cart-btn::before { display: none; } .header-section-04 .header-cart .cart-btn .count { background-color: #f6520a; } .header-section-04 .header-cart .cart-btn:hover i { color: #f6520a; } .header-section-04 .single-cart-item .item-content .quantity { color: #f6520a; } .header-section-04 .cart-total .value { color: #f6520a; } .header-section-04 .cart-btns .btn-3 { background: #f6520a; } .header-section-04 .cart-btns .btn-3:hover { background: #f8db5e; } .header-section-04 .header-login .link i { color: #f6520a; } .header-section-04 .header-login .link + .link { height: 40px; line-height: 38px; border: 1px solid #f6520a; border-radius: 35px; color: #f6520a; padding: 0 25px; margin-left: 10px; transition: all 0.3s linear; } .header-section-04 .header-login .link + .link::before { display: none; } .header-section-04 .header-login .link + .link:hover { background: #f6520a; border: 1px solid transparent; color: #ffffff; } .header-section-04 .header-login .link:hover { color: #f6520a; } .header-section-05 .header-menu .main-menu > li.active-menu > .menu-icon::after { color: #dc3545; } .header-section-05 .header-menu .main-menu > li.active-menu > a { color: #dc3545; } .header-section-05 .header-menu .main-menu > li:hover > .menu-icon::after { color: #dc3545; } .header-section-05 .header-menu .main-menu > li:hover > a { color: #dc3545; } .header-section-05 .header-menu .main-menu > li .sub-menu { border-top: 3px solid #dc3545; } .header-section-05 .header-menu .main-menu > li .sub-menu li.active > a { color: #dc3545; } .header-section-05 .header-menu .main-menu > li .sub-menu li:hover > a { color: #dc3545; } .header-section-05 .header-login .link i { color: #dc3545; } .header-section-05 .header-login .link:hover { color: #dc3545; } .header-section-05 .header-cart .cart-btn .count { background-color: #dc3545; } .header-section-05 .header-cart .cart-btn:hover i { color: #dc3545; } .header-section-05 .single-cart-item .item-content .quantity { color: #dc3545; } .header-section-05 .cart-total .value { color: #dc3545; } .header-section-05 .cart-btns .btn-3 { background: #dc3545; } .header-section-05 .cart-btns .btn-3:hover { background: #f8db5e; } .sticky { position: fixed; top: 0; left: 0; width: 100%; z-index: 999; box-shadow: 0px 0px 16px 0px rgba(0, 0, 0, 0.07); -webkit-animation: sticky 1s; animation: sticky 1s; } @-webkit-keyframes sticky { 0% { transform: translateY(-100%); } 100% { transform: translateY(0%); } } @keyframes sticky { 0% { transform: translateY(-100%); } 100% { transform: translateY(0%); } } /*-- /* 2.3 - Offcanvas CSS /*----------------------------------------*/ .offcanvas { background: #031f42; width: 320px; } @media only screen and (max-width: 575px) { .offcanvas { width: 280px; } } .offcanvas-header .close-btn { background: none; border: 0; font-size: 18px; color: #ffffff; transition: all 0.3s linear; } .offcanvas-header .close-btn:hover { transform: rotate(90deg); color: #1cb098; } .offcanvas-logo a img { width: 130px; } .offcanvas-menu .main-menu li { position: relative; } .offcanvas-menu .main-menu li a { display: block; font-size: 16px; font-family: "Outfit", sans-serif; font-weight: 500; text-transform: capitalize; color: #ffffff; padding: 5px 0px; position: relative; } .offcanvas-menu .main-menu li .menu-expand { position: absolute; right: 20px; top: 8px; width: 30px; height: 30px; cursor: pointer; background: rgba(255, 255, 255, 0.1); border-radius: 3px; } .offcanvas-menu .main-menu li .menu-expand::before { position: absolute; content: ''; width: 16px; height: 2px; background-color: #ffffff; top: 50%; left: 50%; transform: translate(-50%, -50%); transition: all 0.3s linear; } .offcanvas-menu .main-menu li .menu-expand::after { position: absolute; content: ''; width: 2px; height: 16px; background-color: #ffffff; top: 50%; left: 50%; transform: translate(-50%, -50%); transition: all 0.3s linear; } .offcanvas-menu .main-menu li.active > .menu-expand::after { height: 0; } .offcanvas-menu .main-menu li ul { padding-left: 6%; display: none; } /*----------------------------------------*/ /* 4.1. Pages CSS (All Page Styles) /*----------------------------------------*/ /*-- /* 03 - Hero CSS /*----------------------------------------*/ .upstudy-hero-section { background-repeat: no-repeat; background-position: 100% 30%; background-size: cover; overflow: hidden; position: relative; z-index: 1; } .upstudy-hero-section .shape-3 { position: absolute; top: 39%; right: 3%; z-index: -1; } .upstudy-hero-section .shape-4 { width: 48px; height: 48px; border: 4px solid #f6b13d; border-radius: 50%; position: absolute; right: 10%; bottom: 25%; -webkit-animation: zoom-inout 3s infinite; animation: zoom-inout 3s infinite; z-index: -1; } .upstudy-hero-section .shape-5 { position: absolute; top: 35%; left: -6%; z-index: -1; } .upstudy-hero-section .svg-shape { position: absolute; left: 0; bottom: -240px; width: 100%; z-index: 5; } .upstudy-hero-section .svg-shape svg { fill: #ffffff; } .upstudy-hero-section .hero-content .title { font-size: 72px; line-height: 90px; font-family: "Outfit", sans-serif; font-weight: 700; color: #2f2a55; margin-top: 35px; } .upstudy-hero-section .hero-content .title span { position: relative; } .upstudy-hero-section .hero-content .title span::before { content: ""; position: absolute; left: 0; bottom: -20px; background-image: url(../images/shape/text-shape1.png); background-repeat: no-repeat; background-position: center bottom; width: 100%; height: 100%; } .upstudy-hero-section .hero-content .text { font-size: 20px; line-height: 30px; font-family: "Outfit", sans-serif; font-weight: 400; color: #000000; } .upstudy-hero-section .hero-content .text img { margin-right: 5px; } .upstudy-hero-section .hero-content .hero-btn { margin-top: 45px; } .upstudy-hero-section .hero-content .hero-btn .btn { height: 60px; line-height: 60px; padding: 0 80px; } .upstudy-hero-section .hero-content .link-text { font-size: 16px; line-height: 30px; font-family: "Outfit", sans-serif; color: #2f2a55; font-weight: 500; margin-top: 15px; } .upstudy-hero-section .hero-content .link-text span { color: #1cb098; } .upstudy-hero-section .hero-images { text-align: center; position: relative; padding-top: 180px; padding-bottom: 70px; z-index: 1; } .upstudy-hero-section .hero-images .shape-1 { position: absolute; left: -4%; top: 25%; -webkit-animation: round-01 5s linear infinite; animation: round-01 5s linear infinite; z-index: -2; } .upstudy-hero-section .hero-images .shape-2 { width: 35px; height: 35px; background: #fe254e; position: absolute; left: -7%; top: 21%; z-index: -2; transform: rotate(50deg); -webkit-animation: rotate-style 10s linear infinite; animation: rotate-style 10s linear infinite; } .upstudy-hero-section .hero-images .shape-6 { position: absolute; right: 12%; top: 20%; z-index: -1; } .upstudy-hero-section .hero-images .image { position: relative; } .upstudy-hero-section .hero-images .image .image-content { background: #ffffff; box-shadow: 0px 33px 73px 0px rgba(0, 0, 0, 0.1); border-radius: 20px; position: absolute; left: -13%; bottom: 30%; padding: 45px 30px; padding-top: 35px; } .upstudy-hero-section .hero-images .image .image-content .image-text .number { font-size: 24px; font-weight: 700; color: #2f2a55; } .upstudy-hero-section .hero-images .image .image-content .image-text p { font-size: 16px; line-height: 30px; color: #7a7a7a; } @-webkit-keyframes animate-02 { 0%, 100% { border-radius: 50% 50% 50% 50% / 50% 35% 65% 50%; } 34% { border-radius: 50% 50% 35% 65% / 50% 50% 50% 50%; } 50% { border-radius: 50% 50% 50% 50% / 65% 50% 50% 35%; } 67% { border-radius: 35% 65% 50% 50% / 50% 50% 50% 50%; } } @keyframes animate-02 { 0%, 100% { border-radius: 50% 50% 50% 50% / 50% 35% 65% 50%; } 34% { border-radius: 50% 50% 35% 65% / 50% 50% 50% 50%; } 50% { border-radius: 50% 50% 50% 50% / 65% 50% 50% 35%; } 67% { border-radius: 35% 65% 50% 50% / 50% 50% 50% 50%; } } @-webkit-keyframes round-01 { 0% { transform: rotate(10deg); } 50% { transform: rotate(0deg); } 100% { transform: rotate(10deg); } } @keyframes round-01 { 0% { transform: rotate(10deg); } 50% { transform: rotate(0deg); } 100% { transform: rotate(10deg); } } @-webkit-keyframes zoom-inout { 0% { transform: scale(1); } 50% { transform: scale(0.8); } 100% { transform: scale(1); } } @keyframes zoom-inout { 0% { transform: scale(1); } 50% { transform: scale(0.8); } 100% { transform: scale(1); } } @-webkit-keyframes rotate-style { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } @keyframes rotate-style { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } @media only screen and (max-width: 1899px) { .upstudy-hero-section .svg-shape { bottom: -225px; } .upstudy-hero-section .hero-images { padding-bottom: 40px; } } @media only screen and (min-width: 1400px) and (max-width: 1650px) { .upstudy-hero-section .svg-shape { bottom: -185px; } .upstudy-hero-section .hero-images { padding-bottom: 30px; } } @media only screen and (max-width: 1399px) { .upstudy-hero-section .svg-shape { bottom: -155px; } .upstudy-hero-section .hero-images { padding-bottom: 30px; } } @media only screen and (max-width: 1199px) { .upstudy-hero-section .shape-5 { left: -14%; } .upstudy-hero-section .svg-shape { bottom: -130px; } .upstudy-hero-section .hero-content .title { font-size: 60px; line-height: 72px; } .upstudy-hero-section .hero-images { padding-bottom: 0; } .upstudy-hero-section .hero-images .image .image-content { padding-top: 30px; padding: 35px 25px; left: 0; bottom: 23%; } } @media only screen and (max-width: 991px) { .upstudy-hero-section .shape-5 { top: 22%; left: -17%; } .upstudy-hero-section .svg-shape { bottom: -100px; } .upstudy-hero-section .hero-content { padding-top: 190px; } .upstudy-hero-section .hero-content .title { font-size: 50px; line-height: 65px; } .upstudy-hero-section .hero-images { padding-left: 70px; padding-right: 70px; padding-top: 90px; } .upstudy-hero-section .hero-images .shape-1 { width: 540px; left: 2%; } .upstudy-hero-section .hero-images .shape-2 { left: 0; } } @media only screen and (max-width: 767px) { .upstudy-hero-section .shape-3 { top: 40%; } .upstudy-hero-section .shape-3 img { width: 120px; } .upstudy-hero-section .shape-5 { left: -25%; } .upstudy-hero-section .svg-shape { bottom: -75px; } .upstudy-hero-section .hero-content { padding-top: 130px; } .upstudy-hero-section .hero-content .title { font-size: 50px; line-height: 65px; } .upstudy-hero-section .hero-content .title span::before { background-size: contain; } .upstudy-hero-section .hero-images { padding-left: 30px; padding-right: 30px; } .upstudy-hero-section .hero-images .shape-1 { width: 450px; left: -5%; } .upstudy-hero-section .hero-images .shape-6 { right: 8%; } } @media only screen and (max-width: 575px) { .upstudy-hero-section .shape-3 { display: none; } .upstudy-hero-section .shape-5 { display: none; } .upstudy-hero-section .svg-shape { bottom: -60px; } .upstudy-hero-section .hero-content .title { font-size: 42px; line-height: 58px; } .upstudy-hero-section .hero-content .hero-btn .btn { padding: 0 60px; } .upstudy-hero-section .hero-images { padding-left: 0px; padding-right: 0px; } .upstudy-hero-section .hero-images .shape-1 { width: 450px; left: -5%; } .upstudy-hero-section .hero-images .shape-6 { right: 0%; } .upstudy-hero-section .hero-images .image .image-content { bottom: 15%; } } @media only screen and (max-width: 449px) { .upstudy-hero-section .svg-shape { bottom: -40px; } .upstudy-hero-section .hero-content .title { font-size: 38px; line-height: 55px; } .upstudy-hero-section .hero-content .text { font-size: 15px; } } .upstudy-hero-section-02 { height: 960px; background: #f8f8f8; background-repeat: no-repeat; background-position: center center; background-size: cover; position: relative; overflow: hidden; padding-top: 90px; z-index: 1; } .upstudy-hero-section-02 .image-1 { position: absolute; left: 3%; top: 28%; z-index: -1; } .upstudy-hero-section-02 .image-1 .shape-1 { position: absolute; top: -80px; right: 20px; } .upstudy-hero-section-02 .image-2 { position: absolute; right: 4%; top: 28%; z-index: -1; } .upstudy-hero-section-02 .image-2 .shape-2 { position: absolute; right: -40px; top: -55px; z-index: -1; } .upstudy-hero-section-02 .shape-3 { position: absolute; top: 11%; right: 28%; z-index: -1; } .upstudy-hero-section-02 .hero-content { max-width: 680px; margin: 0 auto; padding-top: 110px; } .upstudy-hero-section-02 .hero-content p { font-size: 18px; line-height: 30px; font-weight: 400; color: #000000; } .upstudy-hero-section-02 .hero-content .section-title .title { font-size: 72px; line-height: 90px; margin-top: 25px; } .upstudy-hero-section-02 .hero-content .section-title .title span::before { bottom: -15px; } .upstudy-hero-section-02 .hero-content .hero-form { position: relative; margin-top: 60px; } .upstudy-hero-section-02 .hero-content .hero-form input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]):not([type="file"]) { height: 70px; width: 100%; border-radius: 5px; font-size: 16px; font-weight: 400; padding-right: 95px; } .upstudy-hero-section-02 .hero-content .hero-form input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]):not([type="file"])::-webkit-input-placeholder { opacity: 0.95; font-size: 16px; color: #a5a5a5; font-weight: 400; } .upstudy-hero-section-02 .hero-content .hero-form input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]):not([type="file"]):-moz-placeholder { opacity: 0.95; font-size: 16px; color: #a5a5a5; font-weight: 400; } .upstudy-hero-section-02 .hero-content .hero-form input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]):not([type="file"])::-moz-placeholder { opacity: 0.95; font-size: 16px; color: #a5a5a5; font-weight: 400; } .upstudy-hero-section-02 .hero-content .hero-form input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]):not([type="file"]):-ms-input-placeholder { opacity: 0.95; font-size: 16px; color: #a5a5a5; font-weight: 400; } .upstudy-hero-section-02 .hero-content .hero-form .search { position: absolute; right: 0px; width: 75px; height: 70px; line-height: 52px; background: #1cb098; color: #ffffff; border: 0; border-top-right-radius: 5px; border-bottom-right-radius: 5px; top: 50%; font-size: 20px; transform: translateY(-50%); } @media only screen and (max-width: 1199px) { .upstudy-hero-section-02 .image-1 { left: 2%; top: 21%; } .upstudy-hero-section-02 .image-1 img { width: 250px; } .upstudy-hero-section-02 .image-2 { right: 2%; top: 20%; } .upstudy-hero-section-02 .image-2 img { width: 250px; } .upstudy-hero-section-02 .hero-content { max-width: 570px; } .upstudy-hero-section-02 .hero-content .section-title .title { font-size: 60px; line-height: 78px; } } @media only screen and (max-width: 991px) { .upstudy-hero-section-02 { height: 900px; } .upstudy-hero-section-02 .image-1 { display: none; } .upstudy-hero-section-02 .image-2 { display: none; } .upstudy-hero-section-02 .hero-content { padding-top: 90px; } } @media only screen and (max-width: 767px) { .upstudy-hero-section-02 { height: auto; padding-bottom: 80px; } .upstudy-hero-section-02 .shape-3 { top: 9%; right: 6%; } .upstudy-hero-section-02 .hero-content p { font-size: 15px; } .upstudy-hero-section-02 .hero-content .section-title .title { font-size: 48px; line-height: 65px; } } @media only screen and (max-width: 449px) { .upstudy-hero-section-02 .shape-3 { top: 9%; right: 6%; } .upstudy-hero-section-02 .hero-content .section-title .title { font-size: 36px; line-height: 52px; } .upstudy-hero-section-02 .hero-content .hero-form { margin-top: 40px; } .upstudy-hero-section-02 .hero-content .hero-form input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]):not([type="file"]) { padding: 10px 15px; padding-right: 80px; } } .upstudy-hero-section-03 { background: #fdf8f4; background-repeat: no-repeat; background-position: center center; background-size: cover; overflow: hidden; position: relative; z-index: 1; } .upstudy-hero-section-03 .shape-1 { position: absolute; top: 27%; -webkit-animation: zoom-inout 3s infinite; animation: zoom-inout 3s infinite; left: 4%; z-index: -1; } .upstudy-hero-section-03 .shape-1 svg { fill: #f9e27e; } .upstudy-hero-section-03 .shape-2 { position: absolute; left: 41%; bottom: 21%; -webkit-animation: zoom-inout 3s infinite; animation: zoom-inout 3s infinite; z-index: -1; } .upstudy-hero-section-03 .shape-2 svg { fill: #9391fa; } .upstudy-hero-section-03 .hero-content { padding-top: 70px; } .upstudy-hero-section-03 .hero-content .sub-title { font-size: 18px; line-height: 30px; font-weight: 400; text-transform: uppercase; letter-spacing: 1px; color: #1cb098; } .upstudy-hero-section-03 .hero-content .title { font-size: 72px; line-height: 90px; font-family: "Outfit", sans-serif; font-weight: 700; color: #2f2a55; margin-top: 15px; } .upstudy-hero-section-03 .hero-content .title span { position: relative; } .upstudy-hero-section-03 .hero-content .title span::before { content: ""; position: absolute; left: 0; bottom: -16px; background-image: url(../images/shape/text-shape2.png); background-repeat: no-repeat; background-position: center bottom; width: 100%; height: 100%; } .upstudy-hero-section-03 .hero-content .hero-btn { margin-top: 60px; } .upstudy-hero-section-03 .hero-content .hero-btn .btn { height: 60px; line-height: 60px; padding: 0 65px; } .upstudy-hero-section-03 .hero-content .hero-btn .btn i { position: relative; top: 1px; left: 5px; } .upstudy-hero-section-03 .hero-images { text-align: center; position: relative; padding-top: 215px; padding-bottom: 140px; z-index: 1; } .upstudy-hero-section-03 .hero-images .shape-4 { position: absolute; top: 21%; left: -17%; -webkit-animation: zoom-inout 3s infinite; animation: zoom-inout 3s infinite; z-index: -1; } .upstudy-hero-section-03 .hero-images .image-content { background: #ffffff; box-shadow: 0px 24px 59px 0px rgba(0, 0, 0, 0.13); border-radius: 10px; position: absolute; left: -4%; top: 42.5%; padding: 15px 50px 15px 70px; } .upstudy-hero-section-03 .hero-images .image-content .icon-img { position: absolute; left: 15px; top: -15px; } .upstudy-hero-section-03 .hero-images .image-content .image-text .title { font-size: 16px; font-weight: 500; color: #2f2a55; } .upstudy-hero-section-03 .hero-images .image-content .image-text p { font-size: 14px; line-height: 24px; color: #7a7a7a; } @media only screen and (max-width: 1199px) { .upstudy-hero-section-03 .hero-content .title { font-size: 52px; line-height: 70px; } } @media only screen and (max-width: 991px) { .upstudy-hero-section-03 { padding-top: 110px; } .upstudy-hero-section-03 .shape-1 { top: 9%; } .upstudy-hero-section-03 .shape-2 { left: 55%; bottom: 60%; } .upstudy-hero-section-03 .hero-images { padding-top: 110px; } .upstudy-hero-section-03 .hero-images .shape-4 { top: 16%; left: -3%; } } @media only screen and (max-width: 767px) { .upstudy-hero-section-03 .shape-2 { left: 70%; } .upstudy-hero-section-03 .hero-content .title { font-size: 45px; line-height: 65px; } .upstudy-hero-section-03 .hero-images { padding-top: 80px; padding-bottom: 110px; } .upstudy-hero-section-03 .hero-images .shape-4 { top: 16%; left: -3%; } } @media only screen and (max-width: 449px) { .upstudy-hero-section-03 .hero-content { padding-top: 40px; } .upstudy-hero-section-03 .hero-content .sub-title { font-size: 16px; } .upstudy-hero-section-03 .hero-content .title { font-size: 35px; line-height: 55px; } .upstudy-hero-section-03 .hero-content .hero-btn { margin-top: 40px; } .upstudy-hero-section-03 .hero-content .hero-btn .btn { padding: 0 40px; } .upstudy-hero-section-03 .hero-images { padding-top: 60px; padding-bottom: 100px; } .upstudy-hero-section-03 .hero-images .shape-4 img { width: 140px; } } .upstudy-hero-section-04 { background: #ffe3e5; height: 1220px; display: flex; align-items: center; position: relative; overflow: hidden; z-index: 1; } .upstudy-hero-section-04 .shape-2 { position: absolute; left: 0; bottom: -21%; width: 100%; z-index: 5; } .upstudy-hero-section-04 .shape-3 { position: absolute; left: 5%; top: 20%; z-index: -1; -webkit-animation: round-01 5s linear infinite; animation: round-01 5s linear infinite; } .upstudy-hero-section-04 .shape-4 { position: absolute; left: 3%; bottom: 0; z-index: -1; } .upstudy-hero-section-04 .shape-5 { position: absolute; left: 45%; bottom: 18%; z-index: -1; -webkit-animation: zoom-inout 3s infinite; animation: zoom-inout 3s infinite; } .upstudy-hero-section-04 .shape-6 { position: absolute; right: 3%; top: 16%; z-index: -1; -webkit-animation: round-01 5s linear infinite; animation: round-01 5s linear infinite; } .upstudy-hero-section-04 .hero-image { position: absolute; top: 0; right: 0; width: 50%; height: 100%; display: flex; justify-content: center; } .upstudy-hero-section-04 .hero-image .shape-1 { position: absolute; left: -5%; top: 22%; z-index: -1; } .upstudy-hero-section-04 .hero-image .image { padding-top: 185px; padding-left: 30px; } @media only screen and (max-width: 1199px) { .upstudy-hero-section-04 { height: 1150px; } .upstudy-hero-section-04 .shape-2 { bottom: -11%; } .upstudy-hero-section-04 .shape-4 { width: 280px; bottom: -3%; } .upstudy-hero-section-04 .hero-image .shape-1 { left: -1%; } } @media only screen and (max-width: 991px) { .upstudy-hero-section-04 { height: auto; display: block; } .upstudy-hero-section-04 .shape-2 { bottom: -6%; } .upstudy-hero-section-04 .shape-3 { top: 7%; } .upstudy-hero-section-04 .shape-6 { top: 40%; } .upstudy-hero-section-04 .hero-content { padding-top: 150px; } .upstudy-hero-section-04 .hero-image { position: relative; width: 100%; } .upstudy-hero-section-04 .hero-image .image { padding-top: 60px; padding-left: 85px; padding-right: 85px; } } @media only screen and (max-width: 449px) { .upstudy-hero-section-04 { height: auto; } .upstudy-hero-section-04 .shape-4 { display: none; } .upstudy-hero-section-04 .shape-6 { top: 43%; } .upstudy-hero-section-04 .hero-image .image { padding-left: 35px; padding-right: 35px; } } .upstudy-hero-section-05 { background: #fff9eb; overflow: hidden; position: relative; z-index: 1; } .upstudy-hero-section-05 .shape-2 { position: absolute; left: -26%; top: -28%; z-index: -1; } .upstudy-hero-section-05 .hero-content .title { font-size: 72px; line-height: 86px; font-family: "Outfit", sans-serif; font-weight: 700; color: #1e1e1e; } .upstudy-hero-section-05 .hero-content .title span { color: #f6520a; } .upstudy-hero-section-05 .hero-content .hero-btn-wrap { display: flex; align-items: center; margin-top: 50px; } .upstudy-hero-section-05 .hero-content .hero-btn-wrap .hero-btn .btn { height: 65px; line-height: 64px; border-radius: 35px; font-size: 18px; background: #f6520a; padding: 0 50px; } .upstudy-hero-section-05 .hero-content .hero-btn-wrap .hero-btn .btn:hover { background: #ffa300; } .upstudy-hero-section-05 .hero-content .hero-btn-wrap .hero-call { display: flex; align-items: center; margin-left: 25px; } .upstudy-hero-section-05 .hero-content .hero-btn-wrap .hero-call .icon { height: 65px; width: 65px; line-height: 65px; text-align: center; border-radius: 50%; font-size: 26px; color: #f6520a; background: #ffffff; } .upstudy-hero-section-05 .hero-content .hero-btn-wrap .hero-call .number { font-size: 24px; font-weight: 500; color: #1e1e1e; margin-left: 10px; } .upstudy-hero-section-05 .hero-images { text-align: center; position: relative; padding-top: 50px; z-index: 1; } .upstudy-hero-section-05 .hero-images .shape-1 { position: absolute; top: 11%; right: 0; z-index: -1; } .upstudy-hero-section-05 .hero-images .image { position: relative; bottom: -120px; } @media only screen and (max-width: 1199px) { .upstudy-hero-section-05 .shape-2 { left: -53%; top: -62%; } .upstudy-hero-section-05 .hero-content .title { font-size: 50px; line-height: 70px; } .upstudy-hero-section-05 .hero-content .hero-btn-wrap .hero-btn .btn { padding: 0 40px; } } @media only screen and (max-width: 991px) { .upstudy-hero-section-05 { padding-top: 60px; } .upstudy-hero-section-05 .shape-2 { left: -67%; top: -46%; } .upstudy-hero-section-05 .hero-content { padding-top: 60px; } .upstudy-hero-section-05 .hero-images { padding-top: 0; } .upstudy-hero-section-05 .hero-images .shape-1 { width: 550px; top: 11%; right: 11%; } .upstudy-hero-section-05 .hero-images .image { bottom: -90px; padding: 0 100px; } } @media only screen and (max-width: 767px) { .upstudy-hero-section-05 .shape-2 { left: -90%; top: -70%; } .upstudy-hero-section-05 .hero-content .title { font-size: 40px; line-height: 55px; } .upstudy-hero-section-05 .hero-images .shape-1 { width: 450px; top: 15%; right: 8%; } .upstudy-hero-section-05 .hero-images .image { padding: 0 50px; } } @media only screen and (max-width: 575px) { .upstudy-hero-section-05 .shape-2 { display: none; } .upstudy-hero-section-05 .hero-content .title { font-size: 40px; line-height: 55px; } .upstudy-hero-section-05 .hero-content .hero-btn-wrap { align-items: start; flex-direction: column; gap: 20px; } .upstudy-hero-section-05 .hero-content .hero-btn-wrap .hero-call { margin-left: 0px; } .upstudy-hero-section-05 .hero-images .shape-1 { width: 370px; } .upstudy-hero-section-05 .hero-images .image { bottom: -60px; } } @media only screen and (max-width: 449px) { .upstudy-hero-section-05 .hero-content .title { font-size: 35px; line-height: 50px; } .upstudy-hero-section-05 .hero-images .shape-1 { width: 370px; right: 2%; } .upstudy-hero-section-05 .hero-images .image { padding: 0 0; bottom: -60px; } } .upstudy-hero-section-06 { height: 1100px; background-repeat: no-repeat; background-size: cover; background-position: center top; overflow: hidden; position: relative; z-index: 1; } .upstudy-hero-section-06 .shape-1 { position: absolute; right: -38%; bottom: -105%; z-index: -1; } .upstudy-hero-section-06 .shape-2 { position: absolute; right: -40%; bottom: -119%; z-index: -1; } .upstudy-hero-section-06 .shape-3 { position: absolute; width: 100%; height: 130px; right: 0; left: 0px; bottom: -100px; background: #ffffff; transform: skewY(-3deg); transform-origin: 0; z-index: 2; } .upstudy-hero-section-06 .hero-content .sub-title { font-size: 20px; line-height: 30px; font-weight: 400; text-transform: uppercase; letter-spacing: 2px; padding-left: 50px; color: #ffffff; } .upstudy-hero-section-06 .hero-content .title { font-size: 100px; line-height: 1; font-family: "Nanum Myeongjo", serif; font-weight: 800; text-transform: uppercase; color: #ffffff; padding-left: 50px; margin-top: 10px; position: relative; z-index: 1; } .upstudy-hero-section-06 .hero-content .title::before { content: ""; position: absolute; left: 0; top: 50%; background: #fdc735; height: 340px; width: 4px; transform: translateY(-55%); } .upstudy-hero-section-06 .hero-content .hero-btn { padding-left: 50px; } .upstudy-hero-section-06 .hero-content .hero-btn .btn { height: 65px; line-height: 63px; padding: 0 75px; background: #dc3545; color: #ffffff; margin-top: 50px; } .upstudy-hero-section-06 .hero-content .hero-btn .btn:hover { background: #ffffff; color: #dc3545; } @media only screen and (max-width: 1199px) { .upstudy-hero-section-06 { height: 980px; } .upstudy-hero-section-06 .shape-1 { right: -65%; bottom: -134%; } .upstudy-hero-section-06 .shape-2 { right: -67%; bottom: -144%; } .upstudy-hero-section-06 .hero-content .sub-title { font-size: 18px; } .upstudy-hero-section-06 .hero-content .title { font-size: 75px; } .upstudy-hero-section-06 .hero-content .title::before { height: 270px; } } @media only screen and (max-width: 991px) { .upstudy-hero-section-06 { height: 880px; } .upstudy-hero-section-06 .shape-1 { right: -96%; bottom: -150%; } .upstudy-hero-section-06 .shape-2 { right: -99%; bottom: -160%; } } @media only screen and (max-width: 767px) { .upstudy-hero-section-06 { height: 780px; } .upstudy-hero-section-06 .shape-1 { right: -128%; bottom: -176%; } .upstudy-hero-section-06 .shape-2 { right: -130%; bottom: -185%; } .upstudy-hero-section-06 .hero-content .sub-title { font-size: 16px; } .upstudy-hero-section-06 .hero-content .title { font-size: 60px; } .upstudy-hero-section-06 .hero-content .title::before { height: 230px; } } @media only screen and (max-width: 575px) { .upstudy-hero-section-06 .shape-1 { right: -160%; bottom: -176%; } .upstudy-hero-section-06 .shape-2 { right: -163%; bottom: -185%; } } @media only screen and (max-width: 449px) { .upstudy-hero-section-06 { height: 720px; } .upstudy-hero-section-06 .shape-1 { display: none; } .upstudy-hero-section-06 .shape-2 { display: none; } .upstudy-hero-section-06 .hero-content .sub-title { font-size: 16px; padding-left: 30px; } .upstudy-hero-section-06 .hero-content .title { font-size: 44px; padding-left: 30px; } .upstudy-hero-section-06 .hero-content .title::before { height: 230px; } .upstudy-hero-section-06 .hero-content .hero-btn { padding-left: 30px; } } /*-- /* 04 - Category CSS /*----------------------------------------*/ @media only screen and (max-width: 1199px) { .upstudy-category-section { padding-top: 35px; } } .category-content-wrap { padding-top: 50px; } .category-item { display: flex; align-items: center; background: #f7efff; border-radius: 50px; padding: 5px 8px; margin-top: 30px; } .category-item.color-2 { background: #fff6f3; } .category-item.color-3 { background: #effafd; } .category-item.color-4 { background: #fff7ee; } .category-item .category-icon { height: 70px; width: 70px; line-height: 70px; background: #ffffff; border-radius: 50%; text-align: center; } .category-item .category-content { margin-left: 10px; } .category-item .category-content .title { font-size: 18px; line-height: 30px; font-weight: 500; color: #2f2a55; transition: all 0.3s linear; } .category-item:hover .category-content .title { color: #1cb098; } .upstudy-category-section-02 { background-repeat: no-repeat; background-position: center center; background-size: cover; overflow: hidden; padding-bottom: 170px; position: relative; z-index: 1; } @media only screen and (max-width: 1199px) { .upstudy-category-section-02 { padding-bottom: 100px; } } @media only screen and (max-width: 991px) { .upstudy-category-section-02 { padding-bottom: 80px; } } .upstudy-category-section-02 .shape-1 { position: absolute; right: -130px; top: 140px; z-index: -1; } .upstudy-category-section-02 .shape-2 { position: absolute; left: 60px; top: 110px; z-index: -1; } .upstudy-category-section-02 .shape-3 { position: absolute; left: 3%; bottom: 38%; -webkit-animation: zoom-inout 3s infinite; animation: zoom-inout 3s infinite; z-index: -1; } .upstudy-category-section-02 .category-wrap { padding-top: 50px; } .category-item-02 { margin-top: 30px; position: relative; transform: translate3d(0, 0, 0); transition: all 0.3s linear; } .category-item-02 .category-img { border-radius: 10px; overflow: hidden; } .category-item-02 .category-img a { display: block; position: relative; } .category-item-02 .category-img a::before { content: ""; position: absolute; height: 100%; width: 100%; top: 0; left: 0; background: linear-gradient(180deg, #FFFFFF00 43%, #00000082 63%); z-index: 0; } .category-item-02 .category-content { position: absolute; bottom: 55px; left: 50%; transform: translateX(-50%); } .category-item-02 .category-content .title { font-size: 22px; font-weight: 700; margin-bottom: -3px; margin-top: 30px; } .category-item-02 .category-content .title a { color: #ffffff; } .category-item-02 .category-content .title a:hover { color: #1cb098; } .category-item-02:hover { transform: translateY(-5px) translate3d(0, -5px, 0); } .upstudy-category-section-03 .category-item { background: none; border: 1px solid #e1e1e1; border-radius: 10px; padding: 20px 25px; transition: all 0.3s linear; } .upstudy-category-section-03 .category-item .category-icon { line-height: 68px; background: #f7efff; } .upstudy-category-section-03 .category-item .category-icon.color-2 { background: #fff6f3; } .upstudy-category-section-03 .category-item .category-icon.color-3 { background: #effafd; } .upstudy-category-section-03 .category-item .category-icon.color-4 { background: #fff7ee; } .upstudy-category-section-03 .category-item .category-content .title { transition: all 0.3s linear; } .upstudy-category-section-03 .category-item:hover { border: 1px solid #1cb098; } .upstudy-category-section-03 .category-item:hover .category-content .title { color: #1cb098; } /*-- /* 05 - Offer CSS /*----------------------------------------*/ .upstudy-offer-section .offer-wrap { margin-top: -30px; } .single-offer { position: relative; margin-top: 30px; } .single-offer .offer-images { border-radius: 5px; overflow: hidden; } .single-offer .offer-content { position: absolute; top: 0; left: 0; width: 54%; padding: 65px 40px 55px; } .single-offer .offer-content .sub-title { font-size: 18px; line-height: 30px; font-weight: 600; color: #1cb098; } .single-offer .offer-content .title { font-size: 36px; line-height: 48px; font-weight: 600; color: #2f2a55; } .single-offer .offer-content p { font-size: 18px; line-height: 30px; font-weight: 400; color: #7a7a7a; margin-top: 20px; } .single-offer .offer-content .btn { margin-top: 35px; } @media only screen and (max-width: 1199px) { .single-offer .offer-content { width: 80%; padding: 20px 40px 15px; } .single-offer .offer-content p { margin-top: 10px; } .single-offer .offer-content .btn { margin-top: 20px; } } @media only screen and (max-width: 991px) { .single-offer .offer-content { width: 54%; padding: 65px 40px 55px; } .single-offer .offer-content p { margin-top: 20px; } .single-offer .offer-content .btn { margin-top: 35px; } } @media only screen and (max-width: 767px) { .single-offer .offer-content { width: 80%; padding: 30px 40px 15px; } .single-offer .offer-content p { margin-top: 10px; } .single-offer .offer-content .btn { margin-top: 20px; } } @media only screen and (max-width: 575px) { .single-offer .offer-content { width: 90%; padding: 20px 40px 15px; padding-right: 0; } .single-offer .offer-content .sub-title { font-size: 16px; } .single-offer .offer-content .title { font-size: 30px; line-height: 45px; } .single-offer .offer-content p { font-size: 16px; } .single-offer .offer-content .btn { height: 40px; line-height: 38px; padding: 0px 30px; font-size: 15px; } } @media only screen and (max-width: 449px) { .single-offer .offer-content p { display: none; } } .upstudy-offer-section-02 .offer-wrap { margin-top: -40px; } .upstudy-offer-section-02 .single-offer-02 { background: #c8eaf7; border: 1px solid #898989; border-radius: 30px; padding: 70px 50px; position: relative; margin-top: 40px; } .upstudy-offer-section-02 .single-offer-02::before { content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: #000000; transform: translate(6px, 8px) scale(1.01); z-index: -1; border-radius: 30px; } .upstudy-offer-section-02 .single-offer-02.color-02 { background: #f1d7ec; } .upstudy-offer-section-02 .single-offer-02 .offer-images { text-align: right; } .upstudy-offer-section-02 .single-offer-02 .offer-images img { width: 220px; height: 140px; -o-object-fit: contain; object-fit: contain; } .upstudy-offer-section-02 .single-offer-02 .offer-content .sub-title { font-size: 14px; line-height: 26px; font-weight: 600; color: #2f2a55; } .upstudy-offer-section-02 .single-offer-02 .offer-content .title { font-size: 36px; line-height: 48px; font-weight: 600; color: #2f2a55; } .upstudy-offer-section-02 .single-offer-02 .offer-content .link-btn { font-size: 12px; font-weight: 700; color: #1cb098; text-transform: uppercase; margin-top: 20px; position: relative; } .upstudy-offer-section-02 .single-offer-02 .offer-content .link-btn::before { position: absolute; left: 0; bottom: 1px; height: 1px; width: 100%; content: ""; transform: scale(1); background: #1cb098; transition: all 0.3s linear; } .upstudy-offer-section-02 .single-offer-02 .offer-content .link-btn:hover::before { transform: scale(-1); } @media only screen and (max-width: 1199px) { .upstudy-offer-section-02 .single-offer-02 { padding: 60px 40px; } } @media only screen and (max-width: 575px) { .upstudy-offer-section-02 .single-offer-02 .offer-images { margin-top: 30px; } } /*-- /* 06 - Courses CSS /*----------------------------------------*/ .courses-wrapper { margin-top: 30px; } .tab-menu { padding-top: 10px; } .tab-menu .nav li { margin: 0 17px; padding-top: 10px; } @media only screen and (max-width: 767px) { .tab-menu .nav li { margin: 0 10px; } } .tab-menu .nav li button { font-size: 15px; font-weight: 500; color: #747379; border: 0; padding: 0; background: none; } @media only screen and (max-width: 767px) { .tab-menu .nav li button { font-size: 15px; } } .tab-menu .nav li button:hover, .tab-menu .nav li button.active { color: #1cb098; } .courses-tab-content { margin-top: 0 !important; padding-top: 10px; } .single-course { border-bottom-left-radius: 5px; border-bottom-right-radius: 5px; background-color: #ffffff; transition: all 0.3s linear; margin-top: 30px; position: relative; } .single-course .courses-image { overflow: hidden; border-top-left-radius: 5px; border-top-right-radius: 5px; } .single-course .courses-image a { display: block; position: relative; } .single-course .courses-image a::before { position: absolute; content: ''; width: 100%; height: 100%; top: 0; left: 0; background-color: #000000; transition: all 0.3s linear; opacity: 0; } .single-course .courses-content { padding-top: 15px; } .single-course .courses-content .top-meta { display: flex; justify-content: space-between; } .single-course .courses-content .top-meta .tag-time { display: flex; align-items: center; } .single-course .courses-content .top-meta .tag-time .tag { border-radius: 5px; background-color: rgba(28, 176, 152, 0.071); font-size: 13px; font-weight: 500; color: #1cb098; padding: 0 15px; height: 25px; line-height: 22px; } .single-course .courses-content .top-meta .tag-time .tag:hover { background-color: #1cb098; color: #ffffff; } .single-course .courses-content .top-meta .tag-time .time { font-size: 13px; font-weight: 400; color: #7a7a7a; margin-left: 15px; } .single-course .courses-content .top-meta .price .sale-price { font-size: 16px; font-weight: 500; color: #1cb098; } .single-course .courses-content .title { font-size: 20px; font-weight: 500; line-height: 1.3; color: #2f2a55; margin-top: 15px; } .single-course .courses-content .author-name { font-size: 14px; font-weight: 500; color: #000000; margin-top: 5px; } .single-course .courses-content .author-name span { font-weight: 400; color: #7a7a7a; } .single-course .courses-content .courses-meta { display: flex; justify-content: space-between; align-items: center; padding-top: 5px; } .single-course .courses-content .courses-meta .rating { display: flex; align-items: center; margin-top: 5px; } .single-course .courses-content .courses-meta .rating .rating-star { display: block; position: relative; } .single-course .courses-content .courses-meta .rating .rating-star::before { content: '\f13b \f13b \f13b \f13b \f13b'; font-family: "flaticon"; font-size: 13px; color: #b4b4b4; letter-spacing: 3px; } .single-course .courses-content .courses-meta .rating .rating-star .rating-active { position: absolute; top: 0; left: 0; overflow: hidden; } .single-course .courses-content .courses-meta .rating .rating-star .rating-active::before { content: '\f13b \f13b \f13b \f13b \f13b'; font-family: "flaticon"; font-size: 13px; color: #fda000; letter-spacing: 3px; } .single-course .courses-content .courses-meta .rating span { font-size: 13px; color: #838383; } .single-course:hover .courses-image a::before { opacity: 0.2; } .course-header { display: flex; justify-content: space-between; align-items: center; margin-top: -22px; } @media only screen and (max-width: 991px), only screen and (max-width: 767px) { .course-header { display: block; text-align: center; } } .course-header .section-title { margin-top: 25px; } .upstudy-courses-section { background: #eff5ff; position: relative; overflow: hidden; z-index: 1; } .upstudy-courses-section .shape-1 { position: absolute; left: -20%; top: -8%; z-index: -1; } .upstudy-courses-section .shape-1 svg { fill: none; stroke-width: 3px; stroke: #d9eef4; } .upstudy-courses-section .shape-2 { position: absolute; top: 15%; right: -22%; z-index: -1; } .upstudy-courses-section .shape-2 svg { fill: #c5e7ea; } .upstudy-courses-section .shape-3 { position: absolute; top: 9%; right: -23%; z-index: -1; } .upstudy-courses-section .shape-3 svg { fill: none; stroke-width: 3px; stroke: #ffffff; } .upstudy-courses-section .courses-wrap { padding-top: 50px; } .upstudy-courses-section .single-course { border-radius: 10px; overflow: hidden; } .upstudy-courses-section .single-course .courses-content { padding: 30px 55px 40px 40px; } .courses-active .swiper-pagination { position: relative; margin-top: 50px; } .courses-active .swiper-pagination .swiper-pagination-bullet { margin: 0 7px; background-color: #e1e1e1; } .courses-active .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active { background-color: #1cb098; } @media only screen and (max-width: 1199px) { .upstudy-courses-section .single-course .courses-content { padding: 30px 35px 40px 35px; } } @media only screen and (max-width: 991px) { .upstudy-courses-section .shape-1 { left: -64%; } .upstudy-courses-section .shape-2 { right: -70%; } .upstudy-courses-section .shape-3 { right: -75%; } } @media only screen and (max-width: 575px) { .upstudy-courses-section .shape-1 { display: none; } .upstudy-courses-section .shape-2 { display: none; } .upstudy-courses-section .shape-3 { display: none; } } .upstudy-courses-section-02 .courses-content-wrap { padding-top: 50px; } .upstudy-courses-section-02 .courses-content-wrap .courses-active .swiper-pagination { position: relative; margin-top: 50px; } .upstudy-courses-section-02 .courses-content-wrap .courses-active .swiper-pagination .swiper-pagination-bullet { margin: 0 7px; background-color: #dbdbdb; } .upstudy-courses-section-02 .courses-content-wrap .courses-active .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active { background-color: #ee4f0a; } .upstudy-courses-section-02 .single-course { box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.16); background-color: #ffffff; border-radius: 30px; overflow: hidden; padding: 30px 25px 25px; margin: 0 5px; margin-top: 5px; transition: all 0.3s linear; } @media only screen and (max-width: 991px) { .upstudy-courses-section-02 .single-course { padding: 30px 20px 25px; } } .upstudy-courses-section-02 .single-course .courses-image { position: relative; border-radius: 30px; } .upstudy-courses-section-02 .single-course .courses-image > a { display: block; position: relative; } .upstudy-courses-section-02 .single-course .courses-image > a::before { position: absolute; content: ''; width: 100%; height: 100%; top: 0; left: 0; background-color: #000000; transition: all 0.3s linear; opacity: 0; } .upstudy-courses-section-02 .single-course .courses-image .top-meta { position: absolute; top: 40px; left: 25px; } .upstudy-courses-section-02 .single-course .courses-image .top-meta .price { font-size: 18px; font-weight: 600; border-radius: 5px; padding: 0 15px; height: 30px; line-height: 30px; display: inline-block; color: #1e1e1e; background: #ffa300; white-space: nowrap; } .upstudy-courses-section-02 .single-course .courses-image .top-meta .price.color-1 { background: #1cb098; } .upstudy-courses-section-02 .single-course .courses-image .top-meta .price.color-2 { background: #f6b500; } .upstudy-courses-section-02 .single-course .courses-image .top-meta .price.color-3 { background: #d31129; } .upstudy-courses-section-02 .single-course .courses-image .top-meta .price.color-4 { background: #2ab48c; } .upstudy-courses-section-02 .single-course .courses-content .sub-title { font-size: 13px; font-weight: 400; color: #f6520a; } .upstudy-courses-section-02 .single-course .courses-content .title { font-size: 22px; font-weight: 600; color: #1e1e1e; line-height: 30px; margin-top: 0; } .upstudy-courses-section-02 .single-course .courses-content .title:hover a { color: #f6520a; } .upstudy-courses-section-02 .single-course .courses-meta { display: flex; justify-content: space-between; align-items: center; position: relative; margin-top: 25px; padding-top: 15px; } .upstudy-courses-section-02 .single-course .courses-meta::before { position: absolute; content: ""; height: 1px; width: 100%; top: 0; left: 0; background: #ebebeb; } .upstudy-courses-section-02 .single-course .courses-meta .course-enroll-rating p { color: #6e6e6e; font-size: 13px; margin-right: 20px; } .upstudy-courses-section-02 .single-course .courses-meta .course-enroll-rating p i { color: #f6520a; font-size: 16px; margin-right: 2px; } .upstudy-courses-section-02 .single-course .courses-meta .course-enroll-rating .total-rating i { color: #ffa300; } .upstudy-courses-section-02 .single-course:hover .courses-image a::before { opacity: 0.2; } /*-- /* 07 - Counter CSS /*----------------------------------------*/ .upstudy-counter-section { background-repeat: no-repeat; background-position: center center; background-size: cover; padding-top: 150px; padding-bottom: 170px; overflow: hidden; position: relative; z-index: 1; } .upstudy-counter-section .shape-1 { position: absolute; right: -80px; bottom: 20px; z-index: -1; } .upstudy-counter-section .shape-2 { position: absolute; left: 60px; top: 110px; z-index: -1; } .upstudy-counter-section .shape-3 { position: absolute; left: 40px; bottom: 20px; -webkit-animation: zoom-inout 3s infinite; animation: zoom-inout 3s infinite; z-index: -1; } .upstudy-counter-section .counter-wrap { margin-top: -40px; } @media only screen and (max-width: 1199px) { .upstudy-counter-section { padding-top: 120px; padding-bottom: 140px; } .upstudy-counter-section .shape-1 { right: -180px; } .upstudy-counter-section .shape-1 img { width: 270px; } .upstudy-counter-section .shape-2 { left: 40px; top: 65px; } } @media only screen and (max-width: 991px) { .upstudy-counter-section .shape-1 { right: -150px; bottom: 40px; } .upstudy-counter-section .shape-1 img { width: 230px; } } @media only screen and (max-width: 767px) { .upstudy-counter-section { padding-bottom: 130px; } } .single-counter { margin-top: 30px; } .single-counter .counter-content { margin-top: 20px; } .single-counter .counter-content .title { font-size: 48px; line-height: 1; font-weight: 500; color: #ffffff; } @media only screen and (max-width: 767px) { .single-counter .counter-content .title { font-size: 42px; } } .single-counter .counter-content p { font-size: 16px; line-height: 30px; color: #ffffff; } .upstudy-counter-wrap { max-width: 940px; margin: 0 auto; padding-top: 60px; } .upstudy-counter-wrap .counter-item { margin-top: 30px; padding-left: 60px; } .upstudy-counter-wrap .counter-item .counter-content { margin-top: 25px; } .upstudy-counter-wrap .counter-item .counter-content .title { font-size: 48px; line-height: 1; font-weight: 500; color: #2f2a55; } .upstudy-counter-wrap .counter-item .counter-content p { font-size: 16px; line-height: 30px; color: #7a7a7a; } @media only screen and (max-width: 991px) { .upstudy-counter-wrap .counter-item { padding-left: 0px; } } @media only screen and (max-width: 767px) { .upstudy-counter-wrap { text-align: center; } } @media only screen and (max-width: 449px) { .upstudy-counter-wrap { padding-top: 45px; } .upstudy-counter-wrap .counter-item .counter-content .title { font-size: 42px; } } .upstudy-counter-section-02 .counter-wrap { background: #fdf8f4; border-radius: 20px; position: relative; padding: 90px 105px 115px 70px; z-index: 1; } .upstudy-counter-section-02 .counter-wrap .shape-1 { width: 68px; height: 68px; border: 5px solid #fbecb8; border-radius: 50%; position: absolute; top: 6%; left: 6%; -webkit-animation: zoom-inout 3s infinite; animation: zoom-inout 3s infinite; z-index: -1; } .upstudy-counter-section-02 .counter-wrap .shape-2 { position: absolute; right: 5%; top: 12%; z-index: -1; } .upstudy-counter-section-02 .counter-left { padding-top: 80px; } .upstudy-counter-section-02 .counter-left .title { font-size: 42px; line-height: 60px; font-weight: 600; } .upstudy-counter-section-02 .counter-left .read-more { font-size: 16px; font-weight: 700; color: #1cb098; margin-top: 35px; } .upstudy-counter-section-02 .counter-left .read-more i { position: relative; top: 1px; left: 5px; } .upstudy-counter-section-02 .counter-left .read-more:hover { color: #111a24; } .upstudy-counter-section-02 .counter-right { margin-top: -25px; padding-left: 15px; } .upstudy-counter-section-02 .counter-right .counter-item-wrap.counter-item-wrap-02 { padding-top: 50px; } .upstudy-counter-section-02 .counter-right .counter-item-wrap .single-counter { background: #ffffff; padding: 40px 65px 50px; border-radius: 20px; margin-top: 25px; } .upstudy-counter-section-02 .counter-right .counter-item-wrap .single-counter .counter-icon img { height: 35px; transition: all 0.3s linear; } .upstudy-counter-section-02 .counter-right .counter-item-wrap .single-counter .counter-content { margin-top: 20px; } .upstudy-counter-section-02 .counter-right .counter-item-wrap .single-counter .counter-content .title { color: #2f2a55; } .upstudy-counter-section-02 .counter-right .counter-item-wrap .single-counter .counter-content p { color: #2f2a55; } .upstudy-counter-section-02 .counter-right .counter-item-wrap .single-counter:hover .counter-icon img { transform: rotateY(180deg); } @media only screen and (max-width: 1199px) { .upstudy-counter-section-02 .counter-wrap .shape-1 { top: 5%; } .upstudy-counter-section-02 .counter-wrap .shape-2 { top: 35%; } .upstudy-counter-section-02 .counter-left { padding-top: 0px; } .upstudy-counter-section-02 .counter-right { margin-top: 0px; padding-left: 0px; padding-top: 25px; } } @media only screen and (max-width: 991px) { .upstudy-counter-section-02 .counter-wrap { padding: 80px 60px 90px 60px; } .upstudy-counter-section-02 .counter-left { padding-top: 0px; } .upstudy-counter-section-02 .counter-right .counter-item-wrap .single-counter { padding: 40px 40px 50px; } } @media only screen and (max-width: 767px) { .upstudy-counter-section-02 .counter-left .title { font-size: 36px; line-height: 55px; } .upstudy-counter-section-02 .counter-right .counter-item-wrap.counter-item-wrap-02 { padding-top: 0px; } } @media only screen and (max-width: 449px) { .upstudy-counter-section-02 .counter-wrap { padding: 80px 35px 80px 35px; } .upstudy-counter-section-02 .counter-left .title { font-size: 30px; line-height: 48px; } .upstudy-counter-section-02 .counter-right .counter-item-wrap .single-counter { padding: 40px 30px 50px; } } .upstudy-counter-section-03 { position: relative; overflow: hidden; padding-top: 195px; padding-bottom: 120px; background: #eff5ff; z-index: 1; } .upstudy-counter-section-03 .shape-1 { position: absolute; width: 100%; height: 100px; right: 0; left: 0px; top: 0; background: #ffffff; transform: skewY(-3deg); transform-origin: 0; z-index: 2; } .upstudy-counter-section-03 .shape-2 { border: 1px solid #b4e4fb; border-radius: 50%; width: 1090px; height: 1090px; position: absolute; z-index: -1; left: -455px; top: -490px; z-index: -1; } .upstudy-counter-section-03 .shape-2::before { position: absolute; content: ''; width: 100%; height: 100%; border: 1px solid #b4e4fb; border-radius: 50%; transform: scale(0.84); z-index: -1; } .upstudy-counter-section-03 .shape-3 { width: 68px; height: 68px; border: 5px solid #f8db5e; border-radius: 50%; position: absolute; left: 150px; top: 160px; z-index: -1; -webkit-animation: zoom-inout 3s infinite; animation: zoom-inout 3s infinite; } .upstudy-counter-section-03 .shape-4 { position: absolute; right: 150px; top: 170px; z-index: -1; } .upstudy-counter-section-03 .single-counter .counter-content .title { color: #2f2a55; } .upstudy-counter-section-03 .single-counter .counter-content p { color: #7a7a7a; } @media only screen and (max-width: 1199px) { .upstudy-counter-section-03 { padding-top: 170px; padding-bottom: 100px; } .upstudy-counter-section-03 .shape-1 { top: -45px; } .upstudy-counter-section-03 .shape-2 { width: 950px; height: 950px; top: -410px; } .upstudy-counter-section-03 .shape-3 { left: 45px; top: 100px; } .upstudy-counter-section-03 .shape-4 { right: 20px; top: 60px; } } @media only screen and (max-width: 767px) { .upstudy-counter-section-03 { padding-bottom: 80px; } .upstudy-counter-section-03 .shape-2 { width: 850px; height: 850px; } } @media only screen and (max-width: 575px) { .upstudy-counter-section-03 .shape-4 { top: 290px; } } @media only screen and (max-width: 449px) { .upstudy-counter-section-03 .shape-2 { width: 760px; height: 760px; } } .upstudy-counter-section-04 { background: #fdf8f4; overflow: hidden; } .upstudy-counter-section-04 .counter-wrap { position: relative; z-index: 1; } .upstudy-counter-section-04 .counter-wrap .shape-1 { width: 68px; height: 68px; border: 5px solid #fbecb8; border-radius: 50%; position: absolute; top: 0; left: -5%; z-index: -1; -webkit-animation: zoom-inout 3s infinite; animation: zoom-inout 3s infinite; } .upstudy-counter-section-04 .counter-wrap .shape-2 { position: absolute; right: -6%; top: 10%; z-index: -1; } .upstudy-counter-section-04 .counter-content-wrap { padding-top: 45px; } .upstudy-counter-section-04 .single-counter { background: #ffffff; padding: 40px 65px 50px; border-radius: 20px; margin-top: 25px; } .upstudy-counter-section-04 .single-counter .counter-icon img { height: 35px; transition: all 0.3s linear; } .upstudy-counter-section-04 .single-counter .counter-content { margin-top: 20px; } .upstudy-counter-section-04 .single-counter .counter-content .title { color: #2f2a55; } .upstudy-counter-section-04 .single-counter .counter-content p { color: #2f2a55; } .upstudy-counter-section-04 .single-counter:hover .counter-icon img { transform: rotateY(180deg); } @media only screen and (max-width: 1199px) { .upstudy-counter-section-04 .single-counter { padding: 40px 25px 50px; } } /*-- /* 08 - Brand CSS /*----------------------------------------*/ .upstudy-brand-section .brand-title-wrap { padding-right: 100px; } .upstudy-brand-section .brand-title-wrap .title { font-size: 42px; line-height: 52px; font-weight: 600; color: #2f2a55; } .upstudy-brand-section .brand-title-wrap .btn { height: 55px; line-height: 53px; padding: 0 65px; margin-top: 55px; } .upstudy-brand-section .brand-content-wrap { position: relative; } .upstudy-brand-section .brand-content-wrap::before { content: ""; background: #ebebeb; width: 100%; margin: auto; height: 1px; position: absolute; left: 0; right: 0; top: 50%; } .upstudy-brand-section .brand-content-wrap .upstudy-brand-box { border-right: 1px solid #ebebeb; } .upstudy-brand-section .brand-content-wrap .upstudy-brand-box.brand-box-03 { border-right: 0; } .upstudy-brand-section .brand-content-wrap .upstudy-brand-box .single-brand { text-align: center; height: 130px; line-height: 120px; } @media only screen and (max-width: 1199px) { .upstudy-brand-section .brand-title-wrap { padding-right: 20px; } } @media only screen and (max-width: 991px) { .upstudy-brand-section .brand-title-wrap { padding-right: 0px; padding-bottom: 60px; } } @media only screen and (max-width: 575px) { .upstudy-brand-section .brand-title-wrap { padding-bottom: 20px; } .upstudy-brand-section .brand-content-wrap::before { display: none; } .upstudy-brand-section .brand-content-wrap .upstudy-brand-box { border-right: 0; } .upstudy-brand-section .brand-content-wrap .upstudy-brand-box .single-brand { height: inherit; line-height: inherit; margin-top: 40px; } } @media only screen and (max-width: 449px) { .upstudy-brand-section .brand-title-wrap .title { font-size: 34px; line-height: 45px; } .upstudy-brand-section .brand-title-wrap .btn { padding: 0 55px; margin-top: 45px; } } .upstudy-brand-section-02 .brand-wrap { border-top: 1px solid #ebebeb; padding-top: 95px; padding-bottom: 95px; } /*-- /* 10 - Blog CSS /*----------------------------------------*/ .upstudy-blog-section .blog-wrap { margin-top: -30px; } .upstudy-blog-section .section-title .title span::before { bottom: -15px; background-image: url(../images/shape/text-shape3.png); } .blog-content-wrap { padding-top: 40px; } .single-blog { margin-top: 30px; } .single-blog .blog-img { border-radius: 10px; overflow: hidden; } .single-blog .blog-content { padding-top: 35px; padding-left: 45px; padding-right: 45px; } @media only screen and (max-width: 1199px) { .single-blog .blog-content { padding-left: 0; padding-right: 0; } } .single-blog .blog-content .blog-meta span { font-size: 13px; font-weight: 400; color: #9a9a9a; margin-right: 20px; } .single-blog .blog-content .blog-meta span i { margin-right: 3px; } .single-blog .blog-content .title { font-size: 24px; line-height: 36px; font-weight: 600; color: #2f2a55; } @media only screen and (max-width: 767px) { .single-blog .blog-content .title { font-size: 20px; line-height: 32px; } } .single-blog .blog-content .blog-btn { font-size: 12px; font-weight: 700; text-transform: uppercase; color: #1cb098; position: relative; margin-top: 10px; } .single-blog .blog-content .blog-btn::before { position: absolute; left: 0; bottom: 1px; height: 1px; width: 100%; content: ""; transform: scale(1); background: #1cb098; transition: all 0.3s linear; } .single-blog .blog-content .blog-btn:hover::before { transform: scale(-1); } .single-blog:hover .blog-img a img { transform: scale(1.05); } .upstudy-blog-section-02 .single-blog .blog-content .title { color: #12283b; } .upstudy-blog-section-02 .single-blog .blog-content .title:hover a { color: #ff5562; } .upstudy-blog-section-02 .single-blog .blog-content .blog-btn { color: #ff5562; } .upstudy-blog-section-02 .single-blog .blog-content .blog-btn::before { background: #ff5562; } .upstudy-blog-section-02 .single-blog .blog-content .blog-btn:hover { color: #f8db5e; } .upstudy-blog-section-02 .single-blog .blog-content .blog-btn:hover::before { background: #f8db5e; transform: scale(-1); } .upstudy-blog-section-02 .single-blog:hover .blog-img a img { transform: scale(1.1); } .upstudy-blog-section-03 .blog-content-wrap { padding-top: 30px; } .single-blog-02 { background: #fff9eb; border-radius: 10px; overflow: hidden; margin-top: 30px; } .single-blog-02 .blog-img { overflow: hidden; } .single-blog-02 .blog-img a { display: block; } .single-blog-02 .blog-img a img { transition: all 0.3s linear; } .single-blog-02 .blog-content { padding: 0 30px 50px; margin-top: -15px; } .single-blog-02 .blog-content .meta .date { height: 30px; width: 130px; line-height: 30px; background: #f6520a; border-radius: 35px; font-size: 14px; font-weight: 500; color: #ffffff; position: relative; z-index: 1; padding: 0 25px; margin-bottom: 20px; } .single-blog-02 .blog-content .meta .blog-meta { font-size: 14px; font-weight: 600; color: #f6520a; position: relative; margin-right: 25px; } .single-blog-02 .blog-content .meta .blog-meta::before { content: ""; width: 3px; height: 3px; border-radius: 50%; background: #f6520a; position: absolute; left: -14px; top: 8px; } .single-blog-02 .blog-content .meta .blog-meta.blog-meta-1 { color: #6e6e6e; } .single-blog-02 .blog-content .meta .blog-meta.blog-meta-1::before { display: none; } .single-blog-02 .blog-content .title { font-size: 24px; line-height: 36px; font-weight: 600; color: #1e1e1e; margin-top: 5px; } .single-blog-02 .blog-content .title:hover a { color: #f6520a; } .single-blog-02 .blog-content .text { font-size: 16px; line-height: 30px; color: #666666; margin-top: 10px; } .single-blog-02:hover .blog-img a img { transform: scale(1.05); } .single-blog-03 { margin-top: 40px; } .single-blog-03 .blog-img { overflow: hidden; position: relative; } .single-blog-03 .blog-img a { display: block; } .single-blog-03 .blog-img .top-meta { position: absolute; top: 25px; left: 30px; } .single-blog-03 .blog-img .top-meta .tag { font-size: 14px; font-weight: 700; border-radius: 3px; text-transform: uppercase; padding: 0 25px; height: 30px; line-height: 30px; display: inline-block; color: #ffffff; background: #dc3545; white-space: nowrap; } .single-blog-03 .blog-content { padding-top: 10px; padding-right: 45px; } @media only screen and (max-width: 1199px) { .single-blog-03 .blog-content { padding-right: 0; } } .single-blog-03 .blog-content .blog-meta span { font-size: 13px; font-weight: 400; color: #9a9a9a; margin-right: 20px; } .single-blog-03 .blog-content .blog-meta span i { color: #000000; margin-right: 3px; } .single-blog-03 .blog-content .title { font-size: 22px; line-height: 32px; font-family: "Nanum Myeongjo", serif; font-weight: 800; color: #000000; margin-top: 5px; } @media only screen and (max-width: 767px) { .single-blog-03 .blog-content .title { font-size: 20px; line-height: 32px; } } .single-blog-03 .blog-content .title:hover a { color: #dc3545; } .single-blog-03:hover .blog-img a img { transform: scale(1.05); } .upstudy-blog-event-section .section-title .title { font-family: "Nanum Myeongjo", serif; font-weight: 800; color: #000000; } .upstudy-blog-event-section .blog-event-content-wrap { padding-top: 15px; } .event-item { padding: 0 5px; position: relative; margin-top: 40px; } @media only screen and (max-width: 991px) { .event-item { padding: 0 0; } } .event-item::before { content: ""; position: absolute; left: 0; top: 0; background: #ebebeb; width: 1px; height: 100%; transform: translateX(-10px); } @media only screen and (max-width: 991px) { .event-item::before { display: none; } } .event-item::after { content: ""; position: absolute; right: 0; top: 0; background: #ebebeb; width: 1px; height: 100%; transform: translateX(10px); } @media only screen and (max-width: 991px) { .event-item::after { display: none; } } .event-item .event-img { overflow: hidden; position: relative; } .event-item .event-img a { display: block; } .event-item .event-img .top-meta { position: absolute; top: 25px; left: 30px; } .event-item .event-img .top-meta .tag { font-size: 14px; font-weight: 700; border-radius: 3px; text-transform: uppercase; padding: 0 25px; height: 30px; line-height: 30px; display: inline-block; color: #ffffff; background: #dc3545; white-space: nowrap; } .event-item .event-content { margin-top: 25px; padding: 0 140px; } @media only screen and (max-width: 1199px) { .event-item .event-content { padding: 0 0; } } .event-item .event-content .meta { font-size: 14px; font-weight: 400; color: #9a9a9a; margin-right: 20px; } .event-item .event-content .meta i { color: #000000; margin-right: 3px; } .event-item .event-content .title { font-size: 24px; line-height: 36px; font-family: "Nanum Myeongjo", serif; font-weight: 800; color: #000000; margin-top: 5px; margin-bottom: 5px; } @media only screen and (max-width: 767px) { .event-item .event-content .title { font-size: 20px; line-height: 32px; } } .event-item .event-content .title:hover a { color: #dc3545; } .event-item .event-content .btn { height: 45px; line-height: 42px; border: 1px solid #ebebeb; border-radius: 4px; background: transparent; padding: 0 80px; color: #dc3545; margin-top: 30px; } .event-item .event-content .btn:hover { background: #dc3545; border: 1px solid #dc3545; color: #ffffff; } .event-item:hover .event-img a img { transform: scale(1.05); } /*-- /* 11 - CTA CSS /*----------------------------------------*/ .upstudy-cta-section { background: #eff5ff; background-repeat: no-repeat; background-position: center center; background-size: cover; padding-bottom: 90px; } .upstudy-cta-section .cta-image { position: relative; z-index: 1; } .upstudy-cta-section .cta-image .shape-1 { position: absolute; right: 50px; top: -55px; z-index: -1; } .upstudy-cta-section .cta-image .shape-2 { position: absolute; right: 0px; top: 80px; z-index: -1; } .upstudy-cta-section .cta-content { padding: 0 40px; } .upstudy-cta-section .cta-content .btn { padding: 0 60px; margin-top: 50px; } @media only screen and (max-width: 1199px) { .upstudy-cta-section .cta-image .shape-2 { right: -25px; top: 100px; } } .upstudy-cta-section-02 { background: #ff5562; padding-top: 110px; padding-bottom: 170px; overflow: hidden; position: relative; z-index: 1; } .upstudy-cta-section-02 .svg-shape { position: absolute; bottom: -8px; left: 0; width: 100%; } .upstudy-cta-section-02 .shape-1 { position: absolute; left: 85px; top: 65px; z-index: -1; } .upstudy-cta-section-02 .shape-2 { position: absolute; top: 50px; right: 85px; z-index: -1; } .upstudy-cta-section-02 .cta-content .title { font-size: 60px; line-height: 70px; font-weight: 600; color: #ffffff; } .upstudy-cta-section-02 .cta-content p { font-size: 24px; line-height: 30px; color: #ffffff; } .upstudy-cta-section-02 .cta-btn .btn { height: 55px; line-height: 53px; border-radius: 35px; background: #ffffff; padding: 0 45px; color: #12283b; } .upstudy-cta-section-02 .cta-btn .btn:hover { background: #f8db5e; color: #ffffff; } @media only screen and (max-width: 1199px) { .upstudy-cta-section-02 { padding-top: 90px; padding-bottom: 150px; } .upstudy-cta-section-02 .cta-content .title { font-size: 48px; line-height: 60px; } .upstudy-cta-section-02 .cta-btn { margin-top: 40px; } } @media only screen and (max-width: 767px) { .upstudy-cta-section-02 { padding-top: 70px; padding-bottom: 130px; } .upstudy-cta-section-02 .cta-content .title { font-size: 36px; line-height: 48px; } .upstudy-cta-section-02 .cta-content p { font-size: 18px; } } .upstudy-cta-section-03 .cta-wrap { background: #ffa300; border-radius: 30px; height: 450px; overflow: hidden; position: relative; z-index: 1; padding: 25px 80px 0; } .upstudy-cta-section-03 .cta-wrap .shape-2 { width: 315px; height: 315px; border: 50px solid #ffb533; border-radius: 50%; position: absolute; top: -23%; right: -5%; z-index: -1; } .upstudy-cta-section-03 .cta-image { position: relative; z-index: 1; } .upstudy-cta-section-03 .cta-image .shape-1 { position: absolute; left: 0; top: 35px; z-index: -1; } .upstudy-cta-section-03 .cta-image .image { text-align: center; } .upstudy-cta-section-03 .cta-content { padding-top: 60px; } .upstudy-cta-section-03 .cta-content .price { font-size: 48px; line-height: 1; font-weight: 600; color: #f6520a; } .upstudy-cta-section-03 .cta-content .price span { font-size: 24px; } .upstudy-cta-section-03 .cta-content .title { font-size: 36px; line-height: 48px; font-weight: 600; color: #ffffff; margin-top: 20px; } .upstudy-cta-section-03 .cta-content .btn { padding: 0 35px; border-radius: 35px; background: #ffffff; color: #f6520a; margin-top: 45px; } .upstudy-cta-section-03 .cta-content .btn:hover { background: #f6520a; color: #ffffff; } @media only screen and (max-width: 991px) { .upstudy-cta-section-03 .cta-wrap { height: auto; padding: 40px 80px 60px; } .upstudy-cta-section-03 .cta-wrap .shape-2 { top: 17%; } } @media only screen and (max-width: 767px) { .upstudy-cta-section-03 .cta-wrap { height: auto; padding: 40px 60px 60px; } .upstudy-cta-section-03 .cta-wrap .shape-2 { top: -17%; right: -22%; } .upstudy-cta-section-03 .cta-content .price { font-size: 45px; } .upstudy-cta-section-03 .cta-content .title { font-size: 32px; line-height: 44px; } } @media only screen and (max-width: 449px) { .upstudy-cta-section-03 .cta-wrap { height: auto; padding: 40px 30px 60px; } } /*-- /* 09 - Testimonial CSS /*----------------------------------------*/ .upstudy-testimonial-section .testimonial-wrap { height: 535px; background-repeat: no-repeat; background-size: cover; background-position: center center; border-radius: 5px; padding-top: 70px; position: relative; display: flex; flex-wrap: wrap; z-index: 1; } @media only screen and (max-width: 991px) { .upstudy-testimonial-section .testimonial-wrap { height: auto; padding-bottom: 70px; } } .upstudy-testimonial-section .testimonial-wrap .shape-1 { position: absolute; right: 65px; top: 70px; -webkit-animation: zoom-inout 3s infinite; animation: zoom-inout 3s infinite; z-index: -1; } @media only screen and (max-width: 991px) { .upstudy-testimonial-section .testimonial-wrap .shape-1 { right: 30px; top: 45px; } } .upstudy-testimonial-section .testimonial-wrap .testimonial-author { width: 50%; text-align: center; position: relative; padding-left: 40px; } @media only screen and (max-width: 991px) { .upstudy-testimonial-section .testimonial-wrap .testimonial-author { width: 100%; margin: 0 auto; padding-left: 0; } } .upstudy-testimonial-section .testimonial-wrap .testimonial-author .testimonial-author-wrap .author-image img { width: 380px; border: 10px solid #ffffff; border-radius: 50%; } @media only screen and (max-width: 1199px) { .upstudy-testimonial-section .testimonial-wrap .testimonial-author .testimonial-author-wrap .author-image img { width: 280px; } } @media only screen and (max-width: 449px) { .upstudy-testimonial-section .testimonial-wrap .testimonial-author .testimonial-author-wrap .author-image img { width: 200px; } } .upstudy-testimonial-section .testimonial-wrap .testimonial-content { width: 50%; padding-left: 105px; } @media only screen and (max-width: 1199px) { .upstudy-testimonial-section .testimonial-wrap .testimonial-content { padding-left: 80px; } } @media only screen and (max-width: 991px) { .upstudy-testimonial-section .testimonial-wrap .testimonial-content { width: 100%; padding-left: 60px; padding-right: 60px; margin-bottom: 30px; } } @media only screen and (max-width: 575px) { .upstudy-testimonial-section .testimonial-wrap .testimonial-content { text-align: center; padding-left: 15px; padding-right: 15px; margin-bottom: 20px; } } .upstudy-testimonial-section .testimonial-wrap .testimonial-content .single-testimonial-content { background: #ffffff; border-radius: 20px; padding: 50px 90px 70px; } @media only screen and (max-width: 1199px) { .upstudy-testimonial-section .testimonial-wrap .testimonial-content .single-testimonial-content { padding: 50px 40px 70px; } } @media only screen and (max-width: 449px) { .upstudy-testimonial-section .testimonial-wrap .testimonial-content .single-testimonial-content { padding: 50px 30px 70px; } } .upstudy-testimonial-section .testimonial-wrap .testimonial-content .single-testimonial-content .title { font-size: 36px; line-height: 48px; font-weight: 600; color: #2f2a55; } @media only screen and (max-width: 449px) { .upstudy-testimonial-section .testimonial-wrap .testimonial-content .single-testimonial-content .title { font-size: 30px; line-height: 42px; } } .upstudy-testimonial-section .testimonial-wrap .testimonial-content .single-testimonial-content p { font-size: 22px; font-family: "Outfit", sans-serif; font-weight: 400; line-height: 36px; color: #7a7a7a; margin-top: 25px; } @media only screen and (max-width: 575px) { .upstudy-testimonial-section .testimonial-wrap .testimonial-content .single-testimonial-content p { font-size: 26px; } } @media only screen and (max-width: 449px) { .upstudy-testimonial-section .testimonial-wrap .testimonial-content .single-testimonial-content p { font-size: 24px; } } .upstudy-testimonial-section .testimonial-wrap .testimonial-content .single-testimonial-content .name { font-size: 16px; font-family: "Outfit", sans-serif; font-weight: 600; color: #2f2a55; margin-top: 15px; } .testimonial-content-active .swiper-pagination { position: relative; text-align: center; bottom: 60px; } .testimonial-content-active .swiper-pagination .swiper-pagination-bullet { margin: 0 15px 0 0; } .upstudy-testimonial-section-02 { background: #fdf8f4; padding-top: 460px; position: relative; overflow: hidden; z-index: 1; } @media only screen and (max-width: 1199px) { .upstudy-testimonial-section-02 { padding-top: 430px; } } @media only screen and (max-width: 991px) { .upstudy-testimonial-section-02 { padding-top: 370px; } } @media only screen and (max-width: 767px) { .upstudy-testimonial-section-02 { padding-top: 270px; } } @media only screen and (max-width: 449px) { .upstudy-testimonial-section-02 { padding-top: 170px; } } .upstudy-testimonial-section-02 .shape-1 { width: 68px; height: 68px; border: 5px solid #b9e2d8; border-radius: 50%; position: absolute; left: 9%; top: 31%; -webkit-animation: zoom-inout 3s infinite; animation: zoom-inout 3s infinite; z-index: -1; } @media only screen and (max-width: 1199px) { .upstudy-testimonial-section-02 .shape-1 { top: 40%; } } @media only screen and (max-width: 991px) { .upstudy-testimonial-section-02 .shape-1 { top: 26%; } } .upstudy-testimonial-section-02 .shape-2 { width: 905px; height: 905px; border: 2px dashed #fad69c; border-radius: 50%; position: absolute; bottom: -22%; right: -7%; z-index: -1; } @media only screen and (max-width: 1199px) { .upstudy-testimonial-section-02 .shape-2 { width: 750px; height: 750px; } } @media only screen and (max-width: 991px) { .upstudy-testimonial-section-02 .shape-2 { width: 520px; height: 520px; } } @media only screen and (max-width: 575px) { .upstudy-testimonial-section-02 .shape-2 { width: 420px; height: 420px; } } .upstudy-testimonial-section-02 .testimonial-content-wrap-02 { padding-top: 70px; } .single-testimonial-02 { background: #ffffff; box-shadow: 0px 5px 20px 0px rgba(0, 0, 0, 0.09); border-radius: 20px; width: 525px; margin: 10px 80px; position: relative; } @media only screen and (max-width: 1199px) { .single-testimonial-02 { margin: 10px auto; } } @media only screen and (max-width: 767px) { .single-testimonial-02 { width: 100%; text-align: center; border-radius: 20px 20px 20px 20px; } } .single-testimonial-02 .testimonial-thumb { position: absolute; left: -15%; top: 50%; transform: translateY(-65%); z-index: 3; } @media only screen and (max-width: 767px) { .single-testimonial-02 .testimonial-thumb { position: relative; text-align: center; left: 0; top: 0; padding-top: 40px; transform: translateY(0%); } } .single-testimonial-02 .testimonial-thumb img { border-radius: 50%; } .single-testimonial-02 .testimonial-content { padding: 30px 130px 60px; padding-right: 40px; } @media only screen and (max-width: 767px) { .single-testimonial-02 .testimonial-content { padding: 15px 45px 50px; } } @media only screen and (max-width: 449px) { .single-testimonial-02 .testimonial-content { padding: 15px 30px 50px; } } .single-testimonial-02 .testimonial-content i { font-size: 48px; color: #1cb098; } .single-testimonial-02 .testimonial-content p { font-size: 22px; line-height: 36px; font-weight: 400; color: #7a7a7a; margin-top: 5px; margin-bottom: 10px; } .single-testimonial-02 .testimonial-content .name { font-size: 16px; font-weight: 600; line-height: 20px; color: #2f2a55; } .testimonial-02-active .swiper-pagination { position: relative; margin-top: 50px; } .testimonial-02-active .swiper-pagination .swiper-pagination-bullet { margin: 0 7px; background-color: #e1e1e1; } .testimonial-02-active .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active { background-color: #1cb098; } .upstudy-testimonial-section-03 .testimonial-wrap { height: 610px; padding-top: 105px; border: 3px dashed #38b0e4; border-radius: 50px; justify-content: end; } .upstudy-testimonial-section-03 .testimonial-wrap .testimonial-content { width: 50%; padding-left: 0px; padding-right: 105px; } @media only screen and (max-width: 1199px) { .upstudy-testimonial-section-03 .testimonial-wrap { height: 550px; padding-top: 80px; } .upstudy-testimonial-section-03 .testimonial-wrap .testimonial-content .single-testimonial-content { padding: 50px 35px 70px; } } @media only screen and (max-width: 991px) { .upstudy-testimonial-section-03 .testimonial-wrap { height: 510px; padding-top: 80px; padding-left: 65px; padding-right: 65px; } .upstudy-testimonial-section-03 .testimonial-wrap .testimonial-content { width: 100%; padding-right: 0; } } @media only screen and (max-width: 575px) { .upstudy-testimonial-section-03 .testimonial-wrap { height: auto; padding-left: 40px; padding-right: 40px; } } @media only screen and (max-width: 449px) { .upstudy-testimonial-section-03 .testimonial-wrap { padding-left: 20px; padding-right: 20px; } } .testimonial-3-active .swiper-pagination { position: relative; bottom: 50px; } .testimonial-3-active .swiper-pagination .swiper-pagination-bullet { margin: 0 7px; background-color: #ededed; } .testimonial-3-active .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active { background-color: #ff5562; } .upstudy-testimonial-section-04 { background: #ffffff; } .upstudy-testimonial-section-04 .testimonial-02-active .swiper-pagination .swiper-pagination-bullet { margin: 0 7px; background-color: #ebebeb; } .upstudy-testimonial-section-04 .testimonial-02-active .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active { background-color: #1cb098; } /*-- /* 12 - Features CSS /*----------------------------------------*/ .features-content-wrap { padding-top: 50px; } .features-item { margin-top: 30px; } .features-item .features-content { margin-top: 20px; padding: 0 30px; } @media only screen and (max-width: 1199px) { .features-item .features-content { padding: 0 0px; } } .features-item .features-content .title { font-size: 24px; line-height: 34px; font-weight: 600; color: #2f2a55; } .features-item .features-content p { font-size: 16px; line-height: 30px; font-weight: 400; color: #7a7a7a; margin-top: 15px; } .upstudy-features-section-02 { background: #1cb098; padding-top: 50px; padding-bottom: 60px; position: relative; overflow: hidden; z-index: -1; } .upstudy-features-section-02 .shape-1 { position: absolute; left: -1%; top: -65%; z-index: -1; } .upstudy-features-section-02 .shape-2 { position: absolute; right: -2%; bottom: -110%; z-index: -1; } .upstudy-features-section-02 .features-wrap { margin-top: -30px; } .features-item-02 { display: flex; align-items: center; margin-top: 30px; } .features-item-02 .features-content { margin-left: 20px; } .features-item-02 .features-content .title { font-size: 22px; line-height: 30px; font-weight: 600; color: #ffffff; } .features-item-02 .features-content p { font-size: 16px; line-height: 30px; font-weight: 400; color: #ffffff; } .upstudy-features-section-03 { position: relative; padding-top: 220px; padding-bottom: 60px; } .upstudy-features-section-03 .shape-1 { position: absolute; left: 0; top: 0; } .upstudy-features-section-03 .features-item-03 { display: flex; align-items: center; margin-top: 30px; } .upstudy-features-section-03 .features-item-03 .features-img img { border-radius: 50%; } .upstudy-features-section-03 .features-item-03 .features-content { margin-left: 30px; padding-right: 40px; } .upstudy-features-section-03 .features-item-03 .features-content .title { font-size: 24px; line-height: 32px; font-weight: 600; color: #12283b; } .upstudy-features-section-03 .features-item-03 .features-content p { font-size: 16px; line-height: 30px; font-weight: 400; color: #7a7a7a; } @media only screen and (max-width: 1199px) { .upstudy-features-section-03 { padding-top: 140px; } } @media only screen and (max-width: 991px) { .upstudy-features-section-03 { padding-top: 100px; } .upstudy-features-section-03 .features-item-03 .features-content { margin-left: 18px; padding-right: 0px; } } @media only screen and (max-width: 767px) { .upstudy-features-section-03 { padding-top: 80px; } } .upstudy-features-section-04 .features-wrap { background: #fff9eb; padding-bottom: 70px; padding-left: 50px; padding-right: 50px; border-radius: 50px; position: relative; } .upstudy-features-section-04 .features-wrap .shape-1 { position: absolute; top: 0; left: 0; transform: translate(6%, -10%); z-index: -1; } .upstudy-features-section-04 .features-wrap .shape-2 { position: absolute; bottom: 0; left: 0; transform: translate(4%, 9%); z-index: -1; } .upstudy-features-section-04 .features-content-wrap { padding-top: 40px; } .upstudy-features-section-04 .features-item .features-content .title { color: #1e1e1e; } .upstudy-features-section-04 .features-item .features-content p { color: #666666; } @media only screen and (max-width: 1199px) { .upstudy-features-section-04 .features-wrap .shape-1 img { width: 810px; } .upstudy-features-section-04 .features-wrap .shape-2 img { width: 810px; } } @media only screen and (max-width: 991px) { .upstudy-features-section-04 .features-wrap .shape-1 img { width: 650px; } .upstudy-features-section-04 .features-wrap .shape-2 img { width: 650px; } } @media only screen and (max-width: 767px) { .upstudy-features-section-04 .features-wrap .shape-1 img { width: 480px; } .upstudy-features-section-04 .features-wrap .shape-2 img { width: 480px; } } @media only screen and (max-width: 575px) { .upstudy-features-section-04 .features-wrap .shape-1 img { width: 370px; } .upstudy-features-section-04 .features-wrap .shape-2 img { width: 370px; } } @media only screen and (max-width: 449px) { .upstudy-features-section-04 .features-wrap { padding-left: 25px; padding-right: 25px; } .upstudy-features-section-04 .features-wrap .shape-1 img { width: 275px; } .upstudy-features-section-04 .features-wrap .shape-2 img { width: 275px; } } /*-- /* 13 - About CSS /*----------------------------------------*/ .upstudy-about-section .about-content { padding-left: 100px; padding-top: 30px; } .upstudy-about-section .about-content .title { font-size: 42px; line-height: 52px; font-weight: 600; color: #2f2a55; padding-right: 60px; } .upstudy-about-section .about-content .title span { color: #1cb098; } .upstudy-about-section .about-content .text { font-size: 16px; line-height: 30px; color: #7a7a7a; margin-top: 25px; } .upstudy-about-section .about-content .about-list { display: flex; padding-top: 15px; } .upstudy-about-section .about-content .about-list .list-item { margin-top: 15px; } .upstudy-about-section .about-content .about-list .list-item:last-child { padding-left: 30px; } .upstudy-about-section .about-content .about-list .list-item .title { font-size: 18px; line-height: 24px; font-weight: 600; color: #2f2a55; padding-right: 100px; } .upstudy-about-section .about-content .about-list .list-item p { font-size: 16px; line-height: 30px; color: #7a7a7a; margin-top: 5px; } .upstudy-about-section .about-img { position: relative; z-index: 1; } .upstudy-about-section .about-img .shape-1 { position: absolute; left: 33%; top: -3%; z-index: -1; } @media only screen and (max-width: 1199px) { .upstudy-about-section .about-content { padding-left: 40px; } .upstudy-about-section .about-content .title { padding-right: 0px; } .upstudy-about-section .about-content .about-list .list-item .title { padding-right: 20px; } .upstudy-about-section .about-img .shape-1 { top: -12%; } } @media only screen and (max-width: 991px) { .upstudy-about-section .about-content { padding-left: 0px; padding-top: 40px; } .upstudy-about-section .about-content .about-list .list-item .title { padding-right: 0px; } .upstudy-about-section .about-img .shape-1 { top: -0%; } } @media only screen and (max-width: 767px) { .upstudy-about-section .about-content { padding-top: 40px; } .upstudy-about-section .about-content .title { font-size: 36px; line-height: 46px; } .upstudy-about-section .about-img .shape-1 { height: 410px; } } @media only screen and (max-width: 575px) { .upstudy-about-section .about-content .title { font-size: 30px; line-height: 40px; } .upstudy-about-section .about-img .shape-1 { height: 380px; } } @media only screen and (max-width: 449px) { .upstudy-about-section .about-content .about-list { flex-direction: column; gap: 10px; } .upstudy-about-section .about-content .about-list .list-item:last-child { padding-left: 0px; } .upstudy-about-section .about-img .shape-1 { top: -7%; height: 300px; } } .upstudy-about-section-02 .about-img { position: relative; z-index: 1; } .upstudy-about-section-02 .about-img .shape-1 { position: absolute; left: 85px; top: 85px; z-index: -1; } .upstudy-about-section-02 .about-img .image { margin-top: -70px; } .upstudy-about-section-02 .about-content .text { font-size: 18px; line-height: 36px; color: #7a7a7a; margin-top: 45px; } .upstudy-about-section-02 .about-content .about-list { padding-top: 30px; } .upstudy-about-section-02 .about-content .about-list ul li { display: flex; align-items: flex-start; font-size: 20px; line-height: 30px; font-family: "Outfit", sans-serif; font-weight: 500; color: #12283b; } .upstudy-about-section-02 .about-content .about-list ul li .about-icon { color: #ff5562; margin-right: 20px; } .upstudy-about-section-02 .about-content .about-list ul li + li { margin-top: 15px; } @media only screen and (max-width: 1199px) { .upstudy-about-section-02 { padding-bottom: 100px; } .upstudy-about-section-02 .about-img .shape-1 { left: 40px; top: 40px; width: 360px; } .upstudy-about-section-02 .about-img .image { margin-top: 0px; } } @media only screen and (max-width: 991px) { .upstudy-about-section-02 { padding-bottom: 80px; } .upstudy-about-section-02 .about-img { margin-top: 50px; } .upstudy-about-section-02 .about-img .shape-1 { width: inherit; } } @media only screen and (max-width: 767px) { .upstudy-about-section-02 .about-img .shape-1 { width: 410px; } } @media only screen and (max-width: 575px) { .upstudy-about-section-02 .about-img .shape-1 { width: 350px; } } @media only screen and (max-width: 449px) { .upstudy-about-section-02 .about-img .shape-1 { width: 250px; left: 30px; top: 30px; } } .upstudy-about-section-03 { overflow: hidden; } .upstudy-about-section-03 .about-img-wrap { position: relative; z-index: 1; } .upstudy-about-section-03 .about-img-wrap .about-shape { position: absolute; right: 23%; top: -5%; z-index: -1; -webkit-animation: zoom-inout 3s infinite; animation: zoom-inout 3s infinite; } .upstudy-about-section-03 .about-img-wrap .about-img-big img { border-radius: 50px; } .upstudy-about-section-03 .about-img-wrap .about-img-sm { padding-left: 110px; margin-top: 30px; } .upstudy-about-section-03 .about-img-wrap .about-img-sm img { border-radius: 50px; } .upstudy-about-section-03 .about-img-wrap .about-img-bottom { position: absolute; right: 5px; bottom: 30px; } .upstudy-about-section-03 .about-img-wrap .about-img-bottom img { border-radius: 50px; } .upstudy-about-section-03 .about-img-wrap .about-text-shape { position: absolute; right: 50px; top: 50px; } .upstudy-about-section-03 .about-content { padding-left: 110px; padding-right: 35px; padding-top: 25px; } .upstudy-about-section-03 .about-content .section-title-3 .sub-title::before { content: ""; position: absolute; left: 0; bottom: -15px; background: #f6520a; width: 110px; height: 2px; transform: translateX(0); } .upstudy-about-section-03 .about-content .text { font-size: 16px; line-height: 30px; color: #525252; margin-top: 30px; } .upstudy-about-section-03 .about-content .about-list { padding-top: 25px; } .upstudy-about-section-03 .about-content .about-list ul li { display: flex; align-items: flex-start; font-size: 16px; line-height: 24px; font-weight: 600; color: #1e1e1e; } .upstudy-about-section-03 .about-content .about-list ul li + li { margin-top: 10px; } .upstudy-about-section-03 .about-content .about-list ul li .about-icon { font-size: 14px; color: #f6520a; margin-right: 8px; } .upstudy-about-section-03 .about-content .btn { padding: 0 50px; border-radius: 35px; background: #f6520a; margin-top: 50px; } .upstudy-about-section-03 .about-content .btn:hover { background: #ffa300; } @media only screen and (max-width: 1199px) { .upstudy-about-section-03 .about-img-wrap .about-shape { right: 8%; } .upstudy-about-section-03 .about-img-wrap .about-img-sm { padding-left: 0px; } .upstudy-about-section-03 .about-img-wrap .about-text-shape { right: 0px; } .upstudy-about-section-03 .about-content { padding-left: 50px; padding-right: 0px; } } @media only screen and (max-width: 991px) { .upstudy-about-section-03 .about-img-wrap .about-shape { right: 37%; top: -4%; } .upstudy-about-section-03 .about-img-wrap .about-img-bottom { right: 160px; } .upstudy-about-section-03 .about-img-wrap .about-text-shape { right: 120px; } .upstudy-about-section-03 .about-content { padding-left: 0px; margin-top: 40px; } } @media only screen and (max-width: 767px) { .upstudy-about-section-03 .about-img-wrap .about-shape { right: 17%; top: -3%; } .upstudy-about-section-03 .about-img-wrap .about-img-bottom { right: 0px; } .upstudy-about-section-03 .about-img-wrap .about-text-shape { right: 0px; } } @media only screen and (max-width: 449px) { .upstudy-about-section-03 .about-img-wrap .about-img-sm { display: none; } .upstudy-about-section-03 .about-img-wrap .about-img-bottom { position: relative; text-align: center; bottom: 0; margin-top: 30px; } .upstudy-about-section-03 .about-img-wrap .about-text-shape { top: 135px; } } .upstudy-about-section-04 { padding-bottom: 110px; } .upstudy-about-section-04 .about-content { padding-right: 110px; } .upstudy-about-section-04 .about-content .title { font-size: 42px; line-height: 52px; font-family: "Nanum Myeongjo", serif; font-weight: 800; color: #2f2a55; padding-right: 85px; } .upstudy-about-section-04 .about-content .text { font-size: 16px; line-height: 30px; color: #7a7a7a; margin-top: 30px; } .upstudy-about-section-04 .about-content .about-list { padding-top: 40px; } .upstudy-about-section-04 .about-content .about-list ul li { display: flex; align-items: flex-start; font-size: 16px; line-height: 24px; font-weight: 400; color: #2f2a55; } .upstudy-about-section-04 .about-content .about-list ul li + li { margin-top: 15px; } .upstudy-about-section-04 .about-content .about-list ul li .about-icon { height: 25px; width: 25px; line-height: 25px; border-radius: 50%; text-align: center; font-size: 12px; background: #eff5ff; color: #dc3545; margin-right: 15px; } .upstudy-about-section-04 .about-img-wrap { display: flex; } .upstudy-about-section-04 .about-img-wrap .about-img-big { position: relative; } .upstudy-about-section-04 .about-img-wrap .about-img-big img { height: 100%; } .upstudy-about-section-04 .about-img-wrap .about-img-big .play-btn { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -55%); } .upstudy-about-section-04 .about-img-wrap .about-img-big .play-btn a { width: 100px; height: 100px; background: #ffffff; display: inline-block; line-height: 100px; text-align: center; font-size: 16px; color: #dc3545; position: relative; border-radius: 50%; } .upstudy-about-section-04 .about-img-wrap .about-img-big .play-btn a::before { content: ""; border: 1px solid #ffffff; position: absolute; z-index: 0; left: 50%; top: 50%; transform: translate(-50%, -50%); display: block; width: 120px; height: 120px; border-radius: 50%; } .upstudy-about-section-04 .about-img-wrap .about-img-big .play-btn a:hover { background: #dc3545; color: #ffffff; } @media only screen and (max-width: 1199px) { .upstudy-about-section-04 .about-content { padding-right: 60px; } .upstudy-about-section-04 .about-content .title { padding-right: 0px; } } @media only screen and (max-width: 991px) { .upstudy-about-section-04 { padding-bottom: 80px; } .upstudy-about-section-04 .about-img-wrap { margin-top: 50px; } } @media only screen and (max-width: 767px) { .upstudy-about-section-04 { padding-bottom: 60px; } .upstudy-about-section-04 .about-content { padding-right: 0px; } .upstudy-about-section-04 .about-content .title { font-size: 35px; line-height: 45px; } } @media only screen and (max-width: 575px) { .upstudy-about-section-04 .about-content .title { font-size: 30px; line-height: 40px; } } @media only screen and (max-width: 449px) { .upstudy-about-section-04 .about-img-wrap { flex-direction: column; } .upstudy-about-section-04 .about-img-wrap .about-img-small { text-align: center; } } .upstudy-about-section-05 .about-img-item .about-img a img { border-radius: 10px; } .upstudy-about-section-05 .about-img-item .about-content { margin-top: 40px; padding-right: 45px; } .upstudy-about-section-05 .about-img-item .about-content .title { font-size: 24px; line-height: 34px; font-weight: 600; color: #2f2a55; } .upstudy-about-section-05 .about-img-item .about-content .title:hover a { color: #dc3545; } .upstudy-about-section-05 .about-img-item .about-content p { font-size: 16px; line-height: 30px; color: #7a7a7a; margin-top: 10px; } .upstudy-about-section-05 .about-link-wrap { border: 1px solid #1d3f6b; border-radius: 10px; padding: 40px 25px 40px 80px; } .upstudy-about-section-05 .about-link-wrap .title { font-size: 30px; line-height: 40px; font-weight: 600; color: #2f2a55; margin-bottom: 25px; } .upstudy-about-section-05 .about-link-wrap .link-list ul li { font-size: 18px; line-height: 30px; font-weight: 500; color: #5a5960; } .upstudy-about-section-05 .about-link-wrap .link-list ul li i { color: #dc3545; position: relative; top: 1px; margin-left: 8px; transition: all 0.3s linear; } .upstudy-about-section-05 .about-link-wrap .link-list ul li + li { border-top: 1px solid #ebebeb; margin-top: 14px; padding-top: 14px; } .upstudy-about-section-05 .about-link-wrap .link-list ul li:hover a { color: #dc3545; } .upstudy-about-section-05 .about-link-wrap .link-list ul li:hover i { margin-left: 15px; } @media only screen and (max-width: 1199px) { .upstudy-about-section-05 .about-link-wrap { padding: 40px 25px 40px 60px; } } @media only screen and (max-width: 991px) { .upstudy-about-section-05 .about-link-wrap { margin-top: 50px; } } @media only screen and (max-width: 767px) { .upstudy-about-section-05 .about-wrap { margin-top: -30px; } .upstudy-about-section-05 .about-img-item { margin-top: 30px; } } .upstudy-about-section-06 .about-img-wrap { position: relative; } .upstudy-about-section-06 .about-img-wrap .shape-1 { position: absolute; right: 25px; top: -35px; } .upstudy-about-section-06 .about-img-wrap .about-img-big { overflow: hidden; } .upstudy-about-section-06 .about-img-wrap .about-img-big img { border-radius: 5px; } .upstudy-about-section-06 .about-img-wrap .about-img-sm { position: absolute; right: 0; bottom: 50px; border: 8px solid #ffffff; border-radius: 5px; } .upstudy-about-section-06 .about-content { padding-left: 100px; padding-top: 30px; } .upstudy-about-section-06 .about-content .about-title { font-size: 42px; line-height: 52px; font-weight: 600; color: #2f2a55; padding-right: 60px; } .upstudy-about-section-06 .about-content .about-title span { color: #1cb098; } .upstudy-about-section-06 .about-content .text { font-size: 16px; line-height: 30px; color: #7a7a7a; margin-top: 25px; } .upstudy-about-section-06 .about-content .about-list { display: flex; padding-top: 10px; border-bottom: 1px solid #ebebeb; padding-bottom: 35px; } .upstudy-about-section-06 .about-content .about-list .list-item { display: flex; align-items: center; margin-top: 20px; } .upstudy-about-section-06 .about-content .about-list .list-item .icon { margin-right: 15px; } .upstudy-about-section-06 .about-content .about-list .list-item .icon img { width: 40px; transition: all 0.3s linear; } .upstudy-about-section-06 .about-content .about-list .list-item .title { flex: 1; font-size: 18px; line-height: 24px; font-weight: 600; color: #2f2a55; padding-right: 45px; } .upstudy-about-section-06 .about-content .about-list .list-item:hover .icon img { transform: rotateY(180deg); } .upstudy-about-section-06 .about-content .read-more { font-size: 16px; font-family: "Outfit", sans-serif; font-weight: 700; color: #1cb098; margin-top: 35px; } .upstudy-about-section-06 .about-content .read-more i { position: relative; top: 1px; left: 5px; } .upstudy-about-section-06 .about-content .read-more:hover { color: #111a24; } @media only screen and (max-width: 1199px) { .upstudy-about-section-06 .about-img-wrap .shape-1 { right: -10px; top: -50px; width: 270px; } .upstudy-about-section-06 .about-img-wrap .about-img-sm { bottom: 0px; } .upstudy-about-section-06 .about-content { padding-left: 45px; } .upstudy-about-section-06 .about-content .about-title { padding-right: 0px; } .upstudy-about-section-06 .about-content .about-list .list-item .title { padding-right: 0px; } } @media only screen and (max-width: 991px) { .upstudy-about-section-06 .about-img-wrap { text-align: center; } .upstudy-about-section-06 .about-img-wrap .shape-1 { right: 0; top: 0; } .upstudy-about-section-06 .about-content { padding-left: 0px; padding-top: 50px; } } @media only screen and (max-width: 767px) { .upstudy-about-section-06 .about-content .about-title { font-size: 36px; line-height: 46px; } } @media only screen and (max-width: 575px) { .upstudy-about-section-06 .about-content .about-title { font-size: 30px; line-height: 40px; } } @media only screen and (max-width: 449px) { .upstudy-about-section-06 .about-img-wrap .shape-1 { display: none; } .upstudy-about-section-06 .about-img-wrap .about-img-sm { position: relative; margin-top: 30px; } } /*-- /* 14 - Video CSS /*----------------------------------------*/ .upstudy-video-section .video-wrap { margin-bottom: -370px; position: relative; z-index: 5; } .upstudy-video-section .video-wrap .shape-1 { position: absolute; top: 15%; left: 5%; z-index: -1; } .upstudy-video-section .video-wrap .shape-2 { width: 225px; position: absolute; top: 17%; right: 7%; z-index: -1; } @media only screen and (max-width: 991px) { .upstudy-video-section .video-wrap { margin-bottom: -275px; } } @media only screen and (max-width: 767px) { .upstudy-video-section .video-wrap { margin-bottom: -200px; } .upstudy-video-section .video-wrap .shape-1 { width: 220px; left: 0%; } .upstudy-video-section .video-wrap .shape-2 { width: 180px; right: 0%; } } @media only screen and (max-width: 449px) { .upstudy-video-section .video-wrap { margin-bottom: -110px; } .upstudy-video-section .video-wrap .shape-1 { display: none; } .upstudy-video-section .video-wrap .shape-2 { display: none; } } .video-img { position: relative; } .video-img .play-btn { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -65%); } .video-img .play-btn a { width: 100px; height: 100px; display: inline-block; line-height: 100px; text-align: center; font-size: 14px; color: #ffffff; background: #1cb098; border-radius: 50%; position: relative; } .video-img .play-btn a::before { content: ""; border: 1px solid #ffffff; position: absolute; z-index: 0; left: 50%; top: 50%; transform: translate(-50%, -50%); display: block; width: 120px; height: 120px; border-radius: 50%; } .video-img .play-btn a:hover { background: #111a24; } @media only screen and (max-width: 767px) { .video-img .play-btn a { width: 80px; height: 80px; line-height: 80px; } .video-img .play-btn a::before { width: 100px; height: 100px; } } .upstudy-video-section-02 .video-wrap .shape-1 { left: 0; } .upstudy-video-section-02 .video-wrap .shape-2 { right: 3%; } /*-- /* 29 - Class CSS /*----------------------------------------*/ .upstudy-class-section { background: #eaf5ff; background-repeat: no-repeat; background-position: center center; padding-top: 240px; overflow: hidden; position: relative; } @media only screen and (max-width: 1199px) { .upstudy-class-section { padding-top: 180px; } } @media only screen and (max-width: 991px) { .upstudy-class-section { padding-top: 140px; } } @media only screen and (max-width: 575px) { .upstudy-class-section { padding-top: 100px; } } .upstudy-class-section .shape-1 { position: absolute; top: 0; left: 0; width: 100%; } .upstudy-class-section .shape-2 { position: absolute; left: 7%; top: 16%; } .class-slider-wrap { margin-top: 60px; } @media only screen and (max-width: 1199px), only screen and (max-width: 991px), only screen and (max-width: 767px) { .class-slider-wrap { margin-top: 50px; } } .class-item { background: #ffffff; border: 2px dashed #f9b40f; padding: 40px 55px; border-radius: 50px; position: relative; z-index: 1; overflow: hidden; transition: all .5s linear; } @media only screen and (max-width: 991px) { .class-item { padding: 30px; } } @media only screen and (max-width: 575px) { .class-item { padding: 25px; } } .class-item .shape-3 { position: absolute; left: -13%; top: 23%; z-index: -1; } .class-item .shape-4 { position: absolute; right: 1%; top: 10%; z-index: -1; } .class-item.color-2 { border: 2px dashed #64c1ea; } .class-item.color-2 .class-image .class-price .price { background: #64c1ea; } .class-item.color-3 { border: 2px dashed #77c721; } .class-item.color-3 .class-image .class-price .price { background: #77c721; } .class-item .class-image { position: relative; overflow: hidden; border-radius: 50px; } .class-item .class-image a { display: block; } .class-item .class-image .class-price { position: absolute; left: 40px; top: 20px; } .class-item .class-image .class-price .price { display: inline-block; width: 55px; height: 55px; line-height: 55px; background: #f9b40f; text-align: center; border-radius: 50%; font-size: 18px; font-weight: 700; color: #ffffff; } .class-item .class-content .title { font-size: 24px; line-height: 34px; font-weight: 700; color: #12283b; margin-top: 25px; } .class-item .class-content .title:hover a { color: #ff4880; } .class-item .class-content p { font-size: 16px; line-height: 30px; padding: 0 10px; color: #7a7a7a; margin-top: 10px; } .class-item .class-content .class-meta { background: #ffe3e5; border-radius: 10px; padding: 15px 20px; margin-top: 35px; } @media only screen and (max-width: 991px) { .class-item .class-content .class-meta { padding: 15px 15px; } } .class-item .class-content .class-meta ul li { display: inline-block; font-size: 14px; line-height: 30px; color: #ff5085; position: relative; } .class-item .class-content .class-meta ul li + li { padding-left: 25px; margin-left: 20px; } @media only screen and (max-width: 991px) { .class-item .class-content .class-meta ul li + li { padding-left: 10px; margin-left: 10px; } } .class-item .class-content .class-meta ul li + li::before { content: ""; position: absolute; left: 0; top: 50%; transform: translateY(-50%); background: #e1e1e1; width: 1px; height: 25px; } .class-item .class-content .class-meta ul li span { font-weight: 600; color: #12283b; } .class-item:hover .class-image img { transform: scale(1.05); } .class-active .swiper-pagination { position: relative; margin-top: 60px; } .class-active .swiper-pagination .swiper-pagination-bullet { background: #ffffff; margin: 0 8px; } .class-active .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active { background-color: #ff5562; } /*-- /* 22 - Team CSS /*----------------------------------------*/ .team-content-wrap { padding-top: 20px; } .single-team { margin-top: 30px; } .single-team .team-img { position: relative; display: inline-block; } .single-team .team-img .shape-1 { position: absolute; right: 0; top: 15px; z-index: 1; } .single-team .team-img a { position: relative; padding: 20px; } .single-team .team-img a::before { content: ""; position: absolute; left: 0; top: 0; border: 2px dashed #fbcb59; border-radius: 50%; width: 100%; height: 100%; } .single-team .team-img a img { border-radius: 50%; } .single-team .team-img.color-2 a::before { border: 2px dashed #3db2e5; } .single-team .team-img.color-3 a::before { border: 2px dashed #83cc34; } .single-team .team-img.color-4 a::before { border: 2px dashed #ff6873; } .single-team .team-content { margin-top: 25px; } .single-team .team-content .name { font-size: 24px; line-height: 1; font-weight: 700; color: #12283b; } .single-team .team-content .name:hover a { color: #ff5562; } .single-team .team-content .designation { font-size: 16px; line-height: 24px; color: #7a7a7a; } .single-team:hover a::before { -webkit-animation: round-1 13s linear infinite; animation: round-1 13s linear infinite; } @-webkit-keyframes round-1 { 0% { transform: rotate(0); } 100% { transform: rotate(360deg); } } @keyframes round-1 { 0% { transform: rotate(0); } 100% { transform: rotate(360deg); } } .upstudy-team-section .our-team-wrap { margin-top: -30px; } .upstudy-team-section .single-team-02 { background: #ffffff; box-shadow: 0px 5px 20px 0px rgba(0, 0, 0, 0.09); border-radius: 10px; padding: 20px 15px 0px; margin-top: 30px; transition: all 0.3s linear; } .upstudy-team-section .single-team-02 .team-img { border-radius: 4px; position: relative; overflow: hidden; z-index: 1; } .upstudy-team-section .single-team-02 .team-img a { display: block; } .upstudy-team-section .single-team-02 .team-img a::before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: linear-gradient(180deg, #FFF0 38%, #00000082 73%); border-radius: 3px; opacity: 0; visibility: hidden; z-index: 1; transition: all 0.3s linear; } .upstudy-team-section .single-team-02 .team-img a img { width: 100%; transition: all 0.3s linear; } .upstudy-team-section .single-team-02 .team-content { position: relative; padding: 15px 20px 30px; z-index: 1; } @media only screen and (max-width: 1199px) { .upstudy-team-section .single-team-02 .team-content { padding: 15px 15px 30px; } } .upstudy-team-section .single-team-02 .team-content .team-social { position: absolute; top: 0; left: 50%; transform: translate(-50%, -40px); text-align: center; opacity: 0; visibility: hidden; transition: all 0.3s linear; } .upstudy-team-section .single-team-02 .team-content .team-social .social li { display: inline-block; } .upstudy-team-section .single-team-02 .team-content .team-social .social li + li { margin-left: 15px; } @media only screen and (max-width: 1399px) { .upstudy-team-section .single-team-02 .team-content .team-social .social li + li { margin-left: 12px; } } .upstudy-team-section .single-team-02 .team-content .team-social .social li a { font-size: 17px; transform: translate3d(0, 0, 0); color: #ffffff; } .upstudy-team-section .single-team-02 .team-content .team-social .social li:hover a { transform: translateY(-5px); color: #1cb098; } .upstudy-team-section .single-team-02 .team-content .name { font-size: 20px; line-height: 24px; } .upstudy-team-section .single-team-02 .team-content .designation { font-size: 14px; line-height: 24px; color: #868686; } .upstudy-team-section .single-team-02:hover .team-img a::before { opacity: 1; visibility: visible; } .upstudy-team-section .single-team-02:hover .team-img a img { transform: scale(1.05); } .upstudy-team-section .single-team-02:hover .team-content .team-social { opacity: 1; visibility: visible; transform: translate(-50%, -60px); } /*-- /* 04 - Language CSS /*----------------------------------------*/ .language-wrapper { margin-top: -50px; position: relative; z-index: 5; } @media only screen and (max-width: 575px) { .language-wrapper { overflow: hidden; } } .language-wrapper .language-item { display: flex; align-items: center; background: #ffffff; box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.21); border-radius: 10px; padding: 20px 35px; margin: 15px 0px; } .language-wrapper .language-item img { transition: all 0.3s linear; border-radius: 50%; } .language-wrapper .language-item .title { font-size: 24px; font-weight: 600; color: #1e1e1e; margin-left: 20px; transition: all 0.3s linear; } .language-wrapper .language-item:hover .title { color: #f6520a; } .language-active .language-arrow { transform: translateY(-25%); color: #1e1e1e; transition: all 0.3s linear; } .language-active .language-arrow.swiper-button-prev { left: -45px; } @media only screen and (max-width: 1199px) { .language-active .language-arrow.swiper-button-prev { left: -30px; } } @media only screen and (max-width: 575px) { .language-active .language-arrow.swiper-button-prev { left: 0px; } } .language-active .language-arrow.swiper-button-prev::after { content: "\f16d"; font-family: flaticon !important; font-size: 35px; } .language-active .language-arrow.swiper-button-next { right: -45px; } @media only screen and (max-width: 1199px) { .language-active .language-arrow.swiper-button-next { right: -30px; } } @media only screen and (max-width: 575px) { .language-active .language-arrow.swiper-button-next { right: 0px; } } .language-active .language-arrow.swiper-button-next::after { content: "\f16e"; font-family: flaticon !important; font-size: 35px; } .language-active .language-arrow:hover { color: #f6520a; } /*-- /* 15 - Form CSS /*----------------------------------------*/ .upstudy-form-section { background-repeat: no-repeat; background-size: cover; background-position: center top; padding-top: 160px; padding-bottom: 135px; position: relative; overflow: hidden; z-index: 1; } .upstudy-form-section .form-content-wrap { position: relative; z-index: 1; } .upstudy-form-section .form-content-wrap .shape-1 { position: absolute; right: -70px; top: -40px; z-index: -1; } .upstudy-form-section .form-content { text-align: center; max-width: 390px; margin-left: auto; padding-top: 10px; } .upstudy-form-section .form-content .quote-svg svg { fill: #ffffff; } .upstudy-form-section .form-content .text { font-size: 24px; line-height: 36px; font-weight: 500; color: #ffffff; margin-top: 10px; } .upstudy-form-section .form-content .name { font-size: 14px; line-height: 24px; font-weight: 500; color: #f6520a; margin-top: 20px; } .upstudy-form-section .form-content .designation { font-size: 14px; line-height: 24px; font-weight: 400; color: #ffffff; } .upstudy-form-section .course-form { background: #f6520a; max-width: 410px; padding: 60px 25px 80px; margin-left: auto; position: relative; z-index: 1; } .upstudy-form-section .course-form .course-form-inner .title { font-size: 30px; line-height: 36px; padding: 0 30px; color: #ffffff; padding-bottom: 25px; } .upstudy-form-section .course-form .course-form-inner .single-form { margin-top: 20px; } .upstudy-form-section .course-form .course-form-inner .single-form .nice-select { width: 100%; height: 60px; line-height: 58px; background: #dd4a09; color: #ffffff; border: 0; padding: 0 20px; font-size: 14px; border-radius: 5px; } .upstudy-form-section .course-form .course-form-inner .single-form .nice-select::after { border-bottom: 2px solid #ffffff; border-right: 2px solid #ffffff; } .upstudy-form-section .course-form .course-form-inner .single-form .nice-select .list { width: 100%; } .upstudy-form-section .course-form .course-form-inner .single-form .nice-select .list .option { color: #1e1e1e; } .upstudy-form-section .course-form .course-form-inner .single-form input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]):not([type="file"]) { height: 60px; line-height: 58px; background: #dd4a09; color: #ffffff; font-weight: 400; border: 0; padding: 0 20px; font-size: 14px; border-radius: 5px; } .upstudy-form-section .course-form .course-form-inner .single-form input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]):not([type="file"])::-webkit-input-placeholder { opacity: 0.95; font-size: 14px; color: #ffffff; font-weight: 400; } .upstudy-form-section .course-form .course-form-inner .single-form input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]):not([type="file"]):-moz-placeholder { opacity: 0.95; font-size: 14px; color: #ffffff; font-weight: 400; } .upstudy-form-section .course-form .course-form-inner .single-form input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]):not([type="file"])::-moz-placeholder { opacity: 0.95; font-size: 14px; color: #ffffff; font-weight: 400; } .upstudy-form-section .course-form .course-form-inner .single-form input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]):not([type="file"]):-ms-input-placeholder { opacity: 0.95; font-size: 14px; color: #ffffff; font-weight: 400; } .upstudy-form-section .course-form .course-form-inner .form-btn { margin-top: 30px; } .upstudy-form-section .course-form .course-form-inner .form-btn .btn { width: 100%; height: 50px; line-height: 48px; border-radius: 35px; font-size: 16px; background: #ffffff; color: #1e1e1e; } .upstudy-form-section .course-form .course-form-inner .form-btn .btn:hover { background: #ffa300; color: #ffffff; } @media only screen and (max-width: 1199px) { .upstudy-form-section .form-content-wrap .shape-1 { right: 0px; } .upstudy-form-section .form-content { margin: 0 auto; } .upstudy-form-section .course-form .course-form-inner .title { padding: 0 0px; } } @media only screen and (max-width: 991px) { .upstudy-form-section { padding-top: 140px; padding-bottom: 110px; } .upstudy-form-section .form-content-wrap .shape-1 { right: 85px; } .upstudy-form-section .course-form { margin: 0 auto; margin-top: 190px; } } @media only screen and (max-width: 767px) { .upstudy-form-section { padding-top: 140px; padding-bottom: 110px; } .upstudy-form-section .form-content-wrap .shape-1 { right: 0px; } .upstudy-form-section .course-form { margin: 0 auto; margin-top: 190px; } } @media only screen and (max-width: 575px) { .upstudy-form-section { padding-top: 40px; padding-bottom: 100px; } .upstudy-form-section .form-content-wrap { background: #ffa300; -webkit-clip-path: ellipse(50% 34% at 50% 50%); clip-path: ellipse(50% 34% at 50% 50%); padding: 90px 20px; } .upstudy-form-section .form-content-wrap .shape-1 { display: none; } .upstudy-form-section .course-form { margin: 0 auto; margin-top: 20px; } } @media only screen and (max-width: 449px) { .upstudy-form-section .course-form .course-form-inner .title { font-size: 28px; } } /*-- /* 16 - Program CSS /*----------------------------------------*/ .program-wrap { margin-top: -160px; position: relative; z-index: 5; } @media only screen and (max-width: 767px) { .program-wrap { margin-top: -120px; } } .program-item { background: #dc3545; display: flex; align-items: center; padding: 45px 40px; padding-right: 65px; } @media only screen and (max-width: 1199px) { .program-item { padding: 45px 30px; } } .program-item.color-2 { background: #c62333; } .program-item .program-content { margin-left: 25px; flex: 1; } @media only screen and (max-width: 1199px) { .program-item .program-content { margin-left: 20px; } } .program-item .program-content .title { font-size: 30px; line-height: 36px; font-family: "Nanum Myeongjo", serif; font-weight: 800; color: #ffffff; } @media only screen and (max-width: 449px) { .program-item .program-content .title { font-size: 28px; } } /*-- /* 17 - Admission CSS /*----------------------------------------*/ .upstudy-admission-section .admission-left .single-admission .admission-content { background: #1d3f6b; height: 320px; padding: 40px 45px 45px 35px; } .upstudy-admission-section .admission-left .single-admission .admission-content.color-2 { background: #dc3545; } .upstudy-admission-section .admission-left .single-admission .admission-content i { font-size: 40px; color: #ffffff; } .upstudy-admission-section .admission-left .single-admission .admission-content .title { font-size: 24px; line-height: 34px; font-weight: 600; color: #ffffff; margin-top: 5px; } .upstudy-admission-section .admission-left .single-admission .admission-content p { font-size: 16px; line-height: 30px; font-weight: 400; color: #ffffff; margin-top: 8px; } .upstudy-admission-section .admission-left .single-admission .admission-content .learn-more { font-size: 18px; font-weight: 500; color: #ffffff; margin-top: 15px; } .upstudy-admission-section .admission-left .single-admission .admission-content .learn-more i { font-size: 18px; position: relative; top: 1px; margin-left: 5px; transition: all 0.3s linear; } .upstudy-admission-section .admission-left .single-admission .admission-content .learn-more:hover i { margin-left: 10px; } .upstudy-admission-section .admission-left .single-admission .admission-img img { height: 320px; width: 100%; } .upstudy-admission-section .admission-right .admission-banner { position: relative; background-repeat: no-repeat; background-size: cover; background-position: center center; padding-top: 160px; padding-bottom: 205px; padding-left: 110px; padding-right: 130px; height: 640px; z-index: 1; } .upstudy-admission-section .admission-right .admission-banner::before { content: ""; position: absolute; height: 100%; width: 100%; top: 0; left: 0; background: rgba(29, 63, 107, 0.45); z-index: -1; } .upstudy-admission-section .admission-right .admission-banner .title { font-size: 42px; line-height: 52px; font-family: "Nanum Myeongjo", serif; font-weight: 800; color: #ffffff; } .upstudy-admission-section .admission-right .admission-banner .btn { height: 60px; line-height: 58px; padding: 0 50px; margin-top: 45px; background: #ffffff; color: #2f2a55; } .upstudy-admission-section .admission-right .admission-banner .btn i { position: relative; top: 1px; left: 8px; transition: all 0.3s linear; } .upstudy-admission-section .admission-right .admission-banner .btn:hover { background: #dc3545; color: #ffffff; } .upstudy-admission-section .admission-right .admission-banner .btn:hover i { left: 10px; } @media only screen and (max-width: 991px) { .upstudy-admission-section .admission-right .admission-banner { height: 550px; } } @media only screen and (max-width: 767px) { .upstudy-admission-section .admission-right .admission-banner { height: 490px; padding-top: 110px; padding-bottom: 100px; padding-left: 80px; padding-right: 60px; } .upstudy-admission-section .admission-right .admission-banner .title { font-size: 35px; line-height: 45px; } } @media only screen and (max-width: 575px) { .upstudy-admission-section .admission-right .admission-banner { padding-left: 50px; padding-right: 40px; } } @media only screen and (max-width: 449px) { .upstudy-admission-section .admission-left .single-admission .admission-content { height: auto; padding: 40px 30px 45px 35px; } .upstudy-admission-section .admission-right .admission-banner { padding-top: 70px; padding-bottom: 80px; padding-left: 30px; padding-right: 30px; } .upstudy-admission-section .admission-right .admission-banner .title { font-size: 32px; line-height: 42px; } .upstudy-admission-section .admission-right .admission-banner .btn { padding: 0 30px; } } /*-- /* 25 - Page Banner CSS /*----------------------------------------*/ .page-banner-section { padding-top: 90px; min-height: 500px; display: flex; align-items: center; background-repeat: no-repeat; background-size: cover; background-position: center center; position: relative; overflow: hidden; z-index: 1; } .page-banner-section .shape-1 { position: absolute; right: 22%; top: 43%; z-index: -1; } .page-banner-section .shape-2 { position: absolute; left: 6%; top: 42%; -webkit-animation: zoom-inout 3s infinite; animation: zoom-inout 3s infinite; z-index: -1; } .page-banner-section .shape-3 { width: 48px; height: 48px; border: 4px solid #f6b13d; border-radius: 50%; position: absolute; right: 7%; bottom: 28%; -webkit-animation: zoom-inout 3s infinite; animation: zoom-inout 3s infinite; z-index: -1; } @media only screen and (max-width: 991px) { .page-banner-section { min-height: 450px; } .page-banner-section .shape-1 { right: 11%; } .page-banner-section .shape-2 img { width: 130px; } } @media only screen and (max-width: 767px) { .page-banner-section { min-height: 350px; } } @media only screen and (max-width: 575px) { .page-banner-section .shape-1 { top: 34%; } .page-banner-section .shape-2 { display: none; } } .page-banner .title { font-size: 42px; line-height: 52px; font-family: "Outfit", sans-serif; display: inline-block; font-weight: 600; color: #2f2a55; position: relative; z-index: 1; } @media only screen and (max-width: 767px) { .page-banner .title { font-size: 30px; } } .page-banner .breadcrumb { margin-bottom: 0; margin-top: 10px; } .page-banner .breadcrumb .breadcrumb-item { font-size: 14px; font-family: "Outfit", sans-serif; font-weight: 500; color: #000000; } .page-banner .breadcrumb .breadcrumb-item + .breadcrumb-item { padding-left: 8px; } .page-banner .breadcrumb .breadcrumb-item + .breadcrumb-item::before { content: "\f16e"; font-family: flaticon !important; font-size: 12px; padding-right: 5px; position: relative; top: 2px; color: #000000; } /*-- /* 18 - Blog List CSS /*----------------------------------------*/ .blog-standard-wrap { margin-top: -70px; } .blog-standard-wrap .blog-post-wrap .pagination { margin-top: 55px; } .single-blog-post { margin-top: 70px; } .single-blog-post .blog-img { border-radius: 10px; overflow: hidden; } .single-blog-post .blog-content { padding-top: 35px; padding-left: 0px; padding-right: 0px; } .single-blog-post .blog-content .blog-meta span i { color: #1cb098; } .single-blog-post .blog-content .title { font-size: 30px; line-height: 40px; } .single-blog-post .blog-content p { font-size: 16px; line-height: 30px; color: #7a7a7a; margin-top: 20px; } .single-blog-post .blog-content .blog-btn { margin-top: 25px; } .blog-sidebar { border: 1px solid #ebebeb; border-radius: 5px; padding: 30px; margin-top: 70px; margin-left: 65px; position: sticky; top: 0; } @media only screen and (max-width: 1199px) { .blog-sidebar { margin-left: 15px; } } @media only screen and (max-width: 991px) { .blog-sidebar { margin-left: 0px; } } .blog-sidebar .sidebar-widget-1 { margin-top: 0; } .sidebar-widget { margin-top: 45px; } .sidebar-widget .search-form { position: relative; } .sidebar-widget .search-form input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]):not([type="file"]) { width: 100%; height: 50px; margin-bottom: 0; border: 0; padding-right: 35px; background: #f8fafb; color: #415674; font-weight: 700; outline: none; overflow: hidden; } .sidebar-widget .search-form input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]):not([type="file"])::-webkit-input-placeholder { opacity: 0.95; font-size: 14px; font-family: "Outfit", sans-serif; color: #898c94; font-weight: 400; } .sidebar-widget .search-form input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]):not([type="file"]):-moz-placeholder { opacity: 0.95; font-size: 14px; font-family: "Outfit", sans-serif; color: #898c94; font-weight: 400; } .sidebar-widget .search-form input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]):not([type="file"])::-moz-placeholder { opacity: 0.95; font-size: 14px; font-family: "Outfit", sans-serif; color: #898c94; font-weight: 400; } .sidebar-widget .search-form input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]):not([type="file"]):-ms-input-placeholder { opacity: 0.95; font-size: 14px; font-family: "Outfit", sans-serif; color: #898c94; font-weight: 400; } .sidebar-widget .search-form button { position: absolute; top: 50%; transform: translateY(-50%); right: 0; width: 50px; height: 50px; background: transparent; border: 0; border-radius: 5px; font-size: 14px; color: #111111; transition: all 0.3s linear; } .sidebar-widget .search-form button:hover { background: #1cb098; color: #ffffff; } .sidebar-widget .widget-title { margin-bottom: 25px; } .sidebar-widget .widget-title .title { font-size: 18px; font-family: "Outfit", sans-serif; font-weight: 700; color: #2f2a55; display: inline-block; } .sidebar-widget .recent-posts ul li { margin-top: 30px; } .sidebar-widget .recent-posts ul li:first-child { margin-top: 0; } .sidebar-widget .recent-posts ul li .post-link { display: flex; align-items: center; } .sidebar-widget .recent-posts ul li .post-link .post-thumb { margin-right: 20px; } .sidebar-widget .recent-posts ul li .post-link .post-thumb img { min-width: 70px; height: 70px; border-radius: 6px; image-rendering: crisp-edges; } .sidebar-widget .recent-posts ul li .post-link .post-text .title { font-size: 14px; line-height: 16px; font-family: "Outfit", sans-serif; font-weight: 600; transition: all 0.3s linear; color: #333333; } .sidebar-widget .recent-posts ul li .post-link .post-text .post-meta { font-size: 12px; font-family: "Outfit", sans-serif; font-weight: 400; line-height: 24px; color: #838383; display: inline-block; margin-top: 5px; } .sidebar-widget .recent-posts ul li .post-link .post-text .post-meta i { color: #1cb098; margin-right: 5px; } .sidebar-widget .recent-posts ul li .post-link:hover .post-text .title { color: #1cb098; } .sidebar-widget .category .cate-item { margin-top: 15px; } .sidebar-widget .category .cate-item:first-child { margin-top: 0; } .sidebar-widget .category .cate-item a { display: flex; font-size: 14px; font-family: "Outfit", sans-serif; font-weight: 400; color: #29303c; transition: all 0.3s linear; } .sidebar-widget .category .cate-item a i { font-size: 10px; line-height: 24px; color: #1cb098; margin-right: 5px; } .sidebar-widget .category .cate-item a .post-count { margin-left: auto; align-items: flex-start; width: 20px; height: 20px; line-height: 20px; text-align: center; border-radius: 50%; background: #e4f2f8; font-size: 14px; font-family: "Outfit", sans-serif; font-weight: 400; color: #1cb098; transition: all 0.3s linear; } .sidebar-widget .category .cate-item a:hover { color: #1cb098; } .sidebar-widget .category .cate-item a:hover .post-count { background: #1cb098; color: #ffffff; } .sidebar-widget .sidebar-tag li { display: inline-block; margin-bottom: 10px; margin-right: 4px; } .sidebar-widget .sidebar-tag li a { display: inline-block; border-radius: 5px; padding: 8px 15px; font-size: 14px; font-family: "Outfit", sans-serif; font-weight: 400; color: #666666; line-height: 18px; background: #f9f9f9; transition: all 0.3s linear; } .sidebar-widget .sidebar-tag li a:hover { background-color: #1cb098; color: #ffffff; } /*--Page Pagination--*/ .upstudy-pagination { margin-top: 60px; } .upstudy-pagination .pagination li a { width: 35px; height: 35px; line-height: 35px; text-align: center; border-radius: 50%; font-size: 14px; transition: all 0.3s linear; } .upstudy-pagination .pagination li a.active { background-color: #1cb098; color: #ffffff; } /*-- /* 19 - Blog Details CSS /*----------------------------------------*/ .blog-details-section .blog-details-wrap { margin-top: -70px; } .blog-details-post { margin-top: 70px; } .blog-details-post .single-blog-post { margin-top: 40px; } .blog-details-post .single-blog-post.single-blog .blog-image a { display: block; } .blog-details-post .single-blog-post.single-blog .blog-image a img { width: 100%; } .blog-details-post .single-blog-post.single-blog .blog-content { padding: 40px 0px 0px; width: 100%; left: 0; bottom: 0px; transform: translateX(0); margin-top: 0px; } .blog-details-post .single-blog-post.single-blog .blog-content .title { font-size: 30px; line-height: 40px; } .blog-details-post .single-blog-post.single-blog .blog-content .text { font-size: 16px; line-height: 30px; margin-top: 20px; padding-bottom: 40px; } .blog-details-post .blog-details-content .blog-quote { background-color: #fdf8f4; border-left: 5px solid #1cb098; border-radius: 5px; margin-top: 40px; } .blog-details-post .blog-details-content .blog-quote .blockquote { padding: 50px 80px 35px 35px; margin-bottom: 0; position: relative; } @media only screen and (max-width: 1199px) { .blog-details-post .blog-details-content .blog-quote .blockquote { padding: 50px 50px 35px 35px; } } @media only screen and (max-width: 449px) { .blog-details-post .blog-details-content .blog-quote .blockquote { padding: 50px 35px 35px 35px; } } .blog-details-post .blog-details-content .blog-quote .blockquote:not(:first-child) { margin-top: 25px; } .blog-details-post .blog-details-content .blog-quote .blockquote:not(:last-child) { margin-bottom: 25px; } .blog-details-post .blog-details-content .blog-quote .blockquote .blockquote-icon { flex-shrink: 0; height: 65px; width: 65px; line-height: 63px; background: #ffffff; box-shadow: 0px 9px 68px 0px rgba(0, 0, 0, 0.08); text-align: center; border-radius: 50%; position: relative; top: -90px; margin-bottom: -65px; } .blog-details-post .blog-details-content .blog-quote .blockquote .blockquote-icon svg { fill: #1cb098; width: 30px; } .blog-details-post .blog-details-content .blog-quote .blockquote p { display: inline; font-size: 22px; font-family: "Outfit", sans-serif; font-weight: 400; color: #6f6d80; line-height: 32px; margin-top: 0; } .blog-details-post .blog-details-content .blog-quote .blockquote .name { font-size: 16px; line-height: 30px; color: #2f2a55; margin-top: 5px; } .blog-details-post .blog-details-content .blog-details-text { margin-top: 60px; } .blog-details-post .blog-details-content .blog-details-text .title { font-size: 24px; line-height: 36px; font-weight: 600; color: #2f2a55; } .blog-details-post .blog-details-content .blog-details-text p { font-size: 16px; line-height: 30px; color: #7a7a7a; margin-top: 5px; } .blog-details-post .blog-details-content .blog-details-tag-share { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; margin-top: 65px; padding-top: 15px; border-top: 1px solid #e3e3e5; } .blog-details-post .blog-details-content .blog-details-tag-share .blog-details-tag { padding-top: 20px; } .blog-details-post .blog-details-content .blog-details-tag-share .blog-details-tag .sidebar-widget { margin-top: 0; display: flex; align-items: center; } .blog-details-post .blog-details-content .blog-details-tag-share .blog-details-tag .sidebar-widget .label { font-size: 14px; line-height: 30px; font-family: "Outfit", sans-serif; font-weight: 400; color: #2f2a55; margin-right: 10px; } .blog-details-post .blog-details-content .blog-details-tag-share .blog-details-tag .sidebar-widget .sidebar-tag li { margin-bottom: 0px; } .blog-details-post .blog-details-content .blog-details-tag-share .blog-details-share { display: flex; align-items: center; padding-top: 20px; } .blog-details-post .blog-details-content .blog-details-tag-share .blog-details-share li { display: inline-block; margin-right: 10px; } .blog-details-post .blog-details-content .blog-details-tag-share .blog-details-share li:last-child { margin-right: 0; } .blog-details-post .blog-details-content .blog-details-tag-share .blog-details-share li a { display: inline-block; font-size: 13px; width: 35px; height: 35px; line-height: 35px; text-align: center; color: #ffffff; border-radius: 50%; } .blog-details-post .blog-details-content .blog-details-tag-share .blog-details-share li a.share-facebook { background: #3452cf; } .blog-details-post .blog-details-content .blog-details-tag-share .blog-details-share li a.share-twitter { background: #39adf1; } .blog-details-post .blog-details-content .blog-details-tag-share .blog-details-share li a.share-pinterest { background: #d54443; } .blog-details-post .blog-details-content .upstudy-post-pagination { display: flex; flex-wrap: wrap; background: #ffffff; box-shadow: 0px 0px 70px 0px rgba(0, 0, 0, 0.16); padding: 10px 30px; margin-top: 80px; overflow: hidden; position: relative; } @media only screen and (max-width: 1199px) { .blog-details-post .blog-details-content .upstudy-post-pagination { padding: 10px 20px; } } @media only screen and (max-width: 575px) { .blog-details-post .blog-details-content .upstudy-post-pagination { padding: 0 10px; } } .blog-details-post .blog-details-content .upstudy-post-pagination::before { position: absolute; content: ''; width: 1px; background-color: #e1e1e1; left: 50%; transform: translateX(-50%); top: 30px; bottom: 30px; } @media only screen and (max-width: 767px) { .blog-details-post .blog-details-content .upstudy-post-pagination::before { width: auto; height: 1px; left: 30px; right: 30px; top: 50%; transform: translateY(-50%); bottom: auto; } } .blog-details-post .blog-details-content .upstudy-post-pagination .previous-post, .blog-details-post .blog-details-content .upstudy-post-pagination .next-post { width: 50%; } @media only screen and (max-width: 767px) { .blog-details-post .blog-details-content .upstudy-post-pagination .previous-post, .blog-details-post .blog-details-content .upstudy-post-pagination .next-post { width: 100%; } } .blog-details-post .blog-details-content .upstudy-post-pagination .blog-pagination-post { display: flex; align-items: center; padding: 30px 0; } @media only screen and (max-width: 1199px) { .blog-details-post .blog-details-content .upstudy-post-pagination .blog-pagination-post { padding: 20px 0; } } .blog-details-post .blog-details-content .upstudy-post-pagination .blog-pagination-post .post-thumb { flex-shrink: 0; } .blog-details-post .blog-details-content .upstudy-post-pagination .blog-pagination-post .post-thumb a img { border-radius: 50%; -o-object-position: center; object-position: center; -o-object-fit: cover; object-fit: cover; } .blog-details-post .blog-details-content .upstudy-post-pagination .blog-pagination-post .post-thumb a i { font-size: 14px; color: #1cb098; padding: 0 10px; } .blog-details-post .blog-details-content .upstudy-post-pagination .blog-pagination-post .post-content { flex-grow: 1; padding: 0 20px; } @media only screen and (max-width: 1199px) { .blog-details-post .blog-details-content .upstudy-post-pagination .blog-pagination-post .post-content { padding: 0 15px; } } @media only screen and (max-width: 575px) { .blog-details-post .blog-details-content .upstudy-post-pagination .blog-pagination-post .post-content { padding: 0 13px; } } .blog-details-post .blog-details-content .upstudy-post-pagination .blog-pagination-post .post-content .title { font-size: 18px; line-height: 22px; font-weight: 600; color: #2f2a55; } @media only screen and (max-width: 1199px) { .blog-details-post .blog-details-content .upstudy-post-pagination .blog-pagination-post .post-content .title { font-size: 15px; } } .blog-details-post .blog-details-content .upstudy-post-pagination .blog-pagination-post .post-content .date { font-size: 12px; line-height: 22px; color: #838383; } .blog-details-post .blog-details-content .upstudy-post-pagination .blog-pagination-post .post-content .date i { color: #1cb098; margin-right: 6px; } .blog-details-post .blog-details-content .comment-wrap .comment-form { margin-top: 50px; } .blog-details-post .blog-details-content .comment-wrap .comment-form .comment-title { font-size: 22px; line-height: 30px; color: #2f2a55; } .blog-details-post .blog-details-content .comment-wrap .comment-form p { font-size: 14px; line-height: 30px; color: #686f7a; } .blog-details-post .blog-details-content .comment-wrap .comment-form .comment-form-wrap { padding-top: 10px; } .blog-details-post .blog-details-content .comment-wrap .comment-form .comment-form-wrap .single-form { margin-top: 20px; } .blog-details-post .blog-details-content .comment-wrap .comment-form .comment-form-wrap .single-form .form-control { border: 1px solid transparent; background: #f6f7f9; border-radius: 0; } .blog-details-post .blog-details-content .comment-wrap .comment-form .comment-form-wrap .single-form .form-control::-webkit-input-placeholder { opacity: 0.95; font-size: 13px; font-family: "Outfit", sans-serif; color: #9d9d9d; font-weight: 400; } .blog-details-post .blog-details-content .comment-wrap .comment-form .comment-form-wrap .single-form .form-control:-moz-placeholder { opacity: 0.95; font-size: 13px; font-family: "Outfit", sans-serif; color: #9d9d9d; font-weight: 400; } .blog-details-post .blog-details-content .comment-wrap .comment-form .comment-form-wrap .single-form .form-control::-moz-placeholder { opacity: 0.95; font-size: 13px; font-family: "Outfit", sans-serif; color: #9d9d9d; font-weight: 400; } .blog-details-post .blog-details-content .comment-wrap .comment-form .comment-form-wrap .single-form .form-control:-ms-input-placeholder { opacity: 0.95; font-size: 13px; font-family: "Outfit", sans-serif; color: #9d9d9d; font-weight: 400; } .blog-details-post .blog-details-content .comment-wrap .comment-form .comment-form-wrap .single-form .form-control:focus { outline: none; border-color: #1cb098; } .blog-details-post .blog-details-content .comment-wrap .comment-form .comment-form-wrap .single-form textarea.form-control { height: 135px; padding-top: 15px; font-size: 13px; color: #415674; font-weight: 600; padding: 10px 25px; resize: none; } .blog-details-post .blog-details-content .comment-wrap .comment-form .comment-form-wrap .single-form textarea.form-control:focus { outline: none; box-shadow: none; } .blog-details-post .blog-details-content .comment-wrap .comment-form .comment-form-wrap .form-btn .btn { height: 40px; line-height: 38px; box-shadow: 11px 10px 38px 0 rgba(46, 63, 99, 0.15); margin-top: 25px; font-size: 16px; padding: 0 45px; } /*-- /* 20 - Courses Grid CSS /*----------------------------------------*/ .course-list-wrapper { margin-top: -50px; } .course-hover { width: 350px; z-index: 11; padding: 35px 50px; position: relative; } .course-hover::before { position: absolute; content: ''; width: 15px; height: 15px; background-color: #ffffff; left: -8px; top: 50%; transform: translateY(-50%) rotate(45deg); } .course-hover .top-meta { display: flex; justify-content: space-between; } .course-hover .top-meta .tag { border-radius: 5px; background-color: rgba(28, 176, 152, 0.071); font-size: 14px; font-weight: 600; color: #1cb098; padding: 0 15px; height: 25px; line-height: 25px; } .course-hover .top-meta .tag:hover { background-color: #1cb098; color: #ffffff; } .course-hover .rating { display: flex; align-items: center; margin-top: 5px; } .course-hover .rating .rating-star { display: block; position: relative; } .course-hover .rating .rating-star::before { content: '\f13b \f13b \f13b \f13b \f13b'; font-family: "flaticon"; font-size: 13px; color: #b4b4b4; letter-spacing: 3px; } .course-hover .rating .rating-star .rating-active { position: absolute; top: 0; left: 0; overflow: hidden; } .course-hover .rating .rating-star .rating-active::before { content: '\f13b \f13b \f13b \f13b \f13b'; font-family: "flaticon"; font-size: 13px; color: #fda000; letter-spacing: 3px; } .course-hover .rating span { font-size: 13px; color: #838383; } .course-hover .price { font-size: 14px; font-weight: 700; color: #2f2a55; margin-top: 5px; } .course-hover .title { font-size: 20px; font-weight: 600; line-height: 1.3; margin-top: 15px; } .course-hover .courses-meta { display: flex; margin-top: 10px; gap: 15px; } .course-hover .courses-meta .student { font-size: 13px; color: #838383; margin-top: 5px; } .course-hover > p { font-size: 14px; margin-top: 10px; } .course-hover .courses-btn { padding-top: 25px; } .course-hover .courses-btn .btn { height: 40px; line-height: 40px; font-size: 14px; display: block; } #powerTip { background-color: transparent; border-color: #ffffff; color: inherit; white-space: normal; box-shadow: 0px 0px 109px 0px rgba(0, 0, 0, 0.18); background-color: #ffffff; } #course-hover { display: none; } .course-top-bar { padding-top: 30px; display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; } .course-top-bar .label { font-size: 15px; font-weight: 400; color: #666666; white-space: nowrap; margin-right: 10px; } .course-top-text { margin-top: 15px; } .course-top-text p { font-weight: 700; color: #838383; } .course-top-text p span { color: #2f2a55; } .course-top-inner { display: flex; align-items: center; flex-wrap: wrap; } .course-top-inner > * { margin-right: 30px; } .course-top-inner > *:last-child { margin-right: 0; } .course-top-menu { display: flex; align-items: center; margin-top: 15px; } .course-top-menu .nav li { margin-right: 10px; } .course-top-menu .nav li:last-child { margin-right: 0; } .course-top-menu .nav li button { padding: 0; border: 0; background-color: transparent; color: #666666; font-size: 15px; } .course-top-menu .nav li button.active { color: #1cb098; } .course-top-action { display: flex; align-items: center; margin-top: 20px; padding: 0 20px; border-radius: 5px; background-color: #f6f7f9; height: 40px; line-height: 40px; } .course-top-action .nice-select { float: none; height: auto; line-height: 1; padding: 0; padding-right: 20px; border: 0; color: #2f2a55; font-weight: 700; font-size: 15px; background: none; } .course-top-action .nice-select::after { right: 0; width: 8px; height: 8px; border-bottom: 1px solid #2f2a55; border-right: 1px solid #2f2a55; margin-top: -6px; } .course-top-action .nice-select .option { line-height: 35px; padding-left: 15px; padding-right: 22px; font-size: 14px; font-weight: 500; } .course-collapse-btn { margin-top: 15px; } .course-collapse-btn .btn { height: 40px; line-height: 40px; padding: 0 25px; background-color: #ffffff; border: 1px solid #ebebeb; color: #a9a9a9; } .course-collapse-btn .btn span { color: #1cb098; } .course-collapse-btn .btn i { margin: 0 3px; transition: all 0.3s linear; } .course-collapse-btn .btn i:last-child { color: #2f2a55; } .course-collapse-btn .btn.collapsed { background-color: #ffffff; } .course-collapse-btn .btn:hover { border: 1px solid #1cb098; } .course-collapse-btn .btn:hover i { color: #1cb098; } .course-collapse { background-color: #ffffff; box-shadow: 0px 0px 120px 0px rgba(0, 0, 0, 0.04); border-radius: 10px; margin-top: 50px; padding: 35px 40px; transition: all 0.3s linear; } .course-list-wrapper .sidebar-widget-02 .widget-title { font-size: 18px; } .sidebar-widget-02 + .sidebar-widget-02 { padding-top: 22px; } .widget-checkbox { margin-top: 18px; } .widget-checkbox .checkbox-list li { min-height: auto; margin-bottom: 0; margin-top: 18px; } .widget-checkbox .checkbox-list li label { line-height: 1.3; } .widget-checkbox .rating { position: relative; display: inline-block; } .widget-checkbox .rating::before { content: '\f13b \f13b \f13b \f13b \f13b'; font-family: "flaticon"; color: #dedede; font-size: 14px; letter-spacing: 2px; } .widget-checkbox .rating .rating-on { position: absolute; top: 0; left: 0; height: 100%; overflow: hidden; } .widget-checkbox .rating .rating-on::before { content: '\f13b \f13b \f13b \f13b \f13b'; font-family: "flaticon"; color: #fda000; font-size: 14px; letter-spacing: 2px; } .sidebar-wrap-02 { border: 1px solid #ebebeb; border-radius: 10px; padding: 35px 40px; margin-top: 50px; } @media only screen and (max-width: 1199px), only screen and (max-width: 575px) { .sidebar-wrap-02 { padding: 35px 25px; } } .single-course-list { display: flex; padding: 50px 0; } @media only screen and (max-width: 767px) { .single-course-list { display: block; padding: 30px 0; } } .single-course-list:first-child { padding-top: 30px; } .single-course-list:last-child { padding-bottom: 0; } .single-course-list + .single-course-list { border-top: 1px solid #ebebeb; } .single-course-list .course-image { overflow: hidden; flex-shrink: 0; } .single-course-list .course-image a { display: block; position: relative; } .single-course-list .course-image a img { border-radius: 10px; } @media only screen and (max-width: 767px) { .single-course-list .course-image a img { width: 100%; } } .single-course-list .course-content { padding-left: 30px; flex-grow: 1; } @media only screen and (max-width: 767px) { .single-course-list .course-content { padding-left: 0; padding-top: 25px; } } .single-course-list .course-content .top-meta { display: flex; flex-wrap: wrap; } .single-course-list .course-content .top-meta > * { margin-right: 20px; } .single-course-list .course-content .top-meta > *:last-child { margin-right: 0; } .single-course-list .course-content .top-meta .tag { font-size: 14px; font-weight: 500; border-radius: 5px; padding: 0 15px; height: 25px; line-height: 23px; display: inline-block; background-color: rgba(28, 176, 152, 0.071); color: #1cb098; white-space: nowrap; } .single-course-list .course-content .top-meta .tag:hover { background-color: #1cb098; color: #ffffff; } .single-course-list .course-content .top-meta .price .sale-price { font-size: 14px; font-weight: 600; color: #2f2a55; } .single-course-list .course-content .title { font-size: 20px; font-weight: 500; line-height: 1.3; margin-top: 15px; color: #2f2a55; } .single-course-list .course-content .author-name { font-size: 14px; font-weight: 500; text-transform: capitalize; color: #000000; } .single-course-list .course-content p { font-size: 16px; line-height: 30px; margin-top: 10px; } .single-course-list .course-content .bottom-meta { display: flex; flex-wrap: wrap; align-items: center; } .single-course-list .course-content .bottom-meta > * { margin-right: 20px; } .single-course-list .course-content .bottom-meta > *:last-child { margin-right: 0; } .single-course-list .course-content .bottom-meta .meta-action { font-size: 14px; color: #838383; margin-top: 5px; white-space: nowrap; } .single-course-list .course-content .bottom-meta .meta-action i { color: #101213; margin-right: 2px; } .single-course-list .course-content .bottom-meta .rating { display: flex; align-items: center; margin-top: 5px; } .single-course-list .course-content .bottom-meta .rating .rating-star { display: block; position: relative; } .single-course-list .course-content .bottom-meta .rating .rating-star::before { content: '\f13b \f13b \f13b \f13b \f13b'; font-family: "flaticon"; font-size: 13px; color: #b4b4b4; letter-spacing: 2px; } .single-course-list .course-content .bottom-meta .rating .rating-star .rating-active { position: absolute; top: 0; left: 0; overflow: hidden; } .single-course-list .course-content .bottom-meta .rating .rating-star .rating-active::before { content: '\f13b \f13b \f13b \f13b \f13b'; font-family: "flaticon"; font-size: 13px; color: #fda000; letter-spacing: 2px; } .single-course-list .course-content .bottom-meta .rating span { font-size: 13px; color: #838383; } /*-- /* 21 - Courses Details CSS /*----------------------------------------*/ .course-details-banner-content { max-width: 550px; } @media only screen and (max-width: 991px), only screen and (max-width: 767px) { .course-details-banner-content { padding: 50px 0; } } .course-details-banner-content .title { font-size: 30px; line-height: 40px; color: #2f2a55; } .course-details-banner-content > p { margin-top: 15px; } .course-details-banner-content .course-details-meta { display: flex; align-items: center; flex-wrap: wrap; padding-top: 10px; } .course-details-banner-content .course-details-meta > * { padding-left: 40px; margin-top: 10px; position: relative; } @media only screen and (max-width: 575px) { .course-details-banner-content .course-details-meta > * { padding-left: 20px; } } .course-details-banner-content .course-details-meta > *::before { position: absolute; content: ''; width: 1px; height: 25px; background-color: #e1e1e1; left: 18px; top: 50%; transform: translateY(-50%); } @media only screen and (max-width: 575px) { .course-details-banner-content .course-details-meta > *::before { left: 8px; } } .course-details-banner-content .course-details-meta > *:first-child { padding-left: 0; } .course-details-banner-content .course-details-meta > *:first-child::before { display: none; } .course-details-banner-content .course-details-meta .meta-action:first-child { display: flex; align-items: center; } .course-details-banner-content .course-details-meta .meta-action .meta-author { margin-right: 15px; } .course-details-banner-content .course-details-meta .meta-action .meta-author img { width: 50px; border-radius: 50%; background: #ffffff; padding: 5px; } .course-details-banner-content .course-details-meta .meta-action .name, .course-details-banner-content .course-details-meta .meta-action .date { font-size: 13px; font-weight: 500; line-height: 24px; color: #2f2a55; } .course-details-banner-content .course-details-meta .meta-action .name span, .course-details-banner-content .course-details-meta .meta-action .date span { color: #1cb098; } .course-details-banner-content .course-details-meta .meta-action .rating { display: flex; align-items: center; } .course-details-banner-content .course-details-meta .meta-action .rating .rating-star { display: block; position: relative; } .course-details-banner-content .course-details-meta .meta-action .rating .rating-star::before { content: '\f13b \f13b \f13b \f13b \f13b'; font-family: "flaticon"; font-size: 13px; color: #c5c2c2; letter-spacing: 4px; } .course-details-banner-content .course-details-meta .meta-action .rating .rating-star .rating-active { position: absolute; top: 0; left: 0; overflow: hidden; } .course-details-banner-content .course-details-meta .meta-action .rating .rating-star .rating-active::before { content: '\f13b \f13b \f13b \f13b \f13b'; font-family: "flaticon"; font-size: 13px; color: #ffc000; letter-spacing: 4px; } .course-details-banner-content .course-details-meta .meta-action .rating span { font-size: 13px; color: #666666; } @media only screen and (max-width: 1199px) { .course-details-wrapper { padding-right: 35px; } } .course-details-wrapper .title { font-size: 22px; font-weight: 700; margin-top: -5px; } .course-details-wrapper p { margin-top: 10px; } .course-details-wrapper .lessons-time > * { margin-right: 30px; } .course-details-wrapper .lessons-time > *:last-child { margin-right: 0; } .course-details-wrapper .course-learn-list { border: 1px solid #ebebeb; padding: 50px; margin-top: 50px; border-radius: 5px; } @media only screen and (max-width: 575px) { .course-details-wrapper .course-learn-list { padding: 30px; } } .course-details-wrapper .course-learn-list ul { padding-top: 26px; display: flex; flex-wrap: wrap; margin-left: -10px; margin-right: -10px; } .course-details-wrapper .course-learn-list ul li { font-size: 15px; line-height: 2.25; position: relative; padding-left: 40px; padding-right: 10px; width: 50%; } @media only screen and (max-width: 767px) { .course-details-wrapper .course-learn-list ul li { width: 100%; } } .course-details-wrapper .course-learn-list ul li::before { position: absolute; top: 0; left: 10px; content: "\f132"; font-family: "flaticon"; font-size: 14px; color: #1cb098; } .course-details-wrapper .course-lessons { margin-top: 50px; } .course-details-wrapper .lessons-top { display: flex; justify-content: space-between; gap: 10px; flex-wrap: wrap; } .course-details-wrapper .course-instructor { margin-top: 50px; } .course-details-wrapper .course-review { margin-top: 50px; } .course-accordion .accordion-item { border-radius: 0; margin-top: 20px; border: 0; } .course-accordion .accordion-item button { font-size: 16px; font-weight: 700; background: #f6f7f9; color: #2f2a55; width: 100%; text-align: left; padding: 10px 20px; border: 0; transition: all 0.3s linear; } .course-accordion .accordion-item button::before { content: '\f170'; font-family: "flaticon"; font-size: 13px; font-weight: 300; margin-right: 10px; transition: all 0.3s linear; } .course-accordion .accordion-item button.collapsed::before { content: '\f111'; } .course-accordion .accordion-item .accordion-body { padding: 0; } .course-accordion .accordion-item .accordion-body .lessons-list li { padding: 15px 35px 8px 30px; border-top: 1px solid #DCE4E6; } @media only screen and (max-width: 449px) { .course-accordion .accordion-item .accordion-body .lessons-list li { padding: 15px 0px 8px 0px; } } .course-accordion .accordion-item .accordion-body .lessons-list li:first-child { border-top: 0; } .course-accordion .accordion-item .accordion-body .lessons-list li a { font-size: 16px; color: #666666; display: block; } .course-accordion .accordion-item .accordion-body .lessons-list li a:hover { color: #1cb098; } .course-accordion .accordion-item .accordion-body .lessons-list li a span { display: block; float: right; white-space: nowrap; } .course-accordion .accordion-item .accordion-body .lessons-list li a i { margin-right: 5px; color: #2f2a55; } .instructor-profile { display: flex; gap: 30px; margin-top: 20px; } @media only screen and (max-width: 575px) { .instructor-profile { flex-direction: column; } } .instructor-profile .profile-images { flex-shrink: 0; } .instructor-profile .profile-images img { border-radius: 5px; } .instructor-profile .profile-content { flex-grow: 1; } .instructor-profile .profile-content .name { font-size: 20px; font-weight: 700; } .instructor-profile .profile-content .profile-meta { display: flex; flex-wrap: wrap; gap: 20px; align-items: center; margin-top: 5px; } .instructor-profile .profile-content .profile-meta .rating { display: flex; align-items: center; } .instructor-profile .profile-content .profile-meta .rating .rating-star { display: block; position: relative; } .instructor-profile .profile-content .profile-meta .rating .rating-star::before { content: '\f13b \f13b \f13b \f13b \f13b'; font-family: "flaticon"; font-size: 13px; color: #c5c2c2; letter-spacing: 4px; } .instructor-profile .profile-content .profile-meta .rating .rating-star .rating-active { position: absolute; top: 0; left: 0; overflow: hidden; } .instructor-profile .profile-content .profile-meta .rating .rating-star .rating-active::before { content: '\f13b \f13b \f13b \f13b \f13b'; font-family: "flaticon"; font-size: 13px; color: #ffc000; letter-spacing: 4px; } .instructor-profile .profile-content .profile-meta .rating span { font-size: 13px; font-weight: 700; color: #666666; } .instructor-profile .profile-content .profile-meta .meta-action { font-size: 14px; color: #838383; } .instructor-profile .profile-content .profile-meta .meta-action i { color: #2f2a55; } .instructor-profile .profile-content p { font-size: 16px; line-height: 30px; } .review-rating { display: flex; align-items: center; gap: 30px; margin-top: 20px; } @media only screen and (max-width: 575px) { .review-rating { display: block; } } .review-rating .rating-box { text-align: center; width: 190px; background-color: #ffffff; border-radius: 10px; box-shadow: 0px 0px 57px 0px rgba(0, 0, 0, 0.08); padding: 33px 20px; flex-shrink: 0; } @media only screen and (max-width: 575px) { .review-rating .rating-box { margin: 0 auto; } } .review-rating .rating-box .count { display: block; font-size: 48px; font-weight: 700; color: #2f2a55; line-height: 1; } .review-rating .rating-box .rating-star { display: inline-block; position: relative; } .review-rating .rating-box .rating-star::before { content: '\f13b \f13b \f13b \f13b \f13b'; font-family: "flaticon"; font-size: 18px; color: #c5c2c2; letter-spacing: 4px; } .review-rating .rating-box .rating-star .rating-active { position: absolute; top: 0; left: 0; overflow: hidden; } .review-rating .rating-box .rating-star .rating-active::before { content: '\f13b \f13b \f13b \f13b \f13b'; font-family: "flaticon"; font-size: 18px; color: #ffc000; letter-spacing: 4px; } .review-rating .rating-box p { margin-top: 0; } .review-rating .rating-percentage { flex-grow: 1; display: flex; flex-direction: column; gap: 10px; } @media only screen and (max-width: 575px) { .review-rating .rating-percentage { margin-top: 30px; } } .single-rating-percentage { display: flex; align-items: center; } .single-rating-percentage .label { font-size: 14px; font-weight: 400; color: #666666; white-space: nowrap; } .single-rating-percentage .rating-line { width: 100%; height: 10px; background-color: #ebebeb; position: relative; margin: 0 20px; } .single-rating-percentage .rating-line .line-bar { position: absolute; height: 100%; background-color: #fcca45; } .review-items { padding-top: 30px; } .single-review { display: flex; gap: 30px; margin-top: 30px; } @media only screen and (max-width: 575px) { .single-review { flex-direction: column; } } .single-review .review-author { flex-shrink: 0; } .single-review .review-author img { width: 70px; border-radius: 50%; } .single-review .review-content { flex-grow: 1; } .single-review .review-content .review-top { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 20px; margin-top: -3px; } .single-review .review-content .review-top .name { font-size: 18px; font-weight: 700; color: #072f60; } .single-review .review-content .review-top .rating-star { display: inline-block; position: relative; margin-right: auto; } .single-review .review-content .review-top .rating-star::before { content: '\f13b \f13b \f13b \f13b \f13b'; font-family: "flaticon"; font-size: 14px; color: #c5c2c2; letter-spacing: 4px; } .single-review .review-content .review-top .rating-star .rating-active { position: absolute; top: 0; left: 0; overflow: hidden; } .single-review .review-content .review-top .rating-star .rating-active::before { content: '\f13b \f13b \f13b \f13b \f13b'; font-family: "flaticon"; font-size: 14px; color: #ffc000; letter-spacing: 4px; } .sidebar-details-wrap { margin-top: -440px; position: relative; z-index: 1; position: sticky; top: 100px; } @media only screen and (max-width: 1199px) { .sidebar-details-wrap { margin-top: -420px; } } @media only screen and (max-width: 991px), only screen and (max-width: 767px) { .sidebar-details-wrap { margin-top: 50px; } } .sidebar-details-video-description { background-color: #ffffff; box-shadow: 0px 0px 65px 0px rgba(0, 0, 0, 0.12); overflow: hidden; border-radius: 6px; } .sidebar-details-video-description .sidebar-video { position: relative; padding: 10px; } .sidebar-details-video-description .sidebar-video .play { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 65px; height: 65px; line-height: 65px; background-color: #ffffff; border-radius: 50%; font-size: 14px; color: #1cb098; text-align: center; z-index: 2; } .sidebar-details-video-description .sidebar-video .play:hover { color: #ffffff; background-color: #1cb098; } .sidebar-details-video-description .sidebar-description { padding: 40px 40px 60px; } @media only screen and (max-width: 1199px), only screen and (max-width: 575px) { .sidebar-details-video-description .sidebar-description { padding: 30px 20px 30px; } } .sidebar-details-video-description .sidebar-description .price-wrap { display: flex; } .sidebar-details-video-description .sidebar-description .price-wrap .label { font-size: 18px; font-weight: 700; color: #2f2a55; } .sidebar-details-video-description .sidebar-description .price-wrap .price { margin-top: -5px; margin-left: 10px; } .sidebar-details-video-description .sidebar-description .price-wrap .price .sale-price { font-size: 24px; font-weight: 700; color: #1cb098; } .sidebar-details-video-description .sidebar-description .price-wrap .price .regular-price { font-size: 16px; font-weight: 400; color: #a2a2a2; text-decoration: line-through; margin-left: 10px; } .sidebar-details-video-description .sidebar-description .description-list { padding-top: 26px; } .sidebar-details-video-description .sidebar-description .description-list li { font-weight: 500; font-size: 15px; color: #2f2a55; border-bottom: 1px solid #ebebeb; padding: 10px 0; } @media only screen and (max-width: 1199px), only screen and (max-width: 575px) { .sidebar-details-video-description .sidebar-description .description-list li { font-size: 15px; } } .sidebar-details-video-description .sidebar-description .description-list li:last-child { border-bottom: 0; } .sidebar-details-video-description .sidebar-description .description-list li i { margin: 0 4px 0 0; } .sidebar-details-video-description .sidebar-description .description-list li span { font-weight: 400; float: right; display: block; color: #666666; } .sidebar-details-video-description .sidebar-description .btn { height: 50px; line-height: 50px; margin-top: 20px; } .sidebar-details-video-description .sidebar-description .share-link { position: relative; display: flex; align-items: center; justify-content: center; margin-top: 25px; } .sidebar-details-video-description .sidebar-description .share-link .link-icon { font-size: 16px; text-align: center; color: #2f2a55; } .sidebar-details-video-description .sidebar-description .share-link:hover .social-share-wrapper { opacity: 1; visibility: visible; } .sidebar-details-video-description .sidebar-description .share-link .social-share-wrapper { display: block; position: absolute; left: 50%; bottom: calc(100% + -6px); transform: translateX(-70%); background-color: #28314b; z-index: 2; box-shadow: none; border-radius: 5px; margin: 0; padding: 2px; line-height: 0; white-space: nowrap; transition: all 0.3s linear; opacity: 0; visibility: hidden; } .sidebar-details-video-description .sidebar-description .share-link .social-share-wrapper::after { content: ''; position: absolute; pointer-events: none; width: 0; height: 0; border-style: solid; border-width: 5px 5.5px 0 5.5px; border-color: #28314b transparent transparent transparent; left: 50%; bottom: -5px; margin-left: -5px; } .sidebar-details-video-description .sidebar-description .share-link .social-share-wrapper ul li { display: inline-block; } .sidebar-details-video-description .sidebar-description .share-link .social-share-wrapper ul li a { width: 28px; height: 28px; line-height: 28px; font-size: 11px; color: #ffffff; border-radius: inherit; text-align: center; transition: all 0.3s linear; } .sidebar-details-video-description .sidebar-description .share-link .social-share-wrapper ul li:hover a { background: rgba(255, 255, 255, 0.13); } .sidebar-details-video-description .sidebar-description .share-link .share-btn { font-size: 16px; font-weight: 700; color: #2f2a55; margin-left: 10px; } .sidebar-details-video-description .sidebar-description .share-link .share-btn:hover { color: #1cb098; } /*-- /* 26 - FAQ CSS /*----------------------------------------*/ .faq-accordion-wrapper { display: flex; padding-top: 70px; } @media only screen and (max-width: 991px) { .faq-accordion-wrapper { display: block; } } .faq-accordion-wrapper .faq-col { width: 50%; } @media only screen and (max-width: 991px) { .faq-accordion-wrapper .faq-col { width: 100%; } } .faq-accordion-wrapper .faq-col:first-child { padding-right: 25px; } @media only screen and (max-width: 991px) { .faq-accordion-wrapper .faq-col:first-child { padding-right: 0px; } } .faq-accordion-wrapper .faq-col:last-child { padding-left: 25px; } @media only screen and (max-width: 991px) { .faq-accordion-wrapper .faq-col:last-child { padding-left: 0px; } } .faq-accordion .accordion-item { border: 0; margin-bottom: 10px; border-top: 1px solid #e5e5e5; } .faq-accordion .accordion-item:first-of-type { border-top-left-radius: 0; border-top-right-radius: 0; } .faq-accordion .accordion-item:first-of-type .accordion-button { border-top-left-radius: 0; border-top-right-radius: 0; } .faq-accordion .accordion-item .accordion-header { padding-top: 30px; padding-bottom: 30px; } .faq-accordion .accordion-item .accordion-header .accordion-button { padding: 0; font-size: 20px; line-height: 30px; font-family: "Outfit", sans-serif; color: #2f2a55; font-weight: 700; padding-right: 45px; position: relative; transition: all 0.3s linear; } .faq-accordion .accordion-item .accordion-header .accordion-button::after { display: none; } .faq-accordion .accordion-item .accordion-header .accordion-button .faq-button { position: absolute; right: 0; height: 32px; width: 32px; color: #1cb098; border: 1px solid #e5e5e5; text-align: center; display: flex; align-items: center; justify-content: center; border-radius: 50%; transform: rotate(90deg); transition: all 0.3s linear; } .faq-accordion .accordion-item .accordion-header .accordion-button .faq-button i { font-size: 15px; } .faq-accordion .accordion-item .accordion-header .accordion-button:focus { border: 0; box-shadow: none; } .faq-accordion .accordion-item .accordion-header .accordion-button:not(.collapsed) { color: #2f2a55; background: #ffffff; box-shadow: none; } .faq-accordion .accordion-item .accordion-header .accordion-button:not(.collapsed) .faq-button { position: absolute; right: 0; height: 32px; width: 32px; color: #1cb098; border: 1px solid #e5e5e5; text-align: center; border-radius: 50%; transform: rotate(-90deg); transition: all 0.3s linear; } .faq-accordion .accordion-item .accordion-header .accordion-button:not(.collapsed) .faq-button i { font-size: 15px; } .faq-accordion .accordion-item .accordion-header .accordion-button:hover { color: #1cb098; } .faq-accordion .accordion-item .accordion-body { padding: 0; padding-bottom: 20px; } .faq-accordion .accordion-item .accordion-body p { font-size: 16px; line-height: 30px; } .faq-accordion .accordion-item:hover .accordion-button .faq-button { transform: rotate(-90deg); } /*-- /* 28 - Login Register CSS /*----------------------------------------*/ .login-register-section .login-register-wrap { margin-top: -50px; } .login-register-section .login-register-wrap .section-title .title { font-size: 36px; font-weight: 700; color: #1b2336; line-height: 1.2; margin-top: -8px; } .login-register-section .login-register-wrap .login-register-box { border: 1px solid #ebebeb; padding: 40px; border-radius: 10px; margin-top: 50px; } .login-register-section .login-register-wrap .login-register-box .login-register-form .single-form { margin-top: 20px; } .login-register-section .login-register-wrap .login-register-box .login-register-form .single-form .form-control { border: 1px solid transparent; background: #f6f7f9; border-radius: 0; } .login-register-section .login-register-wrap .login-register-box .login-register-form .single-form .form-control::-webkit-input-placeholder { opacity: 0.95; font-size: 14px; font-family: "Outfit", sans-serif; color: #787884; font-weight: 400; } .login-register-section .login-register-wrap .login-register-box .login-register-form .single-form .form-control:-moz-placeholder { opacity: 0.95; font-size: 14px; font-family: "Outfit", sans-serif; color: #787884; font-weight: 400; } .login-register-section .login-register-wrap .login-register-box .login-register-form .single-form .form-control::-moz-placeholder { opacity: 0.95; font-size: 14px; font-family: "Outfit", sans-serif; color: #787884; font-weight: 400; } .login-register-section .login-register-wrap .login-register-box .login-register-form .single-form .form-control:-ms-input-placeholder { opacity: 0.95; font-size: 14px; font-family: "Outfit", sans-serif; color: #787884; font-weight: 400; } .login-register-section .login-register-wrap .login-register-box .login-register-form .single-form .form-control:focus { outline: none; border-color: #1cb098; } .login-register-section .login-register-wrap .login-register-box .login-register-form .single-form textarea.form-control { height: 135px; font-size: 13px; color: #415674; font-weight: 600; padding: 10px 25px; padding-top: 15px; resize: none; } .login-register-section .login-register-wrap .login-register-box .login-register-form .single-form textarea.form-control:focus { outline: none; box-shadow: none; } .login-register-section .login-register-wrap .login-register-box .login-register-form .single-form .form-check-input { margin-right: 8px; margin-top: 5px; } .login-register-section .login-register-wrap .login-register-box .login-register-form .single-form .form-check-input:focus { box-shadow: none; } .login-register-section .login-register-wrap .login-register-box .login-register-form .single-form .form-check-label { display: inline; font-size: 15px; line-height: 22px; margin-bottom: 0; text-transform: none; } .login-register-section .login-register-wrap .login-register-box .login-register-form .form-btn { margin-top: 30px; } .login-register-section .login-register-wrap .login-register-box .login-register-form .form-btn .btn { height: 50px; line-height: 45px; width: 100%; } /*-- /* 23 - Team Single CSS /*----------------------------------------*/ .upstudy-team-profile-section .team-profile { background: #ffffff; box-shadow: 0px 0px 114px 0px rgba(0, 0, 0, 0.12); border-radius: 10px; padding: 20px; } .upstudy-team-profile-section .team-profile .profile-img img { width: 100%; border-radius: 4px; } .upstudy-team-profile-section .team-profile .profile-content { padding-top: 20px; } .upstudy-team-profile-section .team-profile .profile-content .name { font-size: 20px; line-height: 24px; } .upstudy-team-profile-section .team-profile .profile-content .designation { font-size: 14px; line-height: 24px; color: #868686; } .upstudy-team-profile-section .team-profile .profile-content .profile-social { border-top: 1px solid #ebebeb; padding-top: 25px; margin-top: 15px; margin-bottom: 20px; } .upstudy-team-profile-section .team-profile .profile-content .profile-social .title { font-size: 14px; line-height: 24px; margin-bottom: 10px; } .upstudy-team-profile-section .team-profile .profile-content .profile-social ul li { display: inline-block; } .upstudy-team-profile-section .team-profile .profile-content .profile-social ul li a { display: inline-block; font-size: 16px; height: 34px; width: 34px; line-height: 34px; border-radius: 50%; text-align: center; color: #ffffff; } .upstudy-team-profile-section .team-profile .profile-content .profile-social ul li a.facebook { background: #3452cf; } .upstudy-team-profile-section .team-profile .profile-content .profile-social ul li a.twitter { background: #39adf1; } .upstudy-team-profile-section .team-profile .profile-content .profile-social ul li a.pinterest { background: #d54443; } .upstudy-team-profile-section .team-profile .profile-content .profile-social ul li + li { margin-left: 5px; } .upstudy-team-profile-section .team-profile-description-wrap { padding-left: 60px; } @media only screen and (max-width: 1199px) { .upstudy-team-profile-section .team-profile-description-wrap { padding-left: 0; padding-top: 40px; } } .upstudy-team-profile-section .team-profile-description-wrap .team-profile-info { max-width: 415px; } .upstudy-team-profile-section .team-profile-description-wrap .team-profile-info ul .team-info { font-size: 14px; line-height: 24px; color: #666666; margin-top: 10px; padding-top: 10px; } .upstudy-team-profile-section .team-profile-description-wrap .team-profile-info ul .team-info + .team-info { border-top: 1px solid #ebebeb; } .upstudy-team-profile-section .team-profile-description-wrap .team-profile-info ul .team-info .title { padding-right: 10px; display: inline-block; width: 115px; } .upstudy-team-profile-section .team-profile-description-wrap .team-profile-info ul .team-info span { color: #2f2a55; font-weight: 700; } .upstudy-team-profile-section .team-profile-description-wrap .team-profile-info ul .team-info p { display: inline-block; margin-left: 10px; } .upstudy-team-profile-section .team-profile-description-wrap .team-profile-description { margin-top: 50px; } .upstudy-team-profile-section .team-profile-description-wrap .team-profile-description .title { font-size: 24px; line-height: 42px; margin-bottom: 15px; } .upstudy-team-profile-section .team-profile-description-wrap .team-profile-description p { font-size: 15px; line-height: 30px; } /*-- /* 24 - Event CSS /*----------------------------------------*/ .upstudy-event-section .event-wrap { margin-top: -30px; } .upstudy-event-section .single-item { background: #ffffff; box-shadow: 0px 0px 152px 0px rgba(0, 0, 0, 0.1); border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; transition: all 0.3s linear; margin-top: 30px; } .upstudy-event-section .single-item .event-image { overflow: hidden; position: relative; border-top-left-radius: 10px; border-top-right-radius: 10px; } .upstudy-event-section .single-item .event-image a { display: block; position: relative; } .upstudy-event-section .single-item .event-image a::before { content: ""; position: absolute; left: 0; top: 0; background: linear-gradient(180deg, #FFFFFF00 43%, #00000082 63%); width: 100%; height: 100%; z-index: 0; } .upstudy-event-section .single-item .event-image a img { transition: all 0.3s linear; } .upstudy-event-section .single-item .event-image .event-top-meta { position: absolute; bottom: 20px; left: 30px; } .upstudy-event-section .single-item .event-image .event-top-meta .date { font-size: 12px; display: inline-block; background: #1cb098; text-transform: uppercase; color: #ffffff; height: 28px; line-height: 26px; border-radius: 35px; padding: 0 20px; } .upstudy-event-section .single-item .event-content { padding: 20px 40px 40px; } @media only screen and (max-width: 1199px) { .upstudy-event-section .single-item .event-content { padding: 20px 30px 40px; } } .upstudy-event-section .single-item .event-content .meta { font-size: 13px; line-height: 24px; font-weight: 500; } .upstudy-event-section .single-item .event-content .meta i { color: #1cb098; margin-right: 5px; } .upstudy-event-section .single-item .event-content .title { font-size: 24px; line-height: 30px; font-family: "Outfit", sans-serif; font-weight: 700; color: #2f2a55; margin-top: 10px; margin-bottom: 15px; } @media only screen and (max-width: 1199px) { .upstudy-event-section .single-item .event-content .title { font-size: 20px; } } .upstudy-event-section .single-item .event-content .event-btn { margin-top: 25px; } .upstudy-event-section .single-item .event-content .event-btn .event-btn-link { font-size: 15px; font-weight: 500; height: 45px; line-height: 42px; border: 1px solid #ebebeb; border-radius: 4px; background: transparent; padding: 0 40px; color: #1cb098; transition: all 0.3s linear; } .upstudy-event-section .single-item .event-content .event-btn .event-btn-link i { position: relative; top: 1px; left: 7px; transition: all 0.3s linear; } .upstudy-event-section .single-item .event-content .event-btn .event-btn-link:hover { border: 1px solid #111a24; background: #111a24; color: #ffffff; } .upstudy-event-section .single-item:hover { box-shadow: 0px 5px 20px 0px rgba(0, 0, 0, 0.09); } /*-- /* 27 - Error CSS /*----------------------------------------*/ .error-wrapper { margin-top: 30px; } .error-item .error-thumb img { max-height: 301px; } .error-item .error-content .title { font-size: 36px; line-height: 46px; font-weight: 700; color: #1b2336; margin-top: 43px; } .error-item .error-content p { font-size: 18px; line-height: 30px; color: #415674; margin-top: 11px; margin-bottom: 41px; } .error-item .error-content .error-form .search-form { position: relative; max-width: 460px; margin: 0 auto; } .error-item .error-content .error-form .search-form input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]):not([type="file"]) { width: 100%; max-width: 460px; height: 50px; margin-bottom: 0; border: 1px solid #d6d5d7; color: #415674; font-weight: 700; outline: none; overflow: hidden; } .error-item .error-content .error-form .search-form button { position: absolute; right: 0px; width: 50px; height: 50px; line-height: 52px; border-radius: 5px; background: transparent; color: #1b2336; border: 0; top: 50%; font-size: 16px; font-weight: 700; transform: translateY(-50%); transition: all 0.3s linear; } .error-item .error-content .error-form .search-form button:hover { color: #1cb098; } .error-item .error-content .btn { height: 50px; line-height: 52px; font-size: 14px; font-weight: 700; font-family: "Outfit", sans-serif; margin-top: 20px; } /*-- /* 30 - Contact CSS /*----------------------------------------*/ .contact-info-wrap .info-title { font-size: 42px; font-weight: 600; color: #2f2a55; } @media only screen and (max-width: 767px) { .contact-info-wrap .info-title { font-size: 35px; } } .contact-info-wrap .single-contact-info { display: flex; margin-top: 40px; } .contact-info-wrap .single-contact-info .info-icon { width: 60px; height: 60px; line-height: 60px; border-radius: 50%; text-align: center; background: #d2efea; color: #1cb098; } .contact-info-wrap .single-contact-info .info-icon i { font-size: 25px; } .contact-info-wrap .single-contact-info .info-content { flex: 1; margin-left: 15px; } .contact-info-wrap .single-contact-info .info-content .title { font-size: 18px; line-height: 30px; font-weight: 400; color: #333333; } .contact-info-wrap .single-contact-info .info-content p { font-size: 18px; line-height: 30px; font-weight: 700; color: #2f2a55; } @media only screen and (max-width: 991px) { .contact-form-wrap { padding-top: 30px; } } .contact-form-wrap .single-form { margin-top: 20px; } .contact-form-wrap .single-form input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]):not([type="file"]) { border: 1px solid #e1e1e1; height: 55px; padding: 10px 25px; color: #415674; border-radius: 0; } .contact-form-wrap .single-form input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]):not([type="file"])::-webkit-input-placeholder { opacity: 0.95; font-size: 14px; color: #787884; font-weight: 400; } .contact-form-wrap .single-form input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]):not([type="file"]):-moz-placeholder { opacity: 0.95; font-size: 14px; color: #787884; font-weight: 400; } .contact-form-wrap .single-form input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]):not([type="file"])::-moz-placeholder { opacity: 0.95; font-size: 14px; color: #787884; font-weight: 400; } .contact-form-wrap .single-form input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]):not([type="file"]):-ms-input-placeholder { opacity: 0.95; font-size: 14px; color: #787884; font-weight: 400; } .contact-form-wrap .single-form input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]):not([type="file"]):focus { outline: none; box-shadow: none; border-color: #1cb098; } .contact-form-wrap .single-form textarea { height: 135px; color: #415674; padding: 10px 25px; padding-top: 15px; border-radius: 0; resize: none; } .contact-form-wrap .single-form textarea::-webkit-input-placeholder { opacity: 0.95; font-size: 14px; color: #787884; font-weight: 400; } .contact-form-wrap .single-form textarea:-moz-placeholder { opacity: 0.95; font-size: 14px; color: #787884; font-weight: 400; } .contact-form-wrap .single-form textarea::-moz-placeholder { opacity: 0.95; font-size: 14px; color: #787884; font-weight: 400; } .contact-form-wrap .single-form textarea:-ms-input-placeholder { opacity: 0.95; font-size: 14px; color: #787884; font-weight: 400; } .contact-form-wrap .single-form textarea:focus { outline: none; box-shadow: none; border-color: #1cb098; } .contact-form-wrap .form-btn .btn { margin-top: 35px; } .contact-map-section .contact-map-wrap { margin-bottom: -10px; } .contact-map-section .contact-map-wrap iframe { height: 550px; width: 100%; filter: brightness(100%) contrast(100%) saturate(0%) blur(0px) hue-rotate(0deg); } @media only screen and (max-width: 1199px) { .contact-map-section .contact-map-wrap iframe { height: 450px; } } /*----------------------------------------*/ /* 05. Widget CSS /*----------------------------------------*/ /*-- /* 5.1 - Sidebar Widget CSS /*----------------------------------------*/ .sidebar-wrap { border-left: 1px solid #eeeeee; height: 100%; } @media only screen and (max-width: 991px), only screen and (max-width: 767px) { .sidebar-wrap { border-left: none; height: auto; padding-top: 0; } } .widget { margin-bottom: 40px; color: #666666; } .widget:last-child { margin-bottom: 0; } .widget .widget-title { border-bottom: 1px solid #eeeeee; padding-left: 20px; padding-bottom: 20px; } @media only screen and (max-width: 991px), only screen and (max-width: 767px) { .widget .widget-title { padding-left: 0; } } /*-- /* 31.1 - Footer Widget CSS /*----------------------------------------*/ .footer-widget-wrap { padding-top: 50px; padding-bottom: 90px; } @media only screen and (max-width: 767px) { .footer-widget-wrap { padding-top: 20px; } } .footer-widget { margin-top: 40px; } .footer-widget-title { font-size: 18px; font-family: "Outfit", sans-serif; font-weight: 500; color: #ffffff; } .widget-about .text { font-size: 14px; font-family: "Outfit", sans-serif; font-weight: 400; line-height: 24px; color: #ffffff; padding-right: 10px; margin-top: 15px; } @media only screen and (max-width: 1199px) { .widget-about .text { padding-right: 0; } } .widget-link { padding-top: 15px; } .widget-link .link li { margin-top: 10px; } .widget-link .link li a { font-size: 14px; color: #cacaca; transition: all 0.3s linear; } .widget-link .link li a:hover { color: #1cb098; } .widget-download { padding-top: 17px; } .widget-download a { display: block; margin-top: 15px; } .widget-download a img { border-radius: 4px; } .widget-info { display: flex; align-items: center; flex-wrap: nowrap; border-top: 1px solid #29313a; margin-right: 35px; margin-top: 20px; padding-top: 20px; } .widget-info .info-icon i { font-size: 25px; display: inline-block; color: #1cb098; margin-right: 10px; margin-top: 2px; } .widget-info .info-text { font-size: 16px; line-height: 22px; font-family: "Outfit", sans-serif; font-weight: 500; color: #ffffff; } .widget-info .info-text a { font-size: 14px; font-weight: 400; } .footer-section-02 { position: relative; overflow: hidden; z-index: 1; } .footer-section-02 .shape-1 { position: absolute; top: -35%; left: 0; width: 100%; } @media only screen and (max-width: 1199px) { .footer-section-02 .shape-1 { top: -16%; } } @media only screen and (max-width: 991px) { .footer-section-02 .shape-1 { top: -8%; } } @media only screen and (max-width: 767px) { .footer-section-02 .shape-1 { top: -3%; } } @media only screen and (max-width: 575px) { .footer-section-02 .shape-1 { top: 0%; } } .footer-section-02 .shape-2 { position: absolute; left: 25px; top: 130px; z-index: -1; } .footer-section-02 .shape-3 { position: absolute; top: 120px; right: -95px; z-index: -1; } .footer-section-02 .footer-widget-wrap { padding-top: 90px; } .footer-section-02 .footer-widget-title { color: #000000; } .footer-section-02 .widget-about .text { color: #7a7a7a; } .footer-section-02 .widget-link .link li a { color: #7a7a7a; } .footer-section-02 .widget-link .link li a:hover { color: #ff5562; } .footer-section-02 .widget-info { border-top: 0; } .footer-section-02 .widget-info .info-icon i { color: #ff5562; } .widget-info.widget-info-2 .info-icon i { color: #f6520a; } .widget-info.widget-info-3 .info-icon i { color: #dc3545; } .footer-section-02 .widget-info .info-text { color: #000000; } .footer-section-02 .widget-info .info-text a:hover { color: #ff5562; } .footer-section-02 .widget-download a img { width: 130px; height: 40px; border-radius: 4px; } @media only screen and (max-width: 1199px) { .footer-section-02 .shape-2 { left: 190px; top: 75px; } } @media only screen and (max-width: 767px) { .footer-section-02 .shape-3 { width: 370px; top: 250px; right: -120px; } } @media only screen and (max-width: 575px) { .footer-section-02 .shape-3 { top: 380px; right: -110px; } } .back-btn { position: fixed; bottom: 20px; right: 20px; width: 45px; height: 45px; line-height: 50px; z-index: 20; border-radius: 50%; background-color: #1cb098; border: 0; transition: all 0.3s linear; font-size: 18px; display: flex; align-items: center; justify-content: center; color: #ffffff; opacity: 0; transform: translateX(130%) rotate(90deg); } .back-btn:hover { background-color: #f8db5e; color: #ffffff; } .back-btn.active { opacity: 1; transform: translateY(0) rotate(90deg); } /*-- /* 31. Footer CSS /*----------------------------------------*/ .footer-section { background-color: #111a24; } .footer-copyright { border-top: 1px solid #29313a; padding-top: 25px; padding-bottom: 20px; } .copyright-wrapper { margin-top: -10px; } .copyright-text { margin-top: 10px; } @media only screen and (max-width: 767px) { .copyright-text { text-align: center; } } .copyright-text p { font-size: 14px; color: #ffffff; } .copyright-social { margin-top: 10px; display: flex; align-items: center; justify-content: end; } @media only screen and (max-width: 767px) { .copyright-social { justify-content: center; } } .copyright-social .social li { display: inline-block; margin-right: 10px; } .copyright-social .social li:last-child { margin-right: 0; } .copyright-social .social li a { height: 35px; width: 35px; line-height: 35px; background: #29313a; text-align: center; border-radius: 50%; font-size: 16px; color: #ffffff; transition: all 0.3s linear; } .copyright-social .social li a:hover { color: #1cb098; } .footer-section-02 { background-color: #fff5f6; } .footer-section-02 .footer-copyright { border-top: 1px solid #ccc4c5; } .footer-section-02 .copyright-text p { color: #7a7a7a; } .footer-section-02 .copyright-social .social li a { background: #e5dcdd; color: #000000; } .footer-section-02 .copyright-social .social li a:hover { color: #ff5562; } .progress-wrap { position: fixed; right: 50px; bottom: 50px; height: 45px; width: 45px; cursor: pointer; display: block; border-radius: 50px; box-shadow: inset 0 0 0 2px rgba(0, 93, 224, 0.2); opacity: 0; visibility: hidden; transform: translateX(130%); z-index: 99; transition: all 200ms linear; } .progress-wrap::after { position: absolute; content: "\f108"; font-family: flaticon !important; text-align: center; line-height: 45px; font-size: 18px; color: #1cb098; left: 0; top: 0; height: 46px; width: 46px; transform: rotate(90deg); cursor: pointer; display: block; z-index: 1; } .progress-wrap svg path { fill: none; } .progress-wrap svg.progress-circle path { stroke: #1cb098; stroke-width: 4; box-sizing: border-box; } .progress-wrap.progress-wrap-02 { box-shadow: inset 0 0 0 2px rgba(255, 85, 98, 0.2); } .progress-wrap.progress-wrap-02::after { color: #ff5562; } .progress-wrap.progress-wrap-02 svg.progress-circle path { stroke: #ff5562; } .progress-wrap.active-progress { opacity: 1; visibility: visible; transform: translateX(0); }