h1, h2, h3, h4, h5 {hyphens: auto; word-wrap: break-word; font-family: Poppins;}
h1 {font-size: 32px; letter-spacing: -1px; line-height: 1.2em;}
h1.header {font-size: 64px; padding-top:45px;}

p {font-size: 16px; line-height: 1.5em; font-family: Lato;}

body h2 {font-size:26px; font-weight: bold; color: #333; margin-bottom:20px;}
body h3 {font-size:22px; font-weight: bold; color: #333; margin-bottom:20px;}
body h4 {font-size:20px; font-weight: bold; color: #333; margin-bottom:20px;}
body h5 {font-size:16px; font-weight: bold; color: #333; margin-bottom:10px;}




body .footer-hg h1 {font-size:24px !important; font-weight:bold;}

.row {--bs-gutter-x: 0rem;}


/* Verlinkung a */

a {color: #3d72c1;}
a:hover {color: #184890;}


.hover-link {position: relative; text-decoration: none; color: #01850d; }
.hover-link::after { content: ''; position: absolute; left: 0; bottom: -3px; /* 1mm tiefer als der Standardtext */ width: 0; height: 1px; /* Höhe des Unterstrichs */  transition: width 0.3s ease-in-out 0s; /* Startverzögerung von 0s */}

/*hellblau*/
.hover-link-farbe1::after { background-color: #a10b01; /* Farbe des Unterstrichs */}
a.hover-link-farbe1 { color: #a10b01 !important; /* Farbe des Links */}
a.hover-link-farbe1:hover { color: #a10b01; /* Farbe des Links */}

/* dunkelgrün */
.hover-link-farbe2::after { background-color: #01850d; /* Farbe des Unterstrichs */}
a.hover-link-farbe2 { color: #01850d; /* Farbe des Links */}
a.hover-link-farbe2:hover { color: #01850d; /* Farbe des Links */}

/* weiß */
.hover-link-farbe3::after { background-color: #fff; /* Farbe des Unterstrichs */}
a.hover-link-farbe3 { color: #fff; /* Farbe des Links */}
a.hover-link-farbe3:hover { color: #fff; /* Farbe des Links */}

.hover-link:hover::after {width: 100%;}



/* Hintergrund */
.navzeile {background-color: #fff;}
.hintergrund {background-image: url("_Layout/HG/HG-grau4.jpg"); background-attachment:fixed; }


.bg-brown {background-color: #bca47b;}
.bg-blue {background-color: #2c3c54;}
.bg-blue {padding-top:30px;}
h1.blue, h2.blue, h3.blue, h4.blue, h5.blue, p.blue, a.blue {color:#2c3c54;}
h1.white, h2.white, h3.white,p.white, a.white {color:white;}
.bg-blue h2 {font-size: 32px;}

a.button-blue {font-size:19px; background-color:white; border-radius:8px; color: #2c3c54; padding-top:15px; padding-bottom:15px; padding-left:30px; padding-right: 30px;}
a.button-blue2 {font-size:19px; background-color:#2c3c54; border-radius:8px; color: white; padding-top:15px; padding-bottom:15px; padding-left:30px; padding-right: 30px;}


h1.home {font-size:60px;}


@media (max-width: 768px)  { 
		h1.blue {font-size: 36px;}
		h1.header {font-size: 40px; padding-top:20px;}
		h1.home {font-size:40px;}
		.bg-blue h2 {font-size: 28px;}
		a.button-blue {font-size:16px; background-color:white; border-radius:8px; color: #2c3c54; padding-top:10px; padding-bottom:10px; padding-left:20px; padding-right: 20px;}
		a.button-blue2 {font-size:16px; background-color:#2c3c54; border-radius:8px; color: white; padding-top:10px; padding-bottom:10px; padding-left:20px; padding-right: 20px;}
		h2.slider-text{font-size:20px;}
							}
@media (max-width: 500px)  { 
		h1.blue {font-size: 30px;}
		h1.header {font-size: 40px; padding-top:20px;}
		h1.home {font-size:40px;}
		.bg-blue h2 {font-size: 26px;}
		a.button-blue {font-size:15px; background-color:white; border-radius:8px; color: #2c3c54; padding-top:10px; padding-bottom:10px; padding-left:20px; padding-right: 20px;}
		a.button-blue2 {font-size:15px; background-color:#2c3c54; border-radius:8px; color: white; padding-top:10px; padding-bottom:10px; padding-left:20px; padding-right: 20px;}
		h2.slider-text{font-size:20px;}
							}
@media (max-width: 400px)  { 
		h1.blue {font-size: 28px;}
		h1.header {font-size: 40px; padding-top:20px;}
		h1.home {font-size:40px;}
		.bg-blue h2 {font-size: 24px;}
		a.button-blue {font-size:15px; background-color:white; border-radius:8px; color: #2c3c54; padding-top:10px; padding-bottom:10px; padding-left:20px; padding-right: 20px;}
		a.button-blue2 {font-size:15px; background-color:#2c3c54; border-radius:8px; color: white; padding-top:10px; padding-bottom:10px; padding-left:20px; padding-right: 20px;}
		h2.slider-text{font-size:20px;}
				}




a.button {padding: 10px 15px 10px 15px; border-radius: 5px;}
p.schatten {text-shadow: 1px 1px 1px #555;}

/* Bilderverweis*/
.bilderverweis { text-align: center; font-size:12px; font-weight:normal;}


/* Infozeile */
.infozeile {background-color:#a10b01; height: 36px;}
body .infozeile a {line-height:1.5; color:#fff !important; font-size:16px;}
body .infozeile p {color:#fff !important; font-size:16px;}

/* mobile Infoleiste */

@media (max-width: 525px) { 
								.mobile-weg { display: none; } 
								.infozeile {height: 48px;}
							}


/* Leiste */
.leiste {background-color:#a10b01; height: 72px; padding-top:20px; padding-bottom:15px;}
body .leiste a {line-height:1.5; color:#fff !important; font-size:16px;}
body .leiste p {color:#fff !important; font-size:16px;}


/* Logo */
img.firmenlogo {width: 294px; height:auto; }


/* Navigation */

.navzeile {padding-top: 45px; padding-bottom: 45px;}
.navbar {padding-top: 10px; padding-bottom: 10px;}



.navbar .dropdown-menu a {color: #000000; font-size:14px; line-height:1.5em;}

.navbar-light .navbar-nav .nav-link {margin-right:0px; padding-top:2px; padding-bottom:2px; padding-left:12px; padding-right:12px; color:#2c3c54; font-size:18px; text-transform: capitalize; font-weight:400; font-family: Lato;}
.navbar-nav a {color: #2c3c54 !important;}
.navbar-nav a:hover {color: #2c3c54 !important;}

.nav-item a.dropdown-item {color: #000 !important;}








/* mobile Navigation */

@media (max-width: 1200px) { .navbar-light .navbar-nav .nav-link {padding-left: 4px; font-size:13px; } }
@media (max-width: 990px) { .navbar-light .navbar-nav .nav-link {padding-left: 20px; font-size:20px; } }

.mobile_navigation {color:black; font-size: 30px; border: 0px solid white; padding:10px 10px 6px 10px;}

@media (max-width: 990px) { .navbar-nav {border-top: 1px solid black;} }


/*Rahmen*/
.rahmen {border-color: orange; border-width: 5px; border-style: solid; padding: 15px; background-color: rgba(255, 255, 255, 0.75);}



/* Homeseite */
a img.Kreis 	  {border-radius:50%; box-shadow: rgba(0, 0, 0, 0.75) 0px 0px 15px 0px; display: block; margin-left: auto; margin-right: auto; }


/* Slider */
#slider {box-shadow: rgba(0, 0, 0, 0.75) 0px 0px 15px 0px;}

.carousel-item {
    position: relative;
}

.slider-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;

    background: linear-gradient(
        to bottom,
        rgba(44, 60, 84, 0.5),
        rgba(170, 170, 170, 0.5)
    );

    z-index: 1;
}

.carousel-caption {
    z-index: 2;
}

.slider-text {
    color: white;
    font-size: 2rem;
    font-weight: 600;
    text-shadow: 2px 2px 10px rgba(0,0,0,0.7);
}




/* Übersicht Technologie*/
a img.Quadrat 		{border: 1px #fff solid; border-radius: 5%; box-shadow: 10px 20px 15px silver; margin:10px;}
a img.Quadrat:hover {border: 1px #a10b01 solid;}

/* Über mich */
img.Bild {border-radius: 8px; }
p.abstand-rechts {padding-right: 5%;}



/* Referenzen */


  
 .gallery {
    text-align: center;
    margin: 20px auto;
    max-width: 2000px;
}

.gallery img {
    display: inline-block;
    margin: 5px;
    max-width: 100%;
    height: auto;
	
	 box-shadow: 5px 5px 8px #555;
}  



/* Leistungen */
img#Schatten {box-shadow: rgba(0, 0, 0, 0.75) 0px 0px 15px 0px;}
  

/* Slider */
body .owl-prev:hover {background-color: #9ccd23 !important; border: 1px solid white !important;}	/*Pfeile*/
body .owl-next:hover {background-color: #9ccd23 !important; border: 1px solid white !important;}	/*Pfeile*/

body h1.slider {font-size:50px !important;text-shadow: 1px 1px 1px black;}
@media (max-width: 1300px) { body h1.slider  {font-size:36px !important;}}
@media (max-width: 1000px) { body h1.slider  {font-size:32px !important;}}
@media (max-width: 768px)  { body h1.slider  {font-size:40px !important;}}
@media (max-width: 600px)  { body h1.slider  {font-size:34px !important;}}
@media (max-width: 500px)  { body h1.slider  {font-size:30px !important;}}
@media (max-width: 400px)  { body h1.slider  {font-size:26px !important;}}
@media (max-width: 300px)  { body h1.slider  {font-size:22px !important;}}


/* Standard Farbe */
a.farbe {color: #9ccd23;}

body a.weiss:hover {color:#ffffff !important;}
body a.weiss, body p.weiss {color: #ffffff !important;}


/* Footer */

.footer-hg {margin-top: -20px;}

body .footer a {color: #9ccd23; }
/*hellblau*/
body .footer-hg .hover-link-farbe1::after { background-color: #a10b01 !important;; /* Farbe des Unterstrichs */}
body .footer-hg a.hover-link-farbe1 { color: #a10b01 !important;; /* Farbe des Links */}
body .footer-hg a.hover-link-farbe1:hover { color: #a10b01 !important;; /* Farbe des Links */}
body .footer-hg p.weiss {color:#ffffff !important;}

body .footer-bild img {border-radius: 50%; display: block; margin-left: auto; margin-right: auto;}


h5.schwarz {color:#000;}

/* Pfeil */
a.farbe-hg {background-color: #2c3c54;}
a.farbe-hg:hover {background-color: #2c3c54;}

a.breit:hover {letter-spacing: 0.5px;} /* Anpassen des Werts nach Bedarf */


/* Logo mobil */

@media (max-width: 768px) { .navbar-brand img { width: 250px; /* Smaller size for small screens */ } .infozeile p, .infozeile a {font-size: 16px; padding:4px;}}
@media (max-width: 500px) { .navbar-brand img { width: 250px; /* Smaller size for small screens */ } .infozeile p, .infozeile a {font-size: 14px; padding:6px;}}
@media (max-width: 400px) { .navbar-brand img { width: 150px; /* Smaller size for small screens */ } .infozeile p, .infozeile a {font-size: 12px; padding:8px;}}
    
.navbar-toggler { border-color: none; /* Weißer Rahmen für den Button */ }


.navbar-toggler:focus {
    text-decoration: none;
    outline: 0; 
	box-shadow: 0px 0px 0px white;}
	
.navbar-light .navbar-toggler {
    color: transparent;
	border-color: transparent;}

.navbar-toggler { border: 0px solid transparent; }



/* Kontaktformular */
textarea.rund {border-radius: 5px;}
input.rund {border-radius: 5px;}
span.rund {border-radius: 5px;}

button.btn-absenden {background-color:#a10b01; border-radius:5px; border:0px; font-weight:normal;}
button.btn-absenden:hover {background-color:#039dfc; border-radius:5px; border:0px;}

label {font-family:Raleway; font-size:14px;}

.input-group {padding-right:5px;}
textarea {padding-right:5px;}



/* Firmenslider */
/* Logo-Scroller */
.logo-slider {
  position: relative;
  overflow: hidden;
  user-select: none;
  -webkit-user-select: none;
}

.logo-track {
  display: flex;
  align-items: center;
  width: max-content;
  animation: scroll 120s linear infinite;
}

.logo-slider:hover .logo-track {
  animation-play-state: paused;
}

.logo-item {
  flex: 0 0 auto;
  width: 220px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 1rem;
}

.logo-item img {
  max-height: 48px;
  width: auto;
  height: auto;
  max-width: 100%;
  object-fit: contain;
}

@keyframes scroll {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}




/* Schriftarten */

@font-face {
    font-family: "Poppins";
      font-style: normal;
      font-weight: 400;		   	
     src:  url("_Layout/Schriftart/poppins_bold/Poppins-Bold.ttf");
           
}

@font-face {
    font-family: "Lato";
      font-style: normal;
      font-weight: 400;		   	
     src:  url("_Layout/Schriftart/lato_regular/Lato-Regular.ttf");
           
}