body, p, div {
  font-family: arial;	
  margin: 0;
  padding: 0;
}

.{
  font-family: arial;	
  margin: 0;
  padding: 0;
}

.body{
	font-family: arial;
	margin:0px;
	padding:0px;

}

.div-mark{
	display:inline-block; 
	text-align:center;
	width:40px; 
	border:solid 1px silver; 
	margin:5px;
}

.div-mark:hover{
	color:white;
	background-color:#B6B6B4;
}

.no-wrap{
	vertical-align: top; 
	white-space: nowrap; 
	overflow: hidden; 
	text-overflow: ellipsis;
}

.td-left-admin{
	border-right: solid 2px black;
	width:300px;
	height:100%;
}

.col-tb{
	color:#800000;
}

.col-tb-val{
	color:#4B0082;
}

.bl-name-school{
	width:95%; 
	height:100%; 
	display:inline-block; 
	vertical-align: top;
}

.w-100vid{
	width:100%;
}

.mw50{
	max-width:100px;
}

.div-pi{
	text-align:left; width:100%;
}

.bl-icon-school{
	width:40px; 
	height:100%; 
	display:inline-block; 
	vertical-align: top;
}

.menu-container{
   background-color: #324a5e; 
   height:40px; 
   width:100%;
}

.img-logo{
	float: left; height:30px; margin-top:1px; margin-left:5px;
}

.link-logo{
	font-size:16px; color:#01a2e8; text-decoration: none; margin-top: 10px; margin-left:5px; position:absolute;
}

.bl-menu-top{
	background-color: #f6f6f6; height:40px; width:100%; top:0px; position: fixed; vertical-align: top;
}

.container-logo-top{
	box-shadow: 2px 2px 4px #888; 
	border:non; 
	background-color: white; 
	height:33px; 
	width:170px; 
	margin:1px; 
	display: inline-block;
	z-index:110;
}

.burger-menu{
	display:inline;
}

.bl-menu{
	height:40px; 
	display:inline-block; 
	background-color: #324a5e;
}

.bl-menu:hover{
    background-color: #446f93;
}

.container-elem-menu{
	background-color: non; 
	height:20px; 
	display:inline-block; 
	margin-top:10px;
}

.font-elem-menu{
	font-size:18px; 
	color:white; 
	margin-top:5px; 
	text-decoration: none; 
	font-family:arial;
}

/* Стилізація власного елемента, який виглядає як кнопка */
.custom-file-upload {
    border: 2px solid #ccc;
    display: inline-block;
    padding: 6px 12px;
    margin:10px;
    cursor: pointer;
}

/* Сховати стандартний input[type=file] */
input[type="file"] {
    display: none;
}

.div-bl-name-school{
	height:20px; margin-top:10px; font-size:18px; width: 100%; display:inline-block;
}

.div-bl-name-user{
color:white; background-color:non; height:25px; margin-top:9px; font-size:18px; width: 40px; display:inline-block; float:right;
}

.div-bl-name-user-img{
background-color:non; height:40px; margin-top:2px; width: 45px; display:inline-block; float:left;
}

.div-container-user{
	height:40px; display:inline-block; float:right; background-color:#97aeed; padding-left: 3px;
}

.pic-school{
	float:left; margin-left:5px;
}

.div-v-line{
	display:inline-block; vertical-align: top; white-space: nowrap; width:4px; height:100%; border-left: 2px solid #324a5e; border-top: none; border-right: none; border-bottom: none; padding:0px; margin:0px;
}

.v_hidd{
	visibility: hidden;
}

.w_left_burger{
	width:170px;
	display:inline-block; 
	height:40px; 
	margin-top:25px;
}

.div-container-stat{
	display:inline-block; min-width: 170px; height:40px; margin-top:28px; vertical-align: top; padding-left:3px;
}

.container-clock{
	position:fixed; height:38px; top: 40px; right:10px; background-color: white; z-index:400;
}

.div-glav-container-stat{
	background-color: white; height:70px; 
}

.div-new-record{
	border:solid 1px #B6B6B4; 
	border-radius: 25px; 
	padding: 7px;
	padding-left:10px;
	padding-right: 10px; 
	margin:0px; 
	font-family: arial; 
	font-weight: bold;
	font-size: 16px; 
	color:#3D3C3A; 
	background-color: #E5E4E2; 
	cursor:pointer;
  width:110px; 
  text-align: center; 
  margin-left:10px;
  transition: transform 0.1s ease-in-out;
}

.div-new-record:hover{
	background-color:#E5E4E2;
  box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.3);
  transform: scale(1.05);
}

.btn-submit{
	border:solid 1px #B6B6B4; 
	border-radius: 25px; 
	padding: 7px;
	padding-left:10px;
	padding-right: 10px; 
	margin:0px; 
	font-family: arial; 
	font-size: 16px;
	font-weight: bold;
	color:#3D3C3A; 
	background-color: #E5E4E2; 
	cursor:pointer;
  text-align: center; 
  margin-left:10px;
  transition: transform 0.1s ease-in-out;
}

.btn-submit:hover{
	background-color:#E5E4E2;
  box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.3);
  transform: scale(1.05);
}

.adap-width{
	width:1000px;
}

.update_lesson_topic{
	width:1000px;
	max-width:1000px;
}

.w500-200{
	width:500px;
}

@media only screen and (max-width:1300px){
.bl-name-school{
	width:95%; 
	}
}

@media only screen and (max-width:1200px){
.update_lesson_topic{
	width:950px;
	max-width:950px;
}

.bl-name-school{
	width:95%; 
	}
}

@media only screen and (max-width:1000px){
.update_lesson_topic{
	width:750px;
	max-width:750px;
}

.bl-name-school{
	width:95%; 
	}

.adap-width{
	width:800px;
}

.w500-200{
	width:400px;
}

}

@media only screen and (max-width:800px){
.update_lesson_topic{
	width:550px;
	max-width:550px;
}

.adap-width{
	width:600px;
}

.td-left-admin{
	width:200px;
}

.bl-name-school{
	width:95%; 
}

.container-logo-top{
	display:none;
}

.w_left_burger{
	width:50px;
}
.w500-200{
	width:300px;
}
}	

@media only screen and (max-width:600px){
.w500-200{
	width:250px;
}

.update_lesson_topic{
	width:450px;
	max-width:450px;
}	

.bl-name-school{
	width:95%; 
}

.adap-width{
	width:400px;
}

.td-left-admin{
display:none;
}
}

@media only screen and (max-width:500px){
.w500-200{
	width:200px;
}

.update_lesson_topic{
	width:350px;
	max-width:350px;
}

.bl-name-school{
	width:95%; 
	}

.adap-width{
	width:350px;
}

}



@media only screen and (max-width:400px){
.update_lesson_topic{
	width:350px;
	max-width:350px;
}

.adap-width{
	width:350px;
}

.bl-name-school{
	width:95%; 
	}
}

.bg-cless{
	background-color: #5CB3FF;
}

.bg-dless{
	background-color: #82CAFF;
}

.m3{
margin:3px;
}

.table-lesson{
	min-width:1000px;
}

div.no-wrap {
    white-space: nowrap;
}

.fz10{
	font-size:10px;
}

.vertical-text {
      writing-mode: vertical-rl; /* Зробити текст вертикальним, з правого до лівого */
      white-space: nowrap; /* Запобігти переносу тексту */
    }