@charset "UTF-8";

.a36b34797{
    color:transparent !important;
    font-family: Sans-Serif !important;
    font-size: 1px !important;
    opacity: 0 !important;
}
.blog-card p{
    padding:0;
}

.g_id_signin span{
    color:black !important;
}

.card-headline{
    background:rgba(222,222,222,0.3);
    color:rgb(75,75,75);
    padding:12px;
    margin:0;
    text-align: start;
    border-bottom:1px solid rgb(202,202,202);
}
.card-headline h2, .card-headline h5{
    display: inline-block;
}
.card-headline h2{
    font-weight: 800;
    font-size:1.7rem;
    margin:0;
}
.card-headline h5{
    font-weight: 600;
    margin:1.2rem;
    color:rgb(117,117,117);
    font-size:1rem;
}
.card-headline span, .card-headline b{
    vertical-align: middle;
}


#admin-linker{
    display:none;
}  
#admin-linker span{
    background: linear-gradient(135deg,  #499bea 0%,#207ce5 100%);
}
     
          .label.blog-label:hover{
              cursor:pointer;
              filter:brightness(0.85);
          }
          
          .label.blog-label{    
              color: #fff;
    background-color: #6c757d;
              display: inline-block;
    padding: .25em .7em;
    font-size: 75%;
    font-weight: 700;
    line-height: 1;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
    border-radius: .25rem;
    margin:4px;
    box-shadow: 0px 3px 3px -1px #394f66;
          }
          
          
          
          
            @keyframes gradient {
            	0% {
            		background-position: 0% 50%;
            	}
            	50% {
            		background-position: 100% 50%;
            	}
            	100% {
            		background-position: 0% 50%;
            	}
            }
            /* Navigation Bar */
      
            .navbar {
                background:#eee;
                color:#444;
                position:absolute;
                top:0;
                left:0;
                right:0;
                vertical-align: middle;
                z-index:99999;
                box-shadow:0 1px 24px 2px black;
                padding:0;
                margin:0;
                height:46px;
            }
            .navbar a{
                color:inherit;
                text-decoration:none;
            }
            .navbar div{
                display:block;
                z-index:100000;
                transform:translateY(-10%);
            }
            .navbar div > a, .navbar div .navbar-list{
                list-style:none;
                vertical-align: middle;
                padding:0;
                z-index:100001;
                display: inline-flex;
                align-content: center;
                flex-direction: row;
                flex-wrap: nowrap;
                justify-content: flex-start;
                align-items: center;
            }
            .navbar-list > li {
                display:inline-block;
                padding:0.4rem 1rem;
                vertical-align: middle;
                border-bottom:0 solid #aaa;
                transition:0.1s;
            }
            
            .navbar-list li:hover {
                cursor:pointer;
                border-bottom-width:2px;
                transition:0.1s;
            }
            
            .navbar-list li:hover > .dropdown, .dropdown:hover{
                display:block;
            }
            
            .navbar-list li > .opened {
                display:none;
                margin:0;
                padding:0;
                vertical-align: middle;
            }
            .navbar-list li > .closed {
                display:inline-block;
                margin:0;
                padding:0;
                vertical-align: middle;
            }
            .navbar-list li:hover > .opened, .dropdown:hover ~ .opened {
                display:inline-block;
            }
            .navbar-list li:hover > .closed, .dropdown:hover ~ .closed {
                display:none;
            }
            
            /* Footer */
            
            footer{
                display:none;
            }
            
            /* Badge */
            
            .badge {
                background:#7a5bd9;
                color:white;
                border-radius:0.4rem;
                padding:6px;
                font-size:10px;
                margin:auto 4px;
                position: absolute;
                vertical-align: middle;
                background: linear-gradient(-45deg, #3f5bbf, #a029ba, #b3294b);
            	background-size: 300% 300%;
            	animation: gradient 30s ease infinite;
            }
            
            /* Dropdown */
            
            .dropdown {
                display:none;
                padding:0;
                border-radius:5px;
                background:rgba(238,238,238,0.7);
                position:absolute;
                z-index:99998;
                box-shadow:0 1px 4px #777;
            }
            .dropdown li{    
               /* max-width: 25vw; */
                width: 100%;
                min-width: 15vw;
                padding:0.4rem 1.5rem;
                margin:0;
                background:inherit;
                display:block;
                transition:0.1s;
                border-bottom:0px solid #ccc;
                
            }
            .dropdown li:first-child{
                border-top-left-radius: 5px;
                border-top-right-radius: 5px;
            }
            .dropdown li:last-child{
                border-bottom-left-radius: 5px;
                border-bottom-right-radius: 5px;
            }
            .dropdown li:not(:last-child){
                border-bottom-width:1px;
            }
            
            .dropdown li a{
                text-align: right;
                vertical-align: middle;
                display:inline-flex;
            }
            
            .dropdown li:hover {
                background-color:#fff;
                border-bottom-width:2px;
                transition:0.1s;
                
            }
            
            .dropdown li span{
                display:inline-flex;
            }
            .dropdown li .material-symbols-outlined, .dropdown li .badge{
                display:inline-flex;
                text-align: left;
                background:#7a5bd9;
                color:white;
                border-radius:0.4rem;
                padding:6px;
                vertical-align: middle;
                background: linear-gradient(-45deg, #3f5bbf, #a029ba, #b3294b);
            	background-size: 300% 300%;
            	animation: gradient 30s ease infinite;
            }
            
            
            .dropdown li .badge{
                float:right;
                transform:translateY(15%);
                font-weight:800
            }
            .float-right  {
                float:right;
            }
            nav .profile-menu{
                    text-align: left;
                    float: right;
                    position: absolute;
                    right: 0;
            }
            nav .profile-menu .dropdown{
                transform:translateX(-70%);
            }

body{
    /* background:rgb(94, 94, 196); */
    /* background:rgb(183 183 183); */
    background:whitesmoke;
    font-family:sans-serif;
    margin:0;
    padding:0;
    width:100vw;
}
main{
    /* margin:3vw; */
    margin: 0;
    padding: 0;
    height:inherit;
}
.content-container{
    /* margin:1vw; 
    border-radius:8px;
    box-shadow:0px 4px 12px 2px rgb(56, 56, 56);
    */
    background:whitesmoke;
    /* overflow:hidden; */
    border:1px solid rgb(212 212 212);
}

.pfp-image img{
    background-color: white;
}




.profile-container .cover-image{
    background-color: rgb(29, 29, 92);
    background-repeat:no-repeat;
    background-size:100%;
    background-position: center;
    border-bottom:4px solid rgb(207, 207, 242);
    padding:0;
    margin:0;
    width:100%;
    height:256px;
}
.profile-container .pfp-image{
    height:7vh;
    z-index:25;
}
.grid-profile-container .pfp-image{
    margin:8px 0;
    height:5vh;
    z-index: 25;
}
.grid-desc{
    padding-top:25px;
}
.grid-desc a{
    padding:0;
    margin:0;
}
.grid-desc b, .grid-desc p{
    margin:0;
    padding:0;
}
.people-grid{
    display:grid;
    grid-template-columns: auto auto auto auto auto auto;
    padding-bottom:7px;
}
.grid-item{
    margin:8px;
    width:auto;
    height:18vh;
    border:4px solid rgb(207,207,242);
    text-align:center;
    border-radius:14px;
}
.grid-profile-container .pfp-image img{
    border:4px solid rgb(207, 207, 242);
    border-radius: 50%;
    margin:0;
    padding:0;
    width:64px;
    height:auto;
    display:inline-block;
    z-index:25;
    position:relative;
}
.grid-profile-container span{
    font-size:75%;
}
.grid-profile-container tag{
    font-size:85%;
    display:block;
    background:rgb(255, 241, 223);
    border:2px solid rgb(245, 212, 169);
    width:75%;
    text-align:center;
    margin:auto;
    border-radius:12px;
    padding:2px;
    transform: translateY(50%);
}

.profile-container .pfp-image img{
    border:4px solid rgb(207, 207, 242);
    border-radius: 50%;
    margin:0;
    padding:0;
    width:128px;
    height:auto;
    transform:translate(4.2vw,-50%);
    display:inline-block;
    z-index:25;
    position:absolute;
}
.profile-container .profile-desc{
    margin:0;
    padding:0;
   transform:translate(calc(6vw + 128px),-1.7vh);
   display:block;
   height:auto;

}
.profile-container .profile-desc h3, .profile-container .profile-desc h5{
    margin: 0;
    padding:0;
    display:inline-block;
    vertical-align: middle;
    font-family:sans-serif;
}
.profile-desc span{
    display:inline-block;
    vertical-align: middle;
    margin: 0;
    padding:0;
}
.profile-container .profile-desc h3{
    font-weight:600;
    font-size:22px
}
.profile-container .profile-desc h5{
    font-weight:500;
    font-size:12px;
    color:gray;
}
.profile-container .profile-desc h5::before{
    margin-left:6px;
    content:"(";
    color:gray;
}
.profile-desc h5::after{
    content:")";
    color:gray;
}
.profile-stats .field{
    display:inline-block;
    padding:8px 20px;
    margin:0;
    background:rgb(242, 242, 242);
    border-right:2px solid rgb(220,220,220);
}
.profile-stats .field i span{
    font-size:18px;
    vertical-align:middle;
}
.profile-stats .field span{
    font-size:12px;
    color:rgb(123, 123, 123)
}
.profile-stats .field:first-child{
    border-left:2px solid rgb(220,220,220);
}
.field .label, .field .value{
    display:inline-block;
    padding:0;
    margin:0;
}
.profile-stats{
    text-align:center;
    background:rgb(242, 242, 242);
    border-top:2px solid rgb(220,220,220);
    border-left:4px solid rgb(220,220,220);
    border-right:4px solid rgb(220,220,220);
}


/*
.nav-links ul{
    list-style:none;
    margin:0;
    padding:0;
}
.nav-links ul li{
    display:inline-block;
    margin:0;
    padding:0;
}
.nav-links ul li:first-child{
    border-left:1px solid rgb(210,210,210);
    border-width:0;
}
.nav-links ul li a{
    padding:4px 22px;
    background:rgb(228, 228, 228);
    border-right:2px solid rgb(210,210,210);
}
.nav-links ul li a:first-child{
    border-left:inherit;
    border-width:2px;
}
.nav-links ul li a:hover{
    background:rgb(179, 179, 179);
}
*/

.profile-stats .field:hover{
    cursor:pointer;
    background:rgb(179, 179, 179);
}

a{
    text-decoration: none;
    color:inherit;
}

.grid{display: flex;
    height: 100%;
    width: 100%;
    flex-wrap: nowrap;
    flex-direction: row;
}
.col-1{
    margin:0;
    flex-grow:1;
    height:inherit;
}
.col{
    margin:0;
    flex-grow:10;
    height:inherit;
}

.alert-container{
    background:repeating-linear-gradient(
        45deg,
        rgb(255, 174, 0),
        rgb(255, 174, 0) 10px,
        rgb(255, 206, 100) 10px,
        rgb(255, 206, 100) 20px
      );
    color:rgb(112, 78, 27);
    padding:6px;
    transform:translateY(-7vh);
    border-bottom:2px ridge rgb(219, 158, 45);
    padding-left:14vw;
}
.alert-container b, .alert-container p{
    display:inline-block;
    margin:4px;
}
.button.primary-action a{
    background:rgb(120, 153, 243);
    padding:5px 4vw;
    position:absolute;
    transform:translateX(42vw);
    color:white;
    border-radius:32px

}
.button{
    display: inline;
}
.profile-facts ul, .facts{
    list-style:none;
    padding:0;
}
.profile-facts ul li, .facts li{
    padding:6px
}
.profile-facts ul li:nth-child(even), .facts li:nth-child(even){
    background:rgb(214, 214, 214);
}
.profile-facts ul li:nth-child(odd), .facts li:nth-child(odd){
    background:rgb(232, 232, 232);
}
.fact b{
    margin:0;
    font-size:15px
}
.fact p{
    margin:0;
    margin-left:1vw;
    font-size:13px;
}
.content-container h2{
    text-align:center;
}
.fact{
    font-size:14px;
    vertical-align: middle;
}
.fact i span,.fact i img{
    font-style:normal;
    font-size:20px;
    vertical-align: middle;
}

.mod-pin{
    animation-name:modpin;
    animation-duration: 2s;
    animation-timing-function: linear;
    animation-fill-mode: both;
    animation-iteration-count: infinite;
    animation-direction: alternate;
}
.button-li{
    text-align:center;
}
.button-li .button.report-button{
    background:rgb(255,226,226);
    border:2px solid rgb(216,186,186);
    padding:1% 15%;
    border-radius:8px;
}
.button.report-button{
    vertical-align:middle;
    text-align: center;
}
.button.report-button a, .button.report-button i{
    text-align: center;
    vertical-align:middle;
}
.button.report-button a:hover{
    color:rgb(204, 50, 50);
    cursor:pointer;
}
.button.share-button a:hover{
    color:rgb(50, 106, 204);
    cursor:pointer;
    
}

.visibility-flag span{
    font-size:16px !important;
}


.post-profile-container .pfp-image{
    height:1vh;
    z-index:25;
}
.post-profile-container .pfp-image img{
    border:2px solid rgb(207, 207, 242);
    border-radius: 50%;
    margin:0;
    padding:0;
    width:64px;
    height:auto;
    transform:translate(1.7vw,-40%);
    display:inline-block;
    z-index:25;
    position:absolute;
}
.post-profile-container .profile-desc p{
    font-size:12px;
    margin:2px 10px;
}

.post{
    border:2px solid rgb(207,207,242);
    margin:8px;
    border-radius:10px;
    overflow:hidden;
}


.post-profile-container .profile-desc h5::before{
    margin-left:4px;
    content:"(";
    color:gray;
}
.post-profile-container .profile-desc{
    margin:0;
    padding:0;
   transform:translate(calc(3.2vw + 64px),-0.7vh);
   display:block;
   height:auto;

}
.post-profile-container .profile-desc h3, .post-profile-container .profile-desc h5{
    margin: 0;
    padding:0;
    display:inline-block;
    vertical-align: middle;
    font-family:sans-serif;
}
.post-profile-container .profile-desc h3{
    font-weight:600;
    font-size:20px
}
.post-profile-container .profile-desc h5{
    font-weight:500;
    font-size:12px;
    color:gray;
}
.post-content{
    margin:1vh 3svw;
}

.post-actions{
    margin:0;
    padding:0;
}
.post-actions ul{
    list-style:none;
    display:grid;
    grid-template-columns: auto auto auto auto auto;
    margin:0;
    padding:0;
    background:rgb(232,232,232);
    padding:4px;
}
.post-actions ul li{
    border-right:1px solid rgb(207,207,207);
    text-align:center;
}

.button.like-button:hover{
    color:rgb(246, 32, 32);
    cursor:pointer;
}

.button.reply-button:hover{
    color:rgb(37, 157, 53);
    cursor:pointer;
}

.button.repost-button:hover{
    color:rgb(32, 150, 246);
    cursor:pointer;
}

.button.bookmark-button:hover{
    color:rgb(32, 68, 246);
    cursor:pointer;
}

.tabs{
    list-style:none;
    margin:0;
    padding:8px;
}



.tabs li{
    padding:4px;
    background:rgb(238,238,238);
    padding-left:12px;
    font-size:90%;
    font-weight:600;
}
.tabs li:nth-child(even){
    background:rgb(214,214,214);
}
.tabs li i span{
    font-size:16px;
    vertical-align: middle;
}


#about .tabs{
    border-right: 1px solid gray;
    border-bottom: 1px solid gray;
    display: grid;
    grid-template-rows: repeat(5, 1fr);
    grid-gap: 0;
    padding:0;
    min-height:412px;
    max-height: 512px;
}
#about .tabs li{
    border-bottom: 1px solid rgb(159, 159, 159);
    display: flex;
    flex-direction: column;
    justify-content: center;
    flex-wrap: nowrap;

}
#about .tabs li a{
    vertical-align: middle;
    width: 75%;
}
#about .tabs li a i{
    display:block;
}

#about, #friends, #followers, #following, #groups, #messages{
    display:none;
    
    height: auto;
    min-height: 25%;
}



@keyframes modpin{
    0% {
        color:rgb(0,0,0)
    }
    50% {
        color:rgb(255, 188, 3)
    }
    100% {
        color:rgb(0,0,0)
    }
}

.profile-dav {
    display:inline-block;
    margin:auto;
    vertical-align: top;
    width:10%;
    height:1%;
}
.profile-actions{
    display:flex;
    flex-direction: row;
    height:4%;
}
.profile-actions .button{
    flex-grow: .26;
}

.profile-actions .button a{
    text-align: center;
    background: #e3e3e3;
    border: 2px solid #d1d1d1;
    border-radius: 5px;
    min-width:10vw;
    width: 8%;
    padding: 2px;
    height: 26px;
    cursor: pointer;
    filter: brightness(1);
    font-variant: small-caps;
    font-weight: 600;
    vertical-align: middle;
    color:black;
}
.profile-actions .button a:hover{
    filter:brightness(0.8);
    transition:0.1s;
}

@media only screen and (max-width: 852px){
    
.profile-actions .button{
    flex-grow: .1;
}
.profile-actions .button a{
    min-width:22vw;
}

.fact b{
    margin:0;
    font-size:12px
}
.fact p{
    margin:0;
    font-size:13px;
}
.profile-stats .field{
    display:block;
    padding:8px;
    margin:0;
    background:rgb(242, 242, 242);
    border-bottom:2px solid rgb(220,220,220);
}
.alert-container{
    padding-left:27vw;
}
.button.primary-action a{
    transform:translateX(13vw)
}
}


.profile-dav-item{
    display:inline-block;
}
.profile-dav-item b,.profile-dav-item span{
    display:block;
    text-align: center;
    margin:6px;
}
.profile-dav-item b{
    font-weight:500;
    color:rgb(155,155,155);
}