style.css

  /*Copyright (C) 2021 Pierre Kreins  

This program is free software: you can redistribute it and/or modify
it under the terms of the GNU General Public License as published by
the Free Software Foundation, either version 3 of the License, or
(at your option) any later version.

This program is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
GNU General Public License for more details.

You should have received a copy of the GNU General Public License
along with this program.  If not, see <http://www.gnu.org/licenses/>. */
  
  .navbar{
    background-color: #004a99;
  }

 #logo  {
  background-color: white;
  border-radius: 2px;
  }
  
  .eingabe{
      width: 300px;
  }
  .ableitungI {
    background-color: var(--bs-purple);

  }

  .ableitungII {
    background-color: var(--bs-orange);
}

.ableitungIII {
    background-color: var(--bs-teal);
}

  .electrode{
    width: 100px;
    height: 100px;
    cursor: move;
  }

  .source{
    width: 48px;
    height: 70px;
    touch-action: none;
  user-select: none;
  cursor: move;
  }

  #plus{
    position: absolute;
    left: 60%;
    top: calc(50% - 45px);
  }
  
  #minus{
    position: absolute;
    left: 40%;
    top: calc(50% - 45px);
  }

  #electrode1{
    position: absolute;
    left: calc(100% - 120px);
    top: 10px;
    height: 70px;
  }

  #electrode2{
    position: absolute;
    left: 30px;
    top: 10px;
    height: 70px;
  }

  #electrode3{
    position: absolute;
    left: calc(100% - 120px);
    top: calc(100% - 90px);
    height: 70px;
  }

  #mainCanvas{
    height: 100%;
    width: 100%; 
  }

  #screen {
    overflow: hidden;
    border-radius: 5px;
    width: 100%;
    max-height: 550px;
    clear: both;
    border: 1px solid rgba(0,0,0,.2);
    background-color:white; 
    background-image: linear-gradient(90deg, rgba(200,0,0,.08) 50%, transparent 50%), linear-gradient(rgba(200,0,0,.08) 50%, transparent 50%); 
    background-size:30px 30px;
    
  }

  #oscilloCanvas{
    height: 100%;
    width: 100%; 
  }

  #oscilloCase {
    border-radius: 18px;
    padding: 15px;
    border: 1px solid black;
    background-color: #cfcfcf;
  }


  #oscillo {
    overflow: hidden;
    border-radius: 25px;
    clear: both;
    border: 1px solid black;
    background-color: lightblue;
  }