@charset "UTF-8";
/**
 * Reset Stylesheet, um eine einheitliche Darstellung unterschiedlicher HTML Elemente in
 * verschiedenen Browsern zu erreichen//
*/
* {
  vertical-align: baseline;
  font: inherit;
  border: 0 none;
  outline: 0;
  padding: 0;
  margin: 0;
  box-sizing: border-box;
}

*:before, *:after {
  box-sizing: border-box;
}

ul {
  list-style-type: none;
}

table {
  border-spacing: 0;
  border-collapse: collapse;
}

td {
  vertical-align: top;
}

/* Superscript/Hochstellung*/
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
  top: -0.5em;
}

/* Img is inline-block => margin underneath the image */
img {
  display: block;
}

/*############################################
 *## variables
 *############################################*/
/*############################################
 *## Greyish colors for areas and fonts
 *############################################*/
/*############################################
 *## Whitish colors for areas and fonts
 *############################################*/
/*############################################
 *## Colors for FeedbackMessages (InfoMessage, WarningMessage, ErrorMessage, SuccessMessage)
 *############################################*/
/*############################################
 *## Semi-Transparencies
 *############################################*/
/*############################################
 *## Shadow definitions
 *############################################*/
/*############################################
 *## Some global colors which can be used for different purposes
 *############################################*/
/*############################################
 *## Semantic assignments
 *############################################*/
/*##########################################################
 *## SocialWeb
 *##########################################################
 */
/*############################################
 *## CI Colors
 *############################################*/
/*############################################
 *## Semantic assignments
 *############################################*/
/*############################################
 *## Dimensions of the Grid
 *############################################*/
/*############################################
 *## Font Sizes
 *############################################*/
/*############################################
 *## Font Weights
 *############################################*/
/*############################################
 *## Other sizes used throughout the layout
 *############################################*/
/*############################################
 *## mixins
 *############################################*/
.white-box {
  background-color: #ffffff;
  border: 1px solid #ccc;
  border-radius: 3px;
  padding: 7px;
}
@media all and (min-width: 1151px) {
  .white-box {
    padding: 10px;
  }
}

/**
 * @param bool $fillGridCell                true, if height of the module should be changed to 100% + GridGap
 *                                          false, if height iof the respective container should not be changed
 */
/*############################################
 *## Mixins to be used by other modules
 *############################################*/
/**
 * Greyish background spaning across multiple grid columns and rows.
 * Is to be combined with whiteGrid
 */
/**
 * @param $column   One of left, middle, right
 * @param $row      One of first, middle, last
 */
/**
* @param px horizontalShadow   The position of the horizontal shadow. Negative values are allowed
* @param px verticalShadow     The position of the vertical shadow. Negative values are allowed
* @param px blurRadius         (optional) If set to 0 the shadow will be sharp, the higher the number, the more blurred it will be.
   @param px spreadRadius       (optional) Positive values increase the size of the shadow, Negative values decrease the size.
                                Default is 0 (the shadow is same size as blur).
* @param string color       	Optional. The color of the shadow.
*/
/*
 * The label when input is focused
 */
/**
 * The line underneath an input field marking it as active
 */
/**
 * Regular alignment is to have the output next to the main-input (ie.e range/interval sliders)
 * This mixin changes position of the output to be arranged next to the label
 * => main-input can consume the whole space
 */
/**
 * Specific padding for modules that are positioned on the grid on larger screens
 * but go full width on mobile while keeping some padding on the left and right
 */
/**
 * If parent container has a padding set all its children are restricted to the padding
 * Include this mixin if a child need to break out of the parents padding and stretch
 * across the full width
 */
/**
 * Default is to have a gap between two grid cells (gutter). This function expands a module to the left
 * so that it fills and closes the left grid gap
 * @param boolean $closeHalfGap   true if only half the gap should be closed (seems more natural when two containers are merged)
 *                                false, if the whole gap should be closed
 * @param boolean $removeBorder   true, if the right border of the element should be removed (helpful when the element should be merged with its neighbor)
 *                                false, if any border styling should remain visible
 */
/**
 * Default is to have a gap between two grid cells (gutter). This function expands a module to the right
 * so that it fills and closes the right grid gap
 * @param boolean $closeHalfGap   true, if only half the gap should be closed (seems more natural when two containers are merged)
 *                                false, if the whole gap should be closed
 * @param boolean $removeBorder   true, if the right border of the element should be removed (helpful when the element should be merged with its neighbor)
 *                                false, if any border styling should remain visible
 */
/**
 * Default is to have a gap between two grid cells (gutter). This function expands a module to the top
 * so that it fills and closes the upper grid gap
 * @param int  $numberOfGapsToClose         Optional parameter containing number of gaps to close. Could be larger than 1 if preceeding
 *                                          row gap was also closed but container did override the altered height
 * @param bool $closeWithPadding            true, if the contents should not be moved to the top but, the Grid cell should be closed with a padding
 *                                          false, if contents and everything should be moved up
 * @param bool $overlapWithUpperContainer   true, if not only the Gap should be closed but the container should be moved even a little further so that the uper and lower container and merged completely
 *                                          false, otherwise
 * @param bool $fillGridCell                true, if height of the module should be changed to 100% + GridGap
 *                                          false, if height iof the respective container should not be changed
 */
/**
 * Default is to have a gap between two grid cells (gutter). This function expands a module to the bottom
 * so that it fills and closes the lower grid gap
 * @param int  $numberOfGapsToClose   Optional parameter containing number of gaps to close. Could be larger than 1 if preceeding
 *                                    row gap was also closed but container did override the altered height
 * @param bool $closeWithPadding      true, if the contents should not be moved to the top but, the Grid cell should be closed with a padding
 *                                    false, if contents and everything should be moved up
 * @param bool $fillGridCell                true, if height of the module should be changed to 100% + GridGap
 *                                          false, if height iof the respective container should not be changed
 */
/**
 * Moves a container which is coverted by a different container in the same Grid cell to the foreground
 */
/**
* Using the FlexBoxModel to align elements horizontally within a flex-container (flex-items are aligned from left to right)
*
* @param @verticalAlign   Specify how elements should be aligned vertically. One of the following is possible:
                           - flex-start: height depends on the content of the children. Alignment is at the top of flex-container
                           - flex-end:  height depends on the content of the children. Alignment is at the bottom of the flex-container
                           - center: items are centered vertically
                           - baseline: items are aligned such as their baselines align
                           - stretch (default): stretch the children to fill the flex-container vertically (still respect min-width/max-width)

   @justifyContent        Specify how content is aligned within one row
                          - space-around(default): margin around the elements is distributed equally. There is also margin BEFORE THE FIRST
                                                   and AFTER THE LAST elemt (different from space-between)
                          - space-evenly
                          - space-between: The same as space-around, but there is no margin before the first element and no margin after the last element
                          - flex-start: The elements are aligned left
                          - flex-end: The elements are aligned right
                          - center: Equal margin left and right of the first element. No margin between inner elements
   @wrap                  - wrap, if items should be wrapped into the next row (default)
                          - nowrap, if items should all be in one single row
  @param $containerFitsElementsWidth    true, if the container should adjust its width to fit children (=> inline-flex)
                                        false, if it should take width of the parent container (flex)

*/
/**
 * Method changes orientation from an existing Flexbox from horizontal (row) to vertical or vice versa
 * => Very helpful to change an existing Flexbox with a media query on different screen sizes
 * @param $newOrientation   One of row or column
 * @param $newWrap          One of wrap or nowrap
 */
/**
 * Possible options: center, flex-start, flex-end
 */
/**
* Applies to: child element / flex item
* This defines the ability for a flex item to grow if necessary.
* It dictates what amount of the available space inside the flex container the item should take up.
* If all items have flex-grow set to 1, every child will set to an equal size inside the container.
* If you were to give one of the children a value of 2, that child would take up twice as much space as the others.
*
*  @param @number                       unitless value served as a proportion (default: 0)
*  @param @includeLegacyBrowsers        true, if container should also grow in IE10 and other legacy browsers (like Android Stock). DO NOT SET TO TRUE WHEN flex-wrap = wrap as the lines are no longer breaking in IEs!!!
                                        IE10 uses an old version of flexbox but which causes problems in IE11 sometimes (ie. HorizontalNavigation on IE mobile)
                                        When problems occur use false here
   @param @makeSameWidthForAllElements
*/
/**
* This defines the ability for a flex item to shrink if necessary.
*  @number: the value to which the item will be shrinked if necessary in comparison to the other flex items. default: 1
*/
/**
* Applies to: child element / flex item
* This defines the default size of an element before the remaining space is distributed.
* @param basis     the minimum length with which the element is initiated. (default: auto)
                    Specify 'available' to make all items the same size, even when one item
                    has wider content than the other
*/
/**
 * Must be applied to the Flex Item (child)
 */
/**
 * Orders the current FlexChild to a certain position of FlexBox. Only works if all Flex Children are given a sequence number
 */
/**
 * Mixin to vertically AND horizontally center a webfont icon included via before OR after
 * pseudo element within its dom element
 */
/**
* Style placeholders for different browsers
* @param px @fontSize
* @param string @color
*/
/**
 * Truncates text in a container so that fits in a single line.
 * Overflowing text is truncated with ...
 * ATTENTION: Only works when the container has a width: ... set
 */
/**
 * Truncates text after a certain number of lines (only works in Webkit based browsers like Chrome or Safari)
 */
/**
 * Automatische Silbentrennung
*/
/**
 * Restricts number of lines to the given amount of lines and cuts off
 * the remaining text with an ellipsis (...)
 * ATTENTION: Only works in -webkit based browsers like Chrome or Safari
 */
/**
 * Emboss efect is created if one line is drawn which is lighter than the background on which the emboss is applied
 * and a second line which is a little darker. Both colors should be in the same tone.
 * For example if an emboss on $ciDefault should be created $color1 could be $ciDefaultDark and $color2 could be $ciDefaultLight
 */
/**
* Perform a css animation
* Check out http://www.w3schools.com/css/css3_animations.asp to understand what CSS animations are
*
* @param name              Arbitrary name for the animation. What you specify here must be used in keyframe statement, too.
                            I.e. .func-animation(spin 1s infinite linear);
                            => Specify also
                            @-moz-keyframes spin {
                                //State at 0% of the animation
                                0% {
                                    -moz-transform: rotate(0deg);
                                }
                                //State when animation just starts
                                100% {
                                    -moz-transform: rotate(359deg);
                                }
                            }
   @param duration          Time (i.e 1s, 300ms) specifying the duration of the animation
   @param delay             Time (i.e 1s, 300ms) specifying the time until the animation first starts
   @param ease              One of the following options
                            - linear: The animation has the same speed from start to end
                            - ease: Default. The animation has a slow start, then fast, before it ends slowly
                            - ease-in: The animation has a slow start
                            - ease-out: The animation has a slow end
   @param iterationCount    Number that defines how many times an animation should be played.
                            Give infinite if the animation should never end
*/
/**
* Perform a css transition to allow soft state changes for :hover or :focus
* I.e. if you have the following css specification you can create a smooth transition between the
   regular color and the :hover color
   a {
    background-color: #9FC0D0;
   }
   a:hover {
    background-color: #759DB2;
   }
* Check out http://www.w3schools.com/css/css3_transitions.asp to understand what CSS transitions are
* @param @duration                  Defines the length of time that a transition takes. Default 0
* @param @timingFunction            Describes how the speed during a transition will be calculated. Default "ease"
                                    One of
                                    - ease-in       (will start the animation slowly, and finish at full speed.)
                                    - ease-out      (will start the animation at full speed, then finish slowly.
                                    - ease-in-out   (will start slowly, be fastest at the middle of the animation, then finish slowly.)
                                    - ease          (is like ease-in-out, except it starts slightly faster than it ends.)
                                    - linear        (uses no easing.)
                                    - steps(4, end) Uses of steps (jumps to those points)
* @param @delay                     Defines when the transition will start. Default 0
* @param @transitionProperty        Which property should be changed in the transition (i.e. width, when the width of a container changes for :hover)
                                     If more than one property is changed during transition specify in comma-separated string (i.e. @{width, top, left} when width
                                     as well as top position and left position should change on :hover or :focus
*/
/**
* Remove inherited transistion
*/
/*############################################
 *##
 *## Definition of a spinning animation
 *## (i.e. used for loading animation)
 *##
 *############################################*/
@keyframes spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(359deg);
  }
}
/*############################################
 *##
 *## Animation of a fade-slide effect where the object to which the animation
 *## is applied to is transformed 15px to teh right while fading out
 *##
 *############################################*/
@keyframes fadeRight {
  0% {
    transform: translateX(0);
  }
  100% {
    opacity: 0;
    transform: translateX(15px);
  }
}
/*############################################
 *##
 *## Pulse Animation which is useful i.e. for marking the current position of the user on a map
 *##
 *############################################*/
@keyframes pulsate {
  0% {
    transform: scale(0.1, 0.1);
    opacity: 0;
  }
  50% {
    opacity: 0.8;
  }
  100% {
    transform: scale(1, 1);
    opacity: 0;
  }
}
/*############################################
 *## Animation sliding the content out of the container to the left / right
 *############################################*/
@keyframes slideOutLeft {
  0% {
    transform: translateX(0);
  }
  100% {
    opacity: 0;
    transform: translateX(-15px);
  }
}
@keyframes slideOutRight {
  0% {
    transform: translateX(0);
  }
  100% {
    opacity: 0;
    transform: translateX(15px);
  }
}
/**
 * Creates the so called Ripple Effect introduces in Google's Material Design Guidelines
 * => Creates a round pulsating shape which is displayed for a short time when the user clicks the element
 * @param $color          Color for the pulsating ripple
 * @param $leftOffset     Offset to shift the center of the ripple effect to the right (positive $leftOffset)
 *                        or to the left (negative $leftOffset)
 * @param $topOffset      Offset to shift the center of the ripple effect to the bottom (positive $topOffset)
 *                        or to the top (negative $topOffset)
 * @param $scale          The larger this value, the larger the size of the ripple effect. Default is 10
 * @param $overflowHidden true, if the Ripple effect should be restricted to the size of the container
 *                        false, if the ripple effect can overflow the container
 */
/**
 * Use this mixin on any container to create a white spinner
 * on a greyish background. This mixin uses absolute positioning to center the spinner on any container
 * @param @fontSizeSpinner      The size of the spinner in px. As the spinner is created using FontAwesome web fonts this correpsonds to the
                                font size.
 */
/*############################################
 *## layout
 *############################################*/
.label {
  color: #727272;
}

.bold {
  font-weight: 700;
}

.formatted-article {
  padding: 10px 0;
}
.formatted-article #table-of-contents {
  margin: 0 0 20px 0;
}
.formatted-article #table-of-contents {
  position: relative;
}
.formatted-article #table-of-contents .collapsible-headline {
  margin-bottom: 0;
  padding-left: 0;
  padding-top: 0;
}
.formatted-article #table-of-contents a {
  width: 100%;
}
.formatted-article #table-of-contents a:not(:last-child) {
  margin-bottom: 6px;
}
.formatted-article #table-of-contents a:not(:last-child).secondary {
  padding-left: 10px;
}
.formatted-article #table-of-contents .headlines {
  margin-bottom: -10px;
}
.formatted-article #table-of-contents + .formatted-article-block {
  clear: left;
  padding-top: 0;
}
.formatted-article #table-of-contents + #corona-facts-container.ajax-show-on-user-action + .formatted-article-block {
  clear: left;
  padding-top: 0;
}
.formatted-article .formatted-article-block {
  clear: both;
  padding-top: 30px;
  overflow-wrap: break-word;
  /*############################################
  *##Image or video embedded in text
  *############################################*/
}
.formatted-article .formatted-article-block .headlines.primary, .formatted-article .formatted-article-block .headlines.p, .formatted-article .formatted-article-block .h.primary, .formatted-article .formatted-article-block .h.p {
  padding-top: 30px;
}
.formatted-article .formatted-article-block .headlines.secondary, .formatted-article .formatted-article-block .headlines.s, .formatted-article .formatted-article-block .h.secondary, .formatted-article .formatted-article-block .h.s {
  padding-top: 10px;
}
.formatted-article .formatted-article-block .headlines:first-child, .formatted-article .formatted-article-block .h:first-child {
  margin-top: -5px;
}
.formatted-article .formatted-article-block figure {
  border: none;
  padding: 0;
}
.formatted-article .formatted-article-block figure figcaption {
  padding: 10px;
  margin-top: -1px;
  background-color: #ccc;
  font-size: 0.84rem;
}
.formatted-article-text {
  position: relative;
  line-height: 1.5;
  -moz-hyphens: auto;
  -o-hyphens: auto;
  -webkit-hyphens: auto;
  -ms-hyphens: auto;
  hyphens: auto;
}
.formatted-article-text a:not(.collapsible-headline) {
  text-decoration: underline;
}
.formatted-article-text .headlines.secondary, .formatted-article-text .headlines.s, .formatted-article-text .h.secondary, .formatted-article-text .h.s {
  font-weight: 700;
}
.formatted-article-text p:not(:last-child) {
  margin-bottom: 10px;
}
.formatted-article-text p + ul {
  margin-top: -10px;
}
.formatted-article-text ul {
  list-style-type: disc;
  padding-left: 20px;
  /* Necessary to make ul-li elements float properly even, when an image is uploaded left to the text */
  overflow: auto;
}
.formatted-article-text ul + .headlines, .formatted-article-text ul + .h {
  margin-top: 10px;
}
.formatted-article-text table {
  width: 100%;
}
.formatted-article-text table caption {
  text-align: left;
  font-size: 1.3rem;
  font-weight: 700;
  clear: both;
}
.formatted-article-text table th {
  background-color: #c7e2f6;
  border-bottom: 1px solid #c7e2f6;
  font-weight: 700;
  padding: 10px 14px;
  text-align: left;
}
.formatted-article-text table td {
  background-color: #fafafa;
  border-bottom: 1px solid #c7e2f6;
  padding: 10px 14px;
}

.formatted-article .formatted-article-block .editable-textimage-container, .formatted-article .formatted-article-block .text-video {
  position: relative;
  z-index: 1;
  width: 100%;
  margin-bottom: 10px;
}
.formatted-article .formatted-article-block .editable-textimage-container a:not(.button) img, .formatted-article .formatted-article-block .text-video a:not(.button) img {
  width: 100%;
  height: auto;
}
.formatted-article .formatted-article-block .editable-textimage-container .button.add-image, .formatted-article .formatted-article-block .text-video .button.add-image {
  position: absolute;
  bottom: 10px;
  left: 50%;
  margin-left: -100px;
  width: 200px;
}
.formatted-article .formatted-article-block .editable-textimage-container .text-image-style-settings input[type=radio] + label:before, .formatted-article .formatted-article-block .text-video .text-image-style-settings input[type=radio] + label:before {
  color: #ffffff;
}
.formatted-article .formatted-article-block .editable-textimage-container .image-button-container, .formatted-article .formatted-article-block .text-video .image-button-container {
  position: absolute;
  bottom: 6px;
  right: 6px;
  z-index: 2;
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: stretch;
  -moz-box-align: stretch;
  -ms-flex-align: stretch;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
}
.formatted-article .formatted-article-block .editable-textimage-container .image-button-container .button + .button, .formatted-article .formatted-article-block .text-video .image-button-container .button + .button {
  margin-left: 10px;
}
.formatted-article .formatted-article-block .editable-textimage-container .image-placeholder, .formatted-article .formatted-article-block .text-video .image-placeholder {
  height: 200px;
}
@media all and (min-width: 481px) {
  .formatted-article .formatted-article-block .editable-textimage-container, .formatted-article .formatted-article-block .text-video {
    position: relative;
    z-index: 1;
    width: 260px;
    max-width: 45%;
  }
  .formatted-article .formatted-article-block .editable-textimage-container > div, .formatted-article .formatted-article-block .text-video > div {
    height: 100%;
  }
  .formatted-article .formatted-article-block .editable-textimage-container img, .formatted-article .formatted-article-block .text-video img {
    height: auto;
    width: 100%;
  }
  .formatted-article .formatted-article-block .editable-textimage-container .image-placeholder, .formatted-article .formatted-article-block .text-video .image-placeholder {
    display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
    display: -webkit-flex; /* Safari 7*/
    display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
    display: -ms-flexbox; /* IE10 */
    display: flex;
    -webkit-flex-direction: column;
    -webkit-box-orient: vertical; /* Safari <= 6*/
    -moz-flex-direction: column;
    -ms-flex-direction: column;
    -o-flex-direction: column;
    flex-direction: column;
    -webkit-align-items: stretch;
    -moz-align-items: stretch;
    -ms-align-items: stretch;
    -o-align-items: stretch;
    align-items: stretch;
    -webkit-justify-content: space-between;
    -moz-justify-content: space-between;
    -o-justify-content: space-between;
    -ms-justify-content: space-between;
    justify-content: space-between;
    flex-wrap: nowrap;
    -webkit-flex-wrap: nowrap;
    /* Legacy Browsers (IE 10)*/
    -webkit-box-pack: justify;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-box-align: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    margin: 0 10px;
    height: 190px;
  }
  .formatted-article .formatted-article-block .editable-textimage-container .image-placeholder > .element-contents, .formatted-article .formatted-article-block .text-video .image-placeholder > .element-contents {
    flex-grow: 1;
  }
  .formatted-article .formatted-article-block .editable-textimage-container .image-placeholder > .element-contents .label-value-combo:first-child, .formatted-article .formatted-article-block .text-video .image-placeholder > .element-contents .label-value-combo:first-child {
    margin-top: -4px;
  }
  .formatted-article .formatted-article-block .editable-textimage-container .image-placeholder .element-image, .formatted-article .formatted-article-block .text-video .image-placeholder .element-image {
    max-width: 100%;
    margin-bottom: 10px;
  }
  .formatted-article .formatted-article-block .editable-textimage-container .image-placeholder > .element-actions, .formatted-article .formatted-article-block .text-video .image-placeholder > .element-actions {
    padding-top: 10px;
    display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
    display: -webkit-flex; /* Safari 7*/
    display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
    display: -ms-flexbox; /* IE10 */
    display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
    display: flex;
    /* Simulating 2012 flexbox model (used in IE 10) */
    /* Legacy Browsers (IE 10)*/
    -webkit-box-pack: start;
    -moz-box-pack: start;
    -ms-flex-pack: start;
    -webkit-box-align: stretch;
    -moz-box-align: stretch;
    -ms-flex-align: stretch;
    /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
    /* For understanding browsers */
    -webkit-flex-direction: row;
    -moz-flex-direction: row;
    -ms-flex-direction: row;
    -o-flex-direction: row;
    flex-direction: row;
    -webkit-align-items: stretch;
    -moz-align-items: stretch;
    -ms-align-items: stretch;
    -o-align-items: stretch;
    align-items: stretch;
    -webkit-flex-flow: row nowrap;
    -webkit-justify-content: flex-start;
    -moz-justify-content: flex-start;
    -o-justify-content: flex-start;
    -ms-justify-content: flex-start;
    justify-content: flex-start;
    flex-wrap: nowrap;
    -ms-flex-wrap: nowrap; /* IE 10 */
    -webkit-flex-wrap: nowrap;
  }
  .formatted-article .formatted-article-block .editable-textimage-container .image-placeholder > .element-actions > a:not(:first-child), .formatted-article .formatted-article-block .text-video .image-placeholder > .element-actions > a:not(:first-child) {
    margin-left: 10px;
  }
}
@media all and (min-width: 481px) and (min-width: 481px) {
  .formatted-article .formatted-article-block .editable-textimage-container .image-placeholder, .formatted-article .formatted-article-block .text-video .image-placeholder {
    margin: 0;
  }
}
@media all and (min-width: 481px) {
  .formatted-article .formatted-article-block .editable-textimage-container.left, .formatted-article .formatted-article-block .text-video.left {
    float: left;
    margin-right: 15px;
  }
  .formatted-article .formatted-article-block .editable-textimage-container.left .image-copyright, .formatted-article .formatted-article-block .text-video.left .image-copyright {
    right: 25px;
  }
  .formatted-article .formatted-article-block .editable-textimage-container.right, .formatted-article .formatted-article-block .text-video.right {
    float: right;
    margin-left: 15px;
  }
  .formatted-article .formatted-article-block .editable-textimage-container.medium, .formatted-article .formatted-article-block .text-video.medium {
    width: 260px;
  }
  .formatted-article .formatted-article-block .editable-textimage-container.large, .formatted-article .formatted-article-block .text-video.large {
    width: 350px;
    max-width: 50%;
  }
  .formatted-article .formatted-article-block .editable-textimage-container.super_panoramic, .formatted-article .formatted-article-block .text-video.super_panoramic {
    float: inherit;
    width: 100%;
    max-width: 100%;
  }
}
@media all and (min-width: 861px) {
  .formatted-article #table-of-contents {
    padding: 14px;
    float: right;
    width: 34%;
    margin: 0 0 0 20px;
    z-index: 1;
    border-left: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
    border-right: 1px solid #ccc;
    background-color: #f1f1f1;
    border-radius: 0 3px 0 3px;
  }
  .formatted-article #table-of-contents nav a {
    font-size: 0.9rem;
  }
  .formatted-article #table-of-contents nav a {
    display: block;
    color: #0375b4;
  }
  .formatted-article #table-of-contents nav a:before {
    display: inline-block;
  }
  .formatted-article #table-of-contents nav a.secondary {
    margin-left: 10px;
  }
  .formatted-article #table-of-contents nav a.primary {
    margin-top: 10px;
  }
  .formatted-article .formatted-article-block .editable-textimage-container, .formatted-article .formatted-article-block .text-video {
    max-width: 32%;
  }
  .formatted-article .formatted-article-block .formatted-article-text table {
    width: auto;
    min-width: 50%;
  }
}
@media all and (min-width: 681px) {
  .formatted-article .formatted-article-block {
    clear: left;
  }
}

html {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility !important;
  font-feature-settings: "kern";
  -webkit-font-feature-settings: "kern";
  -moz-font-feature-settings: "kern";
  -moz-font-feature-settings: "kern=1";
  color: #31394a;
  font-size: 16px;
  font-weight: 300;
}
@media all and (min-width: 1025px) {
  html {
    font-size: 15px;
  }
}
@media all and (min-width: 1151px) {
  html {
    font-size: 16px;
  }
}

body {
  color: #31394a;
  overflow-x: hidden;
  overflow-y: scroll;
}
body:not(.widget) {
  background-color: #fafafa;
}
body.noscroll {
  overflow: hidden;
}
body.globalsearch {
  overflow: hidden !important;
}
body.logged-in {
  padding-bottom: 60px;
}
@media all and (min-width: 861px) {
  body:not(.widget) {
    background-color: #f1f1f1;
  }
}

#page-content-background {
  display: none;
}
@media all and (min-width: 861px) {
  #page-content-background {
    grid-row: aggregator-tab-navi-row-start/bottom;
    grid-column: content-col1-start/content-col12-end;
    display: block;
    width: calc(100% + 20px);
    height: 100%;
    margin-left: -10px;
    background-color: #fafafa;
    border-left: 1px solid #ccc;
    border-right: 1px solid #ccc;
  }
}

b {
  font-weight: 700;
}

.ajax-show-on-user-action {
  display: none !important;
}
.ajax-show-on-user-action:before {
  display: none !important;
}

/**
 * Use this class instead of ajax-show-on-user-action if JQuery actions like slideDown() or fadeIn()
 * are applied to the container and therefore !important would keep the container from showing
 */
.ajax-show-on-user-action-js-transition {
  display: none;
}
.ajax-show-on-user-action-js-transition:before {
  display: none;
}

/** The first rows on tablets, desktop, laptop are all the same*/
#grid {
  display: grid;
  display: -ms-grid;
  align-items: start;
  align-content: space-around;
  grid-auto-flow: row;
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  /*############################################
   *## Base: Row and column definition for mobile
   *############################################*/
  grid-template-columns: [flexible-left aside-col-start left logo-col-start language-switch-col-start breadcrumb-col-start globalsearch-active-col-start content-col1-start  headline-col-start tabnavi-col-start footer-col1-start footer-col3-start aggregator-tab-navi-col-start] minmax(0, 1fr) [content-col1-end content-col2-start] minmax(0, 1fr) [content-col2-end content-col3-start language-switch-col-end] minmax(0, 1fr) [globalsearch-col-start content-col3-end content-col4-start] minmax(0, 1fr) [content-col4-end content-col5-start] minmax(0, 1fr) [content-col5-end content-col6-start logo-col-end login-col-start] minmax(0, 1fr) [content-col6-end footer-col1-end footer-col3-end footer-col2-start footer-col4-start content-col7-start] minmax(0, 1fr) [content-col7-end content-col8-start] minmax(0, 1fr) [content-col8-end content-col9-start] minmax(0, 1fr) [content-col9-end content-col10-start orientation-map-col-start login-col-end] minmax(0, 1fr) [content-col10-end  content-col11-start] minmax(0, 1fr) [content-col11-end content-col12-start] minmax(0, 1fr) [orientation-map-col-end content-col12-end footer-col2-end footer-col4-end  headline-col-end  right flexible-right aside-col-end tabnavi-col-end breadcrumb-col-end globalsearch-col-end headline-col-end aggregator-tab-navi-col-end];
  -ms-grid-columns: calc(46px + 9vw) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) 320px;
  grid-template-rows: [headerbanner language-switch-row-start login-row-start logo-row-start] 42px [header login-row-end login-row-end favorites-history-row aggregator-tab-navi-row-start language-switch-row-end logo-row-end] 50px [login-row-end aggregator-tab-navi-row-end breadcrumb-row] 24px [ads-row] auto [headline-row orientation-map-row downloadables] auto [tabnavi-row] auto [ content-row1-start vertical-nav-row-start] auto [content-row1-end content-row2-start] auto [content-row2-end content-row3-start] auto [content-row3-end content-row4-start] auto [content-row4-end content-row5-start] auto [content-row5-end content-row6-start] auto [content-row6-end content-row7-start] auto [content-row7-end content-row8-start] auto [content-row8-end content-row9-start] auto [content-row9-end content-row10-start] auto [content-row10-end content-row11-start] auto [content-row11-end content-row12-start] auto  [content-row12-end content-row13-start] auto  [content-row13-end content-row14-start] auto [vertical-nav-row-end content-row14-end aside-row-start] auto [aside-row-end] auto [footer-row1] auto [footer-row2] auto [bottom];
  -ms-grid-rows: [headerbanner language-switch-row-start login-row-start logo-row-start] 42px [header login-row-end login-row-end favorites-history-row aggregator-tab-navi-row-start language-switch-row-end logo-row-end] 50px [login-row-end aggregator-tab-navi-row-end breadcrumb-row] 24px [ads-row] auto [headline-row orientation-map-row downloadables] auto [tabnavi-row] auto [ content-row1-start vertical-nav-row-start] auto [content-row1-end content-row2-start] auto [content-row2-end content-row3-start] auto [content-row3-end content-row4-start] auto [content-row4-end content-row5-start] auto [content-row5-end content-row6-start] auto [content-row6-end content-row7-start] auto [content-row7-end content-row8-start] auto [content-row8-end content-row9-start] auto [content-row9-end content-row10-start] auto [content-row10-end content-row11-start] auto [content-row11-end content-row12-start] auto  [content-row12-end content-row13-start] auto  [content-row13-end content-row14-start] auto [vertical-nav-row-end content-row14-end aside-row-start] auto [aside-row-end] auto [footer-row1] auto [footer-row2] auto [bottom];
  /*############################################
     *## Grid for Portrait Tablets (no left column) => Burger Menu => navi-left is moved to header grid-area
     *############################################*/
  /*############################################
   *## Grid for Landscape Tablets (no left column)
   *############################################*/
  /*############################################
   *## Laptops => Search is using one less grid cell which makes room to show FavouritesHistoryPanel
   *############################################*/
  /*############################################
   *## Desktops
   *## => AggreagtorTabNavi uses one less grid cell. GlobalSearch uses one more.
   *## => Left and right columns are flanking content to make it not too wide
   *############################################*/
}
@media all and (min-width: 481px) {
  #grid {
    grid-template-columns: [flexible-left left aside-col-start logo-col-start language-switch-col-start breadcrumb-col-start globalsearch-active-col-start content-col1-start  headline-col-start tabnavi-col-start footer-col1-start footer-col3-start aggregator-tab-navi-col-start] minmax(0, 1fr) [content-col1-end content-col2-start] minmax(0, 1fr) [globalsearch-col-start content-col2-end content-col3-start language-switch-col-end] minmax(0, 1fr) [content-col3-end content-col4-start] minmax(0, 1fr) [logo-col-end login-col-start content-col4-end content-col5-start] minmax(0, 1fr) [content-col5-end content-col6-start] minmax(0, 1fr) [content-col6-end footer-col1-end footer-col2-start footer-col3-end footer-col4-start content-col7-start login-col-end] minmax(0, 1fr) [content-col7-end content-col8-start] minmax(0, 1fr) [content-col8-end content-col9-start] minmax(0, 1fr) [content-col9-end content-col10-start] minmax(0, 1fr) [content-col10-end  orientation-map-col-start content-col11-start] minmax(0, 1fr) [content-col11-end content-col12-start] minmax(0, 1fr) [content-col12-end footer-col2-end footer-col4-end orientation-map-col-end right flexible-right aside-col-end tabnavi-col-end breadcrumb-col-end globalsearch-col-end headline-col-end aggregator-tab-navi-col-end];
    -ms-grid-columns: calc(46px + 9vw) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) 320px;
    grid-template-rows: [headerbanner language-switch-row-start login-row-start logo-row-start] 42px [header login-row-end login-row-end favorites-history-row aggregator-tab-navi-row-start language-switch-row-end logo-row-end] 50px [login-row-end aggregator-tab-navi-row-end breadcrumb-row] 24px [ads-row] auto [headline-row orientation-map-row downloadables] auto [tabnavi-row] auto [ content-row1-start vertical-nav-row-start] auto [content-row1-end content-row2-start] auto [content-row2-end content-row3-start] auto [content-row3-end content-row4-start] auto [content-row4-end content-row5-start] auto [content-row5-end content-row6-start] auto [content-row6-end content-row7-start] auto [content-row7-end content-row8-start] auto [content-row8-end content-row9-start] auto [content-row9-end content-row10-start] auto [content-row10-end content-row11-start] auto [content-row11-end content-row12-start] auto  [content-row12-end content-row13-start] auto  [content-row13-end content-row14-start] auto [vertical-nav-row-end content-row14-end aside-row-start] auto [aside-row-end] auto [footer-row1] auto [footer-row2] auto [bottom];
    -ms-grid-rows: [headerbanner language-switch-row-start login-row-start logo-row-start] 42px [header login-row-end login-row-end favorites-history-row aggregator-tab-navi-row-start language-switch-row-end logo-row-end] 50px [login-row-end aggregator-tab-navi-row-end breadcrumb-row] 24px [ads-row] auto [headline-row orientation-map-row downloadables] auto [tabnavi-row] auto [ content-row1-start vertical-nav-row-start] auto [content-row1-end content-row2-start] auto [content-row2-end content-row3-start] auto [content-row3-end content-row4-start] auto [content-row4-end content-row5-start] auto [content-row5-end content-row6-start] auto [content-row6-end content-row7-start] auto [content-row7-end content-row8-start] auto [content-row8-end content-row9-start] auto [content-row9-end content-row10-start] auto [content-row10-end content-row11-start] auto [content-row11-end content-row12-start] auto  [content-row12-end content-row13-start] auto  [content-row13-end content-row14-start] auto [vertical-nav-row-end content-row14-end aside-row-start] auto [aside-row-end] auto [footer-row1] auto [footer-row2] auto [bottom];
  }
}
@media all and (min-width: 681px) {
  #grid {
    grid-column-gap: 10px;
    grid-row-gap: 10px;
    grid-template-columns: [flexible-left left aside-col-start logo-col-start language-switch-col-start breadcrumb-col-start globalsearch-active-col-start content-col1-start  headline-col-start tabnavi-col-start footer-col1-start aggregator-tab-navi-col-start] minmax(0, 1fr) [content-col1-end content-col2-start] minmax(0, 1fr) [content-col2-end content-col3-start login-col-start logo-col-end] minmax(0, 1fr) [content-col3-end content-col4-start language-switch-col-end login-col-end footer-col1-end footer-col2-start] minmax(0, 1fr) [content-col4-end content-col5-start] minmax(0, 1fr) [content-col5-end content-col6-start] minmax(0, 1fr) [content-col6-end content-col7-start footer-col2-end footer-col3-start] minmax(0, 1fr) [content-col7-end content-col8-start] minmax(0, 1fr) [content-col8-end content-col9-start] minmax(0, 1fr) [footer-col3-end footer-col4-start content-col9-end content-col10-start globalsearch-col-start] minmax(0, 1fr) [content-col10-end content-col11-start headline-col-end orientation-map-col-start] minmax(0, 1fr) [content-col11-end content-col12-start] minmax(0, 1fr) [content-col12-end footer-col4-end login-col-start right flexible-right aside-col-end tabnavi-col-end  login-col-end  breadcrumb-col-end orientation-map-col-end globalsearch-col-end aggregator-tab-navi-col-end];
    -ms-grid-columns: calc(46px + 9vw) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) 320px;
    grid-template-rows: [headerbanner language-switch-row-start login-row-start] 20px [header login-row-end logo-row-start login-row-end favorites-history-row aggregator-tab-navi-row-start language-switch-row-end] 74px [logo-row-end login-row-end aggregator-tab-navi-row-end breadcrumb-row] 24px [ads-row] auto [headline-row downloadables orientation-map-row] auto [tabnavi-row] auto [ content-row1-start vertical-nav-row-start] auto [content-row1-end content-row2-start] auto [content-row2-end content-row3-start] auto [content-row3-end content-row4-start] auto [content-row4-end content-row5-start] auto [content-row5-end content-row6-start] auto [content-row6-end content-row7-start] auto [content-row7-end content-row8-start] auto [content-row8-end content-row9-start] auto [content-row9-end content-row10-start] auto [content-row10-end content-row11-start] auto [content-row11-end content-row12-start] auto  [content-row12-end content-row13-start] auto  [content-row13-end content-row14-start] auto [vertical-nav-row-end content-row14-end aside-row-start] auto [aside-row-end] auto [footer-row1 footer-row2] auto [bottom];
    -ms-grid-rows: [headerbanner language-switch-row-start login-row-start] 20px [header login-row-end logo-row-start login-row-end favorites-history-row aggregator-tab-navi-row-start language-switch-row-end] 74px [logo-row-end login-row-end aggregator-tab-navi-row-end breadcrumb-row] 24px [ads-row] auto [headline-row downloadables orientation-map-row] auto [tabnavi-row] auto [ content-row1-start vertical-nav-row-start] auto [content-row1-end content-row2-start] auto [content-row2-end content-row3-start] auto [content-row3-end content-row4-start] auto [content-row4-end content-row5-start] auto [content-row5-end content-row6-start] auto [content-row6-end content-row7-start] auto [content-row7-end content-row8-start] auto [content-row8-end content-row9-start] auto [content-row9-end content-row10-start] auto [content-row10-end content-row11-start] auto [content-row11-end content-row12-start] auto  [content-row12-end content-row13-start] auto  [content-row13-end content-row14-start] auto [vertical-nav-row-end content-row14-end aside-row-start] auto [aside-row-end] auto [footer-row1 footer-row2] auto [bottom];
  }
}
@media all and (min-width: 861px) {
  #grid {
    grid-template-columns: [flexible-left left logo-col-start language-switch-col-start footer-col1-start breadcrumb-col-start globalsearch-active-col-start content-col1-start  headline-col-start tabnavi-col-start aggregator-tab-navi-col-start] minmax(0, 1fr) [content-col1-end content-col2-start login-col-start] minmax(0, 1fr) [content-col2-end content-col3-start language-switch-col-end] minmax(0, 1fr) [content-col3-end content-col4-start footer-col1-end footer-col2-start] minmax(0, 1fr) [logo-col-end login-col-end content-col4-end content-col5-start] minmax(0, 1fr) [content-col5-end content-col6-start] minmax(0, 1fr) [content-col6-end content-col7-start footer-col2-end footer-col3-start] minmax(0, 1fr) [content-col7-end content-col8-start] minmax(0, 1fr) [content-col8-end content-col9-start] minmax(0, 1fr) [content-col9-end content-col10-start footer-col3-end footer-col4-start] minmax(0, 1fr) [content-col10-end content-col11-start] minmax(0, 1fr) [content-col11-end content-col12-start] minmax(0, 1fr) [content-col12-end aside-col-start headline-col-end login-col-start globalsearch-col-start orientation-map-col-start tabnavi-col-end footer-col4-end breadcrumb-col-end] calc(150px + 8vw) [right flexible-right aside-col-end login-col-end globalsearch-col-end orientation-map-col-end aggregator-tab-navi-col-end];
    -ms-grid-columns: calc(46px + 9vw) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) calc(150px + 8vw);
    grid-template-rows: [headerbanner language-switch-row-start login-row-start] 20px [header login-row-end logo-row-start login-row-end favorites-history-row aggregator-tab-navi-row-start language-switch-row-end] 74px [logo-row-end login-row-end aggregator-tab-navi-row-end breadcrumb-row] 24px [ads-row orientation-map-row] auto [headline-row downloadables aside-row-start] auto [tabnavi-row] auto [ content-row1-start vertical-nav-row-start] auto [content-row1-end content-row2-start] auto [content-row2-end content-row3-start] auto [content-row3-end content-row4-start] auto [content-row4-end content-row5-start] auto [content-row5-end content-row6-start] auto [content-row6-end content-row7-start] auto [content-row7-end content-row8-start] auto [content-row8-end content-row9-start] auto [content-row9-end content-row10-start] auto [content-row10-end content-row11-start] auto [content-row11-end content-row12-start] auto  [content-row12-end content-row13-start] auto  [content-row13-end content-row14-start] auto [vertical-nav-row-end content-row14-end ] auto [footer-row1 footer-row2] auto [aside-row-end bottom];
    -ms-grid-rows: [headerbanner language-switch-row-start login-row-start] 20px [header login-row-end logo-row-start login-row-end favorites-history-row aggregator-tab-navi-row-start language-switch-row-end] 74px [logo-row-end login-row-end aggregator-tab-navi-row-end breadcrumb-row] 24px [ads-row orientation-map-row] auto [headline-row downloadables aside-row-start] auto [tabnavi-row] auto [ content-row1-start vertical-nav-row-start] auto [content-row1-end content-row2-start] auto [content-row2-end content-row3-start] auto [content-row3-end content-row4-start] auto [content-row4-end content-row5-start] auto [content-row5-end content-row6-start] auto [content-row6-end content-row7-start] auto [content-row7-end content-row8-start] auto [content-row8-end content-row9-start] auto [content-row9-end content-row10-start] auto [content-row10-end content-row11-start] auto [content-row11-end content-row12-start] auto  [content-row12-end content-row13-start] auto  [content-row13-end content-row14-start] auto [vertical-nav-row-end content-row14-end ] auto [footer-row1 footer-row2] auto [aside-row-end bottom];
  }
}
@media all and (min-width: 1025px) {
  #grid {
    grid-template-columns: [flexible-left left logo-col-start language-switch-col-start footer-col1-start globalsearch-active-col-start breadcrumb-col-start content-col1-start  headline-col-start tabnavi-col-start] minmax(0, 1fr) [content-col1-end content-col2-start] minmax(0, 1fr) [language-switch-col-end content-col2-end content-col3-start login-col-start] minmax(0, 1fr) [content-col3-end footer-col1-end footer-col2-start content-col4-start login-col-end logo-col-end aggregator-tab-navi-col-start] minmax(0, 1fr) [content-col4-end content-col5-start] minmax(0, 1fr) [content-col5-end content-col6-start] minmax(0, 1fr) [content-col6-end content-col7-start footer-col2-end footer-col3-start] minmax(0, 1fr) [content-col7-end content-col8-start] minmax(0, 1fr) [content-col8-end content-col9-start] minmax(0, 1fr) [content-col9-end content-col10-start footer-col3-end footer-col4-start] minmax(0, 1fr) [content-col10-end content-col11-start headline-col-end orientation-map-col-start] minmax(0, 1fr) [content-col11-end content-col12-start] minmax(0, 1fr) [content-col12-end tabnavi-col-end footer-col4-end favorites-history-col-start breadcrumb-col-end aside-col-start orientation-map-col-end aggregator-tab-navi-col-end globalsearch-col-start] 320px [favorites-history-col-end right flexible-right aside-col-end login-col-end globalsearch-col-end];
    -ms-grid-columns: calc(46px + 9vw) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) 320px;
    grid-template-rows: [headerbanner language-switch-row-start login-row-start] 20px [header login-row-end logo-row-start login-row-end favorites-history-row aggregator-tab-navi-row-start language-switch-row-end] 74px [logo-row-end login-row-end aggregator-tab-navi-row-end breadcrumb-row] 24px [ads-row] auto [headline-row orientation-map-row downloadables aside-row-start] auto [tabnavi-row] auto [ content-row1-start vertical-nav-row-start] auto [content-row1-end content-row2-start] auto [content-row2-end content-row3-start] auto [content-row3-end content-row4-start] auto [content-row4-end content-row5-start] auto [content-row5-end content-row6-start] auto [content-row6-end content-row7-start] auto [content-row7-end content-row8-start] auto [content-row8-end content-row9-start] auto [content-row9-end content-row10-start] auto [content-row10-end content-row11-start] auto [content-row11-end content-row12-start] auto  [content-row12-end content-row13-start] auto  [content-row13-end content-row14-start] auto [vertical-nav-row-end content-row14-end ] auto [footer-row1 footer-row2] auto [aside-row-end bottom];
    -ms-grid-rows: [headerbanner language-switch-row-start login-row-start] 20px [header login-row-end logo-row-start login-row-end favorites-history-row aggregator-tab-navi-row-start language-switch-row-end] 74px [logo-row-end login-row-end aggregator-tab-navi-row-end breadcrumb-row] 24px [ads-row] auto [headline-row orientation-map-row downloadables aside-row-start] auto [tabnavi-row] auto [ content-row1-start vertical-nav-row-start] auto [content-row1-end content-row2-start] auto [content-row2-end content-row3-start] auto [content-row3-end content-row4-start] auto [content-row4-end content-row5-start] auto [content-row5-end content-row6-start] auto [content-row6-end content-row7-start] auto [content-row7-end content-row8-start] auto [content-row8-end content-row9-start] auto [content-row9-end content-row10-start] auto [content-row10-end content-row11-start] auto [content-row11-end content-row12-start] auto  [content-row12-end content-row13-start] auto  [content-row13-end content-row14-start] auto [vertical-nav-row-end content-row14-end ] auto [footer-row1 footer-row2] auto [aside-row-end bottom];
  }
}
@media all and (min-width: 1151px) {
  #grid {
    grid-template-columns: [flexible-left left logo-col-start language-switch-col-start globalsearch-active-col-start breadcrumb-col-start content-col1-start  headline-col-start tabnavi-col-start footer-col1-start] minmax(0, 1fr) [content-col1-end content-col2-start] minmax(0, 1fr) [language-switch-col-end content-col2-end content-col3-start login-col-start] minmax(0, 1fr) [login-col-start content-col3-end content-col4-start footer-col1-end footer-col2-start logo-col-end aggregator-tab-navi-col-start login-col-end ] minmax(0, 1fr) [content-col4-end content-col5-start] minmax(0, 1fr) [content-col5-end content-col6-start] minmax(0, 1fr) [content-col6-end footer-col2-end footer-col3-start content-col7-start] minmax(0, 1fr) [content-col7-end content-col8-start] minmax(0, 1fr) [content-col8-end content-col9-start] minmax(0, 1fr) [content-col9-end footer-col3-end footer-col4-start content-col10-start aggregator-tab-navi-col-end globalsearch-col-start] minmax(0, 1fr) [content-col10-end content-col11-start headline-col-end orientation-map-col-start] minmax(0, 1fr) [content-col11-end content-col12-start] minmax(0, 1fr) [content-col12-end favorites-history-col-start footer-col4-end aside-col-start orientation-map-col-end globalsearch-col-end tabnavi-col-end breadcrumb-col-end] 320px [favorites-history-col-end right flexible-right aside-col-end login-col-end];
    -ms-grid-columns: calc(46px + 9vw) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) 320px;
  }
}
@media all and (min-width: 1401px) {
  #grid {
    grid-column-gap: 10px;
    grid-template-columns: [flexible-left left logo-col-start language-switch-col-start globalsearch-active-col-start] 2fr [breadcrumb-col-start language-switch-col-end content-col1-start  headline-col-start tabnavi-col-start footer-col1-start login-col-start] 72px [content-col1-end content-col2-start logo-col-end aggregator-tab-navi-col-start login-col-end] 72px [content-col2-end content-col3-start] 72px [content-col3-end content-col4-start footer-col1-end footer-col2-start] 72px [content-col4-end content-col5-start] 72px [content-col5-end content-col6-start] 72px [content-col6-end footer-col2-end footer-col3-start content-col7-start] 72px [content-col7-end content-col8-start] 72px [content-col8-end content-col9-start aggregator-tab-navi-col-end globalsearch-col-start] 72px [content-col9-end footer-col3-end footer-col4-start content-col10-start] 72px [content-col10-end headline-col-end orientation-map-col-start content-col11-start] 72px [content-col11-end content-col12-start] 72px [content-col12-end tabnavi-col-end footer-col4-end aside-col-start orientation-map-col-end globalsearch-col-end favorites-history-col-start] 320px [right favorites-history-col-end aside-col-end breadcrumb-col-end] 1fr [flexible-right];
    -ms-grid-columns: calc(46px + 9vw) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) 320px;
  }
}
@media all and (min-width: 1751px) {
  #grid {
    grid-template-columns: [flexible-left left logo-col-start language-switch-col-start globalsearch-active-col-start] 1fr [logo-col-end aggregator-tab-navi-col-start globalsearch-active-col-start breadcrumb-col-start language-switch-col-end login-col-start content-col1-start  headline-col-start tabnavi-col-start footer-col1-start] 72px [login-col-end content-col1-end content-col2-start] 72px [content-col2-end content-col3-start] 72px [content-col3-end content-col4-start footer-col1-end footer-col2-start] 72px [content-col4-end content-col5-start] 72px [content-col5-end content-col6-start] 72px [content-col6-end footer-col2-end footer-col3-start content-col7-start] 72px [content-col7-end content-col8-start] 72px [content-col8-end content-col9-start aggregator-tab-navi-col-end globalsearch-col-start] 72px [content-col9-end footer-col3-end footer-col4-start content-col10-start] 72px [content-col10-end headline-col-end orientation-map-col-start content-col11-start] 72px [content-col11-end content-col12-start] 72px [globalsearch-col-end tabnavi-col-end favorites-history-col-start content-col12-end footer-col4-end aside-col-start orientation-map-col-end] 320px [favorites-history-col-end right aside-col-end breadcrumb-col-end] 1fr [flexible-right];
    -ms-grid-columns: calc(46px + 9vw) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) 320px;
  }
}

/**
 * Hack Container which is placed in flexible-left column and vertical-nav-row-start to trick browsers not to collapse row in Desktop screen width
 */
#hack-fix-collapsing-row {
  grid-row: vertical-nav-row-start/vertical-nav-row-end;
  grid-column: flexible-left/flexible-right;
  -ms-grid-column: 1;
}

/*############################################
 *## Fallback for browsers without grid support
 *############################################*/
@supports not (display: grid) {
  #grid {
    position: relative;
    max-width: 1600px;
    height: 2000px;
  }
  #logo {
    position: fixed;
    top: 0;
    width: 100px;
  }
  #aggregator-geo-navigation {
    position: fixed;
    top: 0;
    left: 200px;
    width: 400px;
  }
  #search {
    position: fixed;
    top: 0;
    left: 600px;
    background-color: red;
  }
  #favorites-history-panel {
    position: fixed;
    top: 0;
    left: 900px;
    background-color: red;
  }
  #login {
    position: fixed;
    top: 0;
    left: 1000px;
    background-color: red;
  }
  #language-switch {
    position: fixed;
    top: 0;
    left: 1100px;
    background-color: red;
  }
  #headline {
    position: absolute;
    left: 25%;
    top: 100px;
    width: 50%;
  }
  #downloadables {
    position: absolute;
    left: 75%;
    top: 100px;
    width: 25%;
  }
  #orientation {
    position: absolute;
    left: 0;
    width: 25%;
    top: 100px;
  }
  #tabnavi {
    position: absolute;
    left: 25%;
    top: 140px;
    width: 50%;
  }
  #navi-left {
    position: absolute;
    left: 0;
    top: 240px;
    width: 140px;
  }
  #main-image {
    position: absolute;
    left: 140px;
    top: 240px;
    width: 60%;
  }
  #entity-map {
    position: absolute;
    right: 140px;
    top: 240px;
    width: 20%;
  }
  #text {
    position: absolute;
    left: 140px;
    top: 562px;
    width: 80%;
    height: 400px;
  }
  #images {
    position: absolute;
    left: 140px;
    top: 983px;
    width: 80%;
  }
  #comments {
    position: absolute;
    left: 140px;
    top: 1083px;
  }
  #carousel-ads {
    position: absolute;
    right: 0;
    top: 200px;
  }
  #awards {
    position: absolute;
    right: 0;
    top: 600px;
  }
  #footer-block1 {
    width: 25%;
    position: absolute;
    bottom: 0;
    left: 0;
  }
  #footer-block2 {
    width: 25%;
    position: absolute;
    bottom: 0;
    left: 25%;
  }
  #footer-block3 {
    width: 25%;
    position: absolute;
    bottom: 0;
    left: 50%;
  }
  #footer-block4 {
    width: 25%;
    position: absolute;
    bottom: 0;
    left: 75%;
  }
}
.common.index #divider-teaser, .common.index #page-content-background, .common.index #headerbanner-background, .common.index #whats-hot, .common.index #heat-map-background, .common.index #heat-map-fresh-snow, .common.index #heat-map-snow-height, .common.index #heat-map-sunshine-forecast, .common.index #heat-map-deep-links, .common.index #advanced-entity-search-preview,
.common.index #main-nav, .common.index #blog-article-overview, .common.index #sweepstake-overview, .common.index #cool-and-new-container, .common.index #user-reviews, .common.index #hack-fix-collapsing-row, .common.index .footer-block {
  z-index: 5;
  -webkit-transform: translate3d(0, 0, 0);
}
.common.index .heatmapbox-container.fullscreen {
  z-index: 50 !important;
}
.common.index #contrast-block-carousel-ads {
  z-index: 8 !important;
}
.common.index #header-background {
  z-index: 10;
}
.common.index #main-nav {
  z-index: 15;
}
.common.index #main-nav.toggled-visible {
  z-index: 100 !important;
}
.common.index #splitad {
  z-index: 3;
}

/*############################################
 *## Indicators and styles which are represented by a certain color or background color
 *## and which indicate different things like sunshine duration, snow amount, entity difficulty, ...
 *############################################*/
.weather-indicator {
  white-space: nowrap;
}
.weather-indicator.invertFontColor, .weather-indicator.invertFontColor .label {
  color: #ffffff !important;
}
.weather-indicator.thunderstorm1 {
  background-color: #ffd1b3;
}
.weather-indicator.thunderstorm2 {
  background-color: #ffafaf;
}
.weather-indicator.thunderstorm3 {
  background-color: #fc5a5a;
}
.weather-indicator.thunderstorm4 {
  background-color: #ff0000;
}
.weather-indicator.thunderstorm5 {
  background-color: #b248b5;
}
.weather-indicator.thunderstorm6 {
  background-color: #9f17a5;
}
.weather-indicator.sunshine1 {
  background-color: #ccc;
}
.weather-indicator.sunshine2 {
  background-color: #fafafa;
}
.weather-indicator.sunshine3 {
  background-color: #ffffb1;
}
.weather-indicator.sunshine4 {
  background-color: #fcfc5e;
}
.weather-indicator.sunshine5 {
  background-color: #ffff00;
}
.weather-indicator.snow1, .weather-indicator.snow2 {
  background: #ffffff;
}
.weather-indicator.snow3, .weather-indicator.snow4 {
  background: #f1f1f1;
}
.weather-indicator.snow5, .weather-indicator.snow6 {
  background: #ccc;
}
.weather-indicator.snow7, .weather-indicator.snow8 {
  background: #727272;
}
.weather-indicator.snow9 {
  background: #31394a;
}
.weather-indicator.rain1, .weather-indicator.rain2 {
  background: #c7e2f6;
}
.weather-indicator.rain3, .weather-indicator.rain4 {
  background: #7ab8e5;
}
.weather-indicator.rain5, .weather-indicator.rain6 {
  background: #49a0e0;
}
.weather-indicator.rain7, .weather-indicator.rain8 {
  background: #597ac4;
}
.weather-indicator.rain9 {
  background: #1042b5;
}

.temp-min, .temp-negative {
  color: #1042b5;
}

.temp-max, .temp-positive {
  color: #ff0000;
}

.windspeed-warning {
  color: #b95252 !important;
}

.entity-difficulty {
  text-align: center;
  color: #FFF;
  padding: 6px 10px;
}
.entity-difficulty.easy {
  background-color: #1042b5;
}
.entity-difficulty.intermediate {
  background-color: #ff0000;
}
.entity-difficulty.hard {
  background-color: #000;
}

/*## layout/sections                     #####*/
#headerbanner-background {
  grid-row: headerbanner;
  grid-column: flexible-left/flexible-right;
  -ms-grid-column: 1;
  width: 100%;
  height: 100%;
  position: relative;
  height: calc(100% + 8px + 0px);
  padding-bottom: 8px;
  z-index: 10;
  background-color: #ffffff;
}
@media all and (min-width: 681px) {
  #headerbanner-background {
    height: calc(100% + 10px + 0px);
    padding-bottom: 10px;
  }
}
@media all and (min-width: 681px) {
  #headerbanner-background {
    background-color: #0375b4;
  }
}

#header-background {
  grid-row: header;
  -ms-grid-row: 1;
  grid-column: flexible-left/flexible-right;
  -ms-grid-column: 1;
  width: 100%;
  background-color: #0375b4;
  -webkit-box-shadow: 1px 0 2px 1px #727272;
  box-shadow: 1px 0 2px 1px #727272;
  height: 100%;
}
@media all and (min-width: 681px) {
  #header-background {
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    z-index: 3;
    background-color: #ffffff;
  }
}
@media all and (min-width: 1) and (max-width: 0) {
  #header-background {
    position: relative;
    height: calc(100% + 8px + 0px);
    padding-bottom: 8px;
  }
}
@media all and (min-width: 1) and (max-width: 0) and (min-width: 681px) {
  #header-background {
    height: calc(100% + 10px + 0px);
    padding-bottom: 10px;
  }
}

body.ajax-search-active #header-background {
  display: none;
}
@media all and (min-width: 681px) {
  body.ajax-search-active #header-background {
    display: block;
  }
}

aside {
  overflow-y: hidden;
  grid-row: aside-row-start/aside-row-end;
  grid-column: aside-col-start/aside-col-end;
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: flex;
  -webkit-flex-direction: column;
  -webkit-box-orient: vertical; /* Safari <= 6*/
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  -o-flex-direction: column;
  flex-direction: column;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: nowrap;
  -webkit-flex-wrap: nowrap;
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
}
@media all and (min-width: 861px) {
  aside {
    padding: 0 10px;
    margin-top: -10px;
  }
}
aside > div {
  margin-bottom: 8px !important;
}
@media all and (min-width: 861px) {
  aside > div {
    margin: 0 0 20px 0 !important;
  }
}

@media all and (min-width: 681px) {
  .index aside #survey-overview {
    display: none;
  }
}
@media all and (min-width: 861px) {
  .index aside {
    grid-row: breadcrumb-row/aside-row-end;
    grid-column: aside-col-start/aside-col-end;
  }
}
@media all and (min-width: 1301px) {
  .index aside #halfpage-ad {
    display: none;
  }
}

@media all and (min-width: 861px) {
  .index aside, .entityreviews aside, .entityzoomableimage aside, .entitypricesandopeninghours aside,
  .entityimagegallery aside, .entitywall aside, .entityvacancy aside, .advancedpecusearch aside, .sweepstakeoverview aside, .aggregatorentity.c_skischool aside {
    position: -webkit-sticky;
    position: sticky;
    top: 74px;
    z-index: 4;
  }
}

#facts {
  grid-row: content-row2-start/content-row7-end;
  grid-column: content-col1-start/content-col12-end;
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: flex;
  -webkit-flex-direction: column;
  -webkit-box-orient: vertical; /* Safari <= 6*/
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  -o-flex-direction: column;
  flex-direction: column;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: nowrap;
  -webkit-flex-wrap: nowrap;
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
}
@media all and (min-width: 481px) {
  #facts {
    background-color: #f1f1f1;
    padding: 10px;
    display: grid;
    grid-gap: 10px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  #facts > div {
    padding: 10px;
    background-color: #ffffff;
    margin: 0;
    display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
    display: -webkit-flex; /* Safari 7*/
    display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
    display: -ms-flexbox; /* IE10 */
    display: flex;
    -webkit-flex-direction: column;
    -webkit-box-orient: vertical; /* Safari <= 6*/
    -moz-flex-direction: column;
    -ms-flex-direction: column;
    -o-flex-direction: column;
    flex-direction: column;
    -webkit-align-items: stretch;
    -moz-align-items: stretch;
    -ms-align-items: stretch;
    -o-align-items: stretch;
    align-items: stretch;
    -webkit-justify-content: space-between;
    -moz-justify-content: space-between;
    -o-justify-content: space-between;
    -ms-justify-content: space-between;
    justify-content: space-between;
    flex-wrap: nowrap;
    -webkit-flex-wrap: nowrap;
    /* Legacy Browsers (IE 10)*/
    -webkit-box-pack: justify;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-box-align: center;
    -moz-box-align: center;
    -ms-flex-align: center;
  }
  #facts > div .collapsible-content {
    height: 100%;
  }
  #facts > div .collapsible-content .condition-box {
    display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
    display: -webkit-flex; /* Safari 7*/
    display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
    display: -ms-flexbox; /* IE10 */
    display: flex;
    -webkit-flex-direction: column;
    -webkit-box-orient: vertical; /* Safari <= 6*/
    -moz-flex-direction: column;
    -ms-flex-direction: column;
    -o-flex-direction: column;
    flex-direction: column;
    -webkit-align-items: stretch;
    -moz-align-items: stretch;
    -ms-align-items: stretch;
    -o-align-items: stretch;
    align-items: stretch;
    -webkit-justify-content: space-between;
    -moz-justify-content: space-between;
    -o-justify-content: space-between;
    -ms-justify-content: space-between;
    justify-content: space-between;
    flex-wrap: nowrap;
    -webkit-flex-wrap: nowrap;
    /* Legacy Browsers (IE 10)*/
    -webkit-box-pack: justify;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-box-align: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    height: 100%;
  }
}
@media all and (min-width: 1025px) {
  #facts {
    display: grid;
    grid-gap: 10px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

/*## layout/webfonts                     #####*/
.ui-icon-delete:before, .ui-icon-remove-circle:before {
  content: "\f12a";
}

.ui-icon-trash:before {
  content: "\f014";
}

.ui-icon-edit:before {
  content: "\f044";
}

.ui-icon-close:before {
  content: "\f12a";
}

.ui-icon-filter:before, .ui-icon-configurator:before {
  content: "\f1de";
}

.ui-icon-cog:before {
  content: "\f013";
}

.ui-icon-remove:before {
  content: "\f2d7";
}

.ui-icon-plus:before {
  content: "\f0fe";
}

.ui-icon-back:before {
  content: "\f30a";
}

.ui-icon-signin:before {
  content: "\f023";
}

.ui-icon-signout:before {
  content: "\f08b";
}

.ui-icon-refresh:before {
  content: "\f2f9";
}

.ui-icon-save:before {
  content: "\f0c7";
}

.ui-icon-translate:before {
  content: "\e91b";
}

/*############################################
 *## Next Hospital, Trainstation, Airport
 *############################################*/
.ui-icon-hospital:before {
  content: "\f0fa";
}

.ui-icon-airport:before {
  content: "\f072";
}

.ui-icon-trainstation:before {
  content: "\f238";
}

.ui-icon-mail:before {
  content: "\f003";
}

.ui-icon-web:before {
  content: "\e91b";
}

.ui-icon-tel:before {
  content: "\f4b8";
}

.ui-icon-angle-up:before, .ui-icon-caret-up:before {
  content: "\f077";
}

.ui-icon-angle-down:before, .ui-icon-caret-down:before, .ui-icon-angle-down-after:after {
  content: "\f078";
}

.ui-icon-angle-left:before, .ui-icon-caret-left:before, .ui-icon-circle-triangle-w:before {
  content: "\f053";
}

.ui-icon-angle-right:before, .ui-icon-circle-triangle-e:before, .arrow:before, .ui-icon-angle-right-after:after, .ui-icon-caret-right:before {
  content: "\f054";
}

.ui-icon-arrows:before {
  content: "\f101";
}

.ui-icon-double-arrow-left:before {
  content: "\f100";
}

.ui-icon-double-arrow-left-after:after {
  content: "\f100";
}

.ui-icon-double-arrow-right:before {
  content: "\f101";
}

.ui-icon-double-arrow-right-after:after {
  content: "\f101";
}

.ui-icon-directions:before {
  content: "\f5eb";
}

.bull:before {
  content: "•";
}

.ui-icon-rotate-left:before {
  content: "\f0e2";
}

.ui-icon-rotate-right:before {
  content: "\f01e";
}

.ui-icon-info:before {
  content: "\f05a";
}

.ui-icon-warning:before {
  content: "\f071";
}

.ui-icon-warning-after:after {
  content: "\f071";
}

.ui-icon-error:before {
  content: "\f071";
}

.ui-icon-error-after:after {
  content: "\f071";
}

.ui-icon-success:before {
  content: "\f120";
}

.ui-icon-success-after:after {
  content: "\f120";
}

/*############################################
 *## Plain icons (no circle or rectangle around)
 *############################################*/
.ui-icon-success-plain:before {
  content: "\f383";
}

.ui-icon-error-plain:before {
  content: "\f2d7";
}

.ui-icon-success-plain-after:after {
  content: "\f383";
}

.ui-icon-error-plain-after:after {
  content: "\f2d7";
}

/*############################################
 *## Icons used on Maps
 *############################################*/
.ui-icon-fullscreen-true:before {
  content: "\f12a";
}

.ui-icon-fullscreen-false:before {
  content: "\f25e";
}

.ui-icon-globe:before {
  content: "\f0ac";
}

.ui-icon-map-marker:before {
  content: "\f042";
}

.ui-icon-layers:before {
  content: "\f229";
}

.ui-icon-zoom-in:before {
  content: "\f2c7";
}

.ui-icon-zoom-out:before {
  content: "\f2f4";
}

.ui-icon-zoom-in-loupe:before {
  content: "\e91d";
}

.ui-icon-zoom-out-loupe:before {
  content: "\e91c";
}

.ui-icon-play:before {
  content: "\f04b";
}

.ui-icon-stop:before {
  content: "\f04d";
}

.ui-icon-share:before {
  content: "\f3ac";
}

.ui-icon-facebook:before {
  content: "\f09a";
}

.ui-icon-twitter:before {
  content: "\f099";
}

.ui-icon-youtube:before {
  content: "\f167";
}

.ui-icon-instagram:before {
  content: "\ea92";
}

.ui-icon-blog:before {
  content: "\e602";
}

.ui-icon-heart:before {
  content: "\f004";
}

.ui-icon-star:before {
  content: "\f005";
}

.ui-icon-comment:before {
  content: "\e621";
}

.ui-icon-thumbs-up:before,
.ui-icon-thumbs-up-empty:before {
  content: "\f087";
}

.ui-icon-thumbs-down:before,
.ui-icon-thumbs-down-empty:before {
  content: "\f088";
}

.ui-icon-minus-circle:before {
  content: "\f056";
}

.ui-icon-plus-circle:before {
  content: "\f055";
}

.ui-icon-xing:before {
  content: "\f168";
}

.ui-icon-linked-in:before {
  content: "\f08c";
}

.ui-icon-check:before {
  content: "\f383";
}

.ui-icon-check-after:after {
  content: "\f383";
}

.ui-icon-missing:before, .ui-icon-unknown:before {
  content: "\f059";
}

.ui-icon-cheapest:before {
  content: "\e911";
}

.ui-icon-familyfriendly:before {
  content: "\e912";
}

.ui-icon-largest:before {
  content: "\f25e";
}

.ui-icon-highestlocated:before {
  content: "\e90f";
}

.ui-icon-snowguaranteed:before {
  content: "\f4ae";
}

.ui-icon-best:before {
  content: "\f005";
}

.ui-icon-currentlyopen:before {
  content: "\f120";
}

.ui-icon-priceperformance:before {
  content: "\f163";
}

.ui-icon-windspeed:before {
  content: "\e90d";
}

.ui-icon-sun:before {
  content: "\e6e5";
}

.ui-icon-snow:before {
  content: "\f4ae";
}

.ui-icon-snow-mountain:before {
  content: "\e631";
}

.ui-icon-rain:before {
  content: "\e6d7";
}

.ui-icon-windrose:before {
  content: "(";
}

.ui-icon-bolt:before {
  content: "\f0e7";
}

.ui-icon-fog:before {
  content: "\e6e0";
}

.ui-icon-panoramic:before {
  content: "\e641";
}

.ui-icon-stream:before {
  content: "\f03e";
}

.ui-icon-camera:before {
  content: "\f03e";
}

@font-face {
  font-family: "TourispoWebfonts";
  src: url("/resources/webfonts/tourispo-webfont.eot?v=4.3.0");
  src: url("/resources/webfonts/tourispo-webfont.eot?v=4.3.0") format("embedded-opentype"), url("/resources/webfonts/tourispo-webfont.woff2?v=4.3.0") format("woff2"), url("/resources/webfonts/tourispo-webfont.woff?v=4.3.0") format("woff"), url("/resources/webfonts/tourispo-webfont.ttf?v=4.3.0") format("truetype"), url("/resources/webfonts/tourispo-webfont.svg?v=4.3.0") format("svg");
  font-weight: normal;
  font-style: normal;
}
.icon-with-label, a.arrow, a.bull {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-inline-flex !important; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-inline-flex !important; /* 2012 spec prefixed for iOS7/8 */
  display: inline-flex !important;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: start;
  -moz-box-pack: start;
  -ms-flex-pack: start;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: center;
  -moz-align-items: center;
  -ms-align-items: center;
  -o-align-items: center;
  align-items: center;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: flex-start;
  -moz-justify-content: flex-start;
  -o-justify-content: flex-start;
  -ms-justify-content: flex-start;
  justify-content: flex-start;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
}
.icon-with-label:before, a.arrow:before, a.bull:before {
  margin-right: 4px;
}
.icon-with-label:after, a.arrow:after, a.bull:after {
  margin-left: 4px;
}
.icon-with-label.push-away, a.arrow.push-away, a.bull.push-away {
  justify-content: space-between !important;
}

[class^=ui-icon-]:not(.checkboxicon), [class*=" ui-icon-"]:not(.checkboxicon), [class^=icons-]:not(.checkboxicon), [class*=" icons-"]:not(.checkboxicon), a.arrow:not(.checkboxicon), a.bull:not(.checkboxicon) {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: start;
  -moz-box-pack: start;
  -ms-flex-pack: start;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: center;
  -moz-align-items: center;
  -ms-align-items: center;
  -o-align-items: center;
  align-items: center;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: flex-start;
  -moz-justify-content: flex-start;
  -o-justify-content: flex-start;
  -ms-justify-content: flex-start;
  justify-content: flex-start;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
  line-height: 1;
}
[class^=ui-icon-]:not(.checkboxicon):before, [class*=" ui-icon-"]:not(.checkboxicon):before, [class^=icons-]:not(.checkboxicon):before, [class*=" icons-"]:not(.checkboxicon):before, a.arrow:not(.checkboxicon):before, a.bull:not(.checkboxicon):before {
  font-family: TourispoWebfonts !important;
  font-weight: 400;
  font-style: normal;
  display: inline-block;
}
[class^=ui-icon-]:not(.checkboxicon)[class*=-after]:after, [class*=" ui-icon-"]:not(.checkboxicon)[class*=-after]:after, [class^=icons-]:not(.checkboxicon)[class*=-after]:after, [class*=" icons-"]:not(.checkboxicon)[class*=-after]:after, a.arrow:not(.checkboxicon)[class*=-after]:after, a.bull:not(.checkboxicon)[class*=-after]:after {
  font-family: TourispoWebfonts !important;
  font-weight: 400;
  font-style: normal;
  display: inline-block;
}

.ui-icon-home:before {
  content: "\f015";
}

.ui-icon-bullseye:before {
  content: "\f140";
}

.ui-icon-search:before {
  content: "\f4a4";
}

.ui-icon-menu:before {
  content: "\f20e";
}

.ui-icon-password:before {
  content: "\f084";
}

.ui-icon-print:before {
  content: "\f031";
}

.ui-icon-menu-see-more:before {
  content: "\f141";
}

.ui-icon-more-vertical:before {
  content: "\f397";
}

.ui-icon-more-vertical-after:after {
  content: "\f397";
}

.ui-icon-group:before {
  content: "\f0c0";
}

.ui-icon-history:before {
  content: "\f1da";
}

.ui-icon-lock:before {
  content: "\f023";
}

.ui-icon-cogs:before {
  content: "\f085";
}

.ui-icon-clock:before, .ui-icon-time:before {
  content: "\f017";
}

.ui-icon-picture:before {
  content: "\f148";
}

.ui-icon-unlink:before {
  content: "\f127";
}

.ui-icon-wizard:before {
  content: "\f56c";
}

.ui-icon-bull:before {
  content: "\f111";
}

.ui-icon-calendar:before {
  content: "\f073";
}

.ui-icon-sale:before {
  content: "%";
}

.ui-icon-list:before {
  content: "\f03a";
}

.ui-icon-crawler:before {
  content: "\f188";
}

/*############################################
 *## ECUContact
 *############################################*/
.ui-icon-phone:before {
  content: "\f095";
}

/*############################################
 *## Placeholder images for users (male/female)
 *############################################*/
.ui-icon-user1:before {
  content: "\e617";
}

.ui-icon-user0:before, .ui-icon-user:before {
  content: "\e616";
  text-indent: -1px;
}

/*############################################
 *## Player icons (play, stop, ...)
 *############################################*/
.ui-icon-play:before {
  content: "\f04b";
}

.ui-icon-stop:before {
  content: "\f04d";
}

/*############################################
 *## Different logos of our projects
 *############################################*/
.ui-icon-logo-tourispo:before {
  content: "\e614";
}

.ui-icon-partner-schoeffel:before {
  content: "\e923";
}

.ui-icon-partner-fischer:before {
  content: "\e922";
}

.ui-icon-voelkl:before {
  content: "\e953";
}

.ui-icon-fischer:before {
  content: "\e95e";
}

.ui-icon-atomic:before {
  content: "\e925";
}

.ui-icon-elan:before {
  content: "\e938";
}

.ui-icon-rossignol:before {
  content: "\e947";
}

.ui-icon-dynastar:before {
  content: "\e92a";
}

.ui-icon-k2:before {
  content: "\e93a";
}

.ui-icon-blizzard:before {
  content: "\e94d";
}

.ui-icon-salomon:before {
  content: "\e933";
}

.ui-icon-head:before {
  content: "\e939";
}

.ui-icon-nordica:before {
  content: "\e941";
}

.ui-icon-stoeckli:before {
  content: "\e934";
}

.ui-icon-movement:before {
  content: "\e931";
}

.ui-icon-kaestle:before {
  content: "\e937";
}

.ui-icon-scott:before {
  content: "\e935";
}

.ui-icon-armada:before {
  content: "\e929";
}

.ui-icon-line:before {
  content: "\e92e";
}

.ui-icon-kneissl:before {
  content: "\e92d";
}

.ui-icon-indigo:before {
  content: "\e92c";
}

.ui-icon-black-diamond:before {
  content: "\e936";
}

.ui-icon-amplid:before {
  content: "\e928";
}

.ui-icon-bogner:before {
  content: "\e926";
}

.ui-icon-moment:before {
  content: "\e930";
}

.ui-icon-coreupt:before {
  content: "\e92f";
}

.ui-icon-hagan:before {
  content: "\e92b";
}

.ui-icon-4frnt:before {
  content: "\e927";
}

.ui-icon-pale:before {
  content: "\e932";
}

/*## layout/pecu                         #####*/
[class^=icons-c_weather-].colorful, [class*=" icons-c_weather-"].colorful, [class^=icons-ag_weather-].colorful, [class*=" icons-ag_weather-"].colorful {
  width: 30px;
}
[class^=icons-c_weather-]:before, [class*=" icons-c_weather-"]:before, [class^=icons-ag_weather-]:before, [class*=" icons-ag_weather-"]:before {
  background-image: url("/images/desktop/ecu/content/c_weather/weatherIconsSmall.png");
  background-repeat: no-repeat;
  content: "";
  background-size: 100% auto;
  display: block;
  width: 30px;
  height: 30px;
}

/* Sonnenschein */
.icons-c_weather-a:before, .icons-ag_weather-a:before {
  background-position: 0 0;
}

/* meist sonnig */
.icons-c_weather-b:before, .icons-ag_weather-b:before {
  background-position: 0 1.9%;
}

/* teils sonnig */
.icons-c_weather-c:before, .icons-ag_weather-c:before {
  background-position: 0 3.9%;
}

/* uberwiegend bewolkt */
.icons-c_weather-d:before, .icons-ag_weather-d:before {
  background-position: 0 5.9%;
}

/* bedeckt */
.icons-c_weather-e:before, .icons-ag_weather-e:before {
  background-position: 0 7.8%;
}

/* teils Regen */
.icons-c_weather-f:before, .icons-ag_weather-f:before {
  background-position: 0 9.8%;
}

/* teils starker Regen */
.icons-c_weather-g:before, .icons-ag_weather-g:before {
  background-position: 0 11.7%;
}

/* Regen */
.icons-c_weather-h:before, .icons-ag_weather-h:before {
  background-position: 0 13.6%;
}

/* starker Regen */
.icons-c_weather-i:before, .icons-ag_weather-i:before {
  background-position: 0 15.7%;
}

/* leichter Regen */
.icons-c_weather-j:before, .icons-ag_weather-j:before {
  background-position: 0 17.55%;
}

/* bewolkt */
.icons-c_weather-k:before, .icons-ag_weather-k:before {
  background-position: 0 19.55%;
}

/* teils leichter Schneefall */
.icons-c_weather-l:before, .icons-ag_weather-l:before {
  background-position: 0 21.6%;
}

/* teils Schneefall */
.icons-c_weather-m:before, .icons-ag_weather-m:before {
  background-position: 0 23.5%;
}

/* leichter Schneefall */
.icons-c_weather-n:before, .icons-ag_weather-n:before {
  background-position: 0 25.4%;
}

/* klar(Nacht) */
.icons-c_weather-na:before, .icons-ag_weather-na:before {
  background-position: 0 27.35%;
}

/* meist klar(Nacht) */
.icons-c_weather-nb:before, .icons-ag_weather-nb:before {
  background-position: 0 29.35%;
}

/* teils klar(Nacht) */
.icons-c_weather-nc:before, .icons-ag_weather-nc:before {
  background-position: 0 31.35%;
}

/* uberwiegend bewolkt(Nacht) */
.icons-c_weather-nd:before, .icons-ag_weather-nd:before {
  background-position: 0 33.25%;
}

/* bedeckt(Nacht) */
.icons-c_weather-ne:before, .icons-ag_weather-ne:before {
  background-position: 0 35.25%;
}

/* teils Regen(Nacht)*/
.icons-c_weather-nf:before, .icons-ag_weather-nf:before {
  background-position: 0 37.15%;
}

/* teils starker Regen(Nacht)*/
.icons-c_weather-ng:before, .icons-ag_weather-ng:before {
  background-position: 0 39.15%;
}

/* Regen(Nacht)*/
.icons-c_weather-nh:before, .icons-ag_weather-nh:before {
  background-position: 0 41.1%;
}

/* Starker Regen (Nacht)*/
.icons-c_weather-ni:before, .icons-ag_weather-ni:before {
  background-position: 0 43.1%;
}

/* leichter Regen(Nacht)*/
.icons-c_weather-nj:before, .icons-ag_weather-nj:before {
  background-position: 0 45%;
}

/* bewolkt(Nacht)*/
.icons-c_weather-nk:before, .icons-ag_weather-mk:before {
  background-position: 0 46.95%;
}

/* teils leichter Schneefall(Nacht)*/
.icons-c_weather-nl:before, .icons-ag_weather-nl:before {
  background-position: 0 48.9%;
}

/* teils Schneefall(Nacht)*/
.icons-c_weather-nm:before, .icons-ag_weather-nm:before {
  background-position: 0 50.85%;
}

/* leichter Schneefall(Nacht)*/
.icons-c_weather-nn:before, .icons-ag_weather-nn:before {
  background-position: 0 52.8%;
}

/* Schneefall(Nacht)*/
.icons-c_weather-no:before, .icons-ag_weather-no:before {
  background-position: 0 54.8%;
}

/* starker Schneefall(Nacht)*/
.icons-c_weather-np:before, .icons-ag_weather-np:before {
  background-position: 0 56.75%;
}

/* teils Schneeregen(Nacht)*/
.icons-c_weather-nq:before, .icons-ag_weather-nq:before {
  background-position: 0 58.75%;
}

/* Schneeregen(Nacht)*/
.icons-c_weather-nr:before, .icons-ag_weather-nr:before {
  background-position: 0 60.7%;
}

/* Hochnebel(Nacht)*/
.icons-c_weather-ns:before, .icons-ag_weather-ns:before {
  background-position: 0 62.55%;
}

/* Nebel(Nacht)*/
.icons-c_weather-nt:before, .icons-ag_weather-nt:before {
  background-position: 0 64.55%;
}

/* teils Gewitter(Nacht)*/
.icons-c_weather-nu:before, .icons-ag_weather-nu:before {
  background-position: 0 66.65%;
}

/* Gewitter(Nacht)*/
.icons-c_weather-nv:before, .icons-ag_weather-nv:before {
  background-position: 0 68.55%;
}

/* teils Gewitter u. Schneeregen(Nacht)*/
.icons-c_weather-nw:before, .icons-ag_weather-nw:before {
  background-position: 0 70.55%;
}

/* Gewitter und Schneeregen(Nacht)*/
.icons-c_weather-nx:before, .icons-ag_weather-nx:before {
  background-position: 0 72.45%;
}

/* teils Gewitter und Schnee(Nacht)*/
.icons-c_weather-ny:before, .icons-ag_weather-ny:before {
  background-position: 0 74.45%;
}

/* Schneesturm(Nacht)*/
.icons-c_weather-nz:before, .icons-ag_weather-nz:before {
  background-position: 0 76.35%;
}

/* Schneefall */
.icons-c_weather-o:before, .icons-ag_weather-o:before {
  background-position: 0 78.25%;
}

/* starker Schneefall */
.icons-c_weather-p:before, .icons-ag_weather-p:before {
  background-position: 0 80.25%;
}

/* teils Schneeregen */
.icons-c_weather-q:before, .icons-ag_weather-q:before {
  background-position: 0 82%;
}

/* Schneeregen */
.icons-c_weather-r:before, .icons-ag_weather-r:before {
  background-position: 0 84%;
}

/* Hochnebel */
.icons-c_weather-s:before, .icons-ag_weather-s:before {
  background-position: 0 86.1%;
}

/* Nebel */
.icons-c_weather-t:before, .icons-ag_weather-t:before {
  background-position: 0 88%;
}

/* teils Gewitter */
.icons-c_weather-u:before, .icons-ag_weather-u:before {
  background-position: 0 90%;
}

/* Gewitter */
.icons-c_weather-v:before, .icons-ag_weather-v:before {
  background-position: 0 92%;
}

/* teils Gewitter u. Schneeregen */
.icons-c_weather-w:before, .icons-ag_weather-w:before {
  background-position: 0 93.95%;
}

/* Gewitter und Schneeregen */
.icons-c_weather-x:before, .icons-ag_weather-x:before {
  background-position: 0 95.95%;
}

/* teils Gewitter und Schnee */
.icons-c_weather-y:before, .icons-ag_weather-y:before {
  background-position: 0 97.65%;
}

/* Schneesturm */
.icons-c_weather-z:before, .icons-ag_weather-z:before {
  background-position: 0 99.85%;
}

/*############################################
 *## Feature Icons (like lifts or features of an accommodation)
 *############################################*/
.pecu-facts-icons > div {
  margin-left: 24px;
}

.slope-scale-unit-chooser-container {
  margin-bottom: 10px;
}
.slope-scale-unit-chooser-container .slope-scale-unit-chooser + .slope-scale-unit-chooser {
  margin-top: 14px;
}
.slope-scale-unit-chooser-container .slope-scale-item {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: start;
  -moz-box-pack: start;
  -ms-flex-pack: start;
  -webkit-box-align: stretch;
  -moz-box-align: stretch;
  -ms-flex-align: stretch;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: flex-start;
  -moz-justify-content: flex-start;
  -o-justify-content: flex-start;
  -ms-justify-content: flex-start;
  justify-content: flex-start;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
}
.slope-scale-unit-chooser-container .slope-scale-item + .slope-scale-item {
  margin-top: 6px;
}
@media all and (min-width: 381px) {
  .slope-scale-unit-chooser-container {
    display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
    display: -webkit-flex; /* Safari 7*/
    display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
    display: -ms-flexbox; /* IE10 */
    display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
    display: flex;
    /* Simulating 2012 flexbox model (used in IE 10) */
    /* Legacy Browsers (IE 10)*/
    -webkit-box-pack: justify;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-box-align: stretch;
    -moz-box-align: stretch;
    -ms-flex-align: stretch;
    /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
    /* For understanding browsers */
    -webkit-flex-direction: row;
    -moz-flex-direction: row;
    -ms-flex-direction: row;
    -o-flex-direction: row;
    flex-direction: row;
    -webkit-align-items: stretch;
    -moz-align-items: stretch;
    -ms-align-items: stretch;
    -o-align-items: stretch;
    align-items: stretch;
    -webkit-flex-flow: row nowrap;
    -webkit-justify-content: space-between;
    -moz-justify-content: space-between;
    -o-justify-content: space-between;
    -ms-justify-content: space-between;
    justify-content: space-between;
    flex-wrap: nowrap;
    -ms-flex-wrap: nowrap; /* IE 10 */
    -webkit-flex-wrap: nowrap;
  }
  .slope-scale-unit-chooser-container .slope-scale-unit-chooser + .slope-scale-unit-chooser {
    margin-top: 0;
  }
}

.icons-c_webcam:before {
  content: "\f030";
}

.icons-c_bookingoffer:before, .icons-c_traveloffer:before {
  content: "\f0f2";
}

.ui-icon-ag_skiing:before, .icons-ag_skiing:before, .icons-e_skiresort:before {
  content: "\e916";
}

.ui-icon-ag_xcskiing:before, .icons-e_xcskiing:before {
  content: "\e60d";
}

.ui-icon-ag_lodging:before, .icons-e_accommodation:before {
  content: "\e91a";
}

.ui-icon-p_ski:before {
  content: "\e90a";
}

.ui-icon-skilift-tbar:before, .ui-icon-skilift-tbar-after:after {
  content: "\e612";
}

.ui-icon-skilift-chair:before, .ui-icon-skilift-chair-after:after {
  content: "\e60f";
}

.ui-icon-skilift-gondola:before, .ui-icon-skilift-gondola-after:after {
  content: "\e611";
}

.ui-icon-skilift-funicular:before, .ui-icon-skilift-funicular-after:after {
  content: "\e60c";
}

.ui-icon-skilift-aerial-tram:before, .ui-icon-skilift-aerial-tram-after:after {
  content: "\e60b";
}

.ui-icon-skilift-ropetow:before, .ui-icon-skilift-ropetow-after:after {
  content: "\e610";
}

.ui-icon-skilift-magic-carpet:before, .ui-icon-skilift-magic-carpet-after:after {
  content: "\e60e";
}

.ui-icon-skilift-mixed:before, .ui-icon-skilift-mixed-after:after {
  content: "\e90c";
}

.ui-icon-xc-skating:before {
  content: "\e60d";
}

.ui-icon-xc-classic:before {
  content: "\e613";
}

.ui-icon-obstacle-tube:before {
  content: "\e904";
}

.ui-icon-obstacle-rail:before {
  content: "\e905";
}

.ui-icon-obstacle-jump:before {
  content: "\e906";
}

.ui-icon-obstacle-jib:before {
  content: "\e907";
}

.ui-icon-obstacle-box:before {
  content: "\e908";
}

.ui-icon-obstacle-special:before {
  content: "\f005";
}

.icons-e_terrainpark:before {
  content: "\e93b";
}

/*############################################
 *## components
 *############################################*/
.material-card {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: flex;
  -webkit-flex-direction: column;
  -webkit-box-orient: vertical; /* Safari <= 6*/
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  -o-flex-direction: column;
  flex-direction: column;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: nowrap;
  -webkit-flex-wrap: nowrap;
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  margin: 0 10px;
}
.material-card > .element-contents {
  flex-grow: 1;
}
.material-card > .element-contents .label-value-combo:first-child {
  margin-top: -4px;
}
.material-card .element-image {
  max-width: 100%;
  margin-bottom: 10px;
}
.material-card > .element-actions {
  padding-top: 10px;
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: start;
  -moz-box-pack: start;
  -ms-flex-pack: start;
  -webkit-box-align: stretch;
  -moz-box-align: stretch;
  -ms-flex-align: stretch;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: flex-start;
  -moz-justify-content: flex-start;
  -o-justify-content: flex-start;
  -ms-justify-content: flex-start;
  justify-content: flex-start;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
}
.material-card > .element-actions > a:not(:first-child) {
  margin-left: 10px;
}
@media all and (min-width: 481px) {
  .material-card {
    margin: 0;
  }
}

.material-grid-card--2pack {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: flex;
  -webkit-flex-direction: column;
  -webkit-box-orient: vertical; /* Safari <= 6*/
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  -o-flex-direction: column;
  flex-direction: column;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: nowrap;
  -webkit-flex-wrap: nowrap;
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  margin: 0 10px;
}
.material-grid-card--2pack > .element-contents {
  flex-grow: 1;
}
.material-grid-card--2pack > .element-contents .label-value-combo:first-child {
  margin-top: -4px;
}
.material-grid-card--2pack .element-image {
  max-width: 100%;
  margin-bottom: 10px;
}
.material-grid-card--2pack > .element-actions {
  padding-top: 10px;
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: start;
  -moz-box-pack: start;
  -ms-flex-pack: start;
  -webkit-box-align: stretch;
  -moz-box-align: stretch;
  -ms-flex-align: stretch;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: flex-start;
  -moz-justify-content: flex-start;
  -o-justify-content: flex-start;
  -ms-justify-content: flex-start;
  justify-content: flex-start;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
}
.material-grid-card--2pack > .element-actions > a:not(:first-child) {
  margin-left: 10px;
}
@media all and (min-width: 481px) {
  .material-grid-card--2pack {
    margin: 0;
  }
}
.material-grid-card--2pack > div {
  display: grid;
  grid-column-gap: 10px;
  grid-row-gap: 20px;
  grid-template-columns: repeat(2, 1fr);
  text-align: center;
}
.material-grid-card--2pack > div > * {
  justify-self: center;
}

.material-flex-card {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: flex;
  -webkit-flex-direction: column;
  -webkit-box-orient: vertical; /* Safari <= 6*/
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  -o-flex-direction: column;
  flex-direction: column;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: nowrap;
  -webkit-flex-wrap: nowrap;
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  margin: 0 10px;
}
.material-flex-card > .element-contents {
  flex-grow: 1;
}
.material-flex-card > .element-contents .label-value-combo:first-child {
  margin-top: -4px;
}
.material-flex-card .element-image {
  max-width: 100%;
  margin-bottom: 10px;
}
.material-flex-card > .element-actions {
  padding-top: 10px;
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: start;
  -moz-box-pack: start;
  -ms-flex-pack: start;
  -webkit-box-align: stretch;
  -moz-box-align: stretch;
  -ms-flex-align: stretch;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: flex-start;
  -moz-justify-content: flex-start;
  -o-justify-content: flex-start;
  -ms-justify-content: flex-start;
  justify-content: flex-start;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
}
.material-flex-card > .element-actions > a:not(:first-child) {
  margin-left: 10px;
}
@media all and (min-width: 481px) {
  .material-flex-card {
    margin: 0;
  }
}
.material-flex-card > div {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: distribute;
  -moz-box-pack: distribute;
  -ms-flex-pack: distribute;
  -webkit-box-align: stretch;
  -moz-box-align: stretch;
  -ms-flex-align: stretch;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  box-lines: multiple;
  -moz-box-lines: multiple;
  -webkit-box-lines: multiple;
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-flex-flow: row wrap;
  -webkit-justify-content: space-around;
  -moz-justify-content: space-around;
  -o-justify-content: space-around;
  -ms-justify-content: space-around;
  justify-content: space-around;
  flex-wrap: wrap;
  -ms-flex-wrap: wrap; /* IE 10 */
  -webkit-flex-wrap: wrap;
}
.material-flex-card > div > * {
  width: auto;
  text-align: center;
}

.data-card {
  height: 100%;
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: flex;
  -webkit-flex-direction: column;
  -webkit-box-orient: vertical; /* Safari <= 6*/
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  -o-flex-direction: column;
  flex-direction: column;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: nowrap;
  -webkit-flex-wrap: nowrap;
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
}
.data-card .data {
  flex-grow: 1;
  -webkit-flex-grow: 1;
  -moz-flex-grow: 1;
  -ms-flex-grow: 1;
  -o-flex-grow: 1;
}
.carousel {
  position: relative;
}
.carousel .carousel__frame {
  margin: 0 5%;
  position: relative;
  overflow: hidden;
  white-space: nowrap;
}
.carousel .carousel__slides {
  display: inline-flex;
}
.carousel .carousel__slides li {
  position: relative;
}
.carousel .carousel__prev, .carousel .carousel__next {
  position: absolute;
  top: 50%;
  margin-top: -15px;
  display: block;
  cursor: pointer;
}
.carousel .carousel__prev:before, .carousel .carousel__next:before {
  font-size: 30px;
  color: #0375b4;
}
.carousel .carousel__next {
  right: 1%;
}
.carousel .carousel__prev {
  left: 1%;
}

.contrast-block-overlapping-upper {
  padding: 10px;
  background-color: #171b2d;
  color: #ffffff;
  position: relative;
  padding-bottom: 110px;
}
.contrast-block-overlapping-upper a {
  color: #ffffff;
}
.contrast-block-overlapping-upper a:before {
  color: #ffffff;
}
.contrast-block-overlapping-upper .headlines {
  color: #ffffff;
  padding-top: 0;
}
.contrast-block-overlapping-upper input[type=checkbox] + label:before, .contrast-block-overlapping-upper input[type=radio] + label:before {
  color: #ffffff;
  background-color: #171b2d;
}
.contrast-block-overlapping-upper label {
  color: #ffffff;
}
.contrast-block-overlapping-upper:before {
  font-family: TourispoWebfonts !important;
  font-weight: 400;
  font-style: normal;
  display: inline-block;
  content: "\e924";
  position: absolute;
  right: 10px;
  height: 44px;
  width: 44px;
  font-size: 2.6rem;
  text-align: right;
}
.contrast-block-overlapping-upper .headline {
  padding: 0 25px 10px 0;
  text-transform: uppercase;
  font-weight: 400;
  font-size: 1.3rem;
  width: fit-content;
  width: -moz-fit-content;
  position: relative;
}
.contrast-block-overlapping-upper .headline:after {
  content: "";
  height: 3px;
  background-color: #f18825;
  position: absolute;
  left: -10px;
  right: -10px;
  bottom: 0;
}
.contrast-block-overlapping-upper .introduction {
  padding: 20px 0 14px 0;
}
.contrast-block-overlapping-upper .introduction .introduction-link {
  font-weight: 700;
  color: #f18825;
}

.contrast-block-overlapping-lower {
  position: relative;
  top: -100px;
  margin-bottom: -80px;
  width: 100%;
  padding: 0 10px;
}
.contrast-block-overlapping-lower.tile-list .tile, .contrast-block-overlapping-lower .tile-list .tile {
  border: 1px solid #ccc;
}
.contrast-block-overlapping-lower.tile-list .tile .tile__image, .contrast-block-overlapping-lower .tile-list .tile .tile__image {
  height: 130px;
}
.contrast-block-overlapping-lower.tile-list .tile .image-link, .contrast-block-overlapping-lower .tile-list .tile .image-link {
  display: block;
  overflow: hidden;
}
.contrast-block-overlapping-lower.tile-list .tile .image-link img, .contrast-block-overlapping-lower .tile-list .tile .image-link img {
  width: 101%;
  height: 130px;
  object-fit: cover;
  object-position: left;
}
.contrast-block-overlapping-lower.tile-list .tile .tile__content, .contrast-block-overlapping-lower .tile-list .tile .tile__content {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: flex;
  -webkit-flex-direction: column;
  -webkit-box-orient: vertical; /* Safari <= 6*/
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  -o-flex-direction: column;
  flex-direction: column;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: nowrap;
  -webkit-flex-wrap: nowrap;
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  -moz-hyphens: auto;
  -o-hyphens: auto;
  -webkit-hyphens: auto;
  -ms-hyphens: auto;
  hyphens: auto;
  line-height: 1.5;
}

/*############################################
 *## All charts are supporting a range of colors
 *############################################*/
.chart .label {
  color: #727272;
}
.chart .label.primary {
  color: #0375b4;
}
.chart .label.blue {
  color: #1042b5;
}
.chart .label.red {
  color: #ff0000;
}
.chart .label.black {
  color: #000;
}
.chart .label.orange {
  color: #ff6e0e;
}
.chart .label.green {
  color: #42910e;
}
.chart:not(.level-chart) .area.disabled {
  background-color: #ccc;
}
.chart:not(.level-chart) .area.primary {
  background-color: #0375b4;
}
.chart:not(.level-chart) .area.blue {
  background-color: #1042b5;
}
.chart:not(.level-chart) .area.red {
  background-color: #ff0000;
}
.chart:not(.level-chart) .area.black {
  background-color: #000;
}
.chart:not(.level-chart) .area.orange {
  background-color: #ff6e0e;
}
.chart:not(.level-chart) .area.green {
  background-color: #42910e;
}
.chart.level-chart .area {
  border-top: 1px solid;
}
.chart.level-chart .area.primary {
  border-color: #0375b4;
}
.chart.level-chart .area.blue {
  border-color: #1042b5;
}
.chart.level-chart .area.red {
  border-color: #ff0000;
}
.chart.level-chart .area.black {
  border-color: #000;
}
.chart.level-chart .area.orange {
  border-color: #ff6e0e;
}
.chart.level-chart .area.green {
  border-color: #42910e;
}

/*############################################
 *##
 *## horizontalbarchart
 *##
 *############################################*/
.horizontal-bar-chart {
  width: 100%;
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: distribute;
  -moz-box-pack: distribute;
  -ms-flex-pack: distribute;
  -webkit-box-align: stretch;
  -moz-box-align: stretch;
  -ms-flex-align: stretch;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  box-lines: multiple;
  -moz-box-lines: multiple;
  -webkit-box-lines: multiple;
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-flex-flow: row wrap;
  -webkit-justify-content: space-around;
  -moz-justify-content: space-around;
  -o-justify-content: space-around;
  -ms-justify-content: space-around;
  justify-content: space-around;
  flex-wrap: wrap;
  -ms-flex-wrap: wrap; /* IE 10 */
  -webkit-flex-wrap: wrap;
}
.horizontal-bar-chart .label-value {
  width: 100%;
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: stretch;
  -moz-box-align: stretch;
  -ms-flex-align: stretch;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
}
.horizontal-bar-chart.small .area {
  height: 3px;
}
.horizontal-bar-chart.medium .area {
  height: 8px;
}
.horizontal-bar-chart .value {
  white-space: nowrap;
  color: #31394a;
  font-weight: 400;
  text-align: right;
}
.horizontal-bar-chart .value, .horizontal-bar-chart .label {
  flex-grow: 1;
  -webkit-flex-grow: 1;
  -moz-flex-grow: 1;
  -ms-flex-grow: 1;
  -o-flex-grow: 1;
}

/*############################################
 *##
 *## BarChart Indicator (used for example to indicate fresh snow of last couple of days and next days)
 *##
 *############################################*/
.bar-chart {
  text-align: center;
  padding-bottom: 30px;
  padding-top: 12px;
}
.bar-chart:not(.level-chart) {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: stretch;
  -moz-box-align: stretch;
  -ms-flex-align: stretch;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
}
.bar-chart.with-sublabels {
  padding-bottom: 50px;
  height: 75px !important;
}
.bar-chart .sublabel {
  font-size: 0.64rem;
  bottom: -48px;
}
.bar-chart > .bar-container {
  position: relative;
}
.bar-chart > .bar-container > div {
  position: absolute;
}
.bar-chart > .bar-container .label {
  left: 0;
  right: 0;
  height: 30px;
  bottom: -34px;
}
.bar-chart > .bar-container .label.small {
  font-size: 0.9rem;
}
.bar-chart > .bar-container .label.mini {
  font-size: 0.84rem;
}
.bar-chart > .bar-container .label.tiny {
  font-size: 0.74rem;
}
.bar-chart > .bar-container:last-child {
  margin-right: 0;
}
.bar-chart.level-chart {
  position: relative;
}
.bar-chart.level-chart .bar-container {
  position: absolute;
  width: 100%;
  bottom: 0;
  height: 100%;
}
.bar-chart.rotate-labels {
  padding-bottom: 35px;
}
.bar-chart.rotate-labels > .bar-container .label {
  transform: rotate(-15deg);
  bottom: -44px;
}
.bar-chart .bar {
  width: 94%;
  left: 3%;
  min-height: 1%;
  bottom: 0;
}
.bar-chart .bar:after {
  white-space: nowrap;
  bottom: calc(100% + 2px);
  display: block;
  left: 0;
  position: absolute;
  width: 100%;
  font-size: 0.84rem;
  content: attr(data-bar-value) attr(data-bar-value-unit);
  text-align: center;
  line-height: 12px;
}
.bar-chart.sync-label-bar-colors .primary:after, .bar-chart.sync-label-bar-colors .primary + .label {
  color: #0375b4;
}
.bar-chart.sync-label-bar-colors .blue:after, .bar-chart.sync-label-bar-colors .blue + .label {
  color: #1042b5;
}
.bar-chart.sync-label-bar-colors .red:after, .bar-chart.sync-label-bar-colors .red + .label {
  color: #ff0000;
}
.bar-chart.sync-label-bar-colors .black:after, .bar-chart.sync-label-bar-colors .black + .label {
  color: #000;
}
.bar-chart.sync-label-bar-colors .orange:after, .bar-chart.sync-label-bar-colors .orange + .label {
  color: #ff6e0e;
}
.bar-chart.sync-label-bar-colors .green:after, .bar-chart.sync-label-bar-colors .green + .label {
  color: #42910e;
}

/*############################################
 *##
 *## Pie Charts
 *##
 *############################################*/
.pie-chart {
  text-align: center;
}
.pie-chart .value {
  text-align: center !important;
  bottom: 0;
  color: #0375b4;
}
.pie-chart .value .big {
  font-weight: 700;
}
.pie-chart .label {
  white-space: normal;
  color: #727272;
}
.pie-chart.small:not(.pie-chart-large) .value-line-two {
  font-size: 0.74rem;
  letter-spacing: 0;
}
.pie-chart .pie {
  /*############################################
   *## the rotation makes the slice size => 20 steps
   *############################################*/
}
.pie-chart .pie.size0 {
  transform: rotate(-180deg);
}
.pie-chart .pie.size-min {
  transform: rotate(-176deg);
}
.pie-chart .pie.size5 {
  transform: rotate(-171deg);
}
.pie-chart .pie.size10 {
  transform: rotate(-162deg);
}
.pie-chart .pie.size15 {
  transform: rotate(-153deg);
}
.pie-chart .pie.size20 {
  transform: rotate(-144deg);
}
.pie-chart .pie.size25 {
  transform: rotate(-135deg);
}
.pie-chart .pie.size30 {
  transform: rotate(-126deg);
}
.pie-chart .pie.size35 {
  transform: rotate(-117deg);
}
.pie-chart .pie.size40 {
  transform: rotate(-108deg);
}
.pie-chart .pie.size45 {
  transform: rotate(-99deg);
}
.pie-chart .pie.size50 {
  transform: rotate(-90deg);
}
.pie-chart .pie.size55 {
  transform: rotate(-81deg);
}
.pie-chart .pie.size60 {
  transform: rotate(-72deg);
}
.pie-chart .pie.size65 {
  transform: rotate(-63deg);
}
.pie-chart .pie.size70 {
  transform: rotate(-54deg);
}
.pie-chart .pie.size75 {
  transform: rotate(-45deg);
}
.pie-chart .pie.size80 {
  transform: rotate(-36deg);
}
.pie-chart .pie.size85 {
  transform: rotate(-27deg);
}
.pie-chart .pie.size90 {
  transform: rotate(-18deg);
}
.pie-chart .pie.size90 {
  transform: rotate(-9deg);
}
.pie-chart .pie.size100 {
  transform: rotate(0deg);
}

.pie-chart-small {
  position: relative;
  height: 53px;
}
.pie-chart-small .pie-container {
  height: 36px;
  width: 75px;
  left: 50%;
  margin-left: -37.5px;
  overflow: hidden;
  position: absolute;
  box-sizing: content-box;
  padding: 2px;
}
.pie-chart-small .pie-background {
  background-color: #ccc;
  position: absolute;
  width: 75px;
  height: 75px;
  border-radius: 38px;
  -moz-box-shadow: -1px 0 1px #727272;
  -webkit-box-shadow: -1px 0 1px #727272;
  -o-box-shadow: -1px 0 1px #727272;
  box-shadow: -1px 0 1px #727272;
}
.pie-chart-small .pie-center {
  position: absolute;
  width: 60px;
  height: 60px;
  background-color: #ffffff;
  border-radius: 50%;
  left: 38.5px;
  top: 38.5px;
  margin-left: -30px;
  margin-top: -30px;
  box-shadow: inset 1px 1px 1px 0 #ccc;
}
.pie-chart-small .pie {
  position: absolute;
  width: 75px;
  height: 75px;
  border-radius: 50%;
  clip: rect(0px, 75px, 37.5px, 0px);
}
.pie-chart-small .pie {
  background-color: #0375b4;
}
.pie-chart-small .value {
  width: 100%;
  padding-right: 5px;
  position: absolute;
}
.pie-chart-small .value-line-one {
  font-size: 0.64rem;
  line-height: 1.2;
}
.pie-chart-small .value-line-one .imperial {
  font-size: 2.6em;
  position: relative;
  top: 10px;
}
.pie-chart-small .value-line-two {
  font-size: 0.9rem;
  font-weight: 700;
  line-height: 13px;
}
.pie-chart-small .label {
  font-size: 0.74rem;
}
.pie-chart-small.small .value-line-two {
  font-size: 0.74rem;
  letter-spacing: 0;
}

.pie-chart-medium {
  position: relative;
  height: 74px;
}
.pie-chart-medium .pie-container {
  height: 48px;
  width: 100px;
  left: 50%;
  margin-left: -50px;
  overflow: hidden;
  position: absolute;
  box-sizing: content-box;
  padding: 2px;
}
.pie-chart-medium .pie-background {
  background-color: #ccc;
  position: absolute;
  width: 100px;
  height: 100px;
  border-radius: 50px;
  -moz-box-shadow: -1px 0 1px #727272;
  -webkit-box-shadow: -1px 0 1px #727272;
  -o-box-shadow: -1px 0 1px #727272;
  box-shadow: -1px 0 1px #727272;
}
.pie-chart-medium .pie-center {
  position: absolute;
  width: 72px;
  height: 72px;
  background-color: #ffffff;
  border-radius: 50%;
  left: 51px;
  top: 51px;
  margin-left: -36px;
  margin-top: -36px;
  box-shadow: inset 1px 1px 1px 0 #ccc;
}
.pie-chart-medium .pie {
  position: absolute;
  width: 100px;
  height: 100px;
  border-radius: 50%;
  clip: rect(0px, 100px, 50px, 0px);
}
.pie-chart-medium .pie {
  background-color: #0375b4;
}
.pie-chart-medium .value {
  width: 100%;
  padding-right: 5px;
  position: absolute;
}
.pie-chart-medium .value-line-one .imperial {
  font-size: 1.6rem;
  position: relative;
  top: 6px;
}
.pie-chart-medium .value-line-two {
  font-size: 0.9rem;
  font-weight: 700;
}

.pie-chart-large {
  position: relative;
  height: 90px;
}
.pie-chart-large .pie-container {
  height: 68px;
  width: 140px;
  left: 50%;
  margin-left: -70px;
  overflow: hidden;
  position: absolute;
  box-sizing: content-box;
  padding: 2px;
}
.pie-chart-large .pie-background {
  background-color: #ccc;
  position: absolute;
  width: 140px;
  height: 140px;
  border-radius: 70px;
  -moz-box-shadow: -1px 0 1px #727272;
  -webkit-box-shadow: -1px 0 1px #727272;
  -o-box-shadow: -1px 0 1px #727272;
  box-shadow: -1px 0 1px #727272;
}
.pie-chart-large .pie-center {
  position: absolute;
  width: 100px;
  height: 100px;
  background-color: #ffffff;
  border-radius: 50%;
  left: 71px;
  top: 71px;
  margin-left: -50px;
  margin-top: -50px;
  box-shadow: inset 1px 1px 1px 0 #ccc;
}
.pie-chart-large .pie {
  position: absolute;
  width: 140px;
  height: 140px;
  border-radius: 50%;
  clip: rect(0px, 140px, 70px, 0px);
}
.pie-chart-large .pie {
  background-color: #0375b4;
}
.pie-chart-large .value {
  width: 100%;
  padding-right: 5px;
  position: absolute;
}
.pie-chart-large:after {
  height: 4px;
}
.pie-chart-large .value-line-one {
  line-height: 17px;
}
.pie-chart-large .value-line-two {
  font-size: 1.3rem;
  line-height: 26px;
}
.pie-chart-large.small .value-line-two {
  font-size: 1rem;
}

.collapsible-item {
  position: relative;
  border-bottom: 1px solid #ccc;
  margin: 0 10px;
  /*############################################
   *##
   *## Styles only valid for collapsed items
   *##
   *############################################*/
}
.collapsible-item.expanded {
  margin-bottom: 14px;
}
.collapsible-item.use-full-height {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: flex;
  -webkit-flex-direction: column;
  -webkit-box-orient: vertical; /* Safari <= 6*/
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  -o-flex-direction: column;
  flex-direction: column;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-justify-content: flex-start;
  -moz-justify-content: flex-start;
  -o-justify-content: flex-start;
  -ms-justify-content: flex-start;
  justify-content: flex-start;
  flex-wrap: nowrap;
  -webkit-flex-wrap: nowrap;
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: start;
  -moz-box-pack: start;
  -ms-flex-pack: start;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
}
.collapsible-item.use-full-height .collapsible-content {
  flex-grow: 1;
  -webkit-flex-grow: 1;
  -moz-flex-grow: 1;
  -ms-flex-grow: 1;
  -o-flex-grow: 1;
}
@media all and (min-width: 481px) {
  .collapsible-item {
    margin: 10px;
  }
  .collapsible-item.expanded {
    margin-bottom: 0;
  }
}
@media all and (min-width: 681px) {
  .collapsible-item {
    margin: 0;
  }
}
.collapsible-item.reduce-top-padding {
  padding-top: 0 !important;
}
.collapsible-item .collapsible-headline {
  font-size: 1.15rem;
  line-height: 1.5;
  padding: 6px 0 6px 6px;
}
.collapsible-item .collapsible-headline.primary {
  color: #0375b4;
}
.collapsible-item .collapsible-headline.primary:before, .collapsible-item .collapsible-headline.primary:after {
  color: #0375b4;
}
.collapsible-item .collapsible-headline.secondary {
  color: #727272;
}
.collapsible-item .collapsible-headline.secondary:before, .collapsible-item .collapsible-headline.secondary:after {
  color: #727272;
}
.collapsible-item .collapsible-headline:before, .collapsible-item .collapsible-headline:after {
  margin: 0 10px 0 0;
  width: 26px;
}
.collapsible-item .collapsible-headline:after {
  text-align: right;
}
.collapsible-item .collapsible-headline h2 {
  flex-grow: 1;
}
.collapsible-item.small > .collapsible-headline {
  font-size: 1.15rem;
}
.collapsible-item.mini > .collapsible-headline {
  font-size: 1rem;
}
.collapsible-item.tiny > .collapsible-headline {
  font-size: 0.9rem;
}
.collapsible-item.expanded {
  border: none;
}
.collapsible-item.expanded > .collapsible-headline {
  border-bottom: 1px solid #ccc;
}
.collapsible-item.expanded > .collapsible-headline.no-border {
  border-bottom: none;
}
.collapsible-item.expanded .ui-icon-angle-down-after:after {
  content: "\f077";
}
.collapsible-item.expanded > .collapsible-content {
  display: block;
}
.collapsible-item.expanded > .collapsible-content.material-divider {
  margin-top: -1px;
  background-color: #ffffff;
  border-top: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
  padding: 10px;
}
.collapsible-item.expanded > .collapsible-content.material-divider > .element-actions {
  padding-top: 10px;
}
.collapsible-item .badge-text {
  padding: 0 10px;
  border-radius: 5px;
  background-color: #0375b4;
  color: #ffffff;
}
.collapsible-item .subheadline {
  font-size: 0.84rem;
}
.collapsible-item > .collapsible-content {
  margin-top: 10px;
  display: none;
}
@media all and (min-width: 481px) {
  .collapsible-item.disable-when-larger-equal-phablet-portrait {
    border: none;
  }
  .collapsible-item.disable-when-larger-equal-phablet-portrait > .collapsible-headline {
    border-bottom: 1px solid #ccc;
  }
  .collapsible-item.disable-when-larger-equal-phablet-portrait > .collapsible-headline.no-border {
    border-bottom: none;
  }
  .collapsible-item.disable-when-larger-equal-phablet-portrait .ui-icon-angle-down-after:after {
    content: "\f077";
  }
  .collapsible-item.disable-when-larger-equal-phablet-portrait > .collapsible-content {
    display: block;
  }
  .collapsible-item.disable-when-larger-equal-phablet-portrait > .collapsible-content.material-divider {
    margin-top: -1px;
    background-color: #ffffff;
    border-top: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
    padding: 10px;
  }
  .collapsible-item.disable-when-larger-equal-phablet-portrait > .collapsible-content.material-divider > .element-actions {
    padding-top: 10px;
  }
  .collapsible-item.disable-when-larger-equal-phablet-portrait > .collapsible-headline {
    cursor: default;
  }
  .collapsible-item.disable-when-larger-equal-phablet-portrait > .collapsible-headline:after {
    display: none;
  }
  .collapsible-item.disable-when-larger-equal-phablet-portrait .badge-text {
    display: none;
  }
}
@media all and (min-width: 681px) {
  .collapsible-item.disable-when-larger-equal-tablet-portrait {
    border: none;
  }
  .collapsible-item.disable-when-larger-equal-tablet-portrait > .collapsible-headline {
    border-bottom: 1px solid #ccc;
  }
  .collapsible-item.disable-when-larger-equal-tablet-portrait > .collapsible-headline.no-border {
    border-bottom: none;
  }
  .collapsible-item.disable-when-larger-equal-tablet-portrait .ui-icon-angle-down-after:after {
    content: "\f077";
  }
  .collapsible-item.disable-when-larger-equal-tablet-portrait > .collapsible-content {
    display: block;
  }
  .collapsible-item.disable-when-larger-equal-tablet-portrait > .collapsible-content.material-divider {
    margin-top: -1px;
    background-color: #ffffff;
    border-top: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
    padding: 10px;
  }
  .collapsible-item.disable-when-larger-equal-tablet-portrait > .collapsible-content.material-divider > .element-actions {
    padding-top: 10px;
  }
  .collapsible-item.disable-when-larger-equal-tablet-portrait > .collapsible-headline {
    cursor: default;
  }
  .collapsible-item.disable-when-larger-equal-tablet-portrait > .collapsible-headline:after {
    display: none;
  }
  .collapsible-item.disable-when-larger-equal-tablet-portrait .badge-text {
    display: none;
  }
}
@media all and (min-width: 861px) {
  .collapsible-item.disable-when-larger-equal-tablet-landscape {
    border: none;
  }
  .collapsible-item.disable-when-larger-equal-tablet-landscape > .collapsible-headline {
    border-bottom: 1px solid #ccc;
  }
  .collapsible-item.disable-when-larger-equal-tablet-landscape > .collapsible-headline.no-border {
    border-bottom: none;
  }
  .collapsible-item.disable-when-larger-equal-tablet-landscape .ui-icon-angle-down-after:after {
    content: "\f077";
  }
  .collapsible-item.disable-when-larger-equal-tablet-landscape > .collapsible-content {
    display: block;
  }
  .collapsible-item.disable-when-larger-equal-tablet-landscape > .collapsible-content.material-divider {
    margin-top: -1px;
    background-color: #ffffff;
    border-top: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
    padding: 10px;
  }
  .collapsible-item.disable-when-larger-equal-tablet-landscape > .collapsible-content.material-divider > .element-actions {
    padding-top: 10px;
  }
  .collapsible-item.disable-when-larger-equal-tablet-landscape > .collapsible-headline {
    cursor: default;
  }
  .collapsible-item.disable-when-larger-equal-tablet-landscape > .collapsible-headline:after {
    display: none;
  }
  .collapsible-item.disable-when-larger-equal-tablet-landscape .badge-text {
    display: none;
  }
}
@media all and (min-width: 1025px) {
  .collapsible-item.disable-when-larger-equal-laptop-sdpi {
    border: none;
  }
  .collapsible-item.disable-when-larger-equal-laptop-sdpi > .collapsible-headline {
    border-bottom: 1px solid #ccc;
  }
  .collapsible-item.disable-when-larger-equal-laptop-sdpi > .collapsible-headline.no-border {
    border-bottom: none;
  }
  .collapsible-item.disable-when-larger-equal-laptop-sdpi .ui-icon-angle-down-after:after {
    content: "\f077";
  }
  .collapsible-item.disable-when-larger-equal-laptop-sdpi > .collapsible-content {
    display: block;
  }
  .collapsible-item.disable-when-larger-equal-laptop-sdpi > .collapsible-content.material-divider {
    margin-top: -1px;
    background-color: #ffffff;
    border-top: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
    padding: 10px;
  }
  .collapsible-item.disable-when-larger-equal-laptop-sdpi > .collapsible-content.material-divider > .element-actions {
    padding-top: 10px;
  }
  .collapsible-item.disable-when-larger-equal-laptop-sdpi > .collapsible-headline {
    cursor: default;
  }
  .collapsible-item.disable-when-larger-equal-laptop-sdpi > .collapsible-headline:after {
    display: none;
  }
  .collapsible-item.disable-when-larger-equal-laptop-sdpi .badge-text {
    display: none;
  }
}

.show-more-container {
  position: relative;
  padding-bottom: 44px;
}
.show-more-container .read-more-checkbox:checked ~ .show-more-content {
  max-height: 2000px !important;
}
.show-more-container .read-more-checkbox:checked ~ .show-more-content .hidden-in-show-more {
  display: block;
}
.show-more-container .read-more-checkbox:checked ~ label {
  visibility: hidden;
}
.show-more-container .read-more-checkbox:checked ~ label span:before {
  visibility: visible;
  top: 14px;
  content: "\f077";
}
.show-more-container .read-more-checkbox:checked ~ label span.button:before {
  top: 0;
  width: 100%;
}
.show-more-container .show-more-content {
  -ms-transition: all 10x00ms ease 0s;
  transition: all 10x00ms ease 0s;
  -ms-transition-property: max-height;
  transition-property: max-height;
  overflow: hidden;
}
.show-more-container .show-more-content .hidden-in-show-more {
  display: none;
}
.show-more-container .read-more-label {
  padding-left: 0 !important;
  text-indent: 0 !important;
  position: absolute !important;
  z-index: 1;
  bottom: 0;
  cursor: pointer;
  padding-top: 29px;
}
.show-more-container .read-more-label:not(.button-style) {
  color: #0375b4;
}
.show-more-container .read-more-label:not(.disable-content-fading) {
  height: 70px;
  width: 100%;
  background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, #ffffff 50%);
}
.show-more-container .read-more-label:before {
  display: none !important;
}
.show-more-container .read-more-label span:not(.button) {
  justify-content: center;
}
.show-more-container .read-more-label span:not(.button):before {
  line-height: 1.5;
  position: absolute;
  font-size: 30px;
  left: 50%;
  top: 34px;
  margin-left: -13px;
}
.show-more-container .read-more-label .button {
  margin-top: 10px;
  width: fit-content;
  width: -moz-fit-content;
}
@media all and (min-width: 481px) {
  .show-more-container.disable-when-larger-equal-phablet-portrait {
    padding-bottom: 0;
  }
  .show-more-container.disable-when-larger-equal-phablet-portrait .read-more-checkbox ~ .show-more-content {
    max-height: none !important;
    overflow: initial;
  }
  .show-more-container.disable-when-larger-equal-phablet-portrait .read-more-checkbox ~ .show-more-content .hidden-in-show-more {
    display: block;
  }
  .show-more-container.disable-when-larger-equal-phablet-portrait .read-more-label {
    display: none;
  }
}
@media all and (min-width: 681px) {
  .show-more-container.disable-when-larger-equal-tablet-portrait {
    padding-bottom: 0;
  }
  .show-more-container.disable-when-larger-equal-tablet-portrait .read-more-checkbox ~ .show-more-content {
    max-height: none !important;
    overflow: initial;
  }
  .show-more-container.disable-when-larger-equal-tablet-portrait .read-more-checkbox ~ .show-more-content .hidden-in-show-more {
    display: block;
  }
  .show-more-container.disable-when-larger-equal-tablet-portrait .read-more-label {
    display: none;
  }
}
@media all and (min-width: 861px) {
  .show-more-container.disable-when-larger-equal-tablet-landscape {
    padding-bottom: 0;
  }
  .show-more-container.disable-when-larger-equal-tablet-landscape .read-more-checkbox ~ .show-more-content {
    max-height: none !important;
    overflow: initial;
  }
  .show-more-container.disable-when-larger-equal-tablet-landscape .read-more-checkbox ~ .show-more-content .hidden-in-show-more {
    display: block;
  }
  .show-more-container.disable-when-larger-equal-tablet-landscape .read-more-label {
    display: none;
  }
}

.in-converted-form .show-more-container {
  padding-bottom: 0;
}

.material-divider {
  background-color: #ffffff;
  border-top: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
  padding: 10px;
}
.material-divider > .element-actions {
  padding-top: 10px;
}

.material-flex-divider {
  background-color: #ffffff;
  border-top: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
  padding: 10px;
}
.material-flex-divider > .element-actions {
  padding-top: 10px;
}
.material-flex-divider > div {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: distribute;
  -moz-box-pack: distribute;
  -ms-flex-pack: distribute;
  -webkit-box-align: stretch;
  -moz-box-align: stretch;
  -ms-flex-align: stretch;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  box-lines: multiple;
  -moz-box-lines: multiple;
  -webkit-box-lines: multiple;
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-flex-flow: row wrap;
  -webkit-justify-content: space-around;
  -moz-justify-content: space-around;
  -o-justify-content: space-around;
  -ms-justify-content: space-around;
  justify-content: space-around;
  flex-wrap: wrap;
  -ms-flex-wrap: wrap; /* IE 10 */
  -webkit-flex-wrap: wrap;
}
.material-flex-divider > div > * {
  width: auto;
  text-align: center;
}

.material-grid-divider--2pack {
  background-color: #ffffff;
  border-top: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
  padding: 10px;
}
.material-grid-divider--2pack > .element-actions {
  padding-top: 10px;
}
.material-grid-divider--2pack > div {
  display: grid;
  grid-column-gap: 10px;
  grid-row-gap: 20px;
  grid-template-columns: repeat(2, 1fr);
  text-align: center;
}
.material-grid-divider--2pack > div > * {
  justify-self: center;
}

.divider-line-embossed {
  margin-top: 20px;
  margin-bottom: 20px;
  border-top: 1px solid #ccc;
  border-bottom: 2px solid #ffffff;
}

/*############################################
 *##
 *## Generic styles for Feedback Messages
 *##
 *############################################*/
.feedback-message {
  padding: 10px;
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: start;
  -moz-box-pack: start;
  -ms-flex-pack: start;
  -webkit-box-align: stretch;
  -moz-box-align: stretch;
  -ms-flex-align: stretch;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: flex-start;
  -moz-justify-content: flex-start;
  -o-justify-content: flex-start;
  -ms-justify-content: flex-start;
  justify-content: flex-start;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
  /*############################################
  *## Different sizes for standard and tiny messages
  *############################################*/
  /*############################################
   *## Different colors for different message types
   *############################################*/
}
.feedback-message.with-link .feedback-message__headline {
  margin-bottom: 10px;
}
.feedback-message__text {
  flex-grow: 1;
  -webkit-flex-grow: 1;
  -moz-flex-grow: 1;
  -ms-flex-grow: 1;
  -o-flex-grow: 1;
  -ms-flex: 1;
  -webkit-box-flex: 1;
  -moz-box-flex: 1;
  flex: 1;
  padding-left: 14px;
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: flex;
  -webkit-flex-direction: column;
  -webkit-box-orient: vertical; /* Safari <= 6*/
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  -o-flex-direction: column;
  flex-direction: column;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-justify-content: space-around;
  -moz-justify-content: space-around;
  -o-justify-content: space-around;
  -ms-justify-content: space-around;
  justify-content: space-around;
  flex-wrap: nowrap;
  -webkit-flex-wrap: nowrap;
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: distribute;
  -moz-box-pack: distribute;
  -ms-flex-pack: distribute;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
}

.feedback-message__headline {
  font-weight: bold;
  padding-bottom: 6px;
}

.feedback-message__link {
  padding-top: 6px;
}

.feedback-message__icon:before {
  width: 100%;
  text-align: center;
  font-size: 50px;
}

.feedback-message--tiny li:before {
  font-size: 0.64rem !important;
}
.feedback-message--tiny .feedback-message__headline {
  line-height: 1;
}
.feedback-message--tiny .feedback-message__text {
  font-size: 0.84rem;
}
.feedback-message--tiny .feedback-message__icon:before {
  font-size: 30px;
}

.feedback-message--info {
  background-color: #d9eaf4;
}
.feedback-message--info .feedback-message__headline, .feedback-message--info li:before, .feedback-message--info .feedback-message__icon:before, .feedback-message--info .feedback-message__link, .feedback-message--info .feedback-message__link:before {
  color: #0375b4 !important;
}

.feedback-message--warning {
  background-color: #ffe0cc;
}
.feedback-message--warning .feedback-message__headline, .feedback-message--warning li:before, .feedback-message--warning .feedback-message__icon:before, .feedback-message--warning .feedback-message__link, .feedback-message--warning .feedback-message__link:before {
  color: #ff6e0e !important;
}

.feedback-message--error {
  background-color: #e5bfbf;
}
.feedback-message--error .feedback-message__headline, .feedback-message--error li:before, .feedback-message--error .feedback-message__icon:before, .feedback-message--error .feedback-message__link, .feedback-message--error .feedback-message__link:before {
  color: #b95252 !important;
}

.feedback-message--success {
  background-color: #d2e0b1;
}
.feedback-message--success .feedback-message__headline, .feedback-message--success li:before, .feedback-message--success .feedback-message__icon:before, .feedback-message--success .feedback-message__link, .feedback-message--success .feedback-message__link:before {
  color: #92b147 !important;
}

.filter {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: stretch;
  -moz-box-align: stretch;
  -ms-flex-align: stretch;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  box-lines: multiple;
  -moz-box-lines: multiple;
  -webkit-box-lines: multiple;
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-flex-flow: row wrap;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: wrap;
  -ms-flex-wrap: wrap; /* IE 10 */
  -webkit-flex-wrap: wrap;
}
.filter .labels {
  width: 100%;
}
.filter label {
  flex-basis: 100%;
  -webkit-flex-basis: 100%;
  -moz-flex-basis: 100%;
  -ms-flex-basis: 100%;
  -o-flex-basis: 100%;
}
.filter input, .filter .ui-slider-wrapper {
  flex-basis: 70%;
  -webkit-flex-basis: 70%;
  -moz-flex-basis: 70%;
  -ms-flex-basis: 70%;
  -o-flex-basis: 70%;
}
.filter output {
  line-height: 26px;
  font-size: 0.9rem;
  flex-basis: 25%;
  -webkit-flex-basis: 25%;
  -moz-flex-basis: 25%;
  -ms-flex-basis: 25%;
  -o-flex-basis: 25%;
  flex-grow: 1;
  -webkit-flex-grow: 1;
  -moz-flex-grow: 1;
  -ms-flex-grow: 1;
  -o-flex-grow: 1;
  color: #0375b4;
  margin-left: 10px;
}
.filter.has-secondary-label .labels {
  width: 100%;
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: stretch;
  -moz-box-align: stretch;
  -ms-flex-align: stretch;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
}
.filter.has-secondary-label .labels label {
  flex-basis: auto;
  -webkit-flex-basis: auto;
  -moz-flex-basis: auto;
  -ms-flex-basis: auto;
  -o-flex-basis: auto;
}
.filter.has-secondary-label .labels .secondary-label {
  flex-basis: auto;
  -webkit-flex-basis: auto;
  -moz-flex-basis: auto;
  -ms-flex-basis: auto;
  -o-flex-basis: auto;
  margin-left: 14px;
  font-size: 0.74rem;
  text-align: right;
}
.filter.multi-option-checkbox .column-2 {
  display: grid;
  grid-gap: 10px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.filter.multi-option-checkbox .column-2 li {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: stretch;
  -moz-box-align: stretch;
  -ms-flex-align: stretch;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
}
.filter.multi-option-checkbox .column-2 li label {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: start;
  -moz-box-pack: start;
  -ms-flex-pack: start;
  -webkit-box-align: stretch;
  -moz-box-align: stretch;
  -ms-flex-align: stretch;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: flex-start;
  -moz-justify-content: flex-start;
  -o-justify-content: flex-start;
  -ms-justify-content: flex-start;
  justify-content: flex-start;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
  line-height: 22px;
}
.filter.option-filter-dropdown .dropdown {
  width: 100%;
}

.headlines {
  color: #727272;
}
.headlines.primary, .headlines.primary-deco {
  font-weight: 400;
  font-size: 1.6rem;
  margin-bottom: 10px;
}
.headlines.primary.small, .headlines.primary-deco.small {
  font-size: 1.3rem;
}
.headlines.secondary, .headlines.secondary-deco {
  font-weight: 400;
  font-size: 1.3rem;
  margin-bottom: 6px;
}
.headlines.secondary.small, .headlines.secondary-deco.small {
  font-size: 1rem;
}
.headlines.uppercase {
  text-transform: uppercase;
}
.headlines.deco {
  padding-bottom: 6px;
  border-bottom: 1px solid #ccc;
}

/*############################################
 *## Enumerated headlines (1., 2., 3.)
 *############################################*/
.enumeration {
  position: absolute;
  width: 40px;
  height: 40px;
  background-color: #FFF;
  border: 2px #0375b4 solid;
  border-radius: 50%;
  text-align: center;
  line-height: 40px;
  color: #0375b4;
  font-size: 1.6rem;
  font-weight: 700;
}

.enumeration + .headlines {
  padding-left: 56px;
  padding-top: 6px;
}

.editable-image-container .image-placeholder.entity.small:before, .editable-image-container .image-placeholder.content.small:before, .editable-image-container .image-placeholder.product.small:before {
  margin-top: -55px;
}
.editable-image-container .image-placeholder.entity.large:before, .editable-image-container .image-placeholder.content.large:before, .editable-image-container .image-placeholder.product.large:before {
  margin-top: -60px;
}

#image-gallery-panoramic .swiper-slide a {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: center;
  -moz-align-items: center;
  -ms-align-items: center;
  -o-align-items: center;
  align-items: center;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: center;
  -moz-justify-content: center;
  -o-justify-content: center;
  -ms-justify-content: center;
  justify-content: center;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
  height: 100%;
  width: 100%;
}
#image-gallery-panoramic img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/*############################################
 *##
 *## Copyright information floating right underneath an image
 *## and image description centered underneath the image
 *##
 *############################################*/
figure {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: flex;
  -webkit-flex-direction: column;
  -webkit-box-orient: vertical; /* Safari <= 6*/
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  -o-flex-direction: column;
  flex-direction: column;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-justify-content: flex-start;
  -moz-justify-content: flex-start;
  -o-justify-content: flex-start;
  -ms-justify-content: flex-start;
  justify-content: flex-start;
  flex-wrap: nowrap;
  -webkit-flex-wrap: nowrap;
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: start;
  -moz-box-pack: start;
  -ms-flex-pack: start;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
}
figure .copyright {
  display: block;
  font-size: 0.64rem;
  width: 100%;
  text-align: right;
}
figure figcaption {
  width: 100%;
  caption-side: bottom;
  position: relative;
  padding-top: 14px;
  -moz-hyphens: auto;
  -o-hyphens: auto;
  -webkit-hyphens: auto;
  -ms-hyphens: auto;
  hyphens: auto;
}
figure figcaption .caption-headline {
  display: block;
  font-weight: 700;
}

/*############################################
 *##
 *## styles if using an div instead of an image tag
 *##
 *############################################*/
.div-image {
  width: 100%;
  height: 100%;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  image-rendering: -webkit-optimize-contrast;
}

.image-placeholder {
  width: 100%;
  height: 100%;
  overflow: hidden;
  position: relative;
  background-color: #ccc;
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: flex;
  -webkit-flex-direction: column;
  -webkit-box-orient: vertical; /* Safari <= 6*/
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  -o-flex-direction: column;
  flex-direction: column;
  -webkit-align-items: center;
  -moz-align-items: center;
  -ms-align-items: center;
  -o-align-items: center;
  align-items: center;
  -webkit-justify-content: center;
  -moz-justify-content: center;
  -o-justify-content: center;
  -ms-justify-content: center;
  justify-content: center;
  flex-wrap: nowrap;
  -webkit-flex-wrap: nowrap;
  /*############################################
   *##
   *## Entities and Contents are using the same webfont icon for placeholders
   *## => Wenn dann ui-icon-entity draus machen oder ui-icon-image als generischen Platzhalter verwenden
   *############################################*/
}
.image-placeholder:before {
  font-family: TourispoWebfonts !important;
  font-weight: 400;
  font-style: normal;
  display: inline-block;
  content: "\f148";
  color: #ffffff;
  font-size: 3.6rem;
}
.image-placeholder.ui-icon-user0, .image-placeholder.ui-icon-user1, .image-placeholder.ui-icon-user {
  /*############################################
   *##
   *## Different background sizes for user placeholders
   *##
   *############################################*/
}
.image-placeholder.ui-icon-user0:before, .image-placeholder.ui-icon-user1:before, .image-placeholder.ui-icon-user:before {
  content: "\e616";
  line-height: 100%;
}
.image-placeholder.ui-icon-user0.tiny:before, .image-placeholder.ui-icon-user1.tiny:before, .image-placeholder.ui-icon-user.tiny:before {
  font-size: 28px;
}
.image-placeholder.ui-icon-user0.small:before, .image-placeholder.ui-icon-user1.small:before, .image-placeholder.ui-icon-user.small:before {
  font-size: 43px;
}
.image-placeholder.ui-icon-user0.medium:before, .image-placeholder.ui-icon-user1.medium:before, .image-placeholder.ui-icon-user.medium:before {
  font-size: 100px;
}
.image-placeholder.ui-icon-user0.large:before, .image-placeholder.ui-icon-user1.large:before, .image-placeholder.ui-icon-user.large:before {
  font-size: 150px;
}
.image-placeholder.ui-icon-user0.primaryci:before, .image-placeholder.ui-icon-user1.primaryci:before, .image-placeholder.ui-icon-user.primaryci:before {
  color: #0375b4;
}
.image-placeholder.ui-icon-user0.activeci, .image-placeholder.ui-icon-user1.activeci, .image-placeholder.ui-icon-user.activeci {
  color: #ffc100;
}
.image-placeholder.ui-icon-user0.tiny, .image-placeholder.ui-icon-user1.tiny, .image-placeholder.ui-icon-user.tiny {
  width: 30px;
  height: 30px;
}
.image-placeholder.ui-icon-user0.small, .image-placeholder.ui-icon-user1.small, .image-placeholder.ui-icon-user.small {
  width: 45px;
  height: 45px;
}
.image-placeholder.ui-icon-user0.medium, .image-placeholder.ui-icon-user1.medium, .image-placeholder.ui-icon-user.medium {
  width: 110px;
  height: 110px;
}
.image-placeholder.ui-icon-user0.large, .image-placeholder.ui-icon-user1.large, .image-placeholder.ui-icon-user.large {
  width: 117px;
  height: 128px;
}

.label-value-combo.push-away, .label-checkbox-combo.push-away {
  justify-content: space-between !important;
}
.label-value-combo.push-away .label, .label-checkbox-combo.push-away .label {
  margin-right: 6px;
}
.label-value-combo.push-away.value-before-label .value, .label-checkbox-combo.push-away.value-before-label .value {
  margin-right: 6px;
}
.label-value-combo.push-away.value-before-label .label, .label-checkbox-combo.push-away.value-before-label .label {
  margin-right: 0;
}
.label-value-combo.push-away:not(.value-before-label) .value, .label-checkbox-combo.push-away:not(.value-before-label) .value {
  text-align: right;
}
.label-value-combo.value-before-label .value, .label-checkbox-combo.value-before-label .value {
  text-align: left;
}
.label-value-combo.remove-bottom-line, .label-checkbox-combo.remove-bottom-line {
  border-bottom: none;
}
.label-value-combo .label, .label-checkbox-combo .label {
  color: #727272;
  -moz-hyphens: auto;
  -o-hyphens: auto;
  -webkit-hyphens: auto;
  -ms-hyphens: auto;
  hyphens: auto;
  text-align: left;
  margin-right: 6px;
  display: inline-flex;
}
.label-value-combo .label:before, .label-checkbox-combo .label:before {
  color: #727272;
}
.label-value-combo .value, .label-checkbox-combo .value {
  flex-grow: 1;
}
.label-value-combo .value:not(.normal-font), .label-checkbox-combo .value:not(.normal-font) {
  font-weight: 700;
}

.icon-value-combo {
  color: #727272;
}
.icon-value-combo:before {
  color: #727272;
}

.label-checkbox-combo {
  padding: 3px 0;
}
.label-checkbox-combo:before {
  font-size: 1.3rem;
  margin-right: 10px;
  width: 16px;
  text-align: center;
}
.label-checkbox-combo.label-first .ui-icon-check:before {
  margin-right: 0 !important;
}
.label-checkbox-combo.color-icon.ui-icon-check:before {
  color: #75b34d;
}
.label-checkbox-combo.color-icon.ui-icon-missing:before {
  color: #ff0000;
}
.label-checkbox-combo.color-icon.ui-icon-unknown:before {
  color: #ccc;
}

.label-value-combo, .label-checkbox-combo, .icon-value-combo {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: start;
  -moz-box-pack: start;
  -ms-flex-pack: start;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: center;
  -moz-align-items: center;
  -ms-align-items: center;
  -o-align-items: center;
  align-items: center;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: flex-start;
  -moz-justify-content: flex-start;
  -o-justify-content: flex-start;
  -ms-justify-content: flex-start;
  justify-content: flex-start;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
}

.label-value-combo.autostyle, .label-checkbox-combo.autostyle, .icon-value-combo.autostyle {
  min-height: 34px;
  line-height: 1.2;
  padding: 10px 0;
  border-bottom: 1px solid #ccc;
}
.label-value-combo.autostyle[class^=ui-icon-]:before, .label-value-combo.autostyle[class*=" ui-icon-"]:before, .label-value-combo.autostyle [class^=ui-icon-]:before, .label-value-combo.autostyle [class*=" ui-icon-"]:before, .label-checkbox-combo.autostyle[class^=ui-icon-]:before, .label-checkbox-combo.autostyle[class*=" ui-icon-"]:before, .label-checkbox-combo.autostyle [class^=ui-icon-]:before, .label-checkbox-combo.autostyle [class*=" ui-icon-"]:before, .icon-value-combo.autostyle[class^=ui-icon-]:before, .icon-value-combo.autostyle[class*=" ui-icon-"]:before, .icon-value-combo.autostyle [class^=ui-icon-]:before, .icon-value-combo.autostyle [class*=" ui-icon-"]:before {
  margin-right: 10px;
  min-width: 24px;
  text-align: center;
}
.label-value-combo.hide-border, .label-checkbox-combo.hide-border, .icon-value-combo.hide-border {
  border-bottom: none;
}

.multi-label-value-combo {
  display: table;
  width: 100%;
  table-layout: fixed;
  border-bottom: 1px solid #ccc;
}
.multi-label-value-combo .label-value-combo {
  text-align: right;
  display: table-cell;
  border-bottom: none;
  flex-basis: auto;
}
.multi-label-value-combo .label-value-combo:first-child {
  text-align: left;
}

a {
  color: #0375b4;
  text-decoration: none;
  /*############################################
   *##
   *## The :hover state of the links ist defined in links.d.less
   *## as otherwise there would always be two clicks necessary on mobile devices
   *## for links with a hover state
   *##
   *############################################*/
}
a.secondary {
  color: #727272;
}
a.contrast {
  color: #f18825;
}
a.show-details {
  margin-top: 6px;
  color: #f18825;
}
a.show-details:before {
  font-family: TourispoWebfonts !important;
  font-weight: 400;
  font-style: normal;
  display: inline-block;
  content: "\f054";
  margin-right: 6px;
}
a.disabled {
  color: #ccc;
  pointer-events: none;
  cursor: default;
}
a.active, a:hover {
  color: #f18825;
}
a.active:before, a.active:after, a:hover:before, a:hover:after {
  color: #f18825;
}

.pagination {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: start;
  -moz-box-pack: start;
  -ms-flex-pack: start;
  -webkit-box-align: stretch;
  -moz-box-align: stretch;
  -ms-flex-align: stretch;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: flex-start;
  -moz-justify-content: flex-start;
  -o-justify-content: flex-start;
  -ms-justify-content: flex-start;
  justify-content: flex-start;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
  width: 100%;
}
.pagination .pagination-link {
  flex-grow: 1;
  -webkit-flex-grow: 1;
  -moz-flex-grow: 1;
  -ms-flex-grow: 1;
  -o-flex-grow: 1;
  text-align: center;
  padding-top: 10px;
  padding-bottom: 10px;
  border: 1px solid #ccc;
}
.pagination .pagination-link:not(.disabled) {
  overflow: hidden;
  transform: translate3d(0, 0, 0);
  position: relative;
}
.pagination .pagination-link:not(.disabled):after {
  content: "";
  display: block;
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  pointer-events: none;
  background-image: radial-gradient(circle, #0375b4 10%, transparent 10.01%);
  background-repeat: no-repeat;
  background-position: 50%;
  transform: scale(10, 10);
  opacity: 0;
  transition: transform 0.5s, opacity 1s;
}
.pagination .pagination-link:not(.disabled):active:after {
  transform: scale(0, 0);
  opacity: 0.2;
  transition: 0s;
}
.pagination .pagination-link:not(.disabled):hover {
  background-color: #f1f1f1;
  color: #171b2d;
}
.pagination .pagination-link:not(.disabled):hover:before {
  color: #171b2d;
}
.pagination .pagination-link:not(.disabled) a:hover {
  color: #171b2d;
}
.pagination .pagination-link:not(.disabled) a:hover:before {
  color: #171b2d;
}
.pagination .pagination-link:not(:first-child) {
  border-left: none;
}
.pagination .pagination-link.disabled {
  color: #ccc;
}
.pagination .pagination-link.active {
  color: #ffffff;
  background-color: #0375b4;
}

.select2-container--default {
  width: 100% !important;
  /*############################################
   *## Part showing when Dropdown is closed)
   *############################################*/
  /*############################################
   *## Part only showing when DropDown is opened (positioned absolutely as child of body)
   *############################################*/
}
.select2-container--default .select2-selection--single {
  border: none;
  border-radius: 0;
  border-bottom: 1px solid #ccc;
}
.select2-container--default .select2-selection--single .select2-selection__arrow b {
  border-color: #727272 transparent transparent transparent;
}
.select2-container--default .select2-selection--single .select2-selection__rendered {
  color: #727272;
}
.select2-container--default.select2-container--open .select2-results__option {
  color: #727272;
}
.select2-container--default.select2-container--open .select2-selection__arrow b {
  border-color: transparent transparent #727272 transparent;
}
.select2-container--default.select2-container--open .select2-results__option[aria-selected=true] {
  background-color: #ccc;
}
.select2-container--default.select2-container--open .select2-results__option--highlighted[aria-selected] {
  background-color: #0375b4;
  color: #ffffff;
}
.select2-search::before {
  color: #727272;
  font-family: TourispoWebfonts !important;
  font-weight: 400;
  font-style: normal;
  display: inline-block;
  content: "\f4a4";
  position: absolute;
  top: 10px;
  left: 10px;
}
.select2-search .select2-search__field {
  padding-left: 20px;
  border: 1px solid #ccc;
}

.select2-container--default .select2-dropdown {
  -ms-transition: all 200ms ease 0s;
  transition: all 200ms ease 0s;
  -ms-transition-property: transform;
  transition-property: transform;
  border: 1px solid #ccc;
  transform-origin: top;
  overflow: hidden;
}

.social-buttons-round a, .social-buttons-round div {
  display: inline-block;
  vertical-align: top;
  width: 40px;
  height: 40px;
  background-color: #0375b4;
  color: #ffffff;
  border-radius: 50%;
  margin: 0 6px;
}
.social-buttons-round a:before, .social-buttons-round div:before {
  border-radius: 50%;
  line-height: 42px;
  font-size: 22px;
  text-align: center;
  width: 100%;
  height: 100%;
}
.social-buttons-round a:hover, .social-buttons-round div:hover {
  background-color: #171b2d;
}
.social-buttons-round a:hover:before, .social-buttons-round div:hover:before {
  color: #ffffff;
}

.default-table caption {
  text-align: left;
  font-size: 1.3rem;
  color: #727272;
  font-weight: 400;
  clear: both;
}
.default-table thead th {
  background-color: #ccc;
  color: #727272;
}
.default-table th {
  font-weight: 400;
  padding: 10px 6px;
  text-align: left;
}
.default-table tbody tr {
  background-color: #fafafa;
  border-bottom: 1px solid #ccc;
}
.default-table tbody tr:hover {
  background-color: #f1f1f1;
}
.default-table tbody tr:hover a, .default-table tbody tr:hover td {
  color: #171b2d;
}
.default-table td {
  color: #727272;
  padding: 10px 6px;
  overflow: hidden;
  transform: translate3d(0, 0, 0);
  position: relative;
}
.default-table td:after {
  content: "";
  display: block;
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  pointer-events: none;
  background-image: radial-gradient(circle, #0375b4 10%, transparent 10.01%);
  background-repeat: no-repeat;
  background-position: 50%;
  transform: scale(10, 10);
  opacity: 0;
  transition: transform 0.5s, opacity 1s;
}
.default-table td:active:after {
  transform: scale(0, 0);
  opacity: 0.2;
  transition: 0s;
}
.default-table td:hover {
  background-color: #f1f1f1;
  color: #171b2d;
}
.default-table td:hover:before {
  color: #171b2d;
}
.default-table td a:hover {
  color: #171b2d;
}
.default-table td a:hover:before {
  color: #171b2d;
}
.default-table td a {
  display: block;
  width: 100%;
}

.tile-toggle {
  cursor: pointer;
  background-color: #ffffff;
  padding: 10px;
  border: 1px solid #ccc;
  width: 100%;
  height: 100px;
  -moz-hyphens: auto;
  -o-hyphens: auto;
  -webkit-hyphens: auto;
  -ms-hyphens: auto;
  hyphens: auto;
  text-align: center;
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: flex;
  -webkit-flex-direction: column;
  -webkit-box-orient: vertical; /* Safari <= 6*/
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  -o-flex-direction: column;
  flex-direction: column;
  -webkit-align-items: center;
  -moz-align-items: center;
  -ms-align-items: center;
  -o-align-items: center;
  align-items: center;
  -webkit-justify-content: center;
  -moz-justify-content: center;
  -o-justify-content: center;
  -ms-justify-content: center;
  justify-content: center;
  flex-wrap: nowrap;
  -webkit-flex-wrap: nowrap;
}
.tile-toggle:before {
  font-family: TourispoWebfonts !important;
  font-weight: 400;
  font-style: normal;
  display: inline-block;
  color: #0375b4;
  font-size: 2rem;
  margin-bottom: 10px;
}
.tile-toggle.active, .tile-toggle:hover {
  background-color: #171b2d;
  color: #ffffff;
}
.tile-toggle.active:before, .tile-toggle:hover:before {
  color: #ffffff;
}

.tile-toggle-radio, .tile-toggle-radio + label {
  display: none !important;
}

.video-container .video-duration-box {
  position: absolute;
  top: 10px;
  right: 10px;
  background-color: rgba(0, 0, 0, 0.6);
  padding: 10px;
}
.video-container .video-frame {
  position: relative;
  width: 100%;
  height: 0;
  padding-bottom: 56.25%;
}
.video-container .video-frame .video-preview-thumb, .video-container .video-frame iframe {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}
.video-container .video-frame .video-play-button {
  position: absolute;
  width: 80px;
  height: 60px;
  margin-left: -40px;
  margin-top: -30px;
  left: 50%;
  top: 50%;
  background-color: #ff0000;
  border-radius: 10px;
  cursor: pointer;
  z-index: 1;
}
.video-container .video-frame .video-play-button.small {
  width: 30px;
  height: 20px;
  margin-left: -15px;
  margin-top: -10px;
  border-radius: 5px;
}
.video-container .video-frame .video-play-button.small:before {
  font-size: 14px;
  line-height: 20px;
}
.video-container .video-frame .video-play-button:before {
  color: #ffffff;
  font-size: 24px;
  text-align: center;
  width: 100%;
  line-height: 60px;
}
.video-container .video-frame .video-play-button:hover {
  background-color: #0375b4;
}
.video-container .video-frame .video-play-button:hover:before {
  color: #ffffff;
}

/*############################################
 *## Smaller videos are opened in ColorBox to implement the zoom in functionality
 *############################################*/
#colorbox .video-frame {
  height: 500px;
  width: 600px;
}

/*## components/dialogs                  #####*/
#colorbox {
  overflow: visible;
}
#colorbox #cboxLoadedContent {
  height: 100%;
  max-width: 100%;
}
#colorbox #cboxLoadedContent .onlyContentSite {
  height: 100%;
}
#colorbox #cboxContent {
  position: relative;
  box-sizing: initial;
  padding: 10px;
  border-radius: 5px;
  /*-moz-border-radius:10px;*/
  background: #fff;
  overflow: visible;
  max-width: 100vw;
}
#colorbox #cboxTitle {
  background-color: #0375b4;
  color: #ffffff;
  font-size: 1.2em;
  font-weight: bold;
  line-height: 30px;
  position: absolute;
  z-index: 100;
  top: 27px;
  left: 0;
  padding: 0 42px 0 20px;
  max-width: 90%;
  -ms-transition: all 300ms linear 0s;
  transition: all 300ms linear 0s;
  -ms-transition-property: all;
  transition-property: all;
  /*############################################
   *## The collapseable icon after the headline
   *############################################*/
  /*############################################
  *## Animating the icon to collapse on hovering
  *############################################*/
  /*############################################
  *## The collapsed state
  *############################################*/
}
#colorbox #cboxTitle:after {
  font-family: TourispoWebfonts !important;
  font-weight: 400;
  font-style: normal;
  display: inline-block;
  font-size: 25px;
  content: "\f100";
  position: absolute;
  right: 10px;
  top: 50%;
  line-height: 1px;
  width: 10px;
}
#colorbox #cboxTitle:hover {
  cursor: pointer;
}
#colorbox #cboxTitle:hover:after {
  -webkit-animation: slideOutLeft 1s ease 0s 2;
  -moz-animation: slideOutLeft 1s ease 0s 2;
  -ms-animation: slideOutLeft 1s ease 0s 2;
  -o-animation: slideOutLeft 1s ease 0s 2;
  animation: slideOutLeft 1s ease 0s 2;
}
#colorbox #cboxTitle.collapsed {
  color: #0375b4;
  width: 30px;
  height: 34px;
  overflow: hidden;
  padding: 0;
  /*############################################
   *##
   *## Animating the icon to uncollapse on hovering
   *##
   *############################################*/
}
#colorbox #cboxTitle.collapsed:after {
  color: #ffffff;
  content: "\f101";
}
#colorbox #cboxTitle.collapsed:hover {
  cursor: pointer;
}
#colorbox #cboxTitle.collapsed:hover:after {
  -webkit-animation: slideOutRight 1s ease 0s 2;
  -moz-animation: slideOutRight 1s ease 0s 2;
  -ms-animation: slideOutRight 1s ease 0s 2;
  -o-animation: slideOutRight 1s ease 0s 2;
  animation: slideOutRight 1s ease 0s 2;
}
#colorbox #cboxCurrent {
  /*don't  display current item e.g. item 2 of 6*/
  display: none !important;
}

/*############################################
 *## Next, Prev and Close Icons
 *############################################*/
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow {
  cursor: pointer;
}

#cboxPrevious, #cboxNext {
  position: absolute;
  height: 90%;
  width: 30%;
  top: 0;
  background: transparent;
  font-family: TourispoWebfonts !important;
  font-weight: 400;
  font-style: normal;
  display: inline-block;
  font-size: 37px;
  color: #0375b4;
}
#cboxPrevious:hover:after, #cboxNext:hover:after {
  width: 50px;
  visibility: visible;
}
#cboxPrevious:after, #cboxNext:after {
  visibility: hidden;
  -ms-transition: all 300ms ease 0s;
  transition: all 300ms ease 0s;
  -ms-transition-property: all;
  transition-property: all;
  width: 0;
  overflow: hidden;
  height: 100px;
  line-height: 100px;
  background-color: rgba(255, 255, 255, 0.75);
  position: absolute;
  top: 50%;
  margin-top: -25px;
}

#cboxNext {
  right: 0;
}
#cboxNext:after {
  padding-left: 27px;
  content: "\f054";
  right: 0;
  text-align: left;
}

#cboxPrevious {
  left: 0;
}
#cboxPrevious:after {
  padding-right: 27px;
  content: "\f053";
  left: 0;
  text-align: right;
}

#cboxClose {
  top: 4px;
  right: 3px;
  position: absolute;
  z-index: 100;
  background: transparent;
  color: #0375b4;
}
#cboxClose:before {
  font-family: TourispoWebfonts !important;
  font-weight: 400;
  font-style: normal;
  display: inline-block;
  font-size: 22px;
  content: "\f12a";
  background-color: #FFF;
  padding: 3px 0 6px 6px;
  border-radius: 0 0 0 15px;
}
#cboxClose:hover {
  color: #f18825;
}

/*############################################
 *## Background Fader
 *############################################*/
#cboxOverlay {
  background-color: rgba(0, 0, 0, 0.6);
}

#ui-datepicker-div {
  width: 302px;
  /*############################################
  *## Container to select year containing arrows to swipe forward and backwards
  *############################################*/
  /*############################################
   *## Container showing large string representation of currently selected date
   *############################################*/
  /*############################################
   *## Container holding days to choose from
   *############################################*/
}
.ui-datepicker-header {
  color: #727272;
  font-weight: 400;
  padding: 14px;
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: center;
  -moz-align-items: center;
  -ms-align-items: center;
  -o-align-items: center;
  align-items: center;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
}
.ui-datepicker-prev {
  order: 1;
}

.ui-datepicker-title {
  order: 2;
}
.ui-datepicker-title:after {
  position: absolute;
  top: 4px;
  right: 30px;
  width: 74px;
  left: auto;
}

.ui-datepicker-next {
  order: 3;
}

.ui-datepicker-prev, .ui-datepicker-next {
  font-size: 30px;
  padding: 0 14px;
  cursor: pointer;
}

.ui-datepicker-year {
  color: #727272;
  background-color: #ffffff;
  cursor: pointer;
}

.ui-datepicker-currently-selected {
  background-color: #0375b4;
  padding: 14px;
}
.ui-datepicker-currently-selected + .ui-datepicker-header {
  border-top: none;
}
.ui-datepicker-currently-selected__year {
  color: #67acd2;
  font-weight: 400;
}

.ui-datepicker-currently-selected__month-day {
  color: #ffffff;
  font-weight: 700;
  font-size: 1.6rem;
}

.ui-datepicker-calendar {
  width: 100%;
  border: 14px solid #ffffff;
}
.ui-datepicker-calendar a, .ui-datepicker-calendar span {
  display: block;
  padding: 10px;
  text-align: center;
  position: relative;
}
.ui-datepicker-calendar th {
  font-weight: 400;
  color: #727272;
}
.ui-datepicker-calendar td:not(.ui-datepicker-unselectable) {
  position: relative;
}
.ui-datepicker-calendar td:not(.ui-datepicker-unselectable):after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 0;
  height: 0;
  margin-left: 0;
  margin-top: 0;
  opacity: 0;
  -ms-transition: all 300ms ease 0s;
  transition: all 300ms ease 0s;
  -ms-transition-property: width, height, margin, opacity;
  transition-property: width, height, margin, opacity;
}
.ui-datepicker-calendar td:not(.ui-datepicker-unselectable):hover a {
  color: #ffffff;
  position: relative;
  z-index: 2;
}

.dialog {
  opacity: 1;
  -ms-transition: all 800ms ease 0s;
  transition: all 800ms ease 0s;
  -ms-transition-property: opacity, z-index;
  transition-property: opacity, z-index;
  visibility: visible;
}
.dialog.dialog--hidden {
  opacity: 0;
}
.dialog.dialog--hidden .dialog__popup {
  opacity: 0;
  margin-top: 100px;
}

.dialog.dialog--centered {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: flex;
  -webkit-flex-direction: column;
  -webkit-box-orient: vertical; /* Safari <= 6*/
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  -o-flex-direction: column;
  flex-direction: column;
  -webkit-align-items: center;
  -moz-align-items: center;
  -ms-align-items: center;
  -o-align-items: center;
  align-items: center;
  -webkit-justify-content: space-around;
  -moz-justify-content: space-around;
  -o-justify-content: space-around;
  -ms-justify-content: space-around;
  justify-content: space-around;
  flex-wrap: nowrap;
  -webkit-flex-wrap: nowrap;
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: distribute;
  -moz-box-pack: distribute;
  -ms-flex-pack: distribute;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
}

.dialog.dialog__background {
  position: fixed;
  z-index: -1;
  display: none;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  background-color: rgba(0, 0, 0, 0.6);
}
.dialog.dialog__background:not(.dialog--hidden) {
  display: flex;
  z-index: 1000;
  visibility: visible;
}

.dialog__popup {
  -ms-transition: all 200ms ease 0s;
  transition: all 200ms ease 0s;
  -ms-transition-property: margin, opacity;
  transition-property: margin, opacity;
  opacity: 1;
  z-index: 20 !important;
  background-color: #ffffff;
  border-radius: 2px;
  box-shadow: rgba(0, 0, 0, 0.25) 0px 14px 45px, rgba(0, 0, 0, 0.22) 0px 10px 18px;
  max-width: 90%;
  margin-top: 0;
}
.dialog__actions {
  padding: 10px;
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: end;
  -moz-box-pack: end;
  -ms-flex-pack: end;
  -webkit-box-align: stretch;
  -moz-box-align: stretch;
  -ms-flex-align: stretch;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  box-lines: multiple;
  -moz-box-lines: multiple;
  -webkit-box-lines: multiple;
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-flex-flow: row wrap;
  -webkit-justify-content: flex-end;
  -moz-justify-content: flex-end;
  -o-justify-content: flex-end;
  -ms-justify-content: flex-end;
  justify-content: flex-end;
  flex-wrap: wrap;
  -ms-flex-wrap: wrap; /* IE 10 */
  -webkit-flex-wrap: wrap;
  text-transform: uppercase;
}
.dialog__actions .link {
  font-size: 1.3rem;
  font-weight: 400;
  padding: 10px;
}
.dialog__actions .link:not(:first-child) {
  margin-left: 10px;
}

.dialog__headline, .dialog__content {
  padding: 10px;
}

@media all and (min-width: 1025px) {
  .dialog__popup {
    max-width: 600px;
  }
}

.tooltip {
  display: block;
  color: #727272;
  padding: 6px;
  position: absolute;
  background: #ffffff;
  z-index: 200;
  border: 1px solid #ccc;
  box-shadow: rgba(0, 0, 0, 0.25) 0px 14px 45px, rgba(0, 0, 0, 0.22) 0px 10px 18px;
  font-size: 0.84rem;
  /*############################################
   *## Arrow: Default position at the bottom
   *############################################*/
  /*############################################
   *## Arrow:Position at the top
   *############################################*/
}
.tooltip.tooltip--hidden {
  display: none;
}
.tooltip .tooltip-close {
  position: absolute;
  right: -10px;
  top: -10px;
  width: 33px;
  height: 33px;
  z-index: 1;
  border-radius: 50%;
  background-color: #ffffff;
  color: #0375b4;
}
.tooltip .tooltip-close:hover {
  text-decoration: none;
}
.tooltip .tooltip-close:before {
  font-size: 30px;
  position: relative;
  top: 1px;
  left: 2px;
}
.tooltip .sb-arrow-small:after, .tooltip .sb-arrow-small:before {
  top: 100%;
  left: 20px;
  border: solid transparent;
  content: " ";
  height: 0;
  width: 0;
  position: absolute;
  pointer-events: none;
}
.tooltip .sb-arrow-small:before {
  border-color: transparent;
  border-top-color: #ccc;
  border-width: 11px;
  margin-left: -11px;
}
.tooltip .sb-arrow-small:after {
  border-color: transparent;
  border-top-color: #ffffff;
  border-width: 10px;
  margin-left: -10px;
}
.tooltip .sb-arrow-top:after, .tooltip .sb-arrow-top:before {
  border-top-color: transparent;
}
.tooltip .sb-arrow-top:before {
  top: -23px;
  border-bottom-color: #ccc;
}
.tooltip .sb-arrow-top:after {
  top: -20px;
  border-bottom-color: #ffffff;
}

.tooltip--under-mouse:after {
  top: -20px;
}

.tooltip--under-mouse:before {
  top: -22px;
}

.tooltip--under-mouse:after {
  border-color: transparent;
  border-bottom-color: #ffffff;
}

.tooltip--under-mouse:before {
  border-color: transparent;
  border-bottom-color: #ccc;
}

/*## components/forms                    #####*/
button, .button {
  cursor: pointer !important;
}

button.is-no-cbox, .button {
  font-weight: 400;
  box-shadow: 0 2px 2px 0 rgba(153, 153, 153, 0.14), 0 3px 1px -2px rgba(153, 153, 153, 0.2), 0 1px 5px 0 rgba(153, 153, 153, 0.12);
  border-radius: 3px;
  min-width: 40px;
  display: inline-block;
  text-decoration: none;
  text-align: center;
  line-height: 19px;
  -moz-hyphens: auto;
  -o-hyphens: auto;
  -webkit-hyphens: auto;
  -ms-hyphens: auto;
  hyphens: auto;
  overflow: hidden;
  transform: translate3d(0, 0, 0);
  position: relative;
  /* ##########################################
   * ## Huge Button (padding + fontsize)
   * ##########################################
   */
}
button.is-no-cbox:after, .button:after {
  content: "";
  display: block;
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  pointer-events: none;
  background-image: radial-gradient(circle, #FFF 10%, transparent 10.01%);
  background-repeat: no-repeat;
  background-position: 50%;
  transform: scale(10, 10);
  opacity: 0;
  transition: transform 0.5s, opacity 1s;
}
button.is-no-cbox:active:after, .button:active:after {
  transform: scale(0, 0);
  opacity: 0.2;
  transition: 0s;
}
button.is-no-cbox:hover, .button:hover {
  text-decoration: none;
}
button.is-no-cbox:active, .button:active {
  transform: translate(0, 1px);
}
button.is-no-cbox.progressindicator, .button.progressindicator {
  overflow: visible;
}
button.is-no-cbox.progressindicator:not(.right), .button.progressindicator:not(.right) {
  margin-right: 10px;
}
button.is-no-cbox.progressindicator.right, .button.progressindicator.right {
  padding-right: 40px !important;
}
button.is-no-cbox.progressindicator.right:before, .button.progressindicator.right:before {
  position: absolute;
  right: 10px;
  top: 7px;
}
button.is-no-cbox.deactivated-on-edit, .button.deactivated-on-edit {
  background-color: rgba(0, 0, 0, 0.1);
}
button.is-no-cbox.with-icon, .button.with-icon {
  text-align: left;
  padding-right: 10px;
  position: relative;
}
button.is-no-cbox.with-icon:before, button.is-no-cbox.with-icon:after, .button.with-icon:before, .button.with-icon:after {
  height: 100%;
  color: #ffffff;
  position: absolute;
  left: 0;
  top: 0;
  border-radius: 3px 0 0 3px;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
}
button.is-no-cbox.onlyicon:before, .button.onlyicon:before {
  width: 100% !important;
  border-radius: 3px !important;
}
button.is-no-cbox.huge, .button.huge {
  font-size: 1.3rem;
  min-height: 36px;
  /*############################################
   *## The .button-class is used if we style a div as a button and do not use the button-tag(sometimes this is necessary)
   *## and there we have to set another height and line-height
   *############################################*/
}
button.is-no-cbox.huge.button, .button.huge.button {
  height: 36px;
  line-height: 36px;
}
button.is-no-cbox.huge.button.double-line-label, .button.huge.button.double-line-label {
  line-height: 18px;
}
button.is-no-cbox.huge.with-icon, .button.huge.with-icon {
  padding-left: 50px;
}
button.is-no-cbox.huge.with-icon:before, .button.huge.with-icon:before {
  font-size: 24px;
  width: 40px;
}
button.is-no-cbox.huge.with-icon.align-right, .button.huge.with-icon.align-right {
  padding-right: 50px;
  padding-left: 20px;
}
button.is-no-cbox.huge.progressindicator:before, .button.huge.progressindicator:before {
  margin-left: 6px;
}
button.is-no-cbox.huge:not(.with-icon), .button.huge:not(.with-icon) {
  padding: 0 14px;
}
button.is-no-cbox.medium, .button.medium {
  font-size: 1rem;
  min-height: 30px;
  /*############################################
   *## The .button-class is used if we style a div as a button and do not use the button-tag(sometimes this is necessary)
   *## and there we have to set another height and line-height
   *############################################*/
}
button.is-no-cbox.medium.button, .button.medium.button {
  height: 30px;
  line-height: 30px;
}
button.is-no-cbox.medium.button.double-line-label, .button.medium.button.double-line-label {
  line-height: 15px;
}
button.is-no-cbox.medium.with-icon, .button.medium.with-icon {
  padding-left: 40px;
}
button.is-no-cbox.medium.with-icon:before, .button.medium.with-icon:before {
  font-size: 18px;
  width: 30px;
}
button.is-no-cbox.medium.with-icon.align-right, .button.medium.with-icon.align-right {
  padding-right: 40px;
  padding-left: 20px;
}
button.is-no-cbox.medium.progressindicator:before, .button.medium.progressindicator:before {
  margin-left: 6px;
}
button.is-no-cbox.medium:not(.with-icon), .button.medium:not(.with-icon) {
  padding: 0 10px;
}
button.is-no-cbox.medium.progressindicator:before, .button.medium.progressindicator:before {
  top: 4px;
}
button.is-no-cbox.small, .button.small {
  font-size: 0.84rem;
  min-height: 24px;
  /*############################################
   *## The .button-class is used if we style a div as a button and do not use the button-tag(sometimes this is necessary)
   *## and there we have to set another height and line-height
   *############################################*/
}
button.is-no-cbox.small.button, .button.small.button {
  height: 24px;
  line-height: 24px;
}
button.is-no-cbox.small.button.double-line-label, .button.small.button.double-line-label {
  line-height: 12px;
}
button.is-no-cbox.small.with-icon, .button.small.with-icon {
  padding-left: 34px;
}
button.is-no-cbox.small.with-icon:before, .button.small.with-icon:before {
  font-size: 13px;
  width: 24px;
}
button.is-no-cbox.small.with-icon.align-right, .button.small.with-icon.align-right {
  padding-right: 34px;
  padding-left: 20px;
}
button.is-no-cbox.small.progressindicator:before, .button.small.progressindicator:before {
  margin-left: 6px;
}
button.is-no-cbox.small:not(.with-icon), .button.small:not(.with-icon) {
  padding: 0 6px;
}
button.is-no-cbox.small.progressindicator:before, .button.small.progressindicator:before {
  top: 2px;
  font-size: 18px !important;
  height: 18px !important;
  width: 18px !important;
  line-height: 18px;
}
button.is-no-cbox.mini, .button.mini {
  font-size: 0.84rem;
  min-height: 20px;
  /*############################################
   *## The .button-class is used if we style a div as a button and do not use the button-tag(sometimes this is necessary)
   *## and there we have to set another height and line-height
   *############################################*/
}
button.is-no-cbox.mini.button, .button.mini.button {
  height: 20px;
  line-height: 20px;
}
button.is-no-cbox.mini.button.double-line-label, .button.mini.button.double-line-label {
  line-height: 10px;
}
button.is-no-cbox.mini.with-icon, .button.mini.with-icon {
  padding-left: 30px;
}
button.is-no-cbox.mini.with-icon:before, .button.mini.with-icon:before {
  font-size: 11px;
  width: 20px;
}
button.is-no-cbox.mini.with-icon.align-right, .button.mini.with-icon.align-right {
  padding-right: 30px;
  padding-left: 20px;
}
button.is-no-cbox.mini.progressindicator:before, .button.mini.progressindicator:before {
  margin-left: 6px;
}
button.is-no-cbox.mini:not(.with-icon), .button.mini:not(.with-icon) {
  padding: 0 6px;
}
button.is-no-cbox.primary, .button.primary {
  color: #ffffff;
  background-color: #0375b4;
}
button.is-no-cbox.primary:hover, .button.primary:hover {
  color: #ffffff;
  box-shadow: 0 14px 26px -12px rgba(3, 117, 180, 0.6), 0 4px 23px 0px rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(3, 117, 180, 0.6);
}
button.is-no-cbox.primary:hover:before, .button.primary:hover:before {
  color: #ffffff;
}
button.is-no-cbox.primary.with-icon:before, .button.primary.with-icon:before {
  background-color: #171b2d;
}
button.is-no-cbox.primary:hover, button.is-no-cbox.primary:active, .button.primary:hover, .button.primary:active {
  background: #171b2d;
}
button.is-no-cbox.primary.onlyicon, .button.primary.onlyicon {
  background-color: #0375b4;
}
button.is-no-cbox.primary.onlyicon:before, .button.primary.onlyicon:before {
  background: #0375b4;
}
button.is-no-cbox.primary.onlyicon:hover, button.is-no-cbox.primary.onlyicon:active, button.is-no-cbox.primary.onlyicon:hover:before, button.is-no-cbox.primary.onlyicon:active:before, .button.primary.onlyicon:hover, .button.primary.onlyicon:active, .button.primary.onlyicon:hover:before, .button.primary.onlyicon:active:before {
  background: #171b2d !important;
}
button.is-no-cbox.contrast, .button.contrast {
  color: #ffffff;
  background-color: #f18825;
}
button.is-no-cbox.contrast:hover, .button.contrast:hover {
  color: #ffffff;
  box-shadow: 0 14px 26px -12px rgba(255, 110, 14, 0.6), 0 4px 23px 0px rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(255, 110, 14, 0.6);
}
button.is-no-cbox.contrast:hover:before, .button.contrast:hover:before {
  color: #ffffff;
}
button.is-no-cbox.contrast.with-icon:before, .button.contrast.with-icon:before {
  background-color: #ed7503;
}
button.is-no-cbox.contrast:hover, button.is-no-cbox.contrast:active, .button.contrast:hover, .button.contrast:active {
  background: #ed7503;
}
button.is-no-cbox.contrast.onlyicon, .button.contrast.onlyicon {
  background-color: #f18825;
}
button.is-no-cbox.contrast.onlyicon:before, .button.contrast.onlyicon:before {
  background: #f18825;
}
button.is-no-cbox.contrast.onlyicon:hover, button.is-no-cbox.contrast.onlyicon:active, button.is-no-cbox.contrast.onlyicon:hover:before, button.is-no-cbox.contrast.onlyicon:active:before, .button.contrast.onlyicon:hover, .button.contrast.onlyicon:active, .button.contrast.onlyicon:hover:before, .button.contrast.onlyicon:active:before {
  background: #ed7503 !important;
}
button.is-no-cbox.warning, .button.warning {
  color: #ffffff;
  background-color: #b95252;
}
button.is-no-cbox.warning:hover, .button.warning:hover {
  color: #ffffff;
  box-shadow: 0 14px 26px -12px #b95252, 0 4px 23px 0px rgba(0, 0, 0, 0.12), 0 8px 10px -5px #b95252;
}
button.is-no-cbox.warning:hover:before, .button.warning:hover:before {
  color: #ffffff;
}
button.is-no-cbox.warning.with-icon:before, .button.warning.with-icon:before {
  background-color: #ff0000;
}
button.is-no-cbox.warning:hover, button.is-no-cbox.warning:active, .button.warning:hover, .button.warning:active {
  background: #ff0000;
}
button.is-no-cbox.warning.onlyicon, .button.warning.onlyicon {
  background-color: #ff0000;
}
button.is-no-cbox.warning.onlyicon:before, .button.warning.onlyicon:before {
  background: #ff0000;
}
button.is-no-cbox.warning.onlyicon:hover, button.is-no-cbox.warning.onlyicon:active, button.is-no-cbox.warning.onlyicon:hover:before, button.is-no-cbox.warning.onlyicon:active:before, .button.warning.onlyicon:hover, .button.warning.onlyicon:active, .button.warning.onlyicon:hover:before, .button.warning.onlyicon:active:before {
  background: #ff0000 !important;
}
button.is-no-cbox.success, .button.success {
  color: #ffffff;
  background-color: #92b147;
}
button.is-no-cbox.success:hover, .button.success:hover {
  color: #ffffff;
  box-shadow: 0 14px 26px -12px #92b147, 0 4px 23px 0px rgba(0, 0, 0, 0.12), 0 8px 10px -5px #92b147;
}
button.is-no-cbox.success:hover:before, .button.success:hover:before {
  color: #ffffff;
}
button.is-no-cbox.success.with-icon:before, .button.success.with-icon:before {
  background-color: #42910e;
}
button.is-no-cbox.success:hover, button.is-no-cbox.success:active, .button.success:hover, .button.success:active {
  background: #42910e;
}
button.is-no-cbox.success.onlyicon, .button.success.onlyicon {
  background-color: #42910e;
}
button.is-no-cbox.success.onlyicon:before, .button.success.onlyicon:before {
  background: #42910e;
}
button.is-no-cbox.success.onlyicon:hover, button.is-no-cbox.success.onlyicon:active, button.is-no-cbox.success.onlyicon:hover:before, button.is-no-cbox.success.onlyicon:active:before, .button.success.onlyicon:hover, .button.success.onlyicon:active, .button.success.onlyicon:hover:before, .button.success.onlyicon:active:before {
  background: #42910e !important;
}
button.is-no-cbox.disabled, .button.disabled {
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)"; /* IE8 */
  opacity: 0.5; /* Other browsers */
  cursor: auto;
}

/**
 * The DropDown caret (triangle pointing down)
 */
.dropdown-container.with-standard-label {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: flex;
  -webkit-flex-direction: column;
  -webkit-box-orient: vertical; /* Safari <= 6*/
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  -o-flex-direction: column;
  flex-direction: column;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: nowrap;
  -webkit-flex-wrap: nowrap;
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
}
.dropdown-container.with-cool-label {
  position: relative;
  top: -10px;
  padding-top: 20px;
}
.dropdown-container .standardlabel {
  padding-bottom: 6px;
}

.dropdown {
  position: relative;
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: stretch;
  -moz-box-align: stretch;
  -ms-flex-align: stretch;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
  border: 1px solid #ccc;
  background-color: #fafafa;
  height: 50px;
}
.dropdown.white-background {
  background-color: #ffffff;
}
.dropdown.white-background button {
  background-color: #ffffff;
}
.dropdown label.coollabel {
  top: -16px;
  width: fit-content;
  cursor: pointer;
}
.dropdown button {
  color: #727272;
  border-radius: 3px;
  width: 100%;
  cursor: pointer;
  background-color: #fafafa;
}
.dropdown button.dropdown-button1 {
  padding-left: 10px;
  flex-grow: 1;
  -webkit-flex-grow: 1;
  -moz-flex-grow: 1;
  -ms-flex-grow: 1;
  -o-flex-grow: 1;
}
.dropdown button.dropdown-button2 {
  width: 50px;
  flex-shrink: 0;
  -webkit-flex-shrink: 0;
  -moz-flex-shrink: 0;
  -ms-flex-shrink: 0;
  -o-flex-shrink: 0;
}
.dropdown button.dropdown-button2:before {
  content: "";
  width: 1px;
  height: 36px;
  border-left: 1px solid #ccc;
  border-right: 2px solid #ffffff;
}
.dropdown button.dropdown-button2:after {
  position: absolute;
  top: 23px !important;
  right: 17px;
  /* Styling the down arrow */
  width: 0;
  height: 0;
  padding: 0;
  content: "";
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-top: 6px solid #ccc;
  pointer-events: none;
}
.dropdown .progressindicator {
  position: absolute;
  left: -27px;
  top: 35px;
}
.dropdown .reset-dropdown {
  order: 4;
}

.dropdown-list {
  position: absolute;
  z-index: 10001;
  top: 2px;
  text-align: left;
  padding: 0 5px;
  border: 1px solid #ccc;
  box-shadow: rgba(0, 0, 0, 0.25) 0px 14px 45px, rgba(0, 0, 0, 0.22) 0px 10px 18px;
  border-radius: 5px;
  background-color: white;
  max-height: 230px;
  overflow: auto;
}
.dropdown-list .dropdown-list-element {
  cursor: pointer;
  width: 100%;
  overflow: hidden;
  transform: translate3d(0, 0, 0);
  position: relative;
  line-height: 2.5;
  display: flex;
}
.dropdown-list .dropdown-list-element:after {
  content: "";
  display: block;
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  pointer-events: none;
  background-image: radial-gradient(circle, #0375b4 10%, transparent 10.01%);
  background-repeat: no-repeat;
  background-position: 50%;
  transform: scale(10, 10);
  opacity: 0;
  transition: transform 0.5s, opacity 1s;
}
.dropdown-list .dropdown-list-element:active:after {
  transform: scale(0, 0);
  opacity: 0.2;
  transition: 0s;
}
.dropdown-list .dropdown-list-element:hover {
  background-color: #f1f1f1;
  color: #171b2d;
}
.dropdown-list .dropdown-list-element:hover:before {
  color: #171b2d;
}
.dropdown-list .dropdown-list-element a:hover {
  color: #171b2d;
}
.dropdown-list .dropdown-list-element a:hover:before {
  color: #171b2d;
}
.dropdown-list .dropdown-list-element:not(:last-child) {
  border-bottom: 1px solid #ccc;
}
.dropdown-list .dropdown-list-element span, .dropdown-list .dropdown-list-element a {
  line-height: 2.5;
  width: 100%;
  padding: 0 10px;
  display: block;
}
.dropdown-list .dropdown-list-element span.active, .dropdown-list .dropdown-list-element a.active {
  background-color: #f1f1f1;
}

/*############################################
 *## New Material design of native select dropdown
 *############################################*/
.select-container {
  position: relative;
  width: 100%;
  /* LABEL ======================================= */
  /* active state */
  /* BOTTOM BARS ================================= */
  /* active state */
  /* HIGHLIGHTER ================================== */
}
.select-container:after {
  position: absolute;
  top: 23px !important;
  right: 17px;
  /* Styling the down arrow */
  width: 0;
  height: 0;
  padding: 0;
  content: "";
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-top: 6px solid #ccc;
  pointer-events: none;
}
.select-container .select {
  cursor: pointer;
  position: relative;
  font-family: inherit;
  background-color: transparent;
  width: 100%;
  padding: 10px 10px 10px 0;
  font-size: 18px;
  border-radius: 0;
  border: none;
  border-bottom: 1px solid rgba(0, 0, 0, 0.12);
  /* Use custom arrow */
  appearance: none;
  -webkit-appearance: none;
  /* Remove focus */
}
.select-container .select:focus {
  outline: none;
  border-bottom: 1px solid rgba(0, 0, 0, 0);
}
.select-container .select-label {
  position: absolute;
  pointer-events: none;
  left: 0;
  top: 10px;
  transition: 0.2s ease all;
}
.select-container .select:focus ~ .select-label, .select-container .select:valid ~ .select-label {
  color: #0375b4;
  top: -20px;
  transition: 0.2s ease all;
  font-size: 14px;
}
.select-container .select-bar {
  position: relative;
  display: block;
  width: 100%;
}
.select-container .select-bar:before, .select-container .select-bar:after {
  content: "";
  height: 2px;
  width: 0;
  bottom: 1px;
  position: absolute;
  background: #2F80ED;
  transition: 0.2s ease all;
}
.select-container .select-bar:before {
  left: 50%;
}
.select-container .select-bar:after {
  right: 50%;
}
.select-container .select:focus ~ .select-bar:before, .select-container .select:focus ~ .select-bar:after {
  width: 50%;
}
.select-container .select-highlight {
  position: absolute;
  height: 60%;
  width: 100px;
  top: 25%;
  left: 0;
  pointer-events: none;
  opacity: 0.5;
}

form .form__submit-panel {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: start;
  -moz-box-pack: start;
  -ms-flex-pack: start;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: center;
  -moz-align-items: center;
  -ms-align-items: center;
  -o-align-items: center;
  align-items: center;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: flex-start;
  -moz-justify-content: flex-start;
  -o-justify-content: flex-start;
  -ms-justify-content: flex-start;
  justify-content: flex-start;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
}
form .form__submit-panel > *:not(:first-child) {
  margin-left: 14px;
}

/*############################################
 *## Fieldsets are used to group inputs, buttons or other form elements
 *############################################*/
fieldset {
  margin-top: 10px;
  background-color: #d9eaf4;
  border: 1px solid #0375b4;
  padding: 10px;
  color: #171b2d !important;
}
fieldset legend {
  border: 1px solid #d9eaf4;
  background-color: white;
  padding: 10px;
  color: #0375b4;
}
fieldset .label, fieldset label {
  color: #171b2d !important;
}
fieldset .fieldset-block {
  margin-top: 20px;
}
fieldset .fieldset-block-label {
  color: #0375b4 !important;
  line-height: 1.5;
  border-bottom: 1px #0375b4 solid;
}
fieldset .form-element--textual {
  /*############################################
   *## Textual inputs
   *############################################*/
}
fieldset .form-element--textual .form-element__main-input, fieldset .form-element--textual textarea {
  background-size: 0 2px, 0 1px;
}

/*############################################
 *## PowerEditButton to edit multiple languages
 *############################################*/
.power-edit-button {
  color: #ffffff;
  background: #f18825;
  position: absolute;
  border-radius: 0 0 30px 30px;
  text-align: center;
  right: 0;
  bottom: -17px;
  height: 17px;
  width: 30px;
  cursor: pointer;
  z-index: 1;
}
.power-edit-button:before {
  font-family: TourispoWebfonts !important;
  font-weight: 400;
  font-style: normal;
  display: inline-block;
  transform: rotate(90deg);
  content: "\f101";
  font-size: 1.15rem;
  vertical-align: top;
  line-height: 1;
}
.power-edit-button.progress:before {
  content: "\e921";
  font-size: 0.84rem;
  -webkit-animation: spin 1s linear 0s infinite;
  -moz-animation: spin 1s linear 0s infinite;
  -ms-animation: spin 1s linear 0s infinite;
  -o-animation: spin 1s linear 0s infinite;
  animation: spin 1s linear 0s infinite;
}

.form-element.auto-margins + .form-element, .dropdown-container.auto-margins + .form-element {
  margin-top: 20px;
}

/*############################################
 *## Standard style:
 *## Large input fields with border and a visual input area (in contrast to cool (material) design having fly out labels)
 *############################################*/
.form-element.standard .form-element__input-container {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: stretch;
  -moz-box-align: stretch;
  -ms-flex-align: stretch;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
  position: relative;
}
.form-element.standard .form-element__label-help-text-container {
  color: #727272;
  padding-bottom: 6px;
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: stretch;
  -moz-box-align: stretch;
  -ms-flex-align: stretch;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
}
.form-element.standard .form-element__label-help-text-container .form-element__help-text {
  color: #0375b4;
  font-size: 0.74rem;
}
.form-element.standard .form-element__label-help-text-container .form-element__help-text:before {
  margin-right: 6px;
}
.form-element.standard .form-element__icon {
  position: absolute;
  left: 10px;
  top: 16px;
  color: #0375b4;
}
.form-element.standard .form-element__main-input {
  order: 1;
  border: 1px solid #ccc;
  background-color: #fafafa;
  color: #0375b4;
  font-weight: 700;
  border-radius: 5px;
  flex-grow: 1;
  -webkit-flex-grow: 1;
  -moz-flex-grow: 1;
  -ms-flex-grow: 1;
  -o-flex-grow: 1;
  height: 50px;
  padding-left: 10px;
  box-sizing: border-box;
  width: 100%;
}
.form-element.standard .form-element__main-input.with-icon {
  padding-left: 35px;
}
.form-element.standard .form-element__main-input.is-clearable::-webkit-inner-spin-button {
  right: -25px;
}
.form-element.standard .form-element__main-input[type=number].unit-width-default {
  padding-right: 28px;
}
.form-element.standard .form-element__main-input[type=number].unit-width-wide {
  padding-right: 38px;
}
.form-element.standard .form-element__main-input[type=number].unit-width-wider {
  padding-right: 48px;
}
.form-element.standard .form-element__main-input.right-align {
  text-align: right;
}
.form-element.standard .form-element__main-input.center-align {
  text-align: center;
}
.form-element.standard .form-element__main-input:hover, .form-element.standard .form-element__main-input:focus {
  border-color: #0375b4;
}
.form-element.standard .form-element__main-input:hover ~ .form-element__clear, .form-element.standard .form-element__main-input:focus ~ .form-element__clear {
  border-color: #0375b4;
}
.form-element.standard.nospinner .form-element__unit {
  right: 36px;
}
.form-element.standard .form-element__clear {
  order: 2;
  border: 1px solid #ccc;
  border-left: none;
  border-radius: 0 5px 5px 0;
  background-color: #fafafa;
  padding: 10px 6PX;
  position: relative;
  left: -4px;
  color: #0375b4;
  box-sizing: border-box;
  height: 50px;
}
.form-element.standard .form-element__unit {
  font-size: 0.84rem;
  color: #0375b4;
  position: absolute;
  right: 36px;
  top: 8px;
}

/*############################################
 *## Default input fields like Textfield, E-Mail, Number, ....
 *############################################*/
.form-element:not(.standard) {
  position: relative;
  min-height: 36px;
  padding-top: 10px;
  margin-top: 10px;
  /*############################################
   *## Order the single elements
   *############################################*/
  /*############################################
   *## Style the remaining elements
   *############################################*/
  /*############################################
   *## Dependencies between elements
   *############################################*/
  /*############################################
   *## Validator States (Success, Warning, Error)
   *############################################*/
}
.form-element:not(.standard) .form-element__input-container {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: center;
  -moz-align-items: center;
  -ms-align-items: center;
  -o-align-items: center;
  align-items: center;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
}
.form-element:not(.standard) label {
  order: 1;
}
.form-element:not(.standard) label.with-icon {
  padding-left: 30px;
}
.form-element:not(.standard) .form-element__input-container {
  width: 100%;
}
.form-element:not(.standard) .form-element__main-input, .form-element:not(.standard) textarea {
  order: 3;
}
.form-element:not(.standard) .form-element__output {
  order: 4;
}
.form-element:not(.standard) .form-element__unit {
  order: 5;
}
.form-element__icon.left {
  order: 2;
}
.form-element__icon.right {
  order: 3;
}

.form-element:not(.standard):before {
  order: 4;
}
.form-element:not(.standard) .form-element__main-input {
  color: #0375b4;
  padding: 0 10px;
  width: 100%;
  flex-basis: 100%;
  -webkit-flex-basis: 100%;
  -moz-flex-basis: 100%;
  -ms-flex-basis: 100%;
  -o-flex-basis: 100%;
  background-color: #ffffff;
}
.form-element:not(.standard) .form-element__main-input.is-clearable {
  padding-right: 14px;
}
.form-element:not(.standard) .form-element__main-input.right-align {
  text-align: right;
}
.form-element:not(.standard) .form-element__main-input.center-align {
  text-align: center;
}
.form-element:not(.standard) label, .form-element:not(.standard) .form-element__icon {
  color: #727272;
}
.form-element:not(.standard) textarea {
  min-width: 100%;
  min-height: 58px;
  padding: 10px;
}
.form-element:not(.standard) label {
  z-index: 1;
  font-size: 0.9rem;
  position: absolute;
  top: 20px;
  left: 10px;
  cursor: text;
  width: 90%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  -ms-transition: all 300ms ease-out 0s;
  transition: all 300ms ease-out 0s;
  -ms-transition-property: position font-size;
  transition-property: position font-size;
}
.form-element:not(.standard) .form-element__icon {
  background-size: 0 2px, 100% 1px;
  background-image: linear-gradient(#0375b4, #0375b4), linear-gradient(#ccc, #ccc);
  background-repeat: no-repeat;
  background-position: center bottom, center calc(100% - 1px);
  -ms-transition: all 300ms ease-out 0s;
  transition: all 300ms ease-out 0s;
  -ms-transition-property: background;
  transition-property: background;
  height: 36px;
  width: 28px;
  background-color: #ffffff;
  padding-left: 6px;
}
.form-element:not(.standard) .form-element__icon:focus {
  background-size: 100% 2px, 100% 1px;
}
.form-element:not(.standard) .form-element__icon:before {
  line-height: 39px;
}
.form-element:not(.standard) .form-element__icon ~ label {
  left: 28px;
}
.form-element:not(.standard) .ui-icon-delete {
  position: absolute;
  right: 10px;
  bottom: 0;
  width: 16px;
  padding: 0 10px;
  height: 36px;
  z-index: 1;
  text-decoration: none !important;
}
.form-element:not(.standard).formlib-element {
  right: 0;
}
.form-element:not(.standard) .form-element__icon ~ .form-element__label {
  left: 28px;
}
.form-element:not(.standard).form-element--textual {
  /*############################################
   *## Textual inputs
   *############################################*/
}
.form-element:not(.standard).form-element--textual textarea {
  padding-top: 6px;
  padding-bottom: 6px;
}
.form-element:not(.standard).form-element--textual .form-element__main-input, .form-element:not(.standard).form-element--textual textarea {
  position: relative;
  height: 36px;
  background-size: 0 2px, 100% 1px;
  background-image: linear-gradient(#0375b4, #0375b4), linear-gradient(#ccc, #ccc);
  background-repeat: no-repeat;
  background-position: center bottom, center calc(100% - 1px);
  -ms-transition: all 300ms ease-out 0s;
  transition: all 300ms ease-out 0s;
  -ms-transition-property: background;
  transition-property: background;
  /*############################################
    *## ATTENTION: Selectors cannot be combined due to CSS 2.1 specification
    *## The selector (see also the section on selectors) consists of everything up to (but not including) the first left curly brace ({). A selector always goes together with a declaration block.
    *## When a user agent cannot parse the selector (i.e., it is not valid CSS 2.1), it must ignore the selector and the following declaration block (if any) as well.
    *## => Other vendor prefixes break the whole rule
    *############################################*/
}
.form-element:not(.standard).form-element--textual .form-element__main-input:focus, .form-element:not(.standard).form-element--textual textarea:focus {
  background-size: 100% 2px, 100% 1px;
}
.form-element:not(.standard).form-element--textual .form-element__main-input.hide-placeholder:-ms-input-placeholder, .form-element:not(.standard).form-element--textual textarea.hide-placeholder:-ms-input-placeholder {
  opacity: 0;
}
.form-element:not(.standard).form-element--textual .form-element__main-input.hide-placeholder::-ms-input-placeholder, .form-element:not(.standard).form-element--textual textarea.hide-placeholder::-ms-input-placeholder {
  opacity: 0;
}
.form-element:not(.standard).form-element--textual .form-element__main-input.hide-placeholder::-moz-placeholder, .form-element:not(.standard).form-element--textual textarea.hide-placeholder::-moz-placeholder {
  opacity: 0;
}
.form-element:not(.standard).form-element--textual .form-element__main-input.hide-placeholder::-webkit-input-placeholder, .form-element:not(.standard).form-element--textual textarea.hide-placeholder::-webkit-input-placeholder {
  opacity: 0;
}
.form-element:not(.standard).form-element--textual .form-element__main-input:-ms-input-placeholder, .form-element:not(.standard).form-element--textual textarea:-ms-input-placeholder {
  font-size: 0.84rem;
}
.form-element:not(.standard).form-element--textual .form-element__main-input::-ms-input-placeholder, .form-element:not(.standard).form-element--textual textarea::-ms-input-placeholder {
  font-size: 0.84rem;
}
.form-element:not(.standard).form-element--textual .form-element__main-input::-moz-placeholder, .form-element:not(.standard).form-element--textual textarea::-moz-placeholder {
  font-size: 0.84rem;
}
.form-element:not(.standard).form-element--textual .form-element__main-input::-webkit-input-placeholder, .form-element:not(.standard).form-element--textual textarea::-webkit-input-placeholder {
  font-size: 0.84rem;
}
.form-element:not(.standard).form-element--textual .form-element__main-input:focus ~ .form-element__icon:before, .form-element:not(.standard).form-element--textual textarea:focus ~ .form-element__icon:before {
  color: #0375b4;
}
.form-element:not(.standard).form-element--textual .form-element__main-input:placeholder-shown ~ .ui-icon-delete:before, .form-element:not(.standard).form-element--textual textarea:placeholder-shown ~ .ui-icon-delete:before {
  color: #ccc;
}
.form-element:not(.standard).form-element--textual .form-element__main-input:focus ~ label.type-cool, .form-element:not(.standard).form-element--textual .form-element__main-input:not(:placeholder-shown) ~ label.type-cool, .form-element:not(.standard).form-element--textual textarea:focus ~ label.type-cool, .form-element:not(.standard).form-element--textual textarea:not(:placeholder-shown) ~ label.type-cool {
  cursor: default;
  top: -6px;
  left: 0;
  font-size: 0.74rem;
  padding-left: 0;
}
.form-element:not(.standard).form-element--textual.with-border .form-element__main-input, .form-element:not(.standard).form-element--textual.with-border textarea {
  border: 1px solid #0375b4;
  border-radius: 20px;
  background-image: none;
}
.form-element:not(.standard).form-element--textual.with-border .form-element__main-input + .form-element__icon, .form-element:not(.standard).form-element--textual.with-border textarea + .form-element__icon {
  border-radius: 20px;
  right: 0;
  padding-left: 0;
  width: 50px;
}
.form-element:not(.standard).form-element--textual.with-border .form-element__main-input + .form-element__icon:before, .form-element:not(.standard).form-element--textual.with-border textarea + .form-element__icon:before {
  width: 100%;
  text-align: center;
}
.form-element:not(.standard).form-element--textual.with-border .form-element__main-input:focus + .form-element__icon, .form-element:not(.standard).form-element--textual.with-border textarea:focus + .form-element__icon {
  background-color: #0375b4;
}
.form-element:not(.standard).form-element--textual.with-border .form-element__main-input:focus + .form-element__icon:before, .form-element:not(.standard).form-element--textual.with-border textarea:focus + .form-element__icon:before {
  color: #ffffff;
}
.form-element:not(.standard).form-element--textual.with-border .form-element__icon {
  background-image: none;
  background-color: transparent;
  font-size: 1.3rem;
  color: #0375b4;
  position: absolute;
  right: 10px;
}

.form-element:not(.standard).form-element--textual.coollabel-container .form-element__main-input:-ms-input-placeholder, .form-element:not(.standard).form-element--textual.coollabel-container textarea:-ms-input-placeholder {
  opacity: 1;
}
.form-element:not(.standard).form-element--textual.coollabel-container .form-element__main-input::-ms-input-placeholder, .form-element:not(.standard).form-element--textual.coollabel-container textarea::-ms-input-placeholder {
  opacity: 1;
}
.form-element:not(.standard).form-element--textual.coollabel-container .form-element__main-input::-moz-placeholder, .form-element:not(.standard).form-element--textual.coollabel-container textarea::-moz-placeholder {
  opacity: 1;
}
.form-element:not(.standard).form-element--textual.coollabel-container .form-element__main-input::-webkit-input-placeholder, .form-element:not(.standard).form-element--textual.coollabel-container textarea::-webkit-input-placeholder {
  opacity: 1;
}
.form-element__output {
  flex-basis: 20%;
  -webkit-flex-basis: 20%;
  -moz-flex-basis: 20%;
  -ms-flex-basis: 20%;
  -o-flex-basis: 20%;
  font-size: 0.9rem;
  color: #0375b4;
}

.form-element__output, .form-element__unit {
  margin: 9px 0 0 10px;
  white-space: nowrap;
}

.form-element__mandatory-indicator {
  color: #ff0000;
  position: relative;
  top: -4px;
}

.form-element:not(.standard).form-element--validation-success label {
  color: #88b733;
}
.form-element:not(.standard).form-element--validation-success input, .form-element:not(.standard).form-element--validation-success textarea {
  background-image: linear-gradient(#88b733, #88b733), linear-gradient(#ccc, #ccc);
}

.form-element:not(.standard).form-element--validation-error label {
  color: #fc5a5a;
}
.form-element:not(.standard).form-element--validation-error input, .form-element:not(.standard).form-element--validation-error textarea {
  background-image: linear-gradient(#fc5a5a, #fc5a5a), linear-gradient(#ccc, #ccc);
}
.form-element:not(.standard).form-element--validation-success label:after, .form-element:not(.standard).form-element--validation-error label:after {
  margin-left: 10px;
}

/*############################################
 *## Legacy support: Microtemplate input fields
 *############################################*/
.formlib-element .coollabel {
  top: 2px !important;
}

/*############################################
 *## Input fields in ConvertedForm have borders to bea spotted more easily
 *############################################*/
.in-converted-form .form-element__main-input {
  border: 1px solid #0375b4;
}
.in-converted-form .dropdown:after {
  border-top: 6px solid #0375b4;
}
.in-converted-form .dropdown .dropdown-button1 {
  border: 1px solid #0375b4;
  border-radius: 0;
}
.in-converted-form .label-value-combo {
  display: block;
}
.in-converted-form .label-value-combo.alignment-half-width, .in-converted-form .label-value-combo.alignment-one-third-width, .in-converted-form .label-value-combo.alignment-two-third-width {
  display: inline-block;
}
.in-converted-form .mobile-style-label-value .label-value-combo {
  display: block;
  border-bottom: none;
  padding: 0;
}

.coollabel {
  width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.mark-error, .mark-error + label, .mark-error + label:before {
  background: #ffe0cc !important;
}

.automargins .form-element, .automargins .form-element--checkbox-radiobutton {
  margin: 10px 0;
}

/*############################################
 *## Suche nach Entities bei WidgetCreators oder NewUserReview, ....
 *############################################*/
.in-module-search {
  position: relative;
}
.in-module-search .ui-icon-search {
  position: absolute;
  right: 10px;
  top: 16px;
  font-size: 1.6rem;
  color: #0375b4;
}
.in-module-search input[type=search i]::-webkit-search-cancel-button {
  appearance: none;
}

.captcha {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: distribute;
  -moz-box-pack: distribute;
  -ms-flex-pack: distribute;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  box-lines: multiple;
  -moz-box-lines: multiple;
  -webkit-box-lines: multiple;
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: center;
  -moz-align-items: center;
  -ms-align-items: center;
  -o-align-items: center;
  align-items: center;
  -webkit-flex-flow: row wrap;
  -webkit-justify-content: space-around;
  -moz-justify-content: space-around;
  -o-justify-content: space-around;
  -ms-justify-content: space-around;
  justify-content: space-around;
  flex-wrap: wrap;
  -ms-flex-wrap: wrap; /* IE 10 */
  -webkit-flex-wrap: wrap;
}
.captcha .form-element--text {
  width: 100%;
}
.captcha img {
  width: 200px;
  height: 64px;
  margin: 0 10px;
}
.captcha .ui-icon-refresh {
  color: #0375b4;
  font-size: 1.6rem;
}
@media all and (min-width: 481px) {
  .captcha .ui-icon-refresh {
    font-size: 2.6rem;
  }
}
@media all and (min-width: 681px) {
  .captcha {
    flex-wrap: nowrap;
    -webkit-flex-wrap: nowrap;
  }
  .captcha .form-element--text {
    width: 50%;
  }
}

/*############################################
 *##
 *## ImageCheckbox consisting of an Icon and a checkbox (i.e. ECUFeatures)
 *##
 *############################################*/
.imagecheckbox {
  position: relative;
}
.imagecheckbox label {
  position: absolute !important;
  left: 98%;
  top: -5px;
}
.imagecheckbox input[type=checkbox] + label::before {
  left: -1px;
  top: -9px;
  position: relative;
}

.option-switcher {
  margin-top: 6px;
  color: #0375b4;
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: stretch;
  -moz-box-align: stretch;
  -ms-flex-align: stretch;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
  cursor: pointer;
}
.option-switcher .option-item {
  padding: 10px;
  border: 1px solid #0375b4;
  background-color: #ffffff;
}
.option-switcher .option-item:first-child {
  border-radius: 5px 0 0 5px;
}
.option-switcher .option-item:last-child {
  border-radius: 0 5px 5px 0;
}
.option-switcher .option-item:not(:last-child) {
  border-right: none !important;
}
.option-switcher .option-item.active {
  color: #FFF;
}
.option-switcher .option-item span {
  display: block;
}
.option-switcher .option-item.active {
  color: #ffffff;
  background-color: #0375b4;
}

/*############################################
 *## ProgressIndicators might be included next to buttons or input fields or ...
 *############################################*/
.progressindicator {
  position: relative;
}
.progressindicator:after {
  font-size: 20px;
  height: 21px;
  width: 21px;
  font-family: TourispoWebfonts !important;
  font-weight: 400;
  font-style: normal;
  display: inline-block;
}
.progressindicator:not(.indicate-success):before {
  font-size: 21px !important;
  height: 21px !important;
  width: 21px !important;
  line-height: 21px;
  font-family: TourispoWebfonts !important;
  font-weight: 400;
  font-style: normal;
  display: inline-block;
  background-color: transparent !important;
  content: "\e921";
  -webkit-animation: spin 1s linear 0s infinite;
  -moz-animation: spin 1s linear 0s infinite;
  -ms-animation: spin 1s linear 0s infinite;
  -o-animation: spin 1s linear 0s infinite;
  animation: spin 1s linear 0s infinite;
  transform-origin: 50% 50.9%;
}

.form-element--colorpicker {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: start;
  -moz-box-pack: start;
  -ms-flex-pack: start;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: center;
  -moz-align-items: center;
  -ms-align-items: center;
  -o-align-items: center;
  align-items: center;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: flex-start;
  -moz-justify-content: flex-start;
  -o-justify-content: flex-start;
  -ms-justify-content: flex-start;
  justify-content: flex-start;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
}
.form-element--colorpicker input[type=color] {
  margin-right: 10px;
}

.image-url .image-thumbnail {
  width: 100%;
  margin-bottom: 14px;
}
.image-url .image-thumbnail .image-placeholder:before {
  position: relative;
  left: 10px;
}
.image-url .url-input {
  width: 100%;
}
@media all and (min-width: 681px) {
  .image-url {
    display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
    display: -webkit-flex; /* Safari 7*/
    display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
    display: -ms-flexbox; /* IE10 */
    display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
    display: flex;
    /* Simulating 2012 flexbox model (used in IE 10) */
    /* Legacy Browsers (IE 10)*/
    -webkit-box-pack: justify;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-box-align: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
    /* For understanding browsers */
    -webkit-flex-direction: row;
    -moz-flex-direction: row;
    -ms-flex-direction: row;
    -o-flex-direction: row;
    flex-direction: row;
    -webkit-align-items: center;
    -moz-align-items: center;
    -ms-align-items: center;
    -o-align-items: center;
    align-items: center;
    -webkit-flex-flow: row nowrap;
    -webkit-justify-content: space-between;
    -moz-justify-content: space-between;
    -o-justify-content: space-between;
    -ms-justify-content: space-between;
    justify-content: space-between;
    flex-wrap: nowrap;
    -ms-flex-wrap: nowrap; /* IE 10 */
    -webkit-flex-wrap: nowrap;
  }
  .image-url .image-thumbnail {
    width: 180px;
    margin-right: 14px;
    margin-bottom: 0;
  }
}

.ui-slider-wrapper {
  margin-top: 12px;
  padding: 0 10px;
  height: 6px;
  background-color: #ccc;
  /*############################################
   *## The thumbs of the slider which can be dragged by the user
   *############################################*/
  /*############################################
   *## Active range between the two thumbs
   *############################################*/
}
.ui-slider-horizontal {
  position: relative;
  width: 100%;
}

.ui-slider-handle {
  position: absolute;
  border-radius: 50%;
  background: #0375b4;
  box-shadow: rgba(0, 0, 0, 0.12) 0px 1px 6px, rgba(0, 0, 0, 0.12) 0px 1px 4px;
  width: 20px;
  height: 20px;
  top: -7px;
  margin-left: -10px;
  -ms-transition: all 200ms ease-out 0s;
  transition: all 200ms ease-out 0s;
  -ms-transition-property: width, height, top, left;
  transition-property: width, height, top, left;
}
.ui-slider-handle.ui-state-active {
  top: -10px;
  width: 26px;
  height: 26px;
}
.ui-slider-handle.ui-state-focus {
  -webkit-box-shadow: 0 0 0 6px rgba(3, 117, 180, 0.15);
  box-shadow: 0 0 0 6px rgba(3, 117, 180, 0.15);
}

.ui-slider-range {
  height: 6px;
  position: absolute;
  background-color: #0375b4;
}

input[type=number]::-webkit-inner-spin-button {
  position: relative;
}

input[type=number].is-clearable::-webkit-inner-spin-button {
  right: 6px;
}

.nospinner input[type=number]::-webkit-inner-spin-button {
  appearance: none;
}
.nospinner .numeric-field .unit {
  right: 4px;
  font-size: 0.74rem;
}

.numeric-field .unit {
  color: #0375b4;
  position: absolute;
  right: 10px;
  font-size: 0.9rem;
}
.numeric-field.with-unit input[type=number]::-webkit-inner-spin-button {
  right: 18px;
}
.numeric-field.clearable-input-container .unit {
  right: 26px;
}
.numeric-field.clearable-input-container input[type=number]::-webkit-inner-spin-button {
  right: 24px;
}
.numeric-field.clearable-input-container.with-unit input[type=number]::-webkit-inner-spin-button {
  right: 36px;
}

.form-element--checkbox-radiobutton.style-as-toggle:after {
  left: -58px;
}
input[type=checkbox], input[type=radio] {
  position: fixed;
  left: -100px;
  opacity: 0;
}
input[type=checkbox] + label.checkbox-with-links, input[type=radio] + label.checkbox-with-links {
  padding-left: 24px;
  display: block;
  -moz-hyphens: auto;
  -o-hyphens: auto;
  -webkit-hyphens: auto;
  -ms-hyphens: auto;
  hyphens: auto;
}
input[type=checkbox] + label.checkbox-with-links:before, input[type=radio] + label.checkbox-with-links:before {
  position: absolute;
  left: 0;
  top: -1px;
}
input[type=checkbox] + label:not(.checkbox-with-links), input[type=radio] + label:not(.checkbox-with-links) {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: start;
  -moz-box-pack: start;
  -ms-flex-pack: start;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: center;
  -moz-align-items: center;
  -ms-align-items: center;
  -o-align-items: center;
  align-items: center;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: flex-start;
  -moz-justify-content: flex-start;
  -o-justify-content: flex-start;
  -ms-justify-content: flex-start;
  justify-content: flex-start;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
}
input[type=checkbox] + label, input[type=radio] + label {
  position: relative;
}
input[type=checkbox] + label:not(.style-as-toggle), input[type=radio] + label:not(.style-as-toggle) {
  overflow: hidden;
  transform: translate3d(0, 0, 0);
  position: relative;
}
input[type=checkbox] + label:not(.style-as-toggle):after, input[type=radio] + label:not(.style-as-toggle):after {
  content: "";
  display: block;
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  pointer-events: none;
  background-image: radial-gradient(circle, #0375b4 10%, transparent 10.01%);
  background-repeat: no-repeat;
  background-position: 50%;
  transform: scale(10, 10);
  opacity: 0;
  transition: transform 0.5s, opacity 1s;
}
input[type=checkbox] + label:not(.style-as-toggle):active:after, input[type=radio] + label:not(.style-as-toggle):active:after {
  transform: scale(0, 0);
  opacity: 0.2;
  transition: 0s;
}
input[type=checkbox] + label:hover, input[type=radio] + label:hover {
  cursor: pointer;
}
input[type=checkbox] + label:before, input[type=radio] + label:before {
  font-family: TourispoWebfonts !important;
  font-weight: 400;
  font-style: normal;
  display: inline-block;
  font-size: 1.3rem;
  width: 16px;
  color: #0375b4;
  margin-right: 10px;
}
input[type=checkbox] + label.smaller, input[type=radio] + label.smaller {
  font-size: 0.84rem;
}
input[type=checkbox] + label.smaller:before, input[type=radio] + label.smaller:before {
  width: 12px;
  font-size: 0.9rem;
  margin-right: 6px;
}
input[type=checkbox]:disabled + label:before, input[type=radio]:disabled + label:before {
  color: #ccc;
}
input[type=checkbox][type=checkbox] + label:before, input[type=radio][type=checkbox] + label:before {
  content: "\f096";
  border-radius: 2px;
  text-indent: 1px;
}
input[type=checkbox][type=checkbox]:checked + label:before, input[type=radio][type=checkbox]:checked + label:before {
  content: "\f046";
}
input[type=checkbox][type=checkbox] + label.style-as-toggle:before, input[type=radio][type=checkbox] + label.style-as-toggle:before {
  content: "";
  min-width: 36px;
  height: 12px;
  background-color: #ccc;
  border-radius: 12px;
}
input[type=checkbox][type=checkbox] + label.style-as-toggle:after, input[type=radio][type=checkbox] + label.style-as-toggle:after {
  -ms-transition: all 300ms ease 0s;
  transition: all 300ms ease 0s;
  -ms-transition-property: left;
  transition-property: left;
  position: absolute;
  content: "";
  width: 20px;
  height: 20px;
  background-color: #ffffff;
  left: -3px;
  border-radius: 50%;
  box-shadow: rgba(0, 0, 0, 0.12) 0px 1px 6px, rgba(0, 0, 0, 0.12) 0px 1px 4px;
}
input[type=checkbox][type=checkbox]:checked + label.style-as-toggle:before, input[type=radio][type=checkbox]:checked + label.style-as-toggle:before {
  background-color: #67acd2;
}
input[type=checkbox][type=checkbox]:checked + label.style-as-toggle:after, input[type=radio][type=checkbox]:checked + label.style-as-toggle:after {
  background-color: #0375b4;
  left: 16px;
}
input[type=checkbox][type=radio] + label:before, input[type=radio][type=radio] + label:before {
  content: "\f10c";
  border-radius: 50%;
}
input[type=checkbox][type=radio]:checked + label:before, input[type=radio][type=radio]:checked + label:before {
  content: "\f192";
}

input[type=range] {
  -webkit-appearance: none;
  -webkit-tap-highlight-color: rgba(255, 255, 255, 0);
  height: 6px;
  margin-top: 12px;
  margin-bottom: 8px;
  background-color: #ccc;
  /*############################################
   *## The track
   *############################################*/
  /*############################################
   *## The Thumb
   *###########################################*/
  /*############################################
   *## The thumb for disabled sliders
   *############################################*/
}
input[type=range]:before {
  content: "";
  height: 6px;
  background-color: #0375b4;
  display: block;
  position: absolute;
}
input[type=range]:disabled {
  background-color: #ccc;
}
input[type=range] ::-webkit-slider-runnable-track {
  height: 4px;
}
input[type=range]::-moz-range-track {
  height: 4px;
  border: none;
  border-radius: 0;
  color: transparent; /* don't draw vertical reference line */
  background: transparent;
}
input[type=range]::-ms-track {
  height: 4px;
  border: none;
  border-radius: 0;
  color: transparent; /* don't draw vertical reference line */
  background: transparent;
}
input[type=range]::-ms-fill-lower, input[type=range]::-ms-fill-upper {
  background: transparent;
}
input[type=range]::-ms-tooltip {
  display: none;
}
input[type=range]::-webkit-slider-thumb {
  box-shadow: rgba(0, 0, 0, 0.12) 0px 1px 6px, rgba(0, 0, 0, 0.12) 0px 1px 4px;
  -webkit-appearance: none;
  cursor: ew-resize;
  width: 20px;
  height: 20px;
  border: none;
  border-radius: 50%;
  background: #0375b4;
  -ms-transition: all 200ms ease-out 0s;
  transition: all 200ms ease-out 0s;
  -ms-transition-property: width, height;
  transition-property: width, height;
}
input[type=range]:active::-webkit-slider-thumb {
  width: 26px;
  height: 26px;
}
input[type=range]:focus::-webkit-slider-thumb {
  -webkit-box-shadow: 0 0 0 6px rgba(3, 117, 180, 0.15);
  box-shadow: 0 0 0 6px rgba(3, 117, 180, 0.15);
}
input[type=range]::-moz-range-thumb {
  box-shadow: rgba(0, 0, 0, 0.12) 0px 1px 6px, rgba(0, 0, 0, 0.12) 0px 1px 4px;
  -webkit-appearance: none;
  cursor: ew-resize;
  width: 20px;
  height: 20px;
  border: none;
  border-radius: 50%;
  background: #0375b4;
  -ms-transition: all 200ms ease-out 0s;
  transition: all 200ms ease-out 0s;
  -ms-transition-property: width, height;
  transition-property: width, height;
}
input[type=range]:active::-moz-range-thumb {
  width: 26px;
  height: 26px;
}
input[type=range]:focus::-moz-range-thumb {
  -webkit-box-shadow: 0 0 0 6px rgba(3, 117, 180, 0.15);
  box-shadow: 0 0 0 6px rgba(3, 117, 180, 0.15);
}
input[type=range]::-ms-thumb {
  box-shadow: rgba(0, 0, 0, 0.12) 0px 1px 6px, rgba(0, 0, 0, 0.12) 0px 1px 4px;
  -webkit-appearance: none;
  cursor: ew-resize;
  width: 20px;
  height: 20px;
  border: none;
  border-radius: 50%;
  background: #0375b4;
  -ms-transition: all 200ms ease-out 0s;
  transition: all 200ms ease-out 0s;
  -ms-transition-property: width, height;
  transition-property: width, height;
}
input[type=range]:active::-ms-thumb {
  width: 26px;
  height: 26px;
}
input[type=range]:focus::-ms-thumb {
  -webkit-box-shadow: 0 0 0 6px rgba(3, 117, 180, 0.15);
  box-shadow: 0 0 0 6px rgba(3, 117, 180, 0.15);
}
input[type=range]:disabled::-webkit-slider-thumb {
  background: #ccc;
  background-clip: content-box;
}
input[type=range]:disabled::-moz-range-thumb {
  background: #ccc;
  background-clip: content-box;
}
input[type=range]:disabled::-ms-thumb {
  background: #ccc;
  background-clip: content-box;
}

.thresholdfilter-value {
  padding-left: 6px;
}

.form-element--range, .form-element--interval {
  min-height: 32px;
}
.form-element--range .form-element__label, .form-element--interval .form-element__label {
  font-size: 0.9rem;
  position: absolute;
  cursor: default;
  top: 0;
}
.form-element--range .form-element__output, .form-element--interval .form-element__output {
  font-size: 0.9rem;
}

/*## components/lists                    #####*/
.bull-list {
  margin-bottom: -6px;
  padding-left: 14px;
}
.bull-list > li, .bull-list > a {
  padding-bottom: 6px;
  text-indent: -14px;
  display: block;
}
.bull-list > li:before, .bull-list > a:before {
  content: "•";
  font-size: 1.3rem;
  padding-right: 6px;
  color: #f18825;
  position: relative;
  top: 2px;
  text-decoration: none;
}
.bull-list.primary > li:before, .bull-list.primary > a:before {
  color: #0375b4;
}

.simple-search-suggestion-list .autocomplete-item .tile__image {
  display: none;
}
.simple-search-suggestion-list .autocomplete-item .tile__header {
  max-height: 38px;
}
.simple-search-suggestion-list #show-all-matches-container, .simple-search-suggestion-list .pecu-divider, .simple-search-suggestion-list .localities-and-type {
  display: none;
}

.icon-list li {
  line-height: 38px;
}
.icon-list a {
  line-height: 38px;
  overflow: hidden;
  transform: translate3d(0, 0, 0);
  position: relative;
}
.icon-list a:after {
  content: "";
  display: block;
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  pointer-events: none;
  background-image: radial-gradient(circle, #0375b4 10%, transparent 10.01%);
  background-repeat: no-repeat;
  background-position: 50%;
  transform: scale(10, 10);
  opacity: 0;
  transition: transform 0.5s, opacity 1s;
}
.icon-list a:active:after {
  transform: scale(0, 0);
  opacity: 0.2;
  transition: 0s;
}
.icon-list a:hover {
  background-color: #f1f1f1;
  color: #171b2d;
}
.icon-list a:hover:before {
  color: #171b2d;
}
.icon-list a a:hover {
  color: #171b2d;
}
.icon-list a a:hover:before {
  color: #171b2d;
}
.icon-list a:before {
  width: 20px;
  margin: 0 14px 0 0;
}

/*############################################
 *## Overview List is used to give a preview list for SweepStakes, Magazine Articles
 *## ... providing the latest entries and a link to the complete list
 *############################################*/
.overview-list-container .header {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: center;
  -moz-align-items: center;
  -ms-align-items: center;
  -o-align-items: center;
  align-items: center;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
  margin-bottom: 10px;
}
.overview-list-container .header .headlines {
  margin-bottom: 0;
}
.overview-list-container .header .show-all-link {
  text-decoration: underline;
}
.overview-list-container .overview-list {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: stretch;
  -moz-box-align: stretch;
  -ms-flex-align: stretch;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  box-lines: multiple;
  -moz-box-lines: multiple;
  -webkit-box-lines: multiple;
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-flex-flow: row wrap;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: wrap;
  -ms-flex-wrap: wrap; /* IE 10 */
  -webkit-flex-wrap: wrap;
}
.overview-list-container .overview-list .overview-list-item {
  position: relative;
  width: 100%;
}
.overview-list-container .overview-list .overview-list-item:not(:last-child) {
  border-bottom: 1px #ccc solid;
  padding-bottom: 20px;
  margin-bottom: 20px;
}
.overview-list-container .overview-list .overview-list-item img {
  width: 100%;
}
.overview-list-container .overview-list .overview-list-item .headlines.primary {
  color: #0375b4;
  display: block;
  -moz-hyphens: auto;
  -o-hyphens: auto;
  -webkit-hyphens: auto;
  -ms-hyphens: auto;
  hyphens: auto;
  margin-bottom: 10px;
}
@media all and (min-width: 681px) {
  .overview-list-container .overview-list .overview-list-item {
    width: 49%;
    margin-bottom: 30px;
  }
  .overview-list-container .overview-list .overview-list-item:not(:last-child) {
    border-bottom: none;
    padding-bottom: 0;
  }
  .overview-list-container .overview-list .overview-list-item.odd {
    border-right: 1px #ccc solid;
    padding-right: 2%;
  }
}

.teaser-list .teaser-item .teaser-image {
  height: 80px;
  width: 100%;
}
.teaser-list .teaser-item .teaser-image .div-image {
  background-repeat: no-repeat;
}
.teaser-list .teaser-item .teaser-image.contain .div-image {
  -webkit-background-size: contain;
  background-size: contain;
}
.teaser-list .teaser-item .teaser-text {
  margin-top: 10px;
}

.tile-list {
  display: grid;
  grid-template-rows: auto;
  grid-auto-flow: row;
  grid-gap: 8px;
  grid-template-columns: 1fr 1fr;
}
.tile-list.change-order-mode {
  padding: 10px;
  background-color: #ffe0cc;
}
.tile-list .messages-feedback-message {
  grid-column-start: 1;
  grid-column-end: 3;
}
@media all and (min-width: 481px) {
  .tile-list {
    grid-gap: 10px;
  }
}
@media all and (min-width: 681px) {
  .tile-list {
    grid-template-columns: 1fr 1fr 1fr;
  }
  .tile-list .messages-feedback-message {
    grid-column-start: 1;
    grid-column-end: 4;
  }
}
@media all and (min-width: 1151px) {
  .tile-list {
    grid-template-columns: 1fr 1fr 1fr 1fr;
  }
  .tile-list .messages-feedback-message {
    grid-column-start: 1;
    grid-column-end: 5;
  }
}
.tile-list .headlines {
  padding: 10px 10px 0 10px;
}

.tile {
  overflow: hidden;
  position: relative;
  background-color: #ffffff;
  display: grid;
  grid-template-rows: auto;
  border: 1px solid #ccc;
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: flex;
  -webkit-flex-direction: column;
  -webkit-box-orient: vertical; /* Safari <= 6*/
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  -o-flex-direction: column;
  flex-direction: column;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-justify-content: flex-start;
  -moz-justify-content: flex-start;
  -o-justify-content: flex-start;
  -ms-justify-content: flex-start;
  justify-content: flex-start;
  flex-wrap: nowrap;
  -webkit-flex-wrap: nowrap;
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: start;
  -moz-box-pack: start;
  -ms-flex-pack: start;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
}
.tile__image {
  position: relative;
  order: 1;
  width: 100%;
  height: 120px;
  flex-shrink: 0;
  -webkit-flex-shrink: 0;
  -moz-flex-shrink: 0;
  -ms-flex-shrink: 0;
  -o-flex-shrink: 0;
}
.tile__image .div-image {
  background-color: #ccc;
}
.tile__image .overlay {
  position: absolute;
  text-align: right;
  bottom: 0;
  right: 0;
  padding: 6px;
  width: auto;
}
.tile__image .overlay.fader {
  left: 0;
  background-color: rgba(241, 241, 241, 0.8);
}
.tile__image .overlay-image, .tile__image .overlay-image > .div-image {
  position: absolute;
  width: 80px;
  top: -86px;
  right: 5px;
  height: 35px;
  background-size: contain !important;
  background-repeat: no-repeat;
  background-color: transparent;
}
@media all and (min-width: 481px) {
  .tile__image .overlay.fader .town {
    width: 50%;
    text-align: left;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .tile__image .overlay .overlay-image, .tile__image .overlay .overlay-image > .div-image {
    top: auto;
    bottom: 0;
  }
}
@media all and (min-width: 1151px) {
  .tile__image {
    height: 150px;
  }
}

.tile__header {
  position: relative;
  order: 3;
  padding: 10px 10px 6px 10px;
  flex-basis: 64px;
}
.tile__headline {
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box !important;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  height: 43px;
  font-weight: 400;
  width: 100%;
  padding-top: 6px;
  -moz-hyphens: auto;
  -o-hyphens: auto;
  -webkit-hyphens: auto;
  -ms-hyphens: auto;
  hyphens: auto;
}
.tile__headline.smaller {
  font-size: 1rem;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box !important;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  height: 60px;
}
@media all and (min-width: 481px) {
  .tile__headline {
    font-size: 1.15rem;
    height: 48px;
  }
}

.tile__hierarchy {
  font-size: 0.74rem;
  height: 30px;
  -moz-hyphens: auto;
  -o-hyphens: auto;
  -webkit-hyphens: auto;
  -ms-hyphens: auto;
  hyphens: auto;
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: start;
  -moz-box-pack: start;
  -ms-flex-pack: start;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: center;
  -moz-align-items: center;
  -ms-align-items: center;
  -o-align-items: center;
  align-items: center;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: flex-start;
  -moz-justify-content: flex-start;
  -o-justify-content: flex-start;
  -ms-justify-content: flex-start;
  justify-content: flex-start;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box !important;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
.tile__hierarchy > .link {
  color: #727272;
  padding-right: 6px;
}
.tile__hierarchy > .link:not(:first-child) {
  padding-left: 6px;
  border-left: 1px solid #ccc;
}
.tile__hierarchy > .link:first-child {
  font-weight: 400;
}
.tile__hierarchy > .link:hover {
  color: #ffc100;
}

.tile__openclosedbar {
  height: 3px;
  position: absolute;
  text-align: right;
}
.tile__openclosedbar .label-value {
  padding-right: 10px;
  order: 3;
  line-height: 18px;
  font-size: 0.74rem;
}
@media all and (min-width: 481px) {
  .tile__openclosedbar {
    height: auto;
    order: 2;
    position: relative;
    margin-top: -15px;
    background-color: rgba(255, 255, 255, 0.7);
  }
  .tile__openclosedbar .label-value {
    order: 0;
    line-height: 15px;
  }
}

.tile__content {
  font-size: 0.9rem;
  order: 4;
  padding: 10px;
  flex-grow: 5;
}
.tile__content .center-text {
  text-align: center;
}
.tile__content .label-value-combo .value {
  font-weight: 400;
}
.tile__content .flex-space-between {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: flex;
  -webkit-flex-direction: column;
  -webkit-box-orient: vertical; /* Safari <= 6*/
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  -o-flex-direction: column;
  flex-direction: column;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: nowrap;
  -webkit-flex-wrap: nowrap;
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
}
.tile__content .label-checkbox-combo {
  width: 100%;
}
.tile__content .label-value-combo:last-child, .tile__content .label-checkbox-combo:last-child {
  border-bottom: none;
}
.tile__content .icon-value-combo:before {
  width: 20px;
}
.tile__content .horizontal-bar-chart .label-value {
  padding-bottom: 6px;
}
.tile__content .selling-point {
  align-items: flex-start;
  margin-bottom: 6px;
}
.tile__content .selling-point:before {
  color: #88b733;
  margin-right: 6px;
}
.tile__content .item-ag_weather-preview .colorful {
  margin: 6px auto;
}
.tile__content > div {
  min-height: 32px;
}
.tile__content > div:not(:first-child) {
  padding-top: 10px;
  border-top: 1px solid #ccc;
}
.tile__content > div:not(:last-child) {
  margin-bottom: 10px;
}
.tile__text {
  line-height: 1.4;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box !important;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
}

.tile__data-flex {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: stretch;
  -moz-box-align: stretch;
  -ms-flex-align: stretch;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
}
.tile__data-flex > *.grow-more {
  flex-grow: 2;
  -webkit-flex-grow: 2;
  -moz-flex-grow: 2;
  -ms-flex-grow: 2;
  -o-flex-grow: 2;
}
.tile__data-flex.same-child-size > * {
  min-width: 0;
  flex-basis: 0;
  flex-shrink: 1;
  -webkit-flex-shrink: 1;
  -moz-flex-shrink: 1;
  -ms-flex-shrink: 1;
  -o-flex-shrink: 1;
  flex-grow: 1;
  -webkit-flex-grow: 1;
  -moz-flex-grow: 1;
  -ms-flex-grow: 1;
  -o-flex-grow: 1;
}
.tile__data-flex.same-child-size > *:not(:first-child) {
  margin-left: 10px;
}
.tile__data-flex.wrap {
  flex-wrap: wrap;
  -webkit-flex-wrap: wrap;
}
.tile__data-flex.wrap.same-child-size > * {
  margin: 0 6px;
}

.tile__data-grid {
  display: grid;
  grid-gap: 6px;
}
.tile__data-grid.pack2 {
  grid-template-columns: 1fr 1fr;
}
.tile__data-grid.pack3 {
  grid-template-columns: 1fr 1fr 1fr;
}
.tile__data-grid.center {
  text-align: center;
}
.tile__data-grid.center > * {
  margin: 0 auto;
}

.tile__actions {
  display: none;
  grid-column: 2;
  grid-row: 3;
  font-size: 0.9em;
  padding: 10px 10px 10px 0;
  border-top: 1px solid #ccc;
  font-weight: 400;
  margin-left: -5%;
}
@media all and (min-width: 481px) {
  .tile__actions {
    display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
    display: -webkit-flex; /* Safari 7*/
    display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
    display: -ms-flexbox; /* IE10 */
    display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
    display: flex;
    /* Simulating 2012 flexbox model (used in IE 10) */
    /* Legacy Browsers (IE 10)*/
    -webkit-box-pack: distribute;
    -moz-box-pack: distribute;
    -ms-flex-pack: distribute;
    -webkit-box-align: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
    /* For understanding browsers */
    -webkit-flex-direction: row;
    -moz-flex-direction: row;
    -ms-flex-direction: row;
    -o-flex-direction: row;
    flex-direction: row;
    -webkit-align-items: center;
    -moz-align-items: center;
    -ms-align-items: center;
    -o-align-items: center;
    align-items: center;
    -webkit-flex-flow: row nowrap;
    -webkit-justify-content: space-around;
    -moz-justify-content: space-around;
    -o-justify-content: space-around;
    -ms-justify-content: space-around;
    justify-content: space-around;
    flex-wrap: nowrap;
    -ms-flex-wrap: nowrap; /* IE 10 */
    -webkit-flex-wrap: nowrap;
    text-transform: uppercase;
    padding: 0 10px;
    order: 5;
    flex-basis: 40px;
    margin-left: 0;
  }
}

.tile .overlay {
  font-size: 0.9rem;
  height: 35px;
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: center;
  -moz-align-items: center;
  -ms-align-items: center;
  -o-align-items: center;
  align-items: center;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
}
.tile .item-facts.lodging {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: center;
  -moz-align-items: center;
  -ms-align-items: center;
  -o-align-items: center;
  align-items: center;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
}

.tile-list .tile.e_skiresort .stacked-horizontal-bar {
  position: absolute;
  z-index: 1;
  top: 102px;
  background-color: rgba(255, 255, 255, 0.8);
}
.tile-list .tile.e_skiresort .stacked-horizontal-bar .actual, .tile-list .tile.e_skiresort .stacked-horizontal-bar .difference {
  position: relative;
  top: 14px;
}
.tile-list .tile.e_skiresort .stacked-horizontal-bar .label {
  position: relative;
  top: -4px;
  font-size: 0.64rem !important;
}
.tile-list .tile.e_skiresort .horizontal-fillup-bar .value {
  width: 100%;
}
.tile-list .tile.e_skiresort .horizontal-fillup-bar {
  flex-wrap: wrap;
  -webkit-flex-wrap: wrap;
  margin: 0;
}
.tile-list .tile.e_skiresort .horizontal-fillup-bar .label {
  line-height: 10px;
  width: 100%;
}
.tile-list .tile.e_skiresort .horizontal-fillup-bar .chart {
  margin-top: 6px;
  flex-grow: 1;
  -webkit-flex-grow: 1;
  -moz-flex-grow: 1;
  -ms-flex-grow: 1;
  -o-flex-grow: 1;
}
.tile-list .tile.e_skiresort .horizontal-fillup-bar .value {
  margin-top: -12px;
}
.tile-list .tile.e_skiresort .horizontal-fillup-bar .value.positive {
  color: #0375b4;
}
.tile-list .tile.e_skiresort .item-conditions {
  margin-top: 10px;
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: distribute;
  -moz-box-pack: distribute;
  -ms-flex-pack: distribute;
  -webkit-box-align: stretch;
  -moz-box-align: stretch;
  -ms-flex-align: stretch;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: space-around;
  -moz-justify-content: space-around;
  -o-justify-content: space-around;
  -ms-justify-content: space-around;
  justify-content: space-around;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
}
.tile-list .tile.e_skiresort .item-predefined-filter-content.open {
  margin-bottom: 6px;
}
.tile-list .tile.e_skiresort .item-predefined-filter-content .lift-icons {
  z-index: 1;
  position: relative;
  display: grid;
  grid-gap: 10px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.tile-list .tile.e_skiresort .item-predefined-filter-content .lift-icons .lift-icon {
  width: 20px;
  height: 20px;
  line-height: 20px;
  border-radius: 50%;
  background-color: #0375b4;
  color: #ffffff;
  display: block;
  position: relative;
  margin-bottom: 12px;
  margin-left: 21px;
  text-align: center;
  font-size: 0.74rem;
}
.tile-list .tile.e_skiresort .item-predefined-filter-content .lift-icons .lift-icon:before {
  z-index: -1;
  font-size: 1.3rem;
  width: 32px;
  height: 32px;
  line-height: 32px;
  border-radius: 50%;
  background-color: #ffffff;
  color: #0375b4;
  border: 2px solid #0375b4;
  position: absolute;
  top: 0;
  left: -24px;
}
.tile-list .tile.e_skiresort .item-facts {
  font-size: 0.84rem;
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: distribute;
  -moz-box-pack: distribute;
  -ms-flex-pack: distribute;
  -webkit-box-align: stretch;
  -moz-box-align: stretch;
  -ms-flex-align: stretch;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: space-around;
  -moz-justify-content: space-around;
  -o-justify-content: space-around;
  -ms-justify-content: space-around;
  justify-content: space-around;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
}
@media all and (min-width: 381px) {
  .tile-list .tile.e_skiresort .stacked-horizontal-bar .label {
    font-size: 0.74rem !important;
  }
}
@media all and (min-width: 1151px) {
  .tile-list .tile.e_skiresort .stacked-horizontal-bar {
    top: 133px;
  }
  .tile-list .tile.e_skiresort .stacked-horizontal-bar .label {
    top: -5px;
  }
}

.tile-list .tile.p_ski .tile__image {
  position: relative;
  height: 110px;
  padding-top: 34px;
}
.tile-list .tile.p_ski .tile__image .div-image {
  width: 94%;
  margin: 0 auto;
  background-color: #ffffff;
  background-size: contain;
}
.tile-list .tile.p_ski .tile__image .item-horizontal-nav {
  position: absolute;
  top: 0;
  left: 10px;
  right: 10px;
  padding-top: 8px;
  height: 32px;
  line-height: 16px;
  color: #727272;
  border-bottom: 1px #ccc solid;
}

.tile-list .tile.e_xcskiing {
  /*############################################
   *## Indicator for groomed slopes
   *############################################*/
}
.tile-list .tile.e_xcskiing .horizontal-fillup-bar {
  flex-wrap: wrap;
  -webkit-flex-wrap: wrap;
  margin: 0 0 10px 0;
}
.tile-list .tile.e_xcskiing .horizontal-fillup-bar .label {
  line-height: 10px;
  width: 100%;
}
.tile-list .tile.e_xcskiing .horizontal-fillup-bar .chart {
  margin-top: 6px;
  flex-grow: 1;
  -webkit-flex-grow: 1;
  -moz-flex-grow: 1;
  -ms-flex-grow: 1;
  -o-flex-grow: 1;
}
.tile-list .tile.e_xcskiing .horizontal-fillup-bar.separated {
  max-width: 90%;
}
.tile-list .tile.e_xcskiing .horizontal-fillup-bar.separated .chart {
  width: 100%;
}
.tile-list .tile.e_xcskiing .horizontal-fillup-bar.separated .chart .whole {
  top: 10px;
}
.tile-list .tile.e_xcskiing .horizontal-fillup-bar.separated .value {
  line-height: 0;
  margin-left: 0;
}

.tile-list .tile.c_webcam.highlight-webcam:after {
  content: "";
  width: 100px;
  height: 170px;
  transform: rotate(60deg);
  position: absolute;
  z-index: 2;
  top: -100px;
  left: -34px;
}
.tile-list .tile.c_webcam.highlight-webcam:before {
  color: #ffffff;
  font-family: TourispoWebfonts !important;
  font-weight: 400;
  font-style: normal;
  display: inline-block;
  position: absolute;
  top: 10px;
  left: 10px;
  z-index: 3;
}
.tile-list .tile.c_webcam.panoramic-webcam:after {
  background-color: #75b34d;
}
.tile-list .tile.c_webcam.panoramic-webcam:before {
  content: "\e641";
  font-size: 0.74rem;
  left: 6px;
}
.tile-list .tile.c_webcam.stream-webcam:after {
  background-color: #597ac4;
}
.tile-list .tile.c_webcam.stream-webcam:before {
  content: "\f03e";
}
.tile-list .tile.c_webcam .item-webcam-last-update:after {
  width: 12px;
  height: 12px;
  margin-left: 10px;
  vertical-align: middle;
  display: inline-block;
  content: " ";
  border-radius: 50%;
  background: #42910e;
}
.tile-list .tile.c_webcam .item-webcam-last-update.old:after {
  background: #ff6e0e;
}
.tile-list .tile.c_webcam .item-webcam-last-update.offline:after {
  background: #ff0000;
}
.tile-list .tile.c_webcam .div-image {
  background-position: right;
}

/*## components/maps                     #####*/
.map-container {
  background-color: #ccc;
  position: relative;
}
.map-container:before {
  font-family: TourispoWebfonts !important;
  font-weight: 400;
  font-style: normal;
  display: inline-block;
  -webkit-animation: spin 1100ms linear 0s infinite;
  -moz-animation: spin 1100ms linear 0s infinite;
  -ms-animation: spin 1100ms linear 0s infinite;
  -o-animation: spin 1100ms linear 0s infinite;
  animation: spin 1100ms linear 0s infinite;
  content: "\e921";
  font-size: 50px;
  line-height: 50px;
  width: 50px;
  height: 50px;
  position: absolute;
  left: 50%;
  top: 50%;
  border-radius: 50%;
  margin-left: -25px;
  margin-top: -25px;
  text-align: center;
  color: #FFF;
}
.map-container.shows-prerendered-map:before {
  content: none;
}

.map {
  width: 100%;
  height: 100%;
  /*############################################
  *## Fullscreen html5 api in all browsers + Fallback for any brwosers not supporting HTML5 Fullscreen API
  *############################################*/
}
.map .ol-viewport {
  overflow: visible !important;
}
.map .tooltip {
  position: relative;
  z-index: 40;
  margin-bottom: 20px;
  margin-left: -25px;
}
.map .tooltip #ecu-list {
  margin: 0 !important;
}
.map .tooltip .tile {
  border: none;
  width: 200px;
}
.map .tooltip .tile-list {
  display: block;
}
.map .tooltip .tile__imagetourispo-webfont {
  height: 100px;
}
.map .tooltip .tile__header {
  flex-basis: auto;
  padding-left: 6px;
  padding-right: 6px;
}
.map .tooltip .tile__content, .map .tooltip .tile__actions {
  padding-left: 6px;
  padding-right: 6px;
}
.map .tooltip .stacked-horizontal-bar {
  top: 86px;
}
.map .tooltip .tile__actions {
  display: none;
}
.map.fullscreen-html5-not-supported {
  height: 100% !important;
  width: 100% !important;
  position: fixed !important;
  left: 0 !important;
  top: 0 !important;
  bottom: 0 !important;
  right: 0;
  margin-top: 0 !important;
  z-index: 10000 !important;
  background-color: #FFF;
}
.map:-moz-full-screen {
  position: fixed !important;
  top: 0 !important;
  width: 100% !important;
  height: 100% !important;
}
.map:-webkit-full-screen {
  position: fixed !important;
  top: 0 !important;
  width: 100% !important;
  height: 100% !important;
}
.map:-ms-fullscreen {
  position: fixed !important;
  top: 0 !important;
  width: 100% !important;
  height: 100% !important;
}
.map:fullscreen {
  position: fixed !important;
  top: 0 !important;
  width: 100% !important;
  height: 100% !important;
}

.ol-viewport {
  overflow: visible !important;
}

/*############################################
 *## If the map has a prerendered map (rendered via Phantom JS) as a background image, no grey background is necessary
 *## and no loading animation is needed
 *############################################*/
.mapProgressBar {
  background-color: rgba(255, 255, 255, 0.82);
  border-radius: 7px 7px 7px 7px;
  height: 42px;
  left: 50%;
  margin-left: -18px;
  margin-top: -17px;
  position: absolute;
  color: #0375b4;
  text-align: center;
  top: 50%;
  width: 42px;
  z-index: 15000;
  display: none;
  overflow: hidden;
}
.mapProgressBar.progressindicator {
  display: block;
}
.mapProgressBar.progressindicator:after {
  left: 2px;
  top: 4px;
  font-size: 30px;
  width: 30px;
  height: 30px;
  line-height: 30px;
}
.mapProgressBar.progressindicator:before {
  position: relative;
  top: 10px;
}

/*############################################
 *## On smaller devices the Speech Bubble should slide up at the bottom
 *############################################*/
@media all and (max-width: 861px) {
  .map .tooltip {
    visibility: hidden;
  }
  .map .tooltip .map-speech-bubble, .map .tooltip .map-ad, .map .tooltip .tooltip-close {
    visibility: visible;
    -ms-transition: all 800ms ease 0s;
    transition: all 800ms ease 0s;
    -ms-transition-property: bottom;
    transition-property: bottom;
  }
  .map .tooltip.visible .map-speech-bubble, .map .tooltip.visible .map-ad {
    bottom: 0;
    width: 100%;
  }
  .map .tooltip.visible .tooltip-close {
    bottom: 135px;
  }
  .map .tooltip .map-ad {
    position: fixed;
    bottom: -150px;
    height: 150px;
    left: 0;
    right: 0;
    background-color: #ffffff;
    -webkit-box-shadow: 1px 1px 2px 1px #727272;
    box-shadow: 1px 1px 2px 1px #727272;
    width: 100%;
    display: grid;
    grid-gap: 10px;
    grid-template-columns: 35% 65%;
  }
  .map .tooltip .map-ad a:first-child {
    grid-column-start: 2;
    grid-column-end: 3;
    grid-row-start: 1;
    grid-row-end: 2;
  }
  .map .tooltip .map-ad a:first-child .disruptor {
    line-height: 1;
    text-align: left;
    font-weight: 700;
    padding-top: 10px;
  }
  .map .tooltip .map-ad a:nth-child(2) {
    grid-column-start: 1;
    grid-column-end: 2;
    grid-row-start: 1;
    grid-row-end: 4;
  }
  .map .tooltip .map-ad a:nth-child(2) .image-container {
    width: 100%;
    height: 100%;
  }
  .map .tooltip .map-ad .text {
    grid-column-start: 2;
    grid-column-end: 3;
    grid-row-start: 2;
    grid-row-end: 3;
  }
  .map .tooltip .map-ad a:last-child {
    grid-column-start: 2;
    grid-column-end: 3;
    grid-row-start: 3;
    grid-row-end: 4;
    padding-bottom: 20px;
  }
  .map .tooltip .map-speech-bubble {
    position: fixed;
    bottom: -150px;
    height: 150px;
    left: 0;
    right: 0;
    background-color: #ffffff;
    -webkit-box-shadow: 1px 1px 2px 1px #727272;
    box-shadow: 1px 1px 2px 1px #727272;
  }
  .map .tooltip .map-speech-bubble .tile {
    width: 100%;
    display: grid;
    grid-gap: 10px;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    grid-template-rows: 32px 32px;
  }
  .map .tooltip .map-speech-bubble .tile .tile__image {
    grid-column-start: 1;
    grid-column-end: 3;
    grid-row-start: 1;
    grid-row-end: 4;
    height: 100%;
    width: 100%;
    padding: 10px 0;
  }
  .map .tooltip .map-speech-bubble .tile .stacked-horizontal-bar {
    grid-column-start: 1;
    grid-column-end: 3;
    grid-row-start: 3;
    grid-row-end: 4;
    position: static;
    align-self: flex-end;
    margin-bottom: 10px;
  }
  .map .tooltip .map-speech-bubble .tile .stacked-horizontal-bar .label {
    margin-right: 0;
    text-align: right;
    background: rgba(255, 255, 255, 0.6);
    width: 100%;
  }
  .map .tooltip .map-speech-bubble .tile .tile__header {
    grid-column-start: 3;
    grid-column-end: 7;
    grid-row-start: 1;
    grid-row-end: 3;
  }
  .map .tooltip .map-speech-bubble .tile .tile__header .tile__hierarchy {
    height: auto;
  }
  .map .tooltip .map-speech-bubble .tile .tile__content {
    grid-column-start: 3;
    grid-column-end: 7;
    grid-row-start: 3;
    grid-row-end: 4;
    padding-top: 0;
  }
  .map .tooltip-close {
    visibility: hidden;
    position: fixed;
    bottom: -10px;
    top: auto;
    right: 10px;
    border-top: 2px solid #ccc;
  }
}
@media all and (min-width: 861px) {
  .map #ecu-list {
    padding-left: 0 !important;
  }
}
.ol-control {
  background-color: rgba(255, 255, 255, 0.8);
  position: absolute;
  box-shadow: rgba(0, 0, 0, 0.12) 0px 1px 6px, rgba(0, 0, 0, 0.12) 0px 1px 4px;
}
.ol-control button, .ol-control a {
  color: #0375b4;
  background: none;
  width: 100%;
}
.ol-control button:before, .ol-control a:before {
  width: 100%;
  text-align: center;
  font-size: 1.3rem;
  line-height: 30px;
  font-family: TourispoWebfonts !important;
  font-weight: 400;
  font-style: normal;
  display: inline-block;
}
.ol-control button:hover, .ol-control a:hover {
  color: #ffc100;
}
.ol-control:not(.ol-attribution) {
  width: 34px;
  right: 6px;
}
.ol-control.ol-attribution {
  box-shadow: none;
  height: 14px !important;
  line-height: 14px !important;
  right: 0 !important;
  bottom: -14px !important;
  width: 100% !important;
  font-size: 0.64rem !important;
  letter-spacing: 0;
  text-align: right;
}
.ol-control.ol-attribution button {
  display: none;
}
.ol-control.ol-attribution .open-closed-legend {
  position: absolute;
  bottom: 48px;
  background: none repeat scroll 0 0 rgba(255, 255, 255, 0.8);
  right: 44px;
  padding: 6px;
  max-width: 80%;
  font-size: 0.64rem;
}
.ol-control.ol-attribution .open-closed-legend > div > div {
  display: inline-block;
}
.ol-control.ol-attribution .open-closed-legend > div > div:not(:first-child) {
  margin-left: 6px;
}
.ol-control.ol-attribution .open-closed-legend > div > div:before {
  content: " ";
  white-space: nowrap;
  width: 8px;
  height: 8px;
  margin-right: 6px;
  border-radius: 20px;
  display: inline-block;
  font-weight: bold;
  text-align: center;
}
.ol-control.ol-attribution .open-closed-legend .open:before {
  background: #42910e;
}
.ol-control.ol-attribution .open-closed-legend .closed:before {
  background: #ff0000;
}
.ol-control.ol-attribution .open-closed-legend .easy:before {
  background: #1042b5;
}
.ol-control.ol-attribution .open-closed-legend .medium:before {
  background: #ff0000;
}
.ol-control.ol-attribution .open-closed-legend .difficult:before {
  background: #000;
}
.ol-control.ol-attribution .open-closed-legend .freeride:before {
  background: #ff6e0e;
}
.ol-control.ol-attribution .open-closed-legend .no-data:before {
  background: #727272;
}
.ol-control.ol-zoom {
  bottom: 42px;
}
.ol-zoom-in:before {
  content: "\f2c7";
}

.ol-zoom-out:before {
  content: "\f2f4";
}

.ol-control.ol-full-screen {
  top: 6px;
}
.ol-full-screen-false:before {
  content: "\f25e";
}

.ol-full-screen-true:before {
  content: "\f267";
  color: #ff0000;
}

.ol-control.ol-tilesource-chooser {
  bottom: 6px;
  padding: 6px;
}
.ol-control.ol-tilesource-chooser .ui-icon-layers {
  height: 20px;
}
.ol-control.ol-tilesource-chooser form {
  display: none;
}
.ol-tilesource-chooser__base_layers {
  padding-bottom: 6px;
  border-bottom: 1px solid #ccc;
  box-shadow: 0 1px 0 0 #ffffff;
}

.ol-tilesource-chooser__pecufeature_layers {
  padding-top: 6px;
  border-bottom: 1px solid #ccc;
  box-shadow: 0 1px 0 0 #ffffff;
}

.ol-tilesource-chooser__geofeature_layers {
  padding-top: 6px;
}
.ol-tilesource-chooser__geofeature_layers ul {
  padding-left: 25px;
}

.ol-control.ol-tilesource-chooser:hover {
  width: auto !important;
  height: auto !important;
  z-index: 1;
}
.ol-control.ol-tilesource-chooser:hover a {
  display: none !important;
}
.ol-control.ol-tilesource-chooser:hover form {
  display: block !important;
}
.ol-control.ol-style-switcher {
  bottom: 6px;
  right: 44px;
  width: auto !important;
  padding: 2px 6px 0 6px;
  font-size: 0.84rem;
  white-space: nowrap;
}
.ol-control.ol-style-switcher > div {
  display: inline-block;
}
.ol-control.ol-style-switcher > div:first-child {
  margin-right: 10px;
}

.ol-overlaycontainer-stopevent .ol-mouse-position, .ol-overlaycontainer-stopevent .ol-scale-line {
  display: none;
}
.ol-overlaycontainer-stopevent .ol-user-position {
  bottom: 106px;
}

.map-legend-predefined-filter, .map-legend-snow {
  position: absolute;
  z-index: 2;
  bottom: 0;
  left: 0;
  font-size: 0.84rem;
  padding: 0 5px;
  overflow: hidden;
  display: inline-block;
  background-color: rgba(255, 255, 255, 0.8);
  border-radius: 0 5px 0 0;
}
.map-legend-predefined-filter > *, .map-legend-snow > * {
  vertical-align: middle;
}
.map-legend-predefined-filter .big-circle, .map-legend-snow .big-circle {
  display: inline-block;
  border: 1px solid black;
  height: 25px;
  border-radius: 50%;
  width: 25px;
  margin: 5px;
}
.map-legend-predefined-filter .small-circle, .map-legend-snow .small-circle {
  display: inline-block;
  border: 1px solid black;
  height: 6px;
  border-radius: 50%;
  width: 6px;
  margin: 12px;
}

/*## components/media                    #####*/
/*! PhotoSwipe main CSS by Dmitry Semenov | photoswipe.com | MIT license */
/*
	Styles for basic PhotoSwipe functionality (sliding area, open/close transitions)
*/
/* pswp = photoswipe */
.pswp {
  display: none;
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  overflow: hidden;
  -ms-touch-action: none;
  touch-action: none;
  z-index: 1500;
  -webkit-text-size-adjust: 100%;
  /* create separate layer, to avoid paint on window.onscroll in webkit/blink */
  -webkit-backface-visibility: hidden;
  outline: none;
}
.pswp * {
  box-sizing: border-box;
}
.pswp img {
  max-width: none;
}

/* style is added when JS option showHideOpacity is set to true */
.pswp--animate_opacity {
  /* 0.001, because opacity:0 doesn't trigger Paint action, which causes lag at start of transition */
  opacity: 0.001;
  will-change: opacity;
  /* for open/close transition */
  transition: opacity 333ms cubic-bezier(0.4, 0, 0.22, 1);
}

.pswp--open {
  display: block;
}

.pswp--zoom-allowed .pswp__img {
  /* autoprefixer: off */
  cursor: -webkit-zoom-in;
  cursor: -moz-zoom-in;
  cursor: zoom-in;
  object-fit: contain;
}

.pswp--zoomed-in .pswp__img {
  /* autoprefixer: off */
  cursor: -webkit-grab;
  cursor: -moz-grab;
  cursor: grab;
}

.pswp--dragging .pswp__img {
  /* autoprefixer: off */
  cursor: -webkit-grabbing;
  cursor: -moz-grabbing;
  cursor: grabbing;
}

/*
	Background is added as a separate element.
	As animating opacity is much faster than animating rgba() background-color.
*/
.pswp__bg {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: #000;
  opacity: 0;
  transform: translateZ(0);
  -webkit-backface-visibility: hidden;
  will-change: opacity;
}

.pswp__scroll-wrap {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.pswp__container,
.pswp__zoom-wrap {
  -ms-touch-action: none;
  touch-action: none;
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
}

/* Prevent selection and tap highlights */
.pswp__container,
.pswp__img {
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  -webkit-touch-callout: none;
}

.pswp__zoom-wrap {
  position: absolute;
  width: 100%;
  -webkit-transform-origin: left top;
  -moz-transform-origin: left top;
  -ms-transform-origin: left top;
  transform-origin: left top;
  /* for open/close transition */
  transition: transform 333ms cubic-bezier(0.4, 0, 0.22, 1);
}

.pswp__bg {
  will-change: opacity;
  /* for open/close transition */
  transition: opacity 333ms cubic-bezier(0.4, 0, 0.22, 1);
}

.pswp--animated-in .pswp__bg,
.pswp--animated-in .pswp__zoom-wrap {
  -webkit-transition: none;
  transition: none;
}

.pswp__container,
.pswp__zoom-wrap {
  -webkit-backface-visibility: hidden;
}

.pswp__item {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  overflow: hidden;
}

.pswp__img {
  position: absolute;
  width: auto;
  height: auto;
  top: 0;
  left: 0;
}

/*
	stretched thumbnail or div placeholder element (see below)
	style is added to avoid flickering in webkit/blink when layers overlap
*/
.pswp__img--placeholder {
  -webkit-backface-visibility: hidden;
}

/*
	div element that matches size of large image
	large image loads on top of it
*/
.pswp__img--placeholder--blank {
  background: #222;
}

.pswp--ie .pswp__img {
  width: 100% !important;
  height: auto !important;
  left: 0;
  top: 0;
}

/*
	Error message appears when image is not loaded
	(JS option errorMsg controls markup)
*/
.pswp__error-msg {
  position: absolute;
  left: 0;
  top: 50%;
  width: 100%;
  text-align: center;
  font-size: 14px;
  line-height: 16px;
  margin-top: -8px;
  color: #CCC;
}

.pswp__error-msg a {
  color: #CCC;
  text-decoration: underline;
}

/*! PhotoSwipe Default UI CSS by Dmitry Semenov | photoswipe.com | MIT license */
/*

	Contents:

	1. Buttons
	2. Share modal and links
	3. Index indicator ("1 of X" counter)
	4. Caption
	5. Loading indicator
	6. Additional styles (root element, top bar, idle state, hidden state, etc.)

*/
/*

	1. Buttons

 */
/* <button> css reset */
.pswp__button {
  width: 44px;
  height: 44px;
  position: relative;
  background: none;
  cursor: pointer;
  overflow: visible;
  -webkit-appearance: none;
  display: block;
  border: 0;
  padding: 0;
  margin: 0;
  float: right;
  opacity: 0.75;
  transition: opacity 0.2s;
  box-shadow: none;
}
.pswp__button:focus, .pswp__button:hover {
  opacity: 1;
}
.pswp__button:active {
  outline: none;
  opacity: 0.9;
}
.pswp__button::-moz-focus-inner {
  padding: 0;
  border: 0;
}

/* pswp__ui--over-close class it added when mouse is over element that should close gallery */
.pswp__ui--over-close .pswp__button--close {
  opacity: 1;
}

/** Tourispo Change Start */
.pswp__button {
  width: 44px;
  height: 44px;
}

/** Tourispo Change End */
/** Tourispo Change Start */
/* Tourispo Change End */
.pswp__button--fs {
  display: none;
}

.pswp--supports-fs .pswp__button--fs {
  display: block;
}

/** Tourispo Change Start */
/** Tourispo Change End */
.pswp--zoom-allowed .pswp__button--zoom {
  display: block;
}

/** Tourispo Change Start */
/** Tourispo Change End */
/*
	Arrow buttons hit area
	(icon is added to :before pseudo-element)
*/
.pswp__button--arrow--left,
.pswp__button--arrow--right {
  background: none;
  top: 50%;
  margin-top: -50px;
  width: 70px;
  height: 100px;
  position: absolute;
}

.pswp__button--arrow--left {
  left: 0;
}

.pswp__button--arrow--right {
  right: 0;
}

.pswp__button--arrow--left:before,
.pswp__button--arrow--right:before {
  /** Tourispo Change Start */
  /** Tourispo Change End */
  top: 35px;
  background-color: rgba(0, 0, 0, 0.3);
  height: 30px;
  width: 32px;
  position: absolute;
}

.pswp__button--arrow--left:before {
  left: 6px;
  /** Tourispo Change Start */
  /** Tourispo Change End */
}

.pswp__button--arrow--right:before {
  right: 6px;
  /** Tourispo Change Start */
  /** Tourispo Change End */
}

/*

	2. Share modal/popup and links

 */
.pswp__counter,
.pswp__share-modal {
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
}

.pswp__share-modal {
  display: block;
  background: rgba(0, 0, 0, 0.5);
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  padding: 10px;
  position: absolute;
  z-index: 1600;
  opacity: 0;
  transition: opacity 0.25s ease-out;
  -webkit-backface-visibility: hidden;
  will-change: opacity;
}

.pswp__share-modal--hidden {
  display: none;
}

.pswp__share-tooltip {
  z-index: 1620;
  position: absolute;
  background: #FFF;
  top: 56px;
  border-radius: 2px;
  display: block;
  width: auto;
  right: 44px;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.25);
  transform: translateY(6px);
  transition: transform 0.25s;
  -webkit-backface-visibility: hidden;
  will-change: transform;
}
.pswp__share-tooltip a {
  display: block;
  padding: 8px 12px;
  color: #000;
  text-decoration: none;
  font-size: 14px;
  line-height: 18px;
}
.pswp__share-tooltip a:hover {
  text-decoration: none;
  color: #000;
}
.pswp__share-tooltip a:first-child {
  /* round corners on the first/last list item */
  border-radius: 2px 2px 0 0;
}
.pswp__share-tooltip a:last-child {
  border-radius: 0 0 2px 2px;
}

.pswp__share-modal--fade-in {
  opacity: 1;
}
.pswp__share-modal--fade-in .pswp__share-tooltip {
  transform: translateY(0);
}

/* increase size of share links on touch devices */
.pswp--touch .pswp__share-tooltip a {
  padding: 16px 12px;
}

a.pswp__share--facebook:before {
  content: "";
  display: block;
  width: 0;
  height: 0;
  position: absolute;
  top: -12px;
  right: 15px;
  border: 6px solid rgba(0, 0, 0, 0);
  border-bottom-color: #FFF;
  -webkit-pointer-events: none;
  -moz-pointer-events: none;
  pointer-events: none;
}
a.pswp__share--facebook:hover {
  background: #3E5C9A;
  color: #FFF;
}
a.pswp__share--facebook:hover:before {
  border-bottom-color: #3E5C9A;
}

a.pswp__share--twitter:hover {
  background: #55ACEE;
  color: #FFF;
}

a.pswp__share--pinterest:hover {
  background: #CCC;
  color: #CE272D;
}

a.pswp__share--download:hover {
  background: #DDD;
}

/*

	3. Index indicator ("1 of X" counter)

 */
.pswp__counter {
  position: absolute;
  left: 0;
  top: 0;
  height: 44px;
  font-size: 13px;
  line-height: 44px;
  color: #FFF;
  opacity: 0.75;
  padding: 0 10px;
}

/*

	4. Caption

 */
.pswp__caption {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  min-height: 44px;
}
.pswp__caption small {
  font-size: 11px;
  color: #BBB;
}

.pswp__caption__center {
  text-align: left;
  max-width: 420px;
  margin: 0 auto;
  font-size: 13px;
  padding: 10px;
  line-height: 20px;
  color: #CCC;
}

.pswp__caption--empty {
  display: none;
}

/* Fake caption element, used to calculate height of next/prev image */
.pswp__caption--fake {
  visibility: hidden;
}

/*

	5. Loading indicator (preloader)

	You can play with it here - http://codepen.io/dimsemenov/pen/yyBWoR

 */
.pswp__preloader {
  width: 44px;
  height: 44px;
  position: absolute;
  top: 0;
  left: 50%;
  margin-left: -22px;
  opacity: 0;
  transition: opacity 0.25s ease-out;
  will-change: opacity;
  direction: ltr;
}

.pswp__preloader__icn {
  width: 20px;
  height: 20px;
  margin: 12px;
}

.pswp__preloader--active {
  opacity: 1;
}
.pswp__preloader--active .pswp__preloader__icn {
  /* We use .gif in browsers that don't support CSS animation */
  background: url(preloader.gif) 0 0 no-repeat;
}

.pswp--css_animation .pswp__preloader--active {
  opacity: 1;
}
.pswp--css_animation .pswp__preloader--active .pswp__preloader__icn {
  animation: clockwise 500ms linear infinite;
}
.pswp--css_animation .pswp__preloader--active .pswp__preloader__donut {
  animation: donut-rotate 1000ms cubic-bezier(0.4, 0, 0.22, 1) infinite;
}
.pswp--css_animation .pswp__preloader__icn {
  background: none;
  opacity: 0.75;
  width: 14px;
  height: 14px;
  position: absolute;
  left: 15px;
  top: 15px;
  margin: 0;
}
.pswp--css_animation .pswp__preloader__cut {
  /*
      The idea of animating inner circle is based on Polymer ("material") loading indicator
       by Keanu Lee https://blog.keanulee.com/2014/10/20/the-tale-of-three-spinners.html
  */
  position: relative;
  width: 7px;
  height: 14px;
  overflow: hidden;
}
.pswp--css_animation .pswp__preloader__donut {
  box-sizing: border-box;
  width: 14px;
  height: 14px;
  border: 2px solid #FFF;
  border-radius: 50%;
  border-left-color: transparent;
  border-bottom-color: transparent;
  position: absolute;
  top: 0;
  left: 0;
  background: none;
  margin: 0;
}

@media screen and (max-width: 1024px) {
  .pswp__preloader {
    position: relative;
    left: auto;
    top: auto;
    margin: 0;
    float: right;
  }
}
@keyframes clockwise {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
@keyframes donut-rotate {
  0% {
    transform: rotate(0);
  }
  50% {
    transform: rotate(-140deg);
  }
  100% {
    transform: rotate(0);
  }
}
/*

	6. Additional styles

 */
/* root element of UI */
.pswp__ui {
  -webkit-font-smoothing: auto;
  visibility: visible;
  opacity: 1;
  z-index: 1550;
}

/* top black bar with buttons and "1 of X" indicator */
.pswp__top-bar {
  position: absolute;
  left: 0;
  top: 0;
  height: 44px;
  width: 100%;
}

.pswp__caption,
.pswp__top-bar,
.pswp--has_mouse .pswp__button--arrow--left,
.pswp--has_mouse .pswp__button--arrow--right {
  -webkit-backface-visibility: hidden;
  will-change: opacity;
  transition: opacity 333ms cubic-bezier(0.4, 0, 0.22, 1);
}

/* pswp--has_mouse class is added only when two subsequent mousemove events occur */
.pswp--has_mouse .pswp__button--arrow--left,
.pswp--has_mouse .pswp__button--arrow--right {
  visibility: visible;
}

.pswp__top-bar,
.pswp__caption {
  background-color: rgba(0, 0, 0, 0.5);
}

/* pswp__ui--fit class is added when main image "fits" between top bar and bottom bar (caption) */
.pswp__ui--fit .pswp__top-bar,
.pswp__ui--fit .pswp__caption {
  background-color: rgba(0, 0, 0, 0.3);
}

/* pswp__ui--idle class is added when mouse isn't moving for several seconds (JS option timeToIdle) */
.pswp__ui--idle .pswp__top-bar {
  opacity: 0;
}
.pswp__ui--idle .pswp__button--arrow--left,
.pswp__ui--idle .pswp__button--arrow--right {
  opacity: 0;
}

/*
	pswp__ui--hidden class is added when controls are hidden
	e.g. when user taps to toggle visibility of controls
*/
.pswp__ui--hidden .pswp__top-bar,
.pswp__ui--hidden .pswp__caption,
.pswp__ui--hidden .pswp__button--arrow--left,
.pswp__ui--hidden .pswp__button--arrow--right {
  /* Force paint & create composition layer for controls. */
  opacity: 0.001;
}

/* pswp__ui--one-slide class is added when there is just one item in gallery */
.pswp__ui--one-slide .pswp__button--arrow--left,
.pswp__ui--one-slide .pswp__button--arrow--right,
.pswp__ui--one-slide .pswp__counter {
  display: none;
}

.pswp__element--disabled {
  display: none !important;
}

.pswp--minimal--dark .pswp__top-bar {
  background: none;
}

.pswp.pswp--open {
  position: fixed;
}
.pswp.pswp--open .pswp__bg {
  opacity: 1;
}

.pswp__button:before {
  color: #FFF;
  font-size: 1.3rem;
}

.pswp__button--arrow--left, .pswp__button--arrow--right {
  background-color: rgba(0, 0, 0, 0.3) !important;
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: flex;
  -webkit-flex-direction: column;
  -webkit-box-orient: vertical; /* Safari <= 6*/
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  -o-flex-direction: column;
  flex-direction: column;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-justify-content: space-around;
  -moz-justify-content: space-around;
  -o-justify-content: space-around;
  -ms-justify-content: space-around;
  justify-content: space-around;
  flex-wrap: wrap;
  -webkit-flex-wrap: wrap;
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: distribute;
  -moz-box-pack: distribute;
  -ms-flex-pack: distribute;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
}
.pswp__button--arrow--left:before, .pswp__button--arrow--right:before {
  width: 100%;
  text-align: center;
  height: auto;
  font-size: 3.6rem;
  position: static;
  background-color: transparent;
}

.pswp--touch .pswp__button--arrow--left, .pswp--touch .pswp__button--arrow--right {
  position: absolute;
  background-color: transparent !important;
  width: 44px;
  height: 44px;
  margin-top: 0;
  top: 0;
}
.pswp--touch .pswp__button--arrow--left:before, .pswp--touch .pswp__button--arrow--right:before {
  top: 10px;
  font-size: 1.6rem;
}
.pswp--touch .pswp__button--arrow--left.pswp__button--arrow--left, .pswp--touch .pswp__button--arrow--right.pswp__button--arrow--left {
  left: 90px;
}
.pswp--touch .pswp__button--arrow--left.pswp__button--arrow--right, .pswp--touch .pswp__button--arrow--right.pswp__button--arrow--right {
  left: 140px;
}

.pswp__button--zoom:before {
  font-family: TourispoWebfonts !important;
  font-weight: 400;
  font-style: normal;
  display: inline-block;
}

.pswp__button--zoom:before {
  content: "\e91d";
}

.pswp--zoomed-in .pswp__button--zoom:before {
  content: "\e91c";
}

.videoplayer {
  -moz-hyphens: auto;
  -o-hyphens: auto;
  -webkit-hyphens: auto;
  -ms-hyphens: auto;
  hyphens: auto;
  /**
   * Larger Video Thumbnail with Title and Description
   * underneath the Video
   */
  /**
   * Smaller Video Thumbnail with Title and Description
   * right next to Thumbnail (list form)
   */
}
.videoplayer--large .videoplayer--duration {
  font-weight: 700;
}
.videoplayer--large .videoplayer__title {
  padding: 10px 0;
}
.videoplayer--large .videoplayer__description {
  font-size: 0.9rem;
}
.videoplayer--large .videoplayer__duration {
  bottom: 10px;
  right: 10px;
}
.videoplayer--large .videoplayer__play-btn {
  width: 40px;
  height: 30px;
  margin-left: -20px;
  margin-top: -15px;
}
.videoplayer--large .videoplayer__thumbnail-container:hover .videoplayer__play-btn:before {
  font-size: 1.15rem;
}

.videoplayer--small {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: distribute;
  -moz-box-pack: distribute;
  -ms-flex-pack: distribute;
  -webkit-box-align: flex-start;
  -moz-box-align: flex-start;
  -ms-flex-align: flex-start;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: flex-start;
  -moz-align-items: flex-start;
  -ms-align-items: flex-start;
  -o-align-items: flex-start;
  align-items: flex-start;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: space-around;
  -moz-justify-content: space-around;
  -o-justify-content: space-around;
  -ms-justify-content: space-around;
  justify-content: space-around;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
  height: 100%;
  overflow: hidden;
}
.videoplayer--small .videoplayer__thumbnail-container {
  width: 30%;
}
.videoplayer--small .videoplayer__thumbnail-container:hover .videoplayer__play-btn:before {
  font-size: 0.9rem;
}
.videoplayer--small .videoplayer__caption {
  width: 65%;
}
.videoplayer--small .videoplayer__title {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  padding: 0;
}
.videoplayer--small .videoplayer__description {
  font-size: 0.84rem;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box !important;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
}
.videoplayer--small .videoplayer__duration {
  font-size: 0.74rem;
  bottom: 2px;
  right: 2px;
}
.videoplayer--small .videoplayer__play-btn {
  width: 28px;
  height: 20px;
  margin-left: -14px;
  margin-top: -10px;
  font-size: 0.74rem;
}

.videoplayer__thumbnail-container {
  color: #FFF;
  position: relative;
}
.videoplayer__thumbnail {
  width: 100%;
}

.videoplayer__duration {
  background: rgba(0, 0, 0, 0.6);
  position: absolute;
  padding: 2px 4px 3px 4px;
  border-radius: 5px;
}

.videoplayer__play-btn {
  background-color: #0375b4;
  border-radius: 3px;
  position: absolute;
  left: 50%;
  top: 50%;
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: flex;
  -webkit-flex-direction: column;
  -webkit-box-orient: vertical; /* Safari <= 6*/
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  -o-flex-direction: column;
  flex-direction: column;
  -webkit-align-items: center;
  -moz-align-items: center;
  -ms-align-items: center;
  -o-align-items: center;
  align-items: center;
  -webkit-justify-content: space-around;
  -moz-justify-content: space-around;
  -o-justify-content: space-around;
  -ms-justify-content: space-around;
  justify-content: space-around;
  flex-wrap: nowrap;
  -webkit-flex-wrap: nowrap;
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: distribute;
  -moz-box-pack: distribute;
  -ms-flex-pack: distribute;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  text-align: center;
}

.videoplayer__thumbnail-container:hover {
  cursor: pointer;
}
.videoplayer__thumbnail-container:hover .videoplayer__play-btn {
  box-shadow: rgba(0, 0, 0, 0.12) 0px 1px 6px, rgba(0, 0, 0, 0.12) 0px 1px 4px;
}

.videoplayer .videoplayer__title {
  margin-bottom: 0 !important;
}

.videoplayer-onactive {
  position: fixed;
  z-index: 4;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.6);
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: distribute;
  -moz-box-pack: distribute;
  -ms-flex-pack: distribute;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: center;
  -moz-align-items: center;
  -ms-align-items: center;
  -o-align-items: center;
  align-items: center;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: space-around;
  -moz-justify-content: space-around;
  -o-justify-content: space-around;
  -ms-justify-content: space-around;
  justify-content: space-around;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
}
.videoplayer-onactive__frame {
  width: 560px;
  height: 315px;
}
.videoplayer-onactive__frame iframe {
  width: 100%;
  height: 100%;
}

/*## components/navigations              #####*/
.horizontal-navigation {
  width: 100%;
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: start;
  -moz-box-pack: start;
  -ms-flex-pack: start;
  -webkit-box-align: stretch;
  -moz-box-align: stretch;
  -ms-flex-align: stretch;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: flex-start;
  -moz-justify-content: flex-start;
  -o-justify-content: flex-start;
  -ms-justify-content: flex-start;
  justify-content: flex-start;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
  position: relative;
}
.horizontal-navigation:not(.has-hidden-elements) {
  overflow: hidden;
}
.horizontal-navigation__active-indicator {
  height: 3px;
  position: absolute;
  z-index: 1;
  -ms-transition: all 300ms ease 0s;
  transition: all 300ms ease 0s;
  -ms-transition-property: left, background-color;
  transition-property: left, background-color;
}

.horizontal-navigation__visible-items {
  flex-grow: 1;
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-inline-flex !important; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-inline-flex !important; /* 2012 spec prefixed for iOS7/8 */
  display: inline-flex !important;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: start;
  -moz-box-pack: start;
  -ms-flex-pack: start;
  -webkit-box-align: stretch;
  -moz-box-align: stretch;
  -ms-flex-align: stretch;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: flex-start;
  -moz-justify-content: flex-start;
  -o-justify-content: flex-start;
  -ms-justify-content: flex-start;
  justify-content: flex-start;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
}
.horizontal-navigation__visible-items .link {
  flex-grow: 1;
  text-align: center;
  position: relative;
  padding: 0 6px;
}

.horizontal-navigation__hidden-items {
  visibility: hidden;
  position: absolute;
  right: 0;
  top: 30px;
  background-color: #ffffff;
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: flex;
  -webkit-flex-direction: column;
  -webkit-box-orient: vertical; /* Safari <= 6*/
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  -o-flex-direction: column;
  flex-direction: column;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: nowrap;
  -webkit-flex-wrap: nowrap;
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  margin: 0 10px;
  -ms-transition: all 300ms ease 100ms;
  transition: all 300ms ease 100ms;
  -ms-transition-property: visibility;
  transition-property: visibility;
}
.horizontal-navigation__hidden-items > .element-contents {
  flex-grow: 1;
}
.horizontal-navigation__hidden-items > .element-contents .label-value-combo:first-child {
  margin-top: -4px;
}
.horizontal-navigation__hidden-items .element-image {
  max-width: 100%;
  margin-bottom: 10px;
}
.horizontal-navigation__hidden-items > .element-actions {
  padding-top: 10px;
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: start;
  -moz-box-pack: start;
  -ms-flex-pack: start;
  -webkit-box-align: stretch;
  -moz-box-align: stretch;
  -ms-flex-align: stretch;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: flex-start;
  -moz-justify-content: flex-start;
  -o-justify-content: flex-start;
  -ms-justify-content: flex-start;
  justify-content: flex-start;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
}
.horizontal-navigation__hidden-items > .element-actions > a:not(:first-child) {
  margin-left: 10px;
}
@media all and (min-width: 481px) {
  .horizontal-navigation__hidden-items {
    margin: 0;
  }
}
.horizontal-navigation__hidden-items > a {
  color: #727272 !important;
}
.horizontal-navigation__hidden-items > a.active {
  background-color: #ffffff !important;
}
.horizontal-navigation__hidden-items > a:not(:last-child) {
  border-bottom: 1px solid #ccc;
}
.horizontal-navigation__hidden-items:hover {
  visibility: visible;
}

.horizontal-navigation__toggle-more {
  min-width: 60px;
  font-weight: 700;
  flex-grow: 1;
  display: -webkit-flex !important;
  display: flex !important;
}
.horizontal-navigation__toggle-more:before {
  margin: 0 auto;
  font-size: 1.3rem;
}
.horizontal-navigation__toggle-more:hover + .horizontal-navigation__hidden-items {
  visibility: visible;
}

.horizontal-navigation .invisible {
  visibility: hidden;
}
.horizontal-navigation .link {
  overflow: hidden;
  transform: translate3d(0, 0, 0);
  position: relative;
}
.horizontal-navigation .link:after {
  content: "";
  display: block;
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  pointer-events: none;
  background-image: radial-gradient(circle, #0375b4 10%, transparent 10.01%);
  background-repeat: no-repeat;
  background-position: 50%;
  transform: scale(10, 10);
  opacity: 0;
  transition: transform 0.5s, opacity 1s;
}
.horizontal-navigation .link:active:after {
  transform: scale(0, 0);
  opacity: 0.2;
  transition: 0s;
}
.horizontal-navigation .link.active {
  font-weight: 700;
}

.horizontal-navigation {
  /*############################################
  *## TabNavi upon the website (containing ProductNavigation or RegionList navigation)
  *############################################*/
}
.horizontal-navigation.horizontal-navigation--main {
  grid-row: aggregator-tab-navi-row-start/aggregator-tab-navi-row-end;
  grid-column: aggregator-tab-navi-col-start/aggregator-tab-navi-col-end;
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  z-index: 40;
  height: 50px;
  /*############################################
   *##
   *## Links to Configurators
   *##
   *############################################*/
}
.horizontal-navigation.horizontal-navigation--main .ui-icon-close {
  background-color: #0375b4;
  position: absolute;
  right: 0;
  top: 0;
  font-size: 1.6rem;
  display: block;
  color: #ffffff;
  height: 40px;
  line-height: 40px;
  width: 40px;
}
.horizontal-navigation.horizontal-navigation--main .background-fader {
  display: none;
  background-color: white;
  z-index: -1;
  position: fixed;
  left: 0;
  right: 0;
  top: 50px;
  width: 100vw;
  opacity: 0.7;
}
.horizontal-navigation.horizontal-navigation--main .background-fader.visible {
  display: block;
  bottom: 0;
}
.horizontal-navigation.horizontal-navigation--main .background-fader:hover {
  display: none !important;
}
.horizontal-navigation.horizontal-navigation--main.force-close .tab-content {
  display: none;
}
.horizontal-navigation.horizontal-navigation--main.toggled-visible {
  z-index: 700;
  grid-row: aggregator-tab-navi-row-start/aggregator-tab-navi-row-end;
  grid-column: aggregator-tab-navi-col-start/right;
  background-color: #0375b4;
}
.horizontal-navigation.horizontal-navigation--main.toggled-visible #main-nav-toggle {
  width: auto;
}
.horizontal-navigation.horizontal-navigation--main.toggled-visible #main-nav-toggle:before {
  font-size: 1rem;
  content: "\f2d7";
}
.horizontal-navigation.horizontal-navigation--main.toggled-visible #main-nav-toggle span {
  display: none;
}
.horizontal-navigation.horizontal-navigation--main.toggled-visible .background-fader {
  display: block;
  bottom: 0;
}
.horizontal-navigation.horizontal-navigation--main .tab-link, .horizontal-navigation.horizontal-navigation--main #main-nav-toggle {
  white-space: nowrap;
  display: block;
  height: 100%;
  color: #ffffff;
  text-decoration: none;
}
.horizontal-navigation.horizontal-navigation--main .tab-link:not(.icon-with-label):before, .horizontal-navigation.horizontal-navigation--main #main-nav-toggle:not(.icon-with-label):before {
  display: block;
  content: attr(data-label);
  font-weight: bold;
  height: 1px;
  color: transparent;
  overflow: hidden;
  visibility: hidden;
  margin-bottom: -1px;
}
.horizontal-navigation.horizontal-navigation--main .tab-link:not(.icon-with-label):hover, .horizontal-navigation.horizontal-navigation--main #main-nav-toggle:not(.icon-with-label):hover {
  font-weight: 700;
}
.horizontal-navigation.horizontal-navigation--main .tab-link {
  line-height: 48px;
  font-size: 0.74rem;
}
.horizontal-navigation.horizontal-navigation--main #main-nav-toggle {
  display: flex;
  padding-left: 10px;
  background-color: #0375b4;
  width: calc(100% + 6px);
  border-right: none;
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}
@media all and (min-width: 1401px) {
  .horizontal-navigation.horizontal-navigation--main #main-nav-toggle {
    width: calc(100% + 6px);
  }
}
.horizontal-navigation.horizontal-navigation--main #main-nav-toggle:before {
  width: 24px;
  font-size: 2rem;
}
.horizontal-navigation.horizontal-navigation--main #main-nav-toggle:hover:before {
  color: #ffffff;
}
.horizontal-navigation.horizontal-navigation--main .horizontal-navigation__active-indicator {
  display: none;
}
.horizontal-navigation.horizontal-navigation--main .tab {
  display: none;
  font-weight: 400;
  text-align: center;
  border-bottom: 3px solid transparent;
  background-color: #0375b4;
  flex-grow: 1;
  -webkit-flex-grow: 1;
  -moz-flex-grow: 1;
  -ms-flex-grow: 1;
  -o-flex-grow: 1;
}
.horizontal-navigation.horizontal-navigation--main .tab:last-child {
  padding-right: 10px;
}
.horizontal-navigation.horizontal-navigation--main .tab.expanded .tab-content, .horizontal-navigation.horizontal-navigation--main .tab.expanded-on-touch .tab-content {
  border-top-color: #0375b4 !important;
  opacity: 1;
  border-top: 5px solid;
  -webkit-box-shadow: 7px 6px 8px 1px #727272;
  box-shadow: 7px 6px 8px 1px #727272;
  max-height: 100vh;
  overflow: auto;
}
.horizontal-navigation.horizontal-navigation--main .tab.expanded .tab-content.blog, .horizontal-navigation.horizontal-navigation--main .tab.expanded-on-touch .tab-content.blog {
  padding-top: 40px;
}
.horizontal-navigation.horizontal-navigation--main.toggled-visible .tab {
  display: block;
}
.horizontal-navigation.horizontal-navigation--main .tab-content {
  -ms-transition: all 300ms ease-in 0s;
  transition: all 300ms ease-in 0s;
  -ms-transition-property: max-height;
  transition-property: max-height;
  width: 100%;
  text-align: left;
  max-height: 0;
  overflow: hidden;
  opacity: 0;
  position: absolute;
  left: 0;
  z-index: 1000;
  background-color: #FFF;
}
.horizontal-navigation.horizontal-navigation--main .tab-content .region-list__single-region .list-divider {
  color: #0375b4;
}
.horizontal-navigation.horizontal-navigation--main .tab-content .region-list__single-region:not(.first) {
  margin-top: 10px;
}
.horizontal-navigation.horizontal-navigation--main .tab-content .link:hover {
  color: #0375b4;
  font-weight: 700;
}
.horizontal-navigation.horizontal-navigation--main .tab-content .region-list__single-region__sub-regions {
  display: grid;
  grid-gap: 10px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
@media all and (min-width: 351px) {
  .horizontal-navigation.horizontal-navigation--main .tab-link {
    font-size: 0.9rem;
  }
}
@media all and (min-width: 481px) {
  .horizontal-navigation.horizontal-navigation--main .tab-link {
    font-size: 1rem;
  }
}
@media all and (min-width: 681px) {
  .horizontal-navigation.horizontal-navigation--main {
    margin-top: 0;
    height: 74px;
    padding: 0 24% 0 20%;
    box-shadow: none;
  }
  .horizontal-navigation.horizontal-navigation--main:hover {
    z-index: 5;
  }
  .horizontal-navigation.horizontal-navigation--main:hover .background-fader {
    display: block;
  }
  .horizontal-navigation.horizontal-navigation--main #main-nav-toggle {
    display: none !important;
  }
  .horizontal-navigation.horizontal-navigation--main .background-fader {
    top: 100px;
  }
  .horizontal-navigation.horizontal-navigation--main .tab {
    display: block;
    border-top: 3px solid transparent;
    background-color: transparent;
  }
  .horizontal-navigation.horizontal-navigation--main .tab.active > .tab-link, .horizontal-navigation.horizontal-navigation--main .tab:hover > .tab-link {
    font-weight: 700;
    color: #0375b4;
  }
  .horizontal-navigation.horizontal-navigation--main .tab-link {
    font-size: 0.9rem;
    color: #727272;
    white-space: normal;
    -moz-hyphens: auto;
    -o-hyphens: auto;
    -webkit-hyphens: auto;
    -ms-hyphens: auto;
    hyphens: auto;
    display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
    display: -webkit-flex; /* Safari 7*/
    display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
    display: -ms-flexbox; /* IE10 */
    display: flex;
    -webkit-flex-direction: column;
    -webkit-box-orient: vertical; /* Safari <= 6*/
    -moz-flex-direction: column;
    -ms-flex-direction: column;
    -o-flex-direction: column;
    flex-direction: column;
    -webkit-align-items: center;
    -moz-align-items: center;
    -ms-align-items: center;
    -o-align-items: center;
    align-items: center;
    -webkit-justify-content: center;
    -moz-justify-content: center;
    -o-justify-content: center;
    -ms-justify-content: center;
    justify-content: center;
    flex-wrap: nowrap;
    -webkit-flex-wrap: nowrap;
  }
  .horizontal-navigation.horizontal-navigation--main .tab-content .region-list__single-region__sub-regions {
    display: grid;
    grid-gap: 10px;
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
  .horizontal-navigation.horizontal-navigation--main .horizontal-navigation__active-indicator {
    display: block;
    top: 9px;
    height: 34px;
    width: 34px !important;
    border-radius: 50%;
    z-index: 0;
  }
}
.horizontal-navigation.horizontal-navigation--main .advanced-pecu-search {
  position: absolute;
  right: 64px;
  top: 10px;
  font-weight: 700;
  color: #0375b4;
}
@media all and (min-width: 861px) {
  .horizontal-navigation.horizontal-navigation--main {
    padding: 0 25% 0 26%;
  }
  .horizontal-navigation.horizontal-navigation--main .tab-link {
    font-size: 1rem;
  }
  .horizontal-navigation.horizontal-navigation--main .tab-content .region-list__single-region__sub-regions {
    display: grid;
    grid-gap: 10px;
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }
}
@media all and (min-width: 1025px) {
  .horizontal-navigation.horizontal-navigation--main {
    padding: 0;
  }
  .horizontal-navigation.horizontal-navigation--main .tab-content {
    width: 140%;
    margin-left: -20%;
  }
}
@media all and (min-width: 1151px) {
  .horizontal-navigation.horizontal-navigation--main .tab-content {
    width: 160%;
    margin-left: 0;
  }
  .horizontal-navigation.horizontal-navigation--main .tab-content .region-list__single-region__sub-regions {
    display: grid;
    grid-gap: 10px;
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }
  .horizontal-navigation.horizontal-navigation--main .tab:hover .tab-content {
    overflow: hidden;
  }
}
@media all and (min-width: 1401px) {
  .horizontal-navigation.horizontal-navigation--main .tab-content {
    margin-left: -10px;
  }
}

body.scrolled .horizontal-navigation--main {
  padding-right: 40px;
  -ms-transition: all 300ms ease 0s;
  transition: all 300ms ease 0s;
  -ms-transition-property: padding;
  transition-property: padding;
}
@media all and (min-width: 481px) {
  body.scrolled .horizontal-navigation--main {
    padding-right: 10px;
  }
}

body.ajax-search-active #main-nav-toggle {
  display: none !important;
}

.horizontal-navigation {
  line-height: 30px;
  /*############################################
   *## GeoGroupRelatedNavigation EntityRelatedNavigation,...
   *############################################*/
}
.horizontal-navigation.pecu-and-geo-navi {
  position: -webkit-sticky;
  position: sticky;
  top: 50px;
  z-index: 3;
}

.horizontal-navigation.pecu-and-geo-subnavi {
  z-index: 2;
}

.horizontal-navigation.pecu-and-geo-navi, .horizontal-navigation.pecu-and-geo-subnavi {
  grid-row: tabnavi-row;
  grid-column: tabnavi-col-start/tabnavi-col-end;
  height: 30px;
}
.horizontal-navigation.pecu-and-geo-navi + #pecu-and-geo-navi-background, .horizontal-navigation.pecu-and-geo-subnavi + #pecu-and-geo-navi-background {
  position: fixed;
  top: 50px;
  height: 30px;
  opacity: 0;
  width: 100%;
  background-color: #0375b4;
  z-index: 2;
  -ms-transition: all 300ms ease 0s;
  transition: all 300ms ease 0s;
  -ms-transition-property: opacity;
  transition-property: opacity;
}
.horizontal-navigation.pecu-and-geo-navi.stuck + #pecu-and-geo-navi-background, .horizontal-navigation.pecu-and-geo-subnavi.stuck + #pecu-and-geo-navi-background {
  opacity: 1;
}
.horizontal-navigation.pecu-and-geo-navi .horizontal-navigation__active-indicator, .horizontal-navigation.pecu-and-geo-subnavi .horizontal-navigation__active-indicator {
  background-color: #ffc100;
  bottom: -1px;
}
.horizontal-navigation.pecu-and-geo-navi .horizontal-navigation__visible-items, .horizontal-navigation.pecu-and-geo-navi .horizontal-navigation__toggle-more, .horizontal-navigation.pecu-and-geo-subnavi .horizontal-navigation__visible-items, .horizontal-navigation.pecu-and-geo-subnavi .horizontal-navigation__toggle-more {
  background-color: #0375b4;
  flex-grow: 0;
}
.horizontal-navigation.pecu-and-geo-navi .horizontal-navigation__visible-items .link, .horizontal-navigation.pecu-and-geo-navi .horizontal-navigation__toggle-more .link, .horizontal-navigation.pecu-and-geo-subnavi .horizontal-navigation__visible-items .link, .horizontal-navigation.pecu-and-geo-subnavi .horizontal-navigation__toggle-more .link {
  flex-grow: 0;
}
.horizontal-navigation.pecu-and-geo-navi .link, .horizontal-navigation.pecu-and-geo-navi .horizontal-navigation__toggle-more, .horizontal-navigation.pecu-and-geo-subnavi .link, .horizontal-navigation.pecu-and-geo-subnavi .horizontal-navigation__toggle-more {
  color: #ffffff;
  white-space: nowrap;
  padding: 0 10px;
  border-bottom: 3px solid transparent;
}
.horizontal-navigation.pecu-and-geo-navi .link.active, .horizontal-navigation.pecu-and-geo-navi .horizontal-navigation__toggle-more.active, .horizontal-navigation.pecu-and-geo-subnavi .link.active, .horizontal-navigation.pecu-and-geo-subnavi .horizontal-navigation__toggle-more.active {
  background-color: #171b2d;
  border-bottom: 2px solid #ffc100;
}
.horizontal-navigation.pecu-and-geo-navi .link:first-child, .horizontal-navigation.pecu-and-geo-navi .horizontal-navigation__toggle-more:first-child, .horizontal-navigation.pecu-and-geo-subnavi .link:first-child, .horizontal-navigation.pecu-and-geo-subnavi .horizontal-navigation__toggle-more:first-child {
  padding-left: 10px;
}
.horizontal-navigation.pecu-and-geo-navi .link:last-child, .horizontal-navigation.pecu-and-geo-navi .horizontal-navigation__toggle-more:last-child, .horizontal-navigation.pecu-and-geo-subnavi .link:last-child, .horizontal-navigation.pecu-and-geo-subnavi .horizontal-navigation__toggle-more:last-child {
  padding-right: 10px;
}

.horizontal-navigation.pecu-and-geo-subnavi {
  margin-top: 30px;
}

@media all and (min-width: 681px) {
  .horizontal-navigation.pecu-and-geo-navi {
    top: 74px;
  }
  .horizontal-navigation.pecu-and-geo-navi + #pecu-and-geo-navi-background {
    position: fixed;
    top: 74px;
  }
}

.horizontal-navigation {
  /*############################################
   *## Tab Navigation (i.e. switching between Trail Map View and zoomable Map)
   *############################################*/
  /*############################################
   *## The contents controled by the TabNavigation
   *############################################*/
}
.horizontal-navigation--tabbed {
  border-bottom: none;
}
.horizontal-navigation--tabbed .horizontal-navigation__active-indicator {
  background-color: #0375b4;
  top: 1px;
}
.horizontal-navigation--tabbed .link {
  text-align: center;
  top: 1px;
  border: 1px solid #ccc;
  border-left: none;
  background: #fafafa;
}
.horizontal-navigation--tabbed .link.active {
  color: #0375b4;
  background: #fcfcfc;
  border-bottom-color: transparent;
}
.horizontal-navigation--tabbed .link:not(.active) {
  padding-bottom: 1px !important;
}
.horizontal-navigation--tabbed .link:not(.active):first-child {
  border-left: 1px solid #ccc;
}
.horizontal-navigation--tabbed .link:last-child {
  margin-right: 10px;
}

.horizontal-navigation--tabbed__content {
  background: #ffffff;
  border-bottom: 1px solid #ccc;
  overflow: hidden;
}
.horizontal-navigation--tabbed__content > div {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: start;
  -moz-box-pack: start;
  -ms-flex-pack: start;
  -webkit-box-align: stretch;
  -moz-box-align: stretch;
  -ms-flex-align: stretch;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: flex-start;
  -moz-justify-content: flex-start;
  -o-justify-content: flex-start;
  -ms-justify-content: flex-start;
  justify-content: flex-start;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
  -ms-transition: all 400ms ease-in 0s;
  transition: all 400ms ease-in 0s;
  -ms-transition-property: margin;
  transition-property: margin;
}
.tabnavigation-content-item {
  min-width: 0;
  flex-basis: 100%;
  flex-shrink: 1;
  -webkit-flex-shrink: 1;
  -moz-flex-shrink: 1;
  -ms-flex-shrink: 1;
  -o-flex-shrink: 1;
  flex-grow: 1;
  -webkit-flex-grow: 1;
  -moz-flex-grow: 1;
  -ms-flex-grow: 1;
  -o-flex-grow: 1;
}

/*############################################
 *## VerticalNavigation
 *############################################*/
#toggleVerticalNavButton {
  grid-row: logo-row-start;
  grid-column: logo-col-start/logo-col-end;
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  z-index: 4;
  left: 10px;
  height: 74px;
  line-height: 74px;
  color: #ffffff;
  padding: 0 10px;
  width: 40px;
  font-size: 2.8rem;
}
@media all and (min-width: 481px) {
  #toggleVerticalNavButton {
    line-height: 74px;
    left: 1%;
  }
}
@media all and (min-width: 861px) {
  #toggleVerticalNavButton {
    display: none;
  }
}

.vertical-navigation {
  position: relative;
  /*############################################
   *## Headline above the navigation (i.e. Skigebiete)
   *############################################*/
  /*############################################
   *## First level separators (i.e. continents)
   *############################################*/
  /*############################################
   *## Container containing level1 items (i.e countries)
   *############################################*/
  /*############################################
   *## Toggle to show all items if the height of the container got limited
   *############################################*/
}
.vertical-navigation .separator-headline {
  border-bottom: 2px #0375b4 solid;
  color: #0375b4;
  padding-left: 10px;
}
.vertical-navigation .separator-headline:before {
  color: #0375b4;
}
.vertical-navigation .separator {
  width: 100%;
  display: block;
  line-height: 1.5;
  padding-left: 18px;
  font-weight: 400;
  overflow: hidden;
  transform: translate3d(0, 0, 0);
  position: relative;
  background-color: #ffffff;
  border-top: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
  padding: 10px;
}
.vertical-navigation .separator:after {
  content: "";
  display: block;
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  pointer-events: none;
  background-image: radial-gradient(circle, #0375b4 10%, transparent 10.01%);
  background-repeat: no-repeat;
  background-position: 50%;
  transform: scale(10, 10);
  opacity: 0;
  transition: transform 0.5s, opacity 1s;
}
.vertical-navigation .separator:active:after {
  transform: scale(0, 0);
  opacity: 0.2;
  transition: 0s;
}
.vertical-navigation .separator:hover {
  background-color: #f1f1f1;
  color: #171b2d;
}
.vertical-navigation .separator:hover:before {
  color: #171b2d;
}
.vertical-navigation .separator a:hover {
  color: #171b2d;
}
.vertical-navigation .separator a:hover:before {
  color: #171b2d;
}
.vertical-navigation .separator > .element-actions {
  padding-top: 10px;
}
.vertical-navigation .level1 {
  padding: 10px 0;
  /*############################################
   *## Level2 container
   *############################################*/
}
.vertical-navigation .level1.show-more-container {
  padding-bottom: 40px;
}
.vertical-navigation .level1 .toggle-submenu {
  position: absolute;
  top: -32px;
  right: 10px;
  width: 18px;
  line-height: 20px;
  font-size: 1.6rem;
  justify-content: center;
  color: #0375b4;
}
.vertical-navigation .level1 .toggle-submenu.ui-icon-caret-up {
  color: #f18825;
}
.vertical-navigation .level1 .level1-item {
  line-height: 1.5;
  padding-left: 18px;
}
.vertical-navigation .level1 .level2 {
  padding: 10px;
}
.vertical-navigation .level1 .level2.collapsed {
  height: 0;
}
.vertical-navigation .level1 .level2.collapsed .item {
  display: none;
}
.vertical-navigation .level1 .level2 .level2-item {
  line-height: 1.6;
  padding-left: 14px;
  font-size: 0.9rem;
}
.vertical-navigation .item {
  width: 100%;
  color: #727272;
  display: block;
  overflow: hidden;
  transform: translate3d(0, 0, 0);
  position: relative;
}
.vertical-navigation .item:after {
  content: "";
  display: block;
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  pointer-events: none;
  background-image: radial-gradient(circle, #0375b4 10%, transparent 10.01%);
  background-repeat: no-repeat;
  background-position: 50%;
  transform: scale(10, 10);
  opacity: 0;
  transition: transform 0.5s, opacity 1s;
}
.vertical-navigation .item:active:after {
  transform: scale(0, 0);
  opacity: 0.2;
  transition: 0s;
}
.vertical-navigation .item:hover {
  background-color: #f1f1f1;
  color: #171b2d;
}
.vertical-navigation .item:hover:before {
  color: #171b2d;
}
.vertical-navigation .item a:hover {
  color: #171b2d;
}
.vertical-navigation .item a:hover:before {
  color: #171b2d;
}
.vertical-navigation .item:before {
  flex-shrink: 0;
  width: 24px;
}
.vertical-navigation .show-all-toggle {
  position: absolute;
  right: 0;
  left: -4px;
  bottom: 10px;
  background-color: #fafafa;
  color: #0375b4;
  padding: 2px 2px 2px 6px;
  cursor: pointer;
}
.vertical-navigation .show-all-toggle:hover {
  background-color: #0375b4;
  color: #ffffff;
}
.vertical-navigation .show-all-toggle .ui-icon-angle-down:before {
  font-size: 0.84rem;
}
.vertical-navigation .show-all-toggle .ui-icon-angle-up {
  visibility: hidden;
}
.vertical-navigation .show-all-toggle .ui-icon-angle-up:before {
  font-size: 1.6rem;
  visibility: visible;
  position: absolute;
  left: 0;
  right: 0;
  text-align: center;
}
@media all and (min-width: 861px) {
  .vertical-navigation {
    display: block;
    background-color: #f9f9f9;
    grid-row: vertical-nav-row-start/vertical-nav-row-end;
    grid-column: left;
    -ms-grid-column: 2;
    padding-right: 8px;
    position: relative;
    left: -1px;
  }
}
@media all and (min-width: 861px) and (min-width: 681px) {
  .vertical-navigation {
    padding-right: 10px;
  }
}
@media all and (min-width: 861px) and (min-width: 1025px) {
  .vertical-navigation {
    padding-right: 10px;
  }
}
@media all and (min-width: 861px) {
  .vertical-navigation.level1 {
    top: -32px;
  }
}
@media all and (min-width: 1025px) {
  .vertical-navigation .level1-container .toggle-submenu {
    width: 22px;
    line-height: 22px;
  }
}

/*############################################
 *## SidePanelNavigation which is only shown after user clicked the burger menu icon
 *############################################*/
body.show-side-panel .vertical-navigation {
  display: block;
  position: fixed;
  z-index: 10;
  top: 74px;
  left: 0;
  bottom: 0;
  -ms-transition: all 400ms linear 0s;
  transition: all 400ms linear 0s;
  -ms-transition-property: left;
  transition-property: left;
  background-color: #31394a;
}
body.show-side-panel .vertical-navigation .item {
  color: #ccc;
  font-size: 1.3rem;
  border: 1px solid #262c3a;
  border-top-color: rgba(255, 255, 255, 0.14);
}
body.show-side-panel .vertical-navigation .item.active, body.show-side-panel .vertical-navigation .item:hover {
  background-color: #262c3a !important;
  border-top: 1px solid transparent;
}
body.show-side-panel .vertical-navigation .item.active {
  border-left: 3px solid #ffc100;
}
body.show-side-panel .vertical-navigation .item:before {
  text-shadow: 0 1px 0 rgba(0, 0, 0, 0.6);
}

/*## Deprecated components => To be replaced after JS Libs switch #####*/
/**
 * Swiper 4.0.5
 * Most modern mobile touch slider and framework with hardware accelerated transitions
 * http://www.idangero.us/swiper/
 *
 * Copyright 2014-2017 Vladimir Kharlampidi
 *
 * Released under the MIT License
 *
 * Released on: November 7, 2017
 */
.swiper-container {
  margin: 0 auto;
  position: relative;
  overflow: hidden;
  list-style: none;
  padding: 0;
  /* Fix of Webkit flickering */
  z-index: 1;
}

.swiper-container-no-flexbox .swiper-slide {
  float: left;
}

.swiper-container-vertical > .swiper-wrapper {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
}

.swiper-wrapper {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: start;
  -moz-box-pack: start;
  -ms-flex-pack: start;
  -webkit-box-align: stretch;
  -moz-box-align: stretch;
  -ms-flex-align: stretch;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: flex-start;
  -moz-justify-content: flex-start;
  -o-justify-content: flex-start;
  -ms-justify-content: flex-start;
  justify-content: flex-start;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
  position: relative;
  width: 100%;
  height: 100%;
  z-index: 1;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-transition-property: -webkit-transform;
  transition-property: -webkit-transform;
  -o-transition-property: transform;
  transition-property: transform;
  transition-property: transform, -webkit-transform;
  -webkit-box-sizing: content-box;
  box-sizing: content-box;
}

.swiper-container-android .swiper-slide,
.swiper-wrapper {
  -webkit-transform: translate3d(0px, 0, 0);
  transform: translate3d(0px, 0, 0);
}

.swiper-container-multirow > .swiper-wrapper {
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

.swiper-container-free-mode > .swiper-wrapper {
  -webkit-transition-timing-function: ease-out;
  -o-transition-timing-function: ease-out;
  transition-timing-function: ease-out;
  margin: 0 auto;
}

.swiper-slide {
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  width: 100%;
  position: relative;
  -webkit-transition-property: -webkit-transform;
  transition-property: -webkit-transform;
  -o-transition-property: transform;
  transition-property: transform;
  transition-property: transform, -webkit-transform;
}

.swiper-invisible-blank-slide {
  visibility: hidden;
}

/* Auto Height */
.swiper-container-autoheight,
.swiper-container-autoheight .swiper-slide {
  height: auto;
}

.swiper-container-autoheight .swiper-wrapper {
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
  -ms-flex-align: start;
  align-items: flex-start;
  -webkit-transition-property: height, -webkit-transform;
  transition-property: height, -webkit-transform;
  -o-transition-property: transform, height;
  transition-property: transform, height;
  transition-property: transform, height, -webkit-transform;
}

/* 3D Effects */
.swiper-container-3d {
  -webkit-perspective: 1200px;
  perspective: 1200px;
}

.swiper-container-3d .swiper-wrapper,
.swiper-container-3d .swiper-slide,
.swiper-container-3d .swiper-slide-shadow-left,
.swiper-container-3d .swiper-slide-shadow-right,
.swiper-container-3d .swiper-slide-shadow-top,
.swiper-container-3d .swiper-slide-shadow-bottom,
.swiper-container-3d .swiper-cube-shadow {
  -webkit-transform-style: preserve-3d;
  transform-style: preserve-3d;
}

.swiper-container-3d .swiper-slide-shadow-left,
.swiper-container-3d .swiper-slide-shadow-right,
.swiper-container-3d .swiper-slide-shadow-top,
.swiper-container-3d .swiper-slide-shadow-bottom {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 10;
}

.swiper-container-3d .swiper-slide-shadow-left {
  background-image: -webkit-gradient(linear, right top, left top, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0)));
  background-image: -webkit-linear-gradient(right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
  background-image: -o-linear-gradient(right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
  background-image: linear-gradient(to left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}

.swiper-container-3d .swiper-slide-shadow-right {
  background-image: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0)));
  background-image: -webkit-linear-gradient(left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
  background-image: -o-linear-gradient(left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
  background-image: linear-gradient(to right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}

.swiper-container-3d .swiper-slide-shadow-top {
  background-image: -webkit-gradient(linear, left bottom, left top, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0)));
  background-image: -webkit-linear-gradient(bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
  background-image: -o-linear-gradient(bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
  background-image: linear-gradient(to top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}

.swiper-container-3d .swiper-slide-shadow-bottom {
  background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0)));
  background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
  background-image: -o-linear-gradient(top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
  background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}

/* IE10 Windows Phone 8 Fixes */
.swiper-container-wp8-horizontal,
.swiper-container-wp8-horizontal > .swiper-wrapper {
  -ms-touch-action: pan-y;
  touch-action: pan-y;
}

.swiper-container-wp8-vertical,
.swiper-container-wp8-vertical > .swiper-wrapper {
  -ms-touch-action: pan-x;
  touch-action: pan-x;
}

.swiper-button-prev,
.swiper-button-next {
  position: absolute;
  top: 50%;
  width: 27px;
  height: 44px;
  z-index: 10;
  cursor: pointer;
  background-size: 27px 44px;
  background-position: center;
  background-repeat: no-repeat;
  line-height: 42px;
  background: rgba(0, 0, 0, 0.5);
  padding: 4px;
}

.swiper-button-prev.swiper-button-disabled,
.swiper-button-next.swiper-button-disabled {
  opacity: 0.35;
  cursor: auto;
  pointer-events: none;
}

.swiper-button-prev,
.swiper-container-rtl .swiper-button-next {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23007aff'%2F%3E%3C%2Fsvg%3E");
  left: 10px;
  right: auto;
}

.swiper-button-next,
.swiper-container-rtl .swiper-button-prev {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23007aff'%2F%3E%3C%2Fsvg%3E");
  right: 10px;
  left: auto;
}

.swiper-button-prev.swiper-button-white,
.swiper-container-rtl .swiper-button-next.swiper-button-white {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E");
}

.swiper-button-next.swiper-button-white,
.swiper-container-rtl .swiper-button-prev.swiper-button-white {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E");
}

.swiper-button-prev.swiper-button-black,
.swiper-container-rtl .swiper-button-next.swiper-button-black {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23000000'%2F%3E%3C%2Fsvg%3E");
}

.swiper-button-next.swiper-button-black,
.swiper-container-rtl .swiper-button-prev.swiper-button-black {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23000000'%2F%3E%3C%2Fsvg%3E");
}

.swiper-pagination {
  position: absolute;
  text-align: center;
  -webkit-transition: 300ms opacity;
  -o-transition: 300ms opacity;
  transition: 300ms opacity;
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
  z-index: 10;
}

.swiper-pagination.swiper-pagination-hidden {
  opacity: 0;
}

/* Common Styles */
.swiper-pagination-fraction,
.swiper-pagination-custom,
.swiper-container-horizontal > .swiper-pagination-bullets {
  bottom: 10px;
  left: 0;
  width: 100%;
}

/* Bullets */
.swiper-pagination-bullets-dynamic {
  overflow: hidden;
  font-size: 0;
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
  -webkit-transform: scale(0.33);
  -ms-transform: scale(0.33);
  transform: scale(0.33);
  position: relative;
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active {
  -webkit-transform: scale(1);
  -ms-transform: scale(1);
  transform: scale(1);
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev {
  -webkit-transform: scale(0.66);
  -ms-transform: scale(0.66);
  transform: scale(0.66);
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev {
  -webkit-transform: scale(0.33);
  -ms-transform: scale(0.33);
  transform: scale(0.33);
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next {
  -webkit-transform: scale(0.66);
  -ms-transform: scale(0.66);
  transform: scale(0.66);
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next {
  -webkit-transform: scale(0.33);
  -ms-transform: scale(0.33);
  transform: scale(0.33);
}

.swiper-pagination-bullet {
  width: 8px;
  height: 8px;
  display: inline-block;
  border-radius: 100%;
  background: #000;
  opacity: 0.2;
}

button.swiper-pagination-bullet {
  border: none;
  margin: 0;
  padding: 0;
  -webkit-box-shadow: none;
  box-shadow: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

.swiper-pagination-clickable .swiper-pagination-bullet {
  cursor: pointer;
}

.swiper-pagination-bullet-active {
  opacity: 1;
  background: #007aff;
}

.swiper-container-vertical > .swiper-pagination-bullets {
  right: 10px;
  top: 50%;
  -webkit-transform: translate3d(0px, -50%, 0);
  transform: translate3d(0px, -50%, 0);
}

.swiper-container-vertical > .swiper-pagination-bullets .swiper-pagination-bullet {
  margin: 6px 0;
  display: block;
}

.swiper-container-vertical > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic {
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  width: 8px;
}

.swiper-container-vertical > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
  display: inline-block;
  -webkit-transition: 200ms top, 200ms -webkit-transform;
  transition: 200ms top, 200ms -webkit-transform;
  -o-transition: 200ms transform, 200ms top;
  transition: 200ms transform, 200ms top;
  transition: 200ms transform, 200ms top, 200ms -webkit-transform;
}

.swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet {
  margin: 0 4px;
}

.swiper-container-horizontal > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic {
  left: 50%;
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  transform: translateX(-50%);
  white-space: nowrap;
}

.swiper-container-horizontal > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
  -webkit-transition: 200ms left, 200ms -webkit-transform;
  transition: 200ms left, 200ms -webkit-transform;
  -o-transition: 200ms transform, 200ms left;
  transition: 200ms transform, 200ms left;
  transition: 200ms transform, 200ms left, 200ms -webkit-transform;
}

.swiper-container-horizontal.swiper-container-rtl > .swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
  -webkit-transition: 200ms right, 200ms -webkit-transform;
  transition: 200ms right, 200ms -webkit-transform;
  -o-transition: 200ms transform, 200ms right;
  transition: 200ms transform, 200ms right;
  transition: 200ms transform, 200ms right, 200ms -webkit-transform;
}

/* Progress */
.swiper-pagination-progressbar {
  background: rgba(0, 0, 0, 0.25);
  position: absolute;
}

.swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
  background: #007aff;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  -webkit-transform: scale(0);
  -ms-transform: scale(0);
  transform: scale(0);
  -webkit-transform-origin: left top;
  -ms-transform-origin: left top;
  transform-origin: left top;
}

.swiper-container-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
  -webkit-transform-origin: right top;
  -ms-transform-origin: right top;
  transform-origin: right top;
}

.swiper-container-horizontal > .swiper-pagination-progressbar {
  width: 100%;
  height: 4px;
  left: 0;
  top: 0;
}

.swiper-container-vertical > .swiper-pagination-progressbar {
  width: 4px;
  height: 100%;
  left: 0;
  top: 0;
}

.swiper-pagination-white .swiper-pagination-bullet-active {
  background: #ffffff;
}

.swiper-pagination-progressbar.swiper-pagination-white {
  background: rgba(255, 255, 255, 0.25);
}

.swiper-pagination-progressbar.swiper-pagination-white .swiper-pagination-progressbar-fill {
  background: #ffffff;
}

.swiper-pagination-black .swiper-pagination-bullet-active {
  background: #000000;
}

.swiper-pagination-progressbar.swiper-pagination-black {
  background: rgba(0, 0, 0, 0.25);
}

.swiper-pagination-progressbar.swiper-pagination-black .swiper-pagination-progressbar-fill {
  background: #000000;
}

/* Scrollbar */
.swiper-scrollbar {
  border-radius: 10px;
  position: relative;
  -ms-touch-action: none;
  background: rgba(0, 0, 0, 0.1);
}

.swiper-container-horizontal > .swiper-scrollbar {
  position: absolute;
  left: 1%;
  bottom: 3px;
  z-index: 50;
  height: 5px;
  width: 98%;
}

.swiper-container-vertical > .swiper-scrollbar {
  position: absolute;
  right: 3px;
  top: 1%;
  z-index: 50;
  width: 5px;
  height: 98%;
}

.swiper-scrollbar-drag {
  height: 100%;
  width: 100%;
  position: relative;
  background: rgba(0, 0, 0, 0.5);
  border-radius: 10px;
  left: 0;
  top: 0;
}

.swiper-scrollbar-cursor-drag {
  cursor: move;
}

.swiper-zoom-container {
  width: 100%;
  height: 100%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  text-align: center;
}

.swiper-zoom-container > img,
.swiper-zoom-container > svg,
.swiper-zoom-container > canvas {
  max-width: 100%;
  max-height: 100%;
  -o-object-fit: contain;
  object-fit: contain;
}

.swiper-slide-zoomed {
  cursor: move;
}

/* Preloader */
.swiper-lazy-preloader {
  width: 42px;
  height: 42px;
  position: absolute;
  left: 50%;
  top: 50%;
  margin-left: -21px;
  margin-top: -21px;
  z-index: 10;
  -webkit-transform-origin: 50%;
  -ms-transform-origin: 50%;
  transform-origin: 50%;
  -webkit-animation: swiper-preloader-spin 1s steps(12, end) infinite;
  animation: swiper-preloader-spin 1s steps(12, end) infinite;
}

.swiper-lazy-preloader:after {
  display: block;
  content: "";
  width: 100%;
  height: 100%;
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%20120%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20xmlns%3Axlink%3D'http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink'%3E%3Cdefs%3E%3Cline%20id%3D'l'%20x1%3D'60'%20x2%3D'60'%20y1%3D'7'%20y2%3D'27'%20stroke%3D'%236c6c6c'%20stroke-width%3D'11'%20stroke-linecap%3D'round'%2F%3E%3C%2Fdefs%3E%3Cg%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(30%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(60%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(90%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(120%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(150%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.37'%20transform%3D'rotate(180%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.46'%20transform%3D'rotate(210%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.56'%20transform%3D'rotate(240%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.66'%20transform%3D'rotate(270%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.75'%20transform%3D'rotate(300%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.85'%20transform%3D'rotate(330%2060%2C60)'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
  background-position: 50%;
  background-size: 100%;
  background-repeat: no-repeat;
}

.swiper-lazy-preloader-white:after {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%20120%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20xmlns%3Axlink%3D'http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink'%3E%3Cdefs%3E%3Cline%20id%3D'l'%20x1%3D'60'%20x2%3D'60'%20y1%3D'7'%20y2%3D'27'%20stroke%3D'%23fff'%20stroke-width%3D'11'%20stroke-linecap%3D'round'%2F%3E%3C%2Fdefs%3E%3Cg%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(30%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(60%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(90%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(120%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(150%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.37'%20transform%3D'rotate(180%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.46'%20transform%3D'rotate(210%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.56'%20transform%3D'rotate(240%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.66'%20transform%3D'rotate(270%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.75'%20transform%3D'rotate(300%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.85'%20transform%3D'rotate(330%2060%2C60)'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
}

@-webkit-keyframes swiper-preloader-spin {
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@keyframes swiper-preloader-spin {
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
/* a11y */
.swiper-container .swiper-notification {
  position: absolute;
  left: 0;
  top: 0;
  pointer-events: none;
  opacity: 0;
  z-index: -1000;
}

.swiper-container-fade.swiper-container-free-mode .swiper-slide {
  -webkit-transition-timing-function: ease-out;
  -o-transition-timing-function: ease-out;
  transition-timing-function: ease-out;
}

.swiper-container-fade .swiper-slide {
  pointer-events: none;
  -webkit-transition-property: opacity;
  -o-transition-property: opacity;
  transition-property: opacity;
}

.swiper-container-fade .swiper-slide .swiper-slide {
  pointer-events: none;
}

.swiper-container-fade .swiper-slide-active,
.swiper-container-fade .swiper-slide-active .swiper-slide-active {
  pointer-events: auto;
}

.swiper-container-cube {
  overflow: visible;
}

.swiper-container-cube .swiper-slide {
  pointer-events: none;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  z-index: 1;
  visibility: hidden;
  -webkit-transform-origin: 0 0;
  -ms-transform-origin: 0 0;
  transform-origin: 0 0;
  width: 100%;
  height: 100%;
}

.swiper-container-cube .swiper-slide .swiper-slide {
  pointer-events: none;
}

.swiper-container-cube.swiper-container-rtl .swiper-slide {
  -webkit-transform-origin: 100% 0;
  -ms-transform-origin: 100% 0;
  transform-origin: 100% 0;
}

.swiper-container-cube .swiper-slide-active,
.swiper-container-cube .swiper-slide-active .swiper-slide-active {
  pointer-events: auto;
}

.swiper-container-cube .swiper-slide-active,
.swiper-container-cube .swiper-slide-next,
.swiper-container-cube .swiper-slide-prev,
.swiper-container-cube .swiper-slide-next + .swiper-slide {
  pointer-events: auto;
  visibility: visible;
}

.swiper-container-cube .swiper-slide-shadow-top,
.swiper-container-cube .swiper-slide-shadow-bottom,
.swiper-container-cube .swiper-slide-shadow-left,
.swiper-container-cube .swiper-slide-shadow-right {
  z-index: 0;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

.swiper-container-cube .swiper-cube-shadow {
  position: absolute;
  left: 0;
  bottom: 0px;
  width: 100%;
  height: 100%;
  background: #000;
  opacity: 0.6;
  -webkit-filter: blur(50px);
  filter: blur(50px);
  z-index: 0;
}

.swiper-container-flip {
  overflow: visible;
}

.swiper-container-flip .swiper-slide {
  pointer-events: none;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  z-index: 1;
}

.swiper-container-flip .swiper-slide .swiper-slide {
  pointer-events: none;
}

.swiper-container-flip .swiper-slide-active,
.swiper-container-flip .swiper-slide-active .swiper-slide-active {
  pointer-events: auto;
}

.swiper-container-flip .swiper-slide-shadow-top,
.swiper-container-flip .swiper-slide-shadow-bottom,
.swiper-container-flip .swiper-slide-shadow-left,
.swiper-container-flip .swiper-slide-shadow-right {
  z-index: 0;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

.swiper-container-coverflow .swiper-wrapper {
  /* Windows 8 IE 10 fix */
  -ms-perspective: 1200px;
}

.swiper-container {
  height: 100%;
}

.swiper-button-prev,
.swiper-button-next {
  top: 50%;
  transform: translateY(-50%);
  color: #ffffff;
  background-image: none !important;
}
.swiper-button-prev:before,
.swiper-button-next:before {
  color: #ffffff;
  font-size: 30px;
  position: absolute;
  left: 0;
  right: 0;
  text-align: center;
}
.swiper-button-prev:hover,
.swiper-button-next:hover {
  background-color: #0375b4;
}
.swiper-button-prev.swiper-button-disabled,
.swiper-button-next.swiper-button-disabled {
  pointer-events: auto !important;
}

.swiper-button-next:before {
  margin-left: 4px;
  margin-right: 0 !important;
}

.swiper-pagination-bullets {
  position: static;
  margin-top: 10px;
}
.swiper-pagination-bullets .swiper-pagination-bullet {
  border: 1px solid #171b2d !important;
  border-radius: 0;
  width: 30px;
  background: #FFF !important;
}
.swiper-pagination-bullets .swiper-pagination-bullet.swiper-pagination-bullet-active {
  background: #f18825 !important;
}

/*############################################
 *## Modules
 *############################################*/
.adedit {
  position: absolute;
  right: 6px;
  top: 6px;
  border: 1px solid #0375b4;
}
.adedit input {
  width: 60px;
}

/*############################################
   *## SplitAd
   *############################################*/
#split-ad-left, #split-ad-center, #split-ad-right, #split-ad-claim-or-logo {
  display: none;
}
@media all and (min-width: 861px) {
  #split-ad-left, #split-ad-center, #split-ad-right, #split-ad-claim-or-logo {
    display: block;
  }
}

#splitad .ad-mark {
  position: absolute;
  right: 0;
  bottom: 0;
}
#splitad #split-ad-left {
  position: fixed;
  z-index: -6;
  left: 0;
  top: 74px;
  width: 320px;
  height: 100%;
}
#splitad #split-ad-left .image-container {
  width: 100%;
  height: 100%;
  background-size: cover;
}
@media (min-width: 1751px) {
  #splitad #split-ad-left {
    width: 25%;
  }
}
#splitad #split-ad-claim-or-logo {
  width: 180px;
  height: 170px;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  position: fixed;
  right: 20px;
}
@media all and (min-width: 1401px) {
  #splitad #split-ad-claim-or-logo {
    width: 300px;
  }
}
@media all and (min-width: 1751px) {
  #splitad #split-ad-claim-or-logo {
    right: 50px;
  }
}
#splitad #split-ad-right {
  position: fixed;
  z-index: -6;
  right: 0;
  top: 74px;
  width: 644px;
  height: 100%;
}
#splitad #split-ad-right .image-container {
  width: 100%;
  height: 100%;
  background-size: cover;
  background-position: center center;
}
@media (min-width: 1751px) {
  #splitad #split-ad-right {
    width: 950px;
  }
}

/*############################################
 *## Main styles
 *############################################*/
#contrast-block-carousel-ads {
  /*############################################
   *## Neues HTML Markup
   *############################################*/
  /*############################################
   *## Altes HTML Markup
   *############################################*/
}
#contrast-block-carousel-ads .ads-indicator {
  font-size: 0.64rem;
  color: #ffffff;
  width: 44px;
  text-align: center;
  position: absolute;
  right: 50px;
  top: 35px;
}
#contrast-block-carousel-ads .contrast-block-overlapping-lower {
  top: -92px;
}
#contrast-block-carousel-ads .card {
  width: 240px;
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: flex;
  -webkit-flex-direction: column;
  -webkit-box-orient: vertical; /* Safari <= 6*/
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  -o-flex-direction: column;
  flex-direction: column;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: nowrap;
  -webkit-flex-wrap: nowrap;
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  background-color: #ffffff;
  border: 1px solid #ccc;
}
#contrast-block-carousel-ads .card .card-headline-upper {
  display: none;
}
#contrast-block-carousel-ads .card .card-headline-upper a {
  color: #171b2d;
  line-height: 1.5;
  display: block;
  width: 100%;
  text-align: center;
}
#contrast-block-carousel-ads .card .image-container {
  width: 100%;
  height: 94px;
  background-size: contain;
  background-repeat: no-repeat;
}
#contrast-block-carousel-ads .card .card-headline-lower {
  color: #0375b4;
  font-weight: bold;
  padding: 10px;
}
#contrast-block-carousel-ads .card .card-text {
  padding: 0 10px 10px 10px;
  color: #171b2d;
}
#contrast-block-carousel-ads .card .card-cta {
  text-transform: uppercase;
  padding: 10px 0;
  margin: 0 10px;
  border-top: 1px solid #ccc;
  color: #f18825;
}
#contrast-block-carousel-ads .card.legacy {
  width: 200px;
}
#contrast-block-carousel-ads .card.legacy .carousel-ref {
  width: 100%;
}
#contrast-block-carousel-ads .card.legacy .headline {
  color: #0375b4;
  font-weight: bold;
  padding: 10px;
}
#contrast-block-carousel-ads .card.legacy .text {
  padding: 0 10px 10px 10px;
  color: #171b2d;
}

/*############################################
 *## Integration on index page
 *############################################*/
.index #contrast-block-carousel-ads {
  grid-row: content-row4-start/content-row4-end;
  grid-column: content-col1-start/content-col12-end;
  margin-bottom: 30px;
}

/*############################################
 *## Integration in blog article
 *############################################*/
.c_blogarticle #contrast-block-carousel-ads {
  padding-top: 30px;
}

/*############################################
 *## Integration in tile lists
 *############################################*/
.tile-list #contrast-block-carousel-ads {
  /*############################################
   *## Two tiles per row on smaller screens
   *############################################*/
  /*############################################
   *## Three tiles per row => Hide as we AdBlock
   *## is included after the 4th list item (not devidable by 3!)
   *############################################*/
}
@media all and (max-width: 681px) {
  .tile-list #contrast-block-carousel-ads {
    grid-column-start: 1;
    grid-column-end: 3;
    position: relative;
    width: calc(100% + 10px);
    left: -10px;
    border-left: none;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    width: calc(100% + 20px);
  }
}
@media all and (min-width: 681px) {
  .tile-list #contrast-block-carousel-ads {
    display: none;
  }
}

/*############################################
 *## Integration in BlogArticleOverview
 *############################################*/
.overview-list #contrast-block-carousel-ads {
  grid-column-start: 1;
  grid-column-end: 3;
  position: relative;
  width: calc(100% + 40px);
  left: -20px;
}
@media all and (min-width: 681px) {
  .overview-list #contrast-block-carousel-ads {
    display: none;
  }
}

/*############################################
 *## Embedded in RegionWeather module (in exchange with ResponsiveHDBanner)
 *############################################*/
@media all and (min-width: 1151px) {
  #region-weather-container #contrast-block-carousel-ads {
    display: none;
  }
}

/*############################################
 *## Embedded in ECUText
 *############################################*/
.ecu-text .divider-teaser-small {
  clear: both !important;
}
.ecu-text #contrast-block-carousel-ads {
  clear: both;
  margin-top: 20px;
  position: relative;
  left: -10px;
  width: calc(100% + 2 * 10px);
}
@media all and (min-width: 1401px) {
  .ecu-text #contrast-block-carousel-ads {
    position: relative;
    left: -24px;
    width: calc(100% + 2 * 24px);
  }
  .ecu-text.blogarticle #contrast-block-carousel-ads {
    position: relative;
    left: -33px;
    width: calc(100% + 2 * 33px);
  }
}

.index #blog-article-overview .content-ref {
  border-bottom: 1px #ccc solid;
  margin-bottom: 20px;
}
@media all and (min-width: 681px) {
  .index #blog-article-overview .content-ref, .index #blog-article-overview .divider-teaser-small {
    display: none;
  }
}

#blog-article-overview .divider-teaser-small {
  margin: 10px 0 30px !important;
}
@media all and (max-width: 861px) {
  #blog-article-overview .divider-teaser-small {
    margin: -20px 0 30px !important;
    border-top: none !important;
  }
}

@media all and (min-width: 861px) {
  .hide-on-desktop {
    display: none !important;
  }
}

.content-ref, .video-ref {
  width: 100%;
  min-height: 250px;
  /*############################################
   *## Regular ContentAd
   *############################################*/
  /*############################################
   *## VideoAd style ContentAd
   *############################################*/
}
.content-ref .ad-block, .video-ref .ad-block {
  position: relative;
  border: 1px solid #ccc;
  max-width: 300px;
  margin: 0 auto 20px auto;
}
.content-ref .title + a .image-container, .video-ref .title + a .image-container {
  background-color: #ccc;
  background-size: 100%;
  width: 100%;
  position: relative;
  padding-top: 39.597315%;
  background-repeat: no-repeat;
}
.content-ref .title + .video, .video-ref .title + .video {
  position: relative;
}
.content-ref .title + .video .lazy-loading-iframe-container, .video-ref .title + .video .lazy-loading-iframe-container {
  width: 100%;
  height: 0;
  position: relative;
  padding-top: 56.25%;
}
.content-ref .title + .video iframe, .video-ref .title + .video iframe {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  background-color: #ccc;
  background-size: 100%;
  background-repeat: no-repeat;
}
.content-ref .title + .video .video-play-button, .video-ref .title + .video .video-play-button {
  position: absolute;
  width: 80px;
  height: 60px;
  margin-left: -40px;
  margin-top: -30px;
  left: 50%;
  top: 50%;
  background-color: #ff0000;
  border-radius: 10px;
  cursor: pointer;
  z-index: 1;
}
.content-ref .title + .video .video-play-button:before, .video-ref .title + .video .video-play-button:before {
  font-size: 1.3rem;
  color: white;
  width: 100%;
  text-align: center;
}
.content-ref .title, .content-ref .headline, .video-ref .title, .video-ref .headline {
  color: #0375b4;
  font-weight: bold;
  padding: 10px;
}
.content-ref .text, .video-ref .text {
  padding: 0 10px;
  min-height: 58px;
  width: 100%;
  font-size: 0.84rem;
}
.content-ref .bottom-content, .video-ref .bottom-content {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: stretch;
  -moz-box-align: stretch;
  -ms-flex-align: stretch;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
  font-weight: 700;
  padding: 14px 0;
  margin: 10px 10px 0 10px;
  border-top: 1px solid #ccc;
}
.content-ref .read-more, .video-ref .read-more {
  white-space: nowrap;
}
.content-ref .read-more:before, .video-ref .read-more:before {
  margin-right: 6px;
  position: relative;
  top: -1px;
}
.content-ref .ad-mark, .video-ref .ad-mark {
  position: absolute;
  bottom: -18px;
  right: 0;
  padding: 2px 0;
}

#content-refs-aside {
  background-color: #ffffff;
  border-top: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
  padding: 10px;
  /*############################################
   *## Aside column too narrow on tablets => hide
   *############################################*/
}
#content-refs-aside > .element-actions {
  padding-top: 10px;
}
#content-refs-aside .swiper-button-prev, #content-refs-aside .swiper-button-next {
  top: 28%;
}
@media all and (min-width: 861px) and (max-width: 1024px) {
  #content-refs-aside {
    display: none;
  }
}

.list-ref {
  border: 1px solid #ccc;
}
.list-ref ins {
  display: block;
  height: 100%;
}
.list-ref ins .list-tip {
  height: 100%;
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: flex;
  -webkit-flex-direction: column;
  -webkit-box-orient: vertical; /* Safari <= 6*/
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  -o-flex-direction: column;
  flex-direction: column;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: nowrap;
  -webkit-flex-wrap: nowrap;
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
}
.list-ref ins .list-tip .item-image-container {
  height: 200px;
}
.list-ref ins .list-tip .item-name {
  height: 60px;
  word-break: break-word;
}
.list-ref ins .list-tip .item-teaser {
  flex-grow: 1;
  -webkit-flex-grow: 1;
  -moz-flex-grow: 1;
  -ms-flex-grow: 1;
  -o-flex-grow: 1;
}
.list-ref ins .list-tip .link {
  height: 34px;
  color: #f18825;
}
.list-ref ins .list-tip .link:before {
  margin-right: 6px;
}

.livebanner-container {
  position: relative;
  max-width: 350px;
  background-color: white;
  overflow: hidden;
}
.livebanner-container .webcam-container {
  background-size: cover;
  background-repeat: repeat-x;
  height: 400px;
  position: relative;
  top: 0;
  left: 0;
  right: 0;
}
.livebanner-container .image-container-logo {
  position: absolute;
  top: 10px;
  left: 10px;
  background-size: cover;
}
.livebanner-container .live-text {
  position: absolute !important;
  right: 10px;
  top: 10px;
  color: white;
  font-weight: 700;
}
.livebanner-container .live-text:before {
  content: "";
  height: 10px;
  width: 10px;
  background: red;
  display: inline-block;
  border-radius: 5px;
  -webkit-animation: pulsate 2s ease 0s infinite;
  -moz-animation: pulsate 2s ease 0s infinite;
  -ms-animation: pulsate 2s ease 0s infinite;
  -o-animation: pulsate 2s ease 0s infinite;
  animation: pulsate 2s ease 0s infinite;
}
.livebanner-container .offer-container {
  padding: 10px 10px 45px 10px;
}
.livebanner-container .offer-container .title {
  font-weight: 700;
  margin-bottom: 10px;
}
.livebanner-container .offer-container .text {
  font-size: 0.84rem;
  position: relative !important;
}
.livebanner-container .offer-container .read-more {
  background-color: #0375b4;
  color: white;
  display: inline-block;
  padding: 6px;
  position: absolute;
  bottom: 24px;
  right: 10px;
}
.livebanner-container .entity-title {
  position: absolute;
  right: 0;
  top: 330px;
  background-color: #0375b4;
  padding: 10px;
  font-size: 1.15rem;
  color: white;
}
.livebanner-container .ad-mark {
  background-color: #ffffff;
  padding: 6px 10px 6px 0;
}
.livebanner-container .snowreport {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: distribute;
  -moz-box-pack: distribute;
  -ms-flex-pack: distribute;
  -webkit-box-align: stretch;
  -moz-box-align: stretch;
  -ms-flex-align: stretch;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: space-around;
  -moz-justify-content: space-around;
  -o-justify-content: space-around;
  -ms-justify-content: space-around;
  justify-content: space-around;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
  overflow: hidden;
  margin-bottom: 20px;
}
.livebanner-container .snowreport > div {
  min-width: 0;
  flex-basis: 0;
  flex-shrink: 1;
  -webkit-flex-shrink: 1;
  -moz-flex-shrink: 1;
  -ms-flex-shrink: 1;
  -o-flex-shrink: 1;
  flex-grow: 1;
  -webkit-flex-grow: 1;
  -moz-flex-grow: 1;
  -ms-flex-grow: 1;
  -o-flex-grow: 1;
}
.livebanner-container .weather-box {
  margin-bottom: 5px;
  position: relative;
  float: left;
  padding: 5px 0;
  width: 25%;
  line-height: 1.2em;
}
.livebanner-container .weather-box div {
  width: 100%;
}
.livebanner-container .weather-box .weekday, .livebanner-container .weather-box .temperature {
  text-align: center;
  font-size: 0.9rem;
}
.livebanner-container .weather-box .weekday {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.livebanner-container .weather-box .unit {
  cursor: default;
  color: #31394a;
}
.livebanner-container .weather-box .icon {
  height: 23px;
}
.livebanner-container .weather-box .icon::before {
  position: absolute !important;
  left: 50%;
  margin-left: -11px;
}

/*############################################
 *## Embedded in aside section
 *############################################*/
.c_blogarticle.logged-in .fiad-container {
  margin-top: 62px !important;
}

.fiad-container {
  margin: 20px auto 0 auto;
}
@media all and (min-width: 861px) and (max-width: 1024px) {
  .fiad-container {
    display: none;
  }
}

.fiad {
  background-color: #ffffff;
  -moz-hyphens: auto;
  -o-hyphens: auto;
  -webkit-hyphens: auto;
  -ms-hyphens: auto;
  hyphens: auto;
  max-width: 300px;
  overflow: hidden;
  border: 1px solid #ccc;
  /*############################################
   *##
   *## tab1a: snowreport
   *##
   *############################################*/
  /*############################################
   *##
   *## tab1b: summer
   *##
   *############################################*/
  /*############################################
   *##
   *## tab2:wetter
   *##
   *############################################*/
  /*############################################
   *##
   *## video
   *##
   *############################################*/
  /*############################################
   *##
   *## webcam
   *##
   *############################################*/
  /*############################################
   *##
   *## tab5: angebot
   *##
   *############################################*/
}
.fiad span[data-target-url] {
  color: #0375b4;
  cursor: pointer;
}
.fiad .image-container {
  position: relative;
  width: 100%;
  height: auto;
  padding-bottom: 39.94845%;
  background-size: 100%;
  background-repeat: no-repeat;
}
.fiad .navigation-tabnavigation-tabs {
  padding: 0 10px;
}
.fiad .navigation-tabnavigation-tabs ul {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: stretch;
  -moz-box-align: stretch;
  -ms-flex-align: stretch;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
}
.fiad .navigation-tabnavigation-tabs li {
  margin: 0;
  font-size: 0.9rem;
  line-height: 1.8rem;
  padding: 0;
  border-top: none;
  border-left: none !important;
  border-right: none;
  top: 0;
  background: none;
  border-bottom: 2px solid transparent;
}
.fiad .navigation-tabnavigation-tabs li.active {
  border-bottom: 2px solid #0375b4;
}
.fiad .navigation-tabnavigation-contenttab {
  padding: 0;
  border-bottom: 0;
  overflow: hidden;
  height: 100% !important;
}
.fiad .navigation-tabnavigation-contenttab.inactive-contenttab {
  height: 100% !important;
}
.fiad .detailed-link {
  padding: 10px;
  font-size: 0.9rem;
  -webkit-align-items: flex-start;
  -moz-align-items: flex-start;
  -ms-align-items: flex-start;
  -o-align-items: flex-start;
  align-items: flex-start;
  line-height: 1.2;
}
.fiad .detailed-link:before {
  margin-right: 10px;
}
.fiad .video-play-button {
  position: absolute;
  width: 80px;
  height: 60px;
  margin-left: -40px;
  margin-top: -30px;
  left: 50%;
  top: 50%;
  background-color: #ff0000;
  border-radius: 10px;
  cursor: pointer;
  z-index: 1;
}
.fiad .video-play-button:before {
  font-size: 1.3rem;
  color: white;
  width: 100%;
  text-align: center;
}
.fiad .snow .snowreport {
  width: 100%;
  height: 82px;
  position: relative;
  overflow: hidden;
  padding: 10px;
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: distribute;
  -moz-box-pack: distribute;
  -ms-flex-pack: distribute;
  -webkit-box-align: stretch;
  -moz-box-align: stretch;
  -ms-flex-align: stretch;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: space-around;
  -moz-justify-content: space-around;
  -o-justify-content: space-around;
  -ms-justify-content: space-around;
  justify-content: space-around;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
}
.fiad .snow .snowreport .snowindicator + .snowindicator {
  display: none;
}
.fiad .snow .snowreport .lifts > div {
  margin: 0 auto;
}
.fiad .snow .snowreport .lifts .pie-container .pie-background {
  background-color: #a3361d;
}
.fiad .snow .snowreport .lifts .pie-container .pie {
  background-color: #42910e;
}
.fiad .snow .snowreport .lifts .pie-container .value .small {
  line-height: 10px !important;
}
.fiad .snow .snowreport .snowindicator, .fiad .snow .snowreport .weatherindicator, .fiad .snow .snowreport .powder-forecast {
  height: 60px;
  text-align: center;
}
.fiad .snow .snowreport .snowindicator:hover, .fiad .snow .snowreport .weatherindicator:hover, .fiad .snow .snowreport .powder-forecast:hover {
  text-decoration: none;
}
.fiad .weather .forecast {
  padding: 10px;
}
.fiad .weather .forecast .weather-box {
  position: relative;
  float: left;
  padding: 6px 0;
  width: 25%;
  line-height: 1.2em;
}
.fiad .weather .forecast .weather-box div {
  width: 100%;
}
.fiad .weather .forecast .weather-box .weekday, .fiad .weather .forecast .weather-box .temperature {
  text-align: center;
  font-size: 0.9rem;
}
.fiad .weather .forecast .weather-box .weekday {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.fiad .weather .forecast .weather-box .unit {
  cursor: default;
  color: #31394a;
}
.fiad .weather .forecast .weather-box .icon:before {
  margin: 0 auto;
  width: 40px;
  height: 40px;
}
.fiad .video {
  padding-bottom: 56.25%;
  width: 100%;
  position: relative;
}
.fiad .video .lazy-loading-iframe-container {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}
.fiad .webcam {
  position: relative;
  width: 100%;
  padding-bottom: 56.25%;
}
.fiad .webcam > div {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}
.fiad .webcam .disruptor {
  text-align: center;
  width: 100%;
  line-height: 1.8em;
  position: absolute !important;
  bottom: 0;
  background: rgba(255, 255, 255, 0.8);
  border-bottom: 1px solid #ccc;
}
.fiad .webcam iframe {
  height: 100%;
  width: 100%;
}
.fiad .webcam .webcam-image {
  width: 100%;
  height: 100%;
  background-size: cover;
  background-position: center;
}
.fiad .offer .title {
  padding: 10px;
  width: 100%;
  background: rgba(255, 255, 255, 0.85);
}
.fiad .offer .text {
  padding: 0 8px;
  font-size: 0.84rem;
}
.fiad .offer .read-more, .fiad .offer > a:last-child {
  padding: 0 10px;
  text-align: right;
  bottom: 0;
  right: 0;
  font-weight: 600;
  font-size: 0.9rem;
}

.index #mobile-lead-banner {
  grid-row: breadcrumb-row/content-row1-start;
  grid-column: content-col1-start/content-col12-end;
  margin-bottom: 30px;
}

#mobile-lead-banner {
  width: 100%;
  display: block;
  padding-bottom: 46.86%;
  position: relative;
  overflow: hidden;
}
#mobile-lead-banner .image-container, #mobile-lead-banner .div-image, #mobile-lead-banner ins {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100% !important;
  background-size: contain;
  margin: 0 auto;
}
@media all and (min-width: 681px) {
  #mobile-lead-banner {
    display: none;
  }
}

#responsiveHDBanners {
  display: none;
}
@media all and (min-width: 481px) {
  #responsiveHDBanners {
    display: block;
    width: 100%;
    display: block;
    padding-bottom: 32.5%;
    position: relative;
    overflow: hidden;
  }
  #responsiveHDBanners .image-container, #responsiveHDBanners .div-image, #responsiveHDBanners ins {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100% !important;
    background-size: contain;
    margin: 0 auto;
  }
  #responsiveHDBanners .responsiveHDBanners {
    height: 100%;
  }
  #responsiveHDBanners .ad-mark {
    position: absolute;
    bottom: 0;
    right: 0;
    background-color: rgba(255, 255, 255, 0.8);
    padding: 2px 6px;
    border-radius: 6px 0 0 0;
  }
}

#responsiveHDBannersMobile {
  width: 100%;
  display: block;
  padding-bottom: 46.8%;
  position: relative;
  overflow: hidden;
}
#responsiveHDBannersMobile .image-container, #responsiveHDBannersMobile .div-image, #responsiveHDBannersMobile ins {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100% !important;
  background-size: contain;
  margin: 0 auto;
}
#responsiveHDBannersMobile .responsive-hd-banner-mobile {
  height: 100%;
}
#responsiveHDBannersMobile .responsive-hd-banner-mobile .image-container {
  background-repeat: no-repeat;
}
#responsiveHDBannersMobile .ad-mark {
  position: absolute;
  bottom: 0;
  right: 0;
  background-color: rgba(255, 255, 255, 0.8);
  padding: 2px 6px;
  border-radius: 6px 0 0 0;
}
@media all and (min-width: 681px) {
  #responsiveHDBannersMobile {
    display: none;
  }
}

/*############################################
 *## Default placement is to show upon any content
 *############################################*/
.header-responsive-hd-banner, .header-responsive-hd-banner-mobile {
  grid-row: ads-row/headline-row;
  grid-column: content-col1-start/content-col12-end;
  border-top: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
  background-color: #f1f1f1;
}
.header-responsive-hd-banner .responsive-hd-banner, .header-responsive-hd-banner-mobile .responsive-hd-banner {
  border-top: 10px #f1f1f1 solid;
  border-bottom: 10px #f1f1f1 solid;
}

@media all and (min-width: 481px) {
  .header-responsive-hd-banner-mobile {
    display: none;
  }
}

.header-responsive-hd-banner {
  display: none;
  padding-bottom: 35.9% !important;
}
.header-responsive-hd-banner .ad-mark {
  bottom: 10px !important;
}
@media all and (min-width: 481px) {
  .header-responsive-hd-banner {
    display: block;
  }
}
@media all and (min-width: 861px) {
  .header-responsive-hd-banner {
    width: calc(100% + 10px) !important;
    padding-bottom: 35.9% !important;
  }
}
@media all and (min-width: 1025px) {
  .header-responsive-hd-banner {
    padding-bottom: 35.5% !important;
  }
}
@media all and (min-width: 1151px) {
  .header-responsive-hd-banner {
    padding-bottom: 35.1% !important;
  }
}
@media all and (min-width: 1301px) {
  .header-responsive-hd-banner {
    padding-bottom: 34.9% !important;
  }
}
@media all and (min-width: 1401px) {
  .header-responsive-hd-banner {
    padding-bottom: 35.2% !important;
    position: relative;
    left: -10px;
    width: calc(100% + 2 * 10px);
    width: calc(100% + 20px) !important;
  }
}

/*############################################
 *## On Index page
 *############################################*/
.index #responsiveHDBanners, .index #responsiveHDBannersMobile {
  grid-row: breadcrumb-row/content-row1-start;
  grid-column: content-col1-start/content-col12-end;
  margin-bottom: 30px;
}
@media all and (min-width: 861px) {
  .index #responsiveHDBanners, .index #responsiveHDBannersMobile {
    display: none;
  }
}

/*############################################
 *## In Tile lists
 *############################################*/
.tile-list #responsiveHDBanners {
  grid-column-start: 1;
  grid-column-end: 3;
}
@media all and (min-width: 681px) {
  .tile-list #responsiveHDBanners {
    grid-column-start: 1;
    grid-column-end: 4;
  }
}
@media all and (min-width: 1151px) {
  .tile-list #responsiveHDBanners {
    grid-column-start: 1;
    grid-column-end: 5;
  }
}

.overview-list #responsiveHDBanners {
  display: none;
}
@media all and (min-width: 681px) {
  .overview-list #responsiveHDBanners {
    border-top: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
    margin-top: 10px;
    margin-bottom: 30px;
    display: block;
  }
}

/*############################################
 *## Embedded in RegionWeather module (in exchange with ContrastBlock)
 *############################################*/
#region-weather-container #responsiveHDBanners {
  display: none;
}
@media all and (min-width: 1151px) {
  #region-weather-container #responsiveHDBanners {
    display: block;
    margin-bottom: 14px;
  }
}

#halfpage {
  height: 600px;
  width: 300px;
  margin: 0 auto;
}
#halfpage .image-container {
  height: 100%;
  width: 100%;
  background-size: 100% 100%;
  background-repeat: no-repeat;
}
@media all and (min-width: 861px) {
  #halfpage {
    display: none;
  }
}
@media all and (min-width: 1025px) {
  #halfpage {
    display: block;
  }
}

.index #halfpage {
  margin-top: 10px !important;
}

/*############################################
 *## Positioning of DividerTeaser on  different page types
 *############################################*/
.contentmain.c_blogarticle #divider-teaser {
  grid-row: content-row5-start/content-row5-end;
  grid-column: content-col1-start/content-col12-end;
}

.entitymain #divider-teaser, .productmain #divider-teaser {
  grid-row: content-row10-start/content-row10-end;
  grid-column: content-col1-start/content-col12-end;
}

.aggregatorentity.c_snowreport #divider-teaser {
  grid-row: content-row5-start/content-row5-end;
  grid-column: content-col1-start/content-col12-end;
}

.aggregatorentity.c_webcam #divider-teaser, .aggregatorentity.c_bookingoffer #divider-teaser {
  margin: 20px 0;
  grid-row: content-row14-start/content-row14-end;
  grid-column: content-col1-start/content-col12-end;
}

.aggregatorentity.c_weather #divider-teaser {
  margin: 20px 0;
  grid-row: content-row4-start/content-row4-end;
  grid-column: content-col1-start/content-col12-end;
}

.common.index #divider-teaser {
  margin: 0px 0 30px;
  grid-row: content-row2-start/content-row2-end;
  grid-column: content-col1-start/content-col12-end;
}

/*############################################
 *## Module styles
 *############################################*/
#header-teaser {
  grid-row: ads-row/headline-row;
  grid-column: content-col1-start/content-col12-end;
  background-color: #f1f1f1;
}
@media all and (min-width: 861px) {
  #header-teaser {
    width: calc(100% + 10px);
  }
}
@media all and (min-width: 1401px) {
  #header-teaser {
    position: relative;
    width: calc(100% + 10px);
    left: -10px;
    border-left: none;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    position: relative;
    width: calc(100% + 20px);
  }
}

#divider-teaser {
  margin: 20px 0 20px 10px;
  width: calc(100% - 20px);
}
@media all and (min-width: 861px) {
  #divider-teaser {
    width: calc(100% - 10px);
  }
}
@media all and (min-width: 1401px) {
  #divider-teaser {
    margin-left: 0;
    width: 100%;
  }
}

#header-teaser, #divider-teaser, #ecu-text-teaser {
  min-height: 132px;
  border-top: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
  position: relative;
  padding: 10px;
}
#header-teaser ins, #divider-teaser ins, #ecu-text-teaser ins {
  height: 100%;
  min-width: 0;
  flex-basis: 0;
  flex-shrink: 1;
  -webkit-flex-shrink: 1;
  -moz-flex-shrink: 1;
  -ms-flex-shrink: 1;
  -o-flex-shrink: 1;
  flex-grow: 1;
  -webkit-flex-grow: 1;
  -moz-flex-grow: 1;
  -ms-flex-grow: 1;
  -o-flex-grow: 1;
}
#header-teaser ins .list-tip-mobile, #divider-teaser ins .list-tip-mobile, #ecu-text-teaser ins .list-tip-mobile {
  height: 100%;
}
#header-teaser ins .list-tip-mobile a, #divider-teaser ins .list-tip-mobile a, #ecu-text-teaser ins .list-tip-mobile a {
  height: 100%;
  display: grid;
  grid-template-columns: 95px auto;
  grid-column-gap: 10px;
}
#header-teaser ins .list-tip-mobile a .tip, #divider-teaser ins .list-tip-mobile a .tip, #ecu-text-teaser ins .list-tip-mobile a .tip {
  border-radius: 25px;
  z-index: 1;
  color: white;
  position: absolute !important;
  top: -4px;
  text-align: center;
  line-height: 34px;
  width: 34px;
  height: 34px;
  background-color: #f18825;
  font-size: 0.74rem;
  left: -10px;
}
#header-teaser ins .list-tip-mobile a .item-name, #divider-teaser ins .list-tip-mobile a .item-name, #ecu-text-teaser ins .list-tip-mobile a .item-name {
  font-weight: 700;
  grid-column-start: 2;
  grid-column-end: 3;
  grid-row-start: 1;
  grid-row-end: 2;
  padding-bottom: 6px;
}
#header-teaser ins .list-tip-mobile a .image-container, #divider-teaser ins .list-tip-mobile a .image-container, #ecu-text-teaser ins .list-tip-mobile a .image-container {
  height: 95px;
  width: 95px;
  grid-column-start: 1;
  grid-column-end: 2;
  grid-row-start: 1;
  grid-row-end: 3;
}
#header-teaser ins .list-tip-mobile a .item-teaser, #divider-teaser ins .list-tip-mobile a .item-teaser, #ecu-text-teaser ins .list-tip-mobile a .item-teaser {
  padding-bottom: 20px;
  color: #727272;
  font-size: 0.84rem;
  height: 100%;
  position: relative;
  -moz-hyphens: auto;
  -o-hyphens: auto;
  -webkit-hyphens: auto;
  -ms-hyphens: auto;
  hyphens: auto;
}
#header-teaser ins .list-tip-mobile a .item-teaser b, #divider-teaser ins .list-tip-mobile a .item-teaser b, #ecu-text-teaser ins .list-tip-mobile a .item-teaser b {
  position: absolute;
  bottom: 0;
  display: block;
  color: #f18825;
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: start;
  -moz-box-pack: start;
  -ms-flex-pack: start;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: center;
  -moz-align-items: center;
  -ms-align-items: center;
  -o-align-items: center;
  align-items: center;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: flex-start;
  -moz-justify-content: flex-start;
  -o-justify-content: flex-start;
  -ms-justify-content: flex-start;
  justify-content: flex-start;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
  padding-top: 6px;
}
#header-teaser ins .list-tip-mobile a .item-teaser b:before, #divider-teaser ins .list-tip-mobile a .item-teaser b:before, #ecu-text-teaser ins .list-tip-mobile a .item-teaser b:before {
  content: "\f101";
  margin-right: 6px;
  font-family: TourispoWebfonts !important;
  font-weight: 400;
  font-style: normal;
  display: inline-block;
}
#header-teaser ins .list-tip-mobile a:hover .item-teaser, #divider-teaser ins .list-tip-mobile a:hover .item-teaser, #ecu-text-teaser ins .list-tip-mobile a:hover .item-teaser {
  color: #0375b4;
}
#header-teaser ins + ins, #divider-teaser ins + ins, #ecu-text-teaser ins + ins {
  display: none;
}
#header-teaser .ad-mark, #divider-teaser .ad-mark, #ecu-text-teaser .ad-mark {
  position: absolute;
  right: 10px;
  bottom: 10px;
}
@media all and (min-width: 381px) {
  #header-teaser, #divider-teaser, #ecu-text-teaser {
    min-height: 117px;
  }
}
@media all and (min-width: 681px) and (max-width: 860px) {
  #header-teaser, #divider-teaser, #ecu-text-teaser {
    display: grid;
    grid-gap: 10px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  #header-teaser ins + ins, #divider-teaser ins + ins, #ecu-text-teaser ins + ins {
    display: block;
  }
}
@media all and (min-width: 1025px) {
  #header-teaser, #divider-teaser, #ecu-text-teaser {
    display: grid;
    grid-gap: 10px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  #header-teaser ins + ins, #divider-teaser ins + ins, #ecu-text-teaser ins + ins {
    display: block;
  }
  #header-teaser ins .list-tip-mobile a, #divider-teaser ins .list-tip-mobile a, #ecu-text-teaser ins .list-tip-mobile a {
    grid-template-rows: 24px auto;
  }
}

#skyscraper {
  display: none;
  height: 600px;
  width: 120px;
  margin: 0 auto;
}
#skyscraper .image-container {
  height: 100%;
  width: 100%;
  background-size: 100% 100%;
  background-repeat: no-repeat;
}
@media all and (min-width: 861px) {
  #skyscraper {
    display: block;
  }
}
@media all and (min-width: 1025px) {
  #skyscraper {
    display: none;
  }
}

.index #skyscraper {
  margin-top: 10px !important;
}

.c_blogarticle.logged-in #skyscraper {
  margin-top: 82px !important;
}

#related-blogarticle-entries {
  clear: both;
  padding-top: 30px;
  position: relative;
  left: -10px;
  width: calc(100% + 20px);
}
#related-blogarticle-entries .tile-list .tile:last-child {
  display: none;
}
@media all and (min-width: 381px) {
  #related-blogarticle-entries .tile-list .tile:last-child {
    display: block;
  }
}

/*############################################
 *## Editierfunktion für RelatedBlogArticles
 *############################################*/
#related-blogarticle-entries-assignment .headlines {
  margin-bottom: 14px;
}

.ecucreation .scaleChooser .radio-element {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: start;
  -moz-box-pack: start;
  -ms-flex-pack: start;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: center;
  -moz-align-items: center;
  -ms-align-items: center;
  -o-align-items: center;
  align-items: center;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: flex-start;
  -moz-justify-content: flex-start;
  -o-justify-content: flex-start;
  -ms-justify-content: flex-start;
  justify-content: flex-start;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
  padding-top: 10px;
}
.ecucreation .scaleChooser .scale-chosser-block {
  margin-top: 20px;
}
.ecucreation .subtype-checkbox {
  padding-bottom: 6px;
}
.ecucreation .ecuTypeDependent-fields + .feedback-message {
  display: none;
  width: 100%;
}
.ecucreation #ecu-creation-data-entry button.primary {
  margin-top: 20px;
}

/*############################################
 *## On PersonalECUCreation page
 *############################################*/
.personalecucreation .ecucreation {
  grid-row: content-row1-start/content-row2-start;
  grid-column: content-col1-start/content-col12-end;
}

.content-edit-form {
  width: 100%;
  box-sizing: border-box;
  max-width: 600px;
  height: 100%;
  overflow: scroll;
}
.content-edit-form #content-facts-edit {
  width: 100%;
  height: 100%;
}
.content-edit-form #content-facts-edit .headlines.primary {
  margin-top: 30px;
}
.content-edit-form #content-facts-edit .form-element, .content-edit-form #content-facts-edit .dropdown {
  margin-bottom: 20px;
}
@media all and (min-width: 681px) {
  .content-edit-form #content-facts-edit.c_snowreport .larger-screens-grid2 {
    display: grid;
    grid-gap: 10px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin-bottom: 20px;
  }
  .content-edit-form #content-facts-edit .form-element {
    margin-bottom: 0;
  }
}

#ecu-edit .statistics, #ecu-edit .publish {
  font-size: 0.9rem;
}
#ecu-edit .dialog-launcher {
  display: none;
}
#ecu-edit .edit-functionality {
  margin-top: 30px;
  flex-grow: 1;
  -webkit-flex-grow: 1;
  -moz-flex-grow: 1;
  -ms-flex-grow: 1;
  -o-flex-grow: 1;
  display: grid;
  grid-gap: 10px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-template-rows: 40px 40px 40px;
}
#ecu-edit .edit-functionality button, #ecu-edit .edit-functionality label:not(.checkbox-label), #ecu-edit .edit-functionality .button {
  height: 40px;
  width: 100%;
}
#ecu-edit .edit-functionality .editable-languages .button:before {
  background-size: 22px auto;
  height: 22px;
  width: 22px;
  border-top: 9px #171b2d solid;
  border-bottom: 9px #171b2d solid;
  box-sizing: content-box;
}
#ecu-edit .edit-functionality .editable-languages .button.icons-lang-en:before {
  background-position: 0 -125px !important;
}
#ecu-edit .edit-functionality .edit-buttons-form {
  display: grid;
  grid-gap: 10px;
  grid-template-columns: repeat(1, minmax(0, 1fr));
}
#ecu-edit .save-buttons {
  position: fixed;
  bottom: 6px;
  left: 6px;
  right: 6px;
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: center;
  -moz-align-items: center;
  -ms-align-items: center;
  -o-align-items: center;
  align-items: center;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
  visibility: visible;
}
#ecu-edit .save-buttons .is-active-checkbox {
  margin-right: 10px;
}
#ecu-edit .save-buttons button + button {
  margin-left: 10px;
}
#ecu-edit .change-owner, #ecu-edit .translate {
  z-index: 10;
  background-color: #ffffff;
}
#ecu-edit .change-owner .change-owner-container, #ecu-edit .change-owner .do-translate-container, #ecu-edit .translate .change-owner-container, #ecu-edit .translate .do-translate-container {
  display: none;
}
#ecu-edit .change-owner .change-owner-wrapper, #ecu-edit .change-owner .do-translate-container fieldset, #ecu-edit .translate .change-owner-wrapper, #ecu-edit .translate .do-translate-container fieldset {
  padding: 10px;
  background-color: #ffffff;
  border: 1px solid #0375b4;
  margin-top: 0;
  position: relative;
  box-sizing: content-box;
}
#ecu-edit .change-owner .change-owner-wrapper .form-element--number, #ecu-edit .change-owner .do-translate-container fieldset .form-element--number, #ecu-edit .translate .change-owner-wrapper .form-element--number, #ecu-edit .translate .do-translate-container fieldset .form-element--number {
  margin-top: 0;
}
#ecu-edit .change-owner .change-owner-wrapper .form-element--number input#newOwnerID, #ecu-edit .change-owner .do-translate-container fieldset .form-element--number input#newOwnerID, #ecu-edit .translate .change-owner-wrapper .form-element--number input#newOwnerID, #ecu-edit .translate .do-translate-container fieldset .form-element--number input#newOwnerID {
  width: 100%;
  border: 1px solid #0375b4;
}
#ecu-edit .change-owner .change-owner-wrapper button, #ecu-edit .change-owner .do-translate-container fieldset button, #ecu-edit .translate .change-owner-wrapper button, #ecu-edit .translate .do-translate-container fieldset button {
  margin-top: 10px;
  height: 30px;
}
#ecu-edit .change-owner .change-owner-wrapper:after, #ecu-edit .change-owner .do-translate-container fieldset:after, #ecu-edit .translate .change-owner-wrapper:after, #ecu-edit .translate .do-translate-container fieldset:after {
  color: #ffffff;
  position: absolute;
  right: 10px;
  top: -33px;
  font-size: 1.4rem;
  font-family: TourispoWebfonts !important;
  font-weight: 400;
  font-style: normal;
  display: inline-block;
  content: "\f077";
}
#ecu-edit .translate .translation-cost-hint {
  font-size: 0.84rem;
  color: #a3361d;
  position: absolute;
  top: 2px;
  right: 6px;
}
@media all and (min-width: 481px) {
  #ecu-edit .edit-functionality {
    display: grid;
    grid-gap: 10px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  #ecu-edit .save-buttons {
    left: 14px;
    right: 14px;
  }
}
@media all and (min-width: 681px) {
  #ecu-edit {
    display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
    display: -webkit-flex; /* Safari 7*/
    display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
    display: -ms-flexbox; /* IE10 */
    display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
    display: flex;
    /* Simulating 2012 flexbox model (used in IE 10) */
    /* Legacy Browsers (IE 10)*/
    -webkit-box-pack: justify;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-box-align: stretch;
    -moz-box-align: stretch;
    -ms-flex-align: stretch;
    /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
    /* For understanding browsers */
    -webkit-flex-direction: row;
    -moz-flex-direction: row;
    -ms-flex-direction: row;
    -o-flex-direction: row;
    flex-direction: row;
    -webkit-align-items: stretch;
    -moz-align-items: stretch;
    -ms-align-items: stretch;
    -o-align-items: stretch;
    align-items: stretch;
    -webkit-flex-flow: row nowrap;
    -webkit-justify-content: space-between;
    -moz-justify-content: space-between;
    -o-justify-content: space-between;
    -ms-justify-content: space-between;
    justify-content: space-between;
    flex-wrap: nowrap;
    -ms-flex-wrap: nowrap; /* IE 10 */
    -webkit-flex-wrap: nowrap;
  }
  #ecu-edit .statistics {
    width: 25%;
  }
  #ecu-edit .edit-functionality {
    margin-left: 30px;
    margin-top: 0;
  }
  #ecu-edit .save-buttons {
    left: 0;
    right: 0;
    bottom: 0;
    height: 70px;
    background-color: #fafafa;
    box-shadow: inset 0 1px 0 #c4ccda;
    display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
    display: -webkit-flex; /* Safari 7*/
    display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
    display: -ms-flexbox; /* IE10 */
    display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
    display: flex;
    /* Simulating 2012 flexbox model (used in IE 10) */
    /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
    /* For understanding browsers */
    -webkit-flex-direction: row;
    -moz-flex-direction: row;
    -ms-flex-direction: row;
    -o-flex-direction: row;
    flex-direction: row;
    -webkit-align-items: center;
    -moz-align-items: center;
    -ms-align-items: center;
    -o-align-items: center;
    align-items: center;
    -webkit-flex-flow: row nowrap;
    -webkit-justify-content: center;
    -moz-justify-content: center;
    -o-justify-content: center;
    -ms-justify-content: center;
    justify-content: center;
    flex-wrap: nowrap;
    -ms-flex-wrap: nowrap; /* IE 10 */
    -webkit-flex-wrap: nowrap;
  }
  #ecu-edit .save-buttons button, #ecu-edit .save-buttons .is-active-checkbox {
    width: 220px;
  }
}
@media all and (min-width: 1401px) {
  #ecu-edit {
    /* For understanding browsers */
    -webkit-flex-direction: column;
    -moz-flex-direction: column;
    -ms-flex-direction: column;
    -o-flex-direction: column;
    flex-direction: column;
    -webkit-flex-flow: column wrap;
  }
  #ecu-edit .statistics {
    width: 100%;
  }
  #ecu-edit .mobile-style-label-value {
    margin: 6px 0;
  }
  #ecu-edit .edit-functionality {
    margin-left: 0;
    margin-top: 10px;
    display: block;
  }
  #ecu-edit .edit-functionality > * {
    margin: 10px 0;
  }
}

#pecu-crawler .pecu-crawler-item {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: center;
  -moz-align-items: center;
  -ms-align-items: center;
  -o-align-items: center;
  align-items: center;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
  margin-bottom: 10px;
}
#pecu-crawler .pecu-crawler-item .form-element--text {
  margin-right: 10px;
  flex-grow: 1;
  -webkit-flex-grow: 1;
  -moz-flex-grow: 1;
  -ms-flex-grow: 1;
  -o-flex-grow: 1;
}
#pecu-crawler .pecu-crawler-item .form-element--text .form-element__main-input {
  font-size: 0.84rem;
}

/*############################################
 *## Positioning on the grid depending on page type
 *############################################*/
.entitymain #facts #condition-box-open-slopes-lifts, .entityzoomableimage #facts #condition-box-open-slopes-lifts {
  order: 4;
}
.entitymain #facts #condition-box-snow-report, .entityzoomableimage #facts #condition-box-snow-report {
  order: 5;
}
.entitymain #facts #fresh-snow-forecast-preview, .entityzoomableimage #facts #fresh-snow-forecast-preview {
  order: 6;
}
.entitymain #facts #condition-box-weather-multiday, .entityzoomableimage #facts #condition-box-weather-multiday {
  order: 7;
}
.entitymain #facts #condition-box-xcslopes-groomed, .entityzoomableimage #facts #condition-box-xcslopes-groomed {
  order: 2;
}

.entityzoomableimage #condition-box-slopes-lifts-snow-weather {
  grid-column-start: 1;
  grid-column-end: 3;
}
@media all and (min-width: 1025px) {
  .entityzoomableimage #condition-box-slopes-lifts-snow-weather {
    grid-column-start: 1;
    grid-column-end: 2;
  }
}

/*############################################
 *## Module Styles
 *############################################*/
.condition-box + .link-detail-pages, #condition-box-slopes-lifts-snow-weather .content + .link-detail-pages {
  margin-top: 20px;
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: start;
  -moz-box-pack: start;
  -ms-flex-pack: start;
  -webkit-box-align: stretch;
  -moz-box-align: stretch;
  -ms-flex-align: stretch;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  box-lines: multiple;
  -moz-box-lines: multiple;
  -webkit-box-lines: multiple;
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-flex-flow: row wrap;
  -webkit-justify-content: flex-start;
  -moz-justify-content: flex-start;
  -o-justify-content: flex-start;
  -ms-justify-content: flex-start;
  justify-content: flex-start;
  flex-wrap: wrap;
  -ms-flex-wrap: wrap; /* IE 10 */
  -webkit-flex-wrap: wrap;
}
.condition-box + .link-detail-pages .show-details, #condition-box-slopes-lifts-snow-weather .content + .link-detail-pages .show-details {
  padding-right: 14px;
}

#condition-box-slopes-lifts-snow-weather .content {
  display: grid;
  grid-gap: 10px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-row-gap: 14px !important;
}
#condition-box-slopes-lifts-snow-weather .content .weather {
  text-align: center;
}
#condition-box-slopes-lifts-snow-weather .content .weather .weather-icon {
  margin: 0 auto;
}
@media all and (min-width: 1025px) {
  #condition-box-slopes-lifts-snow-weather .content {
    display: grid;
    grid-gap: 10px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  #condition-box-slopes-lifts-snow-weather .content .weather {
    display: none;
  }
}
@media all and (min-width: 1301px) {
  #condition-box-slopes-lifts-snow-weather .content {
    display: grid;
    grid-gap: 10px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  #condition-box-slopes-lifts-snow-weather .content .weather {
    display: block;
  }
  #condition-box-slopes-lifts-snow-weather .content .pie-chart {
    position: relative;
    height: 60px;
  }
  #condition-box-slopes-lifts-snow-weather .content .pie-chart .pie-container {
    height: 36px;
    width: 75px;
    left: 50%;
    margin-left: -37.5px;
    overflow: hidden;
    position: absolute;
    box-sizing: content-box;
    padding: 2px;
  }
  #condition-box-slopes-lifts-snow-weather .content .pie-chart .pie-background {
    background-color: #ccc;
    position: absolute;
    width: 75px;
    height: 75px;
    border-radius: 38px;
    -moz-box-shadow: -1px 0 1px #727272;
    -webkit-box-shadow: -1px 0 1px #727272;
    -o-box-shadow: -1px 0 1px #727272;
    box-shadow: -1px 0 1px #727272;
  }
  #condition-box-slopes-lifts-snow-weather .content .pie-chart .pie-center {
    position: absolute;
    width: 60px;
    height: 60px;
    background-color: #ffffff;
    border-radius: 50%;
    left: 38.5px;
    top: 38.5px;
    margin-left: -30px;
    margin-top: -30px;
    box-shadow: inset 1px 1px 1px 0 #ccc;
  }
  #condition-box-slopes-lifts-snow-weather .content .pie-chart .pie {
    position: absolute;
    width: 75px;
    height: 75px;
    border-radius: 50%;
    clip: rect(0px, 75px, 37.5px, 0px);
  }
  #condition-box-slopes-lifts-snow-weather .content .pie-chart .pie {
    background-color: #0375b4;
  }
  #condition-box-slopes-lifts-snow-weather .content .pie-chart .value {
    width: 100%;
    padding-right: 5px;
    position: absolute;
  }
  #condition-box-slopes-lifts-snow-weather .content .pie-chart .value-line-two {
    line-height: 12px;
  }
}

#condition-box-snow-report #fresh-snow-forecast {
  margin-top: 10px;
}

#condition-box-weather-multiday .weather-multiday-forecast ul .icon {
  margin-top: 6px;
  width: 50px;
  height: 50px;
}
#condition-box-weather-multiday .weather-multiday-forecast ul .icon:before {
  width: 50px;
  height: 50px;
}

/*############################################
 *## Positioning on the grid depending on page type
 *############################################*/
.index #blog-article-overview {
  grid-row: content-row10-start/content-row10-end;
  grid-column: content-col1-start/content-col12-end;
}
@media all and (min-width: 681px) {
  .index {
    grid-row: content-row7-start/content-row14-end;
    grid-column: content-col1-start/content-col12-end;
  }
}

.blogarticleoverview #blog-article-overview {
  grid-row: content-row1-start/content-row14-end;
  grid-column: content-col1-start/content-col12-end;
}

.usermain #blog-article-overview {
  grid-row: content-row7-start/content-row7-end;
  grid-column: content-col1-start/content-col12-end;
}

/*############################################
 *## Module Styles
 *############################################*/
#blog-article-overview .show-on-desktop {
  margin: 20px 0;
}
#blog-article-overview .show-on-desktop .divider-teaser-small {
  display: grid !important;
}
#blog-article-overview .overview-list-container {
  margin-left: 0;
  margin-right: 0;
}
#blog-article-overview .overview-list-item .category {
  position: absolute;
  right: 0;
  color: #ffffff;
  background-color: rgba(0, 0, 0, 0.6);
  padding: 6px 10px;
  border-radius: 0 0 0 15px;
}
#blog-article-overview .overview-list-item .category a {
  color: #ffffff;
  text-decoration: underline;
}
#blog-article-overview .overview-list-item .overview-list-bottomrow {
  margin-top: 6px;
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: center;
  -moz-align-items: center;
  -ms-align-items: center;
  -o-align-items: center;
  align-items: center;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
}
#blog-article-overview .button.show-all-articles {
  margin: 10px auto 10px auto;
  display: block;
  width: fit-content;
  width: -moz-fit-content;
}
@media all and (min-width: 681px) {
  #blog-article-overview {
    padding: 0 10px;
  }
  #blog-article-overview .overview-list-item.odd .category {
    right: 4%;
  }
}
@media all and (min-width: 861px) {
  #blog-article-overview {
    padding-right: 0;
  }
}
@media all and (min-width: 1401px) {
  #blog-article-overview {
    padding-left: 0;
  }
}

#make-blogarticle-series-panel {
  grid-row: headline-row;
  grid-column: aside-col-start/aside-col-end;
  margin-top: 100px;
}

.skischool-list .teaser-list .carousel {
  background-color: #f1f1f1;
  padding: 10px;
}
.skischool-list .teaser-list .carousel .swiper-slide {
  width: 180px !important;
  background-color: #ffffff;
  border: 1px solid #ccc;
}
.skischool-list .teaser-list .carousel .swiper-slide .teaser-image {
  height: 140px;
}
.skischool-list .teaser-list .carousel .swiper-slide .teaser-image .div-image {
  background-size: contain;
}
.skischool-list .teaser-list .carousel .swiper-slide .teaser-text {
  padding: 10px;
}

.skilesson-list {
  position: relative;
}
.skilesson-list .overlay-image {
  top: auto;
  bottom: 0;
}
.skilesson-list .overlay-image .div-image {
  height: 60px !important;
  top: auto;
  bottom: 0;
  width: 60px !important;
  right: -2px !important;
  background-color: #ffffff !important;
}
.skilesson-list .overlay.fader .town {
  width: 70%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  text-align: left;
}
.skilesson-list .checkYeti-link {
  margin: 10px 0 -4px 0;
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: start;
  -moz-box-pack: start;
  -ms-flex-pack: start;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: center;
  -moz-align-items: center;
  -ms-align-items: center;
  -o-align-items: center;
  align-items: center;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: flex-start;
  -moz-justify-content: flex-start;
  -o-justify-content: flex-start;
  -ms-justify-content: flex-start;
  justify-content: flex-start;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
}
.skilesson-list .checkYeti-link .affiliate-partnership-checkyeti {
  background: url("/images/desktop/ecu/content/c_skischool/checkyetilogo.png") no-repeat center center/contain;
  width: 114px;
  height: 28px;
  margin-right: 10px;
}

.skirental-list .teaser-list .carousel {
  background-color: #f1f1f1;
  padding: 10px;
}
.skirental-list .teaser-list .carousel .swiper-slide {
  width: 180px !important;
  background-color: #ffffff;
  border: 1px solid #ccc;
}
.skirental-list .teaser-list .carousel .swiper-slide .teaser-image {
  height: 140px;
}
.skirental-list .teaser-list .carousel .swiper-slide .teaser-image .div-image {
  background-size: contain;
}
.skirental-list .teaser-list .carousel .swiper-slide .teaser-text {
  padding: 10px;
}

/*############################################
 *## Positioning on the grid depending on page type
 *############################################*/
.entitymain #booking-overview-list {
  display: none;
  grid-row: content-row12-start/content-row12-end;
  grid-column: content-col1-start/content-col12-end;
}

.aggregatorentity #booking-overview-list {
  grid-row: content-row1-start/content-row13-end;
  grid-column: content-col1-start/content-col12-end;
}

/*############################################
 *## Module Styles
 *############################################*/
#booking-overview-list .item-facts {
  margin: 10px;
}

.aggregatorentity #ecu-list, .aggregatorentity .ecu-list {
  grid-row: content-row1-start/content-row12-end;
  grid-column: content-col1-start/content-col12-end;
}

.productcategory #ecu-list, .productcategory .ecu-list, .productbrandgroup #ecu-list, .productbrandgroup .ecu-list {
  grid-row: content-row1-start/content-row14-end;
  grid-column: content-col1-start/content-col12-end;
}

#ecu-list .show-on-desktop .divider-teaser-small {
  display: grid !important;
  margin-top: 20px;
}

.aggregatorgeo #ecu-list, .filteredaggregatorgeo #ecu-list, .notfound #ecu-list {
  grid-row: content-row5-start/content-row14-end;
  grid-column: content-col1-start/content-col12-end;
  margin-top: 20px;
}
@media all and (min-width: 681px) {
  .aggregatorgeo #ecu-list, .filteredaggregatorgeo #ecu-list, .notfound #ecu-list {
    grid-row: content-row4-start/content-row14-end;
    grid-column: content-col1-start/content-col12-end;
  }
}

.contentgeo #ecu-list {
  margin-top: 20px;
  grid-row: content-row8-start/content-row14-end;
  grid-column: content-col1-start/content-col12-end;
}

.usermain #ecu-list {
  grid-row: content-row8-start/content-row8-end;
  grid-column: content-col1-start/content-col12-end;
}

.userfavorites #ecu-list, .userentitylist #ecu-list {
  grid-row: content-row1-start/content-row8-end;
  grid-column: content-col1-start/content-col12-end;
}

.ecu-list .sortable-list-button {
  margin-bottom: 10px;
}
@media all and (max-width: 1401px) {
  .ecu-list {
    padding-left: 10px;
  }
}
@media all and (max-width: 861px) {
  .ecu-list {
    padding-right: 10px;
  }
}
.ecu-list .header, .ecu-list .footer {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  box-lines: multiple;
  -moz-box-lines: multiple;
  -webkit-box-lines: multiple;
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: center;
  -moz-align-items: center;
  -ms-align-items: center;
  -o-align-items: center;
  align-items: center;
  -webkit-flex-flow: row wrap;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: wrap;
  -ms-flex-wrap: wrap; /* IE 10 */
  -webkit-flex-wrap: wrap;
}
.ecu-list .header .pagination, .ecu-list .footer .pagination {
  background-color: #ffffff;
  order: 2;
  width: 100%;
}
.ecu-list .header .additional-link-buttons, .ecu-list .footer .additional-link-buttons {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  box-lines: multiple;
  -moz-box-lines: multiple;
  -webkit-box-lines: multiple;
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: center;
  -moz-align-items: center;
  -ms-align-items: center;
  -o-align-items: center;
  align-items: center;
  -webkit-flex-flow: row wrap;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: wrap;
  -ms-flex-wrap: wrap; /* IE 10 */
  -webkit-flex-wrap: wrap;
}
.ecu-list .header .additional-link-buttons > a:not(:first-child), .ecu-list .footer .additional-link-buttons > a:not(:first-child) {
  margin-left: 10px;
}
.ecu-list .header {
  position: relative;
  margin-bottom: 10px;
}
.ecu-list .header .pecu-filter {
  order: 1;
  width: 100%;
}
.ecu-list .footer {
  margin-top: 10px;
}
.ecu-list .footer .pecu-filter {
  display: none;
}
.ecu-list .tile .item-pecu-type {
  font-size: 1.6rem;
}
.ecu-list .tile .item-pecu-type:before {
  width: 100%;
  text-align: center;
}
.ecu-list .tile .star-rating-container {
  color: #ffc100;
}
.ecu-list .tile .geo-hierarchy {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: start;
  -moz-box-pack: start;
  -ms-flex-pack: start;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: center;
  -moz-align-items: center;
  -ms-align-items: center;
  -o-align-items: center;
  align-items: center;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: flex-start;
  -moz-justify-content: flex-start;
  -o-justify-content: flex-start;
  -ms-justify-content: flex-start;
  justify-content: flex-start;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
}
.ecu-list .tile .geo-hierarchy .ui-icon-angle-right {
  display: inline;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.ecu-list .tile .geo-hierarchy .ui-icon-angle-right:first-child {
  flex-shrink: 0;
  -webkit-flex-shrink: 0;
  -moz-flex-shrink: 0;
  -ms-flex-shrink: 0;
  -o-flex-shrink: 0;
}
.ecu-list .tile .geo-hierarchy .ui-icon-angle-right:first-child:before {
  display: none;
}
.ecu-list .tile .geo-hierarchy .ui-icon-angle-right:before {
  font-size: 0.84rem;
  margin: 0 10px;
}
@media all and (min-width: 1025px) {
  .ecu-list .header .pagination, .ecu-list .footer .pagination {
    width: auto;
  }
  .ecu-list .header .pagination .pagination-link, .ecu-list .footer .pagination .pagination-link {
    padding: 10px;
  }
  .ecu-list .header .pecu-filter, .ecu-list .footer .pecu-filter {
    width: auto;
  }
}
@media all and (min-width: 1151px) and (max-width: 1300px) {
  .ecu-list .header .pagination .pagination-link, .ecu-list .footer .pagination .pagination-link {
    padding-left: 6px;
    padding-right: 6px;
  }
}

#related_magazine-articles {
  padding: 10px;
  background-color: #171b2d;
  color: #ffffff;
  position: relative;
  left: -10px;
  width: calc(100% + 2 * 10px);
  padding: 10px;
}
#related_magazine-articles a {
  color: #ffffff;
}
#related_magazine-articles a:before {
  color: #ffffff;
}
#related_magazine-articles .headlines {
  color: #ffffff;
  padding-top: 0;
}
#related_magazine-articles input[type=checkbox] + label:before, #related_magazine-articles input[type=radio] + label:before {
  color: #ffffff;
  background-color: #171b2d;
}
#related_magazine-articles label {
  color: #ffffff;
}
#related_magazine-articles .teaser-item {
  width: 45%;
  margin-right: 14px !important;
}
@media all and (min-width: 481px) {
  #related_magazine-articles .teaser-item {
    width: 30%;
  }
}
@media all and (min-width: 681px) {
  #related_magazine-articles {
    padding: 10px 14px;
  }
  #related_magazine-articles .teaser-item {
    width: 24%;
  }
}
@media all and (min-width: 1151px) {
  #related_magazine-articles .teaser-item {
    width: 18%;
  }
}
@media all and (min-width: 1401px) {
  #related_magazine-articles {
    position: relative;
    left: -24px;
    width: calc(100% + 2 * 24px);
  }
}

#created-entities {
  width: 100%;
}
#created-entities .messages-feedback-message {
  width: 100%;
}
#created-entities .headlines {
  width: 100%;
}
#created-entities .pagination {
  background-color: #ffffff;
}
#created-entities .pagination .progress-container {
  margin-left: 0;
  padding-right: 0;
}
#created-entities #created-entities-list {
  display: grid;
  grid-gap: 10px;
  grid-template-columns: repeat(1, minmax(0, 1fr));
}
#created-entities .item {
  position: relative;
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: flex;
  -webkit-flex-direction: column;
  -webkit-box-orient: vertical; /* Safari <= 6*/
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  -o-flex-direction: column;
  flex-direction: column;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: nowrap;
  -webkit-flex-wrap: nowrap;
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  /*############################################
   *## content
   *############################################*/
}
#created-entities .item .status {
  margin-bottom: 4px;
  position: relative;
  padding-left: 20px;
  box-sizing: border-box;
}
#created-entities .item .status:before {
  font-family: TourispoWebfonts !important;
  font-weight: 400;
  font-style: normal;
  display: inline-block;
  font-size: 1.15rem;
  line-height: 22px;
  margin-right: 2px;
  vertical-align: middle;
  position: absolute;
  left: 0;
  top: -2px;
}
#created-entities .item .status.complete:before {
  color: #75b34d;
  content: "\f058";
}
#created-entities .item .status.incomplete:before {
  color: #fe9e5f;
  content: "\f06a";
}
#created-entities .item .status.missing:before {
  color: #fc5a5a;
  content: "\f057";
}
#created-entities .item .content, #created-entities .item .footer {
  width: 100%;
}
#created-entities .item .content {
  height: 100%;
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: stretch;
  -moz-box-align: stretch;
  -ms-flex-align: stretch;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  box-lines: multiple;
  -moz-box-lines: multiple;
  -webkit-box-lines: multiple;
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-flex-flow: row wrap;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: wrap;
  -ms-flex-wrap: wrap; /* IE 10 */
  -webkit-flex-wrap: wrap;
}
#created-entities .item .content .left {
  display: none;
  position: relative;
}
#created-entities .item .content .left .item-image-wrapper {
  height: auto;
  width: 100%;
  padding-bottom: 82%;
  position: relative;
}
#created-entities .item .content .left .item-image-wrapper .item-image-container {
  left: 0;
  right: 10px;
  top: 0;
  bottom: 0;
  position: absolute;
}
#created-entities .item .content .left .item-image-wrapper .div-image {
  border-radius: 5px;
}
#created-entities .item .content .left .pie-chart-medium {
  position: absolute;
  left: 0;
  right: 5px;
  bottom: -22px;
  margin: 0 auto;
}
#created-entities .item .content .left .pie-chart-medium .value {
  bottom: 0;
}
#created-entities .item .content .left .pie-chart-medium .value-line-two {
  font-weight: normal !important;
}
#created-entities .item .content .right {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: stretch;
  -moz-box-align: stretch;
  -ms-flex-align: stretch;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  box-lines: multiple;
  -moz-box-lines: multiple;
  -webkit-box-lines: multiple;
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-flex-flow: row wrap;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: wrap;
  -ms-flex-wrap: wrap; /* IE 10 */
  -webkit-flex-wrap: wrap;
  width: 100%;
  position: relative;
}
#created-entities .item .content .right .entity-name {
  display: block;
  line-height: 18px;
  margin-bottom: 10px;
  position: relative;
  padding-left: 24px;
  width: 100%;
  font-size: 1.15rem;
  box-sizing: border-box;
}
#created-entities .item .content .right .entity-name:before {
  position: absolute;
  left: 0;
  padding-right: 4px;
  font-size: 18px;
}
#created-entities .item .content .right .quality-items {
  width: 48%;
  font-size: 0.84rem;
}
#created-entities .item .content .right .quality-items a {
  margin-bottom: 6px;
  display: block;
  -moz-hyphens: auto;
  -o-hyphens: auto;
  -webkit-hyphens: auto;
  -ms-hyphens: auto;
  hyphens: auto;
}
#created-entities .item .content .edit-buttons {
  width: 100%;
  margin-top: 10px;
}
#created-entities .item .content .edit-buttons .button {
  flex-grow: 1;
  -webkit-flex-grow: 1;
  -moz-flex-grow: 1;
  -ms-flex-grow: 1;
  -o-flex-grow: 1;
  align-self: end;
}
#created-entities .item .content .edit-buttons .button + .button {
  margin-top: 10px;
}
#created-entities .item .content .list-of-links {
  position: absolute;
  right: -16px;
  top: -16px;
}
#created-entities .item .content .list-of-links a {
  margin-top: 0;
}
#created-entities .item .content .list-of-links a:before {
  font-size: 24px;
}
#created-entities .created-entities-visitors {
  font-size: 0.74rem;
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: distribute;
  -moz-box-pack: distribute;
  -ms-flex-pack: distribute;
  -webkit-box-align: stretch;
  -moz-box-align: stretch;
  -ms-flex-align: stretch;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: space-around;
  -moz-justify-content: space-around;
  -o-justify-content: space-around;
  -ms-justify-content: space-around;
  justify-content: space-around;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
  padding-top: 10px;
  margin-top: 10px;
  border-top: 1px solid #ccc;
}
#created-entities .created-entities-visitors .label, #created-entities .created-entities-visitors .value {
  font-weight: bold;
}
#created-entities .created-entities-visitors .value, #created-entities .created-entities-visitors .time-period {
  display: block;
}
@media all and (min-width: 481px) {
  #created-entities .item .content .edit-buttons {
    display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
    display: -webkit-flex; /* Safari 7*/
    display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
    display: -ms-flexbox; /* IE10 */
    display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
    display: flex;
    /* Simulating 2012 flexbox model (used in IE 10) */
    /* Legacy Browsers (IE 10)*/
    -webkit-box-pack: justify;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-box-align: stretch;
    -moz-box-align: stretch;
    -ms-flex-align: stretch;
    /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
    /* For understanding browsers */
    -webkit-flex-direction: row;
    -moz-flex-direction: row;
    -ms-flex-direction: row;
    -o-flex-direction: row;
    flex-direction: row;
    -webkit-align-items: stretch;
    -moz-align-items: stretch;
    -ms-align-items: stretch;
    -o-align-items: stretch;
    align-items: stretch;
    -webkit-flex-flow: row nowrap;
    -webkit-justify-content: space-between;
    -moz-justify-content: space-between;
    -o-justify-content: space-between;
    -ms-justify-content: space-between;
    justify-content: space-between;
    flex-wrap: nowrap;
    -ms-flex-wrap: nowrap; /* IE 10 */
    -webkit-flex-wrap: nowrap;
  }
  #created-entities .item .content .edit-buttons .button + .button {
    margin-left: 10px;
  }
}
@media all and (min-width: 681px) {
  #created-entities .item .content .left {
    display: block;
    width: 30%;
  }
  #created-entities .item .content .right {
    width: 70%;
  }
  #created-entities .item .content .edit-buttons .button {
    width: 49%;
  }
}
@media all and (min-width: 1151px) {
  #created-entities #created-entities-list {
    display: grid;
    grid-gap: 10px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  #created-entities .item .content .edit-buttons {
    display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
    display: -webkit-flex; /* Safari 7*/
    display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
    display: -ms-flexbox; /* IE10 */
    display: flex;
    -webkit-flex-direction: column;
    -webkit-box-orient: vertical; /* Safari <= 6*/
    -moz-flex-direction: column;
    -ms-flex-direction: column;
    -o-flex-direction: column;
    flex-direction: column;
    -webkit-align-items: stretch;
    -moz-align-items: stretch;
    -ms-align-items: stretch;
    -o-align-items: stretch;
    align-items: stretch;
    -webkit-justify-content: flex-end;
    -moz-justify-content: flex-end;
    -o-justify-content: flex-end;
    -ms-justify-content: flex-end;
    justify-content: flex-end;
    flex-wrap: nowrap;
    -webkit-flex-wrap: nowrap;
    /* Legacy Browsers (IE 10)*/
    -webkit-box-pack: end;
    -moz-box-pack: end;
    -ms-flex-pack: end;
    -webkit-box-align: center;
    -moz-box-align: center;
    -ms-flex-align: center;
  }
  #created-entities .item .content .edit-buttons .button {
    width: 100%;
    flex-grow: 0;
    -webkit-flex-grow: 0;
    -moz-flex-grow: 0;
    -ms-flex-grow: 0;
    -o-flex-grow: 0;
  }
}
@media all and (min-width: 1301px) {
  #created-entities .item .content .edit-buttons {
    display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
    display: -webkit-flex; /* Safari 7*/
    display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
    display: -ms-flexbox; /* IE10 */
    display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
    display: flex;
    /* Simulating 2012 flexbox model (used in IE 10) */
    /* Legacy Browsers (IE 10)*/
    -webkit-box-pack: justify;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-box-align: stretch;
    -moz-box-align: stretch;
    -ms-flex-align: stretch;
    /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
    /* For understanding browsers */
    -webkit-flex-direction: row;
    -moz-flex-direction: row;
    -ms-flex-direction: row;
    -o-flex-direction: row;
    flex-direction: row;
    -webkit-align-items: stretch;
    -moz-align-items: stretch;
    -ms-align-items: stretch;
    -o-align-items: stretch;
    align-items: stretch;
    -webkit-flex-flow: row nowrap;
    -webkit-justify-content: space-between;
    -moz-justify-content: space-between;
    -o-justify-content: space-between;
    -ms-justify-content: space-between;
    justify-content: space-between;
    flex-wrap: nowrap;
    -ms-flex-wrap: nowrap; /* IE 10 */
    -webkit-flex-wrap: nowrap;
  }
  #created-entities .item .content .edit-buttons .button {
    width: 49%;
    flex-grow: 1;
    -webkit-flex-grow: 1;
    -moz-flex-grow: 1;
    -ms-flex-grow: 1;
    -o-flex-grow: 1;
  }
}

/*############################################
 *## Positioning on the grid depending on page type
 *############################################*/
.index #cool-and-new-container {
  grid-row: content-row12-start/content-row12-end;
  grid-column: content-col1-start/content-col12-end;
  margin-bottom: 50px;
}
@media all and (max-width: 1401px) {
  .index #cool-and-new-container {
    padding-left: 10px;
  }
}
@media all and (max-width: 861px) {
  .index #cool-and-new-container {
    padding-right: 10px;
  }
}
.index #cool-and-new-container > .collapsible-content.material-divider {
  padding-left: 0;
  padding-right: 0;
  border-bottom: none !important;
}
.index #cool-and-new-container #ecu-list {
  margin: 0;
}
@media all and (min-width: 681px) {
  .index {
    grid-row: content-row5-start/content-row5-end;
    grid-column: content-col1-start/content-col12-end;
  }
}

/*############################################
 *## Module Styles
 *############################################*/
#cool-and-new-container #ecu-list {
  padding: 0;
}
#cool-and-new-container .horizontal-navigation--tabbed__content {
  border-bottom: none;
}

#best-of-container {
  grid-row: content-row2-start/content-row2-end;
  grid-column: content-col1-start/content-col12-end;
  background-color: #ffffff;
  border-top: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
  padding: 10px;
  height: 100%;
  width: 100%;
  padding: 0 10px;
  margin: 0;
}
#best-of-container > .element-actions {
  padding-top: 10px;
}
#best-of-container .default-table {
  width: 100%;
}
#best-of-container .default-table tbody tr {
  background-color: #ffffff;
}
#best-of-container .default-table tbody tr:hover {
  background-color: #f1f1f1;
}
@media all and (min-width: 681px) {
  #best-of-container {
    grid-row: content-row2-start/content-row2-end;
    grid-column: content-col1-start/content-col6-end;
  }
}
@media all and (min-width: 861px) {
  #best-of-container {
    padding: 0 10px;
  }
}

/*############################################
 *## Positioning on the grid depending on page type
 *############################################*/
.index #sweepstake-overview {
  margin-top: 20px;
  grid-row: content-row11-start/content-row11-end;
  grid-column: content-col1-start/content-col12-end;
  margin-bottom: 30px;
}
@media all and (min-width: 681px) {
  .index {
    grid-row: content-row6-start/content-row6-end;
    grid-column: content-col1-start/content-col12-end;
  }
}

.sweepstakeoverview .messages-feedback-message {
  grid-row: content-row1-start/content-row1-end;
  grid-column: content-col1-start/content-col12-end;
}
.sweepstakeoverview #sweepstake-overview {
  grid-row: content-row2-start/content-row6-end;
  grid-column: content-col1-start/content-col12-end;
}
.sweepstakeoverview .sweepstake-archive {
  grid-row: content-row7-start/content-row12-end;
  grid-column: content-col1-start/content-col12-end;
}

/*############################################
 *## Module Styles
 *############################################*/
#sweepstake-overview .tile-list .tile {
  width: 260px;
}
#sweepstake-overview .tile-list .tile .tile__content .running-until {
  margin: 10px 0;
  border-top: none;
}
#sweepstake-overview .button {
  width: fit-content;
  width: -moz-fit-content;
  display: block;
  margin: 0 auto;
}
@media all and (min-width: 1025px) {
  #sweepstake-overview .overview-list .overview-list-item .headlines {
    display: block;
    height: 46px;
  }
}
@media all and (min-width: 1301px) {
  #sweepstake-overview .tile-list .tile {
    width: 300px;
  }
}

.sweepstake-archive .termination-date {
  color: #727272;
  font-size: 0.9rem;
  padding-top: 10px;
}

/*############################################
 *## Positioning on the grid depending on page type
 *############################################*/
.index #survey-overview {
  margin-bottom: 30px !important;
}

.blogarticleoverview #survey-overview-active, .contentmain.c_blogarticle #survey-overview-active {
  order: 2;
}

.surveyoverview #survey-overview-active {
  grid-row: content-row1-start/content-row1-end;
  grid-column: content-col1-start/content-col12-end;
}
.surveyoverview #survey-overview-archive {
  grid-row: content-row2-start/content-row2-end;
  grid-column: content-col1-start/content-col12-end;
  margin-top: 20px;
}
@media all and (max-width: 1401px) {
  .surveyoverview #survey-overview-archive {
    padding-left: 10px;
  }
}
@media all and (max-width: 861px) {
  .surveyoverview #survey-overview-archive {
    padding-right: 10px;
  }
}
.surveyoverview .survey-list .overviewListItem {
  background-color: #ffffff;
  border-top: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
  padding: 10px;
  margin-bottom: 20px;
}
.surveyoverview .survey-list .overviewListItem > .element-actions {
  padding-top: 10px;
}
.surveyoverview .survey-list .overviewListItem .figcaption {
  font-size: 1.3rem;
}
.surveyoverview .survey-list .overviewListItem .main-image {
  height: 180px;
}
.surveyoverview .survey-list .overviewListItem img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
@media all and (min-width: 481px) {
  .surveyoverview .survey-list {
    display: grid;
    grid-gap: 10px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media all and (min-width: 681px) {
  .surveyoverview .survey-list {
    display: grid;
    grid-gap: 10px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

/*############################################
 *## Positioning on the grid depending on page type
 *############################################*/
.entitymain #author-box {
  display: none;
}

.c_blogarticle #author-box {
  align-self: center;
  grid-row: content-row2-start/content-row2-end;
  grid-column: content-col1-start/content-col12-end;
}
.c_blogarticle #author-box.is-photo-series {
  grid-row: content-row3-start/content-row3-end;
  grid-column: content-col1-start/content-col12-end;
}
@media all and (min-width: 681px) {
  .c_blogarticle #author-box {
    grid-row: content-row2-start/content-row2-end;
    grid-column: content-col1-start/content-col8-end;
    padding: 10px 0 10px 10px;
  }
  .c_blogarticle #author-box.is-photo-series {
    width: 80%;
    margin-left: 10%;
    padding-left: 0;
  }
  .c_blogarticle #author-box .author-section .date {
    padding-top: 6px;
  }
}
@media all and (min-width: 1401px) {
  .c_blogarticle #author-box {
    grid-row: headline-row;
    grid-column: content-col8-end/content-col12-end;
  }
  .c_blogarticle #author-box.is-photo-series {
    grid-row: headline-row;
    grid-column: content-col8-end/content-col12-end;
  }
}

/*############################################
 *## Module Styles
 *############################################*/
#author-box {
  padding: 10px 10px 0 10px;
}
#author-box .author-section {
  position: relative;
}
#author-box .author-section .author-name {
  border-bottom: 1px solid #ccc;
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  box-lines: multiple;
  -moz-box-lines: multiple;
  -webkit-box-lines: multiple;
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-flex-flow: row wrap;
  -webkit-justify-content: flex-start nowrap;
  -moz-justify-content: flex-start nowrap;
  -o-justify-content: flex-start nowrap;
  -ms-justify-content: flex-start nowrap;
  justify-content: flex-start nowrap;
  flex-wrap: wrap;
  -ms-flex-wrap: wrap; /* IE 10 */
  -webkit-flex-wrap: wrap;
}
#author-box .author-section .author-name .ui-icon-mail {
  margin-left: 10px;
}
#author-box .author-section .author-name, #author-box .author-section .date {
  padding-left: 10px;
  padding-bottom: 6px;
}
#author-box .author-section #bio-snippet {
  position: absolute;
  line-height: 1.2;
  top: 26px;
  padding: 10px;
  font-size: 0.9rem;
  left: 10px;
  right: 10px;
  background-color: #fafafa;
  border: 1px solid #ccc;
  border-top: none;
  z-index: 10;
}
@media all and (min-width: 681px) {
  #author-box {
    padding: 0;
  }
}

/*############################################
 *## Positioning on the grid depending on page type
 *############################################*/
.entitymain #ecu-contact {
  grid-row: content-row13-start/content-row13-end;
  grid-column: content-col1-start/content-col12-end;
}
@media all and (min-width: 481px) {
  .entitymain #ecu-contact {
    grid-row: content-row11-start/content-row11-end;
  }
}

.entitypricesandopeninghours #ecu-contact, .entitycontact #ecu-contact {
  grid-row: content-row13-start/content-row14-end;
  grid-column: content-col1-start/content-col12-end;
}

.entitycontact #ecu-contact {
  display: none;
}
@media all and (min-width: 681px) {
  .entitycontact #ecu-contact {
    display: block;
  }
}

/*############################################
 *## Module Styles
 *############################################*/
#ecu-contact #ecu-contact-grid {
  display: grid;
  grid-gap: 10px;
  grid-template-columns: repeat(1, minmax(0, 1fr));
}
#ecu-contact #ecu-contact-grid.is-showing-logo {
  grid-template-columns: 30% 70%;
}
#ecu-contact #ecu-contact-grid.is-showing-logo .web-fax-tel {
  margin-left: 14px;
  grid-column: 2;
}
#ecu-contact #ecu-contact-grid.is-showing-logo .postal-address {
  margin-left: 14px;
}
#ecu-contact #ecu-contact-grid .logo img {
  width: 100%;
  height: auto;
  object-fit: contain;
  max-height: 100px;
}
#ecu-contact #ecu-contact-grid .link {
  margin-top: 6px;
  display: flex !important;
}
#ecu-contact #ecu-contact-grid .postal-address .zip, #ecu-contact #ecu-contact-grid .postal-address .city {
  display: inline-block;
}
#ecu-contact #ecu-contact-grid .postal-address .zip {
  margin-right: 6px;
}
@media all and (min-width: 681px) {
  #ecu-contact #ecu-contact-grid:not(.is-showing-logo) {
    grid-gap: 14px;
    grid-template-columns: 50% 50%;
  }
}
@media all and (min-width: 1301px) {
  #ecu-contact #ecu-contact-grid.is-showing-logo {
    grid-template-columns: 20% 40% 40%;
  }
  #ecu-contact #ecu-contact-grid.is-showing-logo .web-fax-tel {
    grid-column: 3;
  }
}

#pecu-video {
  padding: 10px;
  background-color: #171b2d;
  color: #ffffff;
  position: relative;
  left: -10px;
  width: calc(100% + 2 * 10px);
  margin-top: 30px;
}
#pecu-video a {
  color: #ffffff;
}
#pecu-video a:before {
  color: #ffffff;
}
#pecu-video .headlines {
  color: #ffffff;
  padding-top: 0;
}
#pecu-video input[type=checkbox] + label:before, #pecu-video input[type=radio] + label:before {
  color: #ffffff;
  background-color: #171b2d;
}
#pecu-video label {
  color: #ffffff;
}
#pecu-video .video-container {
  width: 100%;
  position: relative;
}
#pecu-video .main-video {
  margin-bottom: 30px;
}
#pecu-video .main-video .video-information-box {
  padding-top: 10px;
}
#pecu-video .small-video-container {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: flex;
  -webkit-flex-direction: column;
  -webkit-box-orient: vertical; /* Safari <= 6*/
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  -o-flex-direction: column;
  flex-direction: column;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-justify-content: flex-start;
  -moz-justify-content: flex-start;
  -o-justify-content: flex-start;
  -ms-justify-content: flex-start;
  justify-content: flex-start;
  flex-wrap: nowrap;
  -webkit-flex-wrap: nowrap;
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: start;
  -moz-box-pack: start;
  -ms-flex-pack: start;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
}
#pecu-video .small-video-container .video-container {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: flex-start;
  -moz-box-align: flex-start;
  -ms-flex-align: flex-start;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: flex-start;
  -moz-align-items: flex-start;
  -ms-align-items: flex-start;
  -o-align-items: flex-start;
  align-items: flex-start;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
  margin-bottom: 14px;
}
#pecu-video .small-video-container .video-frame {
  margin-right: 10px;
  width: 140px;
}
#pecu-video .small-video-container .video-frame .video-preview-thumb {
  background-position: left center;
  background-size: cover;
}
#pecu-video .small-video-container .video-information-box {
  flex-grow: 1;
  -webkit-flex-grow: 1;
  -moz-flex-grow: 1;
  -ms-flex-grow: 1;
  -o-flex-grow: 1;
}
#pecu-video .small-video-container .video-duration-box {
  padding: 6px;
  font-size: 0.84rem;
}
@media all and (min-width: 481px) {
  #pecu-video .small-video-container .video-frame {
    width: 200px;
  }
}
@media all and (min-width: 681px) and (max-width: 860px) {
  #pecu-video .small-video-container {
    display: grid;
    grid-gap: 10px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  #pecu-video .small-video-container .video-frame {
    width: 100%;
  }
  #pecu-video .small-video-container .video-container {
    display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
    display: -webkit-flex; /* Safari 7*/
    display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
    display: -ms-flexbox; /* IE10 */
    display: flex;
    -webkit-flex-direction: column;
    -webkit-box-orient: vertical; /* Safari <= 6*/
    -moz-flex-direction: column;
    -ms-flex-direction: column;
    -o-flex-direction: column;
    flex-direction: column;
    -webkit-align-items: stretch;
    -moz-align-items: stretch;
    -ms-align-items: stretch;
    -o-align-items: stretch;
    align-items: stretch;
    -webkit-justify-content: space-between;
    -moz-justify-content: space-between;
    -o-justify-content: space-between;
    -ms-justify-content: space-between;
    justify-content: space-between;
    flex-wrap: nowrap;
    -webkit-flex-wrap: nowrap;
    /* Legacy Browsers (IE 10)*/
    -webkit-box-pack: justify;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-box-align: center;
    -moz-box-align: center;
    -ms-flex-align: center;
  }
  #pecu-video .small-video-container .video-information-box {
    padding-top: 10px;
  }
}
@media all and (min-width: 861px) and (max-width: 1024px) {
  #pecu-video .small-video-container {
    display: grid;
    grid-gap: 10px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  #pecu-video .small-video-container .video-frame {
    width: 100%;
  }
  #pecu-video .small-video-container .video-container {
    display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
    display: -webkit-flex; /* Safari 7*/
    display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
    display: -ms-flexbox; /* IE10 */
    display: flex;
    -webkit-flex-direction: column;
    -webkit-box-orient: vertical; /* Safari <= 6*/
    -moz-flex-direction: column;
    -ms-flex-direction: column;
    -o-flex-direction: column;
    flex-direction: column;
    -webkit-align-items: stretch;
    -moz-align-items: stretch;
    -ms-align-items: stretch;
    -o-align-items: stretch;
    align-items: stretch;
    -webkit-justify-content: space-between;
    -moz-justify-content: space-between;
    -o-justify-content: space-between;
    -ms-justify-content: space-between;
    justify-content: space-between;
    flex-wrap: nowrap;
    -webkit-flex-wrap: nowrap;
    /* Legacy Browsers (IE 10)*/
    -webkit-box-pack: justify;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-box-align: center;
    -moz-box-align: center;
    -ms-flex-align: center;
  }
  #pecu-video .small-video-container .video-information-box {
    padding-top: 10px;
  }
}
@media all and (min-width: 1025px) {
  #pecu-video {
    display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
    display: -webkit-flex; /* Safari 7*/
    display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
    display: -ms-flexbox; /* IE10 */
    display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
    display: flex;
    /* Simulating 2012 flexbox model (used in IE 10) */
    /* Legacy Browsers (IE 10)*/
    -webkit-box-pack: justify;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-box-align: stretch;
    -moz-box-align: stretch;
    -ms-flex-align: stretch;
    /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
    box-lines: multiple;
    -moz-box-lines: multiple;
    -webkit-box-lines: multiple;
    /* For understanding browsers */
    -webkit-flex-direction: row;
    -moz-flex-direction: row;
    -ms-flex-direction: row;
    -o-flex-direction: row;
    flex-direction: row;
    -webkit-align-items: stretch;
    -moz-align-items: stretch;
    -ms-align-items: stretch;
    -o-align-items: stretch;
    align-items: stretch;
    -webkit-flex-flow: row wrap;
    -webkit-justify-content: space-between;
    -moz-justify-content: space-between;
    -o-justify-content: space-between;
    -ms-justify-content: space-between;
    justify-content: space-between;
    flex-wrap: wrap;
    -ms-flex-wrap: wrap; /* IE 10 */
    -webkit-flex-wrap: wrap;
  }
  #pecu-video .headlines {
    width: 100%;
  }
  #pecu-video .main-video {
    width: 58%;
  }
  #pecu-video .small-video-container {
    width: 40%;
    margin-top: 0;
  }
  #pecu-video .small-video-container .video-frame {
    width: 160px;
  }
}
@media all and (min-width: 1401px) {
  #pecu-video {
    position: relative;
    left: -24px;
    width: calc(100% + 2 * 24px);
  }
}

/*############################################
 *## Edit mode for videos
 *############################################*/
.in-converted-form #pecu-video {
  display: grid;
  grid-gap: 10px;
  grid-template-columns: repeat(6, minmax(0, 1fr));
}
.in-converted-form #pecu-video .main-video, .in-converted-form #pecu-video .small-video-container, .in-converted-form #pecu-video .add-new-video {
  grid-column-start: 1;
  grid-column-end: 7;
  width: 100%;
}
.in-converted-form .video-information-box {
  display: none;
}
.in-converted-form .video-on-edit-container {
  width: 100%;
  border-bottom: 1px solid #ffffff;
  padding-top: 20px;
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: flex;
  -webkit-flex-direction: column;
  -webkit-box-orient: vertical; /* Safari <= 6*/
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  -o-flex-direction: column;
  flex-direction: column;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: nowrap;
  -webkit-flex-wrap: nowrap;
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
}
.in-converted-form .video-on-edit-container.add-new-video {
  border-bottom: none;
}
.in-converted-form .video-on-edit-container .image-placeholder {
  height: 136px;
}
.in-converted-form .video-on-edit-container .video-link-hint {
  padding-top: 10px;
}
@media all and (min-width: 1) {
  .in-converted-form .video-on-edit-container {
    /* For understanding browsers */
    -webkit-flex-direction: row;
    -moz-flex-direction: row;
    -ms-flex-direction: row;
    -o-flex-direction: row;
    flex-direction: row;
    -webkit-flex-flow: row wrap;
  }
}
@media all and (min-width: 681px) {
  .in-converted-form #pecu-video .main-video, .in-converted-form #pecu-video .small-video-container, .in-converted-form #pecu-video .add-new-video {
    grid-column-end: 6;
  }
  .in-converted-form #pecu-video .small-video-container {
    display: grid;
    grid-gap: 10px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media all and (min-width: 1025px) {
  .in-converted-form #pecu-video .main-video, .in-converted-form #pecu-video .small-video-container, .in-converted-form #pecu-video .add-new-video {
    grid-column-end: 5;
  }
  .in-converted-form #pecu-video .small-video-container {
    display: grid;
    grid-gap: 10px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
@media all and (min-width: 1301px) {
  .in-converted-form #pecu-video .headlines.secondary {
    height: 50px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box !important;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
  }
  .in-converted-form #pecu-video .main-video {
    grid-column-end: 4;
  }
  .in-converted-form #pecu-video .video-on-edit-container {
    border-bottom: none;
  }
  .in-converted-form #pecu-video .small-video-container {
    padding-left: 14px;
    grid-column-start: 4;
    grid-column-end: 7;
    display: grid;
    grid-gap: 10px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .in-converted-form #pecu-video .add-new-video {
    grid-column-start: 4;
    grid-column-end: 7;
  }
}

/*############################################
 *## On UserMain Page
 *############################################*/
.usermain #pecu-video {
  grid-row: content-row7-start/content-row7-end;
  grid-column: content-col1-start/content-col12-end;
  left: 0;
  width: 100%;
  margin-bottom: 30px;
}
@media all and (min-width: 861px) {
  .usermain #pecu-video {
    width: calc(100% + 10px);
  }
}
@media all and (min-width: 1401px) {
  .usermain #pecu-video {
    left: -10px;
    width: calc(100% + 20px);
  }
}

/*############################################
 *## Default blog article (NOT a photo series)
 *############################################*/
#blogarticle.default {
  grid-row: content-row3-start/content-row3-end;
  grid-column: content-col1-start/content-col12-end;
  /*############################################
   *## Different widgets included into the text
   *############################################*/
}
@media all and (max-width: 1401px) {
  #blogarticle.default {
    padding-left: 10px;
  }
}
@media all and (max-width: 861px) {
  #blogarticle.default {
    padding-right: 10px;
  }
}
@media all and (min-width: 681px) {
  #blogarticle.default {
    grid-row: content-row2-start/content-row2-end;
    grid-column: content-col1-start/content-col12-end;
  }
}
@media all and (min-width: 681px) {
  #blogarticle.default {
    grid-row: content-row3-start/content-row3-end;
    grid-column: content-col1-start/content-col12-end;
  }
}
@media all and (min-width: 1401px) {
  #blogarticle.default {
    padding: 0 10px;
  }
}
#blogarticle.default .blogarticle-include {
  overflow: hidden;
  /*############################################
   *## Spotify song embeds
   *############################################*/
}
@media all and (min-width: 681px) {
  #blogarticle.default .blogarticle-include .weather-multiday-forecast {
    width: 70%;
  }
}
@media all and (min-width: 1151px) {
  #blogarticle.default .blogarticle-include .weather-multiday-forecast {
    width: 50%;
  }
}
#blogarticle.default .blogarticle-include .slopes-and-lifts .content-container, #blogarticle.default .blogarticle-include #snow .content-container {
  display: grid;
  grid-gap: 10px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
#blogarticle.default .blogarticle-include.webcam-container .carousel {
  background-color: #f1f1f1;
  padding: 10px;
}
#blogarticle.default .blogarticle-include.webcam-container .carousel .swiper-slide {
  width: 200px;
  margin-right: 10px;
  background-color: #ffffff;
  border: 1px solid #ccc;
}
#blogarticle.default .blogarticle-include.webcam-container .carousel .webcam-image {
  width: 100%;
  height: 120px;
  background-size: contain;
  background-repeat: no-repeat;
}
#blogarticle.default .blogarticle-include.webcam-container .carousel .webcam-name {
  padding: 10px;
}
#blogarticle.default .blogarticle-include.webcam-container .carousel .webcam-name a {
  font-size: 0.9rem;
  text-decoration: none;
}
#blogarticle.default .blogarticle-include .fresh-snow-container .bar-chart {
  height: 100px;
  padding-bottom: 50px;
}
#blogarticle.default .blogarticle-include iframe {
  padding-right: 10px;
  padding-bottom: 10px;
}
#blogarticle.default .blogarticle-include .show-details, #blogarticle.default .blogarticle-include .show-more-link {
  text-decoration: none;
  color: #0375b4;
  padding: 10px 0;
}
#blogarticle.default #condition-alert {
  margin: 0;
}
#blogarticle.default #condition-alert .collapsible-headline {
  display: none;
}

/*############################################
 *## Photo series blog article
 *############################################*/
#blogarticle.photo-series {
  grid-row: content-row1-start/content-row2-end;
  grid-column: content-col1-start/content-col12-end;
}
#blogarticle.photo-series .swiper-slide .photo-series-wrapper {
  height: 600px;
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: flex;
  -webkit-flex-direction: column;
  -webkit-box-orient: vertical; /* Safari <= 6*/
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  -o-flex-direction: column;
  flex-direction: column;
  -webkit-align-items: center;
  -moz-align-items: center;
  -ms-align-items: center;
  -o-align-items: center;
  align-items: center;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: nowrap;
  -webkit-flex-wrap: nowrap;
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
}
#blogarticle.photo-series .swiper-slide .photo-series-wrapper .image-link {
  display: block;
  width: 100%;
  flex-basis: 35%;
  -webkit-flex-basis: 35%;
  -moz-flex-basis: 35%;
  -ms-flex-basis: 35%;
  -o-flex-basis: 35%;
}
#blogarticle.photo-series .swiper-slide .photo-series-wrapper figcaption {
  margin-top: 10px;
  width: 80%;
  flex-grow: 1;
  -webkit-flex-grow: 1;
  -moz-flex-grow: 1;
  -ms-flex-grow: 1;
  -o-flex-grow: 1;
}
#blogarticle.photo-series .swiper-slide .photo-series-wrapper figcaption .copyright {
  padding: 10px;
  text-align: center;
}
#blogarticle.photo-series .swiper-slide .formatted-article {
  padding: 14px;
}
@media all and (min-width: 481px) {
  #blogarticle.photo-series .swiper-slide .photo-series-wrapper .image-link {
    flex-basis: 50%;
    -webkit-flex-basis: 50%;
    -moz-flex-basis: 50%;
    -ms-flex-basis: 50%;
    -o-flex-basis: 50%;
  }
}
@media all and (min-width: 681px) {
  #blogarticle.photo-series .swiper-slide .photo-series-wrapper .image-link {
    flex-basis: 80%;
    -webkit-flex-basis: 80%;
    -moz-flex-basis: 80%;
    -ms-flex-basis: 80%;
    -o-flex-basis: 80%;
  }
}

/*############################################
 *## Positioning on the grid depending on page type
 *############################################*/
.entitymain .ecu-text, .productmain .ecu-text {
  width: 100%;
  overflow-x: hidden;
  grid-row: content-row11-start/content-row11-end;
  grid-column: content-col1-start/content-col12-end;
}
@media all and (max-width: 1401px) {
  .entitymain .ecu-text, .productmain .ecu-text {
    padding-left: 10px;
  }
}
@media all and (max-width: 861px) {
  .entitymain .ecu-text, .productmain .ecu-text {
    padding-right: 10px;
  }
}
@media all and (min-width: 481px) {
  .entitymain .ecu-text, .productmain .ecu-text {
    grid-row: content-row8-start/content-row8-end;
  }
}
@media all and (min-width: 861px) {
  .entitymain .ecu-text, .productmain .ecu-text {
    overflow-x: initial;
  }
}

.productmain .textual-facts .headlines {
  padding-top: 0 !important;
}

/*############################################
 *## Module Styles
 *############################################*/
.ecu-text {
  background-color: #fafafa;
}
.ecu-text .read-more-label:not(.disable-content-fading) {
  background-image: linear-gradient(to bottom, rgba(241, 241, 241, 0) 0%, rgba(241, 241, 241, 0.5) 30%, #f1f1f1 50%) !important;
}
.ecu-text .show-more-content {
  max-height: 600px;
}
.ecu-text .headlines, .ecu-text .h {
  color: #0375b4;
}
.ecu-text #text0 .headlines {
  padding-top: 0;
}
.ecu-text .show-on-desktop {
  margin-top: 40px;
}
.ecu-text .show-on-desktop .divider-teaser-small {
  display: grid !important;
}
@media all and (min-width: 681px) {
  .ecu-text .pecufacts-underneath-text {
    display: grid;
    grid-gap: 30px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media all and (min-width: 1401px) {
  .ecu-text {
    padding-left: 14px;
    padding-right: 14px;
  }
}

.entitymain #facts #entity-facts-slopes, .entityzoomableimage #facts #entity-facts-slopes {
  order: 1;
}
.entitymain #facts #entity-facts-lifts, .entityzoomableimage #facts #entity-facts-lifts {
  order: 2;
}
.entitymain #facts #entity-facts-e_skiresort-common, .entityzoomableimage #facts #entity-facts-e_skiresort-common {
  order: 3;
}
.entitymain #facts #entity-facts-e_accommodation-common, .entityzoomableimage #facts #entity-facts-e_accommodation-common {
  order: 1;
}
.entitymain #facts #entity-facts-e_xcskiing-common, .entityzoomableimage #facts #entity-facts-e_xcskiing-common {
  order: 1;
}
.entitymain #facts #entity-facts-xctrails, .entityzoomableimage #facts #entity-facts-xctrails {
  order: 0;
}

@media all and (min-width: 481px) {
  .entityzoomableimage #entity-facts-e_xcskiing-common {
    grid-column-start: 1;
    grid-column-end: 3;
  }
}
@media all and (min-width: 481px) {
  .entityzoomableimage #entity-facts-e_xcskiing-common {
    grid-column-start: 3;
    grid-column-end: 4;
  }
}

/*############################################
 *## Module Styles
 *############################################*/
#entity-facts-e_accommodation-common {
  justify-content: flex-start !important;
}
#entity-facts-e_accommodation-common .collapsible-content {
  display: grid;
  grid-gap: 10px;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  height: auto !important;
}

#entity-facts-slopes .bar-chart, #entity-facts-xctrails .bar-chart {
  height: 90px;
}
@media all and (min-width: 481px) {
  #entity-facts-slopes .bar-chart .label, #entity-facts-xctrails .bar-chart .label {
    font-size: 0.84rem;
  }
}

#entity-facts-lifts .lift-icons {
  height: 90px;
  padding-left: 8px;
  display: grid;
  grid-gap: 10px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
#entity-facts-lifts .lift-icons .lift-icon {
  width: 24px;
  height: 24px;
  line-height: 24px;
  border-radius: 50%;
  background-color: #0375b4;
  color: #ffffff;
  display: block;
  position: relative;
  margin-bottom: 12px;
  text-align: center;
}
#entity-facts-lifts .lift-icons .lift-icon:before {
  z-index: -1;
  font-size: 1.6rem;
  width: 36px;
  height: 36px;
  line-height: 36px;
  border-radius: 50%;
  background-color: #ffffff;
  color: #0375b4;
  border: 2px solid #0375b4;
  position: absolute;
  top: 0;
  left: -28px;
}
@media all and (min-width: 481px) {
  #entity-facts-lifts {
    z-index: 0;
  }
}

/*############################################
 *## EntityFacts modules embedded in ECUText module
 *############################################*/
.pecufacts-underneath-text .pecufacts-block {
  width: 100%;
}

#skiresort-special-runs .special-runs {
  margin-top: 30px;
}
#skiresort-special-runs .special-run + .special-run {
  margin-top: 10px;
}
#skiresort-special-runs .special-run-name .value {
  text-align: left;
}
@media all and (min-width: 681px) {
  #skiresort-special-runs .special-run-grid {
    display: grid;
    grid-gap: 30px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

#skiresort-facts-snow {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: stretch;
  -moz-box-align: stretch;
  -ms-flex-align: stretch;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  box-lines: multiple;
  -moz-box-lines: multiple;
  -webkit-box-lines: multiple;
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-flex-flow: row wrap;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: wrap;
  -ms-flex-wrap: wrap; /* IE 10 */
  -webkit-flex-wrap: wrap;
}
#skiresort-facts-snow > div {
  width: 100%;
}
#skiresort-facts-snow > div:not(:last-child) {
  margin-bottom: 20px;
}
#skiresort-facts-snow .pie-chart {
  margin: 0 auto;
}
#skiresort-facts-snow #snow-history {
  flex-grow: 1;
}
#skiresort-facts-snow #snow-history .bar-chart {
  height: 140px;
  padding-top: 20px;
}
#skiresort-facts-snow #snow-history .label {
  text-align: center;
}
@media all and (min-width: 681px) {
  #skiresort-facts-snow .pecufacts-block {
    display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
    display: -webkit-flex; /* Safari 7*/
    display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
    display: -ms-flexbox; /* IE10 */
    display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
    display: flex;
    /* Simulating 2012 flexbox model (used in IE 10) */
    /* Legacy Browsers (IE 10)*/
    -webkit-box-pack: start;
    -moz-box-pack: start;
    -ms-flex-pack: start;
    -webkit-box-align: flex-end;
    -moz-box-align: flex-end;
    -ms-flex-align: flex-end;
    /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
    /* For understanding browsers */
    -webkit-flex-direction: row;
    -moz-flex-direction: row;
    -ms-flex-direction: row;
    -o-flex-direction: row;
    flex-direction: row;
    -webkit-align-items: flex-end;
    -moz-align-items: flex-end;
    -ms-align-items: flex-end;
    -o-align-items: flex-end;
    align-items: flex-end;
    -webkit-flex-flow: row nowrap;
    -webkit-justify-content: flex-start;
    -moz-justify-content: flex-start;
    -o-justify-content: flex-start;
    -ms-justify-content: flex-start;
    justify-content: flex-start;
    flex-wrap: nowrap;
    -ms-flex-wrap: nowrap; /* IE 10 */
    -webkit-flex-wrap: nowrap;
  }
  #skiresort-facts-snow .pecufacts-block .pie-chart {
    margin: 0 50px 0 0;
  }
}

#ski-infrastructure .skiresort-infrastructure {
  margin: 20px 0;
}
#ski-infrastructure .teaser-list .teaser-item {
  width: 30%;
  margin-right: 14px !important;
}

/*############################################
 *## ECUFeatures (ie. features of an accommodation)
 *############################################*/
.entitymain [class^=ecu-feature-], .entitymain [class*=" ecu-feature-"] {
  display: inline-block;
  width: 40px;
  height: 40px;
  line-height: 40px;
  text-align: center;
  border: 2px solid #0375b4;
  border-radius: 50%;
  /*############################################
   *## In case a lebel is displayed underneath the icons (i.e. 6 gondolas, 8 chair-lifts, ...)
   *############################################*/
}
.entitymain [class^=ecu-feature-]:not(:last-child), .entitymain [class*=" ecu-feature-"]:not(:last-child) {
  margin-right: 6px;
}
.entitymain [class^=ecu-feature-].no-border, .entitymain [class*=" ecu-feature-"].no-border {
  border: none !important;
}
.entitymain [class^=ecu-feature-]:before, .entitymain [class*=" ecu-feature-"]:before {
  font-family: TourispoWebfonts !important;
  font-weight: 400;
  font-style: normal;
  display: inline-block;
  font-size: 32px;
  color: #0375b4;
}
.entitymain [class^=ecu-feature-].disabled, .entitymain [class*=" ecu-feature-"].disabled {
  /* zoom and filter properties are used for IE compatibility */
  zoom: 1;
  filter: alpha(opacity=35);
  opacity: 0.35;
}
.entitymain [class^=ecu-feature-].small, .entitymain [class*=" ecu-feature-"].small {
  width: 30px;
  height: 30px;
}
.entitymain [class^=ecu-feature-].small:before, .entitymain [class*=" ecu-feature-"].small:before {
  line-height: 30px;
  font-size: 25px;
}
.entitymain [class^=ecu-feature-].with-label-underneath, .entitymain [class*=" ecu-feature-"].with-label-underneath {
  box-sizing: border-box;
  padding-top: 29px;
  margin-bottom: 16px;
}

.ecu-feature-wc:before {
  content: "\e628";
}

.ecu-feature-kiosk:before {
  content: "\e62a";
}

.ecu-feature-restaurant:before {
  content: "\e627";
}

.ecu-feature-camping:before {
  content: "\e626";
}

.ecu-feature-parking:before {
  content: "\e625";
}

.ecu-feature-fire:before {
  content: "\e624";
}

.ecu-feature-playground:before {
  content: "\e623";
}

.ecu-feature-dog:before {
  content: "\e622";
}

.ecu-feature-lodging:before {
  content: "\e621";
}

.ecu-feature-fitness:before {
  content: "\e620";
}

.ecu-feature-family:before {
  content: "\e61f";
}

.ecu-feature-boots:before {
  content: "\e61e";
}

.ecu-feature-wifi:before {
  content: "\e61d";
}

.ecu-feature-sun-lounger:before {
  content: "\e61c";
}

.ecu-feature-pool:before {
  content: "\e61b";
}

.ecu-feature-sauna:before {
  content: "\e61a";
}

.ecu-feature-tv:before {
  content: "\e629";
}

/*############################################
 *## Sterne bei Unterkünften
 *############################################*/
.editable-rating-stars .coollabel {
  top: -15px;
}
.editable-rating-stars .dropdown:after {
  top: 12px;
}

@media all and (min-width: 861px) {
  #skiresort-facts-snow .pecufacts-block {
    display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
    display: -webkit-flex; /* Safari 7*/
    display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
    display: -ms-flexbox; /* IE10 */
    display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
    display: flex;
    /* Simulating 2012 flexbox model (used in IE 10) */
    /* Legacy Browsers (IE 10)*/
    -webkit-box-pack: start;
    -moz-box-pack: start;
    -ms-flex-pack: start;
    -webkit-box-align: stretch;
    -moz-box-align: stretch;
    -ms-flex-align: stretch;
    /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
    /* For understanding browsers */
    -webkit-flex-direction: row;
    -moz-flex-direction: row;
    -ms-flex-direction: row;
    -o-flex-direction: row;
    flex-direction: row;
    -webkit-align-items: stretch;
    -moz-align-items: stretch;
    -ms-align-items: stretch;
    -o-align-items: stretch;
    align-items: stretch;
    -webkit-flex-flow: row nowrap;
    -webkit-justify-content: flex-start;
    -moz-justify-content: flex-start;
    -o-justify-content: flex-start;
    -ms-justify-content: flex-start;
    justify-content: flex-start;
    flex-wrap: nowrap;
    -ms-flex-wrap: nowrap; /* IE 10 */
    -webkit-flex-wrap: nowrap;
  }
  #skiresort-facts-snow .pecufacts-block .pie-chart {
    margin: 8px 0 0 0;
  }
  #skiresort-facts-snow .pecufacts-block .label-facts {
    margin-left: 30px;
  }
}
@media all and (min-width: 1401px) {
  #skiresort-facts-snow {
    display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
    display: -webkit-flex; /* Safari 7*/
    display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
    display: -ms-flexbox; /* IE10 */
    display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
    display: flex;
    /* Simulating 2012 flexbox model (used in IE 10) */
    /* Legacy Browsers (IE 10)*/
    -webkit-box-pack: justify;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-box-align: stretch;
    -moz-box-align: stretch;
    -ms-flex-align: stretch;
    /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
    /* For understanding browsers */
    -webkit-flex-direction: row;
    -moz-flex-direction: row;
    -ms-flex-direction: row;
    -o-flex-direction: row;
    flex-direction: row;
    -webkit-align-items: stretch;
    -moz-align-items: stretch;
    -ms-align-items: stretch;
    -o-align-items: stretch;
    align-items: stretch;
    -webkit-flex-flow: row nowrap;
    -webkit-justify-content: space-between;
    -moz-justify-content: space-between;
    -o-justify-content: space-between;
    -ms-justify-content: space-between;
    justify-content: space-between;
    flex-wrap: nowrap;
    -ms-flex-wrap: nowrap; /* IE 10 */
    -webkit-flex-wrap: nowrap;
  }
}
.entity-getting-there {
  margin-bottom: 20px;
}
.entity-getting-there.map-dependency {
  left: 20px;
  bottom: 20px;
}

.entity-price-container {
  grid-row: content-row1-start/content-row6-end;
  grid-column: content-col1-start/content-col12-end;
}
.entity-price-container .choose-curreny-header {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: start;
  -moz-box-pack: start;
  -ms-flex-pack: start;
  -webkit-box-align: stretch;
  -moz-box-align: stretch;
  -ms-flex-align: stretch;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: flex-start;
  -moz-justify-content: flex-start;
  -o-justify-content: flex-start;
  -ms-justify-content: flex-start;
  justify-content: flex-start;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
}
.entity-price-container .choose-curreny-header .currency-dropdown {
  margin-left: 10px;
}
.entity-price-container .price-remarks {
  margin: 10px;
}
.entity-price-container .collapsible-item {
  margin-top: 14px;
  margin-bottom: 14px;
}
.entity-price-container .collapsible-item .responsive-price-tables .table {
  width: 100%;
  flex-grow: 1;
  -webkit-flex-grow: 1;
  -moz-flex-grow: 1;
  -ms-flex-grow: 1;
  -o-flex-grow: 1;
  margin-bottom: 10px;
  table-layout: auto;
}
.entity-price-container .collapsible-item .responsive-price-tables .table .header-row td {
  height: 52px;
}
.entity-price-container .collapsible-item .responsive-price-tables .table .price-data-row td, .entity-price-container .collapsible-item .responsive-price-tables .table .header-sub-row td {
  height: 34px;
  line-height: 34px;
  text-align: left;
  padding-left: 10px;
}
.entity-price-container .collapsible-item .responsive-price-tables .table .price-data-row td .unit, .entity-price-container .collapsible-item .responsive-price-tables .table .header-sub-row td .unit {
  color: #727272;
  font-size: 0.64rem;
  position: relative;
  top: -4px;
}
.entity-price-container .collapsible-item .responsive-price-tables .table .header-sub-row span {
  transform: rotate(-26deg);
  width: 20px;
  display: block;
  position: relative;
  font-size: 0.74rem;
  bottom: -14px;
}
.entity-price-container .collapsible-item .responsive-price-tables .table .header-sub-row td {
  height: 60px;
  width: 25%;
}
.entity-price-container .collapsible-item .responsive-price-tables .table .annotation-link {
  width: 100%;
  display: block;
}
.entity-price-container .collapsible-item .responsive-price-tables .table td {
  padding-right: 6px;
}
.entity-price-container .collapsible-item .responsive-price-tables .table td.price-type {
  font-size: 0.84rem;
  font-weight: 300;
  padding: 0;
  white-space: nowrap;
  width: auto;
}
.entity-price-container .collapsible-item .responsive-price-tables .table .price-entry {
  line-height: 1.5;
}
.entity-price-container .collapsible-item .responsive-price-tables .table .price-entry .converted-price {
  font-size: 0.84rem;
}
@media all and (min-width: 681px) {
  .entity-price-container .collapsible-item .responsive-price-tables .table td.price-type {
    font-size: 0.9rem;
    font-weight: 700;
  }
  .entity-price-container .collapsible-item .responsive-price-tables .table .header-sub-row span {
    transform: rotate(0);
    width: auto;
    position: static;
    font-size: 0.9rem;
  }
  .entity-price-container .collapsible-item .responsive-price-tables .table .header-sub-row td {
    height: 20px;
    width: auto;
  }
}
@media all and (min-width: 1301px) {
  .entity-price-container .collapsible-item .responsive-price-tables {
    display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
    display: -webkit-flex; /* Safari 7*/
    display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
    display: -ms-flexbox; /* IE10 */
    display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
    display: flex;
    /* Simulating 2012 flexbox model (used in IE 10) */
    /* Legacy Browsers (IE 10)*/
    -webkit-box-pack: distribute;
    -moz-box-pack: distribute;
    -ms-flex-pack: distribute;
    -webkit-box-align: stretch;
    -moz-box-align: stretch;
    -ms-flex-align: stretch;
    /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
    /* For understanding browsers */
    -webkit-flex-direction: row;
    -moz-flex-direction: row;
    -ms-flex-direction: row;
    -o-flex-direction: row;
    flex-direction: row;
    -webkit-align-items: stretch;
    -moz-align-items: stretch;
    -ms-align-items: stretch;
    -o-align-items: stretch;
    align-items: stretch;
    -webkit-flex-flow: row nowrap;
    -webkit-justify-content: space-around;
    -moz-justify-content: space-around;
    -o-justify-content: space-around;
    -ms-justify-content: space-around;
    justify-content: space-around;
    flex-wrap: nowrap;
    -ms-flex-wrap: nowrap; /* IE 10 */
    -webkit-flex-wrap: nowrap;
  }
  .entity-price-container .collapsible-item .responsive-price-tables .main-season {
    width: 55%;
  }
  .entity-price-container .collapsible-item .responsive-price-tables .off-season {
    width: 45%;
  }
  .entity-price-container .collapsible-item .responsive-price-tables .off-season .price-type, .entity-price-container .collapsible-item .responsive-price-tables .off-season .first-col {
    display: none;
  }
  .entity-price-container .collapsible-item .responsive-price-tables .main-season + .off-season {
    margin-left: 10px;
  }
}
.entity-price-container .reductions .ui-icon-check {
  position: absolute;
}
.entity-price-container .reductions .value {
  margin-left: 34px;
}
.entity-price-container .label-checkbox-combo.parking + .parking {
  margin-left: 24px;
}

.in-converted-form .collapsible-item .responsive-price-tables .table .header-row td {
  height: 94px;
}

/*############################################
 *## Positioning on the grid depending on page type
 *############################################*/
.entitymain.skiresort #facts #entity-rates-preview {
  order: 3;
}
.entitymain.e_accommodation #facts #entity-rates-preview {
  order: 2;
}

/*############################################
 *## Module Styles
 *############################################*/
#entity-rates-preview .dropdown {
  margin-bottom: 10px;
}
@media all and (min-width: 481px) {
  #entity-rates-preview {
    padding: 10px;
  }
}

/*############################################
 *## Positioning on the grid depending on page type
 *############################################*/
.entitymain #entity-to-go {
  grid-row: content-row2-start/content-row2-end;
  grid-column: content-col1-start/content-col12-end;
}

/*############################################
 *## Module Styles
 *############################################*/
#entity-to-go {
  display: none;
}

/*############################################
 *## Positioning on the grid depending on page type
 *############################################*/
.entityzoomableimage #open-closed-feature-map {
  grid-row: content-row8-start/content-row8-end;
  grid-column: content-col1-start/content-col12-end;
  border-top: none;
  border-radius: 0 0 3px 3px;
  position: relative;
  top: calc(-8px - 4px);
  height: calc(100% + 8px + 4px);
  padding-top: 8px;
  padding-top: 0;
}
@media all and (min-width: 681px) {
  .entityzoomableimage #open-closed-feature-map {
    top: calc(-10px - 4px);
    height: calc(100% + 10px + 4px);
    padding-top: 10px;
  }
}
.entityzoomableimage #open-closed-feature-list {
  grid-row: content-row9-start/content-row9-end;
  grid-column: content-col1-start/content-col12-end;
}

.aggregatorentity #open-closed-feature-map {
  grid-row: content-row6-start/content-row6-end;
  grid-column: content-col1-start/content-col12-end;
}
.aggregatorentity #open-closed-feature-list {
  grid-row: content-row7-start/content-row7-end;
  grid-column: content-col1-start/content-col12-end;
}

#open-closed-feature-map {
  /*############################################
  *## Scaling Up Styles
  *############################################*/
}
#open-closed-feature-map .anymap-container {
  height: 200px;
}
#open-closed-feature-map .ol-attribution .open-closed-legend {
  bottom: 20px;
}
#open-closed-feature-map .ol-attribution .SkiresortOpenClosed {
  display: block;
}
#open-closed-feature-map .ol-attribution .Difficulty {
  display: none;
}

.e_skiresort .oc-item {
  grid-template-columns: 60px auto 60px;
}
.e_skiresort .oc-item.without-type {
  grid-template-columns: 60px auto;
}

.e_xcskiing .oc-item {
  grid-template-columns: 18% 50% 32%;
}
.e_xcskiing .oc-item.without-type {
  grid-template-columns: 60px auto;
}

@media all and (min-width: 681px) {
  .e_skiresort .oc-item {
    grid-template-columns: 80px auto 60px;
  }
  .e_skiresort .oc-item.without-type {
    grid-template-columns: 80px auto;
  }
  .e_xcskiing .oc-item {
    grid-template-columns: 80px auto 220px;
  }
  .e_xcskiing .oc-item.without-type {
    grid-template-columns: 80px auto;
  }
}
#open-closed-feature-list {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: flex;
  -webkit-flex-direction: column;
  -webkit-box-orient: vertical; /* Safari <= 6*/
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  -o-flex-direction: column;
  flex-direction: column;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: nowrap;
  -webkit-flex-wrap: nowrap;
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  /*############################################
   *## Scaling Up Styles
   *############################################*/
}
#open-closed-feature-list .collapsible-content {
  padding-left: 0;
  padding-right: 0;
}
#open-closed-feature-list #open-closed-features-2 {
  order: 1;
}
#open-closed-feature-list #open-closed-features-1 {
  margin-top: 8px;
  order: 2;
}
#open-closed-feature-list #open-closed-features-3 {
  order: 3;
}
#open-closed-feature-list .oc-item-list {
  display: grid;
  grid-gap: 10px;
  grid-template-columns: repeat(1, minmax(0, 1fr));
  width: 100%;
  margin-bottom: 10px;
}
#open-closed-feature-list .oc-item-list .headlines {
  width: 100%;
}
#open-closed-feature-list .oc-item {
  cursor: help;
  min-height: 44px;
  display: grid;
  grid-column-gap: 6px;
  /*############################################
   *## Status
   *############################################*/
}
#open-closed-feature-list .oc-item.header {
  font-weight: 700;
}
#open-closed-feature-list .oc-item > div {
  padding: 6px 10px;
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: flex;
  -webkit-flex-direction: column;
  -webkit-box-orient: vertical; /* Safari <= 6*/
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  -o-flex-direction: column;
  flex-direction: column;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-justify-content: center;
  -moz-justify-content: center;
  -o-justify-content: center;
  -ms-justify-content: center;
  justify-content: center;
  flex-wrap: nowrap;
  -webkit-flex-wrap: nowrap;
}
#open-closed-feature-list .oc-item:nth-child(odd) > div {
  background-color: #f1f1f1;
}
#open-closed-feature-list .oc-item:nth-child(even) > div {
  background-color: #fafafa;
}
#open-closed-feature-list .oc-item .status:before {
  margin: 0 auto;
  content: "";
  width: 30px;
  height: 30px;
  border-radius: 15px;
}
#open-closed-feature-list .oc-item .status.open:before {
  background-color: #42910e;
}
#open-closed-feature-list .oc-item .status.closed:before {
  background-color: #ff0000;
}
#open-closed-feature-list .oc-item .type {
  font-size: 0.84rem;
  -moz-hyphens: auto;
  -o-hyphens: auto;
  -webkit-hyphens: auto;
  -ms-hyphens: auto;
  hyphens: auto;
}
#open-closed-feature-list .oc-item .type.difficulty {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: start;
  -moz-box-pack: start;
  -ms-flex-pack: start;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: center;
  -moz-align-items: center;
  -ms-align-items: center;
  -o-align-items: center;
  align-items: center;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: flex-start;
  -moz-justify-content: flex-start;
  -o-justify-content: flex-start;
  -ms-justify-content: flex-start;
  justify-content: flex-start;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
}
#open-closed-feature-list .oc-item .type.difficulty:before {
  content: "";
  width: 24px;
  height: 24px;
  margin-right: 10px;
}
#open-closed-feature-list .oc-item .type.beginner:before {
  background-color: #42910e;
}
#open-closed-feature-list .oc-item .type.easy:before {
  background-color: #1042b5 !important;
}
#open-closed-feature-list .oc-item .type.intermediate:before {
  background-color: #ff0000 !important;
}
#open-closed-feature-list .oc-item .type.hard:before {
  background-color: #000 !important;
}
#open-closed-feature-list .oc-item .type.professional:before {
  background-color: #000;
}
#open-closed-feature-list .oc-item .type.route:before {
  background-color: #ff6e0e;
}
#open-closed-feature-list .oc-item .type:before, #open-closed-feature-list .oc-item .type:after {
  font-family: TourispoWebfonts !important;
  font-weight: 400;
  font-style: normal;
  display: inline-block;
  font-size: 1.6rem;
  width: 40px;
  height: 40px;
  line-height: 40px;
  text-align: center;
  color: #0375b4;
  flex-shrink: 0;
  margin-right: 6px;
}
#open-closed-feature-list .oc-item:before {
  flex-grow: 0;
  flex-shrink: 0;
  order: 1;
  -webkit-order: 1;
  -ms-order: 1;
}
#open-closed-feature-list .oc-item:after {
  flex-grow: 0;
  flex-shrink: 0;
  margin-right: 6px;
  margin-left: 6px;
  text-align: center;
  order: 2;
  -webkit-order: 2;
  -ms-order: 2;
}
#open-closed-feature-list .oc-item .label {
  order: 3;
  -webkit-order: 3;
  -ms-order: 3;
  flex-grow: 1;
}
@media all and (min-width: 681px) {
  #open-closed-feature-list .collapsible-content {
    padding-left: 10px;
    padding-right: 10px;
  }
}
@media all and (min-width: 1025px) {
  #open-closed-feature-list {
    /* For understanding browsers */
    -webkit-flex-direction: row;
    -moz-flex-direction: row;
    -ms-flex-direction: row;
    -o-flex-direction: row;
    flex-direction: row;
    -webkit-flex-flow: row wrap;
  }
  #open-closed-feature-list > div {
    min-width: 0;
    flex-basis: 0;
    flex-shrink: 1;
    -webkit-flex-shrink: 1;
    -moz-flex-shrink: 1;
    -ms-flex-shrink: 1;
    -o-flex-shrink: 1;
    flex-grow: 1;
    -webkit-flex-grow: 1;
    -moz-flex-grow: 1;
    -ms-flex-grow: 1;
    -o-flex-grow: 1;
    min-width: 360px;
    margin-top: 0 !important;
  }
  #open-closed-feature-list #open-closed-features-1 {
    margin-left: 14px;
  }
}

/*############################################
 *## Positioning on the grid depending on page type
 *############################################*/
.entitymain #facts #webcam-box {
  order: 8;
}
@media all and (min-width: 481px) {
  .entitymain.e_skiresort #webcam-box {
    grid-column-start: 1;
    grid-column-end: 3;
  }
}
@media all and (min-width: 1025px) {
  .entitymain.e_skiresort #webcam-box {
    grid-column-start: auto;
    grid-column-end: auto;
  }
}

/*############################################
 *## Module Styles
 *############################################*/
#webcam-box .condition-box div {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: stretch;
  -moz-box-align: stretch;
  -ms-flex-align: stretch;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  box-lines: multiple;
  -moz-box-lines: multiple;
  -webkit-box-lines: multiple;
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-flex-flow: row wrap;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: wrap;
  -ms-flex-wrap: wrap; /* IE 10 */
  -webkit-flex-wrap: wrap;
}
#webcam-box .condition-box .headlines, #webcam-box .condition-box .show-details {
  width: 100%;
}
#webcam-box .condition-box .webcambox-main-image, #webcam-box .condition-box .webcam-small-items {
  width: 49%;
  height: 100px;
}
#webcam-box .condition-box .webcam-small-items {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: stretch;
  -moz-box-align: stretch;
  -ms-flex-align: stretch;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  box-lines: multiple;
  -moz-box-lines: multiple;
  -webkit-box-lines: multiple;
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-flex-flow: row wrap;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: wrap;
  -ms-flex-wrap: wrap; /* IE 10 */
  -webkit-flex-wrap: wrap;
}
#webcam-box .condition-box .webcam-small-items .webcam-image {
  height: 48px;
  width: 49%;
}
#webcam-box .condition-box .webcam-image a {
  display: block;
  width: 100%;
  height: 100%;
}
#webcam-box .div-image {
  -webkit-background-size: cover;
  background-size: cover;
  background-repeat: no-repeat;
  width: 100%;
  height: 100%;
}
#webcam-box .webcam-small-items .image-container {
  height: 54px;
}

/*############################################
 *## PageType dependent placements
 *############################################*/
#page-entitymain #webcam-box {
  grid-row: content-row4-start/content-row4-end;
  grid-column: left/content-1st-half-col-end;
  -ms-grid-column: 2;
  height: 100%;
  /*############################################
   *## Scaling Up Styles
   *############################################*/
}
@media all and (min-width: 481px) {
  #page-entitymain #webcam-box {
    grid-row: content-row4-start/content-row4-end;
    grid-column: content-col5-start/content-col8-end;
    display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
    display: -webkit-flex; /* Safari 7*/
    display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
    display: -ms-flexbox; /* IE10 */
    display: flex;
    -webkit-flex-direction: column;
    -webkit-box-orient: vertical; /* Safari <= 6*/
    -moz-flex-direction: column;
    -ms-flex-direction: column;
    -o-flex-direction: column;
    flex-direction: column;
    -webkit-align-items: stretch;
    -moz-align-items: stretch;
    -ms-align-items: stretch;
    -o-align-items: stretch;
    align-items: stretch;
    -webkit-justify-content: space-between;
    -moz-justify-content: space-between;
    -o-justify-content: space-between;
    -ms-justify-content: space-between;
    justify-content: space-between;
    flex-wrap: nowrap;
    -webkit-flex-wrap: nowrap;
    /* Legacy Browsers (IE 10)*/
    -webkit-box-pack: justify;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-box-align: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    margin: 0 10px;
    height: 100%;
    width: 100%;
  }
  #page-entitymain #webcam-box > .element-contents {
    flex-grow: 1;
  }
  #page-entitymain #webcam-box > .element-contents .label-value-combo:first-child {
    margin-top: -4px;
  }
  #page-entitymain #webcam-box .element-image {
    max-width: 100%;
    margin-bottom: 10px;
  }
  #page-entitymain #webcam-box > .element-actions {
    padding-top: 10px;
    display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
    display: -webkit-flex; /* Safari 7*/
    display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
    display: -ms-flexbox; /* IE10 */
    display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
    display: flex;
    /* Simulating 2012 flexbox model (used in IE 10) */
    /* Legacy Browsers (IE 10)*/
    -webkit-box-pack: start;
    -moz-box-pack: start;
    -ms-flex-pack: start;
    -webkit-box-align: stretch;
    -moz-box-align: stretch;
    -ms-flex-align: stretch;
    /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
    /* For understanding browsers */
    -webkit-flex-direction: row;
    -moz-flex-direction: row;
    -ms-flex-direction: row;
    -o-flex-direction: row;
    flex-direction: row;
    -webkit-align-items: stretch;
    -moz-align-items: stretch;
    -ms-align-items: stretch;
    -o-align-items: stretch;
    align-items: stretch;
    -webkit-flex-flow: row nowrap;
    -webkit-justify-content: flex-start;
    -moz-justify-content: flex-start;
    -o-justify-content: flex-start;
    -ms-justify-content: flex-start;
    justify-content: flex-start;
    flex-wrap: nowrap;
    -ms-flex-wrap: nowrap; /* IE 10 */
    -webkit-flex-wrap: nowrap;
  }
  #page-entitymain #webcam-box > .element-actions > a:not(:first-child) {
    margin-left: 10px;
  }
}
@media all and (min-width: 481px) and (min-width: 481px) {
  #page-entitymain #webcam-box {
    margin: 0;
  }
}

/*############################################
 *## Inclusion on Snowreport Page of an entity
 *############################################*/
#page-aggregatorentity.c_snowreport #webcam-box {
  grid-row: content-row7-start/content-row7-end;
  grid-column: content-col1-start/content-col12-end;
}
@media all and (min-width: 1151px) {
  #page-aggregatorentity.c_snowreport #webcam-box {
    grid-row: content-row3-start/content-row3-end;
    grid-column: content-col9-start/content-col12-end;
  }
}

/*############################################
 *## Positioning on the grid depending on page type
 *############################################*/
/*############################################
 *## Module Styles
 *############################################*/
#entity-payment-options {
  grid-row: content-row7-start/content-row12-end;
  grid-column: content-col1-start/content-col12-end;
}
#entity-payment-options .ui-icon-check:before {
  color: #0375b4;
  margin-right: 10px;
}

.pecufacts-block .show-details {
  margin-top: 6px;
}

#page-entitymain.e_skiresort #pecu-facts-box1 {
  width: calc(100% + 6px);
  border-right: none;
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}
@media all and (min-width: 1401px) {
  #page-entitymain.e_skiresort #pecu-facts-box1 {
    width: calc(100% + 6px);
  }
}
#page-entitymain.e_skiresort #pecu-facts-box2 {
  position: relative;
  width: calc(100% + 6px);
  left: -6px;
  border-left: none;
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}

/*############################################
 *## Positioning on the grid depending on page type
 *############################################*/
.index #advanced-entity-search-preview {
  grid-row: content-row1-start/content-row1-end;
  grid-column: content-col1-start/content-col12-end;
}

/*############################################
 *## Module Styles
 *############################################*/
#advanced-entity-search-preview {
  margin-bottom: 30px;
}
#advanced-entity-search-preview .introduction {
  color: #727272;
  line-height: 1.3;
}
#advanced-entity-search-preview form .filters {
  background-color: #ffffff;
}
#advanced-entity-search-preview form .sliders {
  padding: 14px 0;
  margin-bottom: 14px;
  border-bottom: 1px #ccc solid;
}
#advanced-entity-search-preview form .sliders .filter:not(:last-child) {
  margin-bottom: 10px;
}
#advanced-entity-search-preview form .advanced-entity-search-preview__bottom {
  padding: 10px;
  flex-basis: 100%;
  -webkit-flex-basis: 100%;
  -moz-flex-basis: 100%;
  -ms-flex-basis: 100%;
  -o-flex-basis: 100%;
  background-color: #fafafa;
  border-top: 1px #ccc solid;
  width: calc(100% + 20px);
  margin-left: -10px;
  margin-bottom: -11px;
}
#advanced-entity-search-preview form .advanced-entity-search-preview__bottom button {
  margin: 0 auto;
}
#advanced-entity-search-preview form .countries .show-more-container .show-more-content {
  margin-top: 10px;
  max-height: 100px;
}
#advanced-entity-search-preview form .countries .show-more-container .read-more-label span {
  margin: 0 auto 20px auto;
}
@media all and (min-width: 681px) {
  #advanced-entity-search-preview .introduction {
    padding: 14px;
  }
  #advanced-entity-search-preview form .filters {
    display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
    display: -webkit-flex; /* Safari 7*/
    display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
    display: -ms-flexbox; /* IE10 */
    display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
    display: flex;
    /* Simulating 2012 flexbox model (used in IE 10) */
    /* Legacy Browsers (IE 10)*/
    -webkit-box-pack: justify;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-box-align: stretch;
    -moz-box-align: stretch;
    -ms-flex-align: stretch;
    /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
    box-lines: multiple;
    -moz-box-lines: multiple;
    -webkit-box-lines: multiple;
    /* For understanding browsers */
    -webkit-flex-direction: row;
    -moz-flex-direction: row;
    -ms-flex-direction: row;
    -o-flex-direction: row;
    flex-direction: row;
    -webkit-align-items: stretch;
    -moz-align-items: stretch;
    -ms-align-items: stretch;
    -o-align-items: stretch;
    align-items: stretch;
    -webkit-flex-flow: row wrap;
    -webkit-justify-content: space-between;
    -moz-justify-content: space-between;
    -o-justify-content: space-between;
    -ms-justify-content: space-between;
    justify-content: space-between;
    flex-wrap: wrap;
    -ms-flex-wrap: wrap; /* IE 10 */
    -webkit-flex-wrap: wrap;
  }
  #advanced-entity-search-preview form .sliders, #advanced-entity-search-preview form .countries {
    padding: 14px;
    flex-basis: 50%;
    -webkit-flex-basis: 50%;
    -moz-flex-basis: 50%;
    -ms-flex-basis: 50%;
    -o-flex-basis: 50%;
  }
  #advanced-entity-search-preview form .sliders {
    border-bottom: 0;
    border-right: 1px #ccc solid;
  }
}

#region-weather-container {
  grid-row: content-row2-start/content-row3-end;
  grid-column: content-col1-start/content-col12-end;
  margin-top: 10px;
}
#region-weather-container .region-weather {
  background-color: #ffffff;
  border-top: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
  padding: 10px;
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: flex-start;
  -moz-box-align: flex-start;
  -ms-flex-align: flex-start;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  box-lines: multiple;
  -moz-box-lines: multiple;
  -webkit-box-lines: multiple;
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: flex-start;
  -moz-align-items: flex-start;
  -ms-align-items: flex-start;
  -o-align-items: flex-start;
  align-items: flex-start;
  -webkit-flex-flow: row wrap;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: wrap;
  -ms-flex-wrap: wrap; /* IE 10 */
  -webkit-flex-wrap: wrap;
  margin-bottom: 20px;
}
#region-weather-container .region-weather > .element-actions {
  padding-top: 10px;
}
#region-weather-container .region-weather .link {
  width: 100%;
  font-size: 1.3rem;
  margin-bottom: 10px;
}
#region-weather-container .region-weather .orientation-map {
  width: 48%;
  max-width: 240px;
}
#region-weather-container .region-weather .weather-altitude-temps {
  width: 48%;
}
#region-weather-container .region-weather .weather-altitude-temps .separator {
  display: none;
}
#region-weather-container .region-weather .weather-altitude-temps .label {
  width: 50%;
  display: inline-block;
  text-align: right;
}
#region-weather-container .region-weather .flex-wrapper {
  width: 100%;
  margin-bottom: 14px;
}
#region-weather-container .region-weather .flex-wrapper .weather-altitude-temps {
  width: 100%;
  display: none;
}
#region-weather-container .region-weather .weather-text, #region-weather-container .region-weather .weather-forecast {
  width: 100%;
  margin-top: 14px;
}
#region-weather-container .region-weather .weather-forecast th {
  padding: 6px 0;
  text-align: center;
}
#region-weather-container .region-weather .weather-forecast td {
  padding: 6px 0;
  text-align: center;
}
#region-weather-container .region-weather .weather-forecast td .icon:before {
  margin: 0 auto;
}
#region-weather-container .region-weather .weather-forecast .icon {
  margin: 0 auto;
}
#region-weather-container .region-weather .current-region-weather {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: flex;
  -webkit-flex-direction: column;
  -webkit-box-orient: vertical; /* Safari <= 6*/
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  -o-flex-direction: column;
  flex-direction: column;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-justify-content: space-around;
  -moz-justify-content: space-around;
  -o-justify-content: space-around;
  -ms-justify-content: space-around;
  justify-content: space-around;
  flex-wrap: nowrap;
  -webkit-flex-wrap: nowrap;
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: distribute;
  -moz-box-pack: distribute;
  -ms-flex-pack: distribute;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  width: 100%;
}
#region-weather-container .region-weather .current-region-weather .weather-charts {
  order: 1;
  margin: 10px 0;
}
#region-weather-container .region-weather .current-region-weather .weather-forecast {
  order: 2;
}
#region-weather-container .region-weather .current-region-weather .weather-forecast th {
  height: 50px;
}
#region-weather-container .region-weather .current-region-weather .weather-forecast th div {
  font-size: 0.84rem;
  transform: rotate(-26deg);
  font-weight: 300;
  position: relative;
  top: 10px;
}
#region-weather-container .region-weather .current-region-weather .weather-forecast .skiresort-link {
  width: 70px;
  padding: 10px;
}
#region-weather-container .region-weather .current-region-weather .weather-forecast .skiresort-link a.link {
  font-size: 0.84rem;
}
@media all and (min-width: 681px) {
  #region-weather-container .region-weather .map-and-data.with-orientation-map {
    display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
    display: -webkit-flex; /* Safari 7*/
    display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
    display: -ms-flexbox; /* IE10 */
    display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
    display: flex;
    /* Simulating 2012 flexbox model (used in IE 10) */
    /* Legacy Browsers (IE 10)*/
    -webkit-box-pack: justify;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-box-align: flex-start;
    -moz-box-align: flex-start;
    -ms-flex-align: flex-start;
    /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
    /* For understanding browsers */
    -webkit-flex-direction: row;
    -moz-flex-direction: row;
    -ms-flex-direction: row;
    -o-flex-direction: row;
    flex-direction: row;
    -webkit-align-items: flex-start;
    -moz-align-items: flex-start;
    -ms-align-items: flex-start;
    -o-align-items: flex-start;
    align-items: flex-start;
    -webkit-flex-flow: row nowrap;
    -webkit-justify-content: space-between;
    -moz-justify-content: space-between;
    -o-justify-content: space-between;
    -ms-justify-content: space-between;
    justify-content: space-between;
    flex-wrap: nowrap;
    -ms-flex-wrap: nowrap; /* IE 10 */
    -webkit-flex-wrap: nowrap;
  }
  #region-weather-container .region-weather .map-and-data.with-orientation-map .orientation-map {
    margin-right: 20px;
  }
  #region-weather-container .region-weather .weather-altitude-temps {
    display: none;
  }
  #region-weather-container .region-weather .weather-altitude-temps .separator {
    display: inline;
  }
  #region-weather-container .region-weather .weather-altitude-temps .label {
    width: auto;
    display: inline;
    text-align: left;
  }
  #region-weather-container .region-weather .flex-wrapper .weather-altitude-temps {
    display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
    display: -webkit-flex; /* Safari 7*/
    display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
    display: -ms-flexbox; /* IE10 */
    display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
    display: flex;
    /* Simulating 2012 flexbox model (used in IE 10) */
    /* Legacy Browsers (IE 10)*/
    -webkit-box-pack: start;
    -moz-box-pack: start;
    -ms-flex-pack: start;
    -webkit-box-align: stretch;
    -moz-box-align: stretch;
    -ms-flex-align: stretch;
    /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
    /* For understanding browsers */
    -webkit-flex-direction: row;
    -moz-flex-direction: row;
    -ms-flex-direction: row;
    -o-flex-direction: row;
    flex-direction: row;
    -webkit-align-items: stretch;
    -moz-align-items: stretch;
    -ms-align-items: stretch;
    -o-align-items: stretch;
    align-items: stretch;
    -webkit-flex-flow: row nowrap;
    -webkit-justify-content: flex-start;
    -moz-justify-content: flex-start;
    -o-justify-content: flex-start;
    -ms-justify-content: flex-start;
    justify-content: flex-start;
    flex-wrap: nowrap;
    -ms-flex-wrap: nowrap; /* IE 10 */
    -webkit-flex-wrap: nowrap;
  }
  #region-weather-container .region-weather .flex-wrapper .weather-altitude-temps .separator {
    padding: 0 14px;
  }
  #region-weather-container .region-weather .orientation-map {
    width: 22%;
  }
  #region-weather-container .region-weather .flex-wrapper {
    width: 74%;
  }
  #region-weather-container.is-weather-of-current-region .flex-wrapper {
    width: 100%;
  }
  #region-weather-container.is-weather-of-current-region .horizontal-navigation--tabbed__content {
    height: 300px;
  }
}
@media all and (min-width: 861px) {
  #region-weather-container .region-weather .current-region-weather {
    display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
    display: -webkit-flex; /* Safari 7*/
    display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
    display: -ms-flexbox; /* IE10 */
    display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
    display: flex;
    /* Simulating 2012 flexbox model (used in IE 10) */
    /* Legacy Browsers (IE 10)*/
    -webkit-box-pack: distribute;
    -moz-box-pack: distribute;
    -ms-flex-pack: distribute;
    -webkit-box-align: stretch;
    -moz-box-align: stretch;
    -ms-flex-align: stretch;
    /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
    /* For understanding browsers */
    -webkit-flex-direction: row;
    -moz-flex-direction: row;
    -ms-flex-direction: row;
    -o-flex-direction: row;
    flex-direction: row;
    -webkit-align-items: stretch;
    -moz-align-items: stretch;
    -ms-align-items: stretch;
    -o-align-items: stretch;
    align-items: stretch;
    -webkit-flex-flow: row nowrap;
    -webkit-justify-content: space-around;
    -moz-justify-content: space-around;
    -o-justify-content: space-around;
    -ms-justify-content: space-around;
    justify-content: space-around;
    flex-wrap: nowrap;
    -ms-flex-wrap: nowrap; /* IE 10 */
    -webkit-flex-wrap: nowrap;
  }
  #region-weather-container .region-weather .current-region-weather .weather-charts {
    width: 40%;
    margin-right: 2%;
  }
  #region-weather-container .region-weather .current-region-weather .weather-forecast {
    width: 58%;
  }
}
@media all and (min-width: 1025px) {
  #region-weather-container .region-weather .flex-wrapper .weather-altitude-temps .separator {
    padding: 0 20px;
  }
}

#instant-login {
  z-index: 100;
  grid-row: login-row-start/login-row-end;
  grid-column: login-col-start/login-col-end;
}
#instant-login .login-visibility-toggler {
  height: 50px;
  margin-left: 10px;
}
#instant-login .login-visibility-toggler .login-link-text {
  line-height: 50px;
}
#instant-login .login-visibility-toggler .login-box {
  display: none;
  background-color: #ffffff;
  -webkit-box-shadow: 1px 1px 2px 1px #727272;
  box-shadow: 1px 1px 2px 1px #727272;
  padding: 10px;
  position: absolute;
  left: 0;
  right: 0;
}
#instant-login .login-visibility-toggler .login-box.active {
  display: block;
}
#instant-login .login-visibility-toggler .login-box button {
  width: 50%;
  margin: 10px 10px 10px 0;
}
#instant-login .login-visibility-toggler .login-box:after {
  content: "";
  position: absolute;
  top: -11px;
  left: 50%;
  margin-left: -10px;
  width: 20px;
  height: 20px;
  background-color: #ffffff;
  -o-transform: rotate(-45deg);
  transform: rotate(-45deg);
  border: 1px solid #ccc;
  border-left: none;
  border-bottom: none;
}
#instant-login .login-visibility-toggler .login-box #login-form-links {
  padding: 10px;
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: stretch;
  -moz-box-align: stretch;
  -ms-flex-align: stretch;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  box-lines: multiple;
  -moz-box-lines: multiple;
  -webkit-box-lines: multiple;
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-flex-flow: row wrap;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: wrap;
  -ms-flex-wrap: wrap; /* IE 10 */
  -webkit-flex-wrap: wrap;
}
@media all and (min-width: 481px) {
  #instant-login .login-visibility-toggler .login-box:after {
    left: 40%;
  }
}
@media all and (min-width: 681px) {
  #instant-login .login-link-text {
    color: #ffffff;
  }
  #instant-login .login-visibility-toggler {
    padding: 5px 0;
    height: calc(20px + 10px);
  }
  #instant-login .login-visibility-toggler .login-link-text {
    line-height: 20px;
  }
  #instant-login .login-visibility-toggler .login-box {
    top: calc(20px + 10px);
  }
  #instant-login .login-visibility-toggler .login-box:after {
    top: -5px;
    left: 22%;
    width: 10px;
    height: 10px;
  }
}
@media all and (min-width: 861px) {
  #instant-login .login-visibility-toggler .login-box:after {
    left: 10%;
  }
}
@media all and (min-width: 1025px) {
  #instant-login .login-visibility-toggler .login-box:after {
    left: 15%;
  }
}
@media all and (min-width: 1401px) {
  #instant-login .login-visibility-toggler .login-box {
    width: 992px;
    margin-left: max(61px, (100% - 1322px) / 2);
  }
  #instant-login .login-visibility-toggler .login-box:after {
    left: 50px;
  }
}

/*############################################
 *## The login form on the login-page
 *############################################*/
#login-page {
  grid-row: content-row1-start/content-row10-end;
  grid-column: content-col1-start/content-col12-end;
}
@media all and (max-width: 1401px) {
  #login-page {
    padding-left: 10px;
  }
}
@media all and (max-width: 861px) {
  #login-page {
    padding-right: 10px;
  }
}
#login-page button {
  width: 80%;
  display: block;
  margin: 20px auto;
}
#login-page #login-form-links {
  width: 80%;
  margin: 0 auto;
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  box-lines: multiple;
  -moz-box-lines: multiple;
  -webkit-box-lines: multiple;
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-flex-flow: row wrap;
  -webkit-justify-content: space-evenly;
  -moz-justify-content: space-evenly;
  -o-justify-content: space-evenly;
  -ms-justify-content: space-evenly;
  justify-content: space-evenly;
  flex-wrap: wrap;
  -ms-flex-wrap: wrap; /* IE 10 */
  -webkit-flex-wrap: wrap;
}
#login-page #login-form-links .link {
  padding-bottom: 10px;
}
@media all and (min-width: 681px) {
  #login-page {
    grid-row: content-row1-start/content-row10-end;
    grid-column: content-col3-start/content-col10-end;
  }
}
@media all and (min-width: 1151px) {
  #login-page button, #login-page #login-form-links {
    width: 60%;
  }
}

.login-decider .dialog__actions {
  -webkit-justify-content: center;
  -moz-justify-content: center;
  -o-justify-content: center;
  -ms-justify-content: center;
  justify-content: center;
}
.login-decider .dialog__actions .button + .button {
  margin-top: 20px;
}
@media all and (min-width: 681px) {
  .login-decider .dialog__actions .button + .button {
    margin-top: 0;
  }
}

#registration-form {
  grid-row: content-row1-start/content-row1-end;
  grid-column: content-col1-start/content-col12-end;
}
@media all and (max-width: 1401px) {
  #registration-form {
    padding-left: 10px;
  }
}
@media all and (max-width: 861px) {
  #registration-form {
    padding-right: 10px;
  }
}
#registration-form button:not(.dropdown-button2):not(.dropdown-button1) {
  margin-top: 14px;
}
#registration-form .optional-data-message .fonts.bold {
  display: block;
  padding: 10px 0;
}
#registration-form .form-checkboxes {
  margin-top: 20px;
}
#registration-form .choose-account-type .dropdown-container:last-child {
  margin-top: 20px;
}
@media all and (min-width: 681px) {
  #registration-form {
    display: block;
    grid-row: content-row1-start/content-row1-end;
    grid-column: content-col7-start/content-col12-end;
    position: relative;
    top: -20px;
  }
}

#logo {
  z-index: 14;
  grid-row: logo-row-start/logo-row-end;
  grid-column: logo-col-start/logo-col-end;
  text-align: center;
  max-width: 340px;
  height: 50px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100%;
  margin-left: 10px;
}
@media all and (min-width: 681px) {
  #logo {
    height: 74px;
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    z-index: 44;
  }
}

@media all and (min-width: 1751px) {
  .logged-in #logo {
    grid-row: logo-row-start/logo-row-end;
    grid-column: logo-col-start/content-col1-start;
    margin-right: 10px;
  }
}

#logo.logo-sgt {
  background-image: url(/images/desktop/modules/Logo/logo-ci-color-new-one-line.svg);
}
#logo.logo-so {
  background-image: url(/images/desktop/modules/Logo/logo-en-ci-color-new-one-line.svg);
}
@media all and (min-width: 681px) {
  #logo.logo-sgt {
    background-image: url(/images/desktop/modules/Logo/logo-ci-color-new-two-line.svg);
  }
}
@media all and (min-width: 861px) {
  #logo.logo-sgt {
    background-image: url(/images/desktop/modules/Logo/logo-ci-color-new-one-line.svg);
  }
}

#logo.logo-sgt {
  background-image: url(/images/desktop/modules/Logo/logo-ci-color-new-one-line.svg);
}
#logo.logo-so {
  background-image: url(/images/desktop/modules/Logo/logo-en-ci-color-new-one-line.svg);
}
@media all and (min-width: 681px) {
  #logo.logo-sgt {
    background-image: url(/images/desktop/modules/Logo/logo-ci-color-new-two-line.svg);
  }
}
@media all and (min-width: 861px) {
  #logo.logo-sgt {
    background-image: url(/images/desktop/modules/Logo/logo-ci-color-new-one-line.svg);
  }
}

#blogarticle-settings {
  display: none;
  grid-row: headline-row;
  grid-column: aside-col-start/aside-col-end;
}
@media all and (min-width: 861px) {
  #blogarticle-settings {
    display: block;
  }
}

.in-converted-form #blogarticle-settings {
  display: block;
}

#grid > .weather-station-switcher {
  grid-row: content-row2-start/content-row2-end;
  grid-column: content-col1-start/content-col12-end;
  background-color: #ffffff;
  padding: 10px;
}
@media all and (min-width: 681px) {
  #grid > .weather-station-switcher {
    grid-row: content-row3-start/content-row3-end;
    grid-column: content-col1-start/content-col12-end;
    margin-top: -10px;
  }
}
@media all and (min-width: 861px) {
  #grid > .weather-station-switcher {
    display: none;
  }
}

aside .weather-station-switcher {
  display: none;
}
@media all and (min-width: 861px) {
  aside .weather-station-switcher {
    display: block;
  }
}

/*##         Snowreport Page               ##*/
.aggregatorentity #snow-current {
  grid-row: content-row1-start/content-row1-end;
  grid-column: content-col1-start/content-col12-end;
}
.aggregatorentity #snow-powder-forecast {
  grid-row: content-row2-start/content-row2-end;
  grid-column: content-col1-start/content-col12-end;
}
.aggregatorentity #snow-terrain-status, .aggregatorentity #xc-trails-status {
  grid-row: content-row3-start/content-row3-end;
  grid-column: content-col1-start/content-col12-end;
}
.aggregatorentity #snow-weather-preview {
  grid-row: content-row4-start/content-row4-end;
  grid-column: content-col1-start/content-col12-end;
}
@media all and (min-width: 681px) {
  .aggregatorentity #snow-background {
    background-color: #f1f1f1;
    z-index: -2;
    width: 100%;
    height: 100%;
    grid-row: content-row1-start/content-row2-end;
    grid-column: content-col1-start/content-col12-end;
  }
  .aggregatorentity #snow-current {
    grid-row: content-row1-start/content-row1-end;
    grid-column: content-col1-start/content-col6-end;
    margin-left: 10px;
    margin-right: 0;
    width: calc(100% - 10px);
    margin-top: 10px;
    margin-bottom: 0;
    height: calc(100% - 10px);
    background-color: #ffffff;
    padding: 0 10px;
  }
}
@media all and (min-width: 681px) and (min-width: 481px) {
  .aggregatorentity #snow-current {
    padding: 10px;
  }
}
@media all and (min-width: 681px) {
  .aggregatorentity #snow-current .material-divider {
    border-bottom: none;
  }
  .aggregatorentity #snow-powder-forecast {
    grid-row: content-row2-start/content-row2-end;
    grid-column: content-col1-start/content-col6-end;
    margin-left: 10px;
    margin-right: 0;
    width: calc(100% - 10px);
    margin-bottom: 10px;
    margin-top: 0;
    height: calc(100% - 10px);
    background-color: #ffffff;
    padding: 0 10px;
  }
}
@media all and (min-width: 681px) and (min-width: 481px) {
  .aggregatorentity #snow-powder-forecast {
    padding: 10px;
  }
}
@media all and (min-width: 681px) {
  .aggregatorentity #snow-powder-forecast .material-divider {
    border-bottom: none;
  }
  .aggregatorentity #snow-terrain-status, .aggregatorentity #xc-trails-status {
    grid-row: content-row1-start/content-row1-end;
    grid-column: content-col7-start/content-col12-end;
    margin-right: 10px;
    margin-left: 0;
    width: calc(100% - 10px);
    margin-top: 10px;
    margin-bottom: 0;
    height: calc(100% - 10px);
    background-color: #ffffff;
    padding: 0 10px;
  }
}
@media all and (min-width: 681px) and (min-width: 481px) {
  .aggregatorentity #snow-terrain-status, .aggregatorentity #xc-trails-status {
    padding: 10px;
  }
}
@media all and (min-width: 681px) {
  .aggregatorentity #snow-terrain-status .material-divider, .aggregatorentity #xc-trails-status .material-divider {
    border-bottom: none;
  }
  .aggregatorentity #snow-weather-preview {
    grid-row: content-row2-start/content-row2-end;
    grid-column: content-col7-start/content-col12-end;
    margin-right: 10px;
    margin-left: 0;
    width: calc(100% - 10px);
    margin-bottom: 10px;
    margin-top: 0;
    height: calc(100% - 10px);
    background-color: #ffffff;
    padding: 0 10px;
  }
}
@media all and (min-width: 681px) and (min-width: 481px) {
  .aggregatorentity #snow-weather-preview {
    padding: 10px;
  }
}
@media all and (min-width: 681px) {
  .aggregatorentity #snow-weather-preview .material-divider {
    border-bottom: none;
  }
}

/*############################################
 *## Module specific styles
 *############################################*/
#snow-current {
  /*############################################
  *## Scaling Up Styles
  *############################################*/
}
#snow-current .label-value-combo span {
  text-align: center;
  display: block;
}
#snow-current .data {
  display: grid;
  grid-gap: 10px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-row-gap: 20px;
  grid-template-rows: auto 1fr;
}
#snow-current .last-snowfall, #snow-current .avalanche-warning-level {
  /* For understanding browsers */
  -webkit-flex-direction: column;
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  -o-flex-direction: column;
  flex-direction: column;
  -webkit-flex-flow: column wrap;
}
@media all and (min-width: 681px) and (max-width: 860px) {
  #snow-current .subheadline {
    display: none;
  }
}
@media all and (min-width: 681px) {
  #snow-current .pie-chart {
    position: relative;
  }
  #snow-current .pie-chart .pie-container {
    height: 48px;
    width: 100px;
    left: 50%;
    margin-left: -50px;
    overflow: hidden;
    position: absolute;
    box-sizing: content-box;
    padding: 2px;
  }
  #snow-current .pie-chart .pie-background {
    background-color: #ccc;
    position: absolute;
    width: 100px;
    height: 100px;
    border-radius: 50px;
    -moz-box-shadow: -1px 0 1px #727272;
    -webkit-box-shadow: -1px 0 1px #727272;
    -o-box-shadow: -1px 0 1px #727272;
    box-shadow: -1px 0 1px #727272;
  }
  #snow-current .pie-chart .pie-center {
    position: absolute;
    width: 80px;
    height: 80px;
    background-color: #ffffff;
    border-radius: 50%;
    left: 51px;
    top: 51px;
    margin-left: -40px;
    margin-top: -40px;
    box-shadow: inset 1px 1px 1px 0 #ccc;
  }
  #snow-current .pie-chart .pie {
    position: absolute;
    width: 100px;
    height: 100px;
    border-radius: 50%;
    clip: rect(0px, 100px, 50px, 0px);
  }
  #snow-current .pie-chart .pie {
    background-color: #0375b4;
  }
  #snow-current .pie-chart .value {
    width: 100%;
    padding-right: 5px;
    position: absolute;
  }
  #snow-current .pie-chart .value-line-two {
    line-height: 18px;
  }
}
@media all and (min-width: 1025px) {
  #snow-current .pie-chart {
    position: relative;
  }
  #snow-current .pie-chart .pie-container {
    height: 68px;
    width: 140px;
    left: 50%;
    margin-left: -70px;
    overflow: hidden;
    position: absolute;
    box-sizing: content-box;
    padding: 2px;
  }
  #snow-current .pie-chart .pie-background {
    background-color: #ccc;
    position: absolute;
    width: 140px;
    height: 140px;
    border-radius: 70px;
    -moz-box-shadow: -1px 0 1px #727272;
    -webkit-box-shadow: -1px 0 1px #727272;
    -o-box-shadow: -1px 0 1px #727272;
    box-shadow: -1px 0 1px #727272;
  }
  #snow-current .pie-chart .pie-center {
    position: absolute;
    width: 100px;
    height: 100px;
    background-color: #ffffff;
    border-radius: 50%;
    left: 71px;
    top: 71px;
    margin-left: -50px;
    margin-top: -50px;
    box-shadow: inset 1px 1px 1px 0 #ccc;
  }
  #snow-current .pie-chart .pie {
    position: absolute;
    width: 140px;
    height: 140px;
    border-radius: 50%;
    clip: rect(0px, 140px, 70px, 0px);
  }
  #snow-current .pie-chart .pie {
    background-color: #0375b4;
  }
  #snow-current .pie-chart .value {
    width: 100%;
    padding-right: 5px;
    position: absolute;
  }
}

#snow-terrain-status {
  /*############################################
  *## Scaling Up Styles
  *############################################*/
  /*############################################
  *## Scaling Up Styles
  *############################################*/
}
#snow-terrain-status .label-value-combo span {
  text-align: center;
  display: block;
}
#snow-terrain-status .data {
  display: grid;
  grid-gap: 10px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-row-gap: 20px;
  grid-template-rows: auto 1fr;
}
#snow-terrain-status .current-snow-conditions {
  /* For understanding browsers */
  -webkit-flex-direction: column;
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  -o-flex-direction: column;
  flex-direction: column;
  -webkit-flex-flow: column wrap;
}
@media all and (min-width: 681px) {
  #snow-terrain-status .pie-chart {
    position: relative;
  }
  #snow-terrain-status .pie-chart .pie-container {
    height: 48px;
    width: 100px;
    left: 50%;
    margin-left: -50px;
    overflow: hidden;
    position: absolute;
    box-sizing: content-box;
    padding: 2px;
  }
  #snow-terrain-status .pie-chart .pie-background {
    background-color: #ccc;
    position: absolute;
    width: 100px;
    height: 100px;
    border-radius: 50px;
    -moz-box-shadow: -1px 0 1px #727272;
    -webkit-box-shadow: -1px 0 1px #727272;
    -o-box-shadow: -1px 0 1px #727272;
    box-shadow: -1px 0 1px #727272;
  }
  #snow-terrain-status .pie-chart .pie-center {
    position: absolute;
    width: 80px;
    height: 80px;
    background-color: #ffffff;
    border-radius: 50%;
    left: 51px;
    top: 51px;
    margin-left: -40px;
    margin-top: -40px;
    box-shadow: inset 1px 1px 1px 0 #ccc;
  }
  #snow-terrain-status .pie-chart .pie {
    position: absolute;
    width: 100px;
    height: 100px;
    border-radius: 50%;
    clip: rect(0px, 100px, 50px, 0px);
  }
  #snow-terrain-status .pie-chart .pie {
    background-color: #0375b4;
  }
  #snow-terrain-status .pie-chart .value {
    width: 100%;
    padding-right: 5px;
    position: absolute;
  }
  #snow-terrain-status .pie-chart .value-line-two {
    line-height: 18px;
  }
}
@media all and (min-width: 1025px) {
  #snow-terrain-status .pie-chart {
    position: relative;
  }
  #snow-terrain-status .pie-chart .pie-container {
    height: 68px;
    width: 140px;
    left: 50%;
    margin-left: -70px;
    overflow: hidden;
    position: absolute;
    box-sizing: content-box;
    padding: 2px;
  }
  #snow-terrain-status .pie-chart .pie-background {
    background-color: #ccc;
    position: absolute;
    width: 140px;
    height: 140px;
    border-radius: 70px;
    -moz-box-shadow: -1px 0 1px #727272;
    -webkit-box-shadow: -1px 0 1px #727272;
    -o-box-shadow: -1px 0 1px #727272;
    box-shadow: -1px 0 1px #727272;
  }
  #snow-terrain-status .pie-chart .pie-center {
    position: absolute;
    width: 100px;
    height: 100px;
    background-color: #ffffff;
    border-radius: 50%;
    left: 71px;
    top: 71px;
    margin-left: -50px;
    margin-top: -50px;
    box-shadow: inset 1px 1px 1px 0 #ccc;
  }
  #snow-terrain-status .pie-chart .pie {
    position: absolute;
    width: 140px;
    height: 140px;
    border-radius: 50%;
    clip: rect(0px, 140px, 70px, 0px);
  }
  #snow-terrain-status .pie-chart .pie {
    background-color: #0375b4;
  }
  #snow-terrain-status .pie-chart .value {
    width: 100%;
    padding-right: 5px;
    position: absolute;
  }
}

#snow-powder-forecast {
  height: 100%;
}
#snow-powder-forecast .data {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: flex;
  -webkit-flex-direction: column;
  -webkit-box-orient: vertical; /* Safari <= 6*/
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  -o-flex-direction: column;
  flex-direction: column;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-justify-content: flex-start;
  -moz-justify-content: flex-start;
  -o-justify-content: flex-start;
  -ms-justify-content: flex-start;
  justify-content: flex-start;
  flex-wrap: nowrap;
  -webkit-flex-wrap: nowrap;
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: start;
  -moz-box-pack: start;
  -ms-flex-pack: start;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
}
#snow-powder-forecast .data .bar-chart {
  height: 90px;
  flex-grow: 1;
  width: 100%;
}
#snow-powder-forecast .data .bar-chart .label {
  font-size: 0.74rem;
  transform: rotate(-57deg);
}

#snow-weather-preview .data {
  display: grid;
  grid-gap: 10px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  text-align: center;
}
#snow-weather-preview .data .icon {
  width: inherit;
}
#snow-weather-preview .data .icon:before {
  margin: 0 auto;
  width: 50px;
  height: 50px;
  flex-shrink: 0;
  -webkit-flex-shrink: 0;
  -moz-flex-shrink: 0;
  -ms-flex-shrink: 0;
  -o-flex-shrink: 0;
}

/*############################################
 *## Some generic stuff valid across different modules
 *############################################*/
.avalance-warning {
  width: 34px;
  height: 34px;
  line-height: 34px;
  margin: 8px auto;
  display: block;
  text-align: center !important;
  position: relative;
  z-index: 0;
}
.avalance-warning:before {
  content: "";
  border: 1px solid #727272;
  width: 34px;
  height: 34px;
  transform: rotate(45deg);
  display: block;
  position: absolute;
  z-index: -1;
  background-color: #ccc;
}
.avalance-warning.level1:before {
  background-color: #88b733;
}
.avalance-warning.level2:before {
  background-color: #ffff00;
}
.avalance-warning.level3:before {
  background-color: #fe9e5f;
}
.avalance-warning.level4 {
  color: #ffffff;
}
.avalance-warning.level4:before {
  background-color: #ff0000;
}
.avalance-warning.level5 {
  color: #ffffff;
}
.avalance-warning.level5:before {
  background-color: #000;
}

.open-slopes-lifts-indicator .pie-container .pie-background {
  background-color: #ff0000 !important;
}
.open-slopes-lifts-indicator .pie-container .pie {
  background-color: #42910e !important;
}
.open-slopes-lifts-indicator.no-data-disabled .pie-background {
  background-color: #ccc !important;
}
.open-slopes-lifts-indicator.no-data-disabled .pie {
  background-color: #ccc !important;
}

#fresh-snow-forecast-preview .bar-chart {
  height: 74px;
}

/*############################################
 *## Positioning on the grid depending on page type
 *############################################*/
/*##         Snowreport Page               ##*/
.aggregatorentity #snow-history {
  grid-row: content-row8-start/content-row14-end;
  grid-column: content-col1-start/content-col12-end;
}

/*############################################
 *## Module Styles
 *############################################*/
#snow-history .snow-history-chart {
  height: 200px;
}
#snow-history .snow-history-chart > div {
  height: 200px;
}

/*############################################
 *## Survey detail page
 *############################################*/
#survey {
  grid-row: content-row2-start/content-row10-end;
  grid-column: content-col1-start/content-col12-end;
  margin-top: 20px;
}
@media all and (max-width: 1401px) {
  #survey {
    padding-left: 10px;
  }
}
@media all and (max-width: 861px) {
  #survey {
    padding-right: 10px;
  }
}

/*############################################
 *## Form to take part at the Survey => Is used on different pages (i.e. in aside sections)
 *############################################*/
#survey-participate {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: flex;
  -webkit-flex-direction: column;
  -webkit-box-orient: vertical; /* Safari <= 6*/
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  -o-flex-direction: column;
  flex-direction: column;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: nowrap;
  -webkit-flex-wrap: nowrap;
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
}
#survey-participate .survey-image {
  height: 200px;
  width: 100%;
  margin-bottom: 20px;
}
#survey-participate .survey-options {
  margin-bottom: 20px;
}
#survey-participate .surveyMail {
  margin-bottom: 20px;
}
#survey-participate .submit-survey-button {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: stretch;
  -moz-box-align: stretch;
  -ms-flex-align: stretch;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
  margin-top: 10px;
}
#survey-participate .submit-survey-button button {
  width: 200px;
}
#survey-participate .submit-survey-button .survey-additional-info-link {
  display: block;
  margin-left: 14px;
}

/*############################################
 *## Survey results (charts, etc...)
 *############################################*/
@media all and (min-width: 1401px) {
  .result-text {
    padding-left: 14px;
    padding-right: 14px;
  }
}

#survey-result {
  margin-top: 20px;
}
#survey-result .label-value-combo:last-child {
  border-bottom: none;
}
#survey-result .survey-data {
  margin-top: 20px;
  max-width: 600px;
}
#survey-result .feedback-message {
  margin-top: 20px;
  max-width: 600px;
}
@media all and (min-width: 1401px) {
  #survey-result {
    padding-left: 14px;
    padding-right: 14px;
  }
}

.sweepstake-container {
  grid-row: content-row2-start/content-row10-end;
  grid-column: content-col1-start/content-col12-end;
}
@media all and (max-width: 1401px) {
  .sweepstake-container {
    padding-left: 10px;
  }
}
@media all and (max-width: 861px) {
  .sweepstake-container {
    padding-right: 10px;
  }
}
.sweepstake-container .headlines.primary {
  color: #0375b4;
  -moz-hyphens: auto;
  -o-hyphens: auto;
  -webkit-hyphens: auto;
  -ms-hyphens: auto;
  hyphens: auto;
}
.sweepstake-container #sweepstake-questions .answer-possibility {
  padding-bottom: 10px;
}
.sweepstake-container #sweepstake-newsletter-data-protection .checkbox-container {
  padding: 6px 0;
}
.sweepstake-container #sweepstake-newsletter-data-protection .checkbox-container a {
  padding-left: 6px;
  -moz-hyphens: auto;
  -o-hyphens: auto;
  -webkit-hyphens: auto;
  -ms-hyphens: auto;
  hyphens: auto;
}
.sweepstake-container .material-divider {
  margin-bottom: 14px;
}
.sweepstake-container .zip-town-wrapper {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: center;
  -moz-align-items: center;
  -ms-align-items: center;
  -o-align-items: center;
  align-items: center;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
}
.sweepstake-container .zip-town-wrapper .formlib-element + .formlib-element {
  margin-left: 10px;
}
.sweepstake-container .dropdown {
  width: 100%;
}
.sweepstake-container .captcha-container {
  margin-top: 20px;
}
.sweepstake-container button.primary {
  margin-top: 14px;
}

@media all and (min-width: 681px) {
  #weather-background {
    background-color: #f1f1f1;
    z-index: -2;
    width: 100%;
    height: 100%;
    grid-row: content-row1-start/content-row3-end;
    grid-column: content-col1-start/content-col12-end;
  }
}
#next-days-forecast {
  position: relative;
  overflow-x: scroll;
}
@media all and (min-width: 681px) {
  #next-days-forecast {
    overflow-x: initial;
  }
}
#next-days-forecast .all-days-preview {
  overflow-y: scroll;
  text-align: center;
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: stretch;
  -moz-box-align: stretch;
  -ms-flex-align: stretch;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
}
#next-days-forecast .all-days-preview > li {
  width: 27vw;
  min-width: 80px !important;
  padding: 10px;
}
#next-days-forecast .all-days-preview > li.active {
  background-color: #d9eaf4;
  border-bottom: none;
  position: relative;
}
#next-days-forecast .all-days-preview > li.active .header {
  font-weight: 700;
}
#next-days-forecast .all-days-preview > li:hover {
  background-color: #d9eaf4;
  cursor: pointer;
}
#next-days-forecast .all-days-preview > li:hover .header {
  font-weight: 700;
}
#next-days-forecast .all-days-preview > li .icon {
  width: 50px;
  height: 50px;
  margin: 10px auto;
}
#next-days-forecast .all-days-preview > li .icon:before {
  width: 50px;
  height: 50px;
}
#next-days-forecast .all-days-preview > li .temp-min-max {
  height: 120px;
}
#next-days-forecast .all-days-preview > li .weather-indicator {
  width: 100%;
  font-size: 0.9rem;
  line-height: 2;
  padding: 0 10px;
}
#next-days-forecast .all-days-preview > li .text-description {
  font-size: 0.64rem;
  -moz-hyphens: auto;
  -o-hyphens: auto;
  -webkit-hyphens: auto;
  -ms-hyphens: auto;
  hyphens: auto;
  height: 60px;
  display: none;
}
#next-days-forecast .all-days-preview > li .precipitation .bar-chart {
  height: 60px;
  padding-bottom: 0;
  margin-top: 10px;
}
#next-days-forecast .all-days-preview > li .precipitation .bar-chart .bar:after {
  font-size: 0.74rem;
}
@media all and (min-width: 681px) {
  #next-days-forecast .all-days-preview li {
    padding: 6px;
    min-width: 0;
    flex-basis: 0;
    flex-shrink: 1;
    -webkit-flex-shrink: 1;
    -moz-flex-shrink: 1;
    -ms-flex-shrink: 1;
    -o-flex-shrink: 1;
    flex-grow: 1;
    -webkit-flex-grow: 1;
    -moz-flex-grow: 1;
    -ms-flex-grow: 1;
    -o-flex-grow: 1;
  }
  #next-days-forecast .all-days-preview li .header .fonts {
    font-size: 0.9rem;
  }
  #next-days-forecast .all-days-preview li .indicators .icon-with-label {
    font-size: 0.74rem;
  }
  #next-days-forecast .all-days-preview li .weather-indicator {
    padding: 0 6px;
  }
}
@media all and (min-width: 861px) {
  #next-days-forecast .all-days-preview .text-description {
    display: block;
    margin: 10px 0;
  }
}
@media all and (min-width: 1151px) {
  #next-days-forecast .all-days-preview li {
    padding: 10px;
  }
  #next-days-forecast .all-days-preview li .header .fonts {
    font-size: 1rem;
  }
  #next-days-forecast .all-days-preview li .weather-indicator {
    padding: 0 10px;
  }
}
@media all and (min-width: 1301px) {
  #next-days-forecast .all-days-preview li {
    padding: 10px;
  }
}
#next-days-forecast .arealine-chart {
  position: absolute;
  top: 108px;
  height: 150px;
}
#next-days-forecast .arealine-chart #temperature-chart {
  height: 150px;
}
#next-days-forecast .arealine-chart #temperature-chart .highcharts-yaxis-labels text {
  font-size: 0.74rem !important;
}
#next-days-forecast .arealine-chart.number-days-4 {
  left: calc(13.5vw - 14px);
  width: calc(108vw - 0.5 * 27vw - 6.5vw);
}
#next-days-forecast .arealine-chart.number-days-5 {
  left: calc(13.5vw - 14px);
  width: calc(135vw - 0.5 * 27vw - 6.5vw);
}
#next-days-forecast .arealine-chart.number-days-6 {
  left: calc(13.5vw - 14px);
  width: calc(162vw - 0.5 * 27vw - 6.5vw);
}
#next-days-forecast .arealine-chart.number-days-7 {
  left: calc(13.5vw - 14px);
  width: calc(189vw - 0.5 * 27vw - 6.5vw);
}
#next-days-forecast .arealine-chart.number-days-8 {
  left: calc(13.5vw - 14px);
  width: calc(216vw - 0.5 * 27vw - 6.5vw);
}
#next-days-forecast .arealine-chart.number-days-9 {
  left: calc(13.5vw - 14px);
  width: calc(243vw - 0.5 * 27vw - 6.5vw);
}
@media all and (min-width: 481px) {
  #next-days-forecast .arealine-chart.number-days-4 {
    left: calc(13.5vw - 20px);
    width: calc(108vw - 0.5 * 27vw - 7.6vw + 4vw);
  }
  #next-days-forecast .arealine-chart.number-days-5 {
    left: calc(13.5vw - 20px);
    width: calc(135vw - 0.5 * 27vw - 7.6vw + 3vw);
  }
  #next-days-forecast .arealine-chart.number-days-6 {
    left: calc(13.5vw - 20px);
    width: calc(162vw - 0.5 * 27vw - 7.6vw + 2vw);
  }
  #next-days-forecast .arealine-chart.number-days-7 {
    left: calc(13.5vw - 20px);
    width: calc(189vw - 0.5 * 27vw - 7.6vw + 1vw);
  }
  #next-days-forecast .arealine-chart.number-days-8 {
    left: calc(13.5vw - 20px);
    width: calc(216vw - 0.5 * 27vw - 7.6vw + 0vw);
  }
  #next-days-forecast .arealine-chart.number-days-9 {
    left: calc(13.5vw - 20px);
    width: calc(243vw - 0.5 * 27vw - 7.6vw + -1vw);
  }
}
@media all and (min-width: 681px) {
  #next-days-forecast .arealine-chart.number-days-4 {
    left: calc(12.5% - 50px);
    width: 88.5%;
  }
  #next-days-forecast .arealine-chart.number-days-5 {
    left: calc(10% - 50px);
  }
  #next-days-forecast .arealine-chart.number-days-6 {
    left: 5.5%;
    width: 88.5%;
  }
  #next-days-forecast .arealine-chart.number-days-7 {
    left: calc(7% - 50px);
    width: 94%;
  }
  #next-days-forecast .arealine-chart.number-days-8 {
    left: 4%;
    width: 91%;
  }
  #next-days-forecast .arealine-chart.number-days-9 {
    left: 3.2%;
    width: 92.7%;
  }
}

.chosen-day-details {
  background-color: #d9eaf4;
}
.chosen-day-details .detailed-weather ul {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: flex;
  -webkit-flex-direction: column;
  -webkit-box-orient: vertical; /* Safari <= 6*/
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  -o-flex-direction: column;
  flex-direction: column;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: nowrap;
  -webkit-flex-wrap: nowrap;
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
}
.chosen-day-details .detailed-weather ul li {
  flex-grow: 1;
  -webkit-flex-grow: 1;
  -moz-flex-grow: 1;
  -ms-flex-grow: 1;
  -o-flex-grow: 1;
  margin: 20px;
}
.chosen-day-details .detailed-weather ul li .headlines {
  text-align: center;
}
.chosen-day-details .detailed-weather ul li .symbol-and-temp {
  width: 80%;
  margin: 0 auto;
  line-height: 1.2;
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: stretch;
  -moz-box-align: stretch;
  -ms-flex-align: stretch;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
}
.chosen-day-details .detailed-weather ul li .symbol-and-temp img {
  width: 90px;
  margin-right: 10px;
}
@media all and (min-width: 681px) {
  .chosen-day-details .detailed-weather ul {
    /* For understanding browsers */
    -webkit-flex-direction: row;
    -moz-flex-direction: row;
    -ms-flex-direction: row;
    -o-flex-direction: row;
    flex-direction: row;
    -webkit-flex-flow: row wrap;
  }
  .chosen-day-details .detailed-weather ul li {
    margin: 10px;
  }
  .chosen-day-details .detailed-weather ul li .mobile-style-label-value {
    font-size: 0.9rem;
  }
}
@media all and (min-width: 1025px) {
  .chosen-day-details .detailed-weather ul li {
    margin: 14px;
  }
}
@media all and (min-width: 1151px) {
  .chosen-day-details .detailed-weather ul li {
    margin: 20px;
  }
  .chosen-day-details .detailed-weather ul li .mobile-style-label-value {
    font-size: 1rem;
  }
}

/*############################################
 *##
 *## HorizontalNavigation with other data (multi dayforecast, ...)
 *##
 *############################################*/
#weather__tabcontent {
  grid-row: content-row6-start/content-row6-end;
  grid-column: content-col1-start/content-col12-end;
}

/*############################################
 *##
 *## Weather of today
 *##
 *############################################*/
#weather__today__summary {
  grid-row: content-row1-start/content-row1-end;
  grid-column: content-col1-start/content-col12-end;
  background-color: white;
  padding: 10px;
  margin: 0 10px;
}
#weather__today__summary .data {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: stretch;
  -moz-box-align: stretch;
  -ms-flex-align: stretch;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
}
#weather__today__symbol {
  width: 30%;
}
#weather__today__symbol img {
  width: 100%;
  height: auto;
}

#weather__today__description {
  width: 67%;
}

#weather__today__temperatures {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: start;
  -moz-box-pack: start;
  -ms-flex-pack: start;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: center;
  -moz-align-items: center;
  -ms-align-items: center;
  -o-align-items: center;
  align-items: center;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: flex-start;
  -moz-justify-content: flex-start;
  -o-justify-content: flex-start;
  -ms-justify-content: flex-start;
  justify-content: flex-start;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
}
#weather__today__temperatures .min-max-temperatures {
  margin-left: 14px;
}

.weather__today__current-temperature {
  font-size: 3.6rem;
}

@media all and (min-width: 681px) {
  #weather__today__summary {
    grid-row: content-row1-start/content-row1-end;
    grid-column: content-col1-start/content-col6-end;
    margin-left: 10px;
    margin-right: 0;
    width: calc(100% - 10px);
    margin-top: 10px;
    margin-bottom: 0;
    height: calc(100% - 10px);
    background-color: #ffffff;
    padding: 0 10px;
  }
}
@media all and (min-width: 681px) and (min-width: 481px) {
  #weather__today__summary {
    padding: 10px;
  }
}
@media all and (min-width: 681px) {
  #weather__today__summary .material-divider {
    border-bottom: none;
  }
}

#weather__today__hourly-forecast {
  grid-row: content-row3-start/content-row3-end;
  grid-column: content-col1-start/content-col12-end;
  background-color: white;
  padding: 10px;
  margin: 0 10px;
  /*############################################
  *## Scaling Up Styles #weather__today__hourly-forecast
  *############################################*/
}
#weather__today__hourly-forecast .carousel__frame {
  padding-top: 10px;
}
#weather__today__hourly-forecast .carousel-slide {
  padding: 30px 6px 6px 14px;
  height: 70px;
  width: 100px;
  text-align: center;
}
#weather__today__hourly-forecast .carousel-slide.in-past {
  opacity: 0.3;
}
#weather__today__hourly-forecast .carousel-slide.first-of-day {
  border-left: 3px solid #ccc;
}
#weather__today__hourly-forecast .carousel-slide.first-of-day .today-tomorrow-divider {
  position: absolute;
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: stretch;
  -moz-box-align: stretch;
  -ms-flex-align: stretch;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
  top: -10px;
  left: -50%;
  width: 100%;
  color: #727272;
  font-size: 0.64rem;
  white-space: nowrap;
}
#weather__today__hourly-forecast .carousel-slide:before {
  margin: 0 auto;
  width: 38px;
  height: 38px;
}
#weather__today__hourly-forecast .carousel-slide:after {
  content: attr(data-hour);
  font-size: 0.64rem;
  color: #727272;
  position: absolute;
  top: 10px;
  right: 0;
  width: 100%;
  height: 12px;
  line-height: 12px;
}
#weather__today__hourly-forecast .swiper-button-prev:before {
  text-align: left;
}
#weather__today__hourly-forecast .swiper-button-next:before {
  text-align: right;
}
@media all and (min-width: 681px) {
  #weather__today__hourly-forecast {
    grid-row: content-row1-start/content-row1-end;
    grid-column: content-col7-start/content-col12-end;
    margin-right: 10px;
    margin-left: 0;
    width: calc(100% - 10px);
    margin-top: 10px;
    margin-bottom: 0;
    height: calc(100% - 10px);
    background-color: #ffffff;
    padding: 0 10px;
  }
}
@media all and (min-width: 681px) and (min-width: 481px) {
  #weather__today__hourly-forecast {
    padding: 10px;
  }
}
@media all and (min-width: 681px) {
  #weather__today__hourly-forecast .material-divider {
    border-bottom: none;
  }
}

#webcam-detail, #webcam-edit {
  grid-row: content-row1-start/content-row14-end;
  grid-column: content-col1-start/content-col12-end;
}

#webcam-detail #webcam-current img {
  width: 100%;
  object-fit: cover;
  object-position: right;
}
#webcam-detail #webcam-current figcaption {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: flex;
  -webkit-flex-direction: column;
  -webkit-box-orient: vertical; /* Safari <= 6*/
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  -o-flex-direction: column;
  flex-direction: column;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: nowrap;
  -webkit-flex-wrap: nowrap;
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
}
#webcam-detail #webcam-current figcaption .webcam-altitude {
  margin-top: 10px;
}
#webcam-detail #webcam-current .status-indicator {
  position: absolute;
  width: 100%;
  z-index: 1;
  top: 0;
}
#webcam-detail #webcam-current.livestream-webcam .webcam-image-container {
  width: 100%;
  height: 0;
  position: relative;
  padding-top: 60%;
}
#webcam-detail #webcam-current.livestream-webcam iframe {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  background-color: #ccc;
  background-size: 100%;
  background-repeat: no-repeat;
}
@media all and (min-width: 481px) {
  #webcam-detail #webcam-current.livestream-webcam .webcam-image-container {
    padding-top: 65%;
  }
}
@media all and (min-width: 681px) {
  #webcam-detail #webcam-current.livestream-webcam .webcam-image-container {
    padding-top: 62%;
  }
}
@media all and (min-width: 1025px) {
  #webcam-detail #webcam-current.livestream-webcam .webcam-image-container {
    padding-top: 60.5%;
  }
}
@media all and (min-width: 861px) {
  #webcam-detail #webcam-current figcaption {
    /* For understanding browsers */
    -webkit-flex-direction: row;
    -moz-flex-direction: row;
    -ms-flex-direction: row;
    -o-flex-direction: row;
    flex-direction: row;
    -webkit-flex-flow: row nowrap;
  }
  #webcam-detail #webcam-current figcaption .webcam-description {
    flex-basis: 70%;
    -webkit-flex-basis: 70%;
    -moz-flex-basis: 70%;
    -ms-flex-basis: 70%;
    -o-flex-basis: 70%;
  }
  #webcam-detail #webcam-current figcaption .webcam-altitude {
    flex-basis: 30%;
    padding-left: 20px;
    margin-top: 0;
  }
}
#webcam-detail #webcam-archive-today {
  margin-top: 20px;
}
#webcam-detail #webcam-archive-today #webcam-archive-today-cam-list {
  display: grid;
  grid-gap: 10px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
#webcam-detail #webcam-archive-today #webcam-archive-today-cam-list img {
  width: 100%;
  object-fit: cover;
  object-position: right;
}
#webcam-detail #webcam-archive-today #webcam-archive-today-cam-list span {
  display: block;
  color: #727272;
  padding: 6px;
  text-align: center;
}
@media all and (min-width: 481px) {
  #webcam-detail #webcam-archive-today #webcam-archive-today-cam-list {
    display: grid;
    grid-gap: 10px;
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}
@media all and (min-width: 681px) {
  #webcam-detail #webcam-archive-today #webcam-archive-today-cam-list {
    display: grid;
    grid-gap: 10px;
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }
}
#webcam-detail #webcam-archive .ui-datepicker-header {
  border-top: 0;
  padding: 0;
}
@media all and (min-width: 861px) {
  #webcam-detail #webcam-archive {
    margin-top: 20px;
  }
}

@media all and (max-width: 1401px) {
  #webcam-edit {
    padding-left: 10px;
  }
}
@media all and (max-width: 861px) {
  #webcam-edit {
    padding-right: 10px;
  }
}
#webcam-edit .image-url {
  margin-bottom: 20px;
}

.blogarticle-include.webcam-container.single-webcam {
  width: 360px;
  margin: 0 auto !important;
}
@media all and (min-width: 681px) {
  .blogarticle-include.webcam-container.single-webcam {
    width: 550px !important;
  }
}

#webcam-switcher ul {
  display: grid;
  grid-gap: 10px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-row-gap: 14px;
}
#webcam-switcher ul .webcam-wrapper .link {
  height: 120px;
  width: 100%;
  overflow: hidden;
}
#webcam-switcher ul .webcam-wrapper .item-image {
  cursor: pointer;
  width: 100%;
  object-fit: cover;
  object-position: right;
}
#webcam-switcher ul span {
  color: #727272;
  font-size: 0.84rem;
  padding: 10px 0;
}
@media all and (min-width: 481px) {
  #webcam-switcher ul {
    display: grid;
    grid-gap: 10px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
@media all and (min-width: 681px) {
  #webcam-switcher ul {
    display: grid;
    grid-gap: 10px;
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}
@media all and (min-width: 861px) {
  #webcam-switcher {
    max-height: 640px;
    overflow: auto;
  }
  #webcam-switcher ul {
    display: grid;
    grid-gap: 10px;
    grid-template-columns: repeat(1, minmax(0, 1fr));
  }
  #webcam-switcher ul .webcam-wrapper .link {
    height: 80px;
  }
}
@media all and (min-width: 1151px) {
  #webcam-switcher ul {
    display: grid;
    grid-gap: 10px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

#dashboard-background {
  grid-row: content-row1-start/content-row7-end;
  grid-column: content-col1-start/content-col12-end;
  background-color: #f1f1f1;
  width: 100%;
  height: 100%;
}
@media all and (min-width: 681px) {
  #dashboard-background {
    grid-row: content-row1-start/content-row2-end;
    grid-column: content-col1-start/content-col12-end;
  }
}
@media all and (min-width: 1025px) {
  #dashboard-background {
    grid-row: content-row1-start/content-row1-end;
    grid-column: content-col1-start/content-col12-end;
  }
}

#ecucreation-dashboard {
  grid-row: content-row1-start/content-row1-end;
  grid-column: content-col1-start/content-col12-end;
  margin: 10px 0 0 10px;
  background-color: #ffffff;
  padding: 10px;
  height: calc(100% - 10px);
  width: calc(100% - 20px);
}
#ecucreation-dashboard .entities {
  margin-top: 20px;
}
#ecucreation-dashboard .entities .link {
  padding-bottom: 10px;
}
@media all and (min-width: 681px) {
  #ecucreation-dashboard {
    grid-row: content-row1-start/content-row1-end;
    grid-column: content-col1-start/content-col6-end;
    width: calc(100% - 10px);
  }
}
@media all and (min-width: 1025px) {
  #ecucreation-dashboard {
    grid-row: content-row1-start/content-row1-end;
    grid-column: content-col1-start/content-col4-end;
    margin: 10px 0 10px 10px;
    height: calc(100% - 20px);
  }
}

#tutorials-linker {
  grid-row: content-row2-start/content-row2-end;
  grid-column: content-col1-start/content-col12-end;
  margin: 0 10px;
  background-color: #ffffff;
  padding: 10px;
  z-index: 1;
}
#tutorials-linker .video-wrapper {
  position: relative;
  margin-top: 20px;
}
#tutorials-linker .video-play-button {
  position: absolute;
  width: 80px;
  height: 60px;
  margin-left: -40px;
  margin-top: -30px;
  left: 50%;
  top: 50%;
  background-color: #ff0000;
  border-radius: 10px;
  cursor: pointer;
  z-index: 1;
}
#tutorials-linker .video-play-button:before {
  font-size: 1.3rem;
  color: white;
  width: 100%;
  text-align: center;
}
#tutorials-linker img {
  width: 100%;
}
@media all and (min-width: 681px) {
  #tutorials-linker {
    height: calc(100% - 10px);
    margin: 10px 10px 0 0;
    grid-row: content-row1-start/content-row1-end;
    grid-column: content-col7-start/content-col12-end;
  }
}
@media all and (min-width: 1025px) {
  #tutorials-linker {
    grid-row: content-row1-start/content-row1-end;
    grid-column: content-col5-start/content-col8-end;
    margin: 10px 0;
    height: calc(100% - 20px);
  }
}

#favourites-linker {
  grid-row: content-row3-start/content-row3-end;
  grid-column: content-col1-start/content-col12-end;
  margin: 0 10px;
  background-color: #ffffff;
  padding: 10px;
}
#favourites-linker .favourites {
  margin-top: 20px;
  display: grid;
  grid-gap: 10px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
#favourites-linker .favourites .item {
  background-color: #ccc;
  text-align: center;
}
#favourites-linker .favourites .item.has-image {
  background-color: #ffffff;
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: flex;
  -webkit-flex-direction: column;
  -webkit-box-orient: vertical; /* Safari <= 6*/
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  -o-flex-direction: column;
  flex-direction: column;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-justify-content: flex-start;
  -moz-justify-content: flex-start;
  -o-justify-content: flex-start;
  -ms-justify-content: flex-start;
  justify-content: flex-start;
  flex-wrap: nowrap;
  -webkit-flex-wrap: nowrap;
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: start;
  -moz-box-pack: start;
  -ms-flex-pack: start;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
}
#favourites-linker .favourites .item img {
  width: 100%;
  object-fit: cover;
}
#favourites-linker .favourites .item .link {
  padding: 6px;
}
@media all and (min-width: 681px) {
  #favourites-linker {
    grid-row: content-row2-start/content-row2-end;
    grid-column: content-col1-start/content-col12-end;
    margin: 0 10px 10px 10px;
  }
  #favourites-linker .favourites {
    display: grid;
    grid-gap: 10px;
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}
@media all and (min-width: 1025px) {
  #favourites-linker {
    height: calc(100% - 20px);
    margin: 10px 10px 10px 0;
    grid-row: content-row1-start/content-row1-end;
    grid-column: content-col9-start/content-col12-end;
  }
  #favourites-linker .favourites {
    display: grid;
    grid-gap: 10px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

#created-entities {
  grid-row: content-row4-start/content-row4-end;
  grid-column: content-col1-start/content-col12-end;
  margin: 0;
}
#created-entities #created-entities-collapsible {
  background-color: #ffffff;
  padding: 10px;
  margin: 0;
}
@media all and (min-width: 681px) {
  #created-entities {
    margin-top: 14px;
    padding: 0;
    grid-row: content-row3-start/content-row3-end;
    grid-column: content-col1-start/content-col12-end;
  }
  #created-entities #created-entities-collapsible {
    background-color: transparent;
    padding-right: 0;
  }
}

#visitor-statistics-your-entries {
  grid-row: content-row5-start/content-row5-end;
  grid-column: content-col1-start/content-col12-end;
  margin: 0 10px;
  background-color: #ffffff;
  padding: 10px;
}
@media all and (min-width: 681px) {
  #visitor-statistics-your-entries {
    margin-top: 50px;
    grid-row: content-row4-start/content-row4-end;
    grid-column: content-col1-start/content-col12-end;
  }
}

#visitor-statistics-your-favorites {
  grid-row: content-row6-start/content-row6-end;
  grid-column: content-col1-start/content-col12-end;
  margin: 0 10px;
  background-color: #ffffff;
  padding: 10px;
}
@media all and (min-width: 681px) {
  #visitor-statistics-your-favorites {
    margin-top: 50px;
    grid-row: content-row5-start/content-row5-end;
    grid-column: content-col1-start/content-col12-end;
  }
}

.statistic-radios-entity {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: start;
  -moz-box-pack: start;
  -ms-flex-pack: start;
  -webkit-box-align: stretch;
  -moz-box-align: stretch;
  -ms-flex-align: stretch;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: flex-start;
  -moz-justify-content: flex-start;
  -o-justify-content: flex-start;
  -ms-justify-content: flex-start;
  justify-content: flex-start;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
}
.statistic-radios-entity label {
  margin-right: 14px;
}

@media all and (min-width: 1151px) {
  .data-quality.on-list.lower {
    top: 92px !important;
  }
  .data-quality.on-list.c_snow_mountain_cm {
    top: 250px !important;
  }
}

.data-quality-on-detail-page .bottom-tab-navigation-tab .data-quality-dropdowns .collapsible-item {
  min-width: 0;
  flex-basis: 0;
  flex-shrink: 1;
  -webkit-flex-shrink: 1;
  -moz-flex-shrink: 1;
  -ms-flex-shrink: 1;
  -o-flex-shrink: 1;
  flex-grow: 1;
  -webkit-flex-grow: 1;
  -moz-flex-grow: 1;
  -ms-flex-grow: 1;
  -o-flex-grow: 1;
  margin: 0 10px;
}
.data-quality-on-detail-page .bottom-tab-navigation-tab .data-quality-dropdowns .crawler-site-url {
  overflow-wrap: break-word;
  word-wrap: break-word;
}
.data-quality-on-detail-page .bottom-tab-navigation-tab .data-quality-dropdowns form.controls {
  margin: 10px 0;
}
.data-quality-on-detail-page .bottom-tab-navigation-tab .data-quality-dropdowns form.controls .checkbox-label {
  line-height: 1.4;
}
.data-quality-on-detail-page .bottom-tab-navigation-tab .data-quality-dropdowns .crawler-values {
  margin: 10px 0;
}
.data-quality-on-detail-page .bottom-tab-navigation-tab .data-quality-dropdowns .crawler-values .label {
  font-size: 0.9rem;
}
.data-quality-on-detail-page .bottom-tab-navigation-tab .data-quality-dropdowns .crawler-values .quality-indicator {
  width: 60px;
  margin-left: 6px;
}
.data-quality-on-detail-page .bottom-tab-navigation-tab .data-quality-dropdowns .crawler-values .quality-indicator > div {
  width: 100%;
  text-align: center;
}
.data-quality-on-detail-page .bottom-tab-navigation-tab .new-crawler-site-button {
  margin-top: 10px;
  max-width: 240px;
}
.data-quality-on-detail-page .quality-indicator:before {
  color: #727272;
}
.data-quality-on-detail-page .flex-line {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: start;
  -moz-box-pack: start;
  -ms-flex-pack: start;
  -webkit-box-align: stretch;
  -moz-box-align: stretch;
  -ms-flex-align: stretch;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: flex-start;
  -moz-justify-content: flex-start;
  -o-justify-content: flex-start;
  -ms-justify-content: flex-start;
  justify-content: flex-start;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
}
.data-quality-on-detail-page .flex-line > * {
  padding: 0 10px;
}
@media all and (min-width: 861px) {
  .data-quality-on-detail-page .bottom-tab-navigation-tab .data-quality-dropdowns {
    display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
    display: -webkit-flex; /* Safari 7*/
    display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
    display: -ms-flexbox; /* IE10 */
    display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
    display: flex;
    /* Simulating 2012 flexbox model (used in IE 10) */
    /* Legacy Browsers (IE 10)*/
    -webkit-box-pack: justify;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-box-align: stretch;
    -moz-box-align: stretch;
    -ms-flex-align: stretch;
    /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
    /* For understanding browsers */
    -webkit-flex-direction: row;
    -moz-flex-direction: row;
    -ms-flex-direction: row;
    -o-flex-direction: row;
    flex-direction: row;
    -webkit-align-items: stretch;
    -moz-align-items: stretch;
    -ms-align-items: stretch;
    -o-align-items: stretch;
    align-items: stretch;
    -webkit-flex-flow: row nowrap;
    -webkit-justify-content: space-between;
    -moz-justify-content: space-between;
    -o-justify-content: space-between;
    -ms-justify-content: space-between;
    justify-content: space-between;
    flex-wrap: nowrap;
    -ms-flex-wrap: nowrap; /* IE 10 */
    -webkit-flex-wrap: nowrap;
  }
}

.entitymain.e_accommodation #entity-availability-preview {
  order: 4;
}

.entityvacancy #entity-availability-preview {
  grid-row: content-row1-start/content-row12-end;
  grid-column: content-col1-start/content-col12-end;
}
.entityvacancy #entity-availability-preview .swiper-button-prev, .entityvacancy #entity-availability-preview .swiper-button-next {
  top: 50px;
}
.entityvacancy #entity-availability-preview .collapsible-content.material-divider {
  padding-left: 0;
  padding-right: 0;
}
@media all and (min-width: 681px) {
  .entityvacancy #entity-availability-preview .inner-slide-container {
    display: grid;
    grid-gap: 10px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media all and (min-width: 861px) {
  .entityvacancy #entity-availability-preview .swiper-button-prev {
    left: 0;
  }
  .entityvacancy #entity-availability-preview .swiper-button-next {
    right: 0;
  }
}
@media all and (min-width: 1151px) {
  .entityvacancy #entity-availability-preview .inner-slide-container {
    display: grid;
    grid-gap: 10px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
@media all and (min-width: 1401px) {
  .entityvacancy #entity-availability-preview .inner-slide-container {
    display: grid;
    grid-gap: 10px;
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

#entity-availability-preview .swiper-button-prev {
  left: 0;
}
#entity-availability-preview .swiper-button-next {
  right: 0;
}
#entity-availability-preview .swiper-button-prev:not(.swiper-button-disabled), #entity-availability-preview .swiper-button-next:not(.swiper-button-disabled) {
  background-color: #0375b4;
}
#entity-availability-preview .swiper-button-prev:hover, #entity-availability-preview .swiper-button-next:hover {
  background-color: #171b2d;
}
#entity-availability-preview .inner-slide-container > div {
  width: 100% !important;
  padding-left: 6px;
  padding-right: 1px;
}
#entity-availability-preview .legend + .availability-container {
  margin-top: 10px;
}

#entity-filter {
  grid-row: content-row2-start/content-row2-end;
  grid-column: content-col1-start/content-col12-end;
  position: relative;
  top: calc(-8px - 0px);
  background-color: #ffffff;
  padding: 10px;
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: stretch;
  -moz-box-align: stretch;
  -ms-flex-align: stretch;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
}
@media all and (min-width: 681px) {
  #entity-filter {
    top: calc(-10px - 0px);
  }
}
#entity-filter > div {
  min-width: 0;
  flex-basis: 0;
  flex-shrink: 1;
  -webkit-flex-shrink: 1;
  -moz-flex-shrink: 1;
  -ms-flex-shrink: 1;
  -o-flex-shrink: 1;
  flex-grow: 1;
  -webkit-flex-grow: 1;
  -moz-flex-grow: 1;
  -ms-flex-grow: 1;
  -o-flex-grow: 1;
}
#entity-filter > div:not(:first-child) {
  margin-left: 20px;
}
#entity-filter .form-element {
  margin-bottom: 10px;
}
#entity-filter .form-element__main-input {
  flex-basis: 75%;
  -webkit-flex-basis: 75%;
  -moz-flex-basis: 75%;
  -ms-flex-basis: 75%;
  -o-flex-basis: 75%;
}
#entity-filter .form-element__output {
  flex-basis: 25%;
  -webkit-flex-basis: 25%;
  -moz-flex-basis: 25%;
  -ms-flex-basis: 25%;
  -o-flex-basis: 25%;
}
@media all and (min-width: 1025px) {
  #entity-filter {
    height: 300px;
    display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
    display: -webkit-flex; /* Safari 7*/
    display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
    display: -ms-flexbox; /* IE10 */
    display: flex;
    -webkit-flex-direction: column;
    -webkit-box-orient: vertical; /* Safari <= 6*/
    -moz-flex-direction: column;
    -ms-flex-direction: column;
    -o-flex-direction: column;
    flex-direction: column;
    -webkit-align-items: stretch;
    -moz-align-items: stretch;
    -ms-align-items: stretch;
    -o-align-items: stretch;
    align-items: stretch;
    -webkit-justify-content: space-between;
    -moz-justify-content: space-between;
    -o-justify-content: space-between;
    -ms-justify-content: space-between;
    justify-content: space-between;
    flex-wrap: nowrap;
    -webkit-flex-wrap: nowrap;
    /* Legacy Browsers (IE 10)*/
    -webkit-box-pack: justify;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-box-align: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    grid-row: content-row1-start/content-row1-end;
    grid-column: content-col9-start/content-col12-end;
  }
  #entity-filter > div {
    flex-basis: auto;
  }
  #entity-filter > div:not(:first-child) {
    margin-left: 0;
  }
  #entity-filter #entity-filter__container {
    height: 100%;
    display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
    display: -webkit-flex; /* Safari 7*/
    display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
    display: -ms-flexbox; /* IE10 */
    display: flex;
    -webkit-flex-direction: column;
    -webkit-box-orient: vertical; /* Safari <= 6*/
    -moz-flex-direction: column;
    -ms-flex-direction: column;
    -o-flex-direction: column;
    flex-direction: column;
    -webkit-align-items: stretch;
    -moz-align-items: stretch;
    -ms-align-items: stretch;
    -o-align-items: stretch;
    align-items: stretch;
    -webkit-justify-content: space-between;
    -moz-justify-content: space-between;
    -o-justify-content: space-between;
    -ms-justify-content: space-between;
    justify-content: space-between;
    flex-wrap: nowrap;
    -webkit-flex-wrap: nowrap;
    /* Legacy Browsers (IE 10)*/
    -webkit-box-pack: justify;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-box-align: center;
    -moz-box-align: center;
    -ms-flex-align: center;
  }
  #entity-filter .form-element__main-input {
    flex-basis: 70%;
    -webkit-flex-basis: 70%;
    -moz-flex-basis: 70%;
    -ms-flex-basis: 70%;
    -o-flex-basis: 70%;
  }
  #entity-filter .form-element__output {
    flex-basis: 30%;
    -webkit-flex-basis: 30%;
    -moz-flex-basis: 30%;
    -ms-flex-basis: 30%;
    -o-flex-basis: 30%;
  }
}
@media all and (min-width: 1301px) {
  #entity-filter {
    padding: 10px;
    height: 320px;
  }
}
@media all and (min-width: 1401px) {
  #entity-filter {
    height: 346px;
  }
}

.pecu-filter.filters-expanded {
  width: 100%;
}
.pecu-filter #pecuFilterBar {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: center;
  -moz-align-items: center;
  -ms-align-items: center;
  -o-align-items: center;
  align-items: center;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
  margin-bottom: 10px;
}
.pecu-filter #pecuFilterBar .sortfilter-dropdown {
  margin-right: 10px;
  height: 34px;
}
.pecu-filter #pecuFilterBar .sortfilter-dropdown:after {
  border-top: 6px solid #0375b4;
}
.pecu-filter #pecuFilterBar .sortfilter-dropdown label.coollabel {
  color: #0375b4;
}
.pecu-filter #pecuFilterBar .sortfilter-dropdown .progressindicator {
  position: absolute;
  left: 6px;
  top: 6px;
  background-color: white;
  color: #0375b4;
}
.pecu-filter #pecuFilterBar .sortfilter-dropdown .reset-dropdown {
  position: absolute;
  right: 1px;
  top: 4px;
  padding: 4px;
  z-index: 10;
  background-color: #ffffff;
}
.pecu-filter #pecuFilterBar .sortfilter-dropdown .dropdown-button1 {
  height: auto;
}
.pecu-filter #pecuFilterBar .sortfilter-dropdown .dropdown-button1 span {
  color: #0375b4;
  position: relative;
  left: -10px;
}
.pecu-filter #pecuFilterBar .sortfilter-dropdown .dropdown-button2 {
  height: auto;
  width: 34px;
}
.pecu-filter #pecuFilterBar .sortfilter-dropdown .dropdown-button2:before {
  position: relative;
  left: -8px;
}
.pecu-filter #pecuFilterBar .sortfilter-dropdown .dropdown-button2:after {
  border-top-color: #0375b4;
  top: 14px !important;
  right: 8px;
}
.pecu-filter #pecuFilterBar .sortfilter-dropdown .sort-icons {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: flex;
  -webkit-flex-direction: column;
  -webkit-box-orient: vertical; /* Safari <= 6*/
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  -o-flex-direction: column;
  flex-direction: column;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-justify-content: space-evenly;
  -moz-justify-content: space-evenly;
  -o-justify-content: space-evenly;
  -ms-justify-content: space-evenly;
  justify-content: space-evenly;
  flex-wrap: nowrap;
  -webkit-flex-wrap: nowrap;
  padding: 0 10px 0 6px;
}
.pecu-filter #pecuFilterBar .sortfilter-dropdown .sort-icons a:before {
  line-height: 0;
  color: #0375b4;
}
.pecu-filter #pecuFilterBar .sortfilter-dropdown .sort-icons a:hover:before, .pecu-filter #pecuFilterBar .sortfilter-dropdown .sort-icons a.active:before {
  color: #0375b4;
}
.pecu-filter #pecuFilterBar .sortfilter-dropdown .sort-icons a:first-child {
  margin-bottom: 2px;
}
.pecu-filter #pecuFilter {
  display: none;
}
.pecu-filter #pecuFilter.expanded {
  display: block;
  padding: 10px;
  position: absolute;
  top: 50px;
  z-index: 2;
  left: 0;
  right: 0;
  background-color: #ffffff;
  -webkit-box-shadow: 1px 1px 2px 1px #727272;
  box-shadow: 1px 1px 2px 1px #727272;
}
.pecu-filter #pecuFilter ul {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: flex;
  -webkit-flex-direction: column;
  -webkit-box-orient: vertical; /* Safari <= 6*/
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  -o-flex-direction: column;
  flex-direction: column;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: nowrap;
  -webkit-flex-wrap: nowrap;
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
}
.pecu-filter #pecuFilter ul li:not(:last-child) {
  border-bottom: 1px solid #ccc;
  margin-bottom: 14px;
}
.pecu-filter #pecuFilter ul li .filter {
  margin-bottom: 14px;
}
.pecu-filter #pecuFilter .filter-buttons {
  margin-top: 14px;
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: start;
  -moz-box-pack: start;
  -ms-flex-pack: start;
  -webkit-box-align: stretch;
  -moz-box-align: stretch;
  -ms-flex-align: stretch;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: flex-start;
  -moz-justify-content: flex-start;
  -o-justify-content: flex-start;
  -ms-justify-content: flex-start;
  justify-content: flex-start;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
}
.pecu-filter #pecuFilter .filter-buttons .reset {
  margin-left: 10px;
}
@media all and (min-width: 681px) {
  .pecu-filter .sortfilter-dropdown {
    width: 200px;
  }
  .pecu-filter #pecuFilter ul {
    /* For understanding browsers */
    -webkit-flex-direction: row;
    -moz-flex-direction: row;
    -ms-flex-direction: row;
    -o-flex-direction: row;
    flex-direction: row;
    -webkit-flex-flow: row nowrap;
  }
  .pecu-filter #pecuFilter ul li {
    flex-grow: 1;
    -webkit-flex-grow: 1;
    -moz-flex-grow: 1;
    -ms-flex-grow: 1;
    -o-flex-grow: 1;
  }
  .pecu-filter #pecuFilter ul li:not(:last-child) {
    border-bottom: none;
    margin-bottom: 0;
    padding-right: 14px;
    border-right: 1px solid #ccc;
  }
  .pecu-filter #pecuFilter ul li:not(:first-child) {
    border-bottom: none;
    margin-bottom: 0;
    padding-left: 14px;
  }
  .pecu-filter #pecuFilter ul.two-columns li {
    flex-basis: 50%;
    -webkit-flex-basis: 50%;
    -moz-flex-basis: 50%;
    -ms-flex-basis: 50%;
    -o-flex-basis: 50%;
  }
}

@media all and (max-width: 681px) {
  .ecu-list-sort-dropdown .dropdown-list {
    width: calc(100% - 20px) !important;
    right: 10px !important;
  }
}
@media all and (min-width: 681px) {
  .ecu-list-sort-dropdown .dropdown-list {
    width: 240px !important;
    right: 10px !important;
  }
}
.filter-result-container {
  z-index: 1000;
  top: 50px;
  left: 0;
  right: 0;
  bottom: 0;
  margin-left: 0 !important;
  margin-right: 0 !important;
  display: none;
  position: fixed !important;
  background-color: #ffffff;
  border-top: 1px solid #ccc;
  padding: 14px 10px;
  overflow-y: scroll;
}
.filter-result-container .pecu-filter {
  display: none;
}
.filter-result-container .pecu-filter .filter label {
  color: #0375b4;
  font-size: 0.9rem;
  line-height: 1.5;
}
.filter-result-container .ecu-list {
  padding: 0;
  max-width: 1300px;
  margin: 0 auto;
}
.filter-result-container .ecu-list .pagination {
  padding-top: 10px;
}
.filter-result-container .ecu-list .tile .tile__content {
  padding-bottom: 10px;
}
@media all and (min-width: 861px) {
  .filter-result-container .pecu-filter {
    display: block;
    margin-bottom: 10px;
  }
  .filter-result-container .pecu-filter .pecu-types {
    display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
    display: -webkit-flex; /* Safari 7*/
    display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
    display: -ms-flexbox; /* IE10 */
    display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
    display: flex;
    /* Simulating 2012 flexbox model (used in IE 10) */
    /* Legacy Browsers (IE 10)*/
    -webkit-box-pack: justify;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-box-align: stretch;
    -moz-box-align: stretch;
    -ms-flex-align: stretch;
    /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
    /* For understanding browsers */
    -webkit-flex-direction: row;
    -moz-flex-direction: row;
    -ms-flex-direction: row;
    -o-flex-direction: row;
    flex-direction: row;
    -webkit-align-items: stretch;
    -moz-align-items: stretch;
    -ms-align-items: stretch;
    -o-align-items: stretch;
    align-items: stretch;
    -webkit-flex-flow: row nowrap;
    -webkit-justify-content: space-between;
    -moz-justify-content: space-between;
    -o-justify-content: space-between;
    -ms-justify-content: space-between;
    justify-content: space-between;
    flex-wrap: nowrap;
    -ms-flex-wrap: nowrap; /* IE 10 */
    -webkit-flex-wrap: nowrap;
  }
  .filter-result-container .pecu-filter .pecu-types .filter + .filter {
    margin-left: 10px;
  }
}
@media all and (min-width: 1025px) {
  .filter-result-container {
    top: 104px;
  }
  .filter-result-container .pecu-filter {
    margin-bottom: 0;
  }
}
@media all and (min-width: 1401px) {
  .filter-result-container .tile-list {
    display: grid;
    grid-gap: 10px;
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }
}

.advanced-pecu-search {
  grid-row: tabnavi-row/content-row10-end;
  grid-column: content-col1-start/content-col12-end;
  position: relative;
}
.advanced-pecu-search nav {
  margin-top: 20px;
}
.advanced-pecu-search .material-divider + .material-divider {
  margin-top: 20px;
}
.advanced-pecu-search .action-buttons-upper {
  display: none;
}
.advanced-pecu-search .horizontal-navigation--tabbed__content {
  border-bottom: none;
}
.advanced-pecu-search .entity-facts-tab, .advanced-pecu-search .advanced-pecu-search-weather-snow-tab, .advanced-pecu-search .product-specific-filters {
  padding-top: 30px;
  display: grid;
  grid-gap: 30px;
  grid-template-columns: repeat(1, minmax(0, 1fr));
}
.advanced-pecu-search .entity-facts-tab .collapsible-content, .advanced-pecu-search .advanced-pecu-search-weather-snow-tab .collapsible-content, .advanced-pecu-search .product-specific-filters .collapsible-content {
  padding: 14px;
}
.advanced-pecu-search .entity-facts-tab .collapsible-content .threshold-filter + .threshold-filter, .advanced-pecu-search .advanced-pecu-search-weather-snow-tab .collapsible-content .threshold-filter + .threshold-filter, .advanced-pecu-search .product-specific-filters .collapsible-content .threshold-filter + .threshold-filter {
  margin-top: 10px;
}
.advanced-pecu-search .entity-facts-tab .collapsible-content .interval-filter + .interval-filter, .advanced-pecu-search .advanced-pecu-search-weather-snow-tab .collapsible-content .interval-filter + .interval-filter, .advanced-pecu-search .product-specific-filters .collapsible-content .interval-filter + .interval-filter {
  margin-top: 10px;
}
.advanced-pecu-search .entity-facts-tab .collapsible-content .threshold-filter + .mobile-style-checkbox, .advanced-pecu-search .advanced-pecu-search-weather-snow-tab .collapsible-content .threshold-filter + .mobile-style-checkbox, .advanced-pecu-search .product-specific-filters .collapsible-content .threshold-filter + .mobile-style-checkbox {
  margin-top: 14px;
}
.advanced-pecu-search .entity-facts-tab .collapsible-content .mobile-style-checkbox + .mobile-style-checkbox, .advanced-pecu-search .advanced-pecu-search-weather-snow-tab .collapsible-content .mobile-style-checkbox + .mobile-style-checkbox, .advanced-pecu-search .product-specific-filters .collapsible-content .mobile-style-checkbox + .mobile-style-checkbox {
  margin-top: 10px;
}
.advanced-pecu-search .entity-facts-tab .collapsible-content .option-filter-dropdown + .option-filter-dropdown, .advanced-pecu-search .advanced-pecu-search-weather-snow-tab .collapsible-content .option-filter-dropdown + .option-filter-dropdown, .advanced-pecu-search .product-specific-filters .collapsible-content .option-filter-dropdown + .option-filter-dropdown {
  margin-top: 10px;
}
.advanced-pecu-search .entity-facts-tab .collapsible-content .option-filter-dropdown + .threshold-filter, .advanced-pecu-search .advanced-pecu-search-weather-snow-tab .collapsible-content .option-filter-dropdown + .threshold-filter, .advanced-pecu-search .product-specific-filters .collapsible-content .option-filter-dropdown + .threshold-filter {
  margin-top: 14px;
}
.advanced-pecu-search .entity-facts-tab .collapsible-content .option-switcher, .advanced-pecu-search .advanced-pecu-search-weather-snow-tab .collapsible-content .option-switcher, .advanced-pecu-search .product-specific-filters .collapsible-content .option-switcher {
  margin-bottom: 20px;
  margin-top: 0;
}
.advanced-pecu-search .geo-filters .ui-icon-bullseye, .advanced-pecu-search .geo-filters .ui-icon-globe {
  display: none;
}
.advanced-pecu-search .geo-filters .filter-block {
  margin: 14px 0 0 56px;
}
.advanced-pecu-search .submit-filters {
  position: fixed;
  bottom: -1px;
  width: 100%;
  -webkit-box-shadow: 1px 1px 2px 1px #727272;
  box-shadow: 1px 1px 2px 1px #727272;
}
.advanced-pecu-search .submit-filters .enumeration, .advanced-pecu-search .submit-filters .headlines {
  display: none;
}
.advanced-pecu-search .submit-filters .action-buttons-lower {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: center;
  -moz-justify-content: center;
  -o-justify-content: center;
  -ms-justify-content: center;
  justify-content: center;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
  width: 100%;
}
.advanced-pecu-search .submit-filters .action-buttons-lower button {
  margin: 0 10px;
}
@media all and (min-width: 681px) {
  .advanced-pecu-search .action-buttons-upper {
    display: block;
    position: absolute;
    right: 10px;
    top: 10px;
    width: 314px;
    display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
    display: -webkit-flex; /* Safari 7*/
    display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
    display: -ms-flexbox; /* IE10 */
    display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
    display: flex;
    /* Simulating 2012 flexbox model (used in IE 10) */
    /* Legacy Browsers (IE 10)*/
    -webkit-box-pack: distribute;
    -moz-box-pack: distribute;
    -ms-flex-pack: distribute;
    -webkit-box-align: stretch;
    -moz-box-align: stretch;
    -ms-flex-align: stretch;
    /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
    /* For understanding browsers */
    -webkit-flex-direction: row;
    -moz-flex-direction: row;
    -ms-flex-direction: row;
    -o-flex-direction: row;
    flex-direction: row;
    -webkit-align-items: stretch;
    -moz-align-items: stretch;
    -ms-align-items: stretch;
    -o-align-items: stretch;
    align-items: stretch;
    -webkit-flex-flow: row nowrap;
    -webkit-justify-content: space-around;
    -moz-justify-content: space-around;
    -o-justify-content: space-around;
    -ms-justify-content: space-around;
    justify-content: space-around;
    flex-wrap: nowrap;
    -ms-flex-wrap: nowrap; /* IE 10 */
    -webkit-flex-wrap: nowrap;
  }
  .advanced-pecu-search .action-buttons-upper button + button {
    margin-left: 14px;
  }
  .advanced-pecu-search .entity-facts-tab, .advanced-pecu-search .advanced-pecu-search-weather-snow-tab, .advanced-pecu-search .product-specific-filters {
    display: grid;
    grid-gap: 30px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .advanced-pecu-search .geo-filters .geo-filter {
    display: grid;
    grid-gap: 10px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin-top: 14px;
  }
  .advanced-pecu-search .geo-filters label {
    margin: 0 auto;
    display: block;
    text-align: center;
    width: -moz-fit-content;
    width: fit-content;
  }
  .advanced-pecu-search .geo-filters .ui-icon-bullseye, .advanced-pecu-search .geo-filters .ui-icon-globe {
    display: block;
    margin: 0 auto;
    font-size: 3.6rem;
    width: fit-content;
    width: -moz-fit-content;
    color: #0375b4;
  }
  .advanced-pecu-search .geo-filters .filter-block {
    padding-left: 0;
    padding-right: 0;
  }
  .advanced-pecu-search .submit-filters {
    position: static;
    box-shadow: none;
  }
  .advanced-pecu-search .submit-filters .enumeration, .advanced-pecu-search .submit-filters .headlines {
    display: none;
  }
}
@media all and (min-width: 1151px) {
  .advanced-pecu-search .action-buttons-upper {
    width: auto;
  }
}

#advanced-pecu-search-e_skiresort-season .filter + .filter {
  margin-top: 14px;
}

#globalSearch {
  grid-row: header;
  -ms-grid-row: 1;
  grid-column: globalsearch-col-start/globalsearch-col-end;
}
#globalSearch .form-element--search {
  margin-top: 0;
}
#globalSearch .form-element__main-input {
  border-left: none;
  border-top: none;
  border-right: none;
}
@media all and (min-width: 681px) {
  #globalSearch .searchfield {
    display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
    display: -webkit-flex; /* Safari 7*/
    display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
    display: -ms-flexbox; /* IE10 */
    display: flex;
    -webkit-flex-direction: column;
    -webkit-box-orient: vertical; /* Safari <= 6*/
    -moz-flex-direction: column;
    -ms-flex-direction: column;
    -o-flex-direction: column;
    flex-direction: column;
    -webkit-align-items: center;
    -moz-align-items: center;
    -ms-align-items: center;
    -o-align-items: center;
    align-items: center;
    -webkit-justify-content: center;
    -moz-justify-content: center;
    -o-justify-content: center;
    -ms-justify-content: center;
    justify-content: center;
    flex-wrap: nowrap;
    -webkit-flex-wrap: nowrap;
  }
}
@media all and (min-width: 1401px) {
  #globalSearch {
    width: calc(100% + 10px);
  }
}
@media all and (min-width: 1401px) and (min-width: 1401px) {
  #globalSearch {
    width: calc(100% + 10px);
  }
}
@media all and (min-width: 1401px) {
  #globalSearch .form-element--search {
    padding-right: 0 !important;
  }
}

body.ajax-search-active #globalSearch {
  grid-row: headerbanner;
  grid-column: globalsearch-active-col-start/globalsearch-col-end;
}
body.ajax-search-active #globalSearch .form-element--search {
  height: 50px;
}
body.ajax-search-active #globalSearch #global-search-end-button {
  display: block;
  font-size: 2rem;
}
@media all and (min-width: 1025px) {
  body.ajax-search-active #globalSearch {
    grid-row: header;
    -ms-grid-row: 1;
    grid-column: globalsearch-active-col-start/globalsearch-col-end;
    height: 74px;
  }
  body.ajax-search-active #globalSearch #global-search-end-button {
    display: none;
  }
}
@media all and (min-width: 1151px) {
  body.ajax-search-active #globalSearch {
    width: 120%;
  }
}
@media all and (min-width: 1401px) {
  body.ajax-search-active #globalSearch {
    width: calc(100% + 10px);
  }
}
@media all and (min-width: 1401px) and (min-width: 1401px) {
  body.ajax-search-active #globalSearch {
    width: calc(100% + 10px);
  }
}

#globalSearch {
  height: 50px;
  text-align: right;
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  z-index: 41;
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: end;
  -moz-box-pack: end;
  -ms-flex-pack: end;
  -webkit-box-align: stretch;
  -moz-box-align: stretch;
  -ms-flex-align: stretch;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: flex-end;
  -moz-justify-content: flex-end;
  -o-justify-content: flex-end;
  -ms-justify-content: flex-end;
  justify-content: flex-end;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
}
#globalSearch form {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: stretch;
  -moz-box-align: stretch;
  -ms-flex-align: stretch;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
  position: relative;
  z-index: 1;
  height: 100%;
  -ms-transition: all 400ms ease 0s;
  transition: all 400ms ease 0s;
  -ms-transition-property: width;
  transition-property: width;
  width: 100%;
}
#globalSearch form .searchfield {
  order: 2;
  flex-grow: 1;
  -webkit-flex-grow: 1;
  -moz-flex-grow: 1;
  -ms-flex-grow: 1;
  -o-flex-grow: 1;
}
#globalSearch form #global-search-end-button {
  order: 1;
  width: 40px;
  display: none;
  color: #ffffff;
  background-color: #0375b4;
  height: 50px;
  line-height: 50px;
}
#globalSearch.is-active {
  z-index: 120;
}
@media all and (min-width: 1025px) {
  #globalSearch.has-focus {
    grid-row: header;
    -ms-grid-row: 1;
    grid-column: globalsearch-active-col-start/globalsearch-col-end;
  }
  #globalSearch.has-focus form {
    width: 100%;
  }
  #globalSearch.has-focus .form-element--search {
    height: 100%;
  }
}
#globalSearch .form-element--search {
  background-color: #0375b4;
  padding: 0 10px;
  height: 100%;
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: flex;
  -webkit-flex-direction: column;
  -webkit-box-orient: vertical; /* Safari <= 6*/
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  -o-flex-direction: column;
  flex-direction: column;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-justify-content: center;
  -moz-justify-content: center;
  -o-justify-content: center;
  -ms-justify-content: center;
  justify-content: center;
  flex-wrap: nowrap;
  -webkit-flex-wrap: nowrap;
}
#globalSearch .form-element--search input[type=search] {
  height: 32px;
  width: 100%;
  flex-basis: auto;
  -webkit-flex-basis: auto;
  -moz-flex-basis: auto;
  -ms-flex-basis: auto;
  -o-flex-basis: auto;
  background-image: none;
  padding-left: 10px;
  border-bottom: 2px solid #0375b4;
  color: #0375b4;
}
#globalSearch .form-element--search input[type=search]::-moz-placeholder {
  opacity: 1;
  color: #0375b4;
}
#globalSearch .form-element--search input[type=search]:-moz-placeholder {
  opacity: 1;
  color: #0375b4;
}
#globalSearch .form-element--search input[type=search]::-webkit-input-placeholder {
  opacity: 1;
  color: #0375b4;
}
#globalSearch .form-element--search input[type=search]::-webkit-input-placeholder:-ms-input-placeholder {
  opacity: 1;
  color: #0375b4;
}
#globalSearch button {
  position: absolute !important;
  background-color: #ffffff;
  top: 12px;
  border-radius: 0;
  box-shadow: none;
  width: 26px;
  min-width: 0;
  height: 26px;
  min-height: 0;
  font-size: 0;
  padding-left: 14px !important;
}
#globalSearch button.globalsearch {
  right: 60px;
}
#globalSearch button.localsearch {
  right: 32px;
}
#globalSearch button:before {
  background-color: #ffffff;
  color: #0375b4;
  border-radius: 0 !important;
  font-size: 20px !important;
  width: 26px !important;
  height: 26px !important;
}
@media all and (max-width: 1025px) {
  #globalSearch.is-active:after {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ffffff;
    content: "";
  }
  #globalSearch.is-active .form-element--search {
    width: 100%;
  }
}
@media all and (min-width: 681px) {
  #globalSearch:not(.is-active) {
    top: 10px;
    margin: auto 0;
  }
  #globalSearch:not(.is-active) form {
    width: 300px;
  }
  #globalSearch:not(.is-active) .form-element--search {
    background-color: #ffffff;
  }
  #globalSearch:not(.is-active) button {
    top: 12px;
  }
  #globalSearch:not(.is-active) button.globalsearch {
    right: 32px;
  }
  #globalSearch:not(.is-active) button.localsearch {
    right: 4px;
  }
}
@media all and (min-width: 861px) {
  #globalSearch:not(.is-active) form {
    width: 260px;
  }
}
@media all and (min-width: 1025px) {
  #globalSearch .form-element--search {
    background-color: #ffffff;
  }
  #globalSearch.is-active .form-element--search {
    width: 100%;
  }
  #globalSearch button {
    top: 22px;
  }
  #globalSearch button.progressindicator {
    right: 50px;
  }
}
@media all and (min-width: 1301px) {
  #globalSearch form {
    width: 300px;
  }
}

.filter-result-container .end-global-search-label {
  font-weight: 700;
}
.filter-result-container .end-global-search-label:before {
  font-size: 1.6rem;
  margin-right: 6px;
}
.filter-result-container .toggle-pecu-filter {
  position: absolute;
  top: 0;
  right: 0;
  font-size: 1.6rem;
}
@media all and (min-width: 861px) {
  .filter-result-container .toggle-pecu-filter {
    display: none;
  }
}

#create-review-entity-search {
  grid-row: tabnavi-row/content-row10-end;
  grid-column: content-col1-start/content-col12-end;
  margin-bottom: 100px;
}
@media all and (max-width: 1401px) {
  #create-review-entity-search {
    padding-left: 10px;
  }
}
@media all and (max-width: 861px) {
  #create-review-entity-search {
    padding-right: 10px;
  }
}
#create-review-entity-search .global-entity-search-image {
  height: 200px;
  background: no-repeat center center;
  -webkit-background-size: cover;
  background-size: cover;
  width: 100%;
}

.skigebiete-test-de #create-review-entity-search .global-entity-search-image {
  background-image: url("/images/desktop/modules/StaticContent/skigebietscheck.jpg");
}

body.ajax-search-active {
  height: 100vh;
  overflow: hidden;
}
body.ajax-search-active #globalSearch #global-search-autocomplete-container {
  position: fixed;
  top: 53px;
  left: 0;
  width: 100%;
  bottom: 0;
  box-shadow: rgba(0, 0, 0, 0.12) 0px 1px 6px, rgba(0, 0, 0, 0.12) 0px 1px 4px;
  background-color: #ffffff;
  padding-bottom: 56px;
}
body.ajax-search-active #globalSearch #global-search-autocomplete-container > div {
  overflow-y: scroll;
  height: 100%;
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: flex;
  -webkit-flex-direction: column;
  -webkit-box-orient: vertical; /* Safari <= 6*/
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  -o-flex-direction: column;
  flex-direction: column;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-justify-content: flex-start;
  -moz-justify-content: flex-start;
  -o-justify-content: flex-start;
  -ms-justify-content: flex-start;
  justify-content: flex-start;
  flex-wrap: nowrap;
  -webkit-flex-wrap: nowrap;
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: start;
  -moz-box-pack: start;
  -ms-flex-pack: start;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
}
body.ajax-search-active #globalSearch #global-search-autocomplete-container > div .autocomplete-block {
  order: 2;
}
body.ajax-search-active #globalSearch #global-search-autocomplete-container > div .autocomplete-block.aggregatorgeo {
  order: 1;
}
body.ajax-search-active #globalSearch #global-search-autocomplete-container .pecu-divider {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: center;
  -moz-align-items: center;
  -ms-align-items: center;
  -o-align-items: center;
  align-items: center;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
  font-size: 1.15rem;
  font-weight: 700;
  padding-left: 10px;
  text-align: left;
  line-height: 2;
  color: #0375b4;
  border-bottom: 1px solid #0375b4;
  margin-top: 14px;
}
body.ajax-search-active #globalSearch #global-search-autocomplete-container .pecu-divider .number-of-matches {
  height: 26px;
}
body.ajax-search-active #globalSearch #global-search-autocomplete-container .autocomplete-items-grid {
  display: grid;
  grid-gap: 10px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  padding: 10px;
}
body.ajax-search-active #globalSearch #global-search-autocomplete-container .autocomplete-item {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: flex;
  -webkit-flex-direction: column;
  -webkit-box-orient: vertical; /* Safari <= 6*/
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  -o-flex-direction: column;
  flex-direction: column;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: nowrap;
  -webkit-flex-wrap: nowrap;
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
}
body.ajax-search-active #globalSearch #global-search-autocomplete-container .autocomplete-item .image-placeholder:before {
  position: relative;
  top: -16px;
}
body.ajax-search-active #globalSearch #global-search-autocomplete-container .autocomplete-item .main-link {
  text-align: left;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box !important;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
body.ajax-search-active #globalSearch #global-search-autocomplete-container .autocomplete-item .main-link:before {
  display: none;
}
body.ajax-search-active #globalSearch #global-search-autocomplete-container .autocomplete-item .minor-pages {
  display: none;
}
body.ajax-search-active #globalSearch #global-search-autocomplete-container .autocomplete-item .localities-and-type {
  text-align: left;
  color: #727272;
  font-size: 0.84rem;
}
body.ajax-search-active #globalSearch #global-search-autocomplete-container .autocomplete-item.no-tile .tile__header {
  flex-basis: 0;
}
body.ajax-search-active #globalSearch #global-search-autocomplete-container .autocomplete-item.Product .div-image {
  background-position: right;
}
body.ajax-search-active #globalSearch #global-search-autocomplete-container #show-all-matches-container {
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
  background-color: #ffffff;
  -webkit-box-shadow: -1px 0 2px 1px #727272;
  box-shadow: -1px 0 2px 1px #727272;
}
body.ajax-search-active #globalSearch #global-search-autocomplete-container .show-all-matches {
  display: block;
  margin: 10px 20px;
  text-align: center;
}
@media all and (min-width: 481px) {
  body.ajax-search-active #globalSearch #global-search-autocomplete-container .autocomplete-items-grid {
    display: grid;
    grid-gap: 10px;
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}
@media all and (min-width: 681px) {
  body.ajax-search-active #globalSearch #global-search-autocomplete-container > div {
    display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
    display: -webkit-flex; /* Safari 7*/
    display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
    display: -ms-flexbox; /* IE10 */
    display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
    display: flex;
    /* Simulating 2012 flexbox model (used in IE 10) */
    /* Legacy Browsers (IE 10)*/
    -webkit-box-pack: justify;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-box-align: stretch;
    -moz-box-align: stretch;
    -ms-flex-align: stretch;
    /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
    /* For understanding browsers */
    -webkit-flex-direction: row;
    -moz-flex-direction: row;
    -ms-flex-direction: row;
    -o-flex-direction: row;
    flex-direction: row;
    -webkit-align-items: stretch;
    -moz-align-items: stretch;
    -ms-align-items: stretch;
    -o-align-items: stretch;
    align-items: stretch;
    -webkit-flex-flow: row nowrap;
    -webkit-justify-content: space-between;
    -moz-justify-content: space-between;
    -o-justify-content: space-between;
    -ms-justify-content: space-between;
    justify-content: space-between;
    flex-wrap: nowrap;
    -ms-flex-wrap: nowrap; /* IE 10 */
    -webkit-flex-wrap: nowrap;
  }
  body.ajax-search-active #globalSearch #global-search-autocomplete-container > div .autocomplete-block.aggregatorgeo {
    min-width: 260px;
    margin-right: 10px;
  }
}
@media all and (min-width: 861px) {
  body.ajax-search-active #globalSearch #global-search-autocomplete-container .autocomplete-items-grid {
    display: grid;
    grid-gap: 10px;
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}
@media all and (min-width: 1025px) {
  body.ajax-search-active {
    height: unset;
    overflow: auto;
  }
  body.ajax-search-active #globalSearch #global-search-autocomplete-container {
    max-height: 700px;
    position: absolute;
    padding: 10px 10px 70px 10px;
    left: 10px;
    right: 10px;
    width: auto;
    top: 54px;
    bottom: unset;
  }
  body.ajax-search-active #globalSearch #global-search-autocomplete-container > div {
    max-height: 636px;
  }
  body.ajax-search-active #globalSearch #global-search-autocomplete-container #show-all-matches-container {
    position: absolute;
    box-shadow: none;
  }
}
@media all and (min-width: 1401px) {
  body.ajax-search-active #globalSearch #global-search-autocomplete-container {
    right: 0;
  }
}

#predefined-entity-filter {
  grid-row: content-row3-start/content-row3-end;
  grid-column: content-col1-start/content-col12-end;
  background-color: #ffffff;
  border-top: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
  padding: 10px;
  height: 100%;
  width: 100%;
  padding: 0 10px;
  margin: 0;
}
#predefined-entity-filter > .element-actions {
  padding-top: 10px;
}
#predefined-entity-filter .icon-list {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: stretch;
  -moz-box-align: stretch;
  -ms-flex-align: stretch;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  box-lines: multiple;
  -moz-box-lines: multiple;
  -webkit-box-lines: multiple;
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-flex-flow: row wrap;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: wrap;
  -ms-flex-wrap: wrap; /* IE 10 */
  -webkit-flex-wrap: wrap;
}
#predefined-entity-filter .icon-list li {
  width: 48%;
}
#predefined-entity-filter .icon-list li a {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
#predefined-entity-filter .icon-list li a:before {
  margin-right: 6px;
}
@media all and (min-width: 481px) {
  #predefined-entity-filter .icon-list li {
    width: 100%;
  }
}
@media all and (min-width: 681px) {
  #predefined-entity-filter {
    grid-row: content-row2-start/content-row2-end;
    grid-column: content-col7-start/content-col12-end;
  }
  #predefined-entity-filter .icon-list li {
    width: 48%;
  }
}
@media all and (min-width: 1151px) {
  #predefined-entity-filter .icon-list li a:before {
    margin-right: 10px;
  }
}

#predefined-entity-filter-description-text {
  line-height: 1.2;
}
#predefined-entity-filter-description-text .bull-list {
  margin: 14px 0;
}

#group-description {
  background-color: #ffffff;
  border-top: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
  padding: 10px;
}
@media all and (max-width: 1401px) {
  #group-description {
    padding-left: 10px;
  }
}
@media all and (max-width: 861px) {
  #group-description {
    padding-right: 10px;
  }
}
#group-description > .element-actions {
  padding-top: 10px;
}
#group-description .show-more-content {
  max-height: 220px;
}
#group-description .formatted-article-block {
  padding-top: 10px;
}

#group-edit #group-data {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: start;
  -moz-box-pack: start;
  -ms-flex-pack: start;
  -webkit-box-align: stretch;
  -moz-box-align: stretch;
  -ms-flex-align: stretch;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  box-lines: multiple;
  -moz-box-lines: multiple;
  -webkit-box-lines: multiple;
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-flex-flow: row wrap;
  -webkit-justify-content: flex-start;
  -moz-justify-content: flex-start;
  -o-justify-content: flex-start;
  -ms-justify-content: flex-start;
  justify-content: flex-start;
  flex-wrap: wrap;
  -ms-flex-wrap: wrap; /* IE 10 */
  -webkit-flex-wrap: wrap;
}
#group-edit #group-data .label-value-combo {
  padding-right: 10px;
}
#group-edit #group-data .label-value-combo + .label-value-combo {
  padding-left: 10px;
  border-left: 1px solid #ccc;
}
#group-edit .edit-buttons-form .edit-button {
  width: 100%;
}
#group-edit .save-buttons {
  position: fixed;
  bottom: 6px;
  left: 6px;
  right: 6px;
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: center;
  -moz-align-items: center;
  -ms-align-items: center;
  -o-align-items: center;
  align-items: center;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
  visibility: visible;
}
#group-edit .save-buttons button + button {
  margin-left: 10px;
}
@media all and (min-width: 1401px) {
  #group-edit #group-data .label-value-combo {
    line-height: 1.5;
  }
  #group-edit #group-data .label-value-combo + .label-value-combo {
    padding-left: 0;
    border-left: none;
  }
  #group-edit .save-buttons {
    left: 0;
    right: 0;
    bottom: 0;
    height: 70px;
    background-color: #fafafa;
    box-shadow: inset 0 1px 0 #c4ccda;
    display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
    display: -webkit-flex; /* Safari 7*/
    display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
    display: -ms-flexbox; /* IE10 */
    display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
    display: flex;
    /* Simulating 2012 flexbox model (used in IE 10) */
    /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
    /* For understanding browsers */
    -webkit-flex-direction: row;
    -moz-flex-direction: row;
    -ms-flex-direction: row;
    -o-flex-direction: row;
    flex-direction: row;
    -webkit-align-items: center;
    -moz-align-items: center;
    -ms-align-items: center;
    -o-align-items: center;
    align-items: center;
    -webkit-flex-flow: row nowrap;
    -webkit-justify-content: center;
    -moz-justify-content: center;
    -o-justify-content: center;
    -ms-justify-content: center;
    justify-content: center;
    flex-wrap: nowrap;
    -ms-flex-wrap: nowrap; /* IE 10 */
    -webkit-flex-wrap: nowrap;
  }
  #group-edit .save-buttons button, #group-edit .save-buttons .is-active-checkbox {
    width: 220px;
  }
}

#current-image-preview-container {
  min-height: 128px;
  position: relative;
  display: inline-block;
  vertical-align: top;
  width: 50%;
}
#current-image-preview-container .image-placeholder {
  height: 128px;
}

#image-description .autogrowing {
  min-height: 49px;
}

#current-image-possible-actions {
  display: inline-block;
  vertical-align: top;
  width: 50%;
}

#new-image-data {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: stretch;
  -moz-box-align: stretch;
  -ms-flex-align: stretch;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  box-lines: multiple;
  -moz-box-lines: multiple;
  -webkit-box-lines: multiple;
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-flex-flow: row wrap;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: wrap;
  -ms-flex-wrap: wrap; /* IE 10 */
  -webkit-flex-wrap: wrap;
}
#new-image-data .apply-container, #new-image-data .change-image-button {
  width: 48%;
}
#new-image-data .apply-container {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: center;
  -moz-align-items: center;
  -ms-align-items: center;
  -o-align-items: center;
  align-items: center;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
  position: relative;
}
#new-image-data .apply-container .degrees {
  color: #f18825;
  font-size: 0.74rem;
  position: absolute;
  left: 10px;
  top: -4px;
}
#new-image-data > div {
  display: inline-block;
  vertical-align: top;
}
#new-image-data .messages-feedback-message {
  width: 100%;
  margin-top: 10px;
}

#imageEditor {
  width: 670px;
}
#imageEditor li {
  display: inline-block;
  margin-right: 1%;
  position: relative;
}
#imageEditor li:hover .use-image-button-container {
  display: block !important;
}
#imageEditor .use-image-button-container {
  position: absolute;
  display: none;
  bottom: 8px;
  right: 8px;
}
#imageEditor button.progressindicator:after {
  left: -24px;
}
#imageEditor .jcrop-holder:nth-child(2) {
  background: none !important;
  position: absolute !important;
  top: 0 !important;
}
#imageEditor .jcrop-holder:nth-child(2) .jcrop-hline, #imageEditor .jcrop-holder:nth-child(2) .jcrop-vline {
  background: #0375b4 !important;
}
#imageEditor .jcrop-holder:nth-child(2) .jcrop-hline:after, #imageEditor .jcrop-holder:nth-child(2) .jcrop-vline:after {
  color: white;
  background: #0375b4;
}
#imageEditor .jcrop-holder:nth-child(3) {
  background: none !important;
  position: absolute !important;
  top: 0 !important;
}
#imageEditor .jcrop-holder:nth-child(3) .jcrop-hline, #imageEditor .jcrop-holder:nth-child(3) .jcrop-vline {
  background: white !important;
}
#imageEditor .jcrop-holder:nth-child(3) .jcrop-hline:after, #imageEditor .jcrop-holder:nth-child(3) .jcrop-vline:after {
  color: #0375b4;
  background: white;
}
#imageEditor .jcrop-holder > div > div {
  border-radius: 2px;
  background: none !important;
}
#imageEditor .jcrop-holder canvas {
  opacity: 1 !important;
}
#imageEditor .jcrop-holder .jcrop-handle {
  background: none !important;
  border: none !important;
}
#imageEditor .jcrop-holder .jcrop-hline {
  height: 2px !important;
  opacity: 1 !important;
}
#imageEditor .jcrop-holder .jcrop-hline:after {
  content: attr(data-crop-description);
  float: right;
  font-size: 10px;
  line-height: 14px;
  padding: 0 3px;
  white-space: nowrap;
}
#imageEditor .jcrop-holder .jcrop-vline {
  width: 2px !important;
  opacity: 1 !important;
}
#imageEditor .media-library {
  margin-top: 10px;
}
#imageEditor .media-library .image-gallery {
  padding: 0;
}

.blogarticle-image-gallery {
  grid-row: content-row1-start/content-row1-end;
  grid-column: content-col1-start/content-col12-end;
}
.blogarticle-image-gallery .swiper-container {
  height: 100%;
}

.survey-image-gallery {
  grid-row: content-row1-start/content-row1-end;
  grid-column: content-col1-start/content-col12-end;
}
.survey-image-gallery .swiper-container {
  height: 220px;
}
@media all and (min-width: 681px) {
  .survey-image-gallery .swiper-container {
    height: 280px;
  }
}
@media all and (min-width: 1025px) {
  .survey-image-gallery .swiper-container {
    height: 100%;
  }
}

.sweepstake-image-gallery {
  grid-row: content-row1-start/content-row1-end;
  grid-column: content-col1-start/content-col12-end;
}
.sweepstake-image-gallery .swiper-container {
  height: 220px;
}
.sweepstake-image-gallery .swiper-container img {
  object-position: left top;
}
@media all and (min-width: 681px) {
  .sweepstake-image-gallery .swiper-container {
    height: 280px;
  }
}
@media all and (min-width: 1025px) {
  .sweepstake-image-gallery .swiper-container {
    height: 100%;
  }
}

/*############################################
 *## Positioning on the grid depending on page type
 *############################################*/
.entitymain #pecu-image-gallery-standard {
  padding-left: 0;
  padding-right: 0;
  grid-row: content-row12-start/content-row12-end;
  grid-column: content-col1-start/content-col12-end;
}
.entitymain #zoomable-main-image, .entitymain #image-gallery-panoramic, .entitymain #image-gallery-carousel-edit-mode {
  grid-row: content-row1-start/content-row1-end;
  grid-column: content-col1-start/content-col12-end;
}
@media all and (min-width: 481px) {
  .entitymain #pecu-image-gallery-standard {
    grid-row: content-row9-start/content-row9-end;
  }
}
@media all and (min-width: 861px) {
  .entitymain #zoomable-main-image, .entitymain #image-gallery-panoramic {
    grid-column: content-col1-start/content-col8-end;
  }
}
@media all and (min-width: 861px) {
  .entitymain.e_accommodation #zoomable-main-image, .entitymain.e_accommodation #image-gallery-panoramic {
    grid-column: content-col1-start/content-col12-end;
  }
}

.productmain #image-gallery-panoramic {
  grid-row: content-row1-start/content-row1-end;
  grid-column: content-col1-start/content-col12-end;
}
@media all and (min-width: 861px) {
  .productmain #image-gallery-panoramic {
    grid-column: content-col1-start/content-col8-end;
  }
}

.usermain #image-gallery-panoramic {
  grid-row: content-row1-start/content-row1-end;
  grid-column: content-col1-start/content-col12-end;
}
@media all and (min-width: 861px) {
  .usermain #image-gallery-panoramic {
    grid-column: content-col1-start/content-col8-end;
  }
}

.entityimagegallery #image-gallery--full {
  grid-row: content-row1-start/content-row14-end;
  grid-column: content-col1-start/content-col12-end;
  padding: 0 10px;
}

/*####### On AggregatorGeoGroup pages ########*/
#group-description #image-gallery-carousel-edit-mode .image-gallery-list {
  display: grid;
  grid-gap: 10px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
#group-description #image-gallery-carousel-edit-mode .image-gallery-list figure {
  margin-right: 0;
}

/*############# On UserMain pages ###########*/
.usermain #image-gallery-carousel-edit-mode {
  grid-row: content-row2-start/content-row2-end;
  grid-column: content-col1-start/content-col12-end;
  margin-top: 20px;
}
.usermain .empty-image-gallery {
  height: 240px;
  background-color: #ccc;
}
.usermain .empty-image-gallery ~ #map-container {
  padding-bottom: 0;
}
.usermain .in-converted-form .empty-image-gallery {
  display: none;
}

/*############################################
 *##
 *## Actual Module styles
 *##
 *############################################*/
@media all and (max-width: 1401px) {
  #pecu-image-gallery-standard {
    padding-left: 10px;
  }
}
@media all and (max-width: 861px) {
  #pecu-image-gallery-standard {
    padding-right: 10px;
  }
}
#pecu-image-gallery-standard .image-gallery-list {
  display: grid;
  grid-gap: 10px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
#pecu-image-gallery-standard .image-gallery-list img {
  max-width: 100%;
  height: auto;
}
#pecu-image-gallery-standard figcaption {
  display: none;
}
@media all and (min-width: 381px) {
  #pecu-image-gallery-standard .image-gallery-list {
    display: grid;
    grid-gap: 10px;
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}
@media all and (min-width: 861px) {
  #pecu-image-gallery-standard .image-gallery-list {
    display: grid;
    grid-gap: 10px;
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }
}
@media all and (min-width: 1301px) {
  #pecu-image-gallery-standard .image-gallery-list {
    display: grid;
    grid-gap: 10px;
    grid-template-columns: repeat(8, minmax(0, 1fr));
  }
}

#image-gallery-panoramic .image-link {
  position: relative;
}
#image-gallery-panoramic .swiper-slide {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: flex;
  -webkit-flex-direction: column;
  -webkit-box-orient: vertical; /* Safari <= 6*/
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  -o-flex-direction: column;
  flex-direction: column;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: nowrap;
  -webkit-flex-wrap: nowrap;
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
}
#image-gallery-panoramic .caption-and-license {
  background-color: #ccc;
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: flex;
  -webkit-flex-direction: column;
  -webkit-box-orient: vertical; /* Safari <= 6*/
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  -o-flex-direction: column;
  flex-direction: column;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: nowrap;
  -webkit-flex-wrap: nowrap;
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
}
#image-gallery-panoramic .caption-and-license .copyright {
  display: block;
  padding: 10px;
  order: 2;
  width: fit-content;
  width: -moz-fit-content;
  white-space: nowrap;
  flex-grow: 0;
  -webkit-flex-grow: 0;
  -moz-flex-grow: 0;
  -ms-flex-grow: 0;
  -o-flex-grow: 0;
}
#image-gallery-panoramic .caption-and-license .caption-text {
  display: block;
  order: 1;
  padding: 10px;
  font-size: 0.74rem;
  flex-grow: 1;
  -webkit-flex-grow: 1;
  -moz-flex-grow: 1;
  -ms-flex-grow: 1;
  -o-flex-grow: 1;
}
#image-gallery-panoramic .caption-and-license .caption-text + .copyright {
  padding-top: 0;
}
@media all and (min-width: 481px) {
  #image-gallery-panoramic .caption-and-license {
    display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
    display: -webkit-flex; /* Safari 7*/
    display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
    display: -ms-flexbox; /* IE10 */
    display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
    display: flex;
    /* Simulating 2012 flexbox model (used in IE 10) */
    /* Legacy Browsers (IE 10)*/
    -webkit-box-pack: justify;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-box-align: flex-end;
    -moz-box-align: flex-end;
    -ms-flex-align: flex-end;
    /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
    /* For understanding browsers */
    -webkit-flex-direction: row;
    -moz-flex-direction: row;
    -ms-flex-direction: row;
    -o-flex-direction: row;
    flex-direction: row;
    -webkit-align-items: flex-end;
    -moz-align-items: flex-end;
    -ms-align-items: flex-end;
    -o-align-items: flex-end;
    align-items: flex-end;
    -webkit-flex-flow: row nowrap;
    -webkit-justify-content: space-between;
    -moz-justify-content: space-between;
    -o-justify-content: space-between;
    -ms-justify-content: space-between;
    justify-content: space-between;
    flex-wrap: nowrap;
    -ms-flex-wrap: nowrap; /* IE 10 */
    -webkit-flex-wrap: nowrap;
  }
  #image-gallery-panoramic .caption-and-license .copyright {
    padding-top: 10px;
  }
}

#image-gallery-carousel-edit-mode {
  padding-left: 10px;
}
#image-gallery-carousel-edit-mode .headlines {
  margin-bottom: 10px;
}
#image-gallery-carousel-edit-mode .image-gallery-list {
  display: grid;
  grid-gap: 10px;
  grid-template-columns: repeat(5, minmax(0, 1fr));
}
#image-gallery-carousel-edit-mode .image-gallery-list figure {
  padding: 0;
  border: none;
}
#image-gallery-carousel-edit-mode .image-button-container {
  position: absolute;
  bottom: 6px;
  left: 6px;
  right: 6px;
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: start;
  -moz-box-pack: start;
  -ms-flex-pack: start;
  -webkit-box-align: stretch;
  -moz-box-align: stretch;
  -ms-flex-align: stretch;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: flex-start;
  -moz-justify-content: flex-start;
  -o-justify-content: flex-start;
  -ms-justify-content: flex-start;
  justify-content: flex-start;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
}
#image-gallery-carousel-edit-mode .image-button-container > a + a, #image-gallery-carousel-edit-mode .image-button-container > button + a {
  margin-left: 10px;
}
#image-gallery-carousel-edit-mode .placeholder-container {
  min-height: 120px;
  height: 100%;
  width: 200px;
}
#image-gallery-carousel-edit-mode .placeholder-container, #image-gallery-carousel-edit-mode .editable-image-container {
  position: relative;
}
#image-gallery-carousel-edit-mode .feedback-message {
  margin-top: 20px;
}
#image-gallery-carousel-edit-mode .ui-sortable-handle {
  position: relative;
}
#image-gallery-carousel-edit-mode .ui-sortable-handle:hover {
  cursor: move;
}
#image-gallery-carousel-edit-mode .ui-sortable-handle:before {
  font-family: TourispoWebfonts !important;
  font-weight: 400;
  font-style: normal;
  display: inline-block;
  content: "\f25e";
  color: #ffffff;
  background-color: #0375b4;
  position: absolute;
  z-index: 1;
  font-size: 18px;
  top: -4px;
  left: -4px;
  border-radius: 15px;
  width: 30px;
  height: 30px;
  line-height: 30px;
  text-align: center;
  cursor: move;
  transform: rotate(45deg);
}
@media all and (min-width: 1025px) {
  #image-gallery-carousel-edit-mode .image-gallery-list {
    display: grid;
    grid-gap: 10px;
    grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
  }
  #image-gallery-carousel-edit-mode .image-gallery-list figure {
    grid-column: span 1 !important;
  }
}
@media all and (min-width: 1301px) {
  #image-gallery-carousel-edit-mode .image-gallery-list {
    grid-template-columns: repeat(8, minmax(0, 1fr)) !important;
  }
}

.image-gallery .image-gallery-list {
  display: grid;
  grid-gap: 10px;
}
.image-gallery img {
  width: 100%;
  height: auto;
}
.image-gallery + #pecu-video-preview {
  margin-top: 10px;
}
#image-gallery--small .image-gallery-list {
  grid-template-columns: repeat(4, 1fr);
}

#image-gallery--standard {
  grid-row: content-row10-start/content-row10-end;
  grid-column: content-col1-start/content-col12-end;
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: flex;
  -webkit-flex-direction: column;
  -webkit-box-orient: vertical; /* Safari <= 6*/
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  -o-flex-direction: column;
  flex-direction: column;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: nowrap;
  -webkit-flex-wrap: nowrap;
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  margin: 0 10px;
}
#image-gallery--standard > .element-contents {
  flex-grow: 1;
}
#image-gallery--standard > .element-contents .label-value-combo:first-child {
  margin-top: -4px;
}
#image-gallery--standard .element-image {
  max-width: 100%;
  margin-bottom: 10px;
}
#image-gallery--standard > .element-actions {
  padding-top: 10px;
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: start;
  -moz-box-pack: start;
  -ms-flex-pack: start;
  -webkit-box-align: stretch;
  -moz-box-align: stretch;
  -ms-flex-align: stretch;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: flex-start;
  -moz-justify-content: flex-start;
  -o-justify-content: flex-start;
  -ms-justify-content: flex-start;
  justify-content: flex-start;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
}
#image-gallery--standard > .element-actions > a:not(:first-child) {
  margin-left: 10px;
}
@media all and (min-width: 481px) {
  #image-gallery--standard {
    margin: 0;
  }
}
#image-gallery--standard .image-gallery-list {
  grid-template-columns: repeat(8, 1fr);
}

#image-gallery--full {
  grid-row: content-row1-start/content-row10-end;
  grid-column: content-col1-start/content-col12-end;
}
#image-gallery--full .image-gallery-list {
  grid-template-columns: 1fr 1fr;
  grid-column-gap: 0;
  grid-row-gap: 8px;
}
#image-gallery--full figure {
  background-color: #ffffff;
  border-top: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
  padding: 10px;
  grid-column: span 1;
}
#image-gallery--full figure > .element-actions {
  padding-top: 10px;
}
#image-gallery--full figure.format_pan {
  grid-column: span 2;
}
#image-gallery--full figure figcaption {
  color: #727272;
  position: relative;
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: flex;
  -webkit-flex-direction: column;
  -webkit-box-orient: vertical; /* Safari <= 6*/
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  -o-flex-direction: column;
  flex-direction: column;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-justify-content: flex-end;
  -moz-justify-content: flex-end;
  -o-justify-content: flex-end;
  -ms-justify-content: flex-end;
  justify-content: flex-end;
  flex-wrap: nowrap;
  -webkit-flex-wrap: nowrap;
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: end;
  -moz-box-pack: end;
  -ms-flex-pack: end;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  padding-bottom: 10px;
}
#image-gallery--full figure figcaption .caption-text {
  font-weight: 300;
  padding-bottom: 6px;
}
@media all and (min-width: 681px) {
  #image-gallery--full .image-gallery-list {
    grid-template-columns: repeat(12, 1fr);
    grid-column-gap: 10px;
    grid-row-gap: 10px;
  }
  #image-gallery--full figure {
    background-color: #ffffff;
    border: 1px solid #ccc;
    border-radius: 3px;
    padding: 7px;
    display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
    display: -webkit-flex; /* Safari 7*/
    display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
    display: -ms-flexbox; /* IE10 */
    display: flex;
    -webkit-flex-direction: column;
    -webkit-box-orient: vertical; /* Safari <= 6*/
    -moz-flex-direction: column;
    -ms-flex-direction: column;
    -o-flex-direction: column;
    flex-direction: column;
    -webkit-align-items: stretch;
    -moz-align-items: stretch;
    -ms-align-items: stretch;
    -o-align-items: stretch;
    align-items: stretch;
    -webkit-justify-content: flex-start;
    -moz-justify-content: flex-start;
    -o-justify-content: flex-start;
    -ms-justify-content: flex-start;
    justify-content: flex-start;
    flex-wrap: nowrap;
    -webkit-flex-wrap: nowrap;
    /* Legacy Browsers (IE 10)*/
    -webkit-box-pack: start;
    -moz-box-pack: start;
    -ms-flex-pack: start;
    -webkit-box-align: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    grid-column: span 4;
  }
}
@media all and (min-width: 681px) and (min-width: 1151px) {
  #image-gallery--full figure {
    padding: 10px;
  }
}
@media all and (min-width: 681px) {
  #image-gallery--full figure.format_pan {
    grid-column: span 8;
  }
}

#page-entitymain #image-gallery--small {
  grid-row: content-row4-start/content-row4-end;
  grid-column: content-col9-start/content-col12-end;
}

#user-main-image {
  grid-row: content-row1-start/content-row1-end;
  grid-column: content-col9-start/content-col11-end;
  z-index: 1;
  position: relative;
  top: -10px;
  left: 20px;
}
#user-main-image img {
  width: 100%;
  height: auto;
  -webkit-box-shadow: 1px 1px 2px 1px #727272;
  box-shadow: 1px 1px 2px 1px #727272;
}
#user-main-image img, #user-main-image .image-placeholder {
  background-color: #fff;
}
#user-main-image .image-placeholder {
  width: 100%;
  background-size: 82% auto;
  margin: 0 auto;
}
#user-main-image .image-placeholder:before {
  font-family: TourispoWebfonts !important;
  font-weight: 400;
  font-style: normal;
  display: inline-block;
  font-size: 68px !important;
  margin-top: -45px !important;
  color: #727272 !important;
  width: 100%;
  text-align: center;
  vertical-align: middle;
  display: block;
  position: relative;
  top: 24px;
}
#user-main-image .icons-zoom-loupe {
  position: absolute;
  z-index: 9999;
  right: 0px;
  top: 0;
  padding: 2px;
  background-color: #fff;
}
@media all and (min-width: 481px) {
  #user-main-image .image-placeholder:before {
    font-size: 80px !important;
  }
}
@media all and (min-width: 861px) {
  #user-main-image {
    grid-row: content-row1-start/content-row1-end;
    grid-column: content-col6-start/content-col7-end;
  }
}
@media all and (min-width: 1401px) {
  #user-main-image .image-placeholder:before {
    font-size: 120px !important;
  }
}

/*############################################
 *## UserMainImage in EditMode
 *############################################*/
.in-converted-form #user-main-image {
  grid-row: content-row1-start/content-row1-end;
  grid-column: content-col1-start/content-col12-end;
  border: none;
  left: 0;
  top: 0;
  background-color: transparent;
}
.in-converted-form #user-main-image img {
  max-width: 200px;
}
.in-converted-form #user-main-image .image-placeholder {
  -webkit-box-shadow: 1px 1px 2px 1px #727272;
  box-shadow: 1px 1px 2px 1px #727272;
  margin: 0;
  width: fit-content;
  padding: 10px;
  height: 150px;
}
.in-converted-form #user-main-image .image-button-container {
  position: absolute;
  bottom: 0;
  left: 20px;
  z-index: 999;
}

/*############################################
 *## Positioning on the grid depending on page type
 *############################################*/
.entitymain #zoomable-main-image {
  grid-row: content-row1-start/content-row1-end;
  grid-column: content-col1-start/content-col12-end;
}
@media all and (min-width: 861px) {
  .entitymain #zoomable-main-image {
    grid-column: content-col1-start/content-col8-end;
    margin-bottom: 6px;
  }
}

.entityzoomableimage #zoomable-main-image {
  height: 300px;
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: flex;
  -webkit-flex-direction: column;
  -webkit-box-orient: vertical; /* Safari <= 6*/
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  -o-flex-direction: column;
  flex-direction: column;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-justify-content: flex-start;
  -moz-justify-content: flex-start;
  -o-justify-content: flex-start;
  -ms-justify-content: flex-start;
  justify-content: flex-start;
  flex-wrap: nowrap;
  -webkit-flex-wrap: nowrap;
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: start;
  -moz-box-pack: start;
  -ms-flex-pack: start;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  grid-row: content-row1-start/content-row1-end;
  grid-column: content-col1-start/content-col12-end;
}
.entityzoomableimage #zoomable-main-image #zoomable_image_anymap_naviContent {
  flex-grow: 1;
  -webkit-flex-grow: 1;
  -moz-flex-grow: 1;
  -ms-flex-grow: 1;
  -o-flex-grow: 1;
}
.entityzoomableimage #zoomable-main-image #zoomable_image_anymap_naviContent > div {
  height: 100%;
}
@media all and (min-width: 861px) {
  .entityzoomableimage #zoomable-main-image {
    height: 500px;
  }
}

/*############################################
 *## Module styling
 *############################################*/
#zoomable-main-image {
  position: relative;
  overflow: hidden;
}
#zoomable-main-image #entity-main-image, #zoomable-main-image .editable-image-container {
  width: 100%;
  height: 100%;
}
#zoomable-main-image .editable-image-container {
  position: relative;
}
#zoomable-main-image .editable-image-container .image-placeholder {
  height: 240px;
}
#zoomable-main-image .button.add-main-image {
  position: absolute;
  bottom: 10px;
  left: 10px;
  width: fit-content;
}
#zoomable-main-image .editable-image-container {
  height: 100%;
}
#zoomable-main-image .editable-image-container .image-link {
  display: block;
  height: 100%;
  width: 100%;
}
#zoomable-main-image .editable-image-container .image-button-container a {
  position: absolute;
  bottom: 10px;
  left: 50%;
  margin-left: -100px;
  width: 200px;
}
#zoomable-main-image img {
  width: 100%;
}
#image-manager {
  min-width: 700px;
  overflow: hidden;
  height: 100%;
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: stretch;
  -moz-box-align: stretch;
  -ms-flex-align: stretch;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
  /* Buttons
  ------------------------------------------ */
  /* Drop Zone
  ------------------------------------------ */
  /* Uploaded Elements
  ------------------------------------------ */
  /* to ensure consistent size of tiles - only display status text before auto-retry or after failure */
  /* Thumbnail
  ------------------------------------------ */
  /* hack to ensure we don't try to center preview in IE8, since -ms-filter doesn't mimic translateY as expected in all cases */
}
#image-manager .button-panel {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: stretch;
  -moz-box-align: stretch;
  -ms-flex-align: stretch;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
  font-size: 15px;
  margin-bottom: 10px;
}
#image-manager .button-panel .confirm-dialog {
  display: none;
}
#image-manager .qq-upload-button-selector {
  margin-top: 0;
  max-width: 310px;
}
#image-manager .label-value-combo .label {
  text-align: left;
}
#image-manager .icon-description {
  position: absolute;
  left: 21px;
  background: #fafafa;
  border: 1px solid #ccc;
  border-radius: 5px;
}
#image-manager .icon-description > span {
  color: #31394a;
  line-height: 20px;
  padding: 3px;
  display: inline-block;
  font-weight: bold;
}
#image-manager .icon-description > span:not(:last-child) {
  margin-right: 25px;
}
#image-manager .icon-description > span:before {
  font-family: TourispoWebfonts !important;
  font-weight: 400;
  font-style: normal;
  display: inline-block;
  color: #0375b4;
  font-size: 20px;
  vertical-align: top;
}
#image-manager .icon-description .main-image:before {
  content: "\f005";
}
#image-manager .icon-description .gallery-image:before {
  content: "\f148";
}
#image-manager .icon-description .logo-image:before {
  content: "\e912";
}
#image-manager .icon-description .text-image:before {
  content: "\e911";
}
#image-manager .left-column {
  overflow: hidden;
  position: relative;
  order: 1;
  flex-grow: 1;
}
#image-manager .left-column .action-buttons {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: start;
  -moz-box-pack: start;
  -ms-flex-pack: start;
  -webkit-box-align: stretch;
  -moz-box-align: stretch;
  -ms-flex-align: stretch;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: flex-start;
  -moz-justify-content: flex-start;
  -o-justify-content: flex-start;
  -ms-justify-content: flex-start;
  justify-content: flex-start;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
  position: absolute;
  width: 100%;
  bottom: 0;
  left: 0;
}
#image-manager .left-column .action-buttons button + button {
  margin-left: 10px;
}
#image-manager .right-column {
  order: 2;
  width: 410px;
  padding: 16px 24px;
  box-sizing: border-box;
  border-left: 2px solid #0375b4;
  margin-bottom: 40px;
  position: relative;
}
#image-manager .right-column:before {
  font-size: 120px;
  position: absolute;
  text-align: center;
  right: 0;
  left: 0;
  top: 40%;
  vertical-align: middle;
  margin-right: 4px;
  color: #ccc;
}
#image-manager .right-column form {
  overflow: auto;
  height: 100%;
  box-sizing: border-box;
  padding-bottom: 55px;
}
#image-manager .right-column form .image-info {
  font-size: 12px;
}
#image-manager .right-column form #is-main-image-info {
  margin-top: 20px;
  position: relative;
  padding-left: 56px;
}
#image-manager .right-column form #is-main-image-info:before {
  color: #0375b4;
  font-size: 40px;
  position: absolute;
  left: 10px;
}
#image-manager .right-column form.in-progress::before {
  content: "\e901";
  position: absolute;
  top: 100px;
  left: 130px;
  z-index: 10000;
  color: #0375b4;
  font-size: 130px;
  font-family: TourispoWebfonts !important;
  font-weight: 400;
  font-style: normal;
  display: inline-block;
  -webkit-animation: spin 1s linear 0s infinite;
  -moz-animation: spin 1s linear 0s infinite;
  -ms-animation: spin 1s linear 0s infinite;
  -o-animation: spin 1s linear 0s infinite;
  animation: spin 1s linear 0s infinite;
  padding: 6px;
  /* text-indent: 7px; */
  margin: -6px;
}
#image-manager .right-column form.in-progress::after {
  content: " ";
  position: absolute;
  top: 0;
  left: 0;
  bottom: 60px;
  right: 15px;
  z-index: 9999;
  background: rgba(255, 255, 255, 0.8);
}
#image-manager .right-column .form-buttons {
  position: absolute;
  bottom: 15px;
  right: 24px;
  left: 24px;
  background: #ffffff;
}
#image-manager .right-column .rotate-buttons {
  width: 15%;
  display: inline-block;
}
#image-manager .right-column .save-crop-button {
  width: 85%;
  display: inline-block;
}
#image-manager .right-column .save-crop-button button {
  margin-top: 0;
}
#image-manager .right-column .jcrop-holder:nth-child(2) {
  background: none !important;
  position: absolute !important;
  top: 0 !important;
}
#image-manager .right-column .jcrop-holder:nth-child(2) .jcrop-hline, #image-manager .right-column .jcrop-holder:nth-child(2) .jcrop-vline {
  background: #0375b4 !important;
}
#image-manager .right-column .jcrop-holder:nth-child(2) .jcrop-hline:after, #image-manager .right-column .jcrop-holder:nth-child(2) .jcrop-vline:after {
  color: white;
  background: #0375b4;
}
#image-manager .right-column .jcrop-holder:nth-child(3) {
  background: none !important;
  position: absolute !important;
  top: 0 !important;
}
#image-manager .right-column .jcrop-holder:nth-child(3) .jcrop-hline, #image-manager .right-column .jcrop-holder:nth-child(3) .jcrop-vline {
  background: white !important;
}
#image-manager .right-column .jcrop-holder:nth-child(3) .jcrop-hline:after, #image-manager .right-column .jcrop-holder:nth-child(3) .jcrop-vline:after {
  color: #0375b4;
  background: white;
}
#image-manager .right-column .jcrop-holder > div:first-child {
  -webkit-box-shadow: 0 2px 5px 0px #ccc;
  box-shadow: 0 2px 5px 0px #ccc;
}
#image-manager .right-column .jcrop-holder > div > div {
  border-radius: 2px;
  background: none !important;
}
#image-manager .right-column .jcrop-holder canvas {
  opacity: 1 !important;
}
#image-manager .right-column .jcrop-holder .jcrop-handle {
  background: none !important;
  border: none !important;
}
#image-manager .right-column .jcrop-holder .jcrop-hline {
  height: 2px !important;
  opacity: 1 !important;
}
#image-manager .right-column .jcrop-holder .jcrop-hline:after {
  content: attr(data-crop-description);
  float: right;
  font-size: 10px;
  line-height: 14px;
  padding: 0 3px;
  white-space: nowrap;
}
#image-manager .right-column .jcrop-holder .jcrop-vline {
  width: 2px !important;
  opacity: 1 !important;
}
#image-manager .image-gallery {
  position: absolute;
  bottom: 0;
  top: 365px;
  right: 0;
  left: 8px;
  overflow-y: auto;
  padding: 0 13px;
  margin-bottom: 40px;
}
#image-manager .image-gallery li {
  display: inline-block;
  margin-right: 1%;
  position: relative;
  cursor: pointer;
  background: rgba(255, 255, 255, 0.5);
}
#image-manager .image-gallery li:before {
  font-family: TourispoWebfonts !important;
  font-weight: 400;
  font-style: normal;
  display: inline-block;
  color: #0375b4;
  font-size: 30px;
  position: absolute;
  top: 5px;
  right: 5px;
  padding-left: 4px;
  background: rgba(255, 255, 255, 0.8);
  min-width: 30px;
  text-align: center;
}
#image-manager .image-gallery li.is-main-image {
  background: none;
}
#image-manager .image-gallery li.is-main-image:before {
  content: "\f005";
}
#image-manager .image-gallery li.is-logo-image {
  background: none;
}
#image-manager .image-gallery li.is-logo-image:before {
  content: "\e912";
}
#image-manager .image-gallery li.is-logo-image.is-main-image:before {
  content: "\f005\e912";
}
#image-manager .image-gallery li img {
  padding: 6px;
}
#image-manager .image-gallery li.ui-selected img {
  background-color: #0375b4;
}
#image-manager .image-gallery li::after {
  -ms-transition: all 400ms ease 0s;
  transition: all 400ms ease 0s;
  -ms-transition-property: opacity;
  transition-property: opacity;
  position: absolute;
  right: 0;
  bottom: 0;
  top: 0;
  left: 0;
  content: "";
  opacity: 0;
  background-color: rgba(255, 255, 255, 0.5);
}
#image-manager .image-gallery li.changed::after {
  content: "\f040";
  font-family: TourispoWebfonts !important;
  font-weight: 400;
  font-style: normal;
  display: inline-block;
  position: absolute;
  color: #0375b4;
  right: 0;
  bottom: 0;
  top: 0;
  padding: 19px 24px 24px 29px;
  left: 0;
  font-size: 76px;
  background-color: rgba(255, 255, 255, 0.5);
  opacity: 1;
}
#image-manager .image-gallery li.in-progress::before {
  content: "\e901" !important;
  position: absolute;
  top: 5px;
  left: 4px;
  padding: 0 !important;
  z-index: 1;
  color: #0375b4;
  font-size: 110px;
  background: none;
  font-family: TourispoWebfonts !important;
  font-weight: 400;
  font-style: normal;
  display: inline-block;
  -webkit-animation: spin 1s linear 0s infinite;
  -moz-animation: spin 1s linear 0s infinite;
  -ms-animation: spin 1s linear 0s infinite;
  -o-animation: spin 1s linear 0s infinite;
  animation: spin 1s linear 0s infinite;
  -webkit-transform-origin: 50% 50%;
  -moz-transform-origin: 50% 50%;
  -ms-transform-origin: 50% 50%;
  -o-transform-origin: 50% 50%;
  transform-origin: 50% 50%;
}
#image-manager .image-gallery li.success::after {
  content: "\f00c";
  font-family: TourispoWebfonts !important;
  font-weight: 400;
  font-style: normal;
  display: inline-block;
  position: absolute;
  color: #92b147;
  right: 0;
  bottom: 0;
  top: 0;
  padding: 24px;
  left: 0;
  font-size: 76px;
  background-color: rgba(255, 255, 255, 0.5);
  opacity: 1;
}
#image-manager #image-qq-uploader {
  padding: 16px 24px;
}
#image-manager #image-qq-uploader .upload-feedback-container {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
}
#image-manager .image-preview-container {
  position: relative;
  display: inline-block;
}
#image-manager .image-preview-container .image-preview {
  margin: 0 auto;
  margin-bottom: 10px;
}
#image-manager .image-drop-zone {
  height: 250px;
  font-size: 1.3em;
}
#image-manager.add-to-gallery li.contained-in-gallery {
  background: none;
}
#image-manager.add-to-gallery li.contained-in-gallery:before {
  content: "\f148";
}
#image-manager.add-to-gallery li.contained-in-gallery.is-main-image:before {
  content: "\f005\f148";
}
#image-manager.set-text-image li.is-text-image {
  background: none;
}
#image-manager.set-text-image li.is-text-image:before {
  content: "\e911";
}
#image-manager.set-text-image li.is-text-image.is-main-image:before {
  content: "\f005\e911";
}
#image-manager .qq-uploader {
  position: relative;
  width: 100%;
}
#image-manager .qq-uploader button {
  margin-top: 0;
}
#image-manager .qq-gallery .qq-btn {
  float: right;
  border: none;
  padding: 0;
  margin: 0;
  box-shadow: none;
}
#image-manager .qq-gallery.qq-uploader {
  position: relative;
  height: 250px;
  overflow-y: hidden;
  width: inherit;
  border-radius: 6px;
  border: 1px dashed #CCCCCC;
  background-color: #FAFAFA;
  padding: 20px;
}
#image-manager .qq-gallery.qq-uploader:before {
  content: attr(qq-drop-area-text-permanent) " ";
  position: absolute;
  font-size: 200%;
  left: 0;
  width: 100%;
  text-align: center;
  top: 45%;
  opacity: 0.25;
  filter: alpha(opacity=25);
}
#image-manager .qq-gallery .qq-upload-drop-area, #image-manager .qq-upload-extra-drop-area {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  min-height: 30px;
  z-index: 2;
  background: #F9F9F9;
  border-radius: 4px;
  text-align: center;
}
#image-manager .qq-gallery .qq-upload-drop-area span {
  display: block;
  position: absolute;
  top: 50%;
  width: 100%;
  margin-top: -8px;
  font-size: 16px;
}
#image-manager .qq-gallery .qq-upload-extra-drop-area {
  position: relative;
  margin-top: 50px;
  font-size: 16px;
  padding-top: 30px;
  height: 20px;
  min-height: 40px;
}
#image-manager .qq-gallery .qq-upload-drop-area-active {
  background: #FDFDFD;
  border-radius: 4px;
}
#image-manager .qq-gallery .qq-upload-list {
  margin: 0;
  padding: 10px 0 0;
  list-style: none;
  max-height: 215px;
  overflow-y: auto;
  clear: both;
  box-shadow: none;
}
#image-manager .qq-gallery .qq-upload-list li {
  display: inline-block;
  position: relative;
  max-width: 120px;
  margin: 0 25px 25px 0;
  padding: 0;
  line-height: 16px;
  font-size: 13px;
  color: #424242;
  background-color: #FFFFFF;
  border-radius: 2px;
  box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.22);
  vertical-align: top;
  /* to ensure consistent size of tiles - may need to change if qq-max-size attr on preview img changes */
  height: 186px;
}
#image-manager .qq-gallery .qq-upload-spinner,
#image-manager .qq-gallery .qq-upload-size,
#image-manager .qq-gallery .qq-upload-retry,
#image-manager .qq-gallery .qq-upload-failed-text,
#image-manager .qq-gallery .qq-upload-delete,
#image-manager .qq-gallery .qq-upload-pause,
#image-manager .qq-gallery .qq-upload-continue {
  display: inline;
}
#image-manager .qq-gallery .qq-upload-delete:hover,
#image-manager .qq-gallery .qq-upload-pause:hover,
#image-manager .qq-gallery .qq-upload-continue:hover {
  background-color: transparent;
}
#image-manager .qq-gallery .qq-upload-delete,
#image-manager .qq-gallery .qq-upload-pause,
#image-manager .qq-gallery .qq-upload-continue,
#image-manager .qq-gallery .qq-upload-cancel {
  cursor: pointer;
}
#image-manager .qq-gallery .qq-upload-delete,
#image-manager .qq-gallery .qq-upload-pause,
#image-manager .qq-gallery .qq-upload-continue {
  border: none;
  background: none;
  color: #00A0BA;
  font-size: 12px;
  padding: 0;
}
#image-manager .qq-gallery .qq-upload-status-text {
  color: #333333;
  font-size: 12px;
  padding-left: 3px;
  padding-top: 2px;
  width: inherit;
  display: none;
  width: 108px;
}
#image-manager .qq-gallery .qq-upload-fail .qq-upload-status-text {
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow-x: hidden;
  display: block;
  text-align: center;
}
#image-manager .qq-gallery .qq-upload-retrying .qq-upload-status-text {
  display: inline-block;
}
#image-manager .qq-gallery .qq-upload-retrying .qq-progress-bar-container {
  display: none;
}
#image-manager .qq-gallery .qq-upload-cancel {
  background-color: #ffffff;
  color: #0375b4;
  border-radius: 12px;
  border: none;
  font-size: 18px;
  height: 18px;
  width: 18px;
  line-height: 18px;
  position: absolute;
  right: -5px;
  top: -5px;
  margin: 0;
}
#image-manager .qq-gallery .qq-upload-cancel:after {
  font-family: TourispoWebfonts !important;
  font-weight: 400;
  font-style: normal;
  display: inline-block;
  content: "\f057";
}
#image-manager .qq-gallery .qq-upload-cancel:hover {
  background-color: #0375b4;
}
#image-manager .qq-gallery .qq-upload-retry {
  position: absolute;
  top: 20px;
  left: 7px;
  z-index: 1;
}
#image-manager .qq-gallery .qq-file-info {
  padding: 10px 6px 4px;
  margin-top: -3px;
  border-radius: 0 0 2px 2px;
  text-align: left;
  overflow: hidden;
}
#image-manager .qq-gallery .qq-file-info .qq-file-name {
  position: relative;
}
#image-manager .qq-gallery .qq-upload-file {
  display: block;
  margin-right: 0;
  margin-bottom: 3px;
  width: auto;
  /* to ensure consistent size of tiles - constrain text to single line */
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow-x: hidden;
}
#image-manager .qq-gallery .qq-upload-spinner:after, #image-manager .qq-gallery .qq-drop-processing-spinner:after {
  display: inline-block;
  position: absolute;
  content: "\e921";
  color: #0375b4;
  font-family: TourispoWebfonts !important;
  font-weight: 400;
  font-style: normal;
  display: inline-block;
  -webkit-animation: spin 1s linear 0s infinite;
  -moz-animation: spin 1s linear 0s infinite;
  -ms-animation: spin 1s linear 0s infinite;
  -o-animation: spin 1s linear 0s infinite;
  animation: spin 1s linear 0s infinite;
  -webkit-transform-origin: 50% 50.5%;
  -moz-transform-origin: 50% 50.5%;
  -ms-transform-origin: 50% 50.5%;
  -o-transform-origin: 50% 50.5%;
  transform-origin: 50% 50.5%;
  left: 50%;
  margin-left: -15px;
  top: 53px;
  width: 30px;
  height: 30px;
  font-size: 30px;
  line-height: 30px;
  z-index: 30;
  vertical-align: text-bottom;
}
#image-manager .qq-gallery .qq-drop-processing {
  display: block;
}
#image-manager .qq-gallery .qq-upload-failed-text {
  display: none;
  font-style: italic;
  font-weight: bold;
}
#image-manager .qq-gallery .qq-upload-failed-icon {
  display: none;
  width: 15px;
  height: 15px;
  vertical-align: text-bottom;
}
#image-manager .qq-gallery .qq-upload-fail .qq-upload-failed-text {
  display: inline;
}
#image-manager .qq-gallery .qq-upload-retrying .qq-upload-failed-text {
  display: inline;
}
#image-manager .qq-gallery .qq-upload-list li.qq-upload-success {
  background-color: #F2F7ED;
}
#image-manager .qq-gallery .qq-upload-list li.qq-upload-fail {
  background-color: #F5EDED;
  box-shadow: 0 0 1px 0 red;
  border: 0;
}
#image-manager .qq-gallery .qq-progress-bar {
  display: block;
  background: #0375b4;
  width: 0%;
  height: 15px;
  border-radius: 6px;
}
#image-manager .qq-gallery .qq-total-progress-bar {
  height: 25px;
  border-radius: 9px;
  color: #ffffff;
}
#image-manager .qq-gallery .qq-total-progress-bar:before {
  content: attr(aria-valuenow) "% ";
  left: 50%;
  position: absolute;
  top: 3px;
  margin-left: -10px;
}
#image-manager .qq-gallery .qq-total-progress-bar-container {
  margin-left: 9px;
  display: inline;
  float: right;
  width: 500px;
  background-color: #ddd;
  border-radius: 9px;
  position: relative;
}
#image-manager .qq-gallery .qq-upload-size {
  float: left;
  font-size: 11px;
  color: #929292;
  margin-bottom: 3px;
  margin-right: 0;
  display: inline-block;
}
#image-manager .qq-gallery INPUT.qq-edit-filename {
  position: absolute;
  opacity: 0;
  filter: alpha(opacity=0);
  z-index: -1;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
}
#image-manager .qq-gallery .qq-upload-file.qq-editable {
  cursor: pointer;
  margin-right: 20px;
}
#image-manager .qq-gallery .qq-edit-filename-icon.qq-editable {
  display: inline-block;
  cursor: pointer;
  position: absolute;
  right: 0;
  top: 0;
}
#image-manager .qq-gallery INPUT.qq-edit-filename.qq-editing {
  position: static;
  height: 28px;
  width: 90px;
  width: -moz-available;
  padding: 0 8px;
  margin-bottom: 3px;
  border: 1px solid #ccc;
  border-radius: 2px;
  font-size: 13px;
  opacity: 1;
  filter: alpha(opacity=100);
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
}
#image-manager .qq-gallery .qq-edit-filename-icon {
  display: none;
  background: url("edit.gif");
  width: 15px;
  height: 15px;
  vertical-align: text-bottom;
}
#image-manager .qq-gallery .qq-delete-icon {
  background: url("trash.gif");
  width: 15px;
  height: 15px;
  vertical-align: sub;
  display: inline-block;
}
#image-manager .qq-gallery .qq-retry-icon {
  background: url("retry.gif");
  width: 15px;
  height: 15px;
  vertical-align: sub;
  display: inline-block;
  float: none;
}
#image-manager .qq-gallery .qq-continue-icon {
  background: url("continue.gif");
  width: 15px;
  height: 15px;
  vertical-align: sub;
  display: inline-block;
}
#image-manager .qq-gallery .qq-pause-icon {
  background: url("pause.gif");
  width: 15px;
  height: 15px;
  vertical-align: sub;
  display: inline-block;
}
#image-manager .qq-gallery .qq-hide {
  display: none;
}
#image-manager .qq-gallery .qq-in-progress .qq-thumbnail-wrapper {
  /* makes the spinner on top of the thumbnail more visible */
  opacity: 0.5;
  filter: alpha(opacity=50);
}
#image-manager .qq-gallery .qq-thumbnail-wrapper {
  overflow: hidden;
  position: relative;
  /* to ensure consistent size of tiles - should match qq-max-size attribute value on qq-thumbnail-selector IMG element */
  height: 120px;
  width: 120px;
}
#image-manager .qq-gallery .qq-thumbnail-selector {
  border-radius: 2px 2px 0 0;
  bottom: 0;
  /* we will override this in the :root thumbnail selector (to help center the preview) for everything other than IE8 */
  top: 0;
  /* center the thumb horizontally in the tile */
  margin: auto;
  display: block;
}
#image-manager :root * > .qq-gallery .qq-thumbnail-selector {
  /* vertically center preview image on tile */
  position: relative;
  top: 50%;
  transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
}

#language-switch {
  display: none;
}
@media all and (min-width: 681px) {
  #language-switch {
    grid-row: language-switch-row-start/language-switch-row-end;
    grid-column: language-switch-col-start/language-switch-col-end;
    display: block;
    margin: -2px 0 0 10px;
    width: 50px;
    z-index: 11;
    height: 20px;
    justify-self: start;
  }
  #language-switch .dropdown button {
    background-color: transparent;
    border: none;
  }
  #language-switch .dropdown button:before {
    color: #ffffff;
  }
}
#language-switch .dropdown {
  padding-top: 0;
  background-image: none;
  border: none;
  background-color: transparent;
  height: 20px;
}
#language-switch .dropdown:after {
  border-top: 6px solid #ffffff;
}
#language-switch .dropdown button {
  height: 30px;
}
#language-switch .dropdown button.dropdown-button2:before {
  content: none;
}
#language-switch .dropdown button.dropdown-button2:after {
  top: 14px !important;
  right: 4px;
  border-top-color: #ffffff;
}

#language-switch-dropdown {
  min-width: 120px;
}

/*############################################
*##
*## Flag icons used for editing or switching different language versions
*## => Every icon represents a language considering the user location
*## => German can be signaled by an austrian, swiss or german flag
*##
*############################################*/
[class^=icons-lang-], [class*=" icons-lang-"] {
  line-height: 23px;
  margin-top: 2px;
}
[class^=icons-lang-]:before, [class*=" icons-lang-"]:before {
  content: "";
  display: inline-block;
  background: url("/images/desktop/generic/icons/flagsSpriteFlat.png") no-repeat;
  background-size: 20px auto;
  height: 22px;
  width: 20px;
  float: left;
}

/**
* The language switch should show the flag of the users country as primary country
* for the language switch (i.e. if a user is from Switzerland, the swiss flag should
* be displayed instead of the German flag)
*/
/* Standard for german: The german flag */
.icons-lang-de:before {
  background-position: 0 1px !important;
}

body.de_CH .icons-lang-de:before {
  background-position: 0 -22px !important;
}

body.de_AT .icons-lang-de:before {
  background-position: 0 -364px !important;
}

/* Standard for english: The british flag */
.icons-lang-en:before {
  background-position: 0 -114px !important;
}

body.en_US .icons-lang-en:before {
  background-position: 0 -250px !important;
}

body.en_AU .icons-lang-en:before {
  background-position: 0 -158px !important;
}

body.en_NZ .icons-lang-en:before {
  background-position: 0 -45px !important;
}

.icons-lang-fr:before {
  background-position: 0 -272px !important;
}

.icons-lang-es:before {
  background-position: 0 -226px !important;
}

#locator {
  position: relative;
  z-index: 0;
  width: 100%;
  max-width: 850px;
}
#locator form {
  padding-bottom: 20px;
}
#locator .geo-hierarchy-dropdowns {
  position: relative;
  height: 0;
  top: 20px;
}
#locator .geo-hierarchy-dropdowns .dropdown {
  display: inline-block;
  margin: 0 1%;
  width: 23%;
  z-index: 1;
}
#locator #locatorMap {
  margin-top: 10px;
  height: 300px;
}
#locator .ui-icon-gps::before {
  font-size: 32px;
}
#locator #eculocator-save {
  margin-top: 10px;
}

#colorbox #locator #locatorMap {
  width: 100%;
  max-width: 850px;
}

#regionsChooser .singleRegion {
  width: 100%;
  padding: 10px 0;
}
#regionsChooser .singleRegion .region-state {
  display: inline-block;
  margin-left: 10px;
}
#regionsChooser .singleRegion .region-state div {
  display: inline-block;
}
#regionsChooser label {
  display: inline-block;
}

/*############################################
 *## On PersonalECUCreation page
 *############################################*/
.personalecucreation .onlyContentSite {
  grid-row: content-row1-start/content-row2-start;
  grid-column: content-col1-start/content-col12-end;
}

#regionsChooser {
  min-width: 600px;
}
#regionsChooser .singleRegion {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: start;
  -moz-box-pack: start;
  -ms-flex-pack: start;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: center;
  -moz-align-items: center;
  -ms-align-items: center;
  -o-align-items: center;
  align-items: center;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: flex-start;
  -moz-justify-content: flex-start;
  -o-justify-content: flex-start;
  -ms-justify-content: flex-start;
  justify-content: flex-start;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
}
#regionsChooser .singleRegion label {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: start;
  -moz-box-pack: start;
  -ms-flex-pack: start;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: center;
  -moz-align-items: center;
  -ms-align-items: center;
  -o-align-items: center;
  align-items: center;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: flex-start;
  -moz-justify-content: flex-start;
  -o-justify-content: flex-start;
  -ms-justify-content: flex-start;
  justify-content: flex-start;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
}

.entitymain #ecu-map {
  height: 100%;
  position: relative;
}
.entitymain #ecu-map .ol-attribution .SkiresortOpenClosed {
  display: none;
}
.entitymain #ecu-map .ol-attribution .Difficulty {
  display: block;
}
.entitymain #ecu-map .ol-attribution[data-legend=SkiresortOpenClosed] .SkiresortOpenClosed {
  display: block;
}
.entitymain #ecu-map .ol-attribution[data-legend=SkiresortOpenClosed] .Difficulty {
  display: none;
}
.entitymain #ecu-map .ol-attribution[data-legend=Difficulty] .SkiresortOpenClosed {
  display: none;
}
.entitymain #ecu-map .ol-attribution[data-legend=Difficulty] .Difficulty {
  display: block;
}
.entitymain .in-phantom-call #ecu-map {
  height: 264px;
}
.entitymain.e_skiresort .entity-page-map, .entitymain.e_xcskiing .entity-page-map {
  display: none;
}
@media all and (min-width: 861px) {
  .entitymain.e_skiresort .entity-page-map, .entitymain.e_xcskiing .entity-page-map {
    display: block;
    grid-row: content-row1-start/content-row1-end;
    grid-column: content-col9-start/content-col12-end;
    height: calc(100% - 6px);
  }
}
.entitymain.e_accommodation #entity-map {
  order: 2;
}

.usermain .entity-page-map {
  display: none;
  background-color: transparent;
}
@media all and (min-width: 861px) {
  .usermain .entity-page-map {
    display: block;
    height: 100%;
    padding-bottom: 28px;
    max-height: none;
    grid-row: content-row1-start/content-row1-end;
    grid-column: content-col9-start/content-col12-end;
  }
  .usermain .entity-page-map #ecu-map {
    height: 100%;
  }
  .usermain .entity-page-map .headlines {
    font-size: 0.9rem;
  }
}

.entity-page-map {
  height: 100%;
  position: relative;
}
.entity-page-map .edit-buttons {
  position: absolute;
  bottom: 10px;
  left: 10px;
}

.group-page-map {
  grid-row: content-row1-start/content-row1-end;
  grid-column: content-col1-start/content-col12-end;
  position: relative;
  top: calc(-8px - 0px);
  height: 220px;
  -webkit-background-size: cover;
  background-size: auto;
  background-position: center;
}
@media all and (min-width: 681px) {
  .group-page-map {
    top: calc(-10px - 0px);
  }
}
@media all and (min-width: 681px) {
  .group-page-map {
    height: 320px;
  }
}
@media all and (min-width: 1401px) {
  .group-page-map {
    height: 346px;
  }
}

/*############################################
 *## Positioning on the grid depending on page type
 *############################################*/
.index #heat-map-headline {
  grid-row: content-row5-start/content-row5-end;
  grid-column: content-col1-start/content-col12-end;
  border-bottom: 1px solid #ccc;
  margin: 0 10px;
}
.index #heat-map-fresh-snow {
  grid-row: content-row6-start/content-row6-end;
  grid-column: content-col1-start/content-col12-end;
}
.index #heat-map-snow-height {
  grid-row: content-row7-start/content-row7-end;
  grid-column: content-col1-start/content-col12-end;
}
.index #heat-map-sunshine-forecast {
  grid-row: content-row8-start/content-row8-end;
  grid-column: content-col1-start/content-col12-end;
}
.index #heat-map-fresh-snow, .index #heat-map-snow-height, .index #heat-map-sunshine-forecast {
  background-color: #ffffff;
}
.index #heat-map-fresh-snow a h2, .index #heat-map-snow-height a h2, .index #heat-map-sunshine-forecast a h2 {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.index #heat-map-deep-links {
  grid-row: content-row9-start/content-row9-end;
  grid-column: content-col1-start/content-col12-end;
  background-color: #fafafa;
  padding-top: 10px;
  width: 100%;
}
.index #heat-map-deep-links .deep-links {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: center;
  -moz-justify-content: center;
  -o-justify-content: center;
  -ms-justify-content: center;
  justify-content: center;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
  align-self: end;
}
.index #heat-map-deep-links .deep-links .button:not(:first-child) {
  margin-left: 30px;
}
.index #heat-map-deep-links #ecu-text-teaser {
  margin-top: 50px;
  margin-bottom: 0;
  display: none;
}
@media all and (min-width: 681px) {
  .index #heat-map-deep-links #ecu-text-teaser {
    display: grid !important;
  }
}
@media all and (min-width: 681px) {
  .index #heat-map-deep-links {
    grid-row: content-row6-start/content-row6-end;
    grid-column: content-col1-start/content-col12-end;
  }
  .index #heat-map-sunshine-forecast {
    grid-row: content-row5-start/content-row5-end;
    grid-column: content-col9-start/content-col12-end;
    margin-right: 10px;
    margin-left: 0;
    width: calc(100% - 10px);
    margin-top: 0;
    margin-bottom: 0;
    background-color: #ffffff;
    padding: 0 10px;
    margin-top: 10px;
    margin-bottom: 10px;
  }
}
@media all and (min-width: 681px) and (min-width: 481px) {
  .index #heat-map-sunshine-forecast {
    padding: 10px;
  }
}
@media all and (min-width: 681px) {
  .index #heat-map-sunshine-forecast .material-divider {
    border-bottom: none;
  }
  .index #heat-map-snow-height {
    grid-row: content-row5-start/content-row5-end;
    grid-column: content-col5-start/content-col8-end;
    margin-top: 0;
    margin-bottom: 0;
    background-color: #ffffff;
    padding: 0 10px;
    margin-top: 10px;
    margin-bottom: 10px;
  }
}
@media all and (min-width: 681px) and (min-width: 481px) {
  .index #heat-map-snow-height {
    padding: 10px;
  }
}
@media all and (min-width: 681px) {
  .index #heat-map-snow-height .material-divider {
    border-bottom: none;
  }
  .index #heat-map-fresh-snow {
    grid-row: content-row5-start/content-row5-end;
    grid-column: content-col1-start/content-col4-end;
    margin-left: 10px;
    margin-right: 0;
    width: calc(100% - 10px);
    margin-top: 0;
    margin-bottom: 0;
    background-color: #ffffff;
    padding: 0 10px;
    margin-top: 10px;
    margin-bottom: 10px;
  }
}
@media all and (min-width: 681px) and (min-width: 481px) {
  .index #heat-map-fresh-snow {
    padding: 10px;
  }
}
@media all and (min-width: 681px) {
  .index #heat-map-fresh-snow .material-divider {
    border-bottom: none;
  }
  .index #heat-map-sunshine-forecast .collapsible-headline, .index #heat-map-snow-height .collapsible-headline, .index #heat-map-fresh-snow .collapsible-headline {
    font-size: 1rem;
  }
  .index #heat-map-headline {
    display: block;
    margin: 0;
    padding-left: 10px;
    grid-row: content-row5-start/content-row5-end;
    grid-column: content-col1-start/content-col12-end;
    background-color: #fafafa;
  }
  .index #heat-map-background {
    background-color: #f1f1f1;
    z-index: -2;
    width: 100%;
    height: 100%;
    grid-row: content-row5-start/content-row5-end;
    grid-column: content-col1-start/content-col12-end;
    margin-bottom: 30px;
  }
}
@media all and (min-width: 1151px) {
  .index #heat-map-sunshine-forecast .collapsible-headline, .index #heat-map-snow-height .collapsible-headline, .index #heat-map-fresh-snow .collapsible-headline {
    font-size: 1.15rem;
  }
}
@media all and (min-width: 1401px) {
  .index #heat-map-headline {
    padding-left: 0;
  }
}

.aggregatorentity #heat-map-headline, .aggregatorentity #heat-map-background, .aggregatorentity #heat-map-deep-links {
  display: none;
}
.aggregatorentity #heat-map-fresh-snow {
  grid-row: content-row1-start/content-row4-end;
  grid-column: content-col1-start/content-col12-end;
  background-color: white;
  margin: 0 10px;
}
.aggregatorentity #heat-map-sunshine-forecast {
  grid-row: content-row5-start/content-row5-end;
  grid-column: content-col1-start/content-col12-end;
  background-color: white;
  margin: 0 10px;
}
@media all and (min-width: 681px) {
  .aggregatorentity #heat-map-fresh-snow {
    grid-row: content-row2-start/content-row2-end;
    grid-column: content-col1-start/content-col6-end;
    margin-left: 10px;
    margin-right: 0;
    width: calc(100% - 10px);
    margin-bottom: 10px;
    margin-top: 0;
    height: calc(100% - 10px);
    background-color: #ffffff;
    padding: 0 10px;
  }
}
@media all and (min-width: 681px) and (min-width: 481px) {
  .aggregatorentity #heat-map-fresh-snow {
    padding: 10px;
  }
}
@media all and (min-width: 681px) {
  .aggregatorentity #heat-map-fresh-snow .material-divider {
    border-bottom: none;
  }
  .aggregatorentity #heat-map-sunshine-forecast {
    grid-row: content-row2-start/content-row2-end;
    grid-column: content-col7-start/content-col12-end;
    margin-right: 10px;
    margin-left: 0;
    width: calc(100% - 10px);
    margin-bottom: 10px;
    margin-top: 0;
    height: calc(100% - 10px);
    background-color: #ffffff;
    padding: 0 10px;
  }
}
@media all and (min-width: 681px) and (min-width: 481px) {
  .aggregatorentity #heat-map-sunshine-forecast {
    padding: 10px;
  }
}
@media all and (min-width: 681px) {
  .aggregatorentity #heat-map-sunshine-forecast .material-divider {
    border-bottom: none;
  }
}

/*############################################
 *## Module Styles
 *############################################*/
.heat-map-slider {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: center;
  -moz-align-items: center;
  -ms-align-items: center;
  -o-align-items: center;
  align-items: center;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
  font-weight: 700;
  background: rgba(255, 255, 255, 0.8);
  bottom: -1px;
  padding-left: 10px;
  position: absolute;
  width: 100%;
  z-index: 1;
}
.heat-map-slider .toggle-play-stop {
  color: #0375b4;
  background: none;
  margin-right: 10px;
  width: 30px;
}
.heat-map-slider .toggle-play-stop:before {
  line-height: 32px;
}
.heat-map-slider > input {
  width: 80% !important;
  margin: 0;
}
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
  .heat-map-slider > input {
    width: 60% !important;
  }
}
.heat-map-slider > output {
  font-size: 0.74rem;
  color: #0375b4;
  width: 100px;
  text-align: right;
  padding-right: 10px;
}

.inactive-contenttab .heat-map-slider {
  display: none;
}

.heat-map-container {
  width: 100%;
  height: 400px;
  margin-bottom: 10px;
}
.heat-map-container .heat-map-image {
  position: relative;
  background: no-repeat center center;
  width: 100%;
  height: 100%;
}

.heat-map-box {
  position: relative;
}
.heat-map-box .heat-map-caption {
  display: none;
}
.heat-map-box .toggle-fullscreen {
  color: #0375b4;
  cursor: pointer;
  z-index: 1;
}
.heat-map-box .toggle-fullscreen.ui-icon-fullscreen-false, .heat-map-box .toggle-fullscreen.ui-icon-fullscreen-true {
  width: 30px;
  height: 30px;
  padding: 6px;
}
.heat-map-box .toggle-fullscreen.ui-icon-fullscreen-false:before, .heat-map-box .toggle-fullscreen.ui-icon-fullscreen-true:before {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  top: 0;
  line-height: 30px;
  margin: 0;
}
.heat-map-box .toggle-fullscreen.ui-icon-fullscreen-false {
  background-color: rgba(255, 255, 255, 0.8);
  position: absolute;
  top: 3px;
  right: 3px;
}
.heat-map-box .toggle-fullscreen.ui-icon-fullscreen-false:before {
  font-size: 20px;
}
.heat-map-box .toggle-fullscreen.ui-icon-fullscreen-true {
  background-color: #ffffff;
  position: fixed;
  top: 5px;
  right: 10px;
  padding: 6px;
}
.heat-map-box .toggle-fullscreen.ui-icon-fullscreen-true:before {
  font-size: 28px;
}
.heat-map-box .heat-map-image {
  position: relative;
  width: 100%;
  height: 170px;
}
.heat-map-box.without-list .heat-map-image {
  height: 290px;
}
.heat-map-box .heat-map-image-scroll-container {
  width: 100%;
  height: 100%;
  background-color: #727272;
}
.heat-map-box .heat-map-bg-image {
  background: no-repeat center center;
  width: 100%;
  height: 100%;
  background-size: cover;
}
.heat-map-box .heat-map-bg-image.is-old:before {
  content: "\f021";
  font-family: TourispoWebfonts !important;
  font-weight: 400;
  font-style: normal;
  display: inline-block;
  width: 100%;
  line-height: 170px;
  text-align: center;
  font-size: 100px;
  color: #0375b4;
  -webkit-animation: spin 1s linear 0s infinite;
  -moz-animation: spin 1s linear 0s infinite;
  -ms-animation: spin 1s linear 0s infinite;
  -o-animation: spin 1s linear 0s infinite;
  animation: spin 1s linear 0s infinite;
}
.heat-map-box.fullscreen {
  position: fixed;
  width: 100%;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  z-index: 100000;
  margin-top: 0;
  margin-bottom: 0;
}
.heat-map-box.fullscreen input {
  width: 95% !important;
}
.heat-map-box.fullscreen .heat-map-image {
  height: 400px !important;
}
.heat-map-box.fullscreen .heat-map-caption {
  display: block;
}
.heat-map-box.fullscreen ul.top-entities li {
  display: inherit !important;
}
.heat-map-box .description {
  position: relative;
  margin-bottom: 3px;
}
.heat-map-box .short-value li {
  padding-right: 30px;
}
.heat-map-box .long-value li {
  padding-right: 56px;
}
.heat-map-box ul.top-entities {
  display: none;
  margin-top: 10px;
}
.heat-map-box ul.top-entities:first-child {
  display: inherit;
}
.heat-map-box ul.top-entities li {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: start;
  -moz-box-pack: start;
  -ms-flex-pack: start;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: center;
  -moz-align-items: center;
  -ms-align-items: center;
  -o-align-items: center;
  align-items: center;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: flex-start;
  -moz-justify-content: flex-start;
  -o-justify-content: flex-start;
  -ms-justify-content: flex-start;
  justify-content: flex-start;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
  font-size: 0.9rem;
  position: relative;
  line-height: 28px;
}
.heat-map-box ul.top-entities li > div {
  display: inline-block;
  vertical-align: top;
  flex-shrink: 0;
  -webkit-flex-shrink: 0;
  -moz-flex-shrink: 0;
  -ms-flex-shrink: 0;
  -o-flex-shrink: 0;
}
.heat-map-box ul.top-entities li .item-number {
  width: 20px;
  height: 20px;
  line-height: 20px;
  background: #0375b4;
  border-radius: 10px;
  text-align: center;
  color: white;
  font-size: 0.9rem;
  font-weight: 700;
  margin-right: 10px;
}
.heat-map-box ul.top-entities li [class^=icons-flag-] {
  height: 20px;
}
.heat-map-box ul.top-entities li .top-entity-name-region {
  flex-shrink: 1;
  -webkit-flex-shrink: 1;
  -moz-flex-shrink: 1;
  -ms-flex-shrink: 1;
  -o-flex-shrink: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.heat-map-box ul.top-entities li .list-value {
  position: absolute;
  right: 10px;
}
.heat-map-box ul.top-entities li:nth-child(5) ~ li {
  display: none;
}
@media all and (min-width: 681px) {
  .heat-map-box.fullscreen {
    max-width: 600px;
    margin: 0 auto !important;
  }
  .heat-map-box.fullscreen:before {
    content: "";
    background-color: #ffffff;
    position: fixed;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
  }
}

.heat-map-caption {
  height: 40px;
}
.heat-map-caption .heat-map-scale {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: distribute;
  -moz-box-pack: distribute;
  -ms-flex-pack: distribute;
  -webkit-box-align: stretch;
  -moz-box-align: stretch;
  -ms-flex-align: stretch;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  box-lines: multiple;
  -moz-box-lines: multiple;
  -webkit-box-lines: multiple;
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-flex-flow: row wrap;
  -webkit-justify-content: space-around;
  -moz-justify-content: space-around;
  -o-justify-content: space-around;
  -ms-justify-content: space-around;
  justify-content: space-around;
  flex-wrap: wrap;
  -ms-flex-wrap: wrap; /* IE 10 */
  -webkit-flex-wrap: wrap;
  height: 40px;
  width: 100%;
  float: left;
  padding: 0 10px;
}
.heat-map-caption .heat-map-scale .scale-item {
  flex-grow: 1;
  font-weight: 700;
  line-height: 40px;
  color: white;
  text-align: right;
  font-size: 14px;
}
.heat-map-caption .heat-map-scale .scale-item:first-child {
  flex-grow: 0 !important;
}
.heat-map-caption .heat-map-unit {
  display: inline-block;
  font-weight: 700;
  line-height: 40px;
  padding-left: 1%;
  width: 11%;
}

.heat-map-marker {
  display: none;
}

.maps {
  background: #727272;
  background-size: cover;
}

#orientation-map {
  display: none;
}
@media all and (min-width: 681px) {
  #orientation-map {
    display: block;
    width: 140px;
    max-width: 100%;
    justify-self: end;
    padding-right: 10px;
    margin-bottom: 10px;
    grid-row: orientation-map-row;
    grid-column: orientation-map-col-start/orientation-map-col-end;
    margin-top: 6px;
    position: relative;
    z-index: 2;
  }
  #orientation-map img {
    padding-left: 6px;
    width: 100%;
    height: auto;
  }
}
@media all and (min-width: 1025px) {
  #orientation-map {
    padding-right: 0;
  }
}

@media all and (max-width: 1401px) {
  #aggregator-entity-map {
    padding-left: 10px;
  }
}
@media all and (max-width: 861px) {
  #aggregator-entity-map {
    padding-right: 10px;
  }
}
#aggregator-entity-map .collapsible-content {
  height: 270px;
}
#aggregator-entity-map .collapsible-content #ecu-map {
  height: 100%;
}

/*############################################
 *## Module styles
 *############################################*/
.global-map-fullscreen {
  background-color: #ccc;
  position: fixed;
  top: 106px;
  bottom: 0;
  right: 0;
  left: 0;
}
.global-map-fullscreen .what-do-i-see {
  position: absolute;
  left: 30px;
  top: 20px;
  width: 300px;
  padding: 0 6px 6px 6px;
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: flex;
  -webkit-flex-direction: column;
  -webkit-box-orient: vertical; /* Safari <= 6*/
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  -o-flex-direction: column;
  flex-direction: column;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: nowrap;
  -webkit-flex-wrap: nowrap;
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
}
.global-map-fullscreen .what-do-i-see.disabled {
  visibility: hidden;
}
.global-map-fullscreen .what-do-i-see .wdis-symbol:before {
  visibility: visible;
}
.global-map-fullscreen .what-do-i-see.activated {
  width: 430px;
  max-width: 84vw;
  bottom: 20px;
}
.global-map-fullscreen .what-do-i-see.activated .ol-overviewmap-map {
  display: none;
}
.global-map-fullscreen .what-do-i-see .wdis-headline {
  color: #0375b4;
  font-size: 1.15rem;
  line-height: 2.3;
}
.global-map-fullscreen .what-do-i-see .wdis-symbol {
  position: relative;
}
.global-map-fullscreen .what-do-i-see .wdis-symbol:before {
  width: 44px;
  height: 44px;
  line-height: 44px;
  cursor: pointer;
  margin-right: 10px;
  border: 2px solid #0375b4;
  background-color: #ffffff;
  border-radius: 50%;
  color: #0375b4;
  text-align: center;
  font-size: 1.6rem;
  position: relative;
  left: -14px;
  top: -6px;
}
.global-map-fullscreen .what-do-i-see .wdis-symbol:after {
  position: absolute;
  right: 10px;
  top: 0;
  color: #0375b4;
  font-size: 1.6rem;
  line-height: 1.8;
  cursor: pointer;
}
.global-map-fullscreen .what-do-i-see .ol-overviewmap-box {
  border: 1px solid #ff0000;
}
.global-map-fullscreen .what-do-i-see .wdis-list {
  margin-bottom: 10px;
  overflow: auto;
}
.global-map-fullscreen .what-do-i-see .wdis-list .tile-list {
  display: grid;
  grid-gap: 10px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.global-map-fullscreen .what-do-i-see .wdis-list .tile-list .tile:hover {
  border: 2px solid #0375b4;
}
.global-map-fullscreen #globalMap {
  height: 100%;
}
.global-map-fullscreen #globalMap .mapToolTipBubble-globalMap .sb-content {
  white-space: nowrap;
  line-height: 1.5;
}
.global-map-fullscreen #globalMap .wdis-highlight-feature {
  border-radius: 50%;
  border: 4px solid #0375b4;
  width: 50px;
  height: 50px;
}
@media all and (max-width: 861px) {
  .global-map-fullscreen {
    top: 100px;
  }
  .global-map-fullscreen .what-do-i-see {
    visibility: hidden;
    left: 14px;
    top: 14px;
  }
  .global-map-fullscreen .what-do-i-see.activated {
    width: 250px;
  }
  .global-map-fullscreen .what-do-i-see.symbol-clicked.disabled {
    visibility: visible;
  }
  .global-map-fullscreen .what-do-i-see .wdis-list .tile-list {
    display: grid;
    grid-gap: 10px;
    grid-template-columns: repeat(1, minmax(0, 1fr));
  }
}

#cookie-hint {
  padding: 10px;
  width: 100%;
  position: fixed;
  bottom: 0;
  left: 0;
  z-index: 1000;
  background-color: #ffffff;
  box-shadow: rgba(0, 0, 0, 0.25) 0px 14px 45px, rgba(0, 0, 0, 0.22) 0px 10px 18px;
}
#cookie-hint .cookie-hint-container {
  max-width: 1400px;
  margin: 0 auto;
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  box-lines: multiple;
  -moz-box-lines: multiple;
  -webkit-box-lines: multiple;
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: center;
  -moz-align-items: center;
  -ms-align-items: center;
  -o-align-items: center;
  align-items: center;
  -webkit-flex-flow: row wrap;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: wrap;
  -ms-flex-wrap: wrap; /* IE 10 */
  -webkit-flex-wrap: wrap;
}
#cookie-hint .cookie-hint-container > span {
  font-size: 0.9rem;
  -moz-hyphens: auto;
  -o-hyphens: auto;
  -webkit-hyphens: auto;
  -ms-hyphens: auto;
  hyphens: auto;
  margin-bottom: 10px;
}
#cookie-hint .cookie-hint-container .link {
  margin-bottom: 10px;
}
@media all and (min-width: 861px) {
  #cookie-hint .cookie-hint-container > span {
    font-size: 1rem;
  }
}

#error-report .introduction {
  font-size: 0.84rem;
}
#error-report .collapsible-content {
  background-color: #ffffff;
  border-top: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
  padding: 10px;
}
#error-report .collapsible-content > .element-actions {
  padding-top: 10px;
}

#multi-message-form, #message-form {
  grid-row: content-row1-start/content-row11-end;
  grid-column: content-col1-start/content-col12-end;
}
@media all and (max-width: 1401px) {
  #multi-message-form, #message-form {
    padding-left: 10px;
  }
}
@media all and (max-width: 861px) {
  #multi-message-form, #message-form {
    padding-right: 10px;
  }
}

#multi-message-form .personal-data .dropdown {
  margin-top: 14px;
}
#multi-message-form button.message-form-submit {
  margin-top: 20px;
  width: 100%;
}
@media all and (min-width: 681px) {
  #multi-message-form button.message-form-submit {
    width: 50%;
    padding-right: 50px;
    display: block;
    text-align: center;
  }
}

#message-form .captcha-container {
  background-color: #ffffff;
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: center;
  -moz-justify-content: center;
  -o-justify-content: center;
  -ms-justify-content: center;
  justify-content: center;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
}
#message-form button.primary {
  margin-top: 20px;
}
@media all and (min-width: 681px) {
  #message-form fieldset:not(.terms-of-use) > div {
    display: grid;
    grid-gap: 10px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  #message-form .vorname {
    grid-column-start: 1;
  }
  #message-form .email, #message-form .betreff, #message-form .message-item {
    grid-column-start: 1;
    grid-column-end: 3;
  }
}

@media all and (max-width: 1401px) {
  .entitycontact #message-form {
    padding-left: 10px;
  }
}
@media all and (max-width: 861px) {
  .entitycontact #message-form {
    padding-right: 10px;
  }
}

.bottom-tab-navigation {
  background-color: #fafafa;
  box-shadow: inset 0 1px 0 #c4ccda;
  position: fixed;
  bottom: 0;
  left: 0;
  z-index: 100;
  width: 100%;
  height: 54px;
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: start;
  -moz-box-pack: start;
  -ms-flex-pack: start;
  -webkit-box-align: stretch;
  -moz-box-align: stretch;
  -ms-flex-align: stretch;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: flex-start;
  -moz-justify-content: flex-start;
  -o-justify-content: flex-start;
  -ms-justify-content: flex-start;
  justify-content: flex-start;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
}
.bottom-tab-navigation .bottom-tab-navigation-item {
  min-width: 0;
  flex-basis: 0;
  flex-shrink: 1;
  -webkit-flex-shrink: 1;
  -moz-flex-shrink: 1;
  -ms-flex-shrink: 1;
  -o-flex-shrink: 1;
  flex-grow: 1;
  -webkit-flex-grow: 1;
  -moz-flex-grow: 1;
  -ms-flex-grow: 1;
  -o-flex-grow: 1;
  color: #727272;
  padding: 8px 10px 7px 10px;
  cursor: pointer;
  border-top: 2px solid transparent;
}
.bottom-tab-navigation .bottom-tab-navigation-item .tab-activator {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: flex;
  -webkit-flex-direction: column;
  -webkit-box-orient: vertical; /* Safari <= 6*/
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  -o-flex-direction: column;
  flex-direction: column;
  -webkit-align-items: center;
  -moz-align-items: center;
  -ms-align-items: center;
  -o-align-items: center;
  align-items: center;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: nowrap;
  -webkit-flex-wrap: nowrap;
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
}
.bottom-tab-navigation .bottom-tab-navigation-item#control-panel-account {
  order: 1;
}
.bottom-tab-navigation .bottom-tab-navigation-item#control-panel-content-edit {
  order: 2;
}
.bottom-tab-navigation .bottom-tab-navigation-item#control-panel-content-edit .button {
  margin-top: 10px;
}
.bottom-tab-navigation .bottom-tab-navigation-item#meta-edit {
  order: 3;
}
.bottom-tab-navigation .bottom-tab-navigation-item.data-quality-on-detail-page {
  order: 4;
}
.bottom-tab-navigation .bottom-tab-navigation-item#admin-panel {
  order: 5;
}
.bottom-tab-navigation .bottom-tab-navigation-item.logout {
  order: 6;
  color: #f18825;
  font-size: 0.84rem;
}
.bottom-tab-navigation .bottom-tab-navigation-item.logout:before {
  font-size: 1rem;
  height: 26px;
  line-height: 26px;
}
.bottom-tab-navigation .bottom-tab-navigation-item .ui-icon-close:before {
  font-size: 2.6rem;
  color: #0375b4;
  position: absolute;
  right: 10px;
  top: 10px;
}
.bottom-tab-navigation .bottom-tab-navigation-item.expanded, .bottom-tab-navigation .bottom-tab-navigation-item.expanded-on-touch {
  border-top: 2px solid #0375b4;
}
.bottom-tab-navigation .bottom-tab-navigation-item.expanded .bottom-tab-navigation-item-label, .bottom-tab-navigation .bottom-tab-navigation-item.expanded-on-touch .bottom-tab-navigation-item-label {
  color: #0375b4;
}
.bottom-tab-navigation .bottom-tab-navigation-item.expanded .bottom-tab-navigation-item-icon, .bottom-tab-navigation .bottom-tab-navigation-item.expanded-on-touch .bottom-tab-navigation-item-icon {
  color: #0375b4;
}
.bottom-tab-navigation .bottom-tab-navigation-item.expanded .bottom-tab-navigation-item-icon img, .bottom-tab-navigation .bottom-tab-navigation-item.expanded-on-touch .bottom-tab-navigation-item-icon img {
  border: 2px solid #0375b4;
}
.bottom-tab-navigation .bottom-tab-navigation-item.expanded .bottom-tab-navigation-tab, .bottom-tab-navigation .bottom-tab-navigation-item.expanded-on-touch .bottom-tab-navigation-tab {
  max-height: 80vh;
  padding: 10px;
  overflow-y: auto;
}
.bottom-tab-navigation .bottom-tab-navigation-item.expanded .bottom-tab-navigation-tab.fullscreen, .bottom-tab-navigation .bottom-tab-navigation-item.expanded-on-touch .bottom-tab-navigation-tab.fullscreen {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 54px;
  max-height: 100vh;
  border: 14px solid #ffffff;
  border-radius: 5px;
}
@media all and (min-width: 1401px) {
  .bottom-tab-navigation .bottom-tab-navigation-item.expanded, .bottom-tab-navigation .bottom-tab-navigation-item.expanded-on-touch {
    height: auto;
    min-height: fit-content;
    border-top: none;
  }
  .bottom-tab-navigation .bottom-tab-navigation-item.expanded .bottom-tab-navigation-tab, .bottom-tab-navigation .bottom-tab-navigation-item.expanded-on-touch .bottom-tab-navigation-tab {
    display: block;
    padding: 0;
  }
  .bottom-tab-navigation .bottom-tab-navigation-item.expanded .bottom-tab-navigation-tab .button-panel, .bottom-tab-navigation .bottom-tab-navigation-item.expanded-on-touch .bottom-tab-navigation-tab .button-panel {
    /* For understanding browsers */
    -webkit-flex-direction: column;
    -moz-flex-direction: column;
    -ms-flex-direction: column;
    -o-flex-direction: column;
    flex-direction: column;
    -webkit-flex-flow: column wrap;
  }
  .bottom-tab-navigation .bottom-tab-navigation-item.expanded .bottom-tab-navigation-tab .button-panel .button-panel-item, .bottom-tab-navigation .bottom-tab-navigation-item.expanded-on-touch .bottom-tab-navigation-tab .button-panel .button-panel-item {
    margin: 6px 0;
  }
  .bottom-tab-navigation .bottom-tab-navigation-item.expanded .bottom-tab-navigation-tab.fullscreen, .bottom-tab-navigation .bottom-tab-navigation-item.expanded-on-touch .bottom-tab-navigation-tab.fullscreen {
    position: fixed;
    top: 20px;
    left: 20px;
    right: 20px;
    bottom: 20px;
    max-height: 100vh;
    width: auto;
    z-index: 10;
  }
  .bottom-tab-navigation .bottom-tab-navigation-item.expanded .bottom-tab-navigation-tab.fullscreen + .bottom-tab-navigation-tab-background, .bottom-tab-navigation .bottom-tab-navigation-item.expanded-on-touch .bottom-tab-navigation-tab.fullscreen + .bottom-tab-navigation-tab-background {
    position: fixed;
    z-index: 9;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.6);
  }
  .bottom-tab-navigation .bottom-tab-navigation-item.expanded .tab-activator:after, .bottom-tab-navigation .bottom-tab-navigation-item.expanded-on-touch .tab-activator:after {
    content: "\f147";
  }
}
.bottom-tab-navigation .bottom-tab-navigation-item .bottom-tab-navigation-item-icon {
  width: 26px;
  height: 26px;
}
.bottom-tab-navigation .bottom-tab-navigation-item .bottom-tab-navigation-item-icon:before {
  margin: 0 auto;
  height: 26px;
  line-height: 26px;
}
.bottom-tab-navigation .bottom-tab-navigation-item .bottom-tab-navigation-item-icon img, .bottom-tab-navigation .bottom-tab-navigation-item .bottom-tab-navigation-item-icon .image-placeholder {
  width: 26px;
  height: 26px;
  border-radius: 50%;
  border: 2px solid #727272;
}
.bottom-tab-navigation .bottom-tab-navigation-item .bottom-tab-navigation-item-icon .image-placeholder:before {
  font-size: 20px;
}
.bottom-tab-navigation .bottom-tab-navigation-item .bottom-tab-navigation-item-label {
  font-size: 0.84rem;
  white-space: nowrap;
}
.bottom-tab-navigation .bottom-tab-navigation-item .bottom-tab-navigation-tab {
  max-height: 0;
  overflow: hidden;
  position: absolute;
  bottom: 54px;
  left: 10px;
  right: 10px;
  background-color: #fafafa;
  box-shadow: inset 0 1px 0 #c4ccda;
  border-left: 1px solid #ccc;
  border-right: 1px solid #ccc;
  -ms-transition: all 500ms ease 0s;
  transition: all 500ms ease 0s;
  -ms-transition-property: max-height;
  transition-property: max-height;
}
.bottom-tab-navigation .bottom-tab-navigation-item .bottom-tab-navigation-tab .button-panel {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: flex;
  -webkit-flex-direction: column;
  -webkit-box-orient: vertical; /* Safari <= 6*/
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  -o-flex-direction: column;
  flex-direction: column;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-justify-content: flex-start;
  -moz-justify-content: flex-start;
  -o-justify-content: flex-start;
  -ms-justify-content: flex-start;
  justify-content: flex-start;
  flex-wrap: nowrap;
  -webkit-flex-wrap: nowrap;
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: start;
  -moz-box-pack: start;
  -ms-flex-pack: start;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  padding: 10px 0;
}
.bottom-tab-navigation .bottom-tab-navigation-item .bottom-tab-navigation-tab .button-panel .button-panel-item {
  margin-bottom: 14px;
}
.bottom-tab-navigation .background-fader {
  display: none;
  background-color: white;
  z-index: -1;
  position: fixed;
  left: 0;
  right: 0;
  top: 50px;
  width: 100vw;
  opacity: 0.7;
}
.bottom-tab-navigation .background-fader.visible {
  display: block;
  bottom: 0;
}
.bottom-tab-navigation .background-fader:hover {
  display: none !important;
}
@media all and (min-width: 1401px) {
  .bottom-tab-navigation {
    grid-row: breadcrumb-row/content-row14-end;
    grid-column: logo-col-start/content-col1-start;
    position: -webkit-sticky;
    position: sticky;
    top: 75px;
    z-index: 44;
    min-width: 200px;
    overflow: hidden;
    margin-top: -9px;
    height: fit-content;
    box-shadow: none;
    /* For understanding browsers */
    -webkit-flex-direction: column;
    -moz-flex-direction: column;
    -ms-flex-direction: column;
    -o-flex-direction: column;
    flex-direction: column;
    -webkit-flex-flow: column nowrap;
  }
  .bottom-tab-navigation .background-fader.visible {
    display: none;
  }
  .bottom-tab-navigation .bottom-tab-navigation-item {
    flex-grow: 0;
    min-height: 50px;
    border-bottom: 1px #ccc solid;
    border-top: none;
  }
  .bottom-tab-navigation .bottom-tab-navigation-item .tab-activator {
    display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
    display: -webkit-flex; /* Safari 7*/
    display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
    display: -ms-flexbox; /* IE10 */
    display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
    display: flex;
    /* Simulating 2012 flexbox model (used in IE 10) */
    /* Legacy Browsers (IE 10)*/
    -webkit-box-pack: justify;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-box-align: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
    box-lines: multiple;
    -moz-box-lines: multiple;
    -webkit-box-lines: multiple;
    /* For understanding browsers */
    -webkit-flex-direction: row;
    -moz-flex-direction: row;
    -ms-flex-direction: row;
    -o-flex-direction: row;
    flex-direction: row;
    -webkit-align-items: center;
    -moz-align-items: center;
    -ms-align-items: center;
    -o-align-items: center;
    align-items: center;
    -webkit-flex-flow: row wrap;
    -webkit-justify-content: space-between;
    -moz-justify-content: space-between;
    -o-justify-content: space-between;
    -ms-justify-content: space-between;
    justify-content: space-between;
    flex-wrap: wrap;
    -ms-flex-wrap: wrap; /* IE 10 */
    -webkit-flex-wrap: wrap;
  }
  .bottom-tab-navigation .bottom-tab-navigation-item .tab-activator:after {
    order: 3;
    font-family: TourispoWebfonts !important;
    font-weight: 400;
    font-style: normal;
    display: inline-block;
    content: "\f0fe";
  }
  .bottom-tab-navigation .bottom-tab-navigation-item.expanded-on-large-screens:not(.collapsed) {
    border-top: 2px solid #0375b4;
  }
  .bottom-tab-navigation .bottom-tab-navigation-item.expanded-on-large-screens:not(.collapsed) .bottom-tab-navigation-item-label {
    color: #0375b4;
  }
  .bottom-tab-navigation .bottom-tab-navigation-item.expanded-on-large-screens:not(.collapsed) .bottom-tab-navigation-item-icon {
    color: #0375b4;
  }
  .bottom-tab-navigation .bottom-tab-navigation-item.expanded-on-large-screens:not(.collapsed) .bottom-tab-navigation-item-icon img {
    border: 2px solid #0375b4;
  }
  .bottom-tab-navigation .bottom-tab-navigation-item.expanded-on-large-screens:not(.collapsed) .bottom-tab-navigation-tab {
    max-height: 80vh;
    padding: 10px;
    overflow-y: auto;
  }
  .bottom-tab-navigation .bottom-tab-navigation-item.expanded-on-large-screens:not(.collapsed) .bottom-tab-navigation-tab.fullscreen {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 54px;
    max-height: 100vh;
    border: 14px solid #ffffff;
    border-radius: 5px;
  }
}
@media all and (min-width: 1401px) and (min-width: 1401px) {
  .bottom-tab-navigation .bottom-tab-navigation-item.expanded-on-large-screens:not(.collapsed) {
    height: auto;
    min-height: fit-content;
    border-top: none;
  }
  .bottom-tab-navigation .bottom-tab-navigation-item.expanded-on-large-screens:not(.collapsed) .bottom-tab-navigation-tab {
    display: block;
    padding: 0;
  }
  .bottom-tab-navigation .bottom-tab-navigation-item.expanded-on-large-screens:not(.collapsed) .bottom-tab-navigation-tab .button-panel {
    /* For understanding browsers */
    -webkit-flex-direction: column;
    -moz-flex-direction: column;
    -ms-flex-direction: column;
    -o-flex-direction: column;
    flex-direction: column;
    -webkit-flex-flow: column wrap;
  }
  .bottom-tab-navigation .bottom-tab-navigation-item.expanded-on-large-screens:not(.collapsed) .bottom-tab-navigation-tab .button-panel .button-panel-item {
    margin: 6px 0;
  }
  .bottom-tab-navigation .bottom-tab-navigation-item.expanded-on-large-screens:not(.collapsed) .bottom-tab-navigation-tab.fullscreen {
    position: fixed;
    top: 20px;
    left: 20px;
    right: 20px;
    bottom: 20px;
    max-height: 100vh;
    width: auto;
    z-index: 10;
  }
  .bottom-tab-navigation .bottom-tab-navigation-item.expanded-on-large-screens:not(.collapsed) .bottom-tab-navigation-tab.fullscreen + .bottom-tab-navigation-tab-background {
    position: fixed;
    z-index: 9;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.6);
  }
  .bottom-tab-navigation .bottom-tab-navigation-item.expanded-on-large-screens:not(.collapsed) .tab-activator:after {
    content: "\f147";
  }
}
@media all and (min-width: 1401px) {
  .bottom-tab-navigation .bottom-tab-navigation-item .bottom-tab-navigation-item-label {
    height: 34px;
    line-height: 34px;
  }
  .bottom-tab-navigation .bottom-tab-navigation-item .bottom-tab-navigation-tab .button-panel {
    /* For understanding browsers */
    -webkit-flex-direction: row;
    -moz-flex-direction: row;
    -ms-flex-direction: row;
    -o-flex-direction: row;
    flex-direction: row;
    -webkit-flex-flow: row wrap;
  }
  .bottom-tab-navigation .bottom-tab-navigation-item .bottom-tab-navigation-tab .button-panel .button-panel-item {
    margin-bottom: 0;
    margin-right: 14px;
  }
  .bottom-tab-navigation .bottom-tab-navigation-item .ui-icon-close:before {
    position: fixed;
    right: 60px;
    top: 26px;
  }
  .bottom-tab-navigation .bottom-tab-navigation-item.logout {
    text-align: left;
    -webkit-justify-content: flex-start;
    -moz-justify-content: flex-start;
    -o-justify-content: flex-start;
    -ms-justify-content: flex-start;
    justify-content: flex-start;
  }
  .bottom-tab-navigation .bottom-tab-navigation-item.logout:after {
    display: none;
  }
  .bottom-tab-navigation .bottom-tab-navigation-item.logout:before {
    margin: 0 14px 0 6px;
  }
  .bottom-tab-navigation .bottom-tab-navigation-item .bottom-tab-navigation-item-label {
    margin-left: 10px;
    flex-grow: 1;
    order: 2;
  }
  .bottom-tab-navigation .bottom-tab-navigation-item .bottom-tab-navigation-tab {
    max-height: none;
    display: none;
    position: static;
    order: 4;
    width: 100%;
    box-shadow: none;
    border: none;
  }
}

#large-screens-bottom-navigation-background {
  display: none;
}

@media all and (min-width: 1401px) {
  .logged-in #large-screens-bottom-navigation-background {
    display: block;
    grid-row: logo-row-start/bottom;
    grid-column: logo-col-start/content-col1-start;
    background-color: #ffffff;
    width: 100%;
    height: 100%;
  }
}

.in-converted-form .bottom-tab-navigation .bottom-tab-navigation-item-icon, .in-converted-form .bottom-tab-navigation .bottom-tab-navigation-item-label, .in-converted-form .bottom-tab-navigation .bottom-tab-navigation-tab {
  visibility: hidden;
}
@media all and (min-width: 1401px) {
  .in-converted-form .bottom-tab-navigation .bottom-tab-navigation-item.expanded-in-converted-form:not(.collapsed) {
    border-top: 2px solid #0375b4;
  }
  .in-converted-form .bottom-tab-navigation .bottom-tab-navigation-item.expanded-in-converted-form:not(.collapsed) .bottom-tab-navigation-item-label {
    color: #0375b4;
  }
  .in-converted-form .bottom-tab-navigation .bottom-tab-navigation-item.expanded-in-converted-form:not(.collapsed) .bottom-tab-navigation-item-icon {
    color: #0375b4;
  }
  .in-converted-form .bottom-tab-navigation .bottom-tab-navigation-item.expanded-in-converted-form:not(.collapsed) .bottom-tab-navigation-item-icon img {
    border: 2px solid #0375b4;
  }
  .in-converted-form .bottom-tab-navigation .bottom-tab-navigation-item.expanded-in-converted-form:not(.collapsed) .bottom-tab-navigation-tab {
    max-height: 80vh;
    padding: 10px;
    overflow-y: auto;
  }
  .in-converted-form .bottom-tab-navigation .bottom-tab-navigation-item.expanded-in-converted-form:not(.collapsed) .bottom-tab-navigation-tab.fullscreen {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 54px;
    max-height: 100vh;
    border: 14px solid #ffffff;
    border-radius: 5px;
  }
}
@media all and (min-width: 1401px) and (min-width: 1401px) {
  .in-converted-form .bottom-tab-navigation .bottom-tab-navigation-item.expanded-in-converted-form:not(.collapsed) {
    height: auto;
    min-height: fit-content;
    border-top: none;
  }
  .in-converted-form .bottom-tab-navigation .bottom-tab-navigation-item.expanded-in-converted-form:not(.collapsed) .bottom-tab-navigation-tab {
    display: block;
    padding: 0;
  }
  .in-converted-form .bottom-tab-navigation .bottom-tab-navigation-item.expanded-in-converted-form:not(.collapsed) .bottom-tab-navigation-tab .button-panel {
    /* For understanding browsers */
    -webkit-flex-direction: column;
    -moz-flex-direction: column;
    -ms-flex-direction: column;
    -o-flex-direction: column;
    flex-direction: column;
    -webkit-flex-flow: column wrap;
  }
  .in-converted-form .bottom-tab-navigation .bottom-tab-navigation-item.expanded-in-converted-form:not(.collapsed) .bottom-tab-navigation-tab .button-panel .button-panel-item {
    margin: 6px 0;
  }
  .in-converted-form .bottom-tab-navigation .bottom-tab-navigation-item.expanded-in-converted-form:not(.collapsed) .bottom-tab-navigation-tab.fullscreen {
    position: fixed;
    top: 20px;
    left: 20px;
    right: 20px;
    bottom: 20px;
    max-height: 100vh;
    width: auto;
    z-index: 10;
  }
  .in-converted-form .bottom-tab-navigation .bottom-tab-navigation-item.expanded-in-converted-form:not(.collapsed) .bottom-tab-navigation-tab.fullscreen + .bottom-tab-navigation-tab-background {
    position: fixed;
    z-index: 9;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.6);
  }
  .in-converted-form .bottom-tab-navigation .bottom-tab-navigation-item.expanded-in-converted-form:not(.collapsed) .tab-activator:after {
    content: "\f147";
  }
}
@media all and (min-width: 1401px) {
  .in-converted-form .bottom-tab-navigation .bottom-tab-navigation-item-icon, .in-converted-form .bottom-tab-navigation .bottom-tab-navigation-item-label, .in-converted-form .bottom-tab-navigation .bottom-tab-navigation-tab {
    visibility: visible;
  }
}

body.logged-out .bottom-tab-navigation {
  display: none;
}

#admin-panel .item {
  display: block;
  line-height: 1.8;
}

#control-panel-account .bottom-tab-navigation-tab .link {
  width: 100%;
  white-space: nowrap;
  line-height: 1.8;
}
#control-panel-account .bottom-tab-navigation-tab .link:before {
  width: 30px;
  text-align: center;
}
#control-panel-account .bottom-tab-navigation-tab .link:hover {
  color: #0375b4;
}
#control-panel-account .bottom-tab-navigation-tab .link:hover:before {
  color: #0375b4;
}
#control-panel-account .bottom-tab-navigation-tab .link.ui-icon-signout {
  color: #f18825;
}
#control-panel-account .bottom-tab-navigation-tab .link.ui-icon-signout:before {
  color: #f18825;
}

@media all and (max-width: 681px) {
  .aggregatorentity #breadcrumb li:nth-child(1), .entityzoomableimage #breadcrumb li:nth-child(1) {
    display: none;
  }
}
@media all and (max-width: 481px) {
  .aggregatorentity #breadcrumb li:nth-child(4), .entityzoomableimage #breadcrumb li:nth-child(4) {
    display: none;
  }
}

#breadcrumb {
  grid-row: breadcrumb-row;
  grid-column: breadcrumb-col-start/breadcrumb-col-end;
  height: 24px;
  margin-left: 10px;
  font-size: 0.9rem;
  color: #727272;
  overflow: hidden;
}
#breadcrumb ul {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: start;
  -moz-box-pack: start;
  -ms-flex-pack: start;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: center;
  -moz-align-items: center;
  -ms-align-items: center;
  -o-align-items: center;
  align-items: center;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: flex-start;
  -moz-justify-content: flex-start;
  -o-justify-content: flex-start;
  -ms-justify-content: flex-start;
  justify-content: flex-start;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
  width: 100%;
  height: 100%;
}
#breadcrumb ul li {
  padding-right: 10px;
  flex-shrink: 0;
  -webkit-flex-shrink: 0;
  -moz-flex-shrink: 0;
  -ms-flex-shrink: 0;
  -o-flex-shrink: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
#breadcrumb ul li div {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
#breadcrumb ul li:last-child {
  flex-shrink: 1;
  -webkit-flex-shrink: 1;
  -moz-flex-shrink: 1;
  -ms-flex-shrink: 1;
  -o-flex-shrink: 1;
}
#breadcrumb ul li:not(:last-child) a:after {
  font-family: TourispoWebfonts !important;
  font-weight: 400;
  font-style: normal;
  display: inline-block;
  content: "\f054";
  margin-left: 10px;
}

.entitymain.e_accommodation #entities-nearby {
  order: 6;
}

/*############################################
 *##
 *## ListView of GeoGroups on mobile AggregatoGeoGroupPages
 *##
 *############################################*/
.region-list .headlines {
  line-height: 40px;
}
.region-list a:hover {
  text-decoration: none;
}
.region-list .read-more-label {
  bottom: 16px;
}
.region-list .show-more-content {
  max-height: 225px;
}
.region-list__region-image {
  background-size: 100% auto;
  background-repeat: no-repeat;
  width: 100%;
  height: 120px;
}

.region-list__single-region {
  margin-bottom: 6px;
}
.region-list__single-region > .region-list__single-region__name {
  display: block;
  height: 40px;
  padding: 0 10px;
  color: #727272;
  font-weight: bold;
}
.region-list__single-region > .region-list__single-region__name img {
  border-radius: 50%;
  width: 50px;
  height: 50px;
  display: inline-block;
  margin-right: 10px;
  margin-top: -5px;
  border: 4px solid #ccc;
}
.region-list__single-region > .region-list__single-region__name span {
  vertical-align: top;
  line-height: 40px;
}
.region-list__single-region__sub-regions {
  background-color: #ffffff;
  border-top: 1px solid #0375b4;
  line-height: 2.4;
}
.region-list__item {
  display: block;
  position: relative;
  color: #727272;
  width: 95%;
  margin-left: 4%;
  border-bottom: 1px solid #ccc;
}
.region-list__item.with-icon {
  padding-left: 8%;
}
.region-list__item.small {
  font-size: 0.9rem;
  line-height: 18px;
  padding-top: 2px;
}
.region-list__item:before {
  position: absolute;
  left: 0;
  top: 10px;
}
.region-list__item__name {
  display: inline-block;
  vertical-align: middle;
  width: 86%;
  margin-right: 2%;
  font-size: 0.9rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.region-list__item__number {
  display: inline-block;
  vertical-align: middle;
  width: 12%;
  text-align: right;
  font-size: 0.74rem;
}

#main-nav .brands {
  display: grid;
  grid-gap: 10px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  padding: 14px;
}
#main-nav .brands .list-item {
  padding: 10px;
  border: 1px solid #ccc;
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: flex;
  -webkit-flex-direction: column;
  -webkit-box-orient: vertical; /* Safari <= 6*/
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  -o-flex-direction: column;
  flex-direction: column;
  -webkit-align-items: center;
  -moz-align-items: center;
  -ms-align-items: center;
  -o-align-items: center;
  align-items: center;
  -webkit-justify-content: center;
  -moz-justify-content: center;
  -o-justify-content: center;
  -ms-justify-content: center;
  justify-content: center;
  flex-wrap: nowrap;
  -webkit-flex-wrap: nowrap;
}
#main-nav .brands .list-item.ui-icon-indigo:before, #main-nav .brands .list-item.ui-icon-amplid:before, #main-nav .brands .list-item.ui-icon-bogner:before, #main-nav .brands .list-item.ui-icon-coreupt:before, #main-nav .brands .list-item.ui-icon-black-diamond:before, #main-nav .brands .list-item.ui-icon-kneissl:before, #main-nav .brands .list-item.ui-icon-scott:before, #main-nav .brands .list-item.ui-icon-salomon:before, #main-nav .brands .list-item.ui-icon-fischer:before, #main-nav .brands .list-item.ui-icon-dynastar:before {
  font-size: 2rem;
}
#main-nav .brands .list-item:before {
  font-size: 1.6rem;
  color: #727272;
}
#main-nav .brands .list-item:hover:before {
  color: #0375b4;
}
#main-nav .brands .list-item .list-item-text {
  display: none;
}
#main-nav .brands .list-item.ui-icon-white-cristal .list-item-text, #main-nav .brands .list-item.ui-icon-vist .list-item-text, #main-nav .brands .list-item.ui-icon-zag .list-item-text, #main-nav .brands .list-item.ui-icon-boheme .list-item-text, #main-nav .brands .list-item.ui-icon-surface .list-item-text {
  display: block;
}
@media all and (min-width: 1151px) {
  #main-nav .brands {
    display: grid;
    grid-gap: 10px;
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }
  #main-nav .brands .list-item {
    padding: 0 10px 4px 10px;
  }
}

#header-nav {
  z-index: 50;
  height: 50px;
  grid-row: login-row-start/login-row-end;
  grid-column: logo-col-end/flexible-right;
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: end;
  -moz-box-pack: end;
  -ms-flex-pack: end;
  -webkit-box-align: stretch;
  -moz-box-align: stretch;
  -ms-flex-align: stretch;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: flex-end;
  -moz-justify-content: flex-end;
  -o-justify-content: flex-end;
  -ms-justify-content: flex-end;
  justify-content: flex-end;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
}
#header-nav a {
  font-size: 0.84rem;
  color: #727272;
}
#header-nav a:before {
  color: #727272;
}
@media all and (min-width: 681px) {
  #header-nav a {
    color: #ffffff;
  }
  #header-nav a:before {
    color: #ffffff;
  }
  #header-nav a:not(.icon-with-label):before {
    display: block;
    content: attr(data-label);
    font-weight: bold;
    height: 1px;
    color: transparent;
    overflow: hidden;
    visibility: hidden;
    margin-bottom: -1px;
  }
  #header-nav a:not(.icon-with-label):hover {
    font-weight: 700;
  }
  #header-nav .secondary a {
    color: #727272;
  }
}
@media all and (min-width: 861px) {
  #header-nav .secondary a {
    color: #ffffff;
  }
}
#header-nav > .link {
  visibility: hidden;
  width: 54px;
}
#header-nav > .link:before {
  font-size: 1.3rem;
  position: relative;
  left: 10px;
  visibility: visible;
}
#header-nav .secondary-container {
  position: relative;
}
#header-nav .secondary-container .show-secondary-navigation-link {
  display: flex;
  height: 100%;
  font-size: 1.3rem;
  padding: 0 10px;
}
#header-nav .secondary-container .secondary {
  display: none;
  border-left: 1px solid rgba(255, 255, 255, 0.4);
}
#header-nav .secondary-container .secondary.toggled-visible {
  position: absolute;
  right: 0;
  width: 200px;
  background-color: #ffffff;
  border: 1px solid #ccc;
  border-radius: 3px;
  padding: 7px;
  border-top-left-radius: 0;
  border-top-right-radius: 0;
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: flex;
  -webkit-flex-direction: column;
  -webkit-box-orient: vertical; /* Safari <= 6*/
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  -o-flex-direction: column;
  flex-direction: column;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: nowrap;
  -webkit-flex-wrap: nowrap;
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  box-shadow: rgba(0, 0, 0, 0.12) 0px 1px 6px, rgba(0, 0, 0, 0.12) 0px 1px 4px;
}
@media all and (min-width: 1151px) {
  #header-nav .secondary-container .secondary.toggled-visible {
    padding: 10px;
  }
}
#header-nav .secondary-container .secondary.toggled-visible .link {
  line-height: 2.5;
}
#header-nav .secondary-container .secondary.toggled-visible .link:not(:last-child) {
  border-bottom: 1px solid #ccc;
}
@media all and (min-width: 481px) {
  #header-nav > .link {
    visibility: visible;
    width: auto;
  }
  #header-nav > .link:before {
    font-size: 1.15rem;
    position: static;
  }
}
@media all and (min-width: 681px) {
  #header-nav {
    grid-row: login-row-start/login-row-end;
    grid-column: login-col-end/right;
    height: 100%;
    margin-top: 5px;
  }
}
@media all and (min-width: 861px) {
  #header-nav > .link {
    padding: 0 14px;
    text-align: center;
  }
  #header-nav > .link:not(:first-child) {
    border-left: 1px solid #ccc;
  }
  #header-nav .secondary-container {
    display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
    display: -webkit-flex; /* Safari 7*/
    display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
    display: -ms-flexbox; /* IE10 */
    display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
    display: flex;
    /* Simulating 2012 flexbox model (used in IE 10) */
    /* Legacy Browsers (IE 10)*/
    -webkit-box-pack: start;
    -moz-box-pack: start;
    -ms-flex-pack: start;
    -webkit-box-align: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
    /* For understanding browsers */
    -webkit-flex-direction: row;
    -moz-flex-direction: row;
    -ms-flex-direction: row;
    -o-flex-direction: row;
    flex-direction: row;
    -webkit-align-items: center;
    -moz-align-items: center;
    -ms-align-items: center;
    -o-align-items: center;
    align-items: center;
    -webkit-flex-flow: row nowrap;
    -webkit-justify-content: flex-start;
    -moz-justify-content: flex-start;
    -o-justify-content: flex-start;
    -ms-justify-content: flex-start;
    justify-content: flex-start;
    flex-wrap: nowrap;
    -ms-flex-wrap: nowrap; /* IE 10 */
    -webkit-flex-wrap: nowrap;
  }
  #header-nav .secondary-container .secondary {
    display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
    display: -webkit-flex; /* Safari 7*/
    display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
    display: -ms-flexbox; /* IE10 */
    display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
    display: flex;
    /* Simulating 2012 flexbox model (used in IE 10) */
    /* Legacy Browsers (IE 10)*/
    -webkit-box-pack: start;
    -moz-box-pack: start;
    -ms-flex-pack: start;
    -webkit-box-align: stretch;
    -moz-box-align: stretch;
    -ms-flex-align: stretch;
    /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
    /* For understanding browsers */
    -webkit-flex-direction: row;
    -moz-flex-direction: row;
    -ms-flex-direction: row;
    -o-flex-direction: row;
    flex-direction: row;
    -webkit-align-items: stretch;
    -moz-align-items: stretch;
    -ms-align-items: stretch;
    -o-align-items: stretch;
    align-items: stretch;
    -webkit-flex-flow: row nowrap;
    -webkit-justify-content: flex-start;
    -moz-justify-content: flex-start;
    -o-justify-content: flex-start;
    -ms-justify-content: flex-start;
    justify-content: flex-start;
    flex-wrap: nowrap;
    -ms-flex-wrap: nowrap; /* IE 10 */
    -webkit-flex-wrap: nowrap;
  }
  #header-nav .secondary-container .show-secondary-navigation-link {
    display: none !important;
  }
  #header-nav .link {
    padding: 0 0.5vw;
  }
  #header-nav .link:not(:first-child) {
    border-left: 1px solid rgba(255, 255, 255, 0.4);
  }
}

footer {
  padding: 10px;
}
footer:nth-of-type(1) {
  grid-row: footer-row1;
  grid-column: footer-col1-start/footer-col1-end;
}
footer:nth-of-type(2) {
  grid-row: footer-row1;
  grid-column: footer-col2-start/footer-col2-end;
}
footer:nth-of-type(3) {
  grid-row: footer-row2;
  grid-column: footer-col3-start/footer-col3-end;
}
footer:nth-of-type(4) {
  grid-row: footer-row2;
  grid-column: footer-col4-start/footer-col4-end;
}
footer .headlines {
  display: block;
  line-height: 2;
  width: 100%;
  border-bottom: 1px solid #ccc;
  box-shadow: 0 1px 0 0 #fafafa;
}
footer a {
  display: block;
  line-height: 1.8;
  width: 100%;
}
footer.social {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  box-lines: multiple;
  -moz-box-lines: multiple;
  -webkit-box-lines: multiple;
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: center;
  -moz-align-items: center;
  -ms-align-items: center;
  -o-align-items: center;
  align-items: center;
  -webkit-flex-flow: row wrap;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: wrap;
  -ms-flex-wrap: wrap; /* IE 10 */
  -webkit-flex-wrap: wrap;
}
footer.social a {
  margin-top: 10px;
}
footer.social a:before {
  margin-right: 0;
}

#login-linker {
  z-index: 11;
  grid-row: login-row-start/login-row-end;
  grid-column: login-col-start/login-col-end;
  height: 50px;
  margin-left: 10px;
}
#login-linker a {
  line-height: 50px;
  font-size: 0.84rem;
}
#login-linker a:hover {
  font-weight: 700;
}
@media all and (min-width: 681px) {
  #login-linker a {
    line-height: 20px;
  }
}
@media all and (min-width: 681px) {
  #login-linker {
    display: block;
    grid-row: login-row-start/login-row-end;
    grid-column: login-col-start/login-col-end;
    margin-top: 5px;
    justify-self: end;
    height: 20px;
  }
  #login-linker a {
    font-size: 0.84rem;
    color: #727272;
  }
  #login-linker a:before {
    color: #727272;
  }
}
@media all and (min-width: 681px) and (min-width: 681px) {
  #login-linker a {
    color: #ffffff;
  }
  #login-linker a:before {
    color: #ffffff;
  }
  #login-linker a:not(.icon-with-label):before {
    display: block;
    content: attr(data-label);
    font-weight: bold;
    height: 1px;
    color: transparent;
    overflow: hidden;
    visibility: hidden;
    margin-bottom: -1px;
  }
  #login-linker a:not(.icon-with-label):hover {
    font-weight: 700;
  }
  #login-linker .secondary a {
    color: #727272;
  }
}
@media all and (min-width: 681px) and (min-width: 861px) {
  #login-linker .secondary a {
    color: #ffffff;
  }
}
@media all and (min-width: 1401px) {
  #login-linker {
    justify-self: start;
  }
}

#condition-alert .teaser {
  font-size: 0.84rem;
}
#condition-alert .dataprotectionlink {
  font-size: 0.9rem;
  margin-top: 10px;
  text-decoration: none;
}
@media all and (min-width: 861px) and (max-width: 1024px) {
  #condition-alert .dataprotectionlink {
    font-size: 0.84rem;
  }
}

/*############################################
 *## Grid positioning depending on page types
 *############################################*/
.conditionalert .condition-alert-standalone {
  grid-row: content-row1-start/content-row6-end;
  grid-column: content-col1-start/content-col12-end;
}
.conditionalert .condition-alert-standalone .formatted-article {
  padding-top: 0;
  max-width: 600px;
  margin: 0 auto;
}
.conditionalert .condition-alert-standalone .introduction {
  padding: 0 10px 10px 10px;
  font-size: 0.9rem;
}
.conditionalert .condition-alert-standalone .entity-lean-list {
  top: 46px;
}
.conditionalert .condition-alert-standalone .dataprotectionlink {
  padding: 10px 0;
}
.conditionalert .condition-alert-standalone button.primary {
  display: block;
  margin-top: 10px;
}
.conditionalert #edit-snow-ticker-ads {
  grid-row: content-row7-start/content-row9-end;
  grid-column: content-col1-start/content-col12-end;
}
.conditionalert #edit-snow-ticker-ads-xc {
  grid-row: content-row10-start/content-row14-end;
  grid-column: content-col1-start/content-col12-end;
}

.conditionalertunsubscribe #conditionAlertUnsubscribe {
  grid-row: content-row1-start/content-row6-end;
  grid-column: content-col1-start/content-col12-end;
}

#newsletterSubscribeForm, #newsletter-confirmation, #newsletter-unsubscribe-form {
  grid-row: tabnavi-row/content-row10-end;
  grid-column: content-col1-start/content-col12-end;
  position: relative;
}
@media all and (max-width: 1401px) {
  #newsletterSubscribeForm, #newsletter-confirmation, #newsletter-unsubscribe-form {
    padding-left: 10px;
  }
}
@media all and (max-width: 861px) {
  #newsletterSubscribeForm, #newsletter-confirmation, #newsletter-unsubscribe-form {
    padding-right: 10px;
  }
}
#newsletterSubscribeForm .link, #newsletter-confirmation .link, #newsletter-unsubscribe-form .link {
  position: absolute;
  left: 10px;
  bottom: -40px;
  margin-top: 0;
}
#newsletterSubscribeForm button, #newsletter-confirmation button, #newsletter-unsubscribe-form button {
  width: 100%;
}
@media all and (min-width: 681px) {
  #newsletterSubscribeForm, #newsletter-confirmation, #newsletter-unsubscribe-form {
    grid-row: tabnavi-row/content-row10-end;
    grid-column: content-col3-start/content-col10-end;
  }
  #newsletterSubscribeForm button, #newsletter-confirmation button, #newsletter-unsubscribe-form button {
    width: 50%;
  }
  #newsletterSubscribeForm .link, #newsletter-confirmation .link, #newsletter-unsubscribe-form .link {
    position: absolute;
    left: initial;
    right: 0;
    bottom: 10px;
  }
}

#newsletter-unsubscribe-form button {
  margin-top: 30px;
}

/**
 * Skireisen Angebots-Liste
 */
.contentgeo .offerlist, .offersoverview .offerlist {
  grid-row: content-row2-start/content-row7-end;
  grid-column: content-col1-start/content-col12-end;
}

@media all and (max-width: 1401px) {
  .offerlist {
    padding-left: 10px;
  }
}
@media all and (max-width: 861px) {
  .offerlist {
    padding-right: 10px;
  }
}
.offerlist .list {
  margin-top: 10px;
  display: grid;
  grid-gap: 10px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.offerlist .list ins {
  height: 100%;
}
.offerlist .list .list-tip {
  height: 100%;
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: flex;
  -webkit-flex-direction: column;
  -webkit-box-orient: vertical; /* Safari <= 6*/
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  -o-flex-direction: column;
  flex-direction: column;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: nowrap;
  -webkit-flex-wrap: nowrap;
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
}
.offerlist .list .item-teaser {
  padding: 10px;
  flex-grow: 1;
}
.offerlist .list .title {
  font-size: 0.9rem;
}
.offerlist .list .link {
  align-items: flex-start;
  line-height: 1.2;
}
.offerlist .list .link:before {
  margin-right: 6px;
}
@media all and (min-width: 681px) {
  .offerlist .list {
    display: grid;
    grid-gap: 10px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
@media all and (min-width: 1151px) {
  .offerlist .list {
    display: grid;
    grid-gap: 10px;
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

@media all and (min-width: 481px) {
  .entitymain #page-headline, .entityzoomableimage #page-headline {
    padding-right: 140px;
  }
}
@media all and (min-width: 681px) {
  .entitymain #page-headline, .entityzoomableimage #page-headline {
    padding-right: 0;
  }
}

.e_accommodation #page-headline {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: start;
  -moz-box-pack: start;
  -ms-flex-pack: start;
  -webkit-box-align: flex-start;
  -moz-box-align: flex-start;
  -ms-flex-align: flex-start;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: flex-start;
  -moz-align-items: flex-start;
  -ms-align-items: flex-start;
  -o-align-items: flex-start;
  align-items: flex-start;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: flex-start;
  -moz-justify-content: flex-start;
  -o-justify-content: flex-start;
  -ms-justify-content: flex-start;
  justify-content: flex-start;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
}
@media all and (min-width: 681px) {
  .e_accommodation #page-headline .rating-lodging {
    margin-top: 4px;
    order: 0;
  }
}

@media all and (min-width: 1025px) {
  .c_blogarticle #page-headline {
    grid-row: headline-row;
    grid-column: headline-col-start/content-col12-end;
  }
}
@media all and (min-width: 1301px) {
  .c_blogarticle #page-headline {
    grid-row: headline-row;
    grid-column: headline-col-start/content-col8-end;
  }
}
.c_blogarticle.logged-in .in-converted-form #page-headline {
  margin-top: 160px;
}
@media all and (min-width: 861px) {
  .c_blogarticle.logged-in .in-converted-form #page-headline {
    margin-top: 0;
  }
}

.advancedentitysearch #page-headline, .advancedproductsearch #page-headline {
  grid-row: headline-row;
  grid-column: headline-col-start/content-col12-end;
}

.login #page-headline {
  max-width: 600px;
  margin: 0 auto;
  grid-row: headline-row;
  grid-column: content-col1-start/content-col12-end;
}

#page-headline {
  grid-row: headline-row;
  grid-column: headline-col-start/headline-col-end;
  padding: 0 10px;
  position: relative;
  z-index: 1;
  /*############################################
   *## Input fields when headline is edited
   *############################################*/
}
#page-headline .headlines {
  order: 1;
  -moz-hyphens: auto;
  -o-hyphens: auto;
  -webkit-hyphens: auto;
  -ms-hyphens: auto;
  hyphens: auto;
}
#page-headline .headlines {
  margin: 10px 0;
}
#page-headline .page-headline-editable {
  width: 100%;
}
@media all and (min-width: 681px) {
  #page-headline .headlines {
    font-size: 2rem;
  }
}

#page-headline-background {
  display: none;
  position: relative;
  z-index: -1;
}
@media all and (min-width: 481px) {
  #page-headline-background {
    display: block;
    grid-row: headline-row/content-row1-end;
    grid-column: flexible-left/flexible-right;
    -ms-grid-column: 1;
    background-color: #727272;
    height: 100%;
    position: relative;
    top: calc(-16px - 0px);
    padding-top: 16px;
  }
}
@media all and (min-width: 481px) and (min-width: 681px) {
  #page-headline-background {
    top: calc(-20px - 0px);
    padding-top: 20px;
  }
}

/*############################################
 *## Module Styles
 *############################################*/
#entity-localities {
  font-size: 0.9rem;
  order: 2;
  width: 100%;
}

#entity-tags-and-localities-edit {
  width: 100%;
}
#entity-tags-and-localities-edit #localities {
  position: relative;
}
#entity-tags-and-localities-edit #localities button.refresh-localities {
  position: absolute;
  right: 5px;
  bottom: -16px;
}

/*############################################
 *## Position on different page types
 *############################################*/
.c_blogarticle #entity-tags-and-localities-edit {
  grid-row: headline-row;
  grid-column: headline-col-start/content-col12-end;
  margin-top: 230px;
  padding-left: 10px;
}
@media all and (min-width: 861px) {
  .c_blogarticle #entity-tags-and-localities-edit {
    margin-top: 80px;
  }
}

#product-facts-p_ski-skill-terrain .skill-level {
  margin-top: 20px;
}

#product-facts-p_ski-length {
  grid-column-start: 1;
  grid-column-end: 3;
}
@media all and (min-width: 1025px) {
  #product-facts-p_ski-length {
    grid-column-start: 3;
    grid-column-end: 4;
  }
}

#product-new-modell {
  grid-column-start: 1;
  grid-column-end: 4;
}

#page-edit .page-edit-checkbox, #page-edit button {
  margin-top: 14px;
}

#new-user-review {
  grid-row: content-row1-start/content-row10-end;
  grid-column: content-col1-start/content-col12-end;
  /*############################################
   *## Zusammenfassende Bewertung
   *############################################*/
  /*############################################
   *## Toggles die per Klick aktiviert werden können: welche Kategorien der User noch zusätzlich zu seiner zusammenfassenden Bewertung
   *## - Welche Kategorien möchte der User noch zusätzlich zu seiner zusammenfassenden Bewertung im Detail bewerten
   *## - Wie alt ist der User
   *## - Ist er allein oder in Gruppe gereist
   *## ...
   *############################################*/
  /*############################################
   *## Detailed review of a certain category
   *############################################*/
  /*############################################
   *## travelled as blocks
   *############################################*/
  /*############################################
   *## Profile: Name, Age, Skill ... of user
   *############################################*/
  /*############################################
   *## The submit button
   *############################################*/
}
@media all and (max-width: 1401px) {
  #new-user-review {
    padding-left: 10px;
  }
}
@media all and (max-width: 861px) {
  #new-user-review {
    padding-right: 10px;
  }
}
#new-user-review .user-review-block {
  padding-top: 20px;
  margin-top: 20px;
}
#new-user-review #user-review-conclusion .star-rating-legend {
  color: #0375b4;
  margin: 0 auto;
  width: fit-content;
}
#new-user-review #user-review-conclusion .main-user-review-rating .star-rating-container {
  display: block;
  margin: 10px auto;
}
#new-user-review #user-review-conclusion textarea#review_conclusion {
  min-height: 100px;
}
#new-user-review .user-review-select-blocks {
  margin-top: 10px;
  display: grid;
  grid-gap: 10px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
#new-user-review .category-block-detailed {
  margin-top: 10px;
  border: 1px solid #ccc;
}
#new-user-review .category-block-detailed .category-header {
  padding: 10px;
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: center;
  -moz-align-items: center;
  -ms-align-items: center;
  -o-align-items: center;
  align-items: center;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
}
#new-user-review .category-block-detailed .category-header .headlines {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: flex;
  -webkit-flex-direction: column;
  -webkit-box-orient: vertical; /* Safari <= 6*/
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  -o-flex-direction: column;
  flex-direction: column;
  -webkit-align-items: center;
  -moz-align-items: center;
  -ms-align-items: center;
  -o-align-items: center;
  align-items: center;
  -webkit-justify-content: flex-start;
  -moz-justify-content: flex-start;
  -o-justify-content: flex-start;
  -ms-justify-content: flex-start;
  justify-content: flex-start;
  flex-wrap: nowrap;
  -webkit-flex-wrap: nowrap;
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: start;
  -moz-box-pack: start;
  -ms-flex-pack: start;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  -moz-hyphens: auto;
  -o-hyphens: auto;
  -webkit-hyphens: auto;
  -ms-hyphens: auto;
  hyphens: auto;
  margin-right: 10px;
}
#new-user-review .category-block-detailed .category-header .headlines:before {
  font-family: TourispoWebfonts !important;
  font-weight: 400;
  font-style: normal;
  display: inline-block;
  font-size: 1.6rem;
  margin-right: 10px;
}
#new-user-review .category-block-detailed .category-content .form-element {
  padding-top: 0;
  margin-top: 0;
}
#new-user-review .category-block-detailed .category-content .form-element textarea {
  position: relative;
  bottom: -1px;
}
#new-user-review .category-block-detailed .category-content .review-box-hint {
  position: relative;
  font-size: 0.84rem;
  line-height: 1.2rem;
  height: auto;
  padding: 1rem;
  background-color: #d9eaf4;
  color: #0375b4;
}
#new-user-review .category-block-detailed .category-content .review-box-hint:after {
  content: "";
  width: 20px;
  height: 20px;
  background-color: #d9eaf4;
  position: absolute;
  left: 30px;
  top: -11px;
  transform: rotate(45deg);
}
#new-user-review .category-block-detailed .category-content .review-box-hint:before {
  font-family: TourispoWebfonts !important;
  font-weight: 400;
  font-style: normal;
  display: inline-block;
  content: "\f05a";
  color: #0375b4;
}
#new-user-review .block-beginner:before {
  content: "\e917";
}
#new-user-review .block-advanced:before {
  content: "\e918";
}
#new-user-review .block-professional:before {
  content: "\e919";
}
#new-user-review .block-freeride:before {
  content: "\e90b";
}
#new-user-review .block-freestyle:before {
  content: "\e910";
}
#new-user-review .block-families:before {
  content: "\e912";
}
#new-user-review .block-apres:before {
  content: "\e91e";
}
#new-user-review .block-service:before {
  content: "\e900";
}
#new-user-review .block-snow:before {
  content: "\f4ae";
}
#new-user-review .block-price-performance:before {
  content: "\f153";
}
#new-user-review .block-on-mountain-dining:before {
  content: "\e627";
}
#new-user-review .block-travelled-alone:before {
  content: "\e914";
}
#new-user-review .block-travelled-couple:before {
  content: "\e915";
}
#new-user-review .block-travelled-family:before {
  content: "\e912";
}
#new-user-review .block-travelled-group:before {
  content: "\e913";
}
#new-user-review .new-user-review-profile .user-review-select-blocks {
  margin-bottom: 20px;
}
#new-user-review .new-user-review-profile .review-block-profile {
  margin-top: 20px;
}
#new-user-review button.primary {
  display: block;
  margin: 20px auto 0 auto;
}
@media all and (min-width: 681px) {
  #new-user-review .user-review-select-blocks {
    display: grid;
    grid-gap: 10px;
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }
  #new-user-review .category-block-detailed .category-header .headlines {
    /* For understanding browsers */
    -webkit-flex-direction: row;
    -moz-flex-direction: row;
    -ms-flex-direction: row;
    -o-flex-direction: row;
    flex-direction: row;
    -webkit-flex-flow: row wrap;
  }
}

.review-category-box .review-categories {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: stretch;
  -moz-box-align: stretch;
  -ms-flex-align: stretch;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  box-lines: multiple;
  -moz-box-lines: multiple;
  -webkit-box-lines: multiple;
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-flex-flow: row wrap;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: wrap;
  -ms-flex-wrap: wrap; /* IE 10 */
  -webkit-flex-wrap: wrap;
}
.review-category-box .review-categories .review-category {
  line-height: 2;
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: stretch;
  -moz-box-align: stretch;
  -ms-flex-align: stretch;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
}

#official-test-awards .awards .award > div {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: center;
  -moz-align-items: center;
  -ms-align-items: center;
  -o-align-items: center;
  align-items: center;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
}
#official-test-awards .awards .award > div:before {
  font-family: TourispoWebfonts !important;
  font-weight: 400;
  font-style: normal;
  display: inline-block;
  content: "\e924";
  color: #ffffff;
  font-size: 3.6rem;
  padding-right: 10px;
}
#official-test-awards .awards .award > div span {
  padding-right: 10px;
  color: #ffffff;
  font-weight: 700;
}
#official-test-awards .awards .award > div.beginner {
  background-color: #4f72d6;
}
#official-test-awards .awards .award > div.advanced {
  background-color: #000;
}
#official-test-awards .awards .award > div.freestyle {
  background-color: #8d5bb4;
}
#official-test-awards .awards .award > div.freeride {
  background-color: #f1da34;
}
#official-test-awards .awards .award > div.on-mountain-dining {
  background-color: #6e1916;
}
#official-test-awards .awards .award > div.service {
  background-color: #e77f42;
}
#official-test-awards .awards .award > div.snow {
  background-color: #77d7d5;
}
#official-test-awards .awards .award > div.price-performance {
  background-color: #5a5e84;
}
#official-test-awards .awards .award > div.apres {
  background-color: #d73e99;
}
#official-test-awards .awards .award > div.families {
  background-color: #4eaf46;
}

/*############################################
 *## Positioning on the grid depending on page type
 *############################################*/
.index #user-reviews {
  grid-row: content-row3-start/content-row3-end;
  grid-column: content-col1-start/content-col12-end;
  margin-bottom: 30px;
}
@media all and (max-width: 1401px) {
  .index #user-reviews {
    padding-left: 10px;
  }
}
@media all and (max-width: 861px) {
  .index #user-reviews {
    padding-right: 10px;
  }
}
@media all and (min-width: 681px) {
  .index #user-reviews .swiper-slide {
    width: 50%;
    padding: 0 10px;
  }
  .index #user-reviews .swiper-slide:first-child {
    padding-left: 10px;
  }
  .index #user-reviews .swiper-slide:last-child {
    padding-right: 10px;
  }
}

.entityreviews #user-reviews {
  padding: 14px;
  grid-row: content-row3-start/content-row3-end;
  grid-column: content-col1-start/content-col12-end;
  background-color: #f1f1f1;
}
.entityreviews #user-reviews .review-list {
  display: grid;
  grid-gap: 10px;
  grid-template-columns: repeat(1, minmax(0, 1fr));
}
.entityreviews #user-reviews .review-list .user-review-item {
  -webkit-justify-content: flex-start;
  -moz-justify-content: flex-start;
  -o-justify-content: flex-start;
  -ms-justify-content: flex-start;
  justify-content: flex-start;
  background-color: #ffffff;
  padding: 14px;
}
.entityreviews #user-reviews .review-list .user-review-item .user-review-average-category-ratings {
  font-size: 0.84rem;
  display: grid;
  grid-gap: 10px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
@media all and (min-width: 381px) {
  .entityreviews #user-reviews .review-list .user-review-item .user-review-average-category-ratings {
    display: grid;
    grid-gap: 10px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
@media all and (min-width: 481px) {
  .entityreviews #user-reviews .review-list .user-review-item .user-review-average-category-ratings {
    display: grid;
    grid-gap: 10px;
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}
@media all and (min-width: 861px) {
  .entityreviews #user-reviews .review-list {
    display: grid;
    grid-gap: 10px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .entityreviews #user-reviews .review-list .user-review-item .user-review-average-category-ratings {
    display: grid;
    grid-gap: 10px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media all and (min-width: 1025px) {
  .entityreviews #user-reviews .review-list .user-review-item .user-review-average-category-ratings {
    display: grid;
    grid-gap: 10px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

/*############################################
 *## Module Styles
 *############################################*/
#user-reviews .material-divider {
  margin-top: -11px;
}
#user-reviews .user-review-item {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: flex;
  -webkit-flex-direction: column;
  -webkit-box-orient: vertical; /* Safari <= 6*/
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  -o-flex-direction: column;
  flex-direction: column;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: nowrap;
  -webkit-flex-wrap: nowrap;
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  text-align: center;
}
#user-reviews .user-review-item .user-review-profile .user-review-entity {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
#user-reviews .user-review-item .user-review-profile .user-review-author {
  color: #727272;
  font-size: 0.9rem;
  padding-bottom: 14px;
}
#user-reviews .user-review-item .user-review-summary {
  display: block;
  min-height: 36px;
}
#user-reviews .user-review-item .entity-rating {
  border-bottom: 2px solid #ccc;
  margin-bottom: 10px;
  padding-bottom: 6px;
  color: #0375b4;
}
#user-reviews .user-review-item .user-review-content {
  margin-bottom: 10px;
}
#user-reviews .user-review-item .user-review-item-link {
  width: fit-content;
  width: -moz-fit-content;
  margin: 0 auto 10px auto;
}
#user-reviews .swiper-wrapper .swiper-button-prev, #user-reviews .swiper-wrapper .swiper-button-next {
  top: 22px;
}
#user-reviews .swiper-wrapper .swiper-button-prev {
  left: 0;
}
#user-reviews .swiper-wrapper .swiper-button-next {
  right: 0;
}
#user-reviews .user-review-button {
  width: fit-content;
  width: -moz-fit-content;
  margin: 10px auto 10px auto;
}

/*############################################
 *## Positioning on the grid depending on page type
 *############################################*/
.entitymain #official-review-box {
  grid-row: content-row9-start/content-row9-end;
  grid-column: content-col1-start/content-col12-end;
}

.entityreviews #test-summary {
  grid-row: content-row1-start/content-row1-end;
  grid-column: content-col1-start/content-col12-end;
}

/*############################################
 *## Module Styles
 *############################################*/
/**
 Neue Stile (Nur noch Verlinkung des Ankers zu Usermeinungen und Button zum verfassen eines Testberichts)
 */
#test-summary .actions {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: flex;
  -webkit-flex-direction: column;
  -webkit-box-orient: vertical; /* Safari <= 6*/
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  -o-flex-direction: column;
  flex-direction: column;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: nowrap;
  -webkit-flex-wrap: nowrap;
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
}
#test-summary .actions .user-ratings-anchor-link {
  font-weight: 400;
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: start;
  -moz-box-pack: start;
  -ms-flex-pack: start;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: center;
  -moz-align-items: center;
  -ms-align-items: center;
  -o-align-items: center;
  align-items: center;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: flex-start;
  -moz-justify-content: flex-start;
  -o-justify-content: flex-start;
  -ms-justify-content: flex-start;
  justify-content: flex-start;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
}
#test-summary .actions .user-ratings-anchor-link .star-rating-container {
  margin-left: 10px;
  margin-top: -3px;
}
#test-summary .actions .user-ratings-anchor-link, #test-summary .actions .button {
  margin: 10px;
}
@media all and (min-width: 681px) {
  #test-summary {
    margin-top: 20px;
  }
  #test-summary .actions {
    /* For understanding browsers */
    -webkit-flex-direction: row;
    -moz-flex-direction: row;
    -ms-flex-direction: row;
    -o-flex-direction: row;
    flex-direction: row;
    -webkit-flex-flow: row wrap;
  }
  #test-summary .actions .user-ratings-anchor-link, #test-summary .actions .button {
    margin-bottom: 0;
  }
}

/**
 Alte Stile für Anzeige der detaillierten Zusammenfassung (mit Kategorien usw ..)
#test-summary {
  @include contrastBlock($largePadding);
  #official-test-summary {
    width: 100%;
    .contents {
      margin-top: $defaultPadding;
      @include flexbox-horizontal(stretch, space-between, wrap);
      .teaser {
        order: 2;
        width: 69%;
        margin-bottom: $defaultPadding;
      }
      .review-category-box {
        order: 3;
        width: 100%;
        .review-category {
          width: 50%;
          &:nth-child(odd) {
            padding-right: $largePadding;
            border-right: 1px solid $white;
          }
          &:nth-child(even) {
            padding-left: $largePadding;
          }
        }
      }
      .review-points {
        order: 1;
        width: 28%;
        padding: $defaultPadding;
        background-color: $ciDefault;
        .test-points {
          text-align: center;
          height: 100%;
          @include flexbox-vertical(center, space-around, nowrap);
          .logo:before {
            font-size: $megahuge;
            @include webfont;
            content:"\e924";
            width: 100%;
          }
          .points-overall {
            font-weight: $bold;
            padding: $defaultPadding;
          }
          .remark {
            font-size: $tiny;
            line-height: 1.2;
          }
        }
      }
    }


    .readcomplete-review-link {
      color: $ciContrastDark;
      text-decoration: none;
      &:before {
        color: $ciContrastDark;
      }
    }
  }
  #user-review-summary {
    margin-top: $extraHugePadding;
    .headlines {
      margin-bottom: 0;
    }
    .aggregated-rating {
      @include flexbox-horizontal(center, flex-start, nowrap);
      .star-rating-container {
        margin-left: $defaultPadding;
        .rating:before {
          color: $ciContrastDark;
        }
      }
    }
    .user-review-average-category-ratings {
      @include flexbox-horizontal(stretch, space-between, wrap);
      .user-review-category-average {
        width: 100%;
        @include flexbox-horizontal(center, space-between, nowrap);
        line-height: 1.5;
        .category-name {
          font-size: $small;
        }
        .category-points {
          @include flexbox-horizontal(center, space-between, nowrap);
        }
        .avg-review-cat-rating {
          margin-left: $defaultPadding;
          font-size: $small;
        }
      }
      .actions {
        margin-top: $largePadding;
        width: 100%;
        @include flexbox-vertical(center, space-between, nowrap);
        .review-list-linker {
          color: $ciContrastDark;
          margin-bottom: $defaultPadding;
          &:before {
            color: $ciContrastDark;
          }
        }
      }
    }
  }
  @include largerOrEqual(phablet-portrait) {
    #user-review-summary {
      .user-review-average-category-ratings {
        .user-review-category-average {
          width: 50%;
          &:nth-child(odd) {
            border-right: 1px solid $white;
            padding-right: $largePadding;
          }
          &:nth-child(even) {
            padding-left: $largePadding;
          }
        }
      }
    }
  }
  @include largerOrEqual(laptop-sdpi) {
    @include flexbox-horizontal(stretch, space-between, nowrap);
    #official-test-summary {
      width: 48%;
      .contents {
        .teaser {
          order: 1;
          width: 100%;
        }

        .review-category-box {
          order: 2;
          width: 68%;
          font-size: $small;
        }

        .review-summary-container {
          order: 3;
          width: 28%;
        }
      }
    }
    #user-review-summary {
      width: 48%;
      margin-top: 0;
      .user-review-average-category-ratings {
        .user-review-category-average {
          width: 50%;
        }
        .actions {
          @include changeFlexOrientation(row);
        }
      }
    }
  }
}*/
/*############################################
 *## Positioning on the grid depending on page type
 *############################################*/
.entityreviews #official-review {
  grid-row: content-row2-start/content-row2-end;
  grid-column: content-col1-start/content-col12-end;
}

/*############################################
 *## Module styling
 *############################################*/
#official-review {
  background-color: #ffffff;
  border-top: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
  padding: 10px;
}
#official-review > .element-actions {
  padding-top: 10px;
}
#official-review .formatted-article {
  border-top: none;
  border-bottom: none;
}
#official-review .review {
  padding: 0;
}
#official-review .review .review-header {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: center;
  -moz-align-items: center;
  -ms-align-items: center;
  -o-align-items: center;
  align-items: center;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
}
#official-review .review .review-header .author {
  padding-left: 10px;
  flex-grow: 1;
  -webkit-flex-grow: 1;
  -moz-flex-grow: 1;
  -ms-flex-grow: 1;
  -o-flex-grow: 1;
}
#official-review .review .review-header .up-down-vote {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: center;
  -moz-align-items: center;
  -ms-align-items: center;
  -o-align-items: center;
  align-items: center;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
}
#official-review .review .review-header .up-down-vote a {
  cursor: pointer;
}
#official-review .review .formatted-article-block {
  padding-top: 0;
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: flex;
  -webkit-flex-direction: column;
  -webkit-box-orient: vertical; /* Safari <= 6*/
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  -o-flex-direction: column;
  flex-direction: column;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: nowrap;
  -webkit-flex-wrap: nowrap;
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
}
#official-review .review .formatted-article-block #image-gallery-panoramic {
  order: 1;
}
#official-review .review .formatted-article-block .ecu-text {
  order: 2;
  margin-top: 14px;
}
#official-review .review .formatted-article-block .criteria-box {
  order: 3;
}
#official-review .review #image-gallery-panoramic {
  height: 200px;
  margin-bottom: 30px;
}
#official-review .review #image-gallery-panoramic .swiper-container {
  box-sizing: content-box;
  padding-bottom: 30px;
}
#official-review .review #image-gallery-panoramic .caption-and-license {
  position: absolute;
  bottom: 0;
  width: 100%;
  background: rgba(204, 204, 204, 0.7) !important;
}
#official-review .review .formatted-article {
  padding: 10px 0;
  background-color: #ffffff;
  position: relative;
}
#official-review .review .criteria-box {
  padding-top: 10px;
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: stretch;
  -moz-box-align: stretch;
  -ms-flex-align: stretch;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  box-lines: multiple;
  -moz-box-lines: multiple;
  -webkit-box-lines: multiple;
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-flex-flow: row wrap;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: wrap;
  -ms-flex-wrap: wrap; /* IE 10 */
  -webkit-flex-wrap: wrap;
}
#official-review .review .criteria-box .plus-minus-panel {
  width: 100%;
}
#official-review .review .criteria-box .plus-minus-panel li {
  padding-bottom: 6px;
}
#official-review .review .criteria-box .plus-minus-panel .ui-icon-plus-circle:before {
  color: #75b34d;
  margin-right: 10px;
}
#official-review .review .criteria-box .plus-minus-panel .ui-icon-minus-circle:before {
  color: #fc5a5a;
  margin-right: 10px;
}
#official-review .review .overall-rating {
  position: static !important;
  z-index: 2;
  height: 110px;
  background-color: #ffffff;
  border-top: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
  padding: 10px;
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: flex;
  -webkit-flex-direction: column;
  -webkit-box-orient: vertical; /* Safari <= 6*/
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  -o-flex-direction: column;
  flex-direction: column;
  -webkit-align-items: center;
  -moz-align-items: center;
  -ms-align-items: center;
  -o-align-items: center;
  align-items: center;
  -webkit-justify-content: space-around;
  -moz-justify-content: space-around;
  -o-justify-content: space-around;
  -ms-justify-content: space-around;
  justify-content: space-around;
  flex-wrap: nowrap;
  -webkit-flex-wrap: nowrap;
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: distribute;
  -moz-box-pack: distribute;
  -ms-flex-pack: distribute;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  color: #0375b4;
}
#official-review .review .overall-rating > .element-actions {
  padding-top: 10px;
}
#official-review .review .overall-rating .logo:before {
  font-size: 2.6rem;
  font-family: TourispoWebfonts !important;
  font-weight: 400;
  font-style: normal;
  display: inline-block;
  content: "\e924";
  width: 100%;
}
#official-review .review .review-category-box {
  margin-top: 20px;
}
#official-review .review .review-category-box .review-category {
  width: 50%;
}
#official-review .review .review-category-box .review-category:nth-child(n+3) {
  border-top: 1px solid #ccc;
}
#official-review .review .review-category-box .review-category:nth-child(odd) {
  padding-right: 10px;
  border-right: 1px solid #ccc;
}
#official-review .review .review-category-box .review-category:nth-child(even) {
  padding-left: 10px;
}
#official-review .review #official-test-awards {
  margin-top: 20px;
}
#official-review .review #official-test-awards .awards {
  display: grid;
  grid-gap: 10px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
#official-review .review #official-test-awards .awards .award > div:before {
  font-size: 2rem;
}
#official-review .review #official-test-awards .awards span {
  font-weight: 300;
  font-size: 0.9rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
@media all and (min-width: 481px) {
  #official-review .review #image-gallery-panoramic {
    height: 232px;
  }
  #official-review .review #official-test-awards .awards .award > div:before {
    font-size: 3.6rem;
  }
  #official-review .review #official-test-awards .awards span {
    font-weight: 700;
    font-size: 1rem;
  }
  #official-review .review .overall-rating {
    height: 160px;
    top: 23px;
    left: 14px;
  }
  #official-review .review .overall-rating .logo:before {
    font-size: 3.6rem;
  }
  #official-review .review .overall-rating .points {
    font-size: 1.15rem;
    font-weight: 700;
  }
}
@media all and (min-width: 681px) {
  #official-review .review #official-test-awards .awards {
    display: grid;
    grid-gap: 10px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  #official-review .review #image-gallery-panoramic {
    height: 250px;
  }
}
@media all and (min-width: 1025px) {
  #official-review .review #image-gallery-panoramic {
    height: 260px;
  }
  #official-review .review .criteria-box .plus-minus-panel {
    width: 49%;
  }
  #official-review .review .review-category-box .review-category {
    width: 20%;
    padding: 0 20px !important;
    border-right: 1px solid #ccc;
  }
  #official-review .review .review-category-box .review-category:nth-child(n+3) {
    border-top: none;
  }
  #official-review .review .review-category-box .review-category:nth-child(n+6) {
    border-top: 1px solid #ccc;
  }
  #official-review .review .review-category-box .review-category:first-child, #official-review .review .review-category-box .review-category:nth-child(6) {
    padding-left: 0 !important;
  }
  #official-review .review .review-category-box .review-category:nth-child(5), #official-review .review .review-category-box .review-category:last-child {
    border-right: none;
  }
  #official-review .review #official-test-awards .awards {
    display: grid;
    grid-gap: 10px;
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}
@media all and (min-width: 1151px) and (min-width: 1025px) {
  #official-review .review #image-gallery-panoramic {
    height: 260px;
  }
}

#not-found {
  position: relative;
}
#not-found .messages-feedback-message {
  position: absolute;
  top: 190px;
  left: 100px;
  width: 40%;
}

#material-components {
  grid-row: content-row1-start/content-row8-end;
  grid-column: content-col1-start/content-col12-end;
  padding: 10px;
}
@media all and (min-width: 481px) {
  #material-components > div, #material-components > form > div {
    display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
    display: -webkit-flex; /* Safari 7*/
    display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
    display: -ms-flexbox; /* IE10 */
    display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
    display: flex;
    /* Simulating 2012 flexbox model (used in IE 10) */
    /* Legacy Browsers (IE 10)*/
    -webkit-box-pack: start;
    -moz-box-pack: start;
    -ms-flex-pack: start;
    -webkit-box-align: stretch;
    -moz-box-align: stretch;
    -ms-flex-align: stretch;
    /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
    /* For understanding browsers */
    -webkit-flex-direction: row;
    -moz-flex-direction: row;
    -ms-flex-direction: row;
    -o-flex-direction: row;
    flex-direction: row;
    -webkit-align-items: stretch;
    -moz-align-items: stretch;
    -ms-align-items: stretch;
    -o-align-items: stretch;
    align-items: stretch;
    -webkit-flex-flow: row nowrap;
    -webkit-justify-content: flex-start;
    -moz-justify-content: flex-start;
    -o-justify-content: flex-start;
    -ms-justify-content: flex-start;
    justify-content: flex-start;
    flex-wrap: nowrap;
    -ms-flex-wrap: nowrap; /* IE 10 */
    -webkit-flex-wrap: nowrap;
    margin-bottom: 10px;
  }
  #material-components .form-element {
    width: 25%;
  }
  #material-components > div > *:not(:first-child):not(.dialog) {
    margin-left: 10px;
  }
  #material-components > form > div {
    margin: 10px;
  }
  #material-components > form > div > *:not(:first-child) {
    margin-left: 30px;
  }
  #material-components button {
    margin-bottom: 0;
    margin-right: 0;
  }
}
#material-components .tabnavigation-content-item {
  padding: 10px;
}
#material-components > form > div {
  margin-bottom: 20px;
}
#material-components > .headlines {
  margin-top: 30px;
}
#material-components .material-card {
  width: 300px;
}
#material-components button {
  margin-bottom: 10px;
  margin-right: 10px;
}
#material-components .form-element {
  margin-bottom: 14px;
}

#company-faq .collapsible-content {
  padding: 0 10px;
  line-height: 1.5;
}
#company-faq .collapsible-item + .collapsible-item {
  margin-top: 20px;
}

#partner-logos div {
  font-size: 2.6rem;
  color: #0375b4;
}
#partner-logos div.ui-icon-partner-fischer {
  font-size: 3.6rem;
}

#partner-list {
  display: grid;
  grid-gap: 10px;
  grid-template-columns: repeat(1, minmax(0, 1fr));
}
#partner-list .partner-list-item {
  background-color: #ffffff;
  border-top: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
  padding: 10px;
}
#partner-list .partner-list-item > .element-actions {
  padding-top: 10px;
}
#partner-list .partner-logo {
  max-width: 280px;
  height: 140px;
  margin: 0 auto 10px auto;
}
@media all and (min-width: 481px) {
  #partner-list {
    display: grid;
    grid-gap: 10px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media all and (min-width: 681px) {
  #partner-list {
    display: grid;
    grid-gap: 10px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

.company-presentation .timeline-container ul {
  max-width: 100%;
}
@media all and (max-width: 1151px) {
  .company-presentation .timeline-container ul {
    display: block;
    height: 60px;
  }
  .company-presentation .timeline-container ul a {
    display: block;
    transform: rotate(-55deg);
    position: relative;
    top: 17px;
    left: 14px;
  }
  .company-presentation .timeline-container ul a:after {
    position: relative;
    bottom: 6px;
    left: -32px;
  }
}
@media all and (max-width: 861px) {
  .company-presentation .timeline-container ul {
    overflow-x: scroll;
    overflow-y: hidden;
  }
}
@media all and (max-width: 861px) {
  .company-presentation {
    padding-bottom: 270px;
  }
}

#company-team .staff .description {
  margin: 0 10px;
}

#data-protection-regulations {
  padding: 10px;
  grid-row: content-row1-start/content-row10-end;
  grid-column: content-col1-start/content-col12-end;
}
#data-protection-regulations .collapsible-item {
  margin: 50px 0 0 0;
}
#data-protection-regulations .collapsible-item .block {
  padding: 0 10px;
  line-height: 1.2;
}
#data-protection-regulations .headlines.secondary {
  padding: 0 10px;
  font-weight: 300;
  font-size: 1.15rem;
  margin-top: 10px;
}
#data-protection-regulations .headlines.tertiary {
  padding: 0 10px;
  margin-top: 10px;
}

.static-wrapper {
  grid-row: content-row1-start/content-row10-end;
  grid-column: content-col1-start/content-col12-end;
}
.static-wrapper .swiper-slide img {
  max-width: 590px;
  width: 100%;
  object-fit: contain;
}
.static-wrapper .static-image-box {
  width: 100%;
  object-fit: contain;
}
.static-wrapper .static-text {
  line-height: 1.5;
}
.static-wrapper .static-text .sb-arrow-top {
  top: -26px;
}

.registration #website-features {
  display: none;
}
@media all and (min-width: 681px) {
  .registration #website-features {
    display: block;
    grid-row: content-row1-start/content-row1-end;
    grid-column: content-col1-start/content-col6-end;
    margin: 0 10px;
  }
  .registration #website-features > div {
    display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
    display: -webkit-flex; /* Safari 7*/
    display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
    display: -ms-flexbox; /* IE10 */
    display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
    display: flex;
    /* Simulating 2012 flexbox model (used in IE 10) */
    /* Legacy Browsers (IE 10)*/
    -webkit-box-pack: justify;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-box-align: stretch;
    -moz-box-align: stretch;
    -ms-flex-align: stretch;
    /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
    /* For understanding browsers */
    -webkit-flex-direction: row;
    -moz-flex-direction: row;
    -ms-flex-direction: row;
    -o-flex-direction: row;
    flex-direction: row;
    -webkit-align-items: stretch;
    -moz-align-items: stretch;
    -ms-align-items: stretch;
    -o-align-items: stretch;
    align-items: stretch;
    -webkit-flex-flow: row nowrap;
    -webkit-justify-content: space-between;
    -moz-justify-content: space-between;
    -o-justify-content: space-between;
    -ms-justify-content: space-between;
    justify-content: space-between;
    flex-wrap: nowrap;
    -ms-flex-wrap: nowrap; /* IE 10 */
    -webkit-flex-wrap: nowrap;
  }
  .registration #website-features .website-features-icon:before {
    font-size: 2.6rem;
    color: #0375b4;
    width: 100%;
    text-align: center;
  }
  .registration #website-features .website-features-text {
    font-size: 0.9rem;
  }
}

#imprint {
  grid-row: content-row1-start/content-row10-end;
  grid-column: content-col1-start/content-col12-end;
}
#imprint .collapsible-headline {
  padding-left: 0;
}
#imprint .block-header {
  padding: 10px 0;
}
#imprint .additional-data {
  margin-top: 10px;
  max-width: 500px;
}
#imprint .ui-icon-logo-tourispo:before {
  color: #0375b4;
  font-size: 2.6rem;
}
#imprint #imprint-liable-person, #imprint #imprint-responsible-for-content {
  margin-top: 30px;
}
@media all and (min-width: 481px) {
  #imprint {
    padding: 0 30px;
  }
}

#z-wert-tabelle table {
  max-width: 100%;
  overflow: scroll;
}

#z-value-calculator button.primary {
  margin-top: 20px;
}
#z-value-calculator .messages-feedback-message {
  margin-top: 20px;
}

.entity-rating {
  /*############################################
   *## The little number showing how many people already clicked WannaBeThere or BeenThere
   *############################################*/
}
.star-rating-container {
  font-family: TourispoWebfonts !important;
  font-weight: 400;
  font-style: normal;
  display: inline-block;
  width: 121px;
  position: relative;
  /*############################################
   *## The DropDown to choose a StarRating on mobile devices is hidden with opacity: 0 (do not hide differently)
   *## and shifted over the container with the star-rating so that a native click is triggered
   *############################################*/
}
.star-rating-container.mega {
  width: 200px;
}
.star-rating-container.mega .rating.active:before, .star-rating-container.mega .rating.counterpart:before {
  font-size: 40px;
  letter-spacing: 3px;
}
@media (hover: none) {
  .star-rating-container .mobile-star-rating-dropdown select {
    width: 100%;
    left: 0;
    top: 0;
    height: 100%;
    position: absolute;
    opacity: 0;
    min-width: 140px;
  }
}
@media (hover: hover) {
  .star-rating-container .mobile-star-rating-dropdown {
    display: none;
  }
}
.star-rating-container .rating {
  float: left;
  cursor: pointer;
  overflow: hidden;
  white-space: nowrap;
  /* Active stars: Use webfonts and draw five empty stars. The slider-percent classes
     only make as many stars visible as defined by the rating*/
  /**
   * Dynamisches Rating mit Mouse-Over Sliding Effekt und beliebig vielen Rating Schritten
  */
  /* Active stars: Use webfonts and draw five filled stars. The slider-percent classes
  only make as many stars visible as defined by the rating*/
}
.star-rating-container .rating.active:before {
  content: "\f005\f005\f005\f005\f005";
}
.star-rating-container .rating.counterpart {
  direction: rtl;
}
.star-rating-container .rating.counterpart:before {
  content: "\f006\f006\f006\f006\f006";
  position: relative;
  left: 1px;
}
.star-rating-container .rating:before {
  font-size: 24px;
  letter-spacing: 2px;
}
.star-rating-container .rating.slider-percent0 {
  width: 0;
}
.star-rating-container .rating.slider-percent10 {
  width: 10%;
}
.star-rating-container .rating.slider-percent20 {
  width: 20%;
}
.star-rating-container .rating.slider-percent30 {
  width: 30%;
}
.star-rating-container .rating.slider-percent40 {
  width: 40%;
}
.star-rating-container .rating.slider-percent50 {
  width: 50%;
}
.star-rating-container .rating.slider-percent60 {
  width: 60%;
}
.star-rating-container .rating.slider-percent70 {
  width: 70%;
}
.star-rating-container .rating.slider-percent80 {
  width: 80%;
}
.star-rating-container .rating.slider-percent90 {
  width: 90%;
}
.star-rating-container .rating.slider-percent100 {
  width: 100%;
}
.star-rating-container.tiny, .star-rating-container.small {
  width: 70px;
}
.star-rating-container.tiny .rating:before, .star-rating-container.small .rating:before {
  font-size: 13px;
  letter-spacing: 2px;
}

.entity-rating.small .star-rating-container {
  width: 64px;
}
.entity-rating.small .star-rating-container .rating:before {
  font-size: 12px;
}
@media all and (min-width: 1151px) {
  .entity-rating.small .star-rating-container {
    width: 74px;
  }
  .entity-rating.small .star-rating-container .rating:before {
    font-size: 14px;
  }
}
.entity-rating-value {
  color: #0375b4;
  vertical-align: bottom;
}

.entity-rating .icon {
  color: #0375b4;
  cursor: pointer;
}
.entity-rating .icon:before {
  color: #0375b4;
  font-size: 24px;
}
.entity-rating .icon.used-by-loggedin {
  color: #ffc100;
}
.entity-rating .icon.used-by-loggedin:before {
  color: #ffc100 !important;
}
.entity-rating .number {
  font-size: 0.75em;
  left: -6px;
  position: relative;
  top: 2px;
}
.entity-rating .number-ratings {
  line-height: 25px;
}

.wall-post .star-rating-container.inactive .counterpart {
  position: absolute;
  width: 100%;
}

.c_blogarticle #social-share, .c_sweepstake #social-share, .c_survey #social-share {
  grid-row: tabnavi-row;
  grid-column: tabnavi-col-start/tabnavi-col-end;
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: stretch;
  -moz-box-align: stretch;
  -ms-flex-align: stretch;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
  padding: 10px 10px 0 10px;
  border-top: 1px solid #ccc;
}
.c_blogarticle #social-share .social-box, .c_sweepstake #social-share .social-box, .c_survey #social-share .social-box {
  cursor: pointer;
}
.c_blogarticle #social-share .social-box:before, .c_sweepstake #social-share .social-box:before, .c_survey #social-share .social-box:before {
  font-size: 1rem;
  color: #727272;
  width: 30px;
  text-align: center;
}
.c_blogarticle #social-share .social-box.ui-icon-comment, .c_sweepstake #social-share .social-box.ui-icon-comment, .c_survey #social-share .social-box.ui-icon-comment {
  flex-grow: 1;
  align-items: flex-start;
  /* For understanding browsers */
  -webkit-flex-direction: column;
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  -o-flex-direction: column;
  flex-direction: column;
  -webkit-flex-flow: column wrap;
}
.c_blogarticle #social-share .social-box.ui-icon-comment .number, .c_sweepstake #social-share .social-box.ui-icon-comment .number, .c_survey #social-share .social-box.ui-icon-comment .number {
  font-size: 0.74rem;
  margin-top: -8px;
  color: #727272;
  font-weight: 700;
}
.c_blogarticle #social-share .social-box:hover:before, .c_sweepstake #social-share .social-box:hover:before, .c_survey #social-share .social-box:hover:before {
  color: #0375b4;
}
@media all and (min-width: 681px) {
  .c_blogarticle #social-share, .c_sweepstake #social-share, .c_survey #social-share {
    grid-row: content-row2-start/content-row2-end;
    grid-column: content-col9-start/content-col12-end;
    position: relative;
    left: -10px;
    top: 31px;
    padding: 6px 0 0 0;
  }
  .c_blogarticle #social-share.is-photo-series, .c_sweepstake #social-share.is-photo-series, .c_survey #social-share.is-photo-series {
    grid-row: content-row3-start/content-row3-end;
    grid-column: content-col1-start/content-col12-end;
    width: 20%;
    margin-right: 10%;
    justify-self: end;
  }
  .c_blogarticle #social-share .social-box.ui-icon-comment, .c_sweepstake #social-share .social-box.ui-icon-comment, .c_survey #social-share .social-box.ui-icon-comment {
    align-items: flex-end;
  }
}
@media all and (min-width: 861px) {
  .c_blogarticle #social-share, .c_sweepstake #social-share, .c_survey #social-share {
    position: relative;
    width: calc(100% + 10px);
    left: -10px;
    border-left: none;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
  }
}
@media all and (min-width: 1401px) {
  .c_blogarticle #social-share, .c_sweepstake #social-share, .c_survey #social-share {
    grid-row: content-row1-start/content-row1-end;
    grid-column: content-col1-start/content-col1-end;
    background-color: #fafafa;
    display: block;
    margin-top: 0;
    justify-self: start;
    padding: 14px;
    border: 1px solid #ccc;
    border-right: none;
    left: -69px;
    width: 60px;
    position: relative;
  }
  .c_blogarticle #social-share .social-box, .c_sweepstake #social-share .social-box, .c_survey #social-share .social-box {
    position: static;
  }
  .c_blogarticle #social-share .social-box:before, .c_sweepstake #social-share .social-box:before, .c_survey #social-share .social-box:before {
    font-size: 1.3rem;
  }
  .c_blogarticle #social-share .social-box:not(:last-child), .c_sweepstake #social-share .social-box:not(:last-child), .c_survey #social-share .social-box:not(:last-child) {
    margin-bottom: 10px;
  }
  .c_blogarticle #social-share.is-photo-series, .c_sweepstake #social-share.is-photo-series, .c_survey #social-share.is-photo-series {
    grid-row: content-row1-start/content-row1-end;
    grid-column: content-col1-start/content-col1-end;
    background-color: #fafafa;
    display: block;
    margin-top: 0;
    justify-self: start;
    padding: 14px;
    border: 1px solid #ccc;
    border-right: none;
    left: -69px;
    width: 60px;
    position: relative;
  }
  .c_blogarticle #social-share.is-photo-series .social-box, .c_sweepstake #social-share.is-photo-series .social-box, .c_survey #social-share.is-photo-series .social-box {
    position: static;
  }
  .c_blogarticle #social-share.is-photo-series .social-box:before, .c_sweepstake #social-share.is-photo-series .social-box:before, .c_survey #social-share.is-photo-series .social-box:before {
    font-size: 1.3rem;
  }
  .c_blogarticle #social-share.is-photo-series .social-box:not(:last-child), .c_sweepstake #social-share.is-photo-series .social-box:not(:last-child), .c_survey #social-share.is-photo-series .social-box:not(:last-child) {
    margin-bottom: 10px;
  }
}

/*############################################
 *##
 *## less file for the favourites-history-panel
 *##
 *############################################*/
#favourites-history-panel {
  display: none;
  padding-right: 10px;
}
@media all and (min-width: 1151px) {
  #favourites-history-panel {
    max-width: 110px;
    justify-self: end;
    margin-left: 20px;
    grid-row: favorites-history-row;
    grid-column: favorites-history-col-start/favorites-history-col-end;
    display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
    display: -webkit-flex; /* Safari 7*/
    display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
    display: -ms-flexbox; /* IE10 */
    display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
    display: flex;
    /* Simulating 2012 flexbox model (used in IE 10) */
    /* Legacy Browsers (IE 10)*/
    -webkit-box-pack: justify;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-box-align: stretch;
    -moz-box-align: stretch;
    -ms-flex-align: stretch;
    /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
    /* For understanding browsers */
    -webkit-flex-direction: row;
    -moz-flex-direction: row;
    -ms-flex-direction: row;
    -o-flex-direction: row;
    flex-direction: row;
    -webkit-align-items: stretch;
    -moz-align-items: stretch;
    -ms-align-items: stretch;
    -o-align-items: stretch;
    align-items: stretch;
    -webkit-flex-flow: row nowrap;
    -webkit-justify-content: space-between;
    -moz-justify-content: space-between;
    -o-justify-content: space-between;
    -ms-justify-content: space-between;
    justify-content: space-between;
    flex-wrap: nowrap;
    -ms-flex-wrap: nowrap; /* IE 10 */
    -webkit-flex-wrap: nowrap;
    width: calc(100% + 2vw);
    height: 74px;
    align-items: center;
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    z-index: 42;
  }
  #favourites-history-panel .favorites-history-icon {
    color: #0375b4;
    position: relative;
  }
  #favourites-history-panel .favorites-history-icon:before {
    font-size: 20px;
    cursor: pointer;
  }
  #favourites-history-panel .favorites-history-icon.active::before {
    color: #0375b4;
  }
  #favourites-history-panel .favorites-history-icon .notification-icon {
    font-size: 0.74rem;
    position: absolute;
    top: -8px;
    right: -10px;
    padding: 2px;
    text-align: center;
    font-weight: 700;
    color: white;
    line-height: 10px;
    background-color: red;
    border-radius: 5px;
  }
  #favourites-history-panel .favorites-history-lists {
    position: absolute;
    width: 400px;
    right: 2px;
    top: 60px;
  }
  #favourites-history-panel .favorites-history-lists .entity-lean-list {
    background-color: #ffffff;
    padding: 6px;
    -webkit-box-shadow: 1px 1px 2px 1px #727272;
    box-shadow: 1px 1px 2px 1px #727272;
    position: relative;
  }
  #favourites-history-panel .favorites-history-lists .entity-lean-list:after {
    -webkit-transform: rotate(135deg);
    transform: rotate(135deg);
    width: 14px;
    height: 14px;
    top: -8px;
    content: "";
    display: block;
    position: absolute;
    background: #ffffff;
    border: 1px solid #ccc;
    border-top: none;
    border-right: none;
  }
  #favourites-history-panel .favorites-history-lists .entity-lean-list .pecu-divider {
    padding: 6px 0;
    border-bottom: 1px solid #0375b4;
    margin-bottom: 10px;
  }
  #favourites-history-panel .favorites-history-lists .entity-lean-list .autocomplete-item {
    display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
    display: -webkit-flex; /* Safari 7*/
    display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
    display: -ms-flexbox; /* IE10 */
    display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
    display: flex;
    /* Simulating 2012 flexbox model (used in IE 10) */
    /* Legacy Browsers (IE 10)*/
    -webkit-box-pack: justify;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-box-align: stretch;
    -moz-box-align: stretch;
    -ms-flex-align: stretch;
    /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
    /* For understanding browsers */
    -webkit-flex-direction: row;
    -moz-flex-direction: row;
    -ms-flex-direction: row;
    -o-flex-direction: row;
    flex-direction: row;
    -webkit-align-items: stretch;
    -moz-align-items: stretch;
    -ms-align-items: stretch;
    -o-align-items: stretch;
    align-items: stretch;
    -webkit-flex-flow: row nowrap;
    -webkit-justify-content: space-between;
    -moz-justify-content: space-between;
    -o-justify-content: space-between;
    -ms-justify-content: space-between;
    justify-content: space-between;
    flex-wrap: nowrap;
    -ms-flex-wrap: nowrap; /* IE 10 */
    -webkit-flex-wrap: nowrap;
  }
  #favourites-history-panel .favorites-history-lists .entity-lean-list .autocomplete-item:not(:last-child) {
    padding-bottom: 6px;
  }
  #favourites-history-panel .favorites-history-lists .entity-lean-list .autocomplete-item .number-of-visits {
    color: #727272;
    font-size: 0.84rem;
  }
  #favourites-history-panel .favorites-history-lists.history-list .entity-lean-list:after {
    right: 92px;
  }
  #favourites-history-panel .favorites-history-lists.visits-list .entity-lean-list:after {
    right: 2px;
  }
  #favourites-history-panel .favorites-history-lists.favorites-list .entity-lean-list:after {
    right: 40px;
  }
}
@media all and (min-width: 1401px) {
  #favourites-history-panel {
    padding-right: 0;
  }
}

#user-rank {
  margin: 0 10px 10px 10px;
  background-color: #ffffff;
  padding: 10px;
  grid-row: content-row6-start/content-row6-end;
  grid-column: content-col1-start/content-col12-end;
  position: relative;
}
#user-rank .collapsible-item {
  margin: 0;
}
#user-rank .rankbar-container {
  background: white;
  border-radius: 5px;
  height: 10px;
  padding: 3px;
  border: 1px solid #0375b4;
  margin: 0 auto 10px 0;
}
#user-rank .rankbar-container .bar-length {
  height: 100%;
  background-color: #0375b4;
  border-radius: 3px;
  display: block;
  overflow: hidden;
  position: relative;
}
#user-rank .numbers {
  display: none;
  font-size: 1.6rem;
  font-weight: 700;
  color: #0375b4;
  position: absolute;
  right: 10px;
  top: 6px;
}
@media all and (min-width: 481px) {
  #user-rank {
    grid-row: content-row5-start/content-row5-end;
    grid-column: content-col1-start/content-col12-end;
  }
  #user-rank .numbers {
    display: block;
  }
}
@media all and (min-width: 1025px) {
  #user-rank {
    height: calc(100% - 20px);
    margin: 10px 10px 10px 0;
    grid-row: content-row4-start/content-row4-end;
    grid-column: content-col9-start/content-col12-end;
  }
}

#user-description {
  grid-row: content-row3-start/content-row3-end;
  grid-column: content-col1-start/content-col12-end;
  padding: 6px;
  margin-bottom: 20px;
  line-height: 1.4;
}
#user-description .headlines:not(:first-child) {
  margin-top: 10px;
}
#user-description .formatted-article-block:first-child {
  padding-top: 0;
}

#user-personal-data {
  grid-row: content-row4-start/content-row4-end;
  grid-column: content-col1-start/content-col12-end;
  margin: 10px 0 0 10px;
  background-color: #ffffff;
  padding: 10px;
  height: calc(100% - 10px);
  width: calc(100% - 20px);
  z-index: 1;
}
#user-personal-data .collapsible-item {
  margin: 0;
}
#user-personal-data .send-inquiry-link {
  line-height: 2;
  padding-top: 6px;
}
@media all and (min-width: 481px) {
  #user-personal-data {
    grid-row: content-row4-start/content-row4-end;
    grid-column: content-col1-start/content-col6-end;
    width: calc(100% - 10px);
  }
}
@media all and (min-width: 1025px) {
  #user-personal-data {
    grid-row: content-row4-start/content-row4-end;
    grid-column: content-col1-start/content-col4-end;
    margin: 10px 0 10px 10px;
    height: calc(100% - 20px);
  }
}

#user-data-grid-background {
  grid-row: content-row4-start/content-row6-end;
  grid-column: content-col1-start/content-col12-end;
  background-color: #f1f1f1;
  width: 100%;
  height: 100%;
}
@media all and (min-width: 481px) {
  #user-data-grid-background {
    grid-row: content-row4-start/content-row5-end;
    grid-column: content-col1-start/content-col12-end;
  }
}
@media all and (min-width: 1025px) {
  #user-data-grid-background {
    grid-row: content-row4-start/content-row4-end;
    grid-column: content-col1-start/content-col12-end;
  }
}

#user-entity-statistics {
  grid-row: content-row5-start/content-row5-end;
  grid-column: content-col1-start/content-col12-end;
  margin: 0 10px;
  background-color: #ffffff;
  padding: 10px;
  z-index: 1;
}
#user-entity-statistics .collapsible-item {
  margin: 0;
}
@media all and (min-width: 481px) {
  #user-entity-statistics {
    height: calc(100% - 10px);
    margin: 10px 10px 0 0;
    grid-row: content-row4-start/content-row4-end;
    grid-column: content-col7-start/content-col12-end;
  }
}
@media all and (min-width: 1025px) {
  #user-entity-statistics {
    grid-row: content-row4-start/content-row4-end;
    grid-column: content-col5-start/content-col8-end;
    margin: 10px 0;
    height: calc(100% - 20px);
  }
}

#user-settings {
  grid-row: content-row1-start/content-row10-end;
  grid-column: content-col1-start/content-col12-end;
}
@media all and (max-width: 1401px) {
  #user-settings {
    padding-left: 10px;
  }
}
@media all and (max-width: 861px) {
  #user-settings {
    padding-right: 10px;
  }
}
#user-settings .horizontal-navigation--tabbed .link {
  -moz-hyphens: auto;
  -o-hyphens: auto;
  -webkit-hyphens: auto;
  -ms-hyphens: auto;
  hyphens: auto;
}

.entitymain #pecu-wall, .productmain #pecu-wall, .usermain #pecu-wall {
  grid-row: content-row14-start/content-row14-end;
  grid-column: content-col1-start/content-col12-end;
}
@media all and (min-width: 481px) {
  .entitymain #pecu-wall, .productmain #pecu-wall, .usermain #pecu-wall {
    grid-row: content-row12-start/content-row12-end;
  }
}

.entitywall #pecu-wall, .userwall #pecu-wall {
  grid-row: content-row1-start/content-row4-end;
  grid-column: content-col1-start/content-col12-end;
}

.contentmain #pecu-wall {
  grid-row: content-row6-start/content-row14-end;
  grid-column: content-col1-start/content-col12-end;
}

#pecu-wall {
  overflow: hidden;
  margin-top: 20px;
  /*############################################
   *## Elemenst valid for both comments and posts
   *############################################*/
  /*User profile images next to posts / comments */
  /* In case the user di not sign up when posting, the image is not linked to a profile => grey color
   *############################################*/
  /* CI color for registered users */
}
#pecu-wall .post-author-img, #pecu-wall .comment-author-img {
  float: left;
  margin: 10px 10px 0 0;
}
#pecu-wall .entity-post-rating-container {
  width: 100%;
  margin-bottom: 10px;
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: start;
  -moz-box-pack: start;
  -ms-flex-pack: start;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: center;
  -moz-align-items: center;
  -ms-align-items: center;
  -o-align-items: center;
  align-items: center;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: flex-start;
  -moz-justify-content: flex-start;
  -o-justify-content: flex-start;
  -ms-justify-content: flex-start;
  justify-content: flex-start;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
}
#pecu-wall .star-rating-container {
  position: relative;
}
#pecu-wall .star-rating-container .rating {
  cursor: default;
}
#pecu-wall #link-wall-page {
  padding-top: 10px;
}
#pecu-wall .post-author-img, #pecu-wall .comment-author-img, #pecu-wall .new-post-author-img, #pecu-wall .image-placeholder {
  border-radius: 50%;
  background-color: #FFF;
}
#pecu-wall .post-author-img:before, #pecu-wall .comment-author-img:before, #pecu-wall .new-post-author-img:before, #pecu-wall .image-placeholder:before {
  overflow: hidden;
  width: 100%;
  height: 100%;
  border-radius: 50%;
}
#pecu-wall .post-author-img, #pecu-wall .comment-author-img {
  border: 2px solid #31394a;
}
#pecu-wall .new-post-author-img, #pecu-wall a .post-author-img, #pecu-wall a .comment-author-img {
  border: 2px solid #0375b4;
}
#pecu-wall a:hover .post-author-img, #pecu-wall a:hover .comment-author-img {
  border: 2px solid #ffc100;
}

/*############################################
 *## Valid for both Posts and comments
 *############################################*/
.wall-post, .wall-comment {
  border-radius: 3px;
}
.wall-post .author-section, .wall-comment .author-section {
  padding: 0 10px;
  position: relative;
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: start;
  -moz-box-pack: start;
  -ms-flex-pack: start;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  box-lines: multiple;
  -moz-box-lines: multiple;
  -webkit-box-lines: multiple;
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: center;
  -moz-align-items: center;
  -ms-align-items: center;
  -o-align-items: center;
  align-items: center;
  -webkit-flex-flow: row wrap;
  -webkit-justify-content: flex-start;
  -moz-justify-content: flex-start;
  -o-justify-content: flex-start;
  -ms-justify-content: flex-start;
  justify-content: flex-start;
  flex-wrap: wrap;
  -ms-flex-wrap: wrap; /* IE 10 */
  -webkit-flex-wrap: wrap;
}
.wall-post .author-section .relative-time, .wall-comment .author-section .relative-time {
  position: absolute;
  top: 10px;
  right: 10px;
  width: 100%;
  text-align: right;
  font-size: 0.84rem;
}
.wall-post .author-section .author-name, .wall-comment .author-section .author-name {
  display: block;
}
.wall-post .author-section .image-placeholder:before, .wall-comment .author-section .image-placeholder:before {
  color: #31394a;
}
.wall-post .author-section > a, .wall-post .author-section > span, .wall-comment .author-section > a, .wall-comment .author-section > span {
  display: block;
  float: left;
}
.wall-post .text-section, .wall-comment .text-section {
  padding: 10px;
}

/*############################################//
 *## Wall Post
 *############################################*/
.wall-post {
  margin-top: 24px;
  padding: 0;
  background-color: #d9eaf4;
}
.wall-post .post-additional-data {
  float: left;
}
.wall-post .post-additional-data .star-rating-container {
  width: auto;
  font-size: 0.74rem;
  line-height: 18px;
}
.wall-post .post-additional-data .star-rating-container .rating:before {
  font-size: 0.9rem;
}
.wall-post .text-section {
  min-height: 38px;
}
.wall-post .action-box {
  width: 100%;
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: distribute;
  -moz-box-pack: distribute;
  -ms-flex-pack: distribute;
  -webkit-box-align: stretch;
  -moz-box-align: stretch;
  -ms-flex-align: stretch;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: space-around;
  -moz-justify-content: space-around;
  -o-justify-content: space-around;
  -ms-justify-content: space-around;
  justify-content: space-around;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
  border-top: 1px solid #ffffff;
  border-radius: 0 0 3px 3px;
}
.wall-post .action-box a {
  text-align: center;
  line-height: 2;
  color: #ffffff;
  background-color: #0375b4;
  display: block;
  flex-grow: 1;
  -webkit-flex-grow: 1;
  -moz-flex-grow: 1;
  -ms-flex-grow: 1;
  -o-flex-grow: 1;
}
.wall-post .action-box a:not(:last-child) {
  border-right: 1px #ffffff solid;
}
.wall-post .action-box a:hover {
  background-color: #ffc100;
}
.wall-post .action-box a:before {
  margin-right: 10px;
}

/*############################################
*## Wall Comments
*############################################*/
.wall-post-comments {
  border-left: 2px solid #727272;
  padding-left: 10px;
  margin: 10px 0 0 14px;
  overflow: hidden;
}
.wall-post-comments .wall-comment {
  min-height: 50px;
  background-color: #ccc;
}
.wall-post-comments .wall-comment + .wall-comment {
  margin-top: 10px;
}
.wall-post-comments .show-all-comments-link {
  color: #0375b4;
  padding-top: 10px;
  font-weight: 700;
  display: block;
}
.wall-post-comments .comment-container {
  clear: both;
}
.wall-post-comments .progress-container {
  width: 100%;
}
.wall-post-comments .progress-container:after {
  right: 10px;
  top: 8px;
  color: #727272;
}

/*############################################
 *## Writing new posts or new comments
 *############################################*/
#wall-new-post {
  margin-bottom: 10px;
  padding-top: 20px;
}
#wall-new-post form {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: start;
  -moz-box-pack: start;
  -ms-flex-pack: start;
  -webkit-box-align: stretch;
  -moz-box-align: stretch;
  -ms-flex-align: stretch;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  box-lines: multiple;
  -moz-box-lines: multiple;
  -webkit-box-lines: multiple;
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-flex-flow: row wrap;
  -webkit-justify-content: flex-start;
  -moz-justify-content: flex-start;
  -o-justify-content: flex-start;
  -ms-justify-content: flex-start;
  justify-content: flex-start;
  flex-wrap: wrap;
  -ms-flex-wrap: wrap; /* IE 10 */
  -webkit-flex-wrap: wrap;
}
#wall-new-post form .new-post-author-img {
  display: none;
}
#wall-new-post form textarea {
  height: 54px;
  /*############################################
   *## ATTENTION: Selectors cannot be combined due to CSS 2.1 specification
   *## The selector (see also the section on selectors) consists of everything up to (but not including) the first left curly brace ({). A selector always goes together with a declaration block.
   *## When a user agent cannot parse the selector (i.e., it is not valid CSS 2.1), it must ignore the selector and the following declaration block (if any) as well.
   *## => Other vendor prefixes break the whole rule
   *############################################*/
  /* For Microsoft Edge */
}
#wall-new-post form textarea:-ms-input-placeholder {
  color: #0375b4;
  font-weight: normal;
  font-size: 1rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  opacity: 1;
}
#wall-new-post form textarea::-ms-input-placeholder {
  color: #0375b4;
  font-weight: normal;
  font-size: -1rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  opacity: 1;
}
#wall-new-post form textarea::-moz-placeholder {
  color: #0375b4;
  font-weight: normal;
  font-size: 1rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  opacity: 1;
}
#wall-new-post form textarea:-moz-placeholder {
  color: #0375b4;
  font-weight: normal;
  font-size: 1rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  opacity: 1;
}
#wall-new-post form textarea::-webkit-input-placeholder {
  color: #0375b4;
  font-weight: normal;
  font-size: 1rem;
  line-height: 9rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  opacity: 1;
}
#wall-new-post form textarea::-moz-placeholder {
  line-height: 1.5;
}
#wall-new-post form textarea:-moz-placeholder {
  line-height: 1.5;
}
#wall-new-post form textarea::-webkit-input-placeholder {
  line-height: 1.5;
}
#wall-new-post form textarea:-ms-input-placeholder {
  line-height: 1.5;
}
#wall-new-post form textarea::-moz-placeholder {
  max-width: 90%;
}
#wall-new-post form textarea:-moz-placeholder {
  max-width: 90%;
}
#wall-new-post form textarea::-webkit-input-placeholder {
  max-width: 90%;
}
#wall-new-post form textarea:-ms-input-placeholder {
  max-width: 90%;
}
#wall-new-post .star-rating-container {
  margin-left: 10px;
}
#wall-new-post .star-rating-container .rating {
  cursor: pointer;
}
#wall-new-post .username-container {
  flex-grow: 1;
  -webkit-flex-grow: 1;
  -moz-flex-grow: 1;
  -ms-flex-grow: 1;
  -o-flex-grow: 1;
  margin: -8px 0 10px 0;
}
#wall-new-post .username-container > div {
  max-width: 572px;
}
#wall-new-post .image-placeholder {
  height: 54px;
  width: 54px;
}
#wall-new-post .image-placeholder:before {
  font-size: 54px;
}
@media all and (min-width: 681px) {
  #wall-new-post form .new-post-author-img {
    display: block;
    margin-right: 10px;
  }
  #wall-new-post form textarea {
    /*############################################
     *## ATTENTION: Selectors cannot be combined due to CSS 2.1 specification
     *## The selector (see also the section on selectors) consists of everything up to (but not including) the first left curly brace ({). A selector always goes together with a declaration block.
     *## When a user agent cannot parse the selector (i.e., it is not valid CSS 2.1), it must ignore the selector and the following declaration block (if any) as well.
     *## => Other vendor prefixes break the whole rule
     *############################################*/
    /* For Microsoft Edge */
  }
  #wall-new-post form textarea:-ms-input-placeholder {
    color: #0375b4;
    font-weight: normal;
    font-size: 1.3rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    opacity: 1;
  }
  #wall-new-post form textarea::-ms-input-placeholder {
    color: #0375b4;
    font-weight: normal;
    font-size: -0.7rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    opacity: 1;
  }
  #wall-new-post form textarea::-moz-placeholder {
    color: #0375b4;
    font-weight: normal;
    font-size: 1.3rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    opacity: 1;
  }
  #wall-new-post form textarea:-moz-placeholder {
    color: #0375b4;
    font-weight: normal;
    font-size: 1.3rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    opacity: 1;
  }
  #wall-new-post form textarea::-webkit-input-placeholder {
    color: #0375b4;
    font-weight: normal;
    font-size: 1.3rem;
    line-height: 9.3rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    opacity: 1;
  }
  #wall-new-post form textarea::-moz-placeholder {
    line-height: 33px;
  }
  #wall-new-post form textarea:-moz-placeholder {
    line-height: 33px;
  }
  #wall-new-post form textarea::-webkit-input-placeholder {
    line-height: 33px;
  }
  #wall-new-post form textarea:-ms-input-placeholder {
    line-height: 33px;
  }
  #wall-new-post form button {
    width: 170px;
    font-size: 1.3rem;
    margin-right: 0;
  }
  #wall-new-post form button:before {
    margin-right: 10px;
    position: relative;
    top: 2px;
  }
  #wall-new-post .entity-post-rating-container {
    margin-left: 64px;
  }
}

/*############################################
 *## Writing new Comment
 *############################################*/
.wall-new-comment {
  display: none;
}
.wall-new-comment.already-commented {
  margin-bottom: 10px;
}

/*############################################
 *## Indentical styling for new comment and new post
 *############################################*/
#wall-new-post, .wall-new-comment {
  position: relative;
  /*############################################
   *## Make some adjustments for the ProgressIndicator for mobile devices
   *## The ProgressIndicator is shown left next to the huge button and should
   *## have a background to fully cover the text behind it
   *############################################*/
}
#wall-new-post textarea, .wall-new-comment textarea {
  width: 100%;
  max-height: 150px;
  padding: 10px 130px 10px 10px;
  border-radius: 5px;
}
#wall-new-post .textarea-container, .wall-new-comment .textarea-container {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: distribute;
  -moz-box-pack: distribute;
  -ms-flex-pack: distribute;
  -webkit-box-align: stretch;
  -moz-box-align: stretch;
  -ms-flex-align: stretch;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  box-lines: multiple;
  -moz-box-lines: multiple;
  -webkit-box-lines: multiple;
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-flex-flow: row wrap;
  -webkit-justify-content: space-around;
  -moz-justify-content: space-around;
  -o-justify-content: space-around;
  -ms-justify-content: space-around;
  justify-content: space-around;
  flex-wrap: wrap;
  -ms-flex-wrap: wrap; /* IE 10 */
  -webkit-flex-wrap: wrap;
}
#wall-new-post .new-post, .wall-new-comment .new-post {
  width: 100%;
}
#wall-new-post .new-post .post-textarea-container, .wall-new-comment .new-post .post-textarea-container {
  max-width: 572px;
  position: relative;
}
#wall-new-post .new-post .post-textarea-container .form-element, .wall-new-comment .new-post .post-textarea-container .form-element {
  padding-top: 0;
}
#wall-new-post button, .wall-new-comment button {
  margin-top: 0 !important;
  position: absolute !important;
  right: 0;
  top: 0 !important;
  height: 54px !important;
  width: 120px;
  padding-bottom: 0;
}
#wall-new-post .progressindicator:after, .wall-new-comment .progressindicator:after {
  left: -28px;
  background-color: #fff;
  border-radius: 50%;
  top: 50%;
  margin-top: -10px;
}
@media all and (min-width: 681px) {
  #wall-new-post .new-post, .wall-new-comment .new-post {
    margin-left: 64px;
  }
}
@media all and (min-width: 1151px) {
  #wall-new-post textarea, .wall-new-comment textarea {
    padding: 10px 150px 10px 10px;
  }
}

/*############################################
 *## Positioning on the grid depending on page type
 *############################################*/
.index #whats-hot {
  display: none;
}
@media all and (min-width: 681px) {
  .index #whats-hot {
    display: block;
    grid-row: breadcrumb-row/content-row1-start;
    grid-column: content-col1-start/content-col12-end;
    margin-bottom: 30px;
  }
}

#whats-hot #whats-hot-items .image-link {
  width: 100%;
  display: block;
  padding-bottom: 28.04%;
  position: relative;
  overflow: hidden;
}
#whats-hot #whats-hot-items .image-link .image-container, #whats-hot #whats-hot-items .image-link .div-image, #whats-hot #whats-hot-items .image-link ins {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100% !important;
  background-size: contain;
  margin: 0 auto;
}
#whats-hot #whats-hot-items .whats-hot-headline {
  background-color: rgba(0, 0, 0, 0.6);
  position: absolute;
  bottom: 30px;
  left: 3%;
  text-align: center;
  padding: 10px;
  -moz-hyphens: auto;
  -o-hyphens: auto;
  -webkit-hyphens: auto;
  -ms-hyphens: auto;
  hyphens: auto;
}
#whats-hot #whats-hot-items .whats-hot-headline a {
  color: #ffffff;
}
#whats-hot #whats-hot-items #official-test-awards > div span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
#whats-hot #whats-hot-items #official-test-awards > div:before {
  line-height: 57px;
  font-size: 2rem;
}
#whats-hot #whats-hot-items .swiper-wrapper {
  margin-bottom: 30px;
}
#whats-hot #whats-hot-items .swiper-pagination {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: stretch;
  -moz-box-align: stretch;
  -ms-flex-align: stretch;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
  width: 100%;
  height: 30px;
  padding-left: 14px !important;
  padding-right: 14px !important;
  bottom: 0;
  font-size: 0.84rem;
}
#whats-hot #whats-hot-items .swiper-pagination span {
  display: block;
  padding: 10px 14px;
  border-top: 2px solid transparent;
}
#whats-hot #whats-hot-items .swiper-pagination span .pagination-dots {
  display: none;
}
#whats-hot #whats-hot-items .swiper-pagination span .pagination-labels {
  cursor: pointer;
  color: #0375b4;
}
#whats-hot #whats-hot-items .swiper-pagination span .pagination-labels:not(.icon-with-label):before {
  display: block;
  content: attr(data-label);
  font-weight: bold;
  height: 1px;
  color: transparent;
  overflow: hidden;
  visibility: hidden;
  margin-bottom: -1px;
}
#whats-hot #whats-hot-items .swiper-pagination span .pagination-labels:not(.icon-with-label):hover {
  font-weight: 700;
}
#whats-hot #whats-hot-items .swiper-pagination span.active {
  border-top: 2px solid #f18825;
}
#whats-hot #whats-hot-items .swiper-pagination span.active .pagination-dots {
  background-color: #ffc100;
}
#whats-hot #whats-hot-items .swiper-pagination span.active .pagination-labels {
  font-weight: bold;
  color: #f18825;
}
@media all and (min-width: 481px) {
  #whats-hot #whats-hot-items .whats-hot-headline {
    font-size: 300;
  }
}
@media all and (min-width: 1151px) {
  #whats-hot #whats-hot-items .whats-hot-headline {
    font-size: 1.3rem;
  }
}

#whats-hot-items #official-test-summary {
  position: absolute;
  z-index: 1;
  border: none;
  right: 10px;
  top: 10px;
}
#whats-hot-items #official-test-summary #official-test-awards .awards, #whats-hot-items #official-test-summary .official-test-awards-includes .awards {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: stretch;
  -moz-box-align: stretch;
  -ms-flex-align: stretch;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  box-lines: multiple;
  -moz-box-lines: multiple;
  -webkit-box-lines: multiple;
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-flex-flow: row wrap;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: wrap;
  -ms-flex-wrap: wrap; /* IE 10 */
  -webkit-flex-wrap: wrap;
  width: 310px;
}
#whats-hot-items #official-test-summary #official-test-awards .awards .award, #whats-hot-items #official-test-summary .official-test-awards-includes .awards .award {
  width: 30%;
  height: 80px;
  border: 5px solid white;
  border-bottom: 20px solid white;
  margin-bottom: 10px;
  margin-left: 10px;
}
#whats-hot-items #official-test-summary #official-test-awards .awards .award span, #whats-hot-items #official-test-summary .official-test-awards-includes .awards .award span {
  color: #727272;
  font-weight: 300;
  text-align: center;
  font-size: 0.74rem;
  display: block;
  line-height: 20px;
}
#whats-hot-items #official-test-summary #official-test-awards .awards .award > div, #whats-hot-items #official-test-summary .official-test-awards-includes .awards .award > div {
  height: 100%;
  position: relative;
  overflow: hidden;
  /* For understanding browsers */
  -webkit-flex-direction: column;
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  -o-flex-direction: column;
  flex-direction: column;
  -webkit-flex-flow: column wrap;
}
#whats-hot-items #official-test-summary #official-test-awards .awards .award > div:before, #whats-hot-items #official-test-summary .official-test-awards-includes .awards .award > div:before {
  height: 100%;
  width: 100%;
  padding-right: 0;
  text-align: center;
  font-size: 2.6rem;
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: flex;
  -webkit-flex-direction: column;
  -webkit-box-orient: vertical; /* Safari <= 6*/
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  -o-flex-direction: column;
  flex-direction: column;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-justify-content: center;
  -moz-justify-content: center;
  -o-justify-content: center;
  -ms-justify-content: center;
  justify-content: center;
  flex-wrap: nowrap;
  -webkit-flex-wrap: nowrap;
}
#whats-hot-items #official-test-summary #official-test-awards .awards .award > div:after, #whats-hot-items #official-test-summary .official-test-awards-includes .awards .award > div:after {
  color: #727272;
  font-size: 0.74rem;
  position: absolute;
  padding: 0 10px;
  top: 7px;
  right: -12px;
  transform: rotate(45deg);
  content: "Award";
  background-color: #ffffff;
}

.widget-container {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: distribute;
  -moz-box-pack: distribute;
  -ms-flex-pack: distribute;
  -webkit-box-align: stretch;
  -moz-box-align: stretch;
  -ms-flex-align: stretch;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  box-lines: multiple;
  -moz-box-lines: multiple;
  -webkit-box-lines: multiple;
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-flex-flow: row wrap;
  -webkit-justify-content: space-around;
  -moz-justify-content: space-around;
  -o-justify-content: space-around;
  -ms-justify-content: space-around;
  justify-content: space-around;
  flex-wrap: wrap;
  -ms-flex-wrap: wrap; /* IE 10 */
  -webkit-flex-wrap: wrap;
  min-width: 190px;
  width: 100%;
  /*############################################
   *## Different styles for different widget sizes
   *############################################*/
}
.widget-container > div {
  width: 100% !important;
  margin-bottom: 10px !important;
}
.widget-container .headlines.primary {
  font-size: 1rem;
}
.widget-container .update-date {
  font-size: 0.74rem;
  display: block;
}
.widget-container #map-container {
  background-color: #ffffff;
  padding-bottom: 5px !important;
}
.widget-container .headlines.primary {
  color: #ffffff;
  background-color: #0375b4;
  padding: 8px !important;
}
.widget-container .headlines.primary:first-child {
  margin-top: 0 !important;
}
.widget-container .indicator-container {
  display: grid;
  grid-gap: 10px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.widget-container .indicator-container .slope-condition {
  text-align: center;
}
.widget-container #current-snow-heights .indicator-container {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: distribute;
  -moz-box-pack: distribute;
  -ms-flex-pack: distribute;
  -webkit-box-align: stretch;
  -moz-box-align: stretch;
  -ms-flex-align: stretch;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: space-around;
  -moz-justify-content: space-around;
  -o-justify-content: space-around;
  -ms-justify-content: space-around;
  justify-content: space-around;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
}
.widget-container #webcambox-widget .headlines {
  margin-bottom: 0;
}
.widget-container #webcambox-widget .swiper-container {
  margin-top: 0 !important;
  background-color: #ffffff !important;
}
.widget-container #webcambox-widget .swiper-container .swiper-slide .webcam-wrapper {
  height: 110px;
}
.widget-container #webcambox-widget .swiper-container .swiper-slide img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: top;
}
.widget-container #webcambox-widget .swiper-button-prev, .widget-container #webcambox-widget .swiper-button-next {
  color: #0375b4;
}
.widget-container .last-snowfall-avalanche {
  width: 100% !important;
  margin: 14px 0 0 0 !important;
  padding: 5px 10px !important;
  box-sizing: border-box;
}
.widget-container .last-snowfall-avalanche > div {
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
  display: flex;
  /* Simulating 2012 flexbox model (used in IE 10) */
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: stretch;
  -moz-box-align: stretch;
  -ms-flex-align: stretch;
  /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
  /* For understanding browsers */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  -o-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  -ms-align-items: stretch;
  -o-align-items: stretch;
  align-items: stretch;
  -webkit-flex-flow: row nowrap;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: nowrap;
  -ms-flex-wrap: nowrap; /* IE 10 */
  -webkit-flex-wrap: nowrap;
  width: 100% !important;
  margin: 0 !important;
}
.widget-container .show-more-link {
  padding: 10px;
}
.widget-container .fresh-snow-forecast .content-container {
  padding: 0 8px;
}
.widget-container .fresh-snow-forecast .bar-chart {
  height: 60px !important;
}
.widget-container #weather-preview .content-container {
  display: grid;
  grid-gap: 10px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  padding: 0 10px;
  margin-bottom: 4px;
}
.widget-container #weather-preview .content-container .icon {
  margin: 0 auto;
  text-align: center;
  display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex; /* Safari 7*/
  display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox; /* IE10 */
  display: flex;
  -webkit-flex-direction: column;
  -webkit-box-orient: vertical; /* Safari <= 6*/
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  -o-flex-direction: column;
  flex-direction: column;
  -webkit-align-items: center;
  -moz-align-items: center;
  -ms-align-items: center;
  -o-align-items: center;
  align-items: center;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  -o-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  flex-wrap: nowrap;
  -webkit-flex-wrap: nowrap;
  /* Legacy Browsers (IE 10)*/
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
}
.widget-container #weather-preview .content-container .icon .fonts {
  white-space: nowrap;
}
@media (width: 190px) {
  .widget-container #map-container {
    height: 160px;
  }
}
@media (width: 290px) {
  .widget-container > div {
    min-width: 290px !important;
  }
  .widget-container #webcambox-widget .swiper-container .swiper-slide .webcam-wrapper {
    height: 170px;
  }
}
@media (width: 600px) {
  .widget-container > div {
    width: 50% !important;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
  }
  .widget-container > div:nth-child(even) {
    padding-left: 10px;
  }
}

body.widget {
  padding: 0;
  width: 100%;
  min-width: 0 !important;
  font-size: 12px;
  overflow: hidden;
}

#widget-generate .form-element--textual {
  margin-top: 0;
  padding-top: 0;
}

#widget-configurator {
  grid-row: content-row1-start/content-row10-end;
  grid-column: content-col1-start/content-col12-end;
}
@media all and (max-width: 1401px) {
  #widget-configurator {
    padding-left: 10px;
  }
}
@media all and (max-width: 861px) {
  #widget-configurator {
    padding-right: 10px;
  }
}
#widget-configurator .widget-introduction-container {
  margin-bottom: 10px;
}
#widget-configurator .collapsible-item {
  margin: 0 0 20px 0;
}
#widget-configurator .widget-configurator-code textarea {
  width: 100%;
}
@media all and (min-width: 681px) {
  #widget-configurator {
    display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
    display: -webkit-flex; /* Safari 7*/
    display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
    display: -ms-flexbox; /* IE10 */
    display: -webkit-flex; /* 2012 spec prefixed for iOS7/8 */
    display: flex;
    /* Simulating 2012 flexbox model (used in IE 10) */
    /* Legacy Browsers (IE 10)*/
    -webkit-box-pack: justify;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-box-align: stretch;
    -moz-box-align: stretch;
    -ms-flex-align: stretch;
    /* Simulating 2009 flexbox model (used in Chrome < 20, Firefox < 12 and Android Stock Browser) */
    box-lines: multiple;
    -moz-box-lines: multiple;
    -webkit-box-lines: multiple;
    /* For understanding browsers */
    -webkit-flex-direction: row;
    -moz-flex-direction: row;
    -ms-flex-direction: row;
    -o-flex-direction: row;
    flex-direction: row;
    -webkit-align-items: stretch;
    -moz-align-items: stretch;
    -ms-align-items: stretch;
    -o-align-items: stretch;
    align-items: stretch;
    -webkit-flex-flow: row wrap;
    -webkit-justify-content: space-between;
    -moz-justify-content: space-between;
    -o-justify-content: space-between;
    -ms-justify-content: space-between;
    justify-content: space-between;
    flex-wrap: wrap;
    -ms-flex-wrap: wrap; /* IE 10 */
    -webkit-flex-wrap: wrap;
  }
  #widget-configurator #widget-introduction-container {
    width: 100%;
  }
  #widget-configurator #widget-configurator-data-entry {
    width: 33%;
    margin-top: 30px;
    background-color: #ffffff;
    border-top: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
    padding: 10px;
  }
  #widget-configurator #widget-configurator-data-entry > .element-actions {
    padding-top: 10px;
  }
  #widget-configurator #widget-configurator-preview-and-code {
    width: 63%;
  }
  #widget-configurator #widget-configurator-preview-and-code .widget-configurator-preview {
    min-height: 340px;
  }
}

/*# sourceMappingURL=responsive.css.map */