/* Defaults */
@import url('default.css');
@import url('falling_bricks.css');

/* Components */
@import url('components/inputs.css');
@import url('components/loading_bar.css');
@import url('components/overlay.css');
@import url('components/flash_messages.css');

/* Other */
main > div{display: grid; gap: 32px; align-content: start;}
main > div hr{border: 2px inset var(--text_02); margin: 0 64px;}
.head{text-align: center; font-size: 1.25rem;}


.notice_board{position: absolute; top: -150px; z-index: 1; width: 100%; height: fit-content; animation: drop_down 1s ease-in-out 3s forwards;}
.notice_board > div{background: linear-gradient(0deg, rgb(200,200,200), rgb(240,240,240)); box-shadow: 0 0 10px 5px rgb(50,50,50,0.75); padding: 16px 32px; margin: 16px; display: grid; gap: 8px; border-radius: 8px; border-left: 8px solid rgb(120,160,200);}
.notice_board > div h2{font-size: 1.1rem;}
.notice_board > div p{border-radius: 6px; border-left: 4px solid rgb(120,160,200); padding-left: 8px; line-height: 2rem;}
.notice_board > div p a{color: rgb(50,100,200);}

@keyframes drop_down {
	  0%{top: -150px;}
	 75%{top: 10px;}
	100%{top: 0px;}
}

@media (max-width: 700px) {
	.notice_board{scale: 0.75; font-size: 0.75rem;}
}

.wip{background: rgb(0,0,0,0.3); cursor: not-allowed;}
.wip *{pointer-events: none;}
.wip img{opacity: 0.25;}
.wip input,
.wip textarea,
.wip button{background: rgb(0,0,0,0.15);}