@font-face {
    font-family: 'MYRIADPRO-BOLDIT';
    src: url('../fonts/MYRIADPRO-BOLDIT.otf') format('truetype') ;
}
@font-face {
    font-family: 'MyriadPro-Light';
    src: url('../fonts/MyriadPro-Light.otf') format('truetype') ;
}
@font-face {
    font-family: 'Segoe UI Bold';
    src: url('../fonts/Segoe UI Bold.ttf') format('truetype') ;
}
@font-face {
    font-family: 'Montserrat-Bold';
    src: url('../fonts/Montserrat-Bold.ttf') format('truetype') ;
}
@font-face {
    font-family: 'Montserrat-Light';
    src: url('../fonts/Montserrat-Light.ttf') format('truetype') ;
}
@font-face {
    font-family: 'Montserrat-Medium';
    src: url('../fonts/Montserrat-Medium.ttf') format('truetype') ;
}
@font-face {
    font-family: 'Montserrat-Regular';
    src: url('../fonts/Montserrat-Regular.ttf') format('truetype') ;
}
@font-face {
    font-family: 'Montserrat-SemiBold';
    src: url('../fonts/Montserrat-SemiBold.ttf') format('truetype') ;
}
@font-face {
    font-family: 'Poppins-SemiBold';
    src: url('../fonts/Poppins-SemiBold.ttf') format('truetype') ;
}
@font-face {
    font-family: 'Poppins-Regular';
    src: url('../fonts/Poppins-Regular.ttf') format('truetype') ;
}
@font-face {
    font-family: 'Poppins-Bold';
    src: url('../fonts/Poppins-Bold.ttf') format('truetype') ;
}
@font-face {
    font-family: 'Poppins-Medium';
    src: url('../fonts/Poppins-Medium.ttf') format('truetype') ;
}
@font-face {
    font-family: 'Poppins-Light';
    src: url('../fonts/Poppins-Light.ttf') format('truetype') ;
}
@font-face {
    font-family: 'Segoe UI';
    src: url('../fonts/Segoe UI.ttf') format('truetype') ;
}

@font-face {
    font-family: 'Cario';
    src: url('../fonts/Cairo-Bold.ttf') format('truetype') ;
}
@font-face {
    font-family: 'Cario-regular';
    src: url('../fonts/Cairo-Regular.ttf') format('truetype') ;
}
@font-face {
    font-family: 'Notonaksh';
    src: url('../fonts/NotoNaskhArabic-Regular.ttf') format('truetype') ;
}
@font-face {
    font-family: 'NotonakshBold';
    src: url('../fonts/NotoNaskhArabic-Bold.ttf') format('truetype') ;
}
@font-face {
    font-family: 'NotonakshUIBold';
    src: url('../fonts/NotoNaskhArabicUI-Bold.ttf') format('truetype') ;
}
@font-face {
    font-family: 'Quickstand-regular';
    src: url('../fonts/Quicksand-Regular.ttf') format('truetype') ;
}
@font-face {
    font-family: 'Quickstand-light';
    src: url('../fonts/Quicksand-Light.ttf') format('truetype') ;
}
@font-face {
    font-family: 'Quickstand-medium';
    src: url('../fonts/Quicksand-Medium.ttf') format('truetype') ;
}
@font-face {
    font-family: 'Quickstand-bold';
    src: url('../fonts/Quicksand-Bold.ttf') format('truetype') ;
}
body{
    font-family: 'Segoe UI', sans-serif !important;
}
/*header*/
.main-header{
    background-image: url('../images/header-bg.png');
    height: 720px;
    width: 100%;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}
.main-header2{
    background-image: url('../images/wave_bg.png');
    height: 720px;
    width: 100%;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}
.down{
    border-radius: 50%;
    position: absolute;
    bottom: -80px;
    left: 0;
    right: 0;
    text-align: center;
    margin: 0 auto;
}
.down a{
    background: #47b6f7;
    padding: 10px;
    border-radius: 50px;
    color: #fff;
    box-shadow: 0px 2px 7px 0px #3333336e;
}
.header{
    text-transform: uppercase;
    position: relative;
    top: 5px;
    left: 0;
    right: 0;
}
.header .nav-link:hover{
    color: #fff;
    text-decoration: none;
    background-color: #008bb3;
    border-radius: 25px;
}
.logo{
    width: 200px;
}
.header_dropdown{
    background: #008bb3;
    border-radius: 0;
    border: none;
    margin: 0;
}
.header_dropdown a{
    color: #fff;
}
.dropdown-item:focus, .dropdown-item:hover{
    color: #063f75 !important;
    text-decoration: none;
    background-color: #7be300;
}
.navbar-nav .active>.nav-link,.navbar-nav .nav-link.active, .navbar-light .navbar-nav .nav-link.show, .navbar-light .navbar-nav .show>.nav-link{
    background: #008bb3;
    color: #fff;
}
li.nav-item.dropdown.show {
    background-color: #008bb3;
}
.nav-button{
    border: 2px solid #fff;
    border-radius: 25px;
    padding: 5px 10px !important;
    color: #fff;
}
.nav-button:focus, .nav-button:hover{
    background: transparent !important;
    color: #fff;
}
.nav-item a{
    color: #fff !important;
}

.navbar, .nav-item {
    padding: 8px;
}
.dropdown-item{
    padding: .60rem 1.5rem;

}
.navbar-light  .toggle-b{
    border-color: rgb(255, 255, 255) !important;
}
/*slider*/
.slider-content{
    position: relative;
    top: 50px;
    font-family: "Myriad Pro";
}
.slider-img img{
    max-width: 410px;
    width: 100%;
}
.slider-text-content{
    color: #fff;
}
.slider-text-content h1 {
    font-size: 45px;
    font-family: "Myriad Pro";
    color: rgb(255, 255, 255);
    font-weight: bold;
}
.slider-text-content p{
    font-size: 18px;
    font-family: "open sans";
    font-weight: normal;
}

/*engaging-section*/
.engaging-section{
    padding: 15px 5px;
}
.engaging-content h2 {
    font-size: 49px;
    font-family: "Segoe UI";
    color: rgb(1, 9, 39);
    font-weight: bold;
}
.engaging-content{
    /*padding: 0px 48px;*/
}
.engaging-content p{
    font-size: 17px;
    font-family: "open sans";
    font-weight: normal;
    color: #3a3a3a;
    margin-top: 1rem;
    /*padding: 0px 0px 0 45px;*/
}
.engaging-images{
    margin-bottom: 2rem;
}
.engaging-img img{
    /*	max-width: 500px;*/
    width: 100%;
    /*height: 480px;*/
}
.engaging-images img{
    max-width: 175px;
    width: 100%;
    padding: 10px;
}
.engaging-btn{
    padding: 15px 20px;
    background-color: #00acd0;
    color: #fff;
    font-weight: 600;
    font-size: 14px;
    font-family: 'Montserrat', sans-serif;
    text-transform: uppercase;
}
.engaging-btn:hover, .engaging-btn:focus{
    color: #fff;
    background-color: #7BE300;
}
.read_aloud-btn:hover, .read_aloud-btn:focus{
    color: #fff;
    background-color: #7BE300;
}
/*read-aloud*/
.read-aloud{
    padding: 15px 5px;
    background-color: #f0fafc;
}
.read_aloud h2 {
    font-size: 49px;
    font-family: "Segoe UI";
    color: rgb(1, 9, 39);
    font-weight: bold;
    margin-bottom: 2rem;
}
.read_aloud p{
    font-size: 17px;
    /*font-family: "open sans";*/
    margin-top: 1rem;
    /* padding: 0 100px 0 0;*/
    font-weight: normal;
}
.read_aloud_images{
    margin-bottom: 2rem;
}
.read_aloud_images img{
    max-width: 175px;
    width: 100%;
    padding: 10px;
}
.read_aloud-btn{
    padding: 15px 20px;
    background-color: #00acd0;
    color: #fff;
    font-weight: 600;
    font-size: 14px;
    font-family: 'Montserrat', sans-serif;
    text-transform: uppercase;
}

/*personalised_section*/
.personalised_section{
    padding: 15px 5px;
}
.personalised_section h2 {
    font-size: 49px;
    font-family: "Segoe UI";
    color: rgb(1, 9, 39);
    font-weight: bold;
    margin-bottom: 2rem;
}
.personalised_section p{
    font-size: 17px;
    margin-top: 1rem;
    /*font-family: "open sans";*/
    font-weight: normal;
    padding: 0px 0px 0 45px;
}
.personalised_section_btn{
    padding: 15px 20px;
    background-color: #00acd0;
    color: #fff;
    font-weight: 600;
    /*font-size: 1.5rem;*/
    font-family: 'Montserrat', sans-serif;
    text-transform: uppercase;
}
.personalised_section_btn:hover, .personalised_section_btn:focus{
    color: #fff;
    background-color: #7BE300;
}
.personalised_section-p{
    margin-top: 2rem;
    margin-bottom: 2rem;
}

/*testimonial*/
.testimonial-bg{
    background-image: url('../images/wave bg.png');
    padding: 15px 5px;
    width: 100%;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}
.testimonial-bg2{
    background-image: url('../images/wave_t.png');
    padding: 120px 5px;
    width: 100%;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}
.carousel {
    margin: 50px auto;
}
.carousel .item {
    overflow: hidden;
    min-width: 120px;
    font-size: 13px;
    height: 286px;
}
.name{
    font-size: 17px;
    font-weight: 500;
}
.details{
    font-family: "Myriad Pro";
}
.carousel .media {
    position: relative;
    padding: 0 0 0 20px;
    margin-left: 20px;
    margin-top: 30px;
    margin-bottom: 15px;
}
.carousel .media img {
    width: 75px;
    height: 75px;
    display: block;
    border-radius: 50%;
    box-shadow: 0 2px 4px rgba(0,0,0,0.2);
}
.carousel .testimonial {
    position: relative;
    background: #ffffff;
    padding: 15px;
    margin: 0 auto;
    border-radius: 7px;
    height: 180px;
    width: 280px;
}
.carousel .testimonial::before, .carousel .testimonial::after {
    content: "";
    display: inline-block;
    position: absolute;
    left: 85px;
    bottom: -35px;
}
/*.carousel .testimonial::before {
    width: 20px;
    height: 20px;
	background: #9b9b9b;
	box-shadow: inset 12px 0 13px rgba(0,0,0,0.5);
}*/
.carousel .testimonial::after {
    width: 0;
    height: 0;
    border-left: 25px solid transparent;
    border-right: 25px solid transparent;
    border-top: 35px solid #fff;
}
/*.carousel .item .row > div:first-child .testimonial {
	margin: 0 20px 20px 0;
}
.carousel .item .row > div:first-child .media {
	margin-left: 0;
}*/
.carousel .testimonial p {
    line-height: 21px;
    margin: 0;
    /*font-family: "open sans";*/
    color: #222;
    font-size: 15px;
    padding: 12px;
}

.carousel .overview {
    padding: 3px 0 0 15px;
    font-family: "Myriad Pro";
    color: rgb(255, 255, 255);
    font-size: 14px;
}
.carousel .overview .details {
    padding: 5px 0 8px;
}
.carousel .overview b {
    text-transform: uppercase;
    color: #fff;
}
.carousel .carousel-control {
    width: 30px;
    height: 30px;
    background: #666;
    text-shadow: none;
    top: 4px;
}
.carousel-control i {
    font-size: 16px;
}
.carousel-control.left {
    left: auto;
    right: 40px;
}
.carousel-control.right {
    left: auto;
}
.carousel-indicators {
    bottom: -80px;
}
.carousel-indicators li, .carousel-indicators li.active {
    width: 1px;
    height: 1px;
    border-radius: 25px;
    margin: 1px 4px;
}
.carousel-indicators li {
    background: #e2e2e2;
    border: 4px solid #fff;
}
.carousel-indicators li.active {
    color: #fff;
    background: #fff;
}
.testimonial-heading h2 {
    font-size: 49px;
    font-family: "Segoe UI";
    color: rgb(255, 255, 255);
    font-weight: bold;
}
/*choose_grade*/

.choose_grade{
    padding: 15px 25px;
}
.choose_grade-content h2{
    font-size: 49px;
    font-family: "Segoe UI";
    color: rgb(1, 9, 39);
    font-weight: bold;
}
.choose_grade-content p{
    font-size: 15px;
    /*font-family: "open sans";*/
}
/*grade box*/
.grade-img{
    background-image: url('../images/circle.png');
    background-repeat: no-repeat;
}
.gradebox{
    background-color: #fff;
    border: 1px solid #ddd;
    border-radius: 7px;
    max-width: 260px;
    width: 100%;
    padding: 42px;
    color: #fff;
    font-family: "Myriad Pro";
    margin: 0px 6px;
}
.gradebox h3{
    font-weight: 500;
    font-size: 32px;
    margin-bottom: 1.5rem;
}
.grade_button{
    background-color: #86e100;
    color: #004167;
    font-family: "Montserrat";
    text-transform: uppercase;
    font-size: 17px;
    font-weight: 400;
    border-radius: 48px;
    padding: 12px;
}
.gradebox p{
    /*font-family: "open sans";*/
    font-size: 15px;
    font-weight: 400;
    margin-bottom: 3.5rem;
    line-height: 2;
    color: rgb(255, 255, 255);
}

.gradebox_content{
    margin-bottom: 3rem;
}
.gradebox_content img{
    margin-bottom: 1.5rem;
}
.gradebox_w{
    background-color: #ffffff;
    border: 1px solid #ddd;
    border-radius: 7px;
    max-width: 253px;
    width: 100%;
    padding: 42px;
    color: #2e3d62;
    font-family: "Myriad Pro";
    border: none;
    box-shadow: 0px 0px 9px -6px;
    margin: 10px 14px;
}
.gradebox_w h3{
    font-weight: 500;
    font-size: 22px;
    margin-bottom: 1.5rem;
}
.grade_button_w{
    background-color: #00acd0;
    color: #fff;
    font-family: "Montserrat";
    text-transform: uppercase;
    font-size: 14px;
    font-weight: 500;
    border-radius: 48px;
    padding: 12px;
}
.gradebox_w:hover{
    background-color: #00acd0;
    color: #fff;
    transition: .3 ease-in-out;

}
.gradebox_w:hover .h{
    display: none;
    transition: .3s ease-in-out;
}

.gradebox_w:hover .s{
    display: block !important;
    transition: .3s ease-in-out;
}
.gradebox_w:hover .grade_button_w{
    background-color: #86e100;
    color: #004167;
    transition: .3s ease-in-out;
}
.gradebox_w:hover .gradebox_content p{
    color: #fff;
    transition: .3s ease-in-out;
}

.grade_button_w:focus, .grade_button_w:hover{
    background-color: #86e100;
    color: #004167;
}
.gradebox_w p{
    /*font-family: "open sans";*/
    font-size: 15px;
    font-weight: normal;
    margin-bottom: 3.5rem;
    line-height: 1.6;
    color: #2e3d62;
}

.gradebox_content_w{
    margin-bottom: 3rem;
}
.gradebox_content_w img{
    margin-bottom: 1.5rem;
}
/*Download app*/
.download_app{
    background-image: url('../images/download_bg.png');
    padding: 60px 5px;
    width: 100%;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}
.download_app2{
    background-image: url('../images/download2.png');
    padding: 60px 5px;
    width: 100%;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}
.download_app-content h2{
    font-size: 49px;
    font-family: "Segoe UI";
    color: rgb(255, 255, 255);
    font-weight: bold;
    margin-bottom: 2rem;
}
.download_app-content p {
    font-size: 17px;
    font-weight: normal;
    /*font-family: "open sans";*/
    padding-right: 70px;
    color: #fff;
}
.stores img{
    margin-right: 2rem;
    margin-bottom: 1rem;
}

/*footer*/
.footer{
    padding: 70px 5px;
    background-color: #153046;
}
.footer-info p{
    font-size: 14px;
    color: #e6e6e6c9;
    /*font-family: "open sans";*/
    font-weight: normal;
}
.footer-info{
    margin: 1.5rem 0;
}
.footer-logo img{
    max-width: 180px;

}
.footer-icons img{
    padding-right: 20px;
    width: 55px;
    margin-bottom: 2rem ;
}
.services h3{
    font-size: 16px;
    font-family: "Montserrat";
    color: rgb(240, 240, 240);
    font-weight: bold;
}

.services ul {
    padding: 0;
}
.services ul li{
    list-style: none;

}
.services a{
    font-size: 15px;
    font-family: "Myriad Pro";
    color: #e6e6e6c9;
    line-height: 2.222;
    font-weight: 100;
    text-decoration: none;
}
.slider-reg{
    width: 150px;
    font-size: 17px !important;
}
.slider-feat{
    width: 150px;
    font-size: 17px !important;
}
/*login section*/
.page-header{
    /*background-image: url('../images/page_header.png');*/
    background: #47B6F7;
    max-height: 400px;
    width: 100%;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    height: auto;
}
.page-title{
    padding: 10px;
    padding-top: 0px;
}
.page-title h1{
    /*font-size: 52px;*/
    font-family: "Segoe UI";
    color: rgb(255, 255, 255);
    font-weight: bold;
}
.login-section{
    padding: 30px 0;
}
.login-btn{
    background-color: #7be300;
    border: none;
    font-family: "Myriad Pro";
    color: rgb(0, 84, 138);
    font-weight: bold;
    font-size: 20px;
    padding: 9px;
    margin-top: 1rem;
}

.login-btn:focus, .login-btn:hover{
    background-color: #7be300;
    border: none;
    color: #00548a;
}
.login-label{
    font-size: 20px;
    font-family: "Segoe UI";
    color: rgb(40, 40, 40);
    font-weight: 400;
}
.login-form{
    padding: 1.375rem 0.75rem;
    border: 1px solid #9e9e9e;
}
.login-content{
    padding: 20px;
}
.login-content p{
    font-size: 17px;
    /*font-family: "open sans";*/
    color: rgb(40, 40, 40);
    line-height: 1.054;
    font-weight: 400;
}
.login-content a{
    text-decoration: none;
    font-family: "Segoe UI";
    color: rgb(40, 40, 40);
}
/*Register*/
.register {
    padding: 80px 5px;
}
.login-details h2{
    font-size: 30px;
    font-family: "Segoe UI";
    color: rgb(0, 121, 192);
    font-weight: bold;
    line-height: 2;
}
.user-info-title h2{
    font-size: 30px;
    font-family: "Segoe UI";
    color: rgb(0, 121, 192);
    font-weight: bold;
    line-height: 2;
}
.register-title p{
    font-size: 17px;
    /*font-family: "open sans";*/
    color: rgb(51, 51, 51);
    font-weight: 400;
}
.select-form{
    border: 1px solid #9e9e9e;
    height: 46px;
}
/*select-lesson*/
.select-lesson-title p{
    font-size: 25px;
    font-family: "open sans";
    color: rgb(51, 51, 51);
    font-weight: 500;
    margin-bottom:  3rem;
}
.select-lesson{
    padding: 80px 5px;
}
.lesson-btn-active{
    background-color: #7be300;
    border: none;
    font-family: "Myriad Pro";
    color: rgb(0, 84, 138);
    font-weight: 500;
    font-size: 20px;
    padding: 9px;
    margin-top: 1rem;
}
.lesson-img img{
    width: 150px;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px){
    .lesson-img img{
        width: 110px;
    }
}
.lesson-btn{
    background-color: #0baed6;
    border: none;
    font-family: "Myriad Pro";
    color: rgb(255, 255, 255);
    font-weight: 500;
    font-size: 20px;
    padding: 9px;
    margin-top: 1rem;
}
.lesson-btn:focus, .lesson-btn:hover{
    background-color: #7be300;
    color: rgb(0, 84, 138);
}
.lessons{
    margin: 1rem 0;
}
.lesson-content h3{
    font-size: 26px;
    font-family: "Segoe UI";
    color: rgb(61, 61, 61);
    font-weight: bold;
}
.lesson-content p {
    font-size: 17px;
    font-family: "open sans";
    color: rgb(61, 61, 61);
    font-weight: normal;
}
.breadcrumb-item+.breadcrumb-item::before{
    display: inline-block;
    padding-right: .5rem;
    color: #6c757d;
    content: ">";
}
/*individual_story*/
.individual_story{
    margin-bottom: 2rem;
    padding: 0px 5px 30px 5px;
}
.individual_story_title h2{
    font-size: 49px;
    font-family: "Segoe UI";
    color: rgb(74, 74, 74);
    font-weight: bold;
    margin-bottom: 3rem;
}
.individual_story_content p{
    font-size: 17px;
    font-family: "open sans";
    color: rgb(62, 62, 62);
    font-size: 17px;
}
.individual_story_content img{
    max-width: 500px;
    width: 100%;
    margin-bottom: 1rem;
}
.excercise{
    margin-top: 3rem;
}
.excercise-title{
    margin-bottom: 3rem;
}
.excercise-title h2{
    font-size: 49px;
    font-family: "Segoe UI";
    color: rgb(74, 74, 74);
    font-weight: bold;
}
.excercise-title p{
    font-size: 28px;
    font-family: "open sans";
    color: rgb(51, 51, 51);
    font-weight: 400;
}
.excercise-content{
    margin-bottom: 2rem;
}
.excercise-btn-active{
    background-color: #00acd0;
    color: #fff;
    padding: 7px;
    font-size: 20px;
    font-weight: 400;
    font-family: "Segoe UI";
    margin-bottom: 2rem;
}
.excercise-btn{
    padding: 7px;
    font-family: "Segoe UI";
    color: rgb(51, 51, 51);
    border-style: solid;
    font-size: 20px;
    font-weight: 400;
    border-radius: 5px;
    border-width: 1px;
    margin-bottom: 2rem;
    border-color: rgb(183, 183, 183);
    background-color: rgb(255, 255, 255);
}
.back-excercise {
    font-size: 17px;
    font-family: "Segoe UI";
    color: rgb(73, 73, 73);
    font-weight: bold;
}
.back-excercise a{
    font-size: 17px;
    font-family: "Segoe UI";
    color: rgb(73, 73, 73);
    font-weight: bold;
    text-decoration: none;
}
.breadcrumb-item a{
    text-decoration: none;
}
/*About us*/
.about_us{
    padding: 80px 5px;
}
.about_us_content p{
    font-size: 17px;
    font-family: "open sans";
    color: rgb(62, 62, 62);
}
.about_us_content h2{
    font-size: 30px;
    font-family: "Segoe UI";
    color: rgb(62, 62, 62);
    font-weight: bold;
    margin-bottom: 2rem;
}
/*Contact us*/
.contact_us{
    padding: 25px 5px;
}
.contact_form{
    padding: 1.575rem 1.45rem;
    border: 1px solid #9e9e9e;
    margin-bottom: 2rem;
    background: #f8f8f8;
    font-size: 18px;
    font-weight: 500;
    font-family: "Segoe UI";
    color: rgb(40, 40, 40);
}
.Your_Name {
}

.contact_us h2{
    font-size: 30px;
    font-family: "Segoe UI";
    color: rgb(62, 62, 62);
    font-weight: bold;
    margin-bottom: 2rem;
}
.contact_us p{
    font-size: 17px;
    font-family: "open sans";
    color: rgb(62, 62, 62);

}
.contact_us_btn{
    background-color: #00acd0;
    font-size: 25.521px;
    font-family: "Myriad Pro";
    color: rgb(255, 255, 255);
    font-weight: bold;
    margin-top: 1rem;
}
.contact_us_btn:focus, .contact_us_btn:hover{
    background-color: #7be300;
    color: rgb(0, 84, 138);
}
.address{
    margin-bottom: 2rem;
}
.address h2{
    font-size: 30px;
    font-family: "Segoe UI";
    color: rgb(62, 62, 62);
    font-weight: bold;
    margin-bottom: 1rem;
}
.address p{
    margin: 0;
    font-size: 16px;
    line-height: 1.2;
    font-family: "open sans";
    color: rgb(62, 62, 62);
}
.address a{
    margin: 0;
    font-size: 17px;
    font-family: "Myriad Pro";
    color: rgb(62, 62, 62);
    text-decoration: none;
}
.contact_us_social img{
    padding-right: 20px;
    width: 60px;
}
.contact_us_social h2{
    font-size: 30px;
    font-family: "Segoe UI";
    color: rgb(62, 62, 62);
    font-weight: bold;
    margin-bottom: 1rem;
}
/*style_sheet*/
.style_sheet{
    padding: 25px 5px;
}
.style_sheet_title h2{
    font-size: 49px;
    font-family: "Segoe UI";
    color: rgb(74, 74, 74);
    font-weight: bold;
}
.style_sheet_title{
    margin-bottom: 4rem;
}
.style_sheet_title p{
    font-size: 30px;
    font-weight: 500;
    font-family: "open sans";
    color: rgb(51, 51, 51);
}
.style_sheet_title_content h3{
    font-size: 30px;
    font-family: "Segoe UI";
    color: rgb(61, 61, 61);
    font-weight: bold;
    margin-bottom: 2rem;
}
.style_sheet_title_content p {
    font-size: 16px;
    font-family: "open sans";
    color: rgb(62, 62, 62);
}
.buttons{
    margin: 3rem 0rem;
}
.default_btn{
    background-color: #00acd0;
    font-size: 20px;
    font-family: "Myriad Pro";
    color: rgb(255, 255, 255);
    font-weight: bold;
    padding: 9px;
    margin-top: 1rem;
    margin-right: 10px;
}
.hover_pressed_btn{
    background-color: #7be300;
    border: none;
    font-family: "Myriad Pro";
    color: rgb(0, 84, 138);
    font-weight: bold;
    font-size: 20px;
    padding: 9px;
    margin-right: 10px;
    margin-top: 1rem;
}
.default_btn:focus, .default_btn:hover{
    background-color: #7be300;
    color: rgb(0, 84, 138);
}
/*lesson*/
.lesson{
    padding: 80px 5px;
}
.lesson_title{

}
.lesson_title h2{
    font-size: 49px;
    font-family: "Segoe UI";
    color: rgb(74, 74, 74);
    font-weight: bold;
}
.lesson_title p{
    font-size: 25px;
    font-family: "open sans";
    color: rgb(51, 51, 51);
    font-weight: 400;
}
.owl-buttons {
    display: block;
}/*
.owl-item {
  text-align: center;
}*/
.fa-inverse {
    color: #00acd0 !important;
}
.owl-theme .owl-controls .owl-buttons div {
    background: transparent;
    color: #fff;
    font-size: 40px;
    line-height: 300px;
    margin: 0;
    padding: 0 60px;
    position: absolute;
    top: 45px;
}
.owl-theme .owl-controls .owl-buttons .owl-prev {
    left: -60px;
    padding-left: 20px;
}
.owl-theme .owl-controls .owl-buttons .owl-next {
    right:0px;
    padding-right: 20px;
}
.fa-stack{
    width: 100% !important;
}
.slide_lesson{
    padding: .5rem;
    text-align: left;
}
.owl-theme .owl-controls .owl-page span{
    width: 15px !important;
    height: 15px !important;
    background: #0baed6 !important;
}
/*stories lesson*/
.stories_lesson{
    padding: 80px 5px;
    background-color: #eff9fc;
}
.stories_lessons{
    margin-bottom: 2rem;
}
.stories_lesson_tiitle h2{
    font-size: 49px;
    font-family: "Segoe UI";
    color: rgb(74, 74, 74);
    font-weight: bold;
}
.stories_lesson_tiitle p{
    font-size: 25px;
    font-family: "open sans";
    color: rgb(51, 51, 51);
    font-weight: 400;
}
.stories_lessons img{
    width: 80px;
    height: 80px;
}
.stories_lessons p{
    font-size: 17px;
    font-family: "open sans";
    color: rgb(51, 51, 51);
    font-weight: 400;
    margin: 0;
}
/*comments*/
.comments{
    padding: 120px 5px;
}
.c-nav{
    padding-bottom: 0;
    padding-left: 0;
}
.c-nav a{
    color: #333 !important;
    padding-left: 0;
    padding-right: 0;
}
.nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active{
    border-color: transparent;
    border-bottom: 3px solid #0085b6;
}
.login-d {
    position: absolute;
    right: 0;
}
li.c-nav.dropdown.show{
    background-color: transparent;
}
.comm_content p{
    padding: 0 6px;
    margin-right: 10px;
}
.comm_content i{
    color: red;
}
.c_tw{
    background-color: #00aced;
    color: #fff;
    border-radius: 5px;
}
.c_tw i{
    color: #fff;
}
.c_tw a{
    color: #fff;
}
.c_fb{
    background-color: #3b5998;
    color: #fff;
    border-radius: 5px;
}
.c_fb i{
    color: #fff;
}
.c_fb a{
    color: #fff;
}
.comm_content a{
    text-decoration: none;
}
.comm_content ul li{
    list-style: none;
}
.comm_form img{
    width: 37px;
    padding: 4px;
}
.comm_form p {
    font-size: 15px;
}
.comm_form label{
    font-size: 15px;
}
.comm_form{
    margin-bottom: 4rem;
}
.comments_section{
    color: #9E9E9E;
}
.dashboard{
    background-color: #f6f6f6;
    padding: 30px 5px;
}
.dashboard_profile{
    padding: 18px 12px;
}
.dashboard_profile_card{
    padding: 0px;
    width: 18rem;
    border-radius: 8px;
    border: none;
    margin: 0 auto;
    box-shadow: 0px 0px 9px -6px;
    margin-bottom: 3rem;
}
.dashboard_profile_body{
    padding: 15px;
}
.dashboard_profile h5{
    font-size: 30px;
    font-family: "Myriad Pro";
    color: rgb(33, 33, 33);
    margin: 0;

}
.dashboard_profile p{
    font-size: 20px;
    font-family: "open sans";
    color: rgb(43, 43, 43);
}
.dashboard_content{
    margin-bottom: 3rem;
}
.dashboard_content h4{
    font-size: 28px;
    font-family: "Segoe UI";
    color: rgb(51, 51, 51);
    font-weight: 400;
    margin-bottom: 2rem;
}
.dashboard_content p{
    font-size: 16px;
    font-family: "open sans";
    color: rgb(51, 51, 51);
}
.dashboard_date{
    background: #dae1e8;
    color: #4f5f6f;
    border: none;
    border-radius: 25px;
}
.content_dashboard h4{
    font-size: 30px;
    font-family: "Myriad Pro";
    color: rgb(51, 51, 51);
}
.content_dashboard p{
    font-size: 17px;
    font-family: "open sans";
    color: rgb(51, 51, 51);
}
.report_chart{
    background-color: #fff;
    box-shadow: 0px 0px 9px -6px;
    text-align: center;
    padding: 25px;
    border-radius: 8px;
    margin-bottom: 3rem;
}
.report_chart h2{
    font-size: 30px;
    font-family: "Myriad Pro";
    color: rgb(51, 51, 51);
    text-align: left;
}
.report_chart p{
    text-align: left;
}
.circle {
    display: inline-block;
    margin: 1em;
}

.circles-decimals {
    font-size: .4em;
}
.report_chart i{
    color: #00b0d9;
    font-size: 12px;
    padding-right: 5px;
}
.list-group-item.active {
    z-index: 2;
    color: #222;
    background-color: #f4f4f4;
    border-left: 8px solid #00b0d9;
    border-top: none;
    border-bottom: none;
    border-radius: 0px;
    border-right: none;
    padding-left: 14px;
}
.dashboard_profile_list li{
    font-size: 18px;
    font-family: "Myriad Pro";
    color: rgb(38, 37, 37) !important;
}
.report_chart h3{
    font-size: 45.242px;
    font-family: "Myriad Pro";
    color: rgb(99, 99, 99);
    font-weight: 500;
}

.engaging-img{
    margin-top: 2rem;
    margin-bottom: 1rem;
}
@media (min-width: 768px){
    .read_aloud p{
        padding: 0 100px 0 0;
    }
    /*.engaging-content p{*/
    /*    padding: 0px 0px 0 45px;*/
    /*}*/
}
@media only screen and (min-device-width: 320px) {

    /*.carousel .testimonial {
      width: 280px;
  } */

}
@media only screen and (min-device-width: 375px)
and (max-device-width: 768px) {
    .gradebox_w{
        margin: 10px 23px;
    }
    .owl-theme .owl-controls .owl-buttons .owl-next {
        right: 20px;
        padding-right: 20px;
    }
    .owl-theme .owl-controls .owl-buttons .owl-prev {
        left: -42px;
        padding-left: 20px;
    }
    /*.carousel .testimonial{
          width: 237px;
      padding: 0;
    }*/
}
@media only screen and (max-device-width: 375px) {
    .carousel .testimonial {
        width: 237px;
        padding: 0;
    }
    .main-header{
        height: 800px;
    }
    .main-header2{
        height: 800px;
    }
}
@media only screen
and (min-device-width: 376px)
and (max-device-width: 414px){
    .gradebox_w {
        margin: 10px 40px;
    }
}
@media only screen and (min-device-width: 414px){
    /*.carousel .testimonial {
      width: 340px;
      padding: 15px;
  } */
    /*.gradebox_w {
        margin: 10px 1px;
    }

    .gradebox{
        margin: 10px 42px;
      }
    }*/
    .navbar-collapse{
        background: #008bb3;
        border-radius: 13px;
        padding: 5px;
        z-index: 100;
    }
}
@media only screen and (min-width: 991px){
    .navbar-collapse{
        background: transparent;
        border-radius: 13px;
        padding: 5px;
    }

    .choose_grade-content{
        margin-bottom: 50px;
    }
}
@media all and (device-width: 768px) and (device-height: 1024px) and (orientation:portrait) {


    .owl-theme .owl-controls .owl-buttons .owl-next {
        right: 20px;
        padding-right: 20px;
    }
    .gradebox_w{
        margin: 10px 47px;
    }
}



@media only screen
and (min-width: 1024px)
and (max-height: 1366px)
and (orientation: portrait)
and (-webkit-min-device-pixel-ratio: 1.5) {
    .owl-theme .owl-controls .owl-buttons .owl-next{
        right: 40px;
    }
}

@media only screen
and (min-device-width : 414px)
and (max-device-width : 736px){
    .gradebox_w {
        margin: 10px 43px;
    }
}


@media only screen
and (max-device-width: 320px)  {
    .gradebox_w{
        margin: 10px 1px;
    }
    .owl-theme .owl-controls .owl-buttons .owl-prev{
        left: -64px;
    }
}
.oc2 > .owl-theme .owl-controls .owl-page span {
    background-color:  #fff;
}
.oc2 > .owl-controls .owl-page span{
    background-color:  #fff !important;
}
p{
	margin-bottom:0.5rem;
}
.nav-item a {
    font-size: 1.1rem;
}
.back_arrow_top {
    position: absolute;
    top: 18%;
    right: 5%;
    color: #FF7700;
}