@font-face {
    font-family: wifi-fonts;
    src: url('wifi-fonts.ttf');
}

* {
    margin: 0;
    padding: 0;
    font-family: wifi-fonts, Arial, Helvetica, sans-serif;

}

::-webkit-scrollbar {
    display: none;
}

html,
body {
    width: 100%;
    height: 100%;
    position: relative;
}

.wifi-body {
    width: 100%;
    display: flex;
    padding-top: 33px;
}

.wifi-logo {
    display: flex;
    justify-content: center;
    margin-top: 15px;
}

.wifi-logo img {
    width: 40vw;
}

.wifi-box {
    display: flex;
    flex: 1;
    flex-direction: column;
}

.wifi-text {
    font-weight: bold;
    font-size: 5vw;
    line-height: 5vw;
    text-align: center;
    color: #F6FCFA;
    background-color: #040C17;
    padding: 1.5vw 0;
}

.wifi-explode,
.wifi-nokit,
.wifi-ownkit {
    font-weight: bold;
    font-size: 22vw;
    line-height: 22vw;
    text-align: center;
    color: #F6FCFA;
    padding: 2vw 0;
}

.wifi-explode {
    background-color: #C14444;
}

.wifi-nokit {
    background-color: #1D7BA4;
}

.wifi-ownkit {
    background-color: #0C672B;
}

.wifi-click {
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 998;
}

a {
    color: #F6FCFA;
}

/* @media screen and (max-width: 201px) {
    .wifi-body{
        margin-top: 28px;
    }
} */

.wifi-bg {
    width: calc(100%);
    height: calc(100%);
    display: flex;
    border-image: linear-gradient(to bottom, #335770, #28326A) 1 10;
    position: fixed;
    top: 0;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center 0;
    background-image: url(kit.svg);
    background-color: #07141D;
    z-index: -1;
}

.wifi-bg-line {
    z-index: 10;
    width: calc(100% - 8px);
    height: calc(100% - 8px);
    border: 4px solid;
    display: flex;
    border-image: linear-gradient(to bottom, #335770, #28326A) 1 10;
    position: fixed;
    top: 0;
}