.body { margin:0;
background:#131314;
}


.cc {

-webkit-transition: all .13s ease-in-out;
-transition: all .13s ease-in-out;
-moz-transition: all .13s ease-in-out;


float:left;

transform:scale(.91);
}


.cc:hover { transform: scale(1.29);

}

.nav {
        top:69px;
        left:36px;
        position:absolute;
        width: 100px;
         z-index:10;
}

.outc {
        margin-right: 0px;
    height:100vh;
        max-width: 100%;
        position:relative;
}


.container {
width:100%;
height:100vh;

overflow:hidden;
}

.block { float:left; }


.block>li {
float:left;
width:42px;
height:42px;
background:#131314;
-webkit-transition: background-color 10350ms ease-out;
-transition: background-color 10350ms ease-out;
-ms-transition: background-color 10350ms ease-out;
-moz-transition:background-color 10350ms ease-out;
list-style: none;
margin: 0 0 0 0;
padding: 0 0 0 0;
}






.box:hover {
-moz-transition:background-color 100ms ease-out;

background:#699cdc}



.icn {
    max-height:220px ! important;
    max-width:240px ! important;
}

.bigcn { max-height:120px ! important;
    max-width:240px ! important;
    margin-top:12px;
    margin-left:55px;
    filter: grayscale(100%);
}

.bigcn:hover { filter: grayscale(1%);

}


@media ( max-width:1391px ) {

    .icn {
        min-width:300px ! important;
        max-height:350px ! important;
            max-width: 350px ! important;
            margin-bottom:25px;
    }
    .ccc {
        min-height: 160px;

    }
    .bigcn {
        margin-top:10px;
        margin-left:8px;
    }

li {
    cursor: pointer;
    padding: 10px;
    margin: 5px;
    display: block; /* Forces block behavior regardless of parent */
    /* Set a default background if none exists */
    background-color: #f0f0f0;
}

/* Optional: Add this only if you're using <ul> */
ul {
    list-style-type: none; /* Removes bullets */
    padding: 0;
}