



.main-header {
  padding: 0;
  margin: 0;
  height: calc(100vh - 75px - 3rem);
  max-height: 850px;
  min-height: 550px;
  overflow: hidden;
  position: relative;
}

.main-header .overlay {
    background: #000422;
    opacity: 0.7;
}
.main-header .header-content {
      height: 100%;
      text-align: center;
}
.main-header .header-content .header-sub-bg {
        padding-top: 5rem;
        height: 100%;
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-justify-content: space-around;
        -ms-flex-pack: distribute;
        justify-content: space-around;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        position: relative;
        background-size: cover !important;
}
.main-header .header-title, .main-header .header-sub {
          position: relative;
          z-index: 6;}
          .main-header .header-title h1 {
            padding-top: 36px;
            font-size: 2.6rem; }
            .main-header .header-title p {
              font-size: 1.2rem;
              max-width: 800px;
              color: white;
              padding: 36px 6px 0 6px;
              margin: 0 auto; }

.main-header h2 {
                text-align: center;
                font-size: 3rem;
                position: relative;
                z-index: 6;
}

.main-header img {
                  padding-top: 2.3rem;
                  width: 250px;
}
                .main-header .btn {
                  margin: 1rem;
                  border: 1px solid #1B213E;
                  border-radius:30px; }
                  .main-header .btn.main-gradient-bg {
                    border: none; }
                    .main-header .btn:hover {
                      background: -webkit-linear-gradient(left, #2FCF6C, #6BC28E);
                      background: linear-gradient(90deg, #2FCF6C, #6BC28E); }
                      .main-header .btn:hover a {
                        -webkit-text-fill-color: white; }
                        .main-header .social-icons {
                          margin-top: 1rem;
                          text-align: center; }
                          .main-header .social-icons i {
                            -webkit-background-clip: text !important;
                            -webkit-text-fill-color: transparent;
                            padding: 10px;
                            font-size: 1.5rem; }
                            .main-header .social-icons i:hover {
                              background: -webkit-linear-gradient(left, #2FCF6C, #6BC28E);
                              background: linear-gradient(90deg, #2FCF6C, #6BC28E); }
                              .main-header::after {
                                content: '';
                                position: absolute;
                                bottom: 0;
                                left: 0;
                                width: 100%;
                                height: 5px;
                                background: -webkit-linear-gradient(left, #000422 53%, rgba(255, 255, 255, 0) 20%) repeat-x bottom;
                                background: linear-gradient(to right, #000422 53%, rgba(255, 255, 255, 0) 20%) repeat-x bottom;
                                background-size: 35px 2px; }
                                .main-header.main-header-video .header-sub-bg {
                                  background: rgba(21, 25, 53, 0.1); }
                                  .main-header.main-header-video #videoBG {
                                    position: absolute;
                                    z-index: 0;
                                    top: 0;
                                    left: 0;
                                    bottom: 0;
                                    right: 0;
                                    overflow: hidden;
                                    height: 100%;
                                    background-size: cover;
                                    background: transparent none repeat 0 100%; }
                                    .main-header.main-header-video #videoBG video {
                                      margin: auto;
                                      width: auto;
                                      min-width: 100vmax;
                                      position: absolute;
                                      top: 0;
                                      left: 50%;
                                      -webkit-transform: translateX(-50%);
                                      transform: translateX(-50%);
                                      visibility: visible;
                                      opacity: 1;
                                      height: 100vmax; }
                                      .main-header.main-header-animated #eclipse-scene,
                                      .main-header.main-header-animated #eclipse-scene2 {
                                        position: absolute;
                                        left: 0;
                                        width: 100%;
                                        height: 100%;
                                        top: 0;
                                        z-index: 9; }






                                        .main-header-sub {
                                          margin-top: 0; }
                                          .main-header-sub .left-side-content {
                                            text-align: center;
                                            margin-top: 2rem; }
                                            .main-header-sub .left-side-content h2 {
                                              position: relative;
                                              display: inline-block;
                                              margin: 0 auto 1rem; }
                                              .main-header-sub .left-side-content h2::after {
                                                content: '';
                                                position: absolute;
                                                top: 3.5rem;
                                                left: calc(50% - 7.5rem);
                                                width: 15rem;
                                                height: 5px;
                                                background: -webkit-linear-gradient(left, #000422 53%, rgba(255, 255, 255, 0) 20%) repeat-x bottom;
                                                background: linear-gradient(to right, #000422 53%, rgba(255, 255, 255, 0) 20%) repeat-x bottom;
                                                background-size: 35px 2px; }
                                                .main-header-sub .left-side-content p {
                                                  max-width: 600px;
                                                  padding: 0 1rem;
                                                  margin: 0 auto 2rem; }







/* ------------------------------------- */
                                                    /* *. Media Queries .................... */
                                                    /* ------------------------------------- */
                                                    @media screen and (min-width: 2000px) {
                                                      .container {
                                                        max-width: 1900px; } }
                                                        @media screen and (min-width: 1800px) {
                                                          html {
                                                            font-size: 18px; }

                                                            .container {
                                                              max-width: 1700px; } }
                                                              @media screen and (max-width: 1800px) and (min-width: 1400px) {
                                                                .container {
                                                                  max-width: 90%; } }
                                                                  @media screen and (min-width: 992px) {



                                                                    .main-header .vertical-social-icons {
                                                                      position: absolute;
                                                                      right: 1rem;
                                                                      top: 1rem;
                                                                      display: -webkit-box;
                                                                      display: -webkit-flex;
                                                                      display: -ms-flexbox;
                                                                      display: flex;
                                                                      -webkit-box-orient: vertical;
                                                                      -webkit-box-direction: normal;
                                                                      -webkit-flex-direction: column;
                                                                      -ms-flex-direction: column;
                                                                      flex-direction: column;
                                                                      margin-right: 2rem; }
                                                                      .main-header .vertical-social-icons a {
                                                                        width: 44px; }


                                                                        }}
                                                                        @media screen and (max-width: 1200px) and (min-width: 992px) {
                                                                          .main-navbar .login-btn, .main-navbar .sign-up-btn {
                                                                            width: 100px; } }
                                                                            @media screen and (max-width: 1300px) {
                                                                              html {
                                                                                font-size: 14px; }

                                                                              }
@media screen and (max-width: 991.9px) {
.cd-top {
width: 40px;
height: 40px;
bottom: 20px;
right: 20px; }



@media screen and (max-width: 767.9px) {
.main-about .left-side-content .section-title::after {
width: 80%; }




@media screen and (max-width: 575.9px) {
        .page {
margin-top: 15px;
overflow: hidden; }


.main-about .right-side-content .blue-light-background {
  margin: 0 0.4rem 2rem; }


.main-header img {
                    padding-top: 2.3rem;
                    width: 180px;
                    padding-bottom: 2.3rem;
                  }
