*{
    box-sizing: border-box;
}

.div_frecuentes {
    width: 100%;
    box-sizing: border-box;
    padding: 1vw;
    font-size: 0.9vw;
    font-family: 'metropolis';
    color: #4c4c4c;
    border-top-right-radius: 1vw;
    border-top-left-radius: 1vw; }

    .box_pregunta{
     margin-left: 5vw;
     margin-right: 5vw;
    }

    .box_pregunta input{
      display:none;
      
    }

.frecuentes-titulo{
    text-align: center;
    font-family: 'metropolis Extra Bold';
    font-size: 2.5vw;
    margin-bottom: 6%;
}

.titulo-secundario{
    color: #4c4c4c;
}

.label_pregunta{
    font-family: 'metropolis Extra Bold';
    color: #3b438c;
    font-size: 1.3vw;
    display: block;
    padding: 1vw;
  /*  background-color: royalblue;*/
    border-bottom: #3b438c 1px solid;
    padding-left: 2.5vw;
    cursor: pointer;
   

}
.label_pregunta::before{
    content: "+";
    position: absolute;
    color: #3dd360;
    right: 20%;
    font-size: 2vw;
    transition: all 0.5s;
    line-height : 1.5em;
}

.div_frecuentes input:checked ~ .label_pregunta::before{
content: "-";
font-size: 2.2vw;
}

.label_pregunta:hover{
    background-color: rgba(247, 245, 245, 0.966);
    border-radius: 5px;
    
}

.contenido_pregunta{
   
    font-size: 1.1vw;
    padding-left: 1vw;
    height: 0px;
    overflow: hidden;
    transition: all 0.5s;
}

.div_frecuentes input:checked ~ .contenido_pregunta{
height: auto;
margin: 3% 0;
text-align: justify;
padding-right: 10%;
line-height:1.3em
}

.input_servicio{
    margin-top: .5vw;
}


@media screen and (max-width: 800px){
    .div_frecuentes input:checked ~ .contenido_pregunta{
        padding-right: 0;
    }

}

.box_tutorial{
    background-color: rgb(235, 235, 235);
    padding-bottom: 2vw;
    border-radius: 3px;

}

.grid_tutoriales{
    display: grid;
  /*  grid-template-columns: repeat(4,1fr);*/
 /* grid-template-columns: repeat(auto-fit,minmax(24%,1fr));*/
 grid-template-columns: repeat(auto-fit,minmax(20rem,1fr));
    gap: 1em;
}

.video_tutorial{
padding: 1vw;
display: flex;
  justify-content: center;
  align-items: center;
}

.titulo_tutorial{
    text-align: center;
    font-family: 'metropolis Extra Bold';
    color: #3b438c;
    font-size: 1.1vw;
    margin-bottom: 1vw;
    
}

.des_tutorial{
    text-align: justify;
    margin-top: 1%;
    margin: 3%;
    padding: 1.3vw;
    padding-bottom: 0;
    max-width: 28vw;
}

.margin_tutoriales{
    margin-left: 5%;
    margin-right: 5%;
}

.tit_documentos {
    display: block;
    text-align: center;
    margin-bottom: 3vw;
    font-size: 3vw;
    font-family: 'metropolis Extra Bold';
    color: white;
    margin-left: 10%;
    margin-right: 10%;
    margin-top: 7%;
}

.div_documentos {
    width: 80%;
    box-sizing: border-box;
    margin: 0 auto;
    padding: 5vw;
    background-color: white;
    border-top-left-radius: 1vw;
    border-top-right-radius: 1vw;
    border-bottom-right-radius:1vw;
    border-bottom-left-radius: 1vw;
    display: block;
    font-size: 1vw;
    color: #4c4c4c;
    position: relative;
    z-index: 90;
    box-shadow: 0 0 1vw 0 #364760; 
    margin-top: 9%;}

    .pdf_doc{
        max-width: 3vw;
        padding: 0;
        margin: 0;
    }

    .card_documento{
       padding-top: 5vh;
       padding-bottom: 0.5vw;
       display: flex;
       border-bottom: black 1px solid;
       align-items: center;
    }

    .label_doc{
        padding-left: 2%;
        color: #3B438C;
        cursor: pointer;
        font-size: .9vw;
    }

    /*.label_doc:hover{
        color: #3dd360;
    }*/
.card_documento:hover h2{
    color: #3dd360;
    transition: all 0.5s;
}

.card_documento:hover img{
    display: block;
    cursor: pointer;
}

    .descarga_doc{
        margin-right:3vw;
        margin-left:auto;
        vertical-align: middle;
    }

    .descarga_doc img{
        max-width: 1.7vw;
        padding: 0;
        margin: 0;
        display: none;
        
    }

    .card_documento:hover ~ .label_doc:hover {
        background-color: rgb(139, 121, 121) !important;
    }

    .input_form_trabaja{
        padding: 1vw;
        background-color: transparent;
        border: 1px solid black;
        font-size: 1vw;
        width: 100%;
        box-sizing: border-box;
        display: block;
        border-radius: 0.5vw;
        color: black;
        outline: none; 
    }

    .box_form_trabaja{
        padding-left: 10%;
        padding-right: 10%;
    }

    .button_form_trabajar {
        padding: 1vw;
        background-color: #3dd360;
        color: white;
        border: solid 1px #3dd360;
        font-size: 1.3vw;
        width: 40%;
        box-sizing: border-box;
        border-radius: 0.5vw;
        cursor: pointer;
      /*  display: block; */
        font-family: 'Metropolis Semi Bold'; 
        }

        .box_btn_trabajar{
            display: flex;
            justify-content: center;
            align-items: center;
        }

@media screen and (max-width: 800px){
     .box_tutorial{
        margin-top: 3svw;
        padding-top: 3vw;
    }
    .titulo_tutorial{
        font-size: 3.5vw; 
        margin: 3vw;
    }

    .des_tutorial{
        max-width: 80%;
        text-align: justify;
       }

    .label_pregunta{
        font-size: 16px;
        margin-top: 25px;
        padding: 10px;
    }
    
        .des_tutorial{
        max-width: 80%;
        
       }

    .label_pregunta::before{
    font-size: 16px;
    position: static;
    text-align: justify;
    content: "+ ";
 
    }

    .div_frecuentes input:checked ~ .label_pregunta::before{
    content: "- ";
    font-size: 20px;
    }

    .div_frecuentes input:checked ~ .contenido_pregunta{
        font-size: 16px;
        text-align: justify;
    }

   
    .tit_documentos {
        font-size: 5vw;
       
    }

    .div_documentos{
        margin-top: 19vw;
    }

    .des_doc{
        font-size: 3vw;
        text-align: justify;
    }

    .label_doc{
        font-size: 2.5vw;
    }
    .descarga_doc img{
        max-width: 5vw;
    }
    .pdf_doc{
        max-width: 5vw;
    }
   .div_documentos {
    width: 90%;
    padding: 20px;
    background-color: white;
    border-top-left-radius: 16px;
    border-top-right-radius: 16px;
    font-size: 16px;
    box-shadow: 0 0 0 0; 
    padding-top: 0;
    margin-top: 0;

}


.input_form_trabaja{
    font-size: 2.5vw;
}

.button_form_trabajar{
    font-size: 3vw;
    padding: 3vw;
}

}