main {display: flex; justify-content:center; text-align: left; padding:20px;}

.content-wrapper {
    display: flex;
    flex-direction: column;
    /*align-items: center; */            
    width: 700px;
    padding: 20px;
    gap: 0px; 
    background-color: #f7f7f7; /* Fondo de color suave */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); /* Sombra suave */        
    border: 0px dashed red;
}

.publish-btn {
    display: inline-flex; /* Se ajusta al contenido */
    align-items: center; /* Centrar verticalmente */
    justify-content: center; /* Centrar horizontalmente */
    gap: 10px; /* Espacio entre la imagen y el texto */
    background-color: var(--primary); /* Color del botón */
    color: white; /* Color del texto */
    border-radius: 25px; /* Bordes redondeados */
    padding: 5px 10px; /* Espaciado interno */
    cursor: pointer; /* Cursor de botón */
    transition: background 0.3s ease; /* Efecto suave en hover */
    width: auto; /* Ajuste automático al contenido */
    text-decoration: none !important;
}

.publish-btn:hover {
    background-color: var(--primary-hover); /* Cambio de color en hover */
}

.publish-btn img {
    width: 20px;
    height: 20px;
}

.publish-txt {
    font-size: 14px !important;
    font-weight: 300 !important;
    text-decoration: none !important;
}





.bienvenida-ayuda {
    font-size: 16px;
    font-weight: 600;
    color: var(--black);
    margin: 15px 0 15px;    
}

.titulo-ayuda {
    font-size: 14px;
    font-weight: 600;
    color: var(--black);
    margin: 15px 0 15px;    
}

.pregunta, .respuesta {
    display: flex;
    align-items: center; /* alinea verticalmente imagen y texto */
    
    font-size: 14px;
}

.pregunta {
    color: #333;
    margin: 10px 0;
} 

.respuesta {
    color: #666;
    font-weight: 300;
    margin: 10px 10px 10px 20px;
} 

.respuesta b{
    color: #333;
} 

.respuesta a {
    color: #666;
    text-decoration: underline;
}

.pregunta-img, .respuesta-img {
    margin-right: 10px;
    flex-shrink: 0;
}

.pregunta-img img, .respuesta-img img {
    width: 12px;
    height: 12px;
}

@media (max-width: 1440px) {
    

}

@media (max-width: 1280px) {
    
    .div-1 {
        width: calc(30% - 10px);
    }
    
    .div-2 {
        width: calc(40% + 10px);
    }
    
    .div-3 {
        width: 30%;
    }
    

}

@media (max-width: 1024px) {
    
    .div-1 {
        display: none;
    }
    
    .div-2 {
        display: flex;
        flex-direction: column;
        width: 100%;
        padding: 0px;
        border-radius: 0px;
        box-shadow: 0 0px 0px rgba(0, 0, 0, 0); 
        background: transparent;
    }
    
    .div-3 {
        display: flex;
        flex-direction: column;
        width: 100%;
        padding: 0px;
    }
    

}

@media (max-width: 768px) {
    main {
        flex-direction:column;
        padding:0 20px;
        margin-bottom: 100px;
    }
    
    .content-wrapper {
        width: 100%;        
    }    
    
    .contenedor-flex {
        flex-direction: column;
        width: 100%;
        height: auto;
    }
        
    .div-2 {
        display: block;
        width: 100%;
        height: auto;
        padding: 0px;
        border-radius: 0px;
        box-shadow: 0 0px 0px rgba(0, 0, 0, 0); 
        background: transparent;
        border: 0px solid green;
    }
    
    .div-3 {
        display: block;
        width: 100%;
        height: auto;
        padding: 0px;
        border: 0px solid blue;
    }

}

@media (max-width: 620px) {
    
}