ReddestDepths.css by reddest

/* ==UserStyle==
@name         ReddestDepths.css
@version      20220423.16.01
@namespace    userstyles.world/user/reddest
@description  For WD profiles and dens.
@author       reddest
@license      No License
==/UserStyle== */

@-moz-document url-prefix("https://www.wolvden.com/den") {
/*
Profile/Den Page - Main
Template provided by Tetra #202
Tetra's CSS Guide: https://www.wolvden.com/chatter/topic/15463
Free for personal and commercial use.
Template customized by red #1252
*/

/* ## ------------------------------------------------------- GENERAL ------------------------------------------------------- ## */
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,600;1,400&family=Reenie+Beanie&display=swap');

/* Start https://www.cursors-4u.com */
* { cursor: url(https://cur.cursors-4u.net/nature/nat-8/nat797.cur), auto !important;}
/* End https://www.cursors-4u.com */

body/* The HTML body of the page. Great place to put a background/font rule. */
{
    background: url('https://images.unsplash.com/photo-1629197520669-0210d6b270d9?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=2670&q=80')fixed bottom center;
    background-size: cover !important;
    /* Photo by Kseniya Lapteva on Unsplash */
    font-family: 'Cormorant Garamond', Hoefler Text, Baskerville;
    color: #c23e57;
}
a/* All links on page */
{
    color: #f57e64;
}
a:hover/* All links on page on hover */
{
    color: #eb4867;
}
.tooltip-inner/* Text tooltips */
{
    color: #c23e57;
    background-color: rgba(30, 30, 30, 1);
    border-radius: 10px;
    font-family: 'Cormorant Garamond', Hoefler Text, Baskerville;
}
::-webkit-scrollbar/* Scrollbar */
{
    width: 9px;
}
::-webkit-scrollbar-track/* Scrollbar track */
{
    background: rgba(0, 0, 0, 0);
    border-radius: 10px;
}
::-webkit-scrollbar-thumb/* Scrollbar thumb */
{
    background: #450f1d;
    border-radius: 10px;
}

.alert.alert-success/* Notifications that appear at the top of the page */
{
    color: #c23e57;
    background-color: #450f1d;
    border: none;
    border-radius: 10px;
}
.alert.alert-info/* Notifications that appear at the top of the page */
{
    color: #f57e64;
    background-color: #70192a;
    border: none;
    border-radius: 10px;
}
.alert.alert-danger/* Alerts that appear at the top of the page */
{
    color: #c23e57;
    background-color: #450e1f;
    border: none;
    border-radius: 10px;
}
.alert a.alert-link/* Links in alerts and notifications. */
{
    color: rgb(30, 30, 30);
}
.btn-danger/* "Report" button */
{
    background-color: #5a0d1c;
    color: #c23e57;
    border: none;
    border-radius: 10px;
    transition: 1s;
}

/* ## ------------------------------------------------------- REPORT, UPDATE/SAVE, BOOKMARK ------------------------------------------------------- ## */
#bookmarkPage.fas.fa-bookmark.text-danger/* Bookmark Icon */
{
    color: #be374b !important;
}

/* ## ------------------------------------------------------- NAVBAR MAIN ------------------------------------------------------- ## */
#header .navbar-main/* Section containing the site navigation */
{
    background: linear-gradient(to right, #501221, #7b1f2f);
    -moz-background: -moz-linear-gradient(to right, #501221, #7b1f2f);
    -webkit-background: -webkit-linear-gradient(to right, #501221, #7b1f2f);
    -ms-background: -ms-linear-gradient(to right, #501221, #7b1f2f);
    -o-background: -o-linear-gradient(to right, #501221, #7b1f2f);
    text-transform: capitalize !important;
    font-family: 'Reenie Beanie';
}
#header .navbar-main .nav-link .fa,
#header .navbar-main .nav-link/* Navigation links and icons */
{
    font-size: 16px;
    color: #262626 !important;
    transition: .5s ease;
}
.navbar-main .nav-link:hover/* Hover of the links above */
{
    color: #f57e64 !important;
    transition: .5s ease;
    letter-spacing: 1px;
}
#header .navbar-main .nav-link:hover,
#header .navbar-main .nav-link:hover .fa,
#footer a:hover,
#footer nav .nav-item .nav-link:hover/* Navigation links and icons on hover*/
{
    color: #8b2837;
}
.navbar-status/* Status bar containing your currencies, etc. */
{
    margin-top: 0px;
    background: #1f1f1fad !important;
    color: #c23e57 !important;
    border-radius: 0px 0px 0px 0px;
    border-left: 2px solid #1f1f1f;
    border-right: 2px solid #1f1f1f;
    border-bottom: 2px solid #1f1f1f;
    font-family: 'Reenie Beanie';
}
.btn-group-vertical > .btn,
.btn-group > .btn/* Username in that bar */
{
    color: #b8003d !important;
}
.dropdown-menu.show/* Dropdown menu for 'Profile, User Log, Log Out, etc.' */
{
    background-color: #1f1f1f !important;
}
.dropdown-divider {
    border-top: 1px solid #7b1f2f;
}

.btn-group-vertical > .btn,
.btn-group > .btn {
    background-color: transparent !Important;
}
.navbar-status a/* Currency, Messages, etc. links */
{
    color: #b8003d !important;
    font-size: 15px !important;
}
#header .navbar-status a:hover/* Hover of Currency, Messages, etc. links */
{
    color: #f57e64 !important;
}

/* SC Icon */
.icon-beetle-silver,
.icon-silver-cone {
    filter: sepia(40%) contrast(100%) brightness(100%);
}
/* GC icon */
.icon-beetle-gold,
.icon-gold-cone {
    filter: sepia(40%) contrast(100%) brightness(100%);
}

/* ## ------------------------------------------------------- BREADCRUMB BAR  ------------------------------------------------------- ## */
.breadcrumb-nav/* Gray breadcrumb bar under the status bar. */
{
    background-color: transparent !important;
}
.breadcrumb-item + .breadcrumb-item:before/* The slash between breadcrumb bar links */
{
    color: #e0004b;
}
.breadcrumb-item.active/* Pack Name in breadcrumb bar */
{
    color: #d84e68;
    font-family: 'Reenie Beanie';
    font-size: 15px;
    font-style: oblique !important;
}
.breadcrumb::after/* CSS Layout Credit */
{
    content: 'CSS by red #1252';
    position: absolute;
    right: 35px;
    color: #c23e57;
    font-family: 'Reenie Beanie';
}
/* ## ------------------------------------------------------- SIDEBAR ------------------------------------------------------- ## */
#sidebar/* Section containing the sidebar. */
{
    background: transparent;
}
#sidebar .card/* "Card" sections of the sidebar. */
{
    background: #161616d6;
    color: #c23e57 !important;
    border-radius: 10px;
    border: 2px solid #4f000b;
}
#sidebar h3,
#sidebar h4/* Card headers. */
{
    font-family: 'Reenie Beanie';
    font-size: 25px;
    color: #c23e57 !important;
    margin-bottom: 15px;
    margin-top: 1px;
    border-bottom: 1px dashed #75203394;
}
#sidebar #card-user h3 a/* Section with the Lead Name in Sidebar */
{
    margin: -10px;
    color: #c23e57 !important;
}
div.d-flex.justify-content-between.mb-3/* Small section with lead and featured wolf icon in Sidebar */
{
    margin-top: -5px;
}

.card-body .w-50:first-child div/* Border featured wolf in Sidebar */
{
    border: none !important;
}

.w-50 > a img/* Wolf Icon Sidebar */
{
    filter: sepia(40%) contrast(100%) brightness(90%);
    transition: .5s ease;
    border-radius: 25px;
}
.w-50 div a img/* Featured Wolf Icon Sidebar */
{
    border-radius: 10px;
    filter: sepia(40%) contrast(100%) brightness(90%);
    transition: .5s ease;
}

/* CHAT BOX */
.s-chat-message/* Chat messages */
{
    color: #c23e57;
    background-color: #46141f !important;
}
.s-chat-message:nth-of-type(odd)/* Odd chat messages */
{
    color: #c23e57;
    background-color: #3f0f19 !important;
}
.s-chat-message a/* Links inside chat messages */
{
    color: #f57e64;
}
.s-chat-message a:hover/* Links inside chat messages on hover */
{
    color: #450f1d;
}
.s-chat-message_timestamp/* Chat messages timestamps */
{
    color: #ec4968;
}
.btn.btn-primary.btn-sm/* "Growl" button */
{
    color: rgb(97, 14, 15);
    background: linear-gradient(to right top, #501221, #7b1f2f);
    -moz-background: -moz-linear-gradient(to right top, #501221, #7b1f2f);
    -webkit-background: -webkit-linear-gradient(to right top, #501221, #7b1f2f);
    -ms-background: -ms-linear-gradient(to right top, #501221, #7b1f2f);
    -o-background: -o-linear-gradient(to right top, #501221, #7b1f2f) !important;
    border: none;
    border-radius: 10px;
}

.s-chat-sidebar #chatMessagePinned.s-chat-message__pinned {
  background-position: 8px 0;
  text-align: left;
  text-indent: 25px;
  line-height: 16px;
  background-color: #c23e57;
}

#chatMessagePinned.s-chat-message__pinned .s-chat-message_content {
  display: table-cell;
  vertical-align: middle;
  min-height: 46px;
  padding-right: 6px;
  background-color: rgb(30, 30, 30);
}


/* ## ------------------------------------------------------- MAIN PAGE ------------------------------------------------------- ## */
#main/* Section containing the site's main content. */
{
    background: #0000008f;
    color: #c23e57;
    border-radius: 10px;
    border: 2px solid #760027;
}
h1/* Title header. */
{
    color: #c23e57;
    font-family: 'Reenie Beanie';
    text-align: center;
    font-size: 50px;
    margin-top: -10px;
    margin-bottom: 40px !important;
    text-shadow: 0px 0px 10px rgba(255, 120, 120, .5);
}
.nav-tabs/* Section containing the Den and Profile links. */
{  
    justify-content: center;
    border-bottom: 1px dashed #75203394;
    margin-top: -30px;
    border:none; }

.nav-tabs .nav-item {
	width:49.5%;
	overflow:hidden;
} .nav-tabs .nav-item:first-of-type {
	margin-right:1%;
	border-radius:10px 0 0 10px;
} .nav-tabs .nav-item:nth-of-type(2) {
    border-radius: 0 10px 10px 0; }
    
.nav-tabs .nav-link/* Individual links of the above section. */
{
    
    background: linear-gradient(to top, #501221, #7b1f2f);
    -moz-background: -moz-linear-gradient(to top, #501221, #7b1f2f);
    -webkit-background: -webkit-linear-gradient(to top, #501221, #7b1f2f);
    -ms-background: -ms-linear-gradient(to top, #501221, #7b1f2f);
    -o-background: -o-linear-gradient(to top, #501221, #7b1f2f);
    transition: .5s ease;
    font-weight: ...