/* Top menu */

        /* wide screen */
        @media (min-width: 600px) {
          #mainHeader {
            width: 100%;
            background-color:  #134fa8;
            z-index: 10;
            position: fixed;
            right: 0;
            top: 0;
            height: 66px;
            font-family: Arial, Helvetica, sans-serif;
          }

          .container_left {
            display: flex;
            flex-wrap: wrap;
            margin-top: 70px;
            margin-left: 0px;
            font-size: 16px;
            font-family: Arial, Helvetica, sans-serif;
          }

          .container_monitor {
            display: flex;
            flex-wrap: wrap;
            margin-top: 40px;
            margin-left: 0px;
            font-size: 16px;
            font-family: Arial, Helvetica, sans-serif;
          }          

          .container_center{
            display: flex;
            justify-content: center;
            margin-top: 70px;
            /*margin-left: 100px; */
            font-size: 12px;
            font-family: Arial, Helvetica, sans-serif;
          }

          #terminalsListMonitor {
            padding-top: 70px;
          }          
        }

        @media (max-width: 599px) {
          #mainHeader {
            width: 100%;
            background-color:  #134fa8;
            z-index: 10;
            position: fixed;
            right: 0;
            top: 0;
            height: 100px;
            font-family: Arial, Helvetica, sans-serif;
          }

          .container_left {
            display: flex;
            flex-wrap: wrap;
            margin-top: 104px;
            margin-left: 0px;
            font-size: 16px;
            font-family: Arial, Helvetica, sans-serif;
          }

          .container_monitor {
            display: flex;
            flex-wrap: wrap;
            margin-top: 30px;
            margin-left: 0px;
            font-size: 16px;
            font-family: Arial, Helvetica, sans-serif;
          }          

          .container_center{
            display: flex;
            justify-content: center;
            margin-top: 100px;
            /*margin-left: 100px; */
            font-size: 12px;
            font-family: Arial, Helvetica, sans-serif;
          }

          #terminalsListMonitor {
            padding-top: 100px;
          }
          
          ul {
            display: block;
            list-style-type: disc;
            padding-inline-start: 20px;
          }

          .user_name {
            padding-right: 10px;
          }          

        }

        /*
        #mainHeader {
            width: 100%;
            background-color:  #134fa8;
            z-index: 10;
            position: fixed;
            right: 0;
            top: 0;
            height: 66px;
            font-family: Arial, Helvetica, sans-serif;
        }
        */

        #brand_name {
            color: white;
            text-decoration: none;
            font-size: 32px;
            margin-top: 14px;
            margin-left: 20px;
            margin-right: 30px;
            display:inline-block;
        }

        .inline_element {
            display:inline-block;
            padding-right: 12px;
        }

        .inline_element li a {
          transition: all 0.3s ease 0s;
        }
        
        .inline_element li a:hover {
          color: #2f86b1;
        }                

        .menu_link{
            text-decoration: none;
         }
         
        .user_name {
          color: white; 
          text-decoration: none;

        }

        .logout {
          color: white; 
          text-decoration: none;
        }

        .inline_element a:hover {
          transition: all 0.3s ease 0s;
          color: #2f86b1;
        }           

        .notcurrent {
            color: white; 
        }

        .current {
            color: rgb(170, 214, 243); 
        }   

        .toplogin {
            color: white;
            margin-top: 28px;
            margin-right: 32px;
            text-decoration: none;
            float: right;
        }
        /* End Top menu */

        /* Side menu 
        .sidenav {
            width: 100px;
            position: fixed;
            z-index: 1;
            top: 66px;
            left: 0px;
            background: #eee;
            overflow-x: hidden;
        }

        .sidenav a {
            padding: 6px 8px 6px 16px;
            text-decoration: none;
            font-size: 20px;
            color: #2196F3;
            display: block;
        }

        .sidenav a:hover {
            color: #064579;
        }

        @media screen and (max-height: 450px) {
          .sidenav {
              padding-top: 15px;
          }

          .sidenav a {
              font-size: 18px;
          }
        }
         End Side menu */
        

        /* Center of the page */
        /*
        .container_left {
          display: flex;
          flex-wrap: wrap;
          margin-top: 70px;
          margin-left: 0px;
          font-size: 16px;
          font-family: Arial, Helvetica, sans-serif;
        }
        */




        /* Login form */
        .form-group {
          margin-top: 20px;
          font-family: Arial, Helvetica, sans-serif;
          font-size: 16px;
        }

        input[type=text], textarea, select, option, fieldset, input[type=password] {
          width: 100%;
          padding: 12px 20px;
          margin: 8px 0;
          display: inline-block;
          border: 1px solid #ccc;
          border-radius: 4px;
          box-sizing: border-box;
          font-size: 18px;
        }

        button {
          width: 100%;
          padding: 12px 20px;
          margin: 8px 0;
          display: inline-block;
          background-color:   #134fa8;
          border: 1px solid  #134fa8;
          color: #ccc;
          border-radius: 4px;
          box-sizing: border-box;
        }

        /* Report page */

        .table_data{
            border: 1px solid black;
            border-collapse: collapse;
            font-family: Arial, Helvetica, sans-serif;
            font-size: 12px;
            text-align: center;
            padding: 2px 2px;
        }

        th {
           background-color: rgb(174, 215, 248); 
        }

        input[type=date] {
          padding: 12px 20px;
          margin: 8px 0;
          margin-left: 10px;
          display: inline-block;
          border: 1px solid #ccc;
          border-radius: 4px;
          box-sizing: border-box;
          font-size: 18px;
        }

        /*
        #div_date {
          width: 1200px;
        }
        */

        #date_form {
          padding: 12px 20px;
          margin: 8px 0px;
          margin-bottom: 20px;
          display: inline-block;
          border: 1px solid #ccc;
          border-radius: 4px;
          box-sizing: border-box;
          font-size: 18px;       
        }

        #date_submit {
          width: auto;
          padding: 12px 20px;
          margin: 8px 0;
          margin-left: 10px;
          display: inline-block;
          background-color:   #134fa8;
          border: 1px solid  #134fa8;
          color: #ccc;
          border-radius: 4px;
          box-sizing: border-box;
        }

        #div_date, #terminalsList
        {
            display:inline;
        }

        #mycalendar { 
            background: rgb(255, 255, 255);
            cursor: pointer;
            padding: 5px 10px;
            border: 1px solid #ccc;
            width: 220px;
        } 

        #terminalsListTitle{
          margin-top: 14px;
          margin-left: 30px;      
        }

        /*
        #terminalsList{
          margin-top: -4px;
          margin-left: -8px;
        }
        */

        #terminalsListMonitor li{
            display: inline;
            list-style-type: none;
            padding-right: 10px;
        }


        #terminalsList {
          display: flex;
          flex-wrap: wrap;
        }

        #terminalsList > div {
          font-size: 16px;
          margin: 0px;
          padding: 12px;
        }

        #tableKPI, #tableTerminalsList {
          margin-top: 5px;
          margin-bottom: 5px;
          font-family: Arial, Helvetica, sans-serif;
          font-size: 18px;
          text-align: center;
          padding: 1px 1px;    
          width: 95%;    
          border: 1px solid black;
          margin-left: auto;
          margin-right: auto;
        }

        .tableKPI_data {
          width: 230px;
          text-align: left;
          padding: 5px;
          background-color: #f5f5f5;
          vertical-align: top;
        }

        .titleGraphic {
          text-align: center;
          width: 100%;
        }

        table#operationsTable {
          margin-left:50px; 
        }

        .submitButton {
          background-color: #385da3;
          border: none;
          border-radius: 4px;
          color: white;
          padding: 0px 10px;
          text-align: center;
          text-decoration: none;
          display: inline-block;
          font-size: 16px;
          margin: 6px 4px;
          cursor: pointer;
        }

        /*
        div.container {
          width: 80%;
          background-color: red;
        }
        */   

        p {
          font-family: Arial, Helvetica, sans-serif;
          font-size: 18px;
        }

        .textstylegreen {
          background-color: green; /* Changing background color */
          font-weight: bold; /* Making font bold */
          border-radius: 3px; /* Making border radius */
          width: 10px; /* Making auto-sizable width */
          height: auto; /* Making auto-sizable height */
          padding: 3px 3px 3px 3px; /* Making space around letters */
          font-size: 12px; /* Changing font size */
          color:white;
          margin: 0.8px;
        }
      
        .textstylered {
          background-color: red; /* Changing background color */
          font-weight: bold; /* Making font bold */
          border-radius: 3px; /* Making border radius */
          width: 10px; /* Making auto-sizable width */
          height: auto; /* Making auto-sizable height */
          padding: 3px 3px 3px 3px; /* Making space around letters */
          font-size: 12px; /* Changing font size */
          color:white;
          margin: 0.8px;
        }
        
        
        
        .textstylegray {
          background-color: gray; /* Changing background color */
          font-weight: bold; /* Making font bold */
          border-radius: 3px; /* Making border radius */
          width: 10px; /* Making auto-sizable width */
          height: auto; /* Making auto-sizable height */
          padding: 3px 3px 3px 3px; /* Making space around letters */
          font-size: 12px; /* Changing font size */
          color:white;
          margin: 0.8px;
        }
        
        
        
        
        .statusgreen {
            background-color: green; /* Changing background color */
            font-weight: bold; /* Making font bold */
            border-radius: 10px; /* Making border radius */
            width: auto; /* Making auto-sizable width */
            height: auto; /* Making auto-sizable height */
            padding: 5px 10px 5px 10px; /* Making space around letters */
            font-size: 10px; /* Changing font size */
        }
        
        .statusred {
            background-color: red; /* Changing background color */
            font-weight: bold; /* Making font bold */
            border-radius: 10px; /* Making border radius */
            width: auto; /* Making auto-sizable width */
            height: auto; /* Making auto-sizable height */
            padding: 5px 10px 5px 10px; /* Making space around letters */
            font-size: 10px; /* Changing font size */
        }
        
        
        
        
        .forecast_data {
          margin-top: 5px;
          margin-bottom: 5px;
          font-family: Arial, Helvetica, sans-serif;
          font-size: 14px;
          text-align: left;
          padding: 2px 2px;    
          margin-left: 10px;
          margin-right: 10px;
        }
        .forecast_data_perc {
          margin-top: 5px;
          margin-bottom: 5px;
          font-family: Arial, Helvetica, sans-serif;
          font-size: 14px;
          text-align: left;
          padding: 1px 1px;    
          margin-left: auto;
          margin-right: auto;
        }