html {
  font-family: 'Consolas', monospace;
  background-color: #202020;
  color:#CCA700;
  text-align: center;
  clear:left;
}
body
{
    width:100%;
    margin-left:auto;
    margin-right:auto;
  text-align: center;
  top:0;
}
div {
  background-color: #202020;
}

h1 {
  text-align: center;
}

.center {
  margin-left: auto;
  margin-right: auto;
  text-align: center;
  cellpadding:0;
  cellspacing:0;
}
/*
a:link {
  color: red;
}
a:visited {
  color: green;
}
a:hover {
  color: hotpink;
}
a:active {
  color: blue;
}*/
a {
  color: #CCA700;
}
.topPassRech { 
  stroke-dasharray: 0,100,200;
  stroke: #CCA700;
  stroke-width: 1%;
}
.bottomPassRech {
  stroke-dasharray: 200,100;
  stroke: #CCA700;
  stroke-width: 1%;
}
.pBeschrPassRech{
  padding-left:40px;
  width:160px;
  line-height:0.2;
  text-align:left;
}
.pZinZinRech{
  padding-left:20px;
  width:200px;
  line-height:0.2;
  text-align:left;
}
.pLargeOutput{
  padding-left:20px;
  width:200px;
  line-height:0.2;
  text-align:left;
}
.pCsvPlot{
  padding-left:10px;
  width:80px;
  line-height:0.2;
  text-align:left;
}
.pViskoRech{
  padding-left:20px;
  width:250px;
  line-height:1.2;
  text-align:left;
}
.pOrderCalc{
  padding-left:20px;
  width:320px;
  line-height:0.2;
  text-align:left;
}
.pGgTKgV{
  padding-left:20px;
  width:350px;
  line-height:0.2;
  text-align:left;
}
.pPLGWide{
  padding-left:10px;
  width:300px;
  line-height:0.2;
  text-align:left;
}
.pPLGWideHigher{
  padding-left:10px;
  width:250px;
  line-height:1.2;
  text-align:left;
}
.pPLGVerySmall{
  padding-left:20px;
  width:70px;
  line-height:0.2;
  text-align:left;
}
.pPLGSmall{
  padding-left:10px;
  width:150px;
  line-height:0.2;
  text-align:left;
}
.pSonderzeichen{
  padding-left:1px;
  width:10px;
  line-height:0.2;
  text-align:left;
}
.inputZinZinRech{
  width:120px;
}
.outPlgPhasing{
  width:240px;
}
.inputCsvPlot{
  width:50px;
}
.inputCsvPlotShort{
  width:30px;
}
.inputViskRech{
  width:80px;
}
.inputPLGSmall{
  width:80px;
}
.inputOrderCalc{
  width:120px;
}
.phref{
  padding-right:20px;
  text-align:right;
}
.phrefMain{
  padding-left:200px;
  text-align:left;
}
.phrefHome{
  padding-left:20px;
  text-align:left;
}
hr{
  background-color: #CCA700;height: 1px; border: 0; 
}
.pGenCenter{
  padding-left:30px;
  padding-right:30px;
  text-align:center;
}
.header{
		  position: sticky;
		  top:0;
		  width:100%;
		  background-color: #202020;
}
.headerTable{
		  position: sticky;
		  top:0;
		  width:100%;
		  background-color: #353535;
}
#plotOrderContainer{
		position: fixed;
		top: 20; 
		center: 0;
		display: block;
		width: 50%;
      padding-left:10px;
}
#content{
  display:grid;
  grid-template-columns:40% 60%;
  margin-top:20px;
  justify-content: center;
  align-content: center;
}
.VerySmallButton {
		  width: 40px;
		  height: 30px;
  border: none;
  padding: 1px 2px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 12px;
  margin: 2px 1px;
  transition-duration: 0.4s;
  cursor: pointer;
}
.button {
  border: none;
  color: #202020;
  padding: 8px 16px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 16px;
  margin: 4px 2px;
  transition-duration: 0.4s;
  cursor: pointer;
}

.button1 {
  background-color: #CCA700;
  color: #202020;
  border: 2px solid #CCA700;
}

.button1:hover {
  background-color: #454545;
  color: #CCA700;
  border: 2px solid #CCA700;
}
@media print
{    
    .no-print, .no-print *
    {
        display: none !important;
    }
}
#drop_zone {
  border: 5px solid #CCA700;
  width:  90%;
  height: 200px;
  background-color: #454545;
}
.grid-container {
  display: grid;
  grid-template-columns: 30% auto auto;
  gap: 5px;
  background-color: #202020;
  padding: 5px;
  text-align: center;
  align-content: center;
  justify-content: center;
}

.grid-container > div {
  background-color: #202020;
  text-align: center;
  padding: 20px 0;
}

.item2 {
  width:  800px;
  height: 100%;
  grid-column-start: 2;
  grid-column-end: 5;
  grid-row-start: 1;
  grid-row-end: 3;
}