/* 

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  font-family: "Inter", sans-serif;
} */


/* body {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  color: #222;
  position: relative;
  min-height: 100vh;

} */


/* my */

/* 
 FFA985 orange 50% auf weiß 
 FF510D orange voll
*/
:root {
  /* --gt-color-btn-gb:#2e4996; */
  /* --gt-color-btn-gb: #3a6556; */
  --gt-color-btn-gb: rgba(185, 23, 21, 0.95);
  --gt-color-btn-font: white;
}

/* 
 originale Farbwerte
--gt-color-btn-gb:#2e4996;
--gt-color-btn-font: white; 
*/


html,
body {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

.gt-cookie-banner * {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  font-family: Arial, Verdana, sans-serif;


}

.gt-cookie-banner {
  display: flex;
  flex-direction: column;
  align-items: center;
  /* justify-content: start; */
  /* position: absolute; */
  position: fixed;
  top: 0px;
  width: 100%;

  hyphens: auto;
  /* overflow: hidden; */
  z-index: 2000;
}


.gt-cookie-banner .gt-modal {
  position: absolute;
  display: flex;
  flex-direction: column;
  justify-content: center;
  /* max-width: 475px; */
  width: 475px;
  /* width: 450px; */
  padding: 20px 20px 15px;
  /* min-height: 250px; */
  color: #555;

  background-color: #f8f8f8;

  border: 1px solid #f8f8f8;

  border-radius: 1px;
  z-index: 2000;

  /* border: 0; */
  /* outline: 0; */

  /* gap: 0.4rem; */
}

/* wenn screen kleiner als width:475px */
/* @media only screen and ( max-width:475px ) { */
@media (max-width:475px) {
  .gt-cookie-banner .gt-modal {
    /* background-color: #b02525; */
    width: 100%;
  }
}


/* not my */

.gt-cookie-banner .modal .flex {
  display: flex;
  align-items: center;
  justify-content: space-between;
}



.gt-cookie-banner .gt-modal input {
  /* padding: 0.7rem 1rem; */
  padding: 6px;
  position: relative;
  left: -15px;
  border: 1px solid #ddd;
  border-radius: 5px;
  font-size: 0.9em;
}

.gt-cookie-banner .gt-modal p {
  font-size: 0.9rem;
  color: #777;
  margin: 0.4rem 0 0.2rem;
}


.gt-cookie-banner .gt-btn {
  cursor: pointer;
  border: none;
  display: inline-block;
  /* padding: 0.8rem 1.4rem; */
  font-weight: 700;
  background-color: var(--gt-color-btn-gb, #2e4996);
  color: var(--gt-color-btn-font, white);
  border-radius: 5px;
  text-align: center;
  font-size: 0.8rem;
  margin: 4px 0px;
  /* height: 45px; */
}

.gt-btn-settings {
  cursor: pointer;
  border: none;
  display: inline-block;
  padding: 0.8rem 1.4rem;
  font-weight: 700;
  background-color: var(--gt-color-btn-gb, #2e4996);
  color: var(--gt-color-btn-font, white);
  border-radius: 5px;
  text-align: center;
  font-size: 0.8rem;
  margin: 4px 0px;
  height: 45px;
}


.gt-cookie-banner .btn-open {
  position: absolute;
  bottom: 150px;
}

.gt-cookie-banner .btn-close {
  transform: translate(10px, -20px);
  padding: 0.5rem 0.7rem;
  background: #eee;
  border-radius: 50%;
}


.gt-cookie-banner .overlay {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
  backdrop-filter: blur(3px);
  z-index: 1;
}


.gt-cookie-banner .gt-hidden {
  display: none;
}

/* my */


.gt-cookie-banner .flex-row-headline {
  display: flex;
  flex-direction: row;
  /* align-items: center; */
  /* justify-content: space-between; */
  /* height: 46px; */
  /* line-height: 34px; */
  line-height: 20px;
  /* background-color: green; */
  padding: 6px;
  margin-bottom: 12px;
}


.gt-cookie-banner .img-privacy {
  background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAxNi4wLjAsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+DQo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkViZW5lXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB3aWR0aD0iMjkuNzZweCIgaGVpZ2h0PSIzNC4yNTlweCIgdmlld0JveD0iMCAwIDI5Ljc2IDM0LjI1OSIgZW5hYmxlLWJhY2tncm91bmQ9Im5ldyAwIDAgMjkuNzYgMzQuMjU5IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxwYXRoIGZpbGw9Im5vbmUiIHN0cm9rZT0iIzNCM0M0MSIgc3Ryb2tlLXdpZHRoPSIxLjQ0IiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIHN0cm9rZS1taXRlcmxpbWl0PSIyMi45MjU2IiBkPSINCglNMTQuODgxLDMzLjU0QzYuNDI3LDI5Ljg4LDAuNzIsMjEuOTM4LDAuNzIsMTMuOTc1YzAtNC4wODEsMC4wNDktOS4xNywwLjA0OS0xMy4yNTVDMi4wMzYsMi4yMTEsNC41ODgsNC4yMzEsNy41Myw0LjIzMQ0KCWMzLjUxOSwwLDYuNDgtMS40NTgsNy4zNTEtMy40MzljMC44NzIsMS45ODEsMy44MzIsMy40MzksNy4zNTEsMy40MzljMi45NDIsMCw1LjQ5NC0yLjAyLDYuNzYxLTMuNTExDQoJYzAsNC4wODUsMC4wNDgsOS4xNzQsMC4wNDgsMTMuMjU1QzI5LjA0MSwyMS45MzgsMjMuMzMzLDI5Ljg4LDE0Ljg4MSwzMy41NEwxNC44ODEsMzMuNTR6Ii8+DQo8cG9seWxpbmUgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjM0IzQzQxIiBzdHJva2Utd2lkdGg9IjEuNDQiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLW1pdGVybGltaXQ9IjIyLjkyNTYiIHBvaW50cz0iDQoJOC45MjgsMTYuNzk0IDE0LjQxMSwyMy4xNDYgMjMuMTM3LDkuNzggIi8+DQo8L3N2Zz4NCg==");
  width: 40px;
  height: 46px;
  background-repeat: no-repeat;
  background-position: 50% 50%;
}

.gt-cookie-banner .headline {
  color: black;
  font-size: 1.6rem;
  font-weight: bold;
  flex: 1;
  /* background-color: red; */
  display: flex;
  align-items: center;
  justify-content: flex-start;
  padding-left: 6px;
}



.gt-cookie-banner .flex-row-chk {
  display: flex;
  flex-direction: row;
  align-items: start;
  /* justify-content: space-between; */
  /* height: 60px; */
  /* background-color: green; */
  /* padding: 6px; */
  margin-bottom: 10px;
  cursor: pointer;

}

/* 
 * Anpassungen wegen FontAwesome-Scrip 
 * (Vermutlich ist "assets/js/kit_fontawesome.js" dafür mit verantwortlich und auch einiges aus der main.css)
 * - Inputboxen müssen händisch sichtbar gemacht werden
 * - Standardverhalten funktioniert nur eingeschränkt 
 * - Flex-Box Positionierung und Styling schlecht bis gar nicht möglich 
 * - Kein Hacken mehr vorhanden
 * - Ancklick einer Checkbox reagiert nicht immer (nur auf der Startseite, nicht aber auf der Datenschutzseite)
 */

.gt-cookie-banner .flex-row-chk .gt-left {
  /* padding-top: 10px; */

  width: 52px;
  height: 100%;
  /* background-color: brown; */
  display: flex;
  /* align-items: center; */
  align-items: start;
  /* justify-content: space-between; */
  justify-content: center;

}

.gt-cookie-banner .flex-row-chk .gt-rigth {
  flex: 1;
  /* background-color: rgb(200, 138, 50); */
}

.gt-cookie-banner .flex-row-chk .chk-headline {
  color: black;
  font-weight: bolder;
  height: 20px;
  display: flex;
  align-items: center;
  /* background-color: #2e4996; */
}


.gt-cookie-banner .flex-row-chk .chk-text {
  font-size: 0.9rem;
  /* height: calc(60px - 20px); */
}

.gt-cookie-banner .flex-row-chk input[type="checkbox"] {
  /* appearance: none; */
  width: 20px;
  height: 20px;
  /* background-color: #ac3232; 
  border: 1px solid rgba(0,0,0,.1);
  border-radius: 3px; */
  cursor: pointer;
  opacity: 1;
  /* content: '+';  
  position: relative; */
}

.gt-cookie-banner .flex-row-chk input[type="checkbox"]::before {
  opacity: 0;
  /* content: ''; */
  /* content: '👍'; */
  /* content: '✔️'; */
  content: '✓';
  width: 20px;
  height: 20px;
  /* line-height: 20px; */
  /* display: flex;
  justify-content: center;
  align-items: center; */
  /* font-size: 1em; */
  position: relative;
  top: -9px;
  left: -3px;
  color: black;

  transition: all 0.2s;
}

/* .gt-cookie-banner .flex-row-chk input[type="checkbox"]:checked {
  opacity: 1;
  color: black;
  content: '✓';
  width: 20px;
  height: 20px;
} */

.gt-cookie-banner .flex-row-chk input[type="checkbox"]:checked::before {
  opacity: 1;
}
/* .gt-cookie-banner .flex-row-chk input[type="checkbox"]:checked::after {
  opacity: 1;
  content: '✓';
  width: 20px;
  height: 20px;
} */



.gt-cookie-banner .flex-row-bottom {
  display: flex;
  flex-direction: row;
  align-items: center;
  /* justify-content: space-between; */
  justify-content: space-evenly;
  padding-top: 8px;

}

.gt-cookie-banner .flex-row-bottom a {
  font-size: 0.8rem;
  color: #777;
}

.gt-cookie-banner .none {
  display: none;
}

.gt-cookie-banner .cookie-details p {
  color: black;
  margin-bottom: 12px;
}

.gt-cookie-banner .inactive {
  color: #888;
  background-color: #ddd;
}