@media (prefers-color-scheme: dark) {

.bar-bar {
    background:#344648!important;
}
.topbar {
    background-color:#000000 !important;
    box-shadow:none !important;
}
body {
    background-color:black !important;
}
.red_text {
    color:#FE7474 !important;
    fill:#FE7474;
}

.orange_text {
    color:#FF9F4A !important;
    fill:#FF9F4A;
}
.card {
    background-color:#05090A !important;
    box-shadow:none !important; 
    filter:none!important;
}
.rollover {
    color: #6F7E80!important;
}
*:not(svg):not(path) {
    color:white;
}
h3.card-header {
    color:white !important; 
}
.card-table tr:nth-child(even):not(.blank):not(.large) {
    background-color:#182325 !important;
}
tr td:nth-child(3) {
    color:#6F7E80;
}
.large {
    background-color:#111E20 !important;
}
.large td {
    color:#6F7E80 !important;

}

}
.large {
background-color:#111E20;
}
.who {
font-size:24px;
}
.who, tr td:nth-child(1) {
font-family:'AvenirNextProDemi';
}
.large td {
overflow: hidden;
display: -webkit-box;
-webkit-line-clamp: 2; /* number of lines to show */
       line-clamp: 2; 
-webkit-box-orient: vertical;
}
* { 
    font-family:'AvenirNextProMedium';
    -webkit-font-smoothing: antialiased !important;
    font-weight:normal !important;
}
body {
    font-size:22px;
    background:#EEF8FB;
}
td {
    padding: 0 20px;
    font-size:24px;
}
.container {
    display:flex;
}
.left { 
    flex: 50%;
}
.right {
    flex: 50%;
}
.scrollable {
    overflow-y:scroll;
    max-height: 400px;
    border:1px solid black;  
    padding: 1rem;
}
.container {
    margin-left:auto;
    margin-right:auto;
    flex-direction: column;
    row-gap: 2rem;
    width:100%;
}
.card-header {
    font-family:'AvenirNextProBold';
    margin:0;
    padding-left:7px;
    font-size:28px !important;
}
.card {
    background: #05090A;
    filter: drop-shadow(0px 5px 10px rgba(154, 206, 222, 0.27));
    width:85%;
    margin-left:auto;
    margin-right:auto;
    border-radius: 20px;
    padding:1.75rem;
}
.card-table { 
    width: 100%;
    color:#2C6678;
    margin-top:10px;
}
.card-table td {
    padding:0;
}
.card-table tr {
    padding: 16px 0;
    padding-left:14px;
    display:flex;
}
.topbar {
    position: fixed;
top: 0;
background: #4B7F8D;
box-shadow: 0px 8px 8px 0px rgba(154, 206, 222, 0.30);
min-height: 100px;
width: 100%;
z-index: 10;
text-align:center;
}
body {
    margin:0;
    padding-top:70px;
}
.topbar h2 {
    color:white;
    font-family:'AvenirNextProBold';
    font-size:36px;
}
.card-table tr:nth-child(even):not(.blank):not(.large) {
background-color: #182325;
}
.bar {
width: 97.5%;
padding: 0 14px;
}
.bar-bar {
border-radius: 8px;
background: var(--slate-crazy-light-slate, #EEF8FB);
height:16px;
position:relative;
}
.bar-inner {
background:#00C5FF;
height:16px;
position:absolute;
width:50%;
border-radius: 8px;

}
.bar-metrics-text div {
    display:inline;
    color:#6F7E80;
}

.metric-bar.red {
    background: #FE7474;
}
.metric-bar.orange {
    background:#FFB371;
}
.metric-bar.blue {
    background:#00C5FF;
}
.metric-bar.green {
    background:#6AF6A3;
}
.metric-bar.plaid {
    background-image:url('plaid.png'); 
}
.metric-bar.ludacris {
    background-image:url('ludacris.png');
}
.pill_inner {
    border-radius: 6px;
}
.pill_inner.red {
    background:#FF9090;
}
.pill_inner.orange {
    background:#FFB371;
}
.pill_inner.yellow {
    background:#FBDA64;
}
.pill_inner.blue {
    background:#00C5FF;
}
.pill_inner.green {
    background:#67E3CD;
}
.pill_back {
    background:#05090A;
    width:128px;
    border-radius:6px;
    height:20px;
}
.popup_container:before {
    position: absolute;
    top: -12px;
    left: 50%;
    display: inline-block;
    border-right: 12px solid transparent;
    border-bottom: 12px solid white;
    border-left: 12px solid transparent;
    content: '';
    transform: translateX(-50%);
}
.popup_container {
    background: white;
    position: absolute;
    display: none;
    z-index: 10000000;
    border-radius: 8px;
    padding: 1rem 1rem;
    padding-bottom: 0;
    margin-top:1rem;
}
.small-heading {
    color: #2C6678;
    font-family: 'AvenirNextProBold';
    text-align: center;
    font-size: 22x;
}
.incomplete_list { padding: 0; }
.incomplete_list li {
    color: #2C6678;
    font-size: 22px;
    list-style-type: none;
    background: url('data:image/svg+xml,<svg width="22" height="20" viewBox="0 0 15 16" fill="none" xmlns="http://www.w3.org/2000/svg"><g clip-path="url(%23clip0_8223_685)"><path d="M7.49999 0.173828C3.35787 0.173828 0 3.53169 0 7.67383C0 11.816 3.35787 15.1738 7.49999 15.1738C11.6421 15.1738 15 11.816 15 7.67383C15 3.53169 11.6421 0.173828 7.49999 0.173828ZM11.6026 10.7302L10.5564 11.7765L7.50997 8.73005L4.46354 11.7765L3.41729 10.7302L6.46373 7.6838L3.4173 4.63737L4.46354 3.59113L7.50997 6.63757L10.5564 3.59113L11.6027 4.63737L8.55622 7.68381L11.6026 10.7302Z" fill="%23FE7474"/></g><defs><clipPath id="clip0_8223_685"><rect width="15" height="15" fill="white" transform="translate(0 0.173828)"/></clipPath></defs></svg>') no-repeat left;
    padding: 0px 0px 4px 28px;
    font-variant: all-small-caps;
    line-height: 30px;
}
.pill_inner {
    height: 20px;
    position:static;
}
tr.red {
    background:#5C1717;
}

tr.red td .quick_icon {
    color:#FE7474;
    fill:#FE7474;
}
tr.orange {
    background:#6B3A0D;
}

tr.orange td .quick_icon {
    color:#FFB371;
    fill:#FFB371;
}
tr.yellow {
    background:#604510;
}

tr.yellow td .quick_icon {
    color:#FBDA64;
    fill:#FBDA64;
}
tr.blue {
    background:#174857;
}

tr.blue td .quick_icon {
    color:#00C5FF;
    fill:#00C5FF;
}
tr.green {
    background:#0C4238;
}

tr.green td .quick_icon {
    color:#67E3CD;
    fill:#67E3CD;
}
.bar-inner.red {
background:#FE7474 !important;
}
.top, .bottom {
display: flex;
justify-content: space-between;
padding: 10px 0;
color:#2C6678;
}
.deal-users {
    display:flex;
    flex-direction:column;
    row-gap:3rem;
}
.deals-card {
    background:#05090A;
    padding-left: 4rem;
    padding-right:4rem;
    padding-top:4rem; padding-bottom:3rem;
    margin-top:1.5rem;
    margin-bottom:1rem;
    background:#05090A;
    border-radius:20px;
    display:flex;
    margin-left:30px;
    margin-right:30px;
}
.deals-card-left {
    display:flex;
    flex: 1 1 65%;
    flex-direction: column;
}
.deals-card-right {
    display:flex;
    flex-direction:column;
    flex: 1 1 35%
}
.team-cards { 
    display:flex;
    column-gap:20px;
    padding-left:30px;
    padding-right:30px;
}
.team-card {
    flex: 1 1 33%;
    background:#05090A;
    border-radius:20px;
    padding-left: 4rem;
    padding-right:4rem;
    padding-bottom:5rem;
    padding-top: 2.5rem;
    display: flex;
    flex-direction: column;
}
.breakdowns {
    opacity:1 !important;
}
.team-card-header {
    position: relative;
    min-height: 100px;
    display: flex;
    align-content: center;
    flex-direction: row-reverse;
    flex-wrap: wrap;
    margin-bottom: 3rem;
    justify-content: space-between;
}
body {
    overflow-y:hidden;
}
.team-card-dates {
    float: right;
    display: flex;
    row-gap: 1rem;
    width:35%;
    flex-direction: column;
    align-items: stretch;
}
.user-image {
    border-radius:100px;
    margin-left:auto;
    margin-right:auto;
    position:absolute;
    left: calc(50%);
    transform: translateX(-50%);
    width:150px;
    height:150px;
}
* {
    font-family:'AvenirNextProMedium';
}
.date-block {
    color:#6F7E80;
    font-size:20px;
    text-align:left;
}
.date-block b {
    color:#6F7E80;
    font-family:'AvenirNextProDemi';
    font-size:20px;
}
.bar-name {
    font-family:'AvenirNextProDemi';
    font-size:24px;
    color:white;
}
.bar-background {
    height:43px;
    width:100%;
    background:#0B1314;
    border-radius:8px;
    position:relative;
}
.bar-ghost {
    width: 50%;
    height: 43px;
    position:absolute;
    border-radius:8px;
    background:#182325;
    transition: 1.3s ease-in-out;
}
.metric-bar {
    width: 25%;
    min-width:2%;
    height: 43px;
    position:absolute;
    border-radius:8px;
    background:#FE7474;
    transition: 1.5s ease-in-out;
}
.team-card-dates-top {
    justify-content:space-between;
}
.date_dropdown {
    color: #6F7E80;
    background: #344648;
    border-radius: 8px;
    font-size: 20px;
    border: 0;
    padding: 6px 12px;
    padding-right: 40px !important;
    margin-top: 8px;
    background: url('data:image/svg+xml,<svg width="21" height="21" viewBox="0 0 21 21" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M10.5352 16.1988L2.33228 8.10988L4.61557 5.83545L10.5352 11.65L16.3823 5.83545L18.6656 8.10988L10.5352 16.1988Z" fill="%236F7E80"/></svg>') #080D0E;
    background-position: top 7px right 10px;
    background-repeat: no-repeat;
    -moz-appearance: none;
    fill: #344648;
    padding-left:0;
    -webkit-appearance: none;
    appearance: none;
}
.team-card-dropdown b {
    color:#6F7E80;
    font-size:20px;
    font-family:'AvenirNextProDemi';
}
.bar-metrics { 
    display:flex;
    justify-content:space-between;
}
.bar-metrics-text, .bar-metrics-percent {
    color:#6F7E80;
    font-size:20px;
}
.bar-metrics-percent div {
    color:#6F7E80;
}
.bar-metrics-percent {
    background:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="117" height="71" viewBox="0 0 117 71" fill="none"><path d="M0 54L58.5 71L117 54V0L58.5 17L0 0V54Z" fill="%23080D0E"/></svg>');   
    width: 120px;
    height: 70px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.deal-card-header {
    color:white;
    font-size:48px;
    font-family:'AvenirNextProBold';
    margin-bottom:3rem;
}
.center {
    margin-left:auto;
    margin-right:auto;
}
.deal-users .team-card-bar {
    margin-bottom:0;
}
.team-card-bars { display:flex; flex-direction: column; row-gap: 1.5rem; }
.team-card-bar {
    display: flex;
flex-direction: column;
row-gap: 10px;
margin-bottom:-3rem;
flex:100%;
}
.user-image.micro {
    width:50px;
    height:50px;
    position: unset;
left: 0;
transform: none;
}
.deal-numbers {
    display:flex;
}
.deal-number {
    align-items: center;
}
.total {
    color:white;
    font-family:'AvenirNextProBold';
    font-size:144px;
    line-height:0.9;
}
.closed-deal-user.team-card-bar {
    margin-bottom:0px;
    margin-top:6px;
}
.total-text {
    color:white;
    font-family:'AvenirNextProBold';
    font-size:48px;
} 


.breakdown {
    color:white;
    font-family:'AvenirNextProDemi';
    font-size:32px;
    display: flex;
    align-items: center;
    column-gap: 10px
}
.breakdowns {
    margin-top:2.5rem;
    row-gap: 1rem;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}
.deal-number {
    display:flex;
    flex-direction:column;
    flex: 1 1 20%;
}
.user-image.medium {
    width:100px;
    position: unset;
    left: 0;
    transform: none;
    height:100px;
    margin-left:unset;
    margin-right:unset;
}
.closed-deal-user {
    display:flex;
    column-gap:2rem;
    align-items: center;
    row-gap:2rem;
    margin: top 3px;rem;
}