/*  MADE BY Zvbhrf  */

body, html {
    margin: 0;
    padding: 0;

    background-color: white;

    font-family: sans-serif;
}


::-webkit-scrollbar             { width: 2px; }
::-webkit-scrollbar-thumb       { background-color: #b6b6b6; }
::-webkit-scrollbar-thumb:hover { background-color: #919191; }

/* TOP BAR */

.topbar {
    color: white;
    background-color: #5865f2;
    background-image: linear-gradient( 120deg, #9366ee, #5865f2 , #727df7 );

    width: 100%;
    height: 200px;

    text-align: center;
    /*border-bottom: 8px solid #727df7;*/
}

.topbar .title {
    font-size: 70px;
    font-weight: 800;

    padding-top: 18px;
}

.topbar .subtitle {
    font-size: 50px;
    font-weight: 700;
}

/* MESSAGE BAR */

.message {
    color: black;

    padding: 40px;
    font-size: 22px;
}

.message .container {
    background-color: #eeeeee;
    background-image: linear-gradient( 120deg, #eeeeee, #f5f5f5 );
    
    box-shadow: 0 0 5px rgba( 0, 0, 0, 0.5 );
    
    margin-left: auto;
    margin-right: auto;
    
    width: 80%;
    padding: 40px;
}

.message .center { text-align: center; }
.message .space { padding: 15px; }

.message .line {
    margin: 35px;
    
    border-bottom: 2px solid #d0d0d0;
}

/* LINK BAR */

.link {
    color: white;
    background-color: #5865f2;
    background-image: linear-gradient( 120deg, #9366ee, #5865f2 , #727df7 );

    margin-left: auto;
    margin-right: auto;
    
    /*width: 30%;*/
    /*box-shadow: 0 0 5px rgba( 0, 0, 0, 0.5 );*/

    padding: 40px;
}

.link .title {
    font-size: 45px;
    font-weight: 600;

    /*text-shadow: 2px 2px 2px rgba( 0, 0, 0, 0.6 );*/
    
    text-align: center;
}

.link .frame {
    /*border-top: 2px solid #d0d0d0;*/

    padding: 25px;
}

/* OTHER */

.avatar {
    font-size: 20px;

    width: 50%;

    margin-left: auto;
    margin-right: auto;

    text-align: center;
}

.avatar .image {
    vertical-align: middle;

    width: 80px;
    height: 80px;

    border-radius: 50%;
}