html, body{width: 100%;height: 100%;}
body{
	font-size: 14px;
	color: #2d2d2d;
	background-color: #dfdfdf;
}
select:disabled{
	color: #2d2d2d;
	background-color: #fff;
}
#decl-io{
	grid-template-columns:
		[nav-start temp-start] 320px
		[temp-end field-start body-start] 1fr
		[nav-end field-end body-end];
	grid-template-rows:
		[nav-start] 50px
		[nav-end temp-start field-start] max-content
		[field-end body-start] 1fr
		[temp-end body-end];
	grid-gap: 5px;
	/*overflow: auto;
	overflow-x: hidden;*/
}
	.decl-nav{
		grid-area: nav;

		padding: 0 10px;
		background-color: #009442;
	}
	/*.decl-form{
		max-width: 800px;
		padding: 20px 20px 0;
	}*/
			.decl-logo{
				height: 60px;
			}
		.decl-lss{
			grid-area: temp;
			padding-bottom: 10px;
			border-right: 1px dotted #5b5b5b;
		}
			.dtmp-list-place,
			.dtmp-list-error{
				margin-top: 30px;
			}
			.dtmp-card{
				margin: 0 10px;
				margin-top: 10px;
				padding: 10px;
				border: 1px solid #5b5b5b;
				background-color: #fff;
			}
				.dtmp-title{
					padding-bottom: 5px;
					border-bottom: 1px solid #5b5b5b;
				}
				.dtmp-content{
					padding-top: 5px;
				}
		.decl-top{
			grid-area: field;

			max-width: 450px;
			padding-top: 20px;
			padding-left: 30px;
		}
			.decl-lbl{
				padding: 10px 0;
			}
			.decl-inp{
				margin-left: 20px;
				padding: 0 20px;
				font-size: 1.1em;
				border: 1px solid #5b5b5b;
			}
			.decl-break{
				width: 100%;
				height: 5px;
			}
		#decl-bob{
			grid-area: body;

			max-width: 800px;
			padding-left: 30px;
		}
			.decl-lblM{
				padding: 10px 0;
			}
			#decl-body{
				border: 1px solid #5b5b5b;
				min-height: 300px;
				padding: 10px 15px;
				font-size: 1.1em;
				font-family: SGU;
				resize: none;
			}
			.decl-bttn{
				padding: 10px 15px;
				letter-spacing: 1px;
				background-color: #1cd3eb;
			}
				.decl-bttn:hover{
					cursor: pointer;
					color: #fff;
					background-color: #035efc;
				}
				.decl-bttn:active{
					padding: 11px 15px 9px;
					background-color: #033be9;
				}
			#decl-clear{
				background-color: #ff5c61;
			}
				#decl-clear:hover{
					background-color: #fa252c;
				}
				#decl-clear:active{
					background-color: #e72226;
				}
@media screen and (max-width: 800px){
	#decl-io{
		/* //~ fucking fix this */
		/* fucking fix this */
		/* fucking fix this */
		grid-template-columns:
			[nav-start temp-start field-start body-start] 1fr
			[nav-end temp-end field-end body-end];
		grid-template-rows:
			[nav-start] 50px
			[nav-end field-start] max-content
			[field-end body-start] max-content
			[body-end temp-start ] 1fr
			[temp-end];
		grid-gap: 5px;
	}
	.decl-form{
		max-width: 100%;
		padding: 10px 10px 0;
	}
		.decl-lss{
			border: 0;
			margin-top: 5px;
		}
		.decl-top{
			width: 100%;
			padding: 5px 10px;
		}
			.decl-lbl{
				padding: 10px 0;
			}
			.decl-inp{
				padding: 10px 20px;
			}
		#decl-bob{
			padding: 0;
		}
			.decl-lblM{
				max-width: 800px;
				padding: 10px;
			}
			#decl-body{
				width: calc(100% - 40px);
				padding: 10px;
				margin-left: 10px;
			}
			.decl-bttn{
				padding: 5px 15px;
			}
}