@charset "UTF-8";

body {
	line-height: 1; 
	background-size: cover;		
	margin: 0;
	align-items: center;
}
	.title {
		color: black;
		font-size: 18px;
		font-weight: bold;
		text-align: center;
		font-family:-apple-system;
	}
	.title_cont {
		height: 100%; 
		text-align: center; 
		padding-top: 10px;
		padding-bottom: 10px;
		width: 100%;
		margin: auto;
	}
	.logo_cont {
		width:100%;
		height:120px;;
		margin: auto;
		background-image: url("../images/logo.png");
		background-repeat: no-repeat;
		background-position: center;
		background-image: linear-gradient(to top, #1bc0fb, #1d72f2 );
	}
	.sign_container {
		overflow: hidden;
		border: 2px solid #F2F2F2;
		border-radius: 4px;
		width: 70%;
		padding: 10px;
		padding-right: 10px;
		height: auto;
		margin: auto;
		margin-top: 40px;
	}
	.main_cont {
		width: 100%;
		height: auto;
		margin: auto;
	}
	.date_label {
		float: left;
		padding: 10px;
		width: 100%;
		height:20px;
	}
	.cat_label {
		display: none;
		float: left;
		padding: 10px;
		width: 100%;
		height:20px;
	}
	.alert_label {
		float: left;
		padding: 10px;
		width: 100%;
		height:20px;
		color: darkred;
		display: none;
	}
	.custom-select {
		border: 1px solid #EAEAEA;
		border-radius: 4px;
		position: relative;
		height: 40px;
		text-align: center;
		font-size: 16px;
		-webkit-appearance: none;
	}

	.custom-select select {
	  display: none; /*hide original SELECT element:*/
	}

	.select-selected {
	  background-color: #fff;
	}

	/*style the arrow inside the select element:*/
	.select-selected:after {
	  position: absolute;
	  content: "";
	  top: 14px;
	  right: 10px;
	  width: 0;
	  height: 0;
	  border: 6px solid transparent;
	  border-color: #000 transparent transparent transparent;
	}

	/*point the arrow upwards when the select box is open (active):*/
	.select-selected.select-arrow-active:after {
	  border-color: transparent transparent black transparent;
	  top: 7px;
	}

	/*style the items (options), including the selected item:*/
	.select-items div,.select-selected {
	  color: #000000;
	  padding: 6px 22px;
	  border: 1px solid transparent;
	  border-color: white;
	  cursor: pointer;
	  user-select: none;
	}

	/*style items (options):*/
	.select-items {
	  position: absolute;
	  background-color: #F2F2F2;
	  top: 100%;
	  left: 0;
	  right: 0;
	  z-index: 99;
	}

	/*hide the items when the select box is closed:*/
	.select-hide {
	  display: none;
	}

	.select-items div:hover, .same-as-selected {
	  background-color: rgba(0, 0, 0, 0.1);
	}
	.cont {
		float: left;
		width: 100%;
		height: 60px;
	}
	.cont_textarea {
		float: left;
		width: 100%;
		height: 200px;
	}
	.cont_com {
		display: none;
		float: left;
		width: 100%;
		height: 60px;
	}
	.check_cont {
		float: left;
		margin: 5px;
		margin-top: 20px;
		width:100%;
		height: 40px;
	}
	.form {
		width: 90%;
		position: relative;
		height: 50px;
		overflow: hidden;
		border: 1px #EAEAEA solid;
		border-radius: 4px;
		margin: auto;
	}
	.form_area {
		width: 90%;
		position: relative;
		height: 200px;
		overflow: hidden;
		border: 1px #EAEAEA solid;
		border-radius: 4px;
		margin: auto;
}
	.form_area textarea {
		border: 1px #EAEAEA;
		width: 90%;
		height: auto;
		color: black;
		font-size: 16px;
		padding: 15px 0px 5px 10px;
		outline: none;
		margin: auto;
		margin-top: 20px;
		margin-bottom: 20px;
	}
	.form input {
		border: 0px;
		width: 70%;
		height: 40px;
		color: black;
		font-size: 16px;
		padding: 15px 0px 5px 10px;
		outline: none;
		margin: auto;
		
	}
	.form_area label {
		position:absolute;
		bottom: 0px;
		left: 10px;
		width: 100%;
		height: 100%;
		pointer-events: none;
	}
	.form_area label::after {
		content: "";
		position: absolute;
		width: 100%;
		height: 100%;
		bottom: -1px;
		left: 0px;
		transform: translateX(-100%);
		transition: transform 0.3s ease;
	}
	.form label {
		position:absolute;
		bottom: 0px;
		left: 10px;
		width: 100%;
		height: 100%;
		pointer-events: none;
	}
	.form label::after {
		content: "";
		position: absolute;
		width: 100%;
		height: 100%;
		bottom: -1px;
		left: 0px;
		transform: translateX(-100%);
		transition: transform 0.3s ease;
	}
	.content-name {
		position: absolute;
		bottom: 5px;
		left: 0px;
		transition: all 0.3s ease;
	}
	.form input:focus + .label-name .content-name, .form input:valid + .label-name .content-name {
		transform: translateY(-150%);
		font-size: 14px;
		color: gray;
	}
	.form input:focus .label-name::after, .form input:valid + .label-name {
		transform: translateX(0%);
	}
	.form_area textarea:focus + .label-name .content-name, .form input:valid + .label-name .content-name {
		transform: translateY(-1200%);
		font-size: 14px;
		color: gray;
	}
	.form_area textarea:focus .label-name::after, .form input:valid + .label-name {
		transform: translateX(0%);
	}
	.check_container {
		padding-top: 5px;
		width: 88%;
		margin: auto;
		display: block;
		position: relative;
		padding-left: 35px;
		margin-bottom: 12px;
		cursor: pointer;
		font-size: 16px;
		font-family:-apple-system;
		-webkit-user-select: none;
		-moz-user-select: none;
		-ms-user-select: none;
		user-select: none;
	}

	/* Hide the browser's default checkbox */
	.check_container input {
		width: 88%;
		margin: auto;
		position: absolute;
		opacity: 0;
		cursor: pointer;
		height: 0;
		width: 0;
	}

	/* Create a custom checkbox */
	.checkmark {
		position: absolute;
		top: 0;
		left: 0;
	  	height: 20px;
	  	width: 20px;
	  	border: 1px #EAEAEA solid;
	}

	/* On mouse-over, add a grey background color */
	.check_container:hover input ~ .checkmark {
	  	background-color: #fff;
	}

	/* When the checkbox is checked, add a blue background */
	.check_container input:checked ~ .checkmark {
	  	background-color: #000;
	}

	/* Create the checkmark/indicator (hidden when not checked) */
	.checkmark:after {
	  	content: "";
	  	position: absolute;
	  	display: none;
	}

	/* Show the checkmark when checked */
	.check_container input:checked ~ .checkmark:after {
	  	display: block;
	}

	/* Style the checkmark/indicator */
	.check_container .checkmark:after {
	  	left: 7px;
	  	top: 2px;
	  	width: 5px;
	  	height: 10px;
	  	border: solid white;
	  	border-width: 0 3px 3px 0;
	  	-webkit-transform: rotate(45deg);
	  	-ms-transform: rotate(45deg);
	  	transform: rotate(45deg);
	}
	.modal {
	  display: none; /* Hidden by default */
	  position: fixed; /* Stay in place */
	  z-index: 1; /* Sit on top */
	  padding-top: 100px; /* Location of the box */
	  left: 0;
	  top: 0;
	  width: 100%; /* Full width */
	  height: 100%; /* Full height */
	  overflow: auto; /* Enable scroll if needed */
	  background-color: rgb(0,0,0); /* Fallback color */
	  background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
	}

	/* Modal Content */
	.modal-content {
	  background-color: #fefefe;
	  margin: auto;
	  padding: 20px;
	  border: 1px solid #888;
	  width: 80%;
	}
	.modal_text {
	  background-color: transparent;
	  margin: auto;
	  padding: 20px;
	  width: 90%;
	  height: 90%;
	}
	/* The Close Button */
	.close {
	  color: #aaaaaa;
	  float: right;
	  font-size: 28px;
	  font-weight: bold;
	}

	.close:hover,
	.close:focus {
	  color: #000;
	  text-decoration: none;
	  cursor: pointer;
	}
	.sec_cont {
		float: left;
		width: 100%;
		height: 160px;
		background-color: #F2F2F2;
	}
	.about_cont {
		float: left;
		width: 100%;
		height: 240px;
		margin-bottom: 30px;
	}
	.sec_label {
		padding: 10px;
		padding-top: 5px;
		padding-bottom: 5px;
		width: 88%;
		height: 20px;
		font-size: 16px;
		margin: auto;
		color: black;
	}
	.sec_img {
		padding: 10px;
		padding-top: 5px;
		padding-bottom: 5px;
		width: 100%;
		height: 50px;
		font-size: 16px;
		color: black;
		font-weight: bold;
	}
	.sec_input {
		padding-left: 10px;
		width: 100%;
		height: 50px;
		font-size: 16px;
		color: black;
	}
	.submit_button {
		padding: 10px;
		width: 100%;
		height: 40px;
		font-size: 16px;
		color: black;
		background-color: transparent;
		border:  1px solid #EAEAEA;
		font-weight: bold;
		-webkit-appearance: none;
		cursor: pointer;
	}
	.submit_button_small {
		padding: 10px;
		margin-left: 5px;
		width: 185px;
		height: 40px;
		font-size: 14px;
		color: black;
		font-weight: bold;
		background-color: transparent;
		border: 0px;
		border-bottom:  1px solid #EAEAEA;
		-webkit-appearance: none;
	}
	/* toggle switch */
	

	/* adduser bolumu */
	.info {
		width: 100%;
		height: 100px;
		margin: auto;
		margin-top: 120px;
		font-size: 18px;
		font-family:-apple-system;
	}