.header {
    width: 82vw;
    margin-left: auto;
    margin-right: auto;
}

.secHeader {
    width: 86vw;
    margin: auto;
}

.headerLogo {
    width: 150px;
}

.nav {
    width: 100%;
}

.nav ul {
    justify-content: flex-end;
    gap: 2vw;
}

.animatedButtonParent {
    display: flex;
    gap: 15%;
    margin-left: 2vw;
}

.animatedButtonParent .animatedButton {
    position: relative;
    color: #FF13EF;
    font-weight: 500;
    font-size: 17px;
}

.animatedButtonParent .animatedButton::before {
    content: "";
    position: absolute;
    bottom: 0;
    width: 85%;
    height: 1.5px;
    border-radius: 50%;
    background: #FF13EF;

}

.animatedButtonParent .animatedButton:hover {
    color: #FF13EF;
}

.animatedButtonParent .animatedButton:hover::before {
    /* width: 100% !important; */
    animation: underlineAnimation .5s ease-out forwards;
}


@keyframes underlineAnimation {
    0% {
        width: 0%;
    }

    100% {
        width: 85%;
    }

}

.aboutUsParent {
    /* border: 1px solid; */
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 85vh;

}

#aboutUs {
    margin: auto;
    width: 90%;
    height: 100%;
}

.documentsImageParent {
    /* height: 100%; */
    height: 70vh;
}

.imagesSectionImageDiv {
    width: 85vw;
    height: 65vh;
    margin: auto;
}


.firstIntroSection {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 100%;
}

.firstIntroSection p {
    text-align: center;
}

.secondSectionAboutUs .aboutUsContentParent {
    flex-direction: column;
    align-items: center;
}

.aboutUsLine,
.thirdSectionLine {
    height: 30vh;
    margin-bottom: 30px;
    transition: all .5s ease-out;
}

.secondSectionAboutUs h2 {
    text-align: center;
}

.thirdSectionContentParent {
    flex-direction: column;
    align-items: center;
}

.thirdSectionContentParent h2,
.thirdSectionContentParent h3,
.fourthSectionDocuments h3 {
    text-align: center;
}

.fourthSectionDocuments {
    flex-direction: column;
    align-items: center;
}

.fourthSectionLine {
    height: 30vh;
    margin-top: 30px;
    transition: all .5s ease-out;
}

.fifthSectionContentParent {
    flex-direction: column;
    align-items: center;
}

.fifthSectionLine {
    height: 30vh;
    margin-bottom: 30px;
    transition: all .5s ease-out;
}

.fifthSectionContentParent h3,
.fifthSectionContentParent h2 {
    text-align: center;
}


.header2RightBox {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 21px;
    padding: 0px !important;
}

.header2RightBox button {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap: 12px;
    border: 1.2px solid #000000;
    font-weight: bold;
    padding: 5px;
    width: 8vw;
    font-size: 0.7em;
    cursor: pointer;
    transition: all 0.1s;
}

.header2RightBoxLoginButton {
    background: transparent;
    color: #fff;
    border: 1px solid white !important;
    border-radius: 18px;
    transition: all 0.3s;
}
.header2RightBoxGoToDashboardButton {
    background: transparent;
    color: #fff;
    border: 1px solid white !important;
    border-radius: 18px;
    transition: all 0.3s;

    width: max-content !important;
    padding: 10px !important;
    font-size: 0.9em !important;
}

.header2RightBoxSignupButton {
    background: #FF13EF;
    color: white;
    border-radius: 18px;
    transition: all 0.3s;
}

.header2RightBoxLoginButton:hover,
.header2RightBoxSignupButton:hover,
.header2RightBoxGoToDashboardButton:hover {
    transform: scale(1.1);
    box-shadow: 0 4px 8px rgba(235, 230, 230, 0.9);
}

.HeaderMenu--logged-out {
    height: 8vh;
}

.nav {
    display: flex;
    align-items: center;
    justify-content: flex-end;
}



@media only screen and (max-width: 600px) {

    .conversationImagesDiv {
        height: auto !important;
        flex-direction: column;
    }

    .headerLogo {
        width: 25vw;
    }

    .home-drone {
        width: 40vw;
    }

    .imagesSectionImageDiv {
        height: initial;
    }

    .documentsImageParent {
        height: 50vh;
    }

    /* #aboutUs{
        width: 100%;
    } */

    /* .firstIntroSection {
        margin-top: 10px;
    } */

    .aboutUsLine,
    .thirdSectionLine {
        height: 20vh;
    }

    .fourthSectionLine {
        height: 20vh;
    }

    .fifthSectionLine {
        height: 20vh;
    }

    .footerLogoAndText {
        align-items: center;
    }

    .aboutUsParent {
        height: 50vh;
    }


}

@media only screen and (max-width: 765px) {
    .firstIntroSection {
        margin-top: 7rem;
    }

    .header {
        display: none;
    }

    .sub-nav-mktg {
        position: fixed !important;
        top: 0 !important;
    }

    .sub-nav-mktg-ctas {
        opacity: 1 !important;
    }
}

@media only screen and (max-width: 1011px) {

    .HeaderMenu--logged-out {
        height: 15vw;
    }
}

@media only screen and (min-width: 1200px) {

    .text-medium {
        font-size: 30px !important;
        transition: all .2s;
    }
}

@media only screen and (min-width: 1500px) {

    .text-medium {
        font-size: 40px !important;
        transition: all .2s;
    }
}


@media only screen and (max-width: 400px) {

    /* .aboutUsParent {
        height: 40vh
    } */



}

/* Extra small devices (phones) */
@media only screen and (max-width: 400px) and (max-height: 800px) {
    /* .aboutUsParent {
        height: 40vh;
    } */

}