@charset "UTF-8";
/*@import url('normalize.css'); */
@import url('myNavigation.css');

html {
     box-sizing: border-box;
     font-family:  Helvetica, Arial, sans-serif;
     font-weight: 300;
    }

  *, *::before, *::after {
    box-sizing: inherit; 
  }
  body {
    font-size: 1rem;
    line-height: 120%;
  }
  h1, h2, h3, h4, h5, h6 {
    /*font-family: 'Inconsolata', Courier, monospace;*/
    font-family:  Helvetica, Arial, sans-serif;
  }
  h1 { font-size: 1.5rem; }
  h2 { font-size: 1.5rem; }
  h3 { font-size: 1.2rem; }


  ul {
    padding: 0;text-align: left;
  }
  .wrapper {
     background-color :#fff; /* Weiß war für Test f0f*/
     /* border: 1px solid  red; */
  }

  /* ------------------------------------------------------------------
       CSS-Eigenschaften für  mobile Geräte (kleiner als 640 px)            
         + Alles in einer Spalte untereinander anordnen                                              
  -------------------------------------------------------------------- */
  .header {
     text-align: left; /*center;*/
     padding-left: 1rem;                   /* 1em entspricht Breite von M*/
    /* border: 1px solid black;*/
     background-color: #6ed3ef;
   color: white;
  border: 1px solid black; 
   line-height: 1.3;
  }

  #myHeader {
    text-align: left; /*center;*/
    padding: 0rem;                   /* 1em entspricht Breite von M*/
   /* border: 1px solid black;*/
    background-color: #6ed3ef;
  color: white;
 /*border: 1px solid black;*/ 
  line-height: 1.3;
 }



  .aside {
    padding: 1em;
      /*border: 1px solid black;*/
      /*display: table-cell;*/
      background-color: #11111155;
  /* color: black; */
  }
 
  .footer { /* position: relative;bottom: 100;width:100%;height: 2em;*/
     padding: 1em;
     text-align: left;      /* border: 1px solid black;*/
     background-color: #6ed3efee;    
   color: black;/* white;*/
   border: 1px solid black;
  }
  
  
  .container {
     background-color: #f8f8f8; /* fff weiss */
     text-align: left;  
     /*border: 1px solid black; */
  }
   .article { /* .article_half,*/
    text-align: left; 
    padding: 0 1rem 0 1rem;
   /* border: 1px solid black;*/
   /*border: 1px solid black; */
    clear: both;
  }
  .img-art {
    float: left;
    margin: 0 1em 0.2em 0.2em;
    max-width: 100%;
    height: auto;
  }

  .midiClass {
    text-align:left;
    float: left;/* none left;*/
    margin: 0 1em 0.2em 0.2em;
    max-width: 100%;
    height: auto;
    /*display: block;  war none  visibility: hidden  (:visible) blendet Element aus 
                      display: hidden (:block) löscht es auf dem Display */
  }

  .radioButtonClass {
    text-align:left;
    float: left;
  }

  /*.reddottedClass {font    : color="#ff0000";}*/
  .reddottedClass {color : red;}
  /*   "#ff0000";}*/

 /* 
  .myCanvasClass{
    
    float:center;
  }
.myCanvasClass{ float:left;}

*/
.myCanvasClass{ float:left;}





  
  /*-----------------------------------------------------  
  .row { clear: both; } 
       Tabletversion ab 640 Pixel                          
         640px / 16px/em = 40em  
         + 2 Spalten
           - Header und Navigation oben untereinander
           - Hautpinhalt und Seitenleiste nebeneinander
           - Fußleiste unten
  ------------------------------------------------------*/
 /*
  @media screen and (min-width: 40em) {
    .header {
      text-align: left; 
    }
    .container {
      display: block;
      overflow: auto; 
    }
 
  } 
*/
  /*------------------------------------------------------------------
      Bildschirme ab 1024 Pixel                         
        1024px / 16px/em = 64em
        + 3 Spalten
          - Header oben
          - Navigation, Hauptinhalt und Seitenleisten nebeneinander
          - Fußleiste unten		
   ------------------------------------------------------------------- */
  /*
   @media screen and (min-width: 64em) {
      .article_half {
        display: block;
        width: 50%;
        float:left;
        clear: none;
      }
  
  }	
  */    
  /*------------------------------------------------------------------- 
      Große Bildschirme (>1280 Pixel) 
        1280px / 16px/em = 80em
          + 3 Spalten
            - Header oben
            - Navigation, Hauptinhalt und Seitenleisten nebeneinander
              * Zwei Artikel im Hauptinhalt nebeneinander
            - Fußleiste unten	
    -------------------------------------------------------------------- */
 /* @media screen and (min-width: 80em) {
      .wrapper {
          margin: 0 auto;
          max-width: 80em;
      }
  }
  */
  table, td {
    border: 1px solid black;
    align-self: left;
  }
ul {text-align: left;

}