body {
    color:#fff;
    background-color:#27262d;
}

h1 {
    font-variant:small-caps;
    color:#fff;
}

a:link {
    text-decoration:none;
    color:#fff;
}

a {
    text-decoration:none;
    color:#fff;
}

a:hover {
    color:#7858f9;
}
.navibar {
    background-color:#333238;
    position:sticky;
    top:0;
    z-index:100;
    color:#fff;
}

.dropdown-menu {
    background-color:#4a4950;
    color:#fff;
}

.dropdown-item {
    font-variant:small-caps;
    color:#fff;
}

.nav-item {
    font-variant:small-caps;
    padding-bottom:5px;
    padding-left:10px;
    color:#fff;
}

.nav-link {
    font-variant:small-caps;
    color:#fff;
}

.bio {
    background-color:#333238;
    color:#fff;
    padding:10px;
}

.icon-button {
    color:#fff;
}

.icon-button:hover {
    color:#7858f9;
}

.btn-text {
    color:#fff;
    font-variant:small-caps;
}

.changelog {
    list-style-type:square;
    margin:10px;
    padding:10px;
    background-color:#4a4950;
}

.universe-name {
    font-variant:small-caps;
    padding-top:10px;
    padding-left:10px;
    color:#fff;
}
.universe-desc {
    padding-bottom:5px;
    padding-left:10px;
    color:#fff;
}

.icon-container {
    background-color:#333238;
    padding:0px;
}

/*ICONS*/
.icon-border {
    margin:5px;
    width:95px;
    height:95px;
    border-style:solid;
    border-color:#7858f9;
}

.icon-border:hover {
    border-color:#543cb3;
}

.icon {
    width:100%;
    height:100%;
    background-attachment:center;
    background-size:cover;
}

.icon-border:hover .icon {
    opacity:0.7;
}

.icon-text {
    font-variant:small-caps;
    margin:auto;
    background-color:rgb(0,0,0, 0.5);
    width:100%;
    padding-top:4px;
    padding-bottom:5px;
    font-size:80%;
    color:#fff;
}

.icon-button {
    width:100%;
    height:100%;
}

.see-more {
    font-variant:small-caps;
    margin:auto;
    background-color:rgb(0,0,0, 0.5);
    width:100%;
    height:100%;
    padding-top:40%;
    font-size:80%;
    color:#fff;
}

.more-border {
    margin:5px;
    width:95px;
    height:95px;
    border-style:solid;
    border-color:#434343;
}

.more-border:hover {
   border-color:#848484; 
}

.more-border:hover .icon {
    opacity:0.7;
}

/*icons end*/

.char-preview {
    background-color:#333238;
    color:#fff;
    padding:5px;
}

.preview-h1 {
    font-variant:small-caps;
    padding-top:10px;
    padding-left:10px;
    color:#fff;
}

.char-desc {
    color:#fff!important;
    padding-left:10px;
}


.pcnav {
    background-color:#333238;
    position:sticky;
    top:25px;
    width:25%;
    z-index:100;
}

.navlist {
    border-bottom-style:solid;
    border-width:1px;
    color:#fff;
    font-size:15px;
    font-variant:small-caps;
    padding-top:10px;
    padding-left:10px;
}

.navlist a {
    color:#6367f2;
}

.navlist a:hover {
    color:#4146ff;
}