.nav_menu {

    position:fixed;

    
    width: calc(100% - 100px);
    max-width: 1200px;

    left: 50%;
    transform: translate(-50%);

    top:0;
    right: 0;
    
    height: 100px;
    z-index: 7;

    
}



.navigation p:hover {

    cursor: pointer;
    text-decoration: underline;
    

}


.top {

        position: fixed;
        text-align: right;
        right: calc(max(50px, (100% - 1200px) * 0.5));
        margin-top: 25.5px;
        background-color: rgb(255, 255, 255);
        z-index: 999;
        font-weight: 400;
        

}

.bottom {

  
        position: fixed;
        text-align: right;
        right: calc(max(50px, (100% - 1200px) * 0.5));
        margin-top: 57.5px;
        background-color: rgb(255, 255, 255);
        z-index: 999;
        font-weight: 400;
       


}



.nav_menu a:hover {

  text-decoration: underline;
  cursor: pointer;

}


.background {
  
    position: fixed;
    background-color: rgb(255, 255, 255);
    top: 0;
    height: 100px;
    width: 100%;
    
   

    overflow: hidden;
    border-bottom: 2px solid darkgray;

    /*
    -webkit-box-shadow: 0px 2px 3px -1px rgba(0,0,0,0.55);
    -moz-box-shadow: 0px 2px 3px -1px rgba(0,0,0,0.55);
    box-shadow: 0px 2px 3px -1px rgba(0,0,0,0.45);
  */

  
}

.white_background {

  position: fixed;
  top: 0px;
  height: 100px;
  width: calc(130px + (100% - 1200px)*0.5);
  min-width: 180px;
  background-color: rgb(255, 255, 255);
  right: 0;

  z-index: 99;

}



  /******* KLEINERER ABSTAND ZU SEITE BEI GERINGER SEITENBREITE *******/

  @media (max-width: 500px) {

    .nav_menu {
  
      width: calc(100% - 60px);
      max-width: 1200px;
    
      
  }
    
    .p_background {


      left: calc(max(30px, (100% - 1200px) * 0.5));
    
  

  }

  .white_background {

    width: 160px;
    min-width: 160px;

  }

  .top {

  
    right: calc(max(30px, (100% - 1200px) * 0.5));

  }

  .bottom {


    right: calc(max(30px, (100% - 1200px) * 0.5));
  
  }

}