.px15,
.reports p.px15{
	margin-top: 0.75em;
}

.px20,
.reports p.px20{
	margin-top: 1em;
}

.px40,
.reports p.px40{
	margin-top: 2em;
}

.px80,
.reports p.px80{
	margin-top: 4em;
}

.head-box{
	margin: 0.5em 0.35em;
	padding: 0.5em;
	background-color: #008292;
	border-radius: 1em;
}
.head{
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.logo{
	display: flex;
	align-items: center;
	gap: 1em;
}
.copiright{
	color: #fff;
}

.center-bar{
	display: flex;
	gap: 1.5em;
	color: #fff;
}

.user{
	display: flex;
	align-items: center;
	gap: 1em;
}

.main{
	margin: 0 2.5em;
	margin-bottom: 2em;
}

.user-container{
	background-color: #007381;
	border-radius: 0.5em;
	padding: 0.9em;
}
.user-box{
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	margin-top: 2.5em;
	font-size:16px;
}
.data{
	display: flex;
	flex-direction: column;
	gap: 1em;
}
	.data-box{
	width: 25em;
	border: 1px solid #ADADAD;
	border-radius: 0.5em;
	padding: 1em 0;
	padding-left: 1.5em;
	}

	.data-box p{
		font-size: 16px;
		width: 22.5em;
		overflow:hidden; 
		white-space:nowrap;
		text-overflow:ellipsis;
		margin: 0px;
		line-height: normal;
	}

.left-section{
	font-size: 64px;
}
.label{
	padding-top: 2.5em;
	font-size: 24px;
}

.label2{
	font-size: 24px;
}

.label3{
	padding-top: 2.1em;
	font-size: 24px;
}

.label-requests{
	font-size: 50px;
}

.requests-box{
	display: flex;
	flex-wrap: wrap;
	gap: 1em;
}

.card-request{
	background-color: hsla(187, 100%, 29%, 0.10);
	width: 28.8%;
	border-radius: 0.5em;
	padding: 2.2em;
}

.card-top{
	display: flex;
	flex-direction: column;
	gap: 0.75em;
}

.circle{
	/*background-color: #008292;*/
	width: 11px;
	height: 11px;
	border-radius: 50%;
}

.circle2{
	background-color: #F31021;
	color: #fff;
	padding: 0.4em ;
	border-radius: 50%;
	width: 30px;
	height: 30px;
	text-align:center;
}

.status-indicate{
	display: flex;
	align-items: center;
	width: fit-content;
	padding: 0.75em;
	border-radius: 0.5em;
	gap: 0.45em;
	background-color: #fff;
}


.station{
	margin-top: 1em;
	display: flex;
	align-items: center;
	flex-direction: column;
	align-items: start;
	gap: 0.25em;
}
.station-adress{
	display: flex;
	align-items: center;
	gap: 0.25em;
	border: 1px solid #ADADAD;
	border-radius: 0.5em;
	padding: 0.5em;
}

.station-adress{
	font-size: 14px;
}

.adress-desc{
	font-size: 20px;
}

.card-bottom{
	display: flex;
	justify-content: space-between;
}

.disign-card{
	display: flex;
	flex-direction: column;
	align-items: center;
}

.user-photo{
	display: flex;
	flex-direction: column;
	align-items: center;
}

.head-box2{
	margin: 0.5em 0.35em;
	padding: 0.5em;
	background-color: #008292;
	border-radius: 1em;
}
.head2{
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.logo2{
	display: flex;
	align-items: center;
	gap: 1em;
}
.copiright2{
	color: #fff;
}

.center-bar2{
	display: flex;
	gap: 1.5em;
	color: #fff;
}

.user2{
	display: flex;
	align-items: center;
	gap: 1em;
}




h2 {
  font-size: 20px;
  margin-bottom: 10px;
}


button {
  font-size: 14px;
  cursor: pointer;
  transition: background-color 0.3s ease;
}

button:hover {
  background-color: #e6f7f9;
}


.image-overlay {
  position: relative;
  width: 100%;
  height: auto;
  overflow: hidden;
  border-radius: 10px;
	margin-top: 1em;
}

.background-image {
  width: 100%;
  height: auto;
  object-fit: cover;
  border-radius: 10px; 
}

.overlay-image {
  position: absolute;
  top: 50%;
  left: 26.5%;
  transform: translate(-50%, -50%);
  width: 34%;
  /*height: auto;*/
  height:64%;
  object-fit: cover;
  border-radius: 10px;
}

	.desc2{
		margin-top: 1em;
		width: 100%;
		font-size: 20px;
	}
@media (max-width: 762px) {
	.head-box{
	margin: 0.5em 0.35em;
	padding: 1em;
	background-color: #008292;
	border-radius: 0.5em;
	}
	.center-bar{
		display: none;
	}
	.user{
		display: none;
	}

	.label-requests{
	font-size: 27px;
	}

	.desc{
		margin-top: 1em;
		width: 100%;
		font-size: 14px;
	}
	.desc2{
		margin-top: 1em;
		width: 100%;
		font-size: 20px;
	}


	.adress-desc{
	font-size: 16px;
	}

	.data-box{
	width: 92.5%;
	border: 1px solid #ADADAD;
	border-radius: 0.5em;
	padding: 1em 0;
	padding-left: 1.5em;
	}

	.data-box p{
		font-size: 16px;
		width: 200px;
		overflow:hidden; 
		white-space:nowrap;
		text-overflow:ellipsis;
	}

	.left-section{
	font-size: 32px;
	}
	.label{
	padding-top: 1.5em;
	font-size: 20px;
	}

	.requests-box{
	display: flex;
	flex-wrap: wrap;
	gap: 0.8em;
	}
	.card-request{
	background-color: hsla(187, 100%, 29%, 0.10);
	width: 100%;
	border-radius: 0.5em;
	padding: 1.0625em;
	}

	.card-bottom{
		flex-direction: row-reverse;
	}

	.disign-card{
	display: flex;
	flex-direction: column-reverse;
	gap: 0.8em;
	font-size: 20px;
	align-items: start;
	}

	.user-photo{
	display: flex;
	flex-direction: column-reverse;
	gap: 0.8em;
	font-size: 20px;
	align-items: start;
	}
	.disign-card img{
		width: 95%;
	}
	.user-photo img{
		width: 95%;
	}

	.user-box{
	display: flex;
	flex-direction: column;
	margin-top: 2.5em;
	}
	.head-box2{
	margin: 0.5em 0.35em;
	padding: 0.5em;
	background-color: #008292;
	border-radius: 0.5em;
}
.head2{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
}

.logo2{
	display: flex;
	align-items: center;
}
.copiright2{
	color: #fff;
}

.center-bar2{
	display: flex;
	flex-direction: column;
	gap: 1.5em;
	margin: 1em 0;
	color: #fff;
}

.user2{
	display: flex;
	flex-direction: row-reverse;
	align-items: center;
	gap: 1em;
}
.station{
	margin-top: 1em;
	display: flex;
	align-items: center;
	flex-direction:column-reverse;
	align-items: start;
	gap: 0.25em;
}
}

.reports
{
	font-size:16px;
	line-height:normal;
}

.reports p
{
	margin:0px;
}