/*
Free to use CSS template by Katie (#106445).
This code may be altered, edited, or re-uploaded.
This template may be used to create paid codes (pre-mades and commissions).
Please do NOT remove this credit, unless your coding becomes unrecognizable from
this one!
*/
/* FONT (Imbue) */
@import url('https://fonts.google.com/specimen/Imbue');
/* BACKGROUND */
body {
background: url('https://imgur.com/Y4FtWJM') center center fixed;
background-size: 100%;
font-family: 'Imbue';
color: #031926
}
/* MAIN PANEL */
/* RIGHT SIDE */
.container.main {
background: rgba(1, 1, 1, 0.5);
border: none;
box-shadow: none;
border-radius: 0px
}
/* LEFT SIDE */
.col-md-9 {
background: none;
border-right: none
}
/* TOPBAR ("Welcome back, ___") */
.topbar {
background: rgba(1, 1, 1, 0.5);
border: none;
border-top: none;
color: #468189;
border-radius: 0px;
}
/* NAVBAR (Den/Crossroads/Etc.) */
.navbar {
background: rgba(1, 1, 1, 0.5);
border-bottom: none;
color: #468189;
border-radius: 0px
}
/* NAVBAR BUTTON TEXT COLOR */
.navbar li a {
color: #031926 !important
}
/* NAVBAR BUTTON HOVER */
.navbar li a:hover {
background: rgba(1, 1, 1, 0.5) !important;
border-bottom: none;
color: #77ACA2 !important;
border-radius: 0px
}
/* BREADCRUMB (Home / Den) */
.breadcrumb {
background: rgba(1, 1, 1, 0.5) !important;
border: none;
border-radius: 0px
}
/* BREADCRUMB TEXT */
.breadcrumb .active {
color: #468189
}
}
@media only screen and (max-width: 1199px) and (min-width: 992px) {
.breadcrumb::after {
right: 20%
}
}
@media only screen and (max-width: 991px) and (min-width: 768px) {
.breadcrumb::after {
right: 20%
}
}
@media only screen and (max-width: 767px) {
.breadcrumb::after {
right: 22%
}
}
/* BOOKMARK BUTTON */
input.floatright, input.floatright:hover {
background: rgba(1, 1, 1, 0.5) !important;
border: none !important;
border-radius: 0px;
color: #77ACA2 !important;
}
/* SWITCH ACCOUNT BUTTON */
button.button, button.button:hover {
background: rgba(1, 1, 1, 0.5);
border: none !important;
border-radius: 0px;
text-shadow: none !important;
color: #77ACA2 !important
}
/* ALERTS (ie. "Your lionesses have returned from hunting!") */
.alert,
.alert-warning,
.alert-danger {
background: rgba(1, 1, 1, 0.5) !important;
border: none;
color: #9DBEBB;
border-radius: 0px !important
}
/* BIGGEST HEADER ("___"'s DEN) */
h1 {
color: #F4E9CD;
font-size: 90px;
text-align: center;
font-family: 'Imbue'
}
/* MEDIUM HEADER */
h2 {
color: #F4E9CD;
font-size: 24px;
text-align: center
}
/* SMALL HEADER */
h3 {
color: #F4E9CD !important;
font-size: 14px !important
}
/* RIGHT SIDE PANEL HEADER */
.sidebar h3 {
color: #9DBEBB !important;
font-size: 26px !important;
font-family: 'Imbue'
}
/* RIGHT SIDE PANELS */
.panel {
background: rgba(1, 1, 1, 0.5) !important;
box-shadow: none !important;
border: none !important;
color: #9DBEBB !important;
border-radius: 0px
}
/* ENERGY BAR BACKGROUND */
.progress {
background: rgba(1, 1, 1, 0.5);
color: #468189 !important;
border-radius: 0px !important
}
/* ENERGY BAR COLOR */
.progress-bar {
background: rgba(1, 1, 1, 0.5);
color: #9DBEBB !important;
border-radius: 0px !important
}
/* ENERGY BAR TEXT */
.progress div {
color: #031926 !important
}
/* CHAT */
.s-chat-message:nth-child(even) /* Even Numbered Messages */ {
background: rgba(1, 1, 1, 0.5) !important;
color: #F4E9CD !important;
border: none !important
}
.s-chat-message:nth-child(odd) /* Odd Numbered Messages */ {
background: rgba(1, 1, 1, 0.5) !important;
color: #468189 !important;
border: none !important
}
.s-chat-message__pinned /* Pinned Message */ {
background: rgba(1, 1, 1, 0.5) !important;
color: #468189 !important;
border: none !important
}
.s-chat-message_timestamp /* Timestamps */ {
color: #468189 !important;
}
div#chatMessageContainer {
border: none !important;
}
button#label_currentChannel /* Channel Button ie. Main, Sales */ {
background: rgba(1, 1, 1, 0.5) !important;
color: #468189 !important;
border: none !important
}
/* LION INFO TABLE (Level, Stats, Territory Count, Etc.) */
/* PANEL BACKGROUND COLOR */
.table {
background: rgba(1, 1, 1, 0.5);
border: none !important;
border-collapse: separate;
border-radius: 0px
}
/* HEADERS COLOR (King Name + Title, "There are _ lions with mutations in _'s
pride.") */
.top,
.bottom,
th {
background: rgba(1, 1, 1, 0.5) !important;
color: #9DBEBB !important;
border-radius: 0px
}
td.bottom a {
text-decoration: none !important
}
/* Color behind "Level, Stats, Branch, Territory" etc. */
.inner-table .left {
background: rgba(155, 226, 242, 0.6) !important;
color: #9DBEBB;
border-radius: 0px
}
/* Color behind the number of all of the things above */
.inner-table .right {
background: none;
border-radius: 0px !important
}
td.right {
border-radius: 0px !important
}
/* IGNORE */
.right_odd {
background: none !important
}
/* Affects the color behind "_ Unsorted", "_ Pregnant Lionesses", "View Pride
Overview", and cave/mound names */
.cave-grid,
.mound-grid {
background: rgba(1, 1, 1, 0.5);
border: none !important;
border-radius: 0px !important
}
/* FEED ALL, PLAY ALL */
.feature {
background: rgba(1, 1, 1, 0.5) !important;
color: #9DBEBB !important;
border: 1px solid #9DBEBB !important;
border-radius: 0px !important
}
/* "King Dynasty, Pride Dynasty, Achievements, Showcase" Panels */
.feature,
div.left {
background: rgba(1, 1, 1, 0.5);
border: none;
border-radius: 0px !important
}
/* Block of color behind "Territory Description, Player Name, Avatar URL" etc. */
.table .left {
background: rgba(1, 1, 1, 0.5);
border-radius: 0px
}
/* Color behind the content of the elements listed above */
input,
select,
textarea {
background: rgba(1, 1, 1, 0.5) !important;
border: none !important;
border-radius: 0px !important;
color: #F4E9CD !important;
box-shadow: none !important;
text-shadow: none !important
}
/* ACCOUNT OPTIONS PANELS (Friend Requests Toggles, etc.) */
.item-header {
background: rgba(1, 1, 1, 0.5) !important;
color: #468189 !important;
border-radius: 0px !important;
}
.item {
background: rgba(1, 1, 1, 0.5) !important;
border: none !important;
border-radius: 0px !important
}
/* ACCOUNT OPTIONS ON/OFF TOGGLE SWITCH */
div.slider.round /* Background */ {
background: #468189 !important
}
div.slider.round::before /* Circle Part */ {
background: #468189 !important
}
/* Copyright, Terms of Service, CoC, etc. */
div.container.footer.center.white.visible-lg.visible-md.visible-sm,
div.container.footer.center.white.visible-lg.visible-md.visible-sm a {
color: #468189 !important;
text-shadow: none !important
}
/* LINK COLOR */
a:link,
a:visited {
color: #ffffff !important
}
/* LINK HOVER COLOR */
a:hover {
color: #ffffff !important
}
/* BOX CONTAINER */
.boxcontainer {
background: none;
height: auto;
padding: 0px;
justify-content: center;
display: flex
}
/* BOXES */
.smallbox {
float: left;
background: rgba(1, 1, 1, 0.5);
color: #9DBEBB;
padding: 10px;
border: none;
border-radius: 0px;
margin: 10px;
height: 150px;
width: 28.4%;
overflow: auto
}
.mediumbox {
float: left;
background: rgba(1, 1, 1, 0.5);
color: #9DBEBB;
padding: 10px;
border: none;
border-radius: 0px;
margin: 10px;
height: 150px;
width: 43.8%;
overflow: auto
}
.largebox {
float: left;
background: rgba(1, 1, 1, 0.5);
color: #9DBEBB;
padding: 10px;
border: none;
border-radius: 0px;
margin: 10px;
height: 150px;
width: 90%;
overflow: auto
}
/* HOVER BOXES */
.smallhoverbox {
float: left;
background: rgba(1, 1, 1, 0.5);
color: #9DBEBB;
padding: 10px;
border: none;
border-radius: 0px;
margin: 10px;
height: 50px;
width: 28.4%;
overflow: auto;
transition: 3s
}
.smallhoverbox:hover {
height: 150px;
width: 28.4%;
}
.mediumhoverbox {
float: left;
background: rgba(1, 1, 1, 0.5);
color: #9DBEBB;
padding: 10px;
border: none;
border-radius: 0px;
margin: 10px;
height: 50px;
width: 43.8%;
overflow: auto;
transition: 3s
}
.mediumhoverbox:hover {
height: 150px;
width: 43.8%;
}
.largehoverbox {
float: left;
background: rgba(1, 1, 1, 0.5);
color: #9DBEBB;
padding: 10px;
border: none;
border-radius: 0px;
margin: 10px;
height: 150px;
width: 90%;
overflow: auto;
transition: 3s
}
.largehoverbox:hover {
height: 150px;
width: 90%;
}
/* SCROLL BAR */
/* WIDTH */
::-webkit-scrollbar {
width: 10px
}
/* BACKGROUND */
::-webkit-scrollbar-track {
background: #ffffff
}
/* "THUMB" */
::-webkit-scrollbar-thumb {
background: #9DBEBB;
border-radius: 0px
}
/* LION AND USER AVATAR OPACITY */
div#lion_image {
opacity: 1
}
table#player img {
opacity: 1
}
/* CIRCULAR LION AND USER AVATAR */
div#lion_image {
border-radius: 50% !important;
overflow: hidden;
margin-top: 15px; /* May need adjusting */
margin-left: 12px /* May need adjusting */
}
table#player img {
border-radius: 50% !important;
overflow: hidden
}
/* LIODEN LOGO REPLACER */
div.container.main>div:nth-child(1)>nav>div.navbar-header>a>img {
content: url('https://pixelover.io/images/examples/boat_pa.png')
}
/* CAVE / MOUND IMAGES */
div.cave-grid>img /* Pregnant Lionesses */ {
content:
url('https://art.ngfiles.com/images/3190000/3190751_gamesmashdash_pixel-art-cave-
remastered.png?f1683310979') !important
}
a[href$="CAVE ID"]>div.cave-grid>img {
content:
url('https://art.ngfiles.com/images/3190000/3190751_gamesmashdash_pixel-art-cave-
remastered.png?f1683310979') !important
}
a[href$="lionoverview.php?id=PLAYER ID"]>div.cave-grid>img /* Pride Overview */ {
content:
url('https://art.ngfiles.com/images/3190000/3190751_gamesmashdash_pixel-art-cave-
remastered.png?f1683310979') !important
}
a[href$="unsorted.php?id=PLAYER ID"]>div.cave-grid>img /* Unsorted */ {
content:
url('https://art.ngfiles.com/images/3190000/3190751_gamesmashdash_pixel-art-cave-
remastered.png?f1683310979') !important
}
.mound-grid img /* Mound(s) */ {
background:
url("https://art.ngfiles.com/images/3190000/3190751_gamesmashdash_pixel-art-cave-
remastered.png?f1683310979");
width: 0;
height: 0;
padding-top: 80px;
padding-right: 130px
}
/* MAKES BOXES/DESCRIPTION SHOW ON MOBILE */
@media only screen and (max-width: 767px) {
.container.main .hidden-xs {
display: block !important;
}
}
@media only screen and (max-width: 991px) and (min-width: 768px) {
display: block !important;
}
@media only screen and (min-width: 1200px) {
div.quote {
width: 790px;
}
}
