.grid-work-mbl {
    display: none;
    height: 0%;
    width: 0%;
}
.works{
    
    display: contents;
}
.works .grid-work{
    border: 3px solid #fff;
    display:table;
    height: 156px;
    
    width: 33.333333%;
    float: left;
    margin-top: 0px;
    
}
.works .grid-work:nth-child(1) {
    height: 312px;
    
    width: 66.666667%;
    float: left;
}
.works .grid-work:nth-child(2) {
    height: 468px;
    background-color:blue;
    width: 33.333333%;
    float: left;
}
.works .grid-work:nth-child(3) {
    height: 156px;
    background-color:blue;
    width: 33.333333%;
    float: left;
    margin-top: -156px;
}
.works .grid-work:nth-child(4) {
    height: 156px;
    
    width: 33.333333%;
    float: left;
    margin-top: 0px;
}
.works .grid-work:nth-child(5) {
    height: 312px;
    
    width: 33.333333%;
    float: left;
    margin-top: -156px;
}
.works .grid-work:nth-child(6) {
    height: 312px;
    
    width: 33.333333%;
    float: left;
}
.works .grid-work:nth-child(7) {
    height: 468px;
    
    width: 66.666667%;
    float: left;
    margin-top: -156px;
}
.works .grid-work:nth-child(8) {
    height: 312px;
    
    width: 33.333333%;
    float: left;
    
}
.works .grid-work:nth-child(9) {
    height: 312px;
    
    width: 33.333333%;
    float: left;
   
}
.works .grid-work:nth-child(10) {
    height: 312px;
    
    width: 33.333333%;
    float: left;
    
}
.works .grid-work:nth-child(11) {
    height: 312px;
    
    width: 33.333333%;
    float: left;
   
   
}
.works .grid-work:nth-child(12) {
    height: 312px;
    
    width: 66.666667%;
    float: left;
}
.works .grid-work:nth-child(13) {
    height: 312px;
    
    width: 33.333333%;
    float: left;
   
}
.works .grid-work:nth-child(14) {
    height: 312px;
    
    width: 66.666667%;
    float: left;
}
.works .grid-work:nth-child(15) {
    height: 468px;
    background-color:blue;
    width: 33.333333%;
    float: left;
}
.works .grid-work:nth-child(16) {
    height: 156px;
    background-color:blue;
    width: 33.333333%;
    float: left;
    margin-top: -156px;
}
.works .grid-work:nth-child(17) {
    height: 156px;
    
    width: 33.333333%;
    float: left;
    margin-top: 0px;
}
.works .grid-work:nth-child(18) {
    height: 312px;
    
    width: 33.333333%;
    float: left;
    margin-top: -156px;
}
.works .grid-work:nth-child(19) {
    height: 312px;
    
    width: 33.333333%;
    float: left;
   
}
.works .grid-work:nth-child(20) {
    height: 468px;
    
    width: 66.666667%;
    float: left;
    margin-top: -156px;
}
.works .grid-work:nth-child(21) {
    height: 312px;
    
    width: 33.333333%;
    float: left;
   
}
.works .grid-work:nth-child(22) {
    height: 312px;
    
    width: 33.333333%;
    float: left;
   
}
.works .grid-work:nth-child(23) {
    height: 312px;
    
    width: 33.333333%;
    float: left;
   
}
.works .grid-work:nth-child(24) {
    height: 312px;
    
    width: 33.333333%;
    float: left;
   
}
.works .grid-work:nth-child(25) {
    height: 312px;
    
    width: 66.666667%;
    float: left;
}
.works .grid-work:nth-child(26) {
    height: 468px;
    background-color:blue;
    width: 33.333333%;
    float: left;
}
.works .grid-work:nth-child(27) {
    height: 156px;
    background-color:blue;
    width: 33.333333%;
    float: left;
    margin-top: -156px;
}
.works .grid-work:nth-child(28) {
    height: 156px;
    
    width: 33.333333%;
    float: left;
    margin-top: 0px;
}
.works .grid-work:nth-child(29) {
    height: 312px;
    
    width: 33.333333%;
    float: left;
    margin-top: -156px;
}
.works .grid-work:nth-child(30) {
    height: 312px;
    
    width: 33.333333%;
    float: left;
}
.works .grid-work:nth-child(31) {
    height: 468px;
    
    width: 66.666667%;
    float: left;
    margin-top: -156px;
}
.works .grid-work:nth-child(32) {
    height: 312px;
    
    width: 33.333333%;
    float: left;
    
}
.works .grid-work:nth-child(33) {
    height: 468px;
    background-color:blue;
    width: 33.333333%;
    float: left;
}
.works .grid-work:nth-child(34) {
    height: 156px;
    
    width: 33.333333%;
    float: left;
    margin-top: 0px;
}
.works .grid-work:nth-child(35) {
    height: 156px;
    
    width: 33.333333%;
    float: left;
    margin-top: 0px;
}
.works .grid-work:nth-child(36) {
    height: 312px;
    
    width: 66.666667%;
    float: left;
}
.works .grid-work:nth-child(37) {
    height: 468px;
    background-color:blue;
    width: 33.333333%;
    float: left;
}
.works .grid-work:nth-child(38) {
    height: 156px;
    
    width: 33.333333%;
    float: left;
    margin-top: 0px;
}
.works .grid-work:nth-child(39) {
    height: 156px;
    
    width: 33.333333%;
    float: left;
    margin-top: 0px;
}
.works .grid-work:nth-child(40) {
    height: 156px;
    
    width: 33.333333%;
    float: left;
    margin-top: 0px;
}
.works .grid-work:nth-child(41) {
    height: 156px;
    
    width: 33.333333%;
    float: left;
    margin-top: 0px;
}
.works .grid-work:nth-child(42) {
    height: 156px;
    
    width: 33.333333%;
    float: left;
    margin-top: 0px;
}
.works .grid-work:nth-child(43) {
    height: 156px;
    
    width: 33.333333%;
    float: left;
    margin-top: 0px;
}
.works .grid-work:nth-child(44) {
    height: 156px;
    
    width: 33.333333%;
    float: left;
    margin-top: 0px;
}
.works .grid-work:nth-child(45) {
    height: 156px;
    
    width: 33.333333%;
    float: left;
    margin-top: 0px;
}
.works .grid-work:nth-child(46) {
    height: 156px;
    
    width: 33.333333%;
    float: left;
    margin-top: 0px;
}
.works .grid-work:nth-child(47) {
    height: 156px;
    
    width: 33.333333%;
    float: left;
    margin-top: 0px;
}
.works .grid-work:nth-child(48) {
    height: 156px;
    
    width: 33.333333%;
    float: left;
    margin-top: 0px;
}
.works .grid-work:nth-child(49) {
    height: 156px;
    
    width: 33.333333%;
    float: left;
    margin-top: 0px;
}
.works .grid-work:nth-child(50) {
    height: 156px;
    
    width: 33.333333%;
    float: left;
    margin-top: 0px;
}
@media (max-width: 990px) {
    .mbl{display:flex;}
    .works {
        display: contents;
    }

        .works .grid-work {
            border: 3px solid #fff;
            display: table;
            height: 100%;
            width: 100%;
            float: left;
            margin-top: 0px;
        }

            .works .grid-work:nth-child(1) {
                
                width: 100%;
                margin:0px
                
            }

            .works .grid-work:nth-child(2) {
                width: 100%;
                margin: 0px
            }

            .works .grid-work:nth-child(3) {
                width: 100%;
                margin: 0px
            }

            .works .grid-work:nth-child(4) {
                width: 100%;
                margin: 0px
            }

            .works .grid-work:nth-child(5) {
                width: 100%;
                margin: 0px
            }

            .works .grid-work:nth-child(6) {
                width: 100%;
                margin: 0px
            }

            .works .grid-work:nth-child(7) {
                width: 100%;
                margin: 0px
            }

            .works .grid-work:nth-child(8) {
                width: 100%;
                margin: 0px
            }

            .works .grid-work:nth-child(9) {
                width: 100%;
                margin: 0px
            }

            .works .grid-work:nth-child(10) {
                width: 100%;
                margin: 0px
            }

            .works .grid-work:nth-child(11) {
                width: 100%;
                margin: 0px
            }

            .works .grid-work:nth-child(12) {
                width: 100%;
                margin: 0px
            }

            .works .grid-work:nth-child(13) {
                width: 100%;
                margin: 0px
            }

            .works .grid-work:nth-child(14) {
                width: 100%;
                margin: 0px
            }

            .works .grid-work:nth-child(15) {
                width: 100%;
                margin: 0px
            }

            .works .grid-work:nth-child(16) {
                width: 100%;
                margin: 0px
            }

            .works .grid-work:nth-child(17) {
                width: 100%;
                margin: 0px
            }

            .works .grid-work:nth-child(18) {
                width: 100%;
                margin: 0px
            }

            .works .grid-work:nth-child(19) {
                width: 100%;
                margin: 0px
            }

            .works .grid-work:nth-child(20) {
                width: 100%;
                margin: 0px
            }

            .works .grid-work:nth-child(21) {
                width: 100%;
                margin: 0px
            }

            .works .grid-work:nth-child(22) {
                width: 100%;
                margin: 0px
            }

            .works .grid-work:nth-child(23) {
                width: 100%;
                margin: 0px
            }

            .works .grid-work:nth-child(24) {
                width: 100%;
                margin: 0px
            }

            .works .grid-work:nth-child(25) {
                width: 100%;
                margin: 0px
            }

            .works .grid-work:nth-child(26) {
                width: 100%;
                margin: 0px
            }

            .works .grid-work:nth-child(27) {
                width: 100%;
                margin: 0px
            }

            .works .grid-work:nth-child(28) {
                width: 100%;
                margin: 0px
            }

            .works .grid-work:nth-child(29) {
                width: 100%;
                margin: 0px
            }

            .works .grid-work:nth-child(30) {
                width: 100%;
                margin: 0px
            }

            .works .grid-work:nth-child(31) {
                width: 100%;
                margin: 0px
            }

            .works .grid-work:nth-child(32) {
                width: 100%;
                margin: 0px
            }

            .works .grid-work:nth-child(33) {
                width: 100%;
                margin: 0px
            }

            .works .grid-work:nth-child(34) {
                width: 100%;
                margin: 0px
            }

            .works .grid-work:nth-child(35) {
                width: 100%;
                margin: 0px
            }

            .works .grid-work:nth-child(36) {
                width: 100%;
                margin: 0px
            }

            .works .grid-work:nth-child(37) {
                width: 100%;
                margin: 0px
            }

            .works .grid-work:nth-child(38) {
                width: 100%;
                margin: 0px
            }

            .works .grid-work:nth-child(39) {
                width: 100%;
                margin: 0px
            }

            .works .grid-work:nth-child(40) {
                width: 100%;
                margin: 0px
            }

            .works .grid-work:nth-child(41) {
                width: 100%;
                margin: 0px
            }

            .works .grid-work:nth-child(42) {
                width: 100%;
            }

            .works .grid-work:nth-child(43) {
                width: 100%;
                margin: 0px
            }

            .works .grid-work:nth-child(44) {
                width: 100%;
                margin: 0px
            }

            .works .grid-work:nth-child(45) {
                width: 100%;
                margin: 0px
            }

            .works .grid-work:nth-child(46) {
                width: 100%;
                margin: 0px
            }

            .works .grid-work:nth-child(47) {
                width: 100%;
                margin: 0px
            }

            .works .grid-work:nth-child(48) {
                width: 100%;
                margin: 0px
            }

            .works .grid-work:nth-child(49) {
                width: 100%;
                margin: 0px
            }

            .works .grid-work:nth-child(50) {
                width: 100%;
                margin: 0px
            }
}