/* HTML styles */
body{
	-ms-user-select: none; 
		-moz-user-select: none; 
		-webkit-user-select: none; 
		user-select: none;
}
text{
	-ms-user-select: none; 
		-moz-user-select: none; 
		-webkit-user-select: none; 
		user-select: none;
}
		.text-labels{
			margin-left: -47px!important;
    			margin-top: 0px!important;
    			width: 38px!important;
    			height: 24px!important;
			font-weight: 700!important;
			text-align: center!important;
			white-space: nowrap;
			display: flex;
			justify-content: center;
		}
		.myIcon{
			margin-left: -50.0209px!important;
    		        margin-top: -36.2297px!important;
		}

		/* SVG styles */
		svg {
			-ms-flex-preferred-size: 100%;
			    flex-basis: 100%;
		}
		.round {
			border-radius: 50%;
		}
		#new_map .leaflet-marker-icon.leaflet-zoom-animated.leaflet-interactive{
			border-radius: 100px;
		}
		.new_map_container{
			position: absolute;
			left:0;
			top:0;
			width:100%;
			height:100%;
			display:none;
			z-index: 1;
		}
		.new_map_container.active{
			display: block;
		}
		#new_map{
			width:100%;
			height:100%;
			z-index: 3;
		}
		.new_map_close{
			display:block;
			position: absolute;
			top: 10px;
			right: 10px;
			cursor: pointer;
			width: 30px;
    			height: 29px;
    			text-align: center;
    			background-color: #fff;
    			font-weight: 900;
    			border-radius: 6px;
    			border: 2px solid rgba(0,0,0,0.2);
			z-index: 13;
		}
		.pagination_block{
			display: flex;
    			position: absolute;
    			bottom: 0;
    			left: 50%;
    			width: 300px;
    			margin-left: -150px;
			align-items: center;
    			justify-content: space-between;
			z-index:2;
		}

		#btn_prev, #btn_next {
			text-decoration: none;
    			color: #fff;
    			background-color: #8b0000;
    			padding: 20px 27px;
    			border-radius: 50px;
    			font-weight: 700;
		}

		image.userPortrait {
			width: 128px;
			height: 128px;
			x: -64px;
			y: -64px;
		}

		image.friendPortrait {
			width: 64px;
			height: 64px;
			x: -32px;
			y: -32px;
		}

		image.filtered {
			width: 32px;
			height: 32px;
			x: -16px;
			y: -16px;
		}

		.userName, .friendName {
			text-anchor: middle;
		}
 
		.close_auth_icon{
			color: #8b0000;
			font-size: 21px;
		}
		text.filtered {
			font-size: 10px;
		}

		.svg_elem{
			-ms-user-select: none; 
		-moz-user-select: none; 
		-webkit-user-select: none; 
		user-select: none;
		}

		dialog {
			position: absolute;
			padding: 40px;
			top: 30%;
			width: 550px;
			left:50%;
			margin-left: -275px;
			display: none;
			-webkit-box-orient: vertical;
			-webkit-box-direction: normal;
			    -ms-flex-direction: column;
			        flex-direction: column;
			-webkit-box-align: center;
			    -ms-flex-align: center;
			        align-items: center;
			-webkit-box-sizing: content-box;
			        box-sizing: content-box;
			border: solid black 1px;
			z-index: 2;
			background-color: white;
			z-index: 1000;
		}
		dialog form {
			display: -webkit-box;
			display: -ms-flexbox;
			display: flex;
			-webkit-box-pack: justify;
			    -ms-flex-pack: justify;
			        justify-content: space-between;
			-webkit-box-sizing: content-box;
			        box-sizing: content-box;
		}

		dialog form input {
			margin-right: 5px;
		}

		dialog #agreementDialog .btn {
			margin-left: auto;
		}

		.ya-share2__container_shape_round.ya-share2__container_size_l .ya-share2__badge .ya-share2__icon:not(.ya-share2__icon_messenger-contact):not(.ya-share2__icon_more):not(.ya-share2__icon_copy) {
    		background-size: 100px 100px !important;
			}

			.ya-share2__container_size_l .ya-share2__badge .ya-share2__icon {
				height: 100px !important;
				width: 100px !important;
			}

		.share {
			width: 100px;
			height: 100px;
			cursor: pointer;
		}

		.custom-share {
			margin-top: 5px;
		}

		#filter {
			display: -webkit-box;
			display: -ms-flexbox;
			display: flex;
			-webkit-box-pack: justify;
			    -ms-flex-pack: justify;
			        justify-content: space-between;
		}

		#filter img {
			height: 20px;
		}

		#filter button {
			margin-left: 3px;
		}

		button.close {
			margin-bottom: 5px;
			margin-left: auto;
			border-radius: 25%;
		}

		.btn-group {
			margin-top: 3px;
		}

		#rootList {
			min-width: 300px;
		}

		#rootList li {
			display: -webkit-box;
			display: -ms-flexbox;
			display: flex;
			-webkit-box-align: center;
			    -ms-flex-align: center;
			        align-items: center;
			margin-top: 3px;
		}

		#rootList li .editElement{
			margin-left: auto;
			margin-right: 2px;
		}

		#keyTypesBtns {
			margin-bottom: 3px;
		}

		.keytype img {
			width: 25px;
			height: 25px;
		}

		.oauthButton {
			margin-top: 3px;
			width: 90%;
			display: -webkit-box;
			display: -ms-flexbox;
			display: flex;
			-webkit-box-pack: justify;
			    -ms-flex-pack: justify;
			        justify-content: start;
			-webkit-box-align: center;
			    -ms-flex-align: center;
			        align-items: center;
			padding: 10px 20px;
    			margin-top: 25px;
    			border-radius: 11px;
			
		}

		.oauthButton i {
			font-size: 20px;
			transition: .6s;
		}
		.fab.fa-vk{
			margin-right: 39px;
    			background-color: #549bda;
    			padding: 10px;
    			border-radius: 100px;
    			filter: drop-shadow(2px 4px 6px black);
		}
		.fab.fa-odnoklassniki{
			background-color: #f56622;
    			padding: 10px 20px;
    			border-radius: 100px;
    			filter: drop-shadow(0px 4px 6px black);
    			margin-right: 41px;
		}
		.fab.fa-yandex{
			background-color: #ded81f;
    			padding: 10px 20px;
    			border-radius: 100px;
    			filter: drop-shadow(2px 4px 6px black);
    			margin-right: 45px;
		}

		.oauthButton p {
			margin: auto 0;
			font-weight: 500;
			transition: .6s;
		}
		.tgme_widget_login.large button.tgme_widget_login_button{
			font-size: 35px!important;
    			line-height: 20px!important;
    			padding: 28px 37px 28px!important;
    			border-radius: 20px!important;
		}
		.tgme_widget_login.large .tgme_widget_login_user_photo, .tgme_widget_login.large .tgme_widget_login_user_photo img{
			width: 81px!important;
    			height: 80px!important;
    			border-radius: 50px!important;
		}
		.oauthButton.btn:hover i{
			filter: drop-shadow(4px 4px 20px black);
			transition: .6s;
		}
		
		.oauthButton.btn:hover p{
			text-shadow: 1px 1px black;
			transition: .6s;
		}
		
		#logout {
			-webkit-box-sizing: content-box;
			        box-sizing: content-box;
			margin-top: 3px;
			display: -webkit-box;
			display: -ms-flexbox;
			display: flex;
			-webkit-box-pack: justify;
			    -ms-flex-pack: justify;
			        justify-content: space-between;
			-webkit-box-align: center;
			    -ms-flex-align: center;
			        align-items: center;
		}

		#logout p, #optionsAgreement p {
			margin: 0;
			margin-right: 3px;
		}

		#logout button, #optionsAgreement {
			margin: 0;
			display: -webkit-box;
			display: -ms-flexbox;
			display: flex;
			-webkit-box-align: center;
			    -ms-flex-align: center;
			        align-items: center;
			-webkit-box-sizing: content-box;
			        box-sizing: content-box;
			-webkit-box-pack: center;
			    -ms-flex-pack: center;
			        justify-content: center;
		}

		#optionsAgreement {
			margin-bottom: 3px;
		}

		#logout #logOut {
			margin-right: 3px;
		}

		#mailForm, #smsForm {
			display: flex;
			align-items: center;
			justify-content: space-between;
		}

		#mailForm > button, #smsForm > button {
			margin-left: 3px;
		}

		
#qrDialog{
	width: 50%!important;
	height: 50%!important;
	position: absolute!important;
	top: 0!important;
	right: 0!important;
	bottom: 0!important;
	left: 0!important;
	margin: auto!important;
}
#qrcode{
	height: 80%;
}
#qrcode img{
	height: 100%;
}
		.mapid_alert{
			display: none;
			opacity: 0;
			position: absolute;
			left: 43%;
    			top: 50%;
			padding: 4px 10px;
    			background-color: #fff;
    			border-radius: 7px;
    			cursor: pointer;
    			border: 2px solid rgba(0,0,0,0.2);
    			font-weight: 500;
			transition: 1s;
			z-index: 13;
		}
		.mapid_send:hover, .mapid_clean:hover{
			opacity: 1;
			transition: .5s;
		}
		.mapid_whereI{
			display: block;
    			position: absolute;
    			bottom: 90px;
    			right: 10px;
    			cursor: pointer;
    			width: 95px;
    			height: 38px;
    			text-align: center;
   			padding-top: 6px;
    			background-color: #fff;
    			font-weight: 800;
    			border-radius: 6px;
    			border: 2px solid rgba(0,0,0,0.2);
    			z-index: 13;
    			font-size: 15px;
			}
		
		html {
			width: 100%;
			height: 100%;
		}

		body {
			display: flex;
			width: 100%;
			height: 100%;
			margin: 0;
			padding: 0;
			background-color: #ffffff;
		}
#shareDialog{
	padding: 3%;
	width: 45%;
	height: 50%;
	margin: auto;
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
}
button.close{
	background-color: #8b0000!important;
	border-color: #8b0000!important;
	width: unset !important;
	height: unset !important;
}
button.close:hover{
	background-color: #8b0000!important;
	border-color: #8b0000!important;
}
#rootDialog{
	padding: 2%;
	width: 31%;
	height: max-content;
	margin: auto;
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
}
@media(max-width:700){
	#qrDialog{
		width: 25%!important;
	}
}
@media(max-width:900px){
	#rootDialog{
		width: 90%;
	}
	#shareDialog{
		width: 81%;
		height: 26%;
	}
			.pagination_block{
				left: 0;
    			margin-left: 0;
				flex-direction: row;
			}
			#btn_prev{
				padding: 6px 12px;
			}
			#btn_next{
				padding: 6px 12px;
			}
			.pagination_select{
				font-size: 11px;
			}
			.pagination_count{
				font-size: 12px;
			}

			image.userPortrait {
			        width: 64px;
                                height: 64px;
                                x: -32px;
                                y: -32px;
			}

			image.friendPortrait {
				width: 35px;
                                height: 35px;
                                x: -18px;
                                y: -18px;
			}

			dialog{
				left: 50%;
				margin-left: -44%;
				width: 72%;
				padding: 8%;
			}
			#shareDialog{
				top: 10%;
				
			}
			.ya-share2__container_shape_round.ya-share2__container_size_l .ya-share2__badge .ya-share2__icon:not(.ya-share2__icon_messenger-contact):not(.ya-share2__icon_more):not(.ya-share2__icon_copy){
				background-size: 50px 50px !important;
			}
			.ya-share2__container_size_l .ya-share2__badge .ya-share2__icon{
				width: 50px!important;
				height: 50px!important;
			}
			.custom-share{
				margin: 5px auto 0 0;
			}
			.share {
    			width: 50px;
    			height: 50px;
    			cursor: pointer;
			}
	#logout{
		display: grid;
	}
	#deleteProfile{
		margin-top: 6px!important;
	}

@font-face {
  font-family: 'Arial';
  font-style: normal;
  src: url('fonts/Arial.ttf') format('truetype');
}