*{ margin:0px; padding:0px; line-height: 1.5; }
html { width:100%; height:100%; }
body { font-size:16px; font-family: arial; font-weight:400; color:#000000; background-color:#999; }

h1 { font-size:40px; line-height:43px; color: #44bf19; margin-bottom:15px; font-weight: 600; text-align:left; text-transform:uppercase; }
h2 { font-size:30px; line-height:33px; color: #44bf19; margin-bottom:13px; font-weight: 600; text-align:left; text-transform:uppercase; }
h3 { font-size:25px; line-height:28px; color: #44bf19; margin-bottom:13px; font-weight: 600;  }
h4 { font-size:20px; line-height:23px; color: #44bf19; margin-bottom:10px; font-weight: 600;  }
h5 { display:inline; margin:0px; padding:0px; color: #000000; font-size:16px; font-weight:600; }

td { padding:10px; }
img { border: 0; }
p { margin: 20px 0px 15px 0px; }

/*::selection {
/*  background: #44bf19; /* WebKit/Blink Browsers */
/*  color:#ffffff;
/*} */
::-moz-selection {
  background: #44bf19; /* Gecko Browsers */
  color:#ffffff;
}


a:link    { color:#44bf19; text-decoration: none; font-weight:600; }
a:hover   { color:#44bf19; }
a:visited { color:#44bf19; }

.shadow { -moz-box-shadow: 0 0 10px #888; -webkit-box-shadow: 0 0 10px #888; box-shadow: 0 0 10px #888; }
.white { background:none rgba(255,255,255,0.8); }

input[type=button] {
  padding:5px 15px;
  background:#44bf19;
  color:#fff;
  font-weight:bold;
  border:0 none;
  cursor:pointer;
  -webkit-border-radius: 5px;
  border-radius: 5px; 
 }



#home-text a span {display:none;}
#home-text a:focus span {display:block; position:absolute; left:?px; top:?px;}
#home-text a:active span {display:block; position:absolute; left:?px; top:?px;}

.zoom img {  }


#site{ clear:both; float:left; margin:0px; padding: 0px; width:100%; height:100%; background-color:#ffffff; }


#header{ clear:both; float:left; margin:0px; padding:0px;  width:100%; height:600px; background-color:#2f363e; background-image: url(../background/Wutaki_Cover_Web.jpg); background-size:cover; background-position: center; }
#header a:link    { color:#ddd; text-decoration: none; font-weight:400; }
#header a:visited { color:#ddd; }
#header a:hover   { color:#44bf19; }

#logo { float:left; margin-left:35px; margin-top:25px; margin-bottom:15px; }

#menu_start { float:left; margin-top:10px; margin-left:25px; }
#menu 		{ float:right; margin-top:20px; margin-right:35px; padding:10px 20px 10px 30px; background: rgba(0,0,0,0.7); color:#ffffff; }

#welcome { margin: 0 auto; margin-top:300px; width:600px; padding:0px 20px 20px 20px; text-align:center; color:#ffffff; font-size:18px; }
#welcome p { font-size:60px; color: #ffffff; margin-bottom:2px; font-weight: 800; line-height:60px; text-transform:uppercase;  }

/* Navigation */
ul#navigation { width:100%; }
ul#navigation li { float:left; font-weight:bold; position:relative; list-style: none; margin-right:25px; }
ul#navigation li:hover{ text-decoration:none; color:#44bf19; }   
ul#navigation a { text-decoration:none; }
ul#navigation a:visited{ }
ul#navigation li a:hover{  }


#teaser { margin:0px; padding: 0px; width:100%; height:530px; overflow:hidden; background-image: url(../ressources/bg/start.jpg); background-size:cover; background-position: center; }
#teaser-wrap { margin-left:0%; margin-top:20px; }
#teaser h1 { font-size:45px; color: #222222; margin-bottom:15px; font-weight: 600; text-transform:uppercase; line-height:39px; margin-bottom:5px; }
#teaser h2 { font-size:60px; color: #44bf19; margin-bottom:5px;  text-shadow: 1px 1px 0px #333; font-weight: 600; text-transform: uppercase; }
#teaser h3 { font-size:30px; color: #ffffff; margin-bottom:13px; text-shadow: 1px 1px 2px #000; font-weight: 400;  }



.content{ clear:both; float:left; width:100%; padding:30px 0 30px 0; }
.content_wrap { position:relative; left:50%; margin-left:-700px; width:1400px;  }



#footer { clear:both; float:left; width:100%; margin:0px; padding:0px; background-color:#222; font-size:14px; color:#ffffff; }
#footer_wrap { position:relative; left:50%; margin-left:-465px; width:1000px; }

#footer .headline 		{ clear:both; float:left; width:100%; text-align:center; margin-top:-20px; }
#footer .headline span 	{ background-color:#ee1f63; color:#ffffff; margin-top:10px; padding:5px 20px 5px 20px; font-size:26px; font-weight:bold; }
#footer .headline b 	{ color:#ffffff; font-size:26px; font-weight:bold; text-transform:uppercase; }

#footer .box { float:left; width:30%; text-align:center; margin:50px 0 60px 0px; line-height:1.5em; }
#footer .box span { clear:both; float:left; width:100%; margin-bottom:20px; text-align:center; font-size:26px; font-weight:bold; color: #44bf19; }
#footer .box span b { margin-top:-20px; }

#footer b {  font-weight: 600; }
#footer a:link    { color:#777; text-decoration: none; }
#footer a:visited { color:#777;  }
#footer a:hover   { color:#44bf19;  }


.f_box 			 { color:#fff; text-decoration: none; font-size:12px; }
.f_box a:link    { color:#fff; text-decoration: none; font-size:12px; }
.f_box a:visited { color:#fff;  }
.f_box a:hover   { color:#44bf19;  }
.f_left  { float:left;  text-align:left;  margin-left:20px;  }
.f_right { float:right; text-align:right; margin-right:20px; }

.spiellink  	 		{ color:#44bf19; text-decoration: none; font-size:14px; }
.spiellink div 	 		{ background-color:#cecece; }
.spiellink a:link   	{ color:#44bf19; text-decoration: none; font-size:14px; }
.spiellink a:visited 	{ color:#44bf19;  }
.spiellink a:hover   	{ color:#5BFF21;  }

.input_pink_button { background-color:#ee1f63; color:#ffffff; margin-top:20px; margin-left:0px; padding:15px 20px 15px 20px; font-size:20px; font-weight:bold; border:0px;  text-transform:uppercase; font-style:italic; }



.top_button_active { float:left; width:310px; padding:10px; background:#44bf19; font-weight:bold; text-align:center; color:#cecece; font-size:10px; line-height:13px;  border-left:1px white solid; border-right:1px white solid; }
.top_button_active a { font-size:12px; color:#ffffff; font-weight:bold; text-decoration: none; text-transform: uppercase;}
.top_button_active a:hover { color:#ffffff; }
.top_button_active span { font-size:12px; color:#fff; font-weight:bold; text-decoration: none; text-transform: uppercase; }

.top_button { float:left; width:310px; padding:10px; background:#ddd; font-weight:bold; text-align:center; color:#777; font-size:10px; line-height:13px; border-left:1px white solid; border-right:1px white solid;  }
.top_button a { font-size:12px; color:#888; font-weight:bold; text-decoration: none; text-transform: uppercase; }
.top_button a:hover { color:#44bf19; }
.top_button span { font-size:12px; color:#888; font-weight:bold; text-decoration: none; text-transform: uppercase; }

.top_padding { padding:0px 0px 0px 0px; }




.l-dot { list-style-image: url(list.png);       }
.l-inc { list-style-image: url(inclusive.png);  }


.shop_kategorie  { float:left; width:98%; margin-bottom:5px; margin-top:5px; padding:10px 0px 10px 10px; font-size:22px; color:#ee1f63; border-bottom:2px #ee1f63 dashed; }
.shop_column     { float:left; width:29%; padding:18px; margin-bottom:10px; }
.shop_header     { float:left; width:100%; margin-bottom:5px; }
.shop_artikeldata{ float:left; width:30%; }
.shop_rabatttext { float:left; width:49%; }
.shop_rabattform { float:left; width:47%; }
.shop_rabattform input { width:95%; padding:10px; margin:10px 10px 10px 0px; font-size:20px; }

.kontakt_left { clear:both; float:left; width:50%; height:600px; background-size:cover; background-position: center; }
.kontakt_right { float:right; width:50%; height:600px; background-size:cover; background-position: center; }
.kontakt_full { clear:both; float:left; width:100%; height:600px; background-size:cover; background-position: center; }

.blog_button { float:left; padding:5px 10px 5px 10px; margin:5px 10px 5px 10px; font-size:18px; font-weight:bold; background-color:#44bf19; color:#fff; }

.left-box  { float:left;  width:43%; padding:20px; margin:2%; }
.right-box { float:right; width:43%; padding:20px; margin:2%;}
.third-box 	 	 { float:left;  width:65%; padding:20px; }
.one-third-box   { float:right;  width:25%; padding:20px; }
.third-box-r 	 { float:right;  width:65%; padding:20px; }
.one-third-box-l { float:left;  width:25%; padding:20px; }
.full-box  { clear:both; float:left; width:91%; padding:20px; margin:2%;}
.tiny-box  { float:left; width:28%; margin:2%; } 
.justify   { text-align:justify; }
.clear     { clear:both; }
.center    { text-align: center; }
.left      { text-align: left;   }
.right     { text-align: right;  }

.border    { border:1px #000 solid; }
.border-dashed    { border:2px #cecece; border-style: dashed; }

.rounded    { border-radius: 12px; }
.bg_white   { background-color: #ffffff; }
.bg_green   { background: rgba(208,243,198,0.8); }
.bg_yellow  { background: rgba(246,218, 85,0.2); }
.bg_grey    { background: rgba(100,100,100,0.5); }
.bg_red     { background: rgba(224, 130, 168,0.32); }
.bg_blue    { background: rgba(215,237,244,0.7); }
.bg_rosa    { background-color: #ffede4; }
.bg_pink    { background-color: #f1d7f4; }
.bg_dark    { background: rgba(100,100,100,0.8); color:#ffffff; }
.bg_black   { background: rgba(0,0,0,0.7); color:#ffffff; }


.pink_button { background-color:#ee1f63; color:#ffffff; margin-top:20px; padding:5px 15px 5px 15px; font-size:16px; font-weight:bold; border:0px; text-transform:uppercase; }
.pink_shopbutton { background-color:#ee1f63; color:#ffffff; padding:5px 15px 5px 15px; font-size:20px; font-weight:bold; }
.green_button { background-color:#44bf19; color:#ffffff; margin:10px; padding:10px 20px 10px 20px; font-size:20px; font-weight:bold; border:0px; text-transform:uppercase; }

.dropdown_form { width:95%; padding:15px; margin:10px 10px 10px 0px; font-size:16px; }
.full_form { width:90%; padding:10px; margin:10px 10px 10px 0px; font-size:20px; }
.half_form { width:45%; padding:10px; margin:10px 10px 10px 0px; font-size:20px; }


.break_1 { clear:both; float:left; margin:0px; padding:0px; width:100%; height:28px; background-color: #2f363e; background-image:url(break_3.png);  }
.break_2 { clear:both; float:left; margin:0px; padding:0px; width:100%; height:28px; background-color: #ffffff; background-image:url(break_7.png);  }
.break_3 { clear:both; float:left; margin:0px; padding:0px; width:100%; height:28px; background-color: #ffffff; background-image:url(break_7.png);  }
.break_4 { clear:both; float:left; margin:0px; padding:0px; width:100%; height:28px; background-color: #ffffff; background-image:url(break_8.png);  }
.break_5 { clear:both; float:left; margin:0px; padding:0px; width:100%; height:28px; background-color: #ffffff; background-image:url(break_9.png);  }

.break_99 { clear:both; float:left; margin:0px; padding:0px; width:100%; height:28px; background-image:url(break_99.png);  }


.preis span { background-color:#44bf19; color:#ffffff; margin-top:40px; padding:5px 15px 5px 15px; font-size:20px; font-weight:bold; }
.preis .anfrage { background-color:#ee1f63; color:#ffffff; margin-top:20px; padding:5px 20px 5px 20px; font-size:20px; font-weight:bold; }
.preis .anfrage a 	{ color:#ffffff; font-size:20px; font-weight:bold; text-transform:uppercase; font-style:italic; }


.shop_spacer  { clear:both; float:left; width:100%; height:1px; margin-top:10px; border-top:1px #cecece solid; }
.shop_left    { clear:both; float:left; width:80%; margin-top:10px; padding:4px 0px 4px 10px;  }
.shop_right   { float:right; width:15%; text-align:right; margin-top:10px; padding:4px 10px 4px 0px; }


/* FARBEN COOKIES POPUP */
.cc_container .cc_btn {
background-color: #ee1f63 !important; /* Farbe des Buttons */
color: #ffffff !important; /* Textfarbe des Buttons */
}
 
.cc_container {
background: #2f363e !important; /* Hintergrundfarbe des gesamten Bereichs */
color: #ffffff !important; /* Schriftfarbe des gesamten Bereichs */
}
 
.cc_container a {
color: #44bf19 !important; /* Textlink-Farbe "Mehr Infos" */
}













/** LIGHTBOX MARKUP **/
.lightbox {
  display: none;
  position: fixed;
  z-index: 999;
  width: 100%;
  height: 100%;
  overflow: auto;
  top: 0;
  left: 0;
  text-align: center;
  padding-top: 50px;
  background: rgba(0,0,0,0.9);
}

.lightbox img {
  max-width: 90%;
  max-height: 80%;
  margin-top: 50px;
  border: 10px #ffffff solid;
  border-radius: 12px;
}

.lightbox:target {
  outline: none;
  display: block;
}

img.hover-shadow {
  transition: 0.3s;
}

.hover-shadow:hover {
  cursor: pointer;
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1), 0 3px 10px 0 rgba(0, 0, 0, 0.1);
}












.collapsible {
  color: white;
  cursor: pointer;
  padding: 18px;
  width: 100%;
  border: 3px white solid;
  text-align: center;
  outline: none;
  font-size: 25px;
}

.active, .collapsible:hover {
  background-color: #555;
}

.collapsible:after {
  content: '\002B';
  color: white;
  font-weight: bold;
  float: right;
  margin-left: 5px;
}

.active:after {
  content: "\2212";
}

.uncollapsible {
  padding: 0px;
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.2s ease-out;
  text-align: center;
  font-size: 25px;
}

.uncollapsible p { margin:30px; font-weight:bold; }

.tipps  { background-color:#b4b4b4; padding:5px 15px 5px 15px; font-weight:bold; text-transform:uppercase; }
.losung { background-color:#ee1f63; padding:5px 15px 5px 15px; font-weight:bold; text-transform:uppercase; }



.answer { clear:both; float:left; width:100%; margin: 20px 0 40px 0; padding:10px; font-size: 30px; color:white; text-align: center; border:5px white dashed; text-transform: uppercase; font-weight: bold; }
.answer_correct { background-color:#83d167; }
.answer_false   { background-color:#ff3300; }
.answer_hinweis { background-color:#f8cc9c; margin-top:-20px;}













.youtube { width:853px; height:480px; box-shadow:0px 0px 5px #222; }



.foto_button_active { float:left; width:225px; padding:10px; background:#44bf19; font-weight:bold; text-align:center; color:#cecece; font-size:10px; line-height:13px;  border-left:1px white solid; border-right:1px white solid; }
.foto_button_active a { font-size:12px; color:#ffffff; font-weight:bold; text-decoration: none; text-transform: uppercase;}
.foto_button_active a:hover { color:#ffffff; }

.foto_button { float:left; width:225px; padding:10px; background:#ddd; font-weight:bold; text-align:center; color:#777; font-size:10px; line-height:13px; border-left:1px white solid; border-right:1px white solid;  }
.foto_button a { font-size:12px; color:#888; font-weight:bold; text-decoration: none; text-transform: uppercase; }
.foto_button a:hover { color:#44bf19; }

.foto_padding { padding:0px 0px 0px 0px; }





.foto_slidebox { clear:both; float:left; width:350px; margin-left:60px; margin-top:20px; }

.foto_headline    { float:right; width:500px; margin-right:15px; }
.foto_headline span { background-color:#44bf19; color:#ffffff; margin-top:10px; padding:5px 15px 5px 15px; font-size:20px; font-weight:bold; }
.foto_headline .anfrage { background-color:#ee1f63; color:#ffffff; margin-top:10px; padding:5px 20px 5px 20px; font-size:20px; font-weight:bold; }
.foto_headline .anfrage a 	{ color:#ffffff; font-size:20px; font-weight:bold; text-transform:uppercase; font-style:italic; }


.foto_description { float:right; width:500px; margin-right:15px; }
.foto_description ul { margin-top:30px; margin-bottom:10px; list-style-position:inside; }
.foto_description ul b { font-size:18px; }
.foto_description li { margin-left:15px; }


.foto_subdescription { clear:both; float:left; margin:20px; }
.foto_subdescription a { color:#000; font-weight:bold; }
.foto_subdescription small { color:#777; }

.foto_anfrage    	{ clear:both; float:left; margin-top:30px; text-align:center; }
.foto_anfrage span 	{ background-color:#ee1f63; color:#ffffff; margin-top:10px; padding:15px 25px 15px 25px; font-size:20px; font-weight:bold; font-style:italic; }
.foto_anfrage a 	{ color:#ffffff; font-size:20px; font-weight:bold; text-transform:uppercase; }

.foto_greenbox { width:50%; padding:20px 0 20px 0; background-color:#44bf19; text-align:center; margin-top:0px; font-size:18px; color:#fff; font-weight:bold; }
.foto_greenbox b { font-size:30px; }
.foto_greenbox a:hover { color:#cecece; }

.foto_greenstripe { clear:both; float:left; width:100%; background-color:#44bf19; text-align:center; padding:20px 0 20px 0; color:#ffffff; font-weight:bold; font-size:24px; text-transform:uppercase; }
