@media screen  and (max-width:719px) {

  /* Starte mobile Navigation */
  div.mobileheader {
    display: block !important;
  }
  
  div.header, #selectmenu, .header-menu {
    display: none;
  }

  
  nav.menu-opener, div.mobilefooter {
    display: block !important;
  }
  
  div.left {
    width: 0px !important;
    display: none;
  }

  div.content, .zweispaltig div.content {
    width: 100% !important;
    padding: 0 0 0 0;
  }
  div.right {
    display: none;
  }

  table.calendar-kurse {
    font-size: 0.9em;
  }

  /* verschiebe Social Media nach unten */
  div.header {
    margin: 0px auto 0px;
  }
  #footerline {
    position: relative;
    float: left;
    height: auto !important;
    border-top: 2px solid #01315F;
    border-bottom: none;
  }

  #footerlinecontent .gplus {
    
    clear: left;
  }
  #foot4 {
/*     width: 200px; */
/*     height: auto; */
      margin: 0 auto;
      padding: 10px 0;
    clear: left;
    float: none;
  }
}

/* Mobile Portrait View */

@media screen and (max-width:479px) {



  div.content {
    
    padding: 0px 5px;
  }

  #footerlinecontent>div {
    width: 200px;
    height: auto;
      margin: 0 auto;
      padding: 10px 0;
    clear: left;
    float: none;
  }
  
  #foot1, #foot2, #foot3 {
      width: 200px;
    height: auto;
      margin: 0 auto;
      padding: 10px 0;
    clear: left;
    float: none;
    
  }


}

/* Mobile Landscape View */

@media screen and (min-width:480px) and (max-width:719px) { 

  body {
    font-size: 1em;
  }

  p,li {
    line-height: 1.4em;
  }

  h5 {
    font-size: 1em;
    line-height: 1.6em;
  }
  

  div.outer, .zweispaltig div.outer {
    background-position: 0px 0px;
  }

  #footerlinecontent .gplus {
    
    clear: left;
  }

}


/* Tablet View */

@media screen  and (min-width:720px) and (max-width:979px) {


div.header-menu {

    font-size: 1.2em;
  }


}

@media screen and (min-width:980px) and (max-width:1159px) {


}

@media screen and (min-width:720px) and (max-width:849px) {

  #selectmenu {
    display: none;
  }
  div.left {
    width: 20% /*!important*/;
  }
  div.content {
    width: 75% !important;
  }

  .zweispaltig div.content {
    width: 80% !important;
  }
  div.right {
    display: none;
  }


  
}

@media screen and (min-width: 720px) {

  .menu.active, .menu.active * {
       display: none !important; 
  }
}

@media screen and (max-width:1000px) {

  * { box-sizing: border-box; }
  
  div.header, div.footer  {
    width:100%;
  }

  div.header-menu {
    width: 100%;
    height: 31px;  
  }

  div.outer, .zweispaltig div.outer {
    width: 98%;
    border: none;
  }
  
  div.left {
    width: 20%;
  }

  div.content {
    width: 60%;
  }

  .zweispaltig div.content {
    width: 80%;
  }

  .toerndetails span {
    width: 100%;
  }
  
  .toerndetails div.csc-textpic-imagewrap {
    padding: 0 0 0 0;
  }
  
  div.right {
    width: 20%;
    margin: 0 0 0 0;
  }

  div.csc-textpic-imagewrap, div.csc-textpic-imagerow {
    width: 100% !important;
  }

  #footerline {
    height: 42px;
  }

  #footerlinecontent  {
    width:100%;
     padding: 0 0 0 0;
     height: 100%;
  }

  div.footer {
    height: auto;
    padding: 10px;
  }

  #foot4 {
    margin: 0 auto;
      padding: 10px 0;
    clear: left;
    float: none;
  }

}





nav.menu {

  background-color: #00315F;
  font-size: 18px;
}

nav.menu a {
   color: #fff;
   display: block;
   padding: 5px 0px 5px 4px;
}

nav.menu .level2 a {
  padding: 5px 0px 5px 10px;
  
}

nav.menu .level3 a {
  padding: 5px 0px 5px 20px;
}

nav.menu ul {
  list-style-type: none;
}

nav.menu a:hover {
  background-color: #888;
}

nav.menu .level3 a:hover {
  background-color: #f2f2f2;
}

nav.menu li.level1, nav.menu li.level2, nav.menu li.level3 {
  border-bottom: 1px solid #636363;
}

nav.menu li.level2 {
  font-size: 0.9em;
  font-weight: bold;
}

nav.menu li.level3 a {
  font-size: 0.9em;
  font-weight: normal;
  color: #888;
}
