@charset "UTF-8";

.gb_container .row { display: -webkit-flex; display: -webkit-box; display: -ms-flexbox; display: flex; justify-content: space-between; flex-flow: row wrap; }
.gb_container .row > div { width: calc(1/2*100% - (1 - 1/2)*30px); margin: 20px 0; }

.gb_container { width: calc(100% - 20px); }
.gb_container .label { font-size: 1.1rem; padding-bottom: .5rem; font-weight: bold; }
.gb_title { margin: 2rem 0 1.5rem; }
.gb_title input[type=text] { width: 100%; }
.gb_image { margin-bottom: 1.5rem; }
.gb_image input[type=text] { width: calc(100% - 140px); }
.gb_image input[type=button] { width: 130px; }
.gb_hints { margin: 1rem 0; font-size: 1.2rem; background: #ffffff; padding: 15px; }

rect#rect1:hover,
rect#rect2:hover,
rect#rect3:hover,
rect#rect4:hover { opacity: .2; }
.grafik { position: relative; z-index: 100; }
.grafik .overlay { 
  position: absolute; top: 20px; left: 20px; right: 20px; bottom: 20px; visibility: hidden; opacity: 0; background: rgba(255,255,255,.92); padding: 1.5rem; font-size: 1.3vw; line-height: 1.8vw; 
  -webkit-transition:ease 0.3s; -moz-transition:ease 0.3s; -o-transition:ease 0.3s; transition:ease 0.3s;
}
.grafik .overlay.active { visibility: visible; opacity: 1; top: 10px; left: 10px; right: 10px; bottom: 10px; }
.grafik .overlay .bu_close { position: absolute; top: 20px; right: 20px; font-size: 40px; cursor: pointer; }
.grafik .overlay .bu_close:hover { color: #d60b51; }
.grafik .overlay .bu_close i { margin: 0; }
.grafik .overlay h1, .grafik .overlay h2, .grafik .overlay h3, .grafik .overlay h4, .grafik .overlay h5, .grafik .overlay h6 { font-size: 1.9vw; }

@media all and (max-width: 1300px) {
  .gb_container .row > div { width: 100%; margin: 15px 0; }
  .grafik .overlay { padding: 15px; }
  .grafik .overlay .bu_close { top: 10px; right: 10px; font-size: 30px; cursor: pointer; }
}

@media all and (max-width: 1024px) {
  .grafik .overlay { padding: 10px; }
  .grafik .overlay .bu_close { top: 10px; right: 10px; font-size: 25px; cursor: pointer; }
  .text .grafik .overlay ul { margin-bottom: 1.5vw; }
}

@media all and (max-width: 768px) {
  .grafik .overlay h1, .grafik .overlay h2, .grafik .overlay h3, .grafik .overlay h4, .grafik .overlay h5, .grafik .overlay h6 { font-size: 3.1vw; }
  .grafik .overlay { font-size: 2.2vw; line-height: 3vw; padding: 10px; }
}