@charset "UTF-8";

.TileMenu1,
.TileMenu2,
.TileMenu3,
.TileMenu4{
    display: grid;
    row-gap:6px;
    width:100%;
    margin-bottom:6px;
}
.TileMenu2x2{
    display: grid;
    row-gap:6px;
    width:100%;
    margin-bottom:6px;
    grid-template-rows: 1fr 1fr;
    grid-template-columns: 1fr 1fr;
    column-gap:6px;
}
.TileMenu1{
    grid-template-columns: 1fr;
}
.TileMenu2{
    grid-template-columns: 1fr 1fr;
    column-gap:6px;
}
.TileMenu3{
    grid-template-columns: 1fr 1fr 1fr;
    column-gap:6px;
}
.TileMenu4{
    grid-template-columns: 1fr 1fr 1fr 1fr;
    column-gap:6px;
}
.column1{
    grid-column:1/2;
}
.column2{
    grid-column:2/3;
}
.column3{
    grid-column:3/4;
}
.column4{
    grid-column:4/5;
}
.column13{
    grid-column:1/4;
}
.column34{
    grid-column:4/5;
}
.row1{
    grid-row:1/2;
}
.row2{
    grid-row:2/3;
}
.row12{
    grid-row:1/3;
}


.TileMenu1 img,
.TileMenu2 img,
.TileMenu3 img,
.TileMenu4 img,
.TileMenu2x2 img{
    width: 100%;
    height:100%;
    border-radius:5px;
    transition: .3s;
}
.TileMenu1 a:hover img,
.TileMenu2 a:hover img,
.TileMenu3 a:hover img,
.TileMenu4 a:hover img,
.TileMenu2x2 a:hover img{
    filter:drop-shadow(0px 0px 1px rgba(6, 9, 235, 0.7))
    drop-shadow(0px 0px 3px rgba(43, 46, 223, 0.6))
    drop-shadow(0px 0px 4px rgba(16, 101, 230, 0.5));
}