@font-face {
    font-family:'Font Awesome 5 Pro';
    font-style:normal;
    font-weight:400;
    src:url("../fonts/fa-regular-400.eot");
    src:url("../fonts/fa-regular-400.eot#iefix") format("embedded-opentype"),
    url("../fonts/fa-regular-400.woff2") format("woff2"),
    url("../fonts/fa-regular-400.woff") format("woff"),
    url("../fonts/fa-regular-400.ttf") format("truetype"),
    url("../images/fa-regular-400.svg#fontawesome") format("svg");
    font-display:swap
}

@font-face {
    font-family:'Font Awesome 5 Pro';
    font-style:normal;
    font-weight:900;
    src:url("../fonts/fa-solid-900.eot");
    src:url("../fonts/fa-solid-900.eot#iefix") format("embedded-opentype"),
    url("../fonts/fa-solid-900.woff2") format("woff2"),
    url("../fonts/fa-solid-900.woff") format("woff"),
    url("../fonts/fa-solid-900.ttf") format("truetype"),
    url("../images/fa-solid-900.svg#fontawesome") format("svg");
    font-display:swap
}

@font-face {
    font-family:'Font Awesome 5 Brands';
    font-style:normal;
    font-weight:normal;
    src:url("../fonts/fa-brands-400.eot");
    src:url("../fonts/fa-brands-400.eot#iefix") format("embedded-opentype"),
    url("../fonts/fa-brands-400.woff2") format("woff2"),
    url("../fonts/fa-brands-400.woff") format("woff"),
    url("../fonts/fa-brands-400.ttf") format("truetype"),
    url("../images/fa-brands-400.svg#fontawesome") format("svg");
    font-display:swap
}

.far{
    font-family:'Font Awesome 5 Pro', sans-serif;
    font-weight:400
}

.fa, .fas {
    font-family:'Font Awesome 5 Pro', sans-serif;
    font-weight:900
}

.fab {
    font-family:'Font Awesome 5 Brands', sans-serif;
}

.messages-wrapper {
    position: fixed;
    display: block;
    left: 10px;
    right: 10px;
    bottom: 10px;
    margin: 0;
    padding: 0;
    z-index: 70
}

@media screen and (min-width: 768px) {
    .messages-wrapper {
        left: auto;
        bottom: 20px;
        right: 20px;
        width: 350px
    }
}

.message {
    position: relative;
    color: #fbfe77;
    border-color: #fbfe77;
    margin: 0 0 10px;
    min-height: 70px;
    border-radius: 3px;
    font-size: 16px;
    padding: 15px 40px 15px 60px;
    background: #303030;
    box-shadow: 0 0 8px 0 #0000000A;
    -ms-box-shadow: 0 0 8px 0 #0000000A;
    animation-duration: 0.3s !important;
    -o-box-shadow: 0 4px 20px rgba(54,63,77,0.4);
    transition: 0.3s all
}

.message:before {
    content: "\f05a";
    font-family:'Font Awesome 5 Pro', sans-serif;
    font-size: 30px;
    font-weight: 300;
    color: #fbfe77;
    position: absolute;
    left: 15px;
    top: 14px
}

.message.success {
    color: green;
}

.message.error {
    color: red;
}

.message.success:before {
    content: "\f058";
    color: green;
}

.message.error:before {
    content: "\f057";
    color: red;
}

.message.warning:before {
    content: "\f071";
    color: red;
}

.message .cookies:before {
    content: "\f564"
}

.message a {
    color: inherit;
    text-decoration: underline
}

.message a:focus {
    outline: none
}

.message-close {
    position: absolute;
    top: 0;
    right: 6px;
    color: #525f76;
    font-size: 28px;
    line-height: 1;
    cursor: pointer
}

.message-close:hover {
    color: #363f4d
}

.hidden {
    display:none !important
}

.fa-check-circle:before{content:"\f058"}