@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url(/assets/fonts/Montserrat.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

html, body {
    font-family: "Montserrat", sans-serif;
    font-size: 22px;
    word-wrap: anywhere;
}

.displayFlex {
    display: flex;
}

.flexBox {
    display: flex;
    min-width: 100vw;
    min-height: 100vh;
    justify-content: center;
    align-items: center;
    flex-direction: column;
} .flexBox .profileLink {
    margin: 5px;
    text-decoration: none;
    color: #fa4dc2;
} .flexBox h3 {
    padding: 0; margin: 0;
} .flexBox p {
    margin: 10px;
}

.gridBox {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    justify-content: center;
    align-content: center;
} .gridBox .gridInBox {
    max-width: 320px;
    display: grid;
    justify-items: center;
    justify-self: center;
} .gridBox .gridInBox img {
    max-width: clamp(150px, 30vw, 400px);
} .gridBox .gridInBox h3 {
    margin: 10px
} .gridBox .gridInBox h2 {
    margin: 0
} .gridBox .gridInBox p {
    margin-bottom: 25px;
}

@media only screen and (max-width: 1000px) {
    .gridBox {
        display: grid;
        grid-template-columns: 1fr 1fr;
    }
}

@media only screen and (max-width: 700px) {
    .gridBox {
        display: grid;
        grid-template-columns: 1fr;
    }
}

.imgRounded {
    border-radius: 100%;
    vertical-align: middle;
}

.smallText {
    font-size: 14px;
}

.breakWhiteSpacesText {
    white-space: break-spaces;
}

.pad050 {
    padding: 0 50px;
}

.width50p {
    width: 50%;
}

.noMargin {
    margin: 0;
}

.successText {
    color: #09aa0c;
} .warnText {
    color: #bb5800;
} .failText {
    color: #ff001e;
} .boldText {
    font-weight: bold;
}