@font-face {
    font-family: col;
    src: url(../font/col.ttf);
}

@font-face {
    font-family: cor;
    src: url(../font/cor.ttf);
}

html {
    scroll-behavior: smooth;
}

a {
    text-decoration: none;
    cursor: pointer;
}

:root {
    --title: 3.5rem;
    --subtitle: 2.5rem;
    --parrafos: 1rem;
    --footer: .7rem;
    --color1: #ffffff;
    --color2: #011230;
    --color3: #4EC2C0;
    --color4: #3AB366;
    --color5: #B1B1B1;
    --color6: #FF0000;
    --color7: #229590;
}

.body {
    position: relative;
}

.left {
    width: 5%;
    height: auto;
}

.right {
    width: 5%;
    height: auto;
}

/* Header Inicio */
header-mym{
    width: 100%;
    height: 5.5em;
    display: block;
}
header {
    width: 100%;
    height: 5.5em;
    background: var(--color1);
    display: flex;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 20;
}

.logo {
    width: 45%;
    height: auto;
    position: relative;
}

.logo img {
    width: 9em;
    height: auto;
    position: absolute;
    top: 0.4em;
    left: 0;
    z-index: 20;
}

.nav2 {
    display: none;
}

.nav {
    width: 45%;
    height: auto;
}

#hamburger {
    float: right;
    margin-top: .5em;
}

#hamburger button {
    background: none;
    border: 0;
    cursor: pointer;
    padding: 0;
    width: 5em;
    height: 5em;
}

#hamburger button span {
    width: 60%;
    height: 0.3em;
    border-radius: 2em;
    background: var(--color2);
    display: block;
    margin: 5px auto;

    animation-duration: .5s;
    animation-fill-mode: forwards;
}

#hamburger button.open .top-line {
    animation-name: top-line-animation;
}

#hamburger button.open .middle-line {
    animation-name: middle-line-animation;
}

#hamburger button.open .bottom-line {
    animation-name: bottom-line-animation;
}

#hamburger button .top-line {
    animation-name: top-line-animation-close;
}

#hamburger button .middle-line {
    animation-name: middle-line-animation-close;
}

#hamburger button .bottom-line {
    animation-name: bottom-line-animation-close;
}

@keyframes top-line-animation {

    50%,
    100% {
        margin: 0 auto;
        transform: translateY(4px) rotate(-45deg);
    }
}

@keyframes bottom-line-animation {

    50%,
    100% {
        margin: 0 auto;
        transform: translateY(-4px) rotate(45deg);
    }
}

@keyframes middle-line-animation {

    20%,
    100% {
        margin: 0 auto;
        width: 0;
        opacity: 0;
    }
}

@keyframes top-line-animation-close {
    0% {
        margin: 0 auto;
        transform: translateY(5px) rotate(-45deg);
    }

    50%,
    100% {
        margin: 5px auto;
        transform: translateY(0px) rotate(0deg);
    }
}

@keyframes bottom-line-animation-close {
    0% {
        margin: 0 auto;
        transform: translateY(-5px) rotate(45deg);
    }

    50%,
    100% {
        margin: 5px auto;
        transform: translateY(0px) rotate(0deg);
    }
}

@keyframes middle-line-animation-close {
    0% {
        margin: 0 auto;
        width: 0;
        opacity: 0;
    }

    20%,
    100% {
        margin: 0 auto;
        width: 60%;
        opacity: 1;
    }
}

.ulCelu {
    width: 100%;
    height: auto;
    font-family: cor;
    font-weight: 900;
    position: absolute;
    top: 5.5em;
    left: 0;
    z-index: 10;
    color: var(--color1);
    background: var(--color2);
    padding: 4em 0 3em 0;
    text-align: center;
    display: none;
}

.ulCelu a {
    color: var(--color2);
}

.sectores {
    width: 100%;
    height: auto;
    position: relative;
}

.sectores input[type="checkbox"] {
    width: 10em;
    height: 2em;
    position: absolute;
    cursor: pointer;
    z-index: 1;
    opacity: 0;
    top: -0.5em;
    right: 30%;
}

.sectores input[type="checkbox"]:checked~.submenuSectores {
    height: 20em;
    display: inherit;
    transition: all .5s;
}

.productos {
    width: 100%;
    height: auto;
    position: relative;
}

.productos input[type="checkbox"] {
    width: 10em;
    height: 2em;
    position: absolute;
    cursor: pointer;
    z-index: 1;
    opacity: 0;
    top: -0.5em;
    right: 30%;
}

.productos input[type="checkbox"]:checked~.submenuProductos {
    height: 32em;
    display: inherit;
    transition: all .3s;
}

.servicios {
    width: 100%;
    height: auto;
    position: relative;
}

.servicios input[type="checkbox"] {
    width: 10em;
    height: 2em;
    position: absolute;
    cursor: pointer;
    z-index: 1;
    opacity: 0;
    top: -0.5em;
    right: 30%;
}

.servicios input[type="checkbox"]:checked~.submenuServicios {
    height: 26em;
    display: inherit;
    transition: all .3s;
}

.ulCelu span {
    width: auto;
    height: auto;
    display: flex;
}
.sectores input[type="checkbox"]:checked~p,
.servicios input[type="checkbox"]:checked~p,
.productos input[type="checkbox"]:checked~p {
        color: var(--color3);
    }
#submenuPC picture{
    display: none;
}
.language {
    width: 100%;
    height: auto;
    position: relative;
}

.language input[type="checkbox"] {
    width: 10em;
    height: 2em;
    position: absolute;
    cursor: pointer;
    z-index: 1;
    opacity: 0;
    right: 10%;
}

.language input[type="checkbox"]:checked~.submenuLanguage {
    height: auto;
    display: inherit;
    transition: all .3s;
}

.global {
    width: auto;
    height: auto;
    display: flex;
    justify-content: center;
    align-items: center;
    color: var(--color3);
}

.global picture {
    width: auto;
    height: auto;
    margin: 0 .5em 0 0;
}

.global img {
    width: 2em;
    height: auto;
}

.oficina a {
    margin: auto 0;
    color: var(--color1);
}

.oficina p {
    width: 10em;
    height: 2em;
    background: var(--color3);
    border-radius: .5em;
    margin: auto;
    display: flex;
    justify-content: center;
    align-items: center;
}

.oficina {
    width: 100%;
    height: auto;
    position: relative;
}

.submenuSectores {
    width: 100%;
    height: 0;
    background: var(--color2);
    margin-top: 1em;
    display: none;
    padding: .1em 0;
    overflow: hidden;
    animation: sectoresMenu .5s normal ease-out;
}

@keyframes sectoresMenu {
    0% {
        height: 1px;
    }

    100% {
        height: 20em;
    }
}

.submenuProductos {
    width: 100%;
    height: 0;
    background: var(--color2);
    margin-top: 1em;
    display: none;
    padding: .1em 0;
    overflow: hidden;
    animation: productosMenu .7s normal ease-out;
}

@keyframes productosMenu {
    0% {
        height: 1px;
    }

    100% {
        height: 32em;
    }
}

.submenuServicios {
    width: 100%;
    height: 0;
    background: var(--color2);
    margin-top: 1em;
    display: none;
    padding: .1em 0;
    overflow: hidden;
    animation: serviciosMenu .5s normal ease-out;
}

@keyframes serviciosMenu {
    0% {
        height: 1px;
    }

    100% {
        height: 26em;
    }
}

.submenuLanguage {
    width: 100%;
    height: 0;
    background: var(--color2);
    margin-top: 1em;
    display: none;
    padding: .1em 0;
    overflow: hidden;
    animation: languageMenu .3s normal ease-out;
}

@keyframes languageMenu {
    0% {
        height: 1px;
    }

    100% {
        height: 8em;
    }
}

.submenuSectores li,
.submenuProductos li,
.submenuServicios li,
.submenuLanguage li {
    margin: 2em 0;
}

.submenuSectores a,
.submenuProductos a,
.submenuServicios a,
.submenuLanguage a {
    color: var(--color1);
}

.active {
    width: 100%;
    background: var(--color1);
    color: var(--color2);
    transition: all 1s;
    display: flex;
    flex-direction: column;
    gap: 2em;
    box-shadow: 0px 10px 20px var(--color2);
    overflow: hidden;
    animation: activeMenu .5s normal ease-out;
}

@keyframes activeMenu {
    0% {
        height: 1px;
    }

    100% {
        height: 14em;
    }
}

/* Header Fin */
/* Slider Inicio */
.slider{
    width: 100%;
    height: auto;
    display: flex;
    flex-direction: column;
}
.textSlider{
    width: 100%;
    height: auto;
    background: var(--color3);
}
.textSlider p{
    width: auto;
    height: auto;
    font-family: col;
    font-weight: 700;
    font-size: 2rem;
    line-height: .95em;
    letter-spacing: .05em;
    color: var(--color1);
    margin: 0 5%;
    padding: .5em 0;
    text-align: center;
}
.imgSlider{
    width: 100%;
    height: calc(100dvh - 5.5em - 7.7em);
    background-image: url(../img/backslider.webp);
    background-repeat: no-repeat;
    background-position: -4em 0;
    background-size: cover;
}
/* Slider Fin */
/* Main Inicio */
/* Nosotros Inicio */
.nosotros{
    width: 100%;
    height: auto;
    position: relative;
    background: var(--color4);
}
.curva1 {
    width: 100%;
    height: 2em;
    border-radius: 8em 8em 0 0;
    background: var(--color4);
    position: absolute;
    top: -2em;
}
.contNosotros{
    width: 100%;
    height: auto;
    display: flex;
    flex-direction: column-reverse;
}
.imgNosotros{
    width: 90%;
    height: 14em;
    margin: 0 auto 4em auto;
    background-image: url(../img/electricista.webp);
    background-repeat: no-repeat;
    background-position: 0 0;
    background-size: cover;
}
.textNosotros{
    width: 90%;
    height: auto;
    color: var(--color2);
    text-align: center;
    margin: auto;
}
.textNosotros > p{
    width: 100%;
    height: auto;
    font-family: col;
    font-weight: 700;
    font-size: 2rem;
    line-height: .9em;
    letter-spacing: .03em;
}
.textNosotros h1{
    width: 100%;
    height: auto;
    font-family: col;
    font-weight: 700;
    font-size: 2rem;
    line-height: .9em;
    letter-spacing: .02em;
}
.textNosotros article{
    width: 100%;
    height: auto;
    margin: 2em 0;
    text-align: justify;
    display: flex;
    flex-direction: column;
    gap: 1em;
    font-family: cor;
    font-weight: 400;
    font-size: 1.2rem;
    line-height: .9em;
}
/* Nosotros Fin */
/* Productos y Servicios Inicio */
.proyser{
    width: 100%;
    height: auto;
    position: relative;
    background: var(--color3);
}
.curva2{
    width: 100%;
    height: 2em;
    border-radius: 8em 8em 0 0;
    background: var(--color3);
    position: absolute;
    top: -2em;
}
.contProyser{
    width: 100%;
    height: auto;
}
.contProyser > article{
    width: 100%;
    height: auto;
    color: var(--color1);
    text-align: center;
}
.contProyser > article h2{
    width: 100%;
    height: auto;
    font-family: col;
    font-weight: 700;
    font-size: 2rem;
    line-height: .9em;
    letter-spacing: .02em;
}
.contProyser > article p{
    width: 100%;
    height: auto;
    font-family: cor;
    font-weight: 400;
    font-size: 1.2rem;
    line-height: .9em;
    margin: 1em 0;
}
.cuadricula{
    width: 100%;
    height: auto;
    display: grid;
    grid-template-columns: repeat(1, 1fr);
}
.contcuadricula{
    width: 100%;
    height: calc(200dvw);
    display: flex;
    flex-direction: column;
}
.contcuadricula picture{
    width: 100%;
    height: calc(200dvw / 2);
    position: relative;
    display: flex;
    align-items: center;
    justify-items: center;
}
.contcuadricula picture img{
    width: 100%;
    height: auto;
}
.triangulo,
.triangulo2{
    width: 0;
    height: 0;
    border-top: 2em solid var(--color3);
    border-left: 1.5em solid transparent;
    border-right: 1.5em solid transparent;
    position: absolute;
    bottom: -2em;
    left: 0;
    right: 0;
    margin: auto;
    z-index: 1;
}
.contcuadricula article{
    width: 100%;
    height: calc(200dvw / 2);
    background: var(--color1);
    text-align: center;
    color: var(--color2);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
.contcuadricula article h2{
    width: 90%;
    height: auto;
    font-family: col;
    font-weight: 700;
    font-size: 1.5rem;
    line-height: .9em;
    letter-spacing: .02em;
}
.contcuadricula article p{
    width: 90%;
    height: auto;
    font-family: cor;
    font-weight: 400;
    font-size: 1.2rem;
    line-height: .9em;
    margin: 1em 0;
}
.btnCuadri{
    width: auto;
    height: auto;
    font-family: cor;
    font-weight: 700;
    font-size: 1.2rem;
    text-decoration: none;
}
.btnCuadri div{
    width: 5em;
    height: 1.5em;
    display: flex;
    justify-content: center;
    align-items: center;
    color: var(--color5);
    border: 2px solid var(--color5);
    border-style: dashed solid;
    border-radius: 1em;
}
.contcuadricula2{
    width: 100%;
    height: calc(200dvw);
    display: flex;
    flex-direction: column;
}
.contcuadricula2 picture{
    width: 100%;
    height: calc(200dvw / 2);
    position: relative;
    display: flex;
    align-items: center;
    justify-items: center;
}
.contcuadricula2 picture img{
    width: 100%;
    height: auto;
}
.contcuadricula2 article{
    width: 100%;
    height: calc(200dvw / 2);
    background: var(--color1);
    text-align: center;
    color: var(--color2);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
.contcuadricula2 article h2{
    width: 90%;
    height: auto;
    font-family: col;
    font-weight: 700;
    font-size: 1.5rem;
    line-height: .9em;
    letter-spacing: .02em;
}
.contcuadricula2 article p{
    width: 90%;
    height: auto;
    font-family: cor;
    font-weight: 400;
    font-size: 1.2rem;
    line-height: .9em;
    margin: 1em 0;
}
/* Productos y Servicios Fin */
/* Clientes Inicio */
.clientes{
    width: 100%;
    height: auto;
    overflow: hidden;
    padding: 0 0 4em 0;
}
.portaContClientes{
    width: 100%;
    height: auto;
    text-align: center;
}
.portaContClientes > article{
    width: 100%;
    height: auto;
    margin: 0 0 1em 0;
}
.portaContClientes > article h2{
    width: 100%;
    height: auto;
    color: var(--color2);
    font-family: col;
    font-weight: 700;
    font-size: 2rem;
    line-height: .9em;
    letter-spacing: .02em;
}
.contenedor__clientes {
    width: 100%;
    height: auto;
    display: flex;
}
.content_cliente {
    width: 50%;
    height: auto;
    display: block;
    position: relative;
    flex-shrink: 0;
    text-align: center;
}
.content_cliente_add{
    display: inherit;
}
/* Clientes Fin */
/* Main Fin */
/* Footer Inicio */
footer{
    width: 100%;
    height: auto;
    position: relative;
    background: var(--color2);
}
.curva3{
    width: 100%;
    height: 2em;
    border-radius: 8em 8em 0 0;
    background: var(--color2);
    position: absolute;
    top: -1.9em;
}
.contFooter{
    width: 100%;
    height: auto;
    display: flex;
    flex-direction: column;
}
.colum{
    width: 100%;
    height: auto;
    position: relative;
}
.colum img{
    width: 13em;
    height: auto;
    display: flex;
    margin: auto;
}
.contact{
    width: 100%;
    height: auto;
    color: var(--color1);
}
.contact div{
    width: 100%;
    height: auto;
    text-align: center;
}
.contact h3{
    width: 100%;
    height: auto;
    font-family: col;
    font-size: 13pt;
    margin: 1em 0 .5em 0;
    letter-spacing: 2px;
}
.contact p{
    width: 100%;
    height: auto;
    font-family: cor;
    font-size: 13pt;
}
.title3{
    color: var(--color1);
    font-family: col;
    font-size: 13pt;
    margin: 20px 0 20px 0;
    display: flex;
    cursor: pointer;
}
.title3 p{
    margin: 0 0 0 5dvw;
    letter-spacing: 1px;
}
.colum input[type="checkbox"]{
    width: 100%;
    height: 25px;
    position: absolute;
    top: 1.3em;
    cursor: pointer;
    z-index: 1;
    opacity: 0;
    margin: 0;
}
.colum input[type="checkbox"]:checked ~ .listCont{
    height: 0;
    opacity: 0;
    transform: translate(0, 10%);
    transition: all .5s ease-out;
}
.colum input[type="checkbox"]:checked ~ .title3 .p-line{
    opacity: 1;
}
.plus{
    width: 60px;
    height: 60px;
    position: absolute;
    background: none;
    border: 0;
    cursor: pointer;
    padding: 0;
    transform: translate(-6px, -19px);
    right: 0;
}
.p-line{
    border-radius: 5px;
    background: var(--color1);
    display: block;
    width: 40%;
    height: 3px;
    transform: rotate(90deg);
    margin: auto;
    opacity: 0;

    animation-duration: 1s;
    animation-fill-mode: forwards;
}
.s-line{
    border-radius: 5px;
    background: var(--color1);
    display: block;
    width: 40%;
    height: 3px;
    transform: translateY(-3px);
    margin: auto;

    animation-duration: 1s;
    animation-fill-mode: forwards;
}
.listCont{
    height: auto;
    font-family: col;
    font-size: 15pt;
    text-align: center;
    background-color: var(--color1);
    color: var(--color2);
    padding: 5px 0px;
    position: relative;
    overflow: hidden;
    opacity: 1;
    transform: translate(0, 0);
    transition: all .5s ease-out;
}
.listCont ul{
    list-style: none;
    padding: 0;
    margin: 0;
}
.listCont li{
    position: relative;
    margin: 30px 0 30px 10px;
    cursor: pointer;
}
.listCont a{
    color: var(--color2);
}
.listCont:nth-of-type(1){
    animation-delay: 0.5s;
}
.listCont:nth-of-type(2){
    animation-delay: 0.75s;
}
.listCont:nth-of-type(3){
    animation-delay: 1s;
}
footer hr{
    width: 90%;
    text-align: center;
    opacity: .5;
}
.final{
    width: 100%;
    height: auto;
    margin: 1em 0 0 0;
    color: var(--color1);
    font-family: cor;
    font-size: 10pt;
}
.textFinal{
    width: 90%;
    height: auto;
    margin: auto;
    text-align: center;
}
.kadDesign{
    width: 100%;
    height: auto;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1em 0;
}
.kadDesign img{
    width: 5em;
    height: auto;
    margin: 0 0 0 .5em;
}
/* Footer Fin */
@media only screen and (min-width:481px) and (max-width:768px) {

    /* Header Inicio */
    .ulCelu {
        padding: 1em 0;
    }

    .sectores input[type="checkbox"],
    .productos input[type="checkbox"],
    .servicios input[type="checkbox"],
    .language input[type="checkbox"] {
        left: 0;
        right: 0;
        margin: auto;
    }
    /* Header Fin */
    /* Slider Inicio */
    .slider {
        flex-direction: row;
    }
    .textSlider {
        width: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .textSlider p {
        width: 80%;
        line-height: 1.1em;
        letter-spacing: .07em;
        margin: 0;
        padding: 0;
        text-align: left;
    }
    .imgSlider {
        width: 50%;
        height: calc(100dvh - 5.5em);
        background-position: 0 -5em;
    }
    /* Slider Fin */
    /* Main Inicio */
    /* Nosotros Inicio */
    .curva1 {
        height: 1em;
        top: -1em;
    }
    .contNosotros {
        flex-direction: row;
        align-items: center;
        padding: 0 0 1em 0;
    }
    .imgNosotros {
        width: 50%;
        margin: auto;
    }
    .textNosotros {
        width: 50%;
    }
    .textNosotros > p {
        font-size: 1.8rem;
    }
    .textNosotros h1 {
        font-size: 1.8rem;
    }
    .textNosotros article {
        width: 90%;
        margin: 1em auto 2em auto;
        gap: 0.5em;
        font-size: 1rem;
        line-height: .9em;
        letter-spacing: .02em;
    }
    /* Nosotros Fin */
    /* Productos y Servicios Inicio */
    .contcuadricula {
        height: calc(100dvw / 2);
        flex-direction: row;
    }
    .contcuadricula picture {
    height: calc(100dvw / 2);
    }
    .triangulo {
        border-top: 1.5em solid transparent;
        border-left: 1em solid var(--color3);
        border-right: 0;
        border-bottom: 1.5em solid transparent;
        bottom: initial;
        left: initial;
        right: -1em;
    }
    .contcuadricula article {
    height: calc(100dvw / 2);
    }
    .contcuadricula article p {
        width: 80%;
    }
    .contcuadricula2 {
        height: calc(100dvw / 2);
        flex-direction: row-reverse;
    }
    .contcuadricula2 picture {
    height: calc(100dvw / 2);
    }
    .triangulo2 {
        border-top: 1.5em solid transparent;
        border-left: 0;
        border-right: 1em solid var(--color3);
        border-bottom: 1.5em solid transparent;
        bottom: initial;
        left: -1em;
        right: initial;
    }
    .contcuadricula2 article {
    height: calc(100dvw / 2);
    }
    .contcuadricula2 article p {
        width: 80%;
    }
    /* Productos y Servicios Fin */
    /* Clientes Inicio */
    .portaContClientes > article {
        margin: 2em 0;
    }
    .content_cliente {
        width: 25%;
    }
    /* Clientes Fin */
    /* Main Fin */
    /* Footer Inicio */
    .contact {
        display: flex;
        margin: 1em 0;
    }
    .final {
        display: flex;
    }
    /* Footer Fin */
}

@media only screen and (min-width:769px) and (max-width:1279px) {

    /* Header Inicio */
    .ulCelu {
        padding: 2em 0;
    }

    .sectores input[type="checkbox"],
    .productos input[type="checkbox"],
    .servicios input[type="checkbox"],
    .language input[type="checkbox"] {
        left: 42%;
    }
    /* Header Fin */
    /* Slider Inicio */
    .slider {
        flex-direction: row;
    }
    .textSlider {
        width: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .textSlider p {
        width: 80%;
        line-height: 1.1em;
        letter-spacing: .07em;
        margin: 0;
        padding: 0;
        text-align: left;
    }
    .imgSlider {
        width: 50%;
        height: 22em;
        background-position: 0 -5em;
    }
    /* Slider Fin */
    /* Main Inicio */
    /* Nosotros Inicio */
    .nosotros {
        padding: 0 0 3em 0;
    }
    .contNosotros {
        width: 90%;
        flex-direction: row;
        margin: auto;
    }
    .imgNosotros {
        width: 50%;
        height: 18em;
        margin: auto 0;
    }
    .textNosotros {
        width: calc(50% - 2em);
        margin: auto 0;
        padding: 0 0 0 2em;
    }
    /* Nosotros Fin */
    /* Productos y Servicios Inicio */
    .contcuadricula {
        height: calc(100dvw / 2);
        flex-direction: row;
    }
    .contcuadricula picture {
    height: calc(100dvw / 2);
    }
    .triangulo {
        border-top: 1.5em solid transparent;
        border-left: 1em solid var(--color3);
        border-right: 0;
        border-bottom: 1.5em solid transparent;
        bottom: initial;
        left: initial;
        right: -1em;
    }
    .contcuadricula article {
    height: calc(100dvw / 2);
    }
    .contcuadricula article p {
        width: 80%;
    }
    .contcuadricula2 {
        height: calc(100dvw / 2);
        flex-direction: row-reverse;
    }
    .contcuadricula2 picture {
    height: calc(100dvw / 2);
    }
    .triangulo2 {
        border-top: 1.5em solid transparent;
        border-left: 0;
        border-right: 1em solid var(--color3);
        border-bottom: 1.5em solid transparent;
        bottom: initial;
        left: -1em;
        right: initial;
    }
    .contcuadricula2 article {
    height: calc(100dvw / 2);
    }
    .contcuadricula2 article p {
        width: 80%;
    }
    /* Productos y Servicios Fin */
    /* Clientes Inicio */
    .portaContClientes > article {
        margin: 2em 0;
    }
    .content_cliente {
        width: 25%;
    }
    /* Clientes Fin */
    /* Main Fin */
    /* Footer Inicio */
    .contFooter > .colum{
        display: flex;
    }
    .colum picture{
        width: 40%;
        height: auto;
        margin: 0 0 0 5dvw;
    }
    .colum img {
        width: 15em;
        margin: 0;
    }
    .contact {
        width: 60%;
        display: block;
        margin: 1em 0;
    }
    .final {
        display: flex;
    }
    /* Footer Fin */
}

@media only screen and (min-width:1280px) {
    .left {
        width: 10%;
    }
    .right {
        width: 10%;
    }
    /* Header Inicio */
    header-mym{
        height: 6.6em;
    }
    header {
        height: 6.6em;
    }
    .logo {
        width: 20%;
    }
    .logo img {
        width: 12em;
        height: auto;
        position: absolute;
        top: 0.2em;
        left: 0;
        z-index: 20;
    }
    .nav {
        width: 60%;
        display: flex;
        align-items: center;
        justify-content: right;
    }
    .ulCelu {
        position: initial;
        top: 0;
        color: var(--color2);
        background: none;
        padding: 0;
        display: flex;
        gap: 2em;
        align-items: center;
    }
    .ulCelu li {
        width: auto;
        color: var(--color2);
    }
    .sectores,
    .productos,
    .servicios {
        position: initial;
    }
    .sectores input[type="checkbox"] {
        width: 5em;
        top: 2.8em;
        right: calc(10dvw + 44em);
    }
    .productos input[type="checkbox"] {
        width: 5em;
        top: 2.8em;
        right: calc(10dvw + 37em);
    }
    .servicios input[type="checkbox"] {
        width: 5em;
        top: 2.8em;
        right: calc(10dvw + 30em);
    }
    .language input[type="checkbox"] {
        width: 7em;
        right: -.5em;
    }
    .sectores input[type="checkbox"]:hover~p,
    .servicios input[type="checkbox"]:hover~p,
    .productos input[type="checkbox"]:hover~p {
        color: var(--color3);
    }
    .ulCelu span {
        display: contents;
    }
    #submenuPC {
        height: 20em;
        position: absolute;
        top: 16.7em;
        left: 0;
        right: 0;
        bottom: 0;
        margin: auto;
        box-shadow: 0px 10px 20px var(--color2);
        animation: sectoresMenu .5s normal ease-out;
    }
    #submenuPC picture{
        width: 40%;
        height: auto;
        float: right;
        margin: 0 10% 0 0;
        display: flex;
        align-items: center;
        display: inherit;
    }
    #submenuPC picture img{
        width: 30em;
        height: auto;
    }
    .submenuLanguage {
        position: absolute;
    }
    .submenu {
        width: 40%;
        height: auto;
        display: grid;
        grid-template-columns: repeat(3, 2fr);
        float: left;
        margin: 4em 0 0 10%;
        text-align: right;
    }
    .submenu li{
        margin: 1em 0;
    }
    #submenuPC a:hover{
        color: var(--color3);
    }
    .oficina p {
        width: 8em;
    }
    .oficina p:hover {
        background: #011230;
    }
    #hamburger {
        display: none;
    }
    /* Header Fin */
    /* Slider Inicio */
    .slider {
        flex-direction: row;
    }
    .textSlider {
        width: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .textSlider p {
        width: 100%;
        font-size: 4rem;
        line-height: 1.1em;
        letter-spacing: .07em;
        margin: 0 0 0 20%;
        padding: 0;
        text-align: left;
    }
    .imgSlider {
        width: 50%;
        min-height: 35em;
        height: calc(100dvh - 6.59em);
        max-height: 50em;
        background-position: center;
    }
    /* Slider Fin */
    /* Main Inicio */
    /* Nosotros Inicio */
    .nosotros {
        padding: 0 0 7em 0;
    }
    .curva1 {
        height: 4em;
        top: -3.9em;
    }
    .contNosotros {
        width: 80%;
        flex-direction: row;
        margin: auto;
    }
    .imgNosotros {
        width: 50%;
        height: 30em;
        margin: auto 0;
    }
    .textNosotros {
        width: calc(50% - 2em);
        margin: auto 0;
        padding: 0 0 0 2em;
    }
    .textNosotros > p {
        font-size: 3rem;
        line-height: .9em;
        letter-spacing: .03em;
    }
    .textNosotros h1 {
        font-size: 3rem;
        line-height: .9em;
        letter-spacing: .02em;
    }
    .textNosotros article {
        font-size: 1.2rem;
        line-height: 1em;
    }
    /* Nosotros Fin */
    /* Productos y Servicios Inicio */
    .cuadricula {
        grid-template-columns: repeat(4, 1fr);
    }
    .curva2{
        height: 4em;
        top: -3.9em;
    }
    .contcuadricula {
        height: calc(100dvw / 2);
        transition: all .5s ease-out;
    }
    .contcuadricula:hover > picture {
        animation: contCuadriPicture .5s forwards ease-in-out;
        transition: all .5s ease-out;
    }
    @keyframes contCuadriPicture {
        0%{
            height: calc(200dvw / 2);
        }
        100%{
            height: calc(250dvw / 2);
        }
    }
    .contcuadricula:hover > picture img {
        transition: all .5s .3s ease-in-out;
        transform: translateY(2em);
    }
    .contcuadricula:hover > article {
        animation: contCuadriArticle .5s forwards ease-in-out;
        transition: all .5s ease-out;
    }
    @keyframes contCuadriArticle {
        0%{
            height: calc(200dvw / 2);
        }
        100%{
            height: calc(150dvw / 2);
        }
    }
    .contcuadricula:hover > article a div {
        color: var(--color3);
        border: 2px solid var(--color3);
    }
    .btnCuadri:hover > div{
        background: var(--color2);
    }
    .contcuadricula2 {
        height: calc(100dvw / 2);
        flex-direction: column-reverse;
    }
    .contcuadricula2:hover > picture {
        animation: contCuadriPicture .5s forwards ease-in-out;
        transition: all .5s ease-out;
    }
    .contcuadricula2:hover > picture img {
        transition: all .5s .3s ease-in-out;
        transform: translateY(-2em);
    }
    .contcuadricula2:hover > article {
        animation: contCuadriArticle .5s forwards ease-in-out;
        transition: all .5s ease-out;
    }
    .contcuadricula2:hover > article a div {
        color: var(--color3);
        border: 2px solid var(--color3);
    }
    .triangulo2 {
        border-top: 0;
        border-bottom: 2em solid var(--color3);
        top: -2em;
        bottom: inherit;
    }
    /* Productos y Servicios Fin */
    /* Clientes Inicio */
    .clientes{
        padding: 0 0 7em 0;
    }
    .portaContClientes > article {
        margin: 2em 0;
    }
    .contenedor__clientes{
        width: 80%;
        height: auto;
        margin: 1em auto;
        gap: .5em;
    }
    .content_cliente {
        width: auto;
    }
    .content_cliente_add{
        display: none;
    }
    .content_cliente > picture img {
        width: calc((80dvw / 11) - .5em);
        height: auto;
    }
    /* Clientes Fin */
    /* Main Fin */
    /* Footer Inicio */
    .curva3 {
        height: 4em;
        top: -3.9em;
    }
    .contFooter {
        width: 90%;
        flex-direction: initial;
        margin: auto;
    }
    .colum {
        width: 25%;
    }
    .colum picture{
        width: 100%;
        height: auto;
    }
    .colum img {
        width: 18em;
        margin: auto;
    }
    .colum input[type="checkbox"] {
        display: none;
    }
    .title3 {
        margin: 0;
        display: flex;
    }
    .title3 p {
        margin: auto;
        text-align: center;
        cursor: default;
    }
    .plus {
        display: none;
    }
    .colum input[type="checkbox"]:checked ~ .listCont {
        height: auto;
        opacity: 1;
    }
    .listCont {
        background-color: var(--color2);
        color: var(--color1);
        font-family: cor;
        font-size: 13pt;
    }
    .listCont a {
        color: var(--color1);
    }
    .listCont a:hover {
        color: var(--color3);
        font-weight: 700;
    }
    .final{
        width: 90%;
        display: flex;
        margin: auto;
        font-size: 11pt;
    }
    .textFinal {
        width: 50%;
        text-align: left;
    }
    .textFinal br {
        display: none;
    }
    .kadDesign {
        width: 50%;
        justify-content: right;
    }
    /* Footer Fin */
}