@charset "UTF-8"; @import url("https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;1,500&display=swap"); body { font-family: "Roboto", sans-serif; } .wrapper { scroll-behavior: smooth; } .link-custom { color: #f0932b; } .link-custom:hover { color: #ff630e; transition: all 1s; } .btn-primary-custom { display: block; background-color: #ff630e; color: #fff; padding: 15px 30px; border-radius: 5px; font-size: 16px; font-weight: 600; text-transform: uppercase; letter-spacing: 1px; margin: 0 auto 10px; width: 100%; } .btn-primary-custom:hover { color: #ff630e; background-color: #fff; border: #ff630e 1px solid; transition: 0.3s; } .btn-outline-secondary-custom { color: #ff630e; background-color: #fff; padding: 15px 30px; border-radius: 5px; font-size: 16px; font-weight: 600; text-transform: uppercase; letter-spacing: 1px; border: #ff630e 2px solid; } .btn-outline-secondary-custom:hover { color: #fff; background-color: #ff630e; transition: 0.3s; } .sidebar-wrap { display: none; } .header-mobile-content { display: none; } .section-heading { font-size: 45px; line-height: 55px; font-weight: 700; color: #0e0a38; margin-bottom: 30px; } .testi-rating i { color: #ff630e; font-size: 18px; margin: 10px 2px 6px; display: inline-block; } .sticky { position: fixed; top: 0; left: 0; right: 0; z-index: 5; } .my-border-color { border: 1px solid #ccc; } .preloader { position: fixed; width: 100%; height: 100%; z-index: 999999; background-color: #0e0a38; display: flex; justify-content: center; align-items: center; opacity: 1; transition: all 0.3s; } .lds-roller { display: inline-block; position: relative; width: 80px; height: 80px; } .lds-roller div { animation: lds-roller 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite; transform-origin: 40px 40px; } .lds-roller div:after { content: " "; display: block; position: absolute; width: 7px; height: 7px; border-radius: 50%; background: #fff; margin: -4px 0 0 -4px; } .lds-roller div:nth-child(1) { animation-delay: -0.036s; } .lds-roller div:nth-child(1):after { top: 63px; left: 63px; } .lds-roller div:nth-child(2) { animation-delay: -0.072s; } .lds-roller div:nth-child(2):after { top: 68px; left: 56px; } .lds-roller div:nth-child(3) { animation-delay: -0.108s; } .lds-roller div:nth-child(3):after { top: 71px; left: 48px; } .lds-roller div:nth-child(4) { animation-delay: -0.144s; } .lds-roller div:nth-child(4):after { top: 72px; left: 40px; } .lds-roller div:nth-child(5) { animation-delay: -0.18s; } .lds-roller div:nth-child(5):after { top: 71px; left: 32px; } .lds-roller div:nth-child(6) { animation-delay: -0.216s; } .lds-roller div:nth-child(6):after { top: 68px; left: 24px; } .lds-roller div:nth-child(7) { animation-delay: -0.252s; } .lds-roller div:nth-child(7):after { top: 63px; left: 17px; } .lds-roller div:nth-child(8) { animation-delay: -0.288s; } .lds-roller div:nth-child(8):after { top: 56px; left: 12px; } @keyframes lds-roller { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } #customBtn { display: inline-block; background: white; color: #444; width: 190px; border-radius: 5px; border: thin solid #888; box-shadow: 1px 1px 1px grey; white-space: nowrap; } #customBtn:hover { cursor: pointer; } span.label { font-family: serif; font-weight: normal; } span.icon { background: url(../images/g-normal.png) transparent 5px 50% no-repeat; display: inline-block; vertical-align: middle; width: 42px; height: 42px; } span.buttonText { display: inline-block; vertical-align: middle; padding-left: 42px; padding-right: 42px; font-size: 14px; font-weight: bold; /* Use the Roboto font that is loaded in the */ font-family: "Roboto", sans-serif; } .swiper.swiper-id-card { width: 100%; height: 420px; } .swiper.swiper-id-card .slide_1 { border-radius: 10px; padding: 10px; height: 100%; } .swiper.swiper-id-card .slide_1 .slide-content { border: 1px solid #ccc; border-radius: 10px; height: 100%; } .swiper.swiper-id-card .slide_2 { border-radius: 10px; padding: 10px; height: 100%; } .swiper.swiper-id-card .slide_2 .slide-content { border: 1px solid #ccc; border-radius: 10px; height: 100%; } .swiper-slide { text-align: center; /* Center slide text vertically */ -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; align-items: center; } .swiper-slide img { display: block; width: 100%; height: 80%; object-fit: cover; border-radius: 10px; border: 1px solid #ccc; margin-top: 10px; } .swiper-button-next, .swiper-button-prev { outline: none; } div.swiper-button-next:after, div.swiper-button-prev:after { color: #ff630e; } .swiper.swiper-bachelor { width: 100%; height: 100%; } .swiper.swiper-bachelor .swiper-slide { border-radius: 10px; padding: 10px; border: 1px solid #ccc; } .swiper.swiper-bachelor .swiper-slide .img-wrapper { height: 350px; } .swiper.swiper-bachelor .swiper-slide .img-wrapper img { height: 100%; width: 100%; object-fit: cover; margin: 0; } .swiper.swiper-bachelor .swiper-slide.slide_add > div { min-height: 578px; height: 578px; } .swiper.swiper-bachelor .swiper-slide.slide_add > div i { font-size: 60px; } .swiper.swiper-typical-course .course-card { width: 100% !important; } .swiper.swiper-typical-course .course-card .banner-course { border-top-left-radius: 10px; border-top-right-radius: 10px; } .swiper.swiper-typical-course .course-card .logo-course { padding: 0; border-radius: 10px; } .swiper.swiper-typical-course .course-card .logo-course img { margin: 0; } .swiper.swiper-typical-course .course-card .card-title { text-align: start; } .swiper.swiper-typical-course .course-card .sub-title { text-align: start; } .swiper.swiper-typical-course .course-card .testi-rating { text-align: start; } .swiper.swiper-typical-course .course-card .btn-invite-course { width: 100%; } .swiper-typical-mentor div.swiper-button-next:after, .swiper-typical-mentor div.swiper-button-prev:after { color: #ff630e; } .swiper-testimonial .card-custom { width: 100%; } .swiper-testimonial .card-custom img { margin: 0; } .header-top { background-color: #0e0a38; overflow: hidden; padding: 15px 0; } .header-top-wrapper { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; justify-content: space-between; } .header-top-social li { display: inline-block; list-style-type: none; } .header-top-social li a { display: block; text-align: center; width: 25px; height: 25px; font-size: 15px; line-height: 25px; margin: 0 3px; color: #fff; } .header-contact-info li { list-style-type: none; color: #fff; } .wrapper-search { position: relative; } .sup-autocom-search { position: absolute; top: 54px; right: 350px; width: 32%; z-index: 9999 !important; background-color: #0e0a38; color: #fff; border-radius: 4px; } .sup-autocom-search.active input { border-radius: 5px 5px 0 0; } .sup-autocom-search.active .autocom-box-search { padding: 10px 8px; } .autocom-box-search { max-height: 280px; overflow-y: auto; border-bottom-left-radius: 4px; border-bottom-right-radius: 4px; box-shadow: 0 0 42px 0 rgba(14, 10, 56, 0.99); } .sup-autocom-search.active .autocom-box-search li { display: block; } .autocom-box-search li { list-style: none; padding: 8px 12px; display: none; width: 100%; cursor: default; border-radius: 3px; } .autocom-box-search li:hover { background-color: #302e43; opacity: 0.8; cursor: pointer; } .search-course { background-color: rgba(255, 255, 255, 0.1); border: 1px solid rgba(255, 255, 255, 0.1); padding-left: 20px; height: 40px; color: #fff; } .search-course::placeholder { color: rgba(255, 255, 255, 0.8); } .search-course:focus { background-color: transparent; color: #fff; } .header-course-search { flex-basis: 50%; position: relative; } .header-course-search span { justify-content: center; position: absolute; color: rgba(255, 255, 255, 0.5); z-index: 10000; top: 12px; right: 90px; } .header-log-reg { position: relative; } .header-log-reg li { display: inline-block; } .header-log-reg li a { text-decoration: none; color: #fff; transition: all 0.3s; } .header-log-reg li a:hover { color: #ff630e; } .header-log-reg li small { color: #fff; } .header-log-reg .avatar { width: 50px; height: 50px; border-radius: 50%; cursor: pointer; } .header-log-reg .avatar-control { position: absolute; width: 100%; border-radius: 10px; background: #fff; box-shadow: 0 -4px 32px rgba(0, 0, 0, 0.2); min-width: 230px; padding: 8px 24px !important; z-index: 600; } .header-log-reg .avatar-control li { display: block; } .header-log-reg .avatar-control li a { color: #0e0a38; } .header-bottom { background-color: #fff; box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px; padding: 20px 0; } .header-bottom-wrapper { display: flex; align-items: center; justify-content: space-between; } .navbar-nav li { position: relative; } .navbar-nav li > ul { z-index: 3; display: none; position: absolute; background: #fff; text-align: left; -webkit-box-shadow: 0 0 30px rgba(0, 0, 0, 0.1); box-shadow: 0 0 30px rgba(0, 0, 0, 0.1); border-radius: 5px; border-top: 2px solid #ff630e; transition: 0.3s; width: max-content; min-width: 200px; padding: 20px 0px; } .navbar-nav li > ul > li { padding: 10px 20px 10px 10px; border-bottom: 1px solid #f5f5f5; } .navbar-nav li:hover > ul { display: block; } .navbar-nav li:hover .sub-menu { visibility: visible; opacity: 1; } .navbar-nav li:hover .sub-nav { visibility: visible; opacity: 1; } .navbar-nav li .sub-nav { position: absolute; top: 35px; width: 100%; z-index: 1; min-width: 450px; background-color: #fff; -webkit-box-shadow: 0 0 30px rgba(0, 0, 0, 0.1); box-shadow: 0 0 30px rgba(0, 0, 0, 0.1); border-top: 2px solid #ff630e; border-radius: 5px; transition: 0.3s; padding: 20px; visibility: hidden; opacity: 0; } .navbar-nav li .sub-nav a { color: #0e0a38; font-weight: 500 !important; display: block; transition: 0.3s; padding: 5px; } .navbar-nav li .sub-nav a:hover { color: #ff630e; } .navbar-nav li .sub-nav li { border-bottom: 1px solid #f5f5f5; } .navbar-nav li .sub-nav li a { font-weight: 400 !important; } .navbar-nav li .sub-menu { position: absolute; top: 35px; z-index: 1; background-color: #fff; text-align: left; -webkit-box-shadow: 0 0 30px rgba(0, 0, 0, 0.1); box-shadow: 0 0 30px rgba(0, 0, 0, 0.1); border-radius: 5px; border-top: 2px solid #ff630e; transition: 0.3s; visibility: hidden; opacity: 0; } .navbar-nav li .sub-menu li { border-bottom: 1px solid #f5f5f5; padding: 0 10px; } .navbar-nav li .sub-menu li a { padding: 10px 5px; color: #0e0a38; font-weight: 500 !important; display: block; transition: 0.3s; } .navbar-nav li .sub-menu li:hover a { color: #ff630e; } .navbar li > ul li > ul { right: -90%; top: 0; } .nav-link-custom { color: #130f40; padding: 10px 5px; font-size: 17px; font-weight: 500; } .nav-link-custom.active { color: #ff630e !important; } .nav-link-custom:hover { color: #ff630e !important; } .site-logo { color: #0e0a38; font-size: 30px; font-weight: bold; } .site-logo .logo { border-radius: 50%; max-width: 100px; object-fit: cover; } .header-cart { flex-basis: 5%; } .header-cart a { color: #0e0a38; font-size: 30px; position: relative; } .header-cart .cart-total-number { position: absolute; right: -4px; top: -24px; background-color: #ff630e; color: #fff; border-radius: 50%; padding: 1px 5px; font-size: 13px; width: 18px; height: 20px; line-height: 20px; text-align: center; } .icon-shopping-cart { width: 62px; height: 62px; object-fit: cover; } .icon-logo { width: 190px; height: 75px; object-fit: cover; } .btn-search-mobile-icon { margin-right: 80px; } .banner { background-image: url(/assets/images/banner.jpg); background-repeat: no-repeat; background-size: cover; background-position: center; padding: 180px; position: relative; } .banner:before { content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-color: rgba(5, 1, 51, 0.7); } .banner .caption-content { position: relative; } .banner .caption-content h4 { color: #ff630e; text-transform: uppercase; font-size: 20px; line-height: 30px; letter-spacing: 2px; font-weight: 700; margin-bottom: 20px; } .banner .caption-content h2 { color: #fff; font-size: 70px; line-height: 77px; font-weight: 700; margin-bottom: 20px; } .banner .caption-content p { color: #fff; padding: 0 200px; font-size: 16px; line-height: 26px; } .banner .caption-content .banner-control { display: flex; align-items: center; justify-content: center; } .aboutus { padding: 40px 0 50px; background: url(/assets/images/background.jpg); background-repeat: no-repeat; background-position: center center; background-size: cover; background-attachment: fixed; position: relative; } .aboutus::before { content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-color: rgba(255, 255, 255, 0.7); } .aboutus .aboutus-content { position: relative; } .aboutus .aboutus-content .about-description { font-size: 20px; font-weight: 500; text-align: justify; line-height: 30px; } .aboutus .aboutus-content .banner-aboutus img { width: 100%; border-radius: 10px; box-shadow: 0 0 15px #000; } .advantages { padding: 95px 0 150px; } .advantages .service-card { display: block; padding: 20px 0; margin-bottom: 30px; } .advantages .service-card div:first-child { height: 70px; align-items: center !important; } .advantages .service-card .service-card-icon { display: inline-block; } .advantages .service-card .service-card-icon i { line-height: 70px; font-size: 30px; display: inline-block; } .advantages .service-card .service-card-title { font-size: 22px; font-weight: 600; line-height: 1.3; vertical-align: middle; } .advantages .service-card .service-card-content { line-height: 30px; font-size: 20px; text-align: justify; padding: 10px 0; } .learning-path .left-section { background-image: url(/assets/images/banner-3.jpg); background-size: cover; background-repeat: no-repeat; clip-path: polygon(0 0, 100% 15%, 100% 100%, 0% 100%); padding: 220px 0; position: relative; overflow: hidden; cursor: pointer; } .learning-path .left-section h2 { font-size: 42px; line-height: 56px; font-weight: 700; text-transform: uppercase; } .learning-path .left-section p { font-size: 22px; line-height: 26px; } .learning-path .left-section::before { content: ""; position: absolute; top: 0; left: 0; right: 0; bottom: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.5); } .learning-path .left-section:hover:before { background-color: rgba(0, 0, 0, 0); cursor: pointer; transition: 0.3s; } .learning-path .left-section-content { color: white; position: relative; } .learning-path .right-section { background-image: url(/assets/images/banner-4.jpg); background-size: cover; background-repeat: no-repeat; clip-path: polygon(0 15%, 100% 0, 100% 100%, 0% 100%); padding: 220px 0; position: relative; cursor: pointer; } .learning-path .right-section::before { content: ""; position: absolute; top: 0; left: 0; right: 0; bottom: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.5); border-radius: 10px; } .learning-path .right-section:hover:before { background-color: rgba(0, 0, 0, 0); cursor: pointer; transition: 0.3s; } .learning-path .right-section .right-section-content { color: white; position: relative; } .learning-path .right-section h2 { font-size: 42px; line-height: 56px; font-weight: 700; text-transform: uppercase; } .learning-path .right-section p { font-size: 22px; line-height: 26px; } .courses-section { padding: 95px 0 150px; } .courses-section .owl-carousel .owl-nav { position: absolute; top: 40%; width: 100%; } .courses-section .owl-carousel .owl-nav .owl-prev { position: absolute; left: -4%; font-size: 100px; outline: none; } .courses-section .owl-carousel .owl-nav .owl-prev:hover { background-color: rgba(0, 0, 0, 0); } .courses-section .owl-carousel .owl-nav .owl-next { position: absolute; right: -4%; font-size: 100px; outline: none; } .courses-section .owl-carousel .owl-nav .owl-next:hover { background-color: rgba(0, 0, 0, 0); } .courses-section .owl-carousel .owl-dots { margin-top: 30px !important; } .courses-section .course-card { transition: 0.5s; border-radius: 10px; width: 90%; border: 1px solid #999; } .courses-section .course-card .banner-course { background-size: cover; background-repeat: no-repeat; background-position: center; height: 200px; position: relative; border-bottom: 1px solid #999; } .courses-section .course-card .logo-course { position: absolute; width: 80px; height: 80px; border: 2px solid #999; padding: 2px; background-color: #fff; bottom: -20%; left: 20px; border-radius: 5px; } .courses-section .course-card .logo-course img { width: 100%; height: 100%; } .courses-section .course-card .card-title { color: #130f40; font-size: 24px; font-weight: 700; line-height: 30px; } .courses-section .course-card .description { margin-top: 10px; font-weight: 400; text-align: justify; width: 100%; overflow: hidden; text-overflow: ellipsis; line-height: 25px; -webkit-line-clamp: 3; height: 75px; display: -webkit-box; -webkit-box-orient: vertical; } .courses-section .course-card .btn-invite-course { background-color: #ff630e; color: #fff; padding: 10px 20px; font-size: 20px; border: none; border-radius: 5px; } .courses-section .course-card .btn-invite-course:hover { opacity: 0.8; cursor: pointer; } .btn-search-mobile { position: absolute; right: -70px; top: 13px; background-color: transparent; border: none; outline: none; } .testimonial-content { padding: 95px 0 150px; } .testimonial-content .owl-carousel .owl-nav { position: absolute; top: 30%; width: 100%; } .testimonial-content .owl-carousel .owl-nav .owl-prev { position: absolute; left: -4%; font-size: 100px; outline: none; } .testimonial-content .owl-carousel .owl-nav .owl-prev:hover { background-color: rgba(0, 0, 0, 0); } .testimonial-content .owl-carousel .owl-nav .owl-next { position: absolute; right: -4%; font-size: 100px; outline: none; } .testimonial-content .owl-carousel .owl-nav .owl-next:hover { background-color: rgba(0, 0, 0, 0); } .testimonial-content .owl-carousel .owl-dots { margin-top: 30px !important; } .testimonial-content .card-body .card-img-top-custom { height: 260px; max-height: 300px; object-fit: cover; } .testimonial-content .card-body .title { font-size: 20px; font-weight: 700; line-height: 25px; margin: 0 0 6px; } .testimonial-content .card-body .sub-title { font-weight: 400; } .testimonial-content .card-body p { font-size: 16px; line-height: 26px; margin: 10px 0 20px; } .advantages-2 { padding: 95px 0 150px; background-image: url(https://cybersoft.edu.vn/wp-content/uploads/2020/04/funfact_bg.png); background-position: center center; background-repeat: no-repeat; background-size: cover; position: relative; background-attachment: fixed; } .advantages-2::before { content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.1); } .advantages-2 .advantages-2-content { position: relative; } .advantages-2 .advantages-2-content h4 { font-size: 24px; line-height: 30px; font-weight: 600; font-style: normal; margin-bottom: 20px; } .advantages-2 .advantages-2-content h2 { font-size: 30px; line-height: 30px; font-weight: 600; font-style: normal; margin-bottom: 30px; } .contacts-section { padding: 95px 0 150px; } .contacts-section .form-contact-img { border-radius: 10px; box-shadow: 0 0 10px; } .contacts-section .form-contact-container { padding: 25px 30px; border-radius: 10px; } .contacts-section .form-contact-container h2 { font-size: 30px; font-weight: 700; text-transform: uppercase; } .contacts-section .form-contact-container textarea { height: 161px; } .courses-section .course-card .banner-course { border-radius: 10px !important; object-fit: cover; } .out__sigle-info { text-align: center; } .out__sigle img { border-radius: 10px; object-fit: cover; } .out__sigle-info h3 { color: #130f40; font-size: 24px; font-weight: 700; line-height: 34px; margin: 15px 0; } .out__sigle-info h4 { margin: 0px; margin-bottom: 10px; padding: 0px; border: 0px; font: inherit; vertical-align: baseline; box-sizing: border-box; scroll-behavior: smooth; } .out__sigle-member { border: 1px solid #ccc; border-radius: 10px; } .owl-carousel .owl-item img { border-radius: 10px; object-fit: cover; width: 100%; height: 200px; } .sub-title, .card-text { font-weight: 400; color: #999 !important; } .out__sigle-mentor-home { height: 400px; } .aboutus-wrapper .banner__aboutus { background-image: url(/assets/images/banner-2.jpg); background-position: center; background-repeat: no-repeat; background-size: cover; padding: 110px 0 100px; position: relative; z-index: -2; } .aboutus-wrapper .banner__aboutus h2 { color: #ff630e; line-height: 30px; letter-spacing: 2px; font-weight: 700; margin-bottom: 20px; text-transform: uppercase; font-size: 49px; } .aboutus-wrapper .banner__aboutus p { font-size: 16px; line-height: 26px; color: #f5f5f5; } .aboutus-wrapper .banner__aboutus p a { color: #f5f5f5; transition: all 0.3s; } .aboutus-wrapper .banner__aboutus p a:hover { color: #ff630e; } .aboutus-wrapper .banner__aboutus:after { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: -1; background: rgba(5, 1, 51, 0.7); } .aboutus-wrapper .sec-heading__about { width: 80%; margin: auto; text-align: center; margin-top: 10px; } .aboutus-wrapper .sec-heading__about h5 { font-size: 16px; line-height: 26px; font-weight: 600; text-transform: uppercase; color: #ff630e; letter-spacing: 1px; } .aboutus-wrapper .sec-heading__about h2 { font-size: 45px; line-height: 55px; font-weight: 700; } .aboutus-wrapper .sec-heading__about p { color: grey; margin: 20px 0 40px; letter-spacing: 1px; line-height: 25px; } .aboutus-wrapper .counter { width: 80%; margin: auto; text-align: center; } .aboutus-wrapper .counter .counter-single h2 { color: #ff630e; font-size: 50px; font-weight: 700; margin-bottom: 10px; } .aboutus-wrapper .counter .counter-single p { font-size: 16px; line-height: 26px; color: #696969; } .aboutus-wrapper .why-choose-area { width: 100%; background-color: #f7f7f7; margin-top: 80px; padding: 70px 20px; } .aboutus-wrapper .why-choose-area h4 { font-size: 16px; line-height: 26px; font-weight: 600; text-transform: uppercase; color: #ff630e; letter-spacing: 1px; text-align: center; margin-bottom: 15px; } .aboutus-wrapper .why-choose-area h2 { font-size: 45px; font-weight: 700; line-height: 55px; text-align: center; color: rgba(0, 0, 0, 0.755); margin-bottom: 15px; } .aboutus-wrapper .why-choose-area .choose { width: 100%; margin-top: 30px; text-align: center; } .aboutus-wrapper .why-choose-area .choose .choose-single { padding: 15px 15px; background: white; height: 300px; display: flex; justify-content: center; align-items: center; flex-direction: column; width: 100%; } .aboutus-wrapper .why-choose-area .choose .choose-single img { width: 45px; } .aboutus-wrapper .why-choose-area .choose .choose-single h3 { font-weight: 700; margin-bottom: 10px; font-size: 24px; line-height: 34px; color: #130f40; } .aboutus-wrapper .why-choose-area .choose .choose-single p { font-size: 16px; line-height: 26px; color: #696969; } .our { padding: 15px; margin-top: 25px; width: 100%; } .our h1 { font-size: 45px; line-height: 55px; font-weight: 700; text-align: center; margin-bottom: 25px; } .our h2 { font-size: 16px; line-height: 26px; font-weight: 600; text-transform: uppercase; color: #ff630e; letter-spacing: 1px; text-align: center; } .our .owl-carousel .owl-nav { position: absolute; top: 30%; width: 100%; } .our .owl-carousel .owl-nav .owl-prev { position: absolute; left: -4%; font-size: 100px; color: #0e0a38; outline: none; } .our .owl-carousel .owl-nav .owl-prev:hover { background-color: rgba(0, 0, 0, 0); color: #0e0a38; } .our .owl-carousel .owl-nav .owl-next { position: absolute; right: -4%; font-size: 100px; color: #0e0a38; outline: none; } .our .owl-carousel .owl-nav .owl-next:hover { background-color: rgba(0, 0, 0, 0); color: #0e0a38; } .our .owl-carousel .owl-dots { margin-top: 30px !important; } .our .out__sigle { width: 100%; position: relative; padding: 6px; text-align: center; font-size: 16px; line-height: 26px; color: #696969; cursor: pointer; overflow: hidden; } .our .out__sigle h3 { color: #130f40; font-size: 24px; font-weight: 700; line-height: 34px; margin: 15px 0; } .our .out__sigle img { max-width: 100%; height: 350px; } .our .out__sigle .instructor-links { position: absolute; bottom: 25%; left: 0; right: 0; background-color: #ff630e; width: 65%; height: 50px; margin: 0 auto; padding: 10px 0; border-radius: 5px; -webkit-transition: 0.5s; transition: 0.5s; visibility: hidden; opacity: 0; z-index: -100; } .our .out__sigle .instructor-links ul { display: flex; justify-content: space-around; } .our .out__sigle .instructor-links ul li i { color: white; } .our .out__sigle:hover .instructor-links { opacity: 1; visibility: visible; z-index: 1000; bottom: 30%; } .icon-shopping-cart { width: 62px; height: 62px; object-fit: cover; } .icon-logo { width: 190px; height: 75px; object-fit: cover; } .footer-contact li { display: flex; align-items: center; margin-left: -16px; } .icon-location { width: 62px; height: 62px; object-fit: cover; } .icon-gmail { width: 42px; height: 42px; object-fit: cover; margin-left: 10px; margin-right: 14px; } .header-contact-info li { display: flex; align-items: center; } .header-contact-info ul { display: flex; align-items: center; } .icon-gmail-header { width: 32px; height: 32px; object-fit: cover; } .icon-gmail-header { width: 32px; height: 32px; object-fit: cover; } .btn-primary-custom-select { background-color: #ff630e; color: #fff; padding: 15px 7px; border-radius: 5px; font-size: 16px; font-weight: 600; text-transform: uppercase; letter-spacing: 1px; } .btn-primary-custom-select:hover { background-color: #fff; color: #ff630e; opacity: 0.8; cursor: pointer; transition: all 0.2s; } .fa-search { right: 80px !important; top: 1px !important; } .title-banner1 { display: flex; font-weight: 700; font-size: 35px; text-align: right; line-height: 40px; } .write-1 { text-align: right; font-weight: 500; letter-spacing: 1px; line-height: 25px; color: gray; } .aboutus1 { padding: 30px 0 150px; background-repeat: no-repeat; background-position: center center; background-size: cover; background-attachment: fixed; position: relative; } .img-1 { margin-top: 50px; width: 100%; height: 500px; border-radius: 30px; object-fit: cover; } .img-2 { height: 300px; } .banner1 { background-image: url(/assets/images/banner.jpg); background-repeat: no-repeat; background-size: cover; background-position: center; padding: 92px; position: relative; } .banner1:before { content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-color: rgba(5, 1, 51, 0.7); } .banner1 .caption-content { position: relative; } .banner1 .caption-content h2 { color: #fff; font-size: 70px; line-height: 77px; font-weight: 700; margin-bottom: 20px; } .banner1 .caption-content p { color: #fff; font-size: 16px; line-height: 26px; text-align: center; } .banner1 .caption-content .banner-control { display: flex; align-items: center; justify-content: center; } .container1 { display: flex; justify-content: space-between; } .my-element { height: 100%; border-right: 1px solid white; } .information { padding-top: 50px; text-align: center; } .information h3 { color: #0e0a38; line-height: 30px; letter-spacing: 2px; font-weight: 700; margin-bottom: 20px; text-transform: uppercase; font-size: 45px; } .employ__box img { position: relative; width: 100%; object-fit: cover; } .img_title_1 { display: flex; margin-bottom: 100vh; } .information:nth-child(2) { margin-top: -10px; } .information p { padding-top: 20px; font-size: 20px; color: #0e0a38; text-align: justify; line-height: 30px; font-weight: 400; margin-bottom: 20px; } .caption_img { position: relative; } .title_img_aboutus { position: absolute; top: 0; bottom: 0; left: 20%; right: 0; text-align: center; margin: 0 auto; display: grid; justify-content: center; align-content: center; width: 20%; text-align: justify; } .title_img_aboutus-text { line-height: 25px; color: #ff630e; font-size: 25px; } .caption_img1 { position: relative; } .img_aboutus_3 { position: absolute; top: 315px; bottom: 0; right: 0; text-align: center; margin: 0 auto; display: grid; justify-content: center; align-content: center; width: 20%; text-align: justify; } .bt-aboutus_1 { border: 0; line-height: 25px; display: block; background-color: #ff630e; color: #fff; padding: 12px 30px; border-radius: 30px; font-size: 20px; font-weight: 600; text-transform: uppercase; letter-spacing: 1px; margin: 0 auto 10px; width: 100%; } .bt-aboutus_1:hover { opacity: 0.8; cursor: pointer; } .header-mobile-logo a { color: #0e0a38; } .login-mobile-section { background: #f5f5f5; padding: 30px 0; } .login-mobile-section .login-form-content { background: #fff; border-radius: 10px; padding: 20px; } .login-mobile-section .login-form-content h3 { font-size: 24px; line-height: 34px; color: #0e0a38; font-weight: 700; } .header-contact-info-login-succ ul { display: flex; align-items: center; margin-left: -44px; color: #fff; } .header-contact-info-login-succ ul li { display: flex; align-items: center; } .register-wrapper .page-banner-area { background-image: url(/assets/images/banner-2.jpg); background-size: cover; background-repeat: no-repeat; background-position: center; padding: 110px 0 100px; position: relative; } .register-wrapper .page-banner-area::before { content: ""; position: absolute; background: rgba(19, 15, 64, 0.8); height: 100%; width: 100%; top: 0; left: 0; right: 0; } .register-wrapper .page-banner-area .page-banner-content { position: relative; } .register-wrapper .page-banner-area .page-banner-content h1 { font-size: 60px; line-height: 70px; margin-bottom: 25px; color: #ff630e; font-weight: 700; } .register-wrapper .page-banner-area .page-banner-content p { font-size: 16px; line-height: 26px; color: #f5f5f5; } .register-wrapper .page-banner-area .page-banner-content p a { color: #f5f5f5; transition: all 0.3s; } .register-wrapper .page-banner-area .page-banner-content p a:hover { color: #ff630e; } .register-wrapper .registration-area { padding: 0 0 110px; } .register-wrapper .registration-area .tab-register { margin-top: 50px; width: 50%; margin-left: auto; margin-right: auto; } .register-wrapper .registration-area .tab-register .tab-item { padding: 10px; background-color: #f5f5f5; display: flex; align-items: center; justify-content: center; text-transform: uppercase; color: #ff630e; font-size: 18px; font-weight: 500; border-bottom: 2px solid #ff630e; cursor: pointer; } .register-wrapper .registration-area .tab-register .tab-item.active { background-color: #ff630e; color: #fff; } .register-wrapper .registration-area .tab-register .tab-item:hover { background-color: #ff630e; color: #fff; transition: 0.3s; } .register-wrapper .registration-area .registration-area-content { display: flex; justify-content: center; align-items: center; } .register-wrapper .registration-area .registration-area-content .registration-form-wrap { border-radius: 10px; box-shadow: 0 0 30px rgba(51, 51, 51, 0.1); width: 50%; padding: 40px; } .register-wrapper .registration-area .registration-area-content .registration-form-wrap label { color: #999; } .register-wrapper .registration-area .registration-area-content .registration-form-mentor-wrap { display: none; border-radius: 10px; box-shadow: 0 0 30px rgba(51, 51, 51, 0.1); width: 50%; padding: 40px; } .register-wrapper .registration-area .registration-area-content .registration-form-mentor-wrap label { color: #999; } .invalid-feedback { margin-top: 7px; font-size: 13px; color: red; } .message-un-valid { margin-top: 7px; font-size: 0.8rem; color: red; } .message-match { margin-top: 7px; font-size: 0.8rem; color: red; } #phone-number-mentor-error { margin-top: 6px; font-size: 0.9rem; } .banner__course { width: 100%; padding: 110px 0 100px; background-image: url(/assets/images/banner-2.jpg); background-position: center; background-repeat: no-repeat; background-size: cover; display: flex; justify-content: center; align-items: center; position: relative; } .content__banner_course { text-align: center; position: relative; } .banner__course::before { content: ""; position: absolute; top: 0; right: 0; left: 0; width: 100%; height: 100%; background: rgba(19, 15, 64, 0.8); } .content__banner_course h1 { font-size: 49px; font-weight: 700; margin-bottom: 25px; color: #ff630e; } .content__banner_course p { font-size: 16px; line-height: 26px; color: #f5f5f5; } .content__banner_course p a { color: #f5f5f5; transition: all 0.3s; } .content__banner_course p a:hover { color: #ff630e; } .courses-wrapper .course-content-container { padding: 100px 0; } .courses-wrapper .course-content-container .course-sidebar .course-sidebar-search { display: flex; align-items: center; margin-bottom: 25px; position: relative; } .courses-wrapper .course-content-container .course-sidebar .course-sidebar-search i { position: absolute; right: 15px; font-size: 18px; color: grey; } .courses-wrapper .course-content-container .course-sidebar .course-sidebar-search input { padding-right: 30px !important; } .courses-wrapper .course-content-container .course-sidebar .tag_r { margin-bottom: 30px; width: 100%; } .courses-wrapper .course-content-container .course-sidebar .tag_r h3 { font-size: 17px; text-transform: uppercase; color: rgba(0, 0, 0, 0.832); font-weight: bold; } .courses-wrapper .course-content-container .course-sidebar .tag_r .checkbox__course { margin: 10px 0; } .courses-wrapper .course-content-container .course-sidebar .tag_r .checkbox__course label { font-size: 14px; color: grey; margin-left: 5px; } .courses-wrapper .course-content-container .course-sidebar .tag_r #showMore .txtShow { font-size: 14px; color: grey; margin-left: 5px; } .courses-wrapper .course-content-container .course-sidebar .tag_r #showMore .txtShow .fa-arrow-down { float: left; } .courses-wrapper .course-content-container .course-sidebar .tag_r #showMore .txtShow .fa-arrow-up { display: none; float: left; } .courses-wrapper .course-content-container .courses-list-content .header-courses-list { display: flex; justify-content: space-between; align-items: center; } .courses-wrapper .course-content-container .courses-list-content .header-courses-list .counter-course h5 { font-weight: 700; margin-right: 5px; } .courses-wrapper .course-content-container .courses-list-content .header-courses-list select { flex-basis: 25%; } .courses-wrapper .course-content-container .courses-list-content .main-courses-list .card-course-custom { width: 100%; } .courses-wrapper .course-content-container .courses-list-content .main-courses-list .card-course-custom:hover { box-shadow: 0 0 10px rgba(51, 51, 51, 0.2); transition: all 0.3s; } .courses-wrapper .course-content-container .courses-list-content .main-courses-list .card-course-custom .card-title { min-height: 24px; } .courses-wrapper .course-content-container .courses-list-content .main-courses-list .card-course-custom .card-title a { color: #130f40; font-size: 24px; font-weight: 700; line-height: 30px; } .courses-wrapper .course-content-container .courses-list-content .main-courses-list .card-course-custom .card-title a:hover { color: #ff630e; cursor: pointer; transition: all 0.3s; } .courses-wrapper .course-content-container .courses-list-content .main-courses-list .card-course-custom .sub-title { color: #999; } .courses-wrapper .course-content-container .courses-list-content .main-courses-list .card-course-custom .description { color: #0e0a38; margin-top: 10px; font-weight: 400; text-align: justify; width: 100%; overflow: hidden; text-overflow: ellipsis; line-height: 25px; -webkit-line-clamp: 3; height: 75px; display: -webkit-box; -webkit-box-orient: vertical; } .courses-wrapper .course-content-container .courses-list-content .main-courses-list .card-course-custom .cost { color: #ff630e; font-size: 16px; font-weight: 500; } .courses-wrapper .course-content-container .courses-list-content .main-courses-list .card-course-custom .add-to-cart i { font-size: 27px; } .courses-wrapper .course-content-container .courses-list-content .main-courses-list .card-course-custom .add-to-cart:hover i { transition: all 0.3s; color: #ff630e; cursor: pointer; } .courses-wrapper .course-content-container .courses-list-content .course-pagination { margin-top: 20px; } .courses-wrapper .course-content-container .courses-list-content .course-pagination ul li { display: inline-block; margin-right: 10px; } .courses-wrapper .course-content-container .courses-list-content .course-pagination ul li a { width: 100%; height: 100%; display: block; text-align: center; width: 40px; height: 40px; line-height: 40px; color: #000; background: #f5f5f5; border-radius: 50%; } .courses-wrapper .course-content-container .courses-list-content .course-pagination ul li a:hover { background-color: #ff630e; color: #fff; transition: all 0.3s; } .courses-wrapper .course-content-container .courses-list-content .course-pagination ul li .active { background-color: #ff630e; color: #fff; } .btn-outline-secondary-custom { color: #fff; background-color: #ff630e; border: 1px solid #ff630e; } .btn-outline-secondary-custom:hover { color: #ff630e; background-color: #fff; border: 1px solid #ff630e; } .icon-title-course { width: 42px; height: 42px !important; object-fit: cover; } .btn-primary-custom { margin-top: 0px !important; } .price-cost { position: absolute; top: 0; padding: 10px; border-radius: 4px; font-size: 1.4rem; font-weight: 600; color: #ff630e; background-color: #fff; box-shadow: 2px 2px gray; } .feedback-time { display: flex; align-items: center; flex: 1; } .time { display: flex; align-items: center; margin-right: 6px; } .avatar-mentor { position: absolute; top: -45px; width: 62px !important; height: 62px !important; border: 2px solid #a9a7a7; object-fit: cover; } .icon-time { width: 10px; height: 10px; } .icon-user { width: 10px !important; height: 10px !important; object-fit: cover; } .icon-V { width: 10px !important; height: 10px !important; object-fit: cover; } .mark { background-color: transparent; } .card-img-top { width: 100%; height: 180px; } .icon-search-btn-course { position: absolute; right: 16px !important; top: 9px !important; border: none; background-color: white; } .icon-search-btn-course:hover { cursor: pointer; opacity: 0.6; color: #ff630e !important; transition: all 0.3s; } #txtShowTitle:hover { opacity: 0.8; color: #ff630e; cursor: pointer; transition: all 0.3s; } #txtShowTitle1:hover { opacity: 0.8; color: #ff630e; cursor: pointer; transition: all 0.3s; } .card-title { margin-top: 14px; width: 100%; overflow: hidden !important; text-overflow: ellipsis !important; line-height: 20px !important; -webkit-line-clamp: 3; display: -webkit-box; -webkit-box-orient: vertical; } .icon-lv-title-right { position: absolute; right: -20px; top: -20px; } .course-side-lbl-item { font-size: 17px; text-transform: uppercase; color: rgba(0, 0, 0, 0.832); font-weight: bold; } .custom-price-item { display: flex; align-items: center; } .custom-price-item p { font-size: 0.9rem; margin-left: 6px; color: gray; } .btn-search-course { background-color: #ff630e; color: #fff; border-radius: 6px; padding: 10px; border: 1px solid #ff630e; margin-bottom: 22px; font-size: 0.9rem; } .btn-search-course:hover { opacity: 0.8; cursor: pointer; transition: all 0.3s; } * { margin: 0; padding: 0; box-sizing: border-box; } body { background-color: #e0e0e0; } .container-w { display: flex; flex-direction: column; width: 100%; } .fa-chevron-left { margin-right: 10px; } .banner__payment { background-image: url(/assets/images/banner-2.jpg); background-position: center; background-repeat: no-repeat; background-size: cover; padding: 110px 0 100px; position: relative; z-index: -2; } .banner__payment h2 { color: #ff630e; line-height: 30px; letter-spacing: 2px; font-weight: 700; margin-bottom: 20px; text-transform: uppercase; font-size: 49px; } .banner__payment p { font-size: 16px; line-height: 26px; color: #f5f5f5; } .banner__payment p a { color: #f5f5f5; transition: all 0.3s; } .banner__payment p a:hover { color: #ff630e; } .banner__payment:after { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: -1; background: rgba(5, 1, 51, 0.7); } .section-card-container { display: flex; flex-direction: column; } .content-payment { display: flex; justify-content: center; margin-left: 22px; margin-right: 22px; } .checkout { width: 80%; } .separator-bottom { border-bottom: 2px solid #ccc !important; } .checkout-container { background-color: #fff; padding: 20px; border-radius: 4px; } .checkout-container .link { font-size: 1.4rem; font-weight: 500; } .checkout-container .section-heading { font-size: 1.2rem; font-weight: 600; color: black; margin-top: 0px !important; margin-bottom: 0px !important; line-height: 1.4rem !important; } .checkout-container .card1 { margin-top: 12px; } .checkout-container .card1-container { display: flex; background-color: #e0e0e0; width: 100%; padding: 5px; border-radius: 10px; } .checkout-container .card1-inner { position: relative; display: flex; align-items: center; background-color: #fff; width: 100%; padding: 10px; border-radius: 10px; } .checkout-container .card1-info-header { line-height: 1.6rem; } .checkout-container .card1-info-footer { line-height: 1.6rem; } .checkout-container .card1-info h1 { color: black; font-size: 1rem; font-weight: 500; } .payment-card-desc { font-size: 1rem !important; } .checkout-container .avatar { width: 140px; height: 140px; border-radius: 8px; background: #e0e0e0; margin-right: 10px; } .checkout-container .one { display: flex; align-items: center; justify-content: space-between; } .checkout-container .one p { margin-top: 8px; } .checkout-container .card1-total-price { display: flex; flex-direction: column; justify-content: space-between; flex: 1; } .checkout-container .card1-total-price-code { display: flex; align-items: center; } .checkout-container .card1-total-price-code h1 { color: black; font-size: 1rem; font-weight: 500; } .checkout-container .card1-total-price-code-input { width: 60%; box-shadow: 0 0 8px 0 #706f6f; border-radius: 6px; margin-left: 10px; padding: 4px; } .checkout-container .fa-check-circle { margin-left: 6px; color: green; } .checkout-container .card1-total-price-cost { display: flex; justify-content: flex-start; margin-top: 10px; margin-bottom: 10px; } .checkout-container .card1-total-price-cost h1 { color: black; font-size: 1rem; font-weight: 500; } .checkout-container .card1-total-price-cost p { margin-left: 6px; margin-right: 8px; } .checkout-container .card1-total-price-quantity { display: flex; align-items: center; } .checkout-container .card1-total-price-quantity h1 { color: black; font-size: 1rem; font-weight: 500; } .checkout-container .card1-total-price-quantity p { margin-left: 6px; margin-right: 8px; } .checkout-container .card1-total-price-reduce { display: flex; align-items: center; margin-top: 10px; margin-bottom: 10px; } .checkout-container .card1-total-price-reduce h1 { color: black; font-size: 1rem; font-weight: 500; } .checkout-container .card1-total-price-reduce p { margin-left: 6px; margin-right: 8px; } .checkout-container .card1-total-price-total-cost { display: flex; align-items: center; justify-content: flex-end; } .checkout-container .card1-total-price-total-cost h1 { color: black; font-size: 1rem; font-weight: 500; } .checkout-container .card1-total-price-total-cost p { margin-left: 6px; margin-right: 8px; } .checkout-container .card1-total-price-total-cost .card1-total-price-btn-delete { background-color: transparent; color: #fd7e14; font-size: 1rem; font-weight: 500; margin-left: 32px; } .checkout-container .card1-total-price-total-cost .card1-total-price-btn-delete:hover { opacity: 0.7; color: #fd7e14; transition: all 0.2s; } .section-cart-container { display: flex; flex-direction: column; width: 30%; } .section-cart-container .card { width: 30%; } .cart-item-box { margin-top: 40px; padding: 20px; background-color: #fff; border-radius: 4px; } .cart-item-box .section-heading1 { margin-top: 4px; text-align: center; font-size: 1.2rem; font-weight: 500; } .cart-item-box .two { line-height: 1.6rem; } .cart-item-box .two .two-1 { font-weight: 400; } .cart-item-box .total-course { display: flex; flex-direction: column; line-height: 1.8rem; } .cart-item-box .total-course h2 { text-align: center; font-size: 1.2rem; font-weight: 500; } .cart-item-box .total-course p { color: #9e9b9b; font-size: 1.3rem; font-weight: 500; } .cart-item-box .total-course .total-course-price { font-size: 1.4rem; font-weight: 800; } .cart-item-box .total-course .total-course-payment-title { margin-top: 20px; color: black; } .cart-item-box .total-course .total-course-icons { display: flex; align-items: center; justify-content: center; margin-top: 10px; } .cart-item-box .total-course .total-course-icon-item-momo, .cart-item-box .total-course .total-course-icon-item-viettel-pay, .cart-item-box .total-course .total-course-icon-item-bst { border-radius: 6px; box-shadow: 0 0 8px 0 #706f6f; margin-right: 12px; margin-left: 12px; } .cart-item-box .total-course .total-course-icon-item-bst:hover { cursor: not-allowed; } .cart-item-box .total-course .total-course-icon-item-momo-active, .cart-item-box .total-course .total-course-icon-item-viettel-pay-active { border-radius: 6px; border: 2px solid green; margin-right: 12px; margin-left: 12px; } .cart-item-box .total-course .total-course-icon-item-momo-none-active, .cart-item-box .total-course .total-course-icon-item-viettel-pay-none-active { border-radius: 6px; box-shadow: 0 0 8px 0 #706f6f; margin-right: 12px; margin-left: 12px; } .cart-item-box .total-course .total-course-icon-item-btn { padding: 13px; background-color: transparent; } .cart-item-box .total-course .total-course-icon-item-btn:hover { cursor: not-allowed; } .cart-item-box .total-course .total-course-icon-item-btn-momo { padding: 8px; background-color: transparent; } .cart-item-box .total-course .total-course-icon-item-btn-momo .momo-inner { margin-top: 4px; margin-left: 12px; } .cart-item-box .total-course .total-course-icon-item-btn-momo:hover { opacity: 0.8; } .cart-item-box .total-course .total-course-icon-item-btn-1 { padding: 8px; background-color: transparent; } .cart-item-box .total-course .total-course-icon-item-btn-1:hover { opacity: 0.8; } .cart-item-box .total-course .total-course-momo-icon { width: 42px; height: 42px; object-fit: cover; } .cart-item-box .total-course .total-course-momo-icon-1 { width: 30px; /* Thay đổi độ rộng của icon tùy ý */ height: 30px; /* Thay đổi độ cao của icon tùy ý */ } .cart-item-box .total-course .total-course-momo-icon-12 { width: 100px; /* Thay đổi độ rộng của icon tùy ý */ height: 100px; /* Thay đổi độ cao của icon tùy ý */ } .cart-item-box .total-course .total-course-momo-icon-123 { width: 100px; /* Thay đổi độ rộng của icon tùy ý */ height: 100px; /* Thay đổi độ cao của icon tùy ý */ } .cart-item-box .modal-header { display: flex; align-items: center; justify-content: center; font-size: 1.4rem; font-weight: 600; } .cart-item-box .modal-body { display: flex; justify-content: center; } .cart-item-box .modal-title { margin-right: 10px; /* Thay đổi giá trị margin theo ý muốn */ margin-top: 2.5px; } .cart-item-box .one1 h1, .cart-item-box .one1 p { color: #FF6600; /* Thay đổi màu chữ thành màu cam */ } .cart-item-box .one1 h1:nth-of-type(2) { margin-bottom: 20px; /* Thêm khoảng cách 20px giữa dòng chữ "Cổng thanh toán" và phần hiển thị dữ liệu */ } .cart-item-box .text-1 { text-align: center; color: white; } .cart-item-box .one1 { float: left; background: #121224; border-radius: 10px; margin-right: 90px; padding: 20px; justify-content: flex-end; font-size: 20px; } .cart-item-box .two-2 { display: flex; flex-direction: column; align-items: center; margin-right: 70px; } .cart-item-box .separator { border-top: 2px solid white; /* Thay đổi màu đường kẻ ngang thành màu cam */ } .cart-item-box .separator1 { border-top: 2px solid #5e5e5e; /* Thay đổi màu đường kẻ ngang thành màu cam */ } .cart-item-box .separator2 { border-top: 2px solid #5e5e5e; /* Thay đổi màu đường kẻ ngang thành màu cam */ } .cart-item-box .modal-content { border-radius: 10px; overflow: hidden; } .cart-item-box .title-qr { display: flex; align-items: center; justify-content: center; } .cart-item-box .h1-qr { margin-left: 10px; } .cart-item-box .q { color: #ee0033; font-weight: 700; font-size: 30px; } .cart-item-box .q-1 { color: #d82d8b; font-weight: 700; font-size: 30px; } .cart-item-box .dot-spinner { --uib-size: 1.8rem; --uib-speed: 0.9s; --uib-color: #183153; position: relative; display: flex; align-items: center; justify-content: flex-start; height: var(--uib-size); width: var(--uib-size); } .cart-item-box .dot-spinner__dot { position: absolute; top: 0; left: 0; display: flex; align-items: center; justify-content: flex-start; height: 100%; width: 100%; } .cart-item-box .dot-spinner__dot::before { content: ""; height: 20%; width: 20%; border-radius: 50%; background-color: var(--uib-color); transform: scale(0); opacity: 0.5; animation: pulse0112 calc(var(--uib-speed) * 1.111) ease-in-out infinite; box-shadow: 0 0 20px rgba(18, 31, 53, 0.3); } .cart-item-box .dot-spinner__dot:nth-child(2) { transform: rotate(45deg); } .cart-item-box .dot-spinner__dot:nth-child(2)::before { animation-delay: calc(var(--uib-speed) * -0.875); } .cart-item-box .dot-spinner__dot:nth-child(3) { transform: rotate(90deg); } .cart-item-box .dot-spinner__dot:nth-child(3)::before { animation-delay: calc(var(--uib-speed) * -0.75); } .cart-item-box .dot-spinner__dot:nth-child(4) { transform: rotate(135deg); } .cart-item-box .dot-spinner__dot:nth-child(4)::before { animation-delay: calc(var(--uib-speed) * -0.625); } .cart-item-box .dot-spinner__dot:nth-child(5) { transform: rotate(180deg); } .cart-item-box .dot-spinner__dot:nth-child(5)::before { animation-delay: calc(var(--uib-speed) * -0.5); } .cart-item-box .dot-spinner__dot:nth-child(6) { transform: rotate(225deg); } .cart-item-box .dot-spinner__dot:nth-child(6)::before { animation-delay: calc(var(--uib-speed) * -0.375); } .cart-item-box .dot-spinner__dot:nth-child(7) { transform: rotate(270deg); } .cart-item-box .dot-spinner__dot:nth-child(7)::before { animation-delay: calc(var(--uib-speed) * -0.25); } .cart-item-box .dot-spinner__dot:nth-child(8) { transform: rotate(315deg); } .cart-item-box .dot-spinner__dot:nth-child(8)::before { animation-delay: calc(var(--uib-speed) * -0.125); } @keyframes pulse0112 { 0%, 100% { transform: scale(0); opacity: 0.5; } 50% { transform: scale(1); opacity: 1; } } .cart-item-box .btn-dk { color: #ee0033; text-transform: uppercase; text-decoration: none; border: 2.5px solid #ee0033; padding: 10px 20px; font-size: 30px; font-weight: bold; background: transparent; position: relative; transition: all 1s; overflow: hidden; justify-content: center; align-items: center; border-radius: 10px; box-shadow: 10px; } .cart-item-box .btn-dk-1 { color: #d82d8b; text-transform: uppercase; text-decoration: none; border: 2.5px solid #d82d8b; padding: 10px 20px; font-size: 30px; font-weight: bold; background: transparent; position: relative; transition: all 1s; overflow: hidden; justify-content: center; align-items: center; border-radius: 10px; box-shadow: 10px; } .btn-dk:hover { color: #d82d8b; } .btn-dk::before { content: ""; position: absolute; height: 100%; width: 0%; top: 0; left: -40px; transform: skewX(45deg); background-color: purple; z-index: -1; transition: all 1s; } .btn-dk:hover::before { width: 160%; } .color-title { color: #d82d8b; } .color-title-3 { color: #ee0033; } .total-course-cash { display: flex; flex-direction: column; } .total-course-cash-item { display: flex; align-items: center; margin-top: 6px; } .total-course-cash-item .total-course-cash-balance-lbl { font-size: 1.2rem; font-weight: 500; width: 40%; } .total-course-cash-item .total-course-cash-balance { color: black; font-size: 1.2rem; } .total-course-cash-item .total-course-cash-balance-1 { color: black; font-size: 1.2rem; } .total-course-cash-item .total-course-cash-balance-2 { color: black; font-size: 1.2rem; } .section-card-contact { margin-top: 14px; border: 1px solid #9e9b9b; margin-bottom: 14px; padding: 20px; border-radius: 4px; background-color: #fff; width: 500px; } .section-card-contact h2 { text-align: center; color: black; font-size: 1.2rem; font-weight: 500; } .section-card-contact h1 { text-align: center; font-size: 1.4rem; font-weight: 800; } .section-card-contact .section-card-contact-desc { margin-top: 6px; font-size: 1rem; color: #9e9b9b; text-align: center; } .header-cart { flex-basis: 5%; } .header-cart a { color: #0e0a38; font-size: 30px; position: relative; } .header-cart .cart-total-number-1 { position: absolute; right: -4px; top: 10px; background-color: #ff630e; color: #fff; border-radius: 50%; padding: 1px 5px; font-size: 13px; width: 18px; height: 20px; line-height: 20px; text-align: center; } .course-of-member-container { width: 30%; margin-top: 40px; } .course-of-member-container .course-of-member-inner { font-size: 1.2rem; font-weight: 500; border-radius: 4px; background-color: #fff; } .course-of-member-container .course-of-member-inner h2 { text-align: center; } .course-of-member-container .course-of-member-item { margin-top: 12px; padding: 4px; border-radius: 13px; background-color: #e0e0e0; } .course-of-member-container .course-of-member-item-inner { border-radius: 10px; padding: 6px; background-color: #fff; line-height: 1.4rem; } .course-of-member-container .course-of-member-item-inner p { font-size: 1rem; font-weight: 500; } .course-of-member-container .course-of-member-item-inner span { font-size: 0.9rem; font-weight: 400; } .modal-title-2 { margin: 0 auto; color: #ee0033; font-size: 25px; } .h1-success-1 { color: red; } .h1-success-2 { color: #FF6600; font-weight: bold; } .so-luong { position: relative; } .so-luong #so-luong-div { position: absolute; top: -24px; right: 2px; } .hidden-1 { display: none; } .card1-total-price-code { display: flex; align-items: center; margin: 10px 0; } .card1-total-price-code-input { border: 1px solid #fd7e14; border-radius: 4px; margin: 0 4px; padding-left: 4px; margin-left: 34px; } .card1-total-price-code-input:focus { outline: 1px solid #fd7e14; border: 1px solid #fd7e14; } .card1-total-price-code-input-refer { border: 1px solid #fd7e14; border-radius: 4px; margin: 0 4px; padding-left: 4px; } .card1-total-price-code-input-refer:focus { outline: 1px solid #fd7e14; border: 1px solid #fd7e14; } .fa-check-circle { color: green; } .total-course-icon-item-btn-viettel-pay:hover { cursor: not-allowed; } .total-course-icon-item-btn-viettel-pay { padding: 8px; background-color: transparent; } .total-course-icon-item-btn-viettel-pay .viettel-inner { margin-top: 4px; margin-left: 12px; } .bill-member { padding: 6px; border: 0.1px dashed black; border-radius: 6px; } .bill-member-item { display: flex; align-items: center; } .bill-member-item-price { margin-left: 10px; font-weight: 500; } .separator-bill { border-bottom: 1px solid black; } .card1-total-price-total-cost { position: absolute; bottom: 10px; right: 10px; } #quantity-courses-payment { margin: 0 4px; font-size: 1rem; font-weight: bold; color: #fd7e14; } .bill-member-item-price-2 { font-weight: bold; margin-left: 10px; } .bill-member-item-price-1 { margin-left: 10px; } .form-check-container { display: flex; align-items: center; justify-content: center; margin-top: 6px; } .icon-bst { padding: 1px; background-color: transparent; } .icon-bst:hover { opacity: 0.8; } .img-avatar { bottom: 0; left: 0; right: 0; top: 0; width: 139px; height: 140px; border-radius: 4px; object-fit: cover; width: 138px; } .bsmart-pay-number { margin-left: 6px; font-size: 1rem; font-weight: 600; color: #fd7e14; } .bill-bsmart-pay-number { display: none; } .bill-bsmart-pay-number { display: flex; align-items: center; } .bill-member-item-price-bsmart-pay-label { display: none; margin-right: 6px; } .text-success { color: #28a745 !important; } .info-people-buy { display: flex; align-items: center; } .info-people-buy-label { font-weight: 500 !important; margin-right: 88px; } .info-people-buy-label-phone { font-weight: 500 !important; margin-right: 20px; } .info-people-buy-label-email { font-weight: 500 !important; margin-right: 76px; } .icon-question-payment { margin-left: 6px; cursor: pointer; } .icon-question-payment:hover { color: #fd7e14; transition: all 0.2s; } .separator-policy { margin: 0 !important; } .title-slogan { text-align: left !important; font-size: 1rem; font-weight: 500; line-height: 1.3rem !important; } .modal-body-policy { display: flex; flex-direction: column; } .desc-temp { color: black !important; font-size: 0.86rem !important; font-weight: 400 !important; line-height: 1.1rem !important; margin-top: 12px; text-align: justify; } .name-primary { font-weight: bold; } .instruct-title { color: black !important; font-size: 0.9rem !important; font-weight: 500 !important; line-height: 1.1rem !important; margin-top: 12px; } .link-page-course { color: blue; } .link-page-course:hover { color: blue; } .step-1 { color: black !important; font-size: 0.9rem !important; font-weight: 500 !important; line-height: 1.1rem !important; margin-top: 6px; } #submitVoucher1 { font-size: 1rem; } #submitVoucher1:hover { opacity: 0.7; cursor: pointer; } .course-detail-wrapper { background-color: #fff; } .course-detail-wrapper .banner-course-detail { background: url(/assets/images/banner-2.jpg); background-size: cover; background-repeat: no-repeat; background-position: center; padding: 110px 0 100px; position: relative; } .course-detail-wrapper .banner-course-detail:before { content: ""; position: absolute; width: 100%; height: 100%; background: rgba(19, 15, 64, 0.8); top: 0; left: 0; right: 0; } .course-detail-wrapper .banner-course-detail .banner-content { position: relative; text-align: center; } .course-detail-wrapper .banner-course-detail .banner-content h1 { font-size: 49px; font-weight: 700; margin-bottom: 25px; color: #ff630e; } .course-detail-wrapper .banner-course-detail .banner-content p { color: #fff; font-size: 16px; line-height: 26px; } .course-detail-wrapper .banner-course-detail .banner-content p a { color: #fff; font-size: 16px; line-height: 26px; } .course-detail-wrapper .banner-course-detail .banner-content p a:hover { color: #ff630e; transition: all 0.3s; } .course-detail-wrapper .course-single-area { padding: 100px 0 70px; } .course-detail-wrapper .course-single-area .course-single-content .course-single-meta { display: flex; align-items: center; justify-content: space-between; } .course-detail-wrapper .course-single-area .course-single-content .course-single-meta .author { display: flex; align-items: center; } .course-detail-wrapper .course-single-area .course-single-content .course-single-meta .author img { max-width: 35px; border-radius: 50%; margin-right: 10px; } .course-detail-wrapper .course-single-area .course-single-content .course-single-meta .author span { color: #999; margin-right: 5px; } .course-detail-wrapper .course-single-area .course-single-content .course-single-meta .author strong { font-weight: 700; color: #0e0a38; } .course-detail-wrapper .course-single-area .course-single-content .course-single-meta .course-rating .testi-rating { display: inline-block; margin-right: 10px; } .course-detail-wrapper .course-single-area .course-single-content .course-single-meta .course-share { color: #0e0a38; cursor: pointer; } .course-detail-wrapper .course-single-area .course-single-content .course-single-meta .course-share i { margin-right: 5px; } .course-detail-wrapper .course-single-area .course-single-content .course-single-meta .course-share:hover { transition: all 0.3s; color: #ff630e; } .course-detail-wrapper .course-single-area .course-single-content .course-single-categories ul li a { display: inline-block; color: #999; font-size: 16px; border-radius: 4px; background-color: #f5f5f5; padding: 4px; margin: 0 2px 10px; } .size-font { margin-left: 2px; } .size-font-1 { margin-left: 2px; } .course-detail-wrapper .course-single-area .course-single-content .course-single-categories ul li a:hover { background: #ff630e; color: #fff; transition: all 0.3s; } .course-detail-wrapper .course-single-area .course-single-content .course-descriptions h3 { font-weight: 700; font-size: 20px; line-height: 30px; color: #130f40; margin-bottom: 10px; } .course-detail-wrapper .course-single-area .course-single-content .course-descriptions p { font-size: 16px; line-height: 26px; color: #999; margin-bottom: 1rem; text-align: justify; } .course-detail-wrapper .course-single-area .course-single-content .course-descriptions .info p { color: #ff630e; } .course-detail-wrapper .course-single-area .course-single-content .course-review h3 { font-weight: 700; font-size: 20px; line-height: 30px; color: #130f40; margin-bottom: 10px; } .course-detail-wrapper .course-single-area .course-single-content .course-review .review-content-inner { padding: 45px 50px; overflow: hidden; border-radius: 8px; border: 1px solid #dee2e6; } .course-detail-wrapper .course-single-area .course-single-content .course-review .review-content-inner .review-ratings { float: left; width: 30%; } .course-detail-wrapper .course-single-area .course-single-content .course-review .review-content-inner .review-ratings h2 { font-weight: 700; font-size: 65px; letter-spacing: 6px; margin-bottom: 30px; line-height: 55px; color: #0e0a38; } .course-detail-wrapper .course-single-area .course-single-content .course-review .review-content-inner .review-ratings span i { color: #ff630e; font-size: 20px; margin-right: 5px; } .course-detail-wrapper .course-single-area .course-single-content .course-review .review-content-inner .review-ratings p { margin: 15px 0 0; font-size: 16px; line-height: 26px; color: #999; } .course-detail-wrapper .course-single-area .course-single-content .course-review .review-content-inner .rating-bar { float: left; width: 70%; display: flex; -webkit-box-align: center; align-items: center; font-size: 14px; margin-top: 10px; margin-bottom: 10px; } .course-detail-wrapper .course-single-area .course-single-content .course-review .review-content-inner .rating-bar .rating-star { position: relative; } .course-detail-wrapper .course-single-area .course-single-content .course-review .review-content-inner .rating-bar .rating-star:before { content: "\f006"; font-family: "FontAwesome"; position: absolute; right: 15px; color: #ff630e; } .course-detail-wrapper .course-single-area .course-single-content .course-review .review-content-inner .rating-bar .rating-progress { background-color: #e3e5eb; height: 8px; width: 76%; border-radius: 4px; margin: 0 20px; position: relative; } .course-detail-wrapper .course-single-area .course-single-content .course-review .review-content-inner .rating-bar .rating-progress .rating-progress-value { background-color: #f4c150; position: absolute; height: 8px; width: 40%; left: 0; border-radius: 4px; } .course-detail-wrapper .course-single-area .course-single-content .course-feedback { margin-top: 20px; margin-bottom: 20px; } .course-detail-wrapper .course-single-area .course-single-content .course-feedback h3 { font-weight: 700; font-size: 20px; line-height: 30px; color: #130f40; margin-bottom: 15px; } .feedback-item { display: none; } #btn-show-more { display: none; padding: 4px; font-weight: 400 !important; } .course-detail-wrapper .course-single-area .course-single-content .course-feedback .course-feedback-inner .feedback-item { margin-bottom: 40px; } .course-detail-wrapper .course-single-area .course-single-content .course-feedback .course-feedback-inner .feedback-item .feedback-heading { display: flex; align-items: center; } .course-detail-wrapper .course-single-area .course-single-content .course-feedback .course-feedback-inner .feedback-item .feedback-heading .member-avatar img { width: 50px; height: 50px; border-radius: 50%; } .course-detail-wrapper .course-single-area .course-single-content .course-feedback .course-feedback-inner .feedback-item .feedback-heading .member-info { margin-left: 20px; } .course-detail-wrapper .course-single-area .course-single-content .course-feedback .course-feedback-inner .feedback-item .feedback-heading .member-info p { font-weight: 700; line-height: 1.2; font-size: 16px; } .course-detail-wrapper .course-single-area .course-single-content .course-feedback .course-feedback-inner .feedback-item .feedback-heading .member-info .testi-rating i { margin: 5px 2px 6px; } .course-detail-wrapper .course-single-area .course-single-content .course-feedback .course-feedback-inner .feedback-item .feedback-content { margin-top: 20px; font-weight: 400; line-height: 1.4; font-size: 16px; color: #999; } .course-detail-wrapper .course-single-area .course-single-content .course-feedback .course-feedback-inner .btn-outline-secondary-custom { padding: 10px 20px !important; } .course-detail-wrapper .course-single-area .course-single-content .course-my-feedback .btn-primary-custom { padding: 10px; font-size: 16px; } .course-detail-wrapper .course-single-area .course-sidebar { box-shadow: 0 0 30px rgba(51, 51, 51, 0.1); border-radius: 10px; margin-bottom: 20px; } .course-detail-wrapper .course-single-area .course-sidebar .course-banner img { width: 100%; height: 220px; border-radius: 10px; object-fit: cover; } .course-detail-wrapper .course-single-area .course-sidebar .course-price { font-weight: 700; font-size: 36px; color: #212327; padding: 25px px 30px 20px; display: inline-block; } .course-detail-wrapper .course-single-area .course-sidebar .course-enroll-btn a { border-radius: 5px; text-align: center; text-transform: uppercase; padding: 16px; font-weight: 700; letter-spacing: 1px; width: 100%; display: block; color: #fff; background-color: #ff630e; } .course-detail-wrapper .course-single-area .course-sidebar .course-enroll-btn a:hover { background-color: #0e0a38; transition: all 0.3s; } .title-class-info { font-weight: 700; font-size: 20px; line-height: 30px; color: #130f40; margin-bottom: 10px; } .list-class-info { position: relative; border: 1px solid #ccc; padding: 10px; border-radius: 4px; } .list-class-info-item-detail { display: flex; align-items: center; line-height: 1.4rem; } .list-class-info-item-detail .item-detail-label { font-size: 0.9rem; font-weight: 500; } .list-class-info-item-detail .item-detail-val { font-size: 0.9rem; color: #ff630e; margin-left: 6px; } .owl-nav { display: flex; align-items: center; justify-content: space-between; } .owl-prev span { position: absolute; top: 40px; left: -22px; font-size: 3.2rem; } .owl-prev span:hover { opacity: 0.8; color: #ff630e; transition: all 0.2s; } .owl-next span { position: absolute; top: 40px; right: -22px; font-size: 3.2rem; } .owl-next span:hover { opacity: 0.8; color: #ff630e; transition: all 0.2s; } .text-lotrinh-1 { font-weight: 700; font-size: 20px; line-height: 30px; color: #130f40; margin-bottom: 10px; } .text-ltkh-1 { font-weight: bold; } .card { border: none; margin-top: 10px; } .btn-btn-link { margin-left: 50px; color: black; } .course-enroll-btn mt-3 { display: flex; } .list-class-info-item-btn { display: flex; justify-content: flex-start; margin-top: 4px; } .option-info-class-btn { padding: 6px; border-radius: 4px; color: #fff; border: 1px solid #ff630e; background-color: #ff630e; } .option-info-class-btn:hover { opacity: 0.8; cursor: pointer; } /* Active + Non active*/ .otp-class-active { padding: 4px; border-radius: 6px; background-color: #80e880; } .otp-class-active-none { background-color: #fff; } /* Active + Non active*/ .option-info-class-btn-del { display: none; padding: 6px; border-radius: 4px; color: #fff; border: 1px solid red; background-color: red; } .icon-level { object-fit: cover; width: 70px; } .time-select { margin-left: 10px; width: 290px; } .submit-select { display: flex; justify-content: center; } .bt-submit { border: 1px solid #ff630e; text-transform: uppercase; border-radius: 5px; padding: 5px; font-weight: 700; color: #fff; background-color: #ff630e; } .bt-submit:hover { border: 1px solid #ff630e; opacity: 0.8; } .ms-4-1 { margin-left: 50px; } .scroll-fix-on-top { position: -webkit-sticky; position: sticky; top: 124px; padding: 10px; transition: all 0.2s; } .course-descriptions-inner { display: flex; align-items: center; justify-content: space-between; } .course-detail-cate-fe { display: flex; align-items: center; } .course-detail-cate-fe-link { background-color: #f5f5f5; color: #999; padding: 4px; margin-left: 6px; border-radius: 4px; } .course-detail-cate-fe-link:hover { background-color: #ff630e; color: #fff; cursor: pointer; transition: all 0.3s; } .course-detail-cate-online { display: flex; align-items: center; } .course-detail-cate-rate { position: relative; display: flex; align-items: center; } .icon-level-cate { position: absolute; left: 130px; width: 52px; height: 52px; object-fit: cover; } .container-list-class-info { margin-top: -10px; } .container-link-copy { display: flex; align-items: center; width: 100%; } .link-lbl { margin-right: 6px; } .copy-link { --height: 36px; margin-top: 15px; display: flex; flex: 1; } .copy-link-input { flex-grow: 1; padding: 0 8px; font-size: 14px; border: 1px solid #ff630e; border-right: none; outline: none; border-top-left-radius: 6px; border-bottom-left-radius: 6px; height: 40px; } .copy-link-input:hover { background: #eeeeee; } .copy-link-button { flex-shrink: 0; height: 40px; display: flex; align-items: center; justify-content: center; background: #ff630e; color: white; outline: none; border: 1px solid #ff630e; cursor: pointer; border-top-right-radius: 6px; border-bottom-right-radius: 6px; } .copy-link-button:hover { opacity: 0.8; } .btn-copy-link { font-size: 1rem; padding: 6px; } .price-cost-detail { position: absolute; top: 0; padding: 10px; border-radius: 10px; font-size: 1.4rem; font-weight: 600; color: #ff630e; background-color: #fff; box-shadow: 2px 2px gray; z-index: 2; } .icon-time { width: 10px !important; height: 10px !important; } .mark { display: flex; align-items: center; } .time p { font-size: 0.8rem; margin-left: 2px; } .mark p { font-size: 0.8rem; margin-left: 2px; } .mentor-detail-wrapper .banner-mentor-detail { width: 100%; padding: 110px 0 100px; background-image: url(/assets/images/banner-2.jpg); background-position: center; background-repeat: no-repeat; background-size: cover; display: flex; justify-content: center; align-items: center; position: relative; } .mentor-detail-wrapper .banner-mentor-detail:before { content: ""; position: absolute; width: 100%; height: 100%; background: rgba(19, 15, 64, 0.8); top: 0; left: 0; right: 0; } .mentor-detail-wrapper .banner-mentor-detail .banner-content { position: relative; text-align: center; } .mentor-detail-wrapper .banner-mentor-detail .banner-content h1 { font-size: 49px; font-weight: 700; margin-bottom: 25px; color: #ff630e; } .mentor-detail-wrapper .banner-mentor-detail .banner-content p { color: #fff; font-size: 16px; line-height: 26px; } .mentor-detail-wrapper .banner-mentor-detail .banner-content p a { color: #fff; font-size: 16px; line-height: 26px; } .mentor-detail-wrapper .banner-mentor-detail .banner-content p a:hover { color: #ff630e; transition: all 0.3s; } .mentor-detail-wrapper .content-info-mentor { padding: 100px 0; } .mentor-detail-wrapper .content-info-mentor .mentor-info { padding: 20px 20px 50px; box-shadow: 0px 0px 15px 0px rgba(51, 51, 51, 0.1); border-radius: 10px; text-align: center; } .mentor-detail-wrapper .content-info-mentor .mentor-info .mentor-img { background-image: url(/assets/images/overlay-bg.jpg); background-repeat: no-repeat; background-size: contain; padding: 50px 50px 30px; } .mentor-detail-wrapper .content-info-mentor .mentor-info .mentor-img img { object-fit: cover; margin-top: 20px; border-radius: 4px; width: 130px; height: 130px; } .mentor-detail-wrapper .content-info-mentor .mentor-info .mentor-details h4 { font-weight: 700; font-size: 22px; line-height: 32px; } .mentor-detail-wrapper .content-info-mentor .mentor-info .mentor-details p { font-size: 16px; line-height: 26px; color: #999; margin-bottom: 1rem; } .mentor-detail-wrapper .content-info-mentor .mentor-info .mentor-details .social-list { margin: 0; padding: 0; } .mentor-detail-wrapper .content-info-mentor .mentor-info .mentor-details .social-list li { display: inline-block; } .mentor-detail-wrapper .content-info-mentor .mentor-info .mentor-details .social-list li a { display: block; text-align: center; width: 35px; height: 35px; font-size: 16px; line-height: 38px; margin: 0 3px; color: #fff; background-color: #ff630e; border-radius: 4px; } .mentor-detail-wrapper .content-info-mentor .mentor-info .mentor-details .contact-info { padding: 30px 0 20px; } .mentor-detail-wrapper .content-info-mentor .mentor-info .mentor-details .contact-info li { margin: 0 30px; font-size: 16px; line-height: 22px; padding: 10px 0; color: #999; } .mentor-detail-wrapper .content-info-mentor .mentor-info .mentor-details .contact-info li span i { color: #ff630e; font-size: 14px; padding-right: 5px; } .mentor-detail-wrapper .content-info-mentor .about-mentor h3 { font-weight: 700; font-size: 36px; line-height: 46px; } .mentor-detail-wrapper .content-info-mentor .about-mentor p { font-size: 16px; line-height: 26px; color: black; text-align: justify; } .mentor-detail-wrapper .content-info-mentor .skill-rate { padding: 20px; } .mentor-detail-wrapper .content-info-mentor .skill-rate h3 { font-weight: 700; font-size: 36px; line-height: 46px; color: #0e0a38; margin-bottom: 0.5rem; } .mentor-detail-wrapper .content-info-mentor .skill-rate .skill-single { margin-bottom: 15px; } .mentor-detail-wrapper .content-info-mentor .skill-rate .skill-single .skill-level-text { float: right; } .mentor-detail-wrapper .content-info-mentor .experience h3 { font-weight: 700; font-size: 36px; line-height: 46px; color: #0e0a38; margin-bottom: 0.5rem; } .mentor-detail-wrapper .content-info-mentor .experience p { font-size: 16px; line-height: 26px; color: black; margin-bottom: 10px; } .mentor-detail-wrapper .content-info-mentor .mentor-profile-counter .counter-single { padding: 25px 20px 20px 20px; background-color: #f5f5f5; border-radius: 12px; } .mentor-detail-wrapper .content-info-mentor .mentor-profile-counter .counter-single .counter-number h2 { color: #ff630e; font-size: 50px; font-weight: 700; margin-bottom: 15px; } .mentor-detail-wrapper .content-info-mentor .mentor-profile-counter .counter-single .counter-title p { font-size: 20px; color: #0e0a38; } .mentor-detail-wrapper .content-info-mentor .courses { width: 100%; margin-top: 22px; } .mentor-detail-wrapper .content-info-mentor .courses h3 { font-weight: 700; font-size: 36px; line-height: 46px; } .main-courses-list .card-course-custom { width: 100%; } .main-courses-list .card-course-custom:hover { box-shadow: 0 0 10px rgba(51, 51, 51, 0.2); transition: all 0.3s; } .main-courses-list .card-course-custom .card-title { min-height: 40px; } .main-courses-list .card-course-custom .card-title a { color: #130f40; font-size: 24px; font-weight: 700; line-height: 30px; } .main-courses-list .card-course-custom .card-title a:hover { color: #ff630e; cursor: pointer; transition: all 0.3s; } .main-courses-list .card-course-custom .sub-title { color: #999; } .main-courses-list .card-course-custom .description { color: #0e0a38; margin-top: 10px; font-weight: 400; text-align: justify; width: 100%; overflow: hidden; text-overflow: ellipsis; line-height: 25px; -webkit-line-clamp: 3; height: 75px; display: -webkit-box; -webkit-box-orient: vertical; } .main-courses-list .card-course-custom .cost { color: #ff630e; font-size: 16px; font-weight: 500; } .main-courses-list .card-course-custom .add-to-cart i { font-size: 27px; } .main-courses-list .card-course-custom .add-to-cart:hover i { transition: all 0.3s; color: #ff630e; cursor: pointer; } .description-detail { color: #0e0a38; margin-top: 10px; font-weight: 400; text-align: justify; width: 100%; overflow: hidden; text-overflow: ellipsis; line-height: 25px; -webkit-line-clamp: 3; height: 75px; display: -webkit-box; -webkit-box-orient: vertical; } #name-course { font-weight: 700; font-size: 22px; line-height: 32px; color: black; } .contact-info li { display: flex; align-items: center; } .blog-wrapper .banner__blog { background-image: url(assetsimagesºnner-2.jpg); background-position: center; background-repeat: no-repeat; background-size: cover; padding: 110px 0 100px; position: relative; z-index: -2; } .blog-wrapper .banner__blog h2 { color: #ff630e; line-height: 30px; letter-spacing: 2px; font-weight: 700; margin-bottom: 20px; text-transform: uppercase; font-size: 49px; } .blog-wrapper .banner__blog p { font-size: 16px; line-height: 26px; color: #f5f5f5; text-transform: capitalize; } .blog-wrapper .banner__blog p a { color: #f5f5f5; transition: all 0.3s; } .blog-wrapper .banner__blog p a:hover { color: #ff630e; } .blog-wrapper .banner__blog:after { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: -1; background: rgba(5, 1, 51, 0.7); } .blog-wrapper .blog-area { background-color: #fff; } .blog-wrapper .blog-area .all-posts-wrap { padding-right: 40px; } .blog-wrapper .blog-area .all-posts-wrap .blog-posts { margin: 0 0 50px; } .blog-wrapper .blog-area .all-posts-wrap .blog-posts .blog-posts-meta { padding-bottom: 10px; } .blog-wrapper .blog-area .all-posts-wrap .blog-posts .blog-posts-meta ul { margin-top: 0; margin-bottom: 1rem; } .blog-wrapper .blog-area .all-posts-wrap .blog-posts .blog-posts-meta ul li { display: inline-block; } .blog-wrapper .blog-area .all-posts-wrap .blog-posts .blog-posts-meta ul li i { margin-right: 6px; font-size: 16px; color: #ff630e; } .blog-wrapper .blog-area .all-posts-wrap .blog-posts .blog-posts-meta ul li a { color: #696969; text-transform: uppercase; font-weight: 700; letter-spacing: 1px; font-size: 15px; margin-right: 15px; } .blog-wrapper .blog-area .all-posts-wrap .blog-posts h3 { margin-bottom: 10px; } .blog-wrapper .blog-area .all-posts-wrap .blog-posts h3 a { color: #0e0a38; font-weight: 700; font-size: 30px; line-height: 46px; } .blog-wrapper .blog-area .all-posts-wrap .blog-posts .entry-content p { font-size: 16px; line-height: 1.5; margin-bottom: 1rem; color: #999; text-align: justify; } .blog-wrapper .blog-area .all-posts-wrap .blog-pagination ul { margin-top: 0; margin-bottom: 1rem; } .blog-wrapper .blog-area .all-posts-wrap .blog-pagination ul li { display: inline-block; } .blog-wrapper .blog-area .all-posts-wrap .blog-pagination ul li a.active { background-color: #ff630e; color: #fff; } .blog-wrapper .blog-area .all-posts-wrap .blog-pagination ul li a { display: inline-block; background-color: #f7f7f7; color: #000; width: 50px; height: 50px; border-radius: 50%; line-height: 50px; } .blog-wrapper .blog-area .blog-sidebar .search-form { position: relative; padding: 30px 40px 40px; margin-bottom: 30px; border-radius: 10px; box-shadow: 0 0 15px rgba(51, 51, 51, 0.1); } .blog-wrapper .blog-area .blog-sidebar .search-form form input { width: 100%; height: 50px; border: 0; background-color: #f1f1f1; padding-left: 20px; border-radius: 5px; } .blog-wrapper .blog-area .blog-sidebar .search-form form button { position: absolute; right: 40px; top: 30px; height: 50px; width: 60px; border: 0; background-color: #ff630e; font-size: 20px; padding: 0 20px; border-radius: 0 5px 5px 0; color: #fff; } .blog-wrapper .blog-area .blog-sidebar .latest-post { padding-bottom: 20px; padding: 30px 40px 40px; margin-bottom: 30px; border-radius: 10px; -webkit-box-shadow: 0 0 15px rgba(51, 51, 51, 0.1); box-shadow: 0 0 15px rgba(51, 51, 51, 0.1); } .blog-wrapper .blog-area .blog-sidebar .latest-post h4 { color: #130f40; padding-bottom: 15px; font-weight: 700; font-size: 24px; } .blog-wrapper .blog-area .blog-sidebar .latest-post .recent-post-single { overflow: hidden; margin-bottom: 20px; } .blog-wrapper .blog-area .blog-sidebar .latest-post .recent-post-single .recent-post-cont h6 a { font-size: 1rem; color: #0e0a38; font-weight: 700; margin-bottom: 10px; } .blog-wrapper .blog-area .blog-sidebar .latest-post .recent-post-single .recent-post-cont .recent-post-date { color: #696969; } .blog-wrapper .blog-area .blog-sidebar .menu-list { padding-bottom: 20px; padding: 30px 40px 40px; margin-bottom: 30px; border-radius: 10px; box-shadow: 0 0 15px rgba(51, 51, 51, 0.1); } .blog-wrapper .blog-area .blog-sidebar .menu-list h4 { color: #0e0a38; padding-bottom: 15px; font-weight: 700; font-size: 24px; } .blog-wrapper .blog-area .blog-sidebar .menu-list ul li { padding: 0 0 15px; } .blog-wrapper .blog-area .blog-sidebar .menu-list ul li a { color: #999; } .blog-wrapper .blog-area .blog-sidebar .menu-list ul li a i { padding-right: 5px; color: #ff630e; } .blog-wrapper .blog-area .blog-sidebar .menu-list ul li a:hover { color: #ff630e; transition: all 0.3s; } .member-detail-wrapper .banner-member-detail { width: 100%; padding: 110px 0 100px; background-image: url(/assets/images/banner-2.jpg); background-position: center; background-repeat: no-repeat; background-size: cover; display: flex; justify-content: center; align-items: center; position: relative; } .member-detail-wrapper .banner-member-detail:before { content: ""; position: absolute; width: 100%; height: 100%; background: rgba(19, 15, 64, 0.8); top: 0; left: 0; right: 0; } .member-detail-wrapper .banner-member-detail .banner-content { position: relative; text-align: center; } .member-detail-wrapper .banner-member-detail .banner-content h1 { font-size: 49px; font-weight: 700; margin-bottom: 25px; color: #ff630e; } .member-detail-wrapper .banner-member-detail .banner-content p { color: #fff; font-size: 16px; line-height: 26px; } .member-detail-wrapper .banner-member-detail .banner-content p a { color: #fff; font-size: 16px; line-height: 26px; } .member-detail-wrapper .banner-member-detail .banner-content p a:hover { color: #ff630e; transition: all 0.3s; } .member-detail-wrapper .content-info-mentor { padding: 100px 0; } .member-detail-wrapper .content-info-mentor .member-info { padding: 20px 20px 50px; box-shadow: 0px 0px 15px 0px rgba(51, 51, 51, 0.1); border-radius: 10px; text-align: center; } .member-detail-wrapper .content-info-mentor .member-info .member-img { background-image: url(/assets/images/overlay-bg.jpg); background-repeat: no-repeat; background-size: contain; padding: 50px 73px 30px; } .member-detail-wrapper .content-info-mentor .member-info .member-img img { object-fit: cover; margin-top: 20px; border-radius: 4px; width: 130px; height: 130px; } .member-detail-wrapper .content-info-mentor .member-info .member-details h4 { font-weight: 700; font-size: 22px; line-height: 32px; } .member-detail-wrapper .content-info-mentor .member-info .member-details p { font-size: 16px; line-height: 26px; color: #999; margin-bottom: 1rem; } .member-detail-wrapper .content-info-mentor .member-info .member-details .social-list { margin: 0; padding: 0; } .member-detail-wrapper .content-info-mentor .member-info .member-details .social-list li { display: inline-block; } .member-detail-wrapper .content-info-mentor .member-info .member-details .social-list li a { display: block; text-align: center; width: 35px; height: 35px; font-size: 16px; line-height: 38px; margin: 0 3px; color: #fff; background-color: #ff630e; border-radius: 4px; } .member-detail-wrapper .content-info-mentor .member-info .member-details .contact-info { padding: 30px 0 20px; } .member-detail-wrapper .content-info-mentor .member-info .member-details .contact-info li { margin: 0 30px; font-size: 16px; line-height: 22px; padding: 10px 0; color: #999; } .member-detail-wrapper .content-info-mentor .member-info .member-details .contact-info li span i { color: #ff630e; font-size: 14px; padding-right: 5px; } .member-detail-wrapper .content-info-mentor .member-info .member-details .contact-info li .current-amount { color: #ff630e; } .member-detail-wrapper .content-info-mentor .member-operation { box-shadow: 0px 0px 15px 0px rgba(51, 51, 51, 0.1); border-radius: 10px; padding: 20px 20px; word-break: break-word; } .member-detail-wrapper .content-info-mentor .member-operation h4 { font-size: 20px; font-weight: 500; margin: 0 0 8px; color: #0e0a38; } .member-detail-wrapper .content-info-mentor .member-operation p { font-size: 16px; color: #999; } .member-detail-wrapper .content-info-mentor .member-operation span { display: block; margin-top: 5px; color: #ff630e; } .member-detail-wrapper .content-info-mentor .table-wallet-container .table-wallet { width: 100%; } .member-detail-wrapper .content-info-mentor .table-wallet-pagination { text-align: center; } .member-detail-wrapper .content-info-mentor .table-wallet-pagination ul li { display: inline-block; } .member-detail-wrapper .content-info-mentor .table-wallet-pagination ul li a.active { background-color: #ff630e; color: #fff; } .member-detail-wrapper .content-info-mentor .table-wallet-pagination ul li a { display: inline-block; background-color: #f5f5f5; color: #000; width: 50px; height: 50px; text-align: center; line-height: 50px; border-radius: 50%; } .member-detail-wrapper .content-info-mentor .table-wallet-pagination ul li a:hover { background-color: #ff630e; color: #fff; } .member-detail-wrapper .content-info-mentor .courses h3 { font-weight: 700; font-size: 36px; line-height: 46px; } .member-detail-wrapper .content-info-mentor .courses .course-card { width: 100%; } .member-detail-wrapper .content-info-mentor .courses .course-card .card-img-top { width: 100%; height: 210px; } .member-detail-wrapper .content-info-mentor .courses .course-card .card-body { padding: 30px 35px; } .member-detail-wrapper .content-info-mentor .courses .course-card .card-body .card-price { color: #ff630e; font-size: 24px; font-weight: 700; } .member-detail-wrapper .content-info-mentor .courses .course-card .card-body .card-title { color: #0e0a38; margin: 6px 0 15px; font-size: 24px; font-weight: 700; line-height: 34px; } .member-detail-wrapper .content-info-mentor .courses .course-card .card-body .skill-single .progress { width: 100%; } .member-detail-wrapper .content-info-mentor .courses .course-card .card-body .skill-single .progress .progress-bar { background-color: #ff630e; } .member-detail-wrapper .content-info-mentor .courses .course-card .card-body .course-info-current p { display: flex; justify-content: space-between; color: #0e0a38; font-weight: 400; margin-bottom: 5px; } .member-detail-wrapper .content-info-mentor .courses .course-card .card-body .course-info-current p span { color: #ff630e; } .member-detail-wrapper .edit-content { padding: 100px 0; } .member-detail-wrapper .edit-content form h3 { font-size: 25px; font-weight: 500; color: #0e0a38; } .member-detail-wrapper .edit-content form .sub-title { display: block; margin-bottom: 5px; color: #999; } .header-contact-info-mem-detail ul { display: flex; align-items: center; margin-left: -44px; color: #fff; } .header-contact-info-mem-detail ul li { display: flex; align-items: center; } .wrapper { background-color: #fff; } .wrapper .courses-profile h3 { font-weight: 700; font-size: 1.4rem; } .wrapper .contact-info { display: flex; flex-direction: column; align-items: center; } .wrapper .contact-info li { display: flex; align-items: center; } .wrapper .card-course-custom { border-radius: 8px; box-shadow: 0 0 8px 0 #bcb8b8; } .wrapper .card-course-custom:hover { box-shadow: 0 0 18px 0 #bcb8b8; } .wrapper .card-img-top { border-radius: 8px; } .wrapper .title-name-course { color: #130f40; font-size: 24px; font-weight: 700; line-height: 30px; } .wrapper .sub-title { color: black; font-size: 16px; font-weight: 500; margin-bottom: 10px; } .wrapper .history-payment-container h3 { font-weight: 700; font-size: 1.4rem; } .wrapper #example_paginate, .wrapper #historyMentorProfile_paginate { display: flex; align-items: center; justify-content: flex-end; } .wrapper #example_previous { margin-right: 12px; cursor: pointer; } .wrapper #example_previous:hover { opacity: 0.9; color: #ff630e; transition: all 0.3s; } .wrapper #example_next { margin-left: 12px; cursor: pointer; } .wrapper #example_next:hover { opacity: 0.9; color: #ff630e; transition: all 0.3s; } .wrapper .paginate_button { padding: 0 4px; cursor: pointer; } .wrapper .paginate_button:hover { opacity: 0.9; color: #ff630e; transition: all 0.3s; } .header-contact-info-edit-profile ul, .header-contact-info-member-pro ul { display: flex; align-items: center; margin-left: -44px; color: #fff; } .header-contact-info-edit-profile ul li, .header-contact-info-member-pro ul li { display: flex; align-items: center; } .wrapper .paginate_button.current { color: #ff630e !important; background-color: #e4e2e2; border-radius: 4px; font-weight: 500; } .description { flex: 1; } .info-1 { display: flex; flex-direction: column; } .icon-gmail-1 { width: 42px; height: 42px; object-fit: cover; margin-left: 10px; margin-right: 14px; } body { background-color: #fff; } .annotation-wrapper .banner__annotation { background-image: url(/assets/images/banner-2.jpg); background-position: center; background-repeat: no-repeat; background-size: cover; padding: 110px 0 100px; position: relative; z-index: -2; } .annotation-wrapper .banner__annotation h2 { color: #ff630e; line-height: 30px; letter-spacing: 2px; font-weight: 700; margin-bottom: 20px; text-transform: uppercase; font-size: 49px; } .annotation-wrapper .banner__annotation p { font-size: 16px; line-height: 26px; color: #f5f5f5; } .annotation-wrapper .banner__annotation p a { color: #f5f5f5; transition: all 0.3s; } .annotation-wrapper .banner__annotation p a:hover { color: #ff630e; } .annotation-wrapper .banner__annotation:after { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: -1; background: rgba(5, 1, 51, 0.7); } .annotation-wrapper .section2-annotation { padding-top: 20px; margin-bottom: 20px; } .annotation-wrapper .section2-annotation .box-annottation { background-color: #E8E7EC; border-radius: 8px; padding: 3px 20px; -webkit-box-shadow: 0 0 15px rgba(51, 51, 51, 0.1); box-shadow: 0 0 15px rgba(51, 51, 51, 0.1); } .annotation-wrapper .section2-annotation .box-annottation button { height: 25px; margin-right: 1px; border-radius: 8px; margin-bottom: 10px; margin-left: 10px; background-color: #ff630e; color: aliceblue; border: 0px solid; } .annotation-wrapper .section2-annotation .box-annottation h3 { margin-left: 5px; padding: 4px 4px; color: #ff630e; line-height: 30px; letter-spacing: 2px; font-weight: 700; margin-bottom: -5px; text-transform: uppercase; font-size: 28px; } .annotation-wrapper .section2-annotation .box-annottation .box-content-annatation { margin-top: 20px; margin-bottom: 5px; -webkit-box-shadow: 0 0 15px rgba(51, 51, 51, 0.1); box-shadow: 0 0 15px rgba(51, 51, 51, 0.1); border-radius: 8px; } .annotation-wrapper .section2-annotation .box-annottation .box-content-annatation .img-annotation { background-color: white; padding-top: 15px; padding-left: 20px; } .annotation-wrapper .section2-annotation .box-annottation .box-content-annatation .img-annotation img { float: left; background-color: aquamarine; width: 56px; height: 56px; border-radius: 50%; } .annotation-wrapper .section2-annotation .box-annottation .box-content-annatation .content-annotation { background-color: white; padding-left: 70px; padding-bottom: 20px; margin-bottom: 20px; } .annotation-wrapper .section2-annotation .box-annottation .box-content-annatation .content-annotation .title { padding-left: 20px; line-height: 15px; color: #ff630e; font-weight: 600; letter-spacing: 2px; text-transform: uppercase; font-size: 16px; } .annotation-wrapper .section2-annotation .box-annottation .box-content-annatation .content-annotation .content { padding-top: 10px; padding-left: 20px; line-height: 20px; color: black; font-size: 16px; margin-right: 4px; } .annotation-wrapper .section2-annotation .box-annottation .box-content-annatation .content-annotation .timeDate { padding-left: 15px; padding-top: 10px; color: gray; font-size: 14px; } .time-minus { padding-top: 10px; color: gray; font-size: 14px; margin-left: 12px; } .annotation-wrapper .section2-annotation .box-annottation .box-content-annatation:hover { border-radius: 8px; background-color: #0e0a38; } .annotation-wrapper .section2-annotation .box-annottation .box-content-annatation:hover .content { color: #bebebe; } .annotation-wrapper .section2-annotation .box-annottation .box-content-annatation:hover .title { color: #bebebe; } .annotation-wrapper .section2-annotation .box-annottation .box-content-annatation:hover .timeDate { color: #bebebe; } .annotation-wrapper .section2-annotation .btn-showmore { margin-top: 20px; text-align: center; } .annotation-wrapper .section2-annotation .btn-showmore button { border-radius: 8px; height: 30px; background-color: #ff630e; color: white; border: 0px solid; padding: 5px; } .icon-shopping-cart { width: 62px; height: 62px; object-fit: cover; } .icon-logo { width: 190px; height: 75px; object-fit: cover; } .bt-1 { /* margin-top: 50px; */ float: left; } .wrapper { position: relative; height: 100%; } .first { background-color: #403c64; position: absolute; top: 0; left: 0; background-size: 100%; padding: 10px; border-top-left-radius: 10px; border-top-right-radius: 10px; /* display: flex; */ } .separator1-bill { border-bottom: 1px solid white; margin-top: 20px; } .header-contact-info-contact-info ul { display: flex; align-items: center; margin-left: -44px; color: #fff; } .header-contact-info-contact-info ul li { display: flex; align-items: center; } .course-pagination { margin-top: 20px; } .course-pagination ul li { display: inline-block; margin-right: 10px; } .course-pagination ul li .active { background-color: #ff630e; color: #fff; } .course-pagination ul li a { width: 100%; height: 100%; display: block; text-align: center; width: 40px; height: 40px; line-height: 40px; color: #000; background: #f5f5f5; border-radius: 50%; } .blog-detail-wrapper .banner__blog-detail { background-image: url(/assets/images/banner-2.jpg); background-position: center; background-repeat: no-repeat; background-size: cover; padding: 110px 0 100px; position: relative; z-index: -2; } .blog-detail-wrapper .banner__blog-detail::before { content: ""; position: absolute; width: 100%; height: 100%; background: rgba(19, 15, 64, 0.8); top: 0; left: 0; right: 0; } .blog-detail-wrapper .blog-detail-wrapper .banner__blog-detail h2 { color: #ff630e; line-height: 30px; letter-spacing: 2px; font-weight: 700; margin-bottom: 20px; text-transform: uppercase; font-size: 49px; } .blog-detail-wrapper .banner-content { position: relative; } .blog-detail-wrapper .banner-content h1 { font-size: 60px; line-height: 70px; margin-bottom: 25px; color: #ff630e; font-weight: 700; } .blog-detail-wrapper .banner-content p { color: #fff; } .blog-detail-wrapper .banner-content a { color: #fff; padding-right: 10px; } .blog-detail-wrapper .banner-content span { padding-right: 10px; } .blog-detail-wrapper .blog-area { background-color: #fff; padding: 90px 0 100px; } .blog-detail-wrapper .blog-post-single { -webkit-box-shadow: 0 0 15px rgba(0, 0, 0, 0.1); box-shadow: 0 0 15px rgba(0, 0, 0, 0.1); border-radius: 5px; -webkit-transition: 0.5s; transition: 0.5s; } .blog-detail-wrapper .blog-post-single:hover { -webkit-box-shadow: 0 10px 40px rgba(0, 0, 0, 0.1); box-shadow: 0 10px 40px rgba(0, 0, 0, 0.1); } .blog-detail-wrapper .blog-post-content { padding: 30px 20px 15px; } .blog-detail-wrapper .blog-post-content h3 a { font-size: 26px; font-weight: 700; margin: 0 0 10px; text-transform: capitalize; color: #130f40; } .blog-detail-wrapper .blog-post-content h3 a:hover { color: #ff630e; } .blog-detail-wrapper .post-meta { margin-bottom: 15px; } .blog-detail-wrapper .post-media img { border-radius: 5px 5px 0 0; } .blog-detail-wrapper .post-meta li { display: inline-block; margin-right: 15px; } .blog-detail-wrapper .post-meta li a i { font-size: 15px; color: #ff630e; } .blog-detail-wrapper .post-meta span { margin-left: 8px; text-transform: uppercase; font-size: 14px; font-weight: 700; line-height: 20px; letter-spacing: 1px; color: #696969; } .blog-detail-wrapper .post-meta span:hover { color: #ff630e; } .blog-detail-wrapper .blog-area.two { padding: 100px 0; } .blog-detail-wrapper .widget { padding: 30px 40px 40px; margin-bottom: 30px; border-radius: 10px; -webkit-box-shadow: 0 0 15px rgba(51, 51, 51, 0.1); box-shadow: 0 0 15px rgba(51, 51, 51, 0.1); } .blog-detail-wrapper .search-form { position: relative; } .blog-detail-wrapper .search-form input { width: 100%; height: 55px; border: 0; background-color: #f1f1f1; padding-left: 20px; border-radius: 5px; } .blog-detail-wrapper .search-form button { position: absolute; right: 40px; top: 30px; height: 55px; width: 60px; border: 0; background-color: #ff630e; font-size: 20px; padding: 0 20px; border-radius: 0 5px 5px 0; color: #fff; } .blog-detail-wrapper .search-form button:hover { background-color: #130f40; } .blog-detail-wrapper .widget h4 { color: #130f40; padding-bottom: 15px; font-weight: 700; font-size: 24px; } .blog-detail-wrapper .latest-post.widget { padding-bottom: 20px; } .blog-detail-wrapper .recent-post-single { overflow: hidden; margin-bottom: 20px; } .blog-detail-wrapper .recent-post-thumb.two img { margin: 0; } .blog-detail-wrapper .recent-post-cont.two { padding: 0 0 0 20px; } .blog-detail-wrapper .recent-post-cont.two a { color: #130f40; font-weight: 700; } .blog-detail-wrapper .recent-post-cont.two span { color: #696969; } .blog-detail-wrapper .menu-services-icon.two { margin: 0 0 0 15px; } .blog-detail-wrapper .widget-list li { padding: 0 0 15px; } .blog-detail-wrapper .widget-list li a { color: #696969; } .blog-detail-wrapper .widget-list li i { color: #ff630e; padding-right: 5px; } .blog-detail-wrapper .menu-list.widget { padding-bottom: 20px; } .blog-detail-wrapper .widget-list li a:hover { color: #ff630e; } .blog-detail-wrapper .all-posts-wrap { padding-right: 40px; } .blog-detail-wrapper .blog-posts { margin: 0 0 100px; } .blog-detail-wrapper .blog-posts h3 { margin-bottom: 15px; } .blog-detail-wrapper .blog-post-thumb img { margin-bottom: 30px; border-radius: 5px; overflow: hidden; } .blog-detail-wrapper .blog-posts-meta { padding-bottom: 10px; } .blog-detail-wrapper .blog-posts-meta ul li i { margin-right: 6px; font-size: 16px; color: #ff630e; } .blog-detail-wrapper .blog-posts-meta ul li { display: inline-block; } .blog-detail-wrapper .blog-posts-meta ul li a { color: #696969; text-transform: uppercase; font-weight: 700; letter-spacing: 1px; font-size: 15px; margin-right: 15px; } .blog-detail-wrapper .blog-posts-meta ul li a:hover { color: #ff630e; } .blog-detail-wrapper .blog-posts h3 a { color: #130f40; font-weight: 700; font-size: 36px; line-height: 46px; } .blog-detail-wrapper .blog-posts h3 a:hover { color: #ff630e; } .blog-detail-wrapper .blog-area.two p { line-height: 1.8; } .blog-detail-wrapper .blog-posts.two { margin: 0 30px 0 0; } .blog-detail-wrapper .omexo-post-btn { margin: 30px 0 0; overflow: hidden; } .blog-detail-wrapper .omexo-post-btn a { font-weight: 700; font-size: 16px; text-transform: uppercase; line-height: 26px; letter-spacing: 1px; background-color: #ff630e; border-radius: 4px; padding: 14px 30px; margin-left: 17rem; color: #fff; display: inline-block; } .blog-detail-wrapper .omexo-post-btn a:hover { background-color: #130f40; } .blog-detail-wrapper .blog-pagination li { display: inline-block; } .blog-detail-wrapper .blog-pagination li a, .blog-detail-wrapper .blog-pagination li span { width: 55px; height: 55px; background-color: #f7f7f7; display: block; border: 1px solid #e6f0fa; border-radius: 5px; font-weight: 500; line-height: 55px; font-size: 16px; margin: 0 5px; } .blog-detail-wrapper .blog-pagination li i { font-size: 20px; } .blog-detail-wrapper .blog-pagination li a:hover, .blog-detail-wrapper .blog-pagination li span { border-color: #ff630e; background-color: #ff630e; color: #fff; } .blog-detail-wrapper .feature-page.two { margin: 0 250px; } .blog-detail-wrapper .entry-content h1 { margin-top: 24px; margin-bottom: 14px; font-size: 24px; font-weight: 700; } .blog-detail-wrapper .entry-content h3 { font-size: 28px; font-weight: 700; margin: 30px 0 15px; } .blog-detail-wrapper .block-quote { background-color: #f5f5f5; border: 0; padding: 25px 30px 35px; margin: 35px 0; } .blog-detail-wrapper .block-quote i { color: #dedede; font-size: 30px; font-style: italic; line-height: 40px; } .blog-detail-wrapper .block-quote p { margin: 0 0 8px; font-style: italic; line-height: 1.8; } .blog-detail-wrapper .block-quote h6 { color: #ff630e; font-size: 18px; font-weight: 700; } .blog-detail-wrapper .blog-post-thumb.two { margin: 0 30px 0 0; } .blog-detail-wrapper .blog-post-thumb.two h2 { margin-top: 22px; margin-bottom: 14px; font-size: 16px; font-weight: 700; } .blog-detail-wrapper .blog-post-thumb.two ul li { padding-bottom: 8px; line-height: 28px; font-weight: 400; font-size: 16px; color: #696969; } .blog-detail-wrapper .entry-footer { margin-top: 15px; padding-top: 30px; border-top: 1px solid #ddd; position: relative; } .blog-detail-wrapper .post-tags { font-size: 16px; font-weight: 500; color: #130f40; font-family: "Rubik", sans-serif; padding-right: 20px; } .blog-detail-wrapper .post-tag a { display: inline-block; background-color: #ff630e; color: #fff; font-size: 13px; padding: 0px 12px; border-radius: 4px; margin-right: 0; margin-left: 8px; } .blog-detail-wrapper .entry-footer ul { position: absolute; top: 26px; left: 56px; } .blog-detail-wrapper .entry-footer ul li { display: inline-block; margin-right: 10px; } .blog-detail-wrapper .entry-footer ul li a { display: inline-block; background-color: #ff630e; color: #fff; font-size: 13px; padding: 6px 12px; border-radius: 4px; } .blog-detail-wrapper .comment-form input { height: 50px; } .blog-detail-wrapper .comment-respond { margin-top: 60px; } .blog-detail-wrapper .comment-respond h4 { font-size: 24px; font-weight: 700; color: #130f40; } .blog-detail-wrapper .comment-respond p { margin-bottom: 28px; } .blog-detail-wrapper .comment-respond form { font-size: 16px; line-height: 28px; color: #696969; } .member-detail-wrapper .mentor-profile-edit-content { padding: 20px; } .member-detail-wrapper .mentor-profile-edit-content label { color: #0e0a38; font-weight: 500; } .member-detail-wrapper .mentor-profile-edit-content .form-group-custome { border: 1px solid #ccc; padding: 20px; border-radius: 10px; margin-bottom: 20px; } .member-detail-wrapper .mentor-profile-edit-content .form-group-custome h3 { font-weight: 700; font-size: 36px; line-height: 46px; } .member-detail-wrapper .mentor-profile-edit-content .avatar_img { width: 200px; height: 200px; object-fit: cover; } .member-detail-wrapper .mentor-profile-edit-content .id-card-warpper .card-id-custom img { height: 220px; } .header-contact-info-mentor-pro-edit ul { display: flex; align-items: center; margin-left: -44px; color: #fff; } .header-contact-info-mentor-pro-edit ul li { display: flex; align-items: center; } .withdraw-wrapper .banner__withdraw { background-image: url(/assets/images/banner-2.jpg); background-position: center; background-repeat: no-repeat; background-size: cover; padding: 110px 0 100px; position: relative; z-index: -2; } .withdraw-wrapper .banner__withdraw h2 { color: #ff630e; line-height: 30px; letter-spacing: 2px; font-weight: 700; margin-bottom: 20px; text-transform: uppercase; font-size: 49px; } .withdraw-wrapper .banner__withdraw p { font-size: 16px; line-height: 26px; color: #f5f5f5; } .withdraw-wrapper .banner__withdraw p a { color: #f5f5f5; transition: all 0.3s; } .withdraw-wrapper .banner__withdraw p a:hover { color: #ff630e; } .withdraw-wrapper .banner__withdraw:after { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: -1; background: rgba(5, 1, 51, 0.7); } .withdraw-wrapper .section2 { padding-top: 20px; margin-bottom: 20px; } .withdraw-wrapper .section2 .from-withdraw { border-radius: 8px; padding: 20px 20px; -webkit-box-shadow: 0 0 15px rgba(51, 51, 51, 0.1); box-shadow: 0 0 15px rgba(51, 51, 51, 0.1); } .withdraw-wrapper .section2 .from-withdraw h3 { color: #ff630e; line-height: 30px; text-align: center; font-weight: 700; margin-bottom: 20px; text-transform: uppercase; font-size: 24px; } .withdraw-wrapper .section2 .from-withdraw label { width: 100%; padding-bottom: 10px; color: black; line-height: 30px; font-weight: 500; font-size: 20px; } .withdraw-wrapper .section2 .from-withdraw .money { color: #ff630e; padding-left: 5px; font-weight: 700; font-size: 24px; } .withdraw-wrapper .section2 .from-withdraw .inputWithIcon { position: relative; padding-bottom: 10px; } .withdraw-wrapper .section2 .from-withdraw .inputWithIcon input[type=text] { padding-left: 50px; } .withdraw-wrapper .section2 .from-withdraw .inputWithIcon i { position: absolute; left: 20px; top: 10px; color: #aaa; } .withdraw-wrapper .section2 .from-withdraw input[type=text] { padding-left: 20px; } .withdraw-wrapper .section2 .from-note { margin-top: 70px; border-radius: 8px; padding: 20px 20px; -webkit-box-shadow: 0 0 15px rgba(51, 51, 51, 0.1); box-shadow: 0 0 15px rgba(51, 51, 51, 0.1); } .withdraw-wrapper .section2 .from-note h4 { color: #ff630e; line-height: 30px; letter-spacing: 2px; font-weight: 700; margin-bottom: 20px; text-transform: uppercase; font-size: 24px; } .withdraw-wrapper .section2 .from-note p { color: gray; margin-bottom: 20px; font-size: 16px; } .withdraw-wrapper .section2 .from-note p b { font-weight: 700; } .create-course-wrapper .mentor-add-course .add-course-form { color: #0e0a38; } .create-course-wrapper .mentor-add-course .add-course-form .image-container { position: relative; } .create-course-wrapper .mentor-add-course .add-course-form .image-container #frameImageCourse { max-height: 260px; border-radius: 10px; } .create-course-wrapper .mentor-add-course .add-course-form .image-container .loading { position: absolute; top: 0; left: 0; right: 0; width: 100%; height: 100%; display: none; align-items: center; justify-content: center; background: rgba(255, 255, 255, 0.7); } .sup-autocom { background-color: #fff; width: 100%; } .sup-autocom.active input { border-radius: 5px 5px 0 0; } .sup-autocom.active .autocom-box { padding: 10px 8px; } .autocom-box { padding: 10px 8px; max-height: 280px; overflow-y: auto; border-bottom-left-radius: 4px; border-bottom-right-radius: 4px; } .sup-autocom.active .autocom-box li { display: block; } .autocom-box li { list-style: none; padding: 8px 12px; display: none; width: 100%; cursor: default; border-radius: 3px; } .autocom-box li:hover { background: #efefef; } .tag1-sup-autocom { position: relative; } .tag1-autocom-box { position: absolute; top: 42px; background-color: #fff; z-index: 10; padding: 10px 8px; max-height: 280px; overflow-y: auto; border-bottom-left-radius: 4px; border-bottom-right-radius: 4px; } .tag1-sup-autocom.active .tag1-autocom-box li { display: block; } .tag1-autocom-box li { list-style: none; padding: 8px 12px; display: none; width: 100%; cursor: default; border-radius: 3px; } .tag1-autocom-box li:hover { background: #efefef; } .tag2-sup-autocom { position: relative; } .tag2-autocom-box { position: absolute; top: 42px; background-color: #fff; z-index: 10; padding: 10px 8px; max-height: 280px; overflow-y: auto; border-bottom-left-radius: 4px; border-bottom-right-radius: 4px; } .tag2-sup-autocom.active .tag2-autocom-box li { display: block; } .tag2-autocom-box li { list-style: none; padding: 8px 12px; display: none; width: 100%; cursor: default; border-radius: 3px; } .tag2-autocom-box li:hover { background: #efefef; } .tag3-sup-autocom { position: relative; } .tag3-autocom-box { position: absolute; top: 42px; background-color: #fff; z-index: 10; padding: 10px 8px; max-height: 280px; overflow-y: auto; border-bottom-left-radius: 4px; border-bottom-right-radius: 4px; } .tag3-sup-autocom.active .tag3-autocom-box li { display: block; } .tag3-autocom-box li { list-style: none; padding: 8px 12px; display: none; width: 100%; cursor: default; border-radius: 3px; } .tag3-autocom-box li:hover { background: #efefef; } .tag4-sup-autocom { position: relative; } .tag4-autocom-box { position: absolute; top: 42px; background-color: #fff; z-index: 10; padding: 10px 8px; max-height: 280px; overflow-y: auto; border-bottom-left-radius: 4px; border-bottom-right-radius: 4px; } .tag4-sup-autocom.active .tag4-autocom-box li { display: block; } .tag4-autocom-box li { list-style: none; padding: 8px 12px; display: none; width: 100%; cursor: default; border-radius: 3px; } .tag4-autocom-box li:hover { background: #efefef; } .tag5-sup-autocom { position: relative; } .tag5-autocom-box { position: absolute; top: 42px; background-color: #fff; z-index: 10; padding: 10px 8px; max-height: 280px; overflow-y: auto; border-bottom-left-radius: 4px; border-bottom-right-radius: 4px; } .tag5-sup-autocom.active .tag5-autocom-box li { display: block; } .tag5-autocom-box li { list-style: none; padding: 8px 12px; display: none; width: 100%; cursor: default; border-radius: 3px; } .tag5-autocom-box li:hover { background: #efefef; } .tag6-sup-autocom { position: relative; } .tag6-autocom-box { position: absolute; top: 42px; background-color: #fff; z-index: 10; padding: 10px 8px; max-height: 280px; overflow-y: auto; border-bottom-left-radius: 4px; border-bottom-right-radius: 4px; } .tag6-sup-autocom.active .tag6-autocom-box li { display: block; } .tag6-autocom-box li { list-style: none; padding: 8px 12px; display: none; width: 100%; cursor: default; border-radius: 3px; } .tag6-autocom-box li:hover { background: #efefef; } .course-route-title-name { font-size: 18px; font-weight: bold; margin-bottom: 22px; } #titleModule { color: #0d6efd; border: 1px solid #fff; border-radius: 4px; padding: 6px; margin: 6px; margin-top: 22px; font-weight: bold; } #titleModule:focus { outline: none; color: #212529; background-color: #fff; border-color: #86b7fe; outline: 0; box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25); } #contentModule { border: 1px solid #fff; border-radius: 4px; } #contentModule:focus { outline: none; color: #212529; background-color: #fff; border-color: #86b7fe; outline: 0; box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25); } .createChild { border: none; outline: none; background-color: transparent; } .createChild:hover { color: #ff630e; cursor: pointer; transition: all 0.3s; } .select2:hover { background-color: #fff; border-color: #86b7fe; outline: 0; box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25); border-radius: 4px; } .nested { display: none; } .active { display: block; } .closeIT { border: none; outline: none; margin: 10px; font-weight: 450; background-color: transparent; } .closeIT:hover { color: #ff630e; cursor: pointer; transition: all 0.3s; } input { overflow: visible; border: none; } #treeContainerBe ul { list-style: none; border-left: 1px solid black; padding: 0; margin: 0; padding-left: 35px; } #treeContainerBe ul li { position: relative; text-transform: capitalize; } #treeContainerBe ul li:before { content: ""; position: absolute; top: 12px; left: -35px; background: black; height: 1px; width: 32px; } .btn-create-class { color: #fff; background-color: #ff630e; } .btn-create-class:hover { color: #fff; background-color: #ff630e; opacity: 0.8; transition: 0.3s all; } .fa:hover { color: #ff630e; opacity: 0.8; transition: 0.3s all; } .startTime { padding: 5px 0; font-size: 1.5em; font-family: inherit; width: 100px; } .treetable .fa { cursor: pointer; padding-right: 6px; font-size: 20px; margin-top: 4px; } .treetable .fa.fa-remove { font-size: 20px; } .treetable .rowhidden { display: none; } .treetable .j-addChild { display: none; } .treetable .selected .j-addChild { display: block; } .treetable .btn-outline { background-color: transparent; } .treetable .form-control { width: auto; display: inline-block; } .treetable .textalign-center { text-align: center; } .treetable .j-expend { cursor: pointer; width: 40% !important; text-align: left !important; } .treetable .has-error .form-control { color: red; border: 1px solid red; } .treetable .maintitle { width: 35% !important; } .treetable .j-remove { margin-top: 9px; cursor: pointer; font-size: 16px; color: red; } .treetable .class-level-2 .class-level-ul .j-expend { position: relative; left: 22px; margin-right: 38px; } .treetable .class-level-3 .class-level-ul .j-expend { position: relative; left: 44px; } .treetable .class-level-4 .class-level-ul .j-expend { position: relative; left: 66px; } .treetable .class-level-1 { margin-top: 32px; } .treetable .class-level-ul { margin-top: 12px; padding: 0; } .treetable .class-level-ul li { float: left; text-align: center; vertical-align: middle; list-style: none; } .treetable .class-level-ul:after { display: block; clear: both; height: 0; content: " "; } .treetable .tt-header div span { width: auto; line-height: 29px; display: inline-block; min-width: 120px; text-align: center; } .treetable .tt-body { background-color: #FFF; } .treetable .tt-header div { border-bottom: none; background-color: #FFF; } .card1 { margin-bottom: -1px; } .card-header .chevron { float: right; } .card-header a.collapsed .fa-chevron-up { display: none; } .card-header a:not(.collapsed) .fa-chevron-down { display: none; } .card-header a.collapsed .fa-chevron-down { display: block; } .card-header a:not(.collapsed) .fa-chevron-up { display: block; } .card-header .chevron:before { content: "\f078"; font-family: "FontAwesome"; } .card-header a.collapsed .chevron:before { content: "\f054"; } .card-header { font-size: 17px; padding: 20px; margin-top: -1px; } .card-header i { margin-right: 10px; } .card2 { margin-bottom: -1px; } .card-header .chevron { float: right; } .card-header a.collapsed .fa-chevron-up { display: none; } .card-header a:not(.collapsed) .fa-chevron-down { display: none; } .card-header a.collapsed .fa-chevron-down { display: block; } .card-header a:not(.collapsed) .fa-chevron-up { display: block; } .card-header .chevron:before { content: "\f078"; font-family: "FontAwesome"; } .card-header a.collapsed .chevron:before { content: "\f054"; } .card-header { font-size: 17px; padding: 20px; margin-top: -1px; } .card-header i { margin-right: 10px; } .card3 { margin-bottom: -1px; } .card-header .chevron { float: right; } .card-header a.collapsed .fa-chevron-up { display: none; } .card-header a:not(.collapsed) .fa-chevron-down { display: none; } .card-header a.collapsed .fa-chevron-down { display: block; } .card-header a:not(.collapsed) .fa-chevron-up { display: block; } .card-header .chevron:before { content: "\f078"; font-family: "FontAwesome"; } .card-header a.collapsed .chevron:before { content: "\f054"; } .card-header { font-size: 17px; padding: 20px; margin-top: -1px; } .card-header i { margin-right: 10px; } .header-contact-info-create-course ul { display: flex; align-items: center; margin-left: -44px; color: #fff; } .header-contact-info-create-course ul li { display: flex; align-items: center; } .card-body { border: 1px solid #c1c1c1; } .card-body1 { display: flex; width: 100%; border: 1px solid #c1c1c1; } .card-body1 .p-4 { margin-left: 100px; } .buy-course-wrapper .banner__buy-course { background-image: url(/assets/images/banner-2.jpg); background-position: center; background-repeat: no-repeat; background-size: cover; padding: 110px 0 100px; position: relative; z-index: -2; } .buy-course-wrapper .banner__buy-course h2 { color: #ff630e; line-height: 30px; letter-spacing: 2px; font-weight: 700; margin-bottom: 20px; text-transform: uppercase; font-size: 49px; } .buy-course-wrapper .banner__buy-course p { font-size: 16px; line-height: 26px; color: #f5f5f5; } .buy-course-wrapper .banner__buy-course p a { color: #f5f5f5; transition: all 0.3s; } .buy-course-wrapper .banner__buy-course p a:hover { color: #ff630e; } .buy-course-wrapper .banner__buy-course:after { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: -1; background: rgba(5, 1, 51, 0.7); } .buy-course-wrapper .section2 { padding-top: 50px; margin-bottom: 20px; } .buy-course-wrapper .section2 .box-infor h3 { color: #ff630e; font-size: 24px; font-weight: 500; text-align: center; } .buy-course-wrapper .section2 .box-infor p { font-size: 16px; font-weight: 500px; color: #ff630e; padding-bottom: 10px; } .wallet-history-wrapper .banner__wallet-history { background-image: url(/assets/images/banner-2.jpg); background-position: center; background-repeat: no-repeat; background-size: cover; padding: 110px 0 100px; position: relative; z-index: -2; } .wallet-history-wrapper .banner__wallet-history h2 { color: #ff630e; line-height: 30px; letter-spacing: 2px; font-weight: 700; margin-bottom: 20px; text-transform: uppercase; font-size: 49px; } .wallet-history-wrapper .banner__wallet-history p { font-size: 16px; line-height: 26px; color: #f5f5f5; } .wallet-history-wrapper .banner__wallet-history p a { color: #f5f5f5; transition: all 0.3s; } .wallet-history-wrapper .banner__wallet-history p a:hover { color: #ff630e; } .wallet-history-wrapper .banner__wallet-history:after { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: -1; background: rgba(5, 1, 51, 0.7); } .wallet-history-wrapper .employee__img { margin-top: 130px; width: 100%; padding: 30px; } .wallet-history-wrapper .employee__img .employ__box { width: 100%; border-radius: 15px; } .wallet-history-wrapper .employee__img .employ__box img { width: 100%; border-radius: 25px; } .wallet-history-wrapper .employee__img:nth-child(2) { margin-top: -70px; } .wallet-history-wrapper .sec-heading__about { width: 80%; margin: auto; text-align: center; margin-top: 10px; } .wallet-history-wrapper .sec-heading__about h5 { font-size: 16px; line-height: 26px; font-weight: 600; text-transform: uppercase; color: #ff630e; letter-spacing: 1px; } .wallet-history-wrapper .sec-heading__about h2 { font-size: 45px; line-height: 55px; font-weight: 700; } .wallet-history-wrapper .sec-heading__about p { color: grey; margin: 20px 0 40px; letter-spacing: 1px; line-height: 25px; } .wallet-history-wrapper .wallet-history-option { padding-top: 100px; } .wallet-history-wrapper .title-wallet-member h3 { color: #ff630e; line-height: 30px; letter-spacing: 2px; font-weight: 700; margin-bottom: 20px; text-transform: uppercase; font-size: 32px; } .wallet-history-wrapper .search-form { position: relative; } .wallet-history-wrapper .search-form input { width: 100%; height: 35px; border: 0; background-color: #f1f1f1; padding-left: 20px; border-radius: 5px; } .wallet-history-wrapper .search-form button { position: absolute; right: 20px; top: 20px; height: 35px; width: 60px; border: 0; background-color: #ff630e; font-size: 20px; padding: 0 20px; border-radius: 0 5px 5px 0; color: #fff; } .wallet-history-wrapper .search-form button:hover { background-color: #130f40; } .wallet-history-wrapper .widget { padding: 20px 20px 20px; margin-bottom: 20px; border-radius: 10px; -webkit-box-shadow: 0 0 15px rgba(51, 51, 51, 0.1); box-shadow: 0 0 15px rgba(51, 51, 51, 0.1); } .wallet-history-wrapper .widget h4 { color: #130f40; padding-bottom: 15px; font-weight: 700; font-size: 24px; } .wallet-history-wrapper .search-date { margin-right: 10px; } .wallet-history-wrapper .btn { background-color: #ff630e; color: white; } .wallet-history-wrapper .wallet-history-area { padding: 10px 0; } .wallet-history-wrapper .table { padding: 30px 40px 40px; margin-bottom: 30px; border-radius: 10px; -webkit-box-shadow: 0 0 15px rgba(51, 51, 51, 0.1); box-shadow: 0 0 15px rgba(51, 51, 51, 0.1); } .wallet-history-wrapper .blog-pagination li { display: inline-block; } .wallet-history-wrapper .blog-pagination li a, .wallet-history-wrapper .blog-pagination li span { width: 55px; height: 55px; background-color: #f7f7f7; display: block; border: 1px solid #e6f0fa; border-radius: 50%; font-weight: 500; line-height: 55px; font-size: 16px; margin: 0 5px; } .wallet-history-wrapper .blog-pagination li i { font-size: 20px; } .wallet-history-wrapper .blog-pagination li a:hover, .wallet-history-wrapper .blog-pagination li span { border-color: #ff630e; background-color: #ff630e; color: #fff; } .sidebar-wrap { top: 0; } .feedback-wrapper .banner__feedback { background-image: url(/assets/images/banner-2.jpg); background-position: center; background-repeat: no-repeat; background-size: cover; padding: 110px 0 100px; position: relative; z-index: -2; } .feedback-wrapper .banner__feedback h2 { color: #ff630e; line-height: 30px; letter-spacing: 2px; font-weight: 700; margin-bottom: 20px; text-transform: uppercase; font-size: 49px; } .feedback-wrapper .banner__feedback p { font-size: 16px; line-height: 26px; color: #f5f5f5; } .feedback-wrapper .banner__feedback p a { color: #f5f5f5; transition: all 0.3s; } .feedback-wrapper .banner__feedback p a:hover { color: #ff630e; } .feedback-wrapper .banner__feedback:after { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: -1; background: rgba(5, 1, 51, 0.7); } .feedback-wrapper .section-feedback { padding-top: 20px; padding-bottom: 20px; } .feedback-wrapper .section-feedback .from-feedback { border-radius: 8px; padding: 20px 20px; -webkit-box-shadow: 0 0 15px rgba(51, 51, 51, 0.1); box-shadow: 0 0 15px rgba(51, 51, 51, 0.1); } .feedback-wrapper .section-feedback .from-feedback .box-title { color: #ff630e; line-height: 30px; font-weight: 700; margin-bottom: 20px; text-transform: uppercase; font-size: 24px; text-align: center; } .feedback-wrapper .section-feedback .from-feedback .box-content { color: gray; line-height: 30px; font-weight: 400; margin-bottom: 20px; font-size: 16px; } .feedback-wrapper .section-feedback .from-feedback .from-content { border-radius: 8px; padding: 20px 20px; -webkit-box-shadow: 0 0 15px rgba(51, 51, 51, 0.1); box-shadow: 0 0 15px rgba(51, 51, 51, 0.1); } .feedback-wrapper .section-feedback .from-feedback .from-content label { color: black; line-height: 15px; font-weight: 400; margin-bottom: 10px; font-size: 16px; } .feedback-wrapper .section-feedback .from-feedback .from-content select { border-radius: 8px; width: 100%; margin-bottom: 10px; color: gray; font-size: 16px; } .feedback-wrapper .section-feedback .from-feedback .from-content .radio-input { margin-top: 10px; margin-left: 20px; margin-bottom: 10px; } .feedback-wrapper .section-feedback .from-feedback .from-content .chat-input { width: 100%; height: 100px; text-align: center; border-radius: 8px; border: 0px solid darkgrey; -webkit-box-shadow: 0 0 15px rgba(51, 51, 51, 0.1); box-shadow: 0 0 15px rgba(51, 51, 51, 0.1); } .feedback-wrapper .section-feedback .from-feedback .btn-showmore { padding-top: 20px; text-align: center; } .feedback-wrapper .section-feedback .from-feedback .btn-showmore button { color: white; font-weight: 500; font-size: 16px; height: 30px; width: 80px; background-color: #ff630e; border: 0px; border-radius: 8px; } .feedback-container { display: flex; flex-direction: column; padding: 10px; border-radius: 10px; background-color: #ECEBF0; width: 1000px; margin: 0 auto; margin-top: 20px; margin-bottom: 20px; } .feedback-header { display: flex; justify-content: flex-end; font-size: 1.2rem; font-weight: bold; margin-right: 12px; } .feedback-header1 { color: white; display: flex; justify-content: flex-end; font-size: 1.2rem; font-weight: bold; margin-right: 12px; } .separator-bottom-feedback { margin-top: 0.4rem; border: 1px solid #ffffff; } .feedback-body { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; } .feedback-left { display: flex; align-items: center; } .feedback-left-img { width: 122px; height: 122px; border-radius: 4px; object-fit: contain; margin-right: 10px; margin-left: 10px; border: 1px solid #fff; } .feedback-left-info { line-height: 2rem; } .feedback-left-info h2 { font-size: 1.3rem; font-weight: 500; } .feedback-right-btn { border: 1px solid #ff630e; background-color: #ff630e; color: #fff; padding: 8px; border-radius: 6px; margin-right: 24px; } .feedback-right-btn:hover { opacity: 0.8; cursor: pointer; } .select-feedback-container { display: flex; flex-direction: column; padding: 10px; border-radius: 10px; background-color: #3D3B60; width: 1000px; margin: 0 auto; margin-top: 20px; margin-bottom: 20px; } .select-feedback-left-info { line-height: 2rem; color: #fff; font-size: 1.3rem; font-weight: 600; } .feedback-right-btn-send { border: 1px solid #ff630e; background-color: #ff630e; color: #fff; padding: 8px; border-radius: 6px; } .feedback-right-btn-send:hover { opacity: 0.8; cursor: pointer; } .title-feedback { color: #ff630e; font-weight: bold; } .modal-header { border-bottom: none; } .feedback-left-body { display: flex; align-items: center; margin-top: -22px; margin-left: -12px; } .feedback-left-info-body { line-height: 2rem; } .feedback-left-info-body h2 { font-size: 1.1rem; font-weight: 600; } .feedback-icons { display: flex; align-items: center; } .feedback-icons .testi-rating-feed { color: #ff630e; margin-left: 10px; font-size: 1.4rem; } .feedback-icons h5 { color: #ff630e; font-weight: bold; } .write-feedback { display: flex; flex-direction: column; margin-top: 10px; } .write-feedback h5 { color: #ff630e; font-weight: bold; margin-bottom: 10px; } .write-feedback textarea { padding: 10px; background-color: #E6E4E5; border-radius: 4px; border: 1px solid #E6E4E5; resize: none; } .write-feedback textarea:focus { outline: 2px solid #ff630e; } .modal-footer { margin: 0; padding: 0; margin-top: -6px; margin-right: 12px; margin-bottom: 10px; border-top: none; } .btn-star-feedback { background-color: transparent; border: none; outline: none; color: gray; } .active-icon-star { color: #ff630e; transition: all 0.3s; } #value-star { display: none; } .title-reset-1 h3 { font-size: 24px; line-height: 34px; color: #0e0a38; font-weight: 700; } .member-detail-wrapper .mentor-profile-edit-content { margin: 0; padding: 0; } .member-detail-wrapper .mentor-profile-edit-content label { color: #0e0a38; font-weight: 500; } .member-detail-wrapper .mentor-profile-edit-content .form-group-custome { border: 1px solid #ccc; padding: 20px; border-radius: 10px; margin-bottom: 20px; } .member-detail-wrapper .mentor-profile-edit-content .form-group-custome h3 { font-weight: 700; font-size: 36px; line-height: 46px; } .member-detail-wrapper .mentor-profile-edit-content .avatar_img { width: 200px; height: 200px; object-fit: cover; } .member-detail-wrapper .mentor-profile-edit-content .id-card-warpper .card-id-custom img { height: 220px; } .header-contact-info-member-profile-edit ul { display: flex; align-items: center; margin-left: -44px; color: #fff; } .header-contact-info-member-profile-edit ul li { display: flex; align-items: center; } .show-password { position: relative; } .show-password-icon { position: absolute; top: 10px; right: 10px; } .btn-show-password { width: 36px; } .form-control1 { display: flex; border: 1px solid #ccc; border-radius: 5px; padding: 5px; } #phone-number-error { margin-top: 6px; font-size: 0.9rem; } #message-error-dob { color: red; font-size: 0.9rem; margin-top: 6px; } .lms-wrapper .banner__lms { background-image: url(/assets/images/banner-2.jpg); background-position: center; background-repeat: no-repeat; background-size: cover; padding: 110px 0 100px; position: relative; z-index: -2; } .lms-wrapper .banner__lms h2 { color: #ff630e; line-height: 30px; letter-spacing: 2px; font-weight: 700; margin-bottom: 20px; text-transform: uppercase; font-size: 45px; } .lms-wrapper .banner__lms p { font-size: 16px; line-height: 26px; color: #f5f5f5; } .lms-wrapper .banner__lms p a { color: #f5f5f5; transition: all 0.3s; } .lms-wrapper .banner__lms p a:hover { color: #ff630e; } .lms-wrapper .banner__lms:after { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: -1; background: rgba(5, 1, 51, 0.7); } .lms-wrapper .section3 { padding-top: 50px; text-align: center; } .lms-wrapper .section3 h3 { color: #0e0a38; line-height: 30px; letter-spacing: 2px; font-weight: 700; margin-bottom: 20px; text-transform: uppercase; font-size: 45px; } .lms-wrapper .section3 .employ__box { width: 90%; padding-left: 10%; border-radius: 15px; } .lms-wrapper .section3 .employ__box img { width: 100%; border-radius: 25px; } .lms-wrapper .section3:nth-child(2) { margin-top: -70px; } .lms-wrapper .section3 p { padding-top: 20px; font-size: 20px; color: #0e0a38; text-align: justify; line-height: 30px; font-weight: 400; margin-bottom: 20px; } .lms-wrapper .section4 .func { padding-top: 10px; padding-bottom: 20px; text-align: center; } .lms-wrapper .section4 .func h3 { color: #0e0a38; line-height: 50px; letter-spacing: 2px; font-weight: 700; margin-bottom: 20px; text-transform: uppercase; font-size: 49px; } .lms-wrapper .section4 .func h4 { padding-top: 20px; color: #ff630e; line-height: 30px; letter-spacing: 2px; font-weight: 700; margin-bottom: 20px; font-size: 36px; } .lms-wrapper .section4 .box-bStudent { padding: 20px 20px; border-radius: 8px; text-align: center; -webkit-box-shadow: 0 0 15px rgba(51, 51, 51, 0.1); box-shadow: 0 0 15px rgba(51, 51, 51, 0.1); } .lms-wrapper .section4 .box-bStudent h3 { font-size: 22px; color: #ff630e; line-height: 30px; font-weight: 500; } .lms-wrapper .section4 .box-bStudent .employ__box { width: 100%; border-radius: 15px; } .lms-wrapper .section4 .box-bStudent .employ__box img { width: 100%; border-radius: 25px; } .lms-wrapper .section4 .box-bStudent:nth-child(2) { margin-top: -70px; } .lms-wrapper .section4 .box-bStudent p { height: 100%; padding-top: 10px; font-size: 20px; color: #0e0a38; text-align: justify; line-height: 30px; font-weight: 400; } .lms-wrapper .section5 .func { margin-top: 10px; padding-bottom: 20px; text-align: center; } .lms-wrapper .section5 .func h3 { color: #0e0a38; line-height: 50px; letter-spacing: 2px; font-weight: 700; margin-bottom: 20px; text-transform: uppercase; font-size: 45px; } .lms-wrapper .section5 .func h4 { padding-top: 20px; color: #ff630e; line-height: 30px; letter-spacing: 2px; font-weight: 700; margin-bottom: 20px; font-size: 36px; } .lms-wrapper .section5 .box-bStudent { margin-bottom: 20px; padding: 20px 20px; border-radius: 8px; text-align: center; -webkit-box-shadow: 0 0 15px rgba(51, 51, 51, 0.1); box-shadow: 0 0 15px rgba(51, 51, 51, 0.1); } .lms-wrapper .section5 .box-bStudent h3 { font-size: 22px; color: #ff630e; line-height: 30px; font-weight: 500; } .lms-wrapper .section5 .box-bStudent .employ__box { width: 100%; border-radius: 15px; } .lms-wrapper .section5 .box-bStudent .employ__box img { width: 100%; border-radius: 25px; } .lms-wrapper .section5 .box-bStudent:nth-child(2) { margin-top: -70px; } .lms-wrapper .section5 .box-bStudent p { padding-top: 10px; font-size: 20px; color: #0e0a38; text-align: justify; line-height: 30px; font-weight: 400; } .service-card-icon, .service-card-title { color: #ff630e; } .employ_box_img { object-fit: cover; height: 300px; width: 130px; } .title-heading-lms { margin-top: 20px; margin-bottom: 0px; } .advantages-lms { margin-bottom: 20px !important; } .func h3 { margin-bottom: 0px !important; } .section-lms-func-title { margin-bottom: 0px !important; } .lms-wrapper .section4 .box-bStudent { height: 100%; } .courses-section-desk { margin-top: -40px; } .section-heading-course-title { margin-bottom: 10px; } .footer { background-color: #0e0a38; padding: 90px 0 50px; color: #fff; } .footer .title-address { font-size: 18px; line-height: 23px; font-weight: 700; color: #999; word-break: break-word; margin-bottom: 20px; } .footer .hotline { font-size: 15px; line-height: 21px; color: #999; word-break: break-word; } .footer .address { font-size: 15px; line-height: 21px; color: #999; word-break: break-word; } .footer .quaters { font-size: 18px; line-height: 22px; font-weight: 700; color: #fff; word-break: break-word; margin-bottom: 12px; } .footer h6 { color: #fff; font-size: 16px; line-height: 26px; font-weight: 700; margin-top: 25px; margin-bottom: 10px; } .footer-logo { padding-right: 40px; } .site-logo-footer { color: #fff; } .footer-about-description { color: #fff; font-weight: 400; margin-top: 10px; line-height: 1.42857143; font-size: 14px; text-align: justify; } .footer-social-icons li { display: inline-block; padding-right: 15px; } .footer-social-icons li a { color: #fff; } .footer-menu h4 { font-size: 20px; line-height: 30px; margin-bottom: 20px; color: #fff; font-weight: 700; } .footer-menu ul li { padding-bottom: 15px; } .footer-menu ul li a { display: block; color: #fff; font-weight: 400; } .footer-contact h4 { font-size: 20px; line-height: 30px; margin-bottom: 20px; color: #fff; font-weight: 700; } .footer-contact ul { list-style-type: none; } .footer-contact li { color: #fff; position: relative; list-style-type: none; font-size: 15px; line-height: 25px; display: flex; padding-bottom: 20px; } .footer-contact li i { font-size: 20px; color: #ff630e; padding-right: 40px; } .footer-contact li i.fa.fa-map-marker { font-size: 30px; color: #ff630e; padding-right: 40px; } .login-form-container { padding: 60px 55px; position: fixed; top: -100%; z-index: 3; width: 100%; transition: all 0.5s ease-out 0s; height: 100vh; } .login-form-container .login-form-content { border-radius: 10px; position: relative; background: #fff; max-width: 500px; width: 500px; padding: 50px; box-shadow: 0 0 30px rgba(51, 51, 51, 0.1); } .login-form-container .login-form-content .close-login-form { display: inline-block; position: absolute; font-size: 40px; right: 20px; top: 10px; cursor: pointer; } .login-form-container .login-form-content h3 { font-size: 24px; line-height: 34px; color: #0e0a38; font-weight: 700; } .login-form-container .login-form-content label { color: #999; } .login-form-container .login-form-content .forgot-pass .custom-link { color: #999 !important; } .login-form-container:before { content: ""; top: 0; right: 0; left: 0; position: absolute; width: 100%; height: 100vh; } @media only screen and (min-width: 1200px) { .section-heading-course-title-mobile { margin-top: 20px; } .employ__box .img-aboutus-2 { display: none; } .img_aboutus_4 { display: none; } .img-aboutus-end-1 { display: none; } .list-class-owl-theme .owl-next span { top: 60px !important; right: -20px !important; font-size: 4rem !important; } .list-class-owl-theme .owl-prev span { top: 60px !important; left: -22px !important; font-size: 4rem !important; } .owl-next span { top: 0 !important; right: 58px !important; font-size: 4rem !important; } .owl-prev span { top: 0 !important; left: 26px !important; font-size: 4rem !important; } .card1-total-price-code { display: flex; flex: 1; } .card1-total-price-code-mobile-container { display: flex; flex: 1; } .icon-question-payment { margin-top: 4px; margin-left: 18px; margin-right: 20px; } #form-voucher1 { display: flex; flex: 1; } .fa-check-circle { margin-top: 6px; } .card1-total-price-code-input-refer { padding: 0; width: 100% !important; margin-left: 4px !important; } .banner-aboutus1 { display: flex; } .content-info-mentor-create-course { padding: 0 !important; margin-top: 20px; } .opt-day-create-course { margin-top: 14px; } .data-create-course tr td { font-size: 0.6rem !important; } .data-create-course-title-tbl { font-size: 0.6rem !important; } .container { max-width: 1320px !important; } .learning-path { transition: all 0.2s; } .advantages { padding: 0; margin-bottom: 60px; transition: all 0.2s; } .container-select-course-mobile { display: flex; flex-direction: column; transition: all 0.2s; } .btn-primary-custom-select-mobile { padding: 14px; font-size: 14px; margin-bottom: 20px; } .advantages .service-card { margin-bottom: 0px; } .section-heading-title-mobile { margin-bottom: 0px; } .advantages .service-card .service-card-content { padding: 0px; } .advantages .service-card div:first-child { margin-bottom: 0px !important; } .advantages .service-card { padding: 10px 0; } .image-mobile-home-page { display: block; justify-content: center; margin: 0 auto; margin-bottom: 10px; border-radius: 10px; } .left-section { width: 100%; border-radius: 12px; box-shadow: 0 0 6px #000; } .right-section { width: 100%; border-radius: 10px; box-shadow: 0 0 6px #000; } .courses-section-mobile-home-page { padding-top: 30px; padding-bottom: 40px; } .our { padding: 0; } .our h1 { margin-bottom: 0px; } .testimonial-content-mobile-home-page { padding: 0; margin-bottom: 80px; } .section-heading-of-member-title { margin-bottom: 10px; } .contact-mobile { display: block; } .contacts-section-home-page { margin-top: 80px; padding: 0; } .btn-outline-secondary-custom-laptop { padding: 14px; font-size: 14px; margin-bottom: 20px; } .section-heading-title-mobile { margin-top: 40px; } .contacts-section .form-contact-container { margin-left: 24px; padding: 0px; } .form-contact-img { margin-bottom: 20px; } .course-content-container-page-course { padding: 0 !important; margin-top: 40px; } .pag-course-bottom { margin-bottom: 40px; } } /* Laptop */ @media only screen and (min-width: 992px) and (max-width: 1200px) { .member-detail-wrapper .content-info-mentor .member-info .member-img { background-image: url(/assets/images/overlay-bg.jpg); background-repeat: no-repeat; background-size: contain; padding: 50px 68px 30px; } .img-banner-1 { margin-right: 50px !important; } .icon-gmail { margin-left: 31px !important; } .fa-location-arrow { margin-left: 41px !important; } .span-title-1 { width: 157px !important; margin-left: 25px !important; } .wrapper .contact-info .li-title-2 { margin-left: 39px !important; } .autocom-box-search { display: none !important; } .list-class-owl-theme .owl-next span { top: 60px !important; right: -20px !important; font-size: 4rem !important; } .list-class-owl-theme .owl-prev span { top: 60px !important; left: -22px !important; font-size: 4rem !important; } .owl-next span { top: 0 !important; right: 26px !important; font-size: 4rem !important; } .owl-prev span { top: 0 !important; left: 0px !important; font-size: 4rem !important; } .card1-total-price-code { display: flex; flex: 1; } .card1-total-price-code-mobile-container { display: flex; flex: 1; } .icon-question-payment { margin-top: 4px; margin-left: 18px; margin-right: 20px; } #form-voucher1 { display: flex; flex: 1; } .fa-check-circle { margin-top: 6px; } .img-aboutus-2 { display: none !important; } .bt-aboutus_1 { border: 0px; line-height: 25px; display: block; background-color: rgb(255, 99, 14); color: rgb(255, 255, 255); padding: 5px 17px; border-radius: 30px; font-size: 10px; font-weight: 600; text-transform: uppercase; letter-spacing: 1px; margin: 0px auto 10px; width: 100%; } .img_aboutus_3 { position: absolute; top: 190px; bottom: 0; right: 30px; text-align: center; margin: 0 auto; display: grid; justify-content: center; align-content: center; width: 20%; text-align: justify; } .title_img_aboutus-text { font-size: 10px; font-weight: 500; line-height: 20px; } .font-title { font-size: 20px !important; } .content-info-mentor-create-course { padding: 0 !important; margin-top: 20px; } .card-body1 .p-4 { margin-left: 0 !important; } .opt-day-create-course { margin-top: 14px; } .data-create-course tr td { font-size: 0.6rem !important; } .data-create-course-title-tbl { font-size: 0.6rem !important; } .sidebar-wrap { display: none; } .feedback-container { margin-top: 24px !important; width: 800px; margin: 0 auto; transition: all 0.3s; } .header-course-search { display: none !important; } .feedback-left-info h2 { font-size: 1.1rem !important; font-weight: bold; } .select-feedback-container { margin-top: 24px !important; margin-bottom: 24px !important; width: 800px; margin: 0 auto; transition: all 0.3s; } .feedback-left-info h2 { font-size: 1.1rem !important; font-weight: bold; } .learning-path { transition: all 0.2s; } .advantages { padding: 0; margin-bottom: 60px; transition: all 0.2s; } .container-select-course-mobile { display: flex; flex-direction: column; transition: all 0.2s; } .btn-primary-custom-select-mobile { padding: 14px; font-size: 14px; margin-bottom: 20px; } .advantages .service-card { margin-bottom: 0px; } .section-heading-title-mobile { margin-bottom: 0px; } .advantages .service-card .service-card-content { padding: 0px; } .advantages .service-card div:first-child { margin-bottom: 0px !important; } .advantages .service-card { padding: 10px 0; } .image-mobile-home-page { display: block; justify-content: center; margin: 0 auto; margin-bottom: 10px; border-radius: 10px; } .left-section { width: 100%; border-radius: 12px; box-shadow: 0 0 6px #000; } .right-section { width: 100%; border-radius: 10px; box-shadow: 0 0 6px #000; } .courses-section-mobile-home-page { padding-top: 40px; padding-bottom: 40px; } .our { padding: 0; } .our h1 { margin-bottom: 0px; } .testimonial-content-mobile-home-page { padding: 0; margin-bottom: 80px; } .section-heading-of-member-title { margin-bottom: 10px; } .contact-mobile { display: block; } .contacts-section-home-page { margin-top: 80px; padding: 0; } .btn-outline-secondary-custom-laptop { padding: 14px; font-size: 14px; margin-bottom: 20px; } .section-heading-title-mobile { margin-top: 60px; } .contacts-section .form-contact-container { margin-left: 24px; padding: 0px; } .form-contact-img { margin-bottom: 20px; } .checkout { padding: 0 var(--px) !important; } .content-payment { display: flex; flex-direction: column; } .course-of-member-container { display: flex; justify-content: center; width: 100%; } .course-of-member-inner { width: 87%; } .cart { display: flex; justify-content: center; } .card1-info { margin-top: 6px; font-size: 1.1rem !important; } .title-payment-card { font-size: 1.2rem !important; } .cart-item-box { display: flex; flex-direction: column; justify-content: center; margin-top: 10px; } .section-card-contact { display: flex; flex-direction: column; justify-content: center; margin: 0 auto; margin-top: 22px; margin-bottom: 22px; } .img-avatar { width: 140px; } } @media only screen and (min-width: 992px) and (max-width: 1024px) { .autocom-box-search { display: none !important; } .list-class-owl-theme .owl-next span { top: 60px !important; right: -20px !important; font-size: 4rem !important; } .list-class-owl-theme .owl-prev span { top: 60px !important; left: -22px !important; font-size: 4rem !important; } .owl-next span { top: 0 !important; right: 8px !important; font-size: 4rem !important; } .owl-prev span { top: 0 !important; left: -36px !important; font-size: 4rem !important; } .card1-total-price-code { display: flex; flex: 1; } .card1-total-price-code-mobile-container { display: flex; flex: 1; } .icon-question-payment { margin-top: 4px; margin-left: 18px; margin-right: 20px; } #form-voucher1 { display: flex; flex: 1; } .fa-check-circle { margin-top: 6px; } .course-descriptions-inner { display: flex; flex-direction: column; } .content-info-mentor-member-profile-edit { padding: 0 !important; margin-top: 20px; } .mentor-profile-edit-content { margin-top: 20px !important; } .my-element { margin-right: 50px; } .courses-wrapper .course-content-container .courses-list-content .main-courses-list .card-course-custom .card-title { min-height: 60px; } .home-wrapper .courses-section .owl-carousel .owl-nav .owl-prev { left: 10px !important; } .home-wrapper .courses-section .owl-carousel .owl-nav .owl-next { right: 10px !important; } .home-wrapper .testimonial-content .owl-carousel .owl-nav .owl-prev { left: 10px; } .home-wrapper .testimonial-content .owl-carousel .owl-nav .owl-next { right: 10px; } .home-wrapper .our .owl-carousel .owl-nav .owl-prev { left: 10px; } .home-wrapper .our .owl-carousel .owl-nav .owl-next { right: 10px; } .aboutus-wrapper .owl-carousel .owl-nav .owl-prev { left: -1%; } .aboutus-wrapper .owl-carousel .owl-nav .owl-next { right: -1%; } .checkout { padding: 0 var(--px) !important; } .content-payment { display: flex; flex-direction: column; } .course-of-member-container { display: flex; justify-content: center; width: 100%; } .course-of-member-inner { width: 87%; } .cart { display: flex; justify-content: center; } .card1-info { margin-top: 6px; font-size: 1.1rem !important; } .title-payment-card { font-size: 1.2rem !important; } .cart-item-box { display: flex; flex-direction: column; justify-content: center; margin-top: 10px; } .section-card-contact { display: flex; flex-direction: column; justify-content: center; margin: 0 auto; margin-top: 22px; margin-bottom: 22px; } .img-avatar { width: 140px; } .feedback-container { margin-top: 24px !important; width: 800px; margin: 0 auto; transition: all 0.3s; } .header-course-search { display: none !important; } .feedback-left-info h2 { font-size: 1.1rem !important; font-weight: bold; } .select-feedback-container { margin-top: 24px !important; margin-bottom: 24px !important; width: 800px; margin: 0 auto; transition: all 0.3s; } .feedback-left-info h2 { font-size: 1.1rem !important; font-weight: bold; } .learning-path { transition: all 0.2s; } .advantages { padding: 0; margin-bottom: 60px; transition: all 0.2s; } .container-select-course-mobile { display: flex; flex-direction: column; transition: all 0.2s; } .btn-primary-custom-select-mobile { padding: 14px; font-size: 14px; margin-bottom: 20px; } .advantages .service-card { margin-bottom: 0px; } .section-heading-title-mobile { margin-bottom: 0px; } .advantages .service-card .service-card-content { padding: 0px; } .advantages .service-card div:first-child { margin-bottom: 0px !important; } .advantages .service-card { padding: 10px 0; } .image-mobile-home-page { display: block; justify-content: center; margin: 0 auto; margin-bottom: 10px; border-radius: 10px; } .left-section { width: 100%; border-radius: 12px; box-shadow: 0 0 6px #000; } .right-section { width: 100%; border-radius: 10px; box-shadow: 0 0 6px #000; } .courses-section-mobile-home-page { padding-top: 40px; padding-bottom: 40px; } .our { padding: 0; } .our h1 { margin-bottom: 0px; } .testimonial-content-mobile-home-page { padding: 0; margin-bottom: 80px; } .section-heading-of-member-title { margin-bottom: 10px; } .contact-mobile { display: block; } .contacts-section-home-page { margin-top: 80px; padding: 0; } .btn-outline-secondary-custom-laptop { padding: 14px; font-size: 14px; margin-bottom: 20px; } .section-heading-title-mobile { margin-top: 60px; } .contacts-section .form-contact-container { margin-left: 24px; padding: 0px; } .form-contact-img { margin-bottom: 20px; } } /* Tablet */ @media only screen and (min-width: 767px) and (max-width: 992px) { .span-title-1 { width: 169px !important; } .wrapper .contact-info .li-title-2 { margin-left: 33px !important; } .lms-wrapper .section3 h3 { margin-bottom: 0 !important; } .title-heading-lms { margin-top: -30px !important; } .lms-wrapper .section4 .box-bStudent h3 { margin-top: 12px; } .lms-wrapper .section4 .func h3 { margin-bottom: 10px !important; } .lms-wrapper .section5 .func { margin-top: -20px; margin-bottom: 20px; } .lms-wrapper .section5 .box-bStudent h3 { margin-top: 10px; } .courses-section-desk { margin-top: 30px; } .section-heading-course-title { margin-bottom: 0px !important; } .courses-section { padding: 0px; } .lms-wrapper .section5 .box-bStudent { margin-bottom: 0px; } .icon-logo-mobile { width: 100px; height: 75px; object-fit: cover; margin-left: -22px; } .container-revert-list-class-on-top { display: flex; flex-direction: column-reverse; } .list-class-info { margin-bottom: -12px !important; } .lotrinh { margin-bottom: 16px; } .title-class-info { margin-top: 10px; } .autocom-box-search { display: none !important; } .employ__box .img-aboutus-1 { display: block; } .employ__box .img-aboutus-2 { display: none; } .list-class-owl-theme .owl-next span { top: 60px !important; right: -20px !important; font-size: 4rem !important; } .list-class-owl-theme .owl-prev span { top: 60px !important; left: -22px !important; font-size: 4rem !important; } .owl-next span { top: 0 !important; right: 16px !important; font-size: 4rem !important; } .owl-prev span { top: 0 !important; left: 16px !important; font-size: 4rem !important; } .card1-total-price-code { display: flex; flex: 1; } .card1-total-price-code-mobile-container { display: flex; flex: 1; } .icon-question-payment { margin-top: 4px; margin-left: 18px; margin-right: 20px; } #form-voucher1 { display: flex; flex: 1; } .fa-check-circle { margin-top: 6px; } .card1-total-price-code-input-refer { width: 70% !important; } .card1-total-price-code-input { width: 65% !important; } .section-heading-course-title { margin-bottom: 8px !important; } .icon-logo { margin-left: -50px; } .aboutus1 { padding: 30px 0 55px !important; } .bt-aboutus_1 { border: 0px; line-height: 25px; display: block; background-color: rgb(255, 99, 14); color: rgb(255, 255, 255); padding: 2px 15px; border-radius: 30px; font-size: 8px; font-weight: 600; text-transform: uppercase; letter-spacing: 1px; margin: 0px auto 10px; width: 100%; } .img_aboutus_3 { position: absolute; top: 160px; bottom: 0; right: 30px; text-align: center; margin: 0 auto; display: grid; justify-content: center; align-content: center; width: 20%; text-align: justify; } .title_img_aboutus-text { font-size: 10px; font-weight: 500; line-height: 15px; } .font-title { font-size: 20px !important; } .content-info-mentor-member-profile-edit { padding: 0 !important; margin-top: 20px; } .mentor-profile-edit-content { margin-top: 20px !important; } .content-info-mentor-create-course { padding: 0 !important; margin-top: 20px; } .card-body1 .p-4 { margin-left: 0 !important; } .opt-day-create-course { margin-top: 14px; } .data-create-course tr td { font-size: 0.6rem !important; } .data-create-course-title-tbl { font-size: 0.6rem !important; } .advantages-lms { padding: 0 !important; margin-top: 40px; } .section-heading-lms { margin-bottom: 0 !important; } .service-card-lms { padding: 0 !important; margin-bottom: 0 !important; } .service-card-item-lms { margin-bottom: 0 !important; } .section-lms { margin-top: 40px; } .box-bStudent-lms { padding-top: 0 !important; } .box-bStudent-lms-item { margin-top: 12px !important; } .section-lms-inner { padding: 0 !important; } .col-sm-12 { flex: 0 0 auto; width: 100%; } .header-top { display: none; } .header-bottom { display: none; } .header-mobile { background: #fff; } .header-mobile-content { display: flex; justify-content: space-between; padding: 4px; } .header-mobile-content .header-mobile-logo { font-size: 30px; font-weight: 700; } .header-mobile-content .header-mobile-menu-hambuger { font-size: 25px; display: flex; justify-content: center; align-items: center; } .header-mobile-content .img-avatar { width: 140px; } .checkout { padding: 0 var(--px) !important; } .content-payment { display: flex; flex-direction: column; } .course-of-member-container { display: flex; justify-content: center; width: 100%; } .course-of-member-inner { width: 87%; } .cart { display: flex; justify-content: center; } .card1-info { margin-top: 6px; font-size: 1.1rem !important; } .title-payment-card { font-size: 1.2rem !important; } .cart-item-box { display: flex; flex-direction: column; justify-content: center; margin-top: 10px; } .section-card-contact { display: flex; flex-direction: column; justify-content: center; margin: 0 auto; margin-top: 22px; margin-bottom: 22px; } /* ------------------------ */ .sidebar-wrap { display: block; position: fixed; z-index: 9999; right: 0; background-color: rgba(0, 0, 0, 0.5); transition: all 0.5s ease-out 0s; width: 100%; height: 100%; right: -100%; } .sidebar-wrap .sidebar-content { padding: 20px; width: 290px; background-color: #fff; height: 100%; position: absolute; right: 0; } .sidebar-wrap .sidebar-content .sidebar-top { display: flex; align-items: center; justify-content: space-between; } .sidebar-wrap .sidebar-content .sidebar-top .sidebar-logo { font-weight: 700; color: #0e0a38; font-size: 30px; line-height: 0 !important; } .sidebar-wrap .sidebar-content .sidebar-top .sidebar-logo i { font-size: 30px !important; } .sidebar-wrap .sidebar-content .sidebar-center { padding-top: 20px; } .sidebar-wrap .sidebar-content .sidebar-center .sidebar-mean-nav li { padding: 12px 0; border-top: 1px solid #f5f5f5; position: relative; } .sidebar-wrap .sidebar-content .sidebar-center .sidebar-mean-nav li a:first-child { font-size: 16px; font-weight: 600; color: #0e0a38; text-decoration: none; text-transform: uppercase; } .sidebar-wrap .sidebar-content .sidebar-center .sidebar-mean-nav li .sub-menu { display: none; width: 90%; } .sidebar-wrap .sidebar-content .sidebar-center .sidebar-mean-nav li .mean-expand { position: absolute; right: 0; top: 0; padding: 12px; font-size: 16px; color: #0e0a38; } .sidebar-wrap .sidebar-content .sidebar-center .sidebar-mean-nav li .mean-non-expand { display: none; position: absolute; right: 0; top: 0; padding: 12px; font-size: 16px; color: #0e0a38; } .sidebar-wrap .sidebar-content .sidebar-center .sidebar-mean-nav li:last-child { border-bottom: none; } .sidebar-wrap .sidebar-content .sidebar-center .sidebar-mean-nav li:first-child { border-top: none; } .sidebar-wrap .sidebar-content .sidebar-bottom .search-course { margin: 20px 0 25px; position: relative; } .sidebar-wrap .sidebar-content .sidebar-bottom .search-course input { padding: 10px 30px 10px 10px; } .sidebar-wrap .sidebar-content .sidebar-bottom .search-course span { position: absolute; right: 10px; top: 15px; } .sidebar-wrap .sidebar-content .sidebar-bottom .contact-info i { margin-right: 10px; color: #ff630e; } .sidebar-wrap .sidebar-content .sidebar-bottom .social-list { margin: 20px 0; } .sidebar-wrap .sidebar-content .sidebar-bottom .social-list li { margin-right: 10px; display: inline-block; } .sidebar-wrap .sidebar-content .sidebar-bottom .social-list li a { color: #0e0a38; } .sidebar-wrap .sidebar-content .sidebar-bottom .sidebar-controls li { display: inline-block; margin-right: 5px; } .sidebar-wrap .sidebar-content .sidebar-bottom .sidebar-controls li a { color: #0e0a38; color: 16px; } .swiper-slide button { font-size: 12px; padding: 3px; } .banner { padding: 0; } .banner .caption-content { padding: 100px 0px; } .banner .caption-content h4 { font-size: 18px; line-height: 28px; } .banner .caption-content h2 { font-size: 40px; line-height: 50px; } .banner .caption-content p { padding: 0; } .banner .caption-content .banner-control { flex-direction: column; } .banner .caption-content .banner-control .btn-primary-custom { padding: 14px 20px; font-size: 14px; margin-bottom: 10px; width: 50%; } .banner .caption-content .banner-control .btn-outline-secondary-custom { padding: 15px 25px; font-size: 14px; margin: 0 !important; width: 50%; } /* ------------------------ */ .advantages-2 { padding: 20px 0 20px; margin-bottom: 40px; } /* About us */ .aboutus { padding: 20px 0; } .aboutus .about-description { font-size: 18px; line-height: 26px; } .aboutus .btn-primary-custom { padding: 14px 20px; font-size: 14px; margin-bottom: 20px; } .aboutus .btn-outline-secondary-custom { padding: 14px 20px; font-size: 14px; margin-bottom: 20px; } /* ------------------------ */ .learning-path .left-section { clip-path: none; margin-bottom: 10px; } .learning-path .left-section h2 { font-size: 25px; } .learning-path .left-section p { font-size: 20px; } .learning-path .right-section { clip-path: none; margin-bottom: 10px; } .learning-path .right-section h2 { font-size: 25px; } .learning-path .right-section p { font-size: 20px; } /* ------------------------ */ /* Course section */ .courses-section .courses-content .item { display: flex; justify-content: center; } .courses-section .courses-content .item .btn-invite-course { width: 100%; } /* ------------------------ */ /* Testimonial-content */ .testimonial-content .item { display: flex; justify-content: center; } .testimonial-content .item .card-custom { width: 100% !important; } /* ------------------------ */ .register-wrapper .registration-form-wrap { width: 100% !important; } .register-wrapper .registration-area .tab-register { width: 100%; } /* ------------------------ */ .courses-wrapper .courses-list-content .header-courses-list { display: flex; flex-direction: column; align-items: flex-start !important; } .courses-wrapper .courses-list-content .header-courses-list select { margin-top: 10px; } /* ------------------------ */ .course-detail-wrapper .row-reverse-custom { flex-direction: column-reverse; } .course-detail-wrapper .course-single-content .course-single-meta { flex-direction: column; align-items: flex-start !important; } .course-detail-wrapper .course-single-content .course-single-meta div { margin-bottom: 5px; } .course-detail-wrapper .course-single-content .review-content-inner { padding: 40px 30px 30px 30px !important; } .course-detail-wrapper .course-single-content .review-content-inner .review-ratings { width: 100% !important; margin: 0 0 10px 0 !important; text-align: center; float: none !important; } .course-detail-wrapper .course-single-content .review-content-inner .rating-bar { width: 100% !important; } .course-detail-wrapper .course-sidebar { margin-top: 20px !important; } /* ------------------------ */ .member-detail-wrapper .mentor-profile-edit-content .avatar .btn-clear { font-size: 15px; padding: 3px !important; } .member-detail-wrapper .mentor-profile-edit-content .id-card-warpper .card-id-custom img { height: 300px; } .feedback-container { margin-top: 24px !important; width: 700px; margin: 0 auto; transition: all 0.3s; } .header-course-search { display: none !important; } .feedback-left-info h2 { font-size: 1rem !important; font-weight: bold; } .select-feedback-container { margin-top: 24px !important; margin-bottom: 24px !important; width: 700px; margin: 0 auto; transition: all 0.3s; } .feedback-left-info h2 { font-size: 1rem !important; font-weight: bold; } .feedback-right-btn { font-size: 0.9rem !important; font-weight: 500; padding: 7px !important; } .learning-path { transition: all 0.2s; } .advantages { padding: 0; margin-bottom: 60px; transition: all 0.2s; } .container-select-course-mobile { display: flex; flex-direction: column; transition: all 0.2s; } .btn-primary-custom-select-mobile { padding: 14px; font-size: 14px; margin-bottom: 20px; } .advantages .service-card { margin-bottom: 0px; } .section-heading-title-mobile { margin-top: 60px; margin-bottom: 0px; } .advantages .service-card .service-card-content { padding: 0px; } .advantages .service-card div:first-child { margin-bottom: 0px !important; } .advantages .service-card { padding: 10px 0; } .image-mobile-home-page { display: block; justify-content: center; margin: 0 auto; padding: 0 20px !important; margin-bottom: 10px; border-radius: 10px; } .left-section { width: 100%; border-radius: 12px; box-shadow: 0 0 6px #000; } .right-section { width: 100%; border-radius: 10px; box-shadow: 0 0 6px #000; } .courses-section-mobile-home-page { padding-top: 40px; padding-bottom: 40px; } .our { padding: 0; } .our h1 { margin-bottom: 0px; } .testimonial-content-mobile-home-page { padding: 0; margin-bottom: 40px; } .section-heading-of-member-title { margin-bottom: 10px; } .contact-mobile { display: block; } .contacts-section-home-page { margin-top: 80px; padding: 0; } .btn-aboutus-home-page { display: flex; flex-direction: column-reverse; } .about-description { margin-top: 10px; } .course-content-container-page-course { padding: 0 !important; margin-top: 40px; } .pag-course-bottom { margin-bottom: 40px; } } /* Mobile */ @media only screen and (max-width: 767px) { .span-title-1 { width: 336px !important; } .wrapper .contact-info .li-title-2 { margin-left: 110px !important; } .sidebar-logo { line-height: 0 !important; } .link-lbl { font-size: 0.8rem; width: 100%; margin-left: -6px; } .lms-wrapper .section3 h3 { font-size: 32px; font-weight: 600; } .section-heading { font-size: 32px !important; font-weight: 600; } .lms-wrapper .section4 .func h3 { font-size: 32px !important; font-weight: 600; } .lms-wrapper .section4 .func h4 { font-weight: 500; } .advantages .service-card .service-card-title { font-weight: 500; } .lms-wrapper .section3 h3 { margin-bottom: 0 !important; } .title-heading-lms { margin-top: -30px !important; } .lms-wrapper .section4 .box-bStudent h3 { margin-top: 12px; } .lms-wrapper .section4 .func h3 { margin-bottom: 10px !important; } .lms-wrapper .section5 .func { margin-top: -20px; margin-bottom: 20px; } .lms-wrapper .section5 .box-bStudent h3 { margin-top: 10px; } .courses-section-desk { margin-top: 30px; } .section-heading-course-title { margin-bottom: 0px !important; } .section-heading-course-title-mobile { margin-top: 20px; } .courses-section { padding: 0px; } .lms-wrapper .section5 .box-bStudent { margin-bottom: 0px; } .title-banner1 { text-align: justify !important; } .write-1 { text-align: justify !important; } .icon-logo-mobile { width: 100px; height: 75px; object-fit: cover; margin-left: -22px; } .container-revert-list-class-on-top { display: flex; flex-direction: column-reverse; } .list-class-info { margin-bottom: -12px !important; } .lotrinh { margin-bottom: 16px; } .title-class-info { margin-top: 10px; } .autocom-box-search { display: none !important; } .img-1 { margin-top: 50px; width: 100%; height: 260px; border-radius: 30px; object-fit: cover; } .course-detail-cate-fe p { font-size: 0.9rem !important; } .course-detail-cate-online p { font-size: 0.9rem !important; } .course-detail-cate-rate p { font-size: 0.9rem !important; } .course-detail-cate-fe-link { font-size: 0.9rem !important; } .icon-level-cate { width: 42px !important; height: 42px !important; left: 112px; } .list-class-owl-theme .owl-next span { top: 60px !important; right: -20px !important; font-size: 4rem !important; } .list-class-owl-theme .owl-prev span { top: 60px !important; left: -22px !important; font-size: 4rem !important; } .img-avatar { width: 400px !important; object-fit: cover; } .card1-inner .avatar { margin-right: 240px; } .card1-info { margin-left: -50px; } .card1-total-price-code-mobile-container { display: flex; flex: 1; } .icon-question-payment { margin-top: 4px; margin-left: 18px; margin-right: 20px; } .fa-check-circle { margin-top: 6px; } #form-voucher1 { display: flex !important; flex: 1; } .header-cart { margin-right: 42px; } .icon-shopping-cart { margin-top: 27px; width: 52px !important; height: 52px !important; object-fit: cover; } .cart-total-number { margin-top: 6px; font-size: 1rem; } .cart-total-number-mobile { margin-top: 56px; } .blog-wrapper .blog-area .all-posts-wrap { padding-right: 20px !important; } .icon-logo { margin-left: -30px; margin-top: 10px !important; } .aboutus1 { padding: 30px 0 55px !important; } .bt-aboutus_1 { margin-top: 170px !important; border: 0px; display: block; background-color: rgb(255, 99, 14); color: rgb(255, 255, 255); padding: 1px 5px; border-radius: 30px; font-size: 8px; font-weight: 600; text-transform: uppercase; letter-spacing: 1px; margin: 0px auto 10px; width: 100%; } .img_aboutus_3 { position: absolute; top: 107px; bottom: 0; right: 30px; text-align: center; margin: 0 auto; display: grid; justify-content: center; align-content: center; width: 20%; text-align: justify; } .banner1 .caption-content p { margin-top: 20px; } .img-2 { height: 200px; } .information h3 { line-height: 50px; font-size: 35px; } .information { padding-top: 30px; text-align: center; } .content-aboutus-1 { display: flex; flex-direction: column; } .title_img_aboutus-text { font-size: 6px; font-weight: 500; line-height: 7px; } .font-title { font-size: 10px !important; } .icon-arrow-1 { display: block !important; } .icon-arrow-2 { display: block !important; } .course-single-categories { margin: 0 !important; display: flex; justify-content: space-between; } .ms-4-1 { margin-bottom: 29px !important; } .fe-title-1 { font-size: 12px !important; } .onl-1 { font-size: 12px !important; } .size-font { margin-left: 5px !important; font-size: 13px; } .size-font-1 { margin-left: 6px !important; font-size: 13px; } .title-lv { font-size: 13px; } .content-info-mentor-member-profile { padding: 0 !important; margin-top: 20px; } .courses-profile { margin-top: 40px; } .courses-profile-title { text-align: left; font-size: 1.3rem !important; margin-bottom: 0 !important; line-height: 12px !important; } .history-payment-container h3 { text-align: left; font-size: 1.3rem !important; margin-bottom: 0 !important; line-height: 12px !important; } .history-payment-container { margin-top: 40px !important; } .footer { margin-top: 20px; } .content-info-mentor-member-profile-edit { padding: 0 !important; margin-top: 20px; } .mentor-profile-edit-content { margin-top: 20px !important; } .content-info-mentor-create-course { padding: 0 !important; margin-top: 20px; } .card-body1 .p-4 { margin-left: 0 !important; } .opt-day-create-course { margin-top: 14px; } .data-create-course tr td { font-size: 0.6rem !important; } .data-create-course-title-tbl { font-size: 0.6rem !important; } .course-single-area-course-detail { padding: 0 !important; margin-top: 20px; } .course-descriptions-inner { display: flex !important; align-items: flex-start !important; flex-direction: column; } .course-descriptions-inner p { text-align: start !important; font-size: 1rem !important; line-height: 0.5rem !important; } .courses-section-course-detail { padding: 0 !important; margin-bottom: 20px; } .advantages-lms { padding: 0 !important; margin-top: 40px; } .section-heading-lms { margin-bottom: 0 !important; } .service-card-lms { padding: 0 !important; margin-bottom: 0 !important; } .service-card-item-lms { margin-bottom: 0 !important; } .section-lms { margin-top: 40px; } .section-lms-func-title { padding: 0 !important; margin-bottom: 0 !important; } .box-bStudent-lms { padding-top: 0 !important; } .box-bStudent-lms-item { margin-top: 12px !important; } .section-lms-inner { padding: 0 !important; } .col-md-6 { display: flex; width: 100vh; } /* Global */ * { transition: all 2s; } .d-xs-none { display: none; } .wrapper { width: 100vw; overflow: hidden; } .section-heading { font-size: 40px; line-height: 50px; margin-bottom: 25px; } .login-form-container { display: none; } .checkout { padding: 0 var(--px) !important; } .checkout-container { padding: 0 !important; margin-top: 20px; } .cart { display: flex; justify-content: center; border-bottom: none !important; } .card1-info { margin-top: 6px; font-size: 1.1rem !important; } .title-payment-card { font-size: 1.2rem !important; } .cart-item-box { display: flex; flex-direction: column; justify-content: center; margin-top: 10px; border-right: none !important; } .section-card-contact { display: flex; flex-direction: column; justify-content: center; margin: 0 auto; margin-top: 22px; margin-bottom: 22px; } .card1-total-price-code-input-refer { width: 79% !important; } .card1-total-price-code-input { width: 65% !important; } .course-of-member-inner { width: 100%; } .bill-member { margin-top: 10px; } .total-course-icons { margin-top: 0px !important; } .content-payment { display: flex; flex-direction: column; } .course-of-member-container { display: flex; justify-content: center; width: 100%; } .swiper-slide button { font-size: 12px; padding: 2px; } .swiper-slide img { height: 50%; } .swiper-slide .group-title { margin-top: 20px; justify-content: space-between; } .swiper-slide .group-title > div { margin-bottom: 18px; } /* ------------------------ */ /* Header */ .header-top { display: none; } .header-bottom { display: none; } .header-mobile { background: #fff; } .header-mobile-content { display: flex; justify-content: space-between; padding: 4px; } .header-mobile-content .header-mobile-logo { font-size: 30px; font-weight: 700; } .header-mobile-content .header-mobile-menu-hambuger { font-size: 25px; display: flex; justify-content: center; align-items: center; } /* ------------------------ */ /* Sidebar mobile */ .sidebar-wrap { display: block; position: fixed; z-index: 9999; right: 0; background-color: rgba(0, 0, 0, 0.5); transition: all 0.5s ease-out 0s; width: 100%; height: 100%; right: -100%; } .sidebar-wrap .sidebar-content { padding: 20px; width: 290px; background-color: #fff; height: 100%; position: absolute; right: 0; } .sidebar-wrap .sidebar-content .sidebar-top { display: flex; align-items: center; justify-content: space-between; } .sidebar-wrap .sidebar-content .sidebar-top .sidebar-logo { font-weight: 700; color: #0e0a38; font-size: 30px; line-height: 0 !important; } .sidebar-wrap .sidebar-content .sidebar-top .sidebar-logo i { font-size: 30px !important; } .sidebar-wrap .sidebar-content .sidebar-center { padding-top: 20px; } .sidebar-wrap .sidebar-content .sidebar-center .sidebar-mean-nav li { padding: 12px 0; border-top: 1px solid #f5f5f5; position: relative; } .sidebar-wrap .sidebar-content .sidebar-center .sidebar-mean-nav li a:first-child { font-size: 16px; font-weight: 600; color: #0e0a38; text-decoration: none; text-transform: uppercase; } .sidebar-wrap .sidebar-content .sidebar-center .sidebar-mean-nav li .sub-menu { display: none; width: 90%; } .sidebar-wrap .sidebar-content .sidebar-center .sidebar-mean-nav li .mean-expand { position: absolute; right: 0; top: 0; padding: 12px; font-size: 16px; color: #0e0a38; } .sidebar-wrap .sidebar-content .sidebar-center .sidebar-mean-nav li .mean-non-expand { display: none; position: absolute; right: 0; top: 0; padding: 12px; font-size: 20px; color: #0e0a38; } .sidebar-wrap .sidebar-content .sidebar-center .sidebar-mean-nav li:last-child { border-bottom: none; } .sidebar-wrap .sidebar-content .sidebar-center .sidebar-mean-nav li:first-child { border-top: none; } .sidebar-wrap .sidebar-content .sidebar-bottom .search-course { margin: 20px 0 25px; position: relative; } .sidebar-wrap .sidebar-content .sidebar-bottom .search-course input { padding: 10px 30px 10px 10px; } .sidebar-wrap .sidebar-content .sidebar-bottom .search-course span { position: absolute; right: 10px; top: 15px; } .sidebar-wrap .sidebar-content .sidebar-bottom .contact-info i { margin-right: 10px; color: #ff630e; } .sidebar-wrap .sidebar-content .sidebar-bottom .social-list { margin: 20px 0; } .sidebar-wrap .sidebar-content .sidebar-bottom .social-list li { margin-right: 10px; display: inline-block; } .sidebar-wrap .sidebar-content .sidebar-bottom .social-list li a { color: #0e0a38; } .sidebar-wrap .sidebar-content .sidebar-bottom .sidebar-controls li { display: inline-block; margin-right: 5px; } .sidebar-wrap .sidebar-content .sidebar-bottom .sidebar-controls li a { color: #0e0a38; color: 16px; } /* ------------------------ */ .home-wrapper { /* Banner */ /* ------------------------ */ /* About us */ /* ------------------------ */ /* Advantages */ /* ------------------------ */ /* Learning path */ /* ------------------------ */ /* Course section */ /* ------------------------ */ /* Testimonial-content */ /* ------------------------ */ /* Advantages-2 */ /* ------------------------ */ /* Contacts section */ /* ------------------------ */ } .home-wrapper .banner { padding: 0; } .home-wrapper .banner .caption-content { padding: 100px 0px; } .home-wrapper .banner .caption-content h4 { font-size: 18px; line-height: 28px; } .home-wrapper .banner .caption-content h2 { font-size: 40px; line-height: 50px; } .home-wrapper .banner .caption-content p { padding: 0; } .home-wrapper .banner .caption-content .btn-primary-custom { padding: 14px 20px; font-size: 14px; } .home-wrapper .banner .caption-content .btn-outline-secondary-custom { padding: 14px 20px; font-size: 14px; } .home-wrapper .container-select-course-mobile { display: flex; flex-direction: column; transition: all 0.2s; } .home-wrapper .btn-primary-custom-select-mobile { padding: 14px; font-size: 14px; margin-bottom: 20px; } .home-wrapper .advantages { padding-top: 40px; } .home-wrapper .advantages .service-card { margin-bottom: 0px; } .home-wrapper .section-heading-title-mobile { margin-bottom: 0px; } .home-wrapper .advantages .service-card .service-card-content { padding: 0px; } .home-wrapper .advantages .service-card div:first-child { margin-bottom: 0px !important; } .home-wrapper .advantages .service-card { padding: 10px 0; } .home-wrapper .image-mobile-home-page { display: block; justify-content: center; margin: 0 auto; padding: 0 20px !important; margin-bottom: 10px; border-radius: 10px; } .home-wrapper .left-section { width: 100%; border-radius: 12px; box-shadow: 0 0 6px #000; } .home-wrapper .right-section { width: 100%; border-radius: 10px; box-shadow: 0 0 6px #000; } .home-wrapper .courses-section-mobile-home-page { padding-top: 40px; padding-bottom: 40px; } .home-wrapper .our { padding: 0; } .home-wrapper .our h1 { margin-bottom: 0px; } .home-wrapper .testimonial-content-mobile-home-page { padding: 0; margin-bottom: 60px; } .home-wrapper .section-heading-course-title { margin-bottom: 8px !important; } .home-wrapper .section-heading-of-member-title { margin-top: -20px; margin-bottom: 10px; } .home-wrapper .contact-mobile { display: block; } .home-wrapper .contacts-section-home-page { margin-top: 80px; padding: 0; } .home-wrapper .aboutus { padding: 20px 0; } .home-wrapper .aboutus .about-description { font-size: 18px; line-height: 26px; } .home-wrapper .aboutus .btn-primary-custom { padding: 14px 20px; font-size: 14px; margin-bottom: 20px; } .home-wrapper .aboutus .btn-outline-secondary-custom { padding: 14px 20px; font-size: 14px; margin-bottom: 20px; } .home-wrapper .advantages-2 { padding: 20px 0 20px; margin-bottom: 60px; } .home-wrapper .courses-section { padding-top: 20px; } .home-wrapper .advantages { padding-bottom: 40px; } .home-wrapper .advantages .section-heading { text-align: center !important; } .home-wrapper .learning-path .left-section { clip-path: none; margin-bottom: 10px; } .home-wrapper .learning-path .right-section { clip-path: none; margin-bottom: 10px; } .home-wrapper .courses-section .courses-content .item { display: flex; } .home-wrapper .courses-section .courses-content .item .btn-invite-course { width: 100%; } .home-wrapper .testimonial-content .item { display: flex; justify-content: center; } .home-wrapper .testimonial-content .item .card-custom { width: 100% !important; } .home-wrapper .advantages-2 .btn-outline-secondary-custom { padding: 14px 20px; font-size: 16px; } .home-wrapper .advantages-2 .btn-primary-custom { padding: 14px 10px; font-size: 14px; } .home-wrapper .contacts-section .form-contact-container { margin-top: 15px; } .btn-aboutus-home-page { display: flex; flex-direction: column-reverse; } .about-description { margin-top: 10px; } /* ------------------------ */ .img-aboutus-1 { display: none; } .img-aboutus-2 { display: block; } .img-aboutus-3 { display: none; } .img-aboutus-4 { object-fit: cover !important; display: block !important; } .img-aboutus-end { display: none; } .img-aboutus-end-1 { display: block !important; } .banner1 .caption-content h2 { color: #fff; font-size: 50px; line-height: 65px; font-weight: 500; margin-bottom: 20px; } .aboutus-wrapper .banner__aboutus .caption-content h2 { font-size: 25px; } .aboutus-wrapper .sec-heading__about h5 { margin-bottom: 10px; } .aboutus-wrapper .sec-heading__about h2 { font-size: 20px; line-height: 25px; } .aboutus-wrapper .counter { width: 100%; margin: auto; display: initial; grid-template-columns: none !important; text-align: center; } .aboutus-wrapper .counter .counter-single { margin: 15px; } .aboutus-wrapper .counter .counter-single h2 { font-size: 28px; font-weight: bold; } .aboutus-wrapper .why-choose-area { width: 100%; background-color: #f7f7f7; margin-top: 50px; } .aboutus-wrapper .why-choose-area h2 { font-size: 20px; line-height: 25px; } .aboutus-wrapper .why-choose-area .choose { display: initial !important; grid-template-columns: none !important; width: 100%; margin-top: 30px; text-align: center; } .aboutus-wrapper .why-choose-area .choose .choose-single { margin-bottom: 20px; } .aboutus-wrapper .our_employ { display: grid; width: 100%; grid-template-columns: repeat(1, 1fr); gap: 10px 36px; } .section-heading-home { margin-top: 20px; } /* ------------------------ */ .register-wrapper .registration-form-wrap { width: 100% !important; border-top-left-radius: 0; border-top-right-radius: 0; } .register-wrapper .registration-form-mentor-wrap { width: 100% !important; border-top-left-radius: 0; border-top-right-radius: 0; } .register-wrapper .registration-area .tab-register { width: 100%; } .courses-wrapper .course-sidebar .tag_r { margin-bottom: 20px !important; } .courses-wrapper .course-sidebar .tag_r h3 { margin-bottom: 0 !important; } .courses-wrapper .courses-list-content .header-courses-list { display: flex; flex-direction: column; align-items: flex-start !important; } .courses-wrapper .courses-list-content .header-courses-list select { margin-top: 10px; } .course-detail-wrapper .row-reverse-custom { flex-direction: column-reverse; } .course-detail-wrapper .course-single-content .course-single-meta { flex-direction: column; align-items: flex-start !important; } .course-detail-wrapper .course-single-content .course-single-meta div { margin-bottom: 5px; } .course-detail-wrapper .course-single-content .review-content-inner { padding: 40px 30px 30px 30px !important; } .course-detail-wrapper .course-single-content .review-content-inner .review-ratings { width: 100% !important; margin: 0 0 10px 0 !important; text-align: center; float: none !important; } .course-detail-wrapper .course-single-content .review-content-inner .rating-bar { width: 100% !important; } .course-detail-wrapper .course-sidebar { margin-top: 20px !important; } /* ------------------------ */ .blog-wrapper .blog-posts .blog-posts-meta ul li { margin-bottom: 10px; } .blog-wrapper .blog-posts h3 a { font-size: 25px !important; } .blog-wrapper .blog-posts .entry-content p { text-align: justify; } /* ------------------------ */ .member-detail-wrapper .content-info-mentor .table-wallet-container { overflow-x: scroll; } .member-detail-wrapper .content-info-mentor .table-wallet-container .table-wallet { width: 500px !important; } .member-detail-wrapper .content-info-mentor .courses h3 { font-size: 25px; } /* ------------------------ */ .member-detail-wrapper .mentor-profile-edit-content .avatar .btn-clear { font-size: 15px; padding: 3px; } /* Footer */ /* ------------------------ */ .feedback-container { margin-top: 24px !important; width: 700px; margin: 0 auto; transition: all 0.3s; } .header-course-search { display: none !important; } .feedback-left-info h2 { font-size: 1rem; font-weight: bold; } .select-feedback-container { margin-top: 24px !important; margin-bottom: 24px !important; width: 700px; margin: 0 auto; transition: all 0.3s; } .feedback-left-info h2 { font-size: 1rem !important; font-weight: bold; } .feedback-right-btn { font-size: 0.79rem !important; font-weight: 500; padding: 6px !important; } .course-content-container-page-course { padding: 0 !important; margin-top: 40px; } .pag-course-bottom { margin-bottom: 40px; } } /* ---------------- */ @media only screen and (max-width: 480px) { .btn-search-course { display: block; background-color: #ff630e; color: #fff; padding: 15px 30px; border-radius: 5px; font-size: 16px; font-weight: 600; text-transform: uppercase; letter-spacing: 1px; margin: 0 auto 10px; width: 100%; } .sidebar-logo { line-height: 0 !important; } .lms-wrapper .banner__lms h2 { line-height: 44px; } .lms-wrapper .section3 h3 { font-size: 32px; } .section-heading { font-size: 32px !important; } .left-section-mobile { padding: 100px 0 !important; } .left-section-mobile h2 { font-size: 26px !important; } .left-section-mobile p { margin-top: -12px; font-size: 16px !important; } .right-section-mobile { padding: 100px 0 !important; } .right-section-mobile h2 { font-size: 26px !important; } .right-section-mobile p { margin-top: -12px; font-size: 16px !important; } .course-detail-cate-online .course-detail-cate-fe-link { margin-left: -50px !important; } .course-detail-cate-fe { display: flex; flex-direction: column; } .course-detail-cate-online { display: flex; flex-direction: column; } .course-detail-mobile-cate { display: flex !important; align-items: center; } .course-detail-mobile-cate { margin-top: 0.7rem !important; margin-bottom: 1.4rem !important; } .course-detail-cate-fe p { font-size: 0.9rem !important; } .course-detail-cate-online { margin-left: 22px; } .course-detail-cate-online p { font-size: 0.9rem !important; } .course-detail-cate-rate p { font-size: 0.9rem !important; } .course-detail-cate-fe-link { font-size: 0.9rem !important; } .course-detail-cate-rate { margin-left: 12px !important; margin-bottom: 24px; } .icon-level-cate { width: 42px !important; height: 42px !important; left: 116px; } .icon-level { width: 32px !important; height: 42px !important; object-fit: cover; } .title-lv { font-size: 0.6rem !important; } .size-font { margin-left: 2px !important; font-size: 0.6rem !important; } .size-font-1 { margin-left: 2px !important; font-size: 0.6rem !important; } .onl-1 { padding: 2px !important; font-size: 0.6rem !important; } .fe-title-1 { padding: 2px !important; font-size: 0.6rem !important; } .list-class-owl-theme .owl-next span { top: 60px !important; right: -20px !important; font-size: 4rem !important; } .list-class-owl-theme .owl-prev span { top: 60px !important; left: -22px !important; font-size: 4rem !important; } .owl-next span { display: none; top: 0 !important; right: 8px !important; font-size: 4rem !important; } .owl-prev span { display: none; top: 0 !important; right: -48px !important; font-size: 4rem !important; } .out__sigle-member { width: 100%; margin-left: 18px; } .card1-total-price-code-lbl { font-size: 0.9rem; width: 52% !important; } .card1-total-price-code-lbl-use-bs { font-size: 0.9rem; width: 100% !important; } .time-select { width: 120px !important; } .card1-total-price-code-input { width: 78% !important; } .feedback-body { display: flex; flex-direction: column; } .feedback-left { display: flex; align-items: center; } .feedback-right { margin-top: 10px; } .content-payment { display: flex; flex-direction: column; } .course-of-member-container { display: flex; justify-content: center; width: 100%; } .course-of-member-inner { width: 87%; } .cart { display: flex; justify-content: center; } .cart-item-box { display: flex; flex-direction: column; justify-content: center; margin-top: 10px; } .section-card-contact { display: flex; flex-direction: column; justify-content: center; margin: 0 auto; margin-top: 22px; margin-bottom: 22px; } .img-avatar { width: 82px; object-fit: cover; } .card1 { transition: all 0.2s; } .card1-info { margin-left: 0 !important; font-size: 0.9rem; font-weight: 400; } .payment-card-desc { font-size: 0.7rem !important; font-weight: 400; } .title-payment-card { font-size: 0.9rem !important; font-weight: 400; } .card1-inner { display: flex; flex-direction: column; } .img-avatar { height: 140px !important; border-radius: 4px; object-fit: cover; width: 200px !important; } .checkout-container .card1-total-price-cost { margin-top: 4px; } .card1-inner .avatar { margin-right: 60px !important; } .card1-info { margin-left: -50px; } .feedback-container { margin-top: 24px !important; width: 400px !important; margin: 0 auto; transition: all 0.3s; } .header-course-search { display: none !important; } .feedback-header { display: flex; justify-content: flex-start; } .feedback-left-info h2 { font-size: 0.9rem !important; font-weight: bold; } .select-feedback-container { margin-top: 24px !important; margin-bottom: 24px !important; width: 400px !important; margin: 0 auto; transition: all 0.3s; } .feedback-left-info h2 { font-size: 0.8rem !important; font-weight: bold; } .feedback-right-btn { margin: 0 !important; padding: 0 !important; font-size: 0.6rem !important; font-weight: 400; padding: 6px !important; } .select-feedback-left-info { font-size: 0.8rem !important; font-weight: bold; } } @media only screen and (min-width: 481px) and (max-width: 590px) { .card1-info { margin-top: 6px; font-size: 0.8rem !important; } .title-payment-card { font-size: 1rem !important; } .section-card-contact { display: flex; flex-direction: column; justify-content: center; margin: 0 auto; margin-top: 22px; margin-bottom: 22px; } .cart-item-box { display: flex; flex-direction: column; justify-content: center; padding: 0; margin-top: 10px; } .img-avatar { width: 92px; } .feedback-body { display: flex; flex-direction: column; } .feedback-left { display: flex; align-items: center; } .feedback-right { margin-top: 10px; } .feedback-container { margin-top: 24px !important; width: 400px !important; margin: 0 auto; transition: all 0.3s; } .header-course-search { display: none !important; } .feedback-header, .feedback-header1 { display: flex; justify-content: flex-start; } .feedback-left-info h2 { font-size: 0.6rem !important; font-weight: bold; } .select-feedback-container { margin-top: 24px !important; margin-bottom: 24px !important; width: 400px !important; margin: 0 auto; transition: all 0.3s; } .feedback-left-info h2 { font-size: 0.2rem !important; font-weight: bold; } .feedback-right-btn { margin: 0 !important; font-size: 0.6rem !important; font-weight: 400; padding: 1px !important; } .select-feedback-left-info { font-size: 0.2rem !important; font-weight: bold; } .checkout { padding: 0 var(--px) !important; } .checkout-container { padding: 0 !important; margin-top: 20px; } .cart { display: flex; justify-content: center; border-bottom: none !important; } .cart-item-box { display: flex; flex-direction: column; justify-content: center; margin-top: 10px; border-right: none !important; } .section-card-contact { display: flex; flex-direction: column; justify-content: center; margin: 0 auto; margin-top: 22px; margin-bottom: 22px; } .card1-total-price-code-input-refer { width: 79% !important; } .card1-total-price-code-input { width: 70% !important; } .course-of-member-inner { width: 100%; } .bill-member { margin-top: 10px; } .total-course-icons { margin-top: 0px !important; } .content-payment { display: flex; flex-direction: column; } .course-of-member-container { display: flex; justify-content: center; width: 100%; } .card1 { transition: all 0.2s; } .card1-info { font-size: 0.8rem; font-weight: 400; } .title-payment-card { font-size: 0.8rem !important; font-weight: 400; } .card1-inner { display: flex; flex-direction: column; } .img-avatar { height: 140px !important; border-radius: 4px; object-fit: cover; width: 138px !important; } .checkout-container .card1-total-price-cost { margin-top: 4px; } } @media only screen and (min-width: 1025px) and (max-width: 1200px) { .content-payment { display: flex; flex-direction: column; } .course-of-member-container { display: flex; justify-content: center; width: 100%; } .course-of-member-inner { width: 87%; } .cart { display: flex; justify-content: center; } .cart-item-box { display: flex; flex-direction: column; justify-content: center; margin-top: 10px; } .section-card-contact { display: flex; flex-direction: column; justify-content: center; margin: 0 auto; margin-top: 22px; margin-bottom: 22px; } } @media only screen and (min-width: 1024px) and (max-width: 1200px) { .img-avatar { width: 140px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .advantages-2 .advantages-2-content h4 { font-size: 16px !important; margin-bottom: 0 !important; } .advantages-2 .advantages-2-content h2 { font-size: 22px !important; margin-bottom: 0 !important; } .title-index1 { font-size: 12px !important; } .content-payment { display: flex; flex-direction: column; } .course-of-member-container { display: flex; justify-content: center; width: 100%; } .course-of-member-inner { width: 87%; } .cart { display: flex; justify-content: center; } .cart-item-box { display: flex; flex-direction: column; justify-content: center; margin-top: 10px; } .section-card-contact { display: flex; flex-direction: column; justify-content: center; margin: 0 auto; margin-top: 22px; margin-bottom: 22px; } .img-avatar { width: 140px; } } @media only screen and (min-width: 481px) and (max-width: 768px) { .advantages-2 .advantages-2-content h4 { font-size: 15px !important; margin-bottom: 0 !important; } .advantages-2 .advantages-2-content h2 { font-size: 21px !important; margin-bottom: 0 !important; } .title-index1 { font-size: 11px !important; } .img-avatar { width: 140px; } .feedback-container { margin-top: 24px !important; width: 600px; margin: 0 auto; transition: all 0.3s; } .header-course-search { display: none !important; } .feedback-left-info h2 { font-size: 0.9rem !important; font-weight: bold; } .select-feedback-container { margin-top: 24px !important; margin-bottom: 24px !important; width: 600px; margin: 0 auto; transition: all 0.3s; } .feedback-left-info h2 { font-size: 0.8rem; font-weight: bold; } .feedback-right-btn { font-size: 0.9rem !important; font-weight: 400; padding: 5px !important; } .card1 { transition: all 0.2s; } .card1-info { font-size: 0.8rem; font-weight: 400; } .title-payment-card { font-size: 0.5rem; font-weight: 400; } .card1-inner { display: flex; flex-direction: column; } .checkout-container .card1-total-price-cost { margin-top: 4px; } .card1-info { margin-top: 6px; font-size: 0.8rem !important; } .title-payment-card { font-size: 1rem !important; } } @media only screen and (min-width: 480px) and (max-width: 685px) { .img-avatar { width: 120px; } .card1-info { margin-top: 6px; font-size: 0.8rem !important; } .title-payment-card { font-size: 1rem !important; } .feedback-container { margin-top: 24px !important; width: 500px; margin: 0 auto; transition: all 0.3s; } .header-course-search { display: none !important; } .feedback-left-info h2 { font-size: 0.8rem; font-weight: bold; } .select-feedback-container { margin-top: 24px !important; margin-bottom: 24px !important; width: 500px; margin: 0 auto; transition: all 0.3s; } .feedback-left-info h2 { font-size: 0.9rem; font-weight: bold; } .feedback-right-btn { font-size: 0.8rem !important; font-weight: 400; padding: 5px !important; } .card1 { transition: all 0.2s; } .card1-info { font-size: 0.8rem; font-weight: 400; } .title-payment-card { font-weight: 400; } .card1-inner { display: flex; flex-direction: column; } .img-avatar { width: 400px !important; object-fit: cover; } .card1-inner .avatar { margin-right: 240px; } .card1-info { margin-left: -50px; } .checkout-container .card1-total-price-cost { margin-top: 4px; } } @media only screen and (min-width: 767px) and (max-width: 991px) { .cart-item-box { display: flex; flex-direction: column; justify-content: center; margin-top: 10px; } .section-card-contact { display: flex; flex-direction: column; justify-content: center; margin: 0 auto; margin-top: 22px; margin-bottom: 22px; } } @media only screen and (max-width: 420px) { .course-detail-cate-online .course-detail-cate-fe-link { margin-left: -50px !important; } .course-detail-cate-fe { display: flex; flex-direction: column; } .course-detail-cate-online { display: flex; flex-direction: column; } .course-detail-mobile-cate { display: flex !important; align-items: center; } .course-detail-mobile-cate { margin-top: 0.7rem !important; margin-bottom: 1.4rem !important; } .course-detail-cate-fe p { font-size: 0.9rem !important; } .course-detail-cate-online { margin-left: 22px; } .course-detail-cate-online p { font-size: 0.9rem !important; } .course-detail-cate-rate p { font-size: 0.9rem !important; } .course-detail-cate-fe-link { font-size: 0.9rem !important; } .course-detail-cate-rate { margin-left: 12px !important; margin-bottom: 24px; } .icon-level-cate { width: 42px !important; height: 42px !important; left: 116px; } .list-class-owl-theme .owl-next span { top: 60px !important; right: -20px !important; font-size: 4rem !important; } .list-class-owl-theme .owl-prev span { top: 60px !important; left: -400px !important; font-size: 4rem !important; } .card1-total-price-code { align-items: start; display: flex; flex-direction: column; } .card1-total-price-code-input { width: 68% !important; margin-left: 0 !important; } .feedback-body { display: flex; flex-direction: column; } .feedback-left { display: flex; align-items: center; } .feedback-right { margin-top: 10px; } .feedback-container { margin-top: 24px !important; width: 320px !important; margin: 0 auto; transition: all 0.3s; } .header-course-search { display: none !important; } .feedback-left-info h2 { font-size: 0.4rem; font-weight: bold; } .select-feedback-container { margin-top: 24px !important; margin-bottom: 24px !important; width: 320px !important; margin: 0 auto; transition: all 0.3s; } .feedback-left-info h2 { font-size: 0.4rem; font-weight: bold; } .feedback-right-btn { font-size: 0.8rem !important; font-weight: 400; padding: 6px !important; } .card1-inner { display: flex; flex-direction: column; } .img-avatar { height: 140px; border-radius: 4px; object-fit: cover; width: 138px; } .checkout-container .card1-total-price-cost { margin-top: 4px; } .card1-info { margin-top: 6px; font-size: 0.8rem !important; } .title-payment-card { font-size: 0.8rem !important; } } @media only screen and (min-width: 991px) and (max-width: 1200px) { .course-content-container-page-course { padding: 0 !important; margin-top: 40px; } .pag-course-bottom { margin-bottom: 40px; } } @media only screen and (min-width: 1200px) and (max-width: 1470px) { .title_img_aboutus-text { font-size: 16px; } .font-title { font-size: 30px !important; } } @media only screen and (min-width: 1201px) and (max-width: 1670px) { .img_aboutus_3 { position: absolute; top: 260px; bottom: 0; right: 0; text-align: center; margin: 0 auto; display: grid; justify-content: center; align-content: center; width: 20%; text-align: justify; } .bt-aboutus_1 { border: 0; line-height: 25px; display: block; background-color: #ff630e; color: #fff; padding: 10px 15px; border-radius: 30px; font-size: 15px; font-weight: 600; text-transform: uppercase; letter-spacing: 1px; margin: 0 auto 10px; width: 100%; } } @media only screen and (min-width: 390px) and (max-width: 499px) { .list-class-owl-theme .owl-next span { top: 60px !important; right: -20px !important; font-size: 4rem !important; } .list-class-owl-theme .owl-prev span { top: 60px !important; left: -400px !important; font-size: 4rem !important; } .card1-total-price-code { display: flex; flex-direction: column; } .card1-total-price-code-input { width: 68% !important; margin-left: 0 !important; } .bt-aboutus_1 { object-fit: cover; border: 0px; display: block; background-color: rgb(255, 99, 14); color: rgb(255, 255, 255); padding: 1px 2px; border-radius: 10px; font-size: 5px; font-weight: 500; text-transform: uppercase; letter-spacing: 1px; margin: 0px auto 10px; width: 100%; } .img_aboutus_3 { object-fit: cover; position: absolute; top: 88px; bottom: 0; right: 30px; text-align: center; margin: 0 auto; display: grid; justify-content: center; align-content: center; width: 20%; text-align: justify; } } @media only screen and (min-width: 390px) and (max-width: 480px) { .bt-aboutus_1 { margin-top: 80px !important; border: 0px; display: block; background-color: rgb(255, 99, 14); color: rgb(255, 255, 255); padding: 1px 5px; border-radius: 30px; font-size: 5px; font-weight: 600; text-transform: uppercase; letter-spacing: 1px; margin: 0px auto 10px; width: 100%; } .advantages-2 .advantages-2-content h4 { font-size: 14px !important; margin-bottom: 0 !important; } .advantages-2 .advantages-2-content h2 { font-size: 20px !important; margin-bottom: 0 !important; } .title-index1 { font-size: 11px !important; } .img-avatar { width: 200px !important; object-fit: cover; } .list-class-owl-theme .owl-next span { top: 60px !important; right: -20px !important; font-size: 4rem !important; } .list-class-owl-theme .owl-prev span { top: 60px !important; left: -400px !important; font-size: 4rem !important; } .card1-total-price-code { align-items: start; display: flex; flex-direction: column; } .card1-total-price-code-input { width: 68% !important; margin-left: 0 !important; } .card1-total-price-code-input-refer { padding: 0; width: 100% !important; margin-left: 0 !important; } } @media screen and (max-width: 360px) { .wrapper .contact-info .li-title-2 { margin-left: 30px !important; } .course-detail-cate-online .course-detail-cate-fe-link { margin-left: -50px !important; } .course-detail-cate-fe { display: flex; flex-direction: column; } .course-detail-cate-online { display: flex; flex-direction: column; } .course-detail-mobile-cate { display: flex !important; align-items: center; } .course-detail-mobile-cate { margin-top: 0.7rem !important; margin-bottom: 1.4rem !important; } .course-detail-cate-fe p { font-size: 0.8rem !important; } .course-detail-cate-online { margin-left: 22px; } .course-detail-cate-online p { font-size: 0.8rem !important; } .course-detail-cate-rate p { font-size: 0.8rem !important; } .course-detail-cate-fe-link { font-size: 0.8rem !important; } .course-detail-cate-rate { margin-left: 12px !important; margin-bottom: 24px; } .icon-level-cate { width: 42px !important; height: 42px !important; left: 100px; } } @media only screen and (min-width: 480px) and (max-width: 650px) { .bt-aboutus_1 { margin-top: 100px !important; border: 0px; display: block; background-color: rgb(255, 99, 14); color: rgb(255, 255, 255); padding: 1px 5px; border-radius: 30px; font-size: 6px; font-weight: 600; text-transform: uppercase; letter-spacing: 1px; margin: 0px auto 10px; width: 100%; } } @media only screen and (min-width: 480px) and (max-width: 766px) { .img-1 { width: 100% !important; } } @media only screen and (min-width: 360px) and (max-width: 470px) { .wrapper .contact-info .li-title-2 { margin-left: 70px !important; } }/*# sourceMappingURL=styles.css.map */