So when you open "lists" on the main menu, this is what shows up:
Those bars with backgrounds have the following characteristics:
width: 310px
height: 70px
distance between each image: 3px
The names of the lists:
font-family: Montserrat-Regular;
font-size: 13px;
color: #F5F5F5;
info about the lists:
font-family: Montserrat-Light;
font-size: 11px;
color: #F5F5F5;
distance between the names of the lists and the info text: 6px (minimum)
The gradient over the images is a rectangle that works the following way:
background-image: linear-gradient(90deg, rgba(32,29,32,0.60) 0%, rgba(32,29,32,0.94) 68%);
When you hover on the images, the rectangle should turn this way:
background-image: linear-gradient(90deg, rgba(32,29,32,0.18) 0%, rgba(32,29,32,0.82) 68%);
So when you open "lists" on the main menu, this is what shows up:
Those bars with backgrounds have the following characteristics: width: 310px height: 70px distance between each image: 3px
The names of the lists: font-family: Montserrat-Regular; font-size: 13px; color: #F5F5F5;
info about the lists: font-family: Montserrat-Light; font-size: 11px; color: #F5F5F5;
distance between the names of the lists and the info text: 6px (minimum)
The gradient over the images is a rectangle that works the following way: background-image: linear-gradient(90deg, rgba(32,29,32,0.60) 0%, rgba(32,29,32,0.94) 68%);
When you hover on the images, the rectangle should turn this way: background-image: linear-gradient(90deg, rgba(32,29,32,0.18) 0%, rgba(32,29,32,0.82) 68%);