@import url(hacemos.min.css);
@import url(clientes.min.css);
@import url(lenguajes.min.css);
@import url(partners.min.css);
@import url(contacto.min.css);
@import url(productos.min.css);
@import url(1.min.css);
@import url(metod.min.css);
@import url(qhac.min.css);

header,img{
    max-width:100%
}

.container,.item,.menu{
    border-radius:.1em
}

#lbl-menu,.item:hover{
    cursor:pointer
}

.item,.item a{
    font-size:14px
}

.container a,.item a,.item a:hover,a:active,a:focus{
    text-decoration:none;
    color:#fff
}

*{
    margin:0;
    padding:0;
    box-sizing:border-box
}

/*@font-face{
    font-family:Eurosti;src:url(font/Eurosti.oet)
}

@font-face{
    font-family:Eurosti;
    src:url(font/Eurosti.ttf)
}

body{
    font-family:Eurosti,sans-serif;
}*/

.item,.item:hover,.menu{
    background-color:#000
}

header{
    height:50%;flex:0 0 auto
}

img{
    height:auto
}

.container{
    display:block;
    width:100%;
    background:#000;
    color:#fff;
    box-shadow:0 1px 5px #000;
    margin:-4px
}

.menu{
    margin:0;
    padding:.2em;
    box-shadow:0 2px 5px #000
}

.expand-menu-text{
    margin:6px;
    color:#fff
}

#lbl-menu{
    margin:4px
}

.container ul{
    list-style:none;
    padding:0;
    margin:0
}

.container a{
    display:block;
    padding:10px
}

.item{
    text-align:center;
    display:inline-block;
    list-style-type:none;
    transition:all .3s ease-in-out
}

.item a::before,.item a:active::before{
    background-color:red
}

#cb-menu{
    position:fixed;
    left:-9999px
}

.expand-menu{
    display:none;
    justify-content:space-between
}

.item a{
    position:relative;
    display:block;
    padding:16px 0;
    margin:0 12px;
    letter-spacing:1px;
    line-height:16px;
    font-weight:450;
    transition:color .1s,background-color .1s,padding .2s ease-in
}

.item a::before{
    content:'';
    display:block;
    position:absolute;
    bottom:3px;
    left:0;
    height:3px;
    width:100%;
    transform-origin:right top;
    transform:scale(0,1);
    transition:color .1s,transform .2s ease-out
}

.item a:hover::before,a:focus::before{
    transform-origin:left top;
    transform:scale(1,1)
}

@media screen and (max-width:768px){
    .item,.menu{
        background-color:#000;
        border-radius:0
    }
    
    .expand-menu,.item,.menu{
        background-color:#000
    }
    
    .item{
        display:block;
        margin-bottom:.1em
    }
    
    .menu{
        overflow:hidden;
        height:0;
        padding:0
    }
    
    .expand-menu{
        display:flex
    }
    
    #cb-menu:checked+.menu{
        height:auto;padding:auto
    }
}

