.buttonM {
    transition: transform 0.3s ease, box-shadow 0.3s ease, filter 0.3s ease;
    transform: scale(1); 
    filter: brightness(1); 
}

.buttonM:hover {
    transform: scale(1.1); 
    filter: brightness(1.1); 
}

.entry-title {
    display: none;
}

.justify-text {
    text-align: justify;
}

.site-name {
    display: none;
}

body {
  color: #262626;
}

#menu-hauptmenue-1 > li > a {
    color: #262626;
}

#menu-hauptmenue-1 > li > a:hover {
    color: #00B0F0; 
}

#toggle-menu.button,
.menu-toggle {
  background-color: #262626 !important; 
  color: #FFFFFF !important; 
  border: 2px solid #FFFFFF !important; 
}

#toggle-menu.button:hover,
.menu-toggle:hover {
  background-color: #00B0F0 !important;  
  color: #262626 !important;
}

#menu-hauptmenue-1 {
    color: #262626;
		display: flex; 
    justify-content: center; 
    list-style: none; 
    padding: 0; 
    margin: 0;
}

#menu-hauptmenue-1 > li {
    margin: 0 20px; 
}

.main-navigation > div > ul > li > .sub-menu {
    background-color: #00B0F0; 
    border: 3px solid #262626; 
    padding: 10px; 
    border-radius: 5px; 
}

.main-navigation > div > ul > li > .sub-menu {
    background-color: #00B0F0; 
}

.main-navigation > div > ul > li > .sub-menu li:not(.current-menu-item) > a {
    background-color: #00B0F0;
}

.main-navigation > div > ul > li.menu-item-has-children > a::after {
    content: none; 
		display: none;
}

@supports (-ms-ime-align: auto) {
    .main-navigation .sub-menu li {
        list-style: none !important;
    }
    .main-navigation .sub-menu li::before {
        content: none !important;
    }
}

:root {
    --wp--preset--color--primary: transparent !important; /* Dreieck Submenu */
}

.justify-text {
    text-align: justify;
}

/* Button 1 - Blau */
.custom-1 {
    background-color: #00ABE9; 
    color: #262626; 
    border: 3px solid #262626;
    border-radius: 5px; 
    padding: 10px 20px; 
    font-weight: bold; 
    cursor: pointer; 
    transition: background-color 0.3s ease, color 0.3s ease;
}

/* Hover-Effekt für Button 1 */
.custom-1:hover {
    background-color: #0094C8; 
}

.wp-block-details.custom-1[open] {
    background-color: #ffffff !important; 
    color: #000000 !important;
    border-color: #00ABE9; 
    font-weight: normal !important; 
}

.custom-1A, .custom-1B, .custom-1C, .custom-1D {
    background-color: #00ABE9;
    color: #ffffff;
    border: 2px solid #005177;
    border-radius: 5px;
    padding: 10px 20px;
    font-weight: bold;
    cursor: pointer;
    transition: background-color 0.3s ease, color 0.3s ease;
}

.custom-1A:hover,
.custom-1B:hover,
.custom-1C:hover,
.custom-1D:hover {
    background-color: #0094C8;
    color: #ffffff; 
}

.wp-block-details.custom-1A[open],
.wp-block-details.custom-1B[open],
.wp-block-details.custom-1C[open],
.wp-block-details.custom-1D[open] {
    background-color: #ffffff !important; 
    color: #000000 !important;
    border-color: #0073aa; 
    font-weight: normal !important; 
}

/* Button 2 - Gelb */
.custom-2 {
    background-color: #FFD166;
    color: #262626;
    border: 3px solid #262626; 
    border-radius: 5px;
    padding: 10px 20px;
    font-weight: bold;
    cursor: pointer;
    transition: background-color 0.3s ease, color 0.3s ease;
}

.custom-2:hover {
    background-color: #FFB819;
}

.wp-block-details.custom-2[open] {
    background-color: #ffffff !important; 
    color: #000000 !important;
    border-color: #FFD166; 
    font-weight: normal !important; 
}

.custom-2A, .custom-2B, .custom-2C, .custom-2D {
    background-color: #FFD166;
    color: #ffffff;
    border: 2px solid #FFB819;
    border-radius: 5px;
    padding: 10px 20px;
    font-weight: bold;
    cursor: pointer;
    transition: background-color 0.3s ease, color 0.3s ease;
}

.custom-2A:hover,
.custom-2B:hover,
.custom-2C:hover,
.custom-2D:hover {
    background-color: #FFD166;
    color: #ffffff; 
}

.wp-block-details.custom-2A[open],
.wp-block-details.custom-2B[open],
.wp-block-details.custom-2C[open],
.wp-block-details.custom-2D[open] {
    background-color: #ffffff !important; 
    color: #000000 !important;
    border-color: #FFD166; 
    font-weight: normal !important; 
}


/* Button 3 - Violett */
.custom-3 {
    background-color: #D86ECC;
    color: #262626;
    border: 3px solid #262626; 
    border-radius: 5px;
    padding: 10px 20px;
    font-weight: bold;
    cursor: pointer;
    transition: background-color 0.3s ease, color 0.3s ease;
}

.custom-3:hover {
    background-color: #CC40BB;
}

.wp-block-details.custom-3[open] {
    background-color: #ffffff !important; 
    color: #000000 !important;
    border-color: #D86ECC; 
    font-weight: normal !important; 
}

.custom-3A, .custom-3B, .custom-3C, .custom-3D {
    background-color: #D86ECC;
    color: #ffffff;
    border: 2px solid #CC40BB;
    border-radius: 5px;
    padding: 10px 20px;
    font-weight: bold;
    cursor: pointer;
    transition: background-color 0.3s ease, color 0.3s ease;
}

.custom-3A:hover,
.custom-3B:hover,
.custom-3C:hover,
.custom-3D:hover {
    background-color: #D86ECC;
    color: #ffffff; 
}

.wp-block-details.custom-3A[open],
.wp-block-details.custom-3B[open],
.wp-block-details.custom-3C[open],
.wp-block-details.custom-3D[open] {
    background-color: #ffffff !important; 
    color: #000000 !important;
    border-color: #D86ECC; 
    font-weight: normal !important; 
}

@media (min-width: 560px){
  .main-navigation{
    width: 100%;
    float: none !important;
  }

  .main-navigation .menu-hauptmenu-container{
    display: flex;
    justify-content: center;
  }

  .main-navigation ul#menu-hauptmenu-1{
    display: flex;
    justify-content: center !important;
    align-items: center;
    padding-left: 0 !important;
    margin: 0 auto !important;
    list-style: none;
  }

  .main-navigation ul#menu-hauptmenu-1 > li{
    flex: 0 0 auto;
  }
}

.site-header .main-navigation{
  padding-left: 0 !important;
  padding-right: 0 !important;
}


.main-navigation #menu-hauptmenue-1 > li > a,
.main-navigation #menu-hauptmenue-1 > li > a:visited,
.main-navigation #menu-hauptmenue-1 > li > a:hover,
.main-navigation #menu-hauptmenue-1 > li > a:focus {
  text-decoration: none !important;
  box-shadow: none !important;
  background-image: none !important;
}

.main-navigation #menu-hauptmenue-1 > li > a::after {
  content: none !important;
  display: none !important;
}

/* Button 4 - Blau */
.custom-4 {
    background-color: #3399FF;
    color: #262626;
    border: 3px solid #262626; 
    border-radius: 5px;
    padding: 10px 20px;
    font-weight: bold;
    cursor: pointer;
    transition: background-color 0.3s ease, color 0.3s ease;
}

.custom-4:hover {
    background-color: #006FDE;
}

.wp-block-details.custom-4[open] {
    background-color: #ffffff !important; 
    color: #000000 !important;
    border-color: #3399FF; 
    font-weight: normal !important; 
}

.custom-4A, .custom-4B, .custom-4C, .custom-4D {
    background-color: #3399FF;
    color: #ffffff;
    border: 2px solid #006FDE;
    border-radius: 5px;
    padding: 10px 20px;
    font-weight: bold;
    cursor: pointer;
    transition: background-color 0.3s ease, color 0.3s ease;
}

.custom-4A:hover,
.custom-4B:hover,
.custom-4C:hover,
.custom-4D:hover {
    background-color: #006FDE;
    color: #ffffff; 
}

.wp-block-details.custom-4A[open],
.wp-block-details.custom-4B[open],
.wp-block-details.custom-4C[open],
.wp-block-details.custom-4D[open] {
    background-color: #ffffff !important; 
    color: #000000 !important;
    border-color: #006FDE; 
    font-weight: normal !important; 
}

/* Button 5 - Orange */
.custom-5 {
    background-color: #F2AA84;
    color: #262626;
    border: 3px solid #262626; 
    border-radius: 5px;
    padding: 10px 20px;
    font-weight: bold;
    cursor: pointer;
    transition: background-color 0.3s ease, color 0.3s ease;
}

.custom-5:hover {
    background-color: #ED8951;
}

.wp-block-details.custom-5[open] {
    background-color: #ffffff !important; 
    color: #000000 !important;
    border-color: #F2AA84; 
    font-weight: normal !important; 
}

.custom-5A, .custom-5B, .custom-5C, .custom-5D {
    background-color: #F2AA84;
    color: #ffffff;
    border: 2px solid #ED8951;
    border-radius: 5px;
    padding: 10px 20px;
    font-weight: bold;
    cursor: pointer;
    transition: background-color 0.3s ease, color 0.3s ease;
}

.custom-5A:hover,
.custom-5:hover,
.custom-5C:hover,
.custom-5D:hover {
    background-color: #ED8951;
    color: #ffffff; 
}

.wp-block-details.custom-5A[open],
.wp-block-details.custom-5B[open],
.wp-block-details.custom-5C[open],
.wp-block-details.custom-5D[open] {
    background-color: #ffffff !important; 
    color: #000000 !important;
    border-color: #ED8951; 
    font-weight: normal !important; 
}

/* Button 6 - Pink */
.custom-6 {
    background-color: #9999FF;
    color: #262626;
    border: 3px solid #262626; 
    border-radius: 5px;
    padding: 10px 20px;
    font-weight: bold;
    cursor: pointer;
    transition: background-color 0.3s ease, color 0.3s ease;
}

.custom-6:hover {
    background-color: #8181FF;
}

.wp-block-details.custom-6[open] {
    background-color: #ffffff !important; 
    color: #000000 !important;
    border-color: #9999FF; 
    font-weight: normal !important; 
}

.custom-6A, .custom-6B, .custom-6C, .custom-6D {
    background-color: #9999FF;
    color: #262626;
    border: 2px solid #8181FF;
    border-radius: 5px;
    padding: 10px 20px;
    font-weight: bold;
    cursor: pointer;
    transition: background-color 0.3s ease, color 0.3s ease;
}

.custom-6A:hover,
.custom-6B:hover,
.custom-6C:hover,
.custom-6D:hover {
    background-color: #8181FF;
    color: #262626; 
}

.wp-block-details.custom-6A[open],
.wp-block-details.custom-6B[open],
.wp-block-details.custom-6C[open],
.wp-block-details.custom-6D[open] {
    background-color: #ffffff !important; 
    color: #000000 !important;
    border-color: #8181FF; 
    font-weight: normal !important; 
}

/* Button 7 - Green */
.custom-7 {
    background-color: #00FFCC;
    color: #262626;
    border: 3px solid #262626; 
    border-radius: 5px;
    padding: 10px 20px;
    font-weight: bold;
    cursor: pointer;
    transition: background-color 0.3s ease, color 0.3s ease;
}

.custom-7:hover {
    background-color: #00D0A8;
}

.wp-block-details.custom-7[open] {
    background-color: #ffffff !important; 
    color: #000000 !important;
    border-color: #00FFCC; 
    font-weight: normal !important; 
}

.custom-7A, .custom-7B, .custom-7C, .custom-7D {
    background-color: #00FFCC;
    color: #262626;
    border: 2px solid #00D0A8;
    border-radius: 5px;
    padding: 10px 20px;
    font-weight: bold;
    cursor: pointer;
    transition: background-color 0.3s ease, color 0.3s ease;
}

.custom-7A:hover,
.custom-7B:hover,
.custom-7C:hover,
.custom-7D:hover {
    background-color: #00D0A8;
    color: #262626; 
}

.wp-block-details.custom-7A[open],
.wp-block-details.custom-7B[open],
.wp-block-details.custom-7C[open],
.wp-block-details.custom-7D[open] {
    background-color: #ffffff !important; 
    color: #000000 !important;
    border-color: #00D0A8; 
    font-weight: normal !important; 
}

/* Button 8 - Rot */
.custom-8 {
    background: linear-gradient(to bottom, #FF66CC, #FF5050);
    color: #262626;
    border: 3px solid #262626; 
    border-radius: 5px;
    padding: 10px 20px;
    font-weight: bold;
    cursor: pointer;
    transition: 0.3s ease;
}

.custom-8:hover {
    background: linear-gradient(to bottom, #FF43C0, #FF2D2D);
}

.wp-block-details.custom-8[open] {
    background: #ffffff !important; 
    color: #000000 !important;
    border-color: #F43C0F; 
    font-weight: normal !important; 
}

.custom-8A, .custom-8B, .custom-8C, .custom-8D {
    background: linear-gradient(to bottom, #FF66CC, #FF5050);
    color: #262626;
    border: 2px solid #262626;
    border-radius: 5px;
    padding: 10px 20px;
    font-weight: bold;
    cursor: pointer;
    transition: 0.3s ease;
}

.custom-8A:hover,
.custom-8B:hover,
.custom-8C:hover,
.custom-8D:hover {
    background: linear-gradient(to bottom, #FF43C0, #FF2D2D);
    color: #262626; 
}

.wp-block-details.custom-8A[open],
.wp-block-details.custom-8B[open],
.wp-block-details.custom-8C[open],
.wp-block-details.custom-8D[open] {
    background: #ffffff !important; 
    color: #000000 !important;
    border-color: #FF43C0;
    font-weight: normal !important; 
}
