@font-face {
    font-family: "AdobeCleanRegular";
    src: url("../fonts/font-adobe/AdobeCleanRegular.otf");
}
@font-face {
    font-family: "AdobeCleanExtraBold";
    src: url("../fonts/font-adobe/AdobeCleanExtraBold.otf");
}
@font-face {
    font-family: "AdobeCleanBold";
    src: url("../fonts/font-adobe/AdobeCleanBold.otf");
}
@font-face {
    font-family: "AdobeCleanLight";
    src: url("../fonts/font-adobe/AdobeCleanLight.otf");
}
@font-face {
    font-family: "MontserratBold";
    src: url("../fonts/montserrat/Montserrat-Bold.ttf");
}
@font-face {
    font-family: "MontserratSemiBold";
    src: url("../fonts/montserrat/Montserrat-SemiBold.ttf");
}
/* =============================================================================header and home */

.fontWhoIs {
    font-family: "AdobeCleanRegular";
    color: #727272;
    margin-top: 10px;
}

#myVideo {
    display: flex;
    justify-content: center;
    width: 90%;
    height: 90%;
    border-radius: 20px;
    margin: auto;
}
.loginBtn {
    color: white !important;
    background-color: #797de5 !important;
    border: none !important;
    margin: 3px !important;
    width: 7rem !important;
    height: 2.3rem !important;
    text-align: center !important;
    font-family: "AdobeCleanBold" !important;
    font-size: 13px !important;
}
.enrollBtn {
    color: white !important;
    background-color: #797de5;
    border: none;
    margin: 3px;
    width: 10rem;
    height: 2.8rem;
    font-family: "AdobeCleanBold";
    font-size: 13px;
}
.enrollBtnempty {
    color: white !important;
    background-color: none;
    border: 1px solid #797de5;
    margin: 3px;
    /* padding: 12px 30px !important; */
    width: 10rem;
    height: 2.8rem;
    font-family: "AdobeCleanBold";
    font-size: 13px;
}

.input-container {
    width: 90px;
    height: 47px;
    border-radius: 25px;
    background-color: #f2f2f2;
    display: flex;
    align-items: center;
    padding: 0 10px;
    position: relative;
}
.pattern1 {
    position: absolute;
    top: -300px !important;
    left: -150px;
    z-index: -3;
}
.pattern3 {
    position: absolute;
    top: 0px !important;
    left: -150px;
    z-index: 1;
    width: 40%;
}
.pattern2 {
    position: absolute;
    top: -170px !important;
    left: -150px;
    z-index: -3;
}

.pattern5 {
    position: absolute;
    top: 0px !important;
    right: 0px;
    z-index: -4;
    width: 30%;
}

.pattern6 {
    position: absolute;
    top: 30% !important;
    right: 0px;
    z-index: -4;
    width: 20%;
    /* height: 30%; */
}

.relative {
    position: relative;
}
.toggle-btn {
    width: 35px;
    height: 35px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #05a69d;
    cursor: pointer;
    position: absolute;
    left: 5px;
    transition: left 0.3s ease;
}

.toggle-btn.active {
    left: calc(100% - 40px);
}
.nav-link {
    font-family: "AdobeCleanExtraBold" !important;
    color: #000000 !important;
}
.loginBtn:hover {
    background-color: #797de5;
    font-family: "AdobeCleanBold";
}

.InfoBtn {
    margin: 3px !important;
    /* padding: 5px 25px !important; */
    color: #797de5 !important;
    /* border-color: ; */
    text-align: center !important;
    width: 7rem !important;
    height: 2.3rem !important;
    font-family: "AdobeCleanBold" !important;
    font-size: 13px !important;
    border: solid 3px #797de5 !important;
}
.InfoBtn:hover {
    margin: 3px;
    width: 7rem;
    height: 2.3rem;
    text-align: center;
    color: #f5f5f6 !important;
    border-color: #797de5;
    font-family: "AdobeCleanBold";
    background-color: #797de5;
}
.header {
    position: relative;
    text-align: center;
    height: 100vh;
    overflow: hidden;
    top: -140px !important;
}

.header .background-video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: 0.52;
    z-index: -1;
}

.headerContent {
    position: relative;
    z-index: 1;
    margin-top: 20%;
}

.navbar {
    position: sticky !important;
    background-color: transparent !important;
    top: 0;
    width: 100%;
    z-index: 4;
}
.navbar.scrolled {
    background-color: white !important;
    z-index: 2;
}
.title-header {
    margin-top: 20vh;
    font-family: "AdobeCleanExtraBold";
    color: #000000 !important;
    width: 40% !important;
    margin: auto !important;
}

.p-header {
    font-family: "AdobeCleanRegular";
    margin: 20px auto !important;
    color: #000000 !important;
    font-size: 20px;
    width: 32% !important;
}

.selectGroupSearch {
    background-color: white !important;
    padding: 10px;
    border-radius: 10px;
    width: 50%;
}

.form-select1 {
    border: none;
    border-radius: 10px;
    height: auto;
}
.verLineHomeHeder {
    height: 40px;
    margin: 0px 10px;
    border-left: 1px solid #9f9f9f;
}
@media (max-width: 767px) {
    .verLine {
        display: none;
    }
    .headerContent {
        font-size: 1rem;
    }
    .custom-select {
        padding: 20px 34px;
        width: 190px !important;
        font-size: 12px;
    }
    .cardh5Home {
        font-size: 15px;
        margin-left: 0px !important;
    }
    .verLine {
        height: 40px;
        margin: 0px 10px;
        border-left: 1px solid black;
    }
    .headerContent {
        margin-top: 50% !important;
    }
    .p-header {
        width: 60% !important;
    }
    .title-header {
        width: 70% !important;
    }
    .verLineHomeHeder {
        display: none;
    }
}

@media (min-width: 768px) {
    .verLine {
        height: 40px;
        margin: 0px 10px;
        border-left: 1px solid black;
    }
    .custom-select {
        padding: 20px 34px;
        width: 280px !important;
        font-size: 12px;
    }
}

.select-container {
    position: relative;
    display: inline-block;
}

.icon-img {
    position: absolute;
    left: 10px;
    top: 50%;
    transform: translateY(-50%);
    width: 20px;
    height: auto;
}
.searchBtn {
    padding: 10px 47px !important;
    margin-left: 10px !important;
    color: #f7f7fb !important;
    background-color: #797de5 !important;
    border-color: none;
    font-family: "AdobeCleanBold";
    font-size: 14px;
    border-radius: 5px !important;
}
.img-thumbnail {
    cursor: pointer;
    border: none !important;
}

/* =============================================================section 2 */

.sec2-p {
    font-family: "AdobeCleanExtraBold";
    line-height: 3rem;
    margin-right: 20px;
    font-size: 3rem;
    color: #001d39;
}

.about-h4-sec1 {
    color: #001d39;
}
.mainDevNum {
    position: relative;
    text-align: center;
}

.numDiv {
    position: relative;
}

.num {
    position: relative;
    font-size: 5rem;
    display: inline-block;
    font-family: "AdobeCleanRegular";
}

.num::before {
    content: "";
    position: absolute;
    top: 64%;
    right: -10;
    width: 58%;
    height: 56%;
    z-index: -1;
    transform: translateY(-50%);
    border-radius: 10px;
}
.orangeNum::before {
    background-color: rgb(252, 178, 51);
    opacity: 0.65;
}
.lightBlue::before {
    background-color: #38a8df;
    opacity: 0.65;
}
.lightGreen::before {
    background-color: #05a69d;
    opacity: 0.65;
}

.numTitleP {
    font-weight: 700;
    margin: 10px;
    font-family: "AdobeCleanExtraBold";
    font-size: 18px;
}

.picSec {
    border-radius: 10px;
    width: 100%;
    margin: 30px 0px;
}

/* =============================================================footer */

.textFooter {
    font-family: "AdobeCleanRegular";
    color: #cbcbcb;
    font-size: 12px;
}

.submitFooter {
    background-color: #38a8df;
    color: white;
    padding: 7px 30px;
    width: 100px;
    text-align: center !important;
    font-size: 12px;
}
.submitFooter:hover {
    background-color: #30a3dd;
    color: white;
    padding: 7px 30px;
}
.inputFooter::placeholder {
    color: #cbcbcb;
    font-size: 12px;
}
.inputFooter {
    padding: 9px !important;
    width: 100% !important;
    border-radius: 6px !important;
    border: none !important;
}
@media (min-width: 767px) {
    .adsBox {
        position: absolute;
        top: -32%;
        left: 50%;
        transform: translateX(-50%);
        background: linear-gradient(
            90deg,
            rgba(56, 168, 223, 1) 0%,
            rgba(5, 166, 157, 1) 50%,
            rgba(249, 175, 63, 1) 100%
        );
        box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
        z-index: 2;
        padding: 10px 30px;
        border-radius: 10px;
        width: 60%;
    }
    /* .selectGroupSearch {
        width: 70% !important;
    } */
    .mainFooter {
        position: relative;
        padding-top: 5rem;
        background-color: #010227;
        margin-top: 10rem !important;
    }
}
@media (min-width: 767px) and (max-width: 981px) {
    .adsBox {
        top: -60% !important;
    }
    .text-overlay {
        position: absolute;
        top: 50%;
        left: 50%;
        width: 30% !important;
        transform: translate(-50%, -50%);
        color: white;
    }
}

@media (min-width: 1200px) and (max-width: 1400px) {
    .shapeCenter {
        width: 100% !important;
    }
    .squareShapBig {
        width: 320px !important;
        height: 180px;
        background: #cea44b;
        margin-bottom: -45px !important;
        border-top-left-radius: 20px;
        border-top-right-radius: 20px;
    }
    .selectGroupSearch {
        width: 62% !important;
    }
}
@media (min-width: 1401px) {
    .selectGroupSearch {
        width: 52% !important;
    }
}

@media (min-width: 765px) and (max-width: 1000px) {
    .vedIcon {
        top: 36% !important;
        left: 42% !important;
        background: transparent;
        border: none;
        width: 70px !important;
        height: 70px !important;
    }
    .vedIcon img {
        width: 70px !important;
        height: 70px !important;
    }
}

.vedIcon {
    top: 46%;
    left: 46%;
    background: transparent;
    border: none;
}
.vedIcon img {
    width: 80px;
    height: 80px;
}
@media (max-width: 766px) {
    .vedIcon {
        top: 28% !important;
        left: 40% !important;
        background: transparent;
        border: none;
        width: 60px !important;
        height: 60px !important;
    }
    .vedIcon img {
        width: 60px !important;
        height: 60px !important;
    }
    .adsBox {
        position: absolute;
        top: -80%;
        left: 50%;
        transform: translateX(-50%);
        background: linear-gradient(
            90deg,
            rgba(56, 168, 223, 1) 0%,
            rgba(5, 166, 157, 1) 50%,
            rgba(249, 175, 63, 1) 100%
        );
        box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
        z-index: 1;
        padding: 10px 30px;
        border-radius: 10px;
        margin-top: 39px;
    }
    .m-sm-top {
        margin-top: 30px;
    }

    .adsPText {
        font-size: 12px;
    }
    .mainFooter {
        position: relative;
        padding-top: 5rem;
        background-color: #010227;
        margin-top: 20rem !important;
    }
    .Montserrat-bold-font {
        font-family: "MontserratBold";
        font-size: 14px !important;
        margin-top: 15px;
    }
    .memberShip {
        width: 190px !important;
    }
    .define {
        position: absolute;
        top: 110;
        left: 120;
    }
    .can-head-hight {
        height: 25rem !important;
    }
    .profileName2 {
        font-family: "AdobeCleanExtraBold";
        margin-top: 0px !important;
        margin-left: 1rem;
        /* width: 300px;; */
    }
    .define2 {
        position: absolute;
        left: 150px;
        top: 120px;
    }
}

.footer {
    color: white;
}

.ulFooter {
    list-style: none;
    padding: 0;
    font-family: "AdobeCleanRegular";
    text-align: right;
}

.adsPText {
    font-family: "AdobeCleanRegular";
    color: #f2f2f2;
    font-size: 14px;
}
.adsHText {
    font-family: "MontserratSemiBold";
    color: white;
    font-size: 25px;
}

.liFooter {
    margin: 8px;
    margin-left: 1rem;
    font-family: "AdobeCleanLight";
    font-size: 15px;
}

.liFooterCopyRight {
    margin: 8px;
    margin-left: 1rem;
    font-family: "AdobeCleanLight";
    color: #707070;
    font-size: 15px;
}

/* =============================================================pricing cards */
.t-size {
    width: 500px !important;
}

.pricingCards {
    margin-top: 7rem;
}
.eventShapes {
    margin-top: 2rem;
}
.memberShip {
    position: absolute;
    width: 230px;
    height: 37px;
    background: linear-gradient(
        90deg,
        rgba(249, 175, 63, 1) 0%,
        rgba(5, 166, 157, 1) 50%,
        rgba(56, 168, 223, 1) 100%
    );
    border-radius: 20px;
    opacity: 0.65;
}
.QandA {
    position: absolute;
    width: 230px;
    height: 33px;
    background: linear-gradient(
        90deg,
        rgba(249, 175, 63, 1) 0%,
        rgba(5, 166, 157, 1) 50%,
        rgba(56, 168, 223, 1) 100%
    );
    border-radius: 20px;
    opacity: 0.65;
}
.howItWork {
    position: absolute;
    width: 200px;
    height: 31px;
    background: linear-gradient(
        90deg,
        rgba(249, 175, 63, 1) 0%,
        rgba(5, 166, 157, 1) 50%,
        rgba(56, 168, 223, 1) 100%
    );
    border-radius: 20px;
    opacity: 0.65;
}
.whyEventAbout {
    position: absolute;
    width: 230px;
    height: 30px;
    background: linear-gradient(
        90deg,
        rgba(249, 175, 63, 1) 0%,
        rgba(5, 166, 157, 1) 50%,
        rgba(56, 168, 223, 1) 100%
    );
    border-radius: 20px;
    opacity: 0.89;
}
.w-40 {
    width: 40% !important;
}
.memberH1 {
    position: relative;
    margin-top: -18px;
    font-family: "AdobeCleanExtraBold";
}

.squareShap {
    width: 300px;
    height: 180px;
    margin-bottom: -30px;
    border-top-left-radius: 20px;
    border-top-right-radius: 20px;
}
.colorSquare1 {
    background: #d4d4d6 !important;
    color: white;
}
.colorSquare2 {
    background: #8d97a0 !important;
    color: white;
}

/* @media (min-width: 1200) {

} */
.squareShapBig {
    width: 355px;
    height: 180px;
    background: #cea44b;
    margin-bottom: -30px;
    border-top-left-radius: 20px;
    border-top-right-radius: 20px;
}
.shapeRightLeft {
    width: 328px;
}

.pattern2 {
    position: absolute;
    left: -30px;
    top: 0px;
}
@media (min-width: 768px) {
    .shapeCenter {
        height: 500px;
    }
    .textCardPricing {
        font-size: 14px !important;
        font-family: "AdobeCleanRegular";
        padding: 20px;
    }
    .rateCandidatebtn {
        margin-top: 6rem;
        height: 30px;
        color: white;
        font-size: 14px;
    }
    .can-head-hight {
        height: 22rem;
    }
    .horLine {
        border-bottom: 1px solid #aca8a8;
        position: absolute;
        top: 75%;
        left: 50%;
        width: 70%;
        transform: translate(-50%, -50%);
    }
    .psquareShap {
        font-family: "MontserratBold";
        font-size: 20px;
        color: white;
    }
    .tabsProfile {
        margin: auto !important;
    }
}

@media (max-width: 768px) {
    .shapeCenter {
        height: 300px;
    }
    .squareShapBig {
        width: 220px !important;
    }
    .squareShap {
        width: 220px !important;
    }
    .shapeRightLeft {
        height: 300px;
    }
    .textCardPricing {
        font-size: 10px !important;
        font-family: "AdobeCleanRegular";
        /* width: 20%; */
    }
    .can-head-hight {
        height: 30rem;
    }

    .psquareShap {
        font-family: "MontserratBold";
        font-size: 16px;
        color: white;
    }
    .signInCard {
        box-shadow: 0px 0px 10px #00000029;
        border-radius: 29px;
        position: relative;
        margin-top: -4rem;
        background-color: white;
        z-index: 1;
        width: 24rem !important;
        margin-top: 10x;
        margin-right: 10px;
    }
    .welcomeEventCard2 {
        box-shadow: 0px 0px 10px #00000029;
        border-radius: 29px;
        margin-top: -4rem;
        background-color: white;
        z-index: 1;
        width: 48% !important;
        height: 18.5rem;
        text-align: center;
        color: #000000 !important;
        text-decoration: none !important;
    }
    .welcomeEventCard {
        box-shadow: 0px 0px 10px #00000029;
        border-radius: 29px;
        margin-top: -4rem;
        background-color: white;
        z-index: 1;
        width: 48% !important;
        height: 18.5rem;
        text-align: center;
        color: #000000 !important;
        text-decoration: none !important;
    }
    .lokForJob {
        font-size: 14px;
    }
    .p-welcomeEvent {
        font-size: 12px !important;
        color: #5d5d5d;
    }
    .text-overlay-why-Portal {
        width: 20rem !important;
        position: absolute;
        top: 40% !important;
        left: 59% !important;
        transform: translate(-50%, -50%);
        color: white;
        font-size: 1.6em !important;
        font-weight: bold;
        text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
        padding: 10px;
        border-radius: 5px;
    }
    .text-overlay-why-vip {
        width: 14rem !important;
        position: absolute;
        top: 50%;
        left: 58% !important;
        transform: translate(-50%, -50%);
        color: white;
        font-size: 1.6em !important;
        font-weight: bold;
        text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
        padding: 10px;
        border-radius: 5px;
    }
}
@media (max-width: 473px) {
    .text-overlay {
        position: absolute;
        top: 50% !important;
        left: 47% !important;
        width: 35%;
        transform: translate(-50%, -50%);
        color: white;
    }
    .horLine {
        border-bottom: 1px solid #aca8a8;
        position: absolute;
        top: 79%;
        left: 50%;
        width: 50%;
        transform: translate(-50%, -50%);
    }
    .enrollBtnempty {
        color: white !important;
        background-color: none;
        border: 1px solid #797de5;
        margin: 3px;
        padding: 10px 25px !important;
        font-family: "AdobeCleanBold";
        font-size: 10px;
    }
    .enrollBtn {
        color: white !important;
        background-color: #797de5;
        border: none;
        margin: 3px;
        padding: 10px 25px !important;
        font-family: "AdobeCleanBold";
        font-size: 10px;
    }
}
.can-head-hight {
    margin-top: 50px !important;
}
.HsquareShap {
    color: white;
    font-family: "AdobeCleanRegular";
}

.position-relative {
    position: relative;
}

.bac {
    background-color: white !important;
}
@media (min-width: 765px) {
    .text-overlay {
        position: absolute;
        top: 50%;
        left: 50%;
        width: 80% !important;
        transform: translate(-50%, -50%);
        color: white;
    }
}

@media (min-width: 767px) and (max-width: 991px) {
    .text-overlay {
        position: absolute;
        top: 50%;
        left: 50%;
        width: 35% !important;
        transform: translate(-50%, -50%);
        color: white;
    }
}
@media (min-width: 520px) and (max-width: 767px) {
    .text-overlay {
        position: absolute;
        top: 50%;
        left: 50%;
        width: 30% !important;
        transform: translate(-50%, -50%);
        color: white;
    }
}
.text-overlay {
    position: absolute;
    top: 50%;
    left: 50%;
    /* width: 40% !important;  */
    transform: translate(-50%, -50%);
    color: white;
}

.line-btn {
    margin: 20px 10px;
    position: absolute;
    top: 85%;
    left: 48%;
    width: auto;
    transform: translate(-50%, -50%);
    border: none;
    color: white !important;
}

.line-btn:hover {
    background-color: #797de5;
    border: none;
    border-radius: 10px;
    color: white;
}

@media (max-width: 768px) {
    .squareShap,
    .squareShapBig {
        max-width: 90%;
    }

    .text-overlay {
        width: 30%;
        font-size: 10px;
    }
    .cardBagdes {
        margin: 10px auto !important;
        width: 100% !important;
    }
    .card3Details {
        width: 100% !important;
    }
}

@media (max-width: 488px) {
    .text-overlay {
        width: 38% !important;
    }
}
/* ==========================================================================================Recruitment page*/

/* //end input Section 2 */
.input-icon {
    position: relative;
    display: flex;
    align-items: center;
}
.card-recrutment {
    box-shadow: 0px 0px 6px #00000029 !important;
    border-radius: 8px !important;
}
.input-icon .img1 {
    position: absolute;
    left: 20px;
    pointer-events: none;
}
.input-icon .img2 {
    position: absolute;
    right: 20px;
    pointer-events: none;
}
.input-icon select {
    padding-left: 50px;
    padding-right: 40px;
}
.borderNon {
    border: none !important;
    border-left: 1px solid #9f9f9f !important;
    height: 10px;
    border-radius: 0px !important;
    color: #9f9f9f !important;
    background-color: #f8fafc;
    height: 50px;
    font-family: "AdobeCleanRegular";
    font-size: 14px;
}
.borderNonFirstInput {
    border: none !important;
    height: 10px;
    border-radius: 0px !important;
    color: #9f9f9f !important;
    background-color: #f8fafc;
    height: 50px;
    font-family: "AdobeCleanRegular";
    font-size: 14px;
}

.formInput {
    position: relative;
    /* margin-right: 40px; */
}
.vertical-line {
    color: #9f9f9f;
    position: absolute;
    top: 0;
    right: -10px;
    width: 2px;
    height: 100%;
    background-color: #050505;
}
.vertical-line:last-of-type {
    display: none;
}
.mainInputsSection {
    background-color: #f8fafc;
    border-radius: 8px;
}
/* .hightInputsRec{
    height: 100px;
} */
/* //end input Section 2 */

.Recruitment {
    position: relative; /* Required to position the pseudo-element */
    background: transparent url("../img/head.png") 0% 0% no-repeat padding-box;
    background-size: cover;
    text-align: center;
    height: 15rem;
    color: white;
}
.recimgRadius {
    border-radius: 9px;
}
.Recruitment::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.69); /* Black with 50% opacity */
    border-radius: 9px;
}

.headTitle {
    z-index: 6 !important;
}

.cardImg {
    margin-top: 7px;
    padding: 3px;
    border-radius: 50%;
}

.card-p-recr {
    font-size: 14px;
    color: #9f9f9f;
    font-family: "AdobeCleanBold";
}
.card-p2-recr {
    font-size: 14px;
    color: #cbcbcb;
    font-family: "AdobeCleanRegular";
}
.card-num-recr {
    font-size: 15px;
}
.btnDetails {
    padding: 6px 25px;
    background-color: #38a8df;
    color: white;
}

/* .selectGroupSearchRec{
    background-color: #F8FAFC;
}
.form-select1{
    background-color: #F8FAFC;
} */

.mainSecInputs {
    background-color: #f8fafc !important;
}

.searchBtnrecu {
    padding: 14px 26px !important;
    color: #f7f7fb !important;
    /* background-color:  #38A8DF !important;  */
    border-color: none;
    font-family: "AdobeCleanBold";
    font-size: 13px;
}

.orange-color-talent {
    background-color: #f9af3f;
}
.orange-color-talent:hover {
    background-color: #f8aa36;
}
.blue-color-recr {
    background-color: #38a8df;
}
.blue-color-recr:hover {
    background-color: #38a8df;
    color: white;
}
.blue-color-ad {
    background-color: #797de5;
}
.blue-color-ad:hover {
    background-color: #797de5;
    color: white;
}
.blue-color-ad:disabled {
    background-color: #8486af;
}
.blur_cover .user_card {
    filter: blur(10px);
    -webkit-filter: blur(10px);
}

/* ==========================================================================================candidate details page*/
.information {
    font-family: "AdobeCleanRegular";
}
.Bagdes-H {
    font-family: "AdobeCleanExtraBold";
}
/* .w-candidateDetails{
    width: 80%;
} */
.client-job-dis {
    color: #9f9f9f;
    margin-left: 1rem;
    font-size: 14px;
    font-family: "AdobeCleanBold";
}
.canImgHead {
    background-image: url("../img/headProfile.png");
    background-repeat: none;
    background-size: cover;
    text-align: center;
    height: 15rem;
    color: white;
    background-color: #000000;
    /* margin:20px 60px; */
    margin-top: 20;

    border-radius: 6px;
    opacity: 0.69;
}
.title-p-can {
    font-family: "AdobeCleanExtraBold";
}
.p-candinate {
    color: #727272;
    font-size: 15px;
    font-family: "AdobeCleanRegular";
}
.profile-pic {
    width: 120px;
    height: 120px;
    border-radius: 50%;
    margin-top: 60px;
    border: 4px solid white !important;
}

.profile-pic2 {
    width: 100px;
    height: 100px;
    border-radius: 50%;
    border: 4px solid white !important;
}
.rateCandidatebtn {
    height: 37px;
    width: 160px;
    background-color: #f9af3f;
    font-size: 12px;
    color: white;
}

.profile-pic-div {
    position: relative;
    top: -110px;
    margin-left: 20px;
    /* margin-right: 42px; */

    /* left: 60px; */
}

.profileName {
    font-family: "AdobeCleanExtraBold";
    margin-top: 7.1rem;
    margin-left: 1rem;
    width: 300px;
    /* color: white */
}
.profileName2 {
    font-family: "AdobeCleanExtraBold";
    margin-top: 7.5rem;
    margin-left: 1rem;
    /* width: 300px;; */
    /* color: white */
}

.mar-top {
    /* margin-top: 7.8rem; */
    margin-right: 1rem;
}

.white {
    color: white;
}
.cardBagdes {
    box-shadow: 0px 0px 6px #00000029;
    border-radius: 8px;
    opacity: 1;
    background-color: #f8fafc;
    width: 84%;
}

.AvailableBtn {
    background-color: #03a617;
    border-radius: 3px;
    color: white;
}
.AvailableBtn:hover {
    background-color: #039915;
    border-radius: 3px;
    color: white;
}
.cardName {
    font-family: "AdobeCleanExtraBold";
}
.cardDetailsBtn {
    /* background-color:#38A8DF ; */
    font-size: 14px;
    padding: 8px 30px;
    color: white;
    font-family: "AdobeCleanBold";
}
.cardDetailsBtn:hover {
    /* background-color:#38A8DF ; */
    font-size: 14px;
    padding: 8px 30px;
    color: white;
    font-family: "AdobeCleanBold";
}
.cardDetailsBtn:hover {
    /* background-color:#F9AF3F ; */
    /* color: white; */
}
/* .cardDetailsBtn:hover{
    background-color:#F9AF3F ;
    color: white;


} */
.Contact-txt {
    font-family: "AdobeCleanExtraBold";
}
.personal-details-p {
    color: #727272;
    font-family: "AdobeCleanBold";
}

.downloadCVbtn {
    background-color: #f9af3f;
    border-radius: 8px;
    color: white;
}

.downloadCVbtn:hover {
    background-color: #38a8df;
    border-radius: 8px;
    color: white;
}
.numSpan {
    color: #f9af3f;
    font-weight: 800;
    font-size: 40px;
    margin: auto;
}
.sendConatctBtn {
    background-color: #f9af3f;
    color: white;
    border: none;
}

.card3Details {
    background-color: #f8fafc;
    border-radius: 8px;
    width: 84%;
}
.formContactDetailsPage {
    background-color: #f8fafc;
    border-radius: 8px;
}

.labelConatct {
    font-size: 15px;
    font-family: "AdobeCleanBold";
}

.PersonalDetails-h4 {
    font-family: "AdobeCleanExtraBold";
}
.inputCon::placeholder {
    font-size: 15px;
    color: #cbcbcb;
}
.inputContxtarea::placeholder {
    font-size: 15px;
    color: #cbcbcb;
}
.inputContxtarea {
    height: 110px;
}

/* =====================================================================================why event hub page */
.about-h4-sec1 {
    font-family: "AdobeCleanBold";
}
.marginMinuse {
    margin-top: 140px;
}
.p-about-sec3 {
    font-family: "AdobeCleanRegular";
}

.whyEventh2 {
    color: white;
    top: 1px !important;
}

.whyEventSecion {
    background-color: #010227;
    padding: 3rem;
    position: relative; /* Ensure this is relative for z-index adjustments */
}

.contentEvent {
    color: white;
}

.num2 {
    position: relative;
    font-size: 2rem; /* Adjust the size as needed */
    display: inline-block;
    font-weight: 700;
    z-index: 1; /* Ensure this has a higher z-index than its background */
    color: #d1d3ff;
}

.num2::before {
    content: "";
    position: absolute;
    top: 63%;
    left: -16px;
    width: 44px;
    height: 70%;
    background-color: #ffffff; /* Adjust the color as needed */
    z-index: -1; /* Ensure this is behind the text but above the background */
    transform: translateY(-50%);
    border-radius: 8px;
    opacity: 0.3;
}
.text-overlay-why-vip {
    width: 14rem !important;
    position: absolute;
    top: 50%;
    left: 52%;
    transform: translate(-50%, -50%);
    color: white;
    font-size: 2em;
    font-weight: bold;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
    padding: 10px;
    border-radius: 5px;
}
.text-overlay-why-Portal {
    width: 20rem !important;
    position: absolute;
    top: 50%;
    left: 52%;
    transform: translate(-50%, -50%);
    color: white;
    font-size: 2em;
    font-weight: bold;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
    padding: 10px;
    border-radius: 5px;
}
.coming-soon {
    position: absolute;
    top: 60%;
    width: 95% !important;
    background-color: rgba(
        255,
        255,
        255,
        0.35
    ); /* Semi-transparent white background */
    color: white; /* Ensure the text color is fully opaque */
    text-align: center;
    font-size: 1.4em;
    left: 10px;
    padding: 10px;
    border-radius: 5px;
}
/* =====================section quastion ans answers */

.qa-p {
    /* color: #727272; */
    /* font-size: 17px; */
    line-height: 1.5rem;
    font-family: "AdobeCleanBold";
}

.qa-p2 {
    color: #727272;
    font-size: 15px;
    line-height: 1.5rem;
    font-family: "AdobeCleanRegular";
    margin-left: 40px !important;
}
.qa-p3 {
    color: #727272;
    font-size: 15px;
    line-height: 1.5rem;
    font-family: "AdobeCleanRegular";
}
.sectionQA {
    margin-top: 6rem;
}

.title-p-qa {
    color: #000000 !important;
}

/* =====================================================================================VIP services */

.h4VIPServices {
    font-family: "AdobeCleanBold";
}

.VIPservices {
    background-image: url("../img/vipser.png");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    text-align: center;
    height: 15rem;
    color: white;
    margin: 0; /* Removes any margin */
    padding: 0; /* Removes any padding */
}

.VIPservices::before {
    content: "";
    position: absolute;
    width: 100%;
    height: 15rem;
    background-color: rgba(0, 0, 0, 0.35);
}

.qa-p-vip {
    line-height: 1.5rem;
    font-family: "AdobeCleanBold";
    color: #727272 !important;
}
.num3 {
    position: relative;
    font-size: 4rem; /* Adjust the size as needed */
    display: inline-block;
    font-weight: 800;
    color: #797de5;
    z-index: 1; /* Ensure this has a higher z-index than its background */
}

.num3::before {
    content: "";
    position: absolute;
    top: 60%;
    left: -14px;
    width: 100%;
    height: 70%;
    background-color: #959090; /* Adjust the color as needed */
    z-index: -1; /* Ensure this is behind the text but above the background */
    transform: translateY(-50%);
    border-radius: 8px;
    opacity: 0.3;
}
.howItWorkP {
    color: #000000;
    font-size: 15px;
    line-height: 1.4rem;
    font-family: "AdobeCleanRegular";
    width: 70%;
    margin: auto;
}
.contactBtn {
    background-color: #797de5;
    padding: 8px 50px;
    color: white;
    font-family: "AdobeCleanBold";
}
.contactBtn2 {
    background-color: #797de5;
    width: 10%;
    color: white;
    font-family: "AdobeCleanBold";
    justify-content: center;
}
.contactBtn2:hover {
    background-color: #797de5;
    width: 10%;
    color: white;
    font-family: "AdobeCleanBold";
    justify-content: center;
}
.linksGetInTouch {
    color: #797de5 !important;
}
.contactBtn:hover {
    background-color: #797de5;
    padding: 8px 50px;
    color: white;
    font-family: "AdobeCleanBold";
}
/* .contactBtn:hover{
    background-color: #797DE5;
    padding: 10px 40px ;
    color: white;
} */
.inputContactGetIntouchtextArea {
    border: 1px solid #050506;
    height: 100px;
}
.inputContactGetIntouch {
    height: 45px;
}
/* ===================================================================================professional portal */

.professionalPortal {
    background-image: url("../img/port2.png");
    height: 15rem;
    width: 100% !important;
    border: none;
    border-radius: 0px;
}
.professionalPortalP {
    font-family: "AdobeCleanBold";
    line-height: 1.3rem;
    margin-top: 20px;
}

.professionalH2 {
    color: white;
}

.chartImg {
    width: 60%;
    height: 94%;
}

.pro-p {
    color: #727272;
    font-size: 18px;
    line-height: 1.5rem;
}
.eventsHup-p {
    color: #727272;
    font-size: 16px;
    line-height: 1.5rem;
}
.organizationCard {
    box-shadow: 0px 0px 10px #00000029;
    border-radius: 29px;
    width: 96%;
    padding: 3rem;
}
.w-73 {
    width: 73% !important;
}
.organizationP {
    color: #727272;
    font-size: 20px;
    line-height: 1.5rem;
    font-family: "AdobeCleanLight";
    margin-top: 20px;
}
.organizationH {
    font-family: "MontserratBold";
}

/* ===================================================================================contact card */

.contactCard {
    box-shadow: 0px 0px 10px #00000029;
    border-radius: 29px;
}

.labelContact {
    font-family: "AdobeCleanBold";
    font-size: 14px;
}
.inputContact {
    border: 1px solid #797de5;
    height: 43px !important;
}
.inputContactGetIntouch {
    border: 1px solid #050506;
}

.inputContact::placeholder {
    color: #cbcbcb;
    font-size: 14px;
    font-family: "AdobeCleanRegular";
}
.inputContactGetIntouch::placeholder {
    color: #cbcbcb;
    font-size: 14px;
    font-family: "AdobeCleanRegular";
}
.inputContactGetIntouchtextArea::placeholder {
    color: #cbcbcb;
    font-size: 14px;
    font-family: "AdobeCleanRegular";
}
.getInTouchLink {
    font-family: "AdobeCleanBold";
}
.linksGetInSections {
    margin-top: 7rem;
}
.getIn {
    position: absolute;
    width: 170px;
    height: 32px;
    background: linear-gradient(
        90deg,
        rgba(249, 175, 63, 1) 6%,
        rgba(5, 166, 157, 1) 88%,
        rgba(56, 168, 223, 1)
    );
    border-radius: 20px;
    opacity: 0.65;
}
.getInH1 {
    position: relative;
    margin-top: -17px;
}

/* ===================================================================================SignIn card */
.SignInHeader {
    background-image: url("../img/head.png");
    background-repeat: no-repeat;
    background-size: cover;
    text-align: center;
    height: 15rem;
    color: white;
    position: relative;
    font-family: "AdobeCleanBold";
}
.SignInHeader::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.69); /* Black with 50% opacity */
    border-radius: 9px;
    opacity: 0.69;
}
.signInCard {
    box-shadow: 0px 0px 10px #00000029;
    border-radius: 29px;
    position: relative;
    margin-top: -4rem;
    background-color: white;
    z-index: 1;
    width: 30rem;
    margin-top: 10x;
    margin-right: 10px;
}

.forgotAccount {
    font-size: 13px;
    font-family: "AdobeCleanBold";
}

.signInBtn {
    background-color: #797de5;
    padding: 10px;
    color: white;
    font-size: 12px;
    font-family: "AdobeCleanBold";
    width: 40%;
    text-align: center;
    justify-content: center;
}
.signInBtn:hover {
    background-color: #797de5;
    padding: 10px 50px;
    color: white;
    font-size: 12px;
    font-family: "AdobeCleanBold";
}

/* ===================================================================================welcome To Event Hub */

.arrowIcon {
    position: absolute;
    bottom: -20px;
    right: 40%;
    display: none;
    transition: opacity 0.3s ease;
}

.welcomeEventCard,
.welcomeEventCard2 {
    position: relative;
    padding-bottom: 50px;
}

.inputContactDropDown {
    border: 1px solid #797de5;
    height: 43px !important;
    appearance: none; /* Remove default dropdown styling */
    -webkit-appearance: none;
    -moz-appearance: none;
    background: url("assets/img/dropdown.svg") no-repeat right 10px center; /* Add dropdown icon */
    background-color: #fff;
    padding-right: 40px; /* Add padding to make room for the icon */
    font-size: 14px;
    font-family: "AdobeCleanRegular";
}
.inputContactDropDownProfile {
    border: 1px solid #797de5;
    height: 38px !important;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    background: url("../img/dropdown.svg") no-repeat right 10px center;
    background-size: 12px;
    background-color: #fff;
    padding-right: 40px;
    font-size: 14px;
    font-family: "AdobeCleanRegular";
    cursor: pointer;
}

.inputContactDropDownProfile:focus {
    outline: none;
    box-shadow: 0 0 5px rgba(121, 125, 229, 0.5);
}

.inputContactDropDown option {
    color: #cbcbcb;
    font-size: 14px;
}

.form-group .inputContactDropDown:focus {
    outline: none;
    box-shadow: none;
    border-color: #797de5;
}

.welcomeEventCard:hover .arrowIcon,
.welcomeEventCard2:hover .arrowIcon {
    display: block;
}

.welcomeEventCard {
    box-shadow: 0px 0px 10px #00000029;
    border-radius: 29px;
    /* position: relative; */
    margin-top: -4rem;
    background-color: white;
    z-index: 1;
    width: 22%;
    height: 18.5rem;
    text-align: center;
    color: #000000 !important;
    text-decoration: none !important;
}
.welcomeEventCard2 {
    box-shadow: 0px 0px 10px #00000029;
    border-radius: 29px;
    margin-top: -4rem;
    background-color: white;
    z-index: 1;
    width: 22%;
    height: 18.5rem;
    text-align: center;
    color: #000000 !important;
    text-decoration: none !important;
}
.welcomeEventCard2:hover {
    background-color: #f0f1ff !important;
}
.welcomeEventCard:hover {
    background-color: #f0f1ff !important;
}
.p-welcomeEvent {
    font-size: 14px;
    /* line-height: 1rem; */
    color: #5d5d5d;
}

/* .btnSignUpRec{
    background-color: #38A8DF;
    border-radius: 20px;
    width: 11rem;
    color: white;
    font-size: 14px;
    font-weight: bold;
}
.btnSignUpRec:hover{
    background-color: #38A8DF;
    color: white;

}
.btnSignUpTal{
    background-color: #F2F2F2;
    border-radius: 20px;
    padding: 7px 25px;
    width: 11rem;
    color: #9F9F9F;
    font-size: 14px;
    font-weight: bold;

}
.btnSignUpTal:hover{
    background-color: #F2F2F2;
    color: #9F9F9F;

} */
.p-signUpRec {
    color: #727272;
    line-height: 1.2rem;
    font-size: 15px;
    font-family: "AdobeCleanRegular";
}
.p-signUpRec1 {
    color: #727272;
    line-height: 1.2rem;
    font-size: 18px;
    font-family: "AdobeCleanRegular";
}
/* ===================================================================================code cerfication page*/

.cardVer {
    width: 38px;
    height: 38px;
    border: 2px solid #797de5;
    border-radius: 5px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 24px;
    position: relative;
}

.cardVer input {
    width: 100%; /* Full width input */
    height: 100%; /* Full height input */
    border: none; /* No border for input */
    text-align: center; /* Centered text */
    font-size: 24px; /* Input font size */
    outline: none; /* No outline on focus */
    position: absolute; /* Positioning to overlap the card */
    left: 0; /* Align left */
    top: 0; /* Align top */
}

.cardVer:focus-within {
    border-color: #007bff; /* Change border color on focus */
}

.signInCard {
    /* max-width: 400px;  */
}

.Resend {
    font-size: 12px;
}

.numResend {
    font-size: 20px;
    color: #797de5;
}

.a-login {
    text-decoration: none !important;
}
/* =========================================================================my profile */

.number-seliver {
    font-size: 25px;
    color: white;
    font-family: "MontserratBold";
}
.image-checkbox input[type="checkbox"] {
    width: 20px;
    height: 20px;
    border: 1px solid #f9af3f !important;
    color: #f9af3f !important;
}
.gold-text {
    font-family: "AdobeCleanRegular";
    font-size: 70px;
    color: white;
}
.file-upload {
    /* border: 1px dotted #F9AF3F; */
    border-radius: 8px;
    height: 130px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    cursor: pointer;
}
.file-upload:before {
    content: "";
    position: absolute;
    top: -3px;
    left: -3px;
    right: -3px;
    bottom: -3px;
    border: 2px dotted #ff7f50;
    z-index: -1;
}
.file-upload input[type="file"] {
    display: none;
}
.file-icon {
    width: 30px;
    height: 30px;
}

.MyProfileUploadFile-P {
    font-size: 13px;
    color: #cbcbcb;
}
.coverLetter {
    height: 120px;
}

.linkMyProfile {
    background-color: #f2f2f2;
    padding: 8px 15px;
    color: #9c9797;
    border-radius: 20px;
    text-decoration: none;
    margin: 10px;
}
.linkCompanyProfile {
    background-color: #f2f2f2;
    padding: 8px 15px;
    color: #9c9797;
    border-radius: 20px;
    text-decoration: none;
    font-family: "AdobeCleanBold";
    margin: 10px;
}
.linkCompanyProfile.active {
    font-weight: bold;
    background-color: #797de5;
    color: white;
}
.linkCompanyProfile:hover {
    background-color: #797de5;
    color: white;
}
.linkMyProfile.active {
    font-weight: bold;
    background-color: #f9af3f;
    color: white;
}
.border-color-orange {
    border: 1px solid #f9af3f !important;
}
.border-color-orange::placeholder {
    font-size: 13px;
    color: #cbcbcb;
}
.linkMyProfile:hover {
    background-color: #f9af3f;
    color: white;
}
/* .profScetion{
    height: 30% !important;
} */

.saveChanges {
    background-color: #f9af3f !important;
    color: white !important;
    padding: 10px 24px;
    font-size: 13px;
}
.saveChanges2 {
    background-color: #797de5 !important;
    color: white !important;
    padding: 10px 24px;
    font-size: 13px;
}
.MyProfilelabel {
    font-size: 14px;
    font-weight: 600;
    margin: 8px 0px;
}
.comapny-location-p {
    font-size: 13px;
    color: #9f9f9f;
    margin-left: 1rem;
}

.blueInput {
    border: 1px solid #797de5;
}
/* .blue-color{
    color: #797DE5;
} */
.blueInput::placeholder {
    font-size: 13px;
}
.cardMyProfile {
}

@media (min-width: 992px) {
    .w-lg-50 {
        width: 50%;
    }
    .m-x {
        margin: 0px 20px;
    }
}

@media (max-width: 992px) {
    .horLine {
        border-bottom: 1px solid #aca8a8;
        position: absolute;
        top: 75%;
        left: 50%;
        width: 30% !important;
        transform: translate(-50%, -50%);
    }
    .m-sm-3 {
        margin-top: 10px;
    }
    .profile-pic-div {
        display: block !important;
    }
    .profileName {
        margin-top: 10px !important;
    }
    .linkMyProfile {
        font-size: 12px !important;
    }
}
.border {
    box-shadow: 0px 0px 10px #00000029;
    border-radius: 29px;
    padding: 30px;
}
.cardMyProfilePlan {
    box-shadow: 0px 0px 10px #00000029;
    border-radius: 29px;
    /* padding: 40px; */
}

.profile-button {
    background-color: #f9af3f !important;
    color: white;
    padding: 10px 24px;
    font-size: 13px;
    margin: 10px 10px;
}

.profile-pic-div {
    position: relative;
    /* cursor: pointer; */
}

.overlay {
    display: none;
    background: rgba(0, 0, 0, 0.5);
    justify-content: center;
    align-items: center;
    color: white;
    font-size: 16px;
}

.profile-pic-div:hover .overlay {
    display: flex;
}

.goldTube {
    padding: 20px 0px !important;
    background: linear-gradient(
        90deg,
        rgba(154, 85, 255, 1) 6%,
        rgba(5, 166, 157, 1) 88%
    );
}
.shadow {
    box-shadow: 0px 6px 6px #00000029 !important;
}
.Upgrade {
    background-color: #f9af3f !important;
    color: white !important;
    padding: 10px 24px;
    font-size: 13px;
    /* margin: 10px 10px !important; */
}
.Upgrade2 {
    background-color: #797de5 !important;
    color: white !important;
    padding: 10px 24px;
    font-size: 13px;
}
.cardMasseges {
    box-shadow: 0px 0px 10px #00000029;
    border-radius: 29px;
    /* padding: 40px; */
}
/* .w-cardB{
    width: 90%;
} */

.notMassegeP {
    font-size: 13px;
}

.p-massege-card {
    font-size: 14px;
    color: #707070;
    font-family: "AdobeCleanRegular";
}
.h6-title-card-masssege {
    font-size: 19px;
}

/* ======================================================================================enents hup three cards */

.linkContinue {
    font-family: "AdobeCleanBold";
}
.p-font-bold-adobe {
    font-family: "AdobeCleanBold";
}
.Montserrat-bold-font {
    font-family: "MontserratBold";
    font-size: 20px;
    margin-top: 10px;
}
