/*
  welcome to css File: 
  Navigation System by Amirr: 10.0.0, last changed 12.07.25
  
  All content on this website is subject to German copyright law.
  
  © 2025 Amirr Technologies. All rights reserved.
*/

:root {
   --borctop: 1px solid rgba(150, 150, 150, 0.3);
  --borcleft: 1px solid rgba(150, 150, 150, 0.3); 
  --shac: 1px 2px 2px rgba(15, 15, 15, 0.3);
}

.picture {
  justify-content: center;
  align-items: center;
  height: 180px;
  width: 150px;
  border: none;
  border-radius: 35px;
  border-top: var(--borctop);
  border-left: var(--borcleft);
  box-shadow: var(--shac);
  background-position-x: -0.7px;
  background-position-y: -5px;
  background-size: 150px;
  background-repeat: no-repeat;
  background-color: transparent;
}

.aboutprivat {
  background-image: url('png/p.png');
  background-position-x: -3px;
  background-position-y: center;
}

.aboutmr {
  background-image: url('png/mr.png'); 
}

.abouta {
 background-image: url('png/a.png');
}








.art1{
  background-image: url('art/1.png'); 
    background-size: cover;
    background-repeat: no-repeat; /* Bild wiederholt sich nicht */
    background-position-x: center; 
    background-position-y: center; /* Bildposition festlegen */
    user-select: none;
    border: 5px solid;
    border-radius: -15px;
    overflow: hidden;
    background-color: #6e4f28;
    color: #6e4f28;
    font-weight: bold;
    width: 100%;
    height: 300px;
    z-index: 1;
}
.arts1{
    background-image: url('art/1.png'); 
    background-size: 100%;
    background-repeat: no-repeat; /* Bild wiederholt sich nicht */
    background-position-x: center; 
    background-position-y: 130px;
    /* Bildposition festlegen */
    height: 500px;
    z-index: 1;
}
.art2{
  background-image: url('art/2.png'); 
    background-size: cover;
    background-repeat: no-repeat; /* Bild wiederholt sich nicht */
    background-position-x: center; 
    background-position-y: center; /* Bildposition festlegen */
    user-select: none;
    border: 5px solid;
    border-radius: -15px;
    overflow: hidden;
    background-color: #6e4f28;
    color: #6e4f28;
    font-weight: bold;
    width: 100%;
    height: 170px;
    z-index: 1;
}
.arts2{
    background-image: url('art/2.png'); 
    background-size: 100%;
    background-repeat: no-repeat; /* Bild wiederholt sich nicht */
    background-position-x: center; 
    background-position-y: 130px;
    /* Bildposition festlegen */
    height: 370px;
    z-index: 1;
}
.art3{
  background-image: url('art/3.jpg'); 
    background-size: cover;
    background-repeat: no-repeat; /* Bild wiederholt sich nicht */
    background-position-x: center; 
    background-position-y: center; /* Bildposition festlegen */
    user-select: none;
    border: 5px solid;
    border-radius: -15px;
    overflow: hidden;
    background-color: #6e4f28;
    color: #6e4f28;
    font-weight: bold;
    width: 100%;
    height: 150px;
    z-index: 1;
}
.art4{
  background-image: url('art/4.jpg'); 
    background-size: cover;
    background-repeat: no-repeat; /* Bild wiederholt sich nicht */
    background-position-x: center; 
    background-position-y: center; /* Bildposition festlegen */
    user-select: none;
    border: 5px solid;
    border-radius: -15px;
    overflow: hidden;
    background-color: #6e4f28;
    color: #6e4f28;
    font-weight: bold;
    width: 100%;
    height: 300px;
    z-index: 1;
}
.art5{
  background-image: url('art/5.png'); 
    background-size: cover;
    background-repeat: no-repeat; /* Bild wiederholt sich nicht */
    background-position-x: center; 
    background-position-y: center; /* Bildposition festlegen */
    user-select: none;
    border: 5px solid;
    border-radius: -15px;
    overflow: hidden;
    background-color: #6e4f28;
    color: #6e4f28;
    font-weight: bold;
    width: 100%;
    height: 130px;
    z-index: 1;
}
.arts5{
    background-image: url('art/5.png'); 
    background-size: 100%;
    background-repeat: no-repeat; /* Bild wiederholt sich nicht */
    background-position-x: center; 
    background-position-y: 130px;
    /* Bildposition festlegen */
    height: 330px;
    z-index: 1;
}
.art6{
  background-image: url('art/6.png'); 
    background-size: cover;
    background-repeat: no-repeat; /* Bild wiederholt sich nicht */
    background-position-x: center; 
    background-position-y: center; /* Bildposition festlegen */
    user-select: none;
    border: 5px solid;
    border-radius: -15px;
    overflow: hidden;
    background-color: #6e4f28;
    color: #6e4f28;
    font-weight: bold;
    width: 100%;
    height: 170px;
    z-index: 1;
}
.arts6{
    background-image: url('art/6.png'); 
    background-size: 100%;
    background-repeat: no-repeat; /* Bild wiederholt sich nicht */
    background-position-x: center; 
    background-position-y: 130px;
    /* Bildposition festlegen */
    height: 370px;
    z-index: 1;
}
.art7{
  background-image: url('art/7.jpg'); 
    background-size: cover;
    background-repeat: no-repeat; /* Bild wiederholt sich nicht */
    background-position-x: center; 
    background-position-y: center; /* Bildposition festlegen */
    user-select: none;
    border: 5px solid;
    border-radius: -15px;
    overflow: hidden;
    background-color: #6e4f28;
    color: #6e4f28;
    font-weight: bold;
    width: 100%;
    height: 160px;
    z-index: 1;
}

    @media (min-width: 801px) {
      .art1{
  background-image: url('art/1.png'); 
    background-size: cover;
    background-repeat: no-repeat; /* Bild wiederholt sich nicht */
    background-position-x: center; 
    background-position-y: center; /* Bildposition festlegen */
    user-select: none;
    border: 5px solid;
    border-radius: -15px;
    overflow: hidden;
    background-color: #6e4f28;
    color: #6e4f28;
    font-weight: bold;
    width: 100%;
    height: 300px;
    z-index: 1;
}
.arts1{
    background-image: url('art/1.png'); 
    background-size: 100%;
    background-repeat: no-repeat; /* Bild wiederholt sich nicht */
    background-position-x: center; 
    background-position-y: 130px;
    /* Bildposition festlegen */
    height: 1200px;
    z-index: 1;
}
.art2{
  background-image: url('art/2.png'); 
    background-size: cover;
    background-repeat: no-repeat; /* Bild wiederholt sich nicht */
    background-position-x: center; 
    background-position-y: center; /* Bildposition festlegen */
    user-select: none;
    border: 5px solid;
    border-radius: -15px;
    overflow: hidden;
    background-color: #6e4f28;
    color: #6e4f28;
    font-weight: bold;
    width: 100%;
    height: 170px;
    z-index: 1;
}
.arts2{
background-image: url('art/2.png'); 
    background-size: 100%;
    background-repeat: no-repeat; /* Bild wiederholt sich nicht */
    background-position-x: center; 
    background-position-y: 130px;
    /* Bildposition festlegen */
    height: 1070px;
    z-index: 1;
}
.art3{
  background-image: url('art/3.jpg'); 
    background-size: cover;
    background-repeat: no-repeat; /* Bild wiederholt sich nicht */
    background-position-x: center; 
    background-position-y: center; /* Bildposition festlegen */
    user-select: none;
    border: 5px solid;
    border-radius: -15px;
    overflow: hidden;
    background-color: #6e4f28;
    color: #6e4f28;
    font-weight: bold;
    width: 100%;
    height: 150px;
    z-index: 1;
}
.art4{
  background-image: url('art/4.jpg'); 
    background-size: cover;
    background-repeat: no-repeat; /* Bild wiederholt sich nicht */
    background-position-x: center; 
    background-position-y: center; /* Bildposition festlegen */
    user-select: none;
    border: 5px solid;
    border-radius: -15px;
    overflow: hidden;
    background-color: #6e4f28;
    color: #6e4f28;
    font-weight: bold;
    width: 100%;
    height: 300px;
    z-index: 1;
}
.art5{
  background-image: url('art/5.png'); 
    background-size: cover;
    background-repeat: no-repeat; /* Bild wiederholt sich nicht */
    background-position-x: center; 
    background-position-y: center; /* Bildposition festlegen */
    user-select: none;
    border: 5px solid;
    border-radius: -15px;
    overflow: hidden;
    background-color: #6e4f28;
    color: #6e4f28;
    font-weight: bold;
    width: 100%;
    height: 130px;
    z-index: 1;
}
.arts5{
background-image: url('art/5.png'); 
    background-size: 100%;
    background-repeat: no-repeat; /* Bild wiederholt sich nicht */
    background-position-x: center; 
    background-position-y: 130px;
    /* Bildposition festlegen */
    height: 1030px;
    z-index: 1;
}
.art6{
  background-image: url('art/6.png'); 
    background-size: cover;
    background-repeat: no-repeat; /* Bild wiederholt sich nicht */
    background-position-x: center; 
    background-position-y: center; /* Bildposition festlegen */
    user-select: none;
    border: 5px solid;
    border-radius: -15px;
    overflow: hidden;
    background-color: #6e4f28;
    color: #6e4f28;
    font-weight: bold;
    width: 100%;
    height: 170px;
    z-index: 1;
}
.arts6{
background-image: url('art/6.png'); 
    background-size: 100%;
    background-repeat: no-repeat; /* Bild wiederholt sich nicht */
    background-position-x: center; 
    background-position-y: 130px;
    /* Bildposition festlegen */
    height: 1070px;
    z-index: 1;
}
.art7{
  background-image: url('art/7.jpg'); 
    background-size: cover;
    background-repeat: no-repeat; /* Bild wiederholt sich nicht */
    background-position-x: center; 
    background-position-y: center; /* Bildposition festlegen */
    user-select: none;
    border: 5px solid;
    border-radius: -15px;
    overflow: hidden;
    background-color: #6e4f28;
    color: #6e4f28;
    font-weight: bold;
    width: 100%;
    height: 160px;
    z-index: 1;
}
      }