:root{--main-bg:#e0f1f9}
 #fovcalc tr td {
    padding: unset
}
 #fovcalc tr {
    border-bottom: none;
}

 #fovcalc td.tableCell {
     border-style: solid;
     border-width: 2px;
     border-color: var(--main-bg);
}
 #tbl {
     position: relative;
     border: solid 2px var(--main-bg);
     width: 604px;
     height: 116px;
     margin: 0;
     padding: 0;
     overflow: hidden;
	 border-collapse: separate;
}

 #cel td {
    padding: 0;
}
 #grid {
     padding: 0;
     z-index: 30;
     position:absolute;
     letter-spacing: 0;
     top: 0;
     left: 0;
}
 #group {
     position:relative;
     width: 604px;
     height: 113px;
     margin: auto;
	 outline: 1px solid black;
}
 #fovcalc p {
     margin: 1em 0;
}
/* #fovcalc {
	 font-family: Verdana, Tahoma, Helvetica, Arial;
}*/
 #fovcalc ul {
     list-style: none;
}
 #fovcalc ul ul li {
     display: inline-block;
     margin-bottom: 10px;
}
 #arc td {
     padding: 0.5em;
}
 #arc {
     margin: 0;
     padding: 0;
}
 #arc input {
     padding: 0.2em;
     border: solid 1px black;
     background: rgb(255, 255, 255);
     border-radius: 4px;
}
 #arc input:focus {
     background: rgb(255, 255, 192) !important;
}
 #fov {
     margin: 0;
     padding: 0;
     display: flex;
	 flex-wrap: wrap;
     border-collapse: collapse;
     width: 100%;
	 gap: 1em;
}
 #fov input {
     padding: 0.2em;
     border: solid 1px black;
     background: rgb(255, 255, 255);
     border-radius: 4px; 
}
 #fov input:focus {
     background: rgb(255, 255, 192) !important;
}

#MHz, #rezxbez, #rezybez, #bandwidth, #pixels, #ratiosingle, #ratio, #vfovOutspan, #fovOutspan,
#ratiodec, #ratiosingledec {
     font-weight: bold;
}
 #group img {
     max-width: unset;
}
 #visual-ratio {
     position: absolute;
     left: 0;
     top: 0;
     background: white;
     width: 600px;
     height: 113px;
     line-height: 113px;
     text-align: center;
     margin: 0;
     padding: 0;
     overflow: hidden;
     z-index: 0;
}
 #visual-ratio img {
     position: absolute;
     top: 0;
     left: 0;
     width: 600px;
     height: 113px;
}
 #loading {
     position: absolute;
     top: 0;
     left: 0;
     background: var(--main-bg);
     width: 604px;
     height: 116px;
     z-index: 32;
     border: solid 1px black;
     line-height: 113px;
     text-align: center;
}
#fovcalc input {
  margin: 0 0.4em;/*Temp workaround*/
}
 #main {
     position:relative;
     /*
	background: #53b0de;
    width: 680px;
	border: solid 1px black;
    */
     background: var(--main-bg);
     padding: 1.2em;
     margin: 1em 0;
     border-radius: 12px;
     line-height: normal;
}
 #information {
     padding: 0 1em;
     margin: 1em 0;
     border: solid 1px black;
     border-radius: 12px;
     display:none;
}
 /*#reset {
     text-align:right;
     font-weight:bold;
     text-decoration:underline;
}
 #reset:hover {
     cursor:pointer;
     color:maroon;
}*/

@media (max-width: 49rem) {
    #preview {
        display: none;
    }
}
 .style2 {
     text-align: center;
}
 #cablecontainer {
     text-align: right;
	 display: flex;
     flex-wrap: wrap;
     justify-content: space-evenly;
}
 .style4 {
     font-size: smaller;/*xx-small;*/
}

 .cablelist {
     padding: 0;
     margin: 0;
}

/* .style4s {
     font-size: x-small;
}
 .smallbutton {
     font-size:x-small;
}*/
 #hudoverlayleft {
     position: absolute;
     left: 0;
     top: 0;
     background:transparent;
     width: 600px;
     height: 113px;
     line-height: 113px;
     text-align: center;
     margin: 0;
     padding: 0;
     overflow: hidden;
     z-index: 11;
}
 #hudoverlayleft img {
     position: absolute;
     top: 1px;
     width: 600px;
     height: 113px;
}
 #hudoverlayright {
     position: absolute;
     left: 0;
     top: 0;
     background:transparent;
     width: 600px;
     height: 113px;
     line-height: 113px;
     text-align: center;
     margin: 0;
     padding: 0;
     overflow: hidden;
     z-index: 10;
}
 #hudoverlayright img {
     position: absolute;
     top: 1px;
     width: 600px;
     height: 113px;
}
 #fieldsR {
     border:1px black solid;
     border-radius: 6px;
     overflow:visible;
     position:relative;
     padding:10px;
     z-index:20;
}
 #fieldsO {
     border:1px black solid;
     border-radius: 6px;
     overflow:visible;
     position:relative;
     padding:10px;
     z-index:21;
}
 #fieldstitle {
     position:absolute;
     top:-0.6em;
     left:1em;
     /*font-size:small;*/
     font-weight:bold;
     line-height:1em;
     z-index:25;
	 background-color: var(--main-bg);
}

 .style5 {
     font-size: small;
     font-weight: bold;
}
 .style6 {
     font-size: small;
     text-align: left;
}
 fieldset {
     display:block;
     border:none;
}
 #divexp {
     position:relative;
     height:1px;
     overflow:visable;
}
 #visexp {
     position:relative;
     margin:0 auto;
     width:99%;
     top:10px;
     display:none;
     z-index:999;
     background-color:gray;
     -webkit-border-radius: 12px;
     -moz-border-radius: 12px;
     border:1px black solid;
     cursor:pointer;
}
 #visexpimg1, #visexpimg2 {
     position:relative;
     width:98%;
     margin:0 auto;
     padding-bottom:25px;
}
 #spanexp {
     text-decoration:underline;
     cursor:pointer;
     font-weight:bold;
     color:maroon;
}
 #spanexp:hover {
     color:black;
     cursor:pointer;
}
 #bezelcompspan {
     display:inherit;
}
 #bezauto {
     text-decoration:underline;
     font-weight:bold;
     color:maroon;
}
 #bezauto:hover {
     cursor:pointer;
     color:black;
}
 #bezautotext {
     color:black;
}
 .inlinefix {
	align-items: center;
	display: inline-flex;
}

.topfield {
  flex: 1 1 calc(50% - 1em);
  text-align: left;
}