/*-----RESET_CSS--------------------------*/

/* Reset and base styles  */

* {
	padding: 0px;
	margin: 0px;
	border: none;
}



html {
	box-sizing: border-box;
}
*,*::before,*::after {
	box-sizing: inherit;
}


a:hover  {

	text-decoration: none;
}



aside, nav, footer, header, section, main {
	display: block;
}

h1, h2, h3, h4, h5, h6, p {
	font-size: inherit;
	font-weight: inherit;
}


address {
  font-style: normal;
}



input, textarea, button, select {
	font-family: inherit;
	font-size: inherit;
	color: inherit;
	background-color: transparent;
}


button, input[type="submit"] {
	display: inline-block;
	box-shadow: none;
	background-color: transparent;
	background: none;
	cursor: pointer;
}

input:focus, input:active,
button:focus, button:active {
   outline: none;
   /*outline: 3px solid #666;*/
}


/*label {
	cursor: pointer;
}*/

legend {
	display: block;
}
/*--------------------END RESET CSS--------------------------------*/



.main_container {
/*width:1180px;*/
width:92%;
margin:0 auto; 
min-height:calc(100vh - 141px);/*Чтобы подвал всегда был внизу*/
}


/*--------Шапка и авторизация-------/*

/* Обнуление стандартных отступов и шрифтов */
body, ul, li, p, form, label, input, button, h1 {
	margin: 0;
	padding: 0;
	
	box-sizing: border-box;
}

/* Стили для блока шапки */
.head_interface {
	font-family: Arial, sans-serif;
	background-color: #f8f8f8;
	border-bottom: 2px solid #e2e2e2;
	padding: 5px 10px;
	
	display:flex;
	flex-wrap:wrap;
	align-items:flex-end;
	justify-content:space-between;
	margin-top:5px;
}

.header_btn_block {
	display: flex;
	align-items: center;
	list-style-type: none;
}

.main_menu_item {
	margin-right: 20px;
	height:50px;
	padding-top:12px;
	padding-bottom:14px;
}

.choose_bank_caption {
	display: inline-block;
	font-size:16px;
	/*line-height:24px;*/
	font-weight:400;
	color:#222222;
	margin-right:21px;
	height:50px;
	padding-top:12px;
	padding-bottom:14px;
}

.main_menu_item a, .main_menu_item p {
	text-decoration: none;
	color: #333;
	font-weight: bold;
}

.main_menu_item p {
	cursor: pointer;
}

.main_menu_item a:hover, .main_menu_item p:hover {
	color: #007BFF;
}

/* Стили для формы авторизации */
.login_btn_li {
	position: relative;
}

.login_btn {
	cursor: pointer;
	color: #007BFF;
	font-weight: bold;
}

.authorization, .password_recovery {
	/*display: none;*/
	position: absolute;
	top: 40px;
	right: 0;
	background-color: #fff;
	padding: 20px;
	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
	border-radius: 8px;
	width: 300px;
	z-index: 1000;
}


.auth_caption {
	font-size: 18px;
	margin-bottom: 15px;
	color: #333;
}

label[for="login"], label[for="password"] {
	display: block;
	margin-bottom: 5px;
	color: #555;
}



input[name="login"], input[name="password"], input[name="email_for_rec"]  {
	width: 100%;
	padding: 8px;
	margin-bottom: 10px;
	border: 1px solid #ddd;
	border-radius: 4px;
}

.login_button, .recovery_button {
	width: 100%;
	padding: 10px;
	background-color: #007BFF;
	color: #fff;
	border: none;
	border-radius: 4px;
	cursor: pointer;
	font-size: 16px;
	margin-bottom:4px;
}

.login_button:hover, .recovery_button:hover {
	background-color: #0056b3;
}



input[name="save_me"] {
	margin-right: 5px;
}

.forget_pass, .go_registr {
	color: #007BFF;
	cursor: pointer;
	margin-top: 10px;
	text-align: center;
}

.forget_pass:hover, .go_registr:hover {
	text-decoration: underline;
}



.password_recovery img.btn_close {
	position: absolute;
	top: 10px;
	right: 10px;
	cursor: pointer;
	width: 16px;
	height: 16px;
}

.display_none {
	 display: none;
}




.choose_target {
	cursor:pointer;

}


.search_form, .choose_target_menu {
	background-color: #fff;
	padding: 20px;
	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
	border-radius: 8px;
	width: 100%;
	max-width: 600px;
	margin: 20px auto;
	font-family: Arial, sans-serif;
	box-sizing: border-box;
}


.form_section {
	margin-bottom: 20px;
}


.display_none {
	display: none;
}





input[type="checkbox"] {
	/*width: 20px; height: 20px; */
	margin-right:5px;
}

input[name="with_photo"] {	
	margin-left:8px;
}

input[name="age_from"] {
	border: 1px solid black;
	width:50px;
	margin-right:10px;
	padding:3px;
}

input[name="age_to"] {
	border: 1px solid black;
	width:50px;
	padding:3px;
}

input[name="city_from"] {
	border: 1px solid black;
	/*width:50px;*/
	margin-left:-16px;
	padding:3px;
}

input[name="prev_url"], input[name="need_change_goals"] {
display:none;
}



select[name="gender"], select[name="host_city-select"] {
	border: 1px solid black;
}


.menu_caption {
	font-size: 16px;
	font-weight: bold;
	color: #333;
	margin-bottom: 5px;
	display: block;
}



.menu_caption2 {
font-size:17px;
display:inline-block;
vertical-align:middle;
margin-left:7px;
}




select {
	/*width: 70%;*/
	padding: 8px;
}




.search_button, .apply_target {
	width: 50%;
	display:block;
	margin: 0 auto;
	padding: 10px;
	background-color: #007BFF;
	color: #fff;
	border: none;
	border-radius: 4px;
	cursor: pointer;
	font-size: 16px;
}

.search_button:hover, .apply_target:hover {
	background-color: #0056b3;
}


/* Устранение пробелов между инлайн-блоками */
.form_section label, .form_section input[type="number"], .form_section input[type="text"], .form_section select {
	display: inline-block;
	vertical-align: middle;
}

.form_section input, .form_section select {
   border-radius:5px;
}

.form_section input[type="number"]:first-child, .form_section input[type="text"]:first-child {
	margin-right: 10px;
}

/* Увеличение высоты select */
.form_section select {
	height: 34px;
}



#host_city-select, #from_country_select {
	  float: none;
	  /*border: solid 1px black;*/
	  margin-left:20px;
		width:160px;
}




/* Стили для заголовков и надписей */
.text-header {
	font-size: 24px;
	font-weight: bold;
	color: #333;
	text-align: center;
	margin: 20px 0;
	font-family: Arial, sans-serif;
}

.subcaption {
	text-align:center;
	font-family: Arial, sans-serif;
	font-weight: bold;
	color: #333;
	margin-top: -10px;
	margin-bottom: 30px;
	opacity:0.7;
}

.last_reged_caption {
	font-size: 18px;
	color: #555;
	text-align: center;
	margin: 15px 0;
	font-family: Arial, sans-serif;
}

.text-header2 {
	font-size:20px;
	text-align:center;
	padding-top:5px;
	padding-bottom:25px;
	font-family: Arial, sans-serif;
}

label[for="host_city-select"], label[for="from_country_select"], label[for="city_from"] {
	display:inline-block;
	width:160px;
	text-align:left;
	margin-left:10px;
}


.choose_bank_caption {
	display: inline-block;
	font-size:16px;
	line-height:24px;
	font-weight:400;
	color:#222222;
	margin-right:21px;
	height:50px;
	padding-top:12px;
	padding-bottom:14px;
}



/* Стили для блока пользователя */


/* Контейнер для новых пользователей */
.new_users_container {
	display: flex;
	flex-wrap: wrap;
	/*justify-content: space-between;*/
	gap: 20px;
	width: 100%;
	max-width: 1200px;
	margin: 20px auto;
	padding: 20px;
}


.new_user {
	background-color: #fff;
	padding: 10px;
	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
	border-radius: 8px;
	display: flex;
	flex-direction: column;
	align-items: center;
	width: calc(25% - 20px); /* Четыре колонки */
	box-sizing: border-box;
	transition: box-shadow 0.3s ease;
	font-family: Arial, sans-serif;
}

.new_user a {
	text-decoration: none;
	color: #333;
}

.new_user a:hover {
	color: #007BFF;
}

/* Анимация при наведении */
.new_user:hover {
	box-shadow: 0 6px 12px rgba(0, 0, 0, 0.2);
}

.head_interface .choose_bank_caption a{
	color: #778899;
}

.new_user a:visited{
	color: blue;
}


.new_user_name_age {
	font-size: 16px;
	font-weight: bold;
	margin-bottom: 5px;
}

.new_user_name_age a {
	font-size: 16px;
	font-weight: bold;
	color: #333;
}


.new_user_name_age a:visited {
	text-decoration: none;
	color: #333;
}

.new_user_name_age a:hover {
	color: #007BFF;
}

.new_user_name_age span {
	color: #555;
}


.new_user_data {
	text-align: center;
}

/*
.new_user_data:hover {
	background-color:#ffeac4;
}
*/

.choose_target {
	cursor:pointer;

}

.choose_target:hover {
	text-decoration: underline;
}



.new_user_time {
	font-size: 12px;
	color: #aaa;
	margin-top: 5px;
}

.background_menu {
	background-color:#e5ecf4;
}

.new_user_foto {
display:inline-block;
vertical-align:middle;
}

.main_foto_field {
	/*border: 2px solid #8b4513;*/
	width: 156px;
	height: 156px;
	text-align: center;
	position:relative;
	padding:1px;
	margin-left:auto;
	margin-right:auto;
	margin-bottom:5px;
	background-color:white;
	border: 2px solid #ddd;
	border-radius: 10px;
}

.main_foto_field img {
border-radius: 8px;
}

.main_foto_field::before {
  display: inline-block;
  height: 100%;
  vertical-align: middle;
  content: "";
}

.place_from, .place_to {
	font-size: 15px;
	color: #777;
	margin: 2px 0;
}

.place_to i, .place_from i {
	margin-right: 5px;
}


/*.login_button, .recovery_button, .search_button, .apply_target,*/
 .apply_edit_btn, .cancel_edit_btn {
  display: block;
  padding: 4px 8px;
  font-size: 14px;
  font-weight: bold;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  border: 1px solid #000;
  border-radius: 4px;
  /*background-color:#7878ff;*/
  /*color: #000;*/
  color:white;
  margin-right:auto;
  margin-left:auto;
  margin-top:12px;
}





/* Стили для кнопок отмены */
.data-block .cancel_edit_btn {
	background-color: #f44336; /* Цвет фона кнопки отмены */
}

/* Стили для кнопок применить */
.data-block .apply_edit_btn {
	background-color: #2196F3; /* Цвет фона кнопки применить */
}


.apply_edit_btn:hover {
 background-color: #0d8aee
 }

.cancel_edit_btn:hover {
background-color: #f32c1e;
}

.choose_countries {
  width:20px;
  height:20px;
  display: inline-block;
  padding: 4px 8px;
  font-size: 14px;
  font-weight: bold;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  border: 1px solid #000;
  border-radius: 4px;
  background-color: #fff;
  color: #000;
  margin-left:-10px;

  background-size: contain;
  background-repeat: no-repeat;
  background-position: 0 5px;
}

.bg_image_up {
  background-image: url('img/daw_up.svg');
}

.bg_image_down {
  background-image: url('img/daw_down.svg');
}



.choose_countries:hover {
  background-color: #f0f0f0;
  color: #333;
}



.height100 {
	height:100px;
	overflow: auto;
}


/*---Расположение иконок----------*/

.fa-house, .fa-heart, .fa-handshake {
	position:absolute;
	bottom:1px;
	right:5px;
}

.fa-house {
color:#40404b;
}

.fa-heart {
	color:red;
}

.fa-handshake {
color:#EBB998;
}

.icon_pos_class1 {
	right:25px;
}

.icon_pos_class2 {
	bottom:15px;
	right:15px;
}

.fa-arrow-right-long {
	color: #007BFF;
}

/*-----------Страница результатов поиска-----------*/


.result_label, .registr_label {
	font-size:20px;
	text-align:center;
	font-family: Arial, sans-serif;
	margin-bottom:10px;
}


.found_user {
	width:300px;
	margin-left:auto;
	margin-right:auto;
	margin-top:15px;
	
	background-color: #ffffff;
	border-radius: 10px;
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
	padding: 10px;
	text-align: center;
	flex: 1 0 30%; /* flex-grow, flex-shrink, flex-basis */
	box-sizing: border-box;
	font-family: Arial, sans-serif;
}

.found_user:hover {
	box-shadow: 0 6px 12px rgba(0, 0, 0, 0.2);
}


.foto_field {
	/*border: 2px solid #8b4513;*/
	border: 2px solid #ddd;
	width: 254px;
	height: 254px;
	text-align: center;
	position:relative;
	
	border-radius: 10px;
	margin: 0 auto 5px;
	/*width: 90px;
	height: 90px;*/
	/*object-fit: cover;*/
	
}

.foto_field::before {
  display: inline-block;
  height: 100%;
  vertical-align: middle;
  content: "";
}

.found_user_foto {
display:inline-block;
vertical-align:middle;

border-radius: 10px;

}

.find_user_name_age {
	font-size: 16px;
	font-weight: bold;
	margin-bottom: 5px;
}

.find_user_name_age a {
	font-size: 16px;
	font-weight: bold;
	color: #333;
	text-decoration: none;
}



.find_user_name_age a:visited{
	color: #333;
	text-decoration: none;
}

.find_user_name_age a:hover {
	color: #007BFF;

}




/*--------Страница анкеты пользователя-------------*/

.user-header, .delete-header {
	font-size:22px;
	text-align:center;
	padding-top:10px;
	font-family: Arial, sans-serif;
}

.last_visit {
	/*margin-right:auto;
	margin-left:auto;*/
	text-align:center;
	padding-bottom:35px;
	margin-top:5px;
	font-family: Arial, sans-serif;
	font-size:15px;
}


.last_visit_time {
	display:inline-block;
	margin-left:10px;

}

.last_visit_time_online {
	font-size:17px;
}

.fa-clock {
	display:inline-block;
}


.main_foto {
display:inline-block;
vertical-align:middle;

border-radius: 10px;
width: 100%;
max-width: 650px;
height: auto;
object-fit: cover;

}


.foto-viewer {
cursor:pointer;
position:relative;
/*
width:654px;
height:654px;
text-align: center;
background-color:#ffffeb;
*/
}


/*
.foto-viewer::before {
  display: inline-block;
  height: 100%;
  vertical-align: middle;
  content: "";
}
*/

.photo_stub {
	cursor:default;
}


.foto-preview {
	/*height:150px;
	cursor:pointer;*/
	
	margin: 5px;
	border-radius: 10px;
	width: 100px;
	height: 100px;
	object-fit: cover;
	cursor: pointer;
	transition: transform 0.3s ease;
	
}


.foto-preview:hover, .img_selected {
	transform: scale(1.1);
	border: 2px solid #007bff;
}

.foto-block {
	display:inline-block;
	min-width:660px;
	width:660px;
	
	background-color: #ffffff;
	border-radius: 10px;
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
	text-align: center;
	
}

/*
.img_selected {
	border: 4px solid brown;
	box-sizing:border-box;
	padding:2px;
}
*/

.user_data_container {
	display: flex; /* Использование гибкой компоновки */
	/*align-items: center;*/ /* Выравнивание по центру */
	justify-content:center;
}

.main_foto_full {
display:inline-block;
vertical-align:middle;
position:relative;
z-index:1;
}

.foto-viewer-full {
/*width:1000px;*/
width:100%;
height:1000px;
margin-right:auto;
margin-left:auto;
/*background-color:#434343;*/

text-align: center;
position:fixed;
/*position:absolute;*/
top:0px;
/*left:100px;*/
left:0;
}

.overlay {
width:100%;
height:100%;
top:0;
left:0;
position:absolute;
background-color:#434343;
z-index:0;
opacity:0.9;
}

.foto-viewer-full::before {
  display: inline-block;
  height: 100%;
  vertical-align: middle;
  content: "";
}

.left-arrow, .right-arrow {
	width:40px;
	cursor:pointer;
	position:absolute;
	top:480px;
	opacity:0.8;
}

.left-arrow  {
	left:3px;
}


.right-arrow {
	right:3px;
}

.close_viewer {
	width:40px;
	height:40px;
	cursor:pointer;
	position: absolute;
	top: 10px; 
	right: 10px;
	opacity:0.7;
}

.left-arrow:hover, .right-arrow:hover, .close_viewer:hover {
	opacity:1;
}

.data-block {
	display:inline-block;
	/*width:450px;*/
	width:fit-content;
	min-width:500px;
	max-width:800px;
	font-size:16px;
	vertical-align:top;
	margin-left:20px;
	
	
	font-family: 'Arial', sans-serif;
	/*background-color: #f9f9f9; */
	padding: 20px; 
	border-radius: 10px; 
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); 
	/*margin: 20px 0; */
}

.list_goals {
	padding-left:10px;
	
	margin: 10px 0; 
	
}

/*
.snd_msg_btn {
	margin-bottom:20px;
	margin-left:20px;
	height: 50px;
	background-color:#90ee90;
	width:150px;
	border-radius:10px;
	text-align:center;
	cursor:pointer;
	padding-top:2px;
}

.snd_msg_link {
text-decoration:none;
color:black;
}


.snd_msg_btn:hover {
background-color:#7aeb7a;
}
*/


/* Стили для ссылки, содержащей кнопку */
.snd_msg_link {
	text-decoration: none; /* Убираем подчеркивание текста */
	display: inline-block; /* Отображаем элемент как inline-block для возможности изменения размеров */
	margin: 20px 0; /* Отступы сверху и снизу */
}

/* Стили для кнопки внутри ссылки */
.snd_msg_btn {
	font-family: 'Arial', sans-serif;
	background-color: #4CAF50; /* Цвет фона */
	color: white; /* Цвет текста */
	padding: 10px 20px; /* Внутренние отступы */
	border: none; /* Убираем границу */
	border-radius: 5px; /* Скругляем углы */
	font-size: 16px; /* Размер текста */
	font-weight: bold; /* Жирность текста */
	text-align: center; /* Выравнивание текста по центру */
	cursor: pointer; /* Курсор в виде руки при наведении */
	transition: background-color 0.3s; /* Плавный переход изменения цвета фона */
}

.snd_msg_btn:hover {
	background-color: #45a049; /* Цвет фона при наведении */
}


.page_deleted {
	border: 2px solid #7878ff;
	border-radius:15px;
	text-align:center;
	padding:10px;
	width:450px;
	margin: 0 auto;
	margin-top:30px;
}

.page_deleted img {
	width:40px;
	vertical-align:middle;
	margin-right:15px;
}

.page_deleted_lbl {
	display:inline-block;
	font-size:24px;
	vertical-align:middle;
}




/*----Правка анкеты-------------*/

.need_auth_for_massage {
	color:#008000;
	width:270px;
	margin-bottom:10px;
	/*margin-left:10px;*/
	font-weight:bold;
	
	
	font-family: 'Arial', sans-serif; /* Шрифт */
	background-color: #f9f9f9; /* Цвет фона */
	/*color: #333; /* Цвет текста */
	padding: 10px 20px; /* Внутренние отступы */
	border-radius: 10px; /* Скругленные углы */
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); /* Тень */
	font-size: 16px; /* Размер текста */
	text-align: center; /* Выравнивание текста по центру */
	margin: 20px 0; /* Отступы сверху и снизу */
	width: fit-content; /* Ширина по содержимому */
	margin-left: auto; /* Центрирование блока */
	margin-right: auto; /* Центрирование блока */
	
	
}

.edit_data_btn, .edit_goals_btn, .edit_gender_btn, .edit_age_btn, .edit_city_btn, .edit_country_btn, .edit_city_from_btn, .edit_interests_btn, .edit_about_me_btn, .add_photos_btn, .send_photos_btn, .del_added_photos_btn, .open_form_load_fotos_btn, .edit_height_btn, .edit_weight_btn, .prereg_button {
  display: inline-block;
  vertical-align:middle;
  margin-left:10px;
  text-align: center;
 /* width:108px;
  height:30px;
  padding: 3px 4px;
  font-size: 14px;
  font-weight: bold;
  text-decoration: none;
  cursor: pointer;
  border: 1px solid #000;
  border-radius: 4px;
  background-color: #fff;
  color: #000;
 */
 
font-family: 'Arial', sans-serif;
	background-color: #4CAF50; /* Цвет фона кнопки */
	color: white; /* Цвет текста кнопки */
	padding: 5px 10px; /* Внутренние отступы кнопки */
	border: none; /* Убираем границу */
	border-radius: 5px; /* Скругленные углы */
	font-size: 14px; /* Размер текста */
	cursor: pointer; /* Курсор в виде руки при наведении */
	transition: background-color 0.3s; /* Плавный переход изменения цвета фона */
	/*margin-top: 10px;*/ /* Отступ сверху */

}

 .edit_interests_btn, .edit_about_me_btn {
	margin-top:5px;
 }



.add_photos_btn, .del_added_photos_btn, .open_form_load_fotos_btn {
	display:block;
	margin-top:10px;
	width:125px;
	margin-left:auto;
	margin-right:auto;
}

.send_photos_btn {
	margin-top:10px;
	width:125px;
	margin-bottom:10px;
}


.del_added_photos_btn {
	background-image: url('img/clear_icon2.png');
	background-size: contain; /* Изображение будет увеличено или уменьшено так, чтобы полностью поместиться в контейнере */
	background-repeat: no-repeat;
	background-position: 5px;
}

.edit_data_btn:hover, .edit_goals_btn:hover, .edit_gender_btn:hover, .edit_age_btn:hover, .edit_city_btn:hover, .edit_country_btn:hover, .edit_city_from_btn:hover, .edit_interests_btn:hover, .edit_about_me_btn:hover, .add_photos_btn:hover, .send_photos_btn:hover, .del_added_photos_btn:hover, .open_form_load_fotos_btn:hover, .edit_height_btn:hover, .edit_weight_btn:hover, .prereg_button:hover, .reg_button:hover {
  background-color: #f0f0f0;
  color: #333;
}

.list_goals, .view_gender, .view_age, .view_city, .view_country, .view_city_from, .view_interests, .view_about_me, .view_height, .view_weight {
	 display: inline-block;
	 vertical-align:middle;
}

.cancel_edit_btn, .apply_edit_btn {
	display:inline-block;
}

.form_edit_goals {
	margin-bottom:11px;
}

.form_change_password {
	margin-top:5px;
}



/* Стили для форм редактирования */
.data-block .form_edit_goals,
.data-block .form_edit_gender,
.data-block .form_edit_age,
.data-block .form_edit_height,
.data-block .form_edit_weight,
.data-block .form_change_password,
.form_edit_city, .form_edit_country, .form_edit_city_from, .form_edit_interests, .form_edit_about_me
{
	background-color: #fff; /* Цвет фона форм */
	padding: 10px; /* Внутренние отступы форм */
	border: 1px solid #ddd; /* Граница форм */
	border-radius: 5px; /* Скругленные углы */
	margin-top: 10px; /* Отступ сверху */
}



input[name="change_city_from"], input[name="change_pass_old"], input[name="change_pass_new"], input[name="change_pass_new_confirm"] {
	border: 1px solid black;
	border-radius: 4px;
	padding:5px;
}

input[name="change_height"], input[name="change_weight"] {
	border: 1px solid black;
	border-radius:4px;
	width:100px;
	padding:5px;
}

textarea[name="change_interests"], textarea[name="change_about_me"] {
	width:440px;
	height:170px;
	border: 1px solid black;
	border-radius:5px;
	padding:5px;
}

.notif_img {
	width:20px;
	vertical-align:middle;
}

.apply_target {
  margin-bottom:5px;
  margin-top:5px;
}

.align_center {
	text-align:center;
}

.align_center2 {
	display:block;
	margin: 0 auto;
	width: max-content;
	margin-top:30px;
}

/*------Удаление страницы--------------*/
/*.delete_page_link {
	text-decoration:none;
	color: inherit;
}

.delete_page_btn {
	background-color:#ffc0cb;
	border-radius:7px;
	padding:10px;
	opacity:0.9;

}

.delete_page_btn:hover{
	opacity:1;
}

.del_page_form {
	margin-left:auto;
	margin-right:auto;
	padding:10px;
	width:800px;
	background-color:#e6def7;
	text-align:center;
	border-radius:10px;
}

.delete-caption {
	width: max-content;
	display:block;
	margin-left:auto;
	margin-right:auto;
	font-size:17px;
	font-weight:bold;
	margin-bottom:7px;
}

.suggest_comment {
	font-weight:bold;
}

 textarea[name="goodbye_comment"] {
	width:640px;
	height:170px;
	border: 1px solid black;
	padding:3px;
	resize: none;
	margin-top:5px;
}

.delete_page_goback {
	background-color:#32cd32;
	border-radius:7px;
	padding:10px;
}

.delete_page_exec {
	background-color:#ff4500;
	border-radius:7px;
	padding:10px;
}

.delete_page_goback:hover {
	background-color:#2db92d;
}

.delete_page_exec:hover{ 
background-color:#e63e00;	
}

*/


  /* Общие стили */
	.btn {
		border-radius: 7px;
		padding: 10px;
		cursor: pointer;
		transition: background-color 0.3s ease;
	}

	/* Стили для ссылок */
	.link {
		text-decoration: none;
		color: inherit;
	}

	/* Стили для формы */
	.form-container {
		margin: 0 auto;
		padding: 20px;
		max-width: 800px;
		background-color: #f8f8f8;
		border-radius: 10px;
		text-align: center;
	}

	/* Стили для заголовка */
	.del-header {
		font-size: 20px;
		font-weight: bold;
		margin-bottom: 20px;
		text-align:center;
	}

	/* Стили для текстовых полей */
	.text-input {
		width: 100%;
		padding: 10px;
		margin: 10px 0;
		border: 1px solid #ccc;
		border-radius: 5px;
		box-sizing: border-box;
		resize: none;
	}

	/* Стили для кнопок */
	.btn-primary {
		/*background-color: #007bff;*/
		background-color: #7878ff;
		color: #fff;
		border: none;
	}

	.btn-primary:hover {
	   /* background-color: #0056b3;*/
	   background-color: #5f5fff;
	}

	.btn-secondary {
		background-color: #6c757d;
		color: #fff;
		border: none;
	}

	.btn-secondary:hover {
		background-color: #5a6268;
	}





.not_for_unauthorized {
	width:700px;
	margin-left:auto;
	margin-right:auto;
	font-size:17px;
	font-weight:bold;
	margin-bottom:7px;
	border:2px solid #5f9ea0;
	border-radius:15px;
	padding:30px;
	
}


/*
.change_pass_btn {
	margin-top:5px;
	margin-bottom:5px;
	cursor:pointer;
	color: blue;
	
}*/


/* Стили для кнопок смены пароля и удаления страницы */
.change_pass_btn, .delete_page_btn {
	background-color: #ff9800; 
	padding: 10px 15px;
	font-size: 16px; 
	margin-top: 20px; 
	color: white;
	width:170px;
	
	border-radius: 5px; 
	font-size: 14px; 
   
	transition: background-color 0.3s;
}

.change_pass_btn:hover, .delete_page_btn:hover {
	background-color: #e68900
}



/*----Редактирование изображений----------*/

/*--Удаление--*/

.del_foto_form {
	position:absolute;
	top:3px;
	right:5px;
}

.del_foto_btn {
  width:50px;
  height:60px;  
  background-size: contain;
  background-repeat: no-repeat;
  background-position: 0 5px;
  background-image: url('img/del.png');
  opacity:0.5;
}

.del_foto_btn:hover {
	opacity:0.9;
}


/*--Сделать основной--*/

.main_foto_label {
  width:100px; 
	position:absolute;
	top:3px;
	left:5px;
}

.make_foto_main_form {
	position:absolute;
	top:3px;
	left:5px;
}

.make_foto_main_btn {
  width:50px;
  height:60px;  
  background-size: contain;
  background-repeat: no-repeat;
  background-position: 0 5px;
  background-image: url('img/main_foto_btn.png');
  opacity:0.5;
}

.make_foto_main_btn:hover {
	opacity:0.9;
}


/*----Загрузка фото-------*/
.preview_foto {
	height:100px;
}

#imagePreview {
	margin-top:8px;
}

.count_foto_caption {
	font-weight:bold;
	/*color:green;*/
	width:601px;
	margin: 8px 0; /* Отступы между абзацами */
}

.load_fotos_form {
	position:relative;
	margin-top:10px;
	font-family: 'Arial', sans-serif; 
	font-size: 14px; 
	border-radius: 10px; 
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); 
	padding: 15px 25px 0; 
}


/*
.loading_info {
	font-family: 'Arial', sans-serif; 
	background-color: #f9f9f9; 
	color: #333; 
	padding: 15px 25px; 
	padding-top:30px;
	border-radius: 10px; 
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); 
	font-size: 16px; 
	margin: 20px 0; 
	width: fit-content; 
	margin-left: auto; 
	margin-right: auto; 
	text-align: left; 
}*/


.close_load_fotos_form_btn {
	width:25px;
	position:absolute;
	top:5px;
	right:15px;
	opacity:0.8;
	cursor:pointer;
}

.close_load_fotos_form_btn:hover {
	opacity:1;
}


.green_cl {
	color: #28a745; /* Зелёный цвет текста */
}

.blue_cl {
	color: #007bff; /* Синий цвет текста */
}


/*
.green_cl {
	color:green;
}

.blue_cl {
	color:blue;
}
*/

.red_cl {
	color:red;
}




/* Стили для информационной формы */

.info_form {
  width:500px;
  margin: 0 auto 20px;
  padding: 20px;
  border: 1px solid #ddd;
  border-radius: 8px;
  background-color: #fff;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
  position:relative;
  font-family: Arial, sans-serif;
}

.info_form_icon {
   width:25px;
   position:absolute;
   top:3px;
   left:5px;
}

.info_form_label {
   width:100px;
   display:block;
   margin-left:auto;
   margin-right:auto;
  font-weight:bold;
}

.info_form_caption {
	margin-bottom:10px;
}

.note_msg {
	text-align:center;
}

/*--------------------------*/

.font_bold {
	font-weight:bold;
}

.font_bold2 {
	font-weight:bold;
	font-size:18px;
}

.final_note {
	text-align:center;
}

.info_form_close_btn {
	width:24px;
	position:absolute;
	top:3px;
	right:5px;
	cursor:pointer;
	opacity:0.7;
}

.info_form_close_btn:hover, .complain_form_close_btn:hover {
	opacity:1;
}

/*-----------Регистрация---------------*/

input[name="email"], input[name="date_of_birth"], input[name="code_confirm"], input[name="first_name"], input[name="reg_city_from"], input[name="reg_height"], input[name="reg_weight"], input[name="password_reg"], input[name="password_confirm_reg"] {
	border: 1px solid black;
	width:200px;
	margin-left:5px;
	padding:3px;
	border-radius:4px;
}

label[class="lbl_prereg"] {
	font-size:18px;
	width:260px;
	display:inline-block;
	font-weight:bold;
}

.prereg_form, .reg_form, .rec_form, .recovery_form {
	margin-top:25px;
}

.email_prereg_container {
	margin-bottom:10px;
}



.prereg_button {
	margin-top:12px;
	margin-left:0;
}

.pale-red {
	background-color:#ffc4c4;
}

.prereg_date_of_birth_err, .prereg_email_err, .reg_first_name_err, .reg_goals_err, .reg_city_from_err, .reg_height_err, .reg_weight_err, .reg_common_err, .reg_password_err, .prereg_reading_rules_err {
	color:red;
}

.code_confirm_form {
	margin-top:40px;
	/*text-align:center;*/
}

 input[name="code_confirm"]  {
	 margin-top:10px;
	 margin-left:0;
	 margin-right:5px;
 }
 
 .code_confirm_btn, .code_resend_request_btn {
  /*display: block;*/
  padding: 4px 8px;
  font-size: 14px;
  font-weight: bold;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  border: 1px solid #000;
  border-radius: 4px;
  margin-top:12px;
}
	 
.code_resend_request_btn {
	background-color:#9292ff;
	color:black;
	margin-right:5px;
}

.code_resend_request_btn:hover {
	background-color:#7878ff;
}

select[name="gender_reg"] {
	border: 1px solid black;
	margin-left:5px;
	font-size:18px;
}

.field_reg_container {
	margin-bottom:10px;
}

.reg_button {
	margin-top:12px;
	margin-left:0;
  width:158px;
  height:30px;
  display: inline-block;
  padding: 3px 4px;
  font-size: 14px;
  font-weight: bold;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  border: 1px solid #000;
  border-radius: 4px;
  background-color: #fff;
  color: #000;
vertical-align:middle;
}

.recovery_form {
	width:500px;
}

.recovery_form .reg_button {
	margin-top:12px;
	margin-left:auto;
	margin-right:auto;

}

.reg_radio {
	margin-top:3px;
}

textarea[name="reg_interests"], textarea[name="reg_about_me"] {
	width:500px;
	height:200px;
	border: 1px solid black;
	padding:2px;
	vertical-align:middle;
	border-radius:4px;
}

.reg_goals_err {
	vertical-align:middle;
}

.reg_list_goals {
	display:inline-block;
	width:260px;
	vertical-align:middle;
}

.code_validity_expired {
	margin-top:25px;
	font-weight:bold;
}

input[name="password_reg"], input[name="password_confirm_reg"] {
	margin-bottom:5px;
	margin-left:0;
}

.mini_text {
	font-size:15px;
}


/*------------Сообщения--------------*/


.message_main_container {
	display:flex;
	justify-content:center;
	/*justify-content:space-between;*/
}


.interlocutor_list {
width:345px;
display:inline-block;
/*padding:4px;*/
padding-right: 4px;
vertical-align:top;
height:680px;
overflow-y:auto;

border-right: 1px solid #ddd;

}


.interlocutor_list a, .message_area_header a {
	text-decoration:none;
	color: inherit;
}

.interlocutor, .interlocutor_mes_field {
	cursor:pointer;
	margin-bottom:10px;
	position:relative;
	border-radius:8px;
	font-family: Arial, sans-serif;
}

.interlocutor {
 background-color: #f9f9f9;
 transition: background-color 0.3s ease;
}

.interlocutor:hover, .interlocutor_mes_field:hover {
/*background-color:#e7ffe7;*/
  background-color: #e9f5ff;
}

.interlocutor_mes_field {
	padding-right:10px;
}

.interlocutor_selected {
	/*background-color:#eaffe7;*/
	background-color: #e9f5ff;
}

.interlocutor_photo {
	/*width:60px;
	height:50px;
	border-radius:10px;
	vertical-align:middle;*/
	display:inline-block;
	vertical-align:middle;
}

.interlocutor_photo_no_inrs {
	width:60px;
	height:60px;
	border-radius:10px;
	vertical-align:middle;
	display:inline-block;
	vertical-align:middle;
}

.interlocutor_photo_container {
	display:inline-block;
	width:68px;
	height:68px;
	border-radius:10px;
	vertical-align:middle;
	text-align: center;
	border: 1px solid grey;
	background-color:white;
}


.interlocutor_photo_container::before {
  display: inline-block;
  height: 100%;
  vertical-align: middle;
  content: "";
}


.interlocutor_data_container {
	display:inline-block;
	vertical-align:middle;
	margin-left:5px;
}

.interlocutor_data {
	font-size:17px;
	font-weight:bold;
	display:inline-block;
}

.interlocutor_data:hover {
	color:#ff6500
}

.interlocutor_from_to {
	margin-top:5px;
	
	 font-size: 13px;
	
}

.message_area {
	/*width:772px;*/
	width:790px;
	border: 5px solid #f9f9f9;
	padding:4px;
	border-radius:10px;
	display:inline-block;
	vertical-align:top;
	margin-left:5px;
}

.message_area_header {
	border-bottom: 1px solid #e2e2e2;
	display:flex;
	flex-wrap:wrap;
	align-items:flex-start;/*чтобы кнопка была выравнена поверху*/
	justify-content:space-between;
	padding-right:10px;
	position:relative;
	
}

.dialog_action_button {
	cursor:pointer;
}

.complain_form {
	position:absolute;
	top:0;
	right:100px;
	z-index:1;
	/*background-color:#faf1fa;
	padding:10px;
	padding-top:15px;
	border-radius:10px;
	border: 1px solid grey;*/
	
	 width: 100%;
	 max-width: 800px;
	 margin: 0 auto;
	 padding: 20px;
	 border: 1px solid #ccc;
	 border-radius: 5px;
	 background-color: #f9f9f9;
	 box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
	 font-family: Arial, sans-serif;
	
}

.complain_label {
	/*font-weight:bold;
	width:98%;
	text-align:center;
	display:block;*/
	font-size: 1.2em;
	font-weight: bold;
}

.complain_form_close_btn {
	width:28px;
	position:absolute;
	top:3px;
	right:5px;
	cursor:pointer;
	opacity:0.7;
}

textarea[name="complain"] {
	/*width:750px;
	height:350px;
	
	border-radius:5px;
	padding:3px;
	border:1px solid black;*/
	
	 width: 100%;
	 height: 300px;
	 padding: 10px;
	 border: 1px solid #ccc;
	 border-radius: 5px;
	 font-size: 1em;
	 resize: none;
	 box-sizing: border-box;
}

.send_complain_btn{
  display: block;
  /*padding: 4px 8px;
  font-size: 14px;
  font-weight: bold;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  border: 1px solid #000;
  border-radius: 4px;
  background-color:#7878ff;*/
  color:white;
  margin-right:auto;
  margin-left:auto;
  margin-top:12px;
  
  padding: 10px 20px;
  background-color: #007bff;
  border: none;
  border-radius: 5px;
  cursor: pointer;
  font-size: 1em;
}

.send_complain_btn:hover {
  /*background-color: #5f5fff;*/
 background-color: #0056b3;
}



.action_form {
	position:absolute;
	top:-5px;
	right:0px;
	/*border-radius:7px;
	background-color:#f5f5f5;
	padding:10px;
	line-height: 2;
	padding-right:20px;*/
	z-index:1002;
	
	background-color: #f9f9f9;
	border: 1px solid #ddd;
	border-radius: 8px;
	padding: 15px 25px;
	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
	max-width: 300px;
	margin: 20px auto;
	font-family: Arial, sans-serif;
	
}


.action_form p, .action_form button {
	color: #333;
	font-size: 16px;
	margin: 10px 0;
	cursor: pointer;
	transition: color 0.3s;
}

.action_form p:hover, .action_form button:hover {
	color: #007BFF;
}

.complain_length {
		/*font-size: 0.9em;*/
		color: #666;
	}

/*

.cl_red2, .complain, .send_block_btn {
	color:#ff4500;
}


.send_unblock_btn {
	color:#00b300;
}

.send_unblock_btn:hover {
	color:#009a00;
}

 .complain:hover, .send_block_btn:hover {
	color:#e63e00;
}





.action_form  {
	display: flex;
	flex-direction: column;
	gap: 10px;
	margin-top: 10px;
}

.action_form  {
	background-color: #007BFF;
	color: #fff;
	border: none;
	border-radius: 5px;
	padding: 10px;
	font-size: 16px;
	cursor: pointer;
	transition: background-color 0.3s;
}

.action_form {
	background-color: #0056b3;
}

*/






.message_field {
	height:480px;
	border-bottom: 1px solid #e2e2e2;
	padding-top:20px;
	overflow:auto;
	padding-bottom:20px;
}

.send_msg_form {
	position:relative;
}


/*----Смайлы-----*/

.smile_btn {
	height:30px;
	margin-left:15px;
	margin-right:5px;
	opacity:70%;
	cursor:pointer;
	margin-bottom:10px;
}

.smile_btn:hover {
	opacity:100%;
}


.emojiTable {
	  border-collapse: collapse;
	  position:absolute;
	  left:0;
	  bottom:120px;
	  /*background-color:white;*/
	  
	  
	width: 100%;
	max-width: 450px;
	margin: 20px auto;
	background-color: #f9f9f9;
	border: 1px solid #ddd;
	border-radius: 8px;
	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
	  
	}

.emojiTable td {
	  /*padding: 5px;*/
	  cursor:pointer;
	  
	width: 30px;
	height: 30px;
	text-align: center;
	vertical-align: middle;
	padding: 10px;
	font-size: 20px;
	transition: background-color 0.3s, transform 0.3s;
	border: 1px solid #ddd;
	}
	
	.emojiTable td:hover {
	background-color: #f0f0f0;
	transform: scale(1.1);
}

/*-----------------*/


/*
textarea[name="msg"], .mes_unval {
	margin-top:4px;
	width:92%;
	font-size:16px;
	padding:2px;
	background-color:#ececec;
	resize: none;
	border-radius:5px;
}*/

textarea[name="msg"], .mes_unval  {
	width: calc(100% - 60px);
	height: 50px;
	margin-bottom: 10px;
	padding: 10px;
	border: 1px solid #ddd;
	border-radius: 8px;
	resize: none;
}

.mes_unval {
height:40px;	
}

textarea[name="msg"] {
	padding-right:30px;
	height: 120px;
}

/*
textarea[name="msg"]::after {
	content:"";
	display:block;
	width:40px;
	height:120px;
	background-color:green;
	position:absolute;
	top:0;
	right:5px;
}
*/

.mes_unval {
	text-align:center;
	margin-left:auto;
	margin-right:auto;
}


.mes_unval::before {
  display: inline-block;
  height: 100%;
  vertical-align: middle;
  content: "";
}


/*textarea[name="msg"]::placeholder {
	 text-align: bottom;
}*/

.send_msg_btn {
  width:30px;
  height:40px;  
  background-size: contain;
  background-repeat: no-repeat;
  background-position: 0 5px;
  background-image: url('img/send_msg_btn.png');
  opacity:0.5;
  position:absolute;
  top:5px;
  /*right:12px;*/
  right:24px;
}

.send_msg_btn:hover {
	opacity:0.9;
}


.msg_date {
	width: max-content;
	margin-right:auto;
	margin-left:auto;
	color:#676767;
	font-size:14px;
}

.msg_from_me {
	/*min-width:90px;*/
	width: max-content;
	max-width:500px;
	/*background-color:#7878ff;*/
	 background-color: #e9f5ff;
	padding:8px;
	border-radius:5px;
	margin-left:auto;
	margin-right:5px;
	margin-top:10px;
	margin-bottom:10px;
	/*color:white;*/
	position:relative;
	padding-bottom:20px;
}

.msg_to_me {
	/*min-width:90px;*/
	width: max-content;
	max-width:500px;
	/*background-color:#f7f7f7;*/
	background-color: #f1f1f1;
	padding:8px;
	border-radius:5px;
	margin-right:auto;
	margin-left:5px;
	margin-top:10px;
	margin-bottom:10px;
	position:relative;
	padding-bottom:20px;
}

.pdng_btm_8 {
	padding-bottom:8px;
}

.msg_time {
/*margin-left:5px;*/
font-size:12px;
/*color:#676767;
color:#f5f5f5;*/
}

.msg_status {
	width:15px;
	margin-left:3px;
}

.msg_time_status {
	position:absolute;
	right:4px;
	bottom:2px;
}

.last_visit_locutor {
	/*text-align:center;*/
	color:grey;
	font-size:13px;
	margin-top:2px;
}

.new_msg_count {
font-weight:bold;
/*color:#2fffe9;*/
color:#ff7f00;
vertical-align:top;
margin-left:4px;
}

.online_lbl {
	width:8px;
	height:8px;
	background-color:#1bfb00;
	border-radius:50%;
	position:absolute;
	top:2px;
	left:4px;
}


.online_lbl_user {
	display: inline-block;
	margin-right:5px;
	width:10px;
	height:10px;
	background-color:#1bfb00;
	border-radius:50%;
}




/*---footer-----*/



.footer {
	background-color: #f0f0f0;
	padding:15px;
	 position: relative; 
	 margin-top:5px;
}

.logo {
	display:inline-block;
	width:100px;
	vertical-align:middle;
}

.footer-header {
	display:inline-block;
	/*display:inline;*/
	width:90%;
	vertical-align:middle;
	font-size:22px;
	/*margin-left:300px;*/
	text-align:center;
}

.rule_header {
	font-weight:bold;
	font-size:18px;
	margin-bottom:3px;
	margin-top:8px;
}

.rules {
	width:115px;
	margin-left:auto;
	margin-right:auto;
	font-size:15px;
	margin-top:-10px;
	font-family: Arial, sans-serif;
}

.footer-menu {
	width:140px;
	position: absolute;
	bottom:10px;
	right: 0;
	font-size:14px;
}

.mailto {
	text-decoration:none;
	color:inherit;
}

.mailto:hover {
	text-decoration:underline;
}

/*
.footer-menu p {
	display:inline-block;
}

.footer-menu p:first-child {
	margin-right:50px;
}
*/






/*
	.footer {
		background-color: #f0f0f0;
		padding: 20px;
		text-align: center;
	}

	.footer .logo {
		width: 100px;
		height: 100px;
	}

	.footer .footer-header {
		font-size: 20px;
		margin-top: 8px;
	}

	.footer .footer-menu {
		margin-top: 20px;
	}

	.footer .footer-menu p {
		display: inline;
		margin: 0 10px;
		font-size: 14px;
	}

	.footer .footer-menu p:first-child {
		margin-left: 0;
	}
	
	*/
	
	
	/*-----------Правила----------------*/


.rules_container {
	background-color: #fff;
	padding: 10px;
	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
	border-radius: 8px;
	box-sizing: border-box;
	transition: box-shadow 0.3s ease;
	font-family: Arial, sans-serif;
	line-height:1.25;
}