/** Fonts **/

/* roboto-300 - latin */
@font-face {
    font-family: "Roboto";
    font-style: normal;
    font-weight: 300;
    font-display: swap;
    src: local(""), url("../fonts/roboto-v29-latin-300.woff2") format("woff2"),
        /* Chrome 26+, Opera 23+, Firefox 39+ */
            url("../fonts/roboto-v29-latin-300.woff") format("woff"); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* roboto-regular - latin */
@font-face {
    font-family: "Roboto";
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: local(""),
        url("../fonts/roboto-v29-latin-regular.woff2") format("woff2"),
        /* Chrome 26+, Opera 23+, Firefox 39+ */
            url("../fonts/roboto-v29-latin-regular.woff") format("woff"); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* roboto-500 - latin */
@font-face {
    font-family: "Roboto";
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: local(""), url("../fonts/roboto-v29-latin-500.woff2") format("woff2"),
        /* Chrome 26+, Opera 23+, Firefox 39+ */
            url("../fonts/roboto-v29-latin-500.woff") format("woff"); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* roboto-700 - latin */
@font-face {
    font-family: "Roboto";
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: local(""), url("../fonts/roboto-v29-latin-700.woff2") format("woff2"),
        /* Chrome 26+, Opera 23+, Firefox 39+ */
            url("../fonts/roboto-v29-latin-700.woff") format("woff"); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}

/* montserrat-100 - latin */
@font-face {
    font-family: "Montserrat";
    font-style: normal;
    font-weight: 100;
    font-display: swap;
    src: local(""),
        url("../fonts/montserrat-v23-latin-100.woff2") format("woff2"),
        /* Chrome 26+, Opera 23+, Firefox 39+ */
            url("../fonts/montserrat-v23-latin-100.woff") format("woff"); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* montserrat-300 - latin */
@font-face {
    font-family: "Montserrat";
    font-style: normal;
    font-weight: 300;
    font-display: swap;
    src: local(""),
        url("../fonts/montserrat-v23-latin-300.woff2") format("woff2"),
        /* Chrome 26+, Opera 23+, Firefox 39+ */
            url("../fonts/montserrat-v23-latin-300.woff") format("woff"); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* montserrat-regular - latin */
@font-face {
    font-family: "Montserrat";
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: local(""),
        url("../fonts/montserrat-v23-latin-regular.woff2") format("woff2"),
        /* Chrome 26+, Opera 23+, Firefox 39+ */
            url("../fonts/montserrat-v23-latin-regular.woff") format("woff"); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* montserrat-500 - latin */
@font-face {
    font-family: "Montserrat";
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: local(""),
        url("../fonts/montserrat-v23-latin-500.woff2") format("woff2"),
        /* Chrome 26+, Opera 23+, Firefox 39+ */
            url("../fonts/montserrat-v23-latin-500.woff") format("woff"); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* montserrat-600 - latin */
@font-face {
    font-family: "Montserrat";
    font-style: normal;
    font-weight: 600;
    font-display: swap;
    src: local(""),
        url("../fonts/montserrat-v23-latin-600.woff2") format("woff2"),
        /* Chrome 26+, Opera 23+, Firefox 39+ */
            url("../fonts/montserrat-v23-latin-600.woff") format("woff"); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* montserrat-700 - latin */
@font-face {
    font-family: "Montserrat";
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: local(""),
        url("../fonts/montserrat-v23-latin-700.woff2") format("woff2"),
        /* Chrome 26+, Opera 23+, Firefox 39+ */
            url("../fonts/montserrat-v23-latin-700.woff") format("woff"); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* montserrat-800 - latin */
@font-face {
    font-family: "Montserrat";
    font-style: normal;
    font-weight: 800;
    font-display: swap;
    src: local(""),
        url("../fonts/montserrat-v23-latin-800.woff2") format("woff2"),
        /* Chrome 26+, Opera 23+, Firefox 39+ */
            url("../fonts/montserrat-v23-latin-800.woff") format("woff"); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* montserrat-300italic - latin */
@font-face {
    font-family: "Montserrat";
    font-style: italic;
    font-weight: 300;
    font-display: swap;
    src: local(""),
        url("../fonts/montserrat-v23-latin-300italic.woff2") format("woff2"),
        /* Chrome 26+, Opera 23+, Firefox 39+ */
            url("../fonts/montserrat-v23-latin-300italic.woff") format("woff"); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* montserrat-500italic - latin */
@font-face {
    font-family: "Montserrat";
    font-style: italic;
    font-weight: 500;
    font-display: swap;
    src: local(""),
        url("../fonts/montserrat-v23-latin-500italic.woff2") format("woff2"),
        /* Chrome 26+, Opera 23+, Firefox 39+ */
            url("../fonts/montserrat-v23-latin-500italic.woff") format("woff"); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* montserrat-700italic - latin */
@font-face {
    font-family: "Montserrat";
    font-style: italic;
    font-weight: 700;
    font-display: swap;
    src: local(""),
        url("../fonts/montserrat-v23-latin-700italic.woff2") format("woff2"),
        /* Chrome 26+, Opera 23+, Firefox 39+ */
            url("../fonts/montserrat-v23-latin-700italic.woff") format("woff"); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}

html {
    font-size: 10px;
}

body {
    font-family: "Roboto", sans-serif;
    font-weight: 400;
    height: 100%;
    overflow: hidden;
}

@media (min-width: 576px) {
    html {
        font-size: 12px;
    }
}

@media (min-width: 768px) {
    html {
        font-size: 14px;
    }
}

@media (min-width: 992px) {
    html {
        font-size: 14px;
    }
}

@media (min-width: 1200px) {
    html {
        font-size: 14px;
    }
}

#messages {
    display: flex;
    flex-direction: column;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 1;
}

.message {
    width: 100%;
    text-align: center;
    padding: 5px;
    margin-bottom: 5px;
}

.message.success {
    background-color: #55efc4;
}

.message.info {
    background-color: #74b9ff;
}

.message.warning {
    background-color: #fdcb6e;
}

.message.error {
    background-color: #e17055;
}
