*{ padding:0; margin:0; outline: none; 

-webkit-tap-highlight-color: rgba(0,0,0,0);
-webkit-font-smoothing: subpixel-antialiased;
}

@media screen and (max-width: 900px) {
    .maxWidth {
        padding:0 10px !important;
    }

    .boxLogo, .insidePage .boxLogo {
        text-align: left;
        width: 100%;
        height: unset;
        background-color: #fff;
        border-right: 1px solid #f5f5f5;
    }
    .logo ,.insidePage .logo{
        margin-left: 0;
        width: 60px;
        height: 64px;
        background-size: 54px;
    }
    .boxMenu ,.insidePage .boxMenu{
        position: absolute;
        top: 29px;
        width: 100%;
        text-align: center;
        max-width: none;
        left: 0;
        right: 0;
    }
    #content_site {
        padding-left: 135px;
        padding-top: 0;
    }
    .underBoxLogo {
        height: 140px;
        width: 135px;
        display: none;
    }
    .boxSquare {
        text-align: center;
    }

    .colWorkMenu {
        transform: translateX(0);
        -o-transform: translateX(0);
        -ms-transform: translateX(0);
        -moz-transform: translateX(0);
        -webkit-transform: translateX(0);
        padding-top: 0;
        width: 85px;
        padding-top:90px;
    }
        .colWorkMenu li {
            width: 84px;
            height: 84px;
        }

            .colWorkMenu li a {
                width: 84px;
            height: 84px;
            }

    .imagePortfolio {
        margin-left: 84px !important;
        width: calc( 100% - 84px) !important;
    }

    .imagePortfolio .endLoadLazy{
    
        width: calc( 100% );
        margin-top: 84px;
        height:calc(100% - 84px);
    }

    .swiper-container-horizontal > .swiper-pagination-bullets, .swiper-pagination-custom, .swiper-pagination-fraction {
        top: 90px;
    }

       
}


@media screen and (max-width: 600px) {
    .square {
        min-height: 100px;
        width: 100px;
        margin: 2px;
    }
    .colWorkMenu {
        /*
        transform: translateX(-87px);
        -o-transform: translateX(-87px);
        -ms-transform: translateX(-87px);
        -moz-transform: translateX(-87px);
        -webkit-transform: translateX(-87px);
        */
        padding-top: 0;
        width: 85px;
    }
        .colWorkMenu.open {
            transform: translateX(0px);
            -o-transform: translateX(0px);
            -ms-transform: translateX(0px);
            -moz-transform: translateX(0px);
            -webkit-transform: translateX(0px);
        }

    

}

@media screen and (max-width: 400px) {
    .square {
        min-height: 80px;
        width: 80px;
        margin: 2px;
    }
    .boxInfoWork {
        width:100%;
        padding-left:85px;
    }
        .boxInfoWork h1 {
            font-size: 20px;
        }
    .bodyWork p {
        padding:5px 0;
    }
}

@media screen and (orientation:landscape) {
    .imagePortfolio .endLoadLazy {
        background-size: auto 100% !important;
        position: fixed !important;
    }
}
@media screen and (orientation:portrait) {
    .imagePortfolio .endLoadLazy {
        background-size: 100% auto !important;
        position: fixed !important;
    }
}