@media (prefers-color-scheme: dark) {
    body{
        color:rgb(224,224,224);
    }
    
    
    .card-headline{
    background:rgba(122,122,122,0.3);
        color:rgb(224,224,224);
    border-bottom-color:rgb(112,112,112);
}
.card-headline h5{
    color:rgb(172,172,172);
}
    
    
    
.blog-card{
    background:rgb(107,107,107) !important;
    border-color:rgb(72,72,72) !important;
    box-shadow: 0 4px 3px rgb(72,72,72) !important;
}
.blog-card p{
    color:rgb(192,192,192) !important;
}
.blog-card h3{
    color:rgb(192,192,192);
}
    
    
    
    .profile-actions .button a{
        background-color:rgba(125,125,125,0.3);
        border-color:rgba(95,95,95,0.8);
        color:rgb(199,199,201);
    }
    #new-post-button{
        background-color:rgba(125,125,125,0.3) !important;
        border-color:rgba(95,95,95,0.8) !important;
        color:rgb(199,199,201) !important;
    }
    
    
    
    .blog-footer{
        background-color:rgb(72,72,72) !important;
        border-color:rgb(92,92,92) !important;
    }
    
    .gcard-container {
        background:rgb(62,62,62) !important;
        border-color:rgb(42,42,42) !important;
    }
    .gcard {
        background:rgb(62,62,62) !important;
        border-color:rgb(42,42,42) !important;
    }
    
    /* Modal Dialog */
    dialog{
        background-color:rgb(43, 43, 43) !important;
        border-color:rgb(23,23,23) !important;
    }
    
    dialog .topbar{
        background-color:rgb(23, 23, 23) !important;
        color:white;
    }
    
    .header{
        background-color:rgb(72,72,72);
    }
    .header .fakeimg{
        opacity:0;
    }
    .leftcolumn, .rightcolumn {
        background-color:rgb(72,72,72);
        border-color:rgb(42,42,42) !important;
    }
    
    .row > .card{
        background-color:rgb(72,72,72);
        border-color:rgb(42,42,42) !important;
    }
    
    .card h3{
        color:#7e95d7 !important;
    }
    .card p, .card span{
        color:#eee !important;
    }
                
                
                /* Navigation Bar */
                
                .navbar {
                    background:#0F0E0E;
                    color:#eee;
                    box-shadow:0 1px 24px 2px black;
                }
                .navbar a{
                    color:inherit;
                    text-decoration:none;
                }
                .navbar-list > li {
                    border-bottom:0 solid #444;
                }
                
                /* Badge */
                
                .badge {
                    background:#7a5bd9;
                    color:white;
                    background: linear-gradient(-45deg, #3f5bbf, #a029ba, #b3294b);
                	background-size: 300% 300%;
                	animation: gradient 30s ease infinite;
                }
                
                /* Dropdown */
                
                .dropdown {
                    background:rgba(98,98,98,0.7);
                    box-shadow:0 1px 4px #333;
                }
                .dropdown li{
                    border-bottom:0px solid #555;
                }
    
                
                .dropdown li:hover {
                    background-color:#777;
                }
             
             
    .wip{
        background-color:#854500 !important;
        border-color:#a07431 !important;
        color:#f5ca75 !important;
    }  
    .readonly{
        border-color:rgb(130, 130, 130) !important;
        color:rgb(130, 130, 130) !important;
        background-color:rgb(59, 59, 59) !important;
    }
    
    body{
        /* background:rgb(94, 94, 196); */
        /* background:rgb(183 183 183); */
        background-color: rgb(94,94,94);
    }
    .content-container{
        /* margin:1vw; 
        border-radius:8px;
        box-shadow:0px 4px 12px 2px rgb(56, 56, 56);
        */
        background:rgb(43,43,43);
        border-color:#010104;
    }
    
    #about, #friends, #followers, #following, #groups{
        color:white;
        background:rgb(73,73,73);
    }
    
    .pfp-image img, #pfp-image{
        filter: brightness(80%) contrast(105%);
    }
    
    .profile-container{
        /* margin:1vw; 
        border-radius:8px;
        box-shadow:0px 4px 12px 2px rgb(56, 56, 56);
        */
        background:rgb(43,43,43);
        border-color:#010104;
    }
    
    .grid-item{
        background:rgb(94,94,94);
        color:rgb(224,224,224);
        border:4px solid rgb(72,72,72);
    }
    .grid-profile-container .pfp-image img{
        border:4px solid rgb(72,72,72);
    }
    .grid-profile-container tag{
        /* ##e2d4c6 */
        background:#1f1100;
        border:2px solid #3a2b1d;
    }
    
    .profile-container .pfp-image img{
        border:4px solid rgb(176,176,176);
    }
    .profile-container .profile-desc h5{
        font-weight:500;
        font-size:12px;
        color:rgb(196,196,196);
    }
    .profile-desc h3{
        color:rgb(196,196,196);
    }
    .profile-container .profile-desc h5::before{
        margin-left:6px;
        content:"(";
        color:rgb(196,196,196);
    }
    .profile-desc h5::after{
        content:")";
        color:rgb(196,196,196);
    }
    .profile-stats .field{
        background:rgb(42,42,42);
        border-right:2px solid rgb(24,24,24);
        border-bottom-color:rgb(24,24,24);
        color:rgb(184,184,184)
    }
    .profile-stats .field span{
        color:rgb(184,184,184)
    }
    .profile-stats .field:first-child{
        border-left:2px solid rgb(24,24,24);
    }
    .profile-stats{
        background:rgb(42, 42, 42);
        border-top:2px solid rgb(24,24,24);
        border-left:4px solid rgb(24,24,24);
        border-right:4px solid rgb(24,24,24);
    }
    
    .profile-stats .field:hover{
        cursor:pointer;
        background:rgb(62, 62, 62);
    }
    
    .profile-facts ul li:nth-child(even), .facts li:nth-child(even){
        background:rgb(96, 96, 96);
    }
    .profile-facts ul li:nth-child(odd), .facts li:nth-child(odd){
        background:rgb(64,64,64);
    }
    .fact b{
        color:rgb(232,232,232);
    }
    .fact p{
        color:rgb(206,206,206);
    }
    .fact small{
        color:rgb(217,217,217) !important;
    }
    
    .post-profile-container .pfp-image img{
        border:2px solid rgb(207, 207, 207);
    }
    
    .post{
        background-color:rgb(72,72,72);
        border:2px solid rgb(43,43,43);
    }
    
    .profile-container .cover-image{
        background: linear-gradient(135deg,  #7d7e7d 0%,#0e0e0e 100%) !important;
        border-color:#010104;
    }
    #pfp-image{
        border-color:#010104 !important;
    }
    
    .post-profile-container .profile-desc h5::before{
        color:rgb(216,216,216);
    }
    .post-profile-container .profile-desc h5::after{
        color:rgb(216,216,216);
    }
    .post-profile-container .profile-desc h5{
        color:rgb(216,216,216);
    }
    .post-actions ul{
        background:rgb(64,64,64);
    }
    .post-actions ul li{
        border-right:1px solid rgb(43,43,43);
    }
     
    .tabs li{
        background:rgb(138,138,138);
    }
    .tabs li:nth-child(even){
        background:rgb(114,114,114);
    }
    
    
    .profile-dav-item b{
        font-weight:500;
        color:rgb(155,155,155);
    }
    
.g_id_signin span{
    color:black !important;
}

.fact-editor .bottombar{        
    background-color: rgb(23, 23, 23) !important;
        color: white;
}

label{
    color:rgb(222,222,222);
}
select{
    background-color:rgb(72,72,72) !important;
    border-color:rgb(118,118,118) !important;
    color:rgb(222,222,222) !important;
}
select:focus{
    outline:none;
}

#remove-fact{
    color: #800505 !important;
}
#remove-fact:hover{
    color: #a33d34 !important;
}

}