@charset "UTF-8";
    /*!
     * MainStyleSheet v1.1
     * Released under the MIT license
     * Date: 2022-01-24
     */
/*    
    html, body {
      /*height: 100%;*/
      margin: .5%;
      /* font-size: 1em; */
    }
    
    .hide-elem {
      display: none;
    }
    
    h1 { font-size: 1.2em; }
    
    .bottom-button {
      padding: 5%;
    }
*/    
    /* start of css for divTable */
    
    .divTable{
      display: table;
      width: 99.5%;
    }
    .divTableBody {
      display: table-row-group;
    }
    .divTableRow {
      display: table-row;
    }
    .divTableHead {
      background-color: #ccc;
      text-align: center;
    }
    .divTableFooter {
      background-color: #eee;
      /*text-align: center;*/
    }
    .divTableCell, .divTableHead, .divTableFooter {
      border: 1px solid #999999;
      display: table-cell;
      padding: .1em .1em;
    }
    /*
    .divTableHeading {
      background-color: #EEE;
      display: table-header-group;
      font-weight: bold;
    }
    .divTableFoot {
      background-color: #EEE;
      display: table-footer-group;
      font-weight: bold;
    }
    */
    /* end of css for divTable */
    
    @media screen and (max-width: 798px) {
      /*.divTable{
        display: initial;
        width: 99.5%;
      }
      .divTableBody {
        display: initial;
      }
      .divTableRow {
        display: initial;
        float: left;
      }
      .divTableHead {
        background-color: #ccc;
        text-align: center;
      }
      .divTableFooter {
        background-color: #ccc;
        text-align: center;
      }*/
      .divTableCell, .divTableHead, .divTableFooter {
        /*border: 1px solid #999999;
        display: table-cell;*/
        float: left;
        min-width: 32%;
        /*padding: .1em .1em;*/
      }
    /*
      .divTableHeading {
        background-color: #EEE;
        display: table-header-group;
        font-weight: bold;
      }
      .divTableFoot {
        background-color: #EEE;
        display: table-footer-group;
        font-weight: bold;
      }
    */
    }
/*
    #footer
    {
      margin: .5%;
      padding: .5%;
      /* border: 1px solid black; */
    }
    #footer a
    {
      text-decoration: none;
      padding: .1%;
    }
    #footer a:hover
    {
      color: #ffffff;
      background-color: #666666;
    }
*/
    /* css customization */
    #mainNav { opacity: 0.9; }
	header { padding: 4em 0 .5em; }
	section { border-top: 1px solid gray; border-bottom: 1px solid gray; }
	.esp-section { color: red; }
    .dht-labels { font-size: 1.5rem; }
    .btn-lights { font-size: 1.2em; }
    .light-on { color: orange; font-size: 2.8em; }
    .light-off { color: black; font-size: 2.6em; }
	
	/* start of sliders css */

	input[type=range].vslider {
	   /* -webkit-appearance: none; */
	  
	  transform: rotate(270deg) translateY(-50%);
	  
	  /* top and bottom margins are 50% off the width because of the transformation */
	  margin-top: 5em;
	  margin-bottom: 5em;

	  /* width: 10em; */
	  width: auto;
	  height: auto;
	}
/*
	input[type=range].vslider::-webkit-slider-thumb {
	  -webkit-appearance: none;
	  background-color: #777;
	  opacity: 0.75;
	  width: 25px;
	  height: 40px;
	  transform: translateY(-10px);
	}

	input[type=range].vslider::-webkit-slider-runnable-track {
	  -webkit-appearance: none;
	  background-color: #444;
	  color: #444;
	  height: 20px;
	  width: 400px;
	}
*/
	#LSlider {
	  /* left: calc(25% - 200px); */ /* 50% of the width because of the transformation */
	}

	#RSlider {
	  /* left: calc(75% - 200px); */ /* 50% of the width because of the transformation */
	}
	
	/* #JQslider1 { margin: 10px; }*/

	/* end of sliders css */
	
	/* start of VideoStreamPlayer css */
	#VideoStreamPlayer {
	  width: 100% !important;
	  height: auto !important;
	}
	/* start of VideoStreamPlayer css */