@media only screen and (min-width: 1430px) {
    .container {
        max-width: 1290px;
    }
}

@media only screen and (min-width: 1600px) {
    .container {
        max-width: 1440px;
    }
}

@media only screen and (min-width: 1800px) {
    .container {
        max-width: 1440px;
    }
}

@media only screen and (max-width: 1599px) {}

@media only screen and (max-width: 1429px) {}

@media only screen and (max-width: 1199px) {
    ul.navbar-nav.ml-auto a {
        margin-left: 10px;
        font-size: 17px;
    }
    .heroinfo h1 {
        font-size: 58px;
    }
    .heroinfo h1 span {
        font-size: 58px;
    }
    .youneedheading h3 {
        font-size: 43px;
    }
    .youneed h4 {
        font-size: 31px;
    }
    .studenttitle h3 {
        font-size: 43px;
    }
    .areyouready {
        padding-right: 0;
    }
    .areyouready h4 {
        font-size: 43px;
    }
    .teaminfo {
        z-index: 99;
    }
    .teaminfo h5 {
        font-size: 30px;
    }
    .faqtitle h4 {
        font-size: 43px;
    }
}

@media only screen and (max-width: 991px) {
    div#whyesaral {
        display: block;
    }
    .teammaindiv .col-lg-6:first-child {
        order: 1;
    }
    .teammaindiv {
        padding: 0;
        z-index: 999999;
        position: relative;
    }
    .teaminfo {
        padding-top: 110px;
        top: 270px;
    }
    .teamimg img {
        z-index: 9999999;
        bottom: -50px;
    }
    .teamimg {
        text-align: center;
    }
    div#whyesaral {
        margin-bottom: 50px;
    }
    .headermenu {
        position: relative;
        margin-top: 50px;
    }
    div#whyesaral .btngetstarted {
        margin-top: 31px;
        display: block;
    }
    .teamimg:after {
        top: 0;
    }
    .whyesaral .btngetstarted {
        display: none;
    }
    /**********  Responsive Menu Bootstrap **********/
    .navbar-expand-lg>.container {
        padding-left: 15px;
        padding-right: 15px;
    }
    /**  menu  **/
    .toggler {
        width: 50px;
        height: 50px;
        line-height: 50px;
        padding: 0;
        border-radius: 5px;
        background-color: #fff;
        border: 1px solid #7bc00b;
        text-align: center;
        z-index: 99;
        display: block;
        transition: all 0.5s;
        margin-left: 20px;
    }
    .show-menu .toggler {
        width: 40px;
        height: 40px;
        position: fixed;
        top: 20px;
        right: 20px;
        border: none;
    }
    .toggler span {
        position: relative;
        width: 60%;
        height: 2px;
        background-color: #7bc00b;
        display: inline-block;
        vertical-align: top;
        top: 50%;
        -webkit-transform: translateY(-50%);
        -moz-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        -o-transform: translateY(-50%);
        transform: translateY(-50%);
    }
    .toggler span::before,
    .toggler span::after {
        position: absolute;
        content: "";
        width: 100%;
        height: 2px;
        background-color: #7bc00b;
        right: 0;
        transition: all 0.5s;
        animation: openCloseByeSpan 300ms linear forwards;
    }
    .toggler span::before {
        top: -6px;
    }
    .toggler span::after {
        top: 6px;
    }
    .show-menu .toggler span::before,
    .show-menu .toggler span::after {
        left: 0;
        right: 0;
        margin: auto;
        transform: rotate(45deg);
        top: -5px;
    }
    .show-menu .toggler span::after {
        transform: rotate(-45deg);
    }
    .show-menu .toggler span {
        height: 0;
    }
    #navbarNav {
        box-shadow: 0 0px 0 10px #fff inset, 0 0 0 11px #7bc00b inset;
        padding: 60px 20px 15px;
        position: fixed;
        top: 0;
        right: 0;
        display: block !important;
        width: 100% !important;
        text-align: center;
        bottom: 0;
        -webkit-transition: all 0.5s ease 0s;
        -moz-transition: all 0.5s ease 0s;
        -ms-transition: all 0.5s ease 0s;
        -o-transition: all 0.5s ease 0s;
        transition: all 0.5s ease 0s;
        -webkit-transform: translateX(110%);
        -moz-transform: translateX(110%);
        -ms-transform: translateX(110%);
        -o-transform: translateX(110%);
        transform: translateX(110%);
        height: auto !important;
        overflow: auto;
    }
    .show-menu #navbarNav {
        -webkit-transform: translateX(0%);
        -moz-transform: translateX(0%);
        -ms-transform: translateX(0%);
        -o-transform: translateX(0%);
        transform: translateX(0%);
    }
    .show-menu .navbar-toggler {
        position: fixed;
        z-index: 5;
        right: 15px;
        border-radius: 5px;
        padding: 2px;
        top: 15px;
    }
    .show-menu .navbar-toggler-icon {
        background-image: url("../images/close.svg");
        background-size: 14px auto;
    }
    .navbar-nav .nav-item {
        margin-left: 0;
    }
    .navbar .navbar-nav .nav-link {
        font-size: 18px;
        padding: 10px 10px;
        margin: 0;
        line-height: 1.2;
    }
    .navbar-nav .nav-link:hover {
        color: #7bc00b;
    }
    .navbar-nav .active .nav-link {
        color: #7bc00b;
        font-weight: bold;
    }
    .navbar-nav .nav-item .dropdown-item {
        text-align: center;
        padding: 10px 10px;
    }
    .navbar-nav .dropdown-menu {
        margin: 0;
        padding: 0;
        border-radius: 0;
    }
    /**  Menu  **/
    /**********  Responsive Menu  **********/
    section.hero {
        height: auto;
        margin-top: 111px;
    }
    a.navbar-brand {
        width: 170px;
    }
    section.hero {}
    .heroinfo span {
        font-size: 40px;
    }
    .heroinfo h1 {
        font-size: 50px;
        margin-bottom: 20px;
    }
    .heroinfo h1 span {
        font-size: 50px;
    }
    .heroinfo {
        margin-bottom: 40px;
    }
    section.whyesaral {
        padding-top: 0;
    }
    .esaraltitle h3 {
        font-size: 40px;
    }
    .youneedheading h3 {
        font-size: 40px;
    }
    .youneedheading h3 img {
        width: 120px;
    }
    section.youneed .col-lg-3 {
        max-width: 25%;
    }
    .youneed h4 {
        font-size: 28px;
        margin: 0;
    }
    .youneed p {
        font-size: 20px;
    }
    .studenttitle h3 {
        font-size: 40px;
    }
    .studenttext p:before {
        right: 0;
    }
    .studenttext p:after {
        left: 0;
    }
    .areyouready {
        padding-left: 0;
        text-align: center;
    }
    .areyouready h4 {
        text-align: center;
        font-size: 40px;
        margin-bottom: 10px;
    }
    .areyouready p {
        text-align: center;
        font-size: 20px;
        margin-bottom: 30px;
    }
    .areyouready .btngetstarted {
        text-align: center !important;
    }
    section.team {
        padding-bottom: 210px;
    }
    .faqtitle h4 {
        font-size: 40px;
    }
    #main #faq .card .card-header .btn-header-link {
        font-size: 20px;
    }
    #main #faq .card .card-header .btn-header-link.collapsed {
        font-size: 20px;
    }
    .card-body {
        font-size: 20px;
    }
    footer .col-lg-5 {
        max-width: 40%;
    }
    footer .col-lg-7 {
        max-width: 60%;
    }
    .course {
        padding: 0;
        margin-top: 40px;
    }
    div#navbarNav {
        display: block !important;
    }
    ul.headerbtns {
        justify-content: center;
    }
    /* Icon 1 */
    #nav-icon1,
    #nav-icon2,
    #nav-icon3,
    #nav-icon4 {
        width: 30px;
        height: 30px;
        position: relative;
        /* margin: 50px auto; */
        -webkit-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        transform: rotate(0deg);
        -webkit-transition: .5s ease-in-out;
        -o-transition: .5s ease-in-out;
        transition: .5s ease-in-out;
        cursor: pointer;
        z-index: 999;
    }
    #nav-icon1 span,
    #nav-icon3 span,
    #nav-icon4 span {
        display: block;
        position: absolute;
        height: 2px;
        width: 100%;
        background: #070707;
        border-radius: 9px;
        opacity: 1;
        left: 0;
        -webkit-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        transform: rotate(0deg);
        -webkit-transition: .25s ease-in-out;
        -o-transition: .25s ease-in-out;
        transition: .25s ease-in-out;
    }
    /* Icon 4 */
    #nav-icon4 span:nth-child(1) {
        top: 0px;
        -webkit-transform-origin: left center;
        -ms-transform-origin: left center;
        transform-origin: left center;
    }
    #nav-icon4 span:nth-child(2) {
        top: 12px;
        -webkit-transform-origin: left center;
        -ms-transform-origin: left center;
        transform-origin: left center;
        width: 75%;
        right: 0;
        left: unset;
    }
    #nav-icon4 span:nth-child(3) {
        top: 24px;
        -webkit-transform-origin: left center;
        -ms-transform-origin: left center;
        transform-origin: left center;
    }
    #nav-icon4.open span:nth-child(1) {
        -webkit-transform: rotate(45deg);
        -ms-transform: rotate(45deg);
        transform: rotate(45deg);
        top: 0px;
        left: 0px;
        width: 30px !important;
    }
    #nav-icon4.open span:nth-child(2) {
        width: 0%;
        opacity: 0;
    }
    #nav-icon4.open span:nth-child(3) {
        -webkit-transform: rotate(-45deg);
        -ms-transform: rotate(-45deg);
        transform: rotate(-45deg);
        top: 21px;
        left: 0px;
        width: 30px;
    }
    button.navbar-toggler {
        position: absolute;
        right: 28px;
        top: 28px;
        padding: 0;
    }
    button.navbar-toggler {
        right: 15px !important;
        top: 28px !important;
    }
    nav.navbar.navbar-expand-lg {
        padding-top: 8px;
        padding-bottom: 0px;
    }
}

@media only screen and (max-width: 767px) {
    ul.headerbtns a {
        margin-left: 010px;
        width: 61px;
    }
    a.navbar-brand {
        width: 149px;
    }
    section.hero {
        margin-top: 80px;
    }
    .heroinfo span {
        font-size: 30px;
    }
    .heroinfo h1 {
        font-size: 40px;
        margin: 0;
        line-height: 40px !important;
    }
    .heroinfo h1 span {
        font-size: 40px;
        line-height: 60px;
    }
    .enroll a {
        width: 200px;
        height: 50px;
        font-size: 20px;
    }
    .esaraltitle h3 {
        font-size: 30px;
    }
    .whyesaraldetail h5 {
        font-size: 20px;
    }
    .whyesaraldetail p {
        font-size: 16px;
    }
    .whyesaraldetail img {
        max-width: 250px;
    }
    .btngetstarted a {
        font-size: 20px;
        width: 200px;
        height: 50px;
    }
    .youneedheading h3 {
        font-size: 30px;
    }
    section.youneed {
        padding-top: 0;
    }
    .youneedheading h3 img {
        width: 83px;
    }
    section.youneed .col-lg-3 {
        max-width: 50%;
        margin-bottom: 40px;
    }
    section.youneed .btngetstarted {
        margin-top: 40px;
    }
    .studenttitle h3 {
        font-size: 30px;
    }
    .teaminfo h5 {
        font-size: 24px;
    }
    .teaminfo p {
        font-size: 20px;
    }
    .areyouready h4 {
        font-size: 30px;
    }
    .teammaindiv {
        /* padding: 0 50px; */
    }
    .faqtitle h4 {
        font-size: 30px;
    }
    .copright {
        display: block;
        text-align: center;
    }
}

@media only screen and (max-width: 575px) {
    .teaminfo {
        padding-top: 30px;
    }
    footer .col-lg-5 {
        max-width: 100%;
    }
    footer .col-lg-7 {
        max-width: 100%;
    }
    .dowapp h4 {
        margin-bottom: 30px;
    }
    .contactinfo {
        margin-bottom: 30px;
    }
    .mailsubmit {
        padding: 12px;
    }
    .youneed h4 {
        font-size: 24px;
        line-height: 40px;
    }
    .youneed p {
        font-size: 18px;
    }
    .areyouready h4 {
        font-size: 24px;
        margin: 0;
    }
    .areyouready {
        /* margin-top: 200px; */
        padding-left: 10px;
        padding-right: 10px;
        padding: 20px;
    }
}

@media only screen and (max-width: 479px) {
    section.hero {
        margin-top: 50px;
        padding-bottom: 40px;
    }
    .heroinfo a {
        width: 61px;
    }
    .heroinfo a img {
        width: 91px;
    }
    nav.navbar.navbar-expand-lg {
        padding-left: 0;
        padding-right: 0;
    }
    .studentname {
        margin-bottom: 20px;
    }
    .whyesaraldetail h5 {
        font-size: 16px;
    }
    .whyesaraldetail p {
        font-size: 14px;
    }
    div#whyesaral .btngetstarted {
        margin-top: 20px;
    }
    .whyesaraldetail {
        margin-bottom: 0;
    }
    .items {
        padding: 0;
    }
    section.students {
        padding-bottom: 0;
    }
    section.faq {
        padding-top: 90px;
    }
    .course h4 {
        font-size: 12px;
        margin-bottom: 10px !IMPORTANT;
    }
    .studymetrial li a {
        font-size: 12px;
    }
    .copright p {
        font-size: 12px;
    }
    .copright a {
        font-size: 12px;
    }
    ul.contact span {
        font-size: 12px;
    }
    .location p {
        font-size: 12;
        font-size: 12px;
    }
    .contactinfo h3 {
        font-size: 12px;
        margin-bottom: 10px;
    }
    #nav-icon4 span:nth-child(2) {
        top: 8px;
    }
    #nav-icon4 span:nth-child(3) {
        top: 16px;
    }
    button.navbar-toggler {
        top: 15px !important;
    }
    .show-menu .navbar-toggler {
        top: 25px !important;
    }
    .heroinfo span {
        /* font-size: 25px; */
        font-size: 32px;
    }
    .heroinfo h1 {
        font-size: 40px;
        line-height: 30px !important;
        margin-bottom: 20px;
    }
    .heroinfo h1 span {
        font-size: 40px;
        line-height: 30px !important;
    }
    .heroinfo p {
        font-size: 12px;
    }
    .accesstitle {
        padding: 15px;
    }
    .accesstitle h5 {
        font-size: 16px;
        line-height: 28px;
    }
    .studentdetail {
        padding: 17px 12px;
    }
    .studentdetail span {
        font-size: 16px;
    }
    .enroll a {
        font-size: 18px;
        height: 40px;
        width: 150px;
    }
    .esaraltitle h3 {
        font-size: 32px;
    }
    .btngetstarted a {
        font-size: 16px;
        width: 140px;
        height: 40px;
    }
    .youneedheading h3 {
        font-size: 32px;
        display: block;
        margin-bottom: 35px !important;
    }
    .youneedheading h3 img {
        width: 123px;
    }
    .youneed h4 {
        font-size: 32px;
        line-height: 30px;
    }
    .youneed p {
        font-size: 16px;
    }
    section.youneed .btngetstarted {
        margin-top: 0;
    }
    .studenttitle h3 {
        font-size: 24px;
    }
    section.youneed {
        padding-bottom: 40px;
    }
    .studentinfo td {
        font-size: 18px;
    }
    .studentedu h4 {
        font-size: 20px;
        margin-bottom: 3px;
    }
    .studentedu p {
        font-size: 12px;
    }
    .studenttext p {
        font-size: 16px;
    }
    .studenttext p:before {
        width: 60px;
        height: 40px;
        background-size: contain;
        bottom: -22px;
    }
    .studenttext p:after {
        width: 60px;
        height: 40px;
        background-size: contain;
    }
    .teammaindiv {
        padding: 0;
    }
    .teaminfo {
        padding: 25px;
        top: 150px;
        padding-top: 86px;
    }
    .teaminfo h5 {
        font-size: 24px;
        line-height: 36px;
    }
    .teaminfo p {
        font-size: 18px;
    }
    .areyouready h4 {
        font-size: 32px;
        line-height: 40px;
        margin-bottom: 21px;
    }
    .areyouready p {
        font-size: 16px;
        margin-bottom: 20px;
    }
    .faqtitle h4 {
        font-size: 32px;
        text-align: center;
    }
    div#main {
        margin-top: 20px;
    }
    #main #faq .card .card-header .btn-header-link {
        font-size: 16px;
        padding: 10px;
    }
    .card-body {
        font-size: 16px;
        padding-left: 20px;
    }
    #main #faq .card .card-header .btn-header-link.collapsed {
        font-size: 16px;
    }
    .course {
        margin-top: 0px;
    }
    .contactinfo {
        margin-bottom: 14px;
    }
    a.navbar-brand {
        width: 100px;
    }
    ul.coursedetail li a {
        font-size: 12px;
    }
    ul.contact a {
        font-size: 12px;
    }
    ul.headerbtns a {
        margin: 0 10px;
    }
    div#navbarNav {
        padding-top: 60px;
    }
    input#searchbox {
        max-width: 90%;
        font-size: 20px;
    }
    section.hero {
        margin-top: 50px;
    }
}

@media only screen and (max-width: 349px) {
    .youneedheading h3 {
        font-size: 20px;
    }
    .studenttitle h3 {
        font-size: 20px;
    }
    .faqtitle h4 {
        font-size: 20px;
    }
}