body{
	margin: 0px;
	padding: 0px;
	font: normal 17px 'Roboto Condensed', sans-serif;
	height: 100%;
	width: 100%;
	cursor: auto;
}

canvas{
	height: 100%;
	width: calc(100% - 380px);
}

.infoFlor{
	display: block;
	position: absolute;
	top: 90px;
	left: calc(50% - 380px);
	width: 400px;
	height: 30px;
	text-align: center;
	text-decoration: underline;
	color: black;
	text-transform: uppercase;
	filter: drop-shadow(0 0 4px white);
	z-index: 1;
}



.panel1{
	display: block;
	position: absolute;
	top: 0px;
	left: 0px;
	width: 94px;
	height: 100%;
	text-align: center;
	color: #000000;
	backdrop-filter: blur(20px);
	-webkit-backdrop-filter: blur(20px);
	z-index: 1;
    background-color: rgba(200, 200, 200, .3);
	padding: 0px;
	border: 1px solid #a0a0a0;
	overflow-y: auto;
	transform: scaleX(-1);
}

.panel{
	display: block;
	position: absolute;
	top: 0px;
	right: 0px;
	width: 80px;
	height: 100%;
	transform: scaleX(-1);
}

.tab_files{
	display: block;
	position: absolute;
	top: 70px;
	right: 0px;
	width: 200px;
	height: 100%;
	text-align: left;
	color: #000000;
	z-index: 1;
    background-color: rgba(200, 200, 200, .3);
	backdrop-filter: blur(20px);
	-webkit-backdrop-filter: blur(20px);
	padding: 10px;
	border: 1px solid #a0a0a0;
}

.tab{
	display: block;
	position: absolute;
	top: 0px;
	right: 0px;
	width: 380px;
	height: 100%;
	text-align: left;
	color: #000000;
	z-index: 1;
    background-color: rgba(200, 200, 200, .3);
	backdrop-filter: blur(20px);
	-webkit-backdrop-filter: blur(20px);
	padding: 10px;
	border: 1px solid #a0a0a0;
}

.loader_ddd{
	display: block;
	position: absolute;
	top: 70px;
	right: 220px;
	width: 160px;
	height: 160px;
	z-index: 1;
    background-color: rgba(200, 200, 200, .0);
	-moz-user-select: -moz-none;
	-o-user-select: none;
	-khtml-user-select: none;
	-webkit-user-select: none;
	user-select: none;
}

.ddd{
	position : absolute;
	bottom : 14px;
	right: 285px;
	width : 100px;
	height: 100px;
	border: 0px;	
	z-index: 100;
	-moz-user-select: -moz-none;
	-o-user-select: none;
	-khtml-user-select: none;
	-webkit-user-select: none;
	user-select: none;
}

.btn {
	position: relative;
	width: 80px;
	height: 70px;
	border: 0;
	background-color: rgba(200, 200, 0, .0);
	padding: 5px;
}
.btn:hover {
 background-color: rgba(200, 200, 0, .3);
 cursor: pointer;
}

.btnvv {
	position: relative;
	width: 80px;
	height: 70px;
	border: 0;
	background-color: rgba(200, 200, 0, .0);
	padding: 5px;
}
.btnvv:hover {
 background-color: rgba(200, 200, 0, .3);
 cursor: pointer;
}



.btnvw {
	display: none;
	position: relative;
	width: 80px;
	height: 70px;
	border: 0;
	background-color: rgba(200, 200, 0, .0);
	padding: 5px;

}
.btnvw:hover {
 background-color: rgba(200, 200, 0, .3);
 cursor: pointer;
}



.btnddd{
	position: relative;
	border: 0;
	background-color: rgba(200, 200, 0, .0);
}
.btnddd:hover {
 cursor: pointer;
}


.btn:disabled,
.btn[disabled]{
background-color: rgba(255, 255, 255, .0);
cursor: auto;
filter: opacity(40%);
}

.info{
	position : absolute;
	bottom : 30px;
	height: 100px;
	width : 350px;
	text-align : right;
	border: 1px solid #C0C0C0;
	padding : 5px;
	background: white;
}
.stat{
	position : absolute;
	bottom : 31px;
	width : 350px;
	text-align : center;
}
.head{
	display: block;
	position: absolute;
	top: 0px;
	left: 95px;
	width: calc(100% - 481px);
	height: 70px;
	text-align: center;
	color: #000000;
	backdrop-filter: blur(20px);
	-webkit-backdrop-filter: blur(20px);
	z-index: 1;
    background-color: rgba(255, 255, 255, .3);
	padding: 0px;
	border-bottom: 1px solid #a0a0a0;
}

.headAdmin{
	display: block;
	position: absolute;
	top: 0px;
	left: 0px;
	width: calc(100% - 381px);
	height: 70px;
	text-align: center;
	color: #000000;
	backdrop-filter: blur(20px);
	-webkit-backdrop-filter: blur(20px);
	z-index: 1;
    background-color: rgba(255, 255, 255, .3);
	padding: 0px;
	border-bottom: 1px solid #a0a0a0;
}

.btn_help{
	position : absolute;
	top : 0px;
	left : 0px;
	width : 80px;
	height : 80px;
}

.help_panel{
	position : absolute;
	display : block;
	border : 1px solid #000;
	background-color: rgba(255, 255, 255, 0.9);
	backdrop-filter: blur(20px);
	top : 10%;
	left : 10%;
	width : 80%;
	height : 80%;
	z-index: 10;
}

.input_panel{
	position : absolute;
	display : block;
	border : 1px solid #000;
	background-color: rgba(255, 255, 255, 0.9);
	backdrop-filter: blur(20px);
	top : 20%;
	left : 20%;
	width : 60%;
	height : 60%;
	z-index: 10;
	overflow: auto;
}

.about_panel{
	position : absolute;
	display : block;
	border : 1px solid #000;
	background-color: rgba(255, 255, 255, 0.8);
	backdrop-filter: blur(20px);
	top : 25%;
	left : 25%;
	width : 50%;
	height : 50vh;
	z-index: 10;
	padding: 15px;
	overflow: auto;
}

.modal_wrap{
	width : 100%;
	height : 100%;
	display : block;
	position : absolute;
	backdrop-filter: blur(20px);
	background-color: rgba(128, 128, 128, 0.4);
	z-index : 10;
}

.modal{
	margin : 0px;
	padding : 25%;
	border : 1px solid #000;
	width : 60%;
	height : 50%;
	background-color: rgba(128, 128, 128, 0.3);
}

.modal_hd{
	width : 100%;
	height : 50px;
	display : block;
	margin : auto;
	padding-top : 30px;
	text-align : center;
}

.modal_btn{
	width : 40%;
	height : 50px;
	position : relative;
	display : block;
	margin : auto;
	margin-top : 30px;
	margin-bottom : 30px;
	cursor: pointer;
}

.modal_btn_close{
	width : 30px;
	height : 30px;
	position : absolute;
	right : 15px;
	top : 10px;

	z-index : 10;
	background-color: rgba(128, 128, 128, 0.0);
	border: 0;
	cursor: pointer;
}

.modal_txt{
	width : 80%;
	height : 25px;
	padding-top : 10px;
	display: block;
	position : relative;
	margin : auto;
}

.fields{
	width : 80%;
	height : 50px;
	display: block;
	position : relative;
	margin : auto;
}

.btn_file{
	position : relative;
	width : 52%;
	height : 30px;
	border-radius: 0px;
	border: 1px solid #000000;
	margin:1px;
}

.btn_file:hover {
	background: #c0c0c0;
	
}

.btn_loader_info{
	position : relative;
	width : 15%;
	height : 30px;
	border-radius: 0px;
	border: 1px solid #000000;
	margin:1px;
}

.btn_loader_info:hover {
	background: #c0c0c0;
	
}


.form-phone{
    width : 50%;
	height : 50px;
	position : relative;
	margin : auto;
}

.form-coutry{
    width : 30%;
	height : 50px;
	position : relative;
	margin-left : 10%;
}

.tabs {
 width: 100%;
 padding: 0px;
 margin: 0 auto;
 }
 
.tabs>input {
display: none;
}
.tabs>div {
    display: none;
	height: calc(100% - 200px);
	padding: 12px;
    border: 1px solid #C0C0C0;
    background: #FFFFFF;
	overflow-y: auto;
	overflow-x: hidden;
}

.tabsAdmin>div {
    display: none;
	height: 100%;
	padding: 12px;
    border: 1px solid #C0C0C0;
    background: #FFFFFF;
	overflow-y: auto;
	overflow-x: hidden;
}

.tabs>label {
    display: inline-block;
    padding: 7px;
    margin: 0 -5px -1px 0;
    text-align: center;
    color: #000000;
    border: 1px solid #C0C0C0;
    background: #E0E0E0;
    cursor: pointer;
}


.tabs>input:checked + label {
    color: #000000;
    border: 1px solid #C0C0C0;
    border-bottom: 1px solid #FFFFFF;
    background: #FFFFFF;
}
#tab_1:checked ~ #txt_1,
#tab_2:checked ~ #txt_2,
#tab_3:checked ~ #txt_3,
#tab_4:checked ~ #txt_4 {
display: block;
}

.input_panel::-webkit-scrollbar {
  width: 5px;
  background-color: #f9f9f9;
}

.input_panel::-webkit-scrollbar-thumb {
  border-radius: 0px;
  background-color: #535353;
}

.input_panel::-webkit-scrollbar-track {
  -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.2);
  border-radius: 10px;
  background-color: #f9f9f9;
}

.about_panel::-webkit-scrollbar {
  width: 5px;
  background-color: #f9f9f9;
}

.about_panel::-webkit-scrollbar-thumb {
  border-radius: 0px;
  background-color: #535353;
}

.about_panel::-webkit-scrollbar-track {
  -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.2);
  border-radius: 10px;
  background-color: #f9f9f9;
}


@media (max-width: 1360px){
.head{
	height: 140px;
}
}

@media (max-width: 960px){
.head{
	height: 210px;
}
}
@media (max-width: 800px){
.head{
	height: 280px;
}
}
@media (max-width: 720px){
.head{
	height: 420px;
}
}
@media (max-width: 640px){
.head{
	height: 770px;
}
}

.info_panel{
	position : absolute;
	display : block;
	border : 1px solid #000;
	background-color: rgba(255, 255, 255, 0.7);
	backdrop-filter: blur(20px);
	top : 100px;
	left : 100px;
	bottom : 100px;
	right : 100px;
	z-index: 10;
	padding-top: 30px;
	padding-bottom: 30px;
	padding-left: 15px;
	padding-right: 15px;
	overflow: auto;
}


.table_info {
	width: 100%;
	border-collapse: collapse;
	border: 1px solid;
	text-align: center;
	background: white;
}
.table_info tr{
	height: 40px;
	width: 100%;
	border: 1px solid;	
}
.table_info th{
	height: 60px;
	width: 100%;
	text-align: center;
	background:  rgba(0,0,0,0.1);
	border: 1px solid;
}
.table_info td{
	width: 50%;
	border: 1px solid;
}

.tablet {
	height: 40px;
	width: 100%;
	border-collapse: collapse;
	border: 1px solid;
	background: white;
	text-align: center;
}
.tablet th{
	height: 60px;
	width: 100%;

	background:  rgba(0,0,0,0.1);
	border: 1px solid;
}
.tablet tr{
	height: 40px;
	width: 100%;
	border: 1px solid;	
}
.tablet td{
	border: 1px solid;
}