.h1header{
    background: url(assets/images/techumbres-de-acero/techumbres-de-acero-1.jpg);
    padding-top: 17%;
    padding-bottom: 17%;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.h1header h1{
    color: white;
    padding-left: 7%;
    font-family: Saira Semi Condensed;
    font-size: 72px;
    font-weight: 700 !important;
}
.contenido{
    padding: 5%;
}
.acordeon{
    padding-left: 15%;
    padding-right: 15%;
    padding-top: 5%;
    padding-bottom: 5%;
}

.contenedor{
    display: flex;
    align-items: center;
    margin-left:-5.5%;

}
.imagen{
    flex:1;
    padding-right: 2.5%;
    
}
.imagen img{
    min-height: 100vh;
}


.texto{
    flex:1;
    
}

.cards{
    display: flex;
}
.card1{
    flex:1;
    margin-right: 1.5%;
    background:linear-gradient(65deg,#e3e6e5 45%, #b0b3b2 95%);
    box-sizing: content-box;
    border-style: double;
}
.card1:hover{
    flex:1;
    margin-right: 1.5%;
    background:linear-gradient(65deg,#e3e6e5 45%,#b0b3b2 95% );
    box-sizing: content-box;
    border-style: double;
    transform: scale(1.1);
}
.contenedor2{
    display: flex;
    align-items: center;
    

}
.imagen2{
    flex:1;
    padding-left: 2.5%;
    margin-right:-5.5%;
}
.imagen2 img{
    min-height: 100vh;
}

p{
    padding: 2%;
}

h2{
    padding-top: 2%;
    font-size: 55px;
}

.card1 h3{
    color:white;
    text-align: center;
}

@media (max-width: 480px){
    .cards{
        display: flex;
        flex-direction: column;
    }
    .contenedor{
        display: flex;
        flex-direction: column;
        justify-content: center;
    }
    .contenedor .imagen{
        padding-left: 10%;
        
    }
    .contenedor2{
        display: flex;
        flex-direction: column;

    }

    .contenedor2 .imagen2{
        padding-right: 10%;
        
    }
}
@media (max-width: 780px){
    .cards{
        display: flex;
        flex-direction: column;
    }
    .contenedor{
        display: flex;
        flex-direction: column;
        justify-content: center;
    }
    .contenedor .imagen{
        padding-left: 10%;
        
    }
    .contenedor2{
        display: flex;
        flex-direction: column;

    }

    .contenedor2 .imagen2{
        padding-right: 10%;
        
    }
}