/* //////////////////////////////////////////////// WINDOW THEMES */

.windowThemeAdded {
    position: fixed;
    top: 0px;
    bottom: 0px;
    right: 0px;
    left: 0px;
    mask: linear-gradient(0deg, transparent 0%, black 40%);
    animation: globalFadeInDarkANIM 0.5s ease-out forwards;
    z-index: -1;
}


/* ------------ GREYWOLF */
.windowTheme_greywolf {
    background-color: #232736;
    background-image: url(../content/img/background_icon_1.png);
    background-position: center;
    background-repeat: repeat;
    background-attachment: fixed;
}


/* ------------ HEAVENKID */
.windowTheme_heavenkid {
    background-color: #2f0065;
    background-size: 200px 200px;
    background-image: url(../users/themes/heavenkid.webp);
    background-position: center;
    background-repeat: repeat;
}

/* ------------ SPIRITOFDEATH */
.windowTheme_spiritofdeath {
    background-color: #0e1b33;
    background-size: 140px 140px;
    background-image: url(../users/themes/spiritofdeath.webp);
    background-position: center;
    background-repeat: repeat;
}

/* ------------ PAINT */
.windowTheme_paint {
    background-image: url(../users/themes/paint.webp);
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}

.themebgpaint {
    background-color: rgba(90, 40, 20, 0.6);
}

/* ------------ STREETART */
.windowTheme_streetart {
    background-image: url(../users/themes/streetart.webp);
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}

.themebgstreetart {
    background-color: rgba(30, 50, 70, 0.8);
}

/* ------------ SPLASH */
.windowTheme_splash {
    background-image: url(../users/themes/splash.webp);
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}

.themebgsplash {
    background-color: rgba(65, 40, 50, 0.5);
}


/* ------------ FIREWORKS */
.windowTheme_fireworks {
    background-image: url(../users/themes/fireworks.webp);
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}

.themebgfireworks {
    background-color: rgba(40, 45, 100, 0.6);
}


/* ------------ ARCADE */
.windowTheme_arcade {
    background-image: url(../users/themes/arcade.webp);
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}

.themebgarcade {
    background-color: rgba(40, 30, 100, 0.6);
    backdrop-filter: blur(2px);
}


/* ------------ WORKSHOP */
.windowTheme_workshop {
    background-image: url(../users/themes/workshop.png);
    background-position: top;
    background-size: cover;
    background-repeat: no-repeat;
}

.themebgworkshop {
    background: rgba(15, 91, 75, 0.1);
}

/* ------------ COSMIC MEETING */
.windowTheme_cosmic_meeting {
    background-color: #000000;
    background-size: 300px 300px;
    background-image: url(../users/themes/cosmic_meeting.png);
    background-position: center;
    background-repeat: repeat;
}

.themebgcosmic_meeting {
    background: rgba(0, 0, 0, 0.6);
}

/* //////////////////////////////////////////////// COLORS */

.teamworksMemberDefault {
    border: solid 2px rgba(255, 255, 255, 0.2);
    background: rgba(255, 255, 255, 0.27);
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.27) 0%, rgba(237, 237, 237, 0) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#ededed', GradientType=1);
}

.teamworksMemberWhite {
    position: relative;
    border: solid 2px rgba(255, 255, 255, 0.2);
    background: rgba(255, 255, 255, 0.27);
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.8) 0%, rgba(237, 237, 237, 0) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#ededed', GradientType=1);
}

.windowHeaderWhite {
    background-color: #929292;
}

.windowFooterWhite {
    background-color: #929292;
}

.teamworksMemberRed {
    border: solid 2px rgba(255, 255, 255, 0.2);
    background: linear-gradient(135deg, rgba(255, 30, 34, 0.8) 0%, rgba(201, 138, 160, 0.2) 57%, rgba(161, 219, 255, 0) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#99ff1e22', endColorstr='#00a1dbff', GradientType=1);
}

.windowHeaderRed {
    background-color: #c31919;
    background-image: url(../img/header_bg_red.png);
    background-position: center;
    background-repeat: repeat;
    background-size: 24px 24px;
}

.windowFooterRed {
    background-color: #c31919;
}

.teamworksMemberOrange {
    border: solid 2px rgba(255, 255, 255, 0.2);
    background: linear-gradient(135deg, rgba(255, 127, 30, 0.8) 0%, rgba(201, 179, 158, 0.2) 57%, rgba(161, 219, 255, 0) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#99ff7f1e', endColorstr='#00a1dbff', GradientType=1);
}

.windowHeaderOrange {
    background-color: #cf6a12;
    background-image: url(../img/header_bg_orange.png);
    background-position: center;
    background-repeat: repeat;
    background-size: 24px 24px;
}

.windowFooterOrange {
    background-color: #ac6423;
}

.teamworksMemberYellow {
    border: solid 2px rgba(255, 255, 255, 0.2);
    background: linear-gradient(135deg, rgba(236, 255, 30, 0.8) 0%, rgba(193, 234, 158, 0.2) 57%, rgba(161, 219, 255, 0) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#99ecff1e', endColorstr='#00a1dbff', GradientType=1);
}

.windowHeaderYellow {
    background-color: #d3b635;
    background-image: url(../img/header_bg_yellow.png);
    background-position: center;
    background-repeat: repeat;
    background-size: 100px 100px;
}

.windowFooterYellow {
    background-color: #d3b635;
}

.teamworksMemberGreen {
    border: solid 2px rgba(255, 255, 255, 0.2);
    background: linear-gradient(135deg, rgba(71, 255, 30, 0.8) 0%, rgba(122, 234, 158, 0.2) 57%, rgba(161, 219, 255, 0) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#9947ff1e', endColorstr='#00a1dbff', GradientType=1);
}

.windowHeaderGreen {
    background-color: #23ac2a;
    background-image: url(../img/bg_pattern_02.png);
    background-position: center;
    background-repeat: repeat;
    background-size: 220px 220px;
}

.windowFooterGreen {
    background-color: #23ac2a;
}

.teamworksMemberBlue {
    border: solid 2px rgba(255, 255, 255, 0.2);
    background: linear-gradient(135deg, rgba(30, 154, 255, 0.8) 0%, rgba(105, 191, 255, 0.2) 57%, rgba(161, 219, 255, 0) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#991e9aff', endColorstr='#00a1dbff', GradientType=1);
}

.windowHeaderBlue {
    background-color: #128ab6;
    background-image: url(../img/header_bg_lightblue.png);
    background-position: top center;
    background-repeat: repeat;
    background-size: 7px 7px;
}

.windowFooterBlue {
    background-color: #128ab6;
}

.teamworksMemberDarkBlue {
    border: solid 2px rgba(255, 255, 255, 0.2);
    background: linear-gradient(135deg, rgba(30, 71, 255, 0.8) 0%, rgba(105, 155, 255, 0.2) 57%, rgba(161, 219, 255, 0) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#cc1e47ff', endColorstr='#00a1dbff', GradientType=1);
}

.windowHeaderDarkBlue {
    background-color: #2965dd;
    background-image: url(../img/header_bg_blue.png);
    background-position: top center;
    background-repeat: repeat;
    background-size: 10px 10px;
}

.windowFooterDarkBlue {
    background-color: #2965dd;
}

.teamworksMemberPurple {
    border: solid 2px rgba(255, 255, 255, 0.2);
    background: linear-gradient(135deg, rgba(150, 30, 255, 0.8) 0%, rgba(156, 138, 255, 0.2) 57%, rgba(161, 219, 255, 0) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#99961eff', endColorstr='#00a1dbff', GradientType=1);
}

.windowHeaderPurple {
    background-color: #7800ff;
    background-image: url(../img/header_bg_purple.png);
    background-position: center;
    background-repeat: repeat;
}

.windowFooterPurple {
    background-color: #7800ff;
}

.teamworksMemberPink {
    border: solid 2px rgba(255, 255, 255, 0.2);
    background: linear-gradient(135deg, rgba(255, 30, 221, 0.8) 0%, rgba(201, 138, 240, 0.2) 57%, rgba(161, 219, 255, 0) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#99ff1edd', endColorstr='#00a1dbff', GradientType=1);
}

.windowHeaderPink {
    background-color: #bd10b8;
    background-image: url(../img/header_bg_pink.png);
    background-position: center;
    background-repeat: repeat;
    background-size: 100px 100px;
}

.windowFooterPink {
    background-color: #bd10b8;
}

/* //////////////////////////////////////////////// PIC STYLES */

.picstyledefault {
    background-color: #000;
    border-radius: 3px;
}

.picstylerounded1 {
    background-color: #000;
    border-radius: 25%;
}

.picstylerounded2 {
    background-color: #000;
    border-radius: 50%;
}

.picstylerounded3 {
    background-color: #000;
    border-radius: 6% 6% 50% 50%;
}

.picstyleembedded1 {
    background-color: #000;
    border-radius: 6% 30% 6% 30%;
}

.picstyleembedded2 {
    background-color: #000;
    border-radius: 6% 0px 6% 0px;
    clip-path: polygon(0 0, 70% 0%, 100% 30%, 100% 100%, 30% 100%, 0% 70%);
}

.picstylenotched1 {
    background-color: #000;
    clip-path: polygon(0 20%,
            20% 0,
            80% 0,
            100% 20%,
            100% 80%,
            80% 100%,
            20% 100%,
            0% 80%,
            0% 20%)
}

.picstylenotched2 {
    background-color: #000;
    clip-path: polygon(25% 0%, 100% 0%, 75% 100%, 0% 100%);
}

.picstylenotched3 {
    background-color: #000;
    clip-path: polygon(0% 15%, 15% 15%, 15% 0%, 85% 0%, 85% 15%, 100% 15%, 100% 85%, 85% 85%, 85% 100%, 15% 100%, 15% 85%, 0% 85%);
}

.picstylenotched4 {
    background-color: #000;
    clip-path: polygon(50% 0%, 90% 20%, 100% 60%, 75% 100%, 25% 100%, 0% 60%, 10% 20%);
}

.picstylesloped1 {
    background-color: #000;
    border-radius: 3px;
    -webkit-transform: rotate(-6deg);
    -moz-transform: rotate(-6deg);
    -o-transform: rotate(-6deg);
    transform: rotate(-6deg);
}

.picstyletransparent {
    background-color: #000;
    border-radius: 0px;
    border-color: transparent;
    background-color: transparent;
}

.picstyleinvisible {
    background-color: #000;
    opacity: 0;
    border-radius: 0px;
    border-color: transparent;
    background-color: transparent;
}

/* //////////////////////////////////////////////// CARDS BACKGROUND */

.userCardBg {
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

.userCardBg_none {
    backdrop-filter: blur(8px);
}

.userCardBg_spiritofdeath {
    background-color: #0e1b33;
    background-size: 50px 50px;
    background-image: url(../users/themes/card_spiritofdeath.webp);
    background-position: 0px 65px;
    background-repeat: repeat;
}

.userCardBg_paranoid {
    background-image: url(../users/themes/card_paranoid.webp);
}

.userCardBg_veinflow {
    background-image: url(../users/themes/card_veinflow.webp);
}

.userCardBg_cheese {
    background-image: url(../users/themes/card_cheese.webp);
}

.userCardBg_paint {
    background-image: url(../users/themes/card_paint.webp);
}

.userCardBg_streetwall {
    background-image: url(../users/themes/card_streetwall.webp);
}

.userCardBg_map {
    background-image: url(../users/themes/card_map.webp);
}

.userCardBg_nightforest {
    background-image: url(../users/themes/card_nightforest.png);
}

.userCardBg_colorfulsky {
    background-image: url(../users/themes/card_colorfulsky.webp);
}

.userCardBg_sunset {
    background-image: url(../users/themes/card_sunset.webp);
}

.userCardBg_fireworks {
    background-image: url(../users/themes/card_fireworks.webp);
}

.userCardBg_firering {
    background-image: url(../users/themes/card_firering.webp);
}

.userCardBg_furball {
    background-image: url(../users/themes/card_furball.webp);
}

.userCardBg_arcade {
    background-image: url(../users/themes/card_arcade.webp);
}

.userCardBg_workshop {
    background-image: url(../users/themes/card_workshop.webp);
}

.userCardBg_curtain {
    background-image: url(../users/themes/card_curtain.webp);
}

.userCardBg_ancientwall {
    background-image: url(../users/themes/card_ancientwall.webp);
}

.userCardBg_cosmiccrystal {
    background-image: url(../users/themes/card_cosmiccrystal.webp);
}

.userCardBg_infinite {
    background-image: url(../users/themes/card_infinite.webp);
}

.userCardBg_arachnophobia {
    background-image: url(../users/themes/card_arachnophobia.webp);
}

/* //////////////////////////////////////////////// CARDS DECOR */

.userCardDecoImg {
    position: absolute;
    border-radius: 0px;
    pointer-events: none;
    filter: drop-shadow(0px 0px 2px rgba(0, 0, 0, 0.8));
}

/* NONE */
.cardDeco_none {
    height: 0px;
    width: 0px;
    display: none;
}

/* CUTEFOX */
.cardDeco_cutefox {
    right: -3%;
    bottom: -10%;
    height: 50%;
}

/* NETWORK */
.cardDeco_network {
    right: -2%;
    top: -8%;
    height: 60%;
}

/* STARRY */
.cardDeco_starry {
    height: calc(100% + 12px);
    bottom: -6px;
    right: -6px;
}

/* PAW PRINTS */
.cardDeco_pawprints {
    height: calc(100% + 12px);
    bottom: -6px;
    right: -6px;
}

/* BOOKMARK */
.cardDeco_bookmark {
    top: 0px;
    right: 5px;
    height: 122%;
}

/* HEARTS */
.cardDeco_hearts {
    right: -2%;
    top: -8%;
    height: 40%;
}

/* BAROQUE */
.cardDeco_baroque {
    right: -2%;
    top: -8%;
    height: 116%;
}

/* FOXBIT */
.cardDeco_foxbit {
    height: 70%;
    bottom: 0px;
    right: 4px;
}

/* STICKER FOXBIT */
.cardDeco_stickerfoxbitcool,
.cardDeco_stickerfoxbitamazed {
    top: -8%;
    right: -3%;
    height: 116%;
}

/* NEON */
.cardDeco_neon {
    top: -14%;
    right: -3.5%;
    height: 128%;
    animation: rainbowEffectANIM 5s linear infinite;
}

/* COSMIC MEETING */
.cardDeco_cosmicmeeting {
    top: -14%;
    right: -3.5%;
    height: 128%;
}

@keyframes cardNeonANIM {
    0% {
        filter: hue-rotate(0deg);
    }

    100% {
        filter: hue-rotate(360deg);
    }
}

/* WORKSHOP */
.cardDeco_gear1 {
    bottom: -6px;
    right: 6%;
    height: 60%;
    animation: cardDecoGear1ANIM 2s ease-in-out infinite;
}

.cardDeco_gear2 {
    bottom: 36%;
    right: -2%;
    height: 48%;
    animation: cardDecoGear2ANIM 2s ease-in-out infinite;
}

@keyframes cardDecoGear1ANIM {
    0% {
        transform: rotate(0deg);
    }

    10% {
        transform: rotate(0deg);
    }

    40% {
        transform: rotate(30deg);
    }

    60% {
        transform: rotate(30deg);
    }

    90% {
        transform: rotate(60deg);
    }

    100% {
        transform: rotate(60deg);
    }
}

@keyframes cardDecoGear2ANIM {
    0% {
        transform: rotate(0deg);
    }

    10% {
        transform: rotate(0deg);
    }

    40% {
        transform: rotate(-30deg);
    }

    60% {
        transform: rotate(-30deg);
    }

    90% {
        transform: rotate(-60deg);
    }

    100% {
        transform: rotate(-60deg);
    }
}

/* FRAME */
.cardDeco_frame {
    top: -12%;
    right: -4%;
    height: 124%;
}

/* OVEN MONSTER */
.cardDeco_ovenmonster {
    bottom: -15%;
    right: -4%;
    height: 100%;
}

/* INFINITE */
.cardDeco_infinite {
    top: -4%;
    right: -2%;
    height: 108%;
}

/* TEAHOUSE */
.cardDeco_teahouse {
    top: -14%;
    right: -6%;
    height: 128%;
}