/* for smartphones */
@media screen and (max-width:700px) {
	#back{
		max-height: 40px;
		max-width: 40px;
	}
	
	.user_icon{
		display: inline-block;
		max-height: 25px;
		vertical-align: middle;
		border-radius: 50%;
		border: 3px solid #000;
		top: 5px;
	}

	.dropdown-content {
		  background-color: #fff;
		  top:70px;
		  right:20px;
	}

}

@media screen and (max-width:600px) {
	h1 {font-size:1.5em;}
	
	body {
		font-size:1.2em;
		line-height:1.2em;
	}
	
	input, table {
		font-size:1.2em;
		border-spacing: 1px;
		}
		
	.btn {
		padding: 20px;
		font-size:1.2em;
		height:auto;
	}
	
	#wrapper {
		min-width: 98%;
		margin:auto;
	}
	/* Окошко */			
	#dialog {
		width: 98vw !important;
		min-height:20%;
	}
	
	/* User Icon */
	
	#name {
		font-size: 0.62em;
		top:30x;
		right:22px;
		font-weight: 10px;
		
	}
		
		/* Login page for smatphone */
		#login {
		margin-top:20%;
		margin-right: 20px;
		display: flex;
		justify-content: center;
		}
		
		#login input {
		font-size: 24px;
		}
		
		#login h2 {
		font-size: 24px;
		}
		
		#login_btn {
			width:97%;
		height:60px;
		font-size: 30px;
		}
	
	/* Заявки */
	#onDate_wrapper {
		font-size: 14px;
	}
	
	#no_queries_found{
		font-size: 14px;
		height: fit-content;
		text-align:left !important; 
		margin-top: 20px;
	}
	
	/* Header */
	.header{
		min-width: 100%;
	}
	
	#queriesTable .edit td{
		font-size: 20px;
	}
	
	/* Calendar */
	
	#calendar-wrapper{
	padding-right : 10%;
	display : flex;
	align-content: center;
	}
	#fc {
		border-collapse:collapse;
		/*font-family: Calibri;*/
		font-size:2em;
		max-width:100%;
		color: #fff;
		}
	#fc1 #mns {
		padding: 20px 25px;
		width: 100%;
		text-align: center;
		font-size: 0.68em;
	}
	#fc td:not(:first-child) {
		border-left: 1px solid #cccccc;
		}
	#fc tr:not(:last-child) td {
		border-bottom: 1px solid #cccccc;
		}
	#fc td, #fc th {
		font-size: 0.65em;
		text-align:center;
		vertical-align:middle;
		height:auto;
		padding:8px;
		position:relative;
		}
	#csubm, #caddm {
		width:45px;
		font-weight: 700;
		}
		
	.st2 {
		font-size: 0.6em;
	}
	
	.st34 {
		font-size: 0.6em;
	}	
	
	/* Заявки */ 
	#editQueryView{
		font-size: 0.7em;
		
	}
	
	#counter_label, #counter_value{
		max-height: 30px;
		font-size: 0.8em;
		
	}
	
	/* Add Pu */ 
	#addPUView .text, #addPUView .input {
		font-size: 0.9em;
	}

	#addPUView h3 {
		font-size: 0.9em;
	}
	
	/* Edit Pu */
	#editPUView .text, #editPUView .input {
		font-size: 0.9em;
	}

	#editPUView h3 {
		font-size: 0.9em;
	}

	
	/* SaveOk / No */
	#saveOK, #saveNO, #addpu, #gallery_button {
		height: 50px;
		font-size: 0.8em;
	}
	#add_counter_table #addpu, #add_counter_table #gallery_button {
		font-size: 1em;
	}

	#editPU_save, #addPU_save {
		height: 50px;
	}

	#saveOK img{
		height: 50% !important;
	}
	#addpu {
		margin-left: 5px;
	}
	#addpu img{
		height: 16px !important;
		max-width: 16px !important;
	}
	#saveNO img{
		height: 50% !important;
	}
	
	/* ФОТОГАЛЕРЕЯ */
	/* Грид-вариант*/
	#fotoView #foto_text {
		font-size:0.9em;
	}

	/*  конец грида */

	#safari_fotoView{
		display:none;
		position:fixed;top:0;left:0;
		max-height:95%;
		
	}

	#safari_fotoView #safari_fotoImg{
		position: fixed;
		top: 45%;
		left: 50%;
		-webkit-transform: translate(-50%, -50%);
		transform: translate(-50%, -50%);
		width: 95vw;
		max-width:100%;
		max-height:80%;
	}

	#safari_image_save{
		height:35px !important;
		width: fit-content;
		position: fixed;
		top: 95%;
		left: 50%;
		-webkit-transform: translate(-50%, -50%);
		transform: translate(-50%, -50%);
		cursor:pointer;
		padding: 4px;
		border: 1px solid #fff;
		border-radius: 5%;
		display: flex;
		align-items: center;
		justify-content: center;
		flex-flow: column nowrap;
		color: #fff !important;
		font-size: 14px;
		font-weight: bold;
		background-color: var(--main_green);

	}
	
	#safari_image_save:hover{
		background-color: #fff;
		border: 1px solid var(--main_green);
		color: var(--main_green);
	}
	
	#safari_image_save:hover img{
	filter: brightness(0) saturate(100%) invert(53%) sepia(15%) saturate(4675%) hue-rotate(46deg) brightness(100%) contrast(101%);
	}
	
	#safari_image_save img{
		padding-bottom: 3px;
	}
	
	#magnifying_glass {
		position:absolute; 
		top:7px; 
		right:7px;
		width: 15px;
		right:4%;
	}

		
		
}

@media screen and (max-width: 700px) {
	.header .lvl1 .col1 {
		display: none;
	}
	.header .lvl1 .col1.mobile {
		display: block;
	}
	
	.header .lvl1 .col1 img {
		height: 40px !important;
		width: auto;
	}
	
    .header .lvl1 {
		padding:15px 0;
	}
	
	#name { 
		top:35px; 
		margin-right: 45px;
		margin-left: 10px;
		}
	#delete-photo-btn {
		bottom: 8%;
		gap: 5px;
		font-size: 0.9em;
		left: 2%;
		padding: 15px;
	}
}


/* *********************** */