body{
    font-family: 'Space Grotesk', sans-serif;
}

.bannersection {
  position: relative;
  background-color: black;
  height: 100vh;
  width: 100%;
  overflow: hidden;
}

.bannersection.trainingbanner {
    background-color: transparent;
    height: auto;
}

.bannersection video {
  position: absolute;
  top: 50%;
  left: 50%;
  min-width: 100%;
  min-height: 100%;
  width: auto;
  height: auto;
  z-index: 0;
  -ms-transform: translateX(-50%) translateY(-50%);
  -moz-transform: translateX(-50%) translateY(-50%);
  -webkit-transform: translateX(-50%) translateY(-50%);
  transform: translateX(-50%) translateY(-50%);
}

.bannersection .contentsection {
  position: relative;
  z-index: 2;
  max-width: 65%;
}

.bannersection .contentsection .contentmain {
    height: 75vh;
}

.bannersection .contentsection .contentmain h5 {
    font-size: 1.4rem;
    font-weight: bolder;
}

.bannersection .contentsection .contentmain .heading {
    font-size: 4.5rem;
    font-weight: bold;
    line-height: 1;
    padding-top: 1rem;
    font-weight: bold;
    max-width: 80%;
    margin: 0 auto;
}

.bannersection .overlay {
  position: absolute;
  top: 0;
  left: auto;
  right: auto;
  bottom: auto;
  height: 100%;
  width: 100%;
  background-color: #586065;
  opacity: 0.5;
  z-index: 1;
}

.bannersection .overlay img {
    opacity: 0.5;
}

.paceincemain .navbar {
    background-color: transparent !important;
    transition: background-color 0.3s;
    z-index: 5;
    max-width: 90%;
    margin: 0 auto;
    font-size: 1.2rem;
    font-weight: 600;
}

.paceincemain .bannersection .navbar-nav .nav-item a,
.paceincemain .bannersection .navbar-brand {
    color: #b3c8dd;
}

.paceincemain .bannersection .navbar-brand {
    font-size: 2.5rem;
    color: #00b4f8;
    text-shadow: 1px 1px #9de4ff;
}

.bannersection .contentsection .contentmain .bottomsection {
    max-width: 75%;
    margin: 0 auto;
    padding-top: 2rem;
}

.bannersection .contentsection .contentmain .bottomsection .bottomsectionmain {
    display: flex;
    grid-gap: 2rem;
}

.bannersection .contentsection .contentmain .bottomsection .leftsection,
.bannersection .contentsection .contentmain .bottomsection .rightsection {
    text-align: left;
    padding-top: 1.5rem;
}

.bannersection .contentsection .contentmain .bottomsection .leftsection h5,
.bannersection .contentsection .contentmain .bottomsection .rightsection h5 {
    font-size: 1.15rem;
    font-weight: normal;
    line-height: 1.4;
}

.bannersection .contentsection .contentmain .bottomsection button {
    min-width: 10rem;
    padding: 0.75rem 0;
    border-radius: 15rem;
    margin-top: 0.5rem;
}

.paceincemain .vissionmission {
    background-color: rgb(245, 250, 255);
}

.paceincemain .vissionmission .vissionmissionmain {
    display: flex;
}

.paceincemain .vissionmission .vissionmissionmain .leftsection .section {
    display: flex;
    grid-gap: 3rem;
    align-items: flex-start;
    max-width: 68%;
    padding-bottom: 2rem;
}

.paceincemain .vissionmission .vissionmissionmain .leftsection .section .right h4 {
    color: rgb(37, 136, 235);
    font-size: 32px;
    font-weight: bold;
    margin-bottom: 0.1rem;
}

.paceincemain .vissionmission .vissionmissionmain .leftsection .section .right p {
    font-weight: 600;
    margin-bottom: 0;
}

.paceincemain .vissionmission .vissionmissionmain .leftsection .section ul {
    padding-left: 0;
    margin-top: 0.5rem;
}

.paceincemain .vissionmission .vissionmissionmain .leftsection .section ul li {
    list-style-type: none;
    padding-bottom: 0rem;
    font-weight: 600;
}

/* what we are css */

.whatweare .mainheading {
    font-size: 3.5rem;
    font-weight: bold;
    text-align: center;
    color: rgb(0, 8, 135);
}

.whatweare .para {
    max-width: 60%;
    text-align: center;
    margin: 0 auto;
    font-weight: 600;
    color: rgb(112, 112, 112);
}

.whatweare .whatwearemain {
    background-color: rgb(245, 248, 251);
    display: flex;
    align-items: center;
    grid-gap: 2rem;
    padding: 2rem;
    margin-top: 2rem;
}

.whatweare .whatwearemain .leftsection,
    .whatweare .whatwearemain .rightsection {
    width: 50%;
}

.whatweare .whatwearemain .rightsection.bottom {
    padding-left: 2rem;
}

.whatweare .whatwearemain .leftsection img {
    width: 80%;
    margin: 0 auto;
}

.whatweare .whatwearemain .rightsection h3 {
    font-size: 4rem;
    color: rgb(2, 110, 217);
    font-weight: bold;
}

.whatweare .whatwearemain .rightsection h5 {
    font-size: 2rem;
    font-weight: 600;
    color: rgb(1, 109, 217);
}

.whatweare .whatwearemain .rightsection .contact {
    background-color: rgb(0, 8, 135);
    border-color: rgb(0, 8, 135);
    padding: 0.75rem 2rem;
    border-radius: 50px;
}

.whatweare .whatwearemain .rightsection p {
    font-size: 1.1rem;
    font-weight: 600;
}

.uniquesection {
    background-color: rgb(0, 25, 63);
    color: #fff;
}

.uniquesection .heading {
    font-size: 3.5rem;
    font-weight: bold;
}

.uniquesection .heading span {
    color: rgb(1, 109, 217);
}

.uniquesection ul {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-gap: 2rem;
    margin-top: 2rem;
    max-width: 90%;
    margin: 0 auto;
}

.uniquesection ul li {
    list-style-type: none;
    text-align: center;
    margin: 0 auto;
    background-color: rgba(0, 28, 69, 0.88);
    width: 100%;
    padding: 2rem;
}

.uniquesection ul li img {
    margin-bottom: 1rem;
}

.Aspiringmain .Aspiring_section .rightsection {
    text-align: center;
    padding-top: 2rem;
}

.Aspiringmain .Aspiring_section .rightsection h4 {
    font-size: 2rem;
    color: rgb(1, 109, 217);
    font-weight: bold;
    margin-bottom: 1rem;
}

.Aspiringmain .Aspiring_section .rightsection ul {
    display: flex;
    justify-content: space-between;
    padding-top: 1rem;
    border-bottom: 2px dashed rgb(73, 88, 103);
    padding-bottom: 2rem;
}

.Aspiringmain .Aspiring_section .rightsection ul li {
    list-style-type: none;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.Aspiringmain .Aspiring_section .rightsection ul li h5 {
    font-size: 1rem;
}

.Aspiringmain .Aspiring_section .rightsection ul li .bordersection {
    width: 7rem;
    height: 7rem;
    border: 2px dashed #707070;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 1rem;
}

.Aspiringmain .Aspiring_section .rightsection ul li img {
    max-width: 85%;
}

.ourclient {
    background-color: rgb(245, 248, 251);
}

.ourclient .rightsection {
    padding-top: 0rem !important;
}

.ourclient .rightsection h4 {
    font-size: 3.5rem !important;
    color: #212121 !important;
    margin-bottom: 0 !important;
}

.ourclient .rightsection h4 span {
    color: rgb(0, 8, 135);
}

.ourclient .rightsection .para {
    max-width: 50%;
    margin: 0 auto;
    margin-bottom: 1rem;    
    font-weight: 600;
    color: #707070;
}

.ourclient .rightsection ul {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    grid-gap: 2rem;
    max-width: 80%;
    margin: 0 auto;
    border-bottom: none !important;
}

.ourclient .rightsection ul li {
    background-color: #fff;
    padding: 2rem;

}

.ourclient .rightsection ul li img {
    max-width: 100% !important;
}

.uniquesection .contactus {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-gap: 2rem;
    max-width: 80%;
    margin: 0 auto;
}

.uniquesection .contactus .leftsection img {
    width: 100%;
} 

.uniquesection .contactus .rightsection .form-control {
    padding: .95rem .75rem;
    background-color: rgb(245, 247, 250);
}

.uniquesection .contactus .rightsection .form-control:focus {
    box-shadow: none;
}

.uniquesection .contactus .rightsection .submitbtn {
    background-color: rgb(9, 66, 152);
    border-color: rgb(9, 66, 152);
    padding: 1rem 2rem;
    border-radius: 30px;
}

.paceincemain .bannersection .trainingcontainer {
    padding: 0 !important;
    margin-top: -5.5rem;
}


/* training and placement css */

.trainingcontainer .carousel-dark .carousel-indicators [data-bs-target] {
    background-color: #fff;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    margin-right: 0.5rem;
}

.trainingcontainer .carousel-dark .carousel-control-next-icon, 
.trainingcontainer .carousel-dark .carousel-control-prev-icon {
    filter: inherit;
}

.paceincemain .bannersection .trainingcontainer .carousel-inner {
    max-height: 30rem;
}

.whysection {
    background-color: rgb(245, 250, 255);
    padding: 3rem 0;
}

.whysection .heading {
    text-align: center;
}

.whysection .heading h4 {
    font-size: 3rem;
    font-weight: bold;
    color: rgb(0, 8, 135);
    text-align: left;
}

.whysection .heading h4 span {
    color: rgb(1, 109, 217);
}

.whysection .heading p {
    max-width: 65%;
    margin: 0 auto;
    font-weight: 600;
    color: rgb(55, 65, 81);
}

.whysection .whysectioncards {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-gap: 2rem;
    padding-top: 3rem;
}

.whysection .whysectioncards .whycard img {
    width: 100%;
}

.whysection .whysectioncards .whycard .content {
    background-color: rgb(0, 25, 63);
    color: #fff;
    padding: 1rem;
    min-height: 16rem;
}

.trainuniquesection {
    background-color: rgb(245, 248, 251);
    padding: 2rem;
    margin-top: 2rem;
}

.trainuniquesection .uniquecard {
    display: flex;
    grid-gap: 1.5rem;
    margin-bottom: 2rem;
}

.trainuniquesection .uniquecard .left {
    min-width: 22%;
}

.trainuniquesection .uniquecard .left img {
    width: 100%;
}

.trainuniquesection .uniquecard .right h5 {
    color: rgb(0, 8, 135);
    font-weight: 600;
}

.trainuniquesection .uniquecard .right p {
    font-weight: 600;
}

.whatweoffer .whysectioncards {
    grid-gap: 5rem;
}

.whatweoffer .whysectioncards .whycard .content {
    background-color: #fff;
}

.whatweoffer .whysectioncards .whycard .content h5 {
    font-size: 2rem;
    color: rgb(0, 8, 135);
    font-weight: bold;
    text-align: center;
}

.whatweoffer .whysectioncards .whycard .content p {
    color: #212121;
    font-weight: 600;
    text-align: center;
}

.whatweoffer .whysectioncards .whycard .content .explorebtn {
    background-color: rgb(0, 8, 135);
    border-color: rgb(0, 8, 135);
    min-width: 8rem;
    padding: 0.7rem 0;
    border-radius: 25px;
    margin: 0 auto;
}

.wetrainhire {
    background-color: rgb(0, 25, 63);
    padding: 5rem 0;
}

.wetrainhire .wetrainmain {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-gap: 2rem;
    color: #fff;
}

.wetrainhire .wetrainmain .left {
    max-width: 80%;
    margin: 0 auto;
}

.wetrainhire .wetrainmain .left h5 {
    font-size: 3.15rem;
    font-weight: bold;
    text-align: center;
}

.wetrainhire .wetrainmain .left h5 span {
    color: rgb(1 109 217);
}

.wetrainhire .wetrainmain .right {
    text-align: center;
}

.wetrainhire .wetrainmain .right h2 {
    font-family: Lobster;
    font-size: 4.5rem;
    text-align: center;
    font-style: italic;
}

.wetrainhire .wetrainmain .right .getbtn {
    background-color: rgb(0, 8, 135);
    border-color: rgb(0, 8, 135);
    min-width: 8rem;
    padding: 0.75rem 0;
    border-radius: 25px;
}

.techologybanner {
    max-height: 28rem;
}

.trainingbanner .content {
    position: absolute;
    top: 38%;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 5555;
    color: #fff;
    text-align: center;
}

.trainingbanner .content h4 {
    font-size: 2.75rem;
    font-weight: bold;
    margin-bottom: 1.5rem;
}

.trainingbanner .content p {
    max-width: 38%;
    margin: 0 auto;
    font-size: 1.1rem;
    font-weight: 600;
}


.contactsection {
    background-color: #fff;
}

.contactsection .contactus .rightsection label{
    color: #212121;
}

.uniquesection .heading {
    color: #212121;
}

.whysection .heading h5 {
    padding-top: 1rem;
    color: rgb(0, 8, 135);
    font-weight: bold;
}

.whysection .heading a {
    text-decoration: none;
    color: #212121;
}

.contactsection .contactus {
    max-width: 100%;
    display: flex;
}

.contactsection .contactus .rightsection {
    max-width: 100%;
    width: 35%;
}

.contactsection .contactus .leftsection {
    width: 65%;
}

@media (max-width: 786px) {

    .paceincemain .navbar {
        max-width: 100%;
        padding: 0 1rem !important;
    }
    .navbar .navbar-toggler {
        background-color: #fff;
    }

    .bannersection .overlay img {
        opacity: 0.6;
        height: 100%;
        object-fit: cover;
    }
    .paceincemain .vissionmission .vissionmissionmain,
    .paceincemain .vissionmission .vissionmissionmain .leftsection .section,
    .whatweare .whatwearemain {
        flex-direction: column;
    }

    .whatweare .whatwearemain .leftsection, .whatweare .whatwearemain .rightsection {
        width: 100%;
    }

    .uniquesection ul,
    .uniquesection .contactus {
        grid-template-columns: repeat(1, 1fr);
    }

    .paceincemain .bannersection .trainingcontainer {
        margin-top: 0 !important;
    }
    
    .trainingbanner .content {
        top: 44%;
    }

    .paceincemain .bannersection .navbar-nav.contactnav .nav-item a {
        color: #212121;
    }

    .Aspiringmain .Aspiring_section .rightsection ul,
    .contactsection .contactus {
        flex-direction: column;
        grid-gap: 1rem;
    }

    .contactsection .contactus .rightsection,
    .contactsection .contactus .leftsection {
        width: 100%;
    }

    .bannersection .contentsection .contentmain .heading {
        font-size: 2.5rem;
    }
    .bannersection .contentsection {
        max-width: 90%;
    }

    .bannersection {
        height: auto;
    }

    .bannersection .contentsection .contentmain {
        height: 71vh;
    }

    .paceincemain .vissionmission .vissionmissionmain .leftsection .section {
        max-width: 100%;
        justify-content: center;
        align-items: center;
    }

    .paceincemain .vissionmission .vissionmissionmain .leftsection .section .right {
        text-align: center;
    }
}