*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}
body {
	overflow-x: hidden;
    background-color: #F8F8FF;
}
.espacio{
    height: 60px;
    background-color: #F8F8FF;
}
/* Aquí empieza la sección del menú ______________________________________________________________________*/
#navbar{

	width: 100%;
	height: 100px;
	position: fixed;
	font-size: 1.3rem;
	top: 0;
	z-index: 5;
    background-color: #F8F8FF;
	transition-property: top, height, font-size;
	transition-duration: 1s;
    min-width: 250px;
    margin-bottom: 0;
}

#logo{

	width: auto;
	height: 100%;
	float: left;
	display: block;
	margin-left: 20px;
	padding: 30px;
	transition-property: padding;
	transition-duration: 1s;
    z-index: 6;
}

#menu{
    width: auto;
	list-style-type: none;
	overflow: hidden;
	float: right;
	line-height: 100px;
	transition-property: line-height;
	transition-duration: 0.7s;
    padding: 10px 40px; 
 }

.elementomenu{

	float: left;
	padding: 0px 15px;
}

.elementomenu > a{
    font-size: 0.9rem;
    font-family:system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
    color: darkblue;
    font-weight: normal;
    text-decoration: none;
    transition-property: color;
    transition-duration: 0.8s;
}

.elementomenu > a:hover{

	color: darkorange;
} 

#menuicon, #check{
    display: none;
}
@media(max-width:1150px){
    .elementomenu > a{
        font-size: 0.7rem;
    }
}
@media (max-width: 1030px){
    .checkbtn{
        display: block;
    }
    #menuicon{
        display: block;
        float: right;
        height: 30px;
        width: 30px;
        padding: 40px;
        cursor: pointer;
        color: darkblue;
        transition-property: padding;
	    transition-duration: 1s;
    }
    #navbar ul{
        
        display: flex;
        position: fixed;
        top:100px; 
        left: -100%;
        background-color: #F8F8FF;
        width: 100%;
        height: 100vh;
        right: 0;
        z-index: 6;
        flex-direction: column;
        align-items: center;
        line-height: 60px;
        
    }
    #navbar ul li{
        padding: 5px;
        display: flex;
        margin: 0;  
   
    }
    #navbar ul li:last-child {
        background: none;
        padding: 8px;
        display: block;
    }
    #check:checked ~ ul{
        left: 0;
        transition: all 0.25s;
    }
} 


/* Aqui empieza la sección de la home ____________________________________________________________________________________________*/
#cabecera{
    height: 100vh;
	max-width: 1920px;
}

#fondohero{
    height: 100vh;
	width: 100%;
	background-size: cover;
	position: absolute;
   
}    
#fondohero > img{
    width: 100%;
    height: 100vh;
}
#imgfh {filter: brightness(70%);}

#tituloencabezado{

	font-size: 8rem;
	text-align: center;
	margin-right: auto;
    margin-left: auto;
    position: relative;
    top: 150px;
    font-family:system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
    color: #F8F8FF;
    text-shadow: 1px 9px 5px rgba(0, 0, 0, 0.57);
    animation-name: anititulo;
    animation-duration: 4s;
}

@keyframes anititulo {

	0% { opacity: 0; top: 170px}
	50% { opacity: 0.5; top: 170px}
	100% { opacity: 1; top: 150px}
}

#capaFormulario{
    width: 100%;
    text-align: center;
    margin-right: auto;
    margin-left: auto;
    position: relative;
    top: 160px;
	z-index: 4;
}
.parraFor{
    color: #F8F8FF;
    font-family:system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
    font-size: 1.8rem;
}

.inputs{
    width: 20%;
    height: 28px;
    text-align: center;
    color: #F8F8FF;
    font-size: 1rem;
    background-color: rgba(0,0,0,0.7);
    border:0;
    margin:15px 20px;
    font-family:system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
}
::placeholder{color:#F8F8FF;}

.boton{
    width: 10%;
    height: 28px;
    font-size: 1rem;
    background-color: darkorange;
    color:darkblue;
    cursor: pointer;
    text-align: center;
    border-style:none;
    transition-property: background-color, color;
    transition-duration: 1s;
    font-family:system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
}
.boton:hover {
    color:#F8F8FF;
    background-color: darkblue;
}
#lMessage{
    color:#F8F8FF;
    font-family:system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
    font-size: 1.5rem;
    text-align: center;
}

@media(max-width:1000px){
    #tituloencabezado{
        font-size: 7rem;
    }
    
}
@media(max-width:874px){
    #tituloencabezado{
        font-size: 6rem;
    }
}
@media(max-width:765px){

    #fondohero > img{
        height: 100vh;
    }
    #tituloencabezado{
        font-size: 5rem;
        margin-top: 150px;
    }

    #capaformulario{
        width: 100%;
        height: 100px;
        margin-top: 120px;
    }
    .parraFor{
        font-size: 1.2rem;

    }
    .inputs{
        width: 75%;
        margin:30px 10px;
        display:block;
        margin-right: auto;
        margin-left: auto;
        margin-bottom: 5px;
    }
    .boton{
        width: 65%;
        margin-top: 5px;
    }
}
@media(max-width:750px){
    #tituloencabezado{
        font-size: 4rem;
    }
    #fondohero > img{
        width:auto;
    }
}
@media(max-width:630px){
    #tituloencabezado{
        font-size: 4rem;
    }
    .inputs{
        width: 60%;
    }
    .boton{
        width: 45%;
        height: 25px;
        margin-top: 0px;
    }
}
@media(max-width:500px){
    #tituloencabezado{
        font-size: 3.3rem;
    }
}
@media(max-width:413px){
    #tituloencabezado{
        font-size: 3rem;
    }
}
@media(max-width:375px){
    #tituloencabezado{
        font-size: 2.2rem;
    }
    .parraFor{
        font-size: 1rem;

    }
}

/* Aqui empieza la seccion de sobre nosotros ____________________________________________________________________________________________ */
#acercade{
    max-width: 1920px;
    height: 800px;
    overflow: hidden;
    padding: 10px 60px 0px 60px;
    background-color: #F8F8FF;
    background-size: cover;
    flex-wrap: wrap;
}
#tituloacercade{
    text-align: center;
    font-size: 3.3rem;
    font-family:system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
    color: darkblue;
}
#contenedortexto{
    width: 50%;
    height: 496px;
    float:right;
    flex-direction: column;
    display: flex;
    justify-content: center;
}
#contenedortexto2{
    float:right;
    flex-direction: column;
    display: flex;
    justify-content: center;
}
#contenedorimagen{

    width: 50%;
    height: 496px;
    float:left;
    flex-direction: row;
    display: flex;
    align-items: end;
}

#contenedor2imagen{

    display: flex;
    justify-content: center;
    margin-top: 5%;
}

#imgacercade{
    width: 100%;
    height: auto;
}

#imgacercade2{
    width: 20%;
    height: auto;
}

#parrafoacercade{
    font-family:system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
    font-size: 1.1rem;
    padding: 0 20px;
    color: darkblue;
    text-align: center;
    line-height: 1.8rem;
}

#containericons{
    padding-top: 35px;
    width: 100%;
    display: grid;
    gap:10rem;
    grid-template-columns: auto auto auto;
    align-items: center;
    justify-content: center;
}
.item{
    color: rgb(155, 172, 198);
    font-size: 6rem;
    text-align: center;
}
.textos{
    font-size: 2rem;
    text-align: center;
}
#contenedorbuttona{
    color:#F8F8FF;
    font-size: 1.2rem;
    font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
    text-decoration: none;
    background-color: darkorange;
    padding: 0.2rem 1rem;
    width: 80%;
    text-align: center;
    }
@media(max-width:1009px){
    #acercade{
        height: auto;
        padding: 5px 30px 20px 30px;
    }
    #tituloacercade{
        line-height: 3rem;
    }
    #contenedortexto{
        height: auto;
    }
    #contenedorimagen{
        height: auto;
    }
    #containericons{
        padding-top: 10px;
    }
    #parrafoacercade{
        font-size: 1.1rem;
        line-height: 1.5rem;
        padding: 0px 10px;
    }
}
@media(max-width:870px){
    #tituloacercade{
        font-size: 2.5rem;
    }
    #parrafoacercade{
        font-size: 1rem;
        line-height: 1.4rem;
    }
    .item{
        color: rgb(155, 172, 198);
        font-size: 5rem;
        text-align: center;
    }
    .textos{
        font-size: 1.2rem;
        text-align: center;
    }
}
@media(max-width:781px){
    #tituloacercade{
        font-size: 2rem;
        margin-top: 0;
        line-height: 2.5rem;
    }
    #parrafoacercade{
        font-size: 1rem;
        line-height: 1.2rem;
    }
}
@media(max-width:765px){
    #contenedorimagen{
        width: 100%;
        height: auto;
        display: flex;
        flex-direction:column;
    }
    #contenedortexto{
        width: 100%;
        height: auto;
        display: flex;
        flex-direction: column;
    }
    #containericons{
        padding: 20px 20px;
        gap:4.5rem;
    }
    #imgacercade{
        width: 100%;
        height: auto;
    }
    #tituloacercade{
        font-size: 2rem;
        padding: 10px 20px;
        margin-top: 0;
        line-height: 1.4rem;
    }
    #parrafoacercade{
        padding:0px 20px;
        font-size: 1rem;
        line-height: 1.4;
    }
}
@media(max-width:629px){
    #tituloacercade{
        font-size: 1.8rem;
        padding: 10px 20px;
        margin-top: 0;
        line-height: 1.4rem;
    }
    #parrafoacercade{
        padding:0px 20px;
        font-size: 1rem;
        line-height: 1.2;
    }
}
@media(max-width:460px){

    #tituloacercade{
        padding: 10px 10px;
    }
    #parrafoacercade{
        padding: 0px 10px;
    }
    #containericons{
        padding: 30px 20px;
        gap:2rem;
    }
    .item{
        font-size: 3rem;
    }
} 
@media(max-width:327px){
    #containericons{
        padding: 30px 20px;
        gap:1rem;
    }
    .item{
        font-size: 2rem;
    }
} 
/* Seccion clientes ___________________________________________________________________________ */
#clientes{
    max-width: 1100px;
    height: 400px;
    background-color: darkblue;
    margin-right: auto;
    margin-left: auto;
    flex-wrap: wrap;
    background-size: cover;   
    overflow: hidden;
}
.subcapatexto{
    width: 50%;
    height: 400px;
    float:left;
    padding: 20px 30px;
    flex-direction: column;
    display: flex;
}
.subcapaimagen{
    width: 50%;
    height: 400px;
    float: right;
    flex-direction: row;
    display: flex;
}
#imgclientes{
    width: 100%;
    height: auto;
}
#titulocliente{
    text-align: center;
    color: #F8F8FF;
    font-size: 3rem;
    font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
}
.parrafocliente{
    text-align: justify;
    color: #F8F8FF;
    font-size: 1.1rem;
    font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
}
#ulcliente{
    padding: 15px 30px;
    font-size: 1.1rem;
    color: #F8F8FF;
    font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
}
#linkcliente{
    width: 100%;
    height: 30px;
    background-color: darkorange;
    color: #F8F8FF;
    border-style: none;
    }
    #linkcliente > a{
    color:#F8F8FF;
    font-size: 1.2rem;
    font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
    text-decoration: none;
}
@media(max-width:1000px){
    #titulocliente{
        font-size: 3rem;
    }
    .subcapatexto{
        padding:15px
    }
    .parrafocliente{
        font-size: 1.1rem;
        line-height: 1.5rem;
    }
    #ulcliente{
        font-size: 1.1rem;
        line-height: 1.5rem;
    }
}
@media(max-width:899px){
    #titulocliente{
        font-size: 2rem;
    }
    .parrafocliente{
        font-size: 1.1rem;
        line-height: 1.5rem;
    }
    #ulcliente{
        font-size: 1rem;
        line-height: 1.3rem;
    }
    .subcapatexto{
        padding: 10px;
}
}
@media (max-width:774px){
    #clientes{
        height: auto;
    }
    #linkcliente{
        width: 60%;
        margin-right: auto;
        margin-left: auto;
        margin-top:10px;
    }
    #linkcliente > a{
        font-size: 1rem;
    }
    .subcapatexto{
        display: flex;
        flex-direction: column;
        width: 100%;
        height: auto;
    }
    .subcapaimagen{
        display: flex;
        flex-direction: column;
        width: 100%;
        height: auto;
    } 
    #imgclientes{
        width: 100%;
        height: 400px;
        padding: 0px 0px 20px 0px;
    }
    #titulocliente{
        font-size: 2rem;
        margin: 5px 0px;
    }
    .parrafocliente{
        padding:0 0px;
        font-size: 1rem;
        margin-top: 0;
        line-height: 1rem;
    }
    #ulcliente{
        padding:0 0px 0 35px;
        font-size: 1rem;
        margin-top: 5px;
        line-height: 1rem;
    }
}

/* Aquí empieza la sección de flota y servicios ________________________________________________________________*/
#flotaservicios{
    max-width: 1920px;
    height: 600px;
    overflow: hidden;
    background-size: cover;
    flex-wrap: wrap;
    background-color: #F8F8FF;
    padding: 20px 100px;
}
#flotaservicios > h1{
    font-size: 3rem;
	text-align: center;
    font-family:system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
    color: darkblue;
    padding: 0px 0px 40px 0px;
}
#mitadcapa1{
    background-color: #F8F8FF;
	width: 47%;
    height: 420px;
    float:left;
    border: solid 1.5px darkblue;
    padding: 20px 40px;
}

#mitadcapa2{
    background-color: #F8F8FF;
    width: 47%;
    height: 420px;
    float:right;
    border: solid 1.5px darkblue;
    padding: 20px 40px;
}
#tituloservicios{
    font-size: 2.5rem;
	text-align: center;
    font-family:system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
    color: darkblue;
    padding: 10px 0px;
}
#tituloflota{
    font-size: 2.5rem;
	text-align: center;
    font-family:system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
    color: darkblue;
    padding: 10px 0px;
}
#listaservicios{
    text-align: justify;
    font-size: 1.05rem;
    color: darkblue;
    font-family:system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
}

.parrafoflota{
    color: darkblue;
    font-family:system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
    font-size: 1.1rem;
    text-align: justify;
}

@media(max-width: 1198px){
    #flotaservicios{
        padding: 0 40px;
    }
    .parrafoflota{
        font-size: 1rem;
    }
    #listaservicios{
        font-size: 1rem;
    }
    #mitadcapa1{
        width: 48%;
        padding: 10px 20px;
    }
    #mitadcapa2{
        width: 48%;
        padding: 10px 20px;
    }
    #tituloservicios{
        padding: 5px 0px;
        font-size: 2rem;
    }
    #tituloflota{
        padding: 5px 0px;
        font-size: 2rem;
    }
}
@media(max-width: 791px){
    #flotaservicios{
        height: auto;
        padding: 30px;
        display: flex;
        flex-direction: column;
        row-gap: 3rem;
    }
    #flotaservicios > h1{
        font-size: 2rem;
        padding: 0;
    }
    #mitadcapa1{
        width: 100%;
        height: auto;
        display: flex;
        flex-direction: column;
    }
    #mitadcapa2{
        width: 100%;
        height: auto;
        display: flex;
        flex-direction: column;
    }
    #tituloservicios{
        font-size: 1.8rem;
        padding: 0;
    }
    #listaservicios{
        padding: 0 10px 0px 20px;
        font-size: 0.8rem;
        line-height: 1em;
    }
    #tituloflota{
        font-size: 1.8rem;
    }
    .parrafoflota{
        font-size: 0.8rem;
        line-height: 1em;
    }
}

/* Aquí empieza la seccion tipos de contenedores*/
#mercancia{
    max-width: 1100px;
    height: 400px;
    background-color: darkblue;
    margin-right: auto;
    margin-left: auto;
    flex-wrap: wrap;
    background-size: cover;   
    overflow: hidden;
}
#capatexto{
    width: 50%;
    height: 400px;
    float:left;
    flex-direction: column;
    padding: 15px;
    display: flex;
    justify-content: center;
}
#capaimagen{
    width: 50%;
    height: 400px;
    float: right;
    flex-direction: row;
    display: flex;
}
#imgmerca{
    width: 100%;
    height: auto;
}
#parrafo{
    text-align: center;
    color: #F8F8FF;
    font-size: 2.5rem;
    font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
}
#linkmerca{
    width: 100%;
    height: 45px;
    background-color: darkorange;
    color: #F8F8FF;
    border-style: none;
    margin-right: auto;
    margin-left: auto;
}
#linkmerca > a{
    color: #F8F8FF;
    font-size: 1.2rem;
    font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
    text-decoration: none;
}
@media(max-width:975px){
    #parrafo{
        font-size: 2rem;
    }
    #linkmerca > a{
        font-size:1.05rem;
        height: 35px;
    }
}

@media (max-width:774px){
    #mercancia{
        height: auto;
    }
    #capatexto{
        display: flex;
        flex-direction: column;
        width: 100%;
        height: auto;
    }
    #capaimagen{
        display: flex;
        flex-direction: column;
        width: 100%;
        height: auto;
    } 
    #imgmerca{
        width: 100%;
        height: auto;
    }
}
/* Aquí empieza la sección de contacto _____________________________________________________________________*/
#contacto{
    background-size: cover;
    height: 680px;
    max-width: 1920px;
    background-color: #F8F8FF;
    flex-wrap: wrap;
    overflow: hidden;
}
#titulocontacto{
    font-size: 2.8rem;
    font-family:system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
    color: darkblue;
    padding: 0 0 0 160px;
}
#capamenor1{
	width: 50%;
	height: 600px;
	float: left;
    display: flex;
    flex-direction: column;
}
#capamenor2{
    width: 50%;
	height: 600px;
	float: left;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.iframe{
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 50px;
}
.parrafocontacto{
    font-family:system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
    color: darkblue;
    margin-top: 10px;
    padding: 0 0 0 160px;
    font-size: 1.1rem;
    line-height: 1.4rem;
}
#formulariocontacto{
    padding: 0 0 0 160px;
    display: flex;
    flex-direction:column;
}
.label{
    margin-top: 5px;
    font-family:system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
    color: darkblue;
    font-size: 1rem;
}
.inputfor{
    background-color: rgba(0,0,0,0.2);
    width: 60%;
    height: 30px;
    padding: 10px 10px;
    margin-top: 5px;
    border-style:none;
    color: darkblue;
    font-family:system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;

}
#message{
    width: 60%;
    background-color: rgba(0,0,0,0.2);
    height: 100px;
    padding: 10px 10px;
    margin-top: 8px;
    border-style:none;
    font-family:system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
    color: darkblue;
}

.enviarfor{
    width: 40%;
    height: 30px;
    margin-top: 10px;
    text-align: center;
    border-style:none;
    background-color: darkorange;
	color: darkblue;
    transition-property: background-color, color;
    transition-duration: 1s;
    font-family:system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
    font-size: 1.2rem;
}
.enviarfor:hover{
    background-color: darkblue;
    color:#F8F8FF;
} 

@media(max-width:1103px){
    #contacto{
        height: auto;
        
    }
    #capamenor2{
        width: 50%;
    }
    #capamenor1{
        width: 50%;
    }
    .parrafocontacto{
        font-size: 1.3rem;
        line-height: 1.5rem;
        padding-left: 80px;
    }
    #titulocontacto{
        padding-left: 80px;
    }
    #formulariocontacto{
        padding-left: 80px;
    }
    .label{
        margin-top: 3px;
    }
    .inputfor{
        margin-top: 3px;
    }
    #message{
        margin-top: 3px;
        height: 50px;
    }
    .iframe{
        padding: 40px
    }
}
@media(max-width:999px){
    .parrafocontacto{
        font-size: 1.2rem;
        line-height: 1.4rem;
        padding-left: 50px;
    }
    #titulocontacto{
        padding-left: 50px;
    }
    #subtitulo{
        padding-left: 50px;
    }
}
@media(max-width:860px){
    .parrafocontacto{
        font-size: 1rem;
        line-height: 1.3rem;
        text-align: center;
        padding: 0;
    }
    #titulocontacto{
        text-align: center;
        font-size: 2rem;
        padding: 0;
    }
    #capamenor1{
        width: 100%;
        height: auto;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
    }
    #capamenor2{
        width: 100%;
        height: auto;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        padding: 0;
    }
    #formulariocontacto{
        width: 80%;
        display: flex;
        justify-content: center;
        align-items: center;
        text-align: center;
        padding: 0;
    } 
    .inputfor{
        width: 70%;
        height: 20px;
        padding: 0;
    }
    #message{
        padding: 0;
        margin-top: 3px;
        height: 40px;
        width: 60%;
    }
    .enviarfor{
        width: 40%;
    }
    .iframe{
        padding: 25px
    }
}

/* Seccion de mercancia peligrosa___________________________________________________ */
#peligrosa{
    background-color: rgb(214, 224, 238);
    max-width: 1920px;
    height: 500px;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
}
#big{
    max-width: 1100px;
    height: 400px;
    background-color: #F8F8FF;
    display: flex;
    flex-direction: row-reverse;
}
#capatexto2{
    width: 50%;
    height: 400px;
    float:left;
    flex-direction: column;
    padding: 25px;
    display: flex;
    justify-content: center;
}
#capaimagen2{
    width: 50%;
    height: 400px;
    float: right;
    flex-direction: row;
    display: flex;
}
#imgmerca2{
    width: 100%;
    height: auto;
}
#mercatitle2{

    color: darkblue;
    font-size: 2.5rem;
    font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
}
#parrafomerca{
    
    color: darkblue;
    font-size: 2rem;
    font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
}
#linkmerca2{
    width: 70%;
    height: 35px;
    background-color: darkorange;
    color: #F8F8FF;
    border-style: none;
}
#linkmerca2 > a{
    color:darkblue;
    font-size: 1.2rem;
    font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
    text-decoration: none;
}
#linkcalidad{
    width: 70%;
    height: 35px;
    background-color: darkorange;
    color: #F8F8FF;
    border-style: none;
}
#linkcalidad > a{
    color:darkblue;
    font-size: 1.2rem;
    font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
    text-decoration: none;
}
@media(max-width:718px){
    #peligrosa{
        height: auto;
    }
    #big{
        height: auto;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        text-align: center;
    }
    #capatexto2{
        width: 100%;
        height: auto;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        text-align: center;
        padding: 10px;
    }
    #capaimagen2{
        width: 100%;
        height: auto;
        display: flex;
        flex-direction: column;
    }
}
@media(max-width:415px){
    #mercatitle2{
        font-size: 1.8rem;
    }
    #parrafomerca{
        font-size: 1.3rem;
    }
    #linkmerca2{
        height: 28px;
    }
    #linkmerca2 > a{
        font-size: 1rem;
    }
}
/* Aquí empieza la sección del footer_______________________________________________________________________ */
#footer{
    max-width: 1920px;
    height: 100px;
    background-color: darkblue;
    flex-wrap: wrap;
    overflow: hidden;
    background-size: cover;
}

#caparedes{
    width: 100%;
    height: 50px;
    float:left;
    flex-direction: row;
    text-align: center;
}
#caparedes i{
	color: #F8F8FF ;	
	font-size: 2.2rem;
	padding: 0px 10px;
	transition-property: color;
    transition-duration: 0.8s;
    line-height: 70px;
    text-align: center;
}
.logofooter{
    display: block;
    max-width: 100%;
    height: auto;
    padding: 0 40px;
}
#caparedes i:hover {

	color: darkorange;
}
#capapolitica{
    width: 100%;
    height: 50px;
    float:right;
    flex-direction: row;
    text-align: center;
}
#capapolitica a{
    color:  #F8F8FF;
    font-family:system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
    font-size: 1.3rem;
    text-decoration:none;
    transition-property: color;
    transition-duration: 0.8s;
    line-height: 50px;
    text-align: center;
}

#capapolitica a:hover {

	color: darkorange;
	cursor:pointer;
}
@media(max-width: 765px){
    #footer{
        height: 60px;
    }
    #caparedes{
        width: 100%;
        height: auto;
        flex-direction: column;
    }
    #capapolitica{
        width: 100%;
        height: auto;
        flex-direction: column;
    }
    #caparedes i{
        font-size: 1.6rem;
        padding:0 5px;
        line-height: 0;
        margin-top: 20px;
        
    }
    #capapolitica a{
        font-size: 0.8rem;
        line-height: 0;
    }
}
/* Modal de politicas__________________________________________________________________________________ */

#modalPoliticas{
    width: 100vw;
    height: 100vh;
    background-color: rgba(0,0,0,0.6);
    position:fixed;
    top:0px;
    display: none;
    z-index:5;
}
#modal{
    max-width:1920px;
    height: 600px;
    background-color: #F8F8FF;
    position: absolute;
    top:50%;
    left: 50%;
    transform: translate(-50%,-50%);
    padding: 15px 40px;
    text-align: justify;
    overflow:auto;
    background-size: cover;
    flex-wrap: wrap;
    color:darkblue;
    font-family:system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;

}
#modal h2{
    font-size: 2rem;
    margin-bottom: 15px;
    line-height: 2rem;
}
#modal h4{
    font-size: 1.2rem;
    line-height: 2rem;
}
#modal p{
    font-size: 1.1rem;
}

.close{
    top:5px;
	right: 30px;
	width: 30px;
	height: 40px;
	color :rgba(128, 128, 128, 1);
	cursor: pointer;
    font-size: 2rem;
    position:fixed;
}
.listas{
    padding: 0 60px;
}
@media(max-width: 765px){
    #modal{
        width: 280px;
        padding: 10px 10px;
    }
    #modal h2{
        margin-top: 20px;
        font-size: 1.3rem;
        margin-bottom: 15px;
        line-height: 1.2px;
    }
    #modal h4{
        font-size: 1.1rem;
        font-weight: bold;
    }
    #modal p{
        font-size: 1rem;
    }
    .close{
        right: 10px;
    }
    .listas{
        padding: 0px 10px;
    }
}
/* Aquí empieza el modal de Aviso Legal____________________________________________________________________ */
#modalAviso{
    width: 100vw;
    height: 100vh;
    background-color: rgba(0,0,0,0.6);
    position:fixed;
    top:0px;
    display: none;
    z-index:5;
}
#modal_info{
    max-width: 1920px;
    height: 600px;
    background-color: #F8F8FF;
    position: absolute;
    top:50%;
    left: 50%;
    transform: translate(-50%,-50%);
    padding: 15px 40px;
    text-align: justify;
    overflow:auto;
    background-size: cover;
    flex-wrap: wrap;
    font-family:system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
    color: darkblue;
}
#modal_info h2{
    font-size: 2rem;
    margin-bottom: 15px;
    line-height: 2rem;
}
#modal_info h4{
    font-size: 1.2rem;
    font-weight: bold;
    line-height: 2rem;
}
#modal_info p{
    font-size: 1.1rem;
}
.listas{
    padding: 0 60px;
}
@media(max-width: 765px){
    #modal_info{
        width: 280px;
        padding: 10px 10px;
    }
    #modal_info h2{
        margin-top: 20px;
        font-size: 1.3rem;
        margin-bottom: 15px;
        line-height: 1.2px;
    }
    #modal_info h4{
        font-size: 1.1rem;
        font-weight: bold;
        line-height: 1.3rem;
    }
    #modal_info p{
        font-size: 1rem;
    }
    .close{
        right: 10px;
    }
    .listas{
        padding: 0px 15px;
    }
}