Whit's Profiles by whitthemes

/* ==UserStyle==
@name         Whit's Profiles
@version      20221218.17.50
@namespace    userstyles.world/user/whitthemes
@description  For use by anyone who wants to see pretty profiles. This shows all my client profile themes.
@author       whitthemes
@license      No Redistribution
==/UserStyle== */

@-moz-document url("https://v2.horsereality.com/user/258423") {
:root {
--left-nav: #162132d4;
    --picture-button: #58688185;
    --border: #69d25a;
    --header-2: #405864;
    --header-1: #28373f;
    --light-text: #bad3b3a1;
    --box: #40485e57;
    --body: #4b5063db;
    --dark-text: #282933;
    --text-hover: #73a875;
    --middle-hover: #1c2630;
    --progress: #3b3b53;
    --button: #27353e;
    --button-hover: #131a1e;
    --boxes: #49535fbd;
    --white: #6d957c;
  --odd: #30425485;
    --even: #2e3848c2;
    --mine: #252b36d6;
    --select: #575d6a;
    --top-hover: #162634;
    --highlights: #75838b61;
    --slide-hover: #172233ab;
    --center-bar: #13202b9e;
    --background: url(https://cdn.discordapp.com/attachments/993296017413898351/1052430831043481630/IMG_9882.webp);
      --map: url(https://cdn.discordapp.com/attachments/993296017413898351/1052430831043481630/IMG_9882.webp);
    --title-font: "Segoe Print";
    --main-font: "Ink Free";
  
    --headers: url(https://cdn.discordapp.com/attachments/987518421442891878/1052776619560935474/hiratop.png);
  
   
  }
.progress-bar {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-pack: center;
    justify-content: center;
    color: var(--dark-text);
    text-align: center;
    white-space: nowrap;
    background-color: var(--progress);
    border-radius: 20px 20px 20px 20px;
    transition: width .6s ease;
}
body.background.africa {
    background-image: var(--background);
}
body.background.asia {
    background-image: var(--background);
}
body.background.australia {
    background-image: var(--background);
}
body.background.europe {
    background-image: var(--background);
}
body.background.north-america {
    background-image: var(--background);
}
body.background.south-america {
    background-image: var(--background);
}
.side-nav ul .subtitle {
            margin-top: 25px; 
        }


        .side-nav {
            position: static !important;
            border-radius: 0px 0px 60px 60px !important; 
            padding-left: 10px !important;
            height: 28px !important;  
            background-image: var(--sidenav);
            transition: 0.5s !important;
            overflow: hidden !important;
            z-index: 1 !important;
            border-left-width: 2px;
            padding-top: 15px;
            width: 300px;
        }
              .progress span {
    position: absolute;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    color: var(--light-text);

        }
.side-nav {
    padding: 20px;
    background: var(--left-nav);
    background-image: var(--sidenav);
    border: 1px solid var(--border);
    
    
}
   .side-nav::after {
            float: left;
            position: relative;
            
            font-size: 20px;
             font-family: var(--main-font);
            margin-top: -14px; 
            color: var(--light-text); 
            background-image: var(--sidenav)
        }

        .side-nav::before {
            padding-left: -10px;  
            background-image: var(--sidenav);
            text-align: left;
            font-size: 11px;
             font-family: var(--main-font);
            margin-top: -20px;
            position: absolute;
        }

        .side-nav:hover {
            height: 930px !important;
        }
  .leftnav > ul > li,
        .side-nav > ul > li,
        .side-nav > ul > li > a {
            float: left;
            display: inline;
            width: 290px;
        }

        .leftnav ul li,
        .side-nav ul li,
        .side-nav ul li a {
            padding: 0 0;
        }
        .side-nav ul .subtitle {
    font-size: 17px;
    font-family: var(--title-font);
    margin-bottom: 5px;
    line-height: 21px;
    font-weight: 700;
    text-transform: uppercase;
    color: var(--light-text);
}
.side-nav ul a {
    font-size: 15px;
    font-family: var(--main-font);
    font-weight: 700;
    text-transform: capitalize;
    color: var(--light-text);
    padding: 0;
}
.header-menu nav .main-menu .user-nav>a {
    color: var(--light-text);
    font-family: var(--title-font);
    font-size: 17px;
}
.header-menu nav .main-menu ul li a {
    font-size: 17px;
    color: var(--light-text);
    font-family: var(--title-font);
}
.header-menu nav .stats {
    text-align: right;
     color: var(--light-text);
    font-family: var(--title-font);
    font-size: 11px;
}
.header-menu nav .stats a {
    color: var(--light-text);
}
.header-menu nav .main-menu ul li a:not(.btn):hover {
    text-decoration: none;
    color: var(--text-hover);
}
.header-menu nav .main-menu .user-nav>a:hover {
    color: var(--text-hover);
}
.header-menu nav .main-menu .user-nav .dropdown-menu .dropdown-header, .header-menu nav .main-menu .user-nav .dropdown-menu .dropdown-item {
    font-size: 13px;
     font-family: var(--main-font);
    padding: 0.5rem 1rem;
    color: var(--light-text);
}
.header-menu nav .main-menu .user-nav .dropdown-menu {
    left: -135px!important;
    min-width: 12rem!important;
    background: var(--slide-hover);
}
.header-menu nav .main-menu .user-nav .dropdown-menu .dropdown-item:hover {
    background: none;
    color: var(--text-hover);
     font-family: var(--main-font);
}
.show-profile .navbar {
    background-color: var(--center-bar)!important;
    background-image: var(--center);
    border-top: 2px solid var(--border);
    border-bottom: 2px solid var(--border);
    padding-top: 0;
    padding-bottom: 0;
    min-height: 40px!important;
        }
.main-content {
    background: var(--body);
    padding: 15px;
}
.header-menu {
    background: var(--slide-hover);
    background-image: var(--top);
}





.show-profile .profile-account {
    
    padding: 10px;
    background-color: var(--box);
    background-image: var(--player);
    margin-bottom: 20px;
    border-radius: 20px 20px 20px 20px;
}
.show-profile .navbar-avatar .navbar-avatar-container
  {
    border: 1px solid var(--border);
    padding: 20px;
   border-radius: 50%;
  }
.show-profile .profile-name-and-estate .profile-username {
    font-size: 32px!important;
    font-weight: 700!important;
    color: var(--light-text);
     font-family: var(--main-font);
    margin-bottom: 5px!important;
    opacity: 30%;
}
.show-profile .profile-name-and-estate .profile-estate {
    font-size: 18px;
     font-family: var(--main-font);
    line-height: 21px;
    font-weight: 400;
    color: var(--light-text);
    opacity: 30%;
}
.show-profile .profile-ranking-container .profile-rank {
    text-align: left;
    margin-bottom: 0;
    font-size: 12px;
     font-family: var(--main-font);
    line-height: 18px;
    font-weight: 400;
    color: var(--light-text);
}
.show-profile .profile-ranking-container .profile-rank-position {
    font-size: 26px!important;
     font-family: var(--main-font);
    text-align: right;
    font-weight: 700!important;
    color: var(--light-text);
    margin-bottom: 5px!important;
}
.show-profile .navbar .nav-link {
    padding: 8px 20px;
    line-height: 24px;
    font-weight: 500;
    color: var(--light-text);
    font-family: var(--title-font);
    font-size: 14px;
}
.show-profile .profile-account h2 {
    font-size: 14px;
    font-weight: 600;
    color: var(--dark-text);
     font-family: var(--title-font);
    background-image: var(--headers);
    height: 25px;
    border-radius: 20px 20px 20px 20px;
    margin: 0;
}
.side-nav ul a:hover {
    color: var(--text-hover);
    text-decoration: none;
}
.show-profile .main-content {
    padding: 0;
    overflow-x: visible;
}




.show-profile .navbar .nav-link:hover {
    background-color: var(--middle-hover);
    cursor: pointer;
    border: none;
    border-radius: 0;
    color: var(--light-text);
    font-family: var(--title-font);
    text-decoration: none;
}
}

@-moz-document url("https://v2.horsereality.com/user/309103") {
:root {
--left-nav: #344858cf;
    --picture-button: #737e83c2;
    --border: #c8cacd;
    --header-2: #637a87;
    --header-1: #495b65;
    --light-text: #cbcdd0;
    --box: #767f874f;
    --body: #989fa2db;
    --dark-text: #172834;
    --text-hover: #a3c2d9;
    --middle-hover: #424c56;
    --progress: #7b929f;
    --button: #4c5761;
    --button-hover: #323a41;
    --boxes: #6e5a76;
    --white: #aca2af;
   --odd: #85909596;
    --even: #707a81a1;
    --mine: #4f565ac2;
    --select: #9fa6a9;
    --top-hover: #45505a;
    --highlights: #75838b61;
    --slide-hover: #4a5a68de;
    --center-bar: #5b6a78;
    --background: url(https://cdn.discordapp.com/attachments/987518421442891878/1049878307044339842/photo-1549412636-d09e6b42118c.png);
      --map: url(https://cdn.discordapp.com/attachments/987518421442891878/1049878307044339842/photo-1549412636-d09e6b42118c.png);
    --title-font: "Segoe Print";
    --main-font: "Ink Free";
    --horse-bg: url(https://cdn.discordapp.com/attachments/987518421442891878/1049887827057459260/profilebg_winter2022.jpg);
    --headers: url(https://cdn.discordapp.com/attachments/987518421442891878/1049878790437875822/wintertop.png);
  
    --pedigree: url("https://cdn.discordapp.com/attachments/987518421442891878/1041120439763742871/Background_for_pedigree.png");
  }
  
   
  
.progress-bar {
    display: -ms-flexbox;
    display: fle...