.grid {
    display: grid;
    grid-gap: 20px;
    grid-template-columns: minmax(0, 1fr);
}
@media(min-width: 768px){
    .grid{
        grid-column-gap:40px;
    }
}
@media(min-width: 768px){
    .grid--2-1x5{
        grid-template-columns: minmax(0, 1fr) minmax(0, 5fr);
    }
}
@media(min-width: 768px){
    .grid--2-2x5{
        grid-template-columns: minmax(0, 2fr) minmax(0, 5fr);
    }
}
@media(min-width: 768px){
    .grid--2-3x5{
        grid-template-columns: minmax(0, 3fr) minmax(0, 5fr);
    }
}
@media(min-width: 768px){
    .grid--2-4x5{
        grid-template-columns: minmax(0, 4fr) minmax(0, 5fr);
    }
}
@media(min-width: 768px){
    .grid--2-5x5{
        grid-template-columns: minmax(0, 5fr) minmax(0, 5fr);
    }
}
@media(min-width: 768px){
    .grid--2-5x1{
        grid-template-columns: minmax(0, 5fr) minmax(0, 1fr);
    }
}
@media(min-width: 768px){
    .grid--2-5x2{
        grid-template-columns: minmax(0, 5fr) minmax(0, 2fr);
    }
}
@media(min-width: 768px){
    .grid--2-5x3{
        grid-template-columns: minmax(0, 5fr) minmax(0, 3fr);
    }
}
@media(min-width: 768px){
    .grid--2-5x4{
        grid-template-columns: minmax(0, 5fr) minmax(0, 4fr);
    }
}
@media(min-width: 768px){
    .grid--3{
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr);
    }
}

.fr-view h3{
    color: #24B5BB;
}
.fr-view ul{
    list-style: none;
}
.fr-view ul li{
    position: relative;
    margin-bottom: 5px;
}
.fr-view ul li::before{
    position: absolute;
    top: -13px;
    left: -20px;
    content: '•';
    font-size: 32px;
    color: #24B5BB;
}
.fr-view a{
    color: #24B5BB;
}
.fr-view a:hover{
    cursor: pointer;
    text-decoration: underline;
}