.btn:focus, .btn:active {
    outline: none !important;
    -webkit-box-shadow: none !important;
            box-shadow: none !important;
  }

/*mobile first (1px and up)*/                        
@media (min-width: 0px) {
    *{
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
    }

    body{
        background-color: #FFFFFF;
        color: #555555;
        font-family: 'Poppins', 'Arial', sans-serif;
        font-weight: normal;
        font-size: 16px;
        line-height: 22px;
        text-rendering: optimizeLegibility;
        padding: 0;
        margin: 0;
    }


    /*----------------------- Header css starts ----------------------*/
    header{
        position: relative;
        top: 0;
        left: 0;
    }


    /*----------------------- Navbar css starts ----------------------*/
    nav {
        background-color: transparent;
        color: #FFFFFF;
        z-index: 99;
    }

    /* unvisited link */
    a:link {
        color: black;
        text-decoration: none;
    }
    
    /* visited link */
    a:visited {
        color: black;
        text-decoration: none;

    }
    
    /* mouse over link */
    a:hover {
        color: black;
        text-decoration: none;

    }
    
    /* selected link */
    a:active {
        color: black;
        text-decoration: none;

    }

    .bg-dark{
        background-color: #1d334a !important;
        opacity: 0.9;
    }

    nav .navbar-brand{
        width: 100px;
        height: auto;
    }

    .navbar-toggler.btn-collapse{
        border: 2px solid #183451;
    }

    .navbar-toggler-chg{
        border: 2px solid #FFFFFF !important;
    }

    .collapse-bg {
        background-color: #3C6D9C;
    }

    .badge {
        background-color: #FFFFFF;
    }

    nav .nav-item .navLink {
        font: normal normal bold 14px/21px poppins;
        letter-spacing: 0;
    }

    .navbar-light .navbar-nav .nav-link {
        color: #FFFFFF;
    }

    .navbar-light .navbar-nav .nav-link:hover, .navbar-light .navbar-nav .nav-link:visited, .navbar-light .navbar-nav .nav-link:active {
        color: #FFFFFF;
    }

    .navbar-light .navbar-nav .nav-link::after {
        content: '';
        display: block;
        width: 0;
        height: 2px;
        margin-top: 3px;
        /* background: #355C83; */
        background: #FFFFFF;
        -webkit-transition: width .3s;
        -o-transition: width .3s;
        transition: width .3s;
    }
    
    .navbar-light .navbar-nav .nav-link:hover::after{
        width: 20%;
        -webkit-transition: width .3s;
        -o-transition: width .3s;
        transition: width .3s;
    }
    
    .navbar-light .navbar-nav .nav-link.active::after {
        content: '';
        display: block;
        width: 100%;
        height: 2px;
        margin-top: 3px;
        background: #355C83;
        -webkit-transition: width .3s;
        -o-transition: width .3s;
        transition: width .3s;
    }

    nav .searchBar{
        border: #FFFFFF;
    }

    nav .form-inline .form-control {
        display: inline-block;
        width: auto;
        vertical-align: middle;
        background-color: transparent;
        border: 1px solid white;
        border-radius: 6px;
        outline: none;
    }

    nav .searchBar::-webkit-input-placeholder {
        color: #FFFFFF;
    }

    nav .searchBar::-moz-placeholder {
        color: #FFFFFF;
    }

    nav .searchBar:-ms-input-placeholder {
        color: #FFFFFF;
    }

    nav .searchBar::-ms-input-placeholder {
        color: #FFFFFF;
    }

    nav .searchBar::placeholder {
        color: #FFFFFF;
    }

    nav .userImg{
        width: 30px;
        height: auto;
        /* margin-left: 30px; */
        vertical-align: middle;
        padding-top: 0px;
    }

    #user{
        color: white !important;
        margin-left: 7px;
        font: normal normal bold 14px/21px poppins;
        letter-spacing: 0;
        padding-top: 5px;
    }

    nav #logout{
        width: 120px;
        margin: 5px 0px;
    }

    .dshb{
        font: normal normal bold 14px/21px poppins;
        letter-spacing: 0;
        padding-top: 5px;
    }

    nav .btn.btn-primary{
        background-color: #3C6D9C;
        text-transform: capitalize;
        border: 1px solid #5f7284;
        border-radius: 7px;
        transition: transform 0.5s, opacity 0.5s;
    }

    nav .btn.btn-primary.shadow-lg {
        box-shadow: 0 1rem 3rem #0c2238!important;
    }

    nav .btn.btn.btn-primary:hover{
        animation: loginBtn-hover 2s ease-in -1s;
    }

    nav .btn.btn.btn-primary:focus{
        animation: loginBtn-focus 2s ease-in -1s;
    }


    @keyframes loginBtn-hover {
        0%   {
            background-color: #3C6D9C;
        }
        50%  {
            background-color: #5d86ac;
            border: 1px solid #8fa0b0;
            transform: scale(1.02);
        }
        75%  {
            background-color: #5d86ac;
            border: 1px solid #5f7284;
            transform: scale(1.05);
        }
        100% {
            background-color: #3C6D9C;
            border: 1px solid #5f7284;
            transform: scale(1.0);
        }
    }

    @keyframes loginBtn-focus {
        0%   {
            background-color: #3C6D9C;
        }
        50%  {
            background-color: #26547e;
            border: 1px solid #8fa0b0;
            transform: scale(1.02);
        }
        75%  {
            background-color: #091f34;
            border: 1px solid #5f7284;
            transform: scale(1.05);
        }
        100% {
            background-color: #3C6D9C;
            border: 1px solid #5f7284;
            transform: scale(1.0);
        }
    }



    /*----------------------- hero-section css starts -----------------------*/
    #hero-section-div{
        position: relative;
        width: 100%;
        height:calc(100vh - 0px);
        overflow: hidden;
        padding: 0;
        top: 0;
    }

    #hero-section-writeup{
        position: relative;
        top: 0;
        left: 0;
        height:calc(100vh - 0px);
        background-color: #3C6D9C;
        overflow: hidden;
        /* z-index: 99; */
    }

    .bg-image {
        position:absolute;
        left:0;
        right:0;
        top:0;
        bottom:0;
        background: black;
        overflow: hidden;
        background-image: linear-gradient(180deg, rgb(69, 78, 105,1), rgba(133, 130, 130, 0)), url("/Content/images/newindex/heroImage1.png");
        /* background: -webkit-linear-gradient(180deg, #080003cc 39%, #080003cc 70%), url("/Content/images/newindex/heroImage1.png");
        background: linear-gradient(180deg, #080003cc 39%, #080003cc 70%), url("/Content/images/newindex/heroImage1.png"); */
        /* background: -webkit-linear-gradient(180deg, #b3b3b3 50%, #335770 94%), url("/Content/images/newindex/Online-Learning2.png");
        background: linear-gradient(180deg, #b3b3b3 50%, #335770 94%), url("/Content/images/newindex/Online-Learning2.png"); */

        /* background-image: url("/Content/images/lforschools/slider.png"); */
        /* background-image: url("/Content/images/newindex/Online-Learning2.png"); */
        background-position: top center;
        /* background-size: cover; */
        /* background-attachment:fixed; */
        /* background-repeat: no-repeat; */
    }

    /* header {
        height: 600px;
        width: 100vw;
        background: black;
        overflow: hidden;
        background: #C33764; 
        background: -webkit-linear-gradient(rgba(29, 38, 113, 0.8), rgba(195, 55, 100, 0.8)), url("https://bit.ly/2rlzaXi");
        background: linear-gradient(rgba(29, 38, 113, 0.8), rgba(195, 55, 100, 0.8)), url("https://bit.ly/2rlzaXi"); 
    } */
    
    img {
       object-fit: cover;
    }

    
    .bg-image .hero-image-contents{
        position: relative;
        top: 160px;
        left: 22px;
        padding-right: 30px;
        height: 599px;
        /* height:calc(100vh - 90vh); */
        overflow: hidden;
        z-index: 99;
    }


    #hero-section-writeup .hero-image-contents{
        position: relative;
        top: 250px;
        left: 22px;
        padding-right: 30px;
        height: 599px;
        /* height:calc(100vh - 90vh); */
        overflow: hidden;
        z-index: 99;
    }

    header .display-4{
        font-size: 2.0rem;
        font-weight: 600;
        line-height: 1.4;
    }
    
    .hero-image-contents h1{
        letter-spacing: 1px;
        color: #FFFFFF;
    }

    .hero-image-contents p{
        font-size: 0.9rem;
        line-height: 160%;
        word-spacing: 1px;
        padding-bottom: 10px;
        color: #13508c;
    }

    .hero-image-contents .btn.btn-primary{
        background-color: transparent;
        color: #FFFFFF;
        text-transform: capitalize;
        border: 1px solid #FFFFFF;
        border-radius: 20px;
        transition: transform 0.5s, opacity 0.5s;
    }

    .hero-image-contents .btn.btn-primary.shadow-lg {
        box-shadow: 0 1rem 3rem #0c2238!important;
    }

    #hero-section-writeup .hero-image-contents .btn.btn-primary.shadow-lg {
        box-shadow: 0 1rem 3rem #3a8ada!important;
    }

    .hero-image-contents .btn.btn.btn-primary:hover{
        animation: signupBtn-hover 2s ease-in -1s;
    }

    .hero-image-contents .btn.btn.btn-primary:focus{
        animation: signupBtn-focus 2s ease-in -1s;
    }


    @keyframes signupBtn-hover {
        0%   {
            background-color: #3C6D9C;
        }
        50%  {
            background-color: #5d86ac;
            border: 1px solid #8fa0b0;
            transform: scale(1.02);
        }
        75%  {
            background-color: #5d86ac;
            border: 1px solid #5f7284;
            transform: scale(1.05);
        }
        100% {
            background-color: #3C6D9C;
            border: 1px solid #5f7284;
            transform: scale(1.0);
        }
    }

    @keyframes signupBtn-focus {
        0%   {
            background-color: #3C6D9C;
        }
        50%  {
            background-color: #26547e;
            border: 1px solid #8fa0b0;
            transform: scale(1.02);
        }
        75%  {
            background-color: #091f34;
            border: 1px solid #5f7284;
            transform: scale(1.05);
        }
        100% {
            background-color: #3C6D9C;
            border: 1px solid #5f7284;
            transform: scale(1.0);
        }
    }


      /*----------------------- About-us css starts ----------------------*/
      .about-us{
        position: relative;
        top: 0;
        left: 0;
        margin-top: 50px;
    }

    .about-us .about-us-heading{
        color: #222222;
        font-size: 25px;
        line-height: 170%;
        word-spacing: 2px;
    }

    .about-us .font-weight-bold{
        font-weight: bold;
        color: #222222;
        font-size: 30px;
    }

    .about-us .write-up{
        color: #1f1e1e;
        line-height: 200%;
        word-spacing: 1px;
        /* font-size: 18px; */
        /* text-shadow: 0 0 #9c9898cc; */
    }

    .about-us .mdc-button:not(:disabled) {
        background-color: #355C83;
        text-transform: capitalize;
    }

    .about-us .btn.btn-primary{
        background-color: #355C83;
        color: #FFFFFF;
        border: 2px solid transparent;
        border-radius: 15px;
        text-transform: capitalize;
    }

    .about-us-video-div{
        position: relative;
        top: 0;
        left: 0;
        margin-bottom: 430px;
    }

    .about-us .about-us-video{
        position: absolute;
        left: 0;
        right: 0;
        top: 0;
        bottom: 0;
        background-image: url(/Content/images/lforschools/luminate-icon.png);
        background-position: top center;
        /* background-size: contain; */
        /* background-attachment: fixed; */
        /* background-repeat: no-repeat; */
        width: 100%;
        height: 531px;
    }

    .about-us iframe{
        position: relative;
        top: 131px;
        left: 10px;
        /* right: 10px; */
        width: 95%;
        height: 280px;
        -webkit-box-shadow: 3px 0px 10px #000000;
                box-shadow: 3px 0px 10px #000000;
        cursor: pointer;
    }

    .about-us .btn.btn-primary{
        background-color: transparent;
        color: #FFFFFF;
        text-transform: capitalize;
        border: 1px solid #3C6D9C;
        background-color: #3C6D9C;
        border-radius: 20px;
        transition: transform 0.5s, opacity 0.5s;
    }

    .about-us .btn.btn-primary.shadow-lg {
        box-shadow: 0 1rem 3rem #616264!important;
    }


    .about-us .btn.btn.btn-primary:hover{
        animation: knowMoreBtn-hover 2s ease-in -1s;
    }

    .about-us .btn.btn.btn-primary:focus{
        animation: knowMoreBtn-focus 2s ease-in -1s;
    }


    @keyframes knowMoreBtn-hover {
        0%   {
            background-color: #3C6D9C;
        }
        50%  {
            background-color: #5d86ac;
            border: 1px solid #8fa0b0;
            transform: scale(1.02);
        }
        75%  {
            background-color: #5d86ac;
            border: 1px solid #5f7284;
            transform: scale(1.05);
        }
        100% {
            background-color: #3C6D9C;
            border: 1px solid #5f7284;
            transform: scale(1.0);
        }
    }

    @keyframes knowMoreBtn-focus {
        0%   {
            background-color: #3C6D9C;
        }
        50%  {
            background-color: #26547e;
            border: 1px solid #8fa0b0;
            transform: scale(1.02);
        }
        75%  {
            background-color: #091f34;
            border: 1px solid #5f7284;
            transform: scale(1.05);
        }
        100% {
            background-color: #3C6D9C;
            border: 1px solid #5f7284;
            transform: scale(1.0);
        }
    }


    /*----------------------- Offers css starts ----------------------*/
    .offers{
        margin-top: 180px;
        background-color: #3C6D9C;
        color: #FFFFFF;
        /* height: 500px; */

    }



    .offersWriteup .title{
        font-size: 2.0rem;
        line-height: 1.7;
        margin-bottom: 3px;
    }

    .offersWriteup img{
        width: 62px;
        height: 15px;
        margin-top: 6px;
    }


    .offersWriteup .btn.btn-primary{
        background-color: transparent;
        color: #FFFFFF;
        text-transform: capitalize;
        border: 1px solid #FFFFFF;
        background-color: #3C6D9C;
        border-radius: 8px;
        transition: transform 0.5s, opacity 0.5s;
    }

    .offersWriteup  .btn.btn-primary.shadow-lg {
        box-shadow: 0 1rem 3rem #616264!important;
    }


    .offersWriteup  .btn.btn.btn-primary:hover{
        animation: knowMoreBtn-hover 2s ease-in -1s;
    }

    .offersWriteup  .btn.btn.btn-primary:focus{
        animation: knowMoreBtn-focus 2s ease-in -1s;
    }

    .offersWriteup .btn.btn-primary.shadow-lg {
        box-shadow: 0 1rem 3rem #3a8ada!important;
    }


    @keyframes knowMoreBtn-hover {
        0%   {
            background-color: #3C6D9C;
        }
        50%  {
            background-color: #5d86ac;
            border: 1px solid #8fa0b0;
            transform: scale(1.02);
        }
        75%  {
            background-color: #5d86ac;
            border: 1px solid #5f7284;
            transform: scale(1.05);
        }
        100% {
            background-color: #3C6D9C;
            border: 1px solid #5f7284;
            transform: scale(1.0);
        }
    }

    @keyframes knowMoreBtn-focus {
        0%   {
            background-color: #3C6D9C;
        }
        50%  {
            background-color: #26547e;
            border: 1px solid #8fa0b0;
            transform: scale(1.02);
        }
        75%  {
            background-color: #091f34;
            border: 1px solid #5f7284;
            transform: scale(1.05);
        }
        100% {
            background-color: #3C6D9C;
            border: 1px solid #5f7284;
            transform: scale(1.0);
        }
    }


    /*----------------------- Courses css starts ----------------------*/
    #courses{
        margin-top: 60px;
    }
    /*spinner*/
    .lds-roller {
        display: inline-block;
        position: relative;
        width: 80px;
        height: 80px;
        margin: auto;
        padding-bottom: 100px;
      }
      .lds-roller div {
        animation: lds-roller 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
        transform-origin: 40px 40px;
      }
      .lds-roller div:after {
        content: " ";
        display: block;
        position: absolute;
        width: 7px;
        height: 7px;
        border-radius: 50%;
        background: black;
        margin: -4px 0 0 -4px;
      }
      .lds-roller div:nth-child(1) {
        animation-delay: -0.036s;
      }
      .lds-roller div:nth-child(1):after {
        top: 63px;
        left: 63px;
      }
      .lds-roller div:nth-child(2) {
        animation-delay: -0.072s;
      }
      .lds-roller div:nth-child(2):after {
        top: 68px;
        left: 56px;
      }
      .lds-roller div:nth-child(3) {
        animation-delay: -0.108s;
      }
      .lds-roller div:nth-child(3):after {
        top: 71px;
        left: 48px;
      }
      .lds-roller div:nth-child(4) {
        animation-delay: -0.144s;
      }
      .lds-roller div:nth-child(4):after {
        top: 72px;
        left: 40px;
      }
      .lds-roller div:nth-child(5) {
        animation-delay: -0.18s;
      }
      .lds-roller div:nth-child(5):after {
        top: 71px;
        left: 32px;
      }
      .lds-roller div:nth-child(6) {
        animation-delay: -0.216s;
      }
      .lds-roller div:nth-child(6):after {
        top: 68px;
        left: 24px;
      }
      .lds-roller div:nth-child(7) {
        animation-delay: -0.252s;
      }
      .lds-roller div:nth-child(7):after {
        top: 63px;
        left: 17px;
      }
      .lds-roller div:nth-child(8) {
        animation-delay: -0.288s;
      }
      .lds-roller div:nth-child(8):after {
        top: 56px;
        left: 12px;
      }
      @keyframes lds-roller {
        0% {
          transform: rotate(0deg);
        }
        100% {
          transform: rotate(360deg);
        }
      }
    /* spinner ends */  
    

    #courses .title{
        line-height: 1.4;
        margin-bottom: 50px;
        color: #222222;
    }

    #courses .card{
        overflow: hidden;
        width: 17rem;
        margin: auto;
        height: 27rem;
        cursor: pointer;
    }

    #courses .card:hover{
        animation: courseCard-hover 2s linear;
    }

    #courses .card-img-top {
        border-top-left-radius: calc(.25rem - 1px);
        border-top-right-radius: calc(.25rem - 1px);
        height: 200px;
        /* max-height: 200px;
        min-height: 150px; */
    }

    #courses .card-user-img{
        height: 64px;
        width: 64px;
    }

    #courses .topic{
        line-height: 1.4;
        margin-bottom: 20px;
        margin-bottom: 20px;
        color: #222222;;
    }

    #courses .tag{
        padding-left: 264px;
    }

    #courses .badge-warning {
        color: #212529;
        background-color: #ffc107;
        padding-left: 28px;
        padding-right: 25px;
        padding-top: 10px;
        padding-bottom: 10px;
        border-radius: 60px;
    }

    #courses .btn.btn-primary{
        background-color: transparent;
        color: #FFFFFF;
        text-transform: capitalize;
        border: 1px solid #FFFFFF;
        background-color: #3C6D9C;
        border-radius: 8px;
        transition: transform 0.5s, opacity 0.5s;
    }

    /* #loadMore{
        display: none;
    } */

    #courses  .btn.btn-primary.shadow-lg {
        box-shadow: 0 1rem 3rem #616264!important;
    }


    #courses  .btn.btn.btn-primary:hover{
        animation: loadMoreBtn-hover 2s ease-in -1s;
    }

    #courses  .btn.btn.btn-primary:focus{
        animation: loadMoreBtn-focus 2s ease-in -1s;
    }
/* 
    #courses .btn.btn-primary.shadow-lg {
        box-shadow: 0 1rem 3rem #3a8ada!important;
    } */


    @keyframes loadMoreBtn-hover {
        0%   {
            background-color: #3C6D9C;
        }
        50%  {
            background-color: #5d86ac;
            border: 1px solid #8fa0b0;
            transform: scale(1.02);
        }
        75%  {
            background-color: #5d86ac;
            border: 1px solid #5f7284;
            transform: scale(1.05);
        }
        100% {
            background-color: #3C6D9C;
            border: 1px solid #5f7284;
            transform: scale(1.0);
        }
    }

    @keyframes loadMoreBtn-focus {
        0%   {
            background-color: #3C6D9C;
        }
        50%  {
            background-color: #26547e;
            border: 1px solid #8fa0b0;
            transform: scale(1.02);
        }
        75%  {
            background-color: #091f34;
            border: 1px solid #5f7284;
            transform: scale(1.05);
        }
        100% {
            background-color: #3C6D9C;
            border: 1px solid #5f7284;
            transform: scale(1.0);
        }
    }

    @keyframes courseCard-hover {
        0%   {
            transform: scale(1.0);
        }
        /* 10%  {
            transform: scale(1.03);
            box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
        } */
        25%  {
            transform: scale(1.03);
            box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
        }
        /* 30%  {
            transform: scale(1.05);
            box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
        } */
        50%  {
            transform: scale(1.06);
            box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
        }
        /* 50%  {
            transform: scale(1.05);
            box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
        } */
        60%  {
            transform: scale(1.03);
            box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
        }
        /* 70%  {
            transform: scale(1.03);
            box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
        } */
        80%  {
            transform: scale(1.01);
            box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
        }
        90%  {
            transform: scale(0.9);
            box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
        }
        100% {
            transform: scale(1.0);
        }
    }


    /*----------------------- Offer2 css starts ----------------------*/

    #offers2{
        margin-top: 30px;
    }
    
    #offers2 .title{
        line-height: 1.4;
        margin-bottom: 50px;
        color: #222222;
    }

    #offers2 .card {
        overflow: hidden;
        width: 20rem;
        margin: auto;
        height: 27rem;
    }

    #offers2 .card:hover{
        animation: courseCard-hover 2s linear;
    }
    
    
   


            /*----------------------- footer css starts ----------------------*/
            footer .footer-headings{
                color: #101C21;
                font-size: 17px;
                font-weight: 700;
                line-height: 170%;
            }
    
            footer .nav-item a{
                color: #777777;
                font-size: 14px;
                line-height: 160%;
            }
            
            footer .socials li.facebook{
                display: -ms-grid;
                display: grid;
                -webkit-box-pack: center;
                    -ms-flex-pack: center;
                        justify-content: center;
                -ms-flex-line-pack: center;
                    align-content: center;
                text-align: center;
                width: 50px;
                height: 50px;
                border-radius: 50%;
                background: transparent -o-linear-gradient(45deg, #6362D7 0%, #FF8FE2 100%) 0% 0% no-repeat padding-box;
                background: transparent linear-gradient(45deg, #6362D7 0%, #FF8FE2 100%) 0% 0% no-repeat padding-box;
                /* padding-top: 20px; */
                /* font-weight: 600; */
                border: 1px solid transparent;
                -webkit-transition: all .3s ease;
                -o-transition: all .3s ease;
                transition: all .3s ease;            
            }
    
            footer .socials li.linkedin{
                display: -ms-grid;
                display: grid;
                -webkit-box-pack: center;
                    -ms-flex-pack: center;
                        justify-content: center;
                -ms-flex-line-pack: center;
                    align-content: center;
                text-align: center;
                width: 50px;
                height: 50px;
                border-radius: 50%;
                background: transparent -webkit-gradient(linear, left top, right top, from(#FF9AB6), color-stop(99%, #F03295), to(#F03295)) 0% 0% no-repeat padding-box;
                background: transparent -o-linear-gradient(left, #FF9AB6 0%, #F03295 99%, #F03295 100%) 0% 0% no-repeat padding-box;
                background: transparent linear-gradient(90deg, #FF9AB6 0%, #F03295 99%, #F03295 100%) 0% 0% no-repeat padding-box;            /* padding-top: 20px; */
                /* font-weight: 600; */
                border: 1px solid transparent;
                -webkit-transition: all .3s ease;
                -o-transition: all .3s ease;
                transition: all .3s ease;            
            }
    
            footer .socials li.instagram{
                display: -ms-grid;
                display: grid;
                -webkit-box-pack: center;
                    -ms-flex-pack: center;
                        justify-content: center;
                -ms-flex-line-pack: center;
                    align-content: center;
                text-align: center;
                width: 50px;
                height: 50px;
                border-radius: 50%;
                background: transparent -o-linear-gradient(43deg, #F09376 0%, #F0DB79 100%) 0% 0% no-repeat padding-box;
                background: transparent linear-gradient(47deg, #F09376 0%, #F0DB79 100%) 0% 0% no-repeat padding-box;
                /* font-weight: 600; */
                border: 1px solid transparent;
                -webkit-transition: all .3s ease;
                -o-transition: all .3s ease;
                transition: all .3s ease;            
            }
    
            footer .footer-down{
                margin-top: 20px;
                background: transparent -o-linear-gradient(86deg, #FFFFFF 0%, #DFF0FF 100%) 0% 0% no-repeat padding-box;
                background: transparent linear-gradient(4deg, #FFFFFF 0%, #DFF0FF 100%) 0% 0% no-repeat padding-box;
                -webkit-clip-path: polygon(0 30%, 100% 0%, 100% 100%, 0 100%);
                        clip-path: polygon(0 30%, 100% 0%, 100% 100%, 0 100%);
            }
    
            .cutimg{
                padding-top: 50px;
            }
    
            footer .footer-down .yeardate{
                font-size: 13px;
                text-decoration: underline;
                padding-top: 10px;
            }
    
            footer .footer-down .yeardate span{
                color: #000000;
            }
    
            footer .footer-down .yeardate a{
                color: #000000;
            }



/*Small devices (landscape phones, 576px and up)*/
@media (min-width: 576px) {

    /*----------------------- Navbar css starts ----------------------*/
    .badge {
        background-color: red;
    }
}


/* Medium devices (tablets, 768px and up)*/
@media (min-width: 768px) { 

    /*----------------------- Navbar css starts ----------------------*/
    .badge {
        background-color: green;
    }

    
    /*----------------------- hero-section css starts -----------------------*/
    .bg-image {
        position:absolute;
        left:0;
        right:0;
        top:0;
        bottom:0;
        background: black;
        overflow: hidden;
        background-image: url("/Content/images/newindex/heroImage1.png");
        background-position: top center;
        background-size: cover;
    }

    /*----------------------- About-us css starts ----------------------*/
    .about-us .about-us-heading{
        color: #222222;
        font-size: 35px;
        line-height: 170%;
        word-spacing: 2px;
    }

    .about-us .font-weight-bold{
        font-weight: bold;
        color: #222222;
        font-size: 40px;
    }

    .about-us iframe {
        position: relative;
        top: 61px;
        left: 10px;
        /* right: 10px; */
        width: 97%;
        height: 422px;
        -webkit-box-shadow: 3px 0px 10px #000000;
                box-shadow: 3px 0px 10px #000000;
        cursor: pointer;
    }


     /*----------------------- Courses css starts ----------------------*/
    #courses .card{
        overflow: hidden;
        width: 18rem;
        margin: auto;
        height: 27rem;
    }

    #courses .tag {
        padding-left: 280px;
    }

    /*----------------------- Offers2 css starts ----------------------*/
    #offers2 .card{
        overflow: hidden;
        width: 14rem;
        margin: auto;
        height: 30rem;
    }
}


/* Large devices (desktops, 992px and up)*/
@media (min-width: 992px) { 

    /*----------------------- Navbar css starts ----------------------*/
    nav .navbar-brand{
        width: 150px;
        height: auto;
    }

    .navbar-expand-lg .navbar-collapse {
        display: -ms-flexbox!important;
        display: flex!important;
        -ms-flex-preferred-size: auto;
        flex-basis: auto;
        justify-content: space-around;
        margin-top: 10px;
    }

    .badge {
        background-color: blue;
    }

    /* nav .nav-item .reqDemoLink {
        font: normal normal bold 16px/22px poppins;
        letter-spacing: 0;
    } */

    .navbar-light .navbar-nav .nav-link:hover::after{
        width: 100%;
        -webkit-transition: width .3s;
        -o-transition: width .3s;
        transition: width .3s;
    }

    nav .navbar-nav.ml-lg-5 {
        margin-left: 9rem !important;
    }

    nav .userImg{
        width: 30px;
        height: auto;
        margin-left: 30px;
        vertical-align: middle;
        padding-top: 0px;
    }


     /*----------------------- About-us css starts ----------------------*/
     .about-us .about-us-heading{
        color: #222222;
        font-size: 35px;
        line-height: 170%;
        word-spacing: 2px;
    }

    .about-us .font-weight-bold{
        font-weight: bold;
        color: #222222;
        font-size: 40px;
    }

    .write-up-section{
        margin-top: 110px;
    }

    .about-us .write-up{
        color: #1f1e1e;
        line-height: 200%;
        word-spacing: 1px;
        margin-top: 30px;
        margin-bottom: 40px;
        /* font-size: 18px; */
        /* text-shadow: 0 0 #9c9898cc; */
    }

    .about-us iframe {
        position: relative;
        top: 59px;
        left: 40px;
        /* right: 10px; */
        width: 97%;
        height: 422px;
        -webkit-box-shadow: 3px 0px 10px #000000;
                box-shadow: 3px 0px 10px #000000;
        cursor: pointer;
    }



    /*----------------------- Offers css starts ----------------------*/
    .offers{
        margin-top: 180px;
        /* padding-top: 60px; */
        background-color: #3C6D9C;
        color: #FFFFFF;
        /* height: 500px; */

    }

    .offersWriteup{
        padding-top: 120px;
    }


    /*----------------------- Courses css starts ----------------------*/
    #courses .card{
        overflow: hidden;
        width: 17rem;
        margin: auto;
        height: 27rem;
    }

    #courses .tag {
        padding-left: 264px;
    }

    /*----------------------- Offers2 css starts ----------------------*/
    #offers2 .card{
        overflow: hidden;
        width: 18rem;
        margin: auto;
        height: 25rem;
    }
}


/* Extra large devices (large desktops, 1200px and up)*/
@media (min-width: 1200px) { 

    /*----------------------- Navbar css starts ----------------------*/
    .badge {
        background-color: black;
    }

    /*----------------------- About-us css starts ----------------------*/
    .about-us .about-us-video{
        position: absolute;
        left: 0;
        right: 0;
        top: 0;
        bottom: 0;
        background-image: url(/Content/images/lforschools/luminate-icon.png);
        background-position: center;
        background-size: contain;
        /* background-attachment: fixed; */
        background-repeat: no-repeat;
        width: 100%;
        height: 531px;
    }

    .about-us iframe {
        position: relative;
        top: 99px;
        left: 60px;
        /* right: 10px; */
        width: 95%;
        height: 347px;
        -webkit-box-shadow: 3px 0px 10px #000000;
                box-shadow: 3px 0px 10px #000000;
        cursor: pointer;
    }


    /*----------------------- Offers2 css starts ----------------------*/
    #offers2 .card{
        overflow: hidden;
        width: 20rem;
        margin: auto;
        height: 27rem;
    }
}
}