@font-face { 
  font-family: "ANTON"; 
  src: url("fonts/Anton-Regular.ttf"); 
}
@font-face { 
  font-family: "OpenSans"; 
  src: url("fonts/OpenSans-VariableFont_wdth,wght.ttf"); 
}
/*
@font-face {
  font-family: "GraublauWeb";
  src:url(http://www.meine-domain.tld/fonts/GraublauWeb-Regular.otf) format("opentype");
}
*/
 body {
  font-family: OpenSans, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", "Liberation Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  background-color: #f5f5f4;
}

.row-flex {
  display: flex;
  flex-wrap: wrap;
}
.notransition {
  -webkit-transition: none !important;
  -moz-transition: none !important;
  -o-transition: none !important;
  transition: none !important;
}
.bg-success-green {
  --bs-bg-opacity: 1;
  background-color: rgba(0,220,0, var(--bs-bg-opacity)) !important;
}
.bg-danger-red {
  --bs-bg-opacity: 1;
  background-color: rgba(220,0,0, var(--bs-bg-opacity)) !important;
}
.border-success {
  --bs-border-opacity: 1;
  border-color: rgba(0,220,0, var(--bs-border-opacity)) !important;
}
.border-danger {
  --bs-border-opacity: 1;
  border-color: rgba(220,0,0, var(--bs-border-opacity)) !important;
}
.btn-success {
  --bs-btn-color: #fff;
  --bs-btn-bg: #00dc00;
  --bs-btn-border-color: #00dc00;
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: #22ba22;
  --bs-btn-hover-border-color: #449844;
  --bs-btn-focus-shadow-rgb: 60, 153, 110;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: #146c43;
  --bs-btn-active-border-color: #13653f;
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: #fff;
  --bs-btn-disabled-bg: #00dc00;
  --bs-btn-disabled-border-color: #00dc00;
}
.btn-danger {
  --bs-btn-color: #fff;
  --bs-btn-bg: #dc0000;
  --bs-btn-border-color: #dc0000;
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: #bb2d3b;
  --bs-btn-hover-border-color: #b02a37;
  --bs-btn-focus-shadow-rgb: 225, 83, 97;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: #b02a37;
  --bs-btn-active-border-color: #a52834;
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: #fff;
  --bs-btn-disabled-bg: #dc0000;
  --bs-btn-disabled-border-color: #dc0000;
}



.ts_a {
  text-decoration: none;
  color: var(--bs-body-color);
}
.ts_a:link {
  text-decoration: none;
  color: var(--bs-body-color);
}
.ts_a:visited {
  text-decoration: none;
  color: var(--bs-body-color);
}
.ts_a:active {
  text-decoration: none;
  color: var(--bs-body-color);
}
.ts_a:hover {
  text-decoration: none;
  color: #666666;
}


.ts_bg_main {
  background-image: linear-gradient(to right, rgba(8, 186, 174, 0.6), rgba(251, 172, 15, 0.6));
}

.icon-list li::before {
  display: block;
  flex-shrink: 0;
  width: 1.5em;
  height: 1.5em;
  margin-right: .5rem;
  content: "";
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23212529' viewBox='0 0 16 16'%3E%3Cpath d='M8 0a8 8 0 1 1 0 16A8 8 0 0 1 8 0zM4.5 7.5a.5.5 0 0 0 0 1h5.793l-2.147 2.146a.5.5 0 0 0 .708.708l3-3a.5.5 0 0 0 0-.708l-3-3a.5.5 0 1 0-.708.708L10.293 7.5H4.5z'/%3E%3C/svg%3E") no-repeat center center / 100% auto;
}

.seperator_line_ts1 {
  height: 10px;
  background-color: #08baae;  
  margin-bottom: 0rem !important; 
  padding-bottom: 0rem !important;
}
.seperator_line_ts2 {
  height: 10px;
  background-color: #fbac0f;  
  margin-bottom: 0rem !important; 
  padding-bottom: 0rem !important;
}
.only_mobil_vert {
  display: none;
}

.disabled_tsimg {
  opacity: 0.5;
}

.width_ts2_s30 {
  width: 300px;
}

.border-mid {
  --bs-border-opacity: 1;
  border-color: rgba(200, 201, 202 , var(--bs-border-opacity)) !important;
}

.border-ts1 {
  --bs-border-opacity: 1;
  border-color: rgba(8,186,174, var(--bs-border-opacity)) !important;
}
.border-ts2 {
  --bs-border-opacity: 1;
  border-color: rgba(251,172,15, var(--bs-border-opacity)) !important;
}

.button_toene_klein {
  min-width: 74px; !important;
  max-width: 74px; !important;
  margin-top: 5px; !important;
}

.ts_to_top_size {
  font-size: 50px;
 } 

#btn-back-to-top {
position: fixed;
bottom: 20px;
right: 20px;
display: none;
}
.btn-topcolor {
  --bs-btn-color: #fff;
  --bs-btn-bg: #000000;
  --bs-btn-border-color: #000000;
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: #424649;
  --bs-btn-hover-border-color: #373b3e;
  --bs-btn-focus-shadow-rgb: 66, 70, 73;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: #4d5154;
  --bs-btn-active-border-color: #373b3e;
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: #fff;
  --bs-btn-disabled-bg: #212529;
  --bs-btn-disabled-border-color: #212529;
}

/*
.carousel-control-prev-icon {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%2308baae'%3e%3cpath d='M11.354 1.646a.5.5 0 0 1 0 .708L5.707 8l5.647 5.646a.5.5 0 0 1-.708.708l-6-6a.5.5 0 0 1 0-.708l6-6a.5.5 0 0 1 .708 0z'/%3e%3c/svg%3e");
}

.carousel-control-next-icon {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%2308baae'%3e%3cpath d='M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
}
.carousel-dark .carousel-control-prev-icon,
.carousel-dark .carousel-control-next-icon {
  filter: invert(0) grayscale(0);
}
[data-bs-theme=dark] .carousel .carousel-control-prev-icon,
[data-bs-theme=dark] .carousel .carousel-control-next-icon {
  filter: invert(0) grayscale(0);
}
*/

.ts_margin_menu_car {
  margin-top: 40px;
}
.ts_main_sub_header {
  font-family: ANTON;  
  font-size: 2.5rem;
  margin-bottom: 0px;
}
.ts_row_block {
  margin-top: 30px;
}
.ts_row_block_fix {
  margin-top: 30px;
}
.ts_col_block_text {
  background-color: #ffffff;
  padding-top: 20px;
  padding-left: 30px;
}
.ts_div_block_ueberschrift_nur_erste {
  margin-top: 65px;
  margin-bottom: 0px;
  font-size: 2rem;
}
.ts_div_block_ueberschrift {
  margin-top: 95px;
  margin-bottom: 0px;
  font-size: 2rem;
}
.ts_div_block_ueberschrift_bonusmaterial {
  margin-top: 85px;
  margin-bottom: 0px;
  font-size: 2rem;
}
.ts_block_ueberschrift {
  margin-bottom: 0px !important;
  padding-left: 40px;
}
.ts_block_header {
  font-family: ANTON;
  font-size: 2.5rem; 
  margin-bottom: 0rem;
}
.ts_block_subheader {
  font-size: 1.5rem; 
  font-weight: bold; 
  margin-bottom: 1.2rem;
}
.ts_block_subsubheader {
  font-size: 1.2rem; 
  font-weight: bold; 
  margin-bottom: 0.5rem;
}

.ts_block_text {
  font-size: 1rem;
}
.ts_block_text_klein {
  font-size: 0.7rem;
}
.ts_ul_padding_left {
  padding-left: 1.2rem;
}
.ts_col_uebungsblaetter {
  xxxheight: 280px;
}
.ts_col_uebungsblaetter_text {
  font-weight: bold;
  margin-bottom: 0px;
}
.ts_row_logo {
  background-color: #ffffff;
  padding-top: 20px;
  padding-left: 30px;
  padding-bottom: 60px;
}
.ts_col_logo {
  margin-top: 30px;
}
.ts_row_bild_noten_spiel {
  min-height: 170px;
}
.ts_col_bild_noten_spiel {
  width: 202px;
}
.ts_bild_noten_spiel {
  width: 200px;
}
.ts_button_bild_noten_spiel {
    margin-top: 60px;
}
.ts_uebersicht_liste_link {
  text-align: left; 
  margin-bottom: 0.3rem;
  xxxmargin-left: 5em;
  xxxtext-indent: -5em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  text-overflow: '...';
}
.ts_uebungen_ohr_text {
  font-size: 1.6rem;
}
.ts_uebungen_ohr_text_halb {
  font-size: 1.6rem;
}
.ts_uebungen_ohr_bild {
  max-height: 200px;
}
.ts_uebungen_ohr_bild_halb {
  max-height: 200px;
}
.ts_uebungen_versatz_content {
  margin-bottom: 1rem !important; 
  margin-top: 1.5rem !important;
}
.ts_uebungen_versatz_content_halb {
  margin-bottom: 1rem !important; 
  margin-top: 1.5rem !important;
}

.ts_uebungen_text_vor_umbruch_buttons {
  margin-bottom: 1.75rem !important;
}
.ts_uebungen_rhythmus_bildchen {
  margin-top: 16px;
  margin-right: 6px;
}
.ts_bild_autorin {
  max-width: 220px;
}


@keyframes shake {
  10%, 90% {transform: translate3d(-1px, 0, 0);}
  20%, 80% {transform: translate3d(2px, 0, 0);}
  30%, 50%, 70% {transform: translate3d(-4px, 0, 0);}
  40%, 60% {transform: translate3d(4px, 0, 0);}
}
.apply-shake {
    animation: shake 1s cubic-bezier(.36,.07,.19,.97) both;
}


@media (max-width: 767px) {
  .seperator_line_ts1 {
    height: 7px;  
  }
  .seperator_line_ts2 {
    height: 7px;  
  }
  .width_ts2_s30 {
    width: 200px;
  }
}
@media (max-width: 480px) {
  .seperator_line_ts1 {
    height: 4;  
  }
  .seperator_line_ts2 {
    height: 4;  
  }
  .only_mobil_vert {
    display: block;
  }
  .width_ts2_s30 {
    width: 150px;
  }
  .ts_to_top_size {
    font-size: 30px;  
  } 
  .ts_margin_menu_car {
    margin-top: 20px;
  }
  .ts_main_sub_header {
    font-family: ANTON;  
    font-size: 1.8rem;
  }
  .ts_row_block {
    margin-top: 0px;
  }
  .ts_div_block_ueberschrift_nur_erste {
    margin-top: 51px;
    font-size: 1.5rem;
  }
  .ts_div_block_ueberschrift {
    margin-top: 72px;
    font-size: 1.5rem;
  }
  .ts_div_block_ueberschrift_bonusmaterial {
    margin-top: 66px;
    font-size: 1.5rem;
  }
  .ts_col_block_text {
    padding-left: 15px;
  }
  .ts_block_header {
    font-family: ANTON;
    font-size: 1.8rem; 
  }
  .ts_block_subheader {
    font-size: 1.3rem; 
    font-weight: bold; 
  }
  .ts_block_subsubheader {
    font-size: 1.0rem; 
    font-weight: bold; 
  }
  .ts_block_text {
    font-size: 1rem;
  }
  .ts_block_text_klein {
    font-size: 0.7rem;
  }
  .ts_col_bild_noten_spiel {
    width: 162px;
  }
  .ts_bild_noten_spiel {
    width: 160px;
  }
  .ts_row_bild_noten_spiel {
    min-height: 140px;
  }
  .ts_button_bild_noten_spiel {
      margin-top: 50px;
  }
  .ts_uebungen_ohr_text {
    font-size: 1.2rem;
  }
  .ts_uebungen_ohr_text_halb {
    font-size: 1.2rem;
  }
  .ts_uebungen_rhythmus_bildchen {
    margin-top: 8px;
    margin-right: 3px;
  }
}

@media (min-width: 800px) {
  .ts_uebungen_ohr_text {
    font-size: 1.6rem;
    margin-top: -8rem !important;
  }
  .ts_uebungen_ohr_text_halb {
    font-size: 1.6rem;
    margin-top: -2rem !important;
  }
  .ts_uebungen_ohr_bild {
    max-height: 350px;
  }
  .ts_uebungen_ohr_bild_halb {
    max-height: 300px;
  }
  .ts_uebungen_versatz_content {
    margin-bottom: 1rem !important; 
    margin-top: -8rem !important;
  }
  .ts_uebungen_versatz_content_halb {
    margin-bottom: 1rem !important; 
    margin-top: -2rem !important;
  }
}

@media (max-width: 640px) {
  .nav-item {
    --bs-nav-link-padding-y: 0.25rem;
  }
}

@media (min-width: 1600px) {
  .ts_bild_autorin {
    max-width: 190px;
  }
}