:root {
--SYSfont:URWGothic;
--SYSweight:normal;
--sfzm5:11px;
--sfzm4:12px;
--sfzm3:13px;
--sfzm2:14px;
--sfzm1:15px;
--SYSsize:16px;
--sfzp1:17px;
--sfzp2:18px;
--sfzp3:19px;
--sfzp4:20px;
--sfzp5:21px;
--sfzp9:25px;
}


@font-face{ font-family: "URWGothic";
src: local("URWGothic"),
url("../FON/URWGothic/URWGothic-Book.otf")
format("OpenType") }

@font-face{ font-family: "Nunito";
src: local("Nunito"),
url("../FON/Nunito/Nunito-Light.ttf")
format("OpenType") }

@font-face{ font-family: "DigitalGeometric";
src: local("DigitalGeometric"),
url("../FON/DigitalGeometricB/DigitalGeometricB.ttf")
format("TrueType") }

@font-face{ font-family: "GirlSecret";
src: local("GirlSecret"),
url("../../FON/GirlSecret/GirlSecret.ttf")
format("TrueType") }


body{ background:var(--HG);color:var(--TXT);font-family:var(--SYSfont),arial;font-weight:var(--SYSweight);font-size:var(--SYSsize);cursor:default; }

/* ### NEU NEU ###   hover aufClass Hell / Dunkel verweisen?? oder BG in Hover !Hover splitten */

         /* System */
.sBut{ height:28px;color:var(--TXT);font-family:var(--SYSfont),arial;font-weight:var(--SYSweight);font-size:var(--SYSsize);cursor:pointer;
border-radius:10px;overflow:hidden; }
.sInp{ height:28px;color:var(--TXT);font-family:var(--SYSfont),arial;font-weight:var(--SYSweight);font-size:var(--SYSsize);cursor:text; }
.suchInp{ height:30px;padding-left:15px;vertical-align:middle;color:var(--TXT);font-family:var(--SYSfont),arial;font-weight:var(--SYSweight);font-size:var(--SYSsize);border-radius:30px;cursor:text; }
         /* User */
.uBut{ height:28px;color:var(--TXT);font-family:var(--FON),arial;font-weight:var(--WEIGHT);font-size:var(--SIZ);cursor:pointer;border-radius:10px;overflow:hidden; }
.uInp{ height:28px;color:var(--TXT);font-family:var(--FON),arial;font-weight:var(--WEIGHT);font-size:var(--SIZ);border-radius:10px;cursor:text; }

.MEv1TRA{ background-color:transparent;color:var(--TXT); }
.MEv1SEL, .MEv1TRA:hover { background-color:rgba(127,127,127,0.3);color:var(--TXT2); }
.MEv2TRA{ background-color:transparent;color:var(--TXT2); }
.MEv2SEL, .MEv2TRA:hover { background-color:rgba(127,127,127,0.3);color:var(--TXT);  }



/* Color */
.TXT, .TXThov:hover{   color:var(--TXT); }
.TXT2, .TXT2hov:hover{ color:var(--TXT2); }

/* Background */
.HGt, .HGthov:hover{ background:transparent; }
.HG,  .HGhov:hover{  background:var(--HG); }
.HG1, .HG1hov:hover{ background:var(--HG1); }
.HG2, .HG2hov:hover{ background:var(--HG2); }
.HGp, .HGp:hover{ background-image:var(--pattern); }
.HGv1, .HGv1hov:hover{ background:linear-gradient(to bottom, var(--HG1), var(--HG2)); } /*  1  */
.HGv2, .HGv2hov:hover{ background:linear-gradient(to bottom, var(--HG2), transparent); }
.TRA, .TRAhov:hover { background-color:rgba(127,127,127,0.3); }
.HGSW, .HGSWhov:hover{ background:#000;color:#eee; }
.HGRO, .HGROhov:hover{ background:#b00;color:#fff; } /* #d00 */
.HGGR, .HGGRhov:hover{ background:#0a0;color:#fff; } /* #090 */
/*
.HGLH, .HGLHhov:hover{ background:linear-gradient(5deg, var(--HG2), var(--HG1)); }
.HGLD, .HGLDhov:hover{ background:linear-gradient(5deg, var(--HG), var(--HG2)); }
*/
/* Border */
.BORn, .BORnhov:hover{ border:none; }
.BORt, .BORthov:hover{ border:1px solid transparent; }
/* .BOR,  .BORhov:hover{  border:1px solid var(--BOR); } */
.BOR1, .BOR1hov:hover{ border:1px solid var(--HG1); }
.BOR2, .BOR2hov:hover{ border:1px solid var(--HG2); }
.BORhg, .BORhghov:hover{ border:1px solid var(--HG); }
.BORtxt2, .BORtxt2hov:hover{ border:1px solid var(--TXT2); }
.BORv1{ border-image:linear-gradient(to bottom, var(--HG1), var(--HG2)) 1; }
.BORv2{ border-image:linear-gradient(to bottom, var(--HG2), var(--HG)) 1; }
/* .BORv2{ border-image:linear-gradient(to bottom, var(--HG1), var(--HG2)) 1; } */
.BORro, .BORrohov:hover{ border:1px solid #f00; }
.BORor, .BORorhov:hover{ border:1px solid #f90; }
.BORgr, .BORgrhov:hover{ border:1px solid #0b0; }
.BORra{ border-radius:50vh; }
.BORra10{ border-radius:10px; }
.BORra20{ border-radius:20px; }
.BORra30{ border-radius:30px; }

/* ### Standards ### */
.C_SCRO__10{ scrollbar-width:10px;scrollbar-color:var(--HG2) var(--HG); background:transparent; }
.C_SCRO__10{ scrollbar-width:10px;scrollbar-color:var(--TXT2) transparent;background:transparent; }

.C_SCRO10{ scrollbar-width:10px;scrollbar-color:rgba(127,127,127,0.6) transparent;background:transparent; }

.C_SCRO10::-webkit-scrollbar { width:10px; }
.C_SCRO10::-webkit-scrollbar-track { background:rgba(127,127,127,0.3); } /*var(--HG);*/
.C_SCRO10::-webkit-scrollbar-thumb { background:transparent; }
.C_SCRO10::-webkit-scrollbar-thumb:hover { background:rgba(127,127,127,0.6); }

/* Display */
.disIL{ display:inline; }
.disIT{ display:inline-table; }
.disIB{ display:inline-block; }
.disNO{ display:none; }
.disBL{ display:block; }
.talC{ text-align:center; }
.talL{ text-align:left; }
.talR{ text-align:right; }
.valT{ vertical-align:top; }
.valM{ vertical-align:middle; }
.valB{ vertical-align:bottom; }
.ovh{  overflow:hidden; }
.curPO{ cursor:pointer; }
.curTE{ cursor:text; }
.curHE{ cursor:help; }
.curDE{ cursor:default; }
.tdeu, .tdeuhov:hover{ text-decoration:underline;color:#f90; }
.marker, .markerhov:hover{ border-bottom-color:var(--TXT); }
.markerG{ border-bottom-color:#0e0; }
.markerO{ border-bottom-color:#f90; }
.markerR{ border-bottom-color:#f00; }

/* DIVERSES */
.NOres{ resize:none; }
.spa{ color:#888; }
.spa:hover{ color:var(--TXT); }

/* Font */
.sfon{ font-family:var(--SYSfont),arial; }
.ufon{ font-family:var(--FON),arial; }

/* Font Weight */
.swig{ font-weight:var(--SYSweight); }
.uwig{ font-weight:var(--WEIGHT); }

/* Font Size */
.sfz11{ font-size:var(--sfzm5); }
.sfz12{ font-size:var(--sfzm4); }
.sfz13{ font-size:var(--sfzm3); }
.sfz14{ font-size:var(--sfzm2); }
.sfz15{ font-size:var(--sfzm1); }
.sfz16{ font-size:var(--SYSsize); }
.sfz17{ font-size:var(--sfzp1); }
.sfz18{ font-size:var(--sfzp2); }
.sfz19{ font-size:var(--sfzp3); }
.sfz20{ font-size:var(--sfzp4); }
.sfz21{ font-size:var(--sfzp5); }
.sfz25{ font-size:var(--sfzp9); }

.ufz11{ font-size:var(--ufzm5); }
.ufz12{ font-size:var(--ufzm4); }
.ufz13{ font-size:var(--ufzm3); }
.ufz14{ font-size:var(--ufzm2); }
.ufz15{ font-size:var(--ufzm1); }
.ufz16{ font-size:var(--SIZ); }
.ufz17{ font-size:var(--ufzp1); }
.ufz18{ font-size:var(--ufzp2); }
.ufz19{ font-size:var(--ufzp3); }
.ufz20{ font-size:var(--ufzp4); }
.ufz21{ font-size:var(--ufzp5); }
.ufz25{ font-size:var(--ufzp9); }

textarea{ outline:none;resize:none; }
select{ outline:none; }
button{ outline:none;overflow:hidden; }
video{  outline:none; }
button:active{ font-style:italic; }
input{ outline:none;vertical-align:middle; }
input:placeholder-shown{ color:#fff; }
input:-webkit-autofill {
-webkit-box-shadow:0 0 0 30px #000 inset;
-webkit-text-fill-color: var(--TXT);
}
input:-webkit-autofill:focus {
-webkit-box-shadow: 0 0 0 30px #000 inset;
-webkit-text-fill-color: var(--TXT);
}
.noselect {
  -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
     -khtml-user-select: none; /* Konqueror HTML */
       -moz-user-select: none; /* Old versions of Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none; /* Non-prefixed version, currently supported by Chrome, Edge, Opera and Firefox */
}
/* End Standards */