@charset "ISO-8859-1";
/* Eine Welt Laden Wei&szlig;wasser Stylesheet COLLAPSIBLE QUIZ TABS [Safari, Chrome, Firefox, Opera, Konqueror, IE 10x, Edge] eineweltladen.info 2022-01-08
/* Realisation in 2016 with Adobe Dreamweaver CC. Spry Widgets and Adobe Labs. Thanks to Adobe. */

/* SpryCollapsiblePanel.css - version 0.5 - Spry Pre-Release 1.6.1 */
/* Copyright (c) 2006. Adobe Systems Incorporated. All rights reserved. Edited 2008 and 2016 by eineweltladen.info. */

/* This is the selector for the main CollapsiblePanel container. For our default style, the CollapsiblePanel is responsible for drawing the borders around the widget. If you want to constrain the width of the CollapsiblePanel widget, set a width on the CollapsiblePanel container. By default, our CollapsiblePanel expands horizontally to fill up available space.
 * The name of the class ("CollapsiblePanel") used in this selector is not necessary to make the widget function. You can use any class name you want to style the CollapsiblePanel container. */
.CollapsiblePanelGroup {border: none;}
.CollapsiblePanel {margin: 0px; padding: 1px; border: none; width: auto; height: 100%;}

/* This is the selector for the CollapsiblePanelTab. This container houses the title for the panel. This is also the container that the user clicks on to open or close the panel. The name of the class ("CollapsiblePanelTab") used in this selector is not necessary to make the widget function. You can use any class name you want to style an CollapsiblePanel panel tab container. */
.CollapsiblePanelTab {line-height: 1.6; font-size: 16px; font-weight: 400; text-decoration: none; font-family: "marigny", "Lucida Grande", "Lucida Sans", "Lucida Sans Unicode", "Trebuchet MS", "Helvetica Neue Light", "Helvetica New Light", "Helvetica Neue", "Helvetica New", "Comic Sans MS", Tahoma, Verdana, Arial, Helvetica, Sans-Serif; -webkit-font-smoothing: antialiased; -webkit-text-stroke-width: .05px; letter-spacing: -0.031em; background-color: transparent; margin: 0px; padding-left: 12px; padding-right: 12px; padding-top: 4px; padding-bottom: 4px; cursor: pointer; -webkit-transition: 0.3s linear all; -moz-transition: 0.3s linear all; -ms-transition: 0.3s linear all; -o-transition: 0.3s linear all; transition: 0.3s linear all;}

/* This is the selector for a CollapsiblePanel's Content area. It's important to note that you should never put any padding on the content area element if you plan to use the CollapsiblePanel's open/close animations. Placing a non-zero padding on the content element can cause the CollapsiblePanel to abruptly grow in height while the panels animate. The name of the class ("CollapsiblePanelContent") used in this selector is not necessary to make the widget function. You can use any class name you want to style a CollapsiblePanel content container. */
.CollapsiblePanelContent {margin: 0px; padding: 2px 0 2px 0; border: none; height: 100%;}

/* An anchor tag can be used inside of a CollapsiblePanelTab so that the keyboard focus ring appears *inside* the tab instead of around the tab. This is an example of how to make the text within the anchor tag look like non-anchor (normal) text. */
.CollapsiblePanelTab a {color: #45972e; text-decoration: none;}

/* This is an example of how to change the appearance of the panel tab that is currently open. The class "CollapsiblePanelOpen" is programatically added and removed from panels as the user clicks on the tabs within the CollapsiblePanel. */
.CollapsiblePanelOpen .CollapsiblePanelTab {background-color: transparent; letter-spacing: 1pt; color: #000000;}
.CollapsiblePanelClosed .CollapsiblePanelTab {display: none; visibility: hidden; line-height: 0;}
.CollapsiblePanelClosed {display: none; visibility: hidden; line-height: 0;}
.CollapsiblePanelOpen {height: auto;}

/* This is an example of how to change the appearance of the panel tab when the CollapsiblePanel is closed. The "CollapsiblePanelClosed" class is programatically added and removed whenever the CollapsiblePanel is closed.
.CollapsiblePanelClosed .CollapsiblePanelTab {background-color: #82c92f; background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ffd07a), color-stop(20%, #ffd07a), to(#f5b540)); background-image: -webkit-linear-gradient(#ffd07a, #ffd07a 20%, #f5b540); background-image: -moz-linear-gradient(top, #ffd07a, #ffd07a 20%, #f5b540); background-image: -ms-linear-gradient(#ffd07a, #ffd07a 20%, #f5b540); background-image: -o-linear-gradient(#ffd07a, #ffd07a 20%, #f5b540); background-image: linear-gradient(#ffd07a, #ffd07a 20%, #f5b540); color: #000000; -webkit-border-radius: 3px 3px 5px 5px; -moz-border-radius: 3px 3px 5px 5px; -o-border-radius: 3px 3px 5px 5px; -ms-border-radius: 3px 3px 5px 5px; border-radius: 3px 3px 5px 5px;} */

/* This is an example of how to change the appearance of the panel tab as the mouse hovers over it. The class "CollapsiblePanelTabHover" is programatically added and removed from panel tab containers as the mouse enters and exits the tab container. */
.CollapsiblePanelTabHover,  .CollapsiblePanelOpen .CollapsiblePanelTabHover {background-color: transparent; color: #000000; cursor: default;}

/* This is an example of how to change the appearance of all the panel tabs when the CollapsiblePanel has focus. The "CollapsiblePanelFocused" class is programatically added and removed whenever the CollapsiblePanel gains or loses keyboard focus. */
.CollapsiblePanelFocused .CollapsiblePanelTab {background-color: transparent; color: #000000; cursor: default;}

/* Extra Quiz-Styles */
article.quizarea {margin: 0 0 8px 0 !important; width: 100%; max-width: 960px; height: auto; min-height: 460px;}
@media only screen and (max-width:48em) {
	article.quizarea {height: auto; min-height: 640px;}}

div.quizanswer {display: none; margin: 6px 0 6px 0 !important; padding: 6px 0 6px 0 !important; border-top: 1px solid transparent; border-bottom: 0px solid transparent; border-left: 0px solid transparent; border-right: 0px solid transparent; -moz-border-image: -moz-linear-gradient(left, #ffffff 0%, #9eff25 50%, #ffffff 100%); -webkit-border-image: -webkit-linear-gradient(left, #ffffff 0%, #9eff25 50%, #ffffff 100%); border-image: linear-gradient(to right, #ffffff 0%, #9eff25 50%, #ffffff 100%); border-image-slice: 1;}
label.answer {margin-left: auto; margin-right: auto; margin-bottom: 5px; margin-top: 5px; font-size: 16px; color: #4057bb; text-decoration: none; padding: 4px;}

.abc_submit {text-align: left; width: 38px; font-family: 'marigny', 'Lucida Grande', 'Lucida Sans', 'Lucida Sans Unicode', 'Trebuchet MS', 'Helvetica Neue Light', 'Helvetica New Light', 'Helvetica Neue', 'Helvetica New', 'Comic Sans MS', Tahoma, Verdana, Arial, Helvetica, Sans-Serif; cursor: pointer; display: inline-block; background-color: #9eff25; padding: 5px 14px 6px; text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75); color: #333333; font-size: 14px; line-height: 1.6; border: 1px solid #9eff25; -webkit-border-radius: 4px; -moz-border-radius: 4px; -khtml-border-radius: 4px; border-radius: 4px;/* -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05); -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05); */-webkit-transition: 0.1s linear all; -moz-transition: 0.1s linear all; -ms-transition: 0.1s linear all; -o-transition: 0.1s linear all; transition: 0.1s linear all;}
.abc_submit:hover, .abc_submit:focus, .abc_submit:active {background-position: 0 -15px; background-color: #f6ff00; color: #222222; text-decoration: none; border: 1px solid rgb(123, 220, 0; -moz-box-shadow: inset 0px 1px 3px 0px rgba(0, 0, 0, 0.1), 0px 0px 12px 0px rgba(123, 220, 0, 0.8); -webkit-box-shadow: inset 0px 1px 3px 0px rgba(0, 0, 0, 0.1), 0px 0px 12px 0px rgba(123, 220, 0, 0.8); -o-box-shadow: inset 0px 1px 3px 0px rgba(0, 0, 0, 0.1), 0px 0px 12px 0px rgba(123, 220, 0, 0.8); box-shadow: inset 0px 1px 3px 0px rgba(0, 0, 0, 0.1), 0px 0px 12px 0px rgba(123, 220, 0, 0.8); box-shadow: inset 0px 1px 3px \0px/IE9 rgba(0, 0, 0, 0.1), 0px 0px 12px \0px/IE9 rgba(123, 220, 0, 0.8);}
