﻿/* ----- START GENERAL OBJECTS ----- */
@font-face {
	font-family: 'Edit Undo';
	src: url(/website/fonts/pixel.ttf);
}

@font-face {
	font-family: 'Handwriting';
	src: url(/website/fonts/handwriting.ttf);
}

@-moz-keyframes spin { 
    100% { -moz-transform: rotate(360deg); } 
}

@-webkit-keyframes spin { 
    100% { -webkit-transform: rotate(360deg); } 
}

@keyframes spin { 
    100% { 
        -webkit-transform: rotate(360deg); 
        transform:rotate(360deg); 
    } 
}

@-moz-keyframes spin_neg { 
    100% { -moz-transform: rotate(-360deg); } 
}

@-webkit-keyframes spin_neg { 
    100% { -webkit-transform: rotate(-360deg); } 
}

@keyframes spin_neg { 
    100% { 
        -webkit-transform: rotate(-360deg); 
        transform:rotate(-360deg); 
    } 
}

body {
	color: #FFFFFF;
	font-family: 'Roboto', sans-serif;
	background-image: url('../../images/general/background_gitter.png');
	background-size: 30px;
	background-color: #4B4B4B;
	width: 100%;
	height: 100%;
	margin: 0px;
	padding: 0px;
}
/* ----- END GENERAL OBJECTS ------- */
/* ----- START HEADER OBJECTS ----- */
@media all {
	.header_div_screen {
		background-color: #6C667C;
		border-radius: 5px;
		min-width: 457px;
		width: 457px;
		height: 99px;
		max-height:159px;
		padding: 30px 30px;
		-webkit-padding-after: 12px;
		margin: 0px 0px 0px 30px;
		float: left;
		cursor: pointer;
	}

	.header_div_buttons_background {
		background-color: #00000000;
		width: fit-content;
		text-align: center;
		height: fit-content;
		padding-top: 35px;
		user-select: none;
		float: left;
		position: absolute;
		top: 45px;
		left: 557px;
	}

	.header_div_main {
		background-color: #CAC6C5;
		background-image: url('../../images/general/background_header.png');
		background-size: 45px;
		width: 100%;
		text-align: center;
		height: 159px;
		user-select: none;
		padding-top: 30px;
		padding-bottom: 30px;
	}
	
	.main_div {
		background-color: #4B4B4B;
		width: calc(100% - 80px);
		margin: 40px;
		min-height: calc(100% - 300px);
	}
}

@media all and (max-width: 1140px)  {
	.header_div_screen {
		margin: auto;
		float: none;
	}

	.header_div_buttons_background {
		background-color: #CAC6C5;
		width: 100%;
		text-align: center;
		height: fit-content;
		padding-top: 20px;
		padding-bottom: 30px;
		float: none;
		position: unset;
		top: 0px;
		left: 0px;
		margin-top: -2px;
	}

	.header_div_main {
		width: 100%;
		text-align: center;
		height: fit-content;
	}
	
	.main_div {
		min-height: calc(100% - 388px);
	}
	
	@-moz-document url-prefix() {
	  .main_div {
		min-height: calc(100% - 408px);
	  }
	}
}


.header_p1 {
	font-size: 60px;
	font-weight: bold;
	font-family: 'Edit Undo';
	color: #2A2F02;
	background-color: #657408;
	border-radius: 5px;
	padding: 15px 30px;
	margin: 0px;
}

.header_p2 {
	font-size: 15px;
	font-family: 'Handwriting';
	color: #FF0000;
	margin: 0px;
	margin-top: 5px;
	text-align: right;
}

.header_buttons_form {
	margin: auto;
	display: contents;
}

.header_buttons {
	background: linear-gradient(90deg, rgba(140,134,138,1) 0%, rgba(154,154,154,1) 100%);
	height: 36px;
	width: 110px;
	border-radius: 18px;
	border: 5px solid #B3AFAE;
	rotate: -45deg;
	margin: auto;
	cursor: pointer;
}

.header_buttons:hover {
	background: linear-gradient(90deg, rgba(150,144,148,1) 0%, rgba(164,164,164,1) 100%);
	border: 5px solid #B3AFAE;
}

.header_buttons:active {
	background: linear-gradient(90deg, rgba(130,124,128,1) 0%, rgba(144,144,144,1) 100%);
	border: 5px solid #B3AFAE;
}

.header_buttons_label {
	font-weight: bold;
	color: #42396E;
	padding-top: 35px;
	margin: auto;
	text-align: left;
	margin-left: 17px;
}
/* ----- END HEADER OBJECTS ------- */
/* ----- START MAIN OBJECTS ----- */
.main_div_inner {
	background-color: #4B4B4B;
	width: calc(100% - 20px);
	height: 100%;
	margin: 10px;
	padding: 10px 0px;
}

.main_page_title {
	font-size: 40px;
	font-weight: bold;
	font-family: 'Edit Undo';
	color: #FF0000;
	margin: 10px 0px;
}

.main_page_sub_title {
	font-size: 30px;
	font-weight: bold;
	font-family: 'Edit Undo';
	color: #FF0000;
	margin: 10px 0px;
}

.main_form_table {
	border-collapse: collapse;
	width: 500px;
}

.main_form_table2 {
	border-collapse: collapse;
	width: 100%;
}

.main_form_td1 {
	width: 150px;
}

.main_form_p1 {
	padding: 0px;
	margin: 0px;
	font-weight: bold;
}

.main_form_input {
	background-color: #3B3B3B;
	color: #FFFFFF;
	width: calc(100% - 8px);
}

.main_form_submit {
	width: 150px;
	float: right;
}

.main_form_textarea {
	background-color: #3B3B3B;
	color: #FFFFFF;
	width: 100%;
	max-width: 100%;
	height: 900px;
	min-height: 900px;
	resize: vertical;
}

.main_form_style_button {
	color: white;
	background-color: #3B3B3B;
	font-weight: bold;
	min-height: 25px;
    min-width: 25px;
	vertical-align: bottom;
	padding: 1px;
	border: 0px solid white;
	margin: 1px;
	cursor: pointer;
}

.main_form_style_button:hover {
	filter: brightness(150%);
}

.main_blog_spoiler {
	background: #333333;
	border-radius: 0.2em;
	color: transparent;
}

 .main_blog_spoiler:hover {
	background: transparent;
	color: inherit;
 }

.main_blog_p {
	padding: 0px;
	margin: 0px;
	width: fit-content;
}

.main_blog_img_div {
	padding: 0px;
	margin: 0px;
	width: 100%; 
	text-align: center;
}

.main_blog_img {
	max-width: 100%;
}

.main_blog_code {
	font-weight: bold;
	font-family: 'Edit Undo';
	color: #2A2F02;
	background-color: #657408;
	padding: 10px;
	margin: 0px;
	border: 2px solid #6C667C;
	border-radius: 5px;
	font-size: 20px;
}

.main_blog_table {
	width: 100%;
	border-collapse: collapse;
}

.main_blog_td_count {
	width: 20px;
	vertical-align: baseline;
	font-weight: bold;
	text-align: right;
	padding-right: 5px;
}

.main_blog_quote {
	background-color: #3B3B3B;
	padding: 10px;
	margin: 0px;
	border: 1px solid #A9A9A9;
	border-radius: 5px;
}

.main_blog_link {
	color: #FFFFFF;
	font-family: 'Roboto', sans-serif;
	background: transparent;
	border: none;
	padding: 0px;
	cursor: pointer;
	font-weight: bold;
	font-size: 16px;
	cursor: pointer;
	text-decoration: none;
}

.hyper_link1 {
	color: #569800;
	text-decoration: none;
	cursor: pointer;
}

.hyper_link2 {
	color: #0088DD;
  text-decoration: none;
	cursor: pointer;
}
/* ----- END MAIN OBJECTS ------- */
/* ----- START ERROR OBJECTS ----- */
.error_image_div {
	color: #CAC6C5;
	user-select: none;
	height: 512px;
	width: 512px;
	margin: auto;
}

.error_image_div_outer {
	color: #CAC6C5;
	user-select: none;
	height: 512px;
	width: 512px;
	margin: auto;
	padding: 50% 0;
	height: 0;
	display: table;
}

.error_image_div_inner {
	height: 512px;
	overflow-x: hidden;
	overflow-y: hidden;
}

.error_image_layer0 {
	color: #CAC6C5;
	height: 512px;
	width: 512px;
	background-size: 100%;
	background-image: url('../../images/general/loading/loading1_0.png');
}

.error_image_layer1 {
	color: #CAC6C5;
	height: 512px;
	width: 512px;
	background-size: 100%;
	pointer-events: none;
	background-image: url('../../images/general/loading/loading1_1.png');
	-webkit-animation:spin 6s linear infinite;
	-moz-animation:spin 6s linear infinite;
	animation:spin 6s linear infinite;
}

.error_image_layer2 {
	color: #CAC6C5;
	height: 512px;
	width: 512px;
	background-size: 100%;
	pointer-events: none;
	background-image: url('../../images/general/loading/loading1_2.png');
	-webkit-animation:spin_neg 4s linear infinite;
	-moz-animation:spin_neg 4s linear infinite;
	animation:spin_neg 4s linear infinite;
}

.error_image_layer3 {
	color: #CAC6C5;
	height: 512px;
	width: 512px;
	background-size: 100%;
	pointer-events: none;
	background-image: url('../../images/general/loading/loading1_3.png');
	-webkit-animation:spin 2s linear infinite;
	-moz-animation:spin 2s linear infinite;
	animation:spin 2s linear infinite;
}
/* ----- END ERROR OBJECTS ------- */