/*  COLORS  */
/* FONTS */
/* Kleine Geräte (Tablets, 768px und breiter) */
@media (min-width: 768px) and (max-width: 991px) {
  .anchor {
    display: inline-block;
    height: 90px;
    /*same height as header*/
    margin-top: -90px;
    /*same height as header*/
    visibility: hidden;
  }
  .no-padding,
  .right.no-padding,
  .left.no-padding,
  .slider .col-xs-12,
  .no-padding-sm-xs,
  .right {
    padding-left: 0;
    padding-right: 0;
  }
  img.logo {
    float: none;
  }

    img.logo-anniversary{
        width: 50%;
        padding-bottom: 1%;
    }
  .btn,
  input.submit,
  .blog .news-list-view .article .footer a {
    padding: 0.375rem 2rem;
  }
  .ifh-fund section.header .navbar-default .navbar-collapse,
  .ecc-club section.header .navbar-default .navbar-collapse,
  section.header .navbar-default .navbar-collapse {
    margin-right: 0;
  }
  a.header-about {
    margin-left: -5px;
  }
  /* ---------------------------- CONTENT ---------------------------- */
  /* BANNER SLIDER */
  .default .slider .text,
  .blog .slider .text {
    top: 3rem;
  }
  .informationRequest {
    width: 50%;
  }
  .col-lg-12 .gray-information {
    width: 100%;
  }
  .downloadList {
    width: 100%;
    padding: 0px 20px 0px 20px;
    padding: 0rem 1.25rem 0rem 1.25rem;
  }
  .news .footer {
    padding-left: 0;
  }
  /*----- PRODUCTSLIDE -----*/
  /* ONEPRODUCT */
  .oneProduct .productslide div.product {
    margin: 0 2.9rem;
  }
  .oneProduct {
    width: 50%;
  }
  /* TWOPRODUCTS */
  .twoProducts {
    width: 100%;
    height: auto;
    padding: 1.25rem;
  }
  .twoProducts .productslide .carousel-inner .active {
    margin: 0 0 0 13px;
  }
  .twoProducts .productslide div.product {
    width: 18rem;
    margin: 0rem 1.25rem;
    text-align: center;
  }
  .twoProducts .productslide div.product .product-image {
    width: 100%;
  }
  .twoProducts .productslide div.product img {
    float: none;
    margin: 0;
  }
  .twoProducts .productslide div.product h6 {
    height: 40px;
  }
  .BlogItemRelated img {
    margin-right: 2rem;
  }
  .BlogItemRelated .header {
    padding-top: 0;
  }
  .footer .tx-cw-twitter {
    padding-right: 0.9375rem;
  }
  /*----- YOUTUBE VIDEO -----*/
  object[type="application/x-shockwave-flash"] {
    width: 100%;
    height: 400px;
  }
  .yamm.navbar-default .navbar-header {
    position: relative !important;
  }
  .inner_cbQuickGoogleMap {
    width: 100% !important;
  }
}
/* Mittlere Geräte (Desktop-PCs, 992px und breiter) */
@media (min-width: 768px) and (max-width: 991px) {
  /* ---------------------------- FONT-SIZE ---------------------------- */
  .home .slider h1 {
    font-size: 2.5rem;
  }
  .home .slider p {
    font-size: 0.875rem;
  }
}
/* Kleine Geräte (Tablets, 768px und breiter) */
@media (min-width: 768px) and (max-width: 991px) {
  .home .slider .item a.btn {
    padding: 0.375rem 1.5rem;
    right: 1rem;
    top: 13.25rem;
  }
  .home .right .panel h2 {
    margin-right: 0px;
    margin-top: 20px;
    position: inherit;
  }
}
/* Kleine Geräte (Tablets, 768px und breiter) */
@media (min-width: 768px) and (max-width: 991px) {
  .col-lg-8 .panel,
  .col-lg-8 .col-lg-12 .panel,
  .col-lg-4 .panel,
  .col-lg-4 .col-lg-12 .panel,
  .row > .panel,
  .col-lg-12 .panel {
    width: 50%;
  }
  .tile.colspan-2 {
    height: 37.5rem;
  }
  .tile.rowspan-2.panel-to-bg {
    height: 37.5rem;
  }
  .tile.rowspan-2 {
    height: auto;
  }
  .panel .btn,
  .tile .btn {
    float: none;
    width: auto;
    padding: 0.375rem 0.5rem;
  }
  .right > div,
  .right .panel,
  .right .col-lg-12 .panel {
    width: 100%;
  }
  .panel.contactperson .description {
    height: 100%;
    padding: 3.125rem;
    width: 50%;
  }
  .tile.director.rowspan-2 {
    height: 23.4375rem;
    background-size: auto auto !important;
  }
  .panel.director {
    background-size: 50% auto;
  }
  .panel.director .description {
    height: 23.4375rem;
    padding: 3.125rem;
    width: 50%;
    left: auto;
    right: 0;
    top: 0;
  }
  .panel.director .img-bg {
    height: 100%;
    padding: 3.125rem;
    width: 50%;
    float: left;
  }
  .panel.director .image-icon {
    top: auto;
    bottom: 0.5rem;
    right: 20rem;
  }
  .inner-contactperson .panel.contactperson .description {
    height: auto;
    float: right;
    margin-bottom: 1.25rem;
    width: 100%;
    padding: 1.25rem 0;
    position: relative;
  }
  .inner-contactperson .panel.contactperson .description a.xing,
  .inner-contactperson .panel.contactperson .description a.linkedin {
    height: 2.5rem;
    width: 2.5rem;
    bottom: 2rem;
    background-size: cover;
    right: auto;
    left: 20rem;
  }
  .inner-contactperson .panel.contactperson .image {
    width: 100%;
    margin-right: 0;
  }
  .inner-contactperson .panel.contactperson div.image {
    background-size: cover !important;
  }
  .tile.middle {
    height: 18.75rem !important;
    margin-top: 1.25rem;
  }
  .contactperson a.xing,
  .ecc-club-home .contactperson a.xing,
  .ifh-fund .contactperson a.xing,
  .contactperson a.linkedin,
  .ecc-club-home .contactperson a.linkedin,
  .ifh-fund .contactperson a.linkedin {
    bottom: 3.125rem;
  }
}
/* Kleine Geräte (Tablets, 768px und breiter) */
@media (min-width: 768px) and (max-width: 991px) {
  /* ------------------ HOME ------------------ */
  .home .slider h1 {
    top: 3.25rem;
    left: 15rem;
    padding-right: 5rem;
  }
  .home .slider .text p:first-child {
    top: 10.75rem;
    left: 15rem;
    padding-right: 5rem;
  }
  .home .slider .text a {
    right: 5rem;
    top: 14rem;
  }
  .slider h1 {
    top: 0.5rem;
    left: 7rem;
  }
  .content_banner.tafel-theme.big {
    padding-right: 20px;
  }
  .content_banner.tafel-theme.big img.content_banner-icon {
    left: 30px;
    top: 45px;
  }
  .content_banner.tafel-theme.big h2 {
    margin-top: 30px;
  }
  .content_banner.tafel-theme.big h2,
  .content_banner.tafel-theme.big h5 {
    margin-left: 270px;
  }
  .content_banner.tafel-theme.big h5 {
    margin-top: 20px;
  }
  .home .slider .item a.btn {
    right: 1.5rem;
    top: 21.4rem;
  }
  .owl-dots {
    display: none !important;
  }
  .owl-ifh-theme .red h2,
  .owl-ifh-theme .green h2,
  .owl-ifh-theme .darkblue h2,
  .owl-ifh-theme .lightblue h2,
  .owl-ifh-theme .red h5,
  .owl-ifh-theme .green h5,
  .owl-ifh-theme .darkblue h5,
  .owl-ifh-theme .lightblue h5 {
    margin-left: 300px !important;
  }
}
@media (min-width: 768px) and (orientation: landscape) {
  .content_banner.tafel-theme.big a.btn {
    right: 2.25rem;
    top: 21.5rem;
    padding: 0.375rem 1.5rem 0.375rem 1.5rem;
  }
  .content_banner.tafel-theme.big h2,
  .content_banner.tafel-theme.big h1,
  .content_banner.tafel-theme.big h5 {
    margin-left: 320px;
  }
  .content_banner.tafel-theme.big img.content_banner-icon {
    left: 65px;
  }
  .owl-dots {
    display: none !important;
  }
}
/*
Mixins
==================================================
The `mixins.less` file contains the imports to all mixin documents that simplify the work with Shopware.

Mixin specific documentation can be found inside each mixin file.

Mixins can be used by adding the mixin class onto an element inside Shopware.

**Example:**<br/>
`.border-radius(3px);`
*/
/*
Appearance mixin
============================================
The mixins provides you a cross-browser compatible method to set the appearance of the element.

Please refer to <http://caniuse.com/appearance> to see the browser support table of the feature.

######Example:
`.appearance([value]);`

`@param {String} type The type you want to use`
*/
/*
Backface visibility mixin
============================================
The mixins provides you a cross-browser compatible method to set the backface-visibility of the element.

Please refer to <http://caniuse.com/transforms3d> to see the browser support table of the feature.

######Example:
`.backface-visibility([value]);`

`@param {String} visibility The visibility you want to use`
*/
/*
Border-radius mixin
=============================================
The mixins provides you a cross-browser compatible method to set a border-radius.

Please refer to <http://caniuse.com/border-radius> to see the browser support table of the feature.

######Syntax:
`@param {String} radius The radius you want to set`<br/>

######Example:
Same border-radius for all edges: <br/>
`.border-radius([pixel-value]);`<br/>

Different border-radius:<br/>
`.border-radius-multi([pixel-value-leftTop], [pixel-value-rightTop], [pixel-value-rightBottom], [pixel-value-leftBottom]);`<br/>

Resetting border radius:<br/>
`.reset-border-radius();`
*/
/*
Box shadow mixin
==============================================
The mixins provides you a cross-browser compatible method to set a box-shadow.

Please refer to <http://caniuse.com/css-boxshadow> to see the browser support table of the feature.

######Example:
`.box-shadow([h-shadow-value], [v-shadow-value], [blur-amount], [spread-amount], [shadow-color]);`

`@param: {Number} x: Offset to the x axis (Default: 0)`<br/>
`@param: {Number} y: Offset to the y axis (Default: 0)`<br/>
`@param: {Number} blur: Bluring radius (Default: 1px)`<br/>
`@param: {String} color: Color of the shadow (Default: #000)`<br/>
*/
/*
Box-sizing mixin
========================================
The mixins provides you a cross-browser compatible method to set the box-sizing which supports IE starting from
version 8 to the newest one.

Please refer to <http://caniuse.com/css3-boxsizing> to see the browser support table of the feature.

######Example:
`.box-sizing:([value]);`

`@param: {String} box-sizing: Box model, which should be used (Default: border-box)`
*/
/*
Clearfix mixin
================================
The clearfix mixin allows the easy integration of the floating-solution method.

The clearfix resolves the problem that occurs when two floating elements are nested inside a parent element, then sometimes the parent elements height disappears.

Add the `.clearfix` class to the parent element.

######Example:
`.clearfix();`

*/
/*
Gradient mixin
====================================================
The mixins provides you a cross-browser compatible method to set a linear gradient which goes from top to bottom.

Please refer to <http://caniuse.com/css-gradients> to see the browser support table of the feature.

Shopware 5 also provides gradient mixins based on the basic color variables that can be changed in the backend theme configuration tool.
######Basic gradients:
`.primary-gradient();`<br/>
`.secondary-gradient();`<br/>
`.white-gradient();`<br/>

######Linear Gradient Example:
`.linear-gradient([startcolor-value], [endcolor-value]);`

`@param {String} start The start color of the gradient`<br/>
`@param {String} end The end color of the gradient`
*/
/*
Opacity
===============================================
The mixins provides you a cross-browser compatible opacity which supports IE starting from version 8 to the
newest one. Safari, Chrome and Firefox are supported in all versions.

Please refer to <http://caniuse.com/css-opacity> to see the browser support table of the feature.

######Example:
`.opacity([value]);`

`@param: {Number} opacity: Value of the opacity, starting from 0 to 1`
*/
/*
Rotate mixin
===============================================
The mixins provides you a cross-browser compatible method to set a transformation which rotates the element. Keep in
mind that you can not mix different transformations.

Please refer to <http://caniuse.com/transforms2d> to see the browser support table of the feature.

######Example:
`.rotate([value]);`

`@param {String} degree The degree value you want to set. Please keep in mind that you need to suffix the unit.`
*/
/*
Scale mixin
===============================
The mixins provides you a cross-browser compatible method to set a transformation which scales the element.
Keep in mind that you can not mix different transformations.

Please refer to <http://caniuse.com/transforms2d> to see the browser support table of the feature.

######Example:
`.scale([value]);`

`@param {String} scale-value The scale value, you want to set`
*/
/*
Touch callout mixin
===========================================
Disables the default callout shown when you touch and hold a touch target.

######Support:
- iOS 2.0<br/>
- Android 4.1<br/>

######Example:
`.touch-callout([value]);`

`@param: {String} type: The type you want to set (Default: none)`
*/
/*
Transform style mixin
======================================
The mixins provides you a cross-browser compatible method to set a transformation style.

Please refer to <http://caniuse.com/transforms3d> to see the browser support table of the feature.

######Example:
`.transform-style([value]);`

`@param {String} Style The style you want for your transformation (Default: preserve-3d)`
*/
/*
Transform origin mixin
======================================
The mixins provides you a cross-browser compatible method to set the transform origin position.

Please refer to <http://caniuse.com/transforms2d> to see the browser support table of the feature.

######Example:
`.transform-origin([x-value],[y-value],[z-value]);`

`@param: x: Sets the origin position on the x axis (Default: 50%)`<br/>
`@param: y: Sets the origin position on the y axis (Default: 50%)`<br/>
`@param: z: Sets the origin position on the z axis (Default: 0)`
*/
/*
Transition mixin
=========================================
The mixins provides you a cross-browser compatible method to set a transition.

Please refer to <http://caniuse.com/css-transitions> to see the browser support table of the feature.

######Example:
`.transition([property], [duration-value], [easing]);`

`@param: {String} properties: The properites which should be animated (Default: all)`<br/>
`@param: {String} duration: Duration of the transition including the unit (Default: 0.3s)`<br/>
`@param: {String} easing: The easing which should be used for the transition (Default: ease-out)`
*/
/*
Translate mixin
============================================
The mixins provides you a cross-browser compatible method to set a transition.

Please refer to <http://caniuse.com/css-transitions> to see the browser support table of the feature.

Keep in mind, that 3d translations are needing an perspective, otherwise the translated elements get skewed up.

######Example:
`.translate([x-value],[y-value],[z-value]);`

`@param: {String} rotateX: The rotation on the x-axis`<br/>
`@param: {String} rotateY: The rotation on the y-axis`<br/>
`@param: {String} rotateZ: The rotation on the z-axis`<br/>
*/
/*
Unitize mixin
================================================
The unitize mixins converts values from px-units to the relative rem-units, providing all the benefits of units like em and rem, without you having to do any calculations yourself.

######Syntax:
`@property` = the property that should be unitized.<br/>
`@value` = pixel-value<br/>
`@baseValue` (optional) = default browser font-size (@remScaleFactor in most cases)<br/>

######Example Unitize mixin with custom property
`.unitize(@property, @value);`<br/>
`.unitize(font-size, 16);`

######Specific built-in functions
In addition to the general `.unitize()` mixin, Shopware contains specific mixins to quickly calculate values which (for example) have more than one property.<br/>
<br/>

`.unitize-height(@value)`<br/>
`.unitize-width(@value)`<br/>
`.unitize-max-height(@value)`<br/>
`.unitize-max-width(@value)`<br/>
`.unitize-min-width(@value)`<br/>
`.unitize-padding(@topValue, @rightValue, @bottomValue: @topValue, @leftValue: @rightValue)`<br/>
`.unitize-margin(@topValue, @rightValue, @bottomValue: @topValue, @leftValue: @rightValue)`<br/>
`.unitize-variable(@value)`<br/>
*/
/*
User-select mixin
===============================
The mixins provides you a cross-browser compatible method to set a user selection mode.

Please refer to <http://caniuse.com/user-select-none> to see the browser support table of the feature.

######Example:
`.user-select([value]);`

`@param: {String} type: The type you want to set (Default: none)`
*/
/*
Transform mixin
==============================================
The mixins provides you a cross-browser compatible method to set a transformation.

Please refer to <http://caniuse.com/transforms2d> to see the browser support table of the feature.

######Example:
`.transform([value]);`

`@param: {String} properties: The transformation(s) that should be applied`
*/
/*
Tab highlighting mixin
===========================
Sets the color of the highlighting when a link was clicked / tapped.

Please refer to <http://www.browsersupport.net/CSS/-webkit-tap-highlight-color> to see the browser support table of the feature.

######Example:
`.tap-highlight-color([color-value]);`

`@param: {String} color: The color you want to set (Default: rgba(0, 0, 0, 0))`
*/
/*
Keyframe mixin
=============================================
The mixins provides you a cross-browser compatible method to set a keyframe.

Please refer to <http://caniuse.com/#search=keyframe> to see the browser support table of the feature.

######Example:
`.keyframes([name-value], [frames-value]);`

`@param: {String} name: The keyframe animation name`<br/>
`@param: {String} roules: the animation frames`
*/
@-webkit-keyframes keyframe--spin {
  from {
    -webkit-transform: rotate(0);
    -moz-transform: rotate(0);
    -ms-transform: rotate(0);
    -o-transform: rotate(0);
    transform: rotate(0);
  }
  to {
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@-moz-keyframes keyframe--spin {
  from {
    -webkit-transform: rotate(0);
    -moz-transform: rotate(0);
    -ms-transform: rotate(0);
    -o-transform: rotate(0);
    transform: rotate(0);
  }
  to {
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@keyframes keyframe--spin {
  from {
    -webkit-transform: rotate(0);
    -moz-transform: rotate(0);
    -ms-transform: rotate(0);
    -o-transform: rotate(0);
    transform: rotate(0);
  }
  to {
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@-webkit-keyframes keyframe--spin-reverse {
  from {
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
  }
  to {
    -webkit-transform: rotate(0);
    -moz-transform: rotate(0);
    -ms-transform: rotate(0);
    -o-transform: rotate(0);
    transform: rotate(0);
  }
}
@-moz-keyframes keyframe--spin-reverse {
  from {
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
  }
  to {
    -webkit-transform: rotate(0);
    -moz-transform: rotate(0);
    -ms-transform: rotate(0);
    -o-transform: rotate(0);
    transform: rotate(0);
  }
}
@keyframes keyframe--spin-reverse {
  from {
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
  }
  to {
    -webkit-transform: rotate(0);
    -moz-transform: rotate(0);
    -ms-transform: rotate(0);
    -o-transform: rotate(0);
    transform: rotate(0);
  }
}
/*
Animations mixin
============================================
The mixins provides you a cross-browser compatible method to set animation values.

Please refer to <http://caniuse.com/css-animation> to see the browser support table of the feature.

######Example:
`.animation([value]);`

`@param: {String} value: All animation values`
*/
/*
Column count mixin
=============================================
This mixin provides you a cross-browser compatible method to set the column count property.

Please refer to <http://caniuse.com/multicolumn> to see the browser support table of the feature.

######Example:
`.column-count([value]);`

`@param: {Number} count: The amount of columns you want to set (Default: auto)`
*/
/*
Hypheration mixin
======================================
The mixins provides you a cross-browser compatible method to set the hyphenation.

Please refer to <http://caniuse.com/css-hyphens> to see the browser support table of the feature.

######Example:
`.hyphens([value]);`

`@param: {String} hyphenation: The hyphenation that should be used (Default: auto)`
*/
/*
Grabbing cursor
==================================
This mixin provides you a cross-browser compatible method to set the cursor grabbing behavior.

######Example:
`.cursorGrab();`<br/>
`.cursorGrabbing();`<br/>

*/
/* Kleine Geräte (Tablets, 768px und breiter) */
@media (min-width: 768px) and (max-width: 991px) {
  .row {
    margin-right: -0.5rem;
    margin-left: -0.5rem;
  }
  /* ---------------------------- HEADER ---------------------------- */
  .header-top .right {
    line-height: 2.25;
  }
  section.header .navbar-default .navbar-header {
    margin-left: 0;
      width: 45%;
  }
  .navbar {
    margin-bottom: 0;
  }
  button.search-button {
    background-image: url("../Images/Buttons/search-button.png");
    width: 30px;
    height: 30px;
    background-repeat: no-repeat;
    background-color: transparent;
    border: none;
    position: absolute;
    top: 7.1rem;
    right: 1rem;
    z-index: 1999;
  }
  section.header .navbar-default .searchbar-collapse {
    background-color: #ffffff;
    position: relative;
    margin-right: -25px;
    margin-right: -1.5625rem;
    margin-left: -35px;
    margin-left: -2.1875rem;
  }
  section.header .navbar-default .searchbar-collapse .form-search {
    margin-right: 0;
    margin-top: 0;
    float: none;
    background-color: #ffffff;
    padding: 0px 20px 0px 20px;
    padding: 0rem 1.25rem 0rem 1.25rem;
  }
  section.header .navbar-default .searchbar-collapse .form-search fieldset input {
    width: 44.4rem;
  }
  img.logo {
    margin-left: -5px;
  }
  .ecc-club img.logo {
    margin-right: 40px;
  }
  section.header {
    margin-top: 35px;
    margin-top: 2.1875rem;
    padding-bottom: 0;
    position: relative;
    background-color: #ffffff;
    z-index: 9000;
    width: 100%;
  }
  section.header.tiny {
    position: absolute;
  }
  /* ----- TINY ----- */
  section.header.tiny {
    height: 50px;
    height: 3.125rem;
  }
  section.header.tiny img.logo {
    display: none;
  }
  section.header.tiny .yamm .container {
    width: auto;
    padding-right: 0;
  }
  section.header.tiny .navbar-toggle {
    display: block;
    position: absolute;
    right: 0;
    top: -3px;
    z-index: 2000;
  }
  section.header.tiny .navbar-header a:before {
    content: url("../Images/logoXS.png");
  }
  section.header.tiny .yamm.navbar-default .navbar-header {
    margin-top: 1rem;
    float: none;
    background-color: #ffffff;
  }
  section.header.tiny li.element-83,
  section.header.tiny li.element-361 {
    background-color: #014268;
  }
  section.header.tiny .element-83 a,
  section.header.tiny .element-361 a {
    background-image: url("../Images/Buttons/IfhEccXS.jpg");
  }
  section.header.tiny li.element-84,
  section.header.tiny li.element-360 {
    background-color: #6a90a6;
  }
  section.header.tiny .element-84 a,
  section.header.tiny .element-360 a {
    background-image: url("../Images/Buttons/shopXS.jpg");
  }
  section.header.tiny li.element-85,
  section.header.tiny li.element-359 {
    background-color: #ba332d;
  }
  section.header.tiny .element-85 a,
  section.header.tiny .element-359 a {
    background-image: url("../Images/Buttons/eccClubXS.jpg");
  }
  section.header.tiny li.element-86,
  section.header.tiny li.element-358 {
    background-color: #83af23;
  }
  section.header.tiny .element-86 a,
  section.header.tiny .element-358 a {
    background-image: url("../Images/Buttons/foerdererXS.jpg");
  }
  section.header.tiny li.element-88,
  section.header.tiny li.element-357 {
    background-color: #014268;
  }
  section.header.tiny .element-88 a,
  section.header.tiny .element-357 a {
    background-image: url("../Images/Buttons/blogXS.jpg");
  }
  section.header.tiny li.element-87,
  section.header.tiny li.element-356 {
    background-color: #e5e5e5;
  }
  section.header.tiny .element-87 a,
  section.header.tiny .element-356 a {
    background-image: url("../Images/Buttons/xingXS.jpg");
  }
  section.header.tiny .element-83 a:hover::after,
  section.header.tiny .element-83 a:active::after,
  section.header.tiny .element-83 a:focus::after,
  section.header.tiny .element-83.active a::after,
  section.header.tiny .element-361 a:hover::after,
  section.header.tiny .element-361 a:active::after,
  section.header.tiny .element-361 a:focus::after,
  section.header.tiny .element-361.active a::after,
  section.header.tiny .element-84 a:hover::after,
  section.header.tiny .element-84 a:active::after,
  section.header.tiny .element-84 a:focus::after,
  section.header.tiny .element-84.active a::after,
  section.header.tiny .element-360 a:hover::after,
  section.header.tiny .element-360 a:active::after,
  section.header.tiny .element-360 a:focus::after,
  section.header.tiny .element-360.active a::after,
  section.header.tiny .element-85 a:hover::after,
  section.header.tiny .element-85 a:active::after,
  section.header.tiny .element-85 a:focus::after,
  section.header.tiny .element-85.active a::after,
  section.header.tiny .element-359 a:hover::after,
  section.header.tiny .element-359 a:active::after,
  section.header.tiny .element-359 a:focus::after,
  section.header.tiny .element-359.active a::after,
  section.header.tiny .element-86 a:hover::after,
  section.header.tiny .element-86 a:active::after,
  section.header.tiny .element-86 a:focus::after,
  section.header.tiny .element-86.active a::after,
  section.header.tiny .element-358 a:hover::after,
  section.header.tiny .element-358 a:active::after,
  section.header.tiny .element-358 a:focus::after,
  section.header.tiny .element-358.active a::after,
  section.header.tiny .element-87 a:hover::after,
  section.header.tiny .element-87 a:active::after,
  section.header.tiny .element-87 a:focus::after,
  section.header.tiny .element-87.active a::after,
  section.header.tiny .element-356 a:hover::after,
  section.header.tiny .element-356 a:active::after,
  section.header.tiny .element-356 a:focus::after,
  section.header.tiny .element-356.active a::after,
  section.header.tiny .element-88 a:hover::after,
  section.header.tiny .element-88 a:active::after,
  section.header.tiny .element-88 a:focus::after,
  section.header.tiny .element-88.active a::after,
  section.header.tiny .element-357 a:hover::after,
  section.header.tiny .element-357 a:active::after,
  section.header.tiny .element-357 a:focus::after,
  section.header.tiny .element-357.active a::after {
    top: 3.2rem;
  }
  section.header.tiny button.search-button {
    top: 10px;
    top: 0.625rem;
    right: 5.688rem;
  }
  section.header.tiny .navbar-default .searchbar-collapse .form-search {
    padding: 20px;
    padding: 1.25rem;
  }
  .ecc-club section.header.tiny .navbar-toggle,
  .ifh-fund section.header.tiny .navbar-toggle {
    top: 5px;
  }
  .ecc-club section.header.tiny .navbar-header a:before {
    content: url("../Images/logoXS_ecc.png");
  }
  .ecc-club section.header.tiny .yamm.navbar-default .navbar-header {
    margin-top: 5px;
  }
  .ifh-fund section.header.tiny .navbar-header a:before {
    content: url("../Images/logoXS_ifh.png");
  }
  .ifh-fund section.header.tiny .yamm.navbar-default .navbar-header {
    margin-top: 5px;
  }
  /* ---------------------------- CONTENT ---------------------------- */
  section.content {
    padding-top: 0;
  }
  section.content.tiny {
    padding-top: 12rem;
  }
  .ecc-club section.content,
  .ifh-fund section.content {
    padding-top: 0;
  }
  .ecc-club section.content.tiny,
  .ifh-fund section.content.tiny {
    padding-top: 11rem;
  }
  /* ---------------------------- FOOTER ---------------------------- */
  .footer {
    padding-left: 0px;
    padding-left: 0rem;
    padding-right: 0px;
    padding-right: 0rem;
  }
}
@media (min-width: 768px) {
  /* ---------------------------- HEADER ---------------------------- */
  .header-top {
    position: fixed;
    width: 100%;
    z-index: 9001;
    top: 0;
  }
}