html,
body {
  font-family: "Raleway", sans-serif;
  margin: 0;
  padding: 0;
  height: 100%;
  display: flex;
  flex-direction: column;
  background-color: white;
}

.limited-width-container {
  max-width: 1440px;
  height: 100%;
  margin: 0 auto;
  padding: 0 100px; 
}

h2 {
  margin: 0;
  padding-top: 50px;
  padding-bottom: 36px;
  font-size: 28px;
  font-weight: normal;

}

h3{
  margin: 0;
  font-size: 16px;
  font-weight: normal;
}

p {
  color: #929292;
}

/* Allgemeiner Header-Stil */
header {
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}
header .limited-width-container {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0px 100px;
  
}

header img{
  margin-right: 10px;
  height: 60px;
}

header nav {
  display: flex;
  gap: 20px;
  margin-top: 60px;
}

header nav a {
  text-decoration: none;
  color: #333;
  font-weight: 400;
  position: relative;
  padding-bottom: 5px; 
}

header nav a.active {
  color: #2e7d32; 
}

header nav a::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 0;
  height: 3px; 
  background-color: #2e7d32; 
  transition: width 0.3s ease;

}

header nav a:hover::after {
  width: 100%;
}

header nav a.active::after {
  width: 100%;
}

#navigation img{
  display: none;
}

.main-content {
  padding-top: 20px;
  flex: 1;

}

.recipe-highlight .limited-width-container {
  display: flex;
  height: 100%;
  padding-top: 40px;
  gap: 30px;
  padding-bottom: 40px;
}

.recipe-highlight img {
  object-fit: cover;
  border-radius: 8px;
  height: 300px;
}

.recipe-highlight h2 {
  padding-top: 0;
  padding-bottom: 0;
}

.recipe-highlight button {
  margin-top: 50px;
}



.recipe-news {
  background-color: #EFEFEF;
}

.recipe-news .limited-width-container {
 padding-top: 40px;
 padding-bottom: 76px;
}

.recipe-news h2 {
  padding-top: 0;
  display: flex;
  justify-content: center;
}

.recipe-news img {
  width: 200px;
  height: 200px;
  object-fit: cover;
  margin-bottom: 10px;
  border-radius: 8px;
}

.receipe-news-single div {
  text-align: center;
}
.receipe-news-single {
  display: flex;
  justify-content: space-between;
}
.receipe-news-single a {
  display: block;
  color: #000;
  text-decoration: none;
}


.article .limited-width-container {
  padding-bottom: 40px;
}

.article h2 {
  display: flex;
  justify-content: center;
}
.article-content {
  display: flex;
  gap: 40px;
}

.article-text p {
  line-height: 1.6; 
}

.article-image img {
  width: 200px;
  height: 200px;
  object-fit: cover;
  border-radius: 8px;
}

.footer {
  background-color: #333;
  color: white;
}

.footer .limited-width-container {
  display: flex;
  align-items: center;
  justify-content: space-between;
  text-align: center;
}

.footer_logo {
  filter: invert(100%);
  height: 60px;
}

.footer a {
  color: white;
  text-decoration: none;
  margin: 5px;
}

.social-buttons {
  display: flex;
  gap: 10px; 
  justify-content: center; 
  padding: 20px 0; 
}


.social-buttons a {
  display: flex;
  align-items: center;
  gap: 10px; 
  text-decoration: none;
  padding: 0px 20px;
  color: white;
  font-size: 14px;
  font-weight: bold;
  border-radius: 5px;
  transition: background-color 0.3s ease;
}

.text-container {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 10px;
  flex: 1; 
  text-align: left;
  line-height: 0.6; 
}

.social-buttons a img {
  width: 25px;
  height: 25px;
  object-fit: contain;
}

.follow-small {
  font-size: 12px; 
  margin-bottom: 2px; 
}

.platform-name {
  font-size: 16px;
  font-weight: bold;
}

.facebook-button {
  background-color: #1877f2;
}

.instagram-button {
  background: linear-gradient(90deg, #4355D9, #F32484, #FF9248);
}

.twitter-button {
  background-color: #1da1f2;
}

.social-buttons a:hover {
  opacity: 0.8; 
}


::-webkit-scrollbar {
  width: 15px;
}

::-webkit-scrollbar-track {
  background: #f1f1f1;
}

::-webkit-scrollbar-thumb {
  background: rgb(0, 128, 0);
}

::-webkit-scrollbar-thumb:hover {
  background: rgb(0, 200, 0);
}