@font-face {
    font-family: 'Kommon Grotesk Normal' !important;
    src: url('../fonts/KommonGrotesk-Normal.ttf') format('truetype') !important; /* Chrome 4+, Firefox 3.5, Opera 10+, Safari 3—5 */
}  
@font-face {
    font-family: 'JostBold';
    src: url('../fonts/Jost-Bold.ttf');
}
@font-face {
    font-family: 'JostMedium';
    src: url('../fonts/Jost-Medium.ttf');
}
@font-face {
    font-family: 'JostRegular';
    src: url('../fonts/Jost-Regular.ttf');
}
@font-face {
    font-family: 'CroissantOne';
    src: url('../fonts/CroissantOne-Regular.ttf');
}
h1, h2, h3, h4, h5, h6{
    font-family:'JostMedium',sans-serif;
}
.breadcrumb li{
    font-family:'JostRegular',sans-serif; 
}
a{
    text-decoration: none;
}
.badge{
    font-weight: 500 !important;
}
.gray-bg {
    background: #f1f7f8;
}
.cropped-home-banner{
	position: absolute;
    width: 0px;
    height: 0px;
    top: 0;
    border-left: 0px solid #f1f7f800;
    border-right: 70px solid #13d76203;
}

h3.header-title{
    font-family: 'JostMedium',sans-serif; 
    font-size: 36px;
    font-weight: 600;
    color: #020c15;
}
h3.header-title span{   
    /* font-family: 'CroissantOne';  */
    color: #7b32a3;
}
h5.card-title, .two-side-curve-content h2, .h5, h5{
    font-family: 'JostMedium',sans-serif; 
}
.section-blog .card-body a.link{
    font-family: 'JostRegular',sans-serif;
    font-weight: 600;
    color: #7b32a3;
}
@media only screen and (max-width: 766px){
	.cropped-home-banner{
	    display: none;
	}
	.home-banner-area{
	    background: none !important;
	    padding: 80px 0 75px !important;
	}
	.home-banner-wrap{
		max-width: 100% !important;
		text-align: center;
	}
}
.bg-background{
    background: #f1f7f8;
}
.bg-transparent{
    background: #00000000 !important;
}
.top-categories{
    width: 100%;
    min-height: 90px;
    background-color: #fff;
    padding: 20px 15px;
    display: inline-flex;
    box-shadow: 1px 1px 60px 0px rgb(0 0 0 / 20%);
    border: 1px dashed #fff;
    border-radius: 0px 30px 35px 35px;
    text-decoration: none;
}
.color-change div.alternate-color:nth-child(odd) a:hover {
    background-color: #020c15;
    border: 1px dashed #020c15;
}
.color-change div.alternate-color:nth-child(even) a:hover {
    background-color: #7b32a3;
    border: 1px dashed #7b32a3;
}

/* .top-categories:hover, .top-categories:focus{
    background-color: #7b32a3;
    border: 1px solid #7b32a3;
} */
.category-icon{
    width: 36px;
    height: 36px;
    background-color: #fff;
    border-radius: 0% 50% 50% 50%;
    border: 1px dashed #7b32a3;
    text-align: center;
    line-height: 36px;
    margin-top: 7px;
    font-size: 20px;
    position: absolute;
}
.top-categories:hover .category-icon, .top-categories:focus .category-icon{
	background-color: #f5f9fa;
	color: #000;
}
.category-title{
    padding-left: 50px;
    font-weight: 600;
    font-family: 'JostRegular',sans-serif;
}
.top-categories:hover .category-title, .top-categories:focus .category-title{
	color: #fff;
}
.category-title p{
    color: #b4b4b4;
    font-size: 14px;
    font-weight: 400 !important;
    margin-top: 2px;
    margin-bottom: 1px;
}
.top-categories:hover .category-title p, .top-categories:focus .category-title p{
	color: #efdcdc;
}
.divider-1{
	background-color: #b8c3c5;
	margin-left: -15px;
    margin-right: -10px;
    margin-top: 12px;
    margin-bottom: 6px;
}

.compare-row{
    margin-top: 25px;
    background-color: #fff;
    border: 1px solid #f1f7f8;
    border-radius: 10px;
    padding: 28px 10px;
}
.brn-compare-sm{
    border: 1px solid #7b32a3;
    color: #fff;
    background: #7b32a3;
    font-size: 11px;
    border-radius: 3px;
    padding: 2.5px 8px 2.5px 8px;
}
.brn-compare-sm:hover, .brn-compare-sm:focus{
    border: 1px solid #592475;
    color: #fff;
    background: #592475;
    font-size: 11px;
    /* border-radius: 0 30px 30px 30px; */
    border-radius: 3px;
    padding: 2.5px 8px 2.5px 8px;
}
.badge-sub-warning{
    background-color: #eceb98 !important;
    color: #3c3c2d !important;
    padding: 5px 10px 5px 10px;
    border-radius: 6px;
}
.floating-user{
    width: auto;
    height: 30px;
}
.floating-user img{
    border-radius: 0px 15px 15px 15px;
    position: absolute;
}
.floating-user img:hover, .floating-user img:focus{
    z-index: 999;
}
.become-user-label{
    background-color: #7b32a3;
    color: white;
    padding: 50px 15px;
    border-radius: 10px;
}
.become-user-label a{
    border: none;
    background-color: #fff;
    font-size: 13px;
    font-weight: 700;
    padding: 10px 22px;
    border-radius: 5px;
    color: #626262;
    text-decoration: none;
}
.become-user-label a:hover{
    box-shadow: 0px 3px 31px 1px #b44b4b;
}
.text-sub-warning{
    color: #eceb98 !important;
}
.badge-sub-warning{
    background-color: #020c15 !important;
    color: #eee !important;
    padding: 6px 15px 6px 15px;
    border-radius: 3px;
}
.footer-hover-link{
    text-decoration: none;
    font-size: 14px;
}
.footer-hover-link:hover{
    color: #000000 !important;
    text-shadow: 0px 0px 10px #d8d8d8;
}

.language_selector{
    border-radius: 5px;
    padding: 2px 10px;
    font-size: 14px;
    background: #f1f7f8;
    border-color: #b1b1b1;
}
ul.footer-social-link{
    list-style: none;
    padding-left: 0px;
    height: 48px;
    padding-top: 15px;
}
ul.footer-social-link li{
    display: inline-block;
    background-color: #7b32a3;
    color: #fff;
    margin: 0px 15px 0px 0px;
    border-radius: 50%;
    height: 36px;
    width: 36px;
    line-height: 39px;
    text-align: center;
    box-shadow: 0px 2px 13px 2px #e0e0e0;
}
ul.footer-social-link li a{
    display: block;
    color: #fff;
    font-size: 15px;
}
ul.footer-social-link li:hover{
    background-color: #020c15;
}
ul.footer-social-link li a:hover{
    color: #ddd;
}
section.featured-instructor{
    background: white;
    padding: 35px 0px;
}
.top-instructor-img{
    max-width: 250px;
}
.top-instructor-img img{
    border-radius: 0px 50% 50% 50%;
    border: 1px dashed #f7f7f7;
}
.top-instructor-details{
    padding: 0px 22px;
}
p.top-instructor-arrow span{
    background-color: #000;
    color: #e9e9e9;
    display: inline-block;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    text-align: center;
    font-size: 16px;
}
p.top-instructor-arrow span i{
    line-height: 30px;
}
.slick-list.draggable{
    border-radius: 10px;
}
.hover-shadow-1:hover{
    box-shadow: 0px 0px 5px 0px #9090902e !important;
}
.bg-light-purple{
    background: #f1f7f8;
}
.footer-area{
    border-bottom: 8px solid #7b32a3;
    background: url('../img/footer-img.jpg');
}
.py-15{
    padding: 80px 0px;
}
.image-placeholder-1{
    position: absolute;
    width: 100%;
    height: 100% !important;
    background: linear-gradient(91deg, rgb(0 0 0 / 24%) 0%, rgba(0,35,51,0) 100%) !important;
}
.image-placeholder-2{
    position: absolute;
    width: 100%;
    height: 100% !important;
    background: linear-gradient(91deg, rgb(0 0 0 / 50%) 0%, rgb(0 0 0 / 50%) 100%) !important;
}

.compare-row{
    margin-top: 0;
    background-color: #eef2f6;
    /* border: 1px dashed #808080; */
    border-bottom: 1px solid #8c8c8c;
    border-radius: 4px;
    padding: 28px 10px;
}
.compare-row-icon{
    height: 26px;
    width: 26px;
    line-height: 26px;
    /* background: #36464e;
    border-radius: 0px 50% 50%; */
    font-size: 13px;
    color: #7b32a3;
    text-align: center;
}
.skill-level-icon{
    width: 24px;
    height: 24px;
    background-color: transparent;
}
.skill-level-icon span{
    background-color: #dcdee1;
    margin-left: 1.5px;
    margin-right: 1.5px;
    float: left;
}
.skill-level-icon .active{
    background-color: #7b32a3;
}
.skill-level-icon span:first-of-type{
    width: 5px;
    height: 8px;
    margin-top: 16px;
}
.skill-level-icon span:nth-of-type(2n){
    width: 5px;
    height: 16px;
    margin-top: 8px;
}
.skill-level-icon span:last-of-type{
    width: 5px;
    height: 24px;
}

.marge-input-box input{
    border-radius: 4px;
    border-right: 0px;
    font-size: 13px;
}

.marge-input-box .input-group-append{
    border: 1px solid #cccfe7;
    border-radius: 4px;
    border-left: none !important;
}
.marge-input-box button{
    background: #7b32a3;
    color: #fff;
    font-weight: 500;
    margin: 5px;
    font-size: 13px;
    border-radius: 4px;
}
.marge-input-box button:hover{
    background: #36464e;
    color: #fff;
}








/*Signup & sign in page login*/
.sign-up-form{
    /* background: #fff; */
    /* background: -webkit-linear-gradient(290deg,#f6f7fa 50%,#278bd6 0),-webkit-linear-gradient(290deg,rgba(212,227,240,0) 48%,#d4e3f0 50%); */
    background: linear-gradient(290deg,#f5f7fa 50%,#e9d7ff 0),linear-gradient(290deg,rgba(212,227,240,0) 48%,#d4e3f0 50%);
    padding: 35px 30px;
    border-radius: 10px;
    box-shadow: 0px 0px 10px -1px #ebebeb;
}
.sign-up-form .form-group{ margin-bottom: 15px; }
.sign-up-form .form-group label{
    color: #5c5c5c;
    font-weight: 600;
}
.sign-up-form .form-group .input-group span{
    border-right: none;
    padding: 12px 8px 12px 15px;
    border-radius: 10px;
    /* color: #878787; */
    color: #7b32a3;
    font-size: 15px;
    font-weight: 500;
    border: 0;
}
.sign-up-form .form-group .input-group input{
    border-left: none;
    padding: 12px 5px;
    border-radius: 10px;
    color: #878787;
    font-size: 13px;
    font-weight: 500;
    border: 0;
}

.sign-up-form .form-group textarea.form-control{
    border: none;
    padding: 12px 5px 12px 15px;
    border-radius: 10px;
    color: #878787;
    font-size: 13px;
    font-weight: 500;
    border: 0;
}
/*End Signup & sign in page login*/




/*used on Home page*/
.animated-loader{
    width: 100px;
    height: 100px;
    line-height: 100px;
    padding: 0px;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
}

.common-search-box{
    margin-right: 50px;
    padding: 0px 0;
}
.common-search-box input{
    background-color: hsl(192deg 33% 97%);
    border: 1px solid hsl(192deg 33% 97%);
    height: 40px;
    padding: 0 15px;
    border-radius: 5px 0 0 5px;
    font-size: 13px;
}
.common-search-box input:focus{
    background-color: #fff;
    border-color: #dedfe0;
    border-right-color: transparent;
}
.common-search-box input:focus + .input-group-button{
    background-color: #fff !important;
    border-top: 1px solid #dedfe0 !important;
    border-right: 1px solid #dedfe0 !important;
    border-bottom: 1px solid #dedfe0 !important;
    padding: 5px 9px 5px 10px !important;
}
.common-search-box button{
    background-color: #7b32a3 !important;
    border-color: #7b32a3;
    color: #fff;
    padding: 1px 6px;
    border-radius: 4px;
}
.common-search-box button:hover{
    color: #efefef;
}
.common-search-box .input-group-button {
    background-color: hsl(192deg 33% 97%);
    padding: 6px 10px 6px 10px;
    border-radius: 0px 5px 5px 0px;
}
input:-internal-autofill-selected {
    appearance: menulist-button;
    background-image: none !important;
    background-color: -internal-light-dark(rgb(244, 235, 249), rgba(70, 90, 126, 0.4)) !important;
    color: -internal-light-dark(black, white) !important;
}
.btn-purple {
    color: #fff;
    background-color: #7b32a3;
    border-color: #7b32a3;
    border-radius: 0.25rem;
    padding: 6px 28px;
    line-height: 23px;
    /* border-radius: 0px 30px 30px 30px; */
}
.btn-purple:hover {
    color: #fff;
    background-color: #9e4fc9 !important;
    border-color: #9e4fc9 !important;
}
.btn-outline-purple{
    color: #7b32a3 !important;
    background-color: #fff;
    border: 1px solid #7b32a3;
    border-radius: 0.25rem;
    padding: 6px 28px;
    line-height: 23px;
}
.category-filter-box .btn-light, .category-filter-box .btn-purple{
    border-radius: 0px 50% 50%;
}
.category-filter-box .btn-light{
    border: 1px dashed;
}
.btn-purple:hover {
    color: #fff;
    background-color: #36464e;
    border-color: #36464e;
}
.btn.purple{
    color: #fff;
    background-color: #7b32a3;
    border-color: #7b32a3;
    padding: 11px 12px;
    font-size: 15px;
    border-radius: 2px;
    line-height: 1.35135;
    font-weight: 600;
}
.btn.purple:hover{
    color: #fff;
    background-color: #36464e;
    border-color: #36464e;
}
/*Login Form Section*/
section.login-form-area {
    padding-top: 50px;
    padding-bottom: 50px;
}
.login-form-area {
    background: url('../img/form-img.jpg') no-repeat;
    background-size: cover;
}
/*Banner Section*/
.banner-section{
    /* background: url('../img/banner-img.png'); */
    background: url('../img/form-img1.png') no-repeat center center;
    background-size: cover;
}
.banner-section h1{
    font-family: 'JostMedium',sans-serif;
    font-size: 56px;
    font-weight: 600;
}
.banner-section h1 span{
    /* font-family: 'CroissantOne'; */
    color: #7b32a3;
}
.banner-section h3{
    font-family: 'JostRegular',sans-serif;
    font-weight: 300;
}
.banner-section p{
    font-size: 22px;
}
.crp_box {
    display: block;
    width: 100%;
    background: #7b32a3;
    border-radius: 0px 30px 35px 35px;
    padding:2rem 1rem;
	z-index:1;
	position: relative;
    box-shadow: 0 0 20px 0 rgb(62 28 131 / 10%);
	-webkit-box-shadow: 0 0 20px 0 rgb(62 28 131 / 10%);
}
.ovr_top {
    margin-top: -50px;
}
.home-fact-box .text-box h4{
    font-family: 'JostBold',sans-serif;
}
/*Custom print content*/
    @media print{
        .print-content{
            position: fixed !important;
            margin: 0 !important;
            top: 0 !important;
            bottom: 0 !important;
            left: 0 !important;
            right: 0!important;
            z-index: 3333 !important;
            width: 100% !important;
            background: #fff !important;
        }
        footer, nav, title{
            display: none !important    ;
        }
        body{
            overflow: hidden !important ;
        }
    }
/*End Custom print content*/



.course-box:before{
    content: "";
    position: absolute;
    right: -25px;
    top: 70%;
    transform: translateY(-50%);
    width: 45px;
    height: 45px;
    border-radius: 50%;
    z-index: -1;
    background:#020c15;
    display: none;
}
/* .course-box::after{
    content: "";
    position: absolute;
    right: -25px;
    top: 70%;
    transform: translateY(-50%);
    width: 45px;
    height: 45px;
    border-radius: 50%;
    z-index: -1;
    background:#020c15;
} */

/*counter-section*/
.counter-section .sub-title{
    font-family:'JostRegular',sans-serif;
    text-transform: uppercase;
    font-weight: 600;
}
.counter .number {
    font-size: 40px;
    font-weight: 800;
    line-height: 1;
    display: block;
    color: #7b32a3;
    margin-bottom: 10px;    
}
.counter h6{
    font-family:'JostMedium',sans-serif;
    font-size: 17px;
    /* text-transform: uppercase; */
}
/*Button*/  
.btn-pd{
    padding-top:12px !important;
    padding-bottom:12px !important;
    padding-left:45px !important;
    padding-right:45px !important;
}
.btn-outline{
    color: #020c15;
    border: 1px solid #020c15;
    border-radius: 0 30px 30px 30px;    
}
.btn-outline:hover{
    color: #fff;
    border: 1px solid #7b32a3;
    background: #7b32a3;    
}
.btn-white{
    color: #020c15;
    border: 1px solid #fff;
    border-radius: 0 30px 30px 30px;    
}
.btn-white:hover{
    color: #fff;
    border: 1px solid #020c15;
   background: #020c15;   
}
.btn-darkblue{
    color: #fff;
    background: #020c15;
    border: 1px solid #020c15;
    border-radius: 0 30px 30px 30px; 
    padding: 6px 20px;
}
.btn-darkblue:hover{
    border: 1px solid #629313;
    background: #629313;
    color: #fff;
}
/*Testimonial start*/
.testimonials-area {
    position: relative;
    overflow: hidden;
}
.testimonials-item img {
    position: relative;
    /* margin-top: -75px; */
    width: 80px!important;
    /* border-radius: 0px 50% 50%; */
    border-radius: 50%;
    margin-bottom: 15px;
}
.testimonials-item {
    position: relative;
    z-index: 1;
    /* margin-top: 45px; */
    margin-top: 0;
    margin-bottom: 30px;
    /* background-color: var(--whiteColor); */
    background: #eef2f6;
    /* border-radius: 0px 30px 30px; */
    border-radius: 8px;
    padding: 40px;
    /* -webkit-box-shadow: 0 0 15px rgb(0 0 0 / 6%);
    box-shadow: 0 0 15px rgb(0 0 0 / 6%); */
    box-shadow: none;
    margin-left: 15px;
    margin-right: 15px;
}

.testimonial-carousel .slick-prev:hover,
.testimonial-carousel .slick-next:hover{
    /* box-shadow: 0 2px 8px 2px rgba(20,23,28,.15); */
}
.testimonial-carousel .slick-prev:focus,
.testimonial-carousel .slick-next:focus{
    /* box-shadow: 0 0 1px 1px rgba(20,23,28,.1), 0 3px 1px 0 rgba(20,23,28,.1) !important; */
}

.testimonial-carousel .slick-prev,
.testimonial-carousel .slick-next{
    width: 47px;
    height: 47px;    
    background-color: #fff;
    /* box-shadow: 0 0 1px 1px rgba(20,23,28,.1), 0 3px 1px 0 rgba(20,23,28,.1); */
    box-shadow: none !important;
    z-index: 999999;
    top: calc( 50% - 25px);
    /* border: 1px solid #7b32a3; */
    border-radius: 50%;
}
.testimonial-carousel .slick-prev{
    left: 2px;
    /* border-radius: 0% 50% 50% 50%; */
}
.testimonial-carousel .slick-prev.slick-disabled,
.testimonial-carousel .slick-next.slick-disabled{
    opacity: 0;
}
.testimonial-carousel .slick-prev:before{
    content: url(../img/icons/prev_arrow.png);
    line-height: 0;
    opacity: 1
}
.testimonial-carousel .slick-next{
    right: 2px;
    /* border-radius: 50% 0px 50% 50%; */
}
.testimonial-carousel .slick-next:before{
    content: url(../img/icons/next_arrow.png);
    line-height: 0;
    opacity: 1;
}
/*COMPARE start*/
.course-compare-list-area{

}
/*BLOG start*/
.section-blog{
    background: url('../img/blog-img.jpg');
}
.section-blog.no-bg{
    background: transparent;
}
.section-blog .card{
    border: none;
    -webkit-box-shadow: 0 20px 50px rgb(0 0 0 / 5%);
    box-shadow: 0 20px 50px rgb(0 0 0 / 5%);
    border-radius: 0px 20px 0px 0px !important;
}
.section-blog .card img{
    /* border-radius: 0px 20px 0px 0px !important; */
    border-radius: 4px 4px 0 0 !important;
}
.section-blog .card .floating-user img{
    border-radius: 0px 15px 15px 15px !important;
}
.section-blog .card-footer{
    background: #fff;
    /* border-top: 1px solid rgba(123, 50, 163,.125); */
    /* border-top: none; */
}
.blog-search-input{
    /* height: 42px;
    background-color: #f1f7f8;
    border: 1px solid #cdcdcd;
    border-radius: 0px 0px 0px 30px; */
    background-color: #fff;
    border: 1px solid #fff;
    padding: 10px 15px 10px 20px;
    font-size: 18px;
    box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px !important;
}
.blog-search-input.form-control:focus{
    box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px !important;
    border: 1px solid #fff;
}
.blog-search-button{
    /* display: none; */
    padding: 0px 20px;
    border: none;
    border-radius: 0px 30px 30px 0px;
    border-top: 1px solid #cdcdcd;
    border-bottom: 1px solid #cdcdcd;
    border-right: 1px solid #cdcdcd;
    background-color: #fff;
}
.ellipsis-line-2{
    display: -webkit-box!important;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: normal;
}
.ellipsis-line-3{
    display: -webkit-box!important;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: normal;
}
.user-icon{
    width: 22px;
    height: 22px;
    align-items: center;
    justify-content: center;
    display: flex;
    background: #ffffff;
    border: 1px solid rgba(123, 50, 163,.15);
    border-radius: 50%;
    margin-right: 5px;
    font-size: 10px;
}
.user-clock{
    width: 22px;
    height: 22px;
    align-items: center;
    justify-content: center;
    display: flex;
    background: #ffffff;
    border: 1px solid rgba(123, 50, 163,.15);
    border-radius: 50%;
    margin-right: 5px;
    font-size: 10px;
}
.icon-set{
    display: flex;
    align-items: center;
}
.text-purple{
    color: #7b32a3 !important;
}
p.price.text-right{
    margin-bottom: 0;
}
/* .user-icon i{
    width: 28px;
    height: 28px;
    align-items: center;
    justify-content: center;
} */
/*End Blog*/
/***********Bac*********/

/***********Shape*********/
.section-50{
    padding-top: 50px;
    padding-bottom: 50px;
}
.cart-course-wrapper .floating-user img{
    border: 1px dashed #808080;
}
.compare-select-box, .compare-select-box:focus, .cart-sidebar{
    border-radius: 4px !important;
    background-color: #e6d8ff;
    border: 0;
}
.card-img-top{
    border-radius:4px !important;
}
/***********Shape*********/
/***********My Courses*********/
.my-courses-area .course-box:before{
    content:none;
}
.my-courses-area .btn.bg-background{
    border-radius: 4px;
    padding: .375rem 1.5rem;
}
.message-area .btn.btn-outline-secondary, .message-area .btn.btn-secondary, .message-area .btn.btn-light {
    border-radius: 4px;
}
/***********My Courses*********/

/*---------------------------------------------
Update Css
---------------------------------------------*/
/* .banner-gradient{
    background: linear-gradient(145deg,#fad4ff,#d4dbff);
    background-image: linear-gradient(180deg, rgba(255,255,255,0.01), rgba(255,255,255,1) 85%),radial-gradient(ellipse at top left, rgba(13,110,253,0.5), transparent 50%),radial-gradient(ellipse at top right, rgba(255,228,132,0.5), transparent 50%),radial-gradient(ellipse at center right, rgba(255,228,132,0.5), transparent 50%),radial-gradient(ellipse at center left, rgba(214,51,132,0.5), transparent 50%); 
} */
.breadcrumb-pd{
    padding-top: 85px !important;
    padding-bottom: 17px !important;
}
.bg-gradient-purple.breadcrumb-pd h1, .breadcrumb .display-6, section.page-header-area.my-course-area h1{
    font-size: 22px;
    margin-bottom: 0;
}
section.page-header-area.my-course-area {
    padding-top: 40px;
    padding-bottom: 0;
}
section.page-header-area.my-course-area .page-title.py-60{
    padding-top: 45px;
    padding-bottom: 20px;
}
.breadcrumb-item.active, .breadcrumb-item.display-6.fw-bold {
    font-weight: normal !important;
	font-size: 13px !important;
}
.bg-gradient-purple.breadcrumb-pd p{
    margin-bottom: 0;
    margin-top: 4px;
}
.py-80-65{
    padding-top: 145px;
    padding-bottom: 65px;
}
.py-60{
    padding-top: 60px;
    padding-bottom: 60px;
}
.py-60-30{
    padding-top: 60px;
    padding-bottom: 30px;
}
.py-35{
	padding-top: 35px;
    padding-bottom: 35px;
}
.py-10{
	padding-top: 5px;
    padding-bottom: 35px;
}
.search-form .form-control{
    background-color: #fff;
    border: 1px solid #fff;
    padding: 10px 15px 10px 20px;
    font-size: 18px;
    box-shadow: 1px 1px 60px 0px rgb(0 0 0 / 20%) !important;
}
.search-form .input-group-text.btn-search {
    background-color: #7b32a3;
    color: #fff;
    line-height: 31px;
    border: 1px solid #7b32a3;
    padding-left: 18px;
    padding-right: 18px;
}
.categories{
    text-align: center;
    margin-bottom: 15px;
}
.categories img{
    height: 70px;
    width: auto;
    margin-bottom: 15px;
}
.categories h6{
    margin-bottom: 3px;
}
.categories span{
    font-size: 14px;
    color: #808080;
}
.btn-main{
    background-color: #7b32a3; 
    border: 0;
    color: #fff;
    padding: 8px 30px;
}
.btn-main:hover{
    background-color: #672a89;
    color: #fff;
}
.btn-white-one{
    background-color: #fff; 
    border: 0;
    color: #000;
    padding: 8px 30px;
}
.btn-white-one:hover{
    background-color: #eef2f6;
    color: #000;
}
ul.ul-skill{
    position: relative;
    background: #7b32a3;
    color: #fff;
    padding: 40px 40px 40px 20px;
    border-radius: 8px;
    width: fit-content;
}
ul.ul-skill li{
    line-height: 42px;
    list-style-type: none;
    padding: 0.25em 0 0 2.5em;
    position: relative;
}
ul.ul-skill li:before {
    content: " ";
    position: absolute;
    left: 0.5em;
    top: 23%;
    border: solid 0.7em #3fb6c2;
    border-radius: 0.8em;
}
ul.ul-skill li:after {
    content: " ";
    width: 0.4em;
    height: 0.7em;
    border: solid #fff;
    border-width: 0 0.2em 0.2em 0;
    position: absolute;
    left: 1em;
    top: 34%;
    transform: rotate(45deg);
}
.getstart-sec{
    position: relative;
    background: url(../img/bg/getstart.webp) center right/cover no-repeat;
    overflow-x: hidden;
}
.getstart-sec .overlay-color{
    background: linear-gradient(151.89deg,rgba(123, 50, 163,.9) 6.97%,rgba(37,117,252,.83) 84.71%);
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 1;
}
.getstart-sec .getstart-img{
    position: relative;
    z-index: 1;
    clip-path: polygon(100% 0%, 100% 100%, 0% 100%, 30% 0%);
    background-repeat: no-repeat !important;
    background-position: top center !important;
    background-size: cover !important;
}
.z-index-1{
    z-index: 1;
}
.bg-gradient-purple{
    /* background-color: #7b32a3; */
    background: linear-gradient(145deg,#fad4ff,#d4dbff);
}
.bg-gray{
    background-color: #eef2f6;
}
.bg-lightgray{
    background-color: #f8f8f9;
}
.card-main{
    margin-bottom: 30px;
    margin-left: 10px;
    margin-right: 10px;
}
.card-main .card{
    position: relative;
    height: 100%;
    border: 0;
}
.card-main .card-img-top{
    border-radius: inherit !important;
}
.counter-box{
    position: relative;
    height: 100%;
    background: linear-gradient(145deg,#64c5ce,#d4dbff);
    border-radius: 5px;
    padding: 18px;
    /* width: fit-content; */
}
.mb-30{
    margin-bottom: 30px;
}
@media(max-width: 767px){
    section.page-header-area.my-course-area .page-title.py-60 {
        padding-top: 38px;
        padding-bottom: 20px;
    }
    .categories img{
        height: 50px;
    }
    .breadcrumb-pd {
        padding-top: 85px !important;
        padding-bottom: 25px !important;
    }
    .py-60{
        padding-top: 40px;
        padding-bottom: 40px;
    }
    .py-80-65{
        padding-top: 110px;
        padding-bottom: 45px;
    }
    .py-60-30 {
        padding-top: 40px;
        padding-bottom: 25px;
    }
    .mb-30, .card-main, .testimonials-item{
        margin-bottom: 20px;
    }
    .bg-gradient-purple.breadcrumb-pd h1, .breadcrumb .display-6, section.page-header-area.my-course-area h1 {
        font-size: 22px;
    }
    section.category-course-list-area {
        padding-top: 30px;
        padding-bottom: 30px;
    }
    .custom-radio:not(:checked) + label{
        font-size: 13px;
    }
    .btn-purple {
        padding: 10px 20px;
        font-size: 14px;
        line-height: 12px;
    }
    .footer-logo{
        height: auto;
        width: 230px;
    }
}
@media(min-width: 768px){
    ul.ul-skill{
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        width: fit-content;
    }
    .footer-logo{
        height: auto;
        width: 180px;
    }
}
@media(min-width: 1400px){
    ul.ul-skill{
        left: 110px;
    }
    .footer-logo{
        height: auto;
        width: 230px;
    }
}
.course-content-area .nav-pills .nav-link{
    background-color: #3fb6c2;
    padding: 5px 18px;
    margin-right: 5px;
    color: #000;
    margin-bottom: 5px;
}
.course-content-area .nav-pills .nav-link.active, .course-content-area .nav-pills .show>.nav-link{
    background-color: #7b32a3;
    color: #fff;
}
.ul-checkmark{
    position: relative;
    /* background: #7b32a3; */
    color: #000;
    padding-left: 0;
    border-radius: 8px;
    width: fit-content;
}
ul.ul-checkmark li{
    list-style-type: none;
    padding: 0.25em 0 0 2.5em;
    position: relative;
    margin-bottom: 10px;
}
ul.ul-checkmark li:before {
    content: " ";
    position: absolute;
    left: 0.5em;
    top: 5px;
    border: solid 0.7em #7b32a3;
    border-radius: 0.8em;
}
ul.ul-checkmark li:after {
    content: " ";
    width: 0.4em;
    height: 0.7em;
    border: solid #fff;
    border-width: 0 0.2em 0.2em 0;
    position: absolute;
    left: 1em;
    top: 10px;
    transform: rotate(45deg);
}
.category-course-list .card-main{
    position: relative;
    height: 100%;
    margin: 0;
}
.category-course-list .card-main .card{
    /* background-color: #f8f8f9; */
    box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
}
.category-course-list .card-main .card h5{
    font-size: 18px;
}
.category-course-list .card-main .card .rating i{
    font-size: 14px;
}
.y-center{
    position: relative;
    top: 50%;
    transform: translateY(-50%);
}
.popular-category{
    background-color: #c5e9ed !important;
    padding: 25px;
    border-radius: 5px;
}
.w-fit-content{
    width: fit-content;
}
.pt-40{
    padding-top: 40px;
}
.pb-25{
    padding-bottom: 25px;
}
/* section{
    overflow-x: hidden;
} */
@media(max-width: 400px){
    .ml-n15{
        margin-left: -12px;
    }
}

 .badge.bg-purple.rounded-pill{
    line-height: 15px;
}
.nav_div{
	float: right;
	text-align: center;
    position: relative;
	width: auto;
    bottom: 28px;
}
.nav_select{
/* 	border-radius: 40px !important; */
    background-color: #fad4ff;
    color: #7b32a3;
	font-family:'JostRegular',sans-serif ! important; 
	font-size: 13px ! important;
}