a{
    color: white;
    font-size: 18px;
    line-height: 1.5;
}
#container_login{
    width: 100%;
    height: 100%;
    overflow: hidden;
}


.header-navbar {
    align-items: center;
    display: flex;
    height: 5vw;
    padding: 0 32px;
    width: 100%;
}


#secction2_login{
    background-color: #644be9e0;
    height: 35vw;
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}



#login_access{
    background-color: white;
    padding: 2vw;
    border-radius: 2vw;
    width: 34vw;
    height: 30vw;
}


@media(min-width: 2025px) {
    #login_access{
        height: 23vw;
        margin-top: 3vw;
    }
}


#footer_login{
    background-color: #2167ae;
    height: 60%;
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
}


#footer_login>div:first-child{
    display: flex;
        width: 100vw;
        height: 63%;
        background-color: #2167ae;
        justify-content: space-around;
        align-items: baseline;
        padding: 3vw 0vw;
}


.redes_z{
    display: flex;
        width: 100%;
        justify-content: space-between;
        width: 10vw;
}

.safespace {
    width: 50%;
    height: 100%;
    overflow: hidden;
}

.safespace-circle {
    height: 41vw;
    width: 46vw;
    position: relative;
    right: -6vw;
    top: -6vw;
}

.safespace-circle img, .safespace-circle video {
    height: 100%;
    width: auto;
    position: relative;
    right: 6vw;
}

.shape-decoration {
    position: relative;
    z-index: 100;
    top: 39vw;
    right: 38.3vw;
    transform: rotate(2deg);
}

.shape-decoration--stage-one .shape-decoration-half-mask {
    bottom: 5.7vw;
    height: 4vw;
    transform: rotate(38deg);
    width: 12vw;
    left: 0vw;
}

.shape-decoration--stage-one .shape-decoration-half-mask-circle {
    background-color: #2167ae;
    height: 10vw;
    width: 9vw;
}

.shape-decoration--stage-one .shape-decoration-mini-circle {
    background-color: #5495cf;
    bottom: 11vw;
    height: 2vw;
    left: 1.2vw;
    width: 2vw;
}

.shape-decoration--stage-one .shape-decoration-midi-circle {
    background-color: #91bfe3;
    bottom: 4.1vw;
    height: 4vw;
    left: -0.5vw;
    width: 4vw;
}




#secction2_login>div:first-child{
    width: 50%;
    padding: 2vw;
    margin: 0vw 5vw;
}

footer ul.link-list li a {
    color: white;
    font-size: 1vw;
    line-height: 0;
    text-decoration: none;
    font-family: 'ZurichSans-Light';
}


@media (min-width: 2025px) {
    footer ul.link-list li a {
        color: white;
        font-size: 0.6vw;
        line-height: 1vw;
        text-decoration: none;
        font-family: 'ZurichSans-Light';
    }

    .footer_message>p{
font-size: 0.8vw;
    }


    .section>img{
        width: 14vw;
    height: auto;
    }

    #send_code{
    font-size: 0.8vw;
    width: 9vw;
    height: 2vw;
    margin-top: 2vw;
    }


.message_proccess{
    font-size: 0.6vw;
}

.code_field{
    min-height: 1vw;
    padding: calc(1.25rem + var(--_padding-extra)) calc(var(--zs-100) + var(--z-input--padding-right, 0px)) calc(var(--zs-25) + var(--_padding-extra)) var(--zs-150);
    border: 0.5vw solid transparent;
    background-color: #efecec;
    box-sizing: border-box;
    width: 4vw;
    border-right: 0.1vw solid #5495cf;
    color: #5495cf;
    text-align: center;
    font-size: 1.2vw;
    font-family: 'ZurichSans-Regular';
    height: 3vw;
}


.button_vc
 {
    cursor: pointer;
    background-color: #428351;
    border-radius: 0vw 2vw 2vw 0vw;
    color: white;
    font-family: 'ZurichSans-Light';
    font-size: 1vw;
    text-align: center;
    height: 3vw;
    width: 6vw;
    text-decoration: none;
}


output {
    align-content: center;
    padding: 0 1vw;
    display: grid;
    color: var(--z-br-primary);
    border: 2px solid var(--z-br-inactive);
    height: 3vw;
    max-width: max-content;
}

}




footer .heading-h5, footer h5 {
    font-size: 20px;
    line-height: 1.4;
    color: white;
}

a.icon, button.icon {
    color: white;
    font-family: ZurichSans-Regular, Arial, sans-serif;
    font-size: 1.6vw;
    height: auto;
    padding-left: 25px;
    position: relative;
    text-align: inherit;
    text-decoration: none;
    width: auto;
}


.footer_message{
    display: flex;
        width: 100%;
        flex-direction: column;
        align-items: center;
        color: white;
        font-size: 1vw;
        justify-content: flex-end;
}


ul.link-list {
    margin-left: 0;
    margin-top: 24px;
    padding-bottom: 0;
    padding-top: 0;
    margin-right: 5vw;
}


.segmented-control {
    width: fit-content;
    background-color: white;
    padding: 0.1vw;
    height: 2.3vw;
  }
  
  .segmented-control > div {
    left: 0vw;
    width: 100%;
    height: 100%;
    display: flex;
    border: 0.1vw solid silver;
    border-radius: 3em;
  }
  
  .tag{
    width: 50%;
    display: flex;
    align-items: center;
  }
  
  
   .tag>input+label {
    color: #fff;
    z-index: 2;
    position: relative;
    font-size: 0.7vw;
  }
  
  .segmented-control>div>div:nth-child(2)>input+label {
    color: #2167ae;
    z-index: 2;
    position: relative;
    font-size: 0.7vw;
  }
  
  .segmented-control .highlights {
    background-color: #156bc3;
    border-radius: 3em 0 0 3em;
    position: absolute;
    transition: all .5s ease-in-out;
    width: 50%;
    left: 0.3vw;
    height: 1.7vw;
    top: 0.3vw;
  }
  

#authen_div{
    position: fixed;
    width: 100vw;
    height: 100%;
    z-index: 100;
    top: 0;
    background-color: rgba(0, 0, 0, 0.5);
    display: none;
    
}

#authenticator{
    width: 58vw;
    height: 24vw;
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: fixed;
    top: 20%;
    left: 20%;
    z-index: 100;
    background-color: white;
    padding: 2vw;
    border-radius: 2vw;
    opacity: 1;
}   


#authenticator>div:first-child{
    width: 70%;
    height: 16vw;
}


#authenticator>div:last-child{
    width: 25%;
    display: flex;
    flex-direction: row;
}


#authenticator>div{
    display: flex;
        flex-direction: column;
        align-items: flex-start;
        justify-content: space-between;
        flex-wrap: nowrap;
}


#grup_code{
    width: 100%;
    height: 3vw;
    display: flex;
    align-items: center;
    margin: 0.5vw 0;
}

.code_field{
    min-height: 1vw;
    padding: calc(1.25rem + var(--_padding-extra)) calc(var(--zs-100) + var(--z-input--padding-right, 0px)) calc(var(--zs-25) + var(--_padding-extra)) var(--zs-150);
    border: 0.5vw solid transparent;
    background-color: #efecec;
    box-sizing: border-box;
    width: 4.7vw;
    border-right: 0.1vw solid #5495cf;
    color: #5495cf;
    text-align: center;
    font-size: 1.2vw;
    font-family: 'ZurichSans-Regular';
    height: 3.5vw;
}


.button_vc{
    cursor: pointer;
    background-color: #428351;
    border-radius: 0vw 2vw 2vw 0vw;
    color: white;
    font-family: 'ZurichSans-Light';
    font-size: 1.2vw;
    text-align: center;
    height: 3.5vw;
    width: 7vw;
    text-decoration: none;
}

.button_vc:hover {
    background-color: #5495cf;
  }

  .message_proccess{
    color: var(--Brand-Zurich-Blue, var(--Brand-Zurich-Blue, #2167AE));
font-family: "Zurich Sans";
font-size: 12px;
font-style: italic;
font-weight: 300;
line-height: 18px; /* 150% */
}


output{
    align-content: center;
    padding: 0 1vw;
    display: grid;
    color: var(--z-br-primary);
    border: 2px solid var(--z-br-inactive);
    height: 3.4vw;
    max-width: max-content;
}

.data_title>div>p{
    font-size: 0.8vw;
    color: var(--Brand-Zurich-Blue, var(--Brand-Zurich-Blue, #13589c));
    font-family: "Zurich Sans";
    padding-left: 0.3vw;
    font-weight: 700;
    margin-top: 0.5vw;
}