*{
	box-sizing: border-box;
}
html {
    font-size: 1vw;    /* for width: 1440px;*/
    padding: 0;
    margin: 0;
    height: 100%;
}
@media screen and (max-width: 1010px) {
	html{
		font-size: 1.6vw;  /* for width: 1010 px;*/
	}
} 
@media screen and (max-width: 700px) {
	html{
		font-size: 3.9vw;   /* for width: 360 px;*/ 
	}
} 
body {
    padding: 0;
    margin: 0;
    width: 100%;
    height: 100%;

}
body::before {
    width: 300px;
    height: 100px;
    background: red;
    
}
body::after {
    width: 18.75rem;
    height: 6.25rem;
    background:#00ff0099;
}
body:before,
body:after {
    content: "Камертон"; 
    position: fixed;
    top: 10px;
    left: 20px;
    z-index: 1000000;
    display: none;
}

@media screen and (min-width: 1690px) {
	html{
		font-size: 17px;
	}
} 
.overflow{
    overflow: hidden;
}



.disable{
    pointer-events: none;
    opacity: 0.5;
}
.hidden{
    display: none;
}
.invisible{
    visibility: hidden;
}
.visible{
    visibility: visible;
    display: block!important;
}

.checkclick-sensor input[type=radio] { display: none;}
.checkclick-sensor .checkclick-input + .checkclick-object {cursor: pointer;}
.checkclick-sensor .checkclick-input:not(checked) {position: absolute;opacity: 0; }

.checkclick-sensor .checkclick-input:not(checked) + .checkclick-object {}
.checkclick-sensor .checkclick-input:not(checked) + .checkclick-object .checkclick-btn{display: inline-block;}
.checkclick-sensor .checkclick-input:not(checked) + .checkclick-object .checkclick-btn-up{display: inline-block;}
.checkclick-sensor .checkclick-input:not(checked) + .checkclick-object .checkclick-btn-down{display: none;}
.checkclick-sensor .checkclick-input:not(checked) + .checkclick-object .checkclick-popup {display: none;}

.checkclick-sensor .checkclick-input:checked + .checkclick-object .checkclick-popup {display: block;}
.checkclick-sensor .checkclick-input:checked + .checkclick-object .checkclick-btn-up{display: none;}
.checkclick-sensor .checkclick-input:checked + .checkclick-object .checkclick-btn-down{display: inline-block;}
.checkclick-sensor .checkclick-object img{width: 3rem;}


/*таблица*/
.tbl{
     display: table; 
 
} 
.tbl .tr{
     display: table-row; 
}
.tbl .td{
     display: table-cell; 
}
/*таблица с вертикальными колонками*/
.tbl.tbl-col{
    writing-mode: vertical-lr;
    width: 100%;
}
.tbl.tbl-col .tr{
  
}
.tbl.tbl-col .td{
    vertical-align: top;
   
}
.tbl.tbl-col .cell{
    display: block;
    width: 24rem;
    writing-mode: rl-tb;
}
.cell-content{
    padding: 1px ;
}