@font-face {
  font-family: "Metropolis-Regular";
  src: url("../fonts/Metropolis-Regular.otf") format("opentype"),
      url("../fonts/Metropolis-Regular.woff") format("woff");
}
@font-face {
  font-family: "Metropolis-Bold";
  src: url("../fonts/Metropolis-Bold.otf") format("opentype"),
      url("../fonts/Metropolis-Bold.woff") format("woff");
}

@font-face {
  font-family: "Metropolis-ExtraLight";
  src: url("../fonts/Metropolis-ExtraLight.otf") format("opentype"),
      url("../fonts/Metropolis-ExtraLight.woff") format("woff");
}

  @font-face {
    font-family: "Metropolis-Light";
    src: url("../fonts/Metropolis-Light.otf") format("opentype"),
        url("../fonts/Metropolis-Light.woff") format("woff");
  }

  @font-face {
    font-family: "Metropolis-Thin";
    src: url("../fonts/Metropolis-Thin.otf") format("opentype"),
        url("../fonts/Metropolis-Thin.woff") format("woff");
  }
  @font-face {
    font-family: "Metropolis-LightItalic";
    src: url("../fonts/Metropolis-LightItalic.otf") format("opentype"),
        url("../fonts/Metropolis-LightItalic.woff") format("woff");
  }
  @font-face {
    font-family: "Metropolis-Medium";
    src: url("../fonts/Metropolis-Medium.otf") format("opentype"),
        url("../fonts/Metropolis-Medium.woff") format("woff");
  }
  @font-face {
    font-family: "Metropolis-SemiBold";
    src: url("../fonts/Metropolis-SemiBold.otf") format("opentype"),
        url("../fonts/Metropolis-SemiBold.woff") format("woff");
  }



*{
    margin: 0;
    padding: 0;
}

html{
    font-family: "Metropolis-Regular";
    background: #202C35;
}


/* HEADER */
body > header{
    width: 100%;
    position: relative;
    background-image: url('../img/header-verde-oscuro.png');
    background-position: center;
    background-size: cover;
}
header {
  width: 100%;
  position: relative;
  background-position: center;
  padding: 4rem 0;
}
.cta{
  padding-left: 10%;
  padding-right: 10%;
    font-size:4vw;
}
.tit{
  font-size:4vw;
  color:#ffffff;
  text-align:center;
}

#container_logos{
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-evenly;
    -webkit-justify-content: space-evenly;
    position: relative;
    margin-bottom:3%;
    flex-wrap: wrap;
}
.box_logo{
  margin-bottom: 3%!important;
}

@media only screen and (max-width: 900px) {

    #container_logos h1{
        font-size: 1.5em !important;
        text-align: center;
    }
    .tit .cta{
        font-size:4.5vw;
    }

    .logo_subtitle{
        width: 80% !important;
        padding: 5% 0;
        font-size: 3vw !important;
        -webkit-font-size:3vw !important;
    }
    .box_logo{
        width: 80% !important;
    }
    .box_logo img{
        height: auto !important;
        width: 90% !important;
        -webkit-height: 60px;
    }
  }

  @media (orientation:landscape) and (max-width: 1000px) {

    #container_logos h1{
        font-size: 1.5em !important;
        text-align: center;
    }


    .logo_subtitle{
        width: 100%;
        padding: 5% 0;
        font-size: 1em !important;
    }
    .box_logo{
        width: 40% !important;
    }

    #logo_subtitle_2{
        font-size: 0.9em !important;
    }
  }



#container_logos h1{

    font-size: 4.5vw;
    text-align: center;
    font-family: "Metropolis-Bold";
    color: white;
    margin-bottom: 2rem;
    width:100%;
}

.box_logo{
    width: 20%;
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
    align-items: center;
    text-align:center;
    font-family: "Metropolis-Bold";
}

.box_logo img{
    width: 100%;
}

.logo_subtitle{
    width: 100%;
    display: flex;
    align-items: center;
    text-align:left;
    padding: 5% 0;
    font-size: 1.5vw;
}
.logo_subtitle h4 {
  margin-left: 1em;
}

div#logo_subtitle_1 {
    /* width: 60%; */
}
#logo_subtitle_1{
    color: white;
}
#logo_subtitle_1 h5{
  font-size: 2.4vw;
    /* line-height:2.6vw; */
    text-align:justify;
    color: white;
}

#logo_subtitle_2{
    color: #333F48;
}

#logo_number_1{
    background-color: #777376;
    padding: 2vh;
    border-radius: 50px;
}

#logo_number_2{
    background-color: white;
    padding: 2vh;
    border-radius: 50px;
}

/*----------------------------- BENEFICIOS SECTION v1 ---------------*/

#primeros_beneficios{
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
    align-items: center;

    color: white;
    margin: 5vh 0 50px 0;
}

#container_check_inicio{
    width: 100%;
    display: flex;
    justify-content: center;
}

@media only screen and (max-width: 768px) {
    #primeros_beneficios h1, #header h1{
        font-size:2.5em !important;
        margin-block-end: 5vh;
    }
    table{
        display: flex;
        font-size: 1em !important;
    }
    .img_table_inicio{
        width: 30% !important;
    }

}

@media (orientation:landscape) and (max-width: 1000px) {
    #primeros_beneficios{
        margin-top: 20vh;
    }
    #primeros_beneficios h1, #header h1{
        font-size:2.5em !important;
    }
    .img_table_inicio{
        width: 10% !important;
    }


}

#primeros_beneficios h1, #header h1{
    text-align: center;
    font-family: "Metropolis-Bold";
    font-size:4em;
    margin-block-end: 5vh;
}


#inicio_table{
    position: relative;
    width: 90%;
}

#inicio_table img{
    width: 40%
}

.img_table_inicio{
    width: 10%;
    text-align:center;
}


/*----------------------- HCI SECTION -----------------*/
section{
    width: 100%;
}

#container_text_vdi{
    display: flex;
    flex-direction: column;
    align-items: center;
    font-size: 1.6em;
    font-family: "Metropolis-Light" !important;
    background: #202C35;
    color: white;
    text-align: center;
    position: relative;
}

#container_text_vdi header{
    background-image: url('../img/banner_header_2.png');
    background-repeat: no-repeat;
    background-size:cover;
    text-align: center;
    display: flex;
    justify-content:center;
    align-items: center;
    flex-direction: column;
    color: white;
    font-family: "Metropolis-Bold";
}

#container_text_vdi header h1{
  font-size: calc(1.5vw + 1em);
  margin-top: 9vh;
}

@media only screen and (max-width: 768px) {
    #container_text_vdi header{
        background-image: url('../img/banner_header_2.png');
        background-repeat: no-repeat;
        background-size: cover;
        text-align: center;
    }

    #container_text_vdi header p{
        font-size: 1em;
    }
    #container_text_vdi p{
        width: 80%;
        padding:0 10%;
        font-size: 1em !important;
    }

}

@media (orientation:landscape) and (max-width: 1000px) {
    #container_text_vdi header{
        background-size: cover;
    }
}


#container_text_vdi header p{
    font-family: "Metropolis-Light";
}


#container_text_vdi p{
    width: 80%;
    color: white;
    font-family:  "Metropolis-Thin";
    padding:0 10%;
    font-size: 1em;
}


.subtitle{
    margin:1% 0 5% 0;
    font-size: 1.7em;
    text-align: center;
   font-family:"Metropolis-ExtraLight" ;
    color: #92C148;
}

#container_product_vdi{
    padding:5%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-evenly;

    margin-top: 30px ;
}
.infovidi_hci{
  display: none!important;
}
.container_info_vdi{
  padding: 20px 0px;
    padding-left:5%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: relative;
    /* display: none; */
    width: 90%;
    border: 3px solid #92C148;
    border-radius: 10px;
    margin-bottom: 1rem;
    background: linear-gradient(90deg, rgba(255,255,255,0.3) 0%, rgba(51,63,72,1) 51%, rgba(32,44,53,1) 100%);
}
.container_buttons{
    position: absolute;
    text-align: center;
    left: -50px;
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
    width: 90px;
}


@media only screen and (max-width: 768px) {

    .container_info_vdi{
        padding-left:5%;
        width: 80%;
    }
    .colum1_vdi{
        width: 80%;
        margin-left: 5vh;
    }
    .colum2_vdi{
        width: 80%;
    }
    .info_import h1, h2{
        font-size: 1em !important;
    }
    .info_import p{
        font-size: 1em !important;
    }
    .pie_nota{
        font-size: 0.7em !important;
    }
    .info_adicional{
        font-size:1em;
    }

    .texto_1{
        font-size: 0.8em !important;
    }
    .texto_2{
        font-size: 0.8em !important;
    }

    .img_info img{
        width: 100% !important;
    }
    .container_buttons{
        left: -25px;
        height: 30vh;
        width: 50px;
    }
    .pestana_vdi{
        height: 60px !important;
            font-size: 10px;
    }


}

@media (orientation:landscape) and (max-width: 1000px) {

    .container_info_vdi{
        padding-left:5%;
        width: 80%;
    }
    .colum1_vdi{
        width: 50%;
        margin-left: 5vh;
    }
    .colum2_vdi{
        width: 50%;
    }
    .img_info{
        width: 70% !important;
    }
    .img_info img{
        height: auto !important;
        width: 80% !important;
    }
    .pie_nota{
        font-size: 0.9em !important;
    }
    .info_adicional{
        font-size: 0.9em !important;
    }
    .container_buttons{
        height: 50vh;
    }
    .info_import h1, h2{
        font-size: 1.5em !important;
        font-family:  "Metropolis-Bold";
    }

    .info_import p{
        font-size: 1.3em !important;
        color: #AAAAAA;
        font-family: "Metropolis-Thin";
    }

}


.colum1_vdi{
    display: flex;
    flex-direction: column;
    align-items: left;
    justify-content: space-evenly;
    width: 50%;
    margin-left: 5vh;
}
.colum2_vdi{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-evenly;
    width: 50%;
    text-align: center;
}


#productos_select{
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-evenly;
}
#titles_pr{
    text-align: center;
}

#container_info_product{
    display: flex;
    justify-content: center;
}

.container_info_pr{
    display: flex;
    flex-direction: column;
    align-items: center;
}

.info_import{
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
    color: white;
}

.info_import h1, h2{
    font-size: 3rem;
    font-family:  "Metropolis-Bold";
}

.info_import p{
    font-size: 2rem;
    color: #AAAAAA;
    font-family: "Metropolis-Thin";
}

.info_adicional{
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
    color: #AAAAAA;
    margin-top: 2rem;
}

.pie_nota{
    font-family: "Metropolis-LightItalic";
    font-size: 0.8em;
    margin-top:1rem;
    color:#AAAAAA;
}

.info_adicional h4{
    color: white;
    font-family:  "Metropolis-Bold";
    font-size: calc(1vw + 0.6rem);
}

.img_info{
    width: 100%;
    background: #92C148;
    border-radius: 5px;
    color: white;
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
    /* align-items: center; */
    padding:1rem;
}
/* .img_info img{
    width: 50%;

} */


.texto_1{
    font-family:  "Metropolis-Regular";
    font-size: 1em;
    margin: 1rem 0;
}
.texto_2{
    font-family:  "Metropolis-Bold";
}

.pestana_vdi{
    background: #39662A;
    color: white;
    height: 90px;
    font-family:  "Metropolis-Bold";
    display: flex;
    border-radius: 10px;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    margin-bottom:10px;
}

.pestana_vdi:hover{
    background: rgb(78, 134, 59);
}

.desactive{
    background: #39662A;
    color: white;
    height: 90px;
    font-family:  "Metropolis-Bold";
    display: flex;
    border-radius: 10px;
    justify-content: center;
    align-items: center;
    cursor: pointer;
}

#button_vdi_active{
    background: #92C148;
    box-shadow: 10px 10px 16px -9px rgba(30,112,66,1);
    box-shadow: inset 10px -7px 37px 0px rgba(66,122,47,1);
}



/* SELECCIONAR PRODUCTO  */

#productos_select{
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-evenly;
    padding-block-end: 20vh;
}

@media only screen and (max-width: 768px) {



    .container_info_pr{
        width: 45% !important;
    }



    .container_info_pr h1{
        font-size: 1em !important;
    }
    .producto_title{
        font-size: 1em !important;
    }
    .descripcion{
        font-size: 0.5em;
    }
    #titlesft{
        padding: 5% 2%;
        font-size: 1em !important;
        text-align: center;
        margin-block-end: 0 !important;
    }
}

@media (orientation:landscape) and (max-width: 1000px) {

}

#titles_pr{
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-evenly;
    margin-bottom: 3rem;
}

#titles_pr h1{
    color: #92C148;
    font-family:  "Metropolis-Bold";
    font-size: calc(1.5vw + 1.1em);
}

#titles_pr h6{
    color: #B2B2B2;
    font-family:  "Metropolis-Thin";
    font-size: calc(0.8vw + 1em);
        margin-top: 1rem;
}

#container_info_product{
    width: 80%;
    display: flex;
    justify-content: space-evenly;
    color: white;
}

.container_info_pr{
    width: 30%;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    cursor: pointer;
    padding:1rem;
}

.container_info_pr img{
    width: 60%;
}

.container_info_pr h1{
    font-family:  "Metropolis-Bold";
    font-size: 2em;
    margin:2rem 0;
}

.producto_title{
    font-family:  "Metropolis-Light";
    font-size: 2em;
    margin-top: 2rem;
}

.container_info_pr p{
    font-family: "Metropolis-Thin";
}

#product_active{
    border: 3px solid #92C148;
    border-radius: 10px;
}

#titlesft{
    padding: 5% 0;
    color: #92C148;
    font-family:  "Metropolis-Bold";
    font-size: 2em;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align:center;
}

#titlesft img{
    width: 20%;
}

/* SEGUNDA SECCIÓN  */

@media only screen and (max-width: 768px) {
    body #hci_section header{
    top: -20vh;
        padding: 4rem 0;
    }



    #titlesft img{
        width: 20% !important;
    }


    #hci_container{
        top:40vh !important;
    }

    #product_hci{
        height: auto !important;
        padding: 5%
    }

    #hci_section header h1{
        font-size: 2em !important;
    }
    body #parrafo_hci{
        font-size: 1em;
        padding-top:8rem;
    }

    #titles_product_hci #titles_1 h1{
        font-size: 1em  !important;
    }

    #titles_product_hci #titles_1 p{
        font-size: 1em !important;
    }

    #titles_product_hci #titles_22 h1{
        font-size: 1.5em !important;
    }

    #titles_product_hci #titles_22 p{
        font-size:1em !important;
    }
    #parrafo_desc{
        font-size: 0.9em !important;
    }
    #espec_tecnicas{
        font-size: 0.7em;
    }


    #container_img{
    width: 40%;
    height: auto !important;
}

#container_img img{
}

#container_buttons{
    top: 115vh !important;
    padding: 0 2%;
    width: 96% !important;
}

.button_hci{
    background-color: #92C148;
    padding: 2% 2%;
    width: auto !important;
    text-align: center;
    border-radius: 10px;
    color: white;
    font-family: "Metropolis-Bold";
}

.hci_desactive{
    background-color: #92C148;
    padding: 2% 2%;
    width: auto !important;
    text-align: center;
    border-radius: 10px;
    color: white;
    font-family: "Metropolis-Bold";
}
}

@media (orientation:landscape) and (max-width: 1000px) {
    #hci_container{
        top: 70vh !important;
    }
    #container_buttons{
        top: 150vh !important;
        padding: 0 2%;
        width: 96% !important;
    }
    #container_img img{
    }
}
#hci_section{
    width: 100%;
    background-image: url('../img/background_1.jpg');
    position: relative;
    padding-bottom:11rem;
}

#hci_section header{
    background-image: url('../img/banner_header__1.png');
    background-repeat: no-repeat;
    background-size: cover;
    position: absolute;
    top: -30vh;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    padding: 7rem 0;
}

#hci_section header h1{
    color: white;
    font-family:  "Metropolis-Bold";
    font-size: calc(2vw + 1em);
    /* margin-bottom:9vh; */
}

#hci_section header p{
  width: 100%;
  color: white;
  font-family: "Metropolis-Thin";
  padding: 0 10%;
  font-size: 2em;
  margin-bottom:3rem;
}

#parrafo_hci{
    width: 100%;
    color: white;
    font-family:  "Metropolis-Thin";
    padding: 5% 10%;
    padding-top:12rem;
    font-size: 1.7em;
}

    /* Container product /*/

#hci_container{
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: space-evenly;
    color: white;
    flex-direction: column;
}

#hci_container h1{
    font-family: "Metropolis-Bold";
}

#product_hci{
    width: 80%;
    display: flex;
    flex-direction: column;
    align-items: left;
    justify-content: space-evenly;
    background: linear-gradient(90deg, rgba(32,44,53,1) 0%, rgba(146,193,72,1) 100%);
    border-radius: 50px;
    z-index: 1;
    padding:3rem 5%;
}

#titles_product_hci{
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
    align-items: left;
        margin-bottom: 1.5rem;
}

#titles_product_hci #titles_1 h1{
    font-family: "Metropolis-Bold";
    font-size: 3em;
}

#titles_product_hci #titles_1 p{
    font-family: "Metropolis-ExtraLight";
    font-size: 1.3em;
    color: #dddddd;
}

#titles_product_hci #titles_22 h1{
    font-family: "Metropolis-Bold";
    font-size: 3em;
}

#titles_product_hci #titles_22 p{
    font-family: "Metropolis-ExtraLight";
    font-size: 3em;
    color: #dddddd;
}

#desc_e_img{
    width: 100%;
    display: flex;
    justify-content: space-evenly;
    padding: 2% 0;
    align-items:center;
}

#container_img{
    width: 40%;
    display: flex;

    justify-content: center;
}

#container_img img{
    width: 50%;
    height:auto;
}

#container_desc{
    display: flex;
    flex-direction: column;
    align-items: left;
    justify-content: space-evenly;
    height: 100%;
    width: 60%;
}

#parrafo_desc{
    font-size: 1.7em;
    font-family: "Metropolis-Medium";
    margin-bottom:1rem;
    margin-top:1rem;
}

#container_buttons{
    width: 100%;
    display: flex;
    justify-content: space-evenly;
    align-items: center;
    margin-top:2rem;
    margin-bottom: 2rem;
}

/*.linea{
  border-left: 3px solid #92C148;
height: 90px;
position: absolute;
visibility: hidden;
z-index: 0;
right: 50%;
top: -79%;
}*/

.button_hci{
    background-color: #92C148;
    padding: 2% 2%;
    width: 15%;
    text-align: center;
    border-radius: 10px;
    color: white;
    font-family: "Metropolis-Bold";
    font-size: calc(2vw + 0.1rem );
    border: 3px solid #92C148;
    cursor: pointer;
    position:relative;
}

#button_active{
    background-color: rgba(255, 255, 255, 0);
    border: 3px solid #92C148;
    border-radius: 5px;
}

#linea_active{
    visibility: visible;
}
.desaparecer{
    visibility: hidden;
}


/* ----------------------- THINK AGILE SECTION  --------------- */

@media only screen and (max-width: 768px) {


    #container_esquemas{
        width: 100%;
        display: flex;
        flex-wrap: wrap;
    }
    .box_esquemas{
        width: 70% !important;
        padding: 5%;
    }
    .title_esquema{
        font-size: 2em !important;
        font-family: "Metropolis-Thin";
        color: white;
        text-align: center;
    }
    #beneficios_section{
        height: auto;
    }
    #img_esquema img{
        height: 262px !important ;
    }
}

@media (orientation:landscape) and (max-width: 1000px) {
    #think_agile_section{
        width: 100%;
        position: relative;
    }

    #container_esquemas{
        width: 100%;
        display: flex;
        justify-content: space-evenly;
        align-items: center;
        height: auto;
    }
    .img_esquema img{
        width: 50% !important;
    }
    .title_esquema{
        font-size: 1.5em !important;
        font-family: "Metropolis-Thin";
        color: white;
        text-align: center;
    }
    .box_esquemas{
    width: 40%;
    display: flex;
    height: auto !important;
    flex-direction: column;
    align-items: center;
    justify-content: space-evenly;
}

}

#think_agile_section{
    width: 100%;
    position: relative;
}

#think_agile_section header{
    background-image: url('../img/banner_header_2.png');
    background-repeat: no-repeat;
    background-size: cover;
    position: absolute;
    top: -20vh;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
    color: white;
    font-size: 4em;
    font-family: "Metropolis-Bold";
}

#think_agile_section header h1{
      font-size: calc(3vw + 1rem);
      margin-top:3rem;
}

#container_esquemas{
    width: 100%;
    display: flex;
    justify-content: space-evenly;
    align-items: center;
    padding-block-end: 10vh;
    padding-top:12rem;
}

.box_esquemas{
    width: 40%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-evenly;
    padding:2rem;
}

.title_esquema{
    font-size: 3em;
    font-family: "Metropolis-Thin";
    color: white;
    text-align: center;
}

.img_esquema{
    width: 90%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.img_esquema img{
    width: 70%;
}

#esquema_active{
    border: 5px solid #92C148;
    border-radius: 10px;
    background: url('../img/check_icon_esquema.png');
    background-repeat: no-repeat;
    background-size: 13%;
    background-position:right 2% top 1%;
        padding: 5rem 2rem;
}

#subtext_esquema{
    font-family: "Metropolis-Bold";
    color: white;
    font-size: calc(2vw + 0.8em);
    text-align: center;
    margin-top:2rem;
}


/* ----------------- Beneficios Section  ---------------*/

@media only screen and (max-width: 768px) {

    #beneficios_section header h1{
        font-size: 0.7em !important;
        top: 23vh !important;
    }
    #beneficios_section header p{
        top: 27vh !important;
        font-size: 0.5em !important;
    }
    #container_check{
        width: 100%;
        top: 110vh !important;
    }
    #container_check table{
        width: 90% !important;
    }
    #container_check table td:nth-child(1){
        width: 20%;
    }
    #container_check table td img{
        width:50% !important;
    }
}


@media (orientation:landscape) and (max-width: 1000px) {


    #beneficios_section header h1{
        top: 25vh !important;
    }
    #beneficios_section header p{
        top: 35vh !important;
    }
    #container_check{
        top: 130vh !important;
    }
    #container_check table td img{
        width:50% !important;
    }
    #container_check table{
        width: 70% !important;
        text-align: left;
    }
    #container_check table td:nth-child(1){
        width: 10%;
    }
}

#beneficios_section{
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: left;
    justify-content: space-evenly;
    position: relative;
}

#beneficios_section header{
    background-image: url('../img/banner_header_2.png');
    background-repeat: no-repeat;
    background-size: cover;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    color: white;
    font-size: 3em;
    font-family: "Metropolis-Bold";
}

#beneficios_section header h1{
  font-size: calc(1.5vw + 1em);
margin-top: 4rem;
}

#beneficios_section header p{
    font-family: "Metropolis-Light";

}


#container_check{
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-evenly;
    margin-bottom:5rem;
    margin-top:3rem;
}

.check_c{
    width: 80%;
    display: flex;
    justify-content: left;
    align-items: center;
}

.img_check img{
    width: 30%;
}

.text_check{
    color: white;
    font-size: 2em;
    font-family: "Metropolis-Light";
}

table{
    width: 50%;
    color: white;
    font-size: 2em;
}

table tr{
    padding: 5% 2%;
    width: 100%;
    margin: 5% 0;
    height: 15vh;
}


table td img{
    width:12%;
        padding-right: 3rem;
}


@media only screen and (max-width: 768px) {
    footer{
        flex-wrap: wrap;
        padding: 7% 0;
    }
    #legal{
        width: 100% !important;
        font-family: "Metropolis-Bold";
        color: white;
        font-size: 1em !important;
        display: flex;
        flex-direction: row !important;
        justify-content: space-evenly;
        text-align: center;
        height: auto !important;
    }
    #contacto{
        display: flex;
        flex-direction: column;
        justify-content: space-evenly;
        align-items: center;
        text-align: center;
        height: auto !important;
        color: white;
        padding-top: 5%;
        font-size: 1em !important;
        width: 80% !important;
        font-family: "Metropolis-Thin";
    }
    #redes{
        width: 100% !important;
        display: flex;
        flex-direction: row !important;
        justify-content: space-evenly;
        align-items: center;
    }


    footer h6{
        position: absolute;
        color: white;
        font-size: 0.7em !important;
        font-family: "Metropolis-Thin";
        bottom:1vh !important;
        margin: 5% 0;
    }

}

@media (orientation:landscape) and (max-width: 1000px) {


}

footer{
    background: #5AA040;
    display: flex;
    justify-content: space-evenly;
    align-items: center;
    position: relative;
    padding: 4rem 0 0 0;
}

#popup .modal-header
{
    background-color: #5AA040;
    color: #fff;
}

#popup .modal-body
{
    background-color: #202C35;
}

#popup input
{
    background-color: #202C35;
    color: #fff;
}

#popup input::placeholder
{
    color:#fff;
}

#popup button
{
    background-color: #5AA040;
    color: #fff;
}


#legal{
    width: 20%;
    font-family: "Metropolis-Bold";
    color: white;
    font-size: 1.5em;
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
    text-align: center;
    height: 40vh;
}
#legal h3 a {
  color:white;
  text-decoration: none;
}
#legal h3 a:hover {
  color:white;
  text-decoration: none;
}

#contacto{
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
    align-items: center;
    text-align: center;
    color: white;
    font-size: 1.5em;
    width: 30%;
    font-family: "Metropolis-Thin";
}

#contacto h4{
    font-family: "Metropolis-Bold";
}

.info_contacto{
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
    align-items: center;
    height: 35%;
}

#redes{
    width: 20%;
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
    align-items: center;
    text-align:center;
}

#redes img{
    width: 30%;
}

footer h6{
    position: absolute;
    color: white;
    font-size: 1.3em;
    font-family: "Metropolis-Thin";
    bottom: 5vh;
    text-align: center;
}

@media (max-width: 1400px) {
  body #container_img img {
    width:100%;
  }
}
@media (max-width: 768px) {
  body #think_agile_section header h1 {
    margin-top:1rem
  }
  body #container_esquemas {
    padding-top:3rem;
  }

  body table tr {
    height:auto;
  }
  body table tr td {
    padding:10px 0px;
  }
  body .container-pie-nota {

    width:90%;
  }
  body #hci_section header p {
    font-size: 1.5em;
  }
}

@media (max-width: 425px) {
  body #container_text_vdi p {
    font-size: 0.6em !important;
  }

  div#logo_subtitle_1 {
      width: 90%;
  }

  #logo_subtitle_1 h5{
    font-size: 4.4vw;
      line-height:4.6vw;
      text-align:center;
      color: white;
  }

  body > header {
    padding-top:4rem;
  }
  body #primeros_beneficios {
    margin: 6rem 0 0 0;
  }
  body #contacto > h4 {
    margin-top:15px;
  }
  body #container_img img{
      width: 90%;

  }
  body #container_img {
    flex-direction:column;
  }
  body #esquema_active {
    background-size: 19%;
  }
  body #container_info_product{
      width: 100%;
  }
  body .img_info {
    display:block;
  }
  body .break {
    display:
  }
  body #container_product_vdi {
    padding-bottom: 2rem;
  }
  body .container-pie-nota .pie_nota {
    margin-bottom:2rem;
    margin-top:0px;
  }
  body #hci_section header p {
    font-size: 1em;
  }

}

#contacto > h4 {
  font-size: 1.3em;
  margin-bottom:30px;
}

#button_active:before {
    content: '';
    width: 3px;
    height: 100px;
    background: #92c148;
    position: absolute;
    bottom: 100%;
    left: 50%;
    margin-left: -2px;
}
.hidden {
  display:none !important;
}

#container_check .img_td {
  text-align:right;
}
#container_check table {
  width:90%;
}

.button_hci:nth-child(4), .button_hci:nth-child(5) {
  padding:1% 2%;
}
.break {
  flex-basis: 100%;
  height: 0;
  display:none;
}
.container-selected {
  border: 3px solid #92C148!important;
  border-radius: 10px!important;
}
.container-pie-nota {
  text-align:left;
  width:70%;
}

.container-pie-nota .pie_nota {
  margin-top:0px;
  margin-bottom:2rem;
}
#titlesft .pie_nota {
  font-size:0.4em;
}
#logo_intel_section{
  width: 100%;
  display: flex;
  /*background-image: url('../img/__pie_pag.jpg');*/
  /* background-attachment: fixed; */
  background-size: 100%;
  background-position: top;
  justify-content: space-evenly;
  color: white;
  padding-bottom: 3%;
  flex-wrap: wrap !important;
}
#logo_intel_section img{
  width:100px;
}

.logo-intel-container {
    width: 90%;
    display: flex;
    justify-content: space-evenly;
    align-items: center;
    position: relative;
}
.logo-intel-img {
  width:25%;
  text-align: center;
}
.logo-intel-title {
  width:33%;
}
.logo-intel-title h4 {
  font-size: 1rem;
}
.logo-intel-text {
  width:41%;
}
.logo-intel-text p {
  font-size: 0.8rem;
  line-height:1.5;
}
@media (max-width: 425px) {
  body #logo_intel_section img{
    width:70px;
  }
  .logo-intel-container {
    flex-wrap:wrap;
  }
  .logo-intel-img {
    width:90%;
  }
  .logo-intel-title {
    width:90%;
    text-align:center;
    margin: 20px 0px;
  }
  .logo-intel-text {
    width:90%;
    text-align:center;
  }
}

/* ESTILOS PARA IE */
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {

   body .box_logo {
     margin:0 auto;
     width:25%;
   }
   .box_logo a {
     width:100%;
     position:relative;
     -ms-flex-negative: 0;
   }
   body #container_check_inicio {
     -ms-flex-negative:0;
   }
   body #container_check {
     display:block;
   }
   body #beneficios_section {
     display:block;
   }
   .img_esquema {
     -ms-flex-negative:0;
   }
   body .img_info img {
     -ms-flex-negative: 0;
   }
   body .img_info {
     -ms-flex-negative: 0;
   }
   body .container_info_vdi {
     -ms-flex-negative:0;
   }
   .texto_1, .texto_2 {
     width: 100%;
   }
   .container_buttons {
     top:10%;
   }
   .container_info_pr img {
     -ms-flex-negative: 0;
   }
   #container_info_product {
     -ms-flex-negative:0;
   }
   #titlesft a {
     -ms-flex-negative: 0;

   }
   #titlesft {
     -ms-flex-negative: 0;
     padding-bottom: 15%;
   }
   #redes a {
     -ms-flex-negative: 0;
   }
   footer h6 {
     left:0px;
     right: 0px;
   }
   body #legal {
     width:33%;
   }
   body #contacto {
     width:33%;
   }
   body #redes {
     width:33%;
   }
   #desc_e_img {
     -ms-flex-negative:0;
   }
   #product_hci {
     -ms-flex-negative:0;
   }
   .button_hci {
     margin:0 auto;
   }
   #legal h3 {
     margin: auto 0;
   }
   #primeros_beneficios h1, #header h1 {
     margin-bottom:10vh;
   }
   .container_info_pr p {
     width:100%;
   }
   .box_esquemas {
     margin:0 auto;
   }
}