@import 'fonts';
@import 'variables';
@import '~bootstrap/scss/bootstrap';
@import 'tooltip';
@import 'intlTelInput';
@import 'checkbox';
@import url("https://use.typekit.net/xak7leb.css");
//Medidas dinamicas
@import 'dynamic_measurements';

//text color
.text {
    &-yellow {
        &-capita {
            color: $yellow-capita;
        }
    }
    &-orange {
        color: $orange;
    }
    &-pink {
        color: $pink;
    }
    &-purple {
        color: $purple;
    }
    &-wine{
        color: #AB3E7D !important;
    }
   
}

#selfModal {
    p,
    input {
        font-size: 1.7rem
    }
}

a {
    color: #ffffff;
    &:hover {
        color: #ffffff!important;
    }
}

ul {
    li {
        margin-right: 1rem;
        font-family: Assistant,sans-serif;
    }
}

.z-index {
    &-1 {
        z-index: 1;
    }
    &-0 {
        z-index: 0;
    }
}

.hr-vertical {
    height: 15rem!important;
    color: white!important;
    top: 60%!important;
}

.ul-horizontal {
    flex-direction: row;
    display: flex;
    li {
        @extend .mr-5;
        @extend .text-nowrap;
        @media(max-width: $screen-xs) {
            margin-right: 1rem!important;
        }
    }
}

//fonts family
.futura-bold {
    font-family: futura-pt-bold, sans-serif;
}

//font styles
.lh-md {
    line-height: 2!important;
}
.lh-xl {
    line-height: 3!important;
}

.fw {
    &-900 {
        font-weight: 900!important;
    }
    &-600 {
        font-weight: 600!important;
    }
    &-300 {
        font-weight: 300!important;
    }
    &-100 {
        font-weight: 100!important;
    }
}

//font sizes
.display-1 {
    font-size: calc(1.625rem + 3.5vw)!important;
}

.display-2 {
    font-size: calc(1.575rem + 3.9vw)!important;
}

.display-3 {
    font-size: calc(1.525rem + 3.3vw)!important;
}

.display-4 {
    font-size: calc(1.475rem + 2.7vw)!important;
}

.display-0 {
    font-size: 18rem!important;
    line-height: 85%;
    @media(max-width: 1670px) {
        font-size: 15rem!important;
    }
    @media(max-width: 1200px) {
        font-size: 10rem!important;
    }
    @media(max-width: $screen-xs) {
        font-size: 3rem!important;
    }
}

.display-1 {
    &-xl {
        // font-size: 14rem!important;
        line-height: 1.5!important;
        font-size: calc(6.625rem - -3.5vw) !important;
    }
}

.bignumcards {
    @extend .futura-bold;
    @extend .position-relative;
    @extend .font-weight-bold;
    font-size: 31vw;
    @media(min-width: $screen-md) {
        top: -13vw;
        line-height: 0;
        left: calc(100% - 37rem);
    }
    @media(max-width: $screen-md) {
        line-height: 1;
        font-size: 16vw;
        left: -0.2rem;
    }
}

.font {
    &-xxl {
        font-size: 30rem;
        line-height: 0%;
    }
    &-numberbig {
        font-size: 30rem;
        line-height: 0%;
    }
}

//Backgrounds color
.bg {
    &-body {
        background-color: #f8fafc!important;
    }
    &-gray {
        background-color: $gray;
    }
    &-gray-100 {
        background-color: $gray-100;
    }
    &-gray-200 {
        background-color: $gray-200;
    }
    &-dark {
        background-color: $dark;
    }
    &-yellow-capita {
        background-color: $yellow-capita;
        &-gradient {
            background: linear-gradient(to bottom, $yellow-capita, #FBCC24, #FBDA6C, #FCE088)
        }
    }
    &-newsletter{
        background-color: #FFBF02 !important;
    }
    &-purple {
        background-color: $purple;
        &-gradient {
            background: linear-gradient(to right, $purple, #4937B9, #6051C4, #7063CC)
        }
        &-gradient-dark {
            background: linear-gradient(to right, #2B2B2B, #261f4e, #6051C4, $purple);
            &-reverse {
                background: linear-gradient(to right, $purple, #6051C4, #261f4e, #2B2B2B);
            }
        }
    }
    &-pink {
        background-color: $pink;
    }
    &-orange {
        background-color: $orange;
    }
    &-orangeStrong {
        background-color: #f47444;
    }
    &-white {
        background-color: #ffffff;
        &smoke {
            background-color: $whitesmoke;
        }
    }
    &-fixed {
        background-attachment: fixed;
        @media (max-width: $screen-md) {
            background-attachment: scroll !important;
        }
    }
    &-scroll {
        background-attachment: scroll !important;
    }
    &-download-form {
        background-image: url(/images/backgrounds/download.svg);
        background-size: cover;
        background-repeat: no-repeat;
        background-position: right;
    }
}

//borders
.border {
    &-3x {
        border: 3px solid!important;
    }
    &-cinta {
        border-left: solid 7px;
        border-bottom: solid 7px;
    }
    &-cinta-right-bottom {
        border-right: solid 7px;
        border-bottom: solid 7px;
    }
    &-yellow-capita {
        border-color: $yellow-capita!important;
    }
    &-orange {
        border-color: $orange!important;
    }
    &-pink {
        border-color: $pink!important;
    }
    &-purple {
        border-color: $purple!important;
    }
    &-md {
        @media(max-width: $screen-md) {
            border: none!important;
        }
    }
    &-sm {
        @media(max-width: $screen-sm) {
            border: none!important;
        }
    }
}

//border radius
.rounded {
    &-1r {
        border-top-left-radius: 1rem!important;
        border-bottom-left-radius: 1rem!important;
        border-top-right-radius: 1rem!important;
        border-bottom-right-radius: 1rem!important;
        &-top {
            border-top-left-radius: 1rem!important;
            border-top-right-radius: 1rem!important;
            &-left {
                border-top-left-radius: 1rem!important;
            }
            &-right {
                border-top-right-radius: 1rem!important;
            }
        }
        &-bottom {
            border-bottom-left-radius: 1rem!important;
            border-bottom-right-radius: 1rem!important;
            &-left {
                border-bottom-left-radius: 1rem!important;
            }
            &-right {
                border-bottom-right-radius: 1rem!important;
            }
        }
    }
}

.rounded-pill {
    &-left {
        border-top-left-radius: 1rem!important;
        border-bottom-left-radius: 1rem!important;
    }
    &-right {
        border-top-right-radius: 1rem!important;
        border-bottom-right-radius: 1rem!important;
    }
    &-top-left-5r {
        border-top-left-radius: 5rem!important;
    }
    &-top {
        &-4 {
            border-top-left-radius: 1rem!important;
            border-top-right-radius: 1rem!important;
        }
        &-left {
            border-top-left-radius: 1rem!important;
        }
        &-right {
            border-top-right-radius: 1rem!important;
        }
    }
    &-bottom {
        &-4 {
            border-bottom-left-radius: 1rem!important;
            border-bottom-right-radius: 1rem!important;
        }
        &-right {
            border-bottom-right-radius: 1rem!important;
            &-3r {
                border-bottom-right-radius: 3rem!important;
            }
        }
        &-left {
            border-bottom-left-radius: 1rem!important;
        }
    }
}

//buttons
.btn {
    &-yellow-capita {
        background-color: $yellow-capita!important;
    }
    &-white {
        background-color: #ffffff;
        &:hover {
            background-color: $gray-200;
        }
    }
    &-purple-light {
        background-color: #7063CC;
    }
    &-outline{
        &-dark{
            border: solid 1px!important;
            &:hover {
                border-color: $dark !important;
            }
        }
        &-light{
            border: solid 1px!important;
            border-color: #ffffff!important;
            color: #ffffff!important;
            &:hover {
                border-color: $dark!important;
            }
        }
        &-wine{
            border: solid 1px #d578aa!important;        
            color: #c53b7a!important;
            &:hover {
                background-color: #c53b7a!important;
                color: white !important;
            }
        }
        &-category{
            &-0{
                border: solid 1px #f4c52c!important;        
                color: #f4c52c!important;
                &:hover {
                    background-color: #f4c52c!important;
                    color: white !important;
                }
                &.active {
                    background-color: #f4c52c!important;
                    color: white !important;
                }
            }
            &-1{
                border: solid 1px #363c8c!important;        
                color: #363c8c!important;
                &:hover{
                    background-color: #363c8c!important;
                    color: white !important;
                }
                &.active {
                    background-color: #363c8c!important;
                    color: white !important;
                }
            }
        }
    }
    &-black {
        background-color: #000 !important;
        color: #fff;
        font-size: 0.54rem;
        font-weight: 600;
        letter-spacing: 0px;
        padding: 0.3rem 0.5rem;
        &:hover {
            color: #fccd20!important;
        }
    }
    &-floting {
        &-goup {
            width: 3rem;
            height: 3rem;
            z-index: 1000;
            right: 1vh;
            top: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            font-weight: 900;
            line-height: 1.33;
            border-radius: 100%;
        }
    }
    &-download {
        background-color: #de8c66;
    }
    
}

//sizing
.vh {
    &-10 {
        height: 10vh!important;
    }
    &-15 {
        height: 15vh!important;
    }
    &-25 {
        height: 25vh!important;
    }
    &-35 {
        height: 35vh!important;
    }
    &-40 {
        height: 40vh!important;
    }
    &-50 {
        height: 50vh!important;
    }
    &-60 {
        height: 60vh!important;
    }
    &-70 {
        height: 70vh!important;
    }
    &-75 {
        height: 75vh!important;
    }
}

.mw {
    &-10 {
        min-width: 10%!important;
    }
    &-120x {
        min-width: 120px!important;
    }
}

.max-w {
    &-50 {
        max-width: 50%;
    }
    &-75{
        max-width: 75%;
    }
    &h-125x {
        max-height: 125px!important;
        max-width: 125px!important;
        @media (max-width: $screen-sm) {
            max-height: 5rem!important;
            max-width: 5rem!important;
        }
    }
    &-120x {
        max-width: 120px!important;
    }
}

.h {
    &-5r {
        height: 5rem!important;
    }
    &-15r {
        height: 15rem!important;
    }
    &-20r {
        height: 20rem!important;
    }
    &-30r {
        height: 30rem!important;
    }
    &-45r {
        height: 45rem!important;
    }
    &-70r {
        height: 70rem!important;
    }
    &-35 {
        height: 35%!important;
    }
    &-65 {
        height: 65%!important;
    }
    &-min {
        &-85 {
            min-height: 85%!important;
        }
        &-70 {
            min-height: 70%!important;
        }
        &-50 {
            min-height: 50%!important;
        }
    }
    &-max {
        &-50vh {
            max-height: 50vh!important;
        }
    }
}

//margins
.mt {
    &-10r {
        margin-top: 10rem;
    }
    &-n6 {
        margin-top: -9rem;
    }
    &-5vh {
        margin-top: 5vh;
    }
}

.m {
    &l {
        &-6 {
            margin-left: 7rem!important;
        }
    }
}

//padings
.p {
    &-6 {
        padding: 7rem!important;
    }
    &l {
        &-md {
            &-6 {
                @media (min-width: $screen-md) {
                    padding-left: 7rem!important;
                }
            }
        }
    }
    &b {
        &-6 {
            padding-bottom: 7rem!important;
        }
    }
}

.px {
    &-6 {
        padding-left: 7rem!important;
        padding-right: 7rem!important;
    }
}

//SIZE IMAGES
.image {
    &-cover {
        background-size: cover;
        background-repeat: no-repeat;
    }
    &-position {
        &-center {
            background-position: center 0%;
        }
    }
}

//Imagenes
.home {
    background-image: url(/images/backgrounds/CW_homepage_banner.png);
    background-size: cover;
    background-position: top;
}

.ourstory {
    background-image: url(/images/backgrounds/OurStory_background.png);
    background-size: cover;
    background-position: center right;
}

.solutions {
    background-image: url(/images/backgrounds/Solutions_background.png);
    background-size: cover;
    background-repeat: no-repeat;
    background-attachment: scroll;
    background-position: bottom right;
    @media (max-width: $screen-sm) {
        background-position: center right 20% !important;
    }
}

.howitworks {
    background-image: url(/images/backgrounds/how_it_works_background.png);
    background-size: cover;
    background-position: center right;
}

.privacy {
    background-image: url(/images/backgrounds/city.svg);
    background-size: cover;
    background-position: center right;
}

.industries {
    background-image: url(/images/backgrounds/Industries_background.png);
    background-position: center top;
    background-repeat: no-repeat;
    background-size: cover;
}

.meet-allstars {
    background-image: url(/images/backgrounds/frequenly_request_position_background.png);
    background-size: 100%;
    background-position: center center;
    background-repeat: no-repeat;
}

.whyus {
    background-image: url(/images/backgrounds/whyus_background.svg);
    background-position: center -25%;
    background-repeat: no-repeat;
    background-size: cover;
}

.resources {
    background-image: url(/images/backgrounds/resources_background.svg);
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    background-attachment: scroll !important;
}

.faqs {
    background-image: url(/images/backgrounds/faqs_background.svg);
    background-size: 80rem;
    background-position: 50% 35%;
    background-repeat: no-repeat;
    @media (max-width: $screen-lg) {
        background-size: 40rem;
    }
    @media (max-width: $screen-sm) {
        background-size: 20rem;
        background-position: center;
    }
}

.find-new-job {
    background-image: url(/images/backgrounds/find_new_job_background.svg);
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}

.headhunting {
    background-image: url(/images/backgrounds/headhunting_background.png);
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}

.power-process {
    background-image: url(/images/webinar/power-of-process/background.png);
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    background-attachment: fixed;
}

.power-process-white {
    background-image: url(/images/webinar/power-of-process/background2.png);
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}

.headhunting-mexicolatam {
    background-image: url(/images/headhunting_in_mexicolatam.png);
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}

.shared-services {
    background-image: url(/images/backgrounds/shared-services_background.png);
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}

.social-impact {
    background-image: url(/images/backgrounds/social-impact_background.svg);
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}
.muscle{
    background-image: url(/images/the_muscle.png);
    background-position-y: 8rem;
    background-size: cover;
    background-repeat: no-repeat;
}
//Imagenes FIN //
.ourFocus {
    object-fit: cover;
    width: auto;
}

.pc-ourfocus {
    padding-top: 2.7rem !important
}

.h-43-rem {
    height: 43rem !important;
}

.img-virtual-assistant {
    background-image: url(/images/card-virtual_assistant.png);
    background-position: 50% 50%;
    background-repeat: no-repeat;
}

.city {
    background-image: url(/images/backgrounds/City_background.png);
    background-size: cover;
    background-position: center right;
}

.learnkids {
    background-image: url(/images/capita-learn-bg1.svg);
    background-size: cover;
    background-position: center right;
}

.learnexecutive {
    background-image: url(/images/capita-learn-executive.png);
    background-size: cover;
    background-position: center right;
}

.ticket-purple {
    @media (min-width: $screen-md) {
        background-image: url(/images/ticket-azul.svg);
        background-color: transparent;
    }
    background-color: $purple;
    background-size: 100%;
    background-position: center;
}

.ticket-orange {
    @media (min-width: $screen-md) {
        background-image: url(/images/ticket-naranja.svg);
        background-color: transparent;
    }
    background-color: $orange;
    background-size: 100%;
    background-position: center;
}

.table-img {
    background-image: url(/images/table.svg);
    background-size: contain;
    background-repeat: no-repeat;
    @media (min-width: $screen-md) {
        background-position: center;
    }
}

.lupabig {
    background-image: url(/images/Lupabig.png);
    background-position: top right;
    background-repeat: no-repeat;
    background-size: contain;
}

.apple-mackbook {
    background-image: url(/images/Apple_Macbook_shadow.png);
    background-repeat: no-repeat;
    background-size: 100% 104%;
}

.earth-position {
    position: absolute;
    right: -2%;
    top: 0%;
    @media(max-width: $screen-md) {
        top: 6%;
    }
}

.rainbow-position {
    left: -23%;
    width: 122%;
}

.row>.earth-position {
    width: 50%!important;
}

.label-position-blade-sectioncolor {
    left: -20%;
    top: 13%;
    @media(max-width: $screen-xl) {
        left: -2%;
    }
    @media(max-width: $screen-lg) {
        left: -2%;
    }
    @media(max-width: $screen-md) {
        left: -2%;
    }
    @media(max-width: $screen-sm) {
        left: 1%;
        top: -4%;
    }
}

#lstearth {
    .nav-item {
        border-bottom: solid 1px;
        border-color: #ffffff;
        .nav-link {
            color: #ffffff;
        }
        &:hover {
            background-color: $purple;
        }
    }
}

#lstfrequentlyreq {
    .nav-item {
        border-bottom: solid 1px;
        .nav-link {
            color: black;
        }
        &:last-child {
            background-color: inherit!important;
        }
        &:hover {
            .nav-link {
                color: black!important;
            }
            background-color: $yellow-capita;
        }
    }
}

#lstfaqs {
    li {
        padding-top: 3rem;
        padding-bottom: 3rem;
        @extend .border-top,
        .border-dark;
        &:hover {
            background-color: $whitesmoke;
        }
    }
}

#BookKeper #lstwecanhelpu{
    display: block!important;
}

#lstwecanhelpu {
    display: -webkit-flex;
    display: flex;
    display: -ms-flexbox;
    -webkit-flex-flow: wrap column;
    flex-flow: wrap column;
    align-content: baseline;
    @media(min-width: $screen-xl) {
        max-height: 225px;
    }
    @media(max-width: $screen-xl) {
        max-height: 290px;
    }
    @media(max-width: $screen-xs) {
        max-height: none;
    }
    li {
        margin-right: 3rem!important;
        @media(min-width: $screen-xl) {
            min-width: 30%;
        }
        @media(max-width: $screen-xl) {
            min-width: 33%;
        }
        @media(max-width: $screen-md) {
            min-width: 55%;
        }
    }
}

.circulo {
    width: 3rem;
    height: 3rem;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    border-radius: 50%;
    &-dotted {
        left: 90%;
        bottom: -5%;
        border: 2px dotted white;
        width: 6rem!important;
        height: 6rem!important;
        -moz-border-radius: 50%!important;
        -webkit-border-radius: 50%!important;
        border-radius: 50%;
        @media(max-width: $screen-sm) {
            left: 80%;
        }
    }
}

//Navbar
.navbar {
    z-index: 20;
    .nav-item {
        padding-left: 3rem;
        padding-right: 3rem;
        .nav-link {
            color: #ffffff;
            font-size: 1rem;
        }
    }
    &.scroll {
        background-color: rgba(0, 0, 0, 0.9);
        transition: background 1s;
        top: 0%;
        .navbar-brand {
            background-image: url(/images/capita-logo.png?v=20250424.2)!important;
        }
        .nav-link {
            color: #fff!important;
        }
    }
    @media(max-width: $screen-lg) {
        background-color: rgba(0, 0, 0, 0.9);
    }
}

.navbar-brand {
    background-image: url(/images/capita-logo.png?v=20250424.2);
    background-size: contain;
    background-repeat: no-repeat;
    width: 210px;
    max-width: 210px;
    height: 120px;
    background-position: left center;
}


/*SIDEBAR*/

.sidebar {
    height: 100%;
    width: 100%;
    position: fixed;
    z-index: 50;
    top: 0;
    left: 100%;
    background-color: rgba(0, 0, 0, 0.9);
    overflow-x: hidden;
    padding-top: 60px;
    @mixin transition($transition) {
        -webkit-transition: $transition;
        -moz-transition: $transition;
        -o-transition: $transition;
        transition: $transition;
    }
    @include transition(all 0.3s ease-out);
    a {
        padding: 8px 8px 8px 20px;
        text-decoration: none;
        font-size: 1rem;
        color: white;
        display: block;
        transition: 0.3s;
        &:hover.colors {
            &-pink {
                background: #b23c7b;
            }
            &-creme {
                background: #d66558;
            }
            &-orange {
                background: #ee724d;
            }
            &-purple {
                background: #462ea3;
            }
            &-yellow {
                background: #f8c924;
            }
            &-gray {
                background: gray;
            }
        }
    }
    .closebtn {
        position: fixed;
        top: 0;
        right: 25px;
        font-size: 36px;
        margin-left: 50px;
    }
}

//posición images card we can help u
img[src*="images/card-virtual_assistant.png"] {
    left: calc(100% - 22.6rem);
    bottom: -22%;
    @media(max-width: $screen-xl) {
        bottom: -16%;
    }
}

img[src*="images/card-marketing_coordinator.png"] {
    left: calc(100% - 30.21rem);
    bottom: -22%;
    @media(max-width: $screen-xl) {
        bottom: -17%;
    }
}

img[src*="images/card-social_media.png"] {
    bottom: -20%;
    left: calc(100% - 34.5rem);
}

img[src*="images/card-graphic_designer.svg"] {
    bottom: -21.5%;
    left: calc(100% - 29.1rem);
    @media(max-width: $screen-xl) {
        bottom: -17.5%;
    }
}

img[src*="images/card-web_developer.png"] {
    bottom: 10%;
    left: calc(100% - 26.5rem);
}

img[src*="images/card-support_technician.png"] {
    bottom: 44%;
    left: calc(100% - 35.3rem);
}

img[src*="images/card-bookkeeper.png"] {
    bottom: 10%;
    left: calc(100% - 26.6rem);
}
img[src*="images/FRP_ContentCreator.png"] {
    left: calc(100% - 25rem);
    bottom: 82%;
    max-width: 27rem;
}
img[src*="images/FRP_VideoEditor.png"] {
    max-width: 24rem;
    bottom: 140%;
    left: calc(100% - 21rem);
}
img[src*="images/card-customer-service.png"] {
    bottom: 10%;
    left: calc(100% - 28.6rem);
}

img[src*="images/card-receptionist.png"] {
    bottom: 10%;
    left: calc(100% - 28.55rem);
}

img[src*="images/card-sales-representative.png"] {
    bottom: 10%;
    left: calc(100% - 26.3rem);
}

img[src*="images/card-business-development.svg"] {
    bottom: 10%;
    left: calc(100% - 32.3rem);
}

//SELECT2
.select2-container--default .select2-selection--single .select2-selection__rendered {
    line-height: 22px;
    font-size: 1rem;
}

.select2-container .select2-selection--single .select2-selection__clear {
    font-size: 2em;
    align-items: flex-end;
    @extend .d-flex;
}

.select2-container .select2-selection--single {
    height: 33px;
}

.select2-results__group {
    font-size: 1.3rem;
}

.select2-results {
    font-size: 1rem;
}
//Carousel
.carousel-indicators button {
    width: 10px !important;
    height: 10px !important;
    border-radius: 100%;
}

.w {
    &-90 {
        width: 90% !important;
    }
    &-15 {
        width: 15% !important;
    }
}

@for $i from 6 through 10 {
    .m {
        &t {
            &-#{$i} {
                margin-top: #{$i}rem !important;
            }
        }
        &y {
            &-#{$i} {
                margin-top: #{$i}rem !important;
                margin-bottom: #{$i}rem !important;
            }
        }
    }
}

.fs {
    &-5 {
        font-size: 1.22rem !important
    }
}

.min {
    &-vh {
        &-75 {
            min-height: 75vh !important;
        }
        &-10 {
            min-height: 10vh !important;
        }
    }
    &-h {
        &-120x {
            min-height: 120px!important;
        }
    }
}

.fs {
    &-7 {
        font-size: .85rem !important;
    }
}

//Resources
#article-content {
    a {
        color: #462ea3;
        &:hover {
            color: #b23c7b!important;
        }
    }
}

//social share
.social-share ul li{
    margin-bottom: inherit!important;
    a {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 2rem;
        height: 2rem;
        color: black;
    }
    a:hover {
        text-decoration: none !important;
    
    }
}

//paginator
.pagination {
    @extend .h4;
    .active {
        .page-link {
            @extend .bg-yellow-capita;
            border: none;
            color: #ffffff!important;
        }
    }
    .page-item {
        .page-link {
            color: $dark;
        }
    }
}

.sticky {
    @media(min-width: $screen-sm) {
        position: sticky;
    }
    z-index: 9;
    width: 100%;
    top: 0;
}

#cardTeam:hover .teamDescription {
    display: flex !important;
    background-color: #2b2b2bb4 !important;
    animation: fadeInAnimation ease 0.5s;
    backdrop-filter: blur(1px);
}

@keyframes fadeInAnimation {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

#cardTeam .teamDescription {
    display: none!important;
}

//intTelInput
.iti__country-list{
    li{
        font-size:1rem!important;
    }
}

select.form-control {
    -moz-appearance: auto!important;
     -webkit-appearance: auto!important;
     appearance: auto!important;
}

.form-check-input:checked {
    background-color: $yellow-capita!important;
    border-color: $yellow-capita!important;
}

.bg-preview-vi{
    background-image: url(/images/backgrounds/frequenly_request_position_background.png);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    min-height: 20rem; 
    position:relative; 
    display: grid;
}

//Loader
.loader-img {
    border: 16px solid #f3f3f3; /* Light grey */
    border-top: 16px solid #fccd20; /* Blue */
    border-radius: 50%;
    width: 100px;
    height: 100px;
    animation: spin 2s linear infinite;
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    margin: auto;
}
  
@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}
  
#container-loader{
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 9999;
    background-color: #00000096;
}

//secon navbar profile candidates
.second-navbar{
    .navbar-nav{
        a.nav-link{
            color: white!important;
            &:hover{
                color: $yellow-capita !important;;
            }
        }
    }
}


@media(max-width: $screen-lg) {
    .navbar-master-profile{
        position: fixed;
    }
}
@media(min-width: $screen-lg) {
    .navbar-master-profile{
        position: inherit;
    }
}

//summernote
#pro_resume_content,#aca_resume_content{
    p{
        margin-bottom: 0;
    }
}

.embed-interview-candidate iframe{
    top: -35px!important;
}

.list-dash{
    padding-left: 0; /* Elimina el padding izquierdo predeterminado del ul */
    li{
        position: relative; /* Hace que el li sea un contenedor de posición para el pseudo-elemento */
        padding-left: 20px; /* Añade espacio a la izquierda para el guión */
        &::before{
            content: "-"; /* Contenido del pseudo-elemento, en este caso, un guión */
            position: absolute; /* Posiciona el guión de manera absoluta dentro del li */
            left: 0; /* Posiciona el guión en el borde izquierdo del li */
        }
    }
}

#cookie-banner {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: rgba(0, 0, 0, 0.8);
    color: #fff;
    text-align: center;
    padding: 15px;
    font-size: 14px;
    z-index: 1000;
}