@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@300;400;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=M+PLUS+Rounded+1c:wght@700&display=swap');
@import url("https://fonts.googleapis.com/css2?family=Dancing+Script&family=Kalam&display=swap");

html { scroll-behavior: smooth;
	table-layout: fixed;
}

body {
    font-family: 'Noto Sans JP', sans-serif;
    font-weight: 400;
	table-layout: fixed;
	
}

/* background for teachers page */
.bg-sub{
background: #f6fafe;
	
}

/* PC */
.container-fluid {
    padding-right: 15px;
    padding-left: 15px;
	 
}

/* tablet */
@media (min-width: 576px) {
	
	.container-fluid {
    padding-right: 45px;
    padding-left: 45px;
	 
}

	
}

/* smartphone */
@media (min-width: 768px) {

		.container-fluid {
    padding-right: 75px;
    padding-left: 75px;
			 
	}
	
}










/* 
 * MOBILE MENU
 */
.mobile-menu {
    background-color: #2e3192;
    color: #ffffff;
}

.mobile-menu .navbar-nav .nav-link {
    color: #ffffff;
}

.mobile-menu-navbar {
    display: none;
}

.mobile-menu .dropdown-toggle::after {
    color: #ffffff;
}

.mobile-banner__heading-container {
    width: 130px;
}

.mobile-banner__heading {
    font-family: 'M PLUS Rounded 1c', sans-serif;
    font-size: 2.0rem;
    text-align: center;
    color: #ffffff;
	padding-top: 5px;
    margin-left: 30px;
 
}

.mobile-banner__subheading {
    font-family: 'M PLUS Rounded 1c', sans-serif;
    font-size: .3rem;
    text-align: center;
    color: #ffffff;
    margin-top: -0.5rem;
    text-shadow: 0 0 10px #4C4C4C;
}

.btn-menu-toggle {
    width: 30px;
    float: right;
    margin-top: 25px;
	margin-right: 25px

}

/*
 * BANNER SECTION
 */

.banner {
    position: relative;
}

.banner__background {
    width: 100%;
}

@media (max-width: 991px) {
.banner__background {
   margin-bottom: 50px;
}
}



.banner__heading-container {
    position: absolute;
    top: 30px;
    left: 50px;
    z-index: 1;
}

.banner__heading {
    width: 450px;
    margin-top: 50px;
}

.banner__subheading {
    font-family: 'M PLUS Rounded 1c', sans-serif;
    font-size: 1.2rem;
    text-align: center;
    color: #ffffff;
    margin-top: -0.5rem;
    text-shadow: 0 0 10px #4C4C4C;
}

.banner__slogan {
    font-family: 'Noto Sans', sans-serif;
	color:#ffffff;
	font-size: 3rem;
    text-transform: uppercase;
    position: absolute;
	padding:  40px;
    top: 200px;
    left: 80px;   
    z-index: 1;
    text-shadow: 0 0 10px #4C4C4C;
}



@media (min-width: 576px) {
/*    画面の大きいスマホ(sm)*/
}

@media (min-width: 768px) {
/*    タブレット以降(md)*/
}

@media (min-width: 992px) {

/*	PC以降(lg)*/
}



@media (max-width: 991px) {
	.banner__slogan {
	font-size: 2rem;
    top: 0px;
}
}


.banner__slogan:before {
    content: "";
    width: 25px;
    height: 55%;
    left: -15px;
    background-color: #9dc815;
    position: absolute;
    z-index: 2;
    -webkit-box-shadow: 3px 3px 5px 0 #4C4C4C;
    box-shadow: 3px 3px 5px 0 #4C4C4C;
}

@media (max-width: 767.98px) {
    .banner__slogan {
        top: 10px;
        left: 50px;
        font-size: 1.3rem;
		padding:  20px;
    }

    .banner__slogan:before {
        width: 15px;
		height: 70px;
    }
}

.banner__feature {
    width: 38%;
    position: absolute;
    left: 20px;
    bottom: 0;
	
}

@media (max-width: 767.98px) {
    .banner__feature {
        width: 50%;
        top: 210px;
        left: 10px;
    }
}

/*
 * NAVBAR SECTION
 */
.navbar-nav {
	width: 100%;
    display: flex;
    justify-content: space-between;
}

.nav-item {
    font-size: 20px;
	display: inline-block;
    text-transform: uppercase;
}

.nav-item-btn {
    background-color: #29288b;
    -webkit-box-shadow: 3px 3px 5px 0px rgba(0, 0, 0, 0.3);
    box-shadow: 3px 3px 5px 0px rgba(0, 0, 0, 0.3);
}

.border-left {
    border-left: 3px solid #dee2e6!important;

}

/*TEACHERS */
.nav-item-btn .nav-link {
	color: #ffffff !important;
}

.dropdown-toggle::after {
    display: inline-block;
    width: 0;
    height: 0;
    margin-left: .255em;
    vertical-align: .255em;
    content: "";
    border-top: .4em solid;
    border-right: .4em solid transparent;
    border-bottom: 0;
    border-left: .4em solid transparent;
    color: #29288b;
}

.dropdown-item.active,
.dropdown-item:active {
    background-color: #29288b;
}

/* 
 * FEATURES SECTION
 */

.section {
    margin: 50px 0;
}

@media (max-width: 991px) {
	.section {
    margin: 0px 0;
	}
}

	
.section__heading {
    display: inline-block;
    color: #29288b;
    font-weight: 700;
    text-transform: uppercase;
    border-bottom: 3px solid #29288b;
    padding: 0.25rem;
    margin-bottom: 1rem;
}

@media (max-width: 767.98px) {
    .section__heading {
        margin-left: 50%;
        transform: translateX(-50%);
    }
}

.feature__image img {
    width: 100%;
}

.feature__heading {
    color: #9dc815;
    font-size: 1.8rem;
    text-align: center;
    margin-top: 1rem;
    font-weight: 700;
}

@media (max-width: 991px) {
.feature__heading {
	font-size: 1.3rem;
	
	}
}

	
.feature__description {
    font-weight: 300;
    font-size: 1.5rem;
}

@media (max-width: 991px) {
	.feature__description {
	font-size: 1rem;
}
}



.feature__content {
    background-repeat: no-repeat;
    background-size: 200px;
    height: 200px;
    background-position: center;
}

@media (max-width: 991px) {
	.feature__content {
     background-size: 150px;
		
	}
}


.feature__content--method {
   
	background-image: url(../img/feature-bg-method.png);
}

.feature__content--video {
    background-image: url(../img/feature-bg-video.png);
}

.feature__content--qanda {
    background-image: url(../img/feature-bg-qanda.png);
}

/*
 * PROCESS SECTION
 */

.step-card {
    text-align: center;
    margin: 30px 0;
}

.step-card__heading {
    position: relative;
    text-align: left;
    font-weight: 700;
    text-transform: uppercase;
    font-size: 1.2rem;
    color: #29288b;
    padding-left: 20px;
}

.step-card__heading:before {
    content: '';
    background: url(../img/step.png);
    width: 40px;
    height: 62px;
    background-size: contain;
    z-index: -1;
    left: 0;
    top: -20px;
    display: block;
    background-repeat: no-repeat;
    position: absolute;
}

.step-card__image {
    width: 80%;
}

.tag:after {
    content: '';
    padding: 3px;
    color: #ffffff;
    font-size: 14px;
    display: inline-block;
    min-width: 60px;
    text-align: center;
    text-transform: uppercase;
    margin-left: 10px;
}

.tag--free:after {
    content: 'Free';
    background-color: #d115ff;
}

.tag--paid:after {
    content: 'Paid';
    background-color: #17a1ff;
}

.step-card__description {
    font-weight: 300;
    font-size: 1rem;
    text-align: left;
    margin-top: 10px;;
}

.congrats-card__heading {
    position: relative;
    font-size: 1.5rem;
	letter-spacing: 0.05em;
    line-height: 25px;
    height: 80px;
    text-transform: uppercase;
    color: #ffffff;
    font-weight: 700;
    margin-left: 80px;
    padding-left: 80px;
    padding-top: 13px;
    /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#29288b+32,9c1f87+100 */
   
	background: rgb(41,40,139); /* Old browsers */
    background: -moz-linear-gradient(left,  rgba(41,40,139,1) 32%, rgba(156,31,135,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(left,  rgba(41,40,139,1) 32%,rgba(156,31,135,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right,  rgba(41,40,139,1) 32%,rgba(156,31,135,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#29288b', endColorstr='#9c1f87',GradientType=1 ); /* IE6-9 */
}

.congrats-card__heading:before {
    content: '';
    width: 100px;
    height: 100px;
    position: absolute;
    top: -8px;
    left: -39px;
    background-repeat: no-repeat;
    background-image: url(../img/star.png);
    background-size: 100px;
}

.congrats-card__image {
    width: 80%;
    padding-top: 100px;
}


@media (max-width: 991px) {
	.congrats-card__heading:before {
    content: '';
    width: 100px;
    height: 100px;
    position: absolute;
    top: -10px;
    left: -39px;
    background-repeat: no-repeat;
    background-image: url(../img/star.png);
    background-size: 80px;
}
	.congrats-card__heading {
    position: relative;
    font-size: 0.8rem;
	letter-spacing: 0.05em;
    line-height: 25px;
    height: 60px;
    text-transform: uppercase;
    color: #ffffff;
    font-weight: 700;
    margin-left: 0px;
    padding-left: 50px;
    padding-top: 5px;
	}
	}


@media (max-width: 767.98px) {
    .congrats-card__image {
        padding-top: 20px;
    }
	.congrats-card__heading {
    position: relative;
    font-size: 0.9rem;
	letter-spacing: 0.05em;
    line-height: 25px;
    height: 60px;
    text-transform: uppercase;
    color: #ffffff;
    font-weight: 700;
    margin-left: 30px;
    padding-left: 80px;
    padding-top: 5px;
}
	.congrats-card__heading:before {
    content: '';
    width: 100px;
    height: 100px;
    position: absolute;
    top: -3px;
    left: -39px;
    background-repeat: no-repeat;
    background-image: url(../img/star.png);
    background-size: 70px;
}
}



/* 
 * FREE TUTORIALS SECTION
 */

.section-free-tutorials {
    /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#29288b+30,9c1f87+100 */
	
    background: rgb(41,40,139); /* Old browsers */
    background: -moz-linear-gradient(left,  rgba(41,40,139,1) 30%, rgba(156,31,135,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(left,  rgba(41,40,139,1) 30%,rgba(156,31,135,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right,  rgba(41,40,139,1) 30%,rgba(156,31,135,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#29288b', endColorstr='#9c1f87',GradientType=1 ); /* IE6-9 */
}

.section-free-tutorials .container {
    position: relative;
    padding-top: 50px;
    padding-bottom: 50px;
}

.section-free-tutorials__background {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    z-index: 1;
    background-image: url(../img/FREETURORIALVIDEO.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;;
    opacity: 0.4;

}

.gradient-tag {
    width: 300px;
    text-transform: uppercase;
    color: #ffffff;
    font-weight: 700;
    font-size: 1.5rem;
    padding: 5px 0 5px 20px;
    /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#9c1f87+0,9c1f87+50,ac75b1+86&1+0,0.61+50,0+86 */
    background: -moz-linear-gradient(left,  rgba(156,31,135,1) 0%, rgba(156,31,135,0.61) 50%, rgba(172,117,177,0) 86%); /* FF3.6-15 */
    background: -webkit-linear-gradient(left,  rgba(156,31,135,1) 0%,rgba(156,31,135,0.61) 50%,rgba(172,117,177,0) 86%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right,  rgba(156,31,135,1) 0%,rgba(156,31,135,0.61) 50%,rgba(172,117,177,0) 86%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#9c1f87', endColorstr='#00ac75b1',GradientType=1 ); /* IE6-9 */
}

.section-free-tutorials__heading {
    color: #ffffff;
    display: inline-block;
    font-weight: 700;
    text-transform: uppercase;
    padding: 0.25rem;
    margin-bottom: 1rem;
    border-bottom: 3px solid #ffffff;
}

.section-free-tutorials__description {
    color: #ffffff;
	font-size: 25px;
	line-height: 2em;
    text-indent: 20px;
}

@media (max-width: 991px) {
	.section-free-tutorials__description {
    color: #ffffff;
	font-size: 15px;
	line-height: 1.8em;
    text-indent: 20px;
}
}

	

@media (max-width: 767.98px) {
.section-free-tutorials__description {
   padding-top:30px;
	font-size: 20px;
	line-height: 1.3em;
    text-indent: 20px;
    }
}

.section-free-tutorials__map-container {
    width: 100%;
    text-align: right;
}

.section-free-tutorials__map {
    width: 80%;
}

.section-free-tutorials__instruction {
    color: #ffffff;
}

.section-free-tutorials__column {
    position: relative;
    z-index: 2;
}

.section-free-tutorials__button-container {
    position: absolute;
    top: 50%;
    width: 40%;
    text-align: center;
}

.section-free-tutorials__button {
	width: 100%;
	display: block;
    text-transform: uppercase;
    padding: 5px;
    font-weight: 700;
    border-radius: 40px;
    border: none;
    margin-bottom: 20px;
    color: #ffffff;
    -webkit-box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.5);
    -moz-box-shadow:    3px 3px 3px rgba(0, 0, 0, 0.5);
    box-shadow:         3px 3px 3px rgba(0, 0, 0, 0.5);
}

.section-free-tutorials__button--kenya {
    /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#bde4f9+0,5eb0c0+100 */
    background: rgb(189,228,249); /* Old browsers */
    background: -moz-linear-gradient(left,  rgba(189,228,249,1) 0%, rgba(94,176,192,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(left,  rgba(189,228,249,1) 0%,rgba(94,176,192,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right,  rgba(189,228,249,1) 0%,rgba(94,176,192,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#bde4f9', endColorstr='#5eb0c0',GradientType=1 ); /* IE6-9 */
}

.section-free-tutorials__button--zambia {
    /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#d6ea83+0,9dc815+100 */
    background: rgb(214,234,131); /* Old browsers */
    background: -moz-linear-gradient(left,  rgba(214,234,131,1) 0%, rgba(157,200,21,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(left,  rgba(214,234,131,1) 0%,rgba(157,200,21,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right,  rgba(214,234,131,1) 0%,rgba(157,200,21,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d6ea83', endColorstr='#9dc815',GradientType=1 ); /* IE6-9 */
}

/*
 * PAID SERVICE SECTION
 */
.section-paid-service {
    margin: 8px 0;
    /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#9c1f87+0,29288b+70 */
    background: rgb(156,31,135); /* Old browsers */
    background: -moz-linear-gradient(left,  rgba(156,31,135,1) 0%, rgba(41,40,139,1) 70%); /* FF3.6-15 */
    background: -webkit-linear-gradient(left,  rgba(156,31,135,1) 0%,rgba(41,40,139,1) 70%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right,  rgba(156,31,135,1) 0%,rgba(41,40,139,1) 70%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#9c1f87', endColorstr='#29288b',GradientType=1 ); /* IE6-9 */
}

.section-paid-service .container {
    position: relative;
    padding-top: 50px;
    padding-bottom: 50px;
}

.section-paid-service__column {
    z-index: 2;
}

.section-paid-service__background {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    z-index: 1;
    background-image: url(../img/PAIDSERVICE.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;;
    opacity: 0.4;

}

.section-paid-service__heading {
    color: #ffffff;
    border-color: #ffffff;
    display: inline-block;
    font-weight: 700;
    text-transform: uppercase;
    border-bottom: 3px solid #ffffff;
    padding: 0.25rem;
    margin-bottom: 1rem
}

.section-paid-service__feature-heading {
    position: relative;
    width: 100%;
    color: #ffffff;
    text-transform: uppercase;
    font-size: 2rem;
	font-weight: 600;

}

.section-paid-service__feature-description {
    color: #ffffff;
    text-indent: 20px;
	font-size: 20px;
	line-height: 1.5em;
}

@media (max-width: 991px) {
.section-paid-service__feature-description {
	font-size: 15px;
	}
.section-paid-service__heading {
	padding: 0rem;
	
}
}

	


.section-paid-service__feature-heading::before {
    position: absolute;
    left: 0;
    top: 5px;
    width: 15px;
    height: 15px;
    background-color: #ffffff;
}


.button1 {
  width:230px;
  padding:12px 0;
  font-size: 14px;
  text-align:center;
  text-transform: uppercase;
  letter-spacing: 2.5px;
  font-weight: 900;
  color:  #ad0c83;
  background-color: #fff;
  border: none;
  border-radius: 45px;
  box-shadow: 0px 8px 15px rgba(0, 0, 0, 0.1);
  transition: all 0.3s ease 0s;
  cursor: pointer;
  }

.button1:hover {
  background-color: #ad0c83;
  box-shadow: 0px 15px 20px rgba(173, 12, 131, 0.4);
  color: #fff !important;
  transform: translateY(-7px);
  text-decoration: none;	
}


@media (max-width: 767.98px) {
    .button1 {
		
        float: none;
    }
}

/* 
 * SPONSOR SECTION
 */
.section-sponsor__heading {
    display: block;
    height: 50px;
    margin: 0 auto 7rem;
}



.sponsor-logo {
    width: 40%;
	padding-bottom: 100px;
}

.sponsor-logo-container {
    text-align: center;

	
}

.section-sponsor__button {
    display: inline-block;
    text-transform: uppercase;
    padding: 5px 50px;
    font-weight: 700;
    border-radius: 40px;
    border: none;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 200px;
    background-color: #ffffff;
    color: #2e3192;
    border: 2px solid #2e3192;
	
}

@media (max-width: 767.98px) {
   .sponsor-logo {
    width: 110%;
	padding-bottom: 50px;
}
	.section-sponsor__button {
		 margin-bottom: 70px;
}
}

footer {
    width: 100%;
	margin-top: 0px;
    padding: 100px 0;
    background-color: #2e3192;
	margin-bottom: 0px;
}

.footer-link {
    display: inline-block;
	text-align: center;
    width: 24%;
    color: #ffffff;
    text-transform: uppercase;
	padding-bottom: 50px;
	
}

.footer-link:hover {
    color: #ffffff;
}

@media (max-width: 767.98px) {
    .footer-link {
        width: 49%;
        font-size: 0.75rem;
		padding-bottom: 00px;
    }
}

.copyright {
    text-align: center;
    color: #ffffff;
    margin-top: 100px;
}

/* 
 * ABOUT US PAGE
 */

.about-us-page {
    background-color:#292888;

}

.about-us-header {
    position: relative;
}

.about-us-header__image {
    width: 100%;
}

.about-us-header__title {
    width: 100%;
    position: absolute;
    top: 45%;
    text-transform: uppercase;
    color: #ffffff;
    font-weight: 700;
    text-align: center;
}

.gradient-bg {
    /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#292888+30,991f84+100 */
    background: #292888; /* Old browsers */
    background: -moz-linear-gradient(top,  #292888 30%, #991f84 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top,  #292888 30%,#991f84 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom,  #292888 30%,#991f84 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#292888', endColorstr='#991f84',GradientType=0 ); /* IE6-9 */
}

.about-teans__title {
    color: #ffffff;
    font-weight: 700;
    font-size: 2.5rem;
	margin-top: 80px;
	padding-bottom: 30px;
}

.about-teans__description {
    color: #ffffff;
	font-size: 1.5rem;
}

.about-teans__description em {
    color: #ff85ff;
    font-style: normal;
}

@media (max-width: 767.98px) {
    .about-us-header__title,
    .about-teans__title,
    .our-team__heading {
        font-size: 1.75rem;
    }
	.about-teans__description {
    color: #ffffff;
	font-size: 1rem;
}
.about-teans__title {
	padding-bottom: 10px;
}

}

.our-team {
    text-align: center;
    padding-bottom: 200px;
}

.our-team__heading {
    color: #ffffff;
    border-bottom: 2px solid #ffffff;
    display: inline-block;
    text-transform: uppercase;
    margin-top: 90px;
	margin-bottom: 50px;
}

.member__image {
    width: 90%;
    border-radius: 50%;
    overflow: hidden;
}

@media (max-width: 767.98px) {
    .member__image {
        width: 50%;
        margin: 0 auto;
    }
}

.member__image img {
    width: 100%;
}

.member__name {
    color: #ffffff;
    text-align: center;
}

.member__title {
    color: #ffffff;
    text-align: center;
    font-size: 1rem;
}

.member__intro {
    position: relative;
    z-index: 1;
    text-indent: 1rem;
    padding: 1rem;
    text-align: justify;
    min-height: 250px;
    background-color: rgba(255, 255, 255, 0.8);
}

@media (max-width: 767.98px) {
    .member__intro {
        min-height: 100px;
    }
}

.member__intro:before {
    position: absolute;
    z-index: -1;
    top: -6px;
    left: -3px;
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 0.8);
}

.team-member__image {
    width: 70%;
    border-radius: 50%;
    overflow: hidden;
    margin: 0 auto;
}

.team-member__image img {
    width: 100%;
}

.team-member__name {
    color: #ffffff;
}

.team-member__title {
    color: #ffffff;
    font-size: 1rem;
}


/* 
 * PAID SERVICE PAGE 
 */
.paid-service-banner {
    min-height: 800px;
    background: url(../img/Africangirl.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center bottom;
}

@media (max-width: 991px) {
	.paid-service-banner {
 
        background: url(../img/Africangirl-mobile.jpg);
        background-size: cover;
        background-repeat: no-repeat;
        background-position: right;
	
    }
}
	
@media (max-width: 767.98px) {
    .paid-service-banner {
        min-height: 500px; 
        background: url(../img/Africangirl-mobile.jpg);
        background-size: cover;
        background-repeat: no-repeat;
        background-position: right;
    }
}

.paid-service-banner__title {
    text-transform: uppercase;
    color: #ffffff;
    font-weight: 700;
    border-bottom: 2px solid #ffffff;
}

@media (max-width: 767.98px) {
    .paid-service-banner__title {
        font-size: 1.7rem;
    }
}

.paid-service-banner__subtitle {
    color: #ffffff;
    font-weight: 700;
    margin: 2rem 0;
	padding-top: 50px;
}

@media (max-width: 767.98px) {
    .paid-service-banner__subtitle {
        font-size: 1.25rem;
        text-align: center;
        margin: 1rem 0;
		padding-top: 0px;
    }
	
}

.paid-service-banner__description {
    color: #ffffff;
    text-indent: 1rem;
	font-size: 1.5rem;
    text-align: justify;
}

@media (max-width: 767.98px) {
	.paid-service-banner__description {
    font-size: 1rem;
}
}


.paid-service-banner__tag {
    width: 300px;
    text-transform: uppercase;
    color: #ffffff;
    font-weight: 700;
    font-size: 1.5rem;
    padding: 5px 0 5px 20px;
    margin: 5rem 0 1rem;
    background: -moz-linear-gradient(left, rgba(156,31,135,1) 0%, rgba(156,31,135,0.61) 50%, rgba(172,117,177,0) 86%);
    background: -webkit-linear-gradient(left, rgba(156,31,135,1) 0%,rgba(156,31,135,0.61) 50%,rgba(172,117,177,0) 86%);
    background: linear-gradient(to right, rgba(156,31,135,1) 0%,rgba(156,31,135,0.61) 50%,rgba(172,117,177,0) 86%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#9c1f87', endColorstr='#00ac75b1',GradientType=1 );
}

/* 
 * Q&A SERVICE
 */
.q-and-a-service {
    position: relative;
    background: url(../img/mobilephone.png);
    background-repeat: no-repeat;
    background-position: left top;
    background-size: contain;
}




@media (max-width: 991px) {
    .q-and-a-service {
        background-size: 30%;
    }
}

.q-and-a-service-background {
    width: 100%;
    position: absolute;
    top: 0;
    z-index: -1;
}

.q-and-a-service .container {
    position: relative;
    border-bottom: 3px dashed #29288b;
}

.q-and-a-service--mobile .container {
    position: relative;
    padding-top: 300px;
}

.q-and-a-service--mobile .student-block-q-and-a {
    top: 170px;
    right: 50%;
    transform: translateX(50%);
}

.q-and-a-service__content {
    color: #29288b;
    margin-top: 200px;
}

@media (max-width: 767.98px) {
	.q-and-a-service__content {
    margin-top: 120px;
}
	 .q-and-a-service {
        background-size: 50%;
    }
}

	


.q-and-a-service__title {
    font-size: 1.2rem;
    text-align: center;
    font-weight: 700;
}


.q-and-a-service__description {
    text-align: center;
	padding-left: 0px;
	font-size: 1.5rem;
}

@media (max-width: 767.98px) {
.q-and-a-service__description {
	font-size: 1rem;
	margin-bottom: 50px;
}
}



.student-block-q-and-a {
    width: 300px;
    position: absolute;
    top: 150px;
    right: 0;
    text-align: right;
}

.student-block-q-and-a__bubble {
    width: 250px;
    position: absolute;
    top: -130px;
    right: 0;
    z-index: -1;
}

.student-block-q-and-a__image {
    width: 150px;
}

@media (max-width: 767.98px) {
	.student-block-q-and-a__image {
    width: 100px;
}
}

.student-block-q-and-a__text {
    font-family: kalam, cursive;
    position: relative;
    color: #29288b;
    background: #ffffff;
    border: 1px solid #29288b;
    padding: 5px 5px 5px 40px;
    border-radius: 10px;
    text-align: left;
}

.student-block-q-and-a__text:before {
    display: inline-block;
    width: 0;
    height: 0;
    margin-left: .255em;
    vertical-align: .255em;
    content: "";
    border-top: 0;
    border-right: 6px solid transparent;
    border-bottom: 16px solid;
    border-left: 6px solid transparent;
    color: #29288b;
    position: absolute;
    top: -16px;
    right: 50px;
    z-index: 1;
}

.student-block-q-and-a__text:after {
    display: inline-block;
    width: 0;
    height: 0;
    margin-left: .255em;
    vertical-align: .255em;
    content: "";
    border-top: 0;
    border-right: 5px solid transparent;
    border-bottom: 14px solid;
    border-left: 5px solid transparent;
    color: #ffffff;
    position: absolute;
    top: -14px;
    right: 51px;
    z-index: 2;
}

.student-block-q-and-a__background {
    position: absolute;
    display: block;
    width: 40px;
    height: 40px;
    top: 0;
    left: 0;
    border-radius: 8px 0 0 0;
    overflow: hidden;
}

.student-block-q-and-a__background:before {
    content: "";
    position: absolute;
    left: 0;
    top: -40px;
    width: 30px;
    height: 80px;
    transform: rotate(50deg);
    /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#991f84+30,292888+100 */
    background: #991f84; /* Old browsers */
    background: -moz-linear-gradient(top,  #991f84 30%, #292888 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top,  #991f84 30%,#292888 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom,  #991f84 30%,#292888 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#991f84', endColorstr='#292888',GradientType=0 ); /* IE6-9 */
}

.teacher-block-q-and-a {
    position: relative;
}

.teacher-block-q-and-a__image {
    width: 300px;
}

.teacher-block-q-and-a__text {
    font-family: 'Kalam', cursive;
    color: #29288b;
    text-align: center;
    position: absolute;
    margin: 0;
    bottom: 30px;
    left: 320px;
}

.teacher-block-q-and-a__text:before {
    content: "";
    display: block;
    width: 90%;
    height: 1px;
    background: #29288b;
    position: relative;
    top: -10px;
    left: -20px;
}

.teacher-block-q-and-a__text:after {
    content: "";
    display: block;
    width: 110%;
    height: 1px;
    background: #29288b;
    position: relative;
    top: 10px;
    left: -20px;
}



@media (max-width: 991px) {
	
    .teacher-block-q-and-a {
        text-align: right;
    }

    .teacher-block-q-and-a__image {
        width: 200px;
        padding-top: 0px;
    }

    .teacher-block-q-and-a__text {
        position: relative;
        bottom: 0;
        left: 10px;
        margin-bottom: 2px;
    }

    .teacher-block-q-and-a__text::before {
        width: 50%;
        top: 0;
        left: 30%;
    }

    .teacher-block-q-and-a__text:after {
        width: 50%;
        top: 0;
        left: 30%;
    }
}

@media (max-width: 767.98px) {
	    .teacher-block-q-and-a__image {
        width: 200px;
        padding-top: 100px;
    }
}



	

/* 
* CORRECTION SERVICE STEP 1
*/
.correction-service-step-1 {
    position: relative;
    display: flex;
}

.correction-service-step-1 .container {
    position: relative;
    padding-bottom: 50px;
}

.correction-service-step-1 .container {
    position: relative;
}

.correction-service-step-1-background {
    width: 100%;
    position: absolute;
    bottom: 0;
    z-index: -1;
}

.correction-service-step-1__description {
    font-size:  1.3rem;
	color: #29288b;
    margin: 0;
    position: relative;
    padding: 100px 0 0px 125px;
    background: url(../img/01.png);
    background-position: left center;
    background-size: 120px;
    background-repeat: no-repeat;
}

@media (max-width: 767.98px) {
.correction-service-step-1__description {
	font-size:  1rem;
	}
	}

.dashed-line {
    width: 20px;
    height: 100%;
    position: absolute;
    box-sizing: border-box;
    top: 0;
    left: 65px;
    background-image: linear-gradient(#9dc815 33%, rgba(255,255,255,0) 0%);
    background-position: right;
    background-size: 20px 20px;
    background-repeat: repeat-y
}



	

.dashed-line--step-1 {
    top: 120px;
}

@media (max-width: 767.98px) {
    .correction-service-step-1__description {
        background-size: 80px;
        padding-left: 85px;
    }

    .dashed-line {
        left: 45px;
    }
}

.correctin-service-stem-1__bubble {
    width: 250px;
    position: absolute;
    top: 100px;
    right: 0;
    z-index: -1;
}

@media (max-width: 991px) {
.correction-service-step-1__description {	
    padding: 300px 0 0px 125px;

}
}

@media (max-width: 767.98px) {
	.correction-service-step-1__description {	
		padding: 100px 0 0px 125px;
	}
}


.teacher-block-correction-1 {
    position: relative;
    margin-top: -60px;
}

.teacher-block-correction-1__image {
    width: 100%;
    padding-top: 130px;
}

.teacher-block-correction-1__text {
    font-family: 'Kalam', cursive;
    color: #29288b;
    text-align: center;
    position: absolute;
    margin: 0;
    top: 180px;
    left: 25%;
    z-index: -1;
}

.teacher-block-correction-1__text:before {
    content: "";
    display: block;
    width: 120%;
    height: 1px;
    background: #29288b;
    position: relative;
    top: -10px;
    left: -10%;
}

.teacher-block-correction-1__text:after {
    content: "";
    display: block;
    width: 90%;
    height: 1px;
    background: #29288b;
    position: relative;
    top: 10px;
    left: 5%;
}

@media (max-width: 767.98px) {
    .correction-service-step-1 .container {
        margin-top: 200px;
    }

    .correctin-service-stem-1__bubble {
        top: -170px;
    }

    .teacher-block-correction-1__image {
        padding-top: 90px;
    }

    .teacher-block-correction-1__text {
        right: 0;
        left: auto;
        top: 120px;
    }

    .teacher-block-correction-1__text:before {
        width: 100%;
        left: 0;
    }
}




/*
 * CORRECTION SERVICE STEP 2
 */

.correction-service-step-2 {
    position: relative;
    display: flex;
}

.correction-service-step-2 .container {
    padding-bottom: 50px;
}

.correction-service-step-2 .container {
    position: relative;
}

.correction-service-step-2-background {
    width: 100%;
    position: absolute;
    top: 0;
    z-index: -1;
}

.dashed-line--step-2 {
    top: 100px;
}

.correction-service-step-2__description {
    font-size:  1.3rem;
	color: #29288b;
    margin: 0;
    position: relative;
    padding: 50px 0 50px 125px;
    background: url(../img/02.png);
    background-position: left center;
    background-size: 120px;
    background-repeat: no-repeat;
}

@media (max-width: 767.98px) {	
    .correction-service-step-2__description {
        padding: 50px 0 50px 85px;
		font-size:  1rem;
        background-size: 80px;
    }
}

.correction-service-step-2__image {
    width: 100%;
}

.student-block-correction-2__text {
    font-family: kalam, cursive;
    position: absolute;
    right: 0;
    bottom: 40px;
    color: #29288b;
    background: #ffffff;
    border: 1px solid #29288b;
    padding: 5px 20px 5px 5px;
    border-radius: 10px;
    text-align: center;
}

@media (max-width: 767.98px) {
.student-block-correction-2__text {
        font-family: kalam, cursive;
    position: absolute;
    right: 0;
    bottom: 40px;
    color: #29288b;
    background: #ffffff;
    border: 1px solid #29288b;
    padding: 5px 20px 5px 5px;
    border-radius: 10px;
    text-align: center;
	margin-bottom: 50px;
    }
}

.student-block-correction-2__text:before {
    display: inline-block;
    width: 0;
    height: 0;
    margin-left: .255em;
    vertical-align: .255em;
    content: "";
    border-top: 0;
    border-right: 6px solid transparent;
    border-bottom: 16px solid;
    border-left: 6px solid transparent;
    color: #29288b;
    position: absolute;
    top: -16px;
    right: 100px;
    z-index: 1;
}

.student-block-correction-2__text:after {
    display: inline-block;
    width: 0;
    height: 0;
    margin-left: .255em;
    vertical-align: .255em;
    content: "";
    border-top: 0;
    border-right: 5px solid transparent;
    border-bottom: 14px solid;
    border-left: 5px solid transparent;
    color: #ffffff;
    position: absolute;
    top: -14px;
    right: 101px;
    z-index: 2;
}

@media (max-width: 767.98px) {
    .student-block-correction-2__text {
        left: 80px;
        right: 10px;
        bottom: -40px;
    }
    
    .student-block-correction-2__text:before {
        right: 40%;
    }
    
    .student-block-correction-2__text:after {
        right: 40.2%;
    }

    .student-block-correction-2__text br {
        display: none;
    }
}

.student-block-correction-2__background {
    position: absolute;
    display: block;
    width: 40px;
    height: 40px;
    top: 0;
    right: 0;
    border-radius: 0 8px 0 0;
    overflow: hidden;
}

.student-block-correction-2__background:before {
    content: "";
    position: absolute;
    right: 0;
    top: -40px;
    width: 30px;
    height: 80px;
    transform: rotate(-50deg);
    /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#991f84+30,292888+100 */
    background: #991f84; /* Old browsers */
    background: -moz-linear-gradient(top,  #991f84 30%, #292888 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top,  #991f84 30%,#292888 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom,  #991f84 30%,#292888 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#991f84', endColorstr='#292888',GradientType=0 ); /* IE6-9 */
}

/* 
 * CORRECTION SERVICE STEP 3
 */

.correction-service-step-3 {
    position: relative;
    display: flex;
}

.correction-service-step-3 .container {
    padding-bottom: 50px;
    position: relative;
}

@media (max-width: 767.98px) {
    .correction-service-step-3-background {
        width: 100%;
        position: absolute;
        top: 40px;
        z-index: -1;
    }
}

.dashed-line--step-3 {
    top: 100px;
}

.correction-service-step-3__description {
    font-size:  1.3rem;
	color: #29288b;
    margin: 0;
    position: relative;
    padding: 50px 0 50px 125px;
    background: url(../img/03.png);
    background-position: left center;
    background-size: 120px;
    background-repeat: no-repeat;
}



.teacher-block-correction-3__image {
    width: 80%;
}

.teacher-chat-block {
    position: absolute;
    top: 0;
    right: 0;
    z-index: 1;
}

.teacher-chat-block__image {
    position: absolute;
    height: 90px;
    top: 0;
    right: 15px;
}

@media (max-width: 991px) {
		.teacher-block-correction-3__image {
    width: 70%;
    padding-top: 30px;
}
}

@media (max-width: 767.98px) {
    .correction-service-step-3__description {
         font-size:  1rem;
		padding: 50px 0 50px 85px;
        background-size: 80px;
    }
	.teacher-block-correction-3__image {
    width: 70%;
    padding-top: 30px;
}
}

.teacher-chat-block__text {
    position: absolute;
    font-family: 'Kalam', cursive;
    color: #29288b;
    text-align: center;
    height: 100px;
    width: 200px;
    position: absolute;
    margin: 0;
    padding-top: 15px;
    top: 0;
    right: 70px;
    z-index: -1;
}

@media (max-width: 767.98px) {
.teacher-chat-block__text {
    position: absolute;
    font-family: 'Kalam', cursive;
    color: #29288b;
    text-align: center;
    height: 100px;
    width: 200px;
    position: absolute;
    margin: 0;
 
    top: 0;
    right: 90px;
    z-index: -1;
}
}

.teacher-chat-block__text:before {
    content: "";
    display: block;
    width: 120%;
    height: 1px;
    background: #29288b;
    position: absolute;
    top: 5px;
    right: -20%;
    z-index: -1;
}

.teacher-chat-block__text:after {
    content: "";
    display: block;
    width: 100%;
    height: 1px;
    background: #29288b;
    position: absolute;
    bottom: 5px;
    right: 0;
}

.student-block-correction-3 {
    position: relative;
    text-align: right;
}

.student-block-correction-3__image {
    width: 30%;
}

.student-block-correction-3__text {
    font-family: kalam, cursive;
    width: 100%;
    position: relative;
    bottom: 30px;
    color: #29288b;
    background: #ffffff;
    border: 1px solid #29288b;
    padding: 5px 20px 5px 5px;
    border-radius: 10px;
    text-align: center;
}




.student-block-correction-3__text:before {
    display: inline-block;
    width: 0;
    height: 0;
    margin-left: .255em;
    vertical-align: .255em;
    content: "";
    border-top: 0;
    border-right: 6px solid transparent;
    border-bottom: 16px solid;
    border-left: 6px solid transparent;
    color: #29288b;
    position: absolute;
    top: -16px;
    right: 70px;
    z-index: 1;
}

.student-block-correction-3__text:after {
    display: inline-block;
    width: 0;
    height: 0;
    margin-left: .255em;
    vertical-align: .255em;
    content: "";
    border-top: 0;
    border-right: 5px solid transparent;
    border-bottom: 14px solid;
    border-left: 5px solid transparent;
    color: #ffffff;
    position: absolute;
    top: -14px;
    right: 71px;
    z-index: 2;
}

.student-block-correction-3__background {
    position: absolute;
    display: block;
    width: 40px;
    height: 40px;
    top: 0;
    right: 0;
    border-radius: 0 8px 0 0;
    overflow: hidden;
}

.student-block-correction-3__background:before {
    content: "";
    position: absolute;
    right: 0;
    top: -40px;
    width: 30px;
    height: 80px;
    transform: rotate(-50deg);
    /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#991f84+30,292888+100 */
    background: #991f84; /* Old browsers */
    background: -moz-linear-gradient(top,  #991f84 30%, #292888 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top,  #991f84 30%,#292888 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom,  #991f84 30%,#292888 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#991f84', endColorstr='#292888',GradientType=0 ); /* IE6-9 */
}

@media (max-width: 767.98px) {
    .correction-service-step-3__column {
        padding-left: 80px;
    }

    .student-block-correction-3__text br {
        display: none;
    }
}

/* 
 * CORRECTION SERVICE STEP 4
 */

.correction-service-step-4 {
    margin-bottom: 100px;
    position: relative;
}

.correction-service-step-4 .container {
    position: relative;
    padding-top: 20px;
    padding-bottom: 50px;
    /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#29288a+31,9b1f86+100 */
    background: #29288a; /* Old browsers */
    background: -moz-linear-gradient(left,  #29288a 31%, #9b1f86 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(left,  #29288a 31%,#9b1f86 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right,  #29288a 31%,#9b1f86 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#29288a', endColorstr='#9b1f86',GradientType=1 ); /* IE6-9 */
}

.dashed-line--step-4 {
    top: 0;
    height: 30px;
}

.correction-service-step-4__description {
    color: #29288b;
    margin: 0;
    position: relative;
    padding: 50px 0 50px 125px;
    background: url(../img/04.png);
    background-position: left center;
    background-size: 120px;
    background-repeat: no-repeat;
}

@media (max-width: 767.98px) {
    .correction-service-step-4__description {

        background-size: 80px;
		padding: 10px 0 50px 125px;
    }
	
	.correction-service-step-4 .container {
		padding-top: 10px;}
	
		
}

.correction-service-step-4__content {
    color: #ffffff;
    text-align: left;
    padding: 50px 0;
    margin-left: 50px;
    position: relative;
    z-index: 2;
    background: url(../img/dashed-circles.png);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: left;
}


.correction-service-step-4__text {
    font-family: kalam, cursive;
    font-size: 2.0rem;
    border-bottom: 2px solid #ffffff;
	padding-bottom: 30px;
	
}

.correction-service-step-4__title {
    font-size: 2.5rem;
    font-weight: 700;
}

.correction-service-step-4-student {
    width: 380px;
    position: absolute;
    z-index: 1;
    top: 50%;
    transform: translateY(-50%);
    right: 0;
}

@media (max-width: 767.98px) {
    .correction-service-step-4__content {
        margin-left: 10px;
		padding: 0px 0;
    }

    .correction-service-step-4__text {
        font-size: 1.3rem;
    }

    .correction-service-step-4__title {
        font-size: 1.5rem;
    }

    .correction-service-step-4-student {
        width: 200px;
    }
}

/* 
 * PRICING TABLE SECTION
 */

.pricing-table-section {
    position: relative;
}

.pricing-table-background {
    width: 100%;
    position: absolute;
    bottom: 0;
    z-index: -1;
}

.pricing-table {
    width: 100%;
    background: #ffffff;
}
.pricing-table02 {
    width: 100%;
    background: linear-gradient(to right, rgba(41,40,81,1) 0%,rgba(107,35,78,1) 100%);
}

.pricing-table caption {
    font-size: 2.5rem;
    font-weight: 700;
    caption-side: top;
    text-align: center;
    text-transform: uppercase;
    color: #ffffff;
    /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#29288a+31,9b1f86+100 */
    background: #29288a; /* Old browsers */
    background: -moz-linear-gradient(left,  #29288a 31%, #9b1f86 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(left,  #29288a 31%,#9b1f86 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right,  #29288a 31%,#9b1f86 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#29288a', endColorstr='#9b1f86',GradientType=1 ); /* IE6-9 */
}

.pricing-table02 caption {
    position: relative;
    font-size: 1.5rem;
    font-weight: 700;
    caption-side: top;
    text-align: center;
    text-transform: uppercase;
    color: #fff;
    /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#29288a+31,9b1f86+100 */
    background: #29288a; /* Old browsers */

}
.pricing-table02 caption::before {
    content: ""; /* 疑似要素にコンテンツを設定 */
    background: url(../img/TIPS.png) no-repeat; /* イラストの画像を設定 */
    background-size: cover; /* イラストのサイズを調整 */
    width: 217px; /* イラストの幅を設定 */
    height: 200px; /* イラストの高さを設定 */
    position: absolute; /* 疑似要素を絶対位置に設定 */
    left: 20px; /* イラストをテキストの左に配置（適切な距離に調整） */
    margin-top: -70px; /* テキストの上に適切な間隔を確保 */
    transform: rotate(-25deg);
}

.pricing-table th,
.pricing-table td {
    color: #29288b;
    width: 33%;
/*    text-transform: uppercase;*/
    text-align: center;
    border: 1px solid #29288b;
    vertical-align: middle;
    padding: 20px 0;
}

.pricing-table02 th,
.pricing-table02 td {
    color: #fff;
    width: 1%;
/*    text-transform: uppercase;*/
    text-align: center;
    border: 1px solid #fff;
    vertical-align: middle;
    padding: 20px 0;
}

.pricing-table__heading {
    font-size: 1.5rem;
    font-weight: 800;
}
.pricing-table02__heading {
    font-size: 1.5rem;
    font-weight: 800;
}

@media (max-width: 991px) {
	.pricing-table__heading {
    font-size: 1rem;
    font-weight: 400;
	}
}


.pricing-table__heading ul {
/*   text-align: left;*/
    list-style: none;
    padding-left: 1.6rem;
    display: table;
    margin: 0 auto;
}

@media (max-width: 991px) {
	.pricing-table__heading ul {
	text-align: left;
	}
}

.pricing-table__heading ul li {
    position: relative;
}

@media (max-width: 991px) {
	.pricing-table__heading ul li:before {
	width: 0.8rem;
    height: 0.8rem;
	left: -1rem;
	}
}

.pricing-table__flag {
    display: block;
    width: 75px;
    margin: 16px auto 10px;
}

@media (max-width: 991px) {
	.pricing-table__flag {
	width: 45px;
	}
}


.pricing-table__country {
    font-size: 1.3rem;
    font-weight: 400;
}

.pricing-table__tag {
    font-size: 1.5rem;
    font-weight: 400;
}

.double-strike-through {
    position: relative;
    display: inline-block;
    padding: 0 8px;
    font-size: 1.25rem;
    font-weight: 700;
}

.double-strike-through:before {
    content: "";
    width: 100%;
    border-bottom: 1px solid #29288b;
    position: absolute;
    top: 12px;
    left: 0;
}

.double-strike-through:after {
    content: "";
    width: 100%;
    border-bottom: 1px solid #29288b;
    position: absolute;
    top: 18px;
    left: 0;
}

.pricing-table__arrow {
    display: block;
    margin: 0 auto;
}

@media (max-width: 767.98px) {

.pricing-table02 th,
.pricing-table02 td {
    width: 0%;
    padding: 10px 0px;
}

    .pricing-table__arrow {
        width: 40px;
    }
}

.pricing-table__service-description {
    margin: 8px 0;
    font-size: .8rem;
}

.pricing-table__tag--special {
    display: inline-block;
    padding: 0 1rem;
    color: #ffffff;
    background: #9dc815;
}

.pricing-table__price {
    display: inline-block;
    font-size: 2rem;
    font-weight: 700;
    padding: 0 8px;
    position: relative;
}

.pricing-table__price:after {
    content: "";
    width: 100%;
    height: 12px;
    background: #f2e883;
    position: absolute;
    bottom: 5px;
    left: 0;
    z-index: -1;
}

@media (max-width: 767.98px) {
    .pricing-table caption {
        font-size: 1.5rem;
    }

    .pricing-table__heading {
        font-size: 0.8rem;
    }

    .pricing-table__heading ul {
        display: block;
    }

    .pricing-table__heading ul li:before {
        width: .8rem;
        height: .8rem;
        top: 5px;
        left: -1rem;
    }

    .double-strike-through:before {
        top: 10px;
    }

    .double-strike-through:after {
        top: 15px;
    }

    .pricing-table__country {
        font-size: 1rem;
    }

    .pricing-table__tag {
        font-size: 1rem;
    }

    .double-strike-through {
        font-size: 1rem;
    }

    .pricing-table__tag--special {
        font-size: .8rem;
        padding: 0 6px;
    }

    .pricing-table__price {
        font-size: 1.25rem;
    }
}

.pricing-table__button {
    display: block;
    width: 500px;
    font-size: 1.5rem;
    font-weight: 700;
    line-height: 5rem;
    height: 5rem;
    text-transform: uppercase;
    color: #ffffff;
    background: #9dc815;
    text-align: center;
    border-radius: 40px;
    margin: 50px auto;
	margin-bottom: 300px;
    -webkit-box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.5);
    -moz-box-shadow:    3px 3px 3px rgba(0, 0, 0, 0.5);
    box-shadow:         3px 3px 3px rgba(0, 0, 0, 0.5);
}

.pricing-table__button:hover {
   border: solid;
	 border-width: thin;
  border-color: #9dc815;
	background-color: #f9ffe6;
  box-shadow: 0px 10px 15px rgba(157,  200, 21, 0.4);
  color: #9dc815;
  transform: translateY(-7px);
}

@media (max-width: 767.98px) {
    .pricing-table__button {
        font-size: 1.5rem;
        line-height: 3rem;
        height: 3rem;
        width: 250px;
		margin-bottom: 100px;
    }
}


/* 
 * CONTACT US FORM
 */
.contact-us-form {
	position: relative;
	padding: 50px 50px 20px;
	margin-top: 100px;
	margin-bottom: 100px;
	border: 1px solid #29288b;
}


.contact-us-form:before {
	content: "";
	width: 100%;
	height: 20px;
	position: absolute;
	top: 0;
	left: 0;
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#29288a+31,9b1f86+100 */
	background: #29288a; /* Old browsers */
	background: -moz-linear-gradient(left, #29288a 31%, #9b1f86 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(left, #29288a 31%, #9b1f86 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to right, #29288a 31%, #9b1f86 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#29288a', endColorstr='#9b1f86',GradientType=1 ); /* IE6-9 */
}

.contact-us-form__heading {
	color: #29288b;
	font-weight: 700;
	text-transform: uppercase;
}

.contact-us-form__description {
	color: #29288b;
}

.contact-us-form__input {
	border: none;
	border-bottom: 1px solid #29288b;
	width: 100%;
	font-size: 1rem;
	padding: 10px;
	margin-top: 20px;
	outline: none;
}

.contact-us-form__textarea {
	resize: none;
	border: none;
	border-bottom: 1px solid #29288b;
	width: 100%;
	height: 116px;
	font-size: 1rem;
	padding: 10px;
	margin-top: 20px;
	outline: none;
}

.contact-us-form__button {
	font-size: 1.3rem;
    font-weight: 700;
    line-height: 3rem;
    display: block;
	width: 70%;
    max-width: 300px;
    height: 3rem;
    margin: 50px auto;
    text-align: center;
    color: #fff;
	border: none;
    border-radius: 40px;
    background: #9dc815;
    box-shadow: 4px 4px 8px rgb(0 0 0 / 30%);
	cursor: pointer;
}

.contact-us-form__button:hover {
  border: solid;
	 border-width: thin;
  border-color: #9dc815;
	background-color: #f9ffe6;
  box-shadow: 0px 10px 15px rgba(157,  200, 21, 0.4);
  color: #9dc815;
  transform: translateY(-7px);
}

.contact-us-form__button:focus {
	outline: none;
}

@media (max-width: 767.98px) {
	.contact-us-form {
		margin-top: 0;
		border: none;
		padding: 20px 10px 10px;
	}

	.contact-us-form:before {
		height: 0;
	}

	.contact-us-form__heading {
		font-size: 1.5rem;
	}
	
	.contact-us-form__background {
		background: red;
		height: 20px;
		margin-left: -15px;
		margin-right: -15px;
		/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#29288a+31,9b1f86+100 */
		background: #29288a; /* Old browsers */
		background: -moz-linear-gradient(left, #29288a 31%, #9b1f86 100%); /* FF3.6-15 */
		background: -webkit-linear-gradient(left, #29288a 31%, #9b1f86 100%); /* Chrome10-25,Safari5.1-6 */
		background: linear-gradient(to right, #29288a 31%, #9b1f86 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#29288a', endColorstr='#9b1f86',GradientType=1 ); /* IE6-9 */
	}
}

/* 
 * APPLICATION FORM
 */
.application-form__header {
	width: 100%;
	height: 200px;
	background: url(../img/application.png);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center bottom;
	position: relative;
}

.application-form__heading {
	color: #ffffff;
	text-transform: uppercase;
	font-weight: 700;
	line-height: 200px;
	text-align: center;
}

.application-form {
	position: relative;
	margin-top: -40px;
	margin-bottom: 50px;
	border: 1px solid #353535;
	padding: 0 50px;
	background: #ffffff;
}

.application-form:before {
	content: "";
	width: 100%;
	height: 20px;
	position: absolute;
	top: 0;
	left: 0;
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#29288a+31,9b1f86+100 */
	background: #29288a; /* Old browsers */
	background: -moz-linear-gradient(left, #29288a 31%, #9b1f86 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(left, #29288a 31%, #9b1f86 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to right, #29288a 31%, #9b1f86 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#29288a', endColorstr='#9b1f86',GradientType=1 ); /* IE6-9 */
}

.application-form__tag {
	text-transform: uppercase;
	color: #ffffff;
	background: rgba(156, 31, 137, 0.7);
	width: 100px;
	margin: 50px auto 10px;
	text-align: center;
}

.application-form__title {
	color: #29288b;
	text-transform: uppercase;
	font-weight: 700;
	font-size: 1.25rem;
	text-align: center;
}

.application-form__description {
	color: #29288b;
	text-align: center;
}

.application-form__input {
	display: block;
	width: 100%;
	padding: 7px;
	margin-bottom: 30px;
	border: 1px solid #C0C0C0;
		height: 48px;
}

.application-form__input:focus {
	outline: none;
}

.application-form__select {
	display: block;
	width: 100%;
	padding: 8px 8px 8px 6px;
	margin-bottom: 30px;
	border: 1px solid #C0C0C0;
	height: 48px;
}

.application-form__select:focus {
	outline: none;
}

.application-form__select option {
	color: #000000;
}

.application-form__select:invalid {
	color: gray;

}

.application-form__select > option[value=""][disabled] {
	color: gray;
}

.application-form__select:invalid > option[value=""][disabled] {
	display: none;
}

.application-form__input-contianer {
	position: relative;
	height: 46px;
	margin-bottom: 20px;
}

.application-form__input-contianer .application-form__input {
	position: absolute;
	top: 0;
}

#country-code-input {
	left: 0;
	width: 60px;
	padding-right: 9px;
	background-color: #f5f5f5;
	margin-bottom: 30px;
}

#phone-input {
	left: 49px;
	width: calc(100% - 50px);
	padding-left: 5px;
}

#grade-description-input {
	display: none;
}

.application-form__button {
	font-size: 1.3rem;
    font-weight: 700;
    line-height: 3rem;
    display: block;
	width: 70%;
    max-width: 300px;
    height: 3rem;
    margin: 50px auto;
    text-align: center;

    color: #fff;
	border: none;
    border-radius: 40px;
    background: #9dc815;
    box-shadow: 4px 4px 8px rgb(0 0 0 / 30%);
	cursor: pointer;
}

.application-form__button:hover {
	 border: solid;
	 border-width: thin;
  border-color: #9dc815;
  background-color: #f9ffe6;
  box-shadow: 0px 10px 15px rgba(157,  200, 21, 0.4);
  color: #9dc815;
  transform: translateY(-7px);
}

.application-form__button:focus {
	outline: none;
}

@media (max-width: 767.98px) {
	.application-form__header {
		height: 150px;
		background: url(../img/application-mobile.png);
	}

	.application-form__heading {
		font-size: 1.5rem;
		line-height: 150px;
	}

	.application-form {
		margin-top: 0;
		border: none;
		padding: 0 10px;
	}

	.application-form:before {
		height: 0;
	}
}

/*
 * CURRICULA PAGE
 */
.curricula-page {
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#29288a+30,9b1f86+100&0.58+30,0.58+100 */
	background: -moz-linear-gradient(left,  rgba(41,40,138,0.58) 30%, rgba(155,31,134,0.58) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(left,  rgba(41,40,138,0.58) 30%,rgba(155,31,134,0.58) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to right,  rgba(41,40,138,0.58) 30%,rgba(155,31,134,0.58) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#9429288a', endColorstr='#949b1f86',GradientType=1 ); /* IE6-9 */
}

.curricula-page .navbar {
	background: rgba(255, 255, 255, 0.5) !important;
}

.curricula-zambia__heading-container {
	text-align: center;
}

.curricula-zambia__heading {
	display: inline-block;
	margin: 50px auto;
	padding: 0 20px 5px 20px;
	font-size: 2rem;
	font-weight: 700;
	color: #ffffff;
	position: relative;
	text-transform: uppercase;
	border-bottom: 1px solid #ffffff;
}

@media (max-width: 767.98px) {
.curricula-zambia__heading {
	display: inline-block;
	margin: 50px auto;
	padding: 0 20px 5px 20px;
	font-size: 1.5rem;
	font-weight: 700;
	color: #ffffff;
	position: relative;
	text-transform: uppercase;
	border-bottom: 1px solid #ffffff;
}
}

.topic-tab-container {
	height: 700px;
	position: relative;
	border-radius: 30px 30px 0 0;
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#292851+0,6b234e+100 */
	background: rgb(41,40,81); /* Old browsers */
	background: -moz-linear-gradient(left,  rgba(41,40,81,1) 0%, rgba(107,35,78,1) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(left,  rgba(41,40,81,1) 0%,rgba(107,35,78,1) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to right,  rgba(41,40,81,1) 0%,rgba(107,35,78,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#292851', endColorstr='#6b234e',GradientType=1 ); /* IE6-9 */
    margin-top: 100px;
}
.topic-tab-container02 {
	height: 700px;
	position: relative;
	border-radius: 30px;
    margin-bottom: 50px;
    /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#feffff+0,f8d8ff+100 */
    background: linear-gradient(to bottom,  #feffff 0%,#f8d8ff 100%);
    /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}
.topic-tab02 {
	position: absolute;
	top: 20px;
	left: 0;
	width: 200px;
	height: 680px;
}

.topic-tab {
	position: absolute;
	top: 20px;
	left: 0;
	width: 200px;
	height: 680px;
}

/* Start of NEW Zambian paper part */
.zambia_button_container {
	display: inline-flex;
	justify-content: center;
	align-items: center;
}
.zambia_button_container a {
	position: relative;
	width: 160px;
	height: 60px;
	display: inline-block;
	background: #fff;
	margin: 0px;
}
.zambia_button_container a:before, .zambia_button_container a:after {
	content: '';
	position: absolute;
	inset: 0;
	background: #f00;
	transition: 0.5s;
}
.zambia_button_container a:nth-child(1):before, .zambia_button_container a:nth-child(1):after {
	background: linear-gradient(45deg, #0099ff, #fffdff, #f8d8ff, #d400d4);
}
.zambia_button_container a:nth-child(2):before, .zambia_button_container a:nth-child(2):after {
	background: linear-gradient(45deg, #fff01a, #fffdff, #f8d8ff,#d400d4);
}
.zambia_button_container a:nth-child(2):before, .zambia_button_container a:nth-child(2):after {
	background: linear-gradient(45deg, #fff01a, #fffdff, #f8d8ff,#d400d4);
}


.zambia_button_container a:hover:before {
	top: -3px;
	left: -3px;
	right: -3px;
	bottom: -3px;
	/* inset: -3px; */
}
.zambia_button_container a:hover:after {
	top: -3px;
	left: -3px;
	right: -3px;
	bottom: -3px;
	filter: blur(10px);
	/* inset: -3px; */
}


.zambia_button_container a span {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	display: inline-block;
	background: #353d66;
	z-index: 10;
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 18px;
	text-transform: uppercase;
	letter-spacing: 2px;
	color: #fff;
	border: 3px solid #040a29;
	overflow: hidden;
}
.zambia_button_container a span:hover {
	border-width: 1px;
    background: #ea5eea;
    border: 3px solid #ea5eea;
}
.zambia_button_container a span::before {
	content: '';
	position: absolute;
	top: 0;
	left: -50%;
	width: 100%;
	height: 100%;
	background: rgb(255 255 255 / 7.5%);
	transform: skew(25deg);
}
.coming_soon{
    margin: auto;
    display: block;
}
.coming_soon_sp{
    margin: auto;
    display: block;
}
.coming_soon_sp img{
    width: 100%;
}

@media (max-width: 991px) {
    .zambia_button_container a {
        width: 100px;
        height: 45px;
    }
    .zambia_button_container a span {
        font-size: 15px;
    }
    .pricing-table02 caption::before {
        width: 150px;
        height: 138px;
        margin-top: -40px;
    }
    .pricing-table02 caption {
        margin-top: 30px;
    }
    .pricing-table__tag p {
        margin-bottom: 0rem;
    }
    .pricing-table__tag {
        font-size: 1rem;
        font-weight: 400;
    }
}

@media (max-width: 767.98px){
    .zambia_button_container a {
        width: 100%;
        padding: 15px 30px;
        max-width: 50px;

    }
    .zambia_button_container a span {
        font-size: 11px;
        border: 2px solid #040a29;
    }
    .pricing-table02 caption::before {
        width: 123px;
        height: 110px;
        margin-top: -33px;
        left: -20px;
    }
    .pricing-table02 caption {
        margin-top: 50px;
    }
    /* .pricing-table02 th, .pricing-table02 td {
        padding: 10px 0;
    } */
    .pricing-table__tag {
        font-size: 15px;
    }
}
@media (max-width: 576px){
    .zambia_button_container a {
        padding: 5px 28px;
    }
    .zambia_button_container a span {
        font-size: 9px;
    }
    .pricing-table__tag {
        font-size: 9px;
    }
}

@media (max-width: 410px) {
    .pricing-table02 caption::before {
        width: 78px;
        height: 70px;
        margin-top: -7px;
        left: -14px;
    }
    .pricing-table02 caption {
        font-size: 1rem;
        padding-left: 57px;
    }
}
/* End of NEW Zambian paper part */



.topic-tab__flag {
	width: 80px;
	margin-left: 85px;
	margin-top: 40px;
}

.topic-tab__country {
	width: 80px;
	color: #ffffff;
	text-transform: uppercase;
	font-size: .8rem;
	padding-top: 5px;
	margin-left: 85px;
	text-align: center;
}

.topic-tab__image {
	width: 100%;
	position: absolute;
	bottom: 0;
	z-index: 1;
}

.topic-tab__links {
	padding-left: 50px;
	padding-top: 10px;
	list-style: none;
	color: #ffffff;
	position: relative;
	z-index: 2;
}

.topic-tab__link {
	height: 50px;
	margin-bottom: 5px;
	line-height: 50px;
	text-align: center;
	cursor: pointer;
	user-select: none;
}

.topic-tab__link.active {
	color: #29288b;
	background: #f2f2f2;
	border-radius: 25px 0 0 25px;
}

.topic-list-container {
	position: absolute;
	top: 20px;
	left: 200px;
	right: 20px;
	background: #f2f2f2;
	border-radius: 30px 30px 0 0;
}

.topic-list {
	width: 400px;
	height: 580px;
	padding: 0 10px 10px;
	margin: 50px auto 50px;
	background: #ffffff;
	list-style: none;
	border: 1px solid #606060;
	overflow-y: scroll;
	display: none;
}

.topic-list.active {
	display: block;
}

.topic-list__title {
	font-size: 0.75rem;
	padding: 5px 0;
}

.topic-list__item {
	/*height: 35px;*/
	line-height: 35px;
	padding-left: 20px;
	margin-bottom: 1px;
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#292851+31,6c234e+100 */
	background: rgb(41,40,81); /* Old browsers */
	background: -moz-linear-gradient(left,  rgba(41,40,81,1) 31%, rgba(108,35,78,1) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(left,  rgba(41,40,81,1) 31%,rgba(108,35,78,1) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to right,  rgba(41,40,81,1) 31%,rgba(108,35,78,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#292851', endColorstr='#6c234e',GradientType=1 ); /* IE6-9 */
}

.topic-list__item:hover {
	background: #ea5eea;
}

.topic-list__item a {
	color: #ffffff;
	display: inline-block;
	width: 100%;
}

.topic-list__item a:hover {
	text-decoration: none;
}

.modal-dialog {
	max-width: 400px;
	max-height: 400px;
}

.modal-content {
	border-radius: 25px;
}

.modal-header {
	padding: 0;
	position: relative;
}

.modal-title {
	width: 100%;
    text-align: center;
    margin-top: 40px;
    height: 50px;
    line-height: 50px;
	font-size: 1.5rem;
	color: #ffffff;
	background: #29288b;
}

.modal-header .close {
	position: absolute;
	top: -15px;
	right: -15px;
	padding: 0;
	margin: 0;
	width: 40px;
	height: 40px;
	border-radius: 20px;
	opacity: 1;
	font-size: 1.5rem;
	color: #ffffff;
	background: #d3d3d3;
}

.modal-header .close:focus {
	outline: none;
}

.popup__image {
	width: 100px;
	display: block;
	margin: 15px auto;
}

.popup__button-container {
	width: 256px;
	height: 46px;
	padding: 3px;
	margin: 0 auto 15px;
	border-radius: 40px;
	background: linear-gradient(to right, #29288b, #9b1f87);
    box-shadow: 4px 4px 8px rgb(0 0 0 / 30%);
}

.popup__button {
	font-size: 1.5rem;
	font-weight: 700;

	display: block;
	width: 250px;
	height: 40px;
	line-height: 40px;
	padding: 0;
	text-align: center;
	text-transform: uppercase;
	color: #29288b;
	border: none;
	border-radius: 40px;
	background-color: #fff;
}

.popup__button:hover {
	color: #29288b;
	text-decoration: none;
}

.popup__link,
.popup__link:hover {
	display: block;
	color: #29288b;
	width: 100%;
	text-align: center;
	margin-bottom: 15px;
}


@media (max-width: 576px) {
	.modal-dialog {
		margin-left: auto;
		margin-right: auto;
	}
}

@media (max-width: 410px) {
	.modal-dialog {
		margin-left: 10px;
		margin-right: 10px;
	}
}


@media (max-width: 767.98px) {
	.curricula-page .navbar {
		background: transparent !important;
	}

	.topic-tab-container {
		height: auto;
		background: transparent;
	}

	.topic-tab {
		position: static;
		width: auto;
		height: auto;
	}

	.topic-tab:after {
		content: "";
		display: block;
	}

	.topic-tab__flag {
		display: block;
		margin: 20px auto 0;
	}
	
	.topic-tab__country {
		width: 100%;
		margin: 0;
		text-align: center;
	}

	.curricula-zambia__heading {
		margin: 25px auto 10px;
	}

	.topic-tab__links {
		padding-left: 0;
	}

	.topic-tab__link {
		font-size: 0.8rem;
		float: left;
		width: 29.33%;
		margin: 20px 2%;
		height: 40px;
		line-height: 40px;
		border-radius: 15px;
    	box-shadow: 4px 4px 8px rgb(0 0 0 / 30%);
		/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#29288a+31,9b1f86+100 */
		background: rgb(41,40,138); /* Old browsers */
		background: -moz-linear-gradient(left,  rgba(41,40,138,1) 31%, rgba(155,31,134,1) 100%); /* FF3.6-15 */
		background: -webkit-linear-gradient(left,  rgba(41,40,138,1) 31%,rgba(155,31,134,1) 100%); /* Chrome10-25,Safari5.1-6 */
		background: linear-gradient(to right,  rgba(41,40,138,1) 31%,rgba(155,31,134,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#29288a', endColorstr='#9b1f86',GradientType=1 ); /* IE6-9 */
	}

	.topic-tab__link.active {
		border-radius: 15px;
	}

	.topic-list-container {
		position: static;
		background: transparent;
	}

	.topic-list {

		width: 100%;
		height: 400px;
		margin: 30px 0 0;
	}

	.modal-title {
		font-size: 1rem;
	}

	.popup__button-container {
		width: 206px;
	}

	.popup__button {
		font-size: 1rem;
		width: 200px;
	}


/* 
 * TEACHERS
 */
}

.TEACHERS-header__image {
	width: 100%;
	}

.TEACHERS-header__title {
    width: 100%;
    position: absolute;
    top: 45%;
    text-transform: uppercase;
    color: #29288b;
    font-weight: 700;
    text-align: center;
}

@media (max-width: 767.98px){
.TEACHERS-header__title {
    font-size: 1.75rem;
}

}
.section2 {
    margin: 50px 0;
	
}

.section2__heading {
	margin-top: 100px;
    display: inline-block;
    color: #ad0c83;
    font-weight: 700;
    text-transform: none;
    border-bottom: 3px solid #ad0c83;
    padding: 0.25rem;
    margin-bottom: 1rem;
	font-size: 3rem;
}

.teachers__headingtext {
    color: #ad0c83;
    font-weight: 300;
    font-size: 1.3rem;
    text-align: left;
    margin-top: 30px;

}


@media (max-width: 767.98px) {
    .section2__heading {
        margin-top: 50px;
		margin-left: 10px;
		font-size: 2rem;
		margin-bottom: 50px;
		text-align: center		
		}
	 .teachers__headingtext {
    color: #ad0c83;
    font-weight: 300;
    font-size: 1rem;
    text-align: left;
    margin-top: 30px;
}
}



	
.bg_test2 {
    height: 200px;              
    background-color: #ffe6ff; 
    padding: 50px;             
	margin-top: 0px;
    float:  right;              
    position:  relative;        
}

@media (max-width: 767.98px) {
	.bg_test2 {
		
     padding: 20px;
	 height: 200px;
	}
}


	

.card-img-overlay{
  padding: 40px;
  top: calc(50% - 0.5rem);
  text-align: center;
  font-weight: bold;
  font-size: 2rem;
}

.teachers__description1 {
    color: #ad0c83;
    font-weight: 300;
    font-size: 1.3rem;
    text-align: left;
    margin-top: 30px;
}


.teachers__description {
    color: #29288b;
    font-weight: 300;
    font-size: 1.3rem;
    text-align: left;
    margin-top: 30px;
}

@media (max-width: 767.98px) {
	.teachers__description {
	font-size: 1rem;	
     padding: 30px;
	margin-top: 0px;
	
}
}



.section-cc__pic {
    width: 45%;


}
.section-lms__pic {
    width: 40%;
	
}

.section-mathtutorialvideos__pic {
    width: 35%;
	

}

@media (max-width: 767.98px) {
    .section-cc__pic {
    width: 65%;
	

}
.section-lms__pic {
    width: 60%;


}

.section-mathtutorialvideos__pic {
    width: 50%;
	
}
}

.button {
  width: 180px;
  margin-top: 60px; 
  padding:12px 0;
  font-size: 14px;
  text-align:center;
  text-transform: uppercase;
  letter-spacing: 2.5px;
  font-weight: 500;
  color:  #ad0c83;
  background-color: #fff;
  border: none;
  border-radius: 45px;
  box-shadow: 0px 8px 15px rgba(0, 0, 0, 0.1);
  transition: all 0.3s ease 0s;
  cursor: pointer;
  }

@media (max-width: 767.98px) {
	.button {
		margin-top: 0px; 
 
	}
}


.button:hover {
  background-color: #ad0c83;
  box-shadow: 0px 15px 20px rgba(173, 12, 131, 0.4);
  color: #fff;
  transform: translateY(-7px);
}

.section-contact__button-container {
    position: center;
    top: 50%;
    width: 90%;
    text-align: center;
}

.section-contact {

	display:block;
	width: 50%;
	font-size: 30px;
    text-transform: uppercase;
	text-align:center;
    padding: 45px;
    font-weight: 900;
    border-radius: 60px;
    border: none;
	margin-top: 120px;
    margin-bottom: 170px;
	margin-left: auto;
	margin-right: auto;
    color: #ffffff;
    -webkit-box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.5);
    -moz-box-shadow:    3px 3px 3px rgba(0, 0, 0, 0.5);
    box-shadow:         3px 3px 3px rgba(0, 0, 0, 0.5);
}

.section-contactus {
    /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#bde4f9+0,5eb0c0+100 */
    background: rgb(156,31,135); /* Old browsers */
    background: -moz-linear-gradient(left,  rgba(156,31,135,1) 0%, rgba(41,40,139,1) 70%); /* FF3.6-15 */
    background: -webkit-linear-gradient(left,  rgba(156,31,135,1) 0%,rgba(41,40,139,1) 70%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right,  rgba(156,31,135,1) 0%,rgba(41,40,139,1) 70%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#9c1f87', endColorstr='#29288b',GradientType=1 ); /* IE6-9 */
}

.section-contact:hover {
  background-color: #ad0c83;
  box-shadow: 0px 10px 15px rgba(173, 12, 131, 0.4);
  color: #fff;
  transform: translateY(-7px);
}


@media (max-width: 767.98px) {

.section-contact {

	display:block;
	width: 100%;
	font-size: 20px;
    text-transform: uppercase;
	text-align:center;
    padding: 20px;
    font-weight: 900;
    border-radius: 60px;
    border: none;
	margin-top: 120px;
    margin-bottom: 100px;
	margin-left: auto;
	margin-right: auto;
    color: #ffffff;
    -webkit-box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.5);
    -moz-box-shadow:    3px 3px 3px rgba(0, 0, 0, 0.5);
    box-shadow:         3px 3px 3px rgba(0, 0, 0, 0.5);
}
}

@media (min-width: 576px) {

.section-contact {

	display:block;
	width: 50%;
	font-size: 30px;
    text-transform: uppercase;
	text-align:center;
    padding: 30px;
    font-weight: 900;
    border-radius: 60px;
    border: none;
	margin-top: 120px;
    margin-bottom: 170px;
	margin-left: auto;
	margin-right: auto;
    color: #ffffff;
    -webkit-box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.5);
    -moz-box-shadow:    3px 3px 3px rgba(0, 0, 0, 0.5);
    box-shadow:         3px 3px 3px rgba(0, 0, 0, 0.5);
}
}