#tool-list
{
    grid-template-columns: repeat(4, 1fr);
}

@media only screen and (max-width: 900px)
{

    #tool-list
    {
        grid-template-columns: repeat(3, 1fr);
    }

}

@media only screen and (max-width: 700px)
{

    #tool-list
    {
        grid-template-columns: repeat(2, 1fr);
    }

}

@media only screen and (max-width: 540px)
{

    #tool-list
    {
        grid-template-columns: repeat(1, 1fr);
    }

}

#tool-list .bi
{
    display: inline-block;
    font-size: 3em;
    margin-bottom: 20px;
}

#tool-list h3
{
    font-family: "Francois One", sans-serif;
	font-size: 1.8em;
    font-weight: 400;
    letter-spacing: -2px;
    margin: 0 0 10px;
    text-transform: uppercase;

}

#tool-list a
{
	display: inline-block;
    text-decoration: none;
}

#tool-list p
{
	color: var(--content-text);
    margin: 0;
}