.login-bar {
    min-height: 32px;
    display: grid;
    grid-template-columns: 1.5fr 0.8fr;
    padding: 0.5em !important;
}

.login-bar > * {
    padding: 0 2px;
    vertical-align: middle;
}

.login-bar > .profile-interactions {
    grid-column: 2;
    grid-row: 1 / 3;
    justify-self: end;
    align-self: center;
}

.big-login {
    color: #111;
    font-size: 1.6em;
    font-weight: 700;
    text-shadow: 1px 1px 3px #fff;
    align-self: center;
    justify-self: center;
}

.bigAvatar {
	height: 220px;
	width: 220px;
    border: 2px solid grey !important;
}

.citizenActionIcon {
	padding: 0 0.25em 0 0;
	font-size: 1.75em;
}

.profile-interactions {
    grid-column: 2;
    grid-row: 1 / 3;
    justify-self: center;
    align-self: center;
}

.profile-data.profile-eq {
    padding: 0.5em;
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.mobile .profile-data.profile-eq {
    flex-direction: column;
}

table.eq-profile-stats {
    border-collapse: collapse;
    color: #3d6571;
    min-width: 175px;
}

.rank220px.halfSizeOnDesktop {
	width: 110px;
}
.mobile .rank220px.halfSizeOnDesktop, .rank220px {
	width: 220px;
}

table.eq-profile-stats TR TD {
    border-bottom: 1px solid #649bac;
    padding: 4px 0 2px;
}
table.eq-profile-stats TR:last-child TD {
    border-bottom: 0 none;
}

table.eq-profile-stats TR:nth-child(n+3) TD:first-child {
    width: 40%;
    text-align: right;
}

table.eq-profile-stats TR:nth-child(n+3) TD:last-child {
    padding-left: 8px;
    text-align: left;
}

table.eq-profile-stats .ui-tooltip {
    width: 215px;
    display: none;
    position: absolute;
    z-index: 100;
}

table.eq-profile-stats .eq-stats-label {
    letter-spacing: 1px;
}

.profile-data.profile-eq::after, .profile-row.clear::after {
    clear: both;
    content: " ";
    display: block;
    font-size: 1px;
    line-height: 1px;
}

.help {
    cursor: pointer;
}

span.blue {
    color: #009;
}

span.online {
    color: #090;
}

span.offline {
    color: #900;
}

.profile-data, .profile-shouts, .login-bar {
    background: #f2f2f2 url("/img/bg5.png") repeat scroll 0 0;
    border: 1px solid #649bac;
    border-radius: 3px;
    color: #080808;
    font-size: 12px;
    margin: 0 auto 6px;
    padding: 4px 0;
    text-shadow: 0 0 2px #fff;
    position: relative;
}

.profile-data.green {
    border: 1px solid #5b5;
    box-shadow: 0 0 4px 1px #5b5 inset;
    color: #080;
}

.profile-data.red {
    border: 3px solid #ff0000;
    box-shadow: 0 0 4px 1px #e99 inset;
    color: #b91414;
}

.profile-data .rank, .profile-shouts .rank {
    color: #3d6571;
    font-size: 20px;
    text-decoration: underline;
    font-weight: 900;
    letter-spacing: 1px;
    padding: 4px;
    text-align: center;
}

.profile-data .fbShare {
    text-shadow: 0 0 2px #026;
}

.profile-row {
    border-top: 1px solid #8bb4c0;
    box-sizing: border-box;
    margin: 0 !important;
    min-height: 1.5em;
    padding: 5px 15px;
}

.profile-data .profile-row .label {
    float: left;
}

.profile-data .profile-row .data {
    float: right;
}

.profile-data .profile-row .data > div {
    vertical-align: middle;
}
/*newTag is temporary*/
.profile-data strong, .profile-data a:not(.newTag) {
    display: block;
    font-weight: 900;
    text-align: center;
}

.profile-data a.profileLink {
    display: inline;
}

.profile-data strong.office {
    letter-spacing: 1px;

}

.modIcon {
    color: #183153;
}

.mofIcon {
    color: #cdcd00;
}

.mosIcon {
    color: #1DA1F2;
}

.congressIcon {
    color: #ffa700;
}

.leaderIcon {
    color: #240824;
}

.presidentIcon {
    color: #ed9121;
}

.premium-account {
    color: darkGoldenrod;
    font-size: 15px;
    padding: 4px 0;
    text-align: center;
    text-shadow: 0 0 2px #fff;
}

.premium-account > * {
    display: inline-block;
    margin: 0 4px;
    vertical-align: middle;
}

.discord-nick {
    font-size: 1rem;
    margin-top: .7rem;
    margin-bottom: .5rem;
}

.discord-nick span {
    font-weight: bold;
}

.profile-text {
    background-color: rgba(61, 101, 113, 0.2);
    border-radius: 0.25em;
    border: 2px solid grey;
    margin: 0.25em auto;
    max-height: 400px;
    max-width: 100%;
    overflow: auto;
    padding: 0.25em;
}

.myTextInDoc {
    width: 180px;
    text-align: center;
    float: left;
    font-family: "open sans", sans-serif;
}

#pagination-digg a {
    background: none repeat scroll 0 0 rgba(0, 0, 0, 0);
    border: 0 none;
    box-shadow: none;
    color: #222222;
    display: block;
    margin: 0;
    padding: 0.4em 0.8em !important;
    text-decoration: none;
    text-shadow: 0 0 1px #FFFFFF, 0 1px #FFFFFF;
    cursor: pointer;
}

#pagination-digg a:hover {
    border: 0 none;
    box-shadow: none !important;
    outline: 1px solid rgba(200, 200, 255, 0.5);
}

#medals {
    font-size: 14px;
}

#profileEquipmentNew .equipmentBox {
    background-color: transparent !important;
    border: 0px solid transparent !important;
    box-shadow: none !important;
    height: auto !important;
    margin: 0 !important;
    width: auto !important;
}

#profileEquipmentNew .equipmentBack {
    position: relative;
}

.eqStats {
    float: right;
}

/*.foundation-style .profile-row > .shoutContainer > .shoutModerator,*/
/*.foundation-style .profile-row > .shoutContainer > .shoutFundraiser,*/
/*.foundation-style .profile-row > .shoutContainer > .shout2 {*/
    /*max-width: 85% !important;*/
/*}*/

.articleImage {
    width: 100% !important;;
}

.medalsMobile {
    display: flex !important;
    padding: 0;
}

.medalsMobile ul {
    display: flex !important;
    justify-content: center;
    flex-wrap: wrap;
}

.medalsMobile ul li img {
    width: 8.5vh !important;
}

.medalsMobile ul li {
    width: 8.5vh;
    padding: 3px;
}

#description {
    font-weight: 700;
    background: linear-gradient(to right, #b8860b 25%, #b8b10b 50%, #b8860b 75%);
    background-size: 200% auto;
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    animation: textclip 1.5s linear infinite;
    text-shadow: none;
}

@keyframes textclip {
    to {
        background-position: 200% center;
    }
}

.reportContainer > form {
    display: flex;
    flex-direction: column;
    width: 200px;
    justify-content: center;
    align-items: center;
}

.mobile .reportContainer > form {
    width: 90%;
}

.reportContainer select {
    width: 150px;
}

.reportContainer textarea {
    height: 91px;
    width: 200px;
    max-width: 200px;
    margin: 0px;
}

.blockUserContainer {
    /*border-top: 1px solid #8bb4c0;*/
    margin-top: 0.5em;
}

.mobileFriendsListWrapper {
    float: left;
    width: 20%;
    height: 80px;
    word-wrap: break-word;
    font-size:10px;
 }

.mobile .reportContainer {
    font-size: 1em;
}

.mobile .reportContainer select {
    font-size: 1em;
    width: 400px;
}

.mobile .reportContainer textarea {
    max-width: 90%;
    font-size: 0.5em;
    height: 250px;
    width: 90%;
}

.mobile .profile-interactions {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    font-size: 1.5em;
    margin-bottom: 0.6em;
}

.mobile #mobileProfile {
    width: 100%;
    display: flex;
    flex-direction: column;
    text-align: center;
    justify-content: center;
}

.mobile #loginBar {
    width: 96%;
    min-height: 15vw;
    display: flex;
    text-align: center;
    align-items: center;
    font-size: 3em;
    line-height: 7vw;
    word-break: break-all;
    flex-direction: column;
    justify-content: center;
}

.mobile #loginBar .big-login {
    padding-right:10px;
}


.profile-row img {
    width: 4em !important;
    height: 4em !important;
}

.mobile .profile-row img {
    width: 3em !important;
    height: 3em !important;
}

.mobile .profile-row .achievement70 {
    zoom: 2;
}

.mobile .eqStats {
    justify-content: center;
    float: unset;
    padding: 0 10px 10px;
    margin-top: 0.25em;
}

.mobile .mobileEqProfileStats {
    font-size: 0.75em !important;
    text-align: center;
    display: grid !important;
    grid-template-columns: 1fr 1fr 1fr;
    grid-template-rows: 1fr 1fr 1fr;
    column-gap: 1em;
    width: fit-content;
    align-content: center;
    justify-content: center;
}

.mobile .mobileFriendsListContainer {
    display: flex !important;
    justify-content: center;
    flex-wrap: wrap;
}

.mobile .mobileFriendsListContainer img {
    width: 3em;
    height: 3em;
    border: 1px solid #888;
}

.mobile .mobileFriendsListContainer .clear {
    display: flex !important;
    justify-content: center;
    flex-wrap: wrap;
    gap: 0.25em;
}

.mobile .mobileFriendsListWrapper {
    height: auto;
    padding: 1em;
}

.mobile .mobileFriendsListWrapper a {
    font-size: 3.5em;
    overflow: hidden;
    white-space: normal;
    text-overflow: ellipsis;
}

.mobile #profileText {
    max-width: 100vw;
    width: 100% !important;
    box-sizing: border-box !important;
    padding: 0.5em;
    border: 3px solid grey;
    max-height: 50vw;
}

.mobile #moderatorActionsMobile {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}

.mobile #moderatorActionsMobile b, .mobile #moderatorActionsMobile button, .mobile #mOperations table td a,
.mobile #mOperations b, .mobile #mPlayerInfo b, .mobile .cssToMobile, .mobile .rank, .mobile .premium-account,
.mobile #advancedModeratorActions input {
    font-size: 4vw !important
}

.mobile #mOperations table {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}

.mobile #mOperations table tr {
    font-size: 4vw;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}

.mobile #mOperations table td {
    width: 100%; font-size: 4vw
}

.mobile #advancedModeratorActions, .mobile #advancedModeratorActions form {
    width: 100%;
    margin: 0 !important;
    font-size: 4vw;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}

.mobile .profile-data {
    font-size: 4em !important;
    width: 99%;
    padding: 8px 0 4px !important;
    position: relative;
}

.mobile .citizenAction {
    width: 19vw;
    height: 8vh;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 1vw;
}

.mobile .citizenAction {
    width: 6vw;
}

.mobile .bigAvatar {
    width: 30vh;
    height: 30vh;
}

.mobile #profileTable {
    width: 100%;
}

.profileShoutNew {
    margin-bottom: 0.5em;
}

.profile-shouts .shoutContainer {
        width: 90% !important;
    filter: none;
    }

.mobile .mobileFriendsListWrapper .citizenName {
    font-size: 0.8125em;
}

.newProfileData {
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    gap: 0.25em;
}

.mobile .newProfileData {
    display: grid;
    grid-template-columns: 1fr 1fr;
}

.newProfileData .newProfileRow {
    padding: 5px 15px;
    border-radius: 0.5em;
    font-size: 0.85em;
    text-shadow: none;
    color: white;
    border: 1px solid grey;
    box-shadow: 1px 1px 2px 1px #000000d1;
    background-image: url(/img/bgForElements/texture3.png), url(/img/bg.png) !important;
    margin: 0 0.5em !important;
    min-height: 0;
}

.mobile .newProfileData .newProfileRow {
    padding: 0.25em 0.75em;
    margin: 0 !important;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

