@charset "utf-8";
@font-face{font-family: BRT;src: url('BRT-Web-Regular.TTF')}
@font-face{font-family: BRT;src: url('BRT-Web-Medium.TTF');font-weight: bold;}
@font-face{font-family: Iconfont;src: url('BRT-Icons.woff')}
@font-face{font-family: Vocaloid;src: url('Vocaloid.WOFF')}

/* COMMON */
html{-webkit-tap-highlight-color: transparent;scroll-behavior: smooth;}
body{margin: 0 auto;padding: 0;color: var(--c-font);font-family: BRT !important;font-size: 13px;line-height: 1.4;font-weight: normal;background: var(--c-grey-light-alt);overflow-y: overlay;overflow-x: hidden;}
body.noscroll{overflow: hidden;}
*, *::after, *::before{box-sizing: border-box;}
*:focus-visible{outline: none;}
::selection{color: var(--c-white-alt);background: var(--c-grey);}
::-webkit-scrollbar{width: 0;height: 0;}
::-webkit-scrollbar-track{background: transparent;}
::-webkit-scrollbar-thumb{background: transparent;}

/* VARIABLES */
:root {
	--c-primary: #26a69a;
	--c-primary-alt: #4DB6AC;
	--c-primary-light: #E0F2F1;
	--c-primary-dark: #00695C;
	--c-font: #333333;
	--c-font-black: #000000;
	--c-white: #ffffff;
	--c-white-alt: #fafafa;
	--c-white-alpha: #ffffffe6;
	--c-grey: #777777;
	--c-grey-medium: #dddddd;
	--c-grey-medium-alt: #bbbbbb;
	--c-grey-light: #eeeeee;
	--c-grey-light-alt: #f5f5f5;
	--c-purple: #6d4995;
	--c-purple-light: #f1e5ff;
	--c-orange: #EF6C00;
	--c-orange-light: #fff3e0;
	--c-red: #e84e40;
	--c-red-alt: #F44336;
	--c-red-light: #fce2e0;
	--c-facebook: #3b5998;
	--c-facebook-light: #e5ecfb;
	--c-twitter: #0498d1;
	--c-twitter-light: #def5fd;
	--c-discord: #404EED;
	--c-discord-light: #e2e4fd;
	--c-yellow: #f09b18;
	--c-yellow-light: #fff2d0;
	--bsh:
	drop-shadow(0 0.25rem 0.5rem rgba(0,0,0,0.15));
	--bsh-lg:
	drop-shadow(0 0.25rem 0.75rem rgba(0,0,0,0.15));
	--br-xl: 2rem;
	--br-lg: 1rem;
	--br-md: 0.5rem;
	--br-sm: 0.25rem;
	--content: 655px;
	--headerH: 150px;
	--headerHhover: 180px;
	--panel: 350px;
	--panel-m: 2rem;
	--panel-pos:
	var(
	--panel-m);
}

.icon{font-family: "Iconfont";font-size: 1.5rem;line-height: 1;font-style: normal;font-weight: normal !important;}

b{color: var(--c-font-black);}
img, label{position: relative;float: left;}
.b{color: var(--c-font-black);font-weight: bold !important;} 
a{font-weight: bold !important;color: var(--c-primary);text-decoration: none;cursor: pointer;position: relative;/* float: left; */}
.text.-center{text-align: center;}
.text a{color: var(--c-primary);}
img {-moz-user-select: none;-webkit-user-select: none;-ms-user-select: none;user-select: none;}
p{margin: 0 0 1rem 0;text-indent: 1rem;}
.text p:last-child{margin-bottom: 0;}
ul{margin: 0;padding: 0;list-style: none;}
li{position: relative;padding-left: 1rem;}
li:before{content: '';max-width: 0.5rem;min-width: 0.5rem;max-height: 0.5rem;min-height: 0.5rem;position: absolute;top: 0.3rem;bottom: 0;left: 0.125rem;margin: 0;border-radius: 0.25rem;background: var(--c-purple);}
ul > li li:before{background: var(--c-grey);}

#bg, header, .logo, .box, aside, #login_panel, .icons_link div, nav, .menu_bar, #menu_bottom, a, .error, .button, button, textarea, input, select, #theme_box input:empty ~ label, input[type="file"]+label, .pm_read_link .pm_box .pm_preview, .menu_b:after, .menu_b .title, .menu_b img, .bar, .toggler + label, .toggler + label .title, .share, .share_b:after, .-p span, .-vocaloid .img, .dot, #cookie_alert, #cookie_overlay, a.name img, .overlay, .checkbox + label, .checkbox + label:after, .checkbox + label:before, .radio + label, .radio + label:after, .radio + label:before, .-join img{transition: all 0.4s cubic-bezier(0.6, 0, 0, 1);}.-p{transition: none;}

.Tsuki_img{width: 4rem;height: 4rem;margin-right: 0.5rem;border-radius: var(--br-lg);}

.error{width: 100%;height: 0;margin: 0;display: flex;justify-content: center;align-items: center;font-weight: bold !important;color: var(--c-red);opacity: 0;animation: error 0.6s 1s cubic-bezier(0.6, 0, 0, 1) forwards;}
.error div{width: 100%;display: flex;justify-content: center;}
.error div img{height: 10rem;}
.error > span > span {word-break: keep-all;}

.name_result{width: calc(100% - 4rem);position: absolute;top: 0.75rem;left: 2rem;right: 2rem;display: flex;justify-content: center;z-index: 1;}
.reg_error, .user_error{color: var(--c-red);background: #fce2e0;padding: 0.25rem 1rem;border-radius: var(--br-lg);}
.reg_error.ok{color: var(--c-primary-dark) !important;background: var(--c-primary-light) !important;}
.user_change_box{width: 100%;margin-top: 1rem;position: relative;display: flex;justify-content: center;flex-wrap: wrap;}
.user_error{position: absolute;top: -1rem;left: auto;right: auto;padding: 0 !important;z-index: 1;}
.user_error div{padding: 0.25rem 1rem;font-weight: bold;border-radius: var(--br-lg);}

.-success{color: var(--c-primary) !important;}
.-ok{color: var(--c-font) !important;}
.-hide{display: none;}

.error a{float: none;}
@keyframes error{0%{height: 0;margin: 0;opacity: 0;}100%{height: max-content;margin: 1rem 0 0 0;opacity: 1;}}

/* COOKIE */
#cookie_alert{width: min-content;max-width: calc(100% - 4rem);height: max-content;position: fixed;left: 0;right: 0;top: 0;bottom: 0;margin: auto;padding: 2rem;display: flex;justify-content: center;align-items: center;flex-wrap: wrap;background: var(--c-white-alpha);filter: var(--bsh-lg);border-radius: var(--br-xl);z-index: 10;opacity: 0;pointer-events: none;}
#cookie_alert.show, #cookie_overlay.show{opacity: 1;pointer-events: all;}
#cookie_alert .Tsuki_img{width: 8rem;height: 8rem;margin: 0 auto;}
#cookie_alert .text{width: max-content;text-align: center;}
#cookie_overlay{width: 100vw;height: 100vh;position: fixed;top: 0;left: 0;margin: auto;background: rgba(33,33,33,.15);backdrop-filter: blur(0.25rem);z-index: 9;opacity: 0;pointer-events: none;}
#cookie_check{display: none;}

/* INPUT, TEXTAREA */
textarea, input, select{width: 100%;height: auto;min-height: 2.5rem;position: relative;float: left;margin: 1rem 0;padding: 1rem;color: var(--c-font);font-family: BRT !important;font-size: inherit;line-height: inherit;background: var(--c-grey-light) !important;border-radius: var(--br-lg);border: none;outline: none;resize: none;}
input{text-align: center;padding: 0.5rem 1rem;}
textarea:focus, input[type="text"]:focus, input[type="password"]:focus, select:focus{background: var(--c-grey-light-alt) !important;}
main textarea{}
main .box input{width: 50%;margin: 0 25% 1rem;}
main .box input:last-child{margin-bottom: 0 !important;}

/* CHECKBOX, RADIO, FILE */
.checkbox + label, input[type="file"]+label{width: auto;min-height: 1.5rem;padding: 0.5rem 1rem;position: relative;display: flex;justify-content: center;align-items: center;font-weight: bold;color: var(--c-font);background: var(--c-grey-light);border-radius: var(--br-lg);cursor: pointer;}
.checkbox:checked + label{color: var(--c-primary-dark);background: var(--c-primary-light);}
.checkbox + label:before{content: '';width: 2rem;height: 1rem;margin-right: 1rem;background: var(--c-white);border-radius: var(--br-lg);}
.checkbox + label:after{content: '';width: 0.5rem;height: 0.5rem;position: absolute;top: calc(50% - 0.25rem);left: 1.25rem;background: #777777;border-radius: 0.25rem;}
.checkbox:checked + label:before{background: var(--c-primary);}
.checkbox:checked + label:after{width: 0.5rem;left: 2.2rem;background: var(--c-white-alt);}

.radio + label {width: auto;height: 2.5rem;padding: 0 1rem 0 0.5rem;position: relative;display: flex;justify-content: center;align-items: center;font-weight: bold;color: var(--c-font);background: var(--c-grey-light);border-radius: var(--br-lg);cursor: pointer;}
.radio + label:before {content: '';width: 1.25rem;height: 1.25rem;margin-right: 0.5rem;background: var(--c-white);border-radius: var(--br-lg);}
.radio + label:after {content: '';width: 0.5rem;height: 0.5rem;position: absolute;top: calc(50% - 0.25rem);left: 0.875rem;background: var(--c-grey);border-radius: 50%;}
.radio:checked + label:before {background: var(--c-primary);}
.radio:checked + label:after {width: 0.75rem;height: 0.75rem;top: calc(50% - (0.75rem / 2));left: 0.75rem;background: var(--c-white-alt);}

input[type=file]{display: none;}
input[type=file]+label{width: 50%;margin: 0 0 1rem 0;line-height: 1.5rem;text-overflow: ellipsis;white-space: nowrap;display: inline-block;overflow: hidden;}

/* BUTTON */
.button{width: max-content;height: 2.5rem;display: flex;justify-content: space-between;align-items: center;margin: 1rem 0 0;padding: 0 1rem;color: var(--c-white-alt);font-family: inherit;font-size: inherit;font-weight: bold;line-height: 2.5rem;background: var(--c-primary);border-radius: var(--br-lg);border: none;outline: none;cursor: pointer;}
.button:not(.-not):hover{background: var(--c-primary-alt);text-decoration: none !important;}
.-big{width: 100%;justify-content: center;}
.-m0{margin: 0 !important;}
.-mt0{margin-top: 0 !important;}
.-mb0{margin-bottom: 0 !important;}
.-ml0{margin-left: 0 !important;}
.-mr0{margin-right: 0 !important;}
.-mt{margin-top: 1rem !important;}
.-mb{margin-bottom: 1rem !important;}
.-ml{margin-left: 1rem !important;}
.-mr{margin-right: 1rem !important;}
.-p0{padding: 0 !important;}
.-pt0{padding-top: 0 !important;}
.-pb0{padding-bottom: 0 !important;}
.-pl0{padding-left: 0 !important;}
.-pr0{padding-right: 0 !important;}
.-pt{padding-top: 1rem !important;}
.-pb{padding-bottom: 1rem !important;}
.-pl{padding-left: 1rem !important;}
.-pr{padding-right: 1rem !important;}
.-alt{color: var(--c-font);background: var(--c-grey-light) !important;}
.-red{color: var(--c-white-alt);background: var(--c-red);}
.-red.-light{color: var(--c-red) !important;background: var(--c-red-light) !important;}
.-green{color: var(--c-primary-dark) !important;background: var(--c-primary-light) !important;}
.-purple{color: var(--c-purple) !important;background: var(--c-purple-light) !important;}
.-orange{color: var(--c-orange) !important;background: var(--c-orange-light) !important;}
.-grey{color: var(--c-font) !important;background: var(--c-grey-light) !important;}
.-yellow{color: var(--c-yellow) !important;background: var(--c-yellow-light) !important;}
.-facebook{color: var(--c-facebook) !important;background: var(--c-facebook-light) !important;}
.-twitter{color: var(--c-twitter) !important;background: var(--c-twitter-light) !important;}
.-discord{color: var(--c-discord) !important;background: var(--c-discord-light) !important;}
.button:before, .button:after, .bar:before, .bar:after{font-family: "Iconfont";font-size: 1.5rem;font-style: normal;font-weight: normal !important;margin: 0 0 0 0.5rem;}
.-add:after{content: 'add';}
.-archive:after{content: 'archive';}
.-change:after{content: 'change';}
.-delete:after{content: 'delete';}
.-download:after{content: 'download';}
.-enter:after{content: 'enter';}
.-info:before{content: 'info';margin: 0 0.5rem 0 0;}.-info:after{content: '';display: none;}
.-jump_back:before{content: 'jump_back';margin: 0 0.5rem 0 0;}.-jump_back:after{content: '';display: none;}
.-jump_to:after{content: 'jump_to' !important;}
.-left:before{content: 'left';margin: 0 0.5rem 0 -0.5rem;}.-left:after{content: '';display: none;}
.-play:after{content: 'play';}
.-right:after{content: 'right';margin: 0 -0.5rem 0 0.5rem;}
.-share:after{content: 'share';}
.-facebook-icon:after{content: 'facebook';}
.-twitter-icon:after{content: 'twitter';}
.-send:after{content: 'send';}
.-theme:after{content: 'theme';}
.-upload:after{content: 'upload';}
.-video:after{content: 'video';}
.-sub:after{content: 'sub';}
.-online:after{content: 'online';}
.-p span.-project:after{content: 'project';}
.-cookie:after{content: 'cookie';}
.-rss:after{content: 'rss';}
.-music:after{content: 'music';}
.-link:after{content: 'link';}
.-email:after{content: 'email';}
.-login:after{content: 'login';}
.-date:after{content: 'calendar';}
.-star:after{content: 'star';}
.-warning{pointer-events: none;}
.-warning:before{content: 'warning';margin: 0 0.5rem 0 0;}.-warning:after{content: '';display: none;}
.-write:before{content: 'write';margin: 0 0.5rem 0 0;}.-write:after{content: '';display: none;}
.-fdsh0{filter: none !important;}
.-cursor{pointer-events: none;}

.-p{width: 5rem;height: 6.5rem;padding: 0;color: var(--c-primary);flex-direction: column;background: none !important;border-radius: 0;cursor: default;}
a.-p{cursor: pointer;}
.-p span{width: 100%;text-align: center;}

.-p span:first-child{height: 100%;margin: 0 0 0.5rem;padding: 0;display: flex;justify-content: center;align-items: center;font-family: Iconfont;font-size: 2.5rem;font-weight: normal !important;color:var(--c-primary);background:var(--c-primary-light);border-radius:var(--br-lg);z-index: 1;}
.-p span:last-child{line-height: 1rem;}
.-p.-big{width: calc((40rem - 4rem) / 3 - 1rem) !important;}
.-p.-big span:first-child{}
.-p.-not span:first-child{color: var(--c-grey);background: var(--c-grey-light);}
.-p.-red.-light{background: none !important;}
.-p.-red.-light span:first-child{color: var(--c-red) !important;background: var(--c-red-light) !important;}
.-p.-facebook span:first-child{color: var(--c-facebook) !important;background: var(--c-facebook-light) !important;}
.-p.-twitter span:first-child{color: var(--c-twitter) !important;background: var(--c-twitter-light) !important;}
.-p.-purple span:first-child{color: var(--c-purple) !important;background: var(--c-purple-light) !important;}
.-p.-orange span:first-child{color: var(--c-orange) !important;background: var(--c-orange-light) !important;}
.-p.-grey span:first-child{color: var(--c-font) !important;background: var(--c-grey-light) !important;}
.-p.-light_novel, .-p.-visual_novel, .-p.-volume, .-p.-chapter, .-p.-episode, .-p.-comments{color: var(--c-font) !important;}
.-p.-date, .-p.-light_novel, .-p.-visual_novel, .-p.-volume, .-p.-chapter, .-p.-episode{cursor: default;pointer-events: none;}
.-p.-date span:first-child, .-p.-light_novel span:first-child, .-p.-visual_novel span:first-child, .-p.-data span:first-child, .-p.-volume span:first-child, .-p.-chapter span:first-child, .-p.-episode span:first-child, .-p.-comments span:first-child{color: var(--c-font) !important;background: var(--c-grey-light) !important;}
.-p.-data span:first-child{font-family: BRT !important;font-weight: bold !important;font-size: 1rem;}
.-p.-data:not(:hover) span:last-child{color: var(--c-font);}
.-p.-light_novel span:first-child{content: "light";}
.-p.-visual_novel span:first-child{content: "visual";}
.-p.-purple span:first-child{color: var(--c-purple) !important;background: var(--c-purple-light) !important;}
.-p.-yellow span:first-child{color: var(--c-yellow) !important;background: var(--c-yellow-light) !important;}
.-p.-info span:first-child{content: 'info' !important;display: block;}
.-p.-info:before{content: '';display: none;}
.-p.-warning span:first-child{content: 'warning' !important;display: block;}
.-p.-warning:before{content: '';display: none;}

.-p:not(.-not) span span:first-child{content:'';width: 0;height: 0.5rem;position: absolute;bottom: 0.25rem;left: 0;right: 0;margin: auto;background: var(--c-primary-dark);border-radius: var(--br-sm);display: block;display: none;}
.-p:not(.-not):hover{color: var(--c-primary-dark) !important;background: none !important;}
.-p:not(.-not):hover span:first-child{color: var(--c-primary-dark) !important;background: var(--c-primary-light) !important;}

/* INFO BAR */
.bar{width: auto;height: auto;min-height: 2.5rem;margin: 1rem 0 0 0;padding: 0.5rem 1rem !important;display: flex;justify-content: center;align-items: center;font-weight: bold;color: var(--c-font);text-align: center;background: var(--c-grey-light);border-radius: var(--br-lg);}
.bar.-big{width: calc(100% - 2rem) !important;}
a.bar{cursor: pointer !important;}
.bar img, .bar .icon{width: 2rem;height: 2rem;margin: 0 0 0 1rem;border-radius: var(--br-md);}
.bar .title{width: 100%;line-height: 2rem;}
.bar.-person{width: 100% !important;margin: 1rem 0 0 !important;padding: 0 !important;justify-content: flex-start;flex-wrap: wrap;}
.bar.-person .title{margin-bottom: 0;text-align: left;}
.bar.-person .avatar{margin: 0 0 0 1rem;}
.bar.-name{width: auto !important;margin: 0.5rem 0.5rem 0 0 !important;background: var(--c-white);border-radius: var(--br-lg);cursor: default;}
.bar.-name img{margin: 0 0 0 0.5rem !important;border-radius: var(--br-lg);}
#projects a.bar{color: var(--c-primary);}
#projects a.bar.-name{color: var(--c-font) !important;}
#projects .box .bar{width: 100%;margin: 1rem 0 0;}
.bar.-job{margin: 0.5rem 0.25rem 0;}
#pm_box .bar{display: none;}

.-not{color: var(--c-grey);background: var(--c-grey-light);cursor: default;}
.-not:after{content: 'block';color: var(--c-grey);}

/* OTHER NOT */
.button.-send.-not, .button.-change.-not, .button.-upload.-not{pointer-events: none;}
.button.-send.-not:after{content: 'send' !important;}
.button.-change.-not:after{content: 'change' !important;}
.button.-upload.-not:after{content: 'upload' !important;}

/* FLEX */
.flex{width: 100%;display: flex;justify-content: center;flex-wrap: wrap;}
.-start{justify-content: flex-start !important;}
.-end{justify-content: flex-end !important;}
.-between{justify-content: space-between !important;}
.-center{justify-content: center !important;}
.-nowrap{flex-wrap: nowrap !important;}
.-acenter{align-items: center;}
.flex.-small{width: 80%;margin: 0 10%;}
.flex.-small.-links{margin-bottom: 1rem;}
.flex.links{margin: 1rem 0 0;justify-content: space-between;}
.-minus{width: calc(100% + 1rem);margin: 0 -0.5rem;}
/* .flex.-links .button{width: calc(50% - 2.5rem);margin: 1rem 0 0 0;} */

.txt-left{text-align: left !important;}
.txt-right{text-align: right !important;}
.txt-center{text-align: center !important;}
.txt-justify{text-align: justify !important;}

/* CSIKI-CSUKI (CHECKBOXOS) */
.toggler{display: none;}
.toggler + label{width: 100%;height: 3rem;margin-top: 1rem;padding: 0.5rem 1rem 0rem;background: var(--c-grey-light);box-shadow: var(--bsh-txt);border-radius: var(--br-lg);overflow: hidden;}
.toggler + label .icon{position: absolute;top: 0.75rem;right: 1rem;transform: rotate(-90deg);pointer-events: none;}
.toggler + label .title{width: 100%;font-size: 125%;text-align: center;font-weight: bold;line-height: 2rem;}
.toggler + label > .title{cursor: pointer;margin: 0 0 0.5rem;}
.toggler + label > * > .title{line-height: 1.4;}
.toggler + label > div:nth-child(2){margin-top: 0 !important;}
.toggler:checked + label{height: auto;padding: 0.5rem 1rem 1rem;box-shadow: var(--bsh-txt-focus);}
.toggler:checked + label .icon{transform: rotate(90deg);}
.toggler:checked + label .title{margin: 0 0 1rem;}

.mainlink {
	width: 100%;
}

.mainlink:after{
	content: '';
	width: calc(100% + 4rem);
	height: calc(100% + 4rem);
	position: absolute;
	top: -2rem;
	left: -2rem;
	right: 0;
	bottom: 0;
	pointer-events: auto;
	z-index: 1;
	width: calc(100% + 4rem);
}

/* MAIN, BACKGROUND */
#container{width: 100%;height: auto;margin: 0;}
#bg{background-image: url('../images/bg.jpg');width: calc(100% + 1rem);height: calc(100% + 1rem);margin: -0.5rem;background-size: cover;position: fixed;top: 0;bottom: 0;left: 0;right: 0;background-position: center;background-repeat: no-repeat;z-index: -1;filter: blur(0.25rem);}
@-moz-document url-prefix(){#container.blur{filter: blur(0.25rem);}}

/* MENU */
nav{width: max-content;height: 4.5rem;position: fixed;bottom: 0;left: 0;right: 0;display: flex;align-items: center;justify-content: center;margin: 0 auto 1rem;padding: 1rem 0.5rem;background: var(--c-white);box-shadow: 0 0.25rem 0.5rem rgba(0,0,0,0.15);border-radius: var(--br-xl);z-index: 4;}
.bottom_img{width: 2rem;height: 2rem;padding: 1.5rem 1rem;z-index: 2;}

#menu_b, #menu_check{display: none !important;z-index: 2;-moz-user-select: none;-webkit-user-select: none;-ms-user-select: none;user-select: none;}
#menu_b{width: 1.5rem;margin: 0 -0.25rem 0 -0.5rem;order: 12;}
#menu_b:after{content: 'more';width: 2rem;height: 2rem;margin: auto;position: relative;bottom: 0;font-family: 'Iconfont';color: var(--c-grey);font-size: 2rem;line-height: 1;transform: rotate(90deg);}
#menu_b.change:after{color: var(--c-primary)}

.menu_b{width: 3.5rem;height: 3rem;color: var(--c-font);font-weight: bold !important;display: flex;justify-content: center;align-items: center;border-radius: var(--br-lg);box-shadow: none;cursor: pointer;z-index: 2;-moz-user-select: none;-webkit-user-select: none;-ms-user-select: none;user-select: none;position: relative;}
.menu_b .title{width: max-content;height: 2rem;line-height: 2rem;position: absolute;top: -2.25rem;padding: 0 1rem;background: var(--c-white);border-radius: var(--br-lg);filter: var(--bsh-lg);transform:scale(0.9);opacity: 0;visibility: hidden;}

.menu_b .title.red{}

.menu_b img, #menu_b img{width: 2rem;height: 2rem;}
.menu_b:after{content: '';width: calc(100% - 3rem);height: 0.25rem;margin: 0 1.5rem;background: transparent;position: absolute;bottom: 0;left: 0;border-radius: 0.25rem;}
.menu_b.-active:after{width: calc(100% - 2.5rem);margin: 0 1.25rem;background: var(--c-primary);}

#goodies_check:checked ~ #goodies_b, #wall_check:checked ~ #wall_b, #login_check:checked ~ #login_b{background: none;}
#goodies_check ~ #goodies_b:after, #wall_check ~ #wall_b:after, #login_check ~ #login_b:after,  #profile_check ~ #p_menu_b:after{width: calc(100% - 3rem);margin: 0 1.5rem;background: var(--c-grey);}
#goodies_check:checked ~ #goodies_b:after, #wall_check:checked ~ #wall_b:after, #login_check:checked ~ #login_b:after,  #profile_check:checked ~ #p_menu_b:after{width: calc(100% - 2.5rem);margin: 0 1.25rem;background: var(--c-primary);}

#login_panel{width: 50%;display: flex;justify-content: flex-end;align-items: center;position: absolute;left: 0;right: 0;bottom: 0;margin: 0 auto 5.5rem;transform: scale(0.95);transform-origin: bottom right;opacity: 0;visibility: hidden;pointer-events: none;}
#login_panel .box{padding: 1rem;background: var(--c-white);}
#login_panel #f_pass_reg_b{min-width: max-content;}
#login_check:checked ~ #login_panel{transform: scale(1);opacity: 1;visibility: visible;pointer-events: all;z-index: 4;}
.overlay{position: fixed;top:0;bottom: 0;left:0;right:0;background: rgba(33,33,33,.15);backdrop-filter: blur(0.25rem);pointer-events: none;opacity: 0;}
#login_check:checked ~ .overlay{pointer-events: all;opacity:1;z-index: 3;}

#profile_check:checked ~ #profile_menu{opacity: 1;visibility: visible;transform: scale(1);}
#profile_menu{width: max-content;height: 4rem;position: absolute;bottom: 5rem;left: 0;margin: 0;padding: 0.5rem;display: flex;align-items: center;background: var(--c-white);filter: var(--bsh);border-radius: var(--br-xl);opacity: 0;visibility: hidden;transform: scale(0.9);transition: all 0.3s cubic-bezier(0.4, -0.1, 0.6, 1.8);z-index: 3;}
#profile_menu{left: unset;right: 0;}
#profile_menu .menu_b .title{top: -2rem;}
#profile_check:checked{order: 12;}
#profile_check:checked ~ .overlay{pointer-events: all;opacity: 1;z-index: 2;order: 11;}

.menu_b.-inactive{opacity: 0.5 !important;pointer-events: none !important;}
.menu_b.-inactive:after, .menu_b.-inactive .title{display: none !important;}

.menu_bar{width: 100%;height: 4.5rem;margin: 1rem 0 0;padding: 1rem 0.5rem;display: flex;align-items: center;justify-content: center;background: var(--c-white);filter: var(--bsh);border-radius: var(--br-xl);z-index: 2;position: sticky;top: 1rem;}
.menu_bar .title{top: unset;bottom: -2.5rem;}

#menu_mobile{display: flex;}

#profil_b{z-index: 3;}
#messages_b{z-index: 2;}
@keyframes pulse{0%{transform: scale(1,1);}40%{transform: scale(1.1);}60%{transform: scale(1,1);}100%{transform: scale(1,1);}}

.avatar{width: 3rem;height: 3rem;margin-right: 1rem;border-radius: var(--br-lg);}
#profil_img{margin: 0 45% 1rem 45%;}

/* FORGOTTEN PASSWORD, REGISTRATION */
#registration .text{text-align: center;}
#forgotten_password, #reg_info{text-align: center;}

/* HEADER */
header{width: var(--content);height: var(--headerH);margin: 1rem calc((100vw - var(--content)) / 2) 0;padding: 0;background: var(--c-white-alpha);filter: var(--bsh);border-radius: var(--br-xl);overflow: hidden;z-index: 1;}
.logo{width: 50%;height: var(--headerHhover);margin: 0 25%;padding: 0;}
.logo img{width: 100%;height: 100%;}
#banner, .banner{width: 100%;height: auto;position: absolute;float: left;margin-top: 0;display: flex;justify-content: center;overflow: hidden;opacity: 0;}
#banner img, .banner img{width: 100%;height: 100%;}

/* CONTENT */
header, main, article, h1{position: relative;float: left;}
main{width: var(--content);margin: 0 calc((100vw - var(--content)) / 2) 6.5rem;z-index: 1;}
h1.hide{display: none;}
h1, h2, .h2{width: 100%;min-height: 2rem;margin: 0;font-size: 150%;line-height: 1.4;text-align: center;font-weight: bold;display: flex;align-items: center;justify-content: center;border-radius: var(--br-lg);}
.h2{color: var(--c-primary) !important;}

iframe{width: calc(var(--content) - 4rem);height: calc((var(--content) - 4rem) * 0.5625);border-radius: var(--br-lg);}
.content_icon{width: 4rem;height: 4rem;margin: 0 calc(50% - 2rem) 0.5rem;border-radius: var(--br-lg);}
.box{width: 100%;height: auto;margin: 1rem 0 0;padding: 2rem;text-align: justify;background: var(--c-white-alpha);filter:var(--bsh);border-radius:var(--br-xl);display: flex;justify-content: flex-start;align-items: flex-start;flex-direction: column;}
.-page{padding: 0 0.5rem;flex-direction: row;}
.-page .button{margin: 1rem 0.5rem;}
.-page .button span.m{display: none;}
.-page .button.-left{margin-right: auto;}
.-page .button.-right{margin-left: auto;}

.sending_box{width: 100%;position: relative;}
textarea.-sending{height: 4.5rem;margin: 0 0 1rem;padding: 1rem 4rem 1rem 1rem !important;}
.sending_box button.-send{width: 2rem;margin: 0;padding: 0;position: absolute;top: 1rem;right: 1rem;color: var(--c-primary);background: none !important;}
.sending_box button.-send:after{margin: 0 !important;font-size: 2rem;transition: all 0.4s cubic-bezier(0.6, 0, 0, 1);}
.sending_box button.-send:hover:after{color: var(--c-primary-alt);}
.sending_box button.-send.-not{pointer-events: none;}
.sending_box button.-send.-not:after{color: var(--c-grey);}

#messages{width: 100%;display: flex;justify-content: center;align-items: flex-start;flex-direction: column;}

/* POSTS */
#posts{width: 100%;}
.-post h2, .-post .h2{padding: 0.5rem 0;}

.fixed_title{width: 100%;margin: 0 0 1rem 0;color: var(--c-red);text-align: center;font-weight: bold;}
.-title:focus-visible, input.-title:focus-visible{background: transparent !important;}
.-title:not(a){color: var(--c-font);cursor: auto;}
.-title:not(a):hover{background: transparent !important;}
.-title.-cursor{color: var(--c-font) !important;}

.-p.-comments:after{font-size: 125% !important;}

#hozzaszolasok[admin="false"] > *.admin{display: none;}

#hozzaszolasok[admin="true"] > *.admin{display: block;}
#hozzaszolasok[admin="true"] > *.comment{display: none;}

.comments{width: 100%;margin: 0;display: flex;justify-content: flex-start;align-items: flex-start;flex-direction: column;}
.comments .box{margin: 1rem 0 0;}

.name{width: 100%;height: auto;margin: 0;display: flex;align-items: center;font-weight: bold;word-break: break-word;}
.name:not(a){color: var(--c-font-black);}
.admin_1{color: var(--c-twitter) !important;}
.admin_2, .red{color: var(--c-red) !important;}
a.name:hover{color: var(--c-primary-dark) !important;background: var(--c-primary-light);border-radius: var(--br-lg);}
a.name:hover img{transform: scale(0.8333);margin-right: 0.75rem;}

.spoiler{color: var(--c-grey);background: var(--c-grey);}
.spoiler:hover{color: var(--c-font);background: var(--c-grey-light);}

.img{width: 100%;margin: 0 0 1rem;padding-bottom: 56.25%;background: var(--c-grey-light);border-radius: var(--br-lg);overflow: hidden;position: relative;}
.img img{width: 100%;/* height: 100%; */position: absolute;top: 0;bottom: 0;left: 0;right: 0;margin: auto;border-radius: var(--br-lg);}

.text{width: 100%;max-width: 100%;height: auto;margin: 1rem 0 0 0;padding: 0;word-break: break-word;}
.text a{float: none;}.text a:hover{text-decoration: underline;}
.post_link{width: 100%;margin-top: 1rem;text-align: right;}

form.box{position: relative;float: left;text-align: center;z-index: 1;}

.attachment{width: 50%;margin: 0 50% 1rem 0;border-radius: var(--br-lg);}

/* PROJECTS */
#projects{display: flex;justify-content: space-between;align-items: flex-start;flex-wrap: wrap;}
.con_menu{padding: 0;justify-content: center;align-items: center;display: flex;}	
#status_a, #status_n, #status_not{display: none;}
#status_a.-active, #status_n.-active{display: flex;}

#projects .toggler.-project + label{background: var(--c-grey-light);}
#projects .toggler.-project + label .text{color: var(--c-font);}


.-project.-list{width: calc(50% - 0.5rem);height: unset;margin: 1rem 0 0;flex: 0 0 auto;}
.-project.-list:hover{filter:var(--bsh-lg);}
.-project.-list .info .bar{height: 2.5rem;line-height: 1.5rem;text-overflow: ellipsis;white-space: nowrap;overflow: hidden;display: block;}
.-project.-list .content{width: 100%;padding-bottom: 11rem;display: flex;justify-content: flex-start;align-items: flex-start;flex-wrap: wrap;position: relative;}
.-project.-list .top{width: 100%;position: relative;}
.-project.-list .top h2{width: calc(100% - 2rem);margin: 0 auto;padding: 0.5rem 1rem;position: absolute;bottom: 1rem;left: 0;right: 0;color: var(--c-font) !important;background: var(--c-white-alpha) !important;border-radius: var(--br-md);backdrop-filter: blur(0.25rem);}
.-project.-list .img{width: 100%;padding-bottom: 141.606%;}
.-project.-list .info{width: 100%;margin: 0;display: flex;justify-content: center;align-items: center;flex-direction: column;position: absolute;left: 0;right: 0;bottom: 0;}

.-project .-links{margin-bottom: 0;}
.episode{font-size: 125%;line-height: 3;}

.-project h2{margin: 0.5rem 0 0;}
.-project .content{width: 100%;display: flex;justify-content: flex-start;align-items: flex-start;flex-wrap: wrap;}
.-project .img{width: 33.34%;padding-bottom: 45.76%;margin: 0;}
.-project .info{width: calc(100% - 33.34% - 2rem);margin: 0 0 0 2rem;display: flex;justify-content: center;align-items: center;flex-direction: column;flex-grow: 1;}
.-project .bar{width: 100%;}
.-project:not(.-list) .links{margin: 1rem 0 0;}

.links{width: 100%;display: flex;justify-content: space-between;align-items: center;flex-wrap: wrap;}

#projects .search{width: auto;margin: 0 0.5rem 0 1rem;padding: 0;display: flex;justify-content: center;align-items: center;flex-grow: 1;position: relative;}
#projects .search_input{width: auto;margin: 0;flex-grow: 1;}
#projects .search .button:after{margin: 0;}
#projects .result{width: 100%;max-height: 11rem;margin: 0;padding: 1rem;position: absolute;left: 0;top: 4rem;background: var(--c-white);border-radius: var(--br-xl);overflow: hidden;}
#projects .result .content{width: 100%;max-height: 9rem;overflow-y: scroll;}
#projects .result .content > .bar{width: calc(100% - 0.5rem) !important;margin: 0 0 0.5rem;padding: 0.5rem !important;cursor: pointer;}
#projects .result .content > .bar:last-child{margin: 0;}
#projects .result .content > .bar:hover{color: var(--c-primary-dark) !important;background: var(--c-primary-light) !important;}
#projects .result .content::-webkit-scrollbar{width: 0.25rem;height: auto;}
#projects .result .content::-webkit-scrollbar-thumb{background: var(--c-purple);border-radius: 0.25rem;}
#projects .result .content::-webkit-scrollbar-track{background: var(--c-purple-light);border-radius: 0.25rem;}

#online{margin: 1rem 0 0 0 !important;}
#online > a{width: 80%;margin: 0 10%;cursor: pointer !important;}
#online a:hover .bar{color: var(--c-primary-dark) !important;background: var(--c-primary-light) !important;}
#online .bar{margin: 0 !important;padding-top: 1rem !important;}
#online .-title{cursor: pointer;}
#online .toggler + label .video_box{display: none;}
#online .toggler:checked + label .video_box{display: block;}
.video_box{width: 100%;height: 0 !important;margin-top: 1rem;padding-bottom: 56.3% !important;border-radius: var(--br-lg);overflow: hidden;position: relative;}
.video_box iframe{width: 100%;height: 100%;position: absolute;top: 0;left: 0;}

.link_comment{margin: 0 0 1rem 0;text-align: center;}		
/* TEAM */
#team_box{padding-top: 2rem !important;transition: all 0.6s cubic-bezier(0.6, 0, 0, 1) 0.6s;}
#team_img{width: 50%;margin: -10% -10% 0 0;position: absolute;top: 0;right: 0;filter: var(--bsh);z-index: 1;}
.box.-team .text{width: 100% !important;margin: 1rem 0 0 !important;}
.box.-team .flex .bar{width: 100%;}
.-active, .-inactive{float: left;}
.toggler.-team + label, .toggler.-team:checked + label {background: var(--c-grey-light);}
.toggler.-team + label .-person{background: transparent;}
.toggler.-team + label .-job{background: var(--c-white) !important;}

/* PANEL */
#wall_check, #login_check, #goodies_check, #profile_check{display: none !important;}
#wall_b, #login_box_b, #goodies_b{cursor: pointer;z-index: 2;}
#wall_title, #login_title, #goodies_title{margin: 0 1.5rem;}

aside{width: var(--panel);height: 100%;margin: 0;position: fixed;top: 0;overflow-y: scroll;transform: scale(0.95);opacity: 0;visibility: hidden;pointer-events: none;z-index: 3;scrollbar-color: transparent transparent;}
aside.left{left: var(--panel-pos);}
aside.right{right: var(--panel-pos);}
aside .box{width: 100%;padding: 1rem;}
.panel_img{width: auto;height: calc(var(--headerH) + 2rem);filter: var(--bsh);z-index: 1;pointer-events: none;}

	
	.panel_box{width: 100%;height: auto;padding: 0 1rem 1rem;display: flex;flex-wrap: wrap;justify-content: center;align-items: flex-start;}
	#goodies_panel .panel_box, #wall_panel .panel_box{padding-bottom: 6rem;}
			
	#f_pass_reg_b:hover{text-decoration: underline;}

	#goodies_panel.show, #wall_panel.show{transform: scale(1);opacity: 1;visibility: visible;pointer-events: all;}
	
	/* MESSAGE WALL */
	#wall_img{margin: 2rem -6rem -2rem 0;z-index: 2;}
	#A2{margin: 1rem 0 -1rem;z-index: 2;}
	#bb_code_box{display: none;}
	
	.panel_box .box{/* margin: 0 0 1rem 0; */}
	
	.msg_user{width: 100%;display: flex;align-items: center;margin: 0 0 0.5rem 0;}
	
	.date{margin: 1rem 0 0 auto;float: right;font-weight: bold;color: var(--c-purple);}
	
	a.link_solid.box{width: 92%;}
	a.link_solid.box:hover{text-decoration: underline;}
	
	#wall_archive .page{margin-top: 0;}


/* LEFT PANEL */
	#goodies_img{margin: 4rem 3rem -4rem 0;}
	[id='2B']{margin: 1rem 0 -1rem;}
	#goodies_panel > .box {line-height: 1.5vw;}
	#goodies_panel a{float: none;}
	#goodies_panel .text{margin: 1rem 0 0 0;line-height: 2rem;text-align: center;}

	/* JOIN */
	.-join{height: auto;padding: 0;font-size: 150%;background: none !important;animation: pulzus 1s infinite alternate ease-out;}
	@keyframes pulzus{0%{transform: scale(1);}10%{transform: scale(0.95);}20%{transform: scale(1);}100%{transform: scale(1);}}
	.-join img{width: 5rem !important;height: 4rem;margin: 0.25rem 1rem 0.25rem 0;}
	.-join:hover{color: var(--c-primary-dark) !important;background: none !important;}

	/* 	THEME SWITCH */
	#theme_box{width: 100%;margin: 0.5rem 0 0;padding-top: 1rem;position: relative;float: left;display: flex;justify-content: space-between;flex-wrap: wrap;}
	#theme_box .radio + label{min-width: calc(50% - 0.25rem);margin: 0 0 0.5rem;justify-content: flex-start;}
	#theme_box input:empty{display: none;}
	#theme_box input:empty ~ label{-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;margin: 0;}

	/* VOCALOID */
	#v_img{width: 40%;position: absolute;top: 0;right: 0;margin: -7rem 1rem 0 0;filter: var(--bsh);z-index: 1;}
	.-vocafont{font-family: Vocaloid !important;font-weight: bold;letter-spacing: 0.15rem;}
	.-vocaloid{overflow: hidden;z-index: 0;}
	.-vocaloid .img{width: 100%;padding-bottom: 100%;margin: 0 0 1rem;}
	.player{position: relative;}
	.player .-music:after{z-index: 1;}
	.progress_box{width: 5rem;height: 5rem;position: absolute;left: 0;top: 0;margin: 1rem 0 0;padding: 0;border-radius: var(--br-lg);overflow: hidden;z-index: 1;pointer-events: none;}
	.controls{width: 100%;height: 100%;position: absolute;left: 0;top: 0;margin: 0 !important;display: flex;background: none;box-shadow: none;z-index: 1;cursor: pointer;}
	.progress{width: auto;height: 100%;margin: 0;padding: 0;position: absolute;left: 0;top: 0;background: var(--c-primary);cursor: pointer;z-index: 0;}
	.controls:hover, .progress, .progress:hover{box-shadow: none;}
	.progress{background-color: var(--c-primary);}

	
	/* STATUS */
	#statuses .box{text-align: left;}
	.status{position: relative;padding-left: 0.75rem;}
	.status .title{width: 100%;margin-bottom: 0.25rem;}
	.status .title:hover{color: var(--c-primary-alt);}
	.status:before{content: '';width: 0.25rem;height: 100%;border-radius: var(--br-sm);background: var(--c-grey-light);display: block;position: absolute;top: 0;left: 0;}
	.todo{width: max-content;font-weight: bold;display: none;}
	.status_date{margin: 0 0 0.125rem;color: var(--c-red);font-weight: bold;}
	.status_date:last-child{margin: 0;}
	.todo.-working{display: block;}

	/* LAST COMMENTS, REALESES STATUS */
	#last_comments a{width: 100%;height: auto;margin-top: 0.5rem;padding: 0.5rem;display: flex;align-items: center;float: left;text-align: left;border-radius: var(--br-lg) !important;}
	#last_comments a img{width: 2rem;height: 2rem;margin-right: 0.5rem;}
	#last_comments a:hover{color: var(--c-primary-dark) !important;background: var(--c-primary-light) !important;}

/* UNLIMITED RULEBOOK */
#the_rules img{width: 30%;margin: -5rem 0 0 0;position: absolute;top: 0;right: 0;filter: var(--bsh);z-index: 1;}
#the_rules .title:hover{text-decoration: none;}
#the_rules .box{text-align: center;}
#the_rules .box a{float: none !important;}
#the_rules .box a:hover{color: var(--c-primary-alt);}
#the_rules .bar{width: 100%;line-height: 1.5rem;font-weight: normal;text-align: left;display: block;}

/* PROFIL */
#profile{display: flex;flex-wrap: wrap;}
.-profile{width: 100%;/* margin: 1rem 0; */}
.-profile h1{margin: 0;}
.-profile img{width: 6rem;height: 6rem;margin: 0 calc(50% - 3rem);border-radius: var(--br-lg);}
.box.-profile input{width: 50%;margin: 0 auto 1rem;}

/* PRIVATE MESSAGES */
#pmCon{width: 100%;}
#pmCon.pro_fixed{margin: 5.5rem 0 0 0;}

#messages .menu_bar{height: auto;justify-content: space-between;}
#messages .menu_bar .avatar{width: 2rem;height: 2rem;margin: 0 1rem 0 1.5rem;}
#messages .menu_bar h1 span, #messages .menu_bar .button{} 
#messages .menu_bar .button{margin-right: 1.5rem !important;}
#messages.-pm_box span.-pm_box, #messages.-pm_box .button.-pm_box, #messages.-pm_new span.-pm_new, #messages.-pm_new .button.-pm_new{display: flex;}
#messages h1{width: auto;}


.pm_preview {width: 100%;height: 2.5rem;margin: 1rem 0 0 0;padding: 0.5rem 1rem;color: var(--c-grey);line-height: 1.5rem;background: var(--c-grey-light);border-radius: var(--br-lg);text-overflow: ellipsis;white-space: nowrap;display: inline-block;overflow: hidden;}
a .pm_box:hover .pm_preview{background: var(--c-grey-light-alt);}
.pm_box.pm_new .pm_preview{color: var(--c-red);background: var(--c-grey-light);}
a .pm_box.pm_new:hover .pm_preview{color: var(--c-red);background: var(--c-grey-light-alt);}

#pm_box{max-height: calc(100vh - 14rem - var(--headerH));overflow: hidden;}
#pm_list{width: 100%;padding: 0 1rem 0 0;overflow-y: scroll;max-height: calc(100vh - 31rem - var(--headerH));display: flex;flex-wrap: wrap;flex-flow: column-reverse;z-index: 2;}
#pm_list::-webkit-scrollbar{width: 0.25rem;}
#pm_list::-webkit-scrollbar-track{background: transparent;}
#pm_list::-webkit-scrollbar-thumb{background: var(--c-grey-medium);border-radius: 0.125rem;}

#pm_box .-delete{width: 3rem;height: 3rem;justify-content: center;}
#pm_box .-delete:after{margin: 0;}
#pm_box .name{width: auto;}
#pm_box .name.pm_own{display: none;}
.pm_read_link{width: 100%;float: none;}

#pm_list .pm_box .avatar{width: 2rem;height: 2rem;margin: 1rem 0.5rem 0 0;}
#pm_list .pm_box .avatar.pm_own{display: none;}

#pm_box .text{width: calc(100% - 10rem) !important;margin: 1rem 0 1rem 2.5rem;padding: 1rem;background: var(--c-grey-light);border-radius: 0.5rem 1.5rem 1.5rem 1.5rem;}
#pm_box .text.pm_own{color: var(--c-primary-dark);background: var(--c-primary-light);float: right;border-radius: 1.5rem 1.5rem 0.5rem 1.5rem;}
#pm_box .text .pm_date{width: 100%;margin: 0.5rem 0 0 0;text-align: right;color: var(--c-purple);}
#pm_box .see{position: absolute;left: 0;bottom: 0.5rem;}

.pm_box{position: relative;}
.pm_box .name div{display: flex;}
.pm_box .name, .pm_box .name div{justify-content: space-between;align-items: center;}
.pm_box .name .date{margin: 0;}
.pm_box .link_box{margin: 0.5rem 0 0 0}
.pm_box .link{margin-bottom: 0;}
.pm_box textarea{}

#pm_box form.pm_box{width: 100%;margin: 1rem 0 0;padding: 0;position: relative;float: left;}
#pm_write_to{height: auto;line-height: 1.5rem;padding: 0.5rem 1rem;}
.pm_box .result{width: calc(100% + 0.5rem);max-height: 10em;margin: 0 0 1rem -0.5rem;overflow-y: scroll;}
.pm_box .result > div{width: auto;text-align: center;margin: 0 0.5em 1rem;padding: 0.25em 0.5em;background: #f5f5f5;border-radius: 0.5em;cursor: pointer;transition: all 0.4s cubic-bezier(0.6, 0, 0, 1);}
.pm_box .result > div:hover{color: var(--c-primary-dark) !important;background: var(--c-primary-light) !important;}
.pm_box .result::-webkit-scrollbar{width: 0.25rem;height: auto;}
.pm_box .result::-webkit-scrollbar-thumb{background: var(--c-purple);border-radius: 0.25rem;}
.pm_box .result::-webkit-scrollbar-track{background: var(--c-purple-light);}

#illyadance.-show{width: 100vw;height: 100vh;position: fixed;top: 0;left: 0;background: #000;overflow: hidden;z-index: 9999;}