@font-face{
    font-family:'digital-7';
    src: url('digital-7.ttf');
   }
  



html, body {
height: 100%;

margin: 0;

overflow-x: hidden;
}


body
{









}








.small {
    font: italic 80px sans-serif;
}
.heavy {
    font: bold 50px sans-serif;
}

.Rrrrr {
    font: italic 40px serif;
    fill: blue;
}



.LICZNIKKASY{
    
    font-family: 'digital-7', sans-serif;
    color: gold;

    float: left;
    font-size: 7vh;
   
}









.error,
.oferta,
.onas,
.rysol
{
background-color: lightgrey;

height: 600px;
width: 100%;
text-align: center;

}





.guzik1
{

padding: 1px;
margin: 0.5vw;

text-align: center;

font-size: 1.5vw;
margin-left: auto;
margin-right: auto;


}

.guzik2
{
border: 1px solid gold;
padding: 1px;
margin: 0.5vw;

text-align: center;

font-size: 2.2vw;
min-width: 12vw;
}














#menuMAP{

    text-align: left;
}





#swiatBIEDY
{

overflow-y: scroll;

}


.ADMIN
{

fill: PINK;

border: 5px solid rgb(238, 19, 154); 
visibility: hidden;    
}



.ADMINISTRACJA
{
position: absolute;
bottom: -300px;
background-color: lightpink;
fill: PINK;
border: 5px solid rgb(238, 19, 154); 

}









.fullheight {
height: 100%;
background-color: lightgrey;
position: relative;
}




.menu
{
background-color:black;
color: gold;
text-align: left;


height: 7vh;
width: 100%;
display: flex;
}





.infrapTAG
{







color: gold;



text-align: right;
float: right;

font-size: 3.1vh;
margin-left: auto;
white-space: nowrap;
text-align: right;
}



.image
{
    height: 6vh;
    margin: 1px;
   
    position: relative;
    top:0px;
    float: right;
}



.flagMINI
{
   
    width:25px;
    height:3vh;
}


.lang-button[data-lang="id"] {
font-family: 'Playwrite ID', sans-serif;
font-size: 1.0vw;
}




.lang-button[data-lang="ke"] {
    font-family: 'Playwrite ZA Guides', sans-serif;
    font-size: 1.0vw;
}




ol
{
display: inline-block;
padding: 0px;
margin: 0px;
height: 25px;
}


ol a
{
text-decoration: none;

color: white;



}

ol > li
{
float: left;

list-style-type: none;
}

ol > li:hover
{
background-color: seagreen;
}

ol > li:hover > a
{

color: gold;
}



ol > li > ul
{
list-style-type: none;
padding: 0px;
margin: 0px;
display: none;
}

ol >li:hover > ul
{
display: block;
}


ol > li > ul > li
{
background-color: lightseagreen;
position: relative;
}

ol > li > ul > li:hover
{
background-color: seagreen;
}

ol > li > ul > li:hover >a
{
color: white;
}







#home{
    display: flex;
   
   
}


#info1pre {
    max-height: 100%;
    overflow: auto;
    display: block;
    white-space: pre-wrap;
}


#svgMESS
{
height: 65vh;
margin: 11px;

}

#rightMESS
{
height: 65vh;

margin: 11px;
float: right;

}



.mainn_l
{
float: left;




width: 100%;
overflow-x: scroll;
overflow-y: scroll;

height:100%;
}

.mainn_c{
float: left;



max-height: 65vh;
margin: 1px;


width: min-content;
}

.mainn_p
{




}



#svgCLASSsvgDETALE
{

height: 100%;
background-color: lightyellow;

width: max-content;
}
#svgCLASSsvgMESS
{


background-color: lightyellow;

}

#svgCLASSrightMESS
{

height: 100%;
background-color:lightpink; 
}









#svgMESSopis{
height: 65vh;


background-color: lightyellow;
max-height: 59vh;
}

#svgMESSwycena
{
   
height: 65vh;


width: min-content;
background-color: lightyellow;
overflow-y: scroll;
}

.svgMESSwycenaNOWRAP
{
white-space: nowrap;
text-align: right;
}





#svgMESSedytor
{
    height: 65vh;
   
    background-color: gray;
    text-align: left;
   
    width:375px; 
}

#svgMESSpapier
{
    height: 65vh;
   
    background-color: gray;
   
    text-align: left;
    width:375px; 

}






.svgMESSklawka{

   
}
.svgMESSzoom{
   

}
.svgMESSrysunki{

}

.ZOOMklawa{
margin-left: auto;
margin-right: auto;
}

.moveSVG
{

    height: 4vh;
}

#svgMESSturbofilter
{

padding: 10px;
height: 45vh;
overflow-y: scroll;
text-align: left;
background-color: gray;
width:425px; 
}








#svgMESSedycja{
height: 60vh;

background-color: gray;

width: min-content;
overflow-y: scroll;
}



#piwSELECTORwiersz
{
float: left;

white-space: nowrap;
width: 100%;
}


#piwSELECTORright
{
float: left;
text-align: left;
}

#piwSELECTORcentr
{
    
    float: left;
    text-align: center;

}

#piwSELECTORleft
{
    float: left;
text-align: right;
}






.selectADDlev1{
height: 55vh;
background-color: gray;

width:375px; 
overflow-x: hidden;
overflow-y: scroll;
}
.selectADDlev2{
    height: 55vh;
    background-color: gray;

width:375px; 
overflow-x: hidden;
overflow-y: scroll;
}


.btn_selectADDlev2
{


border: 3px solid grey;

text-align:center;
padding: 0px;
zoom: 75%;
}



.btn_selectADDlev2:hover
{

border: 3px solid gold;
}





























.labelAB{


font-size:9px;

}




.form-popup {
display: none;
position: fixed;



left: 0;
right: 0;
top: 0;
bottom: 0;


z-index: 9;

background-color: darkseagreen;
}


.form-container {

padding: 10px;
width: 500px;
margin-left: auto;
margin-right: auto;
}

.form-container input[type=text], .form-container input[type=password] {
width: 100%;
padding: 15px 0 15px 0;
margin: 5px 0 22px 0;
border: none;
background: lightgrey;
}


.form-container input[type=text]:focus, .form-container input[type=password]:focus {
background-color: white;
outline: none;
}


.form-container .btn {
background-color: green;
color: white;
padding: 16px 20px;
border: none;
cursor: pointer;
width: 100%;
margin-bottom:10px;
opacity: 0.8;
}

.form-container .cancel {
background-color: lightpink;

}

.form-container .btn:hover {
opacity: 1;
}












.footer
{


background-color: black;




height: 9vh;


font-family: Garamond, serif;
color: black;

font-size: 15px;

position: absolute;
bottom: 0px;
top: auto;
width: 100%;
}





.FOOTERPANEL
{
    position: absolute;
    bottom: 9vh;
    width: 100%;
   











}




.FILTERPANEL
{






float: left;
}

.celFILTERPANEL
{
    
   
   
    
}






.FILTERPANELklawa
{
    

}


.TILESPANEL
{




















}

.celTILESPANEL
{
    
   
}


#THEfieldsOFtiles
{
    
    overflow-y: scroll;
    text-align: right;
    height: 23vh;

}




.MONITOR
{

background-color: white;





margin:0.9vh;
width: 444px;
height:80%;
float: right;
color: black;

font-size: 12px;
overflow-y: scroll;
}













@keyframes move1{
    0%{transform: rotate(-180deg);opacity:0;}
    100%{transform: rotate(0deg);opacity:1;}
}

@keyframes move2{
    0%{transform: translateX(200px);opacity:0;}
    100%{transform: translateX(0px);opacity:1;}
}

line{

stroke: black;
stroke-width:1px;



}


.liniaobrysowa

{
stroke: black;

}

polygon{

fill: lightgrey;
}
polygon:hover{
fill: pink; 

cursor: pointer;
}





























.table
{
background-color: white;


}
.table5piw
{
background-color: white;
width:100%;
margin-left: auto;
margin-right: auto;
text-align: left;
}





.namaxa{


height: 594px;
width:420px;
margin-left: auto;
margin-right: auto;
text-align: left;

}


.SELECTONE,
.DV
{

float: left;  
}




.updown
{    


}


.updown:hover
{    
background-color:pink;   
}








#wynikselectsettings{

}











.INPUTY
{
    font-size: 2.2vh;
}


.jumpvar,
.szerpasavar,
.spadpasavar,
.konstvar,
.ZNAKjumpvar,
.ZNAKszerpasavar,
.ZNAKspadpasavar,
.ZNAKkonstvar
{
width: 60px;
margin: 2px;
}










.OKIENKOZOOM


{

height: 165px; 
width: 100%;







background-color:white; 


pointer-events: none;

}



.celOKIENKOZOOM


{

}


.OKIENKOSVG

{

height: 88px;
width: 88px;

pointer-events: none;
background-color: lightyellow;
}



.OKIENKOSVGADDlev1
{
    height: 150px;
    width: 150px;
    pointer-events: none;
    background-color: white;
}
.OKIENKOSVGADDlev2
{
    height: 165px; 
    width: 100%;
   
   
    pointer-events: none;
    background-color: white;
}







.OKIENKOtiles
{
   
    height: 95px;
   
   
   
   
    transform: scaleY(9.5);
    pointer-events: none;
    
}



.celOKIENKO5piw
{
   
   
   
   
   
   
    height: 10vh;
    width: 8vw;

}
.OKIENKO5piw
{
   
   
   
   
   
    width: 100%;
    height: 100%;
   
   
   
   
    background-color: white;

}












.btn_create,
.btn_clone,
.btn_clone_nz
{





padding: 0px;
margin: 1px;
border: 3px solid grey;
}





.btn_create:hover
{

border: 3px solid lime;
}


.btn_clone:hover
{

border: 3px solid red;
}

.btn_clone_nz:hover
{

border: 3px solid gold;

}










.btn_strielaEDIT:hover{
fill: red;
}
.btn_strielaPAPIER:hover{
fill: blue;
}
.btn_strielaFILTERPANEL:hover{
fill: darkorange;
}
.btn_strielaTILES:hover{
background-color: pink;
}




.btn_strielaMINI:hover{
fill: orange;



}




.strielaL:hover,
.strielaP:hover,
.strielaUPGRADE:hover,
.strielaDOWNGRADE:hover
{

background-color: white;
border: 3px solid black;
stroke: black;
fill: orange;
rotate: 100%;
rotate: 90;
}

.strielaL,
.strielaP,
.strielaUPGRADE,
.strielaDOWNGRADE

{







zoom: 80%;
stroke: black;
fill: black;

}
.strielaL,
.strielaP

{


}
.strielaL

{
transform: rotate(180deg);
}

.strielaUPGRADE
{
transform: rotate(270deg);
}
.strielaDOWNGRADE
{
transform: rotate(90deg);
}





















































































#svgMESSmini
{
margin:5px;

width: 75px;
























margin-left: auto;
margin-right: auto;
background-color: lightyellow;




}
















.moveP,
.moveL{

height: 3vh;
   
}


.btn_moveLL_selectEDIT,
.btn_moveL_selectEDIT,
.btn_moveC_selectEDIT,
.btn_moveP_selectEDIT,
.btn_movePP_selectEDIT
{


background-color: white;
border: 0px;
font-size: 1.8vh;

white-space: nowrap;
width: 4vw;
}

.btn_moveLL_selectEDIT:hover,
.btn_moveL_selectEDIT:hover,
.btn_moveC_selectEDIT:hover,
.btn_moveP_selectEDIT:hover,
.btn_movePP_selectEDIT:hover
{

stroke: yellow;
}

.btn_move_selectEDIT
{


background-color: grey;


width: 100%;
height: 4vh;
}


.btn_moveC_selectEDIT

{
   
    width: 100%;
   
    margin-left: 0%;
    margin-right: 0%;
    text-align: center;
    background-color: gray;






}






























#tabl_elementyscalone{
border:3px solid black;


    }

.tr_elementyscalone{
border:1px solid black;
margin-left: auto;
margin-right: auto;
background-color: darkkhaki;
    }



#skala{
width: 100px;
border:3px solid black;
}



.klawa{

margin-left: auto;
margin-right: auto;
}
.tradmin{

height:10px;
}
.tdklawa{

width:30px;
height:30px;
text-align: center;
}








.tdminiFIRST,
.tdminiLAST
{


text-align: center;
white-space: nowrap;
width:5vw;
}

.tdmini{


text-align: center;
white-space: nowrap;
}






.tdmaxi{


text-align: center;
}


.tdopis{
width: 100%;
height: 100px;
overflow-y: scroll;

background-color: white;
font-size: 14px;
}















.button span {
    font-size: 2vw;
}


.btn_w100{
width: 100%;
height: 5vh;
margin: 0.5vh;
text-align: left;
border: none;
cursor: pointer;


display:flex;
font-size: 4.1vh;
}

.btn_w100:hover{
    background-color: gray;
}


.icon {
   
    height: 100%; 
   
   
   
  }
.icon2 {
   
    height: 100%; 
  }
.icon3 {
   
    height: 100%; 
  }

.btn_move_zoom
{
    height: 4vh;
    margin: 0.5vh;
    text-align: center;
    border: none;
    cursor: pointer;
    display:flex;
}






.btn_w80{

width: 67%;
height: 4vh;
text-align: left;
border: none;
margin: 0.1vh;


display: inline-flex;
font-size: 2.5vh;
}

.btn_w80:hover{
    background-color: gray;
}

.btn_strielaSAVE{
    width: 25%;
   
    border: none;
    text-align: center;
   
    height: 3vh;
    display: inline-flex;
    margin: 0.1vh;
}

.btn_strielaSAVE:enabled:hover{
    background-color: blue;
    fill: white;
   
}

.btn_font1vw{
font-size: 0.7vw;
}



.tdopis:hover{
   
   
}


#checkboxAuto,
#checkboxManual
{
    width: 23px;
    height:23px;
    background-color: greenyellow;
    border:1px soli black;
    border-radius: 2px;   
    word-wrap: break-word;
margin: 1px;
}

.KOSTKAmidi
{
width: 73px;
height:23px;
background-color: greenyellow;
border:1px soli black;
border-radius: 2px;   
word-wrap: break-word;
margin: 1px;
}

.KOSTKAmini
{
width: 30px;
height:15px;
background-color: greenyellow;
border:1px soli black;
border-radius: 1px;   
word-wrap: break-word;
margin: 1px;
}

.KOSTKAmidiBUFOR
{
width: 73px;
height:17px;
background-color: pink;
border:1px soli black;
border-radius: 1px;   
word-wrap: break-word;
margin: 1px;
}



.KOSTKAmaxi
{
width: 73px;
height:51px;
background-color: greenyellow;
border:1px soli black;
border-radius: 3px;   
word-wrap: break-word;
margin: 1px;
}

.KOSTKA:hover,
.KOSTKAmini:hover,
.KOSTKAmidi:hover
{

background-color: white;

}



.plusbutton{
width: 30px;
height:30px;
background-color: greenyellow;
border:1px solid black;
border-radius: 15px;

}





.plusbutton:hover{

background-color:white;

}