@charset "UTF-8";
/*!
 * Compiled on: 2017-06-27 10:30:44 +0200
 * Base stylesheet for TYPO3 Base
 *
 * @package terra_template
 * @path /Main.scss
 * @author Exinit GmbH & Co. KG <info@exinit.de>


 */
/* 768-992 Small Devices, Tablets */
/* 480 Extra Small Devices, Phones */
/* Declarations which should be put at the top of the document e.g. @font-face declarations and CSS viewports  @package terra_template @path Generic/_Head.scss */
/* =============================================================================
$ Border-Box
================================================================================ */
*, *:before, *:after { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }

/* A cut-down version of normalize.css  @package terra_template @path Generic/_Normalize.scss @author Nicolas Gallagher @link http://necolas.github.com/normalize.css/ */
/* =============================================================================
$ Normalize HTML5 display definitions
================================================================================ */
/** Corrects `block` display not defined in IE6/7/8/9 & FF3. */
article, aside, details, figcaption, figure, main, footer, header, hgroup, nav, section, summary { display: block; }

/** Corrects `inline-block` display not defined in IE 8/9. */
audio, canvas, video { display: inline-block; }

/** Addresses styling for `hidden` attribute not present in IE7/8/9, FF3, S4. Known issue: no IE6 support. */
[hidden] { display: none; }

/* ============================================================================= Normalize Base
================================================================================ */
/** 1. Corrects text resizing oddly in IE6/7 when body `font-size` is set using `em` units. 2. Prevents iOS text size adjust after orientation change, without disabling user zoom. 3. Forces vertical scrollbar to prevent jumpy page */
html { -webkit-text-size-adjust: 100%; /* 2 */ -ms-text-size-adjust: 100%; /* 2 */ overflow-y: scroll; /* 3 */ }

/* ============================================================================= Normalize Forms
================================================================================ */
/** 1. Corrects font size not being inherited in all browsers. 2. Addresses margins set differently in IE6/7, FF3+, S5, Chrome. 3. Improves appearance and consistency in all browsers. */
button, input, select, textarea { font-size: 100%; /* 1 */ margin: 0; /* 2 */ vertical-align: baseline; /* 3 */ }

/** Addresses FF3/4 setting `line-height` on `input` using `!important` in the UA stylesheet. */
button, input { line-height: normal; }

/** Address inconsistent `text-transform` inheritance for `button` and `select`. All other form control elements do not inherit `text-transform` values. Correct `button` style inheritance in Chrome, Safari 5+, and IE 8+. Correct `select` style inheritance in Firefox 4+ and Opera. */
button, select { text-transform: none; }

/** 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio` and `video` controls. 2. Corrects inability to style clickable `input` types in iOS. 3. Improves usability and consistency of cursor style between image-type `input` and others. 4. Removes inner spacing in IE7 without affecting normal text inputs. Known issue: inner spacing remains in IE6. */
button, html input[type="button"], input[type="reset"], input[type="submit"] { -webkit-appearance: button; /* 2 */ cursor: pointer; /* 3 */ }

/** Re-set default cursor for disabled elements. */
button[disabled], html input[disabled] { cursor: default; }

/** 1. Addresses box sizing set to content-box in IE8/9. 2. Removes excess padding in IE8/9. 3. Removes excess padding in IE7. Known issue: excess padding remains in IE6. */
input[type="checkbox"], input[type="radio"] { box-sizing: border-box; /* 1 */ padding: 0; /* 2 */ }

/** 1. Addresses `appearance` set to `searchfield` in S5, Chrome. 2. Addresses `box-sizing` set to `border-box` in S5, Chrome (include `-moz` to future-proof). */
input[type="search"] { -webkit-appearance: textfield; /* 1 */ }

/** Removes inner padding and search cancel button in S5, Chrome on OS X. */
input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; }

/** Removes inner padding and border in FF3+. */
button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; }

/* Sizes which are used in conjunction with other objects and abstractions like the grid system, from inuit.css <https://github.com/csswizardry/inuit.css/>  @package terra_template @path Generic/_Widths.scss @license Apache License, Version 2.0. */
/* =============================================================================
$ Widths
================================================================================ */
/**
* Whole
*/
.one-whole { width: 100%; }

/**
* Halves
*/
.one-half, .two-quarters, .three-sixths, .four-eighths, .five-tenths, .six-twelfths { width: 50%; }

/**
* Thirds
*/
.one-third, .two-sixths, .four-twelfths { width: 33.333%; }

.two-thirds, .four-sixths, .eight-twelfths { width: 66.666%; }

/**
* Quarters
*/
.one-quarter, .two-eighths, .three-twelfths { width: 25%; }

.three-quarters, .six-eighths, .nine-twelfths { width: 75%; }

/**
* Fifths
*/
.one-fifth, .two-tenths { width: 20%; }

.two-fifths, .four-tenths { width: 40%; }

.three-fifths, .six-tenths { width: 60%; }

.four-fifths, .eight-tenths { width: 80%; }

/**
* Sixths
*/
.one-sixth, .two-twelfths { width: 16.666%; }

.five-sixths, .ten-twelfths { width: 83.333%; }

/**
* Eighths
*/
.one-eighth { width: 12.5%; }

.three-eighths { width: 37.5%; }

.five-eighths { width: 62.5%; }

.seven-eighths { width: 87.5%; }

/**
* Tenths
*/
.one-tenth { width: 10%; }

.three-tenths { width: 30%; }

.seven-tenths { width: 70%; }

.nine-tenths { width: 90%; }

/**
* Twelfths
*/
.one-twelfth { width: 8.333%; }

.five-twelfths { width: 41.666%; }

.seven-twelfths { width: 58.333%; }

.eleven-twelfths { width: 91.666%; }

@media screen and (max-width: 960px) { /** Whole */
  .tablet-one-whole { width: 100%; }
  /** Halves */
  .tablet-one-half, .tablet-two-quarters, .tablet-three-sixths, .tablet-four-eighths, .tablet-five-tenths, .tablet-six-twelfths { width: 50%; }
  /** Thirds */
  .tablet-one-third, .tablet-two-sixths, .tablet-four-twelfths { width: 33.333%; }
  .tablet-two-thirds, .tablet-four-sixths, .tablet-eight-twelfths { width: 66.666%; }
  /** Quarters */
  .tablet-one-quarter, .tablet-two-eighths, .tablet-three-twelfths { width: 25%; }
  .tablet-three-quarters, .tablet-six-eighths, .tablet-nine-twelfths { width: 75%; }
  /** Fifths */
  .tablet-one-fifth, .tablet-two-tenths { width: 20%; }
  .tablet-two-fifths, .tablet-four-tenths { width: 40%; }
  .tablet-three-fifths, .tablet-six-tenths { width: 60%; }
  .tablet-four-fifths, .tablet-eight-tenths { width: 80%; }
  /** Sixths */
  .tablet-one-sixth, .tablet-two-twelfths { width: 16.666%; }
  .tablet-five-sixths, .tablet-ten-twelfths { width: 83.333%; }
  /** Eighths */
  .tablet-one-eighth { width: 12.5%; }
  .tablet-three-eighths { width: 37.5%; }
  .tablet-five-eighths { width: 62.5%; }
  .tablet-seven-eighths { width: 87.5%; }
  /** Tenths */
  .tablet-one-tenth { width: 10%; }
  .tablet-three-tenths { width: 30%; }
  .tablet-seven-tenths { width: 70%; }
  .tablet-nine-tenths { width: 90%; }
  /** Twelfths */
  .tablet-one-twelfth { width: 8.333%; }
  .tablet-five-twelfths { width: 41.666%; }
  .tablet-seven-twelfths { width: 58.333%; }
  .tablet-eleven-twelfths { width: 91.666%; } }
@media screen and (max-width: 480px) { /** Whole */
  .phone-one-whole { width: 100%; }
  /** Halves */
  .phone-one-half, .phone-two-quarters, .phone-three-sixths, .phone-four-eighths, .phone-five-tenths, .phone-six-twelfths { width: 50%; }
  /** Thirds */
  .phone-one-third, .phone-two-sixths, .phone-four-twelfths { width: 33.333%; }
  .phone-two-thirds, .phone-four-sixths, .phone-eight-twelfths { width: 66.666%; }
  /** Quarters */
  .phone-one-quarter, .phone-two-eighths, .phone-three-twelfths { width: 25%; }
  .phone-three-quarters, .phone-six-eighths, .phone-nine-twelfths { width: 75%; }
  /** Fifths */
  .phone-one-fifth, .phone-two-tenths { width: 20%; }
  .phone-two-fifths, .phone-four-tenths { width: 40%; }
  .phone-three-fifths, .phone-six-tenths { width: 60%; }
  .phone-four-fifths, .phone-eight-tenths { width: 80%; }
  /** Sixths */
  .phone-one-sixth, .phone-two-twelfths { width: 16.666%; }
  .phone-five-sixths, .phone-ten-twelfths { width: 83.333%; }
  /** Eighths */
  .phone-one-eighth { width: 12.5%; }
  .phone-three-eighths { width: 37.5%; }
  .phone-five-eighths { width: 62.5%; }
  .phone-seven-eighths { width: 87.5%; }
  /** Tenths */
  .phone-one-tenth { width: 10%; }
  .phone-three-tenths { width: 30%; }
  .phone-seven-tenths { width: 70%; }
  .phone-nine-tenths { width: 90%; }
  /** Twelfths */
  .phone-one-twelfth { width: 8.333%; }
  .phone-five-twelfths { width: 41.666%; }
  .phone-seven-twelfths { width: 58.333%; }
  .phone-eleven-twelfths { width: 91.666%; } }
/* Styling for TYPO3 related classes  @package terra_template @path Generic/_T3General.scss */
/* =============================================================================
$ CSC-Frames
================================================================================ */
.csc-frame-rulerBefore { border-top: 1px solid #cccccc; }

.csc-frame-rulerAfter { border-bottom: 1px solid #cccccc; }

.csc-frame-indent { padding: 0 10%; }

.csc-frame-indent3366 { padding-left: 33.333%; }

.csc-frame-indent6633 { padding-right: 33.333%; }

/* =============================================================================
$ CSC-Tables
================================================================================ */
/* Gernerated classes for brand related styling  @package terra_template @path Generic/_Brand.scss */
/* =============================================================================
$ Brand styles
================================================================================ */
.brand { font-family: "Lato", sans-serif; color: #0097d7; }

.brand-color { color: #0097d7; }

.brand-face { font-family: "Lato", sans-serif; }

/* High-level wrapper elements  @package terra_template @path Base/_Base.scss */
/* =============================================================================
$ High level wrapper and elements
================================================================================ */
body { /** Remove default margin. */ margin: 0; font: 400 100%/1.5 "Lato", sans-serif; text-align: left; color: #3C474B; background: #fff; }

.site-wrapper { margin-left: auto; margin-right: auto; max-width: 75em; position: relative; }

/* Basic styling for headings and sub-headings  @package terra_template @path Base/_Headings.scss */
/* =============================================================================
$ Headings
================================================================================ */
h1, h2, h3, h4, h5, h6 { font-weight: 700; color: #000; /** Optimized kerning for large font sizes use this only on large font-sizes (f.e. headings) to avoid performance issues */ text-rendering: optimizeLegibility; }

h1, .h1 { font-size: 36px; font-size: 2.25rem; line-height: 1.33333; }

h2, .h2 { font-size: 30px; font-size: 1.875rem; line-height: 1.6; }

h3, .h3 { font-size: 24px; font-size: 1.5rem; line-height: 1; }

h4, .h4 { font-size: 20px; font-size: 1.25rem; line-height: 1.2; }

h5, .h5 { font-size: 16px; font-size: 1rem; line-height: 1.5; }

h6, .h6 { font-size: 14px; font-size: 0.875rem; line-height: 1.71429; }

/* Basic styling for all typographic related elements e.g. <b>, <sup>, <i>  @package terra_template @path Base/_Typography.scss */
/* =============================================================================
$ Typography Elements
	Contents: 1: Addresses style set to `bolder` in FF3+, S4/5, Chrome.
						2: Addresses styling not present in IE7/8/9, S5, Chrome.
						3: Addresses styling not present in IE6/7/8/9.
						4: Addresses styling not present in S5, Chrome.
						5: Prevents `sub` and `sup` affecting `line-height` in all browsers.
							 gist.github.com/413930
================================================================================ */
b, strong { font-weight: 700; /* 1 */ }

small { font-size: 80%; }

abbr[title] { /* 2 */ border-bottom: 1px dotted; cursor: help; }

mark { /* 3 */ background: #0097d7; color: white; }

dfn { font-style: italic; /* 4 */ }

sub, sup { /* 5 */ font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }

sup { top: -0.5em; }

sub { bottom: -0.25em; }

/* =============================================================================
$ Code & pre-formatted text elements
================================================================================ */
code, kbd, pre, samp { /** Corrects font family set oddly in Safari 5 and Chrome. */ font-family: "Lato", sans-serif; font-size: 1em; }

pre { /** Improves readability of pre-formatted text in all browsers. */ white-space: pre-wrap; }

/* =============================================================================
$ Quotes
================================================================================ */
q { /** Sets consistent quote types. */ quotes: "\201C" "\201D" "\2018" "\2019"; }

/* =============================================================================
$ Seperators
================================================================================ */
hr { /**
* Address differences between Firefox and other browsers.
*/ -moz-box-sizing: content-box; box-sizing: content-box; display: block; height: 0; border: 0; border-top: 1px solid #cccccc; padding: 0; }

/* =============================================================================
$ Text-Selection
================================================================================ */
::-moz-selection, ::selection { background: #0097d7; color: white; text-shadow: none; }

/* =============================================================================
$ Typographic Helper Classes
================================================================================ */
/* ======================= Basic helpers ======================= */
.align-center { text-align: center; }

.align-right { text-align: right; }

.align-left { text-align: left; }

.intend { padding: 0 1.5em; }

/* ====================== CSS3 Word-breaker ====================== */
.text-break, .dl--horizontal dt { /** Break strings when their length exceeds the width of their container. */ word-wrap: break-word; -webkit-hyphens: auto; -moz-hyphens: auto; -ms-hyphens: auto; -o-hyphens: auto; hyphens: auto; }

/* ======================= Margin-reset ======================== */
p, pre, menu, ol, ul, dl { margin-top: 0; }

/* ======================== Top margins ======================== */
/* Basic spacing */
blockquote, hr, .basic_spacing-top { margin-top: 24px; margin-top: 1.5rem; }

/* Half spacing */
.half_spacing-top { margin-top: 12px; margin-top: 0.75rem; }

/* ====================== Bottom margins ======================= */
/* Basic spacing */
p, pre, blockquote, hr, menu, ol, ul, dl, iframe, video, audio, .table, .contenttable-1, .contenttable-2, .contenttable-3, form, legend, .basic_spacing-bottom { margin-bottom: 24px; margin-bottom: 1.5rem; }

/* Half spacing */
.half_spacing-bottom { margin-bottom: 12px; margin-bottom: 0.75rem; }

/* Basic styling for anchor tags  @package terra_template @path Base/_Links.scss */
/* =============================================================================
$ Links
================================================================================ */
a { color: #0097d7; text-decoration: none; /** Remove the gray background color from active links in IE 10. */ background: transparent; }
a:hover, a:active, a:focus { text-decoration: underline; }
a:focus { outline: thin dotted; outline: 5px auto -webkit-focus-ring-color; outline-offset: -1px; }
a:active, a:hover { /** Improves readability when focused and also mouse hovered in all browsers. */ outline: 0; }
p a { /** Increasing the Clickable Area of Inline Links inside a paragraph */ margin: -.33em; padding: .33em; position: relative; }

/* Basic styling for lists and definition elements  @package terra_template @path Base/_Lists.scss */
/* =============================================================================
$ Lists
================================================================================ */
menu, ol, ul { padding: 0 0 0 2.5em; }

li > ul, li > ol { /** Remove vertical spacing from nested lists */ margin-bottom: 0; }

/* ======================== Reset list ========================= */
.nav, .reset-list { /** Resets the standard list styles of a <ul> or <ol> */ list-style: none; margin-bottom: 0; padding-left: 0; }

/* =============================================================================
$ Definitions
================================================================================ */
/* =============================================================================
$ Horizontal definition abstraction
================================================================================ Display a definition list in a horizontal order e.g. 
<dl class="dl--horizontal">
	<dt>Description lists</dt>
	<dd>A description list is perfect for defining terms.</dd>
	<dt>Euismod</dt>
	<dd>Vestibulum id ligula porta felis euismod semper eget lacinia odio sem nec elit.</dd>
	<dd>Donec id elit non mi porta gravida at eget metus.</dd>
	<dt>Malesuada porta</dt>
	<dd>Etiam porta sem malesuada magna mollis euismod.</dd>
	<dt>Felis euismod semper eget lacinia</dt>
	<dd>Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus.</dd>
</dl>
================================================================================ */
.dl--horizontal dt { float: left; width: 19%; overflow: hidden; clear: left; text-align: right; }
.dl--horizontal dd { margin-left: 21%; }

/* Basic styling for media elements e.g. <img>, <video>, <svg>, <augio>  @package terra_template @path Base/_Media.scss */
/* =============================================================================
$ Attachements & Images
	Contents: 1: Make Images & Attachements responsive
						2: Styling the alt="" Text on images
							 http://csswizardry.com/2011/06/styling-alt-text-on-images/
						3: Removes border when inside `a` element in IE6/7/8/9, FF3.
						4: Remove the gap between images and the bottom of their containers:
							 h5bp.com/i/440
						5: Improves image quality when scaled in IE7.
							 code.flickr.com/blog/2008/11/12/on-ui-quality-the-little-things-client-side-image-resizing/
						6: Decrease font-size on figcaption elements
================================================================================ */
embed, iframe, object, img { /* 1 */ max-width: 100%; }

img { font-style: italic; /* 2 */ border: 0; /* 3 */ vertical-align: middle; /* 4 */ }
img[height] { /* 1 */ height: auto; }

figure { /** Addresses margin not present in IE6/7/8/9, S5, O11. */ margin: 0; }

figcaption { /* 6 */ font-size: 14px; font-size: 0.875rem; }

/* =============================================================================
$ Video
================================================================================ */
/* =============================================================================
$ Audio
================================================================================ */
audio { min-width: 65%; }
audio:not([controls]) { /** Prevents modern browsers from displaying `audio` without controls. */ display: none; /** Remove excess height in iOS5 devices. */ height: 0; }

/* =============================================================================
$ SVG
================================================================================ */
svg:not(:root) { /** Corrects overflow displayed oddly in IE9. */ overflow: hidden; }

/* Basic styling and extended classes for tables  @package terra_template @path Base/_Tables.scss */
/* =============================================================================
$ Tables
================================================================================ */
table { max-width: 100%; border-collapse: collapse; border-spacing: 0; }

th { text-align: left; vertical-align: bottom; }

td { vertical-align: top; }

.table, .contenttable-1, .contenttable-2, .contenttable-3 { width: 100%; margin-top: 0; }
.table td, .contenttable-1 td, .contenttable-2 td, .contenttable-3 td, .table th, .contenttable-1 th, .contenttable-2 th, .contenttable-3 th { padding: 0.5em; }

/* =============================================================================
$ Table bordered
================================================================================ Extends the base '.table' class to an basic bordered table e.g. 
	<table class="table table--bordered">
		<thead>
			<tr>
				<th class="td-0">Name</th>
				<th>Age</th>
				<th>Residence</th>
			</tr>
		</thead>
		<tbody>
			<tr>
				<td class="td-0">Max Mustermann</td>
				<td>20</td>
				<td>Berlin</td>
			</tr>
			<tr>
				<td class="td-0">Max Mustermann</td>
				<td>20</td>
				<td>Berlin</td>
			</tr>
			<tr class="tr-last">
				<td class="td-0">Max Mustermann</td>
				<td>20</td>
				<td>Berlin</td>
			</tr>
		</tbody>
	</table>
================================================================================ */
.table--bordered, .contenttable-1 { border: 1px solid #cccccc; border-collapse: separate; }
.table--bordered td, .contenttable-1 td, .table--bordered th, .contenttable-1 th { border-left: 1px solid #cccccc; border-bottom: 1px solid #cccccc; }
.table--bordered .tr-last td, .contenttable-1 .tr-last td { border-bottom: 0; }
.table--bordered .td-0, .contenttable-1 .td-0 { border-left: 0; }

/* =============================================================================
$ Table striped
================================================================================ Extends the base '.table' class to an clean table with borders below each row e.g. 
	<table class="table table--striped">
		<thead>
			<tr>
				<th>Name</th>
				<th>Age</th>
				<th>Residence</th>
			</tr>
		</thead>
		<tbody>
			<tr>
				<td>Max Mustermann</td>
				<td>20</td>
				<td>Berlin</td>
			</tr>
			<tr>
				<td>Max Mustermann</td>
				<td>20</td>
				<td>Berlin</td>
			</tr>
			<tr>
				<td>Max Mustermann</td>
				<td>20</td>
				<td>Berlin</td>
			</tr>
		</tbody>
	</table>
================================================================================ */
.table--striped td, .contenttable-2 td, .contenttable-3 td, .table--striped th, .contenttable-2 th, .contenttable-3 th { border-bottom: 1px solid #cccccc; }
.table--striped th, .contenttable-2 th, .contenttable-3 th { padding-top: 0; }

/* =============================================================================
$ Table condensed
================================================================================ Extends the base '.table' class to an condensed table e.g. 
	<table class="table table--condensed">
		<thead>
			<tr>
				<th>Name</th>
				<th>Age</th>
				<th>Residence</th>
			</tr>
		</thead>
		<tbody>
			<tr>
				<td>Max Mustermann</td>
				<td>20</td>
				<td>Berlin</td>
			</tr>
			<tr>
				<td>Max Mustermann</td>
				<td>20</td>
				<td>Berlin</td>
			</tr>
			<tr>
				<td>Max Mustermann</td>
				<td>20</td>
				<td>Berlin</td>
			</tr>
		</tbody>
	</table>
================================================================================ */
.table--condensed td, .contenttable-3 td, .table--condensed th, .contenttable-3 th { padding: 0.25em 0.5em 0.25em; }

/* =============================================================================
$ Table zebra
================================================================================ Extends the base '.table' class to an 'zebra'-styled table with odd & even changing background-colors e.g. 
	<table class="table table--zebra">
		<thead>
			<tr>
				<th>Name</th>
				<th>Age</th>
				<th>Residence</th>
			</tr>
		</thead>
		<tbody>
			<tr class="tr-odd">
				<td>Max Mustermann</td>
				<td>20</td>
				<td>Berlin</td>
			</tr>
			<tr class="tr-even">
				<td>Max Mustermann</td>
				<td>20</td>
				<td>Berlin</td>
			</tr>
			<tr class="tr-odd">
				<td>Max Mustermann</td>
				<td>20</td>
				<td>Berlin</td>
			</tr>
		</tbody>
	</table>
================================================================================ */
.table--zebra .tr-even { background: #fff; }
.table--zebra .tr-odd { background: #f2f2f2; }

/* Basic styling for forms and inputs  @package terra_template @path Base/_Forms.scss */
/* =============================================================================
$ Text inputs, checkboxes and other form elements
================================================================================ */
/* ======================== Textinputs ========================= */
textarea, input[type="email"], input[type="number"], input[type="password"], input[type="search"], input[type="tel"], input[type="text"], input[type="url"], input[type="date"], input[type="datetime"], input[type="datetime-local"], input[type="month"], input[type="time"], input[type="week"] { height: 24px; padding: .2em .4em; margin-bottom: 12px; margin-bottom: 0.75rem; background: #fff; border: 1px solid #cccccc; border-radius: 1px; -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); font-size: 14px; font-size: 0.875rem; color: #475459; }

textarea { height: auto; /* Reset height since textareas have the attribute rows="" */ min-height: 72px; /* Set a min-height for textareas of 3 rows */ resize: vertical; /* So users cannot expand the textarea over its boundaries */ overflow: auto; /* Removes default vertical scrollbar in IE6/7/8/9. */ vertical-align: top; /* Improves readability and alignment in all browsers. */ }

input::-webkit-datetime-edit { /** A possible shadow-dom fix for webkit control spacing on input[type=time] */ margin-top: -.17em; margin-bottom: -.17em; }

/* ========================= Checkboxes ======================== */
input[type="checkbox"], input[type="radio"] { margin-right: .35em; cursor: pointer; }

/* =============================================================================
$ Buttons
================================================================================ */
.btn, button, input[type="button"], input[type="reset"], input[type="submit"] { cursor: pointer; margin-bottom: 12px; margin-bottom: 0.75rem; /** Set in em's so we can change the size of the button depending on the font-size */ padding: 0.5em 0.75em; border: 0; border-radius: 1px; background: #0097d7; font-size: 0.8em; /** Normalize the font-weight accross <input>, <button> and the .btn class */ font-weight: normal; line-height: 1; color: white; }

/* =============================================================================
$ Form elements
================================================================================ */
fieldset { /** Reset border, margin, and padding to define a consistend style accross all browsers */ border: 0; margin: 0; padding: 0; }

/* ==================== Labels and Legends ===================== */
label { display: block; font-weight: 700; font-size: 14px; font-size: 0.875rem; line-height: 1.71429; }
label[for] { cursor: pointer; }

legend { display: block; width: 100%; font-size: 20px; font-size: 1.25rem; color: #000; border-bottom: 1px solid #cccccc; padding: 0; }

/* =============================================================================
$ Form-Inline abstraction
================================================================================ Display a <form> and all it's content in a horizontal order e.g. 
	<form class="form--inline">
		<label>Username: </label>
		<input type="text" placeholder="Username...">
		<label>Password: </label>
		<input type="password" placeholder="Password...">
		<label class="label--checkbox">
			<input type="checkbox">Remember me
		</label>
		<button type="submit">Sign in</button>
	</form>
================================================================================ */
.form--inline label { margin-right: .3em; }
.form--inline .label--checkbox { margin-right: 1em; }
.form--inline .label--checkbox input { margin-right: .35em; }
.form--inline input { margin-right: 1em; }
.form--inline label, .form--inline button, .form--inline input, .form--inline select, .form--inline textarea { display: inline-block; margin-bottom: 0; vertical-align: middle; }

/* Basic button structural styling from inuit.css <https://github.com/csswizardry/inuit.css/>  @package terra_template @path Objects/_Buttons.scss @license Apache License, Version 2.0. @link http://csswizardry.com/2011/09/the-nav-abstraction/ */
/* =============================================================================
$ Button Object
================================================================================ Display an anchor tag as a button e.g. 
	<a class="btn">A Special link</a>
================================================================================ */
.btn { display: inline-block; }
.btn, .btn:hover { text-decoration: none; }

/* ================== Full width button abstraction ================= Set a button to the full-width of it's parent */
.btn--full { display: block; text-align: center; /** The following is so that this class works properly on inputs as well as anchor tags. */ padding-right: 0; padding-left: 0; width: 100%; }

/* A modified version of the navigation object from inuit.css <https://github.com/csswizardry/inuit.css/>  @package terra_template @path Objects/_Navigations.scss @license Apache License, Version 2.0. @link http://csswizardry.com/2011/09/the-nav-abstraction/ */
/* =============================================================================
$ Navigation Object
================================================================================ Throws a list into horizontal mode e.g.: 
	<ul class="nav">
			<li><a href="">Home</a></li>
			<li><a href="">About</a></li>
			<li><a href="">Products</a></li>
			<li><a href="">Contact</a></li>
	</ul>
================================================================================ */
.nav li { display: inline-block; }
.nav a { display: block; }

/* ======================= Stacked Navigation ======================= Throws a list into vertical mode */
.nav--stacked li { display: list-item; }

/* ========================= Fit Navigation ========================= Force a nav to occupy 100% of the available width of its parent. Thanks to @pimpl for this idea! */
.nav--fit { display: table; width: 100%; }
.nav--fit > li { display: table-cell; }

/* Grid object which makes use of the width classes in generic/_widths.scss  @package terra_template @path Objects/_Grid.scss */
/* =============================================================================
$ Grid Classes
================================================================================ A basic grid system which is dependent on the border-box layout mode e.g. 
	<div class="g">
		<div class="gi one-third"> </div>
		<div class="gi one-third"> </div>
		<div class="gi one-third"> </div>
	</div>
================================================================================ */
.g, .grid { margin-left: -10px; margin-right: -10px; }

.gi, .grid__item { float: left; padding-left: 10px; padding-right: 10px; }

.tx-powermail .powermail_legend { display: none; }
.tx-powermail .powermail_input { width: 200px; }
.tx-powermail .powermail_field.powermail_textarea { width: 400px; height: 200px; resize: none; }

/* =============================================================================
$ Mobile Menu
================================================================================ */
body.mm-opened { overflow: hidden; position: relative; }

.mm-menu { background: #fdfdfd; color: #336633; display: none; position: fixed; height: 100%; width: 250px; left: 0; top: 0; z-index: 0; overflow-x: none; overflow-y: auto; border-right: 1px solid #EDEDED; }

.mm-page { background: #fff; overflow-x: hidden; }

body.mm-opened .mm-page { position: fixed; }

.mm-slideout { -webkit-transition: -webkit-transform 0.4s ease; -ms-transition: -ms-transform 0.4s ease; transition: transform 0.4s ease; }

body.mm-opened .mm-slideout { -webkit-transform: translate(250px, 0); -moz-transform: translate(250px, 0); -ms-transform: translate(250px, 0); -o-transform: translate(250px, 0); transform: translate(250px, 0); }

#mm-blocker { background: rgba(3, 2, 1, 0); display: none; width: 100%; height: 100%; position: fixed; top: 0; left: 0; z-index: 999999; }

body.mm-opened #mm-blocker { display: block; }

.mm-menu.mm-current { display: block; }

/* =============================================================================
$ Toogle Mobile Menü
================================================================================ */
.toggle-icon { display: none; }
@media screen and (max-width: 500px) { .toggle-icon { display: inline-block; padding: 3px 4px; } }

.toggle-mobile-menu { display: none; width: 31px; height: 27px; background: url('vhs-assets-css-23d54a271330cc0c210a514bc8fde595.png') no-repeat left top; z-index: 99; text-indent: -999em; }
@media screen and (max-width: 960px) { .toggle-mobile-menu { display: block; } }
@media screen and (max-width: 960px) { .toggle-mobile-menu { display: block; } }
@media only screen and (max-device-width: 1024px) and (orientation: landscape) { .toggle-mobile-menu { display: block; } }

#mobile-menu .home-link { border-top: #EDEDED 1px solid; display: block; padding: 10px 13px 10px 40px; color: #336633; font-size: 14px; font-size: 0.875rem; font-weight: 700; }

#mobile-menu .main-nav ul { border-bottom: #EDEDED 1px solid; }
#mobile-menu .main-nav ul li { display: block; border-top: #EDEDED 1px solid; position: relative; padding: 0; }
#mobile-menu .main-nav ul li a { color: #336633; font-size: 14px; font-size: 0.875rem; padding: 10px 13px 10px 40px; font-weight: 700; }
#mobile-menu .main-nav ul .lvl-1 { font-size: 12px; font-size: 0.75rem; text-transform: none; border: none; padding-bottom: 10px; }
#mobile-menu .main-nav ul .lvl-1 li { border: none; }
#mobile-menu .main-nav ul .lvl-1 li a { padding: 5px 13px 5px 40px; font-weight: 400; }
#mobile-menu .main-nav ul .lvl-1 li ul li ul { display: none; }
#mobile-menu .main-nav ul.terra-products { border-bottom: none; }
#mobile-menu .main-nav ul.terra-products li ul { border-bottom: none; }
#mobile-menu .main-nav ul.terra-products li ul li a { padding: 5px 13px 5px 10px; font-size: 13px; font-size: 0.8125rem; }
#mobile-menu .main-nav ul.terra-products li ul li ul.level0 li.level1 a { font-size: 13px; font-size: 0.8125rem; padding: 5px 13px 5px 10px; font-style: italic; }

#mobile-menu span.plus { display: inline-block; position: absolute; color: #336633; right: 0; top: 4px; font-size: 1.3em; padding: 0 10px; cursor: pointer; }

#mobile-menu .main-nav #elem_2 a { background-position: 0 -254px; }
#mobile-menu .main-nav #elem_3 a { background-position: -2px -53px; }
#mobile-menu .main-nav #elem_4 a { background-position: 0 -153px; }
#mobile-menu .main-nav #elem_5 a { background-position: 0 -203px; }

#mobile-menu .meta-nav ul { padding: 25px 0; border-bottom: #EDEDED 1px solid; }
#mobile-menu .meta-nav ul li { display: block; padding: 5px 13px; }
#mobile-menu .meta-nav ul li a { color: #336633; font-size: 14px; font-size: 0.875rem; }

/* Site dependent styles  @package terra_template @path /_Styles.scss */
/* =============================================================================
$ High level wrapper and elements
================================================================================ */
body { padding: 0; margin: 0; font-family: 'Lato', sans-serif; font-weight: 400; }

h1, h2, h3, h4 { font-size: 1.2em; color: #728C2F; font-weight: 400; letter-spacing: 0.02em; }

.cms-index-defaultindex h1 { font-weight: 700; }

.cms-index-defaultindex h2 { font-size: 0.9em; color: #666; font-weight: bold; }

.cms-index-defaultindex .faq_questionview h2 { font-size: 12px; color: #728c2f; font-weight: normal; }

.cms-index-defaultindex .article h1 { font-weight: normal; }

.cms-index-defaultindex .article h2 { font-size: 19px; font-weight: normal; }

.cms-index-defaultindex.page-384 h2 { color: #728c2f; font-size: 19px; font-weight: normal; }

.site-search { width: 100%; height: 60px; }

@media screen and (max-width: 1024px) { .site-search { position: absolute; top: -35px; } }
.mobile-site-logo { display: none; }

.mobile-only { display: none; }

@media screen and (max-width: 500px) { .mobile-only { display: block; }
  header { position: relative; }
  header .header-wrapper { height: auto; overflow: hidden; position: static; }
  header .top_header ul.subnav { display: inline-block; width: auto; float: right; }
  header .top_header ul.subnav > li.last { position: relative; float: right; right: 0; }
  header .top_header ul.subnav > li.last > ul { right: -9px; }
  header ul.middle_header { padding: 0; height: auto; }
  header ul.middle_header > li { width: 100%; }
  header ul.middle_header > li:first-child { display: none; }
  header .site-logo { top: 69px; height: 82px; width: 144px; border: none; background-size: contain; left: 0; }
  header .site-search { position: relative; top: 0; left: 0; height: auto; background-color: #9BBF3A; }
  header .site-search ul { margin: 0; padding: 0; }
  header .site-search ul li { width: 100%; }
  header .site-search ul li form { margin: 0; display: inline-block; width: 100%; }
  header .site-search #search_mini_form .form-search { width: 100%; margin: 0; }
  header .site-search #search_mini_form .form-search div { position: relative; }
  header .site-search #search_mini_form .form-search div input { width: 100%; margin: 0; }
  header .site-search #search_mini_form .form-search div button { position: absolute; right: 0; margin: 0; }
  a .contact-btn { top: 70px; }
  body .site-content { margin-top: 30px; }
  .header-wrapper div#site-menus { min-height: 80px; } }
.site-content, .site-footer { width: 100%; margin: 0 auto; margin-top: 50px; }

.site-content { margin-top: 62px; }

.page-52 .site-content, .page-53 .site-content, .page-12 .site-content { margin-top: 50px; }

.page-1 .site-content, .page-28 .site-content, .page-30 .site-content { margin-top: 32px; }

.site-header { width: 100%; height: 173px; }

.top_header { height: 34px; width: 100%; background-color: #827458; }

.site-logo { width: 259px; height: 147px; background: url('vhs-assets-css-63b2f7fe5463aebaec3ddf942066eafb.jpg') no-repeat; position: absolute; right: 35px; top: 0; z-index: 5; border-bottom: 1px solid #EDEDED; }

.sidebar { float: left; min-height: 200px; }

.header-wrapper { max-width: 1200px; margin: 0 auto; height: 126px; position: relative; }

.slider { width: 1200px; margin: auto; }
.slider .csc-default { padding-top: 0; }
.slider .grid img { width: 100% !important; height: auto !important; }
.slider .grid .one-half:first-child, .slider .grid .two-quarters:first-child, .slider .grid .three-sixths:first-child, .slider .grid .four-eighths:first-child, .slider .grid .five-tenths:first-child, .slider .grid .six-twelfths:first-child { padding-right: 0; }
.slider .grid .one-half:last-child, .slider .grid .two-quarters:last-child, .slider .grid .three-sixths:last-child, .slider .grid .four-eighths:last-child, .slider .grid .five-tenths:last-child, .slider .grid .six-twelfths:last-child { padding-left: 0; }
.slider #c458, .slider #c459 { display: block !important; }

.site-content { min-height: 900px !important; }

.nav-container { width: 215px; }

a { color: #8CAA3A; }

/* =============================================================================
$ KONTAKT-NAVIGATION
================================================================================ */
.contact-btn { position: fixed; top: 34px; right: 0; width: 35px; height: 80px; background-color: #9BBF3A; border-radius: 2px 0px 0px 2px; z-index: 10; }
.contact-btn > div { position: absolute; width: 100%; left: 0; top: 50%; padding: 8px; transform: translateY(-50%); }
.contact-btn img { margin-left: auto; margin-right: auto; }
.contact-btn span { display: none; -webkit-transform: rotate(90deg); -ms-transform: rotate(90deg); transform: rotate(90deg); color: white; text-transform: uppercase; font-size: 13px; }
@media screen and (min-width: 750px) { .contact-btn { height: 146px; }
  .contact-btn > div { height: 125px; }
  .contact-btn img { margin-bottom: 15px; }
  .contact-btn span { display: block; } }

/* =============================================================================
$ HAUPTNAVIGATION
================================================================================ */
div#site-menus { position: relative; z-index: 3; width: 100%; background-color: #9BBF3A; min-height: 65px; }

div#site-menus ul { position: relative; padding: 5px 0 0 7px; list-style-type: none; width: 57%; }

div#site-menus ul.site-menu-first { width: auto; float: left; margin: 0; z-index: 9999; }

div#site-menus ul.site-menu-first li a:hover { color: #336633; }

div#site-menus ul li { display: inline-block; width: auto; margin: 0 0 6px 0; }

div#site-menus ul li a { text-decoration: none; color: #fff; font-family: 'Lato', sans-serif; font-size: 15px; padding: 2px 10px; font-weight: bold; border-right: 1px solid #fff; }

div#site-menus ul li a:hover, div#site-menus ul li.active a { color: #336633; }

div#site-menus ul li ul { font-size: 0.7em; width: 220px; display: none; position: absolute; background-color: #9bbf3a; margin: 0 0 0 -7px; padding: 3px 7px; }

div#site-menus ul li ul li { width: 220px; position: relative; z-index: 99999; }

div#site-menus ul li ul li a { border-right: 0; color: #fff; }

div#site-menus ul li.active ul li a { color: #fff; }

div#site-menus ul li.active ul li a:hover, div#site-menus ul li ul li.active a { color: #336633; }

div#site-menus ul li:hover ul { display: block; }

.mobile-only div#site-menus { padding: 5px 10px 10px 5px; }

.mobile-only div#site-menus ul { width: 100%; display: block !important; }

.mobile-only div#site-menus ul li a { font-size: 12px; }

.mobile-only div#site-menus ul li ul { display: none !important; }

/* =============================================================================
$ SUBNAVIGATION
================================================================================ */
ul.subnav { width: 100%; margin: 0; padding: 0; position: relative; z-index: 9999; }

ul.subnav li { display: inline-block; margin: 5px 75px 0 0; font-size: 13px; color: #fff; }

ul.subnav li.fontawesome i { margin: 0 5px 0 0; position: relative; }

ul.subnav li.last { position: absolute; margin: 0; width: 260px; right: 34px; }

ul.subnav li ul.links { padding: 0; }

ul.subnav li ul.links li { background: #9bbf3a; margin: 0; }

ul.subnav li ul.links li.first { width: 129px; }

ul.subnav li ul.links li.last { right: 1px; width: 128px; }

ul.subnav li ul.links li a { color: #fff; display: block; padding: 8px 0; text-align: center; }

ul.subnav li ul.links li a.top-link-cart-empty { height: 45px; left: -100px; position: absolute; top: 49px; width: 40px; z-index: 9999; background: url('vhs-assets-css-efdd01ce8d844d3d1c92856fab1b3522.png') no-repeat; }

ul.subnav li ul.links li a.top-link-cart-filled { font-size: 15px; text-align: center; height: 45px; left: -100px; position: absolute; top: 49px; width: 40px; z-index: 9999; background: url('vhs-assets-css-843fd7b010b0596a6acc3169c476dd8f.png') no-repeat; color: #827458; font-weight: bold; padding: 6px 7px 0 0; }

.fa-sign-in, .fa-shopping-cart { font-size: 1.2em; }

.fa-search { font-size: 1.1em; }

@media screen and (max-width: 1200px) { ul.subnav { margin: 0 0 0 10px; }
  ul.subnav li { margin: 4px 20px 0 0; }
  ul.subnav li.last { right: 44px; } }
@media screen and (max-width: 1024px) { ul.subnav li.fontawesome { display: none; } }
@media screen and (max-width: 750px) { ul.subnav li.last { width: 150px; right: 36px; }
  ul.subnav li ul.links { float: right; padding: 0; position: relative; right: 0; width: 100%; }
  ul.subnav li ul.links li { width: 45px !important; margin: 0 3px 0 0; overflow: hidden; height: 35px; }
  ul.subnav li ul.links li.first { float: left; }
  ul.subnav li ul.links li.last { float: none; right: auto; }
  ul.subnav li ul.links li a.top-link-cart-empty, ul.subnav li ul.links li a.top-link-cart-filled { position: relative; background: none; height: auto; left: auto; top: auto; width: auto; color: #ffffff; } }
/* =============================================================================
$ MIDDLE HEADER
================================================================================ */
ul.middle_header { width: 100%; height: 74px; margin: 0; }

ul.middle_header li { display: inline-block; }

ul.middle_header li.phone { color: #827458; font-size: 13px; font-weight: bold; margin: 0 0 0 70px; width: 130px; }

ul.middle_header li.phone span { font-size: 16px; }

ul.middle_header li.phone:before { content: "\f095"; display: inline-block; font: normal normal normal 34px/1 FontAwesome; text-rendering: auto; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; position: absolute; font-size: 32px !important; margin: 5px 0 0 -33px; }

.ecomi_header { /*background: image-url('ecomi_header_silver.jpg');*/ height: 56px; width: 56px; position: relative; top: 10px; }
.ecomi_header img { height: 56px !important; width: 56px !important; position: absolute; }

@media screen and (max-width: 620px) { ul.middle_header li.phone { display: none; } }
@media screen and (max-width: 430px) { .ecomi_header { display: none; } }
/* =============================================================================
$ CONTENT NAVIGATION (PFLANZENDOKTOR)
================================================================================ */
ul#nav { width: 100%; padding-left: 15px; padding-top: 0; font-size: 1.3em; }

ul#nav li { text-decoration: none; list-style-type: none; }

ul#nav li a { color: #666666; text-decoration: none; border-bottom: 1px solid #ededed; display: block; width: 100%; font-size: 0.8em; line-height: 1.7em; }

ul#nav li a.act { color: #728C2F; }

ul#nav li a:hover, ul.vertnavi li a:active { color: #728C2F; }

ul#nav li ul { text-indent: 15px; padding-left: 8px; margin: 6px 0 10px; }

ul#nav li ul li { background-position: 0 7px; font-size: 1.1em; }

ul#nav li ul li:hover { background-position: 0 7px; }

ul#nav li ul { display: none; padding: 0; font-size: 0.7em; width: 200px; }

ul#nav li:hover ul { display: none; }

ul#nav li.active a.level-top { color: #728C2F; }

ul#nav li.active > ul { display: block; }

/* =============================================================================
$ STARTSEITEN-TABS
================================================================================ */
nav ul { padding: 0; margin: 0; }

nav ul:after { clear: both; content: " "; display: block; font-size: 0; height: 0; visibility: hidden; }

nav ul li { list-style: none; float: left; }

nav ul li a { text-decoration: none; display: block; padding: 14px 34px 14px 34px; -webkit-transition: background 0.3s ease-out 0s; -moz-transition: background 0.3s ease-out 0s; -o-transition: background 0.3s ease-out 0s; transition: background 0.3s ease-out 0s; }

nav ul li:hover ul.site-nav.lvl-1 { display: block; }

nav ul li ul { position: absolute; padding: 0; font-size: 0.7em; width: 200px; display: none; }

nav ul li ul li { width: 200px; float: left; }

nav ul li ul li a:hover { color: #333; }

nav ul li:hover a, nav ul li:hover > ul li a { background-color: transparent; }

nav .site-nav .lvl-1 { background-color: #8FAE3A; }

nav ul li ul li a { text-shadow: none; font-style: normal; }

nav ul li ul li a:hover { color: #333; background-color: #FAFAFA !important; }

a.hasDropdown { height: 50px; }

.page-27 .sidebar, .page-28 .sidebar, .page-30 .sidebar { min-height: 0; }

/* =============================================================================
$ Footer
================================================================================ */
i.fa { font-size: 16px; line-height: 1.5em; }

.site-footer { width: 100%; background: url('vhs-assets-css-e2cdd4721cc5050c37a3e390431d811c.png'); }

.footer-wrapper { background: url('vhs-assets-css-fae9bf7f7bb37a5c24a082e9d1ee8164.png') repeat-y; max-width: 1200px; margin: 0 auto; }

.clear { clear: both; }

.site-footer { background-color: #f6d8d0; margin: 80px 0 0 0; }
.site-footer .footer-wrapper .footerMega { margin: 0 0 20px 0; font-size: 14px; font-weight: 400; color: #336633; }
.site-footer .footer-wrapper .footerMega .footer-header { font-weight: 700; font-size: 14px; color: #336633; margin: 20px 0 0 0; }
.site-footer .footer-wrapper .footerMega a { font-size: 14px; color: #336633; }
.site-footer .footer-wrapper .footerMega a:hover, .site-footer .footer-wrapper .footerMega a.active { color: #254525; text-decoration: none; }
.site-footer .footer-wrapper .footerMega ul.footer-nav { font-size: 14px; padding: 0; }
.site-footer .footer-wrapper .footerMega ul.footer-nav li { border: none; padding: 0; color: #336633; }
.site-footer .footer-wrapper .footerMega ul.footer-nav li a { font-size: 14px; color: #336633; }
.site-footer .footer-wrapper .footerMega ul.footer-nav li a:hover, .site-footer .footer-wrapper .footerMega ul.footer-nav li a.active { color: #254525; text-decoration: none; }

/* =============================================================================
$ SHOP Tabelle
================================================================================ */
td { font-size: 0.9em; }

table { margin-top: 0em; }

td.td1left { background-color: #EFFFEF; border-right: 1px dashed #CCCCCC; padding: 2px 10px; vertical-align: top; }

td.td1 { background-color: #EFFFEF; padding: 2px 10px; vertical-align: top; }

td.td2left { background-color: #FFFFFF; border-right: 1px dashed #CCCCCC; padding: 2px 10px; vertical-align: top; }

td.td2 { background-color: #ffffff; vertical-align: top; padding: 2px 10px; }

/* =============================================================================
$ SHOP
================================================================================ */
span.tax-details, p.delivery-time { font-size: 0.6em; text-align: right; padding-right: 22px; margin-left: 34px; margin-top: -4px; }

.products-grid .product-name a { color: #666666; }

.product-essential { background: none !important; }

.product-view { margin-bottom: 20px; }

.account-login .content h2, .page-title h1, .page-title h2 { color: #728C2F; }

.csc-default { padding-top: 10px; }

.csc-frame.csc-frame-frame1 ul { list-style: outside disc; margin: 0; padding: 0 0 15px 15px; }
.csc-frame.csc-frame-frame1 ul li { font-size: 14px; color: #666666; font-weight: 200; line-height: 1.6em; font-family: 'Lato', sans-serif; }

.csc-frame.csc-frame-frame1 ol { list-style: outside decimal; margin: 0; padding: 0 0 15px 15px; }
.csc-frame.csc-frame-frame1 ol li { font-size: 14px; color: #666666; font-weight: 200; line-height: 1.6em; font-family: 'Lato', sans-serif; }

p.bodytext { font-size: 14px; color: #666666; font-weight: 400; line-height: 1.6em; font-family: 'Lato', sans-serif; margin-bottom: 1em; }

.csc-firstHeader { padding-top: 3px; }

div.category-products ul.products-grid { padding-left: 0; }

.pager, .sorter { background-image: none; }

ul.single-level { height: 40px; border-bottom: 1px solid #cccccc; margin: 0 0 30px 0; }

ul.single-level li a { padding: 8px 34px; color: #cccccc; }

ul.single-level li a:hover, ul.single-level li a.active, ul.single-level li a:active, .page-1 ul.single-level li.first a { border-top: 1px solid #cccccc; border-right: 1px solid #cccccc; border-left: 1px solid #cccccc; border-bottom: 1px solid #FFFFFF; text-decoration: none; background-color: #FFFFFF; padding: 7px 33px; color: #728C2F; }

/*#eKomiSeal_default { margin: 15px 0 0 0;
}*/
.plant_doctor_help_articles nav .csc-sitemap ul li { float: none; }

.checkout-cart-index .sidebar .level0, .customer-account-login .sidebar .level0, .customer-account-create .sidebar .level0, .customer-account-forgotpassword .sidebar .level0, .customer-account-index .sidebar .level0, .checkout-cart-index .sidebar .level0, .newsletter-manage-index .sidebar .level0, .customer-account-edit .sidebar .level0, .customer-address-form .sidebar .level0, .customer-account-logoutsuccess .sidebar .level0, .catalogsearch-result-index .sidebar .level0, .catalog-category-view.page-3 .sidebar .level0, .catalog-product-view .sidebar .level0, .checkout-onepage-index .sidebar .level0, .checkout-onepage-success .sidebar .level0, .customer-account-resetpassword .sidebar .level0, .sales-order-history .sidebar .level0, .sales-order-view .sidebar .level0, .cms-index-noroute .sidebar .level0, .catalogsearch-advanced-index .sidebar .level0, .catalogsearch-advanced-result .sidebar .level0, .cms-liefer-versandkosten .sidebar .level0, .cms-liefer-versandkosten .sidebar .level0, .customer-account-changeforgotten .sidebar .level0, .customer-address-index .sidebar .level0, .customer-address-form .sidebar .level0 { display: none; }

.catalog-category-view.page-3 .sidebar .level0.active { display: block; }

.catalog-category-view.page-3 .sidebar .level0.active a.level-top { color: #5d5d5d; font-family: "Lato",sans-serif; font-size: 14px; font-weight: 700; padding: 0 0 7px; margin: 0 0 10px 16px; }

ul.ul-container-terramainnav { margin: 0; padding: 0; width: 100%; }

.catalog-category-view.page-3 .sidebar ul.level0 { border: 1px solid #dddddd; height: 95px; margin: 8px 0 10px 16px; overflow: auto; display: block !important; padding: 3px 0 0 3px; font-weight: 200; }

.catalog-category-view.page-3 .sidebar li.level1 { padding: 0 0 5px 5px; line-height: 1em; }

.catalog-category-view.page-3 .sidebar li.level1.first { padding: 5px 0 5px 5px; }

.catalog-category-view.page-3 .sidebar .level1 a { color: #728c2f; font-size: 14px; border: 0; }

.catalog-category-view.page-3 .sidebar .level1.active a { font-weight: bold; }

/* =============================================================================
$ Breadcrumbs
================================================================================ */
/* BreadCrumbs TYPO3 */
.breadcrumb:before { color: #000; content: "Aktuelle Seite: "; float: left; font-size: 11px; font-weight: 700; margin: 0 7px 0 0; display: none; }

.breadcrumb { margin: 28px 0 10px 17px; overflow: hidden; width: 800px; position: absolute; }

.breadcrumb .nav a { display: inline; }

.breadcrumb li { float: left; font-size: 11px; margin: 0 5px 0 0; }

.breadcrumb li:after { color: #3C474B; content: "/"; font-size: 11px; margin: 0 1px 0 3px; }

.breadcrumb li.last a { color: #3C474B; font-weight: bold; }

.breadcrumb li.last a:hover { text-decoration: none; cursor: default; }

.breadcrumb li.last:after { content: ""; }

/* BreadCrumbs MAGENTO */
.page-3 .breadcrumb { display: none; }

.breadcrumbs:before { color: #000; content: "Aktuelle Seite: "; float: left; font-size: 11px; font-weight: 700; margin: 0 7px 0 0; display: none; }

.breadcrumbs { margin: -34px 0 10px 2px; overflow: hidden; width: 800px; position: absolute; }

.breadcrumbs ul { margin: 0; padding: 0; }

.breadcrumbs li { float: left; font-size: 11px; margin: 0 5px 0 0; }

.breadcrumbs span { padding: 0 1px 0 3px; }

/* =============================================================================
$ Product-Tabs
================================================================================ */
.tabs_menu { display: none; }

.catalog-product-view .tabs_menu, .page-11 .tabs_menu { display: block; width: auto; }

.page-11 .tabs_menu { width: 100%; }

/* =============================================================================
$ Pflandendoktor
================================================================================ */
.faq_questionview { width: 100%; background-color: #FAFAFA; border-top: 1px solid #E6E6E6; border-bottom: 1px solid #E6E6E6; padding: 10px 10px 10px 10px; margin: 0; min-height: 40px; margin-bottom: 10px; font-size: 12px; font-weight: 700; font-family: 'Lato', sans-serif; }
.faq_questionview h2 { line-height: 1.33333; }

.h1_tabs { color: #cccccc; font-size: 17px; line-height: normal; padding: 5px 0 0 0; margin: 0; }

.current .h1_tabs { color: #6a6a6a; font-size: 17px; line-height: normal; padding: 5px 0 0 0; margin: 0; }

.h3_tabs { color: #cccccc; font-size: 17px; line-height: normal; padding: 5px 0 0 0; margin: 0; }

.current .h3_tabs { color: #6a6a6a; font-size: 17px; line-height: normal; padding: 5px 0 0 0; margin: 0; }

.answerlist { width: 100%; padding: 0 10px 30px 20px; margin: 0; font-family: 'Lato', sans-serif; font-size: 14px; font-weight: 400; }

.questionview_date { color: #B5B5B5; font-size: 11px; font-weight: 400; }

.faq_product_viewall { display: none; }

.faq-cat-viewall { display: none; }

.faq_historybutton { font-family: Arial, Helvetica, sans-serif; font-size: 14px; color: #ffffff; padding: 10px 20px; background: -moz-linear-gradient(top, #99C13A 0%, #8DA93A); background: -webkit-gradient(linear, left top, left bottom, from(#99C13A), to(#8DA93A)); -moz-border-radius: 8px; -webkit-border-radius: 8px; border-radius: 8px; border: 1px solid #728C2F; -moz-box-shadow: 0 1px 3px transparent, inset 0 0 1px rgba(255, 255, 255, 0); -webkit-box-shadow: 0 1px 3px transparent, inset 0 0 1px rgba(255, 255, 255, 0); box-shadow: 0 1px 3px transparent, inset 0 0 1px rgba(255, 255, 255, 0); text-shadow: 0 -1px 0 transparent, 0 1px 0 rgba(255, 255, 255, 0); }
.faq_historybutton a { color: #fff; }

.faq_headline { color: #728c2f; font-size: 1.2em; font-weight: 400; letter-spacing: 0.02em; margin-bottom: 5px; }

.page-navigation h1 { color: #666666; font-family: "Lato",sans-serif; font-size: 14px; font-weight: 200; line-height: 1.6em; margin-bottom: 1em; max-width: 500px; float: left; }

.faq-f3-widget-paginator { position: relative; font-size: 15px; font-family: "Lato",sans-serif; font-weight: 100; float: left; margin: 0; padding: 0; color: #728C2F; }

.faq-f3-widget-paginator li { position: relative; border: 1px solid #E6E6E6; text-align: center; height: 29px; background-color: #FAFAFA; margin: 0 10px 0 0; float: left; padding: 3px 10px 0 10px; }

.faq-f3-widget-paginator li.current { font-weight: 700; }

.faq-f3-widget-paginator li.current a { padding: 0 8px 0 9px; }

.faq-f3-widget-paginator li.next { border: 1px solid #D8EAF3; }

.faq-f3-widget-paginator li.next a { padding: 0; }

.faq-f3-widget-paginator li.previous a { padding: 0 8px 0 9px; }

.tx-exinitfaqshopfusion h3 { line-height: 1.333; font-size: 15px; }

.supportarticles .csc-sitemap li { float: none; }

.tx-exinitfaqshopfusion #nav .active { color: #728c2f; }

.tx-exinitfaqshopfusion #nav ul li ul li .active a { color: #728c2f; }

/* DISABLED CS139 PRODUCT-FILTER WRAPPER FOR ADITIONAL SHOP-SITES */
.cms-home #c139, .catalog-product-view #c139, .checkout-cart-index #c139, .customer-account-login #c139, .customer-account-index #c139, .newsletter-manage-index #c139, .customer-account-edit #c139, .customer-address-form #c139, .customer-account-changeforgotten #c139, .customer-address-index #c139, .customer-address-form #c139 { display: none; }

.catalog-category-view #c104 { padding: 0; }

a, a:link, a:active, a:focus { outline: none; }

/* AGB POPUP WHITE SITE // TEXT ONLY */
.page-234 .site-header, .page-234 .breadcrumb, .page-234 .site-footer { display: none; }

.page-234 .site-content, .page-234 .site-wrapper { margin: 0; width: auto; }

.catalog-product-view #c341, .checkout-onepage-index #c341, .checkout-onepage-success #c341, .customer-account-changeforgotten #c341, .customer-address-index #c341, .customer-address-form #c341 { display: none; }

/* Telephone-Image Sidebar */
.customer-account-login #c458, .customer-account-create #c458, .customer-account-forgotpassword #c458, .customer-account-index #c458, .newsletter-manage-index #c458, .customer-account-edit #c458, .customer-address-form #c458, .customer-account-logoutsuccess #c458, .catalogsearch-result-index #c458, .customer-account-resetpassword #c458, .sales-order-history #c458, .sales-order-view #c458, .cms-index-noroute #c458, .catalogsearch-advanced-index #c458, .catalogsearch-advanced-result #c458, .cms-liefer-versandkosten #c458, .catalog-category-view #c458, .customer-account-changeforgotten #c458, .customer-address-index #c458, .customer-address-form #c458 { display: none; }

/* eKomi-Image Sidebar */
.customer-account-login #c459, .customer-account-create #c459, .customer-account-forgotpassword #c459, .customer-account-index #c459, .newsletter-manage-index #c459, .customer-account-edit #c459, .customer-address-form #c459, .customer-account-logoutsuccess #c459, .catalogsearch-result-index #c459, .customer-account-resetpassword #c459, .sales-order-history #c459, .sales-order-view #c459, .cms-index-noroute #c459, .catalogsearch-advanced-index #c459, .catalogsearch-advanced-result #c459, .cms-liefer-versandkosten #c459, .catalog-category-view #c459, .customer-account-changeforgotten #c459, .customer-address-index #c459, .customer-address-form #c459 { display: none; }

/* Meisterbetrieb-Image Sidebar */
.customer-account-login #c492, .customer-account-create #c492, .customer-account-forgotpassword #c492, .customer-account-index #c492, .newsletter-manage-index #c492, .customer-account-edit #c492, .customer-address-form #c492, .customer-account-logoutsuccess #c492, .catalogsearch-result-index #c492, .customer-account-resetpassword #c492, .sales-order-history #c492, .sales-order-view #c492, .cms-index-noroute #c492, .catalogsearch-advanced-index #c492, .catalogsearch-advanced-result #c492, .cms-liefer-versandkosten #c492, .catalog-category-view #c492, .customer-address-index #c492, .customer-account-changeforgotten #c492, .customer-address-form #c492 { display: none; }

/* Baumschulen-Image Sidebar */
.customer-account-login #c493, .customer-account-create #c493, .customer-account-forgotpassword #c493, .customer-account-index #c493, .newsletter-manage-index #c493, .customer-account-edit #c493, .customer-address-form #c493, .customer-account-logoutsuccess #c493, .catalogsearch-result-index #c493, .customer-account-resetpassword #c493, .sales-order-history #c493, .sales-order-view #c493, .cms-index-noroute #c493, .catalogsearch-advanced-index #c493, .catalogsearch-advanced-result #c493, .cms-liefer-versandkosten #c493, .catalog-category-view #c493, .customer-account-changeforgotten #c493, .customer-address-index #c493, .customer-address-form #c493 { display: none; }

/* Versandkosten-Box Sidebar */
.customer-account-login #c517, .customer-account-create #c517, .customer-account-forgotpassword #c517, .customer-account-index #c517, .newsletter-manage-index #c517, .customer-account-edit #c517, .customer-address-form #c517, .customer-account-logoutsuccess #c517, .catalogsearch-result-index #c517, .customer-account-resetpassword #c517, .sales-order-history #c517, .sales-order-view #c517, .cms-index-noroute #c517, .catalogsearch-advanced-index #c517, .catalogsearch-advanced-result #c517, .cms-liefer-versandkosten #c517, .catalog-category-view #c517, .customer-account-changeforgotten #c517, .customer-address-index #c517, .customer-address-form #c517 { display: none; }

/* Kurzerklärung Sidebar */
.customer-account-login #c518, .customer-account-create #c518, .customer-account-forgotpassword #c518, .customer-account-index #c518, .newsletter-manage-index #c518, .customer-account-edit #c518, .customer-address-form #c518, .customer-account-logoutsuccess #c518, .catalogsearch-result-index #c518, .customer-account-resetpassword #c518, .sales-order-history #c518, .sales-order-view #c518, .cms-index-noroute #c518, .catalogsearch-advanced-index #c518, .catalogsearch-advanced-result #c518, .cms-liefer-versandkosten #c518, .catalog-category-view #c518, .checkout-cart-index #c518, .checkout-onepage-index #c518, .customer-account-changeforgotten #c518, .customer-address-index #c518, .customer-address-form #c518 { display: none; }

#shopping-cart-table a embed, #shopping-cart-table a iframe, #shopping-cart-table a object, #shopping-cart-table a img { max-width: none; }

/* =============================================================================
$ Cookie-Police-Bar
================================================================================ */
#cookiePolicyBar { z-index: 1000; }
#cookiePolicyBar p { max-width: 630px; margin: auto; padding: 10px 0; display: inline-block; }
#cookiePolicyBar .close { position: relative; top: -8px; }

@media screen and (max-width: 750px) { #cookiePolicyBar p { padding: 10px 20px; }
  #cookiePolicyBar .close { position: relative; top: auto; margin: 0 0 10px 0; } }
/* =============================================================================
$ Teaser-FCE
================================================================================ */
.terra_teaser { width: 600px; height: 250px; display: inline-block; }

/* =============================================================================
$ RESPONSIVE
================================================================================ */
.site-header .reView:before { background-color: #9bbf3a; color: #fff; content: "Zur Mobilansicht wechseln"; font-size: 16px; padding: 6px 0 5px; position: absolute; text-align: center; top: 387px; width: 280px; z-index: 1; display: none; }

.site-footer .reView:before { color: #336633; content: "Zur Mobilansicht wechseln"; display: block; font-size: 14px; font-weight: bold; margin: 10px 0 0 0; text-decoration: underline; }

.page-1 .site-header .reView:before { display: block; }

@media screen and (max-width: 960px) { body { overflow: hidden; }
  .site-wrapper { padding: 0 10px; }
  .sidebar, .slider, #site-menus ul { display: none; }
  /*.site-logo { top: 38px; background: image-url('terra-logo-mobil.png'); width: 190px; height: 114px; }*/
  .site-content { margin-top: 100px; }
  .page-52 .site-content, .page-53 .site-content, .page-12 .site-content { margin-top: 100px; }
  .page-1 .site-content, .page-28 .site-content, .page-30 .site-content { margin-top: 50px; }
  ul.single-level { height: auto; border: 0; }
  ul.single-level li { float: none; border-top: 1px solid #cccccc; }
  ul.single-level li a.active { border: none; }
  ul.single-level li .last { margin: 0 0 30px 0; border-bottom: 1px solid #cccccc; }
  ul.single-level li a:hover, ul.single-level li a.active, ul.single-level li a:active, .page-1 ul.single-level li.first a { border: none; padding: 8px 34px; }
  .site-footer .footer-wrapper .footerMega ul.footer-nav li { margin: 0 0 10px 0; }
  .catalog-product-view .tabs_menu, .page-11 .tabs_menu { width: 100%; }
  .breadcrumbs { width: auto; } }
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) { #site-menus { display: none; } }
@media (max-width: 1200px) { .slider .one-half, .slider .two-quarters, .slider .three-sixths, .slider .four-eighths, .slider .five-tenths, .slider .six-twelfths { width: 100% !important; } }
@media (max-width: 1279px) { .site-header .reView:before { background-color: #9bbf3a; color: #fff; content: "Zur Desktopansicht wechseln"; font-size: 16px; padding: 6px 0 5px; position: absolute; right: 35px; text-align: center; top: 153px !important; width: 260px !important; z-index: 1; display: none; }
  .page-1 .site-header .reView:before { display: block; }
  .site-footer .reView:before { color: #336633; content: "Zur Desktopansicht wechseln"; display: block; font-size: 14px; font-weight: bold; margin: 10px 0 0 0; text-decoration: underline; } }
/* Helper Classes from the boilerplate project  @package terra_template @path Generic/_Helper.scss @link http://html5boilerplate.com/docs/css/#non-semantic-helper-classes */
/** Quick floats */
.fl-r { float: right; }

.fl-l { float: left; }

/** For image replacement */
.ir, .image-replacement { background-color: transparent; border: 0; overflow: hidden; font: 0/0 a; }

/** Hide from both screenreaders and browsers: h5bp.com/u */
.hidden { display: none !important; visibility: hidden; }

/** Hide only visually, but have it available for screenreaders: h5bp.com/v */
.visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; }

/** Extends the .visuallyhidden class to allow the element to be focusable when navigated to via the keyboard: h5bp.com/p */
.visuallyhidden.focusable:active, .visuallyhidden.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; }

/** Hide visually and from screenreaders, but maintain layout */
.invisible { visibility: hidden; }

/** Contain floats: h5bp.com/q */
.cf:before, .dl--horizontal:before, .g:before, .grid:before, .cf:after, .dl--horizontal:after, .g:after, .grid:after, .clearfix:before, .clearfix:after { content: ""; display: table; }
.cf:after, .dl--horizontal:after, .g:after, .grid:after, .clearfix:after { clear: both; }

/* Print styles - Inlined to avoid another HTTP connection  @package terra_template @path Generic/_Print.scss @link http://h5bp.com/r */
@media print { * { background: transparent !important; /** Black prints faster: h5bp.com/s */ color: black !important; box-shadow: none !important; text-shadow: none !important; }
  @page { margin: 0.5cm; }
  pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }
  thead { /** h5bp.com/t */ display: table-header-group; }
  tr, img { page-break-inside: avoid; }
  img { max-width: 100% !important; }
  p, h2, h3 { orphans: 3; widows: 3; }
  h2, h3 { page-break-after: avoid; }
  a, a:visited { text-decoration: underline; }
  abbr[title]:after { content: " (" attr(title) ")"; }
  .print-hidden { display: none; } }