/* Zusätzliche benutzerdefinierte CSS-Stile können hier hinzugefügt werden */

    
    .card {
      margin-bottom: 20px;
      color:white;
      height: auto;
      text-decoration: none;
     
      

    }
    
    .profile-card { max-width: 900px; margin: 2rem auto; }
    .avatar { width: 140px; height: 140px; object-fit: cover; border-radius: 50%; }
    .info-row dt { width: 120px; }
    .badge-skill { margin-right: .35rem; margin-bottom: .35rem; }
   
    .to-top {
      background:#003D7B ;
      position: fixed;
      bottom: 16px;
      right:32px;
      width:50px;
      height:50px;
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size:32px;
      color:#1f1f1f;
      text-decoration: none;
      opacity:0;
      pointer-events: none;
      transition: all .4s;
    }

    .to-top.active {
      bottom:32px;
      pointer-events: auto;
      opacity:1;
    }

    .bg-img {
        height: 100vh;
        width: 100vw;
        object-fit: cover;
        filter:brightness(0.6);
        position:absolute;
        top: 0;
        left:0;
        z-index:-1;
        opacity: 1;
      }

      
      :root{

        --bs-body-font-family:'Rubik', sans-serif !important;
      }

            
      nav{
        font-size:x-large;
        letter-spacing: 0.1em;
        font-variant-caps:all-small-caps;
        
              
    
      }

      .bg-warning{

        background-color: #ED981A !important;

      }

      .bg-danger{

        background-color: #C8261E !important;
      }

      .bg-primary{

        background-color: #2E63B3 !important;
      }

      .bg-success{

        background-color: #90C42B !important;
      }

      .bg-info{

        background-color: #209893 !important;
      }
      


      .nav-link{

        color: #666777;
        font-weight: 500;
        position: relative;
      }

      .nav-link:hover, .nav-link:active{

        color: #000000;
        
      }
      @media(min-width:991px){        
      
      .nav-link::before{
        content:'';
        position: absolute;
        bottom:0;
        left: 50%;
        transform: translateX(-50%);
        width: 0;
        height: 2px;
        background-color:#003D7B ;
        visibility: hidden;
        transition: 0.3s ease-in-out;
      }

      .nav-link:hover::before, .nav-link.active::before
      {
        width: 100%;
        visibility: visible;
      }

    }


      .footer{

        background-color: white;
        height: auto;
        margin: 20px;
        border-radius: 16px;
        padding: 0.5rem;
      }

      .navbar{

        background-color: white;
        height: auto;
        margin: 20px;
        border-radius: 16px;
        padding: 0.5rem;

      }
      .btn {
        background-color: #003D7B;
        color: white;
        font-size: 14px;
        padding: 8px 20px;
        border-radius: 50px;
        text-decoration: none;
        transition: 0.3s background-color;


      }

      .navbar-toggler{
        border: none;
        font-size: 1.0em;
      }

      .navbar-toggler:focus, .btn-close:focus{
        box-shadow: none;
        outline:none;
      }

      .navbar-brand{

        font-weight: 500;
        color: #003D7B;
        font-size:24px;


      }
      
      .h1_nav, .h1_link:link{

        color:#003D7B;
        text-decoration: none;
      }


      .h1_special{
        text-decoration: none;
        font-variant: small-caps;
        color:white;
        font-size:3.5rem;
        margin-bottom: 20px;
        
        
      }

      .h1_special:hover{
        transform:scale(1.1);
        color:#003D7B;
        background-color: white;
        border-radius: 15px;
        margin-bottom: 20px;

      }
      .hero-section{

        background: url(schule.jpg) no repeat center;
        background-size: cover;
        width: 100%;
        height: 100vh;
        z-index: -1;
        
      }

      .card-img-top {
        width: 100%;
        height: 10vw;
        object-fit: cover;
        }
      
      a.card:hover {
        text-decoration: none;
        transform: scale(1.02);
        box-shadow: 0 10px 20px rgba(0,0,0,.12), 0 4px 8px rgba(0,0,0,.06);
        
       
}