* {
	margin: 0;
	padding: 0;
	color: white;
	cursor: default;
	-webkit-user-select: none;
	-webkit-touch-callout: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

:root {
  --main-color: #131847;
}

body {
  font-family: sans-serif;
  background-color: var(--main-color);
}

h1, h2, h3, h4, h5, ul, ol, img, a, p, li {
	margin: 0;
	padding: 0;
	list-style: none;
	text-decoration: none;
	color: white;
	border: none;
	outline: none;
}

a {
	transition: all .2s linear;
	height: fit-content;
	cursor: pointer;
}

a img {
	cursor: pointer;
}

#sol_kenar {
	width: 0px;
	height: 600px;
	position: fixed;
	z-index: 99999;
}

#page {
	width: 100%;
	min-width: 320px;
	float: left;
	overflow: hidden;
	position: relative;
	margin-left: 0px;
	margin-right: 0px;
}

#sag_kenar {
	width: 0px;
	min-height: 600px;
	position: fixed;
	z-index: 99999;
	right: 0px;
}

.content {
	margin-top: 50px;
	display: inline-block;
	position: relative;
	width: 100%;
	float: left;
	overflow: hidden;
}

header {
	height: 50px;
  width: 100%;
  position: fixed;
  z-index: 9999;
  background-color: var(--main-color);
}

.header_left {
	height: 30px;
	line-height: 32px;
	font-size: 19px;
	padding: 3px 10px;
	margin: 6px;
	border: 1px solid var(--main-color);
	float: left;
	font-weight: bold;
	cursor: pointer;
}

.header_right {
	height: 30px;
	line-height: 30px;
	font-size: 18px;
	padding: 3px;
	margin: 6px;
	border: 1px solid var(--main-color);
	float: right;
	font-weight: bold;
	border-radius: 50%;
	cursor: pointer;
}

.header_left:hover, .header_right:hover {
	border-color: white;
}

.header_right img{
	height: 30px;
	width: 30px;
	object-fit: cover;
	cursor: pointer;
}

.admin_header {
	width: calc(100% - 20px);
	height: 20px;
	line-height: 20px;
	font-size: 17px;
	padding: 5px 10px;
	margin: 5px 0px;
	float: left;
	color: yellow;
	font-weight: 500;
	text-align: center;
}

.admin_links {
	width: calc(100% - 24px);
	padding: 5px;
	margin: 5px;
	float: left;
	border: 2px solid white;
}

.admin_links a {
	width: 100%;
	height: 15px;
	line-height: 15px;
	font-size: 12px;
	margin: 6px 0px;
	float: left;
}

.admin_links a:hover {
	font-size: 12px;
	color: yellow;
}

.admin_flag_links {
	width: calc(100% - 14px);
	height: 49px;
	margin: 5px;
	float: left;
	border: 2px solid white;
}

.admin_flag_links a {
	margin: 7px;
	float: left;
}

.admin_flag_links a img{
	width: 35px;
	height: 35px;
	object-fit: cover;
}

.admin_small_header {
	margin: 5px 5px 0px 5px;
	width: calc(100% - 12px);
	float: left;
	border: 1px solid grey;
	border-bottom: none;
}

.admin_small_header a {
	height: 25px;
	width: calc(100% - 20px);
	padding: 5px 10px;
	float: right;
	text-align: center;
	color: lightyellow;
	font-weight: 300;
	line-height: 25px;
	font-size: 16px;
}

.admin_small_header a img {
	width: 25px;
	height: 25px;
	object-fit: cover;
	float: right;
}

.admin_small_flag_links {
	width: calc(100% - 32px);
	padding: 5px 10px;
	margin: 0px 5px 5px 5px;
	float: left;
	border: 1px solid grey;
	border-top: none;
}

.admin_small_flag_links a {
	margin: 5px 10px;
	float: left;
}

.admin_small_flag_links a img {
	width: 25px;
	height: 25px;
	object-fit: cover;
}

/*log_in*/

.login_block {
	width: 70%;
	max-width: 500px;
	padding: 10px;
	border: 2px solid gold;
	border-radius: 25px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.form_element {
	width: 100%;
	float: left;
	margin: 5px 0px;
}

.form_element a {
	width: 220px;
	height: 220px;
	float: left;
	margin: 10px calc((100% - 220px)/2);
}

.form_element a img {
	width: 220px;
	height: 220px;
	object-fit: cover;
	scale: 1.6;
}

.form_element a .login_img {
	border: none;
}

.login_page {
	width: 100%;
	height: 600px;
}

.form_element label {
	width: 90px;
	height: 20px;
	line-height: 20px;
	font-size: 16px;
	font-weight: bold;
	color: gold;
	float: left;
}

.form_element input {
	width: calc(100% - 90px);
	outline: none;
	border: none;
	border-bottom: 1px solid white;
	background-color: var(--main-color);
	height: 19px;
	line-height: 19px;
	font-size: 16px;
	color: white;
	float: left;
}

.login_form_button {
	width: 100%;
	border: 2px solid white;
	height: 36px;
	padding: 5px 0px;
	font-size: 18px;
	float: left;
	margin: 5px 0px;
	background-color: var(--main-color);
	border-radius: 10px;
}

input:-webkit-autofill {
	background-color: var(--main-color);
  -webkit-box-shadow: none;
  box-shadow: none;
  -webkit-text-fill-color: white;
	border: none;
	border-bottom: 1px solid white;
}

input:-webkit-autofill:focus {
	background-color: var(--main-color);
  -webkit-box-shadow: none;
  box-shadow: none;
  -webkit-text-fill-color: white;
	border: none;
	border-bottom: 1px solid white;
}

input:-webkit-autofill::first-line {
	background-color: var(--main-color);
  font-family: sans-serif;
  font-size: 16px;
  color: white;
}



/*forms page*/

.admin_elements {
	width: 100%;
	float: left;
}

.admin_element {
	width: calc(100% - 23px);
	border: 1px solid white;
	padding: 5px;
	float: left;
	margin: 5px;
	border-radius: 10px;
}

.form_element {
	width: 100%;
	float: left;
	margin: 5px 0px;
}

.element_label {
	width: calc((40% - 10px));
	float: left;
	margin: 0px 5px;
	line-height: 15px;
	font-size: 14px;
}

.element_text {
	width: calc((60% - 10px));
	float: left;
	margin: 0px 5px;
	line-height: 15px;
	font-size: 14px;
}

.form_element form{
	float: right;
	margin: 5px;
}

.form_element form button, .form_element button{
	float: right;
	border: 1px solid white;
	background-color: var(--main-color);
	padding: 5px;
	font-size: 15px;
	border-radius: 5px;
	cursor: pointer;
	margin-right: 10px;
}

.form_element form button:hover, .form_element button:hover{
	border: 1px solid var(--main-color);
	background-color: white;
	color: var(--main-color);
}


/*main slades*/

.admin_element form {
	float: left;
	width: 100%;
}

.admin_element .form_label {
	width: calc((40% - 10px));
	float: left;
	margin: 0px 5px;
	line-height: 15px;
	font-size: 14px;
}

.form_element textarea {
	width: calc((60% - 24px));
	border: 2px solid white;
	background-color: var(--main-color);
	outline: none;
	height: 57px;
	padding: 5px;
	float: right;
	margin: 0px 5px;
	line-height: 15px;
	font-size: 14px;
}

.form_element input {
	width: calc((60% - 24px));
	border: 2px solid white;
	background-color: var(--main-color);
	outline: none;
	padding: 5px;
	float: right;
	margin: 0px 5px;
	line-height: 15px;
	font-size: 14px;
}

.admin_element .form_img {
	width: calc(60% - 24px);
	border: 2px solid white;
	background-color: var(--main-color);
	padding: 5px;
	float: right;
	margin: 0px 5px;
	font-size: 12px;
}

.admin_element .form_img {
	width: calc(60% - 24px);
	border: 2px solid white;
	background-color: var(--main-color);
	padding: 5px;
	float: right;
	margin: 0px 5px;
	font-size: 12px;
}

.admin_element .form_img .form_new_foto {
	color: green;
	font-weight: bold;
}

.admin_element .form_img_small {
	width: calc((40% - 24px));
	border: 2px solid white;
	background-color: var(--main-color);
	padding: 5px;
	float: left;
	margin: 5px;
}

.form_element img {
	width: calc((60% - 14px));
	border: 2px solid white;
	float: right;
	margin: 0px 5px;
}

.form_element .form_radio {
	width: calc((60% - 20px)/2);
	float: left;
	margin: 0px 5px;
	position: relative;
}

.form_element .form_radio:after {
	display: block;
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0px;
	left: 0px;
	content: "evet";
	text-align: center;
	background-color: var(--main-color);
	border: 1px solid white;
	cursor: pointer;
}

.form_element .form_radio_not:after {
	content: "hayir";
}

.form_element .form_radio:checked:after {
	background-color: #059724;
}

.form_element .form_radio_not:checked:after {
	background-color: #970505;
}

.form_element .form_number {
	width: calc((60% - 24px));
	float: left;
	margin: 0px 5px;
	position: relative;
}

.form_element video {
	width: calc((60% - 14px));
	border: 2px solid white;
	float: right;
	margin: 0px 5px;
}

.form_foto {
	width: 100%;
	border-bottom: 2px solid yellow;
	float: left;
	margin: 5px 0px;
}

.form_foto img{
	width: calc(60% - 10px);
	float: right;
	margin: 0px 5px 5px 5px;
}

.form_foto .new_foto_img{
	width: calc(60% - 60px);
	float: right;
	padding: 25px;
	margin: 0px 5px 5px 5px;
}

.form_element .new_foto_img{
	width: calc(60% - 64px);
	float: right;
	padding: 25px;
	margin: 0px 5px 5px 5px;
}

.form_foto .form_foto_galery{
	width: calc(40% - 10px);
	float: left;
	margin: 0px 5px;
	font-size: 15px;
}

.form_foto .form_foto_galery input{
	float: right;
	width: 20px;
	height: 20px;
}

.form_foto .form_foto_label_button{
	width: calc(40% - 10px);
	float: left;
	margin: 10px 5px;
}

.form_foto .form_foto_label_button .form_foto_new, .form_foto .form_foto_label_button .form_foto_button{
	width: 100%;
	float: left;
	text-align: center;
	padding: 5px 0px;
	box-shadow: inset 0px 0px 10px 1px white;
	background-color: var(--main-color);
	border: none;
}

.form_foto_button_okay{
	width: calc(40% - 10px);
	margin: 5px;
	float: left;
	text-align: center;
	padding: 5px 0px;
	box-shadow: inset 0px 0px 10px 1px green;
	background-color: var(--main-color);
	border: none;
	height: 28px;
	font-weight: bold;
}

.dictionary_tr {
	margin: 5px 0px;
}

.form_element .dictionary_lang {
	margin: 5px 0px;
	width: calc((100% - 14px));
}



















@media only screen and (min-width: 720px) {

#sol_kenar {
    width: calc((100% - 720px)/2);
}

#page {
    width: 720px;
    margin-left: calc((100% - 720px)/2);
    margin-right: calc((100% - 720px)/2);
}

#sag_kenar {
    width: calc((100% - 720px)/2);
}

header {
  width: 720px;
}



}


@media only screen and (min-width: 900px) {

#sol_kenar {
    width: calc((100% - 900px)/2);
}

#page {
    width: 900px;
    margin-left: calc((100% - 900px)/2);
    margin-right: calc((100% - 900px)/2);
}

#sag_kenar {
    width: calc((100% - 900px)/2);
}

header {
  width: 900px;
}

.admin_element {
  width: calc(50% - 23px);
}

.form_element img {
  height: 140px;
  object-fit: cover;
}

.dictionary_tr {
  height: 144px;
}

.admin_elements_room_tour {
  width: 50%;
}

.admin_element_room_tour {
  width: calc(100% - 23px);
}

.form_element .new_foto_img {
    width: 144px;
    float: right;
    padding: 0px 49px;
    margin: 0px 5px 5px 5px;

}


@media only screen and (min-width: 1260px) {
#sol_kenar {
    width: calc((100% - 1260px)/2);
}

#page {
    width: 1260px;
    margin-left: calc((100% - 1260px)/2);
    margin-right: calc((100% - 1260px)/2);
}

#sag_kenar {
    width: calc((100% - 1260px)/2);
}

header {
  width: 1260px;
}

}


@media only screen and (min-width: 1560px) {
#sol_kenar {
    width: calc((100% - 1560px)/2);
}

#page {
    width: 1560px;
    margin-left: calc((100% - 1560px)/2);
    margin-right: calc((100% - 1560px)/2);
}

#sag_kenar {
    width: calc((100% - 1560px)/2);
}

header {
  width: 1560px;
}

}





