.img-effect-dotted.dotted-left:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    bottom: 50%;
    right: 50%;
    background-image: url(data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='100' height='100' viewBox='0 0 100 100'><circle cx='50' cy='50' r='15' fill='%23f5ba4b'></circle></svg>);
    background-size: 0.5rem;
}

.text img.logoCont {
    max-height: 80px;
    margin-bottom: 20px;
    filter: grayscale(100%);
    transition: 1s;
    max-width: 170px;
    opacity: .5;
    transition: 1s;
}

.text:hover img.logoCont {
    filter: grayscale(0);
    opacity: 1;
}

.text-end {
    align-items: self-end;
}
span.lolotext {
    font-family: 'Caveat', cursive;
    font-size: 38px;
    display: block;
}
a.footer-brand.text-white {
    font-family: 'Caveat', cursive;
    font-size: 52px;
}
.text-l {
    font-size: 24px;
}
.text-xl {
    font-size: 46px;
}
.text-s {
    font-size: 24px;
}