/* default styles for extension "tx_gomapsext" */
.tx-go-maps-ext img {
max-width: none;
}
.tx-go-maps-ext .zoomControls {
z-index: 1000;
position: absolute;
top: 30px;
left: auto;
right: 30px;
}
.tx-go-maps-ext .zoomControls ul li {
display: block;
height: 30px;
width: 30px;
margin: 1px;
padding: 0;
list-style: none;
position: relative;
}
.tx-go-maps-ext .zoomControls ul li .button {
height: 100%;
width: 100%;
line-height: 30px;
padding: 0;
margin: 0;
display: block;
cursor: pointer;
}
.tx-go-maps-ext .zoomControls ul li .button span {
text-indent: -999em;
display: block;
}
.tx-go-maps-ext .zoomControls ul li .button span:before {
content: "\2b";
font-family: "default";
font-weight: normal;
text-indent: 0;
font-style: normal;
font-size: 16px;
line-height: 30px;
position: absolute;
top: 50%;
left: 50%;
display: block;
height: 100%;
width: 100%;
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
-o-transform: translate(-50%, -50%);
-moz-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}
.tx-go-maps-ext .zoomControls ul li .button.zoomOut span:before {
content: "\23af";
}
/*** BASE ***/
/* for .unitize mixins */
/* H1 and H2 in content */
/* H2 */
/* H3 */
/* H4 */
/* H5 */
/* H6 */
/* subtitle */
/* einleitung */
/* button */
/* blockquote */
/* table */
/* tabs */
/* content */
/* page title */
/*** Form ***/
/*** Imagezoom ***/
/*** Overview / Sectioncontent ***/
/*** Header / Sidebar ***/
/*** Dot navigation ***/
/*** Grid settings ***/
/*
Unitize mixin
================================================
The unitize mixins converts values from px-units to the relative rem-units, providing all the benefits of units like em and rem, without you having to do any calculations yourself.
######Syntax:
`@property` = the property that should be unitized.
`@value` = pixel-value
`@baseValue` (optional) = default browser font-size (@remScaleFactor in most cases)
######Example Unitize mixin with custom property
`.unitize(@property, @value);`
`.unitize(font-size, 16);`
######Specific built-in functions
In addition to the general `.unitize()` mixin, Shopware contains specific mixins to quickly calculate values which (for example) have more than one property.
`.unitize-height(@value)`
`.unitize-width(@value)`
`.unitize-max-height(@value)`
`.unitize-max-width(@value)`
`.unitize-min-width(@value)`
`.unitize-padding(@topValue, @rightValue, @bottomValue: @topValue, @leftValue: @rightValue)`
`.unitize-margin(@topValue, @rightValue, @bottomValue: @topValue, @leftValue: @rightValue)`
`.unitize-variable(@value)`
*/
/*! Swipebox v1.3.0 | Constantin Saguin csag.co | MIT License | github.com/brutaldesign/swipebox */
html.swipebox-html.swipebox-touch {
overflow: hidden !important;
}
#swipebox-overlay .slide > img {
border: none !important;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
#swipebox-overlay {
width: 100%;
height: 100%;
position: fixed;
top: 0;
left: 0;
z-index: 99999 !important;
overflow: hidden;
opacity: 1;
visibility: hidden;
background: #1b222a;
}
#swipebox-container {
position: fixed;
left: 0;
top: 0;
width: 100%;
height: 100%;
opacity: 1;
}
#swipebox-slider {
-webkit-transition: transform 0.4s ease;
-moz-transition: transform 0.4s ease;
-ms-transition: transform 0.4s ease;
-o-transition: transform 0.4s ease;
transition: transform 0.4s ease;
height: 100%;
left: 0;
top: 0;
width: 100%;
white-space: nowrap;
position: absolute;
display: none;
padding: 60px 0;
}
@media (min-width: 992px) {
#swipebox-slider {
padding: 90px 0;
}
}
#swipebox-slider .slide {
height: 100%;
width: 100%;
line-height: 1px;
text-align: center;
display: inline-block;
position: relative;
}
#swipebox-slider .slide:before {
content: '';
display: inline-block;
height: 50%;
width: 1px;
margin-right: -1px;
}
#swipebox-slider .slide > img,
.swipebox-video-container,
.swipebox-inline-container,
.swipebox-iframe-container,
.swipebox-ajax-container {
display: inline-block;
max-height: 100%;
max-width: calc(100% - 20px);
margin: 0;
padding: 0;
width: auto;
height: auto;
vertical-align: middle;
}
@media (min-width: 992px) {
#swipebox-slider .slide > img,
.swipebox-video-container,
.swipebox-inline-container,
.swipebox-iframe-container,
.swipebox-ajax-container {
max-width: calc(100% - 180px);
}
}
.slide .swipebox-iframe-container,
.slide .swipebox-inline-container,
.slide .swipebox-ajax-container {
height: 100% !important;
width: calc(100% - 20px);
}
@media (min-width: 992px) {
.swipebox-iframe-container,
.swipebox-inline-container,
.swipebox-ajax-container {
width: calc(100% - 180px);
}
}
.swipebox-iframe-container iframe {
width: 100%;
height: 100%;
border: none;
}
.swipebox-inline-container,
.swipebox-ajax-container {
background: #FFF;
overflow: auto;
overflow-x: hidden;
}
.swipebox-ajax-container {
background: #ffffff;
text-align: left;
line-height: 1.5rem;
cursor: auto;
white-space: normal;
overflow: auto;
max-width: 1300px;
}
@media (min-width: 992px) {
html .swipebox-ajax-container {
overflow-y: hidden;
}
html.touch .swipebox-ajax-container {
overflow-y: auto;
}
}
.swipebox-inline-container video {
width: 100%;
height: calc(100vh - 180px);
object-fit: contain;
}
#swipebox-slider .slide > img {
-webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
-moz-box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
}
.swipebox-video-container {
background: none;
max-width: 1140px;
max-height: 100%;
width: 100%;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
.swipebox-video-container .swipebox-video {
width: 100%;
height: 0;
padding-bottom: 56.25%;
overflow: hidden;
position: relative;
}
.swipebox-video-container .swipebox-video iframe {
width: 100% !important;
height: 100% !important;
position: absolute;
top: 0;
left: 0;
}
#swipebox-bottom-bar,
#swipebox-top-bar {
-webkit-transition: 0.5s;
-moz-transition: 0.5s;
-ms-transition: 0.5s;
-o-transition: 0.5s;
transition: 0.5s;
position: absolute;
left: 0;
z-index: 999;
height: 60px;
line-height: 60px;
width: 100%;
}
@media (min-width: 992px) {
#swipebox-bottom-bar,
#swipebox-top-bar {
height: 90px;
line-height: 90px;
}
}
#swipebox-bottom-bar {
bottom: 0px;
}
#swipebox-top-bar {
top: 0px;
}
#swipebox-title {
display: block;
width: 100%;
text-align: center;
line-height: 60px;
}
@media (min-width: 992px) {
#swipebox-title {
line-height: 90px;
}
}
@media (max-width: 767px) {
#swipebox-title {
width: calc(100vw - 84px - 30px);
position: absolute;
right: 10px;
bottom: 0px;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
text-align: right;
}
}
@media (min-width: 768px) and (max-width: 991px) {
#swipebox-title {
width: calc(100vw - 84px - 30px);
position: absolute;
right: 10px;
bottom: 0px;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
text-align: right;
}
}
#swipebox-prev,
#swipebox-next,
#swipebox-close,
#swipebox-download,
#swipebox-share {
border: 1px solid #2f3c44;
background-repeat: no-repeat;
text-decoration: none !important;
cursor: pointer;
width: 40px;
height: 40px;
color: #ffffff;
line-height: 38px;
top: 0;
-webkit-transition: 0.15s ease-In;
-moz-transition: 0.15s ease-In;
-ms-transition: 0.15s ease-In;
-o-transition: 0.15s ease-In;
transition: 0.15s ease-In;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
#swipebox-close,
#swipebox-download {
background: none;
}
@media (min-width: 992px) {
#swipebox-prev,
#swipebox-next,
#swipebox-close,
#swipebox-download,
#swipebox-share {
width: 50px;
height: 50px;
line-height: 48px;
}
#swipebox-close:hover,
#swipebox-download:hover {
background: #2f3c44;
}
#swipebox-share:hover,
#swipebox-share.open {
background: #575656;
border-color: #575656;
}
}
@media (max-width: 767px) {
#swipebox-prev {
left: 10px !important;
}
}
@media (min-width: 768px) and (max-width: 991px) {
#swipebox-prev {
left: 10px !important;
}
}
#swipebox-button-container {
right: 49px;
top: 10px;
height: 40px;
position: absolute;
}
@media (min-width: 992px) {
#swipebox-button-container {
right: 69px;
height: 50px;
top: 20px;
}
}
#swipebox-button-container > * {
float: left;
}
#swipebox-share {
background: #aca194;
border-color: #aca194;
text-align: center;
color: #ffffff;
font-size: 14px;
font-family: 'default';
font-weight: normal;
text-indent: 0;
font-style: normal;
}
#swipebox-counter {
line-height: 60px;
width: 100px;
position: absolute;
top: 0;
left: 10px;
color: rgba(255, 255, 255, 0.3);
font-size: 1rem;
}
@media (min-width: 992px) {
#swipebox-counter {
line-height: 90px;
left: 50%;
margin-left: -50px;
text-align: center;
}
}
.swipebox-current {
color: #ffffff;
}
#swipebox-arrows {
display: block;
margin: 0 auto;
width: 100%;
height: 50px;
}
#swipebox-prev {
position: absolute;
left: 10px;
bottom: 10px;
top: auto;
text-align: center;
color: #ffffff;
font-size: 12px;
font-family: 'default';
font-weight: normal;
text-indent: 0;
font-style: normal;
}
#swipebox-next {
position: absolute;
left: 49px;
top: auto;
bottom: 10px;
text-align: center;
color: #ffffff;
font-size: 12px;
font-family: 'default';
font-weight: normal;
text-indent: 0;
font-style: normal;
}
.swipebox-just-one-item #swipebox-prev,
.swipebox-just-one-item #swipebox-next {
display: none;
}
@media (min-width: 992px) {
#swipebox-prev,
#swipebox-next {
border: none;
position: fixed;
font-size: 24px;
bottom: auto;
left: 0;
top: 50%;
width: 90px;
height: calc(100vh - 180px);
line-height: calc(100vh - 180px);
-webkit-transform: translateY(-50%);
-moz-transform: translateY(-50%);
-ms-transform: translateY(-50%);
-o-transform: translateY(-50%);
transform: translateY(-50%);
}
#swipebox-next {
left: auto;
right: 0px;
}
}
#swipebox-close {
top: 10px;
right: 10px;
position: absolute;
z-index: 9999;
background-position: 15px 12px;
text-align: center;
color: #ffffff;
font-size: 12px;
font-family: 'default';
font-weight: normal;
text-indent: 0;
font-style: normal;
}
@media (min-width: 992px) {
#swipebox-close {
top: 20px;
right: 20px;
}
}
.swipebox-no-close-button #swipebox-close {
display: none;
}
#swipebox-download {
text-align: center;
color: #ffffff;
font-size: 18px;
font-family: 'default';
font-weight: normal;
text-indent: 0;
font-style: normal;
}
#swipebox-prev.disabled,
#swipebox-next.disabled {
opacity: 0.3;
}
.swipebox-no-touch #swipebox-overlay.rightSpring #swipebox-slider {
-webkit-animation: rightSpring 0.3s;
animation: rightSpring 0.3s;
}
.swipebox-no-touch #swipebox-overlay.leftSpring #swipebox-slider {
-webkit-animation: leftSpring 0.3s;
animation: leftSpring 0.3s;
}
.swipebox-touch #swipebox-container:before,
.swipebox-touch #swipebox-container:after {
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
-webkit-transition: all .3s ease;
-moz-transition: all .3s ease;
-ms-transition: all .3s ease;
-o-transition: all .3s ease;
transition: all .3s ease;
content: ' ';
position: absolute;
z-index: 999;
top: 0;
height: 100%;
width: 20px;
opacity: 0;
}
.swipebox-touch #swipebox-container:before {
left: 0;
-webkit-box-shadow: inset 10px 0px 10px -8px #656565;
box-shadow: inset 10px 0px 10px -8px #656565;
}
.swipebox-touch #swipebox-container:after {
right: 0;
-webkit-box-shadow: inset -10px 0px 10px -8px #656565;
box-shadow: inset -10px 0px 10px -8px #656565;
}
.swipebox-touch #swipebox-overlay.leftSpringTouch #swipebox-container:before {
opacity: 1;
}
.swipebox-touch #swipebox-overlay.rightSpringTouch #swipebox-container:after {
opacity: 1;
}
@-webkit-keyframes rightSpring {
0% {
left: 0;
}
50% {
left: -30px;
}
100% {
left: 0;
}
}
@keyframes rightSpring {
0% {
left: 0;
}
50% {
left: -30px;
}
100% {
left: 0;
}
}
@-webkit-keyframes leftSpring {
0% {
left: 0;
}
50% {
left: 30px;
}
100% {
left: 0;
}
}
@keyframes leftSpring {
0% {
left: 0;
}
50% {
left: 30px;
}
100% {
left: 0;
}
}
@media screen and (min-width: 800px) {
#swipebox-arrows {
width: 92%;
max-width: 800px;
}
}
.share-container {
background: rgba(11, 26, 35, 0.5);
visibility: hidden;
opacity: 0;
position: absolute;
left: 50%;
-webkit-transform: translate(-50%, -100%);
-moz-transform: translate(-50%, -100%);
-ms-transform: translate(-50%, -100%);
-o-transform: translate(-50%, -100%);
transform: translate(-50%, -100%);
z-index: 100;
-webkit-transition: opacity 0.15s ease 0.3s, visibility 0s 0.45s;
-moz-transition: opacity 0.15s ease 0.3s, visibility 0s 0.45s;
-ms-transition: opacity 0.15s ease 0.3s, visibility 0s 0.45s;
-o-transition: opacity 0.15s ease 0.3s, visibility 0s 0.45s;
transition: opacity 0.15s ease 0.3s, visibility 0s 0.45s;
}
.share-container.act {
visibility: visible;
opacity: 1;
-webkit-transition: opacity 0.15s ease 0s, visibility 0s 0s;
-moz-transition: opacity 0.15s ease 0s, visibility 0s 0s;
-ms-transition: opacity 0.15s ease 0s, visibility 0s 0s;
-o-transition: opacity 0.15s ease 0s, visibility 0s 0s;
transition: opacity 0.15s ease 0s, visibility 0s 0s;
}
.share-container .share-content {
position: absolute;
left: 50%;
top: 50%;
width: 300px;
-webkit-transform: translate(-50%, -75%);
-moz-transform: translate(-50%, -75%);
-ms-transform: translate(-50%, -75%);
-o-transform: translate(-50%, -75%);
transform: translate(-50%, -75%);
opacity: 0;
-webkit-transition: 0.25s ease 0s;
-moz-transition: 0.25s ease 0s;
-ms-transition: 0.25s ease 0s;
-o-transition: 0.25s ease 0s;
transition: 0.25s ease 0s;
}
.share-container.act .share-content {
-webkit-transform: translate(-50%, -50%);
-moz-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
-o-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
opacity: 1;
-webkit-transition: 0.25s ease 0.15s;
-moz-transition: 0.25s ease 0.15s;
-ms-transition: 0.25s ease 0.15s;
-o-transition: 0.25s ease 0.15s;
transition: 0.25s ease 0.15s;
}
.share-container .title {
font-size: 1rem;
line-height: 1.2em;
letter-spacing: 2px;
font-weight: bold;
text-transform: uppercase;
color: #ffffff;
display: block;
margin-bottom: 1.5rem;
text-align: center;
}
.share-container .share-content ul,
.share-container .share-content li {
margin: 0;
padding: 0;
list-style: none;
background: none;
}
.share-container .share-content ul {
text-align: center;
font-size: 0px;
width: 300px;
display: block;
}
.share-container .share-content li {
width: 70px;
height: 70px;
background: rgba(255, 255, 255, 0.25);
display: inline-block;
margin-right: 1px;
cursor: pointer;
-webkit-transition: 0.15s ease;
-moz-transition: 0.15s ease;
-ms-transition: 0.15s ease;
-o-transition: 0.15s ease;
transition: 0.15s ease;
}
.share-container .share-content li.facebook:hover {
background: #5B74A8;
}
.share-container .share-content li.twitter:hover {
background: #1DA1F2;
}
.share-container .share-content li.googleplus:hover {
background: #DA4A38;
}
.share-container .share-content li:last-of-type {
margin-right: 0px;
}
.share-container .share-content li a {
display: block;
height: 70px;
position: relative;
text-decoration: none;
}
.share-container .share-content li a:before {
content: '\e900';
width: 70px;
height: 70px;
line-height: 70px;
text-align: center;
color: #ffffff;
font-size: 20px;
position: absolute;
left: 0;
top: 0;
font-family: 'default';
font-weight: normal;
text-indent: 0;
font-style: normal;
}
.share-container .share-content li.twitter a:before {
content: '\e906';
font-size: 27px;
}
.share-container .share-content li.googleplus a:before {
content: '\e901';
font-size: 30px;
}
.description-container {
visibility: hidden;
opacity: 0;
position: absolute;
left: 50%;
-webkit-transform: translate(-50%, -100%);
-moz-transform: translate(-50%, -100%);
-ms-transform: translate(-50%, -100%);
-o-transform: translate(-50%, -100%);
transform: translate(-50%, -100%);
z-index: 50;
-webkit-transition: opacity 0.25s ease 0.3s, visibility 0s 0.55s;
-moz-transition: opacity 0.25s ease 0.3s, visibility 0s 0.55s;
-ms-transition: opacity 0.25s ease 0.3s, visibility 0s 0.55s;
-o-transition: opacity 0.25s ease 0.3s, visibility 0s 0.55s;
transition: opacity 0.25s ease 0.3s, visibility 0s 0.55s;
white-space: normal;
line-height: 1.5em;
text-align: left;
color: #ffffff;
}
.description-container.act {
visibility: visible;
opacity: 1;
-webkit-transition: opacity 0.25s ease 1s, visibility 0s 0s;
-moz-transition: opacity 0.25s ease 1s, visibility 0s 0s;
-ms-transition: opacity 0.25s ease 1s, visibility 0s 0s;
-o-transition: opacity 0.25s ease 1s, visibility 0s 0s;
transition: opacity 0.25s ease 1s, visibility 0s 0s;
}
.description-container span {
position: absolute;
left: 0;
bottom: 0;
display: block;
padding: 1.5rem;
background: -moz-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.5) 30px);
background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.5) 30px);
background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.5) 30px);
width: 100%;
}
/* Skin
--------------------------*/
#swipebox-bottom-bar {
color: #ffffff !important;
font-size: 15px;
line-height: 43px;
}
/* Effects */
/* HugeInc Start */
#swipebox-overlay.hugeInc {
opacity: 0;
visibility: hidden;
-webkit-perspective: 1200px;
-moz-perspective: 1200px;
-ms-perspective: 1200px;
perspective: 1200px;
-webkit-transition: opacity 0.25s 0.55s, visibility 0s 0.9s;
-moz-transition: opacity 0.25s 0.55s, visibility 0s 0.9s;
-ms-transition: opacity 0.25s 0.55s, visibility 0s 0.9s;
-o-transition: opacity 0.25s 0.55s, visibility 0s 0.9s;
transition: opacity 0.25s 0.55s, visibility 0s 0.9s;
}
#swipebox-overlay.hugeInc.open {
opacity: 1;
visibility: visible;
-webkit-transition: opacity 0.25s 0s, visibility 0s 0s;
-moz-transition: opacity 0.25s 0s, visibility 0s 0s;
-ms-transition: opacity 0.25s 0s, visibility 0s 0s;
-o-transition: opacity 0.25s 0s, visibility 0s 0s;
transition: opacity 0.25s 0s, visibility 0s 0s;
}
#swipebox-overlay.hugeInc #swipebox-container {
opacity: 0;
-webkit-transform: translateY(-5%) rotateX(15deg);
-moz-transform: translateY(-5%) rotateX(15deg);
-ms-transform: translateY(-5%) rotateX(15deg);
-o-transform: translateY(-5%) rotateX(15deg);
transform: translateY(-5%) rotateX(15deg);
-webkit-transition: transform 0.3s 0s, opacity 0.3s 0s;
-moz-transition: transform 0.3s 0s, opacity 0.3s 0s;
-ms-transition: transform 0.3s 0s, opacity 0.3s 0s;
-o-transition: transform 0.3s 0s, opacity 0.3s 0s;
transition: transform 0.3s 0s, opacity 0.3s 0s;
}
#swipebox-overlay.hugeInc.open #swipebox-container {
opacity: 1;
-webkit-transform: rotateX(0deg);
-moz-transform: rotateX(0deg);
-ms-transform: rotateX(0deg);
-o-transform: rotateX(0deg);
transform: rotateX(0deg);
-webkit-transition: transform 0.3s 0.25s, opacity 0.3s 0.25s;
-moz-transition: transform 0.3s 0.25s, opacity 0.3s 0.25s;
-ms-transition: transform 0.3s 0.25s, opacity 0.3s 0.25s;
-o-transition: transform 0.3s 0.25s, opacity 0.3s 0.25s;
transition: transform 0.3s 0.25s, opacity 0.3s 0.25s;
}
#swipebox-overlay.hugeInc.close #swipebox-container {
-webkit-transform: translateY(5%) rotateX(-15deg);
-moz-transform: translateY(5%) rotateX(-15deg);
-ms-transform: translateY(5%) rotateX(-15deg);
-o-transform: translateY(5%) rotateX(-15deg);
transform: translateY(5%) rotateX(-15deg);
-webkit-transition: transform 0.3s 0.25s, opacity 0.3s 0.25s;
-moz-transition: transform 0.3s 0.25s, opacity 0.3s 0.25s;
-ms-transition: transform 0.3s 0.25s, opacity 0.3s 0.25s;
-o-transition: transform 0.3s 0.25s, opacity 0.3s 0.25s;
transition: transform 0.3s 0.25s, opacity 0.3s 0.25s;
}
#swipebox-overlay.hugeInc #swipebox-button-container,
#swipebox-overlay.hugeInc #swipebox-close,
#swipebox-overlay.hugeInc #swipebox-counter,
#swipebox-overlay.hugeInc #swipebox-title {
opacity: 0;
-webkit-transition: opacity 0.25s 0s;
-moz-transition: opacity 0.25s 0s;
-ms-transition: opacity 0.25s 0s;
-o-transition: opacity 0.25s 0s;
transition: opacity 0.25s 0s;
}
#swipebox-overlay.hugeInc.open #swipebox-button-container,
#swipebox-overlay.hugeInc.open #swipebox-close,
#swipebox-overlay.hugeInc.open #swipebox-counter,
#swipebox-overlay.hugeInc.open #swipebox-title {
opacity: 1;
-webkit-transition: opacity 0.25s 0.5s;
-moz-transition: opacity 0.25s 0.5s;
-ms-transition: opacity 0.25s 0.5s;
-o-transition: opacity 0.25s 0.5s;
transition: opacity 0.25s 0.5s;
}
#swipebox-overlay.hugeInc #swipebox-prev {
opacity: 0;
left: -90px;
-webkit-transition: 0.25s 0s;
-moz-transition: 0.25s 0s;
-ms-transition: 0.25s 0s;
-o-transition: 0.25s 0s;
transition: 0.25s 0s;
}
#swipebox-overlay.hugeInc.open #swipebox-prev {
opacity: 1;
left: 0px;
-webkit-transition: 0.25s 0.6s;
-moz-transition: 0.25s 0.6s;
-ms-transition: 0.25s 0.6s;
-o-transition: 0.25s 0.6s;
transition: 0.25s 0.6s;
}
#swipebox-overlay.hugeInc #swipebox-next {
opacity: 0;
right: -90px;
-webkit-transition: 0.25s 0s;
-moz-transition: 0.25s 0s;
-ms-transition: 0.25s 0s;
-o-transition: 0.25s 0s;
transition: 0.25s 0s;
}
#swipebox-overlay.hugeInc.open #swipebox-next {
opacity: 1;
right: 0px;
-webkit-transition: 0.25s 0.6s;
-moz-transition: 0.25s 0.6s;
-ms-transition: 0.25s 0.6s;
-o-transition: 0.25s 0.6s;
transition: 0.25s 0.6s;
}
/* HugeInc Ende */
/* Slide Down Start */
#swipebox-overlay.slideDown {
visibility: hidden;
-webkit-transform: translateY(-100%);
-moz-transform: translateY(-100%);
-ms-transform: translateY(-100%);
-o-transform: translateY(-100%);
transform: translateY(-100%);
-webkit-transition: transform 0.3s ease-in-out 0.1s, visibility 0s 0.7s;
-moz-transition: transform 0.3s ease-in-out 0.1s, visibility 0s 0.7s;
-ms-transition: transform 0.3s ease-in-out 0.1s, visibility 0s 0.7s;
-o-transition: transform 0.3s ease-in-out 0.1s, visibility 0s 0.7s;
transition: transform 0.3s ease-in-out 0.1s, visibility 0s 0.7s;
}
#swipebox-overlay.slideDown.open {
visibility: visible;
-webkit-transform: translateY(0%);
-moz-transform: translateY(0%);
-ms-transform: translateY(0%);
-o-transform: translateY(0%);
transform: translateY(0%);
-webkit-transition: transform 0.4s ease-in-out;
-moz-transition: transform 0.4s ease-in-out;
-ms-transition: transform 0.4s ease-in-out;
-o-transition: transform 0.4s ease-in-out;
transition: transform 0.4s ease-in-out;
}
#swipebox-overlay.slideDown #swipebox-container {
opacity: 0;
-webkit-transform: translateY(-100%);
-moz-transform: translateY(-100%);
-ms-transform: translateY(-100%);
-o-transform: translateY(-100%);
transform: translateY(-100%);
-webkit-transition: 0.3s ease 0.0s;
-moz-transition: 0.3s ease 0.0s;
-ms-transition: 0.3s ease 0.0s;
-o-transition: 0.3s ease 0.0s;
transition: 0.3s ease 0.0s;
}
#swipebox-overlay.slideDown.open #swipebox-container {
opacity: 1;
-webkit-transform: translateY(0%);
-moz-transform: translateY(0%);
-ms-transform: translateY(0%);
-o-transform: translateY(0%);
transform: translateY(0%);
-webkit-transition: 0.3s ease 0.3s;
-moz-transition: 0.3s ease 0.3s;
-ms-transition: 0.3s ease 0.3s;
-o-transition: 0.3s ease 0.3s;
transition: 0.3s ease 0.3s;
}
#swipebox-overlay.slideDown #swipebox-button-container,
#swipebox-overlay.slideDown #swipebox-close,
#swipebox-overlay.slideDown #swipebox-counter,
#swipebox-overlay.slideDown #swipebox-title {
opacity: 0;
-webkit-transform: translateY(-100px);
-moz-transform: translateY(-100px);
-ms-transform: translateY(-100px);
-o-transform: translateY(-100px);
transform: translateY(-100px);
-webkit-transition: 0.25s ease 0.15s;
-moz-transition: 0.25s ease 0.15s;
-ms-transition: 0.25s ease 0.15s;
-o-transition: 0.25s ease 0.15s;
transition: 0.25s ease 0.15s;
}
#swipebox-overlay.slideDown.open #swipebox-button-container,
#swipebox-overlay.slideDown.open #swipebox-close,
#swipebox-overlay.slideDown.open #swipebox-counter,
#swipebox-overlay.slideDown.open #swipebox-title {
opacity: 1;
-webkit-transform: translateY(0px);
-moz-transform: translateY(0px);
-ms-transform: translateY(0px);
-o-transform: translateY(0px);
transform: translateY(0px);
-webkit-transition: 0.25s ease 0.5s;
-moz-transition: 0.25s ease 0.5s;
-ms-transition: 0.25s ease 0.5s;
-o-transition: 0.25s ease 0.5s;
transition: 0.25s ease 0.5s;
}
#swipebox-overlay.slideDown #swipebox-prev,
#swipebox-overlay.slideDown #swipebox-next {
opacity: 0;
margin-top: -200px;
-webkit-transition: 0.25s 0s;
-moz-transition: 0.25s 0s;
-ms-transition: 0.25s 0s;
-o-transition: 0.25s 0s;
transition: 0.25s 0s;
}
#swipebox-overlay.slideDown.open #swipebox-prev,
#swipebox-overlay.slideDown.open #swipebox-next {
opacity: 1;
margin-top: 0px;
-webkit-transition: 0.25s 0.6s;
-moz-transition: 0.25s 0.6s;
-ms-transition: 0.25s 0.6s;
-o-transition: 0.25s 0.6s;
transition: 0.25s 0.6s;
}
/* Slide Down Ende */
/* Scale Start */
#swipebox-overlay.scale {
visibility: hidden;
opacity: 0;
-webkit-transform: scale(0.9);
-moz-transform: scale(0.9);
-ms-transform: scale(0.9);
-o-transform: scale(0.9);
transform: scale(0.9);
-webkit-transition: transform 0.2s, opacity 0.2s, visibility 0s 0.2s;
-moz-transition: transform 0.2s, opacity 0.2s, visibility 0s 0.2s;
-ms-transition: transform 0.2s, opacity 0.2s, visibility 0s 0.2s;
-o-transition: transform 0.2s, opacity 0.2s, visibility 0s 0.2s;
transition: transform 0.2s, opacity 0.2s, visibility 0s 0.2s;
}
#swipebox-overlay.scale.open {
visibility: visible;
opacity: 1;
-webkit-transform: scale(1);
-moz-transform: scale(1);
-ms-transform: scale(1);
-o-transform: scale(1);
transform: scale(1);
-webkit-transition: transform 0.4s, opacity 0.4s;
-moz-transition: transform 0.4s, opacity 0.4s;
-ms-transition: transform 0.4s, opacity 0.4s;
-o-transition: transform 0.4s, opacity 0.4s;
transition: transform 0.4s, opacity 0.4s;
}
/* Scale Ende */
/* Door Start */
#swipebox-overlay.door {
visibility: hidden;
width: 0.001% !important;
left: 50%;
-webkit-transform: translateX(-50%);
-moz-transform: translateX(-50%);
-ms-transform: translateX(-50%);
-o-transform: translateX(-50%);
transform: translateX(-50%);
-webkit-transition: width 0.2s 0.4s, visibility 0s 0.6s;
-moz-transition: width 0.2s 0.4s, visibility 0s 0.6s;
-ms-transition: width 0.2s 0.4s, visibility 0s 0.6s;
-o-transition: width 0.2s 0.4s, visibility 0s 0.6s;
transition: width 0.2s 0.4s, visibility 0s 0.6s;
}
#swipebox-overlay.door.open {
visibility: visible;
width: 100% !important;
-webkit-transition: width 0.2s;
-moz-transition: width 0.2s;
-ms-transition: width 0.2s;
-o-transition: width 0.2s;
transition: width 0.2s;
}
#swipebox-overlay.door #swipebox-container {
opacity: 0;
-webkit-transition: opacity 0.3s 0.2s;
-moz-transition: opacity 0.3s 0.2s;
-ms-transition: opacity 0.3s 0.2s;
-o-transition: opacity 0.3s 0.2s;
transition: opacity 0.3s 0.2s;
}
#swipebox-overlay.door.open #swipebox-container {
opacity: 1;
transition-delay: 0.3s;
}
#swipebox-overlay.door.close #swipebox-container {
-webkit-transition-delay: 0s;
-moz-transition-delay: 0s;
-ms-transition-delay: 0s;
transition-delay: 0s;
}
#swipebox-overlay.door #swipebox-prev {
opacity: 0;
left: -90px;
-webkit-transition: 0.25s 0s;
-moz-transition: 0.25s 0s;
-ms-transition: 0.25s 0s;
-o-transition: 0.25s 0s;
transition: 0.25s 0s;
}
#swipebox-overlay.door.open #swipebox-prev {
opacity: 1;
left: 0px;
-webkit-transition: 0.25s 0.5s;
-moz-transition: 0.25s 0.5s;
-ms-transition: 0.25s 0.5s;
-o-transition: 0.25s 0.5s;
transition: 0.25s 0.5s;
}
#swipebox-overlay.door #swipebox-next {
opacity: 0;
right: -90px;
-webkit-transition: 0.25s 0s;
-moz-transition: 0.25s 0s;
-ms-transition: 0.25s 0s;
-o-transition: 0.25s 0s;
transition: 0.25s 0s;
}
#swipebox-overlay.door.open #swipebox-next {
opacity: 1;
right: 0px;
-webkit-transition: 0.25s 0.5s;
-moz-transition: 0.25s 0.5s;
-ms-transition: 0.25s 0.5s;
-o-transition: 0.25s 0.5s;
transition: 0.25s 0.5s;
}
/* Door Ende */
/* Simple Genie Start */
#swipebox-overlay.simpleGenie {
visibility: hidden;
-webkit-transform: translateY(60%) scale(0);
-moz-transform: translateY(60%) scale(0);
-ms-transform: translateY(60%) scale(0);
-o-transform: translateY(60%) scale(0);
transform: translateY(60%) scale(0);
-webkit-transition: transform 0.4s, visibility 0s 0.4s;
-moz-transition: transform 0.4s, visibility 0s 0.4s;
-ms-transition: transform 0.4s, visibility 0s 0.4s;
-o-transition: transform 0.4s, visibility 0s 0.4s;
transition: transform 0.4s, visibility 0s 0.4s;
}
#swipebox-overlay.simpleGenie.open {
visibility: visible;
-webkit-transform: translateY(0%) scale(1);
-moz-transform: translateY(0%) scale(1);
-ms-transform: translateY(0%) scale(1);
-o-transform: translateY(0%) scale(1);
transform: translateY(0%) scale(1);
-webkit-transition: transform 0.4s;
-moz-transition: transform 0.4s;
-ms-transition: transform 0.4s;
-o-transition: transform 0.4s;
transition: transform 0.4s;
}
/* Simple Genie Ende */
/* Content Scale Start */
/* Content Scale Ende */
a.ajax {
position: relative;
display: inline-block;
}
a.ajax span.image_zoom {
position: absolute;
right: 0;
bottom: 0;
width: 32px;
height: 32px;
display: block;
overflow: hidden;
text-indent: -99999em;
}
.f3-widget-paginator {
width: 100%;
position: relative;
text-align: center;
clear:both;
padding-top:2rem;
}
.f3-widget-paginator li {
display: inline-block;
list-style: none;
}
option.notPossible {
color: #cccccc;
}
.itemCount {
margin-bottom:2rem;
}
.item {
margin-bottom:20px;
}
.item a {
display:block;
background:#f5f5f5;
text-decoration:none;
color:#000;
}
.item h3 {
margin:0;
padding:20px;
}
/* default styles for extension "share_count" */
@font-face {
font-family: 'sharecount';
src: url('/typo3conf/ext/share_count/Resources/Public/fonts/sharecount.eot?99rj2o');
src: url('/typo3conf/ext/share_count/Resources/Public/fonts/sharecount.eot?99rj2o#iefix') format('embedded-opentype'),
url('/typo3conf/ext/share_count/Resources/Public/fonts/sharecount.ttf?99rj2o') format('truetype'),
url('/typo3conf/ext/share_count/Resources/Public/fonts/sharecount.woff?99rj2o') format('woff'),
url('/typo3conf/ext/share_count/Resources/Public/fonts/sharecount.svg?99rj2o#sharecount') format('svg');
font-weight: normal;
font-style: normal;
}
.tx-share-count li i {
/* use !important to prevent issues with browser extensions that change fonts */
font-family: 'sharecount' !important;
speak: none;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;
/* Better Font Rendering =========== */
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.sharecounticon.whatsapp:before {
content: "\e907";
}
.sharecounticon.facebook:before {
content: "\e900";
}
.sharecounticon.googleplus:before {
content: "\e901";
}
.sharecounticon.linkedin:before {
content: "\e902";
}
.sharecounticon.pinterest:before {
content: "\e903";
}
.sharecounticon.reddit:before {
content: "\e904";
}
.sharecounticon.stumbleupon:before {
content: "\e905";
}
.sharecounticon.twitter:before {
content: "\e906";
}
.tx-share-count ul {
text-align: right;
}
.tx-share-count li {
display: inline-block;
padding: 0;
margin: 0;
background: #CCCCCC;
margin-left: 1px;
line-height: 40px;
height: 40px;
width: 40px;
overflow: hidden;
text-align: center;
}
*:first-child+html .tx-share-count li {
display: inline;
}
.tx-share-count li a {
text-decoration: none;
color: #FFFFFF;
font-weight: normal;
font-style: normal;
display: block;
}
.tx-share-count li a .count {
display: none;
}
.tx-share-count li.total a .count {
display: block;
}
.tx-share-count li i {
color: #ffffff;
line-height: 40px;
font-size: 25px;
vertical-align: middle;
margin: 0;
}
li.facebook,
li.facebook:hover {
background-color: #5B74A8;
}
li.twitter,
li.twitter:hover {
background-color: #019AD2;
}
li.googleplus,
li.googleplus:hover {
background-color: #DA4A38;
}
li.reddit,
li.reddit:hover {
background-color: #8ab9e1;
}
li.stumbleupon,
li.stumbleupon:hover {
background-color: #EB4923;
}
li.pinterest,
li.pinterest:hover {
background-color: #CC2127;
}
li.linkedin,
li.linkedin:hover {
background-color: #0077B5;
}
li.whatsapp,
li.whatsapp:hover {
background-color: #25D366;
}
@media print {
.tx-share-count { display: none; }
}
/*** BASE ***/
/* for .unitize mixins */
/* H1 and H2 in content */
/* H2 */
/* H3 */
/* H4 */
/* H5 */
/* H6 */
/* subtitle */
/* einleitung */
/* button */
/* blockquote */
/* table */
/* tabs */
/* content */
/* page title */
/*** Form ***/
/*** Imagezoom ***/
/*** Overview / Sectioncontent ***/
/*** Header / Sidebar ***/
/*** Dot navigation ***/
/*** Grid settings ***/
/*! Flickity v2.1.2
https://flickity.metafizzy.co
---------------------------------------------- */
.flickity-enabled {
position: relative;
}
.flickity-enabled:focus {
outline: none;
}
.flickity-viewport {
overflow: hidden;
position: relative;
height: 100%;
}
.flickity-slider {
position: absolute;
width: 100%;
height: 100%;
}
/* draggable */
.flickity-enabled.is-draggable {
-webkit-tap-highlight-color: transparent;
tap-highlight-color: transparent;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
.flickity-enabled.is-draggable .flickity-viewport {
cursor: move;
cursor: -webkit-grab;
cursor: grab;
}
.flickity-enabled.is-draggable .flickity-viewport.is-pointer-down {
cursor: -webkit-grabbing;
cursor: grabbing;
}
/* ---- flickity-button ---- */
.flickity-button {
position: absolute;
background: rgba(255, 255, 255, 0.75);
border: none;
color: #333;
}
.flickity-button:hover {
background: white;
cursor: pointer;
}
.flickity-button:focus {
outline: none;
box-shadow: 0 0 0 5px #19F;
}
.flickity-button:active {
opacity: 0.6;
}
.flickity-button:disabled {
opacity: 0.3;
cursor: auto;
/* prevent disabled button from capturing pointer up event. #716 */
pointer-events: none;
}
.flickity-button-icon {
fill: #333;
}
/* ---- previous/next buttons ---- */
.flickity-prev-next-button {
top: 50%;
width: 44px;
height: 44px;
border-radius: 50%;
/* vertically center */
transform: translateY(-50%);
}
.flickity-prev-next-button.previous {
left: 10px;
}
.flickity-prev-next-button.next {
right: 10px;
}
/* right to left */
.flickity-rtl .flickity-prev-next-button.previous {
left: auto;
right: 10px;
}
.flickity-rtl .flickity-prev-next-button.next {
right: auto;
left: 10px;
}
.flickity-prev-next-button .flickity-button-icon {
position: absolute;
left: 20%;
top: 20%;
width: 60%;
height: 60%;
}
/* ---- page dots ---- */
.flickity-page-dots {
position: absolute;
width: 100%;
bottom: -25px;
padding: 0;
margin: 0;
list-style: none;
text-align: center;
line-height: 1;
}
.flickity-rtl .flickity-page-dots {
direction: rtl;
}
.flickity-page-dots .dot {
display: inline-block;
width: 10px;
height: 10px;
margin: 0 8px;
background: #333;
border-radius: 50%;
opacity: 0.25;
cursor: pointer;
}
.flickity-page-dots .dot.is-selected {
opacity: 1;
}
/*
Unitize mixin
================================================
The unitize mixins converts values from px-units to the relative rem-units, providing all the benefits of units like em and rem, without you having to do any calculations yourself.
######Syntax:
`@property` = the property that should be unitized.
`@value` = pixel-value
`@baseValue` (optional) = default browser font-size (@remScaleFactor in most cases)
######Example Unitize mixin with custom property
`.unitize(@property, @value);`
`.unitize(font-size, 16);`
######Specific built-in functions
In addition to the general `.unitize()` mixin, Shopware contains specific mixins to quickly calculate values which (for example) have more than one property.
`.unitize-height(@value)`
`.unitize-width(@value)`
`.unitize-max-height(@value)`
`.unitize-max-width(@value)`
`.unitize-min-width(@value)`
`.unitize-padding(@topValue, @rightValue, @bottomValue: @topValue, @leftValue: @rightValue)`
`.unitize-margin(@topValue, @rightValue, @bottomValue: @topValue, @leftValue: @rightValue)`
`.unitize-variable(@value)`
*/
/*
* Just plain typography no specific stuff should be done here
* initial formatting is based on bugfixes done by normalize.css
*/
/*! normalize.css v3.0.1 | MIT License | git.io/normalize */
html {
font-family: sans-serif;
-ms-text-size-adjust: 100%;
-webkit-text-size-adjust: 100%;
}
body {
margin: 0;
}
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
nav,
section,
summary {
display: block;
}
audio,
canvas,
progress,
video {
display: inline-block;
vertical-align: baseline;
}
audio:not([controls]) {
display: none;
height: 0;
}
[hidden],
template {
display: none;
}
a {
background: transparent;
}
a:active,
a:hover {
outline: 0;
}
abbr[title] {
border-bottom: 1px dotted;
}
b,
strong {
font-weight: bold;
}
dfn {
font-style: italic;
}
h1 {
font-size: 2em;
margin: 0.67em 0;
}
mark {
background: #ff0;
color: #000;
}
small {
font-size: 80%;
}
sub,
sup {
font-size: 75%;
line-height: 0;
position: relative;
vertical-align: baseline;
}
sup {
top: -0.5em;
}
sub {
bottom: -0.25em;
}
img {
border: 0;
}
svg:not(:root) {
overflow: hidden;
}
figure {
margin: 1em 40px;
}
hr {
-moz-box-sizing: content-box;
box-sizing: content-box;
height: 0;
}
pre {
overflow: auto;
}
code,
kbd,
pre,
samp {
font-family: monospace,monospace;
font-size: 1em;
}
button,
input,
optgroup,
select,
textarea {
color: inherit;
font: inherit;
margin: 0;
}
button {
overflow: visible;
}
button,
select {
text-transform: none;
}
button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
-webkit-appearance: button;
cursor: pointer;
}
button[disabled],
html input[disabled] {
cursor: default;
}
button::-moz-focus-inner,
input::-moz-focus-inner {
border: 0;
padding: 0;
}
input {
line-height: normal;
}
input[type="checkbox"],
input[type="radio"] {
box-sizing: border-box;
padding: 0;
}
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
height: auto;
}
input[type="search"] {
-webkit-appearance: textfield;
-moz-box-sizing: content-box;
-webkit-box-sizing: content-box;
box-sizing: content-box;
}
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
-webkit-appearance: none;
}
fieldset {
border: 1px solid #c0c0c0;
margin: 0 2px;
padding: 0.35em 0.625em 0.75em;
}
legend {
border: 0;
padding: 0;
}
textarea {
overflow: auto;
}
optgroup {
font-weight: bold;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
td,
th {
padding: 0;
}
@font-face {
font-family: 'Noto Serif';
font-style: normal;
font-weight: 600;
font-display: swap;
src: url('../../..//fileadmin/template/Resources/Public/font/NotoSerif-SemiBold.woff2?v2') format('woff2');
}
@font-face {
font-family: 'Roboto Slab';
font-style: normal;
font-weight: 300;
font-display: swap;
src: url('../../..//fileadmin/template/Resources/Public/font/RobotoSlab-Light.woff2?v2') format('woff2');
}
@font-face {
font-family: 'Poppins';
font-style: normal;
font-weight: 300;
font-display: swap;
src: url('../../..//fileadmin/template/Resources/Public/font/Poppins-Light.woff2?v2') format('woff2');
}
@font-face {
font-family: 'Poppins';
font-style: italic;
font-weight: 300;
font-display: swap;
src: url('../../..//fileadmin/template/Resources/Public/font/Poppins-LightItalic.woff2?v2');
}
@font-face {
font-family: 'Poppins';
font-style: normal;
font-weight: 600;
font-display: swap;
src: url('../../..//fileadmin/template/Resources/Public/font/Poppins-SemiBold.woff2?v2') format('woff2');
}
@font-face {
font-family: 'Poppins';
font-style: italic;
font-weight: 600;
font-display: swap;
src: url('../../..//fileadmin/template/Resources/Public/font/Poppins-SemiBoldItalic.woff2?v2') format('woff2');
}
@font-face {
font-family: 'default';
font-weight: normal;
font-style: normal;
font-display: swap;
src: url('../../..//fileadmin/template/Resources/Public/font/default.woff2') format('woff2'), url('../../..//fileadmin/template/Resources/Public/font/default.woff') format('woff');
}
/*
.icon-plus:before {
content:"../../../typo3temp/DynCss/"\2b";
}
.icon-left_arrow:before {
content:"../../../typo3temp/DynCss/"\2c2";
}
.icon-right_arrow:before {
content:"../../../typo3temp/DynCss/"\2c3";
}
.icon-left_double_arrow:before {
content:"../../../typo3temp/DynCss/"\2190";
}
.icon-up_double_arrow:before {
content:"../../../typo3temp/DynCss/"\2191";
}
.icon-right_double_arrow:before {
content:"../../../typo3temp/DynCss/"\2192";
}
.icon-down_double_arrow:before {
content:"../../../typo3temp/DynCss/"\2193";
}
.icon-navigation:before {
content:"../../../typo3temp/DynCss/"\2261";
}
.icon-home:before {
content:"../../../typo3temp/DynCss/"\2302";
}
.icon-up_arrow:before {
content:"../../../typo3temp/DynCss/"\2303";
}
.icon-down_arrow:before {
content:"../../../typo3temp/DynCss/"\2304";
}
.icon-minus:before {
content:"../../../typo3temp/DynCss/"\23af";
}
.icon-phone:before {
content:"../../../typo3temp/DynCss/"\2706";
}
.icon-mail:before {
content:"../../../typo3temp/DynCss/"\2709";
}
.icon-facebook:before {
content:"../../../typo3temp/DynCss/"\e900";
}
.icon-googleplus:before {
content:"../../../typo3temp/DynCss/"\e901";
}
.icon-linkedin:before {
content:"../../../typo3temp/DynCss/"\e902";
}
.icon-pinterest:before {
content:"../../../typo3temp/DynCss/"\e903";
}
.icon-reddit:before {
content:"../../../typo3temp/DynCss/"\e904";
}
.icon-stumbleupon:before {
content:"../../../typo3temp/DynCss/"\e905";
}
.icon-twitter:before {
content:"../../../typo3temp/DynCss/"\e906";
}
.icon-whatsapp:before {
content:"../../../typo3temp/DynCss/"\e907";
}
.icon-instagram:before {
content:"../../../typo3temp/DynCss/"\e908";
}
.icon-rss:before {
content:"../../../typo3temp/DynCss/"\e909";
}
.icon-booking:before {
content:"../../../typo3temp/DynCss/"\e90a";
}
.icon-close:before {
content:"../../../typo3temp/DynCss/"\e90b";
}
.icon-youtube:before {
content:"../../../typo3temp/DynCss/"\e90c";
}
.icon-blog:before {
content:"../../../typo3temp/DynCss/"\e90d";
}
.icon-skype:before {
content:"../../../typo3temp/DynCss/"\e90e";
}
.icon-share:before {
content:"../../../typo3temp/DynCss/"\e90f";
}
.icon-pointer:before {
content:"../../../typo3temp/DynCss/"\e910";
}
.icon-pdf:before {
content:"../../../typo3temp/DynCss/"\e911";
}
.icon-like:before {
content:"../../../typo3temp/DynCss/"\e912";
}
.icon-time:before {
content:"../../../typo3temp/DynCss/"\e913";
}
.icon-copy:before {
content:"../../../typo3temp/DynCss/"\e914";
}
.icon-left_down_arrow:before {
content:"../../../typo3temp/DynCss/"\e915";
}
.icon-right_down_arrow:before {
content:"../../../typo3temp/DynCss/"\e916";
}
.icon-left_up_arrow:before {
content:"../../../typo3temp/DynCss/"\e917";
}
.icon-right_up_arrow:before {
content:"../../../typo3temp/DynCss/"\e918";
}
.icon-question_mark:before {
content:"../../../typo3temp/DynCss/"\e919";
}
.icon-quote:before {
content:"../../../typo3temp/DynCss/"\e91a";
}
.icon-download:before {
content:"../../../typo3temp/DynCss/"\e91b";
}
.icon-fullscreen:before {
content:"../../../typo3temp/DynCss/"\e91c";
}
.icon-pause:before {
content:"../../../typo3temp/DynCss/"\e91d";
}
.icon-play:before {
content:"../../../typo3temp/DynCss/"\e91e";
}
.icon-mZ:before {
content:"../../../typo3temp/DynCss/"\e91f";
}
.icon-download-catalog:before {
content:"../../../typo3temp/DynCss/"\e920";
}
.icon-download-excel:before {
content:"../../../typo3temp/DynCss/"\e921";
}
.icon-download-img:before {
content:"../../../typo3temp/DynCss/"\e922";
}
.icon-download-pdf:before {
content:"../../../typo3temp/DynCss/"\e923";
}
.icon-download-unknown:before {
content:"../../../typo3temp/DynCss/"\e924";
}
.icon-download-word:before {
content:"../../../typo3temp/DynCss/"\e925";
}
.icon-download-zip:before {
content:"../../../typo3temp/DynCss/"\e926";
}
.icon-person1:before {
content:"../../../typo3temp/DynCss/"\e927";
}
.icon-person2:before {
content:"../../../typo3temp/DynCss/"\e928";
}
.icon-person3:before {
content:"../../../typo3temp/DynCss/"\e929";
}
.icon-language:before {
content:"../../../typo3temp/DynCss/"\1f30d";
}
.icon-globe:before {
content:"../../../typo3temp/DynCss/"\1f30e";
}
.icon-grid:before {
content:"../../../typo3temp/DynCss/"\1f4c5";
}
.icon-voucher:before {
content:"../../../typo3temp/DynCss/"\1f4e6";
}
.icon-foto:before {
content:"../../../typo3temp/DynCss/"\1f4f7";
}
.icon-search:before {
content:"../../../typo3temp/DynCss/"\1f50d";
}
.icon-pin:before {
content:"../../../typo3temp/DynCss/"\1f588";
}
.icon-print:before {
content:"../../../typo3temp/DynCss/"\1f5a8";
}
.icon-fax:before {
content:"../../../typo3temp/DynCss/"\1f5b7";
}
.icon-bookmark:before {
content:"../../../typo3temp/DynCss/"\1f5d2";
}
.icon-checkmark:before {
content:"../../../typo3temp/DynCss/"\1f5f8";
}
.icon-notice:before {
content:"../../../typo3temp/DynCss/"\1f6c8";
}
.icon-cart:before {
content:"../../../typo3temp/DynCss/"\1f6d2";
}
*/
html {
font-size: 16px;
}
body {
font-family: 'Poppins', sans-serif;
font-weight: 300;
color: #393939;
line-height: 1.75;
font-size: 16px;
font-size: 1rem;
}
header,
footer {
margin-bottom: 1.5rem;
}
.align-left {
text-align: left;
}
.align-right {
text-align: right;
}
.align-center {
text-align: center;
}
.align-justify {
text-align: justify;
}
::-moz-selection {
background: #575656;
color: #fff;
}
::selection {
background: #575656;
color: #fff;
}
h1,
.h1 {
margin: 0;
padding: 0;
line-height: 1.2em;
color: #575656;
font-family: 'Noto Serif', serif;
font-weight: 600;
text-align: center;
text-transform: none;
font-size: 32px;
font-size: 2rem;
display: block;
}
@media (min-width: 768px) {
h1,
.h1 {
font-size: 32px;
font-size: 2rem;
}
}
@media (min-width: 992px) {
h1,
.h1 {
font-size: 48px;
font-size: 3rem;
}
}
@media (min-width: 1302px) {
h1,
.h1 {
font-size: 48px;
font-size: 3rem;
}
}
h2,
.h2 {
font-size: 28px;
font-size: 1.75rem;
color: #575656;
font-family: 'Noto Serif', serif;
margin: 0px 0px 10px 0px;
margin: 0rem 0rem 0.625rem 0rem;
font-weight: 600;
line-height: 1.2em;
display: block;
}
@media (min-width: 768px) {
h2,
.h2 {
font-size: 28px;
font-size: 1.75rem;
}
}
@media (min-width: 992px) {
h2,
.h2 {
font-size: 32px;
font-size: 2rem;
}
}
@media (min-width: 1302px) {
h2,
.h2 {
font-size: 32px;
font-size: 2rem;
}
}
h3,
.h3 {
font-size: 20px;
font-size: 1.25rem;
margin: 0 0 1.5em 0;
color: #393939;
font-family: 'Noto Serif', serif;
font-weight: 600;
}
@media (min-width: 768px) {
h3,
.h3 {
font-size: 20px;
font-size: 1.25rem;
}
}
@media (min-width: 992px) {
h3,
.h3 {
font-size: 24px;
font-size: 1.5rem;
}
}
@media (min-width: 1302px) {
h3,
.h3 {
font-size: 24px;
font-size: 1.5rem;
}
}
h4,
.h4 {
font-size: 20px;
font-size: 1.25rem;
margin: 0;
color: #393939;
font-family: 'Noto Serif', serif;
font-weight: 600;
}
@media (min-width: 768px) {
h4,
.h4 {
font-size: 20px;
font-size: 1.25rem;
}
}
@media (min-width: 992px) {
h4,
.h4 {
font-size: 20px;
font-size: 1.25rem;
}
}
@media (min-width: 1302px) {
h4,
.h4 {
font-size: 20px;
font-size: 1.25rem;
}
}
h5,
.h5 {
font-size: 18px;
font-size: 1.125rem;
margin: 0 0 1.5em 0;
color: #393939;
font-family: 'Noto Serif', serif;
font-weight: 600;
}
@media (min-width: 768px) {
h5,
.h5 {
font-size: 18px;
font-size: 1.125rem;
}
}
@media (min-width: 992px) {
h5,
.h5 {
font-size: 18px;
font-size: 1.125rem;
}
}
@media (min-width: 1302px) {
h5,
.h5 {
font-size: 18px;
font-size: 1.125rem;
}
}
h6 {
font-size: 16px;
font-size: 1rem;
margin: 0 0 1.5em 0;
color: #393939;
font-family: 'Noto Serif', serif;
font-weight: 600;
}
@media (min-width: 768px) {
h6 {
font-size: 16px;
font-size: 1rem;
}
}
@media (min-width: 992px) {
h6 {
font-size: 16px;
font-size: 1rem;
}
}
@media (min-width: 1302px) {
h6 {
font-size: 16px;
font-size: 1rem;
}
}
h6 {
margin: 0;
}
p.subtitle {
color: #575656;
font-family: 'Poppins', sans-serif;
font-weight: 300;
margin-bottom: 0;
position: relative;
font-size: 16px;
font-size: 1rem;
}
@media (min-width: 768px) {
p.subtitle {
font-size: 16px;
font-size: 1rem;
}
}
@media (min-width: 992px) {
p.subtitle {
font-size: 16px;
font-size: 1rem;
}
}
@media (min-width: 1302px) {
p.subtitle {
font-size: 16px;
font-size: 1rem;
}
}
header#title p.subtitle,
header.title p.subtitle {
text-align: center;
}
section.einleitung .ce-textpic {
font-size: 16px;
font-size: 1rem;
color: #575656;
font-family: 'Roboto Slab', serif;
font-weight: 300;
text-align: center;
}
@media (min-width: 768px) {
section.einleitung .ce-textpic {
font-size: 16px;
font-size: 1rem;
}
}
@media (min-width: 992px) {
section.einleitung .ce-textpic {
font-size: 16px;
font-size: 1rem;
}
}
@media (min-width: 1302px) {
section.einleitung .ce-textpic {
font-size: 16px;
font-size: 1rem;
}
}
section.initial .ce-textpic > p:first-of-type::first-letter {
font-family: 'Noto Serif', serif;
font-size: 3.5rem;
line-height: 0.5;
float: left;
padding-top: 0.8rem;
padding-right: 0.5rem;
font-weight: 600;
}
ul,
ol,
p {
margin: 0 0 1.5em 0;
}
a {
color: #575656;
}
a[href^="mailto"] {
white-space: nowrap;
}
nav ul {
list-style: none;
}
div.ce-textpic .ce-gallery figure,
div.ce-textpic figure.ce-gallery {
position: relative;
}
figcaption {
font-size: 1rem;
padding: 0 1em;
font-style: italic;
color: #ffffff;
position: absolute;
left: 0px;
bottom: 5px;
}
/************ BUTTONS START ************/
.button {
width: auto;
margin: 0 0 0.625em 0;
padding: 0 20px;
border: none;
font-weight: 400;
text-decoration: none;
text-align: center;
display: inline-block;
-webkit-transition: 0.25s ease;
-moz-transition: 0.25s ease;
-ms-transition: 0.25s ease;
-o-transition: 0.25s ease;
transition: 0.25s ease;
font-size: 16px;
font-size: 1rem;
line-height: 2.75em;
color: #ffffff;
background: #575656;
margin: 0 0.625em 0 0;
}
@media (min-width: 768px) {
.button {
font-size: 16px;
font-size: 1rem;
line-height: 2.75em;
height: 2.75em;
width: auto;
padding: 0 1.625em;
}
}
@media (min-width: 992px) {
.button {
font-size: 16px;
font-size: 1rem;
line-height: 2.75em;
height: 2.75em;
}
}
@media (min-width: 1302px) {
.button {
font-size: 16px;
font-size: 1rem;
line-height: 2.75em;
height: 2.75em;
}
}
.button:hover {
-webkit-opacity: 0.8;
-moz-opacity: 0.8;
opacity: 0.8;
}
.button.sec {
background-color: #db3d53;
color: #ffffff;
}
/************ BUTTONS ENDE ************/
/************ QUOTE START ************/
blockquote {
padding: 80px 50px;
font-size: 1.25rem;
line-height: 1.5em;
position: relative;
text-align: left;
font-family: 'Glegoo', serif;
font-weight: 400;
color: #aca194;
margin: 0;
border: 1px solid #aca194;
margin: 0 40px;
}
@media (min-width: 768px) {
blockquote {
font-size: 1.25rem;
line-height: 1.5em;
position: relative;
text-align: left;
}
}
blockquote:before {
font-family: 'default';
font-weight: normal;
text-indent: 0;
font-style: normal;
content: '\e91a';
position: absolute;
top: 50%;
-webkit-transform: translateY(-50%);
-moz-transform: translateY(-50%);
-ms-transform: translateY(-50%);
-o-transform: translateY(-50%);
transform: translateY(-50%);
left: -10px;
font-size: 20px;
height: 20px;
width: 20px;
line-height: 20px;
color: #aca194;
padding: 10px 0;
z-index: 5;
}
@media (min-width: 768px) {
blockquote:before {
font-size: 40px;
height: 40px;
width: 40px;
line-height: 40px;
left: -20px;
}
}
blockquote:after {
content: '';
position: absolute;
top: 50%;
left: -2px;
-webkit-transform: translateY(-50%);
-moz-transform: translateY(-50%);
-ms-transform: translateY(-50%);
-o-transform: translateY(-50%);
transform: translateY(-50%);
width: 3px;
height: 40px;
display: block;
overflow: hidden;
background: #F1F1F1;
z-index: 1;
}
blockquote p {
margin: 0;
}
blockquote footer {
font-size: 0.8125rem;
font-family: 'Roboto', sans-serif;
font-weight: 300;
color: rgba(172, 161, 148, 0.5);
text-align: right;
margin-right: 0rem;
font-style: normal;
position: absolute;
right: 30px;
bottom: 0px;
}
blockquote footer:before {
content: '-';
margin-right: 1ex;
}
blockquote footer:after {
content: '-';
margin-left: 1ex;
}
/*
blockquote:lang(en) {
quotes: ~"\201C""\201D""\2018""\2019";
}
blockquote:before {
display: inline-block;
}
blockquote:after {
display: inline-block;
}
blockquote > * {
display: inline-block;
}
q, blockquote {
quotes: '\2018' '\2019' '\201C' '\201D';
}
q:before, blockquote:before {
content: open-quote;
}
q:after, blockquote:after {
content: close-quote;
}
:lang(de) q, :lang(de) blockquote,
:lang(ga) q, :lang(ga) blockquote,
:lang(cs) q, :lang(cs) blockquote,
:lang(sk) q, :lang(sk) blockquote,
:lang(bg) q, :lang(bg) blockquote,
:lang(sl) q, :lang(sl) blockquote {
quotes: '\201E' '\201C' '\201A' '\2018';
}
:lang(en) q, :lang(en) blockquote,
:lang(en-gb) q, :lang(en-gb) blockquote {
quotes: '\2018' '\2019' '\201C' '\201D';
}
:lang(en-us) q, :lang(en-us) blockquote,
:lang(zh) q, :lang(zh) blockquote,
:lang(tr) q, :lang(tr) blockquote,
:lang(nl) q, :lang(nl) blockquote,
:lang(ga) q, :lang(ga) blockquote {
quotes: '\201C' '\201D' '\2018' '\2019';
}
:lang(es) q, :lang(es) blockquote,
:lang(fr) q, :lang(fr) blockquote {
quotes: '\00AB' '\00BB' '\2039' '\203A';
}
:lang(it) q, :lang(it) blockquote {
quotes: '\00AB' '\00BB' '\00AB' '\00BB';
}
:lang(pl) q, :lang(pl) blockquote {
quotes: '\201E' '\201D' '\00AB' '\00BB';
}
:lang(ru) q, :lang(ru) blockquote,
:lang(ca) q, :lang(ca) blockquote,
:lang(uk) q, :lang(uk) blockquote {
quotes: '\00AB' '\00BB' '\201E' '\201C';
}
:lang(sv) q, :lang(sv) blockquote {
quotes: '\201D' '\201D' '\2019' '\2019';
}
:lang(hu) q, :lang(hu) blockquote,
:lang(hr) q, :lang(hr) blockquote {
quotes: '\201E' '\201D' '\201E' '\201D';
}
:lang(el) q, :lang(el) blockquote,
:lang(pt) q, :lang(pt) blockquote {
quotes: '\00AB' '\00BB' '\201C' '\201D';
}
*/
/************ QUOTE ENDE ************/
/************ TABLE START ************/
@media (max-width: 767px) {
.table-container.scroll {
width: 100%;
overflow-x: scroll !important;
}
}
table {
padding: 0;
margin: 0 0 1.5em 0;
border-collapse: collapse;
width: 99.99%;
color: #1F1F1F;
}
caption {
caption-side: bottom;
font-size: .75rem;
text-align: right;
}
th,
td {
text-align: center;
margin: 0;
padding: .5rem;
}
thead th {
border: 1px solid rgba(172, 161, 148, 0.25);
background: rgba(172, 161, 148, 0.25);
color: #000;
letter-spacing: 1px;
text-transform: uppercase;
text-align: center;
font-family: 'Glegoo', serif;
}
table {
position: relative;
}
@media (min-width: 768px) {
table {
table-layout: fixed;
}
}
td,
th {
background: #FFFFFF;
border: 1px solid rgba(172, 161, 148, 0.25);
}
thead td {
background: #FFFFFF;
}
tbody th {
text-align: left;
font-size: 13px;
font-size: 0.8125rem;
letter-spacing: 1px;
text-transform: uppercase;
color: #646463;
padding-left: 1.5rem;
}
.skd-widget th,
.skd-widget td {
background: none;
height: auto;
}
table.plain {
padding: 0;
margin: 0;
border: 0;
}
table.plain th,
table.plain td {
text-align: left;
margin: 0;
padding: 0;
border: 0;
background: none;
}
.table-container {
width: calc(100% - 1px);
overflow: hidden;
margin: 0 0 1.5em;
position: relative;
}
.table-container.scroll {
width: 100%;
overflow-y: auto;
_overflow: auto;
margin: 0 0 1.5em;
}
.table-container table {
margin-bottom: 0;
font-size: 1em;
}
.table-container > table.switchable {
position: relative;
z-index: 0;
}
.table-container > table.switchable tr > th:first-child,
.table-container > table.switchable tr > td:first-child {
position: absolute;
left: 0;
max-width: 50%;
z-index: 1000;
}
.table-container > table.switchable tr > th,
.table-container > table.switchable tr > td {
position: relative;
max-width: 50%;
display: block;
float: left;
border-bottom-width: 0;
border-left-width: 0;
width: 50%;
}
@media (min-width: 992px) {
.table-container > table.switchable tr > th,
.table-container > table.switchable tr > td {
width: 33.3333%;
}
}
.table-container > table.switchable tr > td,
.table-container > table.switchable tr > th {
-webkit-transition: left 0.5s ease-in-out;
-moz-transition: left 0.5s ease-in-out;
-o-transition: left 0.5s ease-in-out;
transition: left 0.5s ease-in-out;
}
.table-container .controls .prev,
.table-container .controls .next {
position: absolute;
width: 30px;
height: 53px;
top: 82px;
background: #aca194;
z-index: 1000;
text-decoration: none;
text-indent: -19999px;
cursor: pointer;
}
.table-container .controls .prev {
left: 50%;
margin-left: -31px;
}
.table-container .controls .next {
left: 50%;
}
.table-container .controls .prev:before,
.table-container .controls .next:before {
top: 50%;
font-family: 'default';
font-weight: normal;
text-indent: 0;
font-style: normal;
font-size: 1.5rem;
height: 25px;
left: 50%;
line-height: 100%;
position: absolute;
width: 20px;
z-index: 10;
background: none;
border-radius: 0;
-webkit-transform: translate(-50%, -50%);
-moz-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
-o-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
transition: 0.25s ease;
color: #ffffff;
}
.table-container .controls .prev:before {
content: '\2c2';
margin-left: -2px;
}
.table-container .controls .next:before {
content: '\2c3';
}
/************ TABLE ENDE ************/
/************ PAGINATION START ************/
.control {
clear: both;
display: block;
margin-bottom: 1.5rem;
-webkit-perspective: 1px;
-moz-perspective: 1px;
-ms-perspective: 1px;
perspective: 1px;
}
.control ul {
padding: 0;
font-size: 0px;
margin: 0;
}
.control li {
text-align: center;
display: inline-block;
font-size: 1rem;
}
.control li.pager {
width: auto;
background: none;
margin: 0;
}
.control li > span,
.control li > a {
text-decoration: none;
width: 44px;
height: 44px;
line-height: 2.75em;
text-align: center;
color: #db3d53;
font-weight: 600;
display: block;
background: #FFF;
border: 1px solid #E2E2E2;
margin: 0 0 0 0.625rem;
cursor: pointer;
overflow: hidden;
padding: 0 0.625rem;
transition: 0.25s ease;
}
.control li:hover > span,
.control li:hover > a {
background: #575656;
border-color: #575656;
color: #FFF;
}
.control li.act > *,
.control li.act:hover > * {
background: #db3d53;
border-color: #db3d53;
color: #FFF;
}
.control li > a:empty {
display: none;
}
.control li.play > *,
.control li.pause > * {
width: auto;
}
.control li.play > *:before {
content: 'Play';
}
.control li.pause > *:before {
content: 'Pause';
}
.tx-sectioncontent-pi1 .control li > span {
opacity: 0.5 !important;
cursor: not-allowed !important;
}
/************ PAGINATION ENDE ************/
/****************** TABS START ******************/
.tabs > .canvas {
border-bottom: 1px solid #dddddd;
border-top: 1px solid #dddddd;
background: none;
padding: 1.5rem 0 0;
margin: 0 0.625rem 1.5rem;
}
.tabs .control {
margin: 0;
margin-bottom: -1px;
height: 44px;
}
.tabs .control .first,
.tabs .control .prev,
.tabs .control .last,
.tabs .control .next,
.tabs .control .play {
display: none;
}
.tabs li.pager a {
width: auto;
padding: 0 1rem;
background: none;
border: 0;
color: #cccccc;
font-family: 'Glegoo', serif;
}
.tabs li.pager a:hover {
background: none;
}
.tabs li.pager .act a {
color: #aca194;
border: 1px solid #dddddd;
border-bottom: 1px solid #f8f8f8;
}
/****************** TABS ENDE ******************/
b,
strong {
font-weight: 600;
}
/*
Fixes for TYPO3-Core-Related Stuff (primarily CSS Styled Content)
this file is intended to be left alone
*/
div.ce-textpic .ce-gallery figure {
margin: 0;
}
div.ce-textpic .ce-gallery figure,
div.ce-textpic figure.ce-gallery,
div.ce-textpic .ce-gallery .ce-media {
margin-bottom: 1.5rem;
}
div.ce-textpic .ce-gallery .ce-row-last .ce-media {
margin-bottom: 1.5rem !important;
}
div.ce-textpic .ce-gallery figure,
div.ce-textpic figure.ce-gallery {
display: block;
}
figcaption.ce-textpic-caption {
display: block;
}
/* responsive images */
.ce-textpic .ce-gallery .ce-column {
width: 100%;
overflow: hidden;
}
.ce-gallery {
width: 100%;
}
div.ce-textpic .ce-gallery .ce-media {
width: 100%;
}
div.ce-textpic .ce-gallery a,
div.ce-textpic .ce-gallery img,
div.ce-textpic .ce-gallery source,
div.tx-sectioncontent-pi1 img {
width: 100%;
height: auto;
display: block;
}
.ce-textpic .ce-gallery .ce-row .ce-column {
float: left;
}
.ce-textpic .ce-gallery .ce-row:last-of-type::after {
content: '';
display: block;
height: 0;
width: 100%;
clear: both;
}
.ce-textpic .ce-gallery[data-ce-columns] .ce-row {
margin: 0 -20px;
}
.ce-textpic .ce-gallery[data-ce-columns="1"] .ce-row {
margin: 0;
}
.ce-textpic .ce-gallery[data-ce-columns] .ce-column {
padding: 0 20px;
margin: 0;
}
.ce-textpic .ce-gallery[data-ce-columns="1"] .ce-column {
padding: 0;
}
.ce-textpic .ce-gallery[data-ce-columns="1"] .ce-column {
width: 100%;
}
.ce-textpic .ce-gallery[data-ce-columns="2"] .ce-column {
width: 50%;
}
.ce-textpic .ce-gallery[data-ce-columns="3"] .ce-column {
width: 50%;
}
.ce-textpic .ce-gallery[data-ce-columns="4"] .ce-column {
width: 50%;
}
.ce-textpic .ce-gallery[data-ce-columns="5"] .ce-column {
width: 50%;
}
.ce-textpic .ce-gallery[data-ce-columns="6"] .ce-column {
width: 50%;
}
.ce-textpic .ce-gallery[data-ce-columns="7"] .ce-column {
width: 50%;
}
.ce-textpic .ce-gallery[data-ce-columns="8"] .ce-column {
width: 50%;
}
.ce-textpic .ce-gallery[data-ce-columns="4"] .ce-column:nth-child(2n+1) {
clear: both;
}
.ce-textpic .ce-gallery[data-ce-columns="5"] .ce-column:nth-child(2n+1) {
clear: both;
}
.ce-textpic .ce-gallery[data-ce-columns="6"] .ce-column:nth-child(2n+1) {
clear: both;
}
.ce-textpic .ce-gallery[data-ce-columns="7"] .ce-column:nth-child(2n+1) {
clear: both;
}
.ce-textpic .ce-gallery[data-ce-columns="8"] .ce-column:nth-child(2n+1) {
clear: both;
}
@media (min-width: 768px) {
.ce-textpic .ce-gallery[data-ce-columns="2"] .ce-column {
width: 50%;
}
.ce-textpic .ce-gallery[data-ce-columns="3"] .ce-column {
width: 33.33333333%;
}
.ce-textpic .ce-gallery[data-ce-columns="4"] .ce-column {
width: 25%;
}
.ce-textpic .ce-gallery[data-ce-columns="5"] .ce-column {
width: 20%;
}
.ce-textpic .ce-gallery[data-ce-columns="6"] .ce-column {
width: 33.33333333%;
}
.ce-textpic .ce-gallery[data-ce-columns="7"] .ce-column {
width: 14.28%;
}
.ce-textpic .ce-gallery[data-ce-columns="8"] .ce-column {
width: 25%;
}
.ce-textpic .ce-gallery[data-ce-columns="4"] .ce-column:nth-child(2n+1) {
clear: none;
}
.ce-textpic .ce-gallery[data-ce-columns="5"] .ce-column:nth-child(2n+1) {
clear: none;
}
.ce-textpic .ce-gallery[data-ce-columns="6"] .ce-column:nth-child(2n+1) {
clear: none;
}
.ce-textpic .ce-gallery[data-ce-columns="7"] .ce-column:nth-child(2n+1) {
clear: none;
}
.ce-textpic .ce-gallery[data-ce-columns="8"] .ce-column:nth-child(2n+1) {
clear: none;
}
.ce-textpic .ce-gallery[data-ce-columns="2"] .ce-column:nth-child(2n+1) {
clear: both;
}
.ce-textpic .ce-gallery[data-ce-columns="3"] .ce-column:nth-child(3n+1) {
clear: both;
}
.ce-textpic .ce-gallery[data-ce-columns="4"] .ce-column:nth-child(4n+1) {
clear: both;
}
.ce-textpic .ce-gallery[data-ce-columns="5"] .ce-column:nth-child(5n+1) {
clear: both;
}
.ce-textpic .ce-gallery[data-ce-columns="6"] .ce-column:nth-child(3n+1) {
clear: both;
}
.ce-textpic .ce-gallery[data-ce-columns="7"] .ce-column:nth-child(7n+1) {
clear: both;
}
.ce-textpic .ce-gallery[data-ce-columns="8"] .ce-column:nth-child(4n+1) {
clear: both;
}
}
@media (min-width: 992px) {
.ce-textpic .ce-gallery[data-ce-columns="6"] .ce-column {
width: 16.66666666%;
}
.ce-textpic .ce-gallery[data-ce-columns="8"] .ce-column {
width: 12.5%;
}
.ce-textpic .ce-gallery[data-ce-columns="6"] .ce-column:nth-child(3n+1) {
clear: none;
}
.ce-textpic .ce-gallery[data-ce-columns="8"] .ce-column:nth-child(4n+1) {
clear: none;
}
.ce-textpic .ce-gallery[data-ce-columns="6"] .ce-column:nth-child(6n+1) {
clear: both;
}
.ce-textpic .ce-gallery[data-ce-columns="8"] .ce-column:nth-child(8n+1) {
clear: both;
}
}
/* responsive images end */
/*
Gridsystem (Based on Bootstrap)
this file is intended to be left alone
*/
@-ms-viewport {
width: device-width;
}
body::after {
display: none;
}
.width {
margin: 0 auto;
position: relative;
}
.row:after,
.row:before {
content: ' ';
display: table;
}
.row:after {
clear: both;
}
.col-xs-1,
.col-xs-2,
.col-xs-3,
.col-xs-4,
.col-xs-5,
.col-xs-6,
.col-xs-7,
.col-xs-8,
.col-xs-9,
.col-xs-10,
.col-xs-11,
.col-xs-12,
.col-sm-1,
.col-sm-2,
.col-sm-3,
.col-sm-4,
.col-sm-5,
.col-sm-6,
.col-sm-7,
.col-sm-8,
.col-sm-9,
.col-sm-10,
.col-sm-11,
.col-sm-12,
.col-md-1,
.col-md-2,
.col-md-3,
.col-md-4,
.col-md-5,
.col-md-6,
.col-md-7,
.col-md-8,
.col-md-9,
.col-md-10,
.col-md-11,
.col-md-12,
.col-lg-1,
.col-lg-2,
.col-lg-3,
.col-lg-4,
.col-lg-5,
.col-lg-6,
.col-lg-7,
.col-lg-8,
.col-lg-9,
.col-lg-10,
.col-lg-11,
.col-lg-12 {
position: relative;
min-height: 1px;
}
.text-left {
text-align: left;
}
.text-right {
text-align: right;
}
.text-center {
text-align: center;
}
.text-justify {
text-align: justify;
}
.visible-xs,
.visible-sm,
.visible-md,
.visible-lg {
display: none !important;
}
/* no media query for xs here, those are mobile first */
.col-xs-1,
.col-xs-2,
.col-xs-3,
.col-xs-4,
.col-xs-5,
.col-xs-6,
.col-xs-7,
.col-xs-8,
.col-xs-9,
.col-xs-10,
.col-xs-11,
.col-xs-12 {
float: left;
}
.col-xs-12 {
width: 100%;
}
.col-xs-11 {
width: 91.66666667%;
}
.col-xs-10 {
width: 83.33333333%;
}
.col-xs-9 {
width: 75%;
}
.col-xs-8 {
width: 66.66666667%;
}
.col-xs-7 {
width: 58.33333333%;
}
.col-xs-6 {
width: 50%;
}
.col-xs-5 {
width: 41.66666667%;
}
.col-xs-4 {
width: 33.33333333%;
}
.col-xs-3 {
width: 25%;
}
.col-xs-2 {
width: 16.66666667%;
}
.col-xs-1 {
width: 8.33333333%;
}
.col-xs-pull-12 {
right: 100%;
}
.col-xs-pull-11 {
right: 91.66666667%;
}
.col-xs-pull-10 {
right: 83.33333333%;
}
.col-xs-pull-9 {
right: 75%;
}
.col-xs-pull-8 {
right: 66.66666667%;
}
.col-xs-pull-7 {
right: 58.33333333%;
}
.col-xs-pull-6 {
right: 50%;
}
.col-xs-pull-5 {
right: 41.66666667%;
}
.col-xs-pull-4 {
right: 33.33333333%;
}
.col-xs-pull-3 {
right: 25%;
}
.col-xs-pull-2 {
right: 16.66666667%;
}
.col-xs-pull-1 {
right: 8.33333333%;
}
.col-xs-pull-0 {
right: 0%;
}
.col-xs-push-12 {
left: 100%;
}
.col-xs-push-11 {
left: 91.66666667%;
}
.col-xs-push-10 {
left: 83.33333333%;
}
.col-xs-push-9 {
left: 75%;
}
.col-xs-push-8 {
left: 66.66666667%;
}
.col-xs-push-7 {
left: 58.33333333%;
}
.col-xs-push-6 {
left: 50%;
}
.col-xs-push-5 {
left: 41.66666667%;
}
.col-xs-push-4 {
left: 33.33333333%;
}
.col-xs-push-3 {
left: 25%;
}
.col-xs-push-2 {
left: 16.66666667%;
}
.col-xs-push-1 {
left: 8.33333333%;
}
.col-xs-push-0 {
left: 0%;
}
.col-xs-offset-12 {
margin-left: 100%;
}
.col-xs-offset-11 {
margin-left: 91.66666667%;
}
.col-xs-offset-10 {
margin-left: 83.33333333%;
}
.col-xs-offset-9 {
margin-left: 75%;
}
.col-xs-offset-8 {
margin-left: 66.66666667%;
}
.col-xs-offset-7 {
margin-left: 58.33333333%;
}
.col-xs-offset-6 {
margin-left: 50%;
}
.col-xs-offset-5 {
margin-left: 41.66666667%;
}
.col-xs-offset-4 {
margin-left: 33.33333333%;
}
.col-xs-offset-3 {
margin-left: 25%;
}
.col-xs-offset-2 {
margin-left: 16.66666667%;
}
.col-xs-offset-1 {
margin-left: 8.33333333%;
}
.col-xs-offset-0 {
margin-left: 0%;
}
@media (max-width: 767px) {
body {
breakpoint: 'xs';
}
body::after {
content: 'xs';
}
.width {
width: 100%;
}
}
@media (min-width: 768px) {
body {
breakpoint: 'sm';
}
body::after {
content: 'sm';
}
.width {
width: 720px;
}
.col-sm-1,
.col-sm-2,
.col-sm-3,
.col-sm-4,
.col-sm-5,
.col-sm-6,
.col-sm-7,
.col-sm-8,
.col-sm-9,
.col-sm-10,
.col-sm-11,
.col-sm-12 {
float: left;
}
.col-sm-12 {
width: 100%;
}
.col-sm-11 {
width: 91.66666667%;
}
.col-sm-10 {
width: 83.33333333%;
}
.col-sm-9 {
width: 75%;
}
.col-sm-8 {
width: 66.66666667%;
}
.col-sm-7 {
width: 58.33333333%;
}
.col-sm-6 {
width: 50%;
}
.col-sm-5 {
width: 41.66666667%;
}
.col-sm-4 {
width: 33.33333333%;
}
.col-sm-3 {
width: 25%;
}
.col-sm-2 {
width: 16.66666667%;
}
.col-sm-1 {
width: 8.33333333%;
}
.col-sm-pull-12 {
right: 100%;
}
.col-sm-pull-11 {
right: 91.66666667%;
}
.col-sm-pull-10 {
right: 83.33333333%;
}
.col-sm-pull-9 {
right: 75%;
}
.col-sm-pull-8 {
right: 66.66666667%;
}
.col-sm-pull-7 {
right: 58.33333333%;
}
.col-sm-pull-6 {
right: 50%;
}
.col-sm-pull-5 {
right: 41.66666667%;
}
.col-sm-pull-4 {
right: 33.33333333%;
}
.col-sm-pull-3 {
right: 25%;
}
.col-sm-pull-2 {
right: 16.66666667%;
}
.col-sm-pull-1 {
right: 8.33333333%;
}
.col-sm-pull-0 {
right: 0%;
}
.col-sm-push-12 {
left: 100%;
}
.col-sm-push-11 {
left: 91.66666667%;
}
.col-sm-push-10 {
left: 83.33333333%;
}
.col-sm-push-9 {
left: 75%;
}
.col-sm-push-8 {
left: 66.66666667%;
}
.col-sm-push-7 {
left: 58.33333333%;
}
.col-sm-push-6 {
left: 50%;
}
.col-sm-push-5 {
left: 41.66666667%;
}
.col-sm-push-4 {
left: 33.33333333%;
}
.col-sm-push-3 {
left: 25%;
}
.col-sm-push-2 {
left: 16.66666667%;
}
.col-sm-push-1 {
left: 8.33333333%;
}
.col-sm-push-0 {
left: 0%;
}
.col-sm-offset-12 {
margin-left: 100%;
}
.col-sm-offset-11 {
margin-left: 91.66666667%;
}
.col-sm-offset-10 {
margin-left: 83.33333333%;
}
.col-sm-offset-9 {
margin-left: 75%;
}
.col-sm-offset-8 {
margin-left: 66.66666667%;
}
.col-sm-offset-7 {
margin-left: 58.33333333%;
}
.col-sm-offset-6 {
margin-left: 50%;
}
.col-sm-offset-5 {
margin-left: 41.66666667%;
}
.col-sm-offset-4 {
margin-left: 33.33333333%;
}
.col-sm-offset-3 {
margin-left: 25%;
}
.col-sm-offset-2 {
margin-left: 16.66666667%;
}
.col-sm-offset-1 {
margin-left: 8.33333333%;
}
.col-sm-offset-0 {
margin-left: 0%;
}
}
@media (min-width: 992px) {
body {
breakpoint: 'md';
}
body::after {
content: 'md';
}
.width {
width: 960px;
}
.col-md-1,
.col-md-2,
.col-md-3,
.col-md-4,
.col-md-5,
.col-md-6,
.col-md-7,
.col-md-8,
.col-md-9,
.col-md-10,
.col-md-11,
.col-md-12 {
float: left;
}
.col-md-12 {
width: 100%;
}
.col-md-11 {
width: 91.66666667%;
}
.col-md-10 {
width: 83.33333333%;
}
.col-md-9 {
width: 75%;
}
.col-md-8 {
width: 66.66666667%;
}
.col-md-7 {
width: 58.33333333%;
}
.col-md-6 {
width: 50%;
}
.col-md-5 {
width: 41.66666667%;
}
.col-md-4 {
width: 33.33333333%;
}
.col-md-3 {
width: 25%;
}
.col-md-2 {
width: 16.66666667%;
}
.col-md-1 {
width: 8.33333333%;
}
.col-md-pull-12 {
right: 100%;
}
.col-md-pull-11 {
right: 91.66666667%;
}
.col-md-pull-10 {
right: 83.33333333%;
}
.col-md-pull-9 {
right: 75%;
}
.col-md-pull-8 {
right: 66.66666667%;
}
.col-md-pull-7 {
right: 58.33333333%;
}
.col-md-pull-6 {
right: 50%;
}
.col-md-pull-5 {
right: 41.66666667%;
}
.col-md-pull-4 {
right: 33.33333333%;
}
.col-md-pull-3 {
right: 25%;
}
.col-md-pull-2 {
right: 16.66666667%;
}
.col-md-pull-1 {
right: 8.33333333%;
}
.col-md-pull-0 {
right: 0%;
}
.col-md-push-12 {
left: 100%;
}
.col-md-push-11 {
left: 91.66666667%;
}
.col-md-push-10 {
left: 83.33333333%;
}
.col-md-push-9 {
left: 75%;
}
.col-md-push-8 {
left: 66.66666667%;
}
.col-md-push-7 {
left: 58.33333333%;
}
.col-md-push-6 {
left: 50%;
}
.col-md-push-5 {
left: 41.66666667%;
}
.col-md-push-4 {
left: 33.33333333%;
}
.col-md-push-3 {
left: 25%;
}
.col-md-push-2 {
left: 16.66666667%;
}
.col-md-push-1 {
left: 8.33333333%;
}
.col-md-push-0 {
left: 0%;
}
.col-md-offset-12 {
margin-left: 100%;
}
.col-md-offset-11 {
margin-left: 91.66666667%;
}
.col-md-offset-10 {
margin-left: 83.33333333%;
}
.col-md-offset-9 {
margin-left: 75%;
}
.col-md-offset-8 {
margin-left: 66.66666667%;
}
.col-md-offset-7 {
margin-left: 58.33333333%;
}
.col-md-offset-6 {
margin-left: 50%;
}
.col-md-offset-5 {
margin-left: 41.66666667%;
}
.col-md-offset-4 {
margin-left: 33.33333333%;
}
.col-md-offset-3 {
margin-left: 25%;
}
.col-md-offset-2 {
margin-left: 16.66666667%;
}
.col-md-offset-1 {
margin-left: 8.33333333%;
}
.col-md-offset-0 {
margin-left: 0%;
}
}
@media (min-width: 1302px) {
body {
breakpoint: 'lg';
}
body::after {
content: 'lg';
}
.width {
width: 1260px;
}
.col-lg-1,
.col-lg-2,
.col-lg-3,
.col-lg-4,
.col-lg-5,
.col-lg-6,
.col-lg-7,
.col-lg-8,
.col-lg-9,
.col-lg-10,
.col-lg-11,
.col-lg-12 {
float: left;
}
.col-lg-12 {
width: 100%;
}
.col-lg-11 {
width: 91.66666667%;
}
.col-lg-10 {
width: 83.33333333%;
}
.col-lg-9 {
width: 75%;
}
.col-lg-8 {
width: 66.66666667%;
}
.col-lg-7 {
width: 58.33333333%;
}
.col-lg-6 {
width: 50%;
}
.col-lg-5 {
width: 41.66666667%;
}
.col-lg-4 {
width: 33.33333333%;
}
.col-lg-3 {
width: 25%;
}
.col-lg-2 {
width: 16.66666667%;
}
.col-lg-1 {
width: 8.33333333%;
}
.col-lg-pull-12 {
right: 100%;
}
.col-lg-pull-11 {
right: 91.66666667%;
}
.col-lg-pull-10 {
right: 83.33333333%;
}
.col-lg-pull-9 {
right: 75%;
}
.col-lg-pull-8 {
right: 66.66666667%;
}
.col-lg-pull-7 {
right: 58.33333333%;
}
.col-lg-pull-6 {
right: 50%;
}
.col-lg-pull-5 {
right: 41.66666667%;
}
.col-lg-pull-4 {
right: 33.33333333%;
}
.col-lg-pull-3 {
right: 25%;
}
.col-lg-pull-2 {
right: 16.66666667%;
}
.col-lg-pull-1 {
right: 8.33333333%;
}
.col-lg-pull-0 {
right: 0%;
}
.col-lg-push-12 {
left: 100%;
}
.col-lg-push-11 {
left: 91.66666667%;
}
.col-lg-push-10 {
left: 83.33333333%;
}
.col-lg-push-9 {
left: 75%;
}
.col-lg-push-8 {
left: 66.66666667%;
}
.col-lg-push-7 {
left: 58.33333333%;
}
.col-lg-push-6 {
left: 50%;
}
.col-lg-push-5 {
left: 41.66666667%;
}
.col-lg-push-4 {
left: 33.33333333%;
}
.col-lg-push-3 {
left: 25%;
}
.col-lg-push-2 {
left: 16.66666667%;
}
.col-lg-push-1 {
left: 8.33333333%;
}
.col-lg-push-0 {
left: 0%;
}
.col-lg-offset-12 {
margin-left: 100%;
}
.col-lg-offset-11 {
margin-left: 91.66666667%;
}
.col-lg-offset-10 {
margin-left: 83.33333333%;
}
.col-lg-offset-9 {
margin-left: 75%;
}
.col-lg-offset-8 {
margin-left: 66.66666667%;
}
.col-lg-offset-7 {
margin-left: 58.33333333%;
}
.col-lg-offset-6 {
margin-left: 50%;
}
.col-lg-offset-5 {
margin-left: 41.66666667%;
}
.col-lg-offset-4 {
margin-left: 33.33333333%;
}
.col-lg-offset-3 {
margin-left: 25%;
}
.col-lg-offset-2 {
margin-left: 16.66666667%;
}
.col-lg-offset-1 {
margin-left: 8.33333333%;
}
.col-lg-offset-0 {
margin-left: 0%;
}
}
@media (max-width: 767px) {
.visible-xs {
display: block !important;
}
table.visible-xs {
display: table;
}
tr.visible-xs {
display: table-row !important;
}
th.visible-xs,
td.visible-xs {
display: table-cell !important;
}
.hidden-xs {
display: none !important;
}
}
@media (min-width: 768px) and (max-width: 991px) {
.visible-sm {
display: block !important;
}
table.visible-sm {
display: table;
}
tr.visible-sm {
display: table-row !important;
}
th.visible-sm,
td.visible-sm {
display: table-cell !important;
}
.hidden-sm {
display: none !important;
}
}
@media (min-width: 992px) and (max-width: 1301px) {
.visible-md {
display: block !important;
}
table.visible-md {
display: table;
}
tr.visible-md {
display: table-row !important;
}
th.visible-md,
td.visible-md {
display: table-cell !important;
}
.hidden-md {
display: none !important;
}
}
@media (min-width: 1302px) {
.visible-lg {
display: block !important;
}
table.visible-lg {
display: table;
}
tr.visible-lg {
display: table-row !important;
}
th.visible-lg,
td.visible-lg {
display: table-cell !important;
}
.hidden-lg {
display: none !important;
}
}
.visible-print {
display: none !important;
}
@media print {
.visible-print {
display: block !important;
}
table.visible-print {
display: table;
}
tr.visible-print {
display: table-row !important;
}
th.visible-print,
td.visible-print {
display: table-cell !important;
}
}
@media print {
.hidden-print {
display: none !important;
}
}
/* Main Naviagtion (auch menuLeft Variable im default.js beachten) */
/****************** MENU MOBIL START ******************/
@media (max-width: 1299px) {
#menu {
width: 100%;
position: absolute;
top: 0px;
left: 0px;
z-index: 50;
height: 0px;
}
#menu > span {
width: 40px;
height: 100px;
position: absolute;
right: 180px;
top: 0px;
display: block;
line-height: 100px;
padding: 0 0 0 2.375rem;
text-transform: uppercase;
color: #575656;
background: #ffffff;
font-size: 1.125rem;
cursor: pointer;
overflow: hidden;
border-left: 1px solid rgba(0, 0, 0, 0.07000000000000001);
-webkit-transition: 0.25s ease;
-moz-transition: 0.25s ease;
-ms-transition: 0.25s ease;
-o-transition: 0.25s ease;
transition: 0.25s ease;
}
#menu > span::before {
font-family: 'default';
font-weight: normal;
text-indent: 0;
font-style: normal;
color: #575656;
content: '\2261';
display: block;
font-size: 1.25rem;
height: 35px;
left: 10px;
line-height: 2.25em;
padding-right: 0;
position: absolute;
right: 0;
text-decoration: none;
top: 50%;
-webkit-transform: translateY(-50%);
-moz-transform: translateY(-50%);
-ms-transform: translateY(-50%);
-o-transform: translateY(-50%);
transform: translateY(-50%);
width: 20px;
margin-top: -3px;
}
#menu.open > span {
color: #ffffff;
background: #575656;
}
#menu.open > span::before {
font-family: 'default';
font-weight: normal;
text-indent: 0;
font-style: normal;
content: '\e90b';
color: #ffffff;
}
#menu > div {
display: none;
}
#menu.open > div {
display: block;
text-align: left;
margin: 0;
width: 100%;
padding: 0;
overflow: hidden;
margin-top: 100px;
}
#menu > div > ul > li > div > ul,
#menu > div > ul > li > div > ul > li > ul,
#menu > div > ul > li > div > ul > li > ul > li > ul {
display: none;
}
#menu > div > ul > li.act > div > ul,
#menu > div > ul > li > div > ul > li.act > ul,
#menu > div > ul > li > div > ul > li > ul > li.act > ul {
display: block;
}
#menu ul {
padding: 0;
margin: 0;
}
#menu > div > ul {
margin: 0;
width: 100%;
padding: 0.9375rem;
background: #575656;
}
#menu li a {
line-height: 3em;
text-decoration: none;
display: inline-block;
width: 100%;
padding: 0 0 0 0.5rem;
text-transform: uppercase;
color: #ffffff;
font-weight: 400;
}
#menu li ul li a {
text-transform: none;
font-weight: 400;
position: relative;
}
#menu li ul li a:before {
font-family: 'default';
font-weight: normal;
text-indent: 0;
font-style: normal;
content: '\2c3';
width: 10px;
height: 10px;
font-size: 0.625rem;
line-height: 10px;
color: #ffffff;
display: block;
overflow: hidden;
position: absolute;
top: 50%;
-webkit-transform: translateY(-50%);
-moz-transform: translateY(-50%);
-ms-transform: translateY(-50%);
-o-transform: translateY(-50%);
transform: translateY(-50%);
left: -10px;
}
#menu li.cur > a {
color: #aca194;
}
#menu li.cur > a:before {
color: #aca194;
}
#menu > div > ul > li > div > ul > li,
#menu > div > ul > li > div > ul > li > ul > li,
#menu > div > ul > li > div > ul > li > ul > li > ul > li {
padding: 0 0 0 2em;
}
.menuWrap .back,
.menuWrap .parent {
display: none !important;
}
#menu > div > ul > li > div > .menuImg {
display: none;
}
}
@media (min-width: 620px) and (max-width: 1299px) {
#menu > span {
width: 150px;
height: 100px;
position: absolute;
right: 370px;
line-height: 100px;
font-weight: 600;
font-size: 1.25rem;
text-align: center;
}
#menu > span::before {
font-size: 1.75rem;
height: 35px;
left: 50%;
line-height: 2.25em;
right: auto;
width: 30px;
margin-top: -13px;
margin-left: -50px;
}
}
/****************** MENU MOBIL ENDE ******************/
/****************** MENU DESKTOP START ******************/
@media (min-width: 1301px) {
#menu {
position: absolute;
left: 150px;
top: 0;
margin: 0 0.625rem;
}
#menu > span {
display: none;
}
#menu > div > ul {
display: inline-block;
text-align: left;
margin: 0;
background: none;
padding: 0;
}
#menu > div > ul > li {
display: inline-block;
padding: 0;
margin: 0;
height: 100px;
position: relative;
float: left;
}
#menu > div > ul > li > a {
font-size: 1rem;
display: block;
background: none;
text-decoration: none;
line-height: calc(90px);
color: #ffffff;
padding: 0 1em;
position: relative;
z-index: 10;
font-weight: 500;
}
#menu > div > ul > li > a:before {
content: '';
position: absolute;
bottom: -10px;
left: 0;
width: 100%;
height: 15px;
display: block;
overflow: hidden;
background: #ffffff;
z-index: 10;
pointer-events: none;
font-size: 1rem;
line-height: 1rem;
display: none;
}
#menu > div > ul > li:hover > a:before {
display: block;
}
#menu > div > ul > li:nth-of-type(3) > a:before {
display: none !important;
}
#menu > div > ul > li:hover > a,
#menu > div > ul > li.act:hover > a {
color: #575656;
background: #ffffff;
}
#menu > div > ul > li.act > a {
font-weight: 600;
}
#menu > div > ul > li > div {
padding: 0;
position: absolute;
top: 90px;
left: 0;
width: 626px;
background: #FFFFFF;
transition: all 0.5s;
display: none;
margin: 0;
}
#menu > div > ul > li:before {
content: ' ';
display: block;
position: fixed;
top: 0;
left: 0;
height: 100vh;
width: 100%;
background: #575656;
opacity: 0;
pointer-events: none;
transition: opacity 0.25s ease;
z-index: -1;
}
#menu > div > ul > li:hover > div {
display: block;
}
#menu > div > ul > li:hover::before {
opacity: 0.2;
}
#menu > div > ul > li:nth-of-type(5) > div,
#menu > div > ul > li:nth-of-type(6) > div,
#menu > div > ul > li:nth-of-type(7) > div {
left: auto;
right: 0;
}
#menu > div > ul > li:nth-of-type(5) > div > ul,
#menu > div > ul > li:nth-of-type(6) > div > ul,
#menu > div > ul > li:nth-of-type(7) > div > ul,
#menu > div > ul > li:nth-of-type(5) > div > .menuImg,
#menu > div > ul > li:nth-of-type(6) > div > .menuImg,
#menu > div > ul > li:nth-of-type(7) > div > .menuImg {
float: right;
}
#menu > div > ul > li > div > ul {
margin: 0;
width: 313px;
float: left;
padding-top: 30px;
padding-bottom: 30px;
}
#menu > div > ul > li > div > .menuImg {
width: 313px;
float: left;
}
#menu > div > ul > li > div > .menuImg img {
display: block;
overflow: hidden;
font-size: 0;
line-height: 0;
}
#menu > div > ul > li > div > ul > li {
padding: 0px;
}
#menu > div > ul > li > div > ul > li > a {
text-align: left;
color: #575656;
font-size: 1rem;
padding-left: 1.25rem;
line-height: 1.75em;
text-decoration: none;
display: block;
text-transform: none;
font-weight: 400;
position: relative;
-webkit-transition: 0.25s ease;
-moz-transition: 0.25s ease;
-ms-transition: 0.25s ease;
-o-transition: 0.25s ease;
transition: 0.25s ease;
}
#menu > div > ul > li > div > ul > li > a:before {
font-family: 'default';
font-weight: normal;
text-indent: 0;
font-style: normal;
content: '\2c3';
width: 10px;
height: 10px;
font-size: 0.625rem;
line-height: 10px;
color: #575656;
display: block;
overflow: hidden;
position: absolute;
top: 50%;
-webkit-transform: translateY(-50%);
-moz-transform: translateY(-50%);
-ms-transform: translateY(-50%);
-o-transform: translateY(-50%);
transform: translateY(-50%);
left: 0px;
-webkit-transition: 0.25s ease;
-moz-transition: 0.25s ease;
-ms-transition: 0.25s ease;
-o-transition: 0.25s ease;
transition: 0.25s ease;
}
#menu > div > ul > li > div > ul > li:hover > a,
#menu > div > ul > li > div > ul > li.act > a {
color: #aca194;
}
#menu > div > ul > li > div > ul > li:hover > a:before,
#menu > div > ul > li > div > ul > li.act > a:before {
color: #aca194;
}
.menuWrap .back,
.menuWrap .parent {
display: none !important;
}
}
/****************** MENU DESKTOP ENDE ******************/
/*@import"../../../typo3temp/DynCss/"/fileadmin/template/Resources/Public/less/menu-left.less";*/
/*@import"../../../typo3temp/DynCss/"/fileadmin/template/Resources/Public/less/menu-burger.less";*/
.Tx-Formhandler .row {
clear: both;
}
.formhandler-ajax-validation-result,
.Tx-Formhandler .loading {
display: none !important;
}
input[type="text"],
input[type="number"],
input[type="email"],
input[type="phone"],
select,
textarea {
border-radius: 0px;
-webkit-appearance: none;
}
input:focus {
outline: none;
}
form {
padding: 0;
margin: 0;
/***** INPUT TYPE NUMBER ******/
/***** HONEYPOT *******/
}
form:after {
content: '';
display: block;
height: 0;
width: 100%;
clear: both;
}
form fieldset {
float: left;
position: relative;
width: 100%;
margin: 0 0 1.5rem 0;
padding: 0px;
border: none;
}
form .required {
position: absolute;
left: 0;
top: 0;
height: 100%;
width: 2px;
text-indent: -999em;
background: #aca194;
}
form .success .required {
background-color: #26c281;
}
form .error .required {
width: 44px;
height: 44px;
background-color: #eb6c62;
cursor: pointer;
}
form .error .required:before {
content: '\3f';
font-size: 13px;
color: #FFF;
position: absolute;
left: 50%;
top: 50%;
margin: 0;
font-family: 'default';
font-weight: normal;
font-style: normal;
speak: none;
font-variant: normal;
text-transform: none;
line-height: 1;
text-indent: 0;
-webkit-transform: translate(-50%, -50%);
-moz-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
-o-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}
form .input,
form .textarea,
form .select,
form .checkbox,
form .radio,
form .submit {
position: relative;
margin: 0px 10px 10px 10px;
}
form .select.error.focus:before {
border-color: #eb6c62;
}
form .input:focus,
form .textarea:focus,
form .select:focus {
border-color: #aca194;
}
form .input .label,
form .textarea .label,
form .select .label {
position: absolute;
left: 0px;
top: 0px;
padding: 0 10px;
pointer-events: none;
}
form .input .label label,
form .textarea .label label,
form .select .label label {
line-height: 44px;
height: 44px;
display: inline-block;
color: #aca194;
}
form .input input,
form .textarea input,
form .select input,
form .input textarea,
form .textarea textarea,
form .select textarea,
form .input select,
form .textarea select,
form .select select {
width: 100%;
border: 1px solid #aca194;
margin: 0;
padding: 0 10px;
background: #f9fafb;
font-size: 1em;
height: 44px;
line-height: 44px;
color: #000;
}
form .input.error .label,
form .textarea.error .label,
form .select.error .label {
padding-left: 54px;
}
form .input.error .label label,
form .textarea.error .label label,
form .select.error .label label {
color: #EB6C62;
}
form .input.error input,
form .textarea.error input,
form .select.error input,
form .input.error textarea,
form .textarea.error textarea,
form .select.error textarea,
form .input.error select,
form .textarea.error select,
form .select.error select {
padding-left: 54px;
border-color: #fbe2e0;
background-color: #fcedeb;
}
form .input.error input:focus,
form .textarea.error input:focus,
form .select.error input:focus,
form .input.error textarea:focus,
form .textarea.error textarea:focus,
form .select.error textarea:focus,
form .input.error select:focus,
form .textarea.error select:focus,
form .select.error select:focus {
border-color: #eb6c62;
}
form .input.hasValue .label,
form .textarea.hasValue .label,
form .select.hasValue .label {
right: 0px;
bottom: 0px;
left: auto;
top: auto;
font-size: 0.65rem;
opacity: 0.5;
}
form .input.hasValue .label label,
form .textarea.hasValue .label label,
form .select.hasValue .label label {
height: auto;
line-height: 2.5em;
}
form .input.hasValue.date .label,
form .textarea.hasValue.date .label,
form .select.hasValue.date .label {
right: 30px;
}
form .textarea textarea {
min-height: 99px;
overflow: auto;
max-width: 100%;
min-width: 100%;
line-height: 22px;
padding-top: 11px;
padding-bottom: 11px;
display: block;
}
form .input.date:after {
content: '\1f4c5';
position: absolute;
right: 15px;
top: 50%;
margin-top: -8px;
pointer-events: none;
font-family: 'default';
font-weight: normal;
font-style: normal;
speak: none;
font-variant: normal;
text-transform: none;
line-height: 1;
text-indent: 0;
font-size: 18px;
color: #aca194;
}
form .input span.error,
form .textarea span.error,
form .select span.error,
form .checkbox span.error,
form .radio span.error {
position: absolute;
left: 0;
top: 0;
display: inline-block;
line-height: 70px;
padding: 0 20px;
background: #eb6c62;
margin: -80px 0 0 -10px;
color: #FFF;
font-style: italic;
-webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.25);
-moz-box-shadow: 0 0 10px rgba(0, 0, 0, 0.25);
box-shadow: 0 0 10px rgba(0, 0, 0, 0.25);
display: none;
height: auto;
white-space: nowrap;
z-index: 1;
}
form .input span.error.on,
form .textarea span.error.on,
form .select span.error.on,
form .checkbox span.error.on,
form .radio span.error.on {
display: block;
}
form .input span.error:before,
form .textarea span.error:before,
form .select span.error:before,
form .checkbox span.error:before,
form .radio span.error:before {
content: '';
position: absolute;
left: 22px;
bottom: -10px;
width: 0;
height: 0;
border-style: solid;
border-width: 10px 10px 0 10px;
border-color: #eb6c62 transparent transparent transparent;
}
form .checkbox:hover label:before {
border-color: #aca194;
}
form .checkbox > * {
min-height: 44px;
width: 100%;
line-height: 44px;
vertical-align: middle;
display: inline-block;
position: relative;
}
form .checkbox > small {
line-height: 2em;
}
form .checkbox.error label:before {
border-color: #fbe2e0;
background-color: #fcedeb;
}
form .checkbox input {
height: 20px;
margin-right: 10px;
margin-top: 10px;
opacity: 0;
vertical-align: top;
width: 20px;
position: relative;
z-index: 100;
}
form .checkbox input:checked + span:before {
border-color: #aca194;
}
form .checkbox input:checked + span:after {
width: 20px;
height: 20px;
content: '\1f5f8';
position: absolute;
left: 5px;
top: 24px;
margin-top: -12px;
cursor: pointer;
font-family: 'default';
font-weight: normal;
text-indent: 0;
font-style: normal;
speak: none;
font-variant: normal;
text-transform: none;
line-height: 1;
font-size: 20px;
color: #26c281;
}
form .checkbox label span {
display: inline-block;
line-height: 1.5em;
padding-top: 9px;
width: 70%;
}
form .checkbox label:before {
width: 20px;
height: 20px;
border: 1px solid #aca194;
background: #f9fafb;
content: '';
position: absolute;
left: 0;
top: 20px;
margin-top: -10px;
cursor: pointer;
}
form .radio > * {
height: 44px;
line-height: 44px;
vertical-align: middle;
display: inline-block;
position: relative;
}
form .radio input {
width: 20px;
opacity: 0;
margin-right: 0px;
height: auto;
}
form .radio span {
color: #aca194;
margin-right: 10px;
}
form .radio span label:before {
width: 20px;
height: 20px;
border: 1px solid #aca194;
background: #f9fafb;
content: '';
position: absolute;
left: 0px;
top: 50%;
margin-top: -10px;
cursor: pointer;
-webkit-border-radius: 100%;
-moz-border-radius: 100%;
border-radius: 100%;
}
form .radio span input:checked + label:before {
border-color: #aca194;
}
form .radio span input:checked + label:after {
width: 10px;
height: 10px;
background: #26c281;
content: '';
position: absolute;
left: 6px;
top: 50%;
margin-top: -4px;
cursor: pointer;
-webkit-border-radius: 100%;
-moz-border-radius: 100%;
border-radius: 100%;
}
form .radio span.error span label:before {
border-color: #fbe2e0;
background-color: #fcedeb;
}
form .radio span:hover label:before {
border-color: #aca194;
}
form .select:before {
content: '';
width: 50px;
height: 42px;
display: block;
position: absolute;
right: 0;
top: 0;
background: #f9fafb;
z-index: 10;
border: 1px solid #aca194;
border-left: none;
pointer-events: none;
}
form .select.focus:before {
border-color: #aca194;
}
form .select.error:before {
border-color: #fbe2e0;
background-color: #fcedeb;
}
form .select:after {
content: '\2304';
width: 12px;
height: 12px;
position: absolute;
right: 15px;
top: 50%;
margin-top: -6px;
z-index: 15;
pointer-events: none;
font-family: 'default';
font-weight: normal;
text-indent: 0;
font-style: normal;
speak: none;
font-variant: normal;
text-transform: none;
line-height: 1;
font-size: 12px;
color: #aca194;
}
form .select.hasValue label {
display: none;
}
form .radio .required,
form .checkbox .required,
form .radio .error,
form .checkbox .error {
display: none;
}
form .radio.error .required,
form .checkbox.error .required {
display: inline-block;
width: 20px;
height: 20px;
background: #eb6c62;
cursor: pointer;
}
form .submit .button {
width: 100%;
height: 44px;
line-height: 44px;
}
form .submit .button:hover {
opacity: 0.8;
}
form .select.hasValue .required {
background: #26c281;
}
form .input.quantity input[type=number] {
-moz-appearance: textfield;
appearance: textfield;
text-align: center;
padding-bottom: 10px;
}
form .input.quantity input[type=number]::-webkit-inner-spin-button,
form .input.quantity input[type=number]::-webkit-outer-spin-button {
-webkit-appearance: none;
margin: 0;
}
form .input.quantity .label {
text-align: center;
width: 100%;
}
form .input.quantity.hasValue .label {
width: 100%;
text-align: center;
right: 0;
}
form .input.quantity.hasValue .label label {
position: relative;
top: 4px;
}
form .input.quantity .quantity-button {
width: 18px;
height: 18px;
line-height: 18px;
text-align: center;
position: absolute;
left: 15px;
top: 50%;
margin-top: -9px;
font-size: 18px;
cursor: pointer;
font-family: 'default';
font-weight: normal;
text-indent: 0;
font-style: normal;
color: #aca194;
-ms-user-select: none;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
}
form .input.quantity .quantity-up {
left: auto;
right: 15px;
}
.js form .input.nickname {
display: none;
}
#quickform-form .input.date:after {
content: '\2304';
right: 35px;
margin-top: -33px;
font-size: 0.625rem;
color: #aca194;
}
#quickform_date_arrival_alt,
#quickform_date_departure_alt {
border: medium none;
display: block !important;
height: 0;
left: 0;
overflow: hidden;
position: absolute;
top: 35px;
visibility: hidden;
}
optgroup option {
display: block !important;
}
/*! jQuery UI - v1.10.4 - 2014-09-16
* http://jqueryui.com
* Includes: jquery.ui.core.css, jquery.ui.resizable.css, jquery.ui.selectable.css, jquery.ui.accordion.css, jquery.ui.autocomplete.css, jquery.ui.button.css, jquery.ui.datepicker.css, jquery.ui.dialog.css, jquery.ui.menu.css, jquery.ui.progressbar.css, jquery.ui.slider.css, jquery.ui.spinner.css, jquery.ui.tabs.css, jquery.ui.tooltip.css, jquery.ui.theme.css
* To view and modify this theme, visit http://jqueryui.com/themeroller/?ffDefault=Verdana%2CArial%2Csans-serif&fwDefault=normal&fsDefault=1.1em&cornerRadius=4px&bgColorHeader=cccccc&bgTextureHeader=highlight_soft&bgImgOpacityHeader=75&borderColorHeader=aaaaaa&fcHeader=222222&iconColorHeader=222222&bgColorContent=ffffff&bgTextureContent=flat&bgImgOpacityContent=75&borderColorContent=aaaaaa&fcContent=222222&iconColorContent=222222&bgColorDefault=e6e6e6&bgTextureDefault=glass&bgImgOpacityDefault=75&borderColorDefault=d3d3d3&fcDefault=555555&iconColorDefault=888888&bgColorHover=dadada&bgTextureHover=glass&bgImgOpacityHover=75&borderColorHover=999999&fcHover=212121&iconColorHover=454545&bgColorActive=ffffff&bgTextureActive=glass&bgImgOpacityActive=65&borderColorActive=aaaaaa&fcActive=212121&iconColorActive=454545&bgColorHighlight=fbf9ee&bgTextureHighlight=glass&bgImgOpacityHighlight=55&borderColorHighlight=fcefa1&fcHighlight=363636&iconColorHighlight=2e83ff&bgColorError=fef1ec&bgTextureError=glass&bgImgOpacityError=95&borderColorError=cd0a0a&fcError=cd0a0a&iconColorError=cd0a0a&bgColorOverlay=aaaaaa&bgTextureOverlay=flat&bgImgOpacityOverlay=0&opacityOverlay=30&bgColorShadow=aaaaaa&bgTextureShadow=flat&bgImgOpacityShadow=0&opacityShadow=30&thicknessShadow=8px&offsetTopShadow=-8px&offsetLeftShadow=-8px&cornerRadiusShadow=8px
* Copyright 2014 jQuery Foundation and other contributors; Licensed MIT */
.ui-helper-hidden {
display: none;
}
.ui-helper-hidden-accessible {
border: 0;
clip: rect(0 0 0 0);
height: 1px;
margin: -1px;
overflow: hidden;
padding: 0;
position: absolute;
width: 1px;
}
.ui-helper-reset {
margin: 0;
padding: 0;
border: 0;
outline: 0;
line-height: 1.3;
text-decoration: none;
font-size: 100%;
list-style: none;
}
.ui-helper-clearfix:before,
.ui-helper-clearfix:after {
content:"../../../typo3temp/DynCss/"";
display: table;
border-collapse: collapse;
}
.ui-helper-clearfix:after {
clear: both;
}
.ui-helper-clearfix {
min-height: 0;
}
.ui-helper-zfix {
width: 100%;
height: 100%;
top: 0;
left: 0;
position: absolute;
opacity: 0;
filter: alpha(opacity=0);
}
.ui-front {
z-index: 100;
}
.ui-state-disabled {
cursor: default !important;
}
.ui-icon {
display: block;
text-indent: -99999px;
overflow: hidden;
background-repeat: no-repeat;
}
.ui-widget-overlay {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.ui-resizable {
position: relative;
}
.ui-resizable-handle {
position: absolute;
font-size: 0.1px;
display: block;
}
.ui-resizable-disabled .ui-resizable-handle,
.ui-resizable-autohide .ui-resizable-handle {
display: none;
}
.ui-resizable-n {
cursor: n-resize;
height: 7px;
width: 100%;
top: -5px;
left: 0;
}
.ui-resizable-s {
cursor: s-resize;
height: 7px;
width: 100%;
bottom: -5px;
left: 0;
}
.ui-resizable-e {
cursor: e-resize;
width: 7px;
right: -5px;
top: 0;
height: 100%;
}
.ui-resizable-w {
cursor: w-resize;
width: 7px;
left: -5px;
top: 0;
height: 100%;
}
.ui-resizable-se {
cursor: se-resize;
width: 12px;
height: 12px;
right: 1px;
bottom: 1px;
}
.ui-resizable-sw {
cursor: sw-resize;
width: 9px;
height: 9px;
left: -5px;
bottom: -5px;
}
.ui-resizable-nw {
cursor: nw-resize;
width: 9px;
height: 9px;
left: -5px;
top: -5px;
}
.ui-resizable-ne {
cursor: ne-resize;
width: 9px;
height: 9px;
right: -5px;
top: -5px;
}
.ui-selectable-helper {
position: absolute;
z-index: 100;
border: 1px dotted #000000;
}
.ui-accordion .ui-accordion-header {
display: block;
cursor: pointer;
position: relative;
margin-top: 2px;
padding: .5em .5em .5em .7em;
min-height: 0;
}
.ui-accordion .ui-accordion-icons {
padding-left: 2.2em;
}
.ui-accordion .ui-accordion-noicons {
padding-left: .7em;
}
.ui-accordion .ui-accordion-icons .ui-accordion-icons {
padding-left: 2.2em;
}
.ui-accordion .ui-accordion-header .ui-accordion-header-icon {
position: absolute;
left: .5em;
top: 50%;
margin-top: -8px;
}
.ui-accordion .ui-accordion-content {
padding: 1em 2.2em;
border-top: 0;
overflow: auto;
}
.ui-autocomplete {
position: absolute;
top: 0;
left: 0;
cursor: default;
}
.ui-button {
display: inline-block;
position: relative;
padding: 0;
line-height: normal;
margin-right: .1em;
cursor: pointer;
vertical-align: middle;
text-align: center;
overflow: visible;
}
.ui-button,
.ui-button:link,
.ui-button:visited,
.ui-button:hover,
.ui-button:active {
text-decoration: none;
}
.ui-button-icon-only {
width: 2.2em;
}
button.ui-button-icon-only {
width: 2.4em;
}
.ui-button-icons-only {
width: 3.4em;
}
button.ui-button-icons-only {
width: 3.7em;
}
.ui-button .ui-button-text {
display: block;
line-height: normal;
}
.ui-button-text-only .ui-button-text {
padding: 0.4em 1em;
}
.ui-button-icon-only .ui-button-text,
.ui-button-icons-only .ui-button-text {
padding: .4em;
text-indent: -9999999px;
}
.ui-button-text-icon-primary .ui-button-text,
.ui-button-text-icons .ui-button-text {
padding: 0.4em 1em 0.4em 2.1em;
}
.ui-button-text-icon-secondary .ui-button-text,
.ui-button-text-icons .ui-button-text {
padding: 0.4em 2.1em 0.4em 1em;
}
.ui-button-text-icons .ui-button-text {
padding-left: 2.1em;
padding-right: 2.1em;
}
input.ui-button {
padding: 0.4em 1em;
}
.ui-button-icon-only .ui-icon,
.ui-button-text-icon-primary .ui-icon,
.ui-button-text-icon-secondary .ui-icon,
.ui-button-text-icons .ui-icon,
.ui-button-icons-only .ui-icon {
position: absolute;
top: 50%;
margin-top: -8px;
}
.ui-button-icon-only .ui-icon {
left: 50%;
margin-left: -8px;
}
.ui-button-text-icon-primary .ui-button-icon-primary,
.ui-button-text-icons .ui-button-icon-primary,
.ui-button-icons-only .ui-button-icon-primary {
left: .5em;
}
.ui-button-text-icon-secondary .ui-button-icon-secondary,
.ui-button-text-icons .ui-button-icon-secondary,
.ui-button-icons-only .ui-button-icon-secondary {
right: .5em;
}
.ui-buttonset {
margin-right: 7px;
}
.ui-buttonset .ui-button {
margin-left: 0;
margin-right: -.3em;
}
input.ui-button::-moz-focus-inner,
button.ui-button::-moz-focus-inner {
border: 0;
padding: 0;
}
.ui-datepicker {
width: 17em;
padding: .2em .2em 0;
display: none;
}
.ui-datepicker .ui-datepicker-header {
position: relative;
padding: 0.2em 0;
}
.ui-datepicker .ui-datepicker-prev,
.ui-datepicker .ui-datepicker-next {
position: absolute;
top: 2px;
width: 1.8em;
height: 1.8em;
}
.ui-datepicker .ui-datepicker-prev-hover,
.ui-datepicker .ui-datepicker-next-hover {
top: 1px;
}
.ui-datepicker .ui-datepicker-prev {
left: 2px;
}
.ui-datepicker .ui-datepicker-next {
right: 2px;
}
.ui-datepicker .ui-datepicker-prev-hover {
left: 1px;
}
.ui-datepicker .ui-datepicker-next-hover {
right: 1px;
}
.ui-datepicker .ui-datepicker-prev span,
.ui-datepicker .ui-datepicker-next span {
display: block;
position: absolute;
left: 50%;
margin-left: -8px;
top: 50%;
margin-top: -8px;
}
.ui-datepicker .ui-datepicker-title {
margin: 0 2.3em;
line-height: 1.8em;
text-align: center;
}
.ui-datepicker .ui-datepicker-title select {
font-size: 1em;
margin: 1px 0;
}
.ui-datepicker select.ui-datepicker-month,
.ui-datepicker select.ui-datepicker-year {
width: 49%;
}
.ui-datepicker table {
width: 100%;
font-size: .9em;
border-collapse: collapse;
margin: 0 0 0.4em;
}
.ui-datepicker th {
padding: .7em .3em;
text-align: center;
font-weight: bold;
border: 0;
}
.ui-datepicker td {
border: 0;
padding: 1px;
}
.ui-datepicker td span,
.ui-datepicker td a {
display: block;
padding: .2em;
text-align: right;
text-decoration: none;
}
.ui-datepicker .ui-datepicker-buttonpane {
background-image: none;
margin: .7em 0 0 0;
padding: 0 .2em;
border-left: 0;
border-right: 0;
border-bottom: 0;
}
.ui-datepicker .ui-datepicker-buttonpane button {
float: right;
margin: .5em .2em .4em;
cursor: pointer;
padding: .2em .6em .3em .6em;
width: auto;
overflow: visible;
}
.ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current {
float: left;
}
.ui-datepicker.ui-datepicker-multi {
width: auto;
}
.ui-datepicker-multi .ui-datepicker-group {
float: left;
}
.ui-datepicker-multi .ui-datepicker-group table {
width: 95%;
margin: 0 auto 0.4em;
}
.ui-datepicker-multi-2 .ui-datepicker-group {
width: 50%;
}
.ui-datepicker-multi-3 .ui-datepicker-group {
width: 33.3%;
}
.ui-datepicker-multi-4 .ui-datepicker-group {
width: 25%;
}
.ui-datepicker-multi .ui-datepicker-group-last .ui-datepicker-header,
.ui-datepicker-multi .ui-datepicker-group-middle .ui-datepicker-header {
border-left-width: 0;
}
.ui-datepicker-multi .ui-datepicker-buttonpane {
clear: left;
}
.ui-datepicker-row-break {
clear: both;
width: 100%;
font-size: 0;
}
.ui-datepicker-rtl {
direction: rtl;
}
.ui-datepicker-rtl .ui-datepicker-prev {
right: 2px;
left: auto;
}
.ui-datepicker-rtl .ui-datepicker-next {
left: 2px;
right: auto;
}
.ui-datepicker-rtl .ui-datepicker-prev:hover {
right: 1px;
left: auto;
}
.ui-datepicker-rtl .ui-datepicker-next:hover {
left: 1px;
right: auto;
}
.ui-datepicker-rtl .ui-datepicker-buttonpane {
clear: right;
}
.ui-datepicker-rtl .ui-datepicker-buttonpane button {
float: left;
}
.ui-datepicker-rtl .ui-datepicker-buttonpane button.ui-datepicker-current,
.ui-datepicker-rtl .ui-datepicker-group {
float: right;
}
.ui-datepicker-rtl .ui-datepicker-group-last .ui-datepicker-header,
.ui-datepicker-rtl .ui-datepicker-group-middle .ui-datepicker-header {
border-right-width: 0;
border-left-width: 1px;
}
.ui-dialog {
overflow: hidden;
position: absolute;
top: 0;
left: 0;
padding: .2em;
outline: 0;
}
.ui-dialog .ui-dialog-titlebar {
padding: .4em 1em;
position: relative;
}
.ui-dialog .ui-dialog-title {
float: left;
margin: .1em 0;
white-space: nowrap;
width: 90%;
overflow: hidden;
text-overflow: ellipsis;
}
.ui-dialog .ui-dialog-titlebar-close {
position: absolute;
right: .3em;
top: 50%;
width: 20px;
margin: -10px 0 0 0;
padding: 1px;
height: 20px;
}
.ui-dialog .ui-dialog-content {
position: relative;
border: 0;
padding: .5em 1em;
background: none;
overflow: auto;
}
.ui-dialog .ui-dialog-buttonpane {
text-align: left;
border-width: 1px 0 0 0;
background-image: none;
margin-top: .5em;
padding: 0.3em 1em 0.5em 0.4em;
}
.ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset {
float: right;
}
.ui-dialog .ui-dialog-buttonpane button {
margin: .5em .4em .5em 0;
cursor: pointer;
}
.ui-dialog .ui-resizable-se {
width: 12px;
height: 12px;
right: -5px;
bottom: -5px;
background-position: 16px 16px;
}
.ui-draggable .ui-dialog-titlebar {
cursor: move;
}
.ui-menu {
list-style: none;
padding: 2px;
margin: 0;
display: block;
outline: none;
}
.ui-menu .ui-menu {
margin-top: -3px;
position: absolute;
}
.ui-menu .ui-menu-item {
margin: 0;
padding: 0;
width: 100%;
list-style-image: url(data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7);
}
.ui-menu .ui-menu-divider {
margin: 5px -2px 5px -2px;
height: 0;
font-size: 0;
line-height: 0;
border-width: 1px 0 0 0;
}
.ui-menu .ui-menu-item a {
text-decoration: none;
display: block;
padding: 2px .4em;
line-height: 1.5;
min-height: 0;
font-weight: normal;
}
.ui-menu .ui-menu-item a.ui-state-focus,
.ui-menu .ui-menu-item a.ui-state-active {
font-weight: normal;
margin: -1px;
}
.ui-menu .ui-state-disabled {
font-weight: normal;
margin: .4em 0 .2em;
line-height: 1.5;
}
.ui-menu .ui-state-disabled a {
cursor: default;
}
.ui-menu-icons {
position: relative;
}
.ui-menu-icons .ui-menu-item a {
position: relative;
padding-left: 2em;
}
.ui-menu .ui-icon {
position: absolute;
top: .2em;
left: .2em;
}
.ui-menu .ui-menu-icon {
position: static;
float: right;
}
.ui-progressbar {
height: 2em;
text-align: left;
overflow: hidden;
}
.ui-progressbar .ui-progressbar-value {
margin: -1px;
height: 100%;
}
.ui-progressbar .ui-progressbar-overlay {
background: url('../../..//fileadmin/template/Resources/Public/less/jquery-ui/images/animated-overlay.gif');
height: 100%;
filter: alpha(opacity=25);
opacity: 0.25;
}
.ui-progressbar-indeterminate .ui-progressbar-value {
background-image: none;
}
.ui-slider {
position: relative;
text-align: left;
}
.ui-slider .ui-slider-handle {
position: absolute;
z-index: 2;
width: 1.2em;
height: 1.2em;
cursor: default;
}
.ui-slider .ui-slider-range {
position: absolute;
z-index: 1;
font-size: .7em;
display: block;
border: 0;
background-position: 0 0;
}
.ui-slider.ui-state-disabled .ui-slider-handle,
.ui-slider.ui-state-disabled .ui-slider-range {
filter: inherit;
}
.ui-slider-horizontal {
height: .8em;
}
.ui-slider-horizontal .ui-slider-handle {
top: -.3em;
margin-left: -.6em;
}
.ui-slider-horizontal .ui-slider-range {
top: 0;
height: 100%;
}
.ui-slider-horizontal .ui-slider-range-min {
left: 0;
}
.ui-slider-horizontal .ui-slider-range-max {
right: 0;
}
.ui-slider-vertical {
width: .8em;
height: 100px;
}
.ui-slider-vertical .ui-slider-handle {
left: -.3em;
margin-left: 0;
margin-bottom: -.6em;
}
.ui-slider-vertical .ui-slider-range {
left: 0;
width: 100%;
}
.ui-slider-vertical .ui-slider-range-min {
bottom: 0;
}
.ui-slider-vertical .ui-slider-range-max {
top: 0;
}
.ui-spinner {
position: relative;
display: inline-block;
overflow: hidden;
padding: 0;
vertical-align: middle;
}
.ui-spinner-input {
border: none;
background: none;
color: inherit;
padding: 0;
margin: .2em 0;
vertical-align: middle;
margin-left: .4em;
margin-right: 22px;
}
.ui-spinner-button {
width: 16px;
height: 50%;
font-size: .5em;
padding: 0;
margin: 0;
text-align: center;
position: absolute;
cursor: default;
display: block;
overflow: hidden;
right: 0;
}
.ui-spinner a.ui-spinner-button {
border-top: none;
border-bottom: none;
border-right: none;
}
.ui-spinner .ui-icon {
position: absolute;
margin-top: -8px;
top: 50%;
left: 0;
}
.ui-spinner-up {
top: 0;
}
.ui-spinner-down {
bottom: 0;
}
.ui-spinner .ui-icon-triangle-1-s {
background-position: -65px -16px;
}
.ui-tabs {
position: relative;
padding: .2em;
}
.ui-tabs .ui-tabs-nav {
margin: 0;
padding: 0.2em 0.2em 0;
}
.ui-tabs .ui-tabs-nav li {
list-style: none;
float: left;
position: relative;
top: 0;
margin: 1px .2em 0 0;
border-bottom-width: 0;
padding: 0;
white-space: nowrap;
}
.ui-tabs .ui-tabs-nav .ui-tabs-anchor {
float: left;
padding: .5em 1em;
text-decoration: none;
}
.ui-tabs .ui-tabs-nav li.ui-tabs-active {
margin-bottom: -1px;
padding-bottom: 1px;
}
.ui-tabs .ui-tabs-nav li.ui-tabs-active .ui-tabs-anchor,
.ui-tabs .ui-tabs-nav li.ui-state-disabled .ui-tabs-anchor,
.ui-tabs .ui-tabs-nav li.ui-tabs-loading .ui-tabs-anchor {
cursor: text;
}
.ui-tabs-collapsible .ui-tabs-nav li.ui-tabs-active .ui-tabs-anchor {
cursor: pointer;
}
.ui-tabs .ui-tabs-panel {
display: block;
border-width: 0;
padding: 1em 1.4em;
background: none;
}
.ui-tooltip {
padding: 8px;
position: absolute;
z-index: 9999;
max-width: 300px;
-webkit-box-shadow: 0 0 5px #aaa;
box-shadow: 0 0 5px #aaaaaa;
}
body .ui-tooltip {
border-width: 2px;
}
.ui-widget {
font-family: Verdana,Arial,sans-serif;
font-size: 1.1em;
}
.ui-widget .ui-widget {
font-size: 1em;
}
.ui-widget input,
.ui-widget select,
.ui-widget textarea,
.ui-widget button {
font-family: Verdana,Arial,sans-serif;
font-size: 1em;
}
.ui-widget-content {
border: 1px solid #aaa;
background: #ffffff url('../../..//fileadmin/template/Resources/Public/less/jquery-ui/images/ui-bg_flat_75_ffffff_40x100.png') 50% 50% repeat-x;
color: #222;
}
.ui-widget-content a {
color: #222;
}
.ui-widget-header {
border: 1px solid #aaa;
background: #cccccc url('../../..//fileadmin/template/Resources/Public/less/jquery-ui/images/ui-bg_highlight-soft_75_cccccc_1x100.png') 50% 50% repeat-x;
color: #222;
font-weight: bold;
}
.ui-widget-header a {
color: #222;
}
.ui-state-default,
.ui-widget-content .ui-state-default,
.ui-widget-header .ui-state-default {
border: 1px solid #d3d3d3;
background: #e6e6e6 url('../../..//fileadmin/template/Resources/Public/less/jquery-ui/images/ui-bg_glass_75_e6e6e6_1x400.png') 50% 50% repeat-x;
font-weight: normal;
color: #555;
}
.ui-state-default a,
.ui-state-default a:link,
.ui-state-default a:visited {
color: #555;
text-decoration: none;
}
.ui-state-hover,
.ui-widget-content .ui-state-hover,
.ui-widget-header .ui-state-hover,
.ui-state-focus,
.ui-widget-content .ui-state-focus,
.ui-widget-header .ui-state-focus {
border: 1px solid #999;
background: #dadada url('../../..//fileadmin/template/Resources/Public/less/jquery-ui/images/ui-bg_glass_75_dadada_1x400.png') 50% 50% repeat-x;
font-weight: normal;
color: #212121;
}
.ui-state-hover a,
.ui-state-hover a:hover,
.ui-state-hover a:link,
.ui-state-hover a:visited,
.ui-state-focus a,
.ui-state-focus a:hover,
.ui-state-focus a:link,
.ui-state-focus a:visited {
color: #212121;
text-decoration: none;
}
.ui-state-active,
.ui-widget-content .ui-state-active,
.ui-widget-header .ui-state-active {
border: 1px solid #aaa;
background: #ffffff url('../../..//fileadmin/template/Resources/Public/less/jquery-ui/images/ui-bg_glass_65_ffffff_1x400.png') 50% 50% repeat-x;
font-weight: normal;
color: #212121;
}
.ui-state-active a,
.ui-state-active a:link,
.ui-state-active a:visited {
color: #212121;
text-decoration: none;
}
.ui-state-highlight,
.ui-widget-content .ui-state-highlight,
.ui-widget-header .ui-state-highlight {
border: 1px solid #fcefa1;
background: #fbf9ee url('../../..//fileadmin/template/Resources/Public/less/jquery-ui/images/ui-bg_glass_55_fbf9ee_1x400.png') 50% 50% repeat-x;
color: #363636;
}
.ui-state-highlight a,
.ui-widget-content .ui-state-highlight a,
.ui-widget-header .ui-state-highlight a {
color: #363636;
}
.ui-state-error,
.ui-widget-content .ui-state-error,
.ui-widget-header .ui-state-error {
border: 1px solid #cd0a0a;
background: #fef1ec url('../../..//fileadmin/template/Resources/Public/less/jquery-ui/images/ui-bg_glass_95_fef1ec_1x400.png') 50% 50% repeat-x;
color: #cd0a0a;
}
.ui-state-error a,
.ui-widget-content .ui-state-error a,
.ui-widget-header .ui-state-error a {
color: #cd0a0a;
}
.ui-state-error-text,
.ui-widget-content .ui-state-error-text,
.ui-widget-header .ui-state-error-text {
color: #cd0a0a;
}
.ui-priority-primary,
.ui-widget-content .ui-priority-primary,
.ui-widget-header .ui-priority-primary {
font-weight: bold;
}
.ui-priority-secondary,
.ui-widget-content .ui-priority-secondary,
.ui-widget-header .ui-priority-secondary {
opacity: .7;
filter: alpha(opacity=70);
font-weight: normal;
}
.ui-state-disabled,
.ui-widget-content .ui-state-disabled,
.ui-widget-header .ui-state-disabled {
opacity: .35;
filter: alpha(opacity=35);
background-image: none;
}
.ui-state-disabled .ui-icon {
filter: alpha(opacity=35);
}
.ui-icon {
width: 16px;
height: 16px;
}
.ui-icon,
.ui-widget-content .ui-icon {
background-image: url('../../..//fileadmin/template/Resources/Public/less/jquery-ui/images/ui-icons_222222_256x240.png');
}
.ui-widget-header .ui-icon {
background-image: url('../../..//fileadmin/template/Resources/Public/less/jquery-ui/images/ui-icons_222222_256x240.png');
}
.ui-state-default .ui-icon {
background-image: url('../../..//fileadmin/template/Resources/Public/less/jquery-ui/images/ui-icons_888888_256x240.png');
}
.ui-state-hover .ui-icon,
.ui-state-focus .ui-icon {
background-image: url('../../..//fileadmin/template/Resources/Public/less/jquery-ui/images/ui-icons_454545_256x240.png');
}
.ui-state-active .ui-icon {
background-image: url('../../..//fileadmin/template/Resources/Public/less/jquery-ui/images/ui-icons_454545_256x240.png');
}
.ui-state-highlight .ui-icon {
background-image: url('../../..//fileadmin/template/Resources/Public/less/jquery-ui/images/ui-icons_2e83ff_256x240.png');
}
.ui-state-error .ui-icon,
.ui-state-error-text .ui-icon {
background-image: url('../../..//fileadmin/template/Resources/Public/less/jquery-ui/images/ui-icons_cd0a0a_256x240.png');
}
.ui-icon-blank {
background-position: 16px 16px;
}
.ui-icon-carat-1-n {
background-position: 0 0;
}
.ui-icon-carat-1-ne {
background-position: -16px 0;
}
.ui-icon-carat-1-e {
background-position: -32px 0;
}
.ui-icon-carat-1-se {
background-position: -48px 0;
}
.ui-icon-carat-1-s {
background-position: -64px 0;
}
.ui-icon-carat-1-sw {
background-position: -80px 0;
}
.ui-icon-carat-1-w {
background-position: -96px 0;
}
.ui-icon-carat-1-nw {
background-position: -112px 0;
}
.ui-icon-carat-2-n-s {
background-position: -128px 0;
}
.ui-icon-carat-2-e-w {
background-position: -144px 0;
}
.ui-icon-triangle-1-n {
background-position: 0 -16px;
}
.ui-icon-triangle-1-ne {
background-position: -16px -16px;
}
.ui-icon-triangle-1-e {
background-position: -32px -16px;
}
.ui-icon-triangle-1-se {
background-position: -48px -16px;
}
.ui-icon-triangle-1-s {
background-position: -64px -16px;
}
.ui-icon-triangle-1-sw {
background-position: -80px -16px;
}
.ui-icon-triangle-1-w {
background-position: -96px -16px;
}
.ui-icon-triangle-1-nw {
background-position: -112px -16px;
}
.ui-icon-triangle-2-n-s {
background-position: -128px -16px;
}
.ui-icon-triangle-2-e-w {
background-position: -144px -16px;
}
.ui-icon-arrow-1-n {
background-position: 0 -32px;
}
.ui-icon-arrow-1-ne {
background-position: -16px -32px;
}
.ui-icon-arrow-1-e {
background-position: -32px -32px;
}
.ui-icon-arrow-1-se {
background-position: -48px -32px;
}
.ui-icon-arrow-1-s {
background-position: -64px -32px;
}
.ui-icon-arrow-1-sw {
background-position: -80px -32px;
}
.ui-icon-arrow-1-w {
background-position: -96px -32px;
}
.ui-icon-arrow-1-nw {
background-position: -112px -32px;
}
.ui-icon-arrow-2-n-s {
background-position: -128px -32px;
}
.ui-icon-arrow-2-ne-sw {
background-position: -144px -32px;
}
.ui-icon-arrow-2-e-w {
background-position: -160px -32px;
}
.ui-icon-arrow-2-se-nw {
background-position: -176px -32px;
}
.ui-icon-arrowstop-1-n {
background-position: -192px -32px;
}
.ui-icon-arrowstop-1-e {
background-position: -208px -32px;
}
.ui-icon-arrowstop-1-s {
background-position: -224px -32px;
}
.ui-icon-arrowstop-1-w {
background-position: -240px -32px;
}
.ui-icon-arrowthick-1-n {
background-position: 0 -48px;
}
.ui-icon-arrowthick-1-ne {
background-position: -16px -48px;
}
.ui-icon-arrowthick-1-e {
background-position: -32px -48px;
}
.ui-icon-arrowthick-1-se {
background-position: -48px -48px;
}
.ui-icon-arrowthick-1-s {
background-position: -64px -48px;
}
.ui-icon-arrowthick-1-sw {
background-position: -80px -48px;
}
.ui-icon-arrowthick-1-w {
background-position: -96px -48px;
}
.ui-icon-arrowthick-1-nw {
background-position: -112px -48px;
}
.ui-icon-arrowthick-2-n-s {
background-position: -128px -48px;
}
.ui-icon-arrowthick-2-ne-sw {
background-position: -144px -48px;
}
.ui-icon-arrowthick-2-e-w {
background-position: -160px -48px;
}
.ui-icon-arrowthick-2-se-nw {
background-position: -176px -48px;
}
.ui-icon-arrowthickstop-1-n {
background-position: -192px -48px;
}
.ui-icon-arrowthickstop-1-e {
background-position: -208px -48px;
}
.ui-icon-arrowthickstop-1-s {
background-position: -224px -48px;
}
.ui-icon-arrowthickstop-1-w {
background-position: -240px -48px;
}
.ui-icon-arrowreturnthick-1-w {
background-position: 0 -64px;
}
.ui-icon-arrowreturnthick-1-n {
background-position: -16px -64px;
}
.ui-icon-arrowreturnthick-1-e {
background-position: -32px -64px;
}
.ui-icon-arrowreturnthick-1-s {
background-position: -48px -64px;
}
.ui-icon-arrowreturn-1-w {
background-position: -64px -64px;
}
.ui-icon-arrowreturn-1-n {
background-position: -80px -64px;
}
.ui-icon-arrowreturn-1-e {
background-position: -96px -64px;
}
.ui-icon-arrowreturn-1-s {
background-position: -112px -64px;
}
.ui-icon-arrowrefresh-1-w {
background-position: -128px -64px;
}
.ui-icon-arrowrefresh-1-n {
background-position: -144px -64px;
}
.ui-icon-arrowrefresh-1-e {
background-position: -160px -64px;
}
.ui-icon-arrowrefresh-1-s {
background-position: -176px -64px;
}
.ui-icon-arrow-4 {
background-position: 0 -80px;
}
.ui-icon-arrow-4-diag {
background-position: -16px -80px;
}
.ui-icon-extlink {
background-position: -32px -80px;
}
.ui-icon-newwin {
background-position: -48px -80px;
}
.ui-icon-refresh {
background-position: -64px -80px;
}
.ui-icon-shuffle {
background-position: -80px -80px;
}
.ui-icon-transfer-e-w {
background-position: -96px -80px;
}
.ui-icon-transferthick-e-w {
background-position: -112px -80px;
}
.ui-icon-folder-collapsed {
background-position: 0 -96px;
}
.ui-icon-folder-open {
background-position: -16px -96px;
}
.ui-icon-document {
background-position: -32px -96px;
}
.ui-icon-document-b {
background-position: -48px -96px;
}
.ui-icon-note {
background-position: -64px -96px;
}
.ui-icon-mail-closed {
background-position: -80px -96px;
}
.ui-icon-mail-open {
background-position: -96px -96px;
}
.ui-icon-suitcase {
background-position: -112px -96px;
}
.ui-icon-comment {
background-position: -128px -96px;
}
.ui-icon-person {
background-position: -144px -96px;
}
.ui-icon-print {
background-position: -160px -96px;
}
.ui-icon-trash {
background-position: -176px -96px;
}
.ui-icon-locked {
background-position: -192px -96px;
}
.ui-icon-unlocked {
background-position: -208px -96px;
}
.ui-icon-bookmark {
background-position: -224px -96px;
}
.ui-icon-tag {
background-position: -240px -96px;
}
.ui-icon-home {
background-position: 0 -112px;
}
.ui-icon-flag {
background-position: -16px -112px;
}
.ui-icon-calendar {
background-position: -32px -112px;
}
.ui-icon-cart {
background-position: -48px -112px;
}
.ui-icon-pencil {
background-position: -64px -112px;
}
.ui-icon-clock {
background-position: -80px -112px;
}
.ui-icon-disk {
background-position: -96px -112px;
}
.ui-icon-calculator {
background-position: -112px -112px;
}
.ui-icon-zoomin {
background-position: -128px -112px;
}
.ui-icon-zoomout {
background-position: -144px -112px;
}
.ui-icon-search {
background-position: -160px -112px;
}
.ui-icon-wrench {
background-position: -176px -112px;
}
.ui-icon-gear {
background-position: -192px -112px;
}
.ui-icon-heart {
background-position: -208px -112px;
}
.ui-icon-star {
background-position: -224px -112px;
}
.ui-icon-link {
background-position: -240px -112px;
}
.ui-icon-cancel {
background-position: 0 -128px;
}
.ui-icon-plus {
background-position: -16px -128px;
}
.ui-icon-plusthick {
background-position: -32px -128px;
}
.ui-icon-minus {
background-position: -48px -128px;
}
.ui-icon-minusthick {
background-position: -64px -128px;
}
.ui-icon-close {
background-position: -80px -128px;
}
.ui-icon-closethick {
background-position: -96px -128px;
}
.ui-icon-key {
background-position: -112px -128px;
}
.ui-icon-lightbulb {
background-position: -128px -128px;
}
.ui-icon-scissors {
background-position: -144px -128px;
}
.ui-icon-clipboard {
background-position: -160px -128px;
}
.ui-icon-copy {
background-position: -176px -128px;
}
.ui-icon-contact {
background-position: -192px -128px;
}
.ui-icon-image {
background-position: -208px -128px;
}
.ui-icon-video {
background-position: -224px -128px;
}
.ui-icon-script {
background-position: -240px -128px;
}
.ui-icon-alert {
background-position: 0 -144px;
}
.ui-icon-info {
background-position: -16px -144px;
}
.ui-icon-notice {
background-position: -32px -144px;
}
.ui-icon-help {
background-position: -48px -144px;
}
.ui-icon-check {
background-position: -64px -144px;
}
.ui-icon-bullet {
background-position: -80px -144px;
}
.ui-icon-radio-on {
background-position: -96px -144px;
}
.ui-icon-radio-off {
background-position: -112px -144px;
}
.ui-icon-pin-w {
background-position: -128px -144px;
}
.ui-icon-pin-s {
background-position: -144px -144px;
}
.ui-icon-play {
background-position: 0 -160px;
}
.ui-icon-pause {
background-position: -16px -160px;
}
.ui-icon-seek-next {
background-position: -32px -160px;
}
.ui-icon-seek-prev {
background-position: -48px -160px;
}
.ui-icon-seek-end {
background-position: -64px -160px;
}
.ui-icon-seek-start {
background-position: -80px -160px;
}
.ui-icon-seek-first {
background-position: -80px -160px;
}
.ui-icon-stop {
background-position: -96px -160px;
}
.ui-icon-eject {
background-position: -112px -160px;
}
.ui-icon-volume-off {
background-position: -128px -160px;
}
.ui-icon-volume-on {
background-position: -144px -160px;
}
.ui-icon-power {
background-position: 0 -176px;
}
.ui-icon-signal-diag {
background-position: -16px -176px;
}
.ui-icon-signal {
background-position: -32px -176px;
}
.ui-icon-battery-0 {
background-position: -48px -176px;
}
.ui-icon-battery-1 {
background-position: -64px -176px;
}
.ui-icon-battery-2 {
background-position: -80px -176px;
}
.ui-icon-battery-3 {
background-position: -96px -176px;
}
.ui-icon-circle-plus {
background-position: 0 -192px;
}
.ui-icon-circle-minus {
background-position: -16px -192px;
}
.ui-icon-circle-close {
background-position: -32px -192px;
}
.ui-icon-circle-triangle-e {
background-position: -48px -192px;
}
.ui-icon-circle-triangle-s {
background-position: -64px -192px;
}
.ui-icon-circle-triangle-w {
background-position: -80px -192px;
}
.ui-icon-circle-triangle-n {
background-position: -96px -192px;
}
.ui-icon-circle-arrow-e {
background-position: -112px -192px;
}
.ui-icon-circle-arrow-s {
background-position: -128px -192px;
}
.ui-icon-circle-arrow-w {
background-position: -144px -192px;
}
.ui-icon-circle-arrow-n {
background-position: -160px -192px;
}
.ui-icon-circle-zoomin {
background-position: -176px -192px;
}
.ui-icon-circle-zoomout {
background-position: -192px -192px;
}
.ui-icon-circle-check {
background-position: -208px -192px;
}
.ui-icon-circlesmall-plus {
background-position: 0 -208px;
}
.ui-icon-circlesmall-minus {
background-position: -16px -208px;
}
.ui-icon-circlesmall-close {
background-position: -32px -208px;
}
.ui-icon-squaresmall-plus {
background-position: -48px -208px;
}
.ui-icon-squaresmall-minus {
background-position: -64px -208px;
}
.ui-icon-squaresmall-close {
background-position: -80px -208px;
}
.ui-icon-grip-dotted-vertical {
background-position: 0 -224px;
}
.ui-icon-grip-dotted-horizontal {
background-position: -16px -224px;
}
.ui-icon-grip-solid-vertical {
background-position: -32px -224px;
}
.ui-icon-grip-solid-horizontal {
background-position: -48px -224px;
}
.ui-icon-gripsmall-diagonal-se {
background-position: -64px -224px;
}
.ui-icon-grip-diagonal-se {
background-position: -80px -224px;
}
.ui-corner-all,
.ui-corner-top,
.ui-corner-left,
.ui-corner-tl {
border-top-left-radius: 4px;
}
.ui-corner-all,
.ui-corner-top,
.ui-corner-right,
.ui-corner-tr {
border-top-right-radius: 4px;
}
.ui-corner-all,
.ui-corner-bottom,
.ui-corner-left,
.ui-corner-bl {
border-bottom-left-radius: 4px;
}
.ui-corner-all,
.ui-corner-bottom,
.ui-corner-right,
.ui-corner-br {
border-bottom-right-radius: 4px;
}
.ui-widget-overlay {
background: #aaaaaa url('../../..//fileadmin/template/Resources/Public/less/jquery-ui/images/ui-bg_flat_0_aaaaaa_40x100.png') 50% 50% repeat-x;
opacity: .3;
filter: alpha(opacity=30);
}
.ui-widget-shadow {
margin: -8px 0 0 -8px;
padding: 8px;
background: #aaaaaa url('../../..//fileadmin/template/Resources/Public/less/jquery-ui/images/ui-bg_flat_0_aaaaaa_40x100.png') 50% 50% repeat-x;
opacity: .3;
filter: alpha(opacity=30);
border-radius: 8px;
}
.ui-datepicker td,
.ui-datepicker th {
font-size: 1em;
}
/*** https://tympanus.net/codrops/2013/05/07/a-collection-of-page-transitions/ ***/
html {
overflow-x: hidden;
}
/* loading option */
.js .go-page-transition-loading,
.js .go-page-transition-loading:after {
width: 32px;
height: 32px;
position: fixed;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
border-radius: 50%;
z-index: 1000000;
pointer-events: none;
}
.js .go-page-transition-loading {
background-color: transparent;
border-top: 5px solid rgba(0, 0, 0, 0.2);
border-right: 5px solid rgba(0, 0, 0, 0.2);
border-bottom: 5px solid rgba(0, 0, 0, 0.2);
border-left: 5px solid #eee;
-webkit-transform: translateZ(0);
transform: translateZ(0);
-webkit-animation-iteration-count: infinite;
animation-iteration-count: infinite;
-webkit-animation-timing-function: linear;
animation-timing-function: linear;
-webkit-animation-duration: .8s;
animation-duration: .8s;
-webkit-animation-name: animsition-loading;
animation-name: animsition-loading;
}
@-webkit-keyframes animsition-loading {
0% {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
100% {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes animsition-loading {
0% {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
100% {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
/* animation sets */
.js .go-page-transition-fadeOut {
opacity: 0;
-webkit-transition: all 3.6s ease;
transition: all 3.6s ease;
}
.js .go-page-transition-fadeIn {
opacity: 1;
-webkit-transition: all 3.6s ease;
transition: all 3.6s ease;
}
/* move from / to */
.js .go-page-transition-moveToLeft {
-webkit-animation: moveToLeft .6s ease both;
animation: moveToLeft .6s ease both;
}
.js .go-page-transition-moveFromLeft {
-webkit-animation: moveFromLeft .6s ease both;
animation: moveFromLeft .6s ease both;
}
.js .go-page-transition-moveToRight {
-webkit-animation: moveToRight .6s ease both;
animation: moveToRight .6s ease both;
}
.js .go-page-transition-moveFromRight {
-webkit-animation: moveFromRight .6s ease both;
animation: moveFromRight .6s ease both;
}
.js .go-page-transition-moveToTop {
-webkit-animation: moveToTop .6s ease both;
animation: moveToTop .6s ease both;
}
.js .go-page-transition-moveFromTop {
-webkit-animation: moveFromTop .6s ease both;
animation: moveFromTop .6s ease both;
}
.js .go-page-transition-moveToBottom {
-webkit-animation: moveToBottom .6s ease both;
animation: moveToBottom .6s ease both;
}
.js .go-page-transition-moveFromBottom {
-webkit-animation: moveFromBottom .6s ease both;
animation: moveFromBottom .6s ease both;
}
/* fade */
.js .go-page-transition-fade {
-webkit-animation: fade .7s ease both;
animation: fade .7s ease both;
}
/* move from / to and fade */
.js .go-page-transition-moveToLeftFade {
-webkit-animation: moveToLeftFade .7s ease both;
animation: moveToLeftFade .7s ease both;
}
.js .go-page-transition-moveFromLeftFade {
-webkit-animation: moveFromLeftFade .7s ease both;
animation: moveFromLeftFade .7s ease both;
}
.js .go-page-transition-moveToRightFade {
-webkit-animation: moveToRightFade .7s ease both;
animation: moveToRightFade .7s ease both;
}
.js .go-page-transition-moveFromRightFade {
-webkit-animation: moveFromRightFade .7s ease both;
animation: moveFromRightFade .7s ease both;
}
.js .go-page-transition-moveToTopFade {
-webkit-animation: moveToTopFade .7s ease both;
animation: moveToTopFade .7s ease both;
}
.js .go-page-transition-moveFromTopFade {
-webkit-animation: moveFromTopFade .7s ease both;
animation: moveFromTopFade .7s ease both;
}
.js .go-page-transition-moveToBottomFade {
-webkit-animation: moveToBottomFade .7s ease both;
animation: moveToBottomFade .7s ease both;
}
.js .go-page-transition-moveFromBottomFade {
-webkit-animation: moveFromBottomFade .7s ease both;
animation: moveFromBottomFade .7s ease both;
}
/* move to with different easing */
.js .go-page-transition-moveToLeftEasing {
-webkit-animation: moveToLeft 0.7s ease-in-out both;
animation: moveToLeft 0.7s ease-in-out both;
}
.js .go-page-transition-moveToRightEasing {
-webkit-animation: moveToRight 0.7s ease-in-out both;
animation: moveToRight 0.7s ease-in-out both;
}
.js .go-page-transition-moveToTopEasing {
-webkit-animation: moveToTop 0.7s ease-in-out both;
animation: moveToTop 0.7s ease-in-out both;
}
.js .go-page-transition-moveToBottomEasing {
-webkit-animation: moveToBottom 0.7s ease-in-out both;
animation: moveToBottom 0.7s ease-in-out both;
}
/********************************* keyframes **************************************/
@-webkit-keyframes fadeIn {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes fadeIn {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
/* move from / to */
@-webkit-keyframes moveToLeft {
to {
-webkit-transform: translateX(-100%);
}
}
@keyframes moveToLeft {
to {
-webkit-transform: translateX(-100%);
transform: translateX(-100%);
}
}
@-webkit-keyframes moveFromLeft {
from {
-webkit-transform: translateX(-100%);
}
}
@keyframes moveFromLeft {
from {
-webkit-transform: translateX(-100%);
transform: translateX(-100%);
}
}
@-webkit-keyframes moveToRight {
to {
-webkit-transform: translateX(100%);
}
}
@keyframes moveToRight {
to {
-webkit-transform: translateX(100%);
transform: translateX(100%);
}
}
@-webkit-keyframes moveFromRight {
from {
-webkit-transform: translateX(100%);
}
}
@keyframes moveFromRight {
from {
-webkit-transform: translateX(100%);
transform: translateX(100%);
}
}
@-webkit-keyframes moveToTop {
to {
-webkit-transform: translateY(-100%);
}
}
@keyframes moveToTop {
to {
-webkit-transform: translateY(-100%);
transform: translateY(-100%);
}
}
@-webkit-keyframes moveFromTop {
from {
-webkit-transform: translateY(-100%);
}
}
@keyframes moveFromTop {
from {
-webkit-transform: translateY(-100%);
transform: translateY(-100%);
}
}
@-webkit-keyframes moveToBottom {
to {
-webkit-transform: translateY(100%);
}
}
@keyframes moveToBottom {
to {
-webkit-transform: translateY(100%);
transform: translateY(100%);
}
}
@-webkit-keyframes moveFromBottom {
from {
-webkit-transform: translateY(100%);
}
}
@keyframes moveFromBottom {
from {
-webkit-transform: translateY(100%);
transform: translateY(100%);
}
}
/* fade */
@-webkit-keyframes fade {
to {
opacity: 0.3;
}
}
@keyframes fade {
to {
opacity: 0.3;
}
}
/* move from / to and fade */
@-webkit-keyframes moveToLeftFade {
to {
opacity: 0.3;
-webkit-transform: translateX(-100%);
}
}
@keyframes moveToLeftFade {
to {
opacity: 0.3;
-webkit-transform: translateX(-100%);
transform: translateX(-100%);
}
}
@-webkit-keyframes moveFromLeftFade {
from {
opacity: 0.3;
-webkit-transform: translateX(-100%);
}
}
@keyframes moveFromLeftFade {
from {
opacity: 0.3;
-webkit-transform: translateX(-100%);
transform: translateX(-100%);
}
}
@-webkit-keyframes moveToRightFade {
to {
opacity: 0.3;
-webkit-transform: translateX(100%);
}
}
@keyframes moveToRightFade {
to {
opacity: 0.3;
-webkit-transform: translateX(100%);
transform: translateX(100%);
}
}
@-webkit-keyframes moveFromRightFade {
from {
opacity: 0.3;
-webkit-transform: translateX(100%);
}
}
@keyframes moveFromRightFade {
from {
opacity: 0.3;
-webkit-transform: translateX(100%);
transform: translateX(100%);
}
}
@-webkit-keyframes moveToTopFade {
to {
opacity: 0.3;
-webkit-transform: translateY(-100%);
}
}
@keyframes moveToTopFade {
to {
opacity: 0.3;
-webkit-transform: translateY(-100%);
transform: translateY(-100%);
}
}
@-webkit-keyframes moveFromTopFade {
from {
opacity: 0.3;
-webkit-transform: translateY(-100%);
}
}
@keyframes moveFromTopFade {
from {
opacity: 0.3;
-webkit-transform: translateY(-100%);
transform: translateY(-100%);
}
}
@-webkit-keyframes moveToBottomFade {
to {
opacity: 0.3;
-webkit-transform: translateY(100%);
}
}
@keyframes moveToBottomFade {
to {
opacity: 0.3;
-webkit-transform: translateY(100%);
transform: translateY(100%);
}
}
@-webkit-keyframes moveFromBottomFade {
from {
opacity: 0.3;
-webkit-transform: translateY(100%);
}
}
@keyframes moveFromBottomFade {
from {
opacity: 0.3;
-webkit-transform: translateY(100%);
transform: translateY(100%);
}
}
/* scale and fade */
.js .go-page-transition-scaleDown {
-webkit-animation: scaleDown .7s ease both;
animation: scaleDown .7s ease both;
}
.js .go-page-transition-scaleUp {
-webkit-animation: scaleUp .7s ease both;
animation: scaleUp .7s ease both;
}
.js .go-page-transition-scaleUpDown {
-webkit-animation: scaleUpDown .5s ease both;
animation: scaleUpDown .5s ease both;
}
.js .go-page-transition-scaleDownUp {
-webkit-animation: scaleDownUp .5s ease both;
animation: scaleDownUp .5s ease both;
}
.js .go-page-transition-scaleDownCenter {
-webkit-animation: scaleDownCenter 0.4s ease-in both;
animation: scaleDownCenter 0.4s ease-in both;
}
.js .go-page-transition-scaleUpCenter {
-webkit-animation: scaleUpCenter 0.4s ease-out both;
animation: scaleUpCenter 0.4s ease-out both;
}
/********************************* keyframes **************************************/
/* scale and fade */
@-webkit-keyframes scaleDown {
to {
opacity: 0;
-webkit-transform: scale(0.8);
}
}
@keyframes scaleDown {
to {
opacity: 0;
-webkit-transform: scale(0.8);
transform: scale(0.8);
}
}
@-webkit-keyframes scaleUp {
from {
opacity: 0;
-webkit-transform: scale(0.8);
}
}
@keyframes scaleUp {
from {
opacity: 0;
-webkit-transform: scale(0.8);
transform: scale(0.8);
}
}
@-webkit-keyframes scaleUpDown {
from {
opacity: 0;
-webkit-transform: scale(1.2);
}
}
@keyframes scaleUpDown {
from {
opacity: 0;
-webkit-transform: scale(1.2);
transform: scale(1.2);
}
}
@-webkit-keyframes scaleDownUp {
to {
opacity: 0;
-webkit-transform: scale(1.2);
}
}
@keyframes scaleDownUp {
to {
opacity: 0;
-webkit-transform: scale(1.2);
transform: scale(1.2);
}
}
@-webkit-keyframes scaleDownCenter {
to {
opacity: 0;
-webkit-transform: scale(0.7);
}
}
@keyframes scaleDownCenter {
to {
opacity: 0;
-webkit-transform: scale(0.7);
transform: scale(0.7);
}
}
@-webkit-keyframes scaleUpCenter {
from {
opacity: 0;
-webkit-transform: scale(0.7);
}
}
@keyframes scaleUpCenter {
from {
opacity: 0;
-webkit-transform: scale(0.7);
transform: scale(0.7);
}
}
/* rotate sides first and scale */
.js .go-page-transition-rotateRightSideFirst {
-webkit-transform-origin: 0% 50%;
transform-origin: 0% 50%;
-webkit-animation: rotateRightSideFirst 0.8s both ease-in;
animation: rotateRightSideFirst 0.8s both ease-in;
}
.js .go-page-transition-rotateLeftSideFirst {
-webkit-transform-origin: 100% 50%;
transform-origin: 100% 50%;
-webkit-animation: rotateLeftSideFirst 0.8s both ease-in;
animation: rotateLeftSideFirst 0.8s both ease-in;
}
.js .go-page-transition-rotateTopSideFirst {
-webkit-transform-origin: 50% 100%;
transform-origin: 50% 100%;
-webkit-animation: rotateTopSideFirst 0.8s both ease-in;
animation: rotateTopSideFirst 0.8s both ease-in;
}
.js .go-page-transition-rotateBottomSideFirst {
-webkit-transform-origin: 50% 0%;
transform-origin: 50% 0%;
-webkit-animation: rotateBottomSideFirst 0.8s both ease-in;
animation: rotateBottomSideFirst 0.8s both ease-in;
}
/* flip */
.js .go-page-transition-flipOutRight {
-webkit-transform-origin: 50% 50%;
transform-origin: 50% 50%;
-webkit-animation: flipOutRight 0.5s both ease-in;
animation: flipOutRight 0.5s both ease-in;
}
.js .go-page-transition-flipInLeft {
-webkit-transform-origin: 50% 50%;
transform-origin: 50% 50%;
-webkit-animation: flipInLeft 0.5s both ease-out;
animation: flipInLeft 0.5s both ease-out;
}
.js .go-page-transition-flipOutLeft {
-webkit-transform-origin: 50% 50%;
transform-origin: 50% 50%;
-webkit-animation: flipOutLeft 0.5s both ease-in;
animation: flipOutLeft 0.5s both ease-in;
}
.js .go-page-transition-flipInRight {
-webkit-transform-origin: 50% 50%;
transform-origin: 50% 50%;
-webkit-animation: flipInRight 0.5s both ease-out;
animation: flipInRight 0.5s both ease-out;
}
.js .go-page-transition-flipOutTop {
-webkit-transform-origin: 50% 50%;
transform-origin: 50% 50%;
-webkit-animation: flipOutTop 0.5s both ease-in;
animation: flipOutTop 0.5s both ease-in;
}
.js .go-page-transition-flipInBottom {
-webkit-transform-origin: 50% 50%;
transform-origin: 50% 50%;
-webkit-animation: flipInBottom 0.5s both ease-out;
animation: flipInBottom 0.5s both ease-out;
}
.js .go-page-transition-flipOutBottom {
-webkit-transform-origin: 50% 50%;
transform-origin: 50% 50%;
-webkit-animation: flipOutBottom 0.5s both ease-in;
animation: flipOutBottom 0.5s both ease-in;
}
.js .go-page-transition-flipInTop {
-webkit-transform-origin: 50% 50%;
transform-origin: 50% 50%;
-webkit-animation: flipInTop 0.5s both ease-out;
animation: flipInTop 0.5s both ease-out;
}
/* rotate fall */
.js .go-page-transition-rotateFall {
-webkit-transform-origin: 0% 0%;
transform-origin: 0% 0%;
-webkit-animation: rotateFall 1s both ease-in;
animation: rotateFall 1s both ease-in;
}
/* rotate newspaper */
.js .go-page-transition-rotateOutNewspaper {
-webkit-transform-origin: 50% 50%;
transform-origin: 50% 50%;
-webkit-animation: rotateOutNewspaper 0.5s both ease-in;
animation: rotateOutNewspaper 0.5s both ease-in;
}
.js .go-page-transition-rotateInNewspaper {
-webkit-transform-origin: 50% 50%;
transform-origin: 50% 50%;
-webkit-animation: rotateInNewspaper 0.5s both ease-out;
animation: rotateInNewspaper 0.5s both ease-out;
}
/* push */
.js .go-page-transition-rotatePushLeft {
-webkit-transform-origin: 0% 50%;
transform-origin: 0% 50%;
-webkit-animation: rotatePushLeft .8s both ease;
animation: rotatePushLeft .8s both ease;
}
.js .go-page-transition-rotatePushRight {
-webkit-transform-origin: 100% 50%;
transform-origin: 100% 50%;
-webkit-animation: rotatePushRight .8s both ease;
animation: rotatePushRight .8s both ease;
}
.js .go-page-transition-rotatePushTop {
-webkit-transform-origin: 50% 0%;
transform-origin: 50% 0%;
-webkit-animation: rotatePushTop .8s both ease;
animation: rotatePushTop .8s both ease;
}
.js .go-page-transition-rotatePushBottom {
-webkit-transform-origin: 50% 100%;
transform-origin: 50% 100%;
-webkit-animation: rotatePushBottom .8s both ease;
animation: rotatePushBottom .8s both ease;
}
/* pull */
.js .go-page-transition-rotatePullRight {
-webkit-transform-origin: 100% 50%;
transform-origin: 100% 50%;
-webkit-animation: rotatePullRight .5s both ease;
animation: rotatePullRight .5s both ease;
}
.js .go-page-transition-rotatePullLeft {
-webkit-transform-origin: 0% 50%;
transform-origin: 0% 50%;
-webkit-animation: rotatePullLeft .5s both ease;
animation: rotatePullLeft .5s both ease;
}
.js .go-page-transition-rotatePullTop {
-webkit-transform-origin: 50% 0%;
transform-origin: 50% 0%;
-webkit-animation: rotatePullTop .5s both ease;
animation: rotatePullTop .5s both ease;
}
.js .go-page-transition-rotatePullBottom {
-webkit-transform-origin: 50% 100%;
transform-origin: 50% 100%;
-webkit-animation: rotatePullBottom .5s both ease;
animation: rotatePullBottom .5s both ease;
}
/* fold */
.js .go-page-transition-rotateFoldRight {
-webkit-transform-origin: 0% 50%;
transform-origin: 0% 50%;
-webkit-animation: rotateFoldRight .7s both ease;
animation: rotateFoldRight .7s both ease;
}
.js .go-page-transition-rotateFoldLeft {
-webkit-transform-origin: 100% 50%;
transform-origin: 100% 50%;
-webkit-animation: rotateFoldLeft .7s both ease;
animation: rotateFoldLeft .7s both ease;
}
.js .go-page-transition-rotateFoldTop {
-webkit-transform-origin: 50% 100%;
transform-origin: 50% 100%;
-webkit-animation: rotateFoldTop .7s both ease;
animation: rotateFoldTop .7s both ease;
}
.js .go-page-transition-rotateFoldBottom {
-webkit-transform-origin: 50% 0%;
transform-origin: 50% 0%;
-webkit-animation: rotateFoldBottom .7s both ease;
animation: rotateFoldBottom .7s both ease;
}
/* unfold */
.js .go-page-transition-rotateUnfoldLeft {
-webkit-transform-origin: 100% 50%;
transform-origin: 100% 50%;
-webkit-animation: rotateUnfoldLeft .7s both ease;
animation: rotateUnfoldLeft .7s both ease;
}
.js .go-page-transition-rotateUnfoldRight {
-webkit-transform-origin: 0% 50%;
transform-origin: 0% 50%;
-webkit-animation: rotateUnfoldRight .7s both ease;
animation: rotateUnfoldRight .7s both ease;
}
.js .go-page-transition-rotateUnfoldTop {
-webkit-transform-origin: 50% 100%;
transform-origin: 50% 100%;
-webkit-animation: rotateUnfoldTop .7s both ease;
animation: rotateUnfoldTop .7s both ease;
}
.js .go-page-transition-rotateUnfoldBottom {
-webkit-transform-origin: 50% 0%;
transform-origin: 50% 0%;
-webkit-animation: rotateUnfoldBottom .7s both ease;
animation: rotateUnfoldBottom .7s both ease;
}
/* room walls */
.js .go-page-transition-rotateRoomLeftOut {
-webkit-transform-origin: 100% 50%;
transform-origin: 100% 50%;
-webkit-animation: rotateRoomLeftOut .8s both ease;
animation: rotateRoomLeftOut .8s both ease;
}
.js .go-page-transition-rotateRoomLeftIn {
-webkit-transform-origin: 0% 50%;
transform-origin: 0% 50%;
-webkit-animation: rotateRoomLeftIn .8s both ease;
animation: rotateRoomLeftIn .8s both ease;
}
.js .go-page-transition-rotateRoomRightOut {
-webkit-transform-origin: 0% 50%;
transform-origin: 0% 50%;
-webkit-animation: rotateRoomRightOut .8s both ease;
animation: rotateRoomRightOut .8s both ease;
}
.js .go-page-transition-rotateRoomRightIn {
-webkit-transform-origin: 100% 50%;
transform-origin: 100% 50%;
-webkit-animation: rotateRoomRightIn .8s both ease;
animation: rotateRoomRightIn .8s both ease;
}
.js .go-page-transition-rotateRoomTopOut {
-webkit-transform-origin: 50% 100%;
transform-origin: 50% 100%;
-webkit-animation: rotateRoomTopOut .8s both ease;
animation: rotateRoomTopOut .8s both ease;
}
.js .go-page-transition-rotateRoomTopIn {
-webkit-transform-origin: 50% 0%;
transform-origin: 50% 0%;
-webkit-animation: rotateRoomTopIn .8s both ease;
animation: rotateRoomTopIn .8s both ease;
}
.js .go-page-transition-rotateRoomBottomOut {
-webkit-transform-origin: 50% 0%;
transform-origin: 50% 0%;
-webkit-animation: rotateRoomBottomOut .8s both ease;
animation: rotateRoomBottomOut .8s both ease;
}
.js .go-page-transition-rotateRoomBottomIn {
-webkit-transform-origin: 50% 100%;
transform-origin: 50% 100%;
-webkit-animation: rotateRoomBottomIn .8s both ease;
animation: rotateRoomBottomIn .8s both ease;
}
/* cube */
.js .go-page-transition-rotateCubeLeftOut {
-webkit-transform-origin: 100% 50%;
transform-origin: 100% 50%;
-webkit-animation: rotateCubeLeftOut 0.6s both ease-in;
animation: rotateCubeLeftOut 0.6s both ease-in;
}
.js .go-page-transition-rotateCubeLeftIn {
-webkit-transform-origin: 0% 50%;
transform-origin: 0% 50%;
-webkit-animation: rotateCubeLeftIn 0.6s both ease-in;
animation: rotateCubeLeftIn 0.6s both ease-in;
}
.js .go-page-transition-rotateCubeRightOut {
-webkit-transform-origin: 0% 50%;
transform-origin: 0% 50%;
-webkit-animation: rotateCubeRightOut 0.6s both ease-in;
animation: rotateCubeRightOut 0.6s both ease-in;
}
.js .go-page-transition-rotateCubeRightIn {
-webkit-transform-origin: 100% 50%;
transform-origin: 100% 50%;
-webkit-animation: rotateCubeRightIn 0.6s both ease-in;
animation: rotateCubeRightIn 0.6s both ease-in;
}
.js .go-page-transition-rotateCubeTopOut {
-webkit-transform-origin: 50% 100%;
transform-origin: 50% 100%;
-webkit-animation: rotateCubeTopOut 0.6s both ease-in;
animation: rotateCubeTopOut 0.6s both ease-in;
}
.js .go-page-transition-rotateCubeTopIn {
-webkit-transform-origin: 50% 0%;
transform-origin: 50% 0%;
-webkit-animation: rotateCubeTopIn 0.6s both ease-in;
animation: rotateCubeTopIn 0.6s both ease-in;
}
.js .go-page-transition-rotateCubeBottomOut {
-webkit-transform-origin: 50% 0%;
transform-origin: 50% 0%;
-webkit-animation: rotateCubeBottomOut 0.6s both ease-in;
animation: rotateCubeBottomOut 0.6s both ease-in;
}
.js .go-page-transition-rotateCubeBottomIn {
-webkit-transform-origin: 50% 100%;
transform-origin: 50% 100%;
-webkit-animation: rotateCubeBottomIn 0.6s both ease-in;
animation: rotateCubeBottomIn 0.6s both ease-in;
}
/* carousel */
.js .go-page-transition-rotateCarouselLeftOut {
-webkit-transform-origin: 100% 50%;
transform-origin: 100% 50%;
-webkit-animation: rotateCarouselLeftOut .8s both ease;
animation: rotateCarouselLeftOut .8s both ease;
}
.js .go-page-transition-rotateCarouselLeftIn {
-webkit-transform-origin: 0% 50%;
transform-origin: 0% 50%;
-webkit-animation: rotateCarouselLeftIn .8s both ease;
animation: rotateCarouselLeftIn .8s both ease;
}
.js .go-page-transition-rotateCarouselRightOut {
-webkit-transform-origin: 0% 50%;
transform-origin: 0% 50%;
-webkit-animation: rotateCarouselRightOut .8s both ease;
animation: rotateCarouselRightOut .8s both ease;
}
.js .go-page-transition-rotateCarouselRightIn {
-webkit-transform-origin: 100% 50%;
transform-origin: 100% 50%;
-webkit-animation: rotateCarouselRightIn .8s both ease;
animation: rotateCarouselRightIn .8s both ease;
}
.js .go-page-transition-rotateCarouselTopOut {
-webkit-transform-origin: 50% 100%;
transform-origin: 50% 100%;
-webkit-animation: rotateCarouselTopOut .8s both ease;
animation: rotateCarouselTopOut .8s both ease;
}
.js .go-page-transition-rotateCarouselTopIn {
-webkit-transform-origin: 50% 0%;
transform-origin: 50% 0%;
-webkit-animation: rotateCarouselTopIn .8s both ease;
animation: rotateCarouselTopIn .8s both ease;
}
.js .go-page-transition-rotateCarouselBottomOut {
-webkit-transform-origin: 50% 0%;
transform-origin: 50% 0%;
-webkit-animation: rotateCarouselBottomOut .8s both ease;
animation: rotateCarouselBottomOut .8s both ease;
}
.js .go-page-transition-rotateCarouselBottomIn {
-webkit-transform-origin: 50% 100%;
transform-origin: 50% 100%;
-webkit-animation: rotateCarouselBottomIn .8s both ease;
animation: rotateCarouselBottomIn .8s both ease;
}
/* sides */
.js .go-page-transition-rotateSidesOut {
-webkit-transform-origin: -50% 50%;
transform-origin: -50% 50%;
-webkit-animation: rotateSidesOut 0.5s both ease-in;
animation: rotateSidesOut 0.5s both ease-in;
}
.js .go-page-transition-rotateSidesIn {
-webkit-transform-origin: 150% 50%;
transform-origin: 150% 50%;
-webkit-animation: rotateSidesIn 0.5s both ease-out;
animation: rotateSidesIn 0.5s both ease-out;
}
/* slide */
.js .go-page-transition-rotateSlideOut {
-webkit-animation: rotateSlideOut 1s both ease;
animation: rotateSlideOut 1s both ease;
}
.js .go-page-transition-rotateSlideIn {
-webkit-animation: rotateSlideIn 1s both ease;
animation: rotateSlideIn 1s both ease;
}
/********************************* keyframes **************************************/
/* rotate sides first and scale */
@-webkit-keyframes rotateRightSideFirst {
40% {
-webkit-transform: rotateY(15deg);
opacity: .8;
-webkit-animation-timing-function: ease-out;
}
100% {
-webkit-transform: scale(0.8) translateZ(-200px);
opacity: 0;
}
}
@keyframes rotateRightSideFirst {
40% {
-webkit-transform: rotateY(15deg);
transform: rotateY(15deg);
opacity: .8;
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out;
}
100% {
-webkit-transform: scale(0.8) translateZ(-200px);
transform: scale(0.8) translateZ(-200px);
opacity: 0;
}
}
@-webkit-keyframes rotateLeftSideFirst {
40% {
-webkit-transform: rotateY(-15deg);
opacity: .8;
-webkit-animation-timing-function: ease-out;
}
100% {
-webkit-transform: scale(0.8) translateZ(-200px);
opacity: 0;
}
}
@keyframes rotateLeftSideFirst {
40% {
-webkit-transform: rotateY(-15deg);
transform: rotateY(-15deg);
opacity: .8;
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out;
}
100% {
-webkit-transform: scale(0.8) translateZ(-200px);
transform: scale(0.8) translateZ(-200px);
opacity: 0;
}
}
@-webkit-keyframes rotateTopSideFirst {
40% {
-webkit-transform: rotateX(15deg);
opacity: .8;
-webkit-animation-timing-function: ease-out;
}
100% {
-webkit-transform: scale(0.8) translateZ(-200px);
opacity: 0;
}
}
@keyframes rotateTopSideFirst {
40% {
-webkit-transform: rotateX(15deg);
transform: rotateX(15deg);
opacity: .8;
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out;
}
100% {
-webkit-transform: scale(0.8) translateZ(-200px);
transform: scale(0.8) translateZ(-200px);
opacity: 0;
}
}
@-webkit-keyframes rotateBottomSideFirst {
40% {
-webkit-transform: rotateX(-15deg);
opacity: .8;
-webkit-animation-timing-function: ease-out;
}
100% {
-webkit-transform: scale(0.8) translateZ(-200px);
opacity: 0;
}
}
@keyframes rotateBottomSideFirst {
40% {
-webkit-transform: rotateX(-15deg);
transform: rotateX(-15deg);
opacity: .8;
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out;
}
100% {
-webkit-transform: scale(0.8) translateZ(-200px);
transform: scale(0.8) translateZ(-200px);
opacity: 0;
}
}
/* flip */
@-webkit-keyframes flipOutRight {
to {
-webkit-transform: translateZ(-1000px) rotateY(90deg);
opacity: 0.2;
}
}
@keyframes flipOutRight {
to {
-webkit-transform: translateZ(-1000px) rotateY(90deg);
transform: translateZ(-1000px) rotateY(90deg);
opacity: 0.2;
}
}
@-webkit-keyframes flipInLeft {
from {
-webkit-transform: translateZ(-1000px) rotateY(-90deg);
opacity: 0.2;
}
}
@keyframes flipInLeft {
from {
-webkit-transform: translateZ(-1000px) rotateY(-90deg);
transform: translateZ(-1000px) rotateY(-90deg);
opacity: 0.2;
}
}
@-webkit-keyframes flipOutLeft {
to {
-webkit-transform: translateZ(-1000px) rotateY(-90deg);
opacity: 0.2;
}
}
@keyframes flipOutLeft {
to {
-webkit-transform: translateZ(-1000px) rotateY(-90deg);
transform: translateZ(-1000px) rotateY(-90deg);
opacity: 0.2;
}
}
@-webkit-keyframes flipInRight {
from {
-webkit-transform: translateZ(-1000px) rotateY(90deg);
opacity: 0.2;
}
}
@keyframes flipInRight {
from {
-webkit-transform: translateZ(-1000px) rotateY(90deg);
transform: translateZ(-1000px) rotateY(90deg);
opacity: 0.2;
}
}
@-webkit-keyframes flipOutTop {
to {
-webkit-transform: translateZ(-1000px) rotateX(90deg);
opacity: 0.2;
}
}
@keyframes flipOutTop {
to {
-webkit-transform: translateZ(-1000px) rotateX(90deg);
transform: translateZ(-1000px) rotateX(90deg);
opacity: 0.2;
}
}
@-webkit-keyframes flipInBottom {
from {
-webkit-transform: translateZ(-1000px) rotateX(-90deg);
opacity: 0.2;
}
}
@keyframes flipInBottom {
from {
-webkit-transform: translateZ(-1000px) rotateX(-90deg);
transform: translateZ(-1000px) rotateX(-90deg);
opacity: 0.2;
}
}
@-webkit-keyframes flipOutBottom {
to {
-webkit-transform: translateZ(-1000px) rotateX(-90deg);
opacity: 0.2;
}
}
@keyframes flipOutBottom {
to {
-webkit-transform: translateZ(-1000px) rotateX(-90deg);
transform: translateZ(-1000px) rotateX(-90deg);
opacity: 0.2;
}
}
@-webkit-keyframes flipInTop {
from {
-webkit-transform: translateZ(-1000px) rotateX(90deg);
opacity: 0.2;
}
}
@keyframes flipInTop {
from {
-webkit-transform: translateZ(-1000px) rotateX(90deg);
transform: translateZ(-1000px) rotateX(90deg);
opacity: 0.2;
}
}
/* fall */
@-webkit-keyframes rotateFall {
0% {
-webkit-transform: rotateZ(0deg);
}
20% {
-webkit-transform: rotateZ(10deg);
-webkit-animation-timing-function: ease-out;
}
40% {
-webkit-transform: rotateZ(17deg);
}
60% {
-webkit-transform: rotateZ(16deg);
}
100% {
-webkit-transform: translateY(100%) rotateZ(17deg);
}
}
@keyframes rotateFall {
0% {
-webkit-transform: rotateZ(0deg);
transform: rotateZ(0deg);
}
20% {
-webkit-transform: rotateZ(10deg);
transform: rotateZ(10deg);
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out;
}
40% {
-webkit-transform: rotateZ(17deg);
transform: rotateZ(17deg);
}
60% {
-webkit-transform: rotateZ(16deg);
transform: rotateZ(16deg);
}
100% {
-webkit-transform: translateY(100%) rotateZ(17deg);
transform: translateY(100%) rotateZ(17deg);
}
}
/* newspaper */
@-webkit-keyframes rotateOutNewspaper {
to {
-webkit-transform: translateZ(-3000px) rotateZ(360deg);
opacity: 0;
}
}
@keyframes rotateOutNewspaper {
to {
-webkit-transform: translateZ(-3000px) rotateZ(360deg);
transform: translateZ(-3000px) rotateZ(360deg);
opacity: 0;
}
}
@-webkit-keyframes rotateInNewspaper {
from {
-webkit-transform: translateZ(-3000px) rotateZ(-360deg);
opacity: 0;
}
}
@keyframes rotateInNewspaper {
from {
-webkit-transform: translateZ(-3000px) rotateZ(-360deg);
transform: translateZ(-3000px) rotateZ(-360deg);
opacity: 0;
}
}
/* push */
@-webkit-keyframes rotatePushLeft {
to {
opacity: 0;
-webkit-transform: rotateY(90deg);
}
}
@keyframes rotatePushLeft {
to {
opacity: 0;
-webkit-transform: rotateY(90deg);
transform: rotateY(90deg);
}
}
@-webkit-keyframes rotatePushRight {
to {
opacity: 0;
-webkit-transform: rotateY(-90deg);
}
}
@keyframes rotatePushRight {
to {
opacity: 0;
-webkit-transform: rotateY(-90deg);
transform: rotateY(-90deg);
}
}
@-webkit-keyframes rotatePushTop {
to {
opacity: 0;
-webkit-transform: rotateX(-90deg);
}
}
@keyframes rotatePushTop {
to {
opacity: 0;
-webkit-transform: rotateX(-90deg);
transform: rotateX(-90deg);
}
}
@-webkit-keyframes rotatePushBottom {
to {
opacity: 0;
-webkit-transform: rotateX(90deg);
}
}
@keyframes rotatePushBottom {
to {
opacity: 0;
-webkit-transform: rotateX(90deg);
transform: rotateX(90deg);
}
}
/* pull */
@-webkit-keyframes rotatePullRight {
from {
opacity: 0;
-webkit-transform: rotateY(-90deg);
}
}
@keyframes rotatePullRight {
from {
opacity: 0;
-webkit-transform: rotateY(-90deg);
transform: rotateY(-90deg);
}
}
@-webkit-keyframes rotatePullLeft {
from {
opacity: 0;
-webkit-transform: rotateY(90deg);
}
}
@keyframes rotatePullLeft {
from {
opacity: 0;
-webkit-transform: rotateY(90deg);
transform: rotateY(90deg);
}
}
@-webkit-keyframes rotatePullTop {
from {
opacity: 0;
-webkit-transform: rotateX(-90deg);
}
}
@keyframes rotatePullTop {
from {
opacity: 0;
-webkit-transform: rotateX(-90deg);
transform: rotateX(-90deg);
}
}
@-webkit-keyframes rotatePullBottom {
from {
opacity: 0;
-webkit-transform: rotateX(90deg);
}
}
@keyframes rotatePullBottom {
from {
opacity: 0;
-webkit-transform: rotateX(90deg);
transform: rotateX(90deg);
}
}
/* fold */
@-webkit-keyframes rotateFoldRight {
to {
opacity: 0;
-webkit-transform: translateX(100%) rotateY(90deg);
}
}
@keyframes rotateFoldRight {
to {
opacity: 0;
-webkit-transform: translateX(100%) rotateY(90deg);
transform: translateX(100%) rotateY(90deg);
}
}
@-webkit-keyframes rotateFoldLeft {
to {
opacity: 0;
-webkit-transform: translateX(-100%) rotateY(-90deg);
}
}
@keyframes rotateFoldLeft {
to {
opacity: 0;
-webkit-transform: translateX(-100%) rotateY(-90deg);
transform: translateX(-100%) rotateY(-90deg);
}
}
@-webkit-keyframes rotateFoldTop {
to {
opacity: 0;
-webkit-transform: translateY(-100%) rotateX(90deg);
}
}
@keyframes rotateFoldTop {
to {
opacity: 0;
-webkit-transform: translateY(-100%) rotateX(90deg);
transform: translateY(-100%) rotateX(90deg);
}
}
@-webkit-keyframes rotateFoldBottom {
to {
opacity: 0;
-webkit-transform: translateY(100%) rotateX(-90deg);
}
}
@keyframes rotateFoldBottom {
to {
opacity: 0;
-webkit-transform: translateY(100%) rotateX(-90deg);
transform: translateY(100%) rotateX(-90deg);
}
}
/* unfold */
@-webkit-keyframes rotateUnfoldLeft {
from {
opacity: 0;
-webkit-transform: translateX(-100%) rotateY(-90deg);
}
}
@keyframes rotateUnfoldLeft {
from {
opacity: 0;
-webkit-transform: translateX(-100%) rotateY(-90deg);
transform: translateX(-100%) rotateY(-90deg);
}
}
@-webkit-keyframes rotateUnfoldRight {
from {
opacity: 0;
-webkit-transform: translateX(100%) rotateY(90deg);
}
}
@keyframes rotateUnfoldRight {
from {
opacity: 0;
-webkit-transform: translateX(100%) rotateY(90deg);
transform: translateX(100%) rotateY(90deg);
}
}
@-webkit-keyframes rotateUnfoldTop {
from {
opacity: 0;
-webkit-transform: translateY(-100%) rotateX(90deg);
}
}
@keyframes rotateUnfoldTop {
from {
opacity: 0;
-webkit-transform: translateY(-100%) rotateX(90deg);
transform: translateY(-100%) rotateX(90deg);
}
}
@-webkit-keyframes rotateUnfoldBottom {
from {
opacity: 0;
-webkit-transform: translateY(100%) rotateX(-90deg);
}
}
@keyframes rotateUnfoldBottom {
from {
opacity: 0;
-webkit-transform: translateY(100%) rotateX(-90deg);
transform: translateY(100%) rotateX(-90deg);
}
}
/* room walls */
@-webkit-keyframes rotateRoomLeftOut {
to {
opacity: .3;
-webkit-transform: translateX(-100%) rotateY(90deg);
}
}
@keyframes rotateRoomLeftOut {
to {
opacity: .3;
-webkit-transform: translateX(-100%) rotateY(90deg);
transform: translateX(-100%) rotateY(90deg);
}
}
@-webkit-keyframes rotateRoomLeftIn {
from {
opacity: .3;
-webkit-transform: translateX(100%) rotateY(-90deg);
}
}
@keyframes rotateRoomLeftIn {
from {
opacity: .3;
-webkit-transform: translateX(100%) rotateY(-90deg);
transform: translateX(100%) rotateY(-90deg);
}
}
@-webkit-keyframes rotateRoomRightOut {
to {
opacity: .3;
-webkit-transform: translateX(100%) rotateY(-90deg);
}
}
@keyframes rotateRoomRightOut {
to {
opacity: .3;
-webkit-transform: translateX(100%) rotateY(-90deg);
transform: translateX(100%) rotateY(-90deg);
}
}
@-webkit-keyframes rotateRoomRightIn {
from {
opacity: .3;
-webkit-transform: translateX(-100%) rotateY(90deg);
}
}
@keyframes rotateRoomRightIn {
from {
opacity: .3;
-webkit-transform: translateX(-100%) rotateY(90deg);
transform: translateX(-100%) rotateY(90deg);
}
}
@-webkit-keyframes rotateRoomTopOut {
to {
opacity: .3;
-webkit-transform: translateY(-100%) rotateX(-90deg);
}
}
@keyframes rotateRoomTopOut {
to {
opacity: .3;
-webkit-transform: translateY(-100%) rotateX(-90deg);
transform: translateY(-100%) rotateX(-90deg);
}
}
@-webkit-keyframes rotateRoomTopIn {
from {
opacity: .3;
-webkit-transform: translateY(100%) rotateX(90deg);
}
}
@keyframes rotateRoomTopIn {
from {
opacity: .3;
-webkit-transform: translateY(100%) rotateX(90deg);
transform: translateY(100%) rotateX(90deg);
}
}
@-webkit-keyframes rotateRoomBottomOut {
to {
opacity: .3;
-webkit-transform: translateY(100%) rotateX(90deg);
}
}
@keyframes rotateRoomBottomOut {
to {
opacity: .3;
-webkit-transform: translateY(100%) rotateX(90deg);
transform: translateY(100%) rotateX(90deg);
}
}
@-webkit-keyframes rotateRoomBottomIn {
from {
opacity: .3;
-webkit-transform: translateY(-100%) rotateX(-90deg);
}
}
@keyframes rotateRoomBottomIn {
from {
opacity: .3;
-webkit-transform: translateY(-100%) rotateX(-90deg);
transform: translateY(-100%) rotateX(-90deg);
}
}
/* cube */
@-webkit-keyframes rotateCubeLeftOut {
50% {
-webkit-animation-timing-function: ease-out;
-webkit-transform: translateX(-50%) translateZ(-200px) rotateY(-45deg);
}
100% {
opacity: .3;
-webkit-transform: translateX(-100%) rotateY(-90deg);
}
}
@keyframes rotateCubeLeftOut {
50% {
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out;
-webkit-transform: translateX(-50%) translateZ(-200px) rotateY(-45deg);
transform: translateX(-50%) translateZ(-200px) rotateY(-45deg);
}
100% {
opacity: .3;
-webkit-transform: translateX(-100%) rotateY(-90deg);
transform: translateX(-100%) rotateY(-90deg);
}
}
@-webkit-keyframes rotateCubeLeftIn {
0% {
opacity: .3;
-webkit-transform: translateX(100%) rotateY(90deg);
}
50% {
-webkit-animation-timing-function: ease-out;
-webkit-transform: translateX(50%) translateZ(-200px) rotateY(45deg);
}
}
@keyframes rotateCubeLeftIn {
0% {
opacity: .3;
-webkit-transform: translateX(100%) rotateY(90deg);
transform: translateX(100%) rotateY(90deg);
}
50% {
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out;
-webkit-transform: translateX(50%) translateZ(-200px) rotateY(45deg);
transform: translateX(50%) translateZ(-200px) rotateY(45deg);
}
}
@-webkit-keyframes rotateCubeRightOut {
50% {
-webkit-animation-timing-function: ease-out;
-webkit-transform: translateX(50%) translateZ(-200px) rotateY(45deg);
}
100% {
opacity: .3;
-webkit-transform: translateX(100%) rotateY(90deg);
}
}
@keyframes rotateCubeRightOut {
50% {
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out;
-webkit-transform: translateX(50%) translateZ(-200px) rotateY(45deg);
transform: translateX(50%) translateZ(-200px) rotateY(45deg);
}
100% {
opacity: .3;
-webkit-transform: translateX(100%) rotateY(90deg);
transform: translateX(100%) rotateY(90deg);
}
}
@-webkit-keyframes rotateCubeRightIn {
0% {
opacity: .3;
-webkit-transform: translateX(-100%) rotateY(-90deg);
}
50% {
-webkit-animation-timing-function: ease-out;
-webkit-transform: translateX(-50%) translateZ(-200px) rotateY(-45deg);
}
}
@keyframes rotateCubeRightIn {
0% {
opacity: .3;
-webkit-transform: translateX(-100%) rotateY(-90deg);
transform: translateX(-100%) rotateY(-90deg);
}
50% {
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out;
-webkit-transform: translateX(-50%) translateZ(-200px) rotateY(-45deg);
transform: translateX(-50%) translateZ(-200px) rotateY(-45deg);
}
}
@-webkit-keyframes rotateCubeTopOut {
50% {
-webkit-animation-timing-function: ease-out;
-webkit-transform: translateY(-50%) translateZ(-200px) rotateX(45deg);
}
100% {
opacity: .3;
-webkit-transform: translateY(-100%) rotateX(90deg);
}
}
@keyframes rotateCubeTopOut {
50% {
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out;
-webkit-transform: translateY(-50%) translateZ(-200px) rotateX(45deg);
transform: translateY(-50%) translateZ(-200px) rotateX(45deg);
}
100% {
opacity: .3;
-webkit-transform: translateY(-100%) rotateX(90deg);
transform: translateY(-100%) rotateX(90deg);
}
}
@-webkit-keyframes rotateCubeTopIn {
0% {
opacity: .3;
-webkit-transform: translateY(100%) rotateX(-90deg);
}
50% {
-webkit-animation-timing-function: ease-out;
-webkit-transform: translateY(50%) translateZ(-200px) rotateX(-45deg);
}
}
@keyframes rotateCubeTopIn {
0% {
opacity: .3;
-webkit-transform: translateY(100%) rotateX(-90deg);
transform: translateY(100%) rotateX(-90deg);
}
50% {
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out;
-webkit-transform: translateY(50%) translateZ(-200px) rotateX(-45deg);
transform: translateY(50%) translateZ(-200px) rotateX(-45deg);
}
}
@-webkit-keyframes rotateCubeBottomOut {
50% {
-webkit-animation-timing-function: ease-out;
-webkit-transform: translateY(50%) translateZ(-200px) rotateX(-45deg);
}
100% {
opacity: .3;
-webkit-transform: translateY(100%) rotateX(-90deg);
}
}
@keyframes rotateCubeBottomOut {
50% {
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out;
-webkit-transform: translateY(50%) translateZ(-200px) rotateX(-45deg);
transform: translateY(50%) translateZ(-200px) rotateX(-45deg);
}
100% {
opacity: .3;
-webkit-transform: translateY(100%) rotateX(-90deg);
transform: translateY(100%) rotateX(-90deg);
}
}
@-webkit-keyframes rotateCubeBottomIn {
0% {
opacity: .3;
-webkit-transform: translateY(-100%) rotateX(90deg);
}
50% {
-webkit-animation-timing-function: ease-out;
-webkit-transform: translateY(-50%) translateZ(-200px) rotateX(45deg);
}
}
@keyframes rotateCubeBottomIn {
0% {
opacity: .3;
-webkit-transform: translateY(-100%) rotateX(90deg);
transform: translateY(-100%) rotateX(90deg);
}
50% {
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out;
-webkit-transform: translateY(-50%) translateZ(-200px) rotateX(45deg);
transform: translateY(-50%) translateZ(-200px) rotateX(45deg);
}
}
/* carousel */
@-webkit-keyframes rotateCarouselLeftOut {
to {
opacity: .3;
-webkit-transform: translateX(-150%) scale(0.4) rotateY(-65deg);
}
}
@keyframes rotateCarouselLeftOut {
to {
opacity: .3;
-webkit-transform: translateX(-150%) scale(0.4) rotateY(-65deg);
transform: translateX(-150%) scale(0.4) rotateY(-65deg);
}
}
@-webkit-keyframes rotateCarouselLeftIn {
from {
opacity: .3;
-webkit-transform: translateX(200%) scale(0.4) rotateY(65deg);
}
}
@keyframes rotateCarouselLeftIn {
from {
opacity: .3;
-webkit-transform: translateX(200%) scale(0.4) rotateY(65deg);
transform: translateX(200%) scale(0.4) rotateY(65deg);
}
}
@-webkit-keyframes rotateCarouselRightOut {
to {
opacity: .3;
-webkit-transform: translateX(200%) scale(0.4) rotateY(65deg);
}
}
@keyframes rotateCarouselRightOut {
to {
opacity: .3;
-webkit-transform: translateX(200%) scale(0.4) rotateY(65deg);
transform: translateX(200%) scale(0.4) rotateY(65deg);
}
}
@-webkit-keyframes rotateCarouselRightIn {
from {
opacity: .3;
-webkit-transform: translateX(-200%) scale(0.4) rotateY(-65deg);
}
}
@keyframes rotateCarouselRightIn {
from {
opacity: .3;
-webkit-transform: translateX(-200%) scale(0.4) rotateY(-65deg);
transform: translateX(-200%) scale(0.4) rotateY(-65deg);
}
}
@-webkit-keyframes rotateCarouselTopOut {
to {
opacity: .3;
-webkit-transform: translateY(-200%) scale(0.4) rotateX(65deg);
}
}
@keyframes rotateCarouselTopOut {
to {
opacity: .3;
-webkit-transform: translateY(-200%) scale(0.4) rotateX(65deg);
transform: translateY(-200%) scale(0.4) rotateX(65deg);
}
}
@-webkit-keyframes rotateCarouselTopIn {
from {
opacity: .3;
-webkit-transform: translateY(200%) scale(0.4) rotateX(-65deg);
}
}
@keyframes rotateCarouselTopIn {
from {
opacity: .3;
-webkit-transform: translateY(200%) scale(0.4) rotateX(-65deg);
transform: translateY(200%) scale(0.4) rotateX(-65deg);
}
}
@-webkit-keyframes rotateCarouselBottomOut {
to {
opacity: .3;
-webkit-transform: translateY(200%) scale(0.4) rotateX(-65deg);
}
}
@keyframes rotateCarouselBottomOut {
to {
opacity: .3;
-webkit-transform: translateY(200%) scale(0.4) rotateX(-65deg);
transform: translateY(200%) scale(0.4) rotateX(-65deg);
}
}
@-webkit-keyframes rotateCarouselBottomIn {
from {
opacity: .3;
-webkit-transform: translateY(-200%) scale(0.4) rotateX(65deg);
}
}
@keyframes rotateCarouselBottomIn {
from {
opacity: .3;
-webkit-transform: translateY(-200%) scale(0.4) rotateX(65deg);
transform: translateY(-200%) scale(0.4) rotateX(65deg);
}
}
/* sides */
@-webkit-keyframes rotateSidesOut {
to {
opacity: 0;
-webkit-transform: translateZ(-500px) rotateY(90deg);
}
}
@keyframes rotateSidesOut {
to {
opacity: 0;
-webkit-transform: translateZ(-500px) rotateY(90deg);
transform: translateZ(-500px) rotateY(90deg);
}
}
@-webkit-keyframes rotateSidesIn {
from {
opacity: 0;
-webkit-transform: translateZ(-500px) rotateY(-90deg);
}
}
@keyframes rotateSidesIn {
from {
opacity: 0;
-webkit-transform: translateZ(-500px) rotateY(-90deg);
transform: translateZ(-500px) rotateY(-90deg);
}
}
/* slide */
@-webkit-keyframes rotateSlideOut {
25% {
opacity: .5;
-webkit-transform: translateZ(-500px);
}
75% {
opacity: .5;
-webkit-transform: translateZ(-500px) translateX(-200%);
}
100% {
opacity: .5;
-webkit-transform: translateZ(-500px) translateX(-200%);
}
}
@keyframes rotateSlideOut {
25% {
opacity: .5;
-webkit-transform: translateZ(-500px);
transform: translateZ(-500px);
}
75% {
opacity: .5;
-webkit-transform: translateZ(-500px) translateX(-200%);
transform: translateZ(-500px) translateX(-200%);
}
100% {
opacity: .5;
-webkit-transform: translateZ(-500px) translateX(-200%);
transform: translateZ(-500px) translateX(-200%);
}
}
@-webkit-keyframes rotateSlideIn {
0%,
25% {
opacity: .5;
-webkit-transform: translateZ(-500px) translateX(200%);
}
75% {
opacity: .5;
-webkit-transform: translateZ(-500px);
}
100% {
opacity: 1;
-webkit-transform: translateZ(0) translateX(0);
}
}
@keyframes rotateSlideIn {
0%,
25% {
opacity: .5;
-webkit-transform: translateZ(-500px) translateX(200%);
transform: translateZ(-500px) translateX(200%);
}
75% {
opacity: .5;
-webkit-transform: translateZ(-500px);
transform: translateZ(-500px);
}
100% {
opacity: 1;
-webkit-transform: translateZ(0) translateX(0);
transform: translateZ(0) translateX(0);
}
}
/* animation delay classes */
.js .go-page-transition-delay100 {
-webkit-animation-delay: .1s;
animation-delay: .1s;
}
.js .go-page-transition-delay180 {
-webkit-animation-delay: .180s;
animation-delay: .180s;
}
.js .go-page-transition-delay200 {
-webkit-animation-delay: .2s;
animation-delay: .2s;
}
.js .go-page-transition-delay300 {
-webkit-animation-delay: .3s;
animation-delay: .3s;
}
.js .go-page-transition-delay400 {
-webkit-animation-delay: .4s;
animation-delay: .4s;
}
.js .go-page-transition-delay500 {
-webkit-animation-delay: .5s;
animation-delay: .5s;
}
.js .go-page-transition-delay700 {
-webkit-animation-delay: .7s;
animation-delay: .7s;
}
.js .go-page-transition-delay1000 {
-webkit-animation-delay: 1s;
animation-delay: 1s;
}
/**
* http://tympanus.net/codrops/2014/01/21/dot-navigation-styles/
**/
/* Common styles and resets */
.dotstyle ul {
position: relative;
display: inline-block;
margin: 0;
padding: 0;
list-style: none;
cursor: default;
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
.dotstyle li {
position: relative;
display: block;
float: left;
margin: 0 5px;
width: 20px;
height: 20px;
cursor: pointer;
}
.dotstyle li a {
top: 0;
left: 0;
width: 100%;
height: 100%;
outline: none;
border-radius: 50%;
background-color: #2e4154;
text-indent: -999em;
/* make the text accessible to screen readers */
cursor: pointer;
position: absolute;
border: 0;
margin: 0;
padding: 0;
}
.control .dotstyle li.act > *,
.control .dotstyle li.act:hover > * {
border-color: transparent;
background-color: transparent;
}
.control .dotstyle li:hover > span,
.control .dotstyle li:hover > a {
border-color: #ffffff;
background-color: #2e4154;
}
.dotstyle li a:focus {
outline: none;
}
/* Individual styles and effects */
/* Fill up */
.dotstyle-fillup li a {
overflow: hidden;
background-color: transparent;
box-shadow: inset 0 0 0 2px white;
-webkit-transition: background 0.3s ease;
transition: background 0.3s ease;
}
.dotstyle-fillup li a::after {
content: '';
position: absolute;
bottom: 0;
height: 0;
left: 0;
width: 100%;
background-color: #ffffff;
box-shadow: 0 0 1px #ffffff;
-webkit-transition: height 0.3s ease;
transition: height 0.3s ease;
}
.dotstyle-fillup li a:hover,
.dotstyle-fillup li a:focus,
.control .dotstyle-fillup li:hover > a {
background-color: rgba(0, 0, 0, 0.2);
}
.dotstyle-fillup li.act a::after {
height: 100%;
}
/* Scale up */
.dotstyle-scaleup li a {
-webkit-transition: -webkit-transform 0.3s ease, background-color 0.3s ease;
transition: transform 0.3s ease, background-color 0.3s ease;
}
.control .dotstyle-scaleup li.act > *,
.control .dotstyle-scaleup li.act:hover > * {
background-color: #2e4154;
}
.dotstyle-scaleup li a:hover,
.dotstyle-scaleup li a:focus {
background-color: #2e4154;
}
.dotstyle-scaleup li.act a {
background-color: #2e4154;
-webkit-transform: scale(1.5);
transform: scale(1.5);
}
/* Stroke */
.dotstyle-stroke li a {
box-shadow: 0 0 0 2px rgba(255, 255, 255, 0);
-webkit-transition: box-shadow 0.3s ease, background-color 0.3s ease;
transition: box-shadow 0.3s ease, background-color 0.3s ease;
}
.dotstyle-stroke li a:hover,
.dotstyle-stroke li a:focus {
background-color: #2e4154;
}
.dotstyle-stroke li.act a {
background-color: transparent;
box-shadow: 0 0 0 2px #2e4154;
}
/* Fill in */
.dotstyle-fillin li a {
background-color: transparent;
box-shadow: inset 0 0 0 2px #ffffff;
-webkit-transition: box-shadow 0.3s ease;
transition: box-shadow 0.3s ease;
}
.dotstyle-fillin li a:hover,
.dotstyle-fillin li a:focus {
box-shadow: inset 0 0 0 2px #ffffff;
}
.dotstyle-fillin li.act a {
box-shadow: inset 0 0 0 calc(10px) #ffffff;
}
/* Circle grow */
.dotstyle-circlegrow li a {
overflow: hidden;
background-color: transparent;
box-shadow: inset 0 0 0 2px #ffffff;
-webkit-transition: opacity 0.3s ease;
transition: opacity 0.3s ease;
}
.dotstyle-circlegrow li a::after {
content: '';
position: absolute;
width: 100%;
height: 100%;
left: 0;
border-radius: 50%;
background-color: #ffffff;
-webkit-transform: scale(0);
transform: scale(0);
-webkit-transform-origin: 50% 50%;
transform-origin: 50% 50%;
-webkit-transition: -webkit-transform 0.3s ease;
transition: transform 0.3s ease;
}
.dotstyle-circlegrow li a:hover,
.dotstyle-circlegrow li a:focus {
opacity: 0.7;
}
.dotstyle-circlegrow li.act a::after {
-webkit-transform: scale(1);
transform: scale(1);
}
/* Dot to stroke */
.dotstyle-dotstroke li a {
box-shadow: inset 0 0 0 calc(10px) #2e4154;
-webkit-transition: box-shadow 0.3s ease;
transition: box-shadow 0.3s ease;
}
.dotstyle-dotstroke li a:hover,
.dotstyle-dotstroke li a:focus {
box-shadow: inset 0 0 0 calc(10px) #ffffff;
}
.dotstyle-dotstroke li.act a {
box-shadow: inset 0 0 0 2px white;
}
/* SVG draw circle stroke *
.dotstyle-drawcircle li {
width: 18px;
height: 18px;
}
.dotstyle-drawcircle li a {
top: 3px;
left: 3px;
width: 12px;
height: 12px;
background-color: #c44d48;
-webkit-transition: opacity 0.3s ease;
transition: opacity 0.3s ease;
}
.dotstyle-drawcircle li svg {
z-index: 10;
}
.dotstyle-drawcircle li svg circle {
opacity: 0;
fill: none;
stroke: #fff;
stroke-width: 3;
stroke-linecap: round;
stroke-linejoin: round;
stroke-dasharray: 39 39;
stroke-dashoffset: 39;
-webkit-transition: stroke-dashoffset 0.3s, opacity 0.3s;
transition: stroke-dashoffset 0.3s, opacity 0.3s;
}
.dotstyle-drawcircle li.act a,
.dotstyle-drawcircle li a:hover,
.dotstyle-drawcircle li a:focus {
opacity: 0.5;
}
.dotstyle-drawcircle li.act svg circle {
opacity: 1;
stroke-dashoffset: 0;
-webkit-transition: stroke-dashoffset 0.3s, opacity 0.15s;
transition: stroke-dashoffset 0.3s, opacity 0.15s;
}
*/
/* Small dot with stroke */
.dotstyle-smalldotstroke li {
border-radius: 50%;
box-shadow: 0 0 0 2px #ffffff;
-webkit-transition: box-shadow 0.3s ease;
transition: box-shadow 0.3s ease;
}
.dotstyle-smalldotstroke li a {
background-color: #2e4154;
-webkit-transition: background-color 0.3s ease, -webkit-transform 0.3s ease;
transition: background-color 0.3s ease, transform 0.3s ease;
}
.control .dotstyle-smalldotstroke li.act > *,
.control .dotstyle-smalldotstroke li.act:hover > * {
background-color: #2e4154;
}
.dotstyle-smalldotstroke li a:hover,
.dotstyle-smalldotstroke li a:focus,
.dotstyle-smalldotstroke li.act a {
background-color: #2e4154;
}
.dotstyle-smalldotstroke li.act a {
-webkit-transform: scale(0.4);
transform: scale(0.4);
}
.dotstyle-smalldotstroke li.act {
box-shadow: 0 0 0 2px #ffffff;
}
/* Puff */
.dotstyle-puff li a {
border: 2px solid #ffffff;
-webkit-transition: border-color 0.3s ease;
transition: border-color 0.3s ease;
overflow: visible;
}
.dotstyle-puff li a::after {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
visibility: hidden;
background: #2e4154;
border-radius: 50%;
box-shadow: 0 0 1px #ffffff;
opacity: 0;
-webkit-transform: scale(3);
transform: scale(3);
-webkit-transition: opacity 0.3s ease, -webkit-transform 0.3s ease, visibility 0s 0.3s;
transition: opacity 0.3s ease, transform 0.3s ease, visibility 0s 0.3s;
}
.dotstyle-puff li a:hover,
.dotstyle-puff li a:focus,
.dotstyle-puff li.act a {
border-color: #ffffff;
}
.dotstyle-puff li.act a::after {
visibility: visible;
opacity: 1;
-webkit-transform: scale(1);
transform: scale(1);
-webkit-transition: opacity 0.3s ease, -webkit-transform 0.3s ease;
transition: opacity 0.3s ease, transform 0.3s ease;
}
/* 3D Flip */
.dotstyle-flip li {
-webkit-perspective: 1000px;
perspective: 1000px;
}
.dotstyle-flip li a {
background-color: transparent;
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-transition: -webkit-transform 0.3s ease, opacity 0.3s ease;
transition: transform 0.3s ease, opacity 0.3s ease;
}
.dotstyle-flip li a::before,
.dotstyle-flip li a::after {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
border-radius: 50%;
background-color: #2e4154;
content: '';
text-indent: 0;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
}
.dotstyle-flip li a::after {
background-color: #2e4154;
-webkit-transform: rotateY(180deg);
transform: rotateY(180deg);
}
.dotstyle-flip li a:hover,
.dotstyle-flip li a:focus {
opacity: 0.8;
}
.dotstyle-flip li.act a {
-webkit-transform: rotateY(180deg);
transform: rotateY(180deg);
}
/* Tooltip */
.dotstyle-tooltip li {
border: 2px solid #ffffff;
border-radius: 50%;
z-index: 1;
-webkit-transition: border-color 0.3s ease;
transition: border-color 0.3s ease;
}
.dotstyle-tooltip li a,
.dotstyle-tooltip li.act a,
.control .dotstyle-tooltip li.act > *,
.control .dotstyle-tooltip li.act:hover > * {
top: auto;
bottom: 250%;
left: 50%;
visibility: hidden;
overflow: visible;
padding: 0 10px;
width: auto;
height: auto;
border-radius: 0;
background-color: #2e4154;
color: #ffffff;
text-indent: 0;
line-height: 2;
opacity: 0;
-webkit-transform: translateX(-50%) translateY(-50%);
transform: translateX(-50%) translateY(-50%);
-webkit-transition: -webkit-transform 0.3s ease, opacity 0.3s ease, visibility 0s 0.3s ease;
transition: transform 0.3s ease, opacity 0.3s ease, visibility 0s 0.3s ease;
}
.dotstyle-tooltip li a::after {
/* http: //cssarrowplease.com/ */
position: absolute;
left: 50%;
margin-left: -10px;
width: 0;
height: 0;
border: solid transparent;
border-width: 10px;
border-color: transparent;
border-top-color: #2e4154;
content: '';
pointer-events: none;
top: 99%;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
-webkit-transition: opacity 0.3s ease;
transition: opacity 0.3s ease;
}
.no-touch .dotstyle-tooltip li:hover a,
.dotstyle-tooltip li.act a {
z-index: 100;
visibility: visible;
opacity: 1;
-webkit-transform: translateX(-50%) translateY(0%);
transform: translateX(-50%) translateY(0%);
-webkit-transition: -webkit-transform 0.3s ease, opacity 0.3s ease;
transition: transform 0.3s ease, opacity 0.3s ease;
}
.dotstyle-tooltip li.act {
border-color: #ffffff;
}
.dotstyle-tooltip li:hover {
z-index: 100;
}
.no-touch .dotstyle-tooltip ul:hover li.act a {
opacity: 0.2;
}
.dotstyle-tooltip ul li.act:hover a {
opacity: 1;
}
/* Dot move */
.dotstyle-dotmove li:last-child {
position: absolute;
left: 0;
margin: 0;
width: 48px;
-webkit-transition: -webkit-transform 0.3s ease;
transition: transform 0.3s ease;
}
.dotstyle-dotmove li:last-child::after {
content: '';
position: absolute;
left: 50%;
top: -1px;
width: 18px;
height: 18px;
border-radius: 50%;
background: #c44d48;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
}
.dotstyle-dotmove li.act:first-child ~ li:last-child {
-webkit-transform: translateX(0%);
transform: translateX(0%);
}
.dotstyle-dotmove li.act:nth-child(2) ~ li:last-child {
-webkit-transform: translateX(100%);
transform: translateX(100%);
}
.dotstyle-dotmove li.act:nth-child(3) ~ li:last-child {
-webkit-transform: translateX(200%);
transform: translateX(200%);
}
.dotstyle-dotmove li.act:nth-child(4) ~ li:last-child {
-webkit-transform: translateX(300%);
transform: translateX(300%);
}
.dotstyle-dotmove li.act:nth-child(5) ~ li:last-child {
-webkit-transform: translateX(400%);
transform: translateX(400%);
}
.dotstyle-dotmove li.act:nth-child(6) ~ li:last-child {
-webkit-transform: translateX(500%);
transform: translateX(500%);
}
.dotstyle-dotmove li a {
-webkit-transition: background-color 0.3s ease;
transition: background-color 0.3s ease;
}
.dotstyle-dotmove li a:hover,
.dotstyle-dotmove li a:focus {
background-color: #fff;
}
/* Fly in */
.dotstyle-hop li a {
border: 2px solid #ffffff;
background: transparent;
overflow: visible;
}
.dotstyle-hop li a::after {
content: '';
width: 100%;
height: 100%;
position: absolute;
left: 0;
border-radius: 50%;
visibility: hidden;
background: #2e4154;
opacity: 0;
-webkit-transform: rotate(-100deg);
transform: rotate(-100deg);
-webkit-transform-origin: -200% 50%;
transform-origin: -200% 50%;
-webkit-transition: -webkit-transform 0.3s ease 0.3s, opacity 0.3s ease, visibility 0s 0.3s ease;
transition: transform 0.3s ease 0.3s, opacity 0.3s ease, visibility 0s 0.3s ease;
}
.dotstyle-hop li a:focus {
background: rgba(255, 255, 255, 0.2);
}
.dotstyle-hop li.act-from-right a::after {
-webkit-transition: none;
transition: none;
-webkit-transform: rotate(100deg);
transform: rotate(100deg);
-webkit-transform-origin: 300% 50%;
transform-origin: 300% 50%;
}
.dotstyle-hop li.act a::after {
visibility: visible;
opacity: 1;
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
-webkit-transition: -webkit-transform 0.3s ease, opacity 0.3s ease;
transition: transform 0.3s ease, opacity 0.3s ease;
}
/* Fall */
.dotstyle-fall li::after {
content: '';
position: absolute;
width: 100%;
height: 100%;
visibility: hidden;
opacity: 0;
left: 0;
background-color: #2e4154;
border-radius: 50%;
-webkit-transform: translateY(-200%);
transform: translateY(-200%);
-webkit-transition: -webkit-transform 0.3s ease, opacity 0.3s ease, visibility 0s 0.3s;
transition: transform 0.3s ease, opacity 0.3s ease, visibility 0s 0.3s;
}
.dotstyle-fall li a {
-webkit-transition: -webkit-transform 0.3s ease, opacity 0.3s ease, background-color 0.3s ease;
transition: transform 0.3s ease, opacity 0.3s ease, background-color 0.3s ease;
}
.dotstyle-fall li:hover a,
.dotstyle-fall li a:focus,
.dotstyle-fall li.act a,
.control .dotstyle-fall li.act > *,
.control .dotstyle-fall li.act:hover > * {
background-color: #ff0000;
}
.dotstyle-fall li.act::after,
.control .dotstyle-fall li.act::after,
.control .dotstyle-fall li.act:hover::after {
opacity: 1;
background-color: #ff0000;
visibility: visible;
-webkit-transition: -webkit-transform 0.3s ease, opacity 0.3s ease;
transition: transform 0.3s ease, opacity 0.3s ease;
-webkit-transform: translateY(0%);
transform: translateY(0%);
}
.dotstyle-fall li.act a {
opacity: 0;
-webkit-transform: translateY(200%);
transform: translateY(200%);
}
.layout6 {
background: #FFFFFF;
}
.layout6 #header {
height: 80px !important;
}
@media (min-width: 1302px) {
.layout6 #header:not(.specialHeader) #homeLink {
color: #FFFFFF;
}
.layout6 #header:not(.specialHeader) #homeLink:before {
color: #FFFFFF;
}
}
.layout6 #header #homeLink {
position: absolute;
left: 25px;
top: 50%;
-webkit-transform: translateY(-50%);
-moz-transform: translateY(-50%);
-ms-transform: translateY(-50%);
-o-transform: translateY(-50%);
transform: translateY(-50%);
text-decoration: none;
letter-spacing: 1px;
text-transform: uppercase;
color: #575656;
font-size: 13px;
font-size: 0.8125rem;
font-weight: 500;
line-height: 1rem;
width: 65px;
}
@media (min-width: 992px) {
.layout6 #header #homeLink {
left: 55px;
width: auto;
}
}
.layout6 #header #homeLink:before {
content: '\2304';
font-family: 'default';
font-weight: normal;
text-indent: 0;
font-style: normal;
position: absolute;
color: #575656;
-webkit-transform: rotate(90deg) translateY(50%);
-moz-transform: rotate(90deg) translateY(50%);
-ms-transform: rotate(90deg) translateY(50%);
-o-transform: rotate(90deg) translateY(50%);
transform: rotate(90deg) translateY(50%);
line-height: 0;
top: 50%;
left: -25px;
}
.layout6 #header #brand {
left: 5.5rem;
}
@media (min-width: 420px) {
.layout6 #header #brand {
left: 50%;
-webkit-transform: translateX(-50%);
-moz-transform: translateX(-50%);
-ms-transform: translateX(-50%);
-o-transform: translateX(-50%);
transform: translateX(-50%);
margin: 0;
}
}
.layout6 #header #brand a {
pointer-events: none;
}
.layout6 #header #brand svg {
max-height: 70px;
}
.layout6 #header #lang > span span {
display: none;
}
.layout6 #header #lang > span i {
top: 50%;
-webkit-transform: translate(-50%, -50%);
-moz-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
-o-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}
.layout6 #header #scrollToForm {
position: absolute;
height: 80px;
width: 80px;
top: 0;
right: 0;
background: #575656;
cursor: pointer;
}
.layout6 #header #scrollToForm:before {
content: '';
position: absolute;
color: #FFFFFF;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
-moz-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
-o-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
background-image: url('../../..//fileadmin/template/Resources/Public/img/calender-icon.svg');
background-size: contain;
background-repeat: no-repeat;
height: 20px;
width: 20px;
}
.layout6 .dce-productteaser-landingpage {
position: relative;
top: -5rem;
background: #FFFFFF;
color: #444444;
width: calc(100% - 3rem);
text-align: center;
padding: 1.5rem;
height: auto;
margin: 0 auto;
margin-bottom: -3rem;
max-width: 380px;
-webkit-box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.15);
-moz-box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.15);
box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.15);
z-index: 10;
}
@media (min-width: 768px) {
.layout6 .dce-productteaser-landingpage {
position: absolute;
top: 0;
right: 0;
background: rgba(87, 86, 86, 0.6);
color: #FFFFFF;
width: 360px;
text-align: center;
margin: 4.5rem;
padding: 2.5rem;
height: calc(560px - 9rem);
margin-right: 80px;
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
}
}
@media (min-width: 992px) {
.layout6 .dce-productteaser-landingpage {
top: 80px;
}
}
.layout6 .dce-productteaser-landingpage .h1 {
font-size: 22px;
font-size: 1.375rem;
}
@media (min-width: 768px) {
.layout6 .dce-productteaser-landingpage .h1 {
color: #FFFFFF;
font-size: 26px;
font-size: 1.625rem;
}
}
.layout6 .dce-productteaser-landingpage .price {
font-size: 35px;
font-size: 2.1875rem;
display: block;
text-transform: lowercase;
line-height: 4rem;
}
@media (min-width: 768px) {
.layout6 .dce-productteaser-landingpage .price {
font-size: 48px;
font-size: 3rem;
line-height: 5rem;
}
}
.layout6 .dce-productteaser-landingpage .info {
font-size: 16px;
font-size: 1rem;
opacity: 0.75;
margin-bottom: 2.5rem;
display: block;
line-height: 1.5rem;
}
.layout6 .dce-productteaser-landingpage .cta-buttons {
position: relative;
width: 100%;
}
@media (min-width: 768px) {
.layout6 .dce-productteaser-landingpage .cta-buttons {
position: absolute;
padding: 2.5rem;
left: 0;
bottom: 0;
}
}
.layout6 .dce-productteaser-landingpage .cta-buttons .button {
width: 100%;
height: auto;
line-height: 1rem;
padding: 1rem;
margin: 0;
}
@media (min-width: 768px) {
.layout6 .dce-productteaser-landingpage .cta-buttons .button {
height: 4rem;
line-height: 4rem;
padding: 0;
}
}
.layout6 .dce-productteaser-landingpage .cta-buttons .button.sec {
margin-bottom: 7px;
}
.layout6 .dce-productteaser-landingpage .cta-buttons .button:not(.sec) {
background: #575656;
color: #FFFFFF;
}
@media (min-width: 768px) {
.layout6 .dce-productteaser-landingpage .cta-buttons .button:not(.sec) {
background: #FFFFFF;
color: #575656;
}
}
.layout6 #media .scrollToContent {
display: none;
}
.layout6 #media .canvas {
height: 280px;
background: #575656;
}
@media (min-width: 768px) {
.layout6 #media .canvas {
height: 640px;
}
}
@media (min-width: 992px) {
.layout6 #media .canvas {
margin-top: 80px;
}
}
@media (min-width: 1302px) {
.layout6 #media .canvas {
margin-top: 0;
}
}
@media (min-width: 768px) {
.layout6 #media .canvas img {
opacity: 0.85;
}
}
.layout6 #media .canvas picture:before {
content: '';
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 50%;
background: -moz-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.4) 100%);
/* FF3.6-15 */
background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.4) 100%);
/* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.4) 100%);
/* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00000000', endColorstr='#33000000', GradientType=0);
/* IE6-9 */
z-index: 1000;
}
.layout6 #media .hotlineMedia {
position: absolute;
left: 35px;
bottom: 25px;
color: #FFFFFF;
text-transform: uppercase;
font-weight: 500;
letter-spacing: 2px;
font-size: 14px;
font-size: 0.875rem;
display: none;
z-index: 1000;
}
@media (min-width: 768px) {
.layout6 #media .hotlineMedia {
display: block;
}
}
.layout6 #media .hotlineMedia a {
text-decoration: none;
color: #FFFFFF;
font-weight: 500;
}
.layout6 #media .hotlineMedia span.label:after {
content: '';
height: 1px;
width: 30px;
background: #FFFFFF;
display: inline-block;
position: relative;
margin: 4px 15px;
}
.layout6 .mainContent {
margin-bottom: 4rem;
}
@media (min-width: 768px) {
.layout6 .mainContent {
margin: 5rem 0 8rem;
}
}
.layout6 .mainContent .dce-pagetitle h1 {
text-align: left;
margin-bottom: 1rem;
}
.layout6 .mainContent .einleitung p {
text-align: left;
}
.layout6 .mainContent .buttonsWrap {
line-height: 0;
}
.layout6 .mainContent hr {
display: block;
height: 1px;
border: 0;
border-top: 1px solid #C7CCC4;
margin: 1em 0 3rem;
padding: 0;
background-color: transparent;
}
@media (min-width: 768px) {
.layout6 .mainContent hr {
margin: 4em 0 6rem;
}
}
.layout6 .mainContent .tx-sectioncontent-pi1 .overviewTeaser .overviewItem a {
pointer-events: none;
}
.layout6 .mainContent .tx-sectioncontent-pi1 .overviewTeaser .overviewItem a svg {
opacity: 1;
}
.layout6 .mainContent .tx-sectioncontent-pi1 .overviewTeaser .overviewItem:hover .icon {
background: none;
}
.layout6 main {
padding-bottom: 0;
}
.layout6 .forms:after {
content: '';
background: rgba(255, 255, 255, 0.5);
width: 100vw;
top: 60px;
position: absolute;
height: calc(100% - 60px);
left: 50%;
-webkit-transform: translateX(-50%);
-moz-transform: translateX(-50%);
-ms-transform: translateX(-50%);
-o-transform: translateX(-50%);
transform: translateX(-50%);
}
.layout6 .forms .tabs {
position: relative;
z-index: 1;
}
.layout6 .forms .tabs .control {
height: 60px;
}
.layout6 .forms .tabs .control li > span,
.layout6 .forms .tabs .control li > a {
height: 60px;
line-height: 3.75rem;
padding: 0 2.5rem;
}
@media (max-width: 767px) {
.layout6 .forms .tabs .control li > span,
.layout6 .forms .tabs .control li > a {
font-size: 13px;
font-size: 0.8125rem;
overflow: visible;
line-height: 1.3rem;
padding: 9px;
max-width: 90%;
}
}
.layout6 .forms .tabs .control li.pager {
left: 50%;
position: relative;
-webkit-transform: translateX(-50%);
-moz-transform: translateX(-50%);
-ms-transform: translateX(-50%);
-o-transform: translateX(-50%);
transform: translateX(-50%);
}
.layout6 .forms .tabs .control li.pager .act a {
border: none;
background: rgba(255, 255, 255, 0.5);
}
.layout6 .forms .tabs > .canvas {
border: none;
margin-bottom: 5rem;
}
.layout6 .forms header {
margin: 3rem 1rem;
}
@media (min-width: 768px) {
.layout6 .forms header {
margin: 7rem 1rem 4rem;
}
}
.layout6 .forms header h2 {
text-align: left;
margin-bottom: 1rem;
}
.layout6 .forms form .input input,
.layout6 .forms form .textarea input,
.layout6 .forms form .select input,
.layout6 .forms form .input textarea,
.layout6 .forms form .textarea textarea,
.layout6 .forms form .select textarea,
.layout6 .forms form .input select,
.layout6 .forms form .textarea select,
.layout6 .forms form .select select {
background: #FFFFFF;
}
.layout6 .forms .submit .button {
background: #db3d53;
margin-top: 1rem;
}
.layout6 #footerLandingpage {
background: #575656;
margin-bottom: 0;
position: relative;
z-index: 100;
}
@media (min-width: 768px) {
.layout6 #footerLandingpage {
padding: 2.5rem 0;
}
}
.layout6 #footerLandingpage #address3 {
color: #FFFFFF;
padding: 2rem;
width: 100%;
display: block;
position: relative;
float: left;
}
@media (min-width: 768px) {
.layout6 #footerLandingpage #address3 {
width: calc(100% - 12rem);
padding: 0;
}
}
.layout6 #footerLandingpage #address3 address {
width: 100%;
}
.layout6 #footerLandingpage #address3 address .adr1 {
position: relative;
display: block;
}
@media (min-width: 768px) {
.layout6 #footerLandingpage #address3 address .adr1 {
top: 50%;
-webkit-transform: translateY(-50%);
-moz-transform: translateY(-50%);
-ms-transform: translateY(-50%);
-o-transform: translateY(-50%);
transform: translateY(-50%);
position: absolute;
}
}
.layout6 #footerLandingpage #address3 address .adr1 .org {
display: block;
margin-bottom: 10px;
margin-bottom: 0.625rem;
}
.layout6 #footerLandingpage #address3 address .adr1 .street-address,
.layout6 #footerLandingpage #address3 address .adr1 .postal-code,
.layout6 #footerLandingpage #address3 address .adr1 .locality {
text-transform: uppercase;
letter-spacing: 2px;
font-weight: 500;
font-size: 0.875rem;
}
.layout6 #footerLandingpage #address3 address .adr2 {
float: left;
margin-top: 1.5rem;
}
@media (min-width: 768px) {
.layout6 #footerLandingpage #address3 address .adr2 {
float: right;
margin-top: 0;
}
}
.layout6 #footerLandingpage #address3 address .adr2 > * {
display: block;
}
.layout6 #footerLandingpage #address3 address .adr2 .tel,
.layout6 #footerLandingpage #address3 address .adr2 .fax,
.layout6 #footerLandingpage #address3 address .adr2 .email {
opacity: 1;
}
.layout6 #footerLandingpage #address3 address .adr2 .tel span,
.layout6 #footerLandingpage #address3 address .adr2 .fax span,
.layout6 #footerLandingpage #address3 address .adr2 .email span {
opacity: 0.7;
}
.layout6 #footerLandingpage #address3 address .adr2 .tel:before,
.layout6 #footerLandingpage #address3 address .adr2 .fax:before,
.layout6 #footerLandingpage #address3 address .adr2 .email:before {
font-size: 1.1rem;
}
.layout6 #footerLandingpage #sitelinksLandingpage {
float: left;
}
@media (max-width: 767px) {
.layout6 #footerLandingpage #sitelinksLandingpage {
background: #aca194;
padding: 1rem 2rem;
width: 100%;
}
}
@media (min-width: 768px) {
.layout6 #footerLandingpage #sitelinksLandingpage {
float: right;
}
}
.layout6 #footerLandingpage #sitelinksLandingpage ul {
padding: 0;
}
@media (min-width: 768px) {
.layout6 #footerLandingpage #sitelinksLandingpage ul {
margin-bottom: 0;
}
}
@media (max-width: 767px) {
.layout6 #footerLandingpage #sitelinksLandingpage ul li {
margin-right: 1rem;
float: left;
}
}
.layout6 #footerLandingpage #sitelinksLandingpage a {
color: #FFFFFF;
text-decoration: none;
text-transform: uppercase;
letter-spacing: 2px;
font-weight: 500;
font-size: 0.875rem;
}
/* Test for cycle slide elements */
/* 4 classes: navInLeft, navInRight, navOutLeft, navOutRight
https://tympanus.net/Development/ItemTransitions/index2.html
*/
/*****************************************/
/* Soft Scale */
/*****************************************/
.fxSoftScale .navOutNext {
-webkit-animation: goCycleScaleUp 1.5s forwards cubic-bezier(0.7, 0, 0.3, 1);
animation: goCycleScaleUp 1.5s forwards cubic-bezier(0.7, 0, 0.3, 1);
}
.fxSoftScale .navInNext {
-webkit-animation: goCycleScaleDownUp 1.5s forwards cubic-bezier(0.7, 0, 0.3, 1);
animation: goCycleScaleDownUp 1.5s forwards cubic-bezier(0.7, 0, 0.3, 1);
}
.fxSoftScale .navOutPrev {
-webkit-animation: goCycleScaleDown 1.5s forwards cubic-bezier(0.7, 0, 0.3, 1);
animation: goCycleScaleDown 1.5s forwards cubic-bezier(0.7, 0, 0.3, 1);
}
.fxSoftScale .navInPrev {
-webkit-animation: goCycleScaleUpDown 1.5s forwards cubic-bezier(0.7, 0, 0.3, 1);
animation: goCycleScaleUpDown 1.5s forwards cubic-bezier(0.7, 0, 0.3, 1);
}
@-webkit-keyframes goCycleScaleUp {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-webkit-transform: scale(1.2);
opacity: 0;
}
}
@-moz-keyframes goCycleScaleUp {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-moz-transform: scale(1.2);
opacity: 0;
}
}
@-ms-keyframes goCycleScaleUp {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-ms-transform: scale(1.2);
opacity: 0;
}
}
@keyframes goCycleScaleUp {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-webkit-transform: scale(1.2);
transform: scale(1.2);
opacity: 0;
}
}
@-webkit-keyframes goCycleScaleDownUp {
from {
opacity: 0;
-webkit-transform: scale(0.9);
}
to {
opacity: 1;
-webkit-transform: scale(1);
}
}
@-moz-keyframes goCycleScaleDownUp {
from {
opacity: 0;
-moz-transform: scale(0.9);
}
to {
opacity: 1;
-moz-transform: scale(1);
}
}
@-ms-keyframes goCycleScaleDownUp {
from {
opacity: 0;
-ms-transform: scale(0.9);
}
to {
opacity: 1;
-ms-transform: scale(1);
}
}
@keyframes goCycleScaleDownUp {
from {
opacity: 0;
-webkit-transform: scale(0.9);
transform: scale(0.9);
}
to {
opacity: 1;
-webkit-transform: scale(1);
transform: scale(1);
}
}
@-webkit-keyframes goCycleScaleDown {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
opacity: 0;
-webkit-transform: scale(0.9);
}
}
@-moz-keyframes goCycleScaleDown {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
opacity: 0;
-moz-transform: scale(0.9);
}
}
@-ms-keyframes goCycleScaleDown {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
opacity: 0;
-ms-transform: scale(0.9);
}
}
@keyframes goCycleScaleDown {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
opacity: 0;
-webkit-transform: scale(0.9);
transform: scale(0.9);
}
}
@-webkit-keyframes goCycleScaleUpDown {
from {
-webkit-transform: scale(1.2);
}
to {
opacity: 1;
-webkit-transform: scale(1);
}
}
@-moz-keyframes goCycleScaleUpDown {
from {
-moz-transform: scale(1.2);
}
to {
opacity: 1;
-moz-transform: scale(1);
}
}
@-ms-keyframes goCycleScaleUpDown {
from {
-ms-transform: scale(1.2);
}
to {
opacity: 1;
-ms-transform: scale(1);
}
}
@keyframes goCycleScaleUpDown {
from {
-webkit-transform: scale(1.2);
transform: scale(1.2);
}
to {
opacity: 1;
-webkit-transform: scale(1);
transform: scale(1);
}
}
/*****************************************/
/* Press away */
/*****************************************/
.fxPressAway .navOutNext {
-webkit-animation: goCycleSlideOutScaleRight 1.2s forwards cubic-bezier(0.7, 0, 0.3, 1);
animation: goCycleSlideOutScaleRight 1.2s forwards cubic-bezier(0.7, 0, 0.3, 1);
}
.fxPressAway .navInNext {
opacity: 1;
-webkit-animation: goCycleSlideInFromLeft 1.2s forwards cubic-bezier(0.7, 0, 0.3, 1);
animation: goCycleSlideInFromLeft 1.2s forwards cubic-bezier(0.7, 0, 0.3, 1);
}
.fxPressAway .navOutPrev {
-webkit-animation: goCycleSlideOutScaleLeft 1.2s forwards cubic-bezier(0.7, 0, 0.3, 1);
animation: goCycleSlideOutScaleLeft 1.2s forwards cubic-bezier(0.7, 0, 0.3, 1);
}
.fxPressAway .navInPrev {
opacity: 1;
-webkit-animation: goCycleSlideInFromRight 1.2s forwards cubic-bezier(0.7, 0, 0.3, 1);
animation: goCycleSlideInFromRight 1.2s forwards cubic-bezier(0.7, 0, 0.3, 1);
}
@-webkit-keyframes goCycleSlideOutScaleRight {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-webkit-transform: translateX(100%) scale(0.9);
opacity: 0;
}
}
@-moz-keyframes goCycleSlideOutScaleRight {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-moz-transform: translateX(100%) scale(0.9);
opacity: 0;
}
}
@-ms-keyframes goCycleSlideOutScaleRight {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-ms-transform: translateX(100%) scale(0.9);
opacity: 0;
}
}
@keyframes goCycleSlideOutScaleRight {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-webkit-transform: translateX(100%) scale(0.9);
transform: translateX(100%) scale(0.9);
opacity: 0;
}
}
@-webkit-keyframes goCycleSlideInFromLeft {
from {
-webkit-transform: translateX(-100%);
}
to {
-webkit-transform: translateX(0);
}
}
@-moz-keyframes goCycleSlideInFromLeft {
from {
-moz-transform: translateX(-100%);
}
to {
-moz-transform: translateX(0);
}
}
@-ms-keyframes goCycleSlideInFromLeft {
from {
-ms-transform: translateX(-100%);
}
to {
-ms-transform: translateX(0);
}
}
@keyframes goCycleSlideInFromLeft {
from {
-webkit-transform: translateX(-100%);
transform: translateX(-100%);
}
to {
-webkit-transform: translateX(0);
transform: translateX(0);
}
}
@-webkit-keyframes goCycleSlideOutScaleLeft {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-webkit-transform: translateX(-100%) scale(0.9);
opacity: 0;
}
}
@-moz-keyframes goCycleSlideOutScaleLeft {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-moz-transform: translateX(-100%) scale(0.9);
opacity: 0;
}
}
@-ms-keyframes goCycleSlideOutScaleLeft {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-ms-transform: translateX(-100%) scale(0.9);
opacity: 0;
}
}
@keyframes goCycleSlideOutScaleLeft {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-webkit-transform: translateX(-100%) scale(0.9);
transform: translateX(-100%) scale(0.9);
opacity: 0;
}
}
@-webkit-keyframes goCycleSlideInFromRight {
from {
-webkit-transform: translateX(100%);
}
to {
-webkit-transform: translateX(0);
}
}
@-moz-keyframes goCycleSlideInFromRight {
from {
-moz-transform: translateX(100%);
}
to {
-moz-transform: translateX(0);
}
}
@-ms-keyframes goCycleSlideInFromRight {
from {
-ms-transform: translateX(100%);
}
to {
-ms-transform: translateX(0);
}
}
@keyframes goCycleSlideInFromRight {
from {
-webkit-transform: translateX(100%);
transform: translateX(100%);
}
to {
-webkit-transform: translateX(0);
transform: translateX(0);
}
}
/*****************************************/
/* Side Swing */
/*****************************************/
.fxSideSwing .navOutNext {
-webkit-animation: goCycleSlideOutScaleRight 1.2s forwards;
animation: goCycleSlideOutScaleRight 1.2s forwards;
-webkit-animation-timing-function: cubic-bezier(1, 0, 0, 1);
/* older webkit */
-webkit-animation-timing-function: cubic-bezier(1, -0.2, 0, 1);
animation-timing-function: cubic-bezier(1, -0.2, 0, 1);
}
.fxSideSwing .navInNext {
opacity: 1;
-webkit-animation: goCycleSlideInFromLeft 1.2s forwards;
animation: goCycleSlideInFromLeft 1.2s forwards;
-webkit-animation-timing-function: cubic-bezier(1, 0, 0, 1);
/* older webkit */
-webkit-animation-timing-function: cubic-bezier(1, -0.2, 0, 1);
animation-timing-function: cubic-bezier(1, -0.2, 0, 1);
}
.fxSideSwing .navOutPrev {
-webkit-animation: goCycleSlideOutScaleLeft 1.2s forwards;
animation: goCycleSlideOutScaleLeft 1.2s forwards;
-webkit-animation-timing-function: cubic-bezier(1, 0, 0, 1);
/* older webkit */
-webkit-animation-timing-function: cubic-bezier(1, -0.2, 0, 1);
animation-timing-function: cubic-bezier(1, -0.2, 0, 1);
}
.fxSideSwing .navInPrev {
opacity: 1;
-webkit-animation: goCycleSlideInFromRight 1.2s forwards;
animation: goCycleSlideInFromRight 1.2s forwards;
-webkit-animation-timing-function: cubic-bezier(1, 0, 0, 1);
/* older webkit */
-webkit-animation-timing-function: cubic-bezier(1, -0.2, 0, 1);
animation-timing-function: cubic-bezier(1, -0.2, 0, 1);
}
/*****************************************/
/* Fortune wheel */
/*****************************************/
.fxFortuneWheel .itemwrap {
-webkit-perspective: 1600px;
perspective: 1600px;
}
.fxFortuneWheel .navOutNext {
-webkit-animation: goCycleSlideOutScaleRight 1.2s forwards cubic-bezier(0.7, 0, 0.3, 1);
animation: goCycleSlideOutScaleRight 1.2s forwards cubic-bezier(0.7, 0, 0.3, 1);
}
.fxFortuneWheel .navInNext {
-webkit-transform-origin: 100% 50%;
transform-origin: 100% 50%;
-webkit-animation: goCycleRotateInFromLeft 1.2s forwards cubic-bezier(0.7, 0, 0.3, 1);
animation: goCycleRotateInFromLeft 1.2s forwards cubic-bezier(0.7, 0, 0.3, 1);
}
.fxFortuneWheel .navOutPrev {
-webkit-animation: goCycleSlideOutScaleLeft 1.2s forwards cubic-bezier(0.7, 0, 0.3, 1);
animation: goCycleSlideOutScaleLeft 1.2s forwards cubic-bezier(0.7, 0, 0.3, 1);
}
.fxFortuneWheel .navInPrev {
-webkit-transform-origin: 0% 50%;
transform-origin: 0% 50%;
-webkit-animation: goCycleRotateInFromRight 1.2s forwards cubic-bezier(0.7, 0, 0.3, 1);
animation: goCycleRotateInFromRight 1.2s forwards cubic-bezier(0.7, 0, 0.3, 1);
}
@-webkit-keyframes goCycleRotateInFromLeft {
from {
-webkit-transform: translateX(-100%) rotateY(-55deg);
}
to {
-webkit-transform: translateX(0) rotateY(0deg);
opacity: 1;
}
}
@-moz-keyframes goCycleRotateInFromLeft {
from {
-moz-transform: translateX(-100%) rotateY(-55deg);
}
to {
-moz-transform: translateX(0) rotateY(0deg);
opacity: 1;
}
}
@-ms-keyframes goCycleRotateInFromLeft {
from {
-ms-transform: translateX(-100%) rotateY(-55deg);
}
to {
-ms-transform: translateX(0) rotateY(0deg);
opacity: 1;
}
}
@keyframes goCycleRotateInFromLeft {
from {
-webkit-transform: translateX(-100%) rotateY(-55deg);
transform: translateX(-100%) rotateY(-55deg);
}
to {
-webkit-transform: translateX(0) rotateY(0deg);
transform: translateX(0) rotateY(0deg);
opacity: 1;
}
}
@-webkit-keyframes goCycleRotateInFromRight {
from {
-webkit-transform: translateX(100%) rotateY(55deg);
}
to {
-webkit-transform: translateX(0) rotateY(0deg);
opacity: 1;
}
}
@keyframes goCycleRotateInFromRight {
from {
-webkit-transform: translateX(100%) rotateY(55deg);
transform: translateX(100%) rotateY(55deg);
}
to {
-webkit-transform: translateX(0) rotateY(0deg);
transform: translateX(0) rotateY(0deg);
opacity: 1;
}
}
/*****************************************/
/* Swipe */
/*****************************************/
.fxSwipe .navOutNext {
-webkit-animation: goCycleDecreaseHeight 0.8s forwards ease-in-out;
animation: goCycleDecreaseHeight 0.8s forwards ease-in-out;
}
.fxSwipe .navInNext {
-webkit-animation: goCycleShow 0.8s forwards ease-in-out;
animation: goCycleShow 0.8s forwards ease-in-out;
}
.fxSwipe .navOutPrev {
-webkit-animation: goCycleHide 0.8s forwards ease-in-out;
animation: goCycleHide 0.8s forwards ease-in-out;
}
.fxSwipe .navInPrev {
z-index: 1001;
opacity: 1;
-webkit-animation: goCycleIncreaseHeight 0.8s forwards ease-in-out;
animation: goCycleIncreaseHeight 0.8s forwards ease-in-out;
}
@-webkit-keyframes goCycleDecreaseHeight {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-webkit-transform: translateY(-100%);
}
}
@-moz-keyframes goCycleDecreaseHeight {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-moz-transform: translateY(-100%);
}
}
@-ms-keyframes goCycleDecreaseHeight {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-ms-transform: translateY(-100%);
}
}
@keyframes goCycleDecreaseHeight {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
transform: translateY(-100%);
}
}
@-webkit-keyframes goCycleShow {
0% {
opacity: 0;
}
1%,
100% {
opacity: 1;
}
}
@-moz-keyframes goCycleShow {
0% {
opacity: 0;
}
1%,
100% {
opacity: 1;
}
}
@-ms-keyframes goCycleShow {
0% {
opacity: 0;
}
1%,
100% {
opacity: 1;
}
}
@keyframes goCycleShow {
0% {
opacity: 0;
}
1%,
100% {
opacity: 1;
}
}
@-webkit-keyframes goCycleHide {
0%,
99% {
opacity: 1;
}
100% {
opacity: 0;
}
}
@-moz-keyframes goCycleHide {
0%,
99% {
opacity: 1;
}
100% {
opacity: 0;
}
}
@-ms-keyframes goCycleHide {
0%,
99% {
opacity: 1;
}
100% {
opacity: 0;
}
}
@keyframes goCycleHide {
0%,
99% {
opacity: 1;
}
100% {
opacity: 0;
}
}
@-webkit-keyframes goCycleIncreaseHeight {
from {
-webkit-transform: translateY(-100%);
}
to {
-webkit-transform: translateY(0%);
}
}
@-moz-keyframes goCycleIncreaseHeight {
from {
-moz-transform: translateY(-100%);
}
to {
-moz-transform: translateY(0%);
}
}
@-ms-keyframes goCycleIncreaseHeight {
from {
-ms-transform: translateY(-100%);
}
to {
-ms-transform: translateY(0%);
}
}
@keyframes goCycleIncreaseHeight {
from {
transform: translateY(-100%);
}
to {
transform: translateY(0%);
}
}
/*****************************************/
/* Push reveal */
/*****************************************/
.fxPushReveal .navOutNext {
opacity: 1;
-webkit-animation: goCycleSlideOutBottom 0.7s forwards ease-in-out;
animation: goCycleSlideOutBottom 0.7s forwards ease-in-out;
}
.fxPushReveal .navInNext {
opacity: 1;
-webkit-animation: goCycleSlideInHalfFromTop 0.7s forwards ease-in-out;
animation: goCycleSlideInHalfFromTop 0.7s forwards ease-in-out;
}
.fxPushReveal .navOutPrev {
opacity: 1;
-webkit-animation: goCycleSlideOutHalfTop 0.7s forwards ease-in-out;
animation: goCycleSlideOutHalfTop 0.7s forwards ease-in-out;
}
.fxPushReveal .navInPrev {
opacity: 1;
z-index: 1001;
-webkit-animation: goCycleSlideInFromBottom 0.7s forwards ease-in-out;
animation: goCycleSlideInFromBottom 0.7s forwards ease-in-out;
}
@-webkit-keyframes goCycleSlideOutBottom {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-webkit-transform: translateY(100%);
}
}
@-moz-keyframes goCycleSlideOutBottom {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-moz-transform: translateY(100%);
}
}
@-ms-keyframes goCycleSlideOutBottom {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-ms-transform: translateY(100%);
}
}
@keyframes goCycleSlideOutBottom {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-webkit-transform: translateY(100%);
transform: translateY(100%);
}
}
@-webkit-keyframes goCycleSlideInHalfFromTop {
from {
-webkit-transform: translateY(-50%);
}
to {
-webkit-transform: translateY(0);
}
}
@-moz-keyframes goCycleSlideInHalfFromTop {
from {
-moz-transform: translateY(-50%);
}
to {
-moz-transform: translateY(0);
}
}
@-ms-keyframes goCycleSlideInHalfFromTop {
from {
-ms-transform: translateY(-50%);
}
to {
-ms-transform: translateY(0);
}
}
@keyframes goCycleSlideInHalfFromTop {
from {
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
}
to {
-webkit-transform: translateY(0);
transform: translateY(0);
}
}
@-webkit-keyframes goCycleSlideOutHalfTop {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-webkit-transform: translateY(-50%);
}
}
@-moz-keyframes goCycleSlideOutHalfTop {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-moz-transform: translateY(-50%);
}
}
@-ms-keyframes goCycleSlideOutHalfTop {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-ms-transform: translateY(-50%);
}
}
@keyframes goCycleSlideOutHalfTop {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
}
}
@-webkit-keyframes goCycleSlideInFromBottom {
from {
-webkit-transform: translateY(100%);
}
to {
-webkit-transform: translateY(0);
}
}
@-moz-keyframes goCycleSlideInFromBottom {
from {
-moz-transform: translateY(100%);
}
to {
-moz-transform: translateY(0);
}
}
@-ms-keyframes goCycleSlideInFromBottom {
from {
-ms-transform: translateY(100%);
}
to {
-ms-transform: translateY(0);
}
}
@keyframes goCycleSlideInFromBottom {
from {
-webkit-transform: translateY(100%);
transform: translateY(100%);
}
to {
-webkit-transform: translateY(0);
transform: translateY(0);
}
}
/*****************************************/
/* Snap in */
/*****************************************/
.fxSnapIn .navOutNext {
-webkit-animation: goCycleSlideOutLeft 0.5s forwards ease-in;
animation: goCycleSlideOutLeft 0.5s forwards ease-in;
}
.fxSnapIn .navInNext {
z-index: 1001;
opacity: 1;
-webkit-animation: goCycleSlideFromRightFast 0.5s forwards cubic-bezier(0.7, 0, 0.3, 1);
animation: goCycleSlideFromRightFast 0.5s forwards cubic-bezier(0.7, 0, 0.3, 1);
}
.fxSnapIn .navOutPrev {
-webkit-animation: goCycleSlideOutRight 0.5s forwards ease-in;
animation: goCycleSlideOutRight 0.5s forwards ease-in;
}
.fxSnapIn .navInPrev {
z-index: 1001;
opacity: 1;
-webkit-animation: goCycleSlideFromLeftFast 0.5s forwards cubic-bezier(0.7, 0, 0.3, 1);
animation: goCycleSlideFromLeftFast 0.5s forwards cubic-bezier(0.7, 0, 0.3, 1);
}
.fxSnapIn li::after {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
opacity: 0;
pointer-events: none;
background-color: rgba(0, 0, 0, 0.8);
transition: opacity 0.4s 0.1s ease-in;
}
.fxSnapIn .navOutPrev::after,
.fxSnapIn .navOutNext::after {
opacity: 1;
}
@-webkit-keyframes goCycleSlideOutLeft {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-webkit-transform: translateX(-10%);
}
}
@-moz-keyframes goCycleSlideOutLeft {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-moz-transform: translateX(-10%);
}
}
@-ms-keyframes goCycleSlideOutLeft {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-ms-transform: translateX(-10%);
}
}
@keyframes goCycleSlideOutLeft {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-webkit-transform: translateX(-10%);
transform: translateX(-10%);
}
}
@-webkit-keyframes goCycleSlideFromRightFast {
0%,
50% {
-webkit-transform: translateX(100%);
}
100% {
-webkit-transform: translateX(0%);
}
}
@-moz-keyframes goCycleSlideFromRightFast {
0%,
50% {
-moz-transform: translateX(100%);
}
100% {
-moz-transform: translateX(0%);
}
}
@-ms-keyframes goCycleSlideFromRightFast {
0%,
50% {
-ms-transform: translateX(100%);
}
100% {
-ms-transform: translateX(0%);
}
}
@keyframes goCycleSlideFromRightFast {
0%,
50% {
-webkit-transform: translateX(100%);
transform: translateX(100%);
}
100% {
-webkit-transform: translateX(0%);
transform: translateX(0%);
}
}
@-webkit-keyframes goCycleSlideOutRight {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-webkit-transform: translateX(10%);
}
}
@-moz-keyframes goCycleSlideOutRight {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-moz-transform: translateX(10%);
}
}
@-ms-keyframes goCycleSlideOutRight {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-ms-transform: translateX(10%);
}
}
@keyframes goCycleSlideOutRight {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-webkit-transform: translateX(10%);
transform: translateX(10%);
}
}
@-webkit-keyframes goCycleSlideFromLeftFast {
0%,
50% {
-webkit-transform: translateX(-100%);
}
100% {
-webkit-transform: translateX(0%);
}
}
@-moz-keyframes goCycleSlideFromLeftFast {
0%,
50% {
-moz-transform: translateX(-100%);
}
100% {
-moz-transform: translateX(0%);
}
}
@-ms-keyframes goCycleSlideFromLeftFast {
0%,
50% {
-ms-transform: translateX(-100%);
}
100% {
-ms-transform: translateX(0%);
}
}
@keyframes goCycleSlideFromLeftFast {
0%,
50% {
-webkit-transform: translateX(-100%);
transform: translateX(-100%);
}
100% {
-webkit-transform: translateX(0%);
transform: translateX(0%);
}
}
/*****************************************/
/* Let me in */
/*****************************************/
.fxLetMeIn .itemwrap {
-webkit-perspective: 1600px;
perspective: 1600px;
}
.fxLetMeIn .navOutNext {
-webkit-transform-origin: 0% 50%;
transform-origin: 0% 50%;
-webkit-animation: goCycleRotateOutRight 0.5s forwards ease-in-out;
animation: goCycleRotateOutRight 0.5s forwards ease-in-out;
}
.fxLetMeIn .navInNext {
z-index: 1001;
opacity: 1;
-webkit-animation: goCycleSlideFromRightFast 0.5s forwards ease;
animation: goCycleSlideFromRightFast 0.5s forwards ease;
}
.fxLetMeIn .navOutPrev {
-webkit-transform-origin: 100% 0%;
transform-origin: 100% 0%;
-webkit-animation: goCycleRotateOutLeft 0.5s forwards ease-in-out;
animation: goCycleRotateOutLeft 0.5s forwards ease-in-out;
}
.fxLetMeIn .navInPrev {
z-index: 1001;
opacity: 1;
-webkit-animation: goCycleSlideFromLeftFast 0.5s forwards ease;
animation: goCycleSlideFromLeftFast 0.5s forwards ease;
}
.fxLetMeIn li::after {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
opacity: 0;
pointer-events: none;
background-color: rgba(0, 0, 0, 0.6);
transition: opacity 0.5s ease-in-out;
}
.fxLetMeIn .navOutPrev::after,
.fxLetMeIn .navOutNext::after {
opacity: 1;
}
@-webkit-keyframes goCycleRotateOutRight {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-webkit-transform: rotateY(10deg);
}
}
@-moz-keyframes goCycleRotateOutRight {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-moz-transform: rotateY(10deg);
}
}
@-ms-keyframes goCycleRotateOutRight {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-ms-transform: rotateY(10deg);
}
}
@keyframes goCycleRotateOutRight {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-webkit-transform: rotateY(10deg);
transform: rotateY(10deg);
}
}
@-webkit-keyframes goCycleRotateOutLeft {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-webkit-transform: rotateY(-10deg);
}
}
@-moz-keyframes goCycleRotateOutLeft {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-moz-transform: rotateY(-10deg);
}
}
@-ms-keyframes goCycleRotateOutLeft {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-ms-transform: rotateY(-10deg);
}
}
@keyframes goCycleRotateOutLeft {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-webkit-transform: rotateY(-10deg);
transform: rotateY(-10deg);
}
}
/*****************************************/
/* Stick it */
/*****************************************/
.fxStickIt .itemwrap {
-webkit-perspective: 1600px;
perspective: 1600px;
}
.fxStickIt .navOutNext {
-webkit-transform-origin: 50% 0%;
transform-origin: 50% 0%;
-webkit-animation: goCycleRotateBottomSideOut 0.8s forwards ease-in;
animation: goCycleRotateBottomSideOut 0.8s forwards ease-in;
}
.fxStickIt .navInNext {
z-index: 1001;
opacity: 1;
-webkit-animation: goCycleSlideInFromBottomDelayed 0.8s forwards;
animation: goCycleSlideInFromBottomDelayed 0.8s forwards;
}
.fxStickIt .navOutPrev {
opacity: 1;
-webkit-animation: goCycleSlideOutToBottom 0.8s forwards;
animation: goCycleSlideOutToBottom 0.8s forwards;
}
.fxStickIt .navInPrev {
-webkit-transform-origin: 50% 0%;
transform-origin: 50% 0%;
-webkit-animation: goCycleRotateBottomSideIn 0.8s 0.1s forwards ease-in;
animation: goCycleRotateBottomSideIn 0.8s 0.1s forwards ease-in;
}
@-webkit-keyframes goCycleRotateBottomSideOut {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
40% {
-webkit-transform: rotateX(-15deg);
-webkit-animation-timing-function: ease-out;
}
100% {
opacity: 0;
-webkit-transform: scale(0.8) translateZ(-200px);
}
}
@-moz-keyframes goCycleRotateBottomSideOut {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
40% {
-moz-transform: rotateX(-15deg);
-moz-animation-timing-function: ease-out;
}
100% {
opacity: 0;
-moz-transform: scale(0.8) translateZ(-200px);
}
}
@-ms-keyframes goCycleRotateBottomSideOut {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
40% {
-ms-transform: rotateX(-15deg);
-ms-animation-timing-function: ease-out;
}
100% {
opacity: 0;
-ms-transform: scale(0.8) translateZ(-200px);
}
}
@-webkit-keyframes goCycleRotateBottomSideOut {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
40% {
-webkit-transform: rotateX(-15deg);
-webkit-animation-timing-function: ease-out;
}
100% {
opacity: 0;
-webkit-transform: scale(0.8) translateZ(-200px);
}
}
@-moz-keyframes goCycleRotateBottomSideOut {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
40% {
-moz-transform: rotateX(-15deg);
-moz-animation-timing-function: ease-out;
}
100% {
opacity: 0;
-moz-transform: scale(0.8) translateZ(-200px);
}
}
@-ms-keyframes goCycleRotateBottomSideOut {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
40% {
-ms-transform: rotateX(-15deg);
-ms-animation-timing-function: ease-out;
}
100% {
opacity: 0;
-ms-transform: scale(0.8) translateZ(-200px);
}
}
@keyframes goCycleRotateBottomSideOut {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
40% {
-webkit-transform: rotateX(-15deg);
transform: rotateX(-15deg);
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out;
}
100% {
opacity: 0;
-webkit-transform: scale(0.8) translateZ(-200px);
transform: scale(0.8) translateZ(-200px);
}
}
@-webkit-keyframes goCycleSlideInFromBottomDelayed {
0%,
30% {
-webkit-transform: translateY(100%);
}
100% {
-webkit-transform: translateY(0);
}
}
@-moz-keyframes goCycleSlideInFromBottomDelayed {
0%,
30% {
-moz-transform: translateY(100%);
}
100% {
-moz-transform: translateY(0);
}
}
@-ms-keyframes goCycleSlideInFromBottomDelayed {
0%,
30% {
-ms-transform: translateY(100%);
}
100% {
-ms-transform: translateY(0);
}
}
@keyframes goCycleSlideInFromBottomDelayed {
0%,
30% {
-webkit-transform: translateY(100%);
transform: translateY(100%);
}
100% {
-webkit-transform: translateY(0);
transform: translateY(0);
}
}
@-webkit-keyframes goCycleRotateBottomSideIn {
0% {
opacity: 0;
-webkit-transform: scale(0.8) translateZ(-200px);
}
60% {
-webkit-transform: scale(1) translateZ(0) rotateX(-15deg);
-webkit-animation-timing-function: ease-out;
}
100% {
opacity: 1;
-webkit-transform: scale(1) translateZ(0) rotateX(0deg);
}
}
@-moz-keyframes goCycleRotateBottomSideIn {
0% {
opacity: 0;
-moz-transform: scale(0.8) translateZ(-200px);
}
60% {
-moz-transform: scale(1) translateZ(0) rotateX(-15deg);
-moz-animation-timing-function: ease-out;
}
100% {
opacity: 1;
-moz-transform: scale(1) translateZ(0) rotateX(0deg);
}
}
@-ms-keyframes goCycleRotateBottomSideIn {
0% {
opacity: 0;
-ms-transform: scale(0.8) translateZ(-200px);
}
60% {
-ms-transform: scale(1) translateZ(0) rotateX(-15deg);
-ms-animation-timing-function: ease-out;
}
100% {
opacity: 1;
-ms-transform: scale(1) translateZ(0) rotateX(0deg);
}
}
@keyframes goCycleRotateBottomSideIn {
0% {
opacity: 0;
-webkit-transform: scale(0.8) translateZ(-200px);
transform: scale(0.8) translateZ(-200px);
}
60% {
-webkit-transform: scale(1) translateZ(0) rotateX(-15deg);
transform: scale(1) translateZ(0) rotateX(-15deg);
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out;
}
100% {
opacity: 1;
-webkit-transform: scale(1) translateZ(0) rotateX(0deg);
transform: scale(1) translateZ(0) rotateX(0deg);
}
}
/*****************************************/
/* Archive me */
/*****************************************/
.fxArchiveMe .navOutNext {
-webkit-animation: goCycleScaleHalfDown 0.7s forwards cubic-bezier(0.7, 0, 0.3, 1);
animation: goCycleScaleHalfDown 0.7s forwards cubic-bezier(0.7, 0, 0.3, 1);
}
.fxArchiveMe .navInNext {
z-index: 1001;
opacity: 1;
-webkit-animation: goCycleSlideInFromBottom 0.7s forwards cubic-bezier(0.7, 0, 0.3, 1);
animation: goCycleSlideInFromBottom 0.7s forwards cubic-bezier(0.7, 0, 0.3, 1);
}
.fxArchiveMe .navOutPrev {
-webkit-animation: goCycleSlideOutToBottom 0.7s forwards cubic-bezier(0.7, 0, 0.3, 1);
animation: goCycleSlideOutToBottom 0.7s forwards cubic-bezier(0.7, 0, 0.3, 1);
}
.fxArchiveMe .navInPrev {
-webkit-animation: goCycleScaleHalfUp 0.7s forwards cubic-bezier(0.7, 0, 0.3, 1);
animation: goCycleScaleHalfUp 0.7s forwards cubic-bezier(0.7, 0, 0.3, 1);
}
.fxArchiveMe li::before,
.fxArchiveMe li::after {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
pointer-events: none;
background-color: rgba(0, 0, 0, 0.7);
transition: opacity 0.7s cubic-bezier(0.7, 0, 0.3, 1);
}
.fxArchiveMe li::after,
.fxArchiveMe .navOutNext::before {
opacity: 1;
}
.fxArchiveMe li::before,
.fxArchiveMe li.current::after,
.fxArchiveMe .navInNext::after,
.fxArchiveMe .navInPrev::after {
opacity: 0;
}
.fxArchiveMe .navInNext::after {
transition: none;
}
@-webkit-keyframes goCycleScaleHalfDown {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-webkit-transform: scale(0.6);
opacity: 0;
}
}
@-moz-keyframes goCycleScaleHalfDown {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-moz-transform: scale(0.6);
opacity: 0;
}
}
@-ms-keyframes goCycleScaleHalfDown {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-ms-transform: scale(0.6);
opacity: 0;
}
}
@keyframes goCycleScaleHalfDown {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-webkit-transform: scale(0.6);
transform: scale(0.6);
opacity: 0;
}
}
@-webkit-keyframes goCycleSlideOutToBottom {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-webkit-transform: translateY(100%);
}
}
@-moz-keyframes goCycleSlideOutToBottom {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-moz-transform: translateY(100%);
}
}
@-ms-keyframes goCycleSlideOutToBottom {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-ms-transform: translateY(100%);
}
}
@keyframes goCycleSlideOutToBottom {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-webkit-transform: translateY(100%);
transform: translateY(100%);
}
}
@-webkit-keyframes goCycleScaleHalfUp {
from {
opacity: 0;
-webkit-transform: scale(0.6);
}
to {
opacity: 1;
-webkit-transform: scale(1);
}
}
@-moz-keyframes goCycleScaleHalfUp {
from {
opacity: 0;
-moz-transform: scale(0.6);
}
to {
opacity: 1;
-moz-transform: scale(1);
}
}
@-ms-keyframes goCycleScaleHalfUp {
from {
opacity: 0;
-ms-transform: scale(0.6);
}
to {
opacity: 1;
-ms-transform: scale(1);
}
}
@keyframes goCycleScaleHalfUp {
from {
opacity: 0;
-webkit-transform: scale(0.6);
transform: scale(0.6);
}
to {
opacity: 1;
-webkit-transform: scale(1);
transform: scale(1);
}
}
/*****************************************/
/* Vertical growth */
/*****************************************/
.fxVGrowth .navOutNext {
-webkit-animation: goCycleScaleDown 0.6s forwards cubic-bezier(0.6, 0, 0.4, 1);
animation: goCycleScaleDown 0.6s forwards cubic-bezier(0.6, 0, 0.4, 1);
}
.fxVGrowth .navInNext {
z-index: 1001;
opacity: 1;
-webkit-transform-origin: 50% 100%;
transform-origin: 50% 100%;
-webkit-animation: goCycleMaximize 0.6s forwards cubic-bezier(0.6, 0, 0.4, 1);
animation: goCycleMaximize 0.6s forwards cubic-bezier(0.6, 0, 0.4, 1);
}
.fxVGrowth .navOutPrev {
-webkit-animation: goCycleScaleDown 0.6s forwards cubic-bezier(0.6, 0, 0.4, 1);
animation: goCycleScaleDown 0.6s forwards cubic-bezier(0.6, 0, 0.4, 1);
}
.fxVGrowth .navInPrev {
z-index: 1001;
opacity: 1;
-webkit-transform-origin: 50% 0%;
transform-origin: 50% 0%;
-webkit-animation: goCycleMaximize 0.6s forwards cubic-bezier(0.6, 0, 0.4, 1);
animation: goCycleMaximize 0.6s forwards cubic-bezier(0.6, 0, 0.4, 1);
}
@-webkit-keyframes goCycleMaximize {
from {
-webkit-transform: scale(0);
}
to {
-webkit-transform: scale(1);
}
}
@-moz-keyframes goCycleMaximize {
from {
-moz-transform: scale(0);
}
to {
-moz-transform: scale(1);
}
}
@-ms-keyframes goCycleMaximize {
from {
-ms-transform: scale(0);
}
to {
-ms-transform: scale(1);
}
}
@keyframes goCycleMaximize {
from {
-webkit-transform: scale(0);
transform: scale(0);
}
to {
-webkit-transform: scale(1);
transform: scale(1);
}
}
/*****************************************/
/* Slide Behind */
/* From https://github.com/hakimel/kontext by Hakim El Hattab, http://hakim.se */
/*****************************************/
.fxSlideBehind .itemwrap {
-webkit-perspective: 1000px;
perspective: 1000px;
}
.fxSlideBehind .navOutNext {
-webkit-animation: goCycleHideLeft 0.8s forwards;
animation: goCycleHideLeft 0.8s forwards;
}
.fxSlideBehind .navInNext {
-webkit-animation: goCycleShowRight 0.8s forwards;
animation: goCycleShowRight 0.8s forwards;
}
.fxSlideBehind .navOutPrev {
-webkit-animation: goCycleHideRight 0.8s forwards;
animation: goCycleHideRight 0.8s forwards;
}
.fxSlideBehind .navInPrev {
-webkit-animation: goCycleShowLeft 0.8s forwards;
animation: goCycleShowLeft 0.8s forwards;
}
@-webkit-keyframes goCycleHideLeft {
0% {
-webkit-transform: translateZ(0px);
}
40% {
-webkit-transform: translate(0, -40%) scale(0.8) rotateX(-20deg);
z-index: 9999;
}
100% {
opacity: 1;
-webkit-transform: translateZ(-400px);
}
}
@-moz-keyframes goCycleHideLeft {
0% {
-moz-transform: translateZ(0px);
}
40% {
-moz-transform: translate(0, -40%) scale(0.8) rotateX(-20deg);
z-index: 9999;
}
100% {
opacity: 1;
-moz-transform: translateZ(-400px);
}
}
@-ms-keyframes goCycleHideLeft {
0% {
-ms-transform: translateZ(0px);
}
40% {
-ms-transform: translate(0, -40%) scale(0.8) rotateX(-20deg);
z-index: 9999;
}
100% {
opacity: 1;
-ms-transform: translateZ(-400px);
}
}
@keyframes goCycleHideLeft {
0% {
-webkit-transform: translateZ(0px);
transform: translateZ(0px);
}
40% {
-webkit-transform: translate(0, -40%) scale(0.8) rotateX(-20deg);
transform: translate(0, -40%) scale(0.8) rotateX(-20deg);
z-index: 9999;
}
100% {
opacity: 1;
-webkit-transform: translateZ(-400px);
transform: translateZ(-400px);
}
}
@-webkit-keyframes goCycleShowRight {
0% {
-webkit-transform: translateZ(-400px);
opacity: 1;
}
40% {
-webkit-transform: translate(0, 40%) scale(0.8) rotateX(20deg);
opacity: 1;
}
41% {
-webkit-transform: translate(0, 40%) scale(0.8) rotateX(20deg);
opacity: 1;
z-index: 9999;
}
100% {
-webkit-transform: translateZ(0px);
opacity: 1;
z-index: 9999;
}
}
@-moz-keyframes goCycleShowRight {
0% {
-moz-transform: translateZ(-400px);
opacity: 1;
}
40% {
-moz-transform: translate(0, 40%) scale(0.8) rotateX(20deg);
opacity: 1;
}
41% {
-moz-transform: translate(0, 40%) scale(0.8) rotateX(20deg);
opacity: 1;
z-index: 9999;
}
100% {
-moz-transform: translateZ(0px);
opacity: 1;
z-index: 9999;
}
}
@-ms-keyframes goCycleShowRight {
0% {
-ms-transform: translateZ(-400px);
opacity: 1;
}
40% {
-ms-transform: translate(0, 40%) scale(0.8) rotateX(20deg);
opacity: 1;
}
41% {
-ms-transform: translate(0, 40%) scale(0.8) rotateX(20deg);
opacity: 1;
z-index: 9999;
}
100% {
-ms-transform: translateZ(0px);
opacity: 1;
z-index: 9999;
}
}
@keyframes goCycleShowRight {
0% {
-webkit-transform: translateZ(-400px);
transform: translateZ(-400px);
opacity: 1;
}
40% {
-webkit-transform: translate(0, 40%) scale(0.8) rotateX(20deg);
transform: translate(0, 40%) scale(0.8) rotateX(20deg);
opacity: 1;
}
41% {
-webkit-transform: translate(0, 40%) scale(0.8) rotateX(20deg);
transform: translate(0, 40%) scale(0.8) rotateX(20deg);
opacity: 1;
z-index: 9999;
}
100% {
-webkit-transform: translateZ(0px);
transform: translateZ(0px);
opacity: 1;
z-index: 9999;
}
}
@-webkit-keyframes goCycleHideRight {
0% {
-webkit-transform: translateZ(0px);
}
40% {
-webkit-transform: translate(0, 40%) scale(0.8) rotateX(20deg);
z-index: 9999;
}
100% {
opacity: 1;
-webkit-transform: translateZ(-400px);
}
}
@-moz-keyframes goCycleHideRight {
0% {
-moz-transform: translateZ(0px);
}
40% {
-moz-transform: translate(0, 40%) scale(0.8) rotateX(20deg);
z-index: 9999;
}
100% {
opacity: 1;
-moz-transform: translateZ(-400px);
}
}
@-ms-keyframes goCycleHideRight {
0% {
-ms-transform: translateZ(0px);
}
40% {
-ms-transform: translate(0, 40%) scale(0.8) rotateX(20deg);
z-index: 9999;
}
100% {
opacity: 1;
-ms-transform: translateZ(-400px);
}
}
@keyframes goCycleHideRight {
0% {
-webkit-transform: translateZ(0px);
transform: translateZ(0px);
}
40% {
-webkit-transform: translate(0, 40%) scale(0.8) rotateX(20deg);
transform: translate(0, 40%) scale(0.8) rotateX(20deg);
z-index: 9999;
}
100% {
opacity: 1;
-webkit-transform: translateZ(-400px);
transform: translateZ(-400px);
}
}
@-webkit-keyframes goCycleShowLeft {
0% {
-webkit-transform: translateZ(-400px);
opacity: 1;
}
40% {
-webkit-transform: translate(0, -40%) scale(0.8) rotateX(-20deg);
opacity: 1;
}
41% {
-webkit-transform: translate(0, -40%) scale(0.8) rotateX(-20deg);
opacity: 1;
z-index: 9999;
}
100% {
-webkit-transform: translateZ(0px);
opacity: 1;
z-index: 9999;
}
}
@-moz-keyframes goCycleShowLeft {
0% {
-moz-transform: translateZ(-400px);
opacity: 1;
}
40% {
-moz-transform: translate(0, -40%) scale(0.8) rotateX(-20deg);
opacity: 1;
}
41% {
-moz-transform: translate(0, -40%) scale(0.8) rotateX(-20deg);
opacity: 1;
z-index: 9999;
}
100% {
-moz-transform: translateZ(0px);
opacity: 1;
z-index: 9999;
}
}
@-ms-keyframes goCycleShowLeft {
0% {
-ms-transform: translateZ(-400px);
opacity: 1;
}
40% {
-ms-transform: translate(0, -40%) scale(0.8) rotateX(-20deg);
opacity: 1;
}
41% {
-ms-transform: translate(0, -40%) scale(0.8) rotateX(-20deg);
opacity: 1;
z-index: 9999;
}
100% {
-ms-transform: translateZ(0px);
opacity: 1;
z-index: 9999;
}
}
@keyframes goCycleShowLeft {
0% {
-webkit-transform: translateZ(-400px);
transform: translateZ(-400px);
opacity: 1;
}
40% {
-webkit-transform: translate(0, -40%) scale(0.8) rotateX(-20deg);
transform: translate(0, -40%) scale(0.8) rotateX(-20deg);
opacity: 1;
}
41% {
-webkit-transform: translate(0, -40%) scale(0.8) rotateX(-20deg);
transform: translate(0, -40%) scale(0.8) rotateX(-20deg);
opacity: 1;
z-index: 9999;
}
100% {
-webkit-transform: translateZ(0px);
transform: translateZ(0px);
opacity: 1;
z-index: 9999;
}
}
/*****************************************/
/* Soft Pulse */
/*****************************************/
.fxSoftPulse .navOutPrev,
.fxSoftPulse .navOutNext {
-webkit-animation: goCycleScaleUpFadeOut 0.8s forwards ease-in;
animation: goCycleScaleUpFadeOut 0.8s forwards ease-in;
}
.fxSoftPulse .navInPrev,
.fxSoftPulse .navInNext {
-webkit-animation: goCycleScaleDownFadeIn 0.8s forwards ease-out;
animation: goCycleScaleDownFadeIn 0.8s forwards ease-out;
}
@-webkit-keyframes goCycleScaleUpFadeOut {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
50% {
-webkit-transform: scale(1.2);
opacity: 1;
}
75% {
-webkit-transform: scale(1.1);
opacity: 0;
}
100% {
-webkit-transform: scale(1);
opacity: 0;
}
}
@-moz-keyframes goCycleScaleUpFadeOut {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
50% {
-moz-transform: scale(1.2);
opacity: 1;
}
75% {
-moz-transform: scale(1.1);
opacity: 0;
}
100% {
-moz-transform: scale(1);
opacity: 0;
}
}
@-ms-keyframes goCycleScaleUpFadeOut {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
50% {
-ms-transform: scale(1.2);
opacity: 1;
}
75% {
-ms-transform: scale(1.1);
opacity: 0;
}
100% {
-ms-transform: scale(1);
opacity: 0;
}
}
@keyframes goCycleScaleUpFadeOut {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
50% {
-webkit-transform: scale(1.2);
transform: scale(1.2);
opacity: 1;
}
75% {
-webkit-transform: scale(1.1);
transform: scale(1.1);
opacity: 0;
}
100% {
-webkit-transform: scale(1);
transform: scale(1);
opacity: 0;
}
}
@-webkit-keyframes goCycleScaleDownFadeIn {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
50% {
opacity: 1;
-webkit-transform: scale(1.2);
}
100% {
opacity: 1;
-webkit-transform: scale(1);
}
}
@-moz-keyframes goCycleScaleDownFadeIn {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
50% {
opacity: 1;
-moz-transform: scale(1.2);
}
100% {
opacity: 1;
-moz-transform: scale(1);
}
}
@-ms-keyframes goCycleScaleDownFadeIn {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
50% {
opacity: 1;
-ms-transform: scale(1.2);
}
100% {
opacity: 1;
-ms-transform: scale(1);
}
}
@keyframes goCycleScaleDownFadeIn {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
50% {
opacity: 1;
-webkit-transform: scale(1.2);
transform: scale(1.2);
}
100% {
opacity: 1;
-webkit-transform: scale(1);
transform: scale(1);
}
}
/*****************************************/
/* Cliff diving */
/*****************************************/
.fxCliffDiving li {
-webkit-transform-origin: 50% 400%;
transform-origin: 50% 400%;
}
.fxCliffDiving .navOutNext {
opacity: 1;
-webkit-animation: goCycleRotateOutCircLeft 0.9s forwards cubic-bezier(0.7, 0, 0.3, 1);
animation: goCycleRotateOutCircLeft 0.9s forwards cubic-bezier(0.7, 0, 0.3, 1);
}
.fxCliffDiving .navInNext {
opacity: 1;
-webkit-animation: goCycleRotateInCircRight 0.9s forwards cubic-bezier(0.7, 0, 0.3, 1);
animation: goCycleRotateInCircRight 0.9s forwards cubic-bezier(0.7, 0, 0.3, 1);
}
.fxCliffDiving .navOutPrev {
opacity: 1;
-webkit-animation: goCycleRotateOutCircRight 0.9s forwards cubic-bezier(0.7, 0, 0.3, 1);
animation: goCycleRotateOutCircRight 0.9s forwards cubic-bezier(0.7, 0, 0.3, 1);
}
.fxCliffDiving .navInPrev {
opacity: 1;
-webkit-animation: goCycleRotateInCircLeft 0.9s forwards cubic-bezier(0.7, 0, 0.3, 1);
animation: goCycleRotateInCircLeft 0.9s forwards cubic-bezier(0.7, 0, 0.3, 1);
}
.fxCliffDiving li::after {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
opacity: 0;
pointer-events: none;
background-color: #000000;
transition: opacity 0.9s cubic-bezier(0.7, 0, 0.3, 1);
}
.fxCliffDiving .navOutPrev::after,
.fxCliffDiving .navOutNext::after {
opacity: 1;
}
@-webkit-keyframes goCycleRotateOutCircLeft {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-webkit-transform: rotate(-20deg) translateX(-100%);
}
}
@-moz-keyframes goCycleRotateOutCircLeft {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-moz-transform: rotate(-20deg) translateX(-100%);
}
}
@-ms-keyframes goCycleRotateOutCircLeft {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-ms-transform: rotate(-20deg) translateX(-100%);
}
}
@keyframes goCycleRotateOutCircLeft {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-webkit-transform: rotate(-20deg) translateX(-100%);
transform: rotate(-20deg) translateX(-100%);
}
}
@-webkit-keyframes goCycleRotateInCircRight {
from {
-webkit-transform: rotate(20deg) translateX(100%);
}
to {
-webkit-transform: rotate(0deg) translateX(0);
}
}
@-moz-keyframes goCycleRotateInCircRight {
from {
-moz-transform: rotate(20deg) translateX(100%);
}
to {
-moz-transform: rotate(0deg) translateX(0);
}
}
@-ms-keyframes goCycleRotateInCircRight {
from {
-ms-transform: rotate(20deg) translateX(100%);
}
to {
-ms-transform: rotate(0deg) translateX(0);
}
}
@keyframes goCycleRotateInCircRight {
from {
-webkit-transform: rotate(20deg) translateX(100%);
transform: rotate(20deg) translateX(100%);
}
to {
-webkit-transform: rotate(0deg) translateX(0);
transform: rotate(0deg) translateX(0);
}
}
@-webkit-keyframes goCycleRotateOutCircRight {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-webkit-transform: rotate(20deg) translateX(100%);
}
}
@-moz-keyframes goCycleRotateOutCircRight {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-moz-transform: rotate(20deg) translateX(100%);
}
}
@-ms-keyframes goCycleRotateOutCircRight {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-ms-transform: rotate(20deg) translateX(100%);
}
}
@keyframes goCycleRotateOutCircRight {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-webkit-transform: rotate(20deg) translateX(100%);
transform: rotate(20deg) translateX(100%);
}
}
@-webkit-keyframes goCycleRotateInCircLeft {
from {
-webkit-transform: rotate(-20deg) translateX(-100%);
}
to {
-webkit-transform: rotate(0deg) translateX(0);
}
}
@-moz-keyframes goCycleRotateInCircLeft {
from {
-moz-transform: rotate(-20deg) translateX(-100%);
}
to {
-moz-transform: rotate(0deg) translateX(0);
}
}
@-ms-keyframes goCycleRotateInCircLeft {
from {
-ms-transform: rotate(-20deg) translateX(-100%);
}
to {
-ms-transform: rotate(0deg) translateX(0);
}
}
@keyframes goCycleRotateInCircLeft {
from {
-webkit-transform: rotate(-20deg) translateX(-100%);
transform: rotate(-20deg) translateX(-100%);
}
to {
-webkit-transform: rotate(0deg) translateX(0);
transform: rotate(0deg) translateX(0);
}
}
/***************************************************************************************************************************/
/********************************************************** FX SMALL *******************************************************/
/***************************************************************************************************************************/
/*****************************************/
/* Corner scale */
/*****************************************/
.fxCorner .navOutNext {
-webkit-transform-origin: 0% 100%;
transform-origin: 0% 100%;
-webkit-animation: goCycleSmallContentCornerScaleDown 0.3s forwards ease-in-out;
animation: goCycleSmallContentCornerScaleDown 0.3s forwards ease-in-out;
}
.fxCorner .navInNext {
opacity: 1;
-webkit-transform-origin: 100% 0%;
transform-origin: 100% 0%;
-webkit-animation: goCycleSmallContentCornerScaleUp 0.3s 0.1s forwards ease-in-out;
animation: goCycleSmallContentCornerScaleUp 0.3s 0.1s forwards ease-in-out;
}
.fxCorner .navOutPrev {
-webkit-transform-origin: 100% 0%;
transform-origin: 100% 0%;
-webkit-animation: goCycleSmallContentCornerScaleDown 0.3s forwards ease-in-out;
animation: goCycleSmallContentCornerScaleDown 0.3s forwards ease-in-out;
}
.fxCorner .navInPrev {
opacity: 1;
-webkit-transform-origin: 0% 100%;
transform-origin: 0% 100%;
-webkit-animation: goCycleSmallContentCornerScaleUp 0.3s 0.1s forwards ease-in-out;
animation: goCycleSmallContentCornerScaleUp 0.3s 0.1s forwards ease-in-out;
}
@-webkit-keyframes goCycleSmallContentCornerScaleUp {
from {
-webkit-transform: scale(0);
}
to {
-webkit-transform: scale(1);
}
}
@-moz-keyframes goCycleSmallContentCornerScaleUp {
from {
-moz-transform: scale(0);
}
to {
-moz-transform: scale(1);
}
}
@-ms-keyframes goCycleSmallContentCornerScaleUp {
from {
-ms-transform: scale(0);
}
to {
-ms-transform: scale(1);
}
}
@keyframes goCycleSmallContentCornerScaleUp {
from {
-webkit-transform: scale(0);
transform: scale(0);
}
to {
-webkit-transform: scale(1);
transform: scale(1);
}
}
@-webkit-keyframes goCycleSmallContentCornerScaleDown {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
50% {
-webkit-transform: scale(1.1);
}
100% {
-webkit-transform: scale(0);
}
}
@-moz-keyframes goCycleSmallContentCornerScaleDown {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
50% {
-moz-transform: scale(1.1);
}
100% {
-moz-transform: scale(0);
}
}
@-ms-keyframes goCycleSmallContentCornerScaleDown {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
50% {
-ms-transform: scale(1.1);
}
100% {
-ms-transform: scale(0);
}
}
@keyframes goCycleSmallContentCornerScaleDown {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
50% {
-webkit-transform: scale(1.1);
transform: scale(1.1);
}
100% {
-webkit-transform: scale(0);
transform: scale(0);
}
}
/*****************************************/
/* Vertical scale */
/*****************************************/
.fxVScale .navOutNext {
-webkit-animation: goCycleSmallContentScaleDownNext 0.3s forwards ease-in-out;
animation: goCycleSmallContentScaleDownNext 0.3s forwards ease-in-out;
}
.fxVScale .navInNext {
-webkit-animation: goCycleSmallContentScaleUpNext 0.3s 0.2s forwards ease-in-out;
animation: goCycleSmallContentScaleUpNext 0.3s 0.2s forwards ease-in-out;
}
.fxVScale .navOutPrev {
-webkit-animation: goCycleSmallContentScaleDownPrev 0.3s forwards ease-in-out;
animation: goCycleSmallContentScaleDownPrev 0.3s forwards ease-in-out;
}
.fxVScale .navInPrev {
-webkit-animation: goCycleSmallContentScaleUpPrev 0.3s 0.2s forwards ease-in-out;
animation: goCycleSmallContentScaleUpPrev 0.3s 0.2s forwards ease-in-out;
}
@-webkit-keyframes goCycleSmallContentScaleDownNext {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
50% {
-webkit-transform: translateY(-25%) scale(1.1);
opacity: 1;
}
100% {
-webkit-transform: translateY(75%) scale(0);
opacity: 0;
}
}
@-moz-keyframes goCycleSmallContentScaleDownNext {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
50% {
-moz-transform: translateY(-25%) scale(1.1);
opacity: 1;
}
100% {
-moz-transform: translateY(75%) scale(0);
opacity: 0;
}
}
@-ms-keyframes goCycleSmallContentScaleDownNext {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
50% {
-ms-transform: translateY(-25%) scale(1.1);
opacity: 1;
}
100% {
-ms-transform: translateY(75%) scale(0);
opacity: 0;
}
}
@keyframes goCycleSmallContentScaleDownNext {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
50% {
-webkit-transform: translateY(-25%) scale(1.1);
transform: translateY(-25%) scale(1.1);
opacity: 1;
}
100% {
-webkit-transform: translateY(75%) scale(0);
transform: translateY(75%) scale(0);
opacity: 0;
}
}
@-webkit-keyframes goCycleSmallContentScaleUpNext {
from {
-webkit-transform: translateY(-75%) scale(0);
}
to {
-webkit-transform: translateY(0) scale(1);
opacity: 1;
}
}
@-moz-keyframes goCycleSmallContentScaleUpNext {
from {
-moz-transform: translateY(-75%) scale(0);
}
to {
-moz-transform: translateY(0) scale(1);
opacity: 1;
}
}
@-ms-keyframes goCycleSmallContentScaleUpNext {
from {
-ms-transform: translateY(-75%) scale(0);
}
to {
-ms-transform: translateY(0) scale(1);
opacity: 1;
}
}
@keyframes goCycleSmallContentScaleUpNext {
from {
-webkit-transform: translateY(-75%) scale(0);
transform: translateY(-75%) scale(0);
}
to {
-webkit-transform: translateY(0) scale(1);
transform: translateY(0) scale(1);
opacity: 1;
}
}
@-webkit-keyframes goCycleSmallContentScaleDownPrev {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
50% {
-webkit-transform: translateY(25%) scale(1.1);
opacity: 1;
}
100% {
-webkit-transform: translateY(-75%) scale(0);
opacity: 0;
}
}
@-moz-keyframes goCycleSmallContentScaleDownPrev {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
50% {
-moz-transform: translateY(25%) scale(1.1);
opacity: 1;
}
100% {
-moz-transform: translateY(-75%) scale(0);
opacity: 0;
}
}
@-ms-keyframes goCycleSmallContentScaleDownPrev {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
50% {
-ms-transform: translateY(25%) scale(1.1);
opacity: 1;
}
100% {
-ms-transform: translateY(-75%) scale(0);
opacity: 0;
}
}
@keyframes goCycleSmallContentScaleDownPrev {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
50% {
-webkit-transform: translateY(25%) scale(1.1);
transform: translateY(25%) scale(1.1);
opacity: 1;
}
100% {
-webkit-transform: translateY(-75%) scale(0);
transform: translateY(-75%) scale(0);
opacity: 0;
}
}
@-webkit-keyframes goCycleSmallContentScaleUpPrev {
from {
-webkit-transform: translateY(75%) scale(0);
}
to {
-webkit-transform: translateY(0) scale(1);
opacity: 1;
}
}
@-moz-keyframes goCycleSmallContentScaleUpPrev {
from {
-moz-transform: translateY(75%) scale(0);
}
to {
-moz-transform: translateY(0) scale(1);
opacity: 1;
}
}
@-ms-keyframes goCycleSmallContentScaleUpPrev {
from {
-ms-transform: translateY(75%) scale(0);
}
to {
-ms-transform: translateY(0) scale(1);
opacity: 1;
}
}
@keyframes goCycleSmallContentScaleUpPrev {
from {
-webkit-transform: translateY(75%) scale(0);
transform: translateY(75%) scale(0);
}
to {
-webkit-transform: translateY(0) scale(1);
transform: translateY(0) scale(1);
opacity: 1;
}
}
/*****************************************/
/* Fall */
/*****************************************/
.fxFall .navOutNext {
-webkit-animation: goCycleSmallContentSlideDown 0.4s forwards;
animation: goCycleSmallContentSlideDown 0.4s forwards;
}
.fxFall .navInNext {
-webkit-animation: goCycleSmallContentShowUp 0.4s forwards;
animation: goCycleSmallContentShowUp 0.4s forwards;
}
.fxFall .navOutPrev {
-webkit-animation: goCycleSmallContentHideDown 0.4s forwards;
animation: goCycleSmallContentHideDown 0.4s forwards;
}
.fxFall .navInPrev {
-webkit-animation: goCycleSmallContentSlideUp 0.4s forwards;
animation: goCycleSmallContentSlideUp 0.4s forwards;
}
@-webkit-keyframes goCycleSmallContentSlideDown {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-webkit-transform: translateY(150%);
opacity: 0;
}
}
@-moz-keyframes goCycleSmallContentSlideDown {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-moz-transform: translateY(150%);
opacity: 0;
}
}
@-ms-keyframes goCycleSmallContentSlideDown {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-ms-transform: translateY(150%);
opacity: 0;
}
}
@keyframes goCycleSmallContentSlideDown {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-webkit-transform: translateY(150%);
transform: translateY(150%);
opacity: 0;
}
}
@-webkit-keyframes goCycleSmallContentShowUp {
from {
-webkit-transform: scale(0.5);
}
to {
-webkit-transform: scale(1);
opacity: 1;
}
}
@-moz-keyframes goCycleSmallContentShowUp {
from {
-moz-transform: scale(0.5);
}
to {
-moz-transform: scale(1);
opacity: 1;
}
}
@-ms-keyframes goCycleSmallContentShowUp {
from {
-ms-transform: scale(0.5);
}
to {
-ms-transform: scale(1);
opacity: 1;
}
}
@keyframes goCycleSmallContentShowUp {
from {
-webkit-transform: scale(0.5);
transform: scale(0.5);
}
to {
-webkit-transform: scale(1);
transform: scale(1);
opacity: 1;
}
}
@-webkit-keyframes goCycleSmallContentHideDown {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-webkit-transform: scale(0.5);
opacity: 0;
}
}
@-moz-keyframes goCycleSmallContentHideDown {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-moz-transform: scale(0.5);
opacity: 0;
}
}
@-ms-keyframes goCycleSmallContentHideDown {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-ms-transform: scale(0.5);
opacity: 0;
}
}
@keyframes goCycleSmallContentHideDown {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-webkit-transform: scale(0.5);
transform: scale(0.5);
opacity: 0;
}
}
@-webkit-keyframes goCycleSmallContentSlideUp {
from {
-webkit-transform: translateY(150%);
}
to {
-webkit-transform: translateY(0%);
opacity: 1;
}
}
@-moz-keyframes goCycleSmallContentSlideUp {
from {
-moz-transform: translateY(150%);
}
to {
-moz-transform: translateY(0%);
opacity: 1;
}
}
@-ms-keyframes goCycleSmallContentSlideUp {
from {
-ms-transform: translateY(150%);
}
to {
-ms-transform: translateY(0%);
opacity: 1;
}
}
@keyframes goCycleSmallContentSlideUp {
from {
-webkit-transform: translateY(150%);
transform: translateY(150%);
}
to {
-webkit-transform: translateY(0%);
transform: translateY(0%);
opacity: 1;
}
}
/*****************************************/
/* Forward pulse */
/*****************************************/
.fxFPulse .navOutNext {
-webkit-animation: goCycleSmallContentElastScaleUp 0.4s forwards;
animation: goCycleSmallContentElastScaleUp 0.4s forwards;
}
.fxFPulse .navInNext {
-webkit-animation: goCycleSmallContentGrowUp 0.4s 0.3s forwards;
animation: goCycleSmallContentGrowUp 0.4s 0.3s forwards;
}
.fxFPulse .navOutPrev {
-webkit-animation: goCycleSmallContentElastScaleDown 0.4s forwards;
animation: goCycleSmallContentElastScaleDown 0.4s forwards;
}
.fxFPulse .navInPrev {
-webkit-animation: goCycleSmallContentGrowDown 0.4s 0.3s forwards;
animation: goCycleSmallContentGrowDown 0.4s 0.3s forwards;
}
@-webkit-keyframes goCycleSmallContentElastScaleUp {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
30% {
-webkit-transform: scale(0.7);
opacity: 1;
}
100% {
-webkit-transform: scale(1.3);
opacity: 0;
}
}
@-moz-keyframes goCycleSmallContentElastScaleUp {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
30% {
-moz-transform: scale(0.7);
opacity: 1;
}
100% {
-moz-transform: scale(1.3);
opacity: 0;
}
}
@-ms-keyframes goCycleSmallContentElastScaleUp {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
30% {
-ms-transform: scale(0.7);
opacity: 1;
}
100% {
-ms-transform: scale(1.3);
opacity: 0;
}
}
@keyframes goCycleSmallContentElastScaleUp {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
30% {
-webkit-transform: scale(0.7);
transform: scale(0.7);
opacity: 1;
}
100% {
-webkit-transform: scale(1.3);
transform: scale(1.3);
opacity: 0;
}
}
@-webkit-keyframes goCycleSmallContentGrowUp {
0% {
-webkit-transform: scale(0);
}
100% {
-webkit-transform: scale(1);
opacity: 1;
}
}
@-moz-keyframes goCycleSmallContentGrowUp {
0% {
-moz-transform: scale(0);
}
100% {
-moz-transform: scale(1);
opacity: 1;
}
}
@-ms-keyframes goCycleSmallContentGrowUp {
0% {
-ms-transform: scale(0);
}
100% {
-ms-transform: scale(1);
opacity: 1;
}
}
@keyframes goCycleSmallContentGrowUp {
0% {
-webkit-transform: scale(0);
transform: scale(0);
}
100% {
-webkit-transform: scale(1);
transform: scale(1);
opacity: 1;
}
}
@-webkit-keyframes goCycleSmallContentElastScaleDown {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
30% {
-webkit-transform: scale(1.3);
opacity: .5;
}
100% {
-webkit-transform: scale(0);
opacity: 0;
}
}
@-moz-keyframes goCycleSmallContentElastScaleDown {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
30% {
-moz-transform: scale(1.3);
opacity: .5;
}
100% {
-moz-transform: scale(0);
opacity: 0;
}
}
@-ms-keyframes goCycleSmallContentElastScaleDown {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
30% {
-ms-transform: scale(1.3);
opacity: .5;
}
100% {
-ms-transform: scale(0);
opacity: 0;
}
}
@keyframes goCycleSmallContentElastScaleDown {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
30% {
-webkit-transform: scale(1.3);
transform: scale(1.3);
opacity: .5;
}
100% {
-webkit-transform: scale(0);
transform: scale(0);
opacity: 0;
}
}
@-webkit-keyframes goCycleSmallContentGrowDown {
0% {
-webkit-transform: scale(1.3);
opacity: 0;
}
100% {
-webkit-transform: scale(1);
opacity: 1;
}
}
@-moz-keyframes goCycleSmallContentGrowDown {
0% {
-moz-transform: scale(1.3);
opacity: 0;
}
100% {
-moz-transform: scale(1);
opacity: 1;
}
}
@-ms-keyframes goCycleSmallContentGrowDown {
0% {
-ms-transform: scale(1.3);
opacity: 0;
}
100% {
-ms-transform: scale(1);
opacity: 1;
}
}
@keyframes goCycleSmallContentGrowDown {
0% {
-webkit-transform: scale(1.3);
transform: scale(1.3);
opacity: 0;
}
100% {
-webkit-transform: scale(1);
transform: scale(1);
opacity: 1;
}
}
/*****************************************/
/* Rotate pulse */
/*****************************************/
.fxRPulse .navOutNext {
-webkit-animation: goCycleSmallContentElastScaleRotateUp 0.4s forwards;
animation: goCycleSmallContentElastScaleRotateUp 0.4s forwards;
}
.fxRPulse .navInNext {
-webkit-animation: goCycleSmallContentGrowRotateUp 0.4s 0.3s forwards;
animation: goCycleSmallContentGrowRotateUp 0.4s 0.3s forwards;
}
.fxRPulse .navOutPrev {
-webkit-animation: goCycleSmallContentElastScaleRotateDown 0.4s forwards;
animation: goCycleSmallContentElastScaleRotateDown 0.4s forwards;
}
.fxRPulse .navInPrev {
-webkit-animation: goCycleSmallContentGrowRotateDown 0.4s 0.3s forwards;
animation: goCycleSmallContentGrowRotateDown 0.4s 0.3s forwards;
}
@-webkit-keyframes goCycleSmallContentElastScaleRotateUp {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
30% {
-webkit-transform: rotate(5deg) scale(0.7);
opacity: 1;
}
100% {
-webkit-transform: rotate(25deg) scale(1.3);
opacity: 0;
}
}
@-moz-keyframes goCycleSmallContentElastScaleRotateUp {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
30% {
-moz-transform: rotate(5deg) scale(0.7);
opacity: 1;
}
100% {
-moz-transform: rotate(25deg) scale(1.3);
opacity: 0;
}
}
@-ms-keyframes goCycleSmallContentElastScaleRotateUp {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
30% {
-ms-transform: rotate(5deg) scale(0.7);
opacity: 1;
}
100% {
-ms-transform: rotate(25deg) scale(1.3);
opacity: 0;
}
}
@keyframes goCycleSmallContentElastScaleRotateUp {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
30% {
-webkit-transform: rotate(5deg) scale(0.7);
transform: rotate(5deg) scale(0.7);
opacity: 1;
}
100% {
-webkit-transform: rotate(25deg) scale(1.3);
transform: rotate(25deg) scale(1.3);
opacity: 0;
}
}
@-webkit-keyframes goCycleSmallContentGrowRotateUp {
0% {
-webkit-transform: rotate(-25deg) scale(0);
}
100% {
-webkit-transform: rotate(0deg) scale(1);
opacity: 1;
}
}
@-moz-keyframes goCycleSmallContentGrowRotateUp {
0% {
-moz-transform: rotate(-25deg) scale(0);
}
100% {
-moz-transform: rotate(0deg) scale(1);
opacity: 1;
}
}
@-ms-keyframes goCycleSmallContentGrowRotateUp {
0% {
-ms-transform: rotate(-25deg) scale(0);
}
100% {
-ms-transform: rotate(0deg) scale(1);
opacity: 1;
}
}
@keyframes goCycleSmallContentGrowRotateUp {
0% {
-webkit-transform: rotate(-25deg) scale(0);
transform: rotate(-25deg) scale(0);
}
100% {
-webkit-transform: rotate(0deg) scale(1);
transform: rotate(0deg) scale(1);
opacity: 1;
}
}
@-webkit-keyframes goCycleSmallContentElastScaleRotateDown {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
30% {
-webkit-transform: rotate(-5deg) scale(1.3);
opacity: .5;
}
100% {
-webkit-transform: rotate(-25deg) scale(0);
opacity: 0;
}
}
@-moz-keyframes goCycleSmallContentElastScaleRotateDown {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
30% {
-moz-transform: rotate(-5deg) scale(1.3);
opacity: .5;
}
100% {
-moz-transform: rotate(-25deg) scale(0);
opacity: 0;
}
}
@-ms-keyframes goCycleSmallContentElastScaleRotateDown {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
30% {
-ms-transform: rotate(-5deg) scale(1.3);
opacity: .5;
}
100% {
-ms-transform: rotate(-25deg) scale(0);
opacity: 0;
}
}
@keyframes goCycleSmallContentElastScaleRotateDown {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
30% {
-webkit-transform: rotate(-5deg) scale(1.3);
transform: rotate(-5deg) scale(1.3);
opacity: .5;
}
100% {
-webkit-transform: rotate(-25deg) scale(0);
transform: rotate(-25deg) scale(0);
opacity: 0;
}
}
@-webkit-keyframes goCycleSmallContentGrowRotateDown {
0% {
-webkit-transform: rotate(10deg) scale(1.3);
}
100% {
-webkit-transform: rotate(0deg) scale(1);
opacity: 1;
}
}
@-moz-keyframes goCycleSmallContentGrowRotateDown {
0% {
-moz-transform: rotate(10deg) scale(1.3);
}
100% {
-moz-transform: rotate(0deg) scale(1);
opacity: 1;
}
}
@-ms-keyframes goCycleSmallContentGrowRotateDown {
0% {
-ms-transform: rotate(10deg) scale(1.3);
}
100% {
-ms-transform: rotate(0deg) scale(1);
opacity: 1;
}
}
@keyframes goCycleSmallContentGrowRotateDown {
0% {
-webkit-transform: rotate(10deg) scale(1.3);
transform: rotate(10deg) scale(1.3);
}
100% {
-webkit-transform: rotate(0deg) scale(1);
transform: rotate(0deg) scale(1);
opacity: 1;
}
}
/*****************************************/
/* Hearbeat */
/*****************************************/
.fxHearbeat .navOutNext {
-webkit-animation: goCycleSmallContentScaleUpDown 0.4s forwards ease-in;
animation: goCycleSmallContentScaleUpDown 0.4s forwards ease-in;
}
.fxHearbeat .navInNext {
-webkit-animation: goCycleSmallContentGrowUp 0.4s 0.3s forwards;
animation: goCycleSmallContentGrowUp 0.4s 0.3s forwards;
}
.fxHearbeat .navOutPrev {
-webkit-animation: goCycleSmallContentScaleUpDown 0.4s forwards ease-in;
animation: goCycleSmallContentScaleUpDown 0.4s forwards ease-in;
}
.fxHearbeat .navInPrev {
-webkit-animation: goCycleSmallContentGrowUp 0.4s 0.3s forwards;
animation: goCycleSmallContentGrowUp 0.4s 0.3s forwards;
}
@-webkit-keyframes goCycleSmallContentScaleUpDown {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
70% {
-webkit-transform: scale(1.3);
opacity: .8;
}
80% {
-webkit-transform: scale(1);
opacity: 1;
-webkit-animation-timing-function: ease-out;
}
100% {
-webkit-transform: scale(0.5);
opacity: 0;
-webkit-animation-timing-function: ease-out;
}
}
@-moz-keyframes goCycleSmallContentScaleUpDown {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
70% {
-moz-transform: scale(1.3);
opacity: .8;
}
80% {
-moz-transform: scale(1);
opacity: 1;
-moz-animation-timing-function: ease-out;
}
100% {
-moz-transform: scale(0.5);
opacity: 0;
-moz-animation-timing-function: ease-out;
}
}
@-ms-keyframes goCycleSmallContentScaleUpDown {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
70% {
-ms-transform: scale(1.3);
opacity: .8;
}
80% {
-ms-transform: scale(1);
opacity: 1;
-ms-animation-timing-function: ease-out;
}
100% {
-ms-transform: scale(0.5);
opacity: 0;
-ms-animation-timing-function: ease-out;
}
}
@keyframes goCycleSmallContentScaleUpDown {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
70% {
-webkit-transform: scale(1.3);
transform: scale(1.3);
opacity: .8;
}
80% {
-webkit-transform: scale(1);
transform: scale(1);
opacity: 1;
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out;
}
100% {
-webkit-transform: scale(0.5);
transform: scale(0.5);
opacity: 0;
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out;
}
}
/*****************************************/
/* coverflow */
/*****************************************/
.fxCoverflow .itemwrap {
-webkit-perspective: 1400px;
perspective: 1400px;
}
.fxCoverflow .navOutNext {
-webkit-animation: goCycleSmallContentRotate3DSlideOutLeft 0.3s forwards;
animation: goCycleSmallContentRotate3DSlideOutLeft 0.3s forwards;
}
.fxCoverflow .navInNext {
-webkit-animation: goCycleSmallContentRotate3DSlideInRight 0.3s 0.1s forwards;
animation: goCycleSmallContentRotate3DSlideInRight 0.3s 0.1s forwards;
}
.fxCoverflow .navOutPrev {
-webkit-animation: goCycleSmallContentRotate3DSlideOutRight 0.3s forwards;
animation: goCycleSmallContentRotate3DSlideOutRight 0.3s forwards;
}
.fxCoverflow .navInPrev {
-webkit-animation: goCycleSmallContentRotate3DSlideInLeft 0.3s 0.1s forwards;
animation: goCycleSmallContentRotate3DSlideInLeft 0.3s 0.1s forwards;
}
@-webkit-keyframes goCycleSmallContentRotate3DSlideOutLeft {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-webkit-transform: translateX(-40%) rotateY(45deg) translateZ(-300px);
opacity: 0;
}
}
@-moz-keyframes goCycleSmallContentRotate3DSlideOutLeft {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-moz-transform: translateX(-40%) rotateY(45deg) translateZ(-300px);
opacity: 0;
}
}
@-ms-keyframes goCycleSmallContentRotate3DSlideOutLeft {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-ms-transform: translateX(-40%) rotateY(45deg) translateZ(-300px);
opacity: 0;
}
}
@keyframes goCycleSmallContentRotate3DSlideOutLeft {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-webkit-transform: translateX(-40%) rotateY(45deg) translateZ(-300px);
transform: translateX(-40%) rotateY(45deg) translateZ(-300px);
opacity: 0;
}
}
@-webkit-keyframes goCycleSmallContentRotate3DSlideInRight {
from {
-webkit-transform: translateX(40%) rotateY(-45deg) translateZ(-300px);
}
to {
-webkit-transform: translateX(0) rotateY(0deg) translateZ(0);
opacity: 1;
}
}
@-moz-keyframes goCycleSmallContentRotate3DSlideInRight {
from {
-moz-transform: translateX(40%) rotateY(-45deg) translateZ(-300px);
}
to {
-moz-transform: translateX(0) rotateY(0deg) translateZ(0);
opacity: 1;
}
}
@-ms-keyframes goCycleSmallContentRotate3DSlideInRight {
from {
-ms-transform: translateX(40%) rotateY(-45deg) translateZ(-300px);
}
to {
-ms-transform: translateX(0) rotateY(0deg) translateZ(0);
opacity: 1;
}
}
@keyframes goCycleSmallContentRotate3DSlideInRight {
from {
-webkit-transform: translateX(40%) rotateY(-45deg) translateZ(-300px);
transform: translateX(40%) rotateY(-45deg) translateZ(-300px);
}
to {
-webkit-transform: translateX(0) rotateY(0deg) translateZ(0);
transform: translateX(0) rotateY(0deg) translateZ(0);
opacity: 1;
}
}
@-webkit-keyframes goCycleSmallContentRotate3DSlideOutRight {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-webkit-transform: translateX(40%) rotateY(-45deg) translateZ(-300px);
opacity: 0;
}
}
@-moz-keyframes goCycleSmallContentRotate3DSlideOutRight {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-webkit-transform: translateX(40%) rotateY(-45deg) translateZ(-300px);
opacity: 0;
}
}
@-ms-keyframes goCycleSmallContentRotate3DSlideOutRight {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-webkit-transform: translateX(40%) rotateY(-45deg) translateZ(-300px);
opacity: 0;
}
}
@keyframes goCycleSmallContentRotate3DSlideOutRight {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-webkit-transform: translateX(40%) rotateY(-45deg) translateZ(-300px);
transform: translateX(40%) rotateY(-45deg) translateZ(-300px);
opacity: 0;
}
}
@-webkit-keyframes goCycleSmallContentRotate3DSlideInLeft {
from {
-webkit-transform: translateX(-40%) rotateY(45deg) translateZ(-300px);
}
to {
-webkit-transform: translateX(0) rotateY(0deg) translateZ(0);
opacity: 1;
}
}
@-moz-keyframes goCycleSmallContentRotate3DSlideInLeft {
from {
-moz-transform: translateX(-40%) rotateY(45deg) translateZ(-300px);
}
to {
-moz-transform: translateX(0) rotateY(0deg) translateZ(0);
opacity: 1;
}
}
@-ms-keyframes goCycleSmallContentRotate3DSlideInLeft {
from {
-ms-transform: translateX(-40%) rotateY(45deg) translateZ(-300px);
}
to {
-ms-transform: translateX(0) rotateY(0deg) translateZ(0);
opacity: 1;
}
}
@keyframes goCycleSmallContentRotate3DSlideInLeft {
from {
-webkit-transform: translateX(-40%) rotateY(45deg) translateZ(-300px);
transform: translateX(-40%) rotateY(45deg) translateZ(-300px);
}
to {
-webkit-transform: translateX(0) rotateY(0deg) translateZ(0);
transform: translateX(0) rotateY(0deg) translateZ(0);
opacity: 1;
}
}
/*****************************************/
/* Rotate me softly */
/*****************************************/
.fxRotateSoftly .itemwrap {
-webkit-perspective: 1600px;
perspective: 1600px;
}
.fxRotateSoftly .navOutNext {
-webkit-animation: goCycleSmallContentRotate3DOutRight 1s forwards cubic-bezier(0.7, 0, 0.3, 1);
animation: goCycleSmallContentRotate3DOutRight 1s forwards cubic-bezier(0.7, 0, 0.3, 1);
}
.fxRotateSoftly .navInNext {
-webkit-animation: goCycleSmallContentSlideInFromLeft 0.4s 0.5s forwards cubic-bezier(0, 0, 0, 1);
animation: goCycleSmallContentSlideInFromLeft 0.4s 0.5s forwards cubic-bezier(0, 0, 0, 1);
}
.fxRotateSoftly .navOutPrev {
-webkit-animation: goCycleSmallContentRotate3DOutLeft 1s forwards cubic-bezier(0.7, 0, 0.3, 1);
animation: goCycleSmallContentRotate3DOutLeft 1s forwards cubic-bezier(0.7, 0, 0.3, 1);
}
.fxRotateSoftly .navInPrev {
-webkit-animation: goCycleSmallContentSlideInFromRight 0.4s 0.5s forwards cubic-bezier(0, 0, 0, 1);
animation: goCycleSmallContentSlideInFromRight 0.4s 0.5s forwards cubic-bezier(0, 0, 0, 1);
}
@-webkit-keyframes goCycleSmallContentRotate3DOutRight {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-webkit-transform: translate(50%) rotateY(-70deg) rotateX(20deg) translateZ(-300px);
opacity: 0;
}
}
@-moz-keyframes goCycleSmallContentRotate3DOutRight {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-moz-transform: translate(50%) rotateY(-70deg) rotateX(20deg) translateZ(-300px);
opacity: 0;
}
}
@-ms-keyframes goCycleSmallContentRotate3DOutRight {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-ms-transform: translate(50%) rotateY(-70deg) rotateX(20deg) translateZ(-300px);
opacity: 0;
}
}
@keyframes goCycleSmallContentRotate3DOutRight {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-webkit-transform: translate(50%) rotateY(-70deg) rotateX(20deg) translateZ(-300px);
transform: translate(50%) rotateY(-70deg) rotateX(20deg) translateZ(-300px);
opacity: 0;
}
}
@-webkit-keyframes goCycleSmallContentSlideInFromLeft {
from {
-webkit-transform: translateX(-200%);
}
to {
-webkit-transform: translateX(0);
opacity: 1;
}
}
@-moz-keyframes goCycleSmallContentSlideInFromLeft {
from {
-moz-transform: translateX(-200%);
}
to {
-moz-transform: translateX(0);
opacity: 1;
}
}
@-ms-keyframes goCycleSmallContentSlideInFromLeft {
from {
-ms-transform: translateX(-200%);
}
to {
-ms-transform: translateX(0);
opacity: 1;
}
}
@keyframes goCycleSmallContentSlideInFromLeft {
from {
-webkit-transform: translateX(-200%);
transform: translateX(-200%);
}
to {
-webkit-transform: translateX(0);
transform: translateX(0);
opacity: 1;
}
}
@-webkit-keyframes goCycleSmallContentRotate3DOutLeft {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-webkit-transform: translate(-50%) rotateY(70deg) rotateX(20deg) translateZ(-300px);
opacity: 0;
}
}
@-moz-keyframes goCycleSmallContentRotate3DOutLeft {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-moz-transform: translate(-50%) rotateY(70deg) rotateX(20deg) translateZ(-300px);
opacity: 0;
}
}
@-ms-keyframes goCycleSmallContentRotate3DOutLeft {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-ms-transform: translate(-50%) rotateY(70deg) rotateX(20deg) translateZ(-300px);
opacity: 0;
}
}
@keyframes goCycleSmallContentRotate3DOutLeft {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-webkit-transform: translate(-50%) rotateY(70deg) rotateX(20deg) translateZ(-300px);
transform: translate(-50%) rotateY(70deg) rotateX(20deg) translateZ(-300px);
opacity: 0;
}
}
@-webkit-keyframes goCycleSmallContentSlideInFromRight {
from {
-webkit-transform: translateX(200%);
}
to {
-webkit-transform: translateX(0);
opacity: 1;
}
}
@-moz-keyframes goCycleSmallContentSlideInFromRight {
from {
-moz-transform: translateX(200%);
}
to {
-moz-transform: translateX(0);
opacity: 1;
}
}
@-ms-keyframes goCycleSmallContentSlideInFromRight {
from {
-ms-transform: translateX(200%);
}
to {
-ms-transform: translateX(0);
opacity: 1;
}
}
@keyframes goCycleSmallContentSlideInFromRight {
from {
-webkit-transform: translateX(200%);
transform: translateX(200%);
}
to {
-webkit-transform: translateX(0);
transform: translateX(0);
opacity: 1;
}
}
/*****************************************/
/* Deal 'em */
/*****************************************/
.fxDeal .itemwrap {
-webkit-perspective: 1500px;
perspective: 1500px;
}
.fxDeal .navOutPrev,
.fxDeal .navOutNext {
opacity: 1;
-webkit-animation: goCycleSmallContentScaleDown 0.5s forwards;
animation: goCycleSmallContentScaleDown 0.5s forwards;
}
.fxDeal .navInNext {
z-index: 9999;
-webkit-animation: goCycleSmallContentThrowFromRight 0.4s 0.1s forwards ease-out;
animation: goCycleSmallContentThrowFromRight 0.4s 0.1s forwards ease-out;
}
.fxDeal .navInPrev {
z-index: 9999;
-webkit-animation: goCycleSmallContentThrowFromLeft 0.4s 0.1s forwards ease-out;
animation: goCycleSmallContentThrowFromLeft 0.4s 0.1s forwards ease-out;
}
.fxDeal li::after {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
opacity: 0;
pointer-events: none;
background-color: rgba(0, 0, 0, 0.3);
transition: opacity 0.5s;
}
.fxDeal .navOutPrev::after,
.fxDeal .navOutNext::after {
opacity: 1;
}
@-webkit-keyframes goCycleSmallContentScaleDown {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-webkit-transform: scale(0.9);
}
}
@-moz-keyframes goCycleSmallContentScaleDown {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-moz-transform: scale(0.9);
}
}
@-ms-keyframes goCycleSmallContentScaleDown {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-ms-transform: scale(0.9);
}
}
@keyframes goCycleSmallContentScaleDown {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-webkit-transform: scale(0.9);
transform: scale(0.9);
}
}
@-webkit-keyframes goCycleSmallContentThrowFromRight {
from {
-webkit-transform: translateX(20%) rotateZ(10deg) rotateY(40deg) translateZ(500px);
opacity: 1;
}
to {
-webkit-transform: translateX(0) rotateZ(0) rotateY(0) translateZ(0);
opacity: 1;
}
}
@-moz-keyframes goCycleSmallContentThrowFromRight {
from {
-moz-transform: translateX(20%) rotateZ(10deg) rotateY(40deg) translateZ(500px);
opacity: 1;
}
to {
-moz-transform: translateX(0) rotateZ(0) rotateY(0) translateZ(0);
opacity: 1;
}
}
@-ms-keyframes goCycleSmallContentThrowFromRight {
from {
-ms-transform: translateX(20%) rotateZ(10deg) rotateY(40deg) translateZ(500px);
opacity: 1;
}
to {
-ms-transform: translateX(0) rotateZ(0) rotateY(0) translateZ(0);
opacity: 1;
}
}
@keyframes goCycleSmallContentThrowFromRight {
from {
-webkit-transform: translateX(20%) rotateZ(10deg) rotateY(40deg) translateZ(500px);
transform: translateX(20%) rotateZ(10deg) rotateY(40deg) translateZ(500px);
opacity: 1;
}
to {
-webkit-transform: translateX(0) rotateZ(0) rotateY(0) translateZ(0);
transform: translateX(0) rotateZ(0) rotateY(0) translateZ(0);
opacity: 1;
}
}
@-webkit-keyframes goCycleSmallContentThrowFromLeft {
from {
-webkit-transform: translateX(-20%) rotateZ(-10deg) rotateY(-40deg) translateZ(500px);
opacity: 1;
}
to {
-webkit-transform: translateX(0) rotateZ(0) rotateY(0) translateZ(0);
opacity: 1;
}
}
@-moz-keyframes goCycleSmallContentThrowFromLeft {
from {
-moz-transform: translateX(-20%) rotateZ(-10deg) rotateY(-40deg) translateZ(500px);
opacity: 1;
}
to {
-moz-transform: translateX(0) rotateZ(0) rotateY(0) translateZ(0);
opacity: 1;
}
}
@-ms-keyframes goCycleSmallContentThrowFromLeft {
from {
-ms-transform: translateX(-20%) rotateZ(-10deg) rotateY(-40deg) translateZ(500px);
opacity: 1;
}
to {
-ms-transform: translateX(0) rotateZ(0) rotateY(0) translateZ(0);
opacity: 1;
}
}
@keyframes goCycleSmallContentThrowFromLeft {
from {
-webkit-transform: translateX(-20%) rotateZ(-10deg) rotateY(-40deg) translateZ(500px);
transform: translateX(-20%) rotateZ(-10deg) rotateY(-40deg) translateZ(500px);
opacity: 1;
}
to {
-webkit-transform: translateX(0) rotateZ(0) rotateY(0) translateZ(0);
transform: translateX(0) rotateZ(0) rotateY(0) translateZ(0);
opacity: 1;
}
}
/*****************************************/
/* Ferris wheel */
/*****************************************/
.fxFerris .navOutNext {
-webkit-transform-origin: 400% 50%;
transform-origin: 400% 50%;
-webkit-animation: goCycleSmallContentRotateTranslatedToRight 0.2s forwards ease-out;
animation: goCycleSmallContentRotateTranslatedToRight 0.2s forwards ease-out;
}
.fxFerris .navInNext {
-webkit-transform-origin: 200% 50%;
transform-origin: 200% 50%;
-webkit-animation: goCycleSmallContentRotateTranslatedFromRight 0.2s forwards ease-out;
animation: goCycleSmallContentRotateTranslatedFromRight 0.2s forwards ease-out;
}
.fxFerris .navOutPrev {
-webkit-transform-origin: -300% 50%;
transform-origin: -300% 50%;
-webkit-animation: goCycleSmallContentRotateTranslatedToLeft 0.2s forwards ease-out;
animation: goCycleSmallContentRotateTranslatedToLeft 0.2s forwards ease-out;
}
.fxFerris .navInPrev {
-webkit-transform-origin: -100% 50%;
transform-origin: -100% 50%;
-webkit-animation: goCycleSmallContentRotateTranslatedFromLeft 0.2s forwards ease-out;
animation: goCycleSmallContentRotateTranslatedFromLeft 0.2s forwards ease-out;
}
@-webkit-keyframes goCycleSmallContentRotateTranslatedToRight {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-webkit-transform: rotateZ(20deg);
opacity: 0;
}
}
@-moz-keyframes goCycleSmallContentRotateTranslatedToRight {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-moz-transform: rotateZ(20deg);
opacity: 0;
}
}
@-ms-keyframes goCycleSmallContentRotateTranslatedToRight {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-ms-transform: rotateZ(20deg);
opacity: 0;
}
}
@keyframes goCycleSmallContentRotateTranslatedToRight {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-webkit-transform: rotateZ(20deg);
transform: rotateZ(20deg);
opacity: 0;
}
}
@-webkit-keyframes goCycleSmallContentRotateTranslatedFromRight {
from {
-webkit-transform: rotateZ(-45deg);
opacity: .5;
}
to {
-webkit-transform: rotateZ(0deg);
opacity: 1;
}
}
@-moz-keyframes goCycleSmallContentRotateTranslatedFromRight {
from {
-moz-transform: rotateZ(-45deg);
opacity: .5;
}
to {
-moz-transform: rotateZ(0deg);
opacity: 1;
}
}
@-ms-keyframes goCycleSmallContentRotateTranslatedFromRight {
from {
-ms-transform: rotateZ(-45deg);
opacity: .5;
}
to {
-ms-transform: rotateZ(0deg);
opacity: 1;
}
}
@keyframes goCycleSmallContentRotateTranslatedFromRight {
from {
-webkit-transform: rotateZ(-45deg);
transform: rotateZ(-45deg);
opacity: .5;
}
to {
-webkit-transform: rotateZ(0deg);
transform: rotateZ(0deg);
opacity: 1;
}
}
@-webkit-keyframes goCycleSmallContentRotateTranslatedToLeft {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-webkit-transform: rotateZ(-20deg);
opacity: 0;
}
}
@-moz-keyframes goCycleSmallContentRotateTranslatedToLeft {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-moz-transform: rotateZ(-20deg);
opacity: 0;
}
}
@-ms-keyframes goCycleSmallContentRotateTranslatedToLeft {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-ms-transform: rotateZ(-20deg);
opacity: 0;
}
}
@keyframes goCycleSmallContentRotateTranslatedToLeft {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-webkit-transform: rotateZ(-20deg);
transform: rotateZ(-20deg);
opacity: 0;
}
}
@-webkit-keyframes goCycleSmallContentRotateTranslatedFromLeft {
from {
-webkit-transform: rotateZ(45deg);
opacity: .5;
}
to {
-webkit-transform: rotateZ(0deg);
opacity: 1;
}
}
@-moz-keyframes goCycleSmallContentRotateTranslatedFromLeft {
from {
-moz-transform: rotateZ(45deg);
opacity: .5;
}
to {
-moz-transform: rotateZ(0deg);
opacity: 1;
}
}
@-ms-keyframes goCycleSmallContentRotateTranslatedFromLeft {
from {
-ms-transform: rotateZ(45deg);
opacity: .5;
}
to {
-ms-transform: rotateZ(0deg);
opacity: 1;
}
}
@keyframes goCycleSmallContentRotateTranslatedFromLeft {
from {
-webkit-transform: rotateZ(45deg);
transform: rotateZ(45deg);
opacity: .5;
}
to {
-webkit-transform: rotateZ(0deg);
transform: rotateZ(0deg);
opacity: 1;
}
}
/*****************************************/
/* Shinkansen */
/*****************************************/
.fxShinkansen .navOutNext {
-webkit-animation: goCycleSmallContentSkewOutLeft 0.4s forwards ease-in;
animation: goCycleSmallContentSkewOutLeft 0.4s forwards ease-in;
}
.fxShinkansen .navInNext {
-webkit-animation: goCycleSmallContentSkewInRight 0.4s forwards ease-in;
animation: goCycleSmallContentSkewInRight 0.4s forwards ease-in;
}
.fxShinkansen .navOutPrev {
-webkit-animation: goCycleSmallContentSkewOutRight 0.4s forwards ease-in;
animation: goCycleSmallContentSkewOutRight 0.4s forwards ease-in;
}
.fxShinkansen .navInPrev {
-webkit-animation: goCycleSmallContentSkewInLeft 0.4s forwards ease-in;
animation: goCycleSmallContentSkewInLeft 0.4s forwards ease-in;
}
@-webkit-keyframes goCycleSmallContentSkewOutLeft {
50% {
-webkit-animation-timing-function: ease-out;
-webkit-transform: skew(-20deg) translateX(-75%);
opacity: 0.7;
}
100% {
-webkit-transform: skew(0deg) translateX(-150%);
opacity: 0;
}
}
@-moz-keyframes goCycleSmallContentSkewOutLeft {
50% {
-moz-animation-timing-function: ease-out;
-moz-transform: skew(-20deg) translateX(-75%);
opacity: 0.7;
}
100% {
-moz-transform: skew(0deg) translateX(-150%);
opacity: 0;
}
}
@-ms-keyframes goCycleSmallContentSkewOutLeft {
50% {
-ms-animation-timing-function: ease-out;
-ms-transform: skew(-20deg) translateX(-75%);
opacity: 0.7;
}
100% {
-ms-transform: skew(0deg) translateX(-150%);
opacity: 0;
}
}
@keyframes goCycleSmallContentSkewOutLeft {
50% {
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out;
-webkit-transform: skew(-20deg) translateX(-75%);
transform: skew(-20deg) translateX(-75%);
opacity: 0.7;
}
100% {
-webkit-transform: skew(0deg) translateX(-150%);
transform: skew(0deg) translateX(-150%);
opacity: 0;
}
}
@-webkit-keyframes goCycleSmallContentSkewInRight {
0% {
-webkit-transform: skew(0deg) translateX(150%);
}
50% {
-webkit-animation-timing-function: ease-out;
-webkit-transform: skew(-20deg) translateX(75%);
}
100% {
-webkit-transform: skew(0) translateX(0);
opacity: 1;
}
}
@-moz-keyframes goCycleSmallContentSkewInRight {
0% {
-moz-transform: skew(0deg) translateX(150%);
}
50% {
-moz-animation-timing-function: ease-out;
-moz-transform: skew(-20deg) translateX(75%);
}
100% {
-moz-transform: skew(0) translateX(0);
opacity: 1;
}
}
@-ms-keyframes goCycleSmallContentSkewInRight {
0% {
-ms-transform: skew(0deg) translateX(150%);
}
50% {
-ms-animation-timing-function: ease-out;
-ms-transform: skew(-20deg) translateX(75%);
}
100% {
-ms-transform: skew(0) translateX(0);
opacity: 1;
}
}
@keyframes goCycleSmallContentSkewInRight {
0% {
-webkit-transform: skew(0deg) translateX(150%);
transform: skew(0deg) translateX(150%);
}
50% {
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out;
-webkit-transform: skew(-20deg) translateX(75%);
transform: skew(-20deg) translateX(75%);
}
100% {
-webkit-transform: skew(0) translateX(0);
transform: skew(0) translateX(0);
opacity: 1;
}
}
@-webkit-keyframes goCycleSmallContentSkewOutRight {
50% {
-webkit-animation-timing-function: ease-out;
-webkit-transform: skew(20deg) translateX(75%);
opacity: 0.7;
}
100% {
-webkit-transform: skew(0deg) translateX(150%);
opacity: 0;
}
}
@-moz-keyframes goCycleSmallContentSkewOutRight {
50% {
-moz-animation-timing-function: ease-out;
-moz-transform: skew(20deg) translateX(75%);
opacity: 0.7;
}
100% {
-moz-transform: skew(0deg) translateX(150%);
opacity: 0;
}
}
@-ms-keyframes goCycleSmallContentSkewOutRight {
50% {
-ms-animation-timing-function: ease-out;
-ms-transform: skew(20deg) translateX(75%);
opacity: 0.7;
}
100% {
-ms-transform: skew(0deg) translateX(150%);
opacity: 0;
}
}
@keyframes goCycleSmallContentSkewOutRight {
50% {
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out;
-webkit-transform: skew(20deg) translateX(75%);
transform: skew(20deg) translateX(75%);
opacity: 0.7;
}
100% {
-webkit-transform: skew(0deg) translateX(150%);
transform: skew(0deg) translateX(150%);
opacity: 0;
}
}
@-webkit-keyframes goCycleSmallContentSkewInLeft {
0% {
-webkit-transform: skew(0deg) translateX(-150%);
}
50% {
-webkit-animation-timing-function: ease-out;
-webkit-transform: skew(20deg) translateX(-75%);
}
100% {
-webkit-transform: skew(0) translateX(0);
opacity: 1;
}
}
@-moz-keyframes goCycleSmallContentSkewInLeft {
0% {
-moz-transform: skew(0deg) translateX(-150%);
}
50% {
-moz-animation-timing-function: ease-out;
-moz-transform: skew(20deg) translateX(-75%);
}
100% {
-moz-transform: skew(0) translateX(0);
opacity: 1;
}
}
@-ms-keyframes goCycleSmallContentSkewInLeft {
0% {
-ms-transform: skew(0deg) translateX(-150%);
}
50% {
-ms-animation-timing-function: ease-out;
-ms-transform: skew(20deg) translateX(-75%);
}
100% {
-ms-transform: skew(0) translateX(0);
opacity: 1;
}
}
@keyframes goCycleSmallContentSkewInLeft {
0% {
-webkit-transform: skew(0deg) translateX(-150%);
transform: skew(0deg) translateX(-150%);
}
50% {
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out;
-webkit-transform: skew(20deg) translateX(-75%);
transform: skew(20deg) translateX(-75%);
}
100% {
-webkit-transform: skew(0) translateX(0);
transform: skew(0) translateX(0);
opacity: 1;
}
}
/*****************************************/
/* Snake */
/*****************************************/
.fxSnake li {
-webkit-transform-origin: 50% 0%;
transform-origin: 50% 0%;
}
.fxSnake .navOutNext {
-webkit-animation: goCycleSmallContentSlideOutBounceLeft 0.3s forwards linear;
animation: goCycleSmallContentSlideOutBounceLeft 0.3s forwards linear;
}
.fxSnake .navInNext {
-webkit-animation: goCycleSmallContentSlideInBounceRight 0.3s forwards linear;
animation: goCycleSmallContentSlideInBounceRight 0.3s forwards linear;
}
.fxSnake .navOutPrev {
-webkit-animation: goCycleSmallContentSlideOutBounceRight 0.3s forwards linear;
animation: goCycleSmallContentSlideOutBounceRight 0.3s forwards linear;
}
.fxSnake .navInPrev {
-webkit-animation: goCycleSmallContentSlideInBounceLeft 0.3s forwards linear;
animation: goCycleSmallContentSlideInBounceLeft 0.3s forwards linear;
}
@-webkit-keyframes goCycleSmallContentSlideOutBounceLeft {
25% {
-webkit-transform: translateX(-50%) rotate(-7deg);
}
50% {
-webkit-transform: translateX(-100%) rotate(7deg);
opacity: 0.7;
}
100% {
-webkit-transform: translateX(-200%) rotate(0deg);
opacity: 0;
}
}
@-moz-keyframes goCycleSmallContentSlideOutBounceLeft {
25% {
-moz-transform: translateX(-50%) rotate(-7deg);
}
50% {
-moz-transform: translateX(-100%) rotate(7deg);
opacity: 0.7;
}
100% {
-moz-transform: translateX(-200%) rotate(0deg);
opacity: 0;
}
}
@-ms-keyframes goCycleSmallContentSlideOutBounceLeft {
25% {
-ms-transform: translateX(-50%) rotate(-7deg);
}
50% {
-ms-transform: translateX(-100%) rotate(7deg);
opacity: 0.7;
}
100% {
-ms-transform: translateX(-200%) rotate(0deg);
opacity: 0;
}
}
@keyframes goCycleSmallContentSlideOutBounceLeft {
25% {
-webkit-transform: translateX(-50%) rotate(-7deg);
transform: translateX(-50%) rotate(-7deg);
}
50% {
-webkit-transform: translateX(-100%) rotate(7deg);
transform: translateX(-100%) rotate(7deg);
opacity: 0.7;
}
100% {
-webkit-transform: translateX(-200%) rotate(0deg);
transform: translateX(-200%) rotate(0deg);
opacity: 0;
}
}
@-webkit-keyframes goCycleSmallContentSlideInBounceRight {
0% {
-webkit-transform: translateX(200%);
}
50% {
-webkit-transform: translateX(100%) rotate(-7deg);
opacity: 0.7;
}
75% {
-webkit-transform: translateX(50%) rotate(7deg);
}
100% {
-webkit-transform: translateX(0) rotate(0deg);
opacity: 1;
}
}
@-moz-keyframes goCycleSmallContentSlideInBounceRight {
0% {
-moz-transform: translateX(200%);
}
50% {
-moz-transform: translateX(100%) rotate(-7deg);
opacity: 0.7;
}
75% {
-moz-transform: translateX(50%) rotate(7deg);
}
100% {
-moz-transform: translateX(0) rotate(0deg);
opacity: 1;
}
}
@-ms-keyframes goCycleSmallContentSlideInBounceRight {
0% {
-ms-transform: translateX(200%);
}
50% {
-ms-transform: translateX(100%) rotate(-7deg);
opacity: 0.7;
}
75% {
-ms-transform: translateX(50%) rotate(7deg);
}
100% {
-ms-transform: translateX(0) rotate(0deg);
opacity: 1;
}
}
@keyframes goCycleSmallContentSlideInBounceRight {
0% {
-webkit-transform: translateX(200%);
transform: translateX(200%);
}
50% {
-webkit-transform: translateX(100%) rotate(-7deg);
transform: translateX(100%) rotate(-7deg);
opacity: 0.7;
}
75% {
-webkit-transform: translateX(50%) rotate(7deg);
transform: translateX(50%) rotate(7deg);
}
100% {
-webkit-transform: translateX(0) rotate(0deg);
transform: translateX(0) rotate(0deg);
opacity: 1;
}
}
@-webkit-keyframes goCycleSmallContentSlideOutBounceRight {
25% {
-webkit-transform: translateX(50%) rotate(7deg);
}
50% {
-webkit-transform: translateX(100%) rotate(-7deg);
opacity: 0.7;
}
100% {
-webkit-transform: translateX(200%) rotate(0deg);
opacity: 0;
}
}
@-moz-keyframes goCycleSmallContentSlideOutBounceRight {
25% {
-moz-transform: translateX(50%) rotate(7deg);
}
50% {
-moz-transform: translateX(100%) rotate(-7deg);
opacity: 0.7;
}
100% {
-moz-transform: translateX(200%) rotate(0deg);
opacity: 0;
}
}
@-ms-keyframes goCycleSmallContentSlideOutBounceRight {
25% {
-ms-transform: translateX(50%) rotate(7deg);
}
50% {
-ms-transform: translateX(100%) rotate(-7deg);
opacity: 0.7;
}
100% {
-ms-transform: translateX(200%) rotate(0deg);
opacity: 0;
}
}
@keyframes goCycleSmallContentSlideOutBounceRight {
25% {
-webkit-transform: translateX(50%) rotate(7deg);
transform: translateX(50%) rotate(7deg);
}
50% {
-webkit-transform: translateX(100%) rotate(-7deg);
transform: translateX(100%) rotate(-7deg);
opacity: 0.7;
}
100% {
-webkit-transform: translateX(200%) rotate(0deg);
transform: translateX(200%) rotate(0deg);
opacity: 0;
}
}
@-webkit-keyframes goCycleSmallContentSlideInBounceLeft {
0% {
-webkit-transform: translateX(-200%);
}
50% {
-webkit-transform: translateX(-100%) rotate(7deg);
opacity: 0.7;
}
75% {
-webkit-transform: translateX(-50%) rotate(-7deg);
}
100% {
-webkit-transform: translateX(0) rotate(0deg);
opacity: 1;
}
}
@-moz-keyframes goCycleSmallContentSlideInBounceLeft {
0% {
-moz-transform: translateX(-200%);
}
50% {
-moz-transform: translateX(-100%) rotate(7deg);
opacity: 0.7;
}
75% {
-moz-transform: translateX(-50%) rotate(-7deg);
}
100% {
-moz-transform: translateX(0) rotate(0deg);
opacity: 1;
}
}
@-ms-keyframes goCycleSmallContentSlideInBounceLeft {
0% {
-ms-transform: translateX(-200%);
}
50% {
-ms-transform: translateX(-100%) rotate(7deg);
opacity: 0.7;
}
75% {
-ms-transform: translateX(-50%) rotate(-7deg);
}
100% {
-ms-transform: translateX(0) rotate(0deg);
opacity: 1;
}
}
@keyframes goCycleSmallContentSlideInBounceLeft {
0% {
-webkit-transform: translateX(-200%);
transform: translateX(-200%);
}
50% {
-webkit-transform: translateX(-100%) rotate(7deg);
transform: translateX(-100%) rotate(7deg);
opacity: 0.7;
}
75% {
-webkit-transform: translateX(-50%) rotate(-7deg);
transform: translateX(-50%) rotate(-7deg);
}
100% {
-webkit-transform: translateX(0) rotate(0deg);
transform: translateX(0) rotate(0deg);
opacity: 1;
}
}
/*****************************************/
/* Shuffle */
/*****************************************/
.fxShuffle li {
-webkit-transform-origin: -50% -50%;
transform-origin: -50% -50%;
}
.fxShuffle .navOutNext {
-webkit-animation: goCycleSmallContentFanBehindDown 0.5s forwards;
animation: goCycleSmallContentFanBehindDown 0.5s forwards;
}
.fxShuffle .navInNext {
opacity: 1;
-webkit-animation: goCycleSmallContentFanFrontUp 0.5s forwards;
animation: goCycleSmallContentFanFrontUp 0.5s forwards;
}
.fxShuffle .navOutPrev {
-webkit-animation: goCycleSmallContentFanBehindUp 0.5s forwards;
animation: goCycleSmallContentFanBehindUp 0.5s forwards;
}
.fxShuffle .navInPrev {
opacity: 1;
-webkit-animation: goCycleSmallContentFanFrontDown 0.5s forwards;
animation: goCycleSmallContentFanFrontDown 0.5s forwards;
}
.fxShuffle li::before,
.fxShuffle li::after {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
pointer-events: none;
background-color: rgba(0, 0, 0, 0.5);
transition: opacity 0.5s;
}
.fxShuffle li::after,
.fxShuffle .navOutNext::before,
.fxShuffle .navOutPrev::before {
opacity: 1;
}
.fxShuffle .navOutNext::before,
.fxShuffle .navOutPrev::before {
-webkit-transition-speed: 0.25s;
transition-speed: 0.25s;
transition-delay: 0.2s;
}
.fxShuffle li::before,
.fxShuffle li.current::after,
.fxShuffle .navInNext::after,
.fxShuffle .navInPrev::after {
opacity: 0;
}
@-webkit-keyframes goCycleSmallContentFanBehindDown {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
50% {
-webkit-transform: rotate(30deg);
z-index: 9999;
}
100% {
-webkit-transform: rotate(0deg);
}
}
@-moz-keyframes goCycleSmallContentFanBehindDown {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
50% {
-moz-transform: rotate(30deg);
z-index: 9999;
}
100% {
-moz-transform: rotate(0deg);
}
}
@-ms-keyframes goCycleSmallContentFanBehindDown {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
50% {
-ms-transform: rotate(30deg);
z-index: 9999;
}
100% {
-ms-transform: rotate(0deg);
}
}
@keyframes goCycleSmallContentFanBehindDown {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
50% {
-webkit-transform: rotate(30deg);
transform: rotate(30deg);
z-index: 9999;
}
100% {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
}
@-webkit-keyframes goCycleSmallContentFanFrontUp {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
50% {
-webkit-transform: rotate(-20deg);
}
51% {
-webkit-transform: rotate(-20deg);
z-index: 9999;
}
100% {
-webkit-transform: rotate(0deg);
z-index: 9999;
}
}
@-moz-keyframes goCycleSmallContentFanFrontUp {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
50% {
-moz-transform: rotate(-20deg);
}
51% {
-moz-transform: rotate(-20deg);
z-index: 9999;
}
100% {
-moz-transform: rotate(0deg);
z-index: 9999;
}
}
@-ms-keyframes goCycleSmallContentFanFrontUp {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
50% {
-ms-transform: rotate(-20deg);
}
51% {
-ms-transform: rotate(-20deg);
z-index: 9999;
}
100% {
-ms-transform: rotate(0deg);
z-index: 9999;
}
}
@keyframes goCycleSmallContentFanFrontUp {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
50% {
-webkit-transform: rotate(-20deg);
transform: rotate(-20deg);
}
51% {
-webkit-transform: rotate(-20deg);
transform: rotate(-20deg);
z-index: 9999;
}
100% {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
z-index: 9999;
}
}
@-webkit-keyframes goCycleSmallContentFanBehindUp {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
50% {
-webkit-transform: rotate(-20deg);
z-index: 9999;
}
100% {
-webkit-transform: rotate(0deg);
}
}
@-moz-keyframes goCycleSmallContentFanBehindUp {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
50% {
-moz-transform: rotate(-20deg);
z-index: 9999;
}
100% {
-moz-transform: rotate(0deg);
}
}
@-ms-keyframes goCycleSmallContentFanBehindUp {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
50% {
-ms-transform: rotate(-20deg);
z-index: 9999;
}
100% {
-ms-transform: rotate(0deg);
}
}
@keyframes goCycleSmallContentFanBehindUp {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
50% {
-webkit-transform: rotate(-20deg);
transform: rotate(-20deg);
z-index: 9999;
}
100% {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
}
@-webkit-keyframes goCycleSmallContentFanFrontDown {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
50% {
-webkit-transform: rotate(30deg);
}
51% {
-webkit-transform: rotate(30deg);
z-index: 9999;
}
100% {
-webkit-transform: rotate(0deg);
z-index: 9999;
}
}
@-moz-keyframes goCycleSmallContentFanFrontDown {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
50% {
-moz-transform: rotate(30deg);
}
51% {
-moz-transform: rotate(30deg);
z-index: 9999;
}
100% {
-moz-transform: rotate(0deg);
z-index: 9999;
}
}
@-ms-keyframes goCycleSmallContentFanFrontDown {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
50% {
-ms-transform: rotate(30deg);
}
51% {
-ms-transform: rotate(30deg);
z-index: 9999;
}
100% {
-ms-transform: rotate(0deg);
z-index: 9999;
}
}
@keyframes goCycleSmallContentFanFrontDown {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
50% {
-webkit-transform: rotate(30deg);
transform: rotate(30deg);
}
51% {
-webkit-transform: rotate(30deg);
transform: rotate(30deg);
z-index: 9999;
}
100% {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
z-index: 9999;
}
}
/*****************************************/
/* Photo Browse */
/*****************************************/
.fxPhotoBrowse .itemwrap {
-webkit-perspective: 1300px;
perspective: 1300px;
}
.fxPhotoBrowse .navOutNext {
-webkit-animation: goCycleSmallContentMoveBehind 0.5s forwards;
animation: goCycleSmallContentMoveBehind 0.5s forwards;
}
.fxPhotoBrowse .navInNext {
opacity: 1;
-webkit-animation: goCycleSmallContentAppear 0.5s forwards;
animation: goCycleSmallContentAppear 0.5s forwards;
}
.fxPhotoBrowse .navOutPrev {
-webkit-animation: goCycleSmallContentDisappear 0.5s forwards;
animation: goCycleSmallContentDisappear 0.5s forwards;
}
.fxPhotoBrowse .navInPrev {
opacity: 1;
-webkit-animation: goCycleSmallContentMoveFront 0.5s forwards;
animation: goCycleSmallContentMoveFront 0.5s forwards;
}
.fxPhotoBrowse li::before,
.fxPhotoBrowse li::after {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
pointer-events: none;
background-color: rgba(0, 0, 0, 0.6);
transition: opacity 0.5s;
}
.fxPhotoBrowse li::after,
.fxPhotoBrowse .navOutNext::before,
.fxPhotoBrowse .navOutPrev::before {
opacity: 1;
}
.fxPhotoBrowse .navOutNext::before,
.fxPhotoBrowse .navOutPrev::before {
-webkit-transition-speed: 0.25s;
transition-speed: 0.25s;
transition-delay: 0.2s;
}
.fxPhotoBrowse li::before,
.fxPhotoBrowse li.current::after,
.fxPhotoBrowse .navInNext::after,
.fxPhotoBrowse .navInPrev::after {
opacity: 0;
}
@-webkit-keyframes goCycleSmallContentMoveBehind {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
50% {
z-index: 9999;
-webkit-transform: translateX(-105%) rotateY(35deg) rotateX(10deg);
}
100% {
-webkit-transform: translateX(0%) rotateY(0deg) rotateX(0deg);
}
}
@-moz-keyframes goCycleSmallContentMoveBehind {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
50% {
z-index: 9999;
-moz-transform: translateX(-105%) rotateY(35deg) rotateX(10deg);
}
100% {
-moz-transform: translateX(0%) rotateY(0deg) rotateX(0deg);
}
}
@-ms-keyframes goCycleSmallContentMoveBehind {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
50% {
z-index: 9999;
-ms-transform: translateX(-105%) rotateY(35deg) rotateX(10deg);
}
100% {
-ms-transform: translateX(0%) rotateY(0deg) rotateX(0deg);
}
}
@keyframes goCycleSmallContentMoveBehind {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
50% {
z-index: 9999;
-webkit-transform: translateX(-105%) rotateY(35deg) rotateX(10deg);
transform: translateX(-105%) rotateY(35deg) rotateX(10deg);
}
100% {
-webkit-transform: translateX(0%) rotateY(0deg) rotateX(0deg);
transform: translateX(0%) rotateY(0deg) rotateX(0deg);
}
}
@-webkit-keyframes goCycleSmallContentAppear {
0% {
-webkit-transform: translateZ(-200px);
}
51% {
z-index: 9999;
}
70% {
z-index: 9999;
-webkit-transform: translateZ(50px);
}
100% {
z-index: 9999;
-webkit-transform: translateZ(0px);
}
}
@-moz-keyframes goCycleSmallContentAppear {
0% {
-moz-transform: translateZ(-200px);
}
51% {
z-index: 9999;
}
70% {
z-index: 9999;
-moz-transform: translateZ(50px);
}
100% {
z-index: 9999;
-moz-transform: translateZ(0px);
}
}
@-ms-keyframes goCycleSmallContentAppear {
0% {
-ms-transform: translateZ(-200px);
}
51% {
z-index: 9999;
}
70% {
z-index: 9999;
-ms-transform: translateZ(50px);
}
100% {
z-index: 9999;
-ms-transform: translateZ(0px);
}
}
@keyframes goCycleSmallContentAppear {
0% {
-webkit-transform: translateZ(-200px);
transform: translateZ(-200px);
}
51% {
z-index: 9999;
}
70% {
z-index: 9999;
-webkit-transform: translateZ(50px);
transform: translateZ(50px);
}
100% {
z-index: 9999;
-webkit-transform: translateZ(0px);
transform: translateZ(0px);
}
}
@-webkit-keyframes goCycleSmallContentDisappear {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
30% {
-webkit-transform: translateZ(50px);
}
50% {
z-index: 9999;
}
100% {
-webkit-transform: translateZ(-200px);
}
}
@-moz-keyframes goCycleSmallContentDisappear {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
30% {
-moz-transform: translateZ(50px);
}
50% {
z-index: 9999;
}
100% {
-moz-transform: translateZ(-200px);
}
}
@-ms-keyframes goCycleSmallContentDisappear {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
30% {
-ms-transform: translateZ(50px);
}
50% {
z-index: 9999;
}
100% {
-ms-transform: translateZ(-200px);
}
}
@keyframes goCycleSmallContentDisappear {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
30% {
-webkit-transform: translateZ(50px);
transform: translateZ(50px);
}
50% {
z-index: 9999;
}
100% {
-webkit-transform: translateZ(-200px);
transform: translateZ(-200px);
}
}
@-webkit-keyframes goCycleSmallContentMoveFront {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
50% {
-webkit-transform: translateX(-105%) rotateY(35deg) rotateX(10deg);
}
51% {
z-index: 9999;
}
100% {
z-index: 9999;
-webkit-transform: translateX(0%) rotateY(0deg) rotateX(0deg);
}
}
@-moz-keyframes goCycleSmallContentMoveFront {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
50% {
-moz-transform: translateX(-105%) rotateY(35deg) rotateX(10deg);
}
51% {
z-index: 9999;
}
100% {
z-index: 9999;
-moz-transform: translateX(0%) rotateY(0deg) rotateX(0deg);
}
}
@-ms-keyframes goCycleSmallContentMoveFront {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
50% {
-ms-transform: translateX(-105%) rotateY(35deg) rotateX(10deg);
}
51% {
z-index: 9999;
}
100% {
z-index: 9999;
-ms-transform: translateX(0%) rotateY(0deg) rotateX(0deg);
}
}
@keyframes goCycleSmallContentMoveFront {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
50% {
-webkit-transform: translateX(-105%) rotateY(35deg) rotateX(10deg);
transform: translateX(-105%) rotateY(35deg) rotateX(10deg);
}
51% {
z-index: 9999;
}
100% {
z-index: 9999;
-webkit-transform: translateX(0%) rotateY(0deg) rotateX(0deg);
transform: translateX(0%) rotateY(0deg) rotateX(0deg);
}
}
/*****************************************/
/* Slide Behind */
/* From https://github.com/hakimel/kontext by Hakim El Hattab, http://hakim.se */
/*****************************************/
.fxSlideBehind .itemwrap {
-webkit-perspective: 1000px;
perspective: 1000px;
}
.fxSlideBehind .navOutNext {
-webkit-animation: goCycleSmallContentHideLeft 0.5s forwards;
animation: goCycleSmallContentHideLeft 0.5s forwards;
}
.fxSlideBehind .navInNext {
-webkit-animation: goCycleSmallContentShowRight 0.5s forwards;
animation: goCycleSmallContentShowRight 0.5s forwards;
}
.fxSlideBehind .navOutPrev {
-webkit-animation: goCycleSmallContentHideRight 0.5s forwards;
animation: goCycleSmallContentHideRight 0.5s forwards;
}
.fxSlideBehind .navInPrev {
-webkit-animation: goCycleSmallContentShowLeft 0.5s forwards;
animation: goCycleSmallContentShowLeft 0.5s forwards;
}
.fxSlideBehind li::before,
.fxSlideBehind li::after {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
pointer-events: none;
background-color: rgba(0, 0, 0, 0.5);
transition: opacity 0.5s;
}
.fxSlideBehind li::after,
.fxSlideBehind .navOutNext::before,
.fxSlideBehind .navOutPrev::before {
opacity: 1;
}
.fxSlideBehind li::before,
.fxSlideBehind li.current::after,
.fxSlideBehind .navInNext::after,
.fxSlideBehind .navInPrev::after {
opacity: 0;
}
@-webkit-keyframes goCycleSmallContentHideLeft {
0% {
-webkit-transform: translateZ(0px);
}
40% {
-webkit-transform: translate(-40%, 0) scale(0.8) rotateY(20deg);
z-index: 9999;
}
100% {
opacity: 1;
-webkit-transform: translateZ(-400px);
}
}
@-moz-keyframes goCycleSmallContentHideLeft {
0% {
-moz-transform: translateZ(0px);
}
40% {
-moz-transform: translate(-40%, 0) scale(0.8) rotateY(20deg);
z-index: 9999;
}
100% {
opacity: 1;
-moz-transform: translateZ(-400px);
}
}
@-ms-keyframes goCycleSmallContentHideLeft {
0% {
-ms-transform: translateZ(0px);
}
40% {
-ms-transform: translate(-40%, 0) scale(0.8) rotateY(20deg);
z-index: 9999;
}
100% {
opacity: 1;
-ms-transform: translateZ(-400px);
}
}
@keyframes goCycleSmallContentHideLeft {
0% {
-webkit-transform: translateZ(0px);
transform: translateZ(0px);
}
40% {
-webkit-transform: translate(-40%, 0) scale(0.8) rotateY(20deg);
transform: translate(-40%, 0) scale(0.8) rotateY(20deg);
z-index: 9999;
}
100% {
opacity: 1;
-webkit-transform: translateZ(-400px);
transform: translateZ(-400px);
}
}
@-webkit-keyframes goCycleSmallContentShowRight {
0% {
-webkit-transform: translateZ(-400px);
opacity: 1;
}
40% {
-webkit-transform: translate(40%, 0) scale(0.8) rotateY(-20deg);
opacity: 1;
}
41% {
-webkit-transform: translate(40%, 0) scale(0.8) rotateY(-20deg);
opacity: 1;
z-index: 9999;
}
100% {
-webkit-transform: translateZ(0px);
opacity: 1;
z-index: 9999;
}
}
@-moz-keyframes goCycleSmallContentShowRight {
0% {
-moz-transform: translateZ(-400px);
opacity: 1;
}
40% {
-moz-transform: translate(40%, 0) scale(0.8) rotateY(-20deg);
opacity: 1;
}
41% {
-moz-transform: translate(40%, 0) scale(0.8) rotateY(-20deg);
opacity: 1;
z-index: 9999;
}
100% {
-moz-transform: translateZ(0px);
opacity: 1;
z-index: 9999;
}
}
@-ms-keyframes goCycleSmallContentShowRight {
0% {
-ms-transform: translateZ(-400px);
opacity: 1;
}
40% {
-ms-transform: translate(40%, 0) scale(0.8) rotateY(-20deg);
opacity: 1;
}
41% {
-ms-transform: translate(40%, 0) scale(0.8) rotateY(-20deg);
opacity: 1;
z-index: 9999;
}
100% {
-ms-transform: translateZ(0px);
opacity: 1;
z-index: 9999;
}
}
@keyframes goCycleSmallContentShowRight {
0% {
-webkit-transform: translateZ(-400px);
transform: translateZ(-400px);
opacity: 1;
}
40% {
-webkit-transform: translate(40%, 0) scale(0.8) rotateY(-20deg);
transform: translate(40%, 0) scale(0.8) rotateY(-20deg);
opacity: 1;
}
41% {
-webkit-transform: translate(40%, 0) scale(0.8) rotateY(-20deg);
transform: translate(40%, 0) scale(0.8) rotateY(-20deg);
opacity: 1;
z-index: 9999;
}
100% {
-webkit-transform: translateZ(0px);
transform: translateZ(0px);
opacity: 1;
z-index: 9999;
}
}
@-webkit-keyframes goCycleSmallContentHideRight {
0% {
-webkit-transform: translateZ(0px);
}
40% {
-webkit-transform: translate(40%, 0) scale(0.8) rotateY(-20deg);
z-index: 9999;
}
100% {
opacity: 1;
-webkit-transform: translateZ(-400px);
}
}
@-moz-keyframes goCycleSmallContentHideRight {
0% {
-moz-transform: translateZ(0px);
}
40% {
-moz-transform: translate(40%, 0) scale(0.8) rotateY(-20deg);
z-index: 9999;
}
100% {
opacity: 1;
-moz-transform: translateZ(-400px);
}
}
@-ms-keyframes goCycleSmallContentHideRight {
0% {
-ms-transform: translateZ(0px);
}
40% {
-ms-transform: translate(40%, 0) scale(0.8) rotateY(-20deg);
z-index: 9999;
}
100% {
opacity: 1;
-ms-transform: translateZ(-400px);
}
}
@keyframes goCycleSmallContentHideRight {
0% {
-webkit-transform: translateZ(0px);
transform: translateZ(0px);
}
40% {
-webkit-transform: translate(40%, 0) scale(0.8) rotateY(-20deg);
transform: translate(40%, 0) scale(0.8) rotateY(-20deg);
z-index: 9999;
}
100% {
opacity: 1;
-webkit-transform: translateZ(-400px);
transform: translateZ(-400px);
}
}
@-webkit-keyframes goCycleSmallContentShowLeft {
0% {
-webkit-transform: translateZ(-400px);
opacity: 1;
}
40% {
-webkit-transform: translate(-40%, 0) scale(0.8) rotateY(20deg);
opacity: 1;
}
41% {
-webkit-transform: translate(-40%, 0) scale(0.8) rotateY(20deg);
opacity: 1;
z-index: 9999;
}
100% {
-webkit-transform: translateZ(0px);
opacity: 1;
z-index: 9999;
}
}
@-moz-keyframes goCycleSmallContentShowLeft {
0% {
-moz-transform: translateZ(-400px);
opacity: 1;
}
40% {
-moz-transform: translate(-40%, 0) scale(0.8) rotateY(20deg);
opacity: 1;
}
41% {
-moz-transform: translate(-40%, 0) scale(0.8) rotateY(20deg);
opacity: 1;
z-index: 9999;
}
100% {
-moz-transform: translateZ(0px);
opacity: 1;
z-index: 9999;
}
}
@-ms-keyframes goCycleSmallContentShowLeft {
0% {
-ms-transform: translateZ(-400px);
opacity: 1;
}
40% {
-ms-transform: translate(-40%, 0) scale(0.8) rotateY(20deg);
opacity: 1;
}
41% {
-ms-transform: translate(-40%, 0) scale(0.8) rotateY(20deg);
opacity: 1;
z-index: 9999;
}
100% {
-ms-transform: translateZ(0px);
opacity: 1;
z-index: 9999;
}
}
@keyframes goCycleSmallContentShowLeft {
0% {
-webkit-transform: translateZ(-400px);
transform: translateZ(-400px);
opacity: 1;
}
40% {
-webkit-transform: translate(-40%, 0) scale(0.8) rotateY(20deg);
transform: translate(-40%, 0) scale(0.8) rotateY(20deg);
opacity: 1;
}
41% {
-webkit-transform: translate(-40%, 0) scale(0.8) rotateY(20deg);
transform: translate(-40%, 0) scale(0.8) rotateY(20deg);
opacity: 1;
z-index: 9999;
}
100% {
-webkit-transform: translateZ(0px);
transform: translateZ(0px);
opacity: 1;
z-index: 9999;
}
}
/*****************************************/
/* Vacuum */
/*****************************************/
.fxVacuum .navOutNext {
-webkit-animation: goCycleSmallContentSlideScaleOutLeft 0.4s forwards;
animation: goCycleSmallContentSlideScaleOutLeft 0.4s forwards;
}
.fxVacuum .navInNext {
-webkit-animation: goCycleSmallContentSlideScaleInRight 0.4s 0.2s forwards;
animation: goCycleSmallContentSlideScaleInRight 0.4s 0.2s forwards;
}
.fxVacuum .navOutPrev {
-webkit-animation: goCycleSmallContentSlideScaleOutRight 0.4s forwards;
animation: goCycleSmallContentSlideScaleOutRight 0.4s forwards;
}
.fxVacuum .navInPrev {
-webkit-animation: goCycleSmallContentSlideScaleInLeft 0.4s 0.2s forwards;
animation: goCycleSmallContentSlideScaleInLeft 0.4s 0.2s forwards;
}
@-webkit-keyframes goCycleSmallContentSlideScaleOutLeft {
from {
opacity: 1;
}
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
50% {
-webkit-transform: translateX(25%) scale(1.2);
opacity: 0.8;
}
100% {
-webkit-transform: translateX(-250%) scale(0);
opacity: 0;
}
}
@-moz-keyframes goCycleSmallContentSlideScaleOutLeft {
from {
opacity: 1;
}
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
50% {
-moz-transform: translateX(25%) scale(1.2);
opacity: 0.8;
}
100% {
-moz-transform: translateX(-250%) scale(0);
opacity: 0;
}
}
@-ms-keyframes goCycleSmallContentSlideScaleOutLeft {
from {
opacity: 1;
}
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
50% {
-ms-transform: translateX(25%) scale(1.2);
opacity: 0.8;
}
100% {
-ms-transform: translateX(-250%) scale(0);
opacity: 0;
}
}
@keyframes goCycleSmallContentSlideScaleOutLeft {
from {
opacity: 1;
}
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
50% {
-webkit-transform: translateX(25%) scale(1.2);
transform: translateX(25%) scale(1.2);
opacity: 0.8;
}
100% {
-webkit-transform: translateX(-250%) scale(0);
transform: translateX(-250%) scale(0);
opacity: 0;
}
}
@-webkit-keyframes goCycleSmallContentSlideScaleInRight {
from {
-webkit-transform: translateX(250%) scale(0);
}
to {
-webkit-transform: translateX(0) scale(1);
opacity: 1;
}
}
@-moz-keyframes goCycleSmallContentSlideScaleInRight {
from {
-moz-transform: translateX(250%) scale(0);
}
to {
-moz-transform: translateX(0) scale(1);
opacity: 1;
}
}
@-ms-keyframes goCycleSmallContentSlideScaleInRight {
from {
-ms-transform: translateX(250%) scale(0);
}
to {
-ms-transform: translateX(0) scale(1);
opacity: 1;
}
}
@keyframes goCycleSmallContentSlideScaleInRight {
from {
-webkit-transform: translateX(250%) scale(0);
transform: translateX(250%) scale(0);
}
to {
-webkit-transform: translateX(0) scale(1);
transform: translateX(0) scale(1);
opacity: 1;
}
}
@-webkit-keyframes goCycleSmallContentSlideScaleOutRight {
from {
opacity: 1;
}
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
50% {
-webkit-transform: translateX(-25%) scale(1.2);
opacity: 0.8;
}
100% {
-webkit-transform: translateX(250%) scale(0);
opacity: 0;
}
}
@-moz-keyframes goCycleSmallContentSlideScaleOutRight {
from {
opacity: 1;
}
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
50% {
-moz-transform: translateX(-25%) scale(1.2);
opacity: 0.8;
}
100% {
-moz-transform: translateX(250%) scale(0);
opacity: 0;
}
}
@-ms-keyframes goCycleSmallContentSlideScaleOutRight {
from {
opacity: 1;
}
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
50% {
-ms-transform: translateX(-25%) scale(1.2);
opacity: 0.8;
}
100% {
-ms-transform: translateX(250%) scale(0);
opacity: 0;
}
}
@keyframes goCycleSmallContentSlideScaleOutRight {
from {
opacity: 1;
}
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
50% {
-webkit-transform: translateX(-25%) scale(1.2);
transform: translateX(-25%) scale(1.2);
opacity: 0.8;
}
100% {
-webkit-transform: translateX(250%) scale(0);
transform: translateX(250%) scale(0);
opacity: 0;
}
}
@-webkit-keyframes goCycleSmallContentSlideScaleInLeft {
from {
-webkit-transform: translateX(-250%) scale(0);
}
to {
-webkit-transform: translateX(0) scale(1);
opacity: 1;
}
}
@-moz-keyframes goCycleSmallContentSlideScaleInLeft {
from {
-moz-transform: translateX(-250%) scale(0);
}
to {
-moz-transform: translateX(0) scale(1);
opacity: 1;
}
}
@-ms-keyframes goCycleSmallContentSlideScaleInLeft {
from {
-ms-transform: translateX(-250%) scale(0);
}
to {
-ms-transform: translateX(0) scale(1);
opacity: 1;
}
}
@keyframes goCycleSmallContentSlideScaleInLeft {
from {
-webkit-transform: translateX(-250%) scale(0);
transform: translateX(-250%) scale(0);
}
to {
-webkit-transform: translateX(0) scale(1);
transform: translateX(0) scale(1);
opacity: 1;
}
}
/*****************************************/
/* Hurl it */
/*****************************************/
.fxHurl .navOutNext {
-webkit-animation: goCycleSmallContentElastSlideOutLeft 0.5s forwards;
animation: goCycleSmallContentElastSlideOutLeft 0.5s forwards;
}
.fxHurl .navInNext {
-webkit-animation: goCycleSmallContentElastSlideInRight 0.5s 0.6s forwards;
animation: goCycleSmallContentElastSlideInRight 0.5s 0.6s forwards;
}
.fxHurl .navOutPrev {
-webkit-animation: goCycleSmallContentElastSlideOutRight 0.5s forwards;
animation: goCycleSmallContentElastSlideOutRight 0.5s forwards;
}
.fxHurl .navInPrev {
-webkit-animation: goCycleSmallContentElastSlideInLeft 0.5s 0.6s forwards;
animation: goCycleSmallContentElastSlideInLeft 0.5s 0.6s forwards;
}
@-webkit-keyframes goCycleSmallContentElastSlideOutLeft {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
80% {
-webkit-animation-timing-function: ease-in;
-webkit-transform: translateX(50%);
opacity: 1;
}
100% {
-webkit-transform: translateX(-150%);
opacity: 0;
}
}
@-moz-keyframes goCycleSmallContentElastSlideOutLeft {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
80% {
-moz-animation-timing-function: ease-in;
-moz-transform: translateX(50%);
opacity: 1;
}
100% {
-moz-transform: translateX(-150%);
opacity: 0;
}
}
@-ms-keyframes goCycleSmallContentElastSlideOutLeft {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
80% {
-ms-animation-timing-function: ease-in;
-ms-transform: translateX(50%);
opacity: 1;
}
100% {
-ms-transform: translateX(-150%);
opacity: 0;
}
}
@keyframes goCycleSmallContentElastSlideOutLeft {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
80% {
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
-webkit-transform: translateX(50%);
transform: translateX(50%);
opacity: 1;
}
100% {
-webkit-transform: translateX(-150%);
transform: translateX(-150%);
opacity: 0;
}
}
@-webkit-keyframes goCycleSmallContentElastSlideInRight {
0% {
-webkit-animation-timing-function: ease-in;
-webkit-transform: translateX(150%);
}
20% {
-webkit-transform: translateX(-50%);
opacity: 1;
}
100% {
-webkit-transform: translateX(0);
opacity: 1;
}
}
@-moz-keyframes goCycleSmallContentElastSlideInRight {
0% {
-moz-animation-timing-function: ease-in;
-moz-transform: translateX(150%);
}
20% {
-moz-transform: translateX(-50%);
opacity: 1;
}
100% {
-moz-transform: translateX(0);
opacity: 1;
}
}
@-ms-keyframes goCycleSmallContentElastSlideInRight {
0% {
-ms-animation-timing-function: ease-in;
-ms-transform: translateX(150%);
}
20% {
-ms-transform: translateX(-50%);
opacity: 1;
}
100% {
-ms-transform: translateX(0);
opacity: 1;
}
}
@keyframes goCycleSmallContentElastSlideInRight {
0% {
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
-webkit-transform: translateX(150%);
transform: translateX(150%);
}
20% {
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
opacity: 1;
}
100% {
-webkit-transform: translateX(0);
transform: translateX(0);
opacity: 1;
}
}
@-webkit-keyframes goCycleSmallContentElastSlideOutRight {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
80% {
-webkit-animation-timing-function: ease-in;
-webkit-transform: translateX(-50%);
opacity: 1;
}
100% {
-webkit-transform: translateX(150%);
opacity: 0;
}
}
@-moz-keyframes goCycleSmallContentElastSlideOutRight {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
80% {
-moz-animation-timing-function: ease-in;
-moz-transform: translateX(-50%);
opacity: 1;
}
100% {
-moz-transform: translateX(150%);
opacity: 0;
}
}
@-ms-keyframes goCycleSmallContentElastSlideOutRight {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
80% {
-ms-animation-timing-function: ease-in;
-ms-transform: translateX(-50%);
opacity: 1;
}
100% {
-ms-transform: translateX(150%);
opacity: 0;
}
}
@keyframes goCycleSmallContentElastSlideOutRight {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
80% {
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
opacity: 1;
}
100% {
-webkit-transform: translateX(150%);
transform: translateX(150%);
opacity: 0;
}
}
@-webkit-keyframes goCycleSmallContentElastSlideInLeft {
0% {
-webkit-animation-timing-function: ease-in;
-webkit-transform: translateX(-150%);
}
20% {
-webkit-transform: translateX(50%);
opacity: 1;
}
100% {
-webkit-transform: translateX(0);
opacity: 1;
}
}
@-moz-keyframes goCycleSmallContentElastSlideInLeft {
0% {
-moz-animation-timing-function: ease-in;
-moz-transform: translateX(-150%);
}
20% {
-moz-transform: translateX(50%);
opacity: 1;
}
100% {
-moz-transform: translateX(0);
opacity: 1;
}
}
@-ms-keyframes goCycleSmallContentElastSlideInLeft {
0% {
-ms-animation-timing-function: ease-in;
-ms-transform: translateX(-150%);
}
20% {
-ms-transform: translateX(50%);
opacity: 1;
}
100% {
-ms-transform: translateX(0);
opacity: 1;
}
}
@keyframes goCycleSmallContentElastSlideInLeft {
0% {
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
-webkit-transform: translateX(-150%);
transform: translateX(-150%);
}
20% {
-webkit-transform: translateX(50%);
transform: translateX(50%);
opacity: 1;
}
100% {
-webkit-transform: translateX(0);
transform: translateX(0);
opacity: 1;
}
}
/***************************************************************************************************************************/
/******************************************************* FX TRANSPARENT ****************************************************/
/***************************************************************************************************************************/
/*****************************************/
/* Slide forward */
/*****************************************/
.fxSlideForward .navOutNext {
-webkit-transform-origin: -50% 50%;
transform-origin: -50% 50%;
-webkit-animation: goCycleTransparentScaleDown 0.5s forwards cubic-bezier(0.7, 0, 0.3, 1);
animation: goCycleTransparentScaleDown 0.5s forwards cubic-bezier(0.7, 0, 0.3, 1);
}
.fxSlideForward .navInNext {
-webkit-transform-origin: 150% 50%;
transform-origin: 150% 50%;
-webkit-animation: goCycleTransparentScaleUp 0.5s forwards cubic-bezier(0.7, 0, 0.3, 1);
animation: goCycleTransparentScaleUp 0.5s forwards cubic-bezier(0.7, 0, 0.3, 1);
}
.fxSlideForward .navOutPrev {
-webkit-transform-origin: 150% 50%;
transform-origin: 150% 50%;
-webkit-animation: goCycleTransparentScaleDown 0.5s forwards cubic-bezier(0.7, 0, 0.3, 1);
animation: goCycleTransparentScaleDown 0.5s forwards cubic-bezier(0.7, 0, 0.3, 1);
}
.fxSlideForward .navInPrev {
-webkit-transform-origin: -50% 50%;
transform-origin: -50% 50%;
-webkit-animation: goCycleTransparentScaleUp 0.5s forwards cubic-bezier(0.7, 0, 0.3, 1);
animation: goCycleTransparentScaleUp 0.5s forwards cubic-bezier(0.7, 0, 0.3, 1);
}
@-webkit-keyframes goCycleTransparentScaleUp {
from {
-webkit-transform: scale(0);
}
to {
-webkit-transform: scale(1);
opacity: 1;
}
}
@-moz-keyframes goCycleTransparentScaleUp {
from {
-moz-transform: scale(0);
}
to {
-moz-transform: scale(1);
opacity: 1;
}
}
@-ms-keyframes goCycleTransparentScaleUp {
from {
-ms-transform: scale(0);
}
to {
-ms-transform: scale(1);
opacity: 1;
}
}
@keyframes goCycleTransparentScaleUp {
from {
-webkit-transform: scale(0);
transform: scale(0);
}
to {
-webkit-transform: scale(1);
transform: scale(1);
opacity: 1;
}
}
@-webkit-keyframes goCycleTransparentScaleDown {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-webkit-transform: scale(0);
opacity: 0;
}
}
@-moz-keyframes goCycleTransparentScaleDown {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-moz-transform: scale(0);
opacity: 0;
}
}
@-ms-keyframes goCycleTransparentScaleDown {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-ms-transform: scale(0);
opacity: 0;
}
}
@keyframes goCycleTransparentScaleDown {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-webkit-transform: scale(0);
transform: scale(0);
opacity: 0;
}
}
/*****************************************/
/* Table Drop */
/*****************************************/
.fxTableDrop .navOutNext {
-webkit-animation: goCycleTransparentSlideOutDown 0.4s forwards cubic-bezier(0.7, 0, 0.3, 1);
animation: goCycleTransparentSlideOutDown 0.4s forwards cubic-bezier(0.7, 0, 0.3, 1);
}
.fxTableDrop .navInNext {
-webkit-transform-origin: 50% 100%;
transform-origin: 50% 100%;
-webkit-animation: goCycleTransparentSlideInDown 0.4s 0.2s forwards ease-in;
animation: goCycleTransparentSlideInDown 0.4s 0.2s forwards ease-in;
}
.fxTableDrop .navOutPrev {
-webkit-animation: goCycleTransparentSlideOutUp 0.4s forwards cubic-bezier(0.7, 0, 0.3, 1);
animation: goCycleTransparentSlideOutUp 0.4s forwards cubic-bezier(0.7, 0, 0.3, 1);
}
.fxTableDrop .navInPrev {
-webkit-transform-origin: 50% 100%;
transform-origin: 50% 100%;
-webkit-animation: goCycleTransparentSlideInUp 0.4s 0.2s forwards ease-in;
animation: goCycleTransparentSlideInUp 0.4s 0.2s forwards ease-in;
}
@-webkit-keyframes goCycleTransparentSlideOutDown {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
100% {
-webkit-transform: translateY(150%);
opacity: 0;
}
}
@-moz-keyframes goCycleTransparentSlideOutDown {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
100% {
-moz-transform: translateY(150%);
opacity: 0;
}
}
@-ms-keyframes goCycleTransparentSlideOutDown {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
100% {
-ms-transform: translateY(150%);
opacity: 0;
}
}
@keyframes goCycleTransparentSlideOutDown {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
100% {
-webkit-transform: translateY(150%);
transform: translateY(150%);
opacity: 0;
}
}
@-webkit-keyframes goCycleTransparentSlideInDown {
0% {
-webkit-animation-timing-function: ease-in-out;
-webkit-transform: translateY(-150%);
}
50% {
-webkit-transform: translateY(0) rotate(1deg);
opacity: 1;
}
70% {
-webkit-transform: translateY(0) rotate(-1deg);
}
85% {
-webkit-transform: translateY(0) rotate(1deg);
}
95% {
-webkit-transform: translateY(0) rotate(-1deg);
}
100% {
-webkit-transform: translateY(0);
opacity: 1;
}
}
@-moz-keyframes goCycleTransparentSlideInDown {
0% {
-moz-animation-timing-function: ease-in-out;
-moz-transform: translateY(-150%);
}
50% {
-moz-transform: translateY(0) rotate(1deg);
opacity: 1;
}
70% {
-moz-transform: translateY(0) rotate(-1deg);
}
85% {
-moz-transform: translateY(0) rotate(1deg);
}
95% {
-moz-transform: translateY(0) rotate(-1deg);
}
100% {
-moz-transform: translateY(0);
opacity: 1;
}
}
@-ms-keyframes goCycleTransparentSlideInDown {
0% {
-ms-animation-timing-function: ease-in-out;
-ms-transform: translateY(-150%);
}
50% {
-ms-transform: translateY(0) rotate(1deg);
opacity: 1;
}
70% {
-ms-transform: translateY(0) rotate(-1deg);
}
85% {
-ms-transform: translateY(0) rotate(1deg);
}
95% {
-ms-transform: translateY(0) rotate(-1deg);
}
100% {
-ms-transform: translateY(0);
opacity: 1;
}
}
@keyframes goCycleTransparentSlideInDown {
0% {
-webkit-animation-timing-function: ease-in-out;
animation-timing-function: ease-in-out;
-webkit-transform: translateY(-150%);
transform: translateY(-150%);
}
50% {
-webkit-transform: translateY(0) rotate(1deg);
transform: translateY(0) rotate(1deg);
opacity: 1;
}
70% {
-webkit-transform: translateY(0) rotate(-1deg);
transform: translateY(0) rotate(-1deg);
}
85% {
-webkit-transform: translateY(0) rotate(1deg);
transform: translateY(0) rotate(1deg);
}
95% {
-webkit-transform: translateY(0) rotate(-1deg);
transform: translateY(0) rotate(-1deg);
}
100% {
-webkit-transform: translateY(0);
transform: translateY(0);
opacity: 1;
}
}
@-webkit-keyframes goCycleTransparentSlideOutUp {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
100% {
-webkit-transform: translateY(-150%);
opacity: 0;
}
}
@-moz-keyframes goCycleTransparentSlideOutUp {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
100% {
-moz-transform: translateY(-150%);
opacity: 0;
}
}
@-ms-keyframes goCycleTransparentSlideOutUp {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
100% {
-ms-transform: translateY(-150%);
opacity: 0;
}
}
@keyframes goCycleTransparentSlideOutUp {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
100% {
-webkit-transform: translateY(-150%);
transform: translateY(-150%);
opacity: 0;
}
}
@-webkit-keyframes goCycleTransparentSlideInUp {
0% {
-webkit-animation-timing-function: ease-in-out;
-webkit-transform: translateY(150%);
}
50% {
-webkit-transform: translateY(0) rotate(-1deg);
opacity: 1;
}
70% {
-webkit-transform: translateY(0) rotate(1deg);
}
85% {
-webkit-transform: translateY(0) rotate(-1deg);
}
95% {
-webkit-transform: translateY(0) rotate(1deg);
}
100% {
-webkit-transform: translateY(0);
opacity: 1;
}
}
@-moz-keyframes goCycleTransparentSlideInUp {
0% {
-moz-animation-timing-function: ease-in-out;
-moz-transform: translateY(150%);
}
50% {
-moz-transform: translateY(0) rotate(-1deg);
opacity: 1;
}
70% {
-moz-transform: translateY(0) rotate(1deg);
}
85% {
-moz-transform: translateY(0) rotate(-1deg);
}
95% {
-moz-transform: translateY(0) rotate(1deg);
}
100% {
-moz-transform: translateY(0);
opacity: 1;
}
}
@-ms-keyframes goCycleTransparentSlideInUp {
0% {
-ms-animation-timing-function: ease-in-out;
-ms-transform: translateY(150%);
}
50% {
-ms-transform: translateY(0) rotate(-1deg);
opacity: 1;
}
70% {
-ms-transform: translateY(0) rotate(1deg);
}
85% {
-ms-transform: translateY(0) rotate(-1deg);
}
95% {
-ms-transform: translateY(0) rotate(1deg);
}
100% {
-ms-transform: translateY(0);
opacity: 1;
}
}
@keyframes goCycleTransparentSlideInUp {
0% {
-webkit-animation-timing-function: ease-in-out;
animation-timing-function: ease-in-out;
-webkit-transform: translateY(150%);
transform: translateY(150%);
}
50% {
-webkit-transform: translateY(0) rotate(-1deg);
transform: translateY(0) rotate(-1deg);
opacity: 1;
}
70% {
-webkit-transform: translateY(0) rotate(1deg);
transform: translateY(0) rotate(1deg);
}
85% {
-webkit-transform: translateY(0) rotate(-1deg);
transform: translateY(0) rotate(-1deg);
}
95% {
-webkit-transform: translateY(0) rotate(1deg);
transform: translateY(0) rotate(1deg);
}
100% {
-webkit-transform: translateY(0);
transform: translateY(0);
opacity: 1;
}
}
/*****************************************/
/* Slide it */
/*****************************************/
.fxSlideIt li {
-webkit-transform-origin: 50% 100%;
transform-origin: 50% 100%;
}
.fxSlideIt .navOutNext {
-webkit-animation: goCycleTransparentSlideOutLeft 0.5s forwards;
animation: goCycleTransparentSlideOutLeft 0.5s forwards;
}
.fxSlideIt .navInNext {
-webkit-animation: goCycleTransparentRotateSlideInRight 0.6s 0.1s forwards ease-in-out;
animation: goCycleTransparentRotateSlideInRight 0.6s 0.1s forwards ease-in-out;
}
.fxSlideIt .navOutPrev {
-webkit-animation: goCycleTransparentSlideOutRight 0.5s forwards;
animation: goCycleTransparentSlideOutRight 0.5s forwards;
}
.fxSlideIt .navInPrev {
-webkit-animation: goCycleTransparentRotateSlideInLeft 0.6s 0.1s forwards ease-in-out;
animation: goCycleTransparentRotateSlideInLeft 0.6s 0.1s forwards ease-in-out;
}
@-webkit-keyframes goCycleTransparentSlideOutLeft {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
100% {
-webkit-transform: translateX(-400%);
opacity: 0;
}
}
@-moz-keyframes goCycleTransparentSlideOutLeft {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
100% {
-moz-transform: translateX(-400%);
opacity: 0;
}
}
@-ms-keyframes goCycleTransparentSlideOutLeft {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
100% {
-ms-transform: translateX(-400%);
opacity: 0;
}
}
@keyframes goCycleTransparentSlideOutLeft {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
100% {
-webkit-transform: translateX(-400%);
transform: translateX(-400%);
opacity: 0;
}
}
@-webkit-keyframes goCycleTransparentRotateSlideInRight {
0% {
-webkit-transform: translateX(100%) rotate(20deg);
}
35% {
-webkit-transform: rotate(-8deg);
}
55% {
-webkit-transform: rotate(6deg);
}
70% {
-webkit-transform: rotate(-4deg);
}
85% {
-webkit-transform: rotate(2deg);
}
95% {
-webkit-transform: rotate(-1deg);
}
100% {
-webkit-transform: translateX(0) rotate(0deg);
opacity: 1;
}
}
@-moz-keyframes goCycleTransparentRotateSlideInRight {
0% {
-moz-transform: translateX(100%) rotate(20deg);
}
35% {
-moz-transform: rotate(-8deg);
}
55% {
-moz-transform: rotate(6deg);
}
70% {
-moz-transform: rotate(-4deg);
}
85% {
-moz-transform: rotate(2deg);
}
95% {
-moz-transform: rotate(-1deg);
}
100% {
-moz-transform: translateX(0) rotate(0deg);
opacity: 1;
}
}
@-ms-keyframes goCycleTransparentRotateSlideInRight {
0% {
-ms-transform: translateX(100%) rotate(20deg);
}
35% {
-ms-transform: rotate(-8deg);
}
55% {
-ms-transform: rotate(6deg);
}
70% {
-ms-transform: rotate(-4deg);
}
85% {
-ms-transform: rotate(2deg);
}
95% {
-ms-transform: rotate(-1deg);
}
100% {
-ms-transform: translateX(0) rotate(0deg);
opacity: 1;
}
}
@keyframes goCycleTransparentRotateSlideInRight {
0% {
-webkit-transform: translateX(100%) rotate(20deg);
transform: translateX(100%) rotate(20deg);
}
35% {
-webkit-transform: rotate(-8deg);
transform: rotate(-8deg);
}
55% {
-webkit-transform: rotate(6deg);
transform: rotate(6deg);
}
70% {
-webkit-transform: rotate(-4deg);
transform: rotate(-4deg);
}
85% {
-webkit-transform: rotate(2deg);
transform: rotate(2deg);
}
95% {
-webkit-transform: rotate(-1deg);
transform: rotate(-1deg);
}
100% {
-webkit-transform: translateX(0) rotate(0deg);
transform: translateX(0) rotate(0deg);
opacity: 1;
}
}
@-webkit-keyframes goCycleTransparentSlideOutRight {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
100% {
-webkit-transform: translateX(400%);
opacity: 0;
}
}
@-moz-keyframes goCycleTransparentSlideOutRight {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
100% {
-moz-transform: translateX(400%);
opacity: 0;
}
}
@-ms-keyframes goCycleTransparentSlideOutRight {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
100% {
-ms-transform: translateX(400%);
opacity: 0;
}
}
@keyframes goCycleTransparentSlideOutRight {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
100% {
-webkit-transform: translateX(400%);
transform: translateX(400%);
opacity: 0;
}
}
@-webkit-keyframes goCycleTransparentRotateSlideInLeft {
0% {
-webkit-transform: translateX(-100%) rotate(-20deg);
}
35% {
-webkit-transform: rotate(8deg);
}
55% {
-webkit-transform: rotate(-6deg);
}
70% {
-webkit-transform: rotate(4deg);
}
85% {
-webkit-transform: rotate(-2deg);
}
95% {
-webkit-transform: rotate(1deg);
}
100% {
-webkit-transform: translateX(0) rotate(0deg);
opacity: 1;
}
}
@-moz-keyframes goCycleTransparentRotateSlideInLeft {
0% {
-moz-transform: translateX(-100%) rotate(-20deg);
}
35% {
-moz-transform: rotate(8deg);
}
55% {
-moz-transform: rotate(-6deg);
}
70% {
-moz-transform: rotate(4deg);
}
85% {
-moz-transform: rotate(-2deg);
}
95% {
-moz-transform: rotate(1deg);
}
100% {
-moz-transform: translateX(0) rotate(0deg);
opacity: 1;
}
}
@-ms-keyframes goCycleTransparentRotateSlideInLeft {
0% {
-ms-transform: translateX(-100%) rotate(-20deg);
}
35% {
-ms-transform: rotate(8deg);
}
55% {
-ms-transform: rotate(-6deg);
}
70% {
-ms-transform: rotate(4deg);
}
85% {
-ms-transform: rotate(-2deg);
}
95% {
-ms-transform: rotate(1deg);
}
100% {
-ms-transform: translateX(0) rotate(0deg);
opacity: 1;
}
}
@keyframes goCycleTransparentRotateSlideInLeft {
0% {
-webkit-transform: translateX(-100%) rotate(-20deg);
transform: translateX(-100%) rotate(-20deg);
}
35% {
-webkit-transform: rotate(8deg);
transform: rotate(8deg);
}
55% {
-webkit-transform: rotate(-6deg);
transform: rotate(-6deg);
}
70% {
-webkit-transform: rotate(4deg);
transform: rotate(4deg);
}
85% {
-webkit-transform: rotate(-2deg);
transform: rotate(-2deg);
}
95% {
-webkit-transform: rotate(1deg);
transform: rotate(1deg);
}
100% {
-webkit-transform: translateX(0) rotate(0deg);
transform: translateX(0) rotate(0deg);
opacity: 1;
}
}
/*****************************************/
/* Bottle kick */
/*****************************************/
.fxBottleKick li {
-webkit-transform-origin: 50% 100%;
transform-origin: 50% 100%;
}
.fxBottleKick .navOutNext {
-webkit-transform-origin: 0% 100%;
transform-origin: 0% 100%;
-webkit-animation: goCycleTransparentRotateBounceOutLeft 1s forwards ease-in-out;
animation: goCycleTransparentRotateBounceOutLeft 1s forwards ease-in-out;
}
.fxBottleKick .navInNext {
-webkit-animation: goCycleTransparentRotateBounceInRight 1s 0.1s forwards ease-in-out;
animation: goCycleTransparentRotateBounceInRight 1s 0.1s forwards ease-in-out;
}
.fxBottleKick .navOutPrev {
-webkit-transform-origin: 100% 100%;
transform-origin: 100% 100%;
-webkit-animation: goCycleTransparentRotateBounceOutRight 1s forwards ease-in-out;
animation: goCycleTransparentRotateBounceOutRight 1s forwards ease-in-out;
}
.fxBottleKick .navInPrev {
-webkit-animation: goCycleTransparentRotateBounceInLeft 1s 0.1s forwards ease-in-out;
animation: goCycleTransparentRotateBounceInLeft 1s 0.1s forwards ease-in-out;
}
@-webkit-keyframes goCycleTransparentRotateBounceOutLeft {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
25% {
-webkit-transform: translateX(-100%) rotate(0deg);
opacity: 0.9;
}
58% {
-webkit-transform: translateX(-150%) rotate(-92deg);
opacity: 0.9;
}
70% {
-webkit-transform: translateX(-150%) rotate(-75deg);
}
86% {
-webkit-transform: translateX(-150%) rotate(-92deg);
}
95% {
-webkit-transform: translateX(-150%) rotate(-87deg);
}
100% {
-webkit-transform: translateX(-150%) rotate(-90deg);
opacity: 0;
}
}
@-moz-keyframes goCycleTransparentRotateBounceOutLeft {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
25% {
-moz-transform: translateX(-100%) rotate(0deg);
opacity: 0.9;
}
58% {
-moz-transform: translateX(-150%) rotate(-92deg);
opacity: 0.9;
}
70% {
-moz-transform: translateX(-150%) rotate(-75deg);
}
86% {
-moz-transform: translateX(-150%) rotate(-92deg);
}
95% {
-moz-transform: translateX(-150%) rotate(-87deg);
}
100% {
-moz-transform: translateX(-150%) rotate(-90deg);
opacity: 0;
}
}
@-ms-keyframes goCycleTransparentRotateBounceOutLeft {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
25% {
-ms-transform: translateX(-100%) rotate(0deg);
opacity: 0.9;
}
58% {
-ms-transform: translateX(-150%) rotate(-92deg);
opacity: 0.9;
}
70% {
-ms-transform: translateX(-150%) rotate(-75deg);
}
86% {
-ms-transform: translateX(-150%) rotate(-92deg);
}
95% {
-ms-transform: translateX(-150%) rotate(-87deg);
}
100% {
-ms-transform: translateX(-150%) rotate(-90deg);
opacity: 0;
}
}
@keyframes goCycleTransparentRotateBounceOutLeft {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
25% {
-webkit-transform: translateX(-100%) rotate(0deg);
transform: translateX(-100%) rotate(0deg);
opacity: 0.9;
}
58% {
-webkit-transform: translateX(-150%) rotate(-92deg);
transform: translateX(-150%) rotate(-92deg);
opacity: 0.9;
}
70% {
-webkit-transform: translateX(-150%) rotate(-75deg);
transform: translateX(-150%) rotate(-75deg);
}
86% {
-webkit-transform: translateX(-150%) rotate(-92deg);
transform: translateX(-150%) rotate(-92deg);
}
95% {
-webkit-transform: translateX(-150%) rotate(-87deg);
transform: translateX(-150%) rotate(-87deg);
}
100% {
-webkit-transform: translateX(-150%) rotate(-90deg);
transform: translateX(-150%) rotate(-90deg);
opacity: 0;
}
}
@-webkit-keyframes goCycleTransparentRotateBounceInRight {
0% {
-webkit-transform: translateX(200%) rotate(20deg);
}
25% {
-webkit-transform: rotate(-5deg);
}
55% {
-webkit-transform: translateX(-5%) rotate(3deg);
opacity: 1;
}
80% {
-webkit-transform: rotate(-2deg);
}
100% {
-webkit-transform: translateX(0) rotate(0deg);
opacity: 1;
}
}
@-moz-keyframes goCycleTransparentRotateBounceInRight {
0% {
-moz-transform: translateX(200%) rotate(20deg);
}
25% {
-moz-transform: rotate(-5deg);
}
55% {
-moz-transform: translateX(-5%) rotate(3deg);
opacity: 1;
}
80% {
-moz-transform: rotate(-2deg);
}
100% {
-moz-transform: translateX(0) rotate(0deg);
opacity: 1;
}
}
@-ms-keyframes goCycleTransparentRotateBounceInRight {
0% {
-ms-transform: translateX(200%) rotate(20deg);
}
25% {
-ms-transform: rotate(-5deg);
}
55% {
-ms-transform: translateX(-5%) rotate(3deg);
opacity: 1;
}
80% {
-ms-transform: rotate(-2deg);
}
100% {
-ms-transform: translateX(0) rotate(0deg);
opacity: 1;
}
}
@keyframes goCycleTransparentRotateBounceInRight {
0% {
-webkit-transform: translateX(200%) rotate(20deg);
transform: translateX(200%) rotate(20deg);
}
25% {
-webkit-transform: rotate(-5deg);
transform: rotate(-5deg);
}
55% {
-webkit-transform: translateX(-5%) rotate(3deg);
transform: translateX(-5%) rotate(3deg);
opacity: 1;
}
80% {
-webkit-transform: rotate(-2deg);
transform: rotate(-2deg);
}
100% {
-webkit-transform: translateX(0) rotate(0deg);
transform: translateX(0) rotate(0deg);
opacity: 1;
}
}
@-webkit-keyframes goCycleTransparentRotateBounceOutRight {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
25% {
-webkit-transform: translateX(100%) rotate(0deg);
opacity: 0.9;
}
58% {
-webkit-transform: translateX(150%) rotate(92deg);
opacity: 0.9;
}
70% {
-webkit-transform: translateX(150%) rotate(75deg);
}
86% {
-webkit-transform: translateX(150%) rotate(92deg);
}
95% {
-webkit-transform: translateX(150%) rotate(87deg);
}
100% {
-webkit-transform: translateX(150%) rotate(90deg);
opacity: 0;
}
}
@-moz-keyframes goCycleTransparentRotateBounceOutRight {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
25% {
-moz-transform: translateX(100%) rotate(0deg);
opacity: 0.9;
}
58% {
-moz-transform: translateX(150%) rotate(92deg);
opacity: 0.9;
}
70% {
-moz-transform: translateX(150%) rotate(75deg);
}
86% {
-moz-transform: translateX(150%) rotate(92deg);
}
95% {
-moz-transform: translateX(150%) rotate(87deg);
}
100% {
-moz-transform: translateX(150%) rotate(90deg);
opacity: 0;
}
}
@-ms-keyframes goCycleTransparentRotateBounceOutRight {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
25% {
-ms-transform: translateX(100%) rotate(0deg);
opacity: 0.9;
}
58% {
-ms-transform: translateX(150%) rotate(92deg);
opacity: 0.9;
}
70% {
-ms-transform: translateX(150%) rotate(75deg);
}
86% {
-ms-transform: translateX(150%) rotate(92deg);
}
95% {
-ms-transform: translateX(150%) rotate(87deg);
}
100% {
-ms-transform: translateX(150%) rotate(90deg);
opacity: 0;
}
}
@keyframes goCycleTransparentRotateBounceOutRight {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
25% {
-webkit-transform: translateX(100%) rotate(0deg);
transform: translateX(100%) rotate(0deg);
opacity: 0.9;
}
58% {
-webkit-transform: translateX(150%) rotate(92deg);
transform: translateX(150%) rotate(92deg);
opacity: 0.9;
}
70% {
-webkit-transform: translateX(150%) rotate(75deg);
transform: translateX(150%) rotate(75deg);
}
86% {
-webkit-transform: translateX(150%) rotate(92deg);
transform: translateX(150%) rotate(92deg);
}
95% {
-webkit-transform: translateX(150%) rotate(87deg);
transform: translateX(150%) rotate(87deg);
}
100% {
-webkit-transform: translateX(150%) rotate(90deg);
transform: translateX(150%) rotate(90deg);
opacity: 0;
}
}
@-webkit-keyframes goCycleTransparentRotateBounceInLeft {
0% {
-webkit-transform: translateX(-200%) rotate(-20deg);
}
25% {
-webkit-transform: rotate(5deg);
}
55% {
-webkit-transform: translateX(5%) rotate(-3deg);
opacity: 1;
}
80% {
-webkit-transform: rotate(2deg);
}
100% {
-webkit-transform: translateX(0) rotate(0deg);
opacity: 1;
}
}
@-moz-keyframes goCycleTransparentRotateBounceInLeft {
0% {
-moz-transform: translateX(-200%) rotate(-20deg);
}
25% {
-moz-transform: rotate(5deg);
}
55% {
-moz-transform: translateX(5%) rotate(-3deg);
opacity: 1;
}
80% {
-moz-transform: rotate(2deg);
}
100% {
-moz-transform: translateX(0) rotate(0deg);
opacity: 1;
}
}
@-ms-keyframes goCycleTransparentRotateBounceInLeft {
0% {
-ms-transform: translateX(-200%) rotate(-20deg);
}
25% {
-ms-transform: rotate(5deg);
}
55% {
-ms-transform: translateX(5%) rotate(-3deg);
opacity: 1;
}
80% {
-ms-transform: rotate(2deg);
}
100% {
-ms-transform: translateX(0) rotate(0deg);
opacity: 1;
}
}
@keyframes goCycleTransparentRotateBounceInLeft {
0% {
-webkit-transform: translateX(-200%) rotate(-20deg);
transform: translateX(-200%) rotate(-20deg);
}
25% {
-webkit-transform: rotate(5deg);
transform: rotate(5deg);
}
55% {
-webkit-transform: translateX(5%) rotate(-3deg);
transform: translateX(5%) rotate(-3deg);
opacity: 1;
}
80% {
-webkit-transform: rotate(2deg);
transform: rotate(2deg);
}
100% {
-webkit-transform: translateX(0) rotate(0deg);
transform: translateX(0) rotate(0deg);
opacity: 1;
}
}
/*****************************************/
/* Off the Shelf */
/*****************************************/
.fxShelf li {
-webkit-transform-origin: 50% 100%;
transform-origin: 50% 100%;
}
.fxShelf .navOutNext {
-webkit-animation: goCycleTransparentAddToShelfLeft 0.3s forwards ease-in-out;
animation: goCycleTransparentAddToShelfLeft 0.3s forwards ease-in-out;
}
.fxShelf .navInNext {
-webkit-animation: goCycleTransparentRemoveFromShelfRight 0.5s forwards ease-in-out;
animation: goCycleTransparentRemoveFromShelfRight 0.5s forwards ease-in-out;
}
.fxShelf .navOutPrev {
-webkit-animation: goCycleTransparentAddToShelfRight 0.3s forwards ease-in-out;
animation: goCycleTransparentAddToShelfRight 0.3s forwards ease-in-out;
}
.fxShelf .navInPrev {
-webkit-animation: goCycleTransparentRemoveFromShelfLeft 0.5s forwards ease-in-out;
animation: goCycleTransparentRemoveFromShelfLeft 0.5s forwards ease-in-out;
}
@-webkit-keyframes goCycleTransparentAddToShelfLeft {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-webkit-transform: translateY(-120%) translateX(-300%) rotate(-90deg);
opacity: 0;
}
}
@-moz-keyframes goCycleTransparentAddToShelfLeft {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-moz-transform: translateY(-120%) translateX(-300%) rotate(-90deg);
opacity: 0;
}
}
@-ms-keyframes goCycleTransparentAddToShelfLeft {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-ms-transform: translateY(-120%) translateX(-300%) rotate(-90deg);
opacity: 0;
}
}
@keyframes goCycleTransparentAddToShelfLeft {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-webkit-transform: translateY(-120%) translateX(-300%) rotate(-90deg);
transform: translateY(-120%) translateX(-300%) rotate(-90deg);
opacity: 0;
}
}
@-webkit-keyframes goCycleTransparentRemoveFromShelfRight {
0% {
-webkit-transform: translateY(-120%) translateX(300%) rotate(90deg);
}
45% {
-webkit-transform: translateY(0) translateX(0) rotate(-3deg);
opacity: 1;
}
65% {
-webkit-transform: translateY(0) translateX(0) rotate(2deg);
opacity: 1;
}
80% {
-webkit-transform: translateY(0) translateX(0) rotate(-1deg);
opacity: 1;
}
95% {
-webkit-transform: translateY(0) translateX(0) rotate(1deg);
opacity: 1;
}
100% {
-webkit-transform: translateY(0) translateX(0) rotate(0deg);
opacity: 1;
}
}
@-moz-keyframes goCycleTransparentRemoveFromShelfRight {
0% {
-moz-transform: translateY(-120%) translateX(300%) rotate(90deg);
}
45% {
-moz-transform: translateY(0) translateX(0) rotate(-3deg);
opacity: 1;
}
65% {
-moz-transform: translateY(0) translateX(0) rotate(2deg);
opacity: 1;
}
80% {
-moz-transform: translateY(0) translateX(0) rotate(-1deg);
opacity: 1;
}
95% {
-moz-transform: translateY(0) translateX(0) rotate(1deg);
opacity: 1;
}
100% {
-moz-transform: translateY(0) translateX(0) rotate(0deg);
opacity: 1;
}
}
@-ms-keyframes goCycleTransparentRemoveFromShelfRight {
0% {
-ms-transform: translateY(-120%) translateX(300%) rotate(90deg);
}
45% {
-ms-transform: translateY(0) translateX(0) rotate(-3deg);
opacity: 1;
}
65% {
-ms-transform: translateY(0) translateX(0) rotate(2deg);
opacity: 1;
}
80% {
-ms-transform: translateY(0) translateX(0) rotate(-1deg);
opacity: 1;
}
95% {
-ms-transform: translateY(0) translateX(0) rotate(1deg);
opacity: 1;
}
100% {
-ms-transform: translateY(0) translateX(0) rotate(0deg);
opacity: 1;
}
}
@keyframes goCycleTransparentRemoveFromShelfRight {
0% {
-webkit-transform: translateY(-120%) translateX(300%) rotate(90deg);
transform: translateY(-120%) translateX(300%) rotate(90deg);
}
45% {
-webkit-transform: translateY(0) translateX(0) rotate(-3deg);
transform: translateY(0) translateX(0) rotate(-3deg);
opacity: 1;
}
65% {
-webkit-transform: translateY(0) translateX(0) rotate(2deg);
transform: translateY(0) translateX(0) rotate(2deg);
opacity: 1;
}
80% {
-webkit-transform: translateY(0) translateX(0) rotate(-1deg);
transform: translateY(0) translateX(0) rotate(-1deg);
opacity: 1;
}
95% {
-webkit-transform: translateY(0) translateX(0) rotate(1deg);
transform: translateY(0) translateX(0) rotate(1deg);
opacity: 1;
}
100% {
-webkit-transform: translateY(0) translateX(0) rotate(0deg);
transform: translateY(0) translateX(0) rotate(0deg);
opacity: 1;
}
}
@-webkit-keyframes goCycleTransparentAddToShelfRight {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-webkit-transform: translateY(-120%) translateX(300%) rotate(90deg);
opacity: 0;
}
}
@-moz-keyframes goCycleTransparentAddToShelfRight {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-moz-transform: translateY(-120%) translateX(300%) rotate(90deg);
opacity: 0;
}
}
@-ms-keyframes goCycleTransparentAddToShelfRight {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-ms-transform: translateY(-120%) translateX(300%) rotate(90deg);
opacity: 0;
}
}
@keyframes goCycleTransparentAddToShelfRight {
/* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
to {
-webkit-transform: translateY(-120%) translateX(300%) rotate(90deg);
transform: translateY(-120%) translateX(300%) rotate(90deg);
opacity: 0;
}
}
@-webkit-keyframes goCycleTransparentRemoveFromShelfLeft {
0% {
-webkit-transform: translateY(-120%) translateX(-300%) rotate(-90deg);
}
45% {
-webkit-transform: translateY(0) translateX(0) rotate(3deg);
opacity: 1;
}
65% {
-webkit-transform: translateY(0) translateX(0) rotate(-2deg);
opacity: 1;
}
80% {
-webkit-transform: translateY(0) translateX(0) rotate(1deg);
opacity: 1;
}
95% {
-webkit-transform: translateY(0) translateX(0) rotate(-1deg);
opacity: 1;
}
100% {
-webkit-transform: translateY(0) translateX(0) rotate(0deg);
opacity: 1;
}
}
@-moz-keyframes goCycleTransparentRemoveFromShelfLeft {
0% {
-moz-transform: translateY(-120%) translateX(-300%) rotate(-90deg);
}
45% {
-moz-transform: translateY(0) translateX(0) rotate(3deg);
opacity: 1;
}
65% {
-moz-transform: translateY(0) translateX(0) rotate(-2deg);
opacity: 1;
}
80% {
-moz-transform: translateY(0) translateX(0) rotate(1deg);
opacity: 1;
}
95% {
-moz-transform: translateY(0) translateX(0) rotate(-1deg);
opacity: 1;
}
100% {
-moz-transform: translateY(0) translateX(0) rotate(0deg);
opacity: 1;
}
}
@-ms-keyframes goCycleTransparentRemoveFromShelfLeft {
0% {
-ms-transform: translateY(-120%) translateX(-300%) rotate(-90deg);
}
45% {
-ms-transform: translateY(0) translateX(0) rotate(3deg);
opacity: 1;
}
65% {
-ms-transform: translateY(0) translateX(0) rotate(-2deg);
opacity: 1;
}
80% {
-ms-transform: translateY(0) translateX(0) rotate(1deg);
opacity: 1;
}
95% {
-ms-transform: translateY(0) translateX(0) rotate(-1deg);
opacity: 1;
}
100% {
-ms-transform: translateY(0) translateX(0) rotate(0deg);
opacity: 1;
}
}
@keyframes goCycleTransparentRemoveFromShelfLeft {
0% {
-webkit-transform: translateY(-120%) translateX(-300%) rotate(-90deg);
transform: translateY(-120%) translateX(-300%) rotate(-90deg);
}
45% {
-webkit-transform: translateY(0) translateX(0) rotate(3deg);
transform: translateY(0) translateX(0) rotate(3deg);
opacity: 1;
}
65% {
-webkit-transform: translateY(0) translateX(0) rotate(-2deg);
transform: translateY(0) translateX(0) rotate(-2deg);
opacity: 1;
}
80% {
-webkit-transform: translateY(0) translateX(0) rotate(1deg);
transform: translateY(0) translateX(0) rotate(1deg);
opacity: 1;
}
95% {
-webkit-transform: translateY(0) translateX(0) rotate(-1deg);
transform: translateY(0) translateX(0) rotate(-1deg);
opacity: 1;
}
100% {
-webkit-transform: translateY(0) translateX(0) rotate(0deg);
transform: translateY(0) translateX(0) rotate(0deg);
opacity: 1;
}
}
/* Layout and further formatting of specialized elements */
* {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
/*
gutter building elements
those are intended to have horizontal margins and should be treated just content elements
therefore it is essential that no nesting of these items occur
*/
/****************** OBJECT FIT START ******************/
.objectFit {
width: 100%;
height: 100%;
display: block;
background-size: cover;
background-position: center center;
position: relative;
}
.objectFit img {
width: 100%;
height: 100%;
object-fit: cover;
position: absolute;
left: 0;
top: 0;
object-position: center center;
}
.objectFit.left {
background-position: left center;
}
.objectFit.left img {
object-position: left center;
}
.objectFit.right {
background-position: right center;
}
.objectFit.right img {
object-position: right center;
}
.compat-object-fit img {
opacity: 0 !important;
}
/****************** OBJECT FIT ENDE ******************/
/****************** PAGEWRAP START ******************/
#pagewrap {
width: 100%;
height: auto;
position: relative;
}
@media (min-width: 992px) {
#pagewrap {
padding-left: 0px;
}
}
/****************** PAGEWRAP ENDE ******************/
/****************** ALLGEMEIN START ******************/
#header,
#footer {
position: relative;
margin: 0;
}
#header {
background: #ffffff;
z-index: 150;
height: 100px;
-webkit-transition: 0.25s ease;
-moz-transition: 0.25s ease;
-ms-transition: 0.25s ease;
-o-transition: 0.25s ease;
transition: 0.25s ease;
}
@media (min-width: 768px) {
#header {
height: 100px;
}
}
@media (min-width: 992px) {
#header {
position: fixed;
top: 0;
left: 0px;
width: calc(100% - 0px);
height: 100px;
}
}
@media (min-width: 1302px) {
#header {
height: 90px;
background: none;
}
}
#header.specialHeader {
background: #ffffff;
-webkit-box-shadow: 0px 0px 2px 0px rgba(0, 0, 0, 0.25);
-moz-box-shadow: 0px 0px 2px 0px rgba(0, 0, 0, 0.25);
box-shadow: 0px 0px 2px 0px rgba(0, 0, 0, 0.25);
}
#footer {
background: url('../../../../../fileadmin/template/Resources/Public/img/footer-meizeit.jpg');
background-repeat: no-repeat;
background-size: cover;
display: flex;
flex-direction: column;
gap: 55px;
justify-content: end;
z-index: 140;
position: relative;
padding: 10px 0;
min-height: 325px;
}
#footer:before {
content: ' ';
position: absolute;
top: 0;
left: 0;
height: 100%;
width: 100%;
background: #000000;
opacity: 0.4;
}
@media (max-width: 767px), (min-width: 768px) and (max-width: 991px) {
#footer {
padding-top: 40px;
gap: 40px;
}
}
main {
position: relative;
z-index: 50;
padding-bottom: 50px;
}
@media (min-width: 992px) {
main {
padding-bottom: 150px;
}
}
.home main {
padding-bottom: 50px;
}
@media (min-width: 768px) {
.home main {
padding-bottom: 0;
}
}
header#title,
header.title {
position: relative;
}
header#title:before,
header.title:before {
font-family: 'default';
font-weight: normal;
text-indent: 0;
font-style: normal;
content: '\e91f';
line-height: 3rem;
position: absolute;
top: -65px;
left: 50%;
-webkit-transform: translateX(-50%);
-moz-transform: translateX(-50%);
-ms-transform: translateX(-50%);
-o-transform: translateX(-50%);
transform: translateX(-50%);
width: 80px;
height: 50px;
font-size: 40px;
display: block;
overflow: hidden;
z-index: 10;
color: #575656;
}
header#title,
header.title,
header.section,
section,
.section {
margin-left: 20px;
margin-right: 20px;
}
main .col0 > .row,
main .col0 > .Tx-Formhandler,
main .col0 > .tx-dce-pi1,
main .col0 > .dce,
main .col0 > .tx-sectioncontent-pi1,
main .col0 > section {
margin-top: 0px;
margin-top: 0rem;
margin-bottom: 50px;
margin-bottom: 3.125rem;
}
@media (min-width: 768px) {
main .col0 > .row,
main .col0 > .Tx-Formhandler,
main .col0 > .tx-dce-pi1,
main .col0 > .dce,
main .col0 > .tx-sectioncontent-pi1,
main .col0 > section {
margin-top: 0px;
margin-top: 0rem;
margin-bottom: 50px;
margin-bottom: 3.125rem;
}
}
@media (min-width: 992px) {
main .col0 > .row,
main .col0 > .Tx-Formhandler,
main .col0 > .tx-dce-pi1,
main .col0 > .dce,
main .col0 > .tx-sectioncontent-pi1,
main .col0 > section {
margin-top: 0px;
margin-top: 0rem;
margin-bottom: 50px;
margin-bottom: 3.125rem;
}
}
@media (min-width: 1302px) {
main .col0 > .row,
main .col0 > .Tx-Formhandler,
main .col0 > .tx-dce-pi1,
main .col0 > .dce,
main .col0 > .tx-sectioncontent-pi1,
main .col0 > section {
margin-top: 0px;
margin-top: 0rem;
margin-bottom: 80px;
margin-bottom: 5rem;
}
}
main .col0 > header#title {
margin-top: 50px;
margin-top: 3.125rem;
margin-bottom: 50px;
margin-bottom: 3.125rem;
}
@media (min-width: 768px) {
main .col0 > header#title {
margin-top: 50px;
margin-top: 3.125rem;
margin-bottom: 50px;
margin-bottom: 3.125rem;
}
}
@media (min-width: 992px) {
main .col0 > header#title {
margin-top: 100px;
margin-top: 6.25rem;
margin-bottom: 50px;
margin-bottom: 3.125rem;
}
}
@media (min-width: 1302px) {
main .col0 > header#title {
margin-top: 100px;
margin-top: 6.25rem;
margin-bottom: 50px;
margin-bottom: 3.125rem;
}
}
section.highlight,
section.success,
section.notice,
section.warning,
section.error {
padding: 1.5rem;
padding-bottom: 0;
margin-bottom: 2rem;
background: #f5f5f5;
border-left: 5px solid;
}
section.highlight::after,
section.success::after,
section.notice::after,
section.warning::after,
section.error::after {
content: '\00A0';
display: block;
height: 0;
overflow: hidden;
}
section.highlight {
border-color: #666666;
}
section.success {
border-color: #5cb85c;
}
section.notice {
border-color: #5bc0de;
}
section.warning {
border-color: #f0ad4e;
}
section.error {
border-color: #c9302c;
}
/****************** ALLGEMEIN ENDE ******************/
/****************** BRAND START ******************/
#brand {
position: relative;
width: 64px;
padding: 5px 0;
margin-left: 10px;
}
@media (min-width: 620px) {
#brand {
margin-left: 20px;
}
}
#brand a {
height: 88px;
width: 64px;
overflow: hidden;
display: block;
text-indent: -999em;
}
@media (min-width: 992px) {
#brand a {
height: 78px;
}
}
#brand svg {
display: block;
height: auto;
max-height: 100%;
position: relative;
width: 100%;
z-index: 100;
}
#brand img {
display: none;
}
.brandFooter {
position: relative;
width: 96px;
padding: 0 0 30px;
margin: 0 auto;
}
@media (min-width: 1302px) {
.brandFooter {
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
-moz-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
-o-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
padding: 0;
width: 136px;
}
}
.brandFooter svg {
display: block;
height: auto;
max-height: 100%;
position: relative;
width: 100%;
z-index: 100;
}
/****************** BRAND ENDE ******************/
/****************** MEDIA START ******************/
#media {
position: relative;
left: 50%;
width: 100%;
background: #333333;
-webkit-transform: translateX(-50%);
-moz-transform: translateX(-50%);
-ms-transform: translateX(-50%);
-o-transform: translateX(-50%);
transform: translateX(-50%);
z-index: 10;
/* #media > .canvas START */
/* #media > .canvas END */
}
@media (min-width: 992px) {
#media {
width: calc(100% - 0px + 2px);
}
}
#media .slide-controls {
z-index: 80;
}
@media (max-width: 767px) {
#media .slide-controls {
top: auto;
bottom: 0;
}
}
#media > .canvas {
width: 100%;
height: 400px;
overflow: hidden;
margin-bottom: 0;
z-index: 10;
}
@media (min-width: 768px) {
#media > .canvas {
height: 600px;
}
}
@media (min-width: 992px) {
#media > .canvas {
height: 750px;
margin-top: 100px;
}
}
@media (min-width: 1302px) {
#media > .canvas {
margin-top: 0px;
}
}
#media > .canvas > div {
width: 100%;
height: 100%;
position: relative;
}
@media (min-width: 1302px) {
#media > .canvas:before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 180px;
display: block;
overflow: hidden;
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#000000+0,000000+100&0.3+0,0+100 */
background: -moz-linear-gradient(top, rgba(0, 0, 0, 0.3) 0%, rgba(0, 0, 0, 0) 100%);
/* FF3.6-15 */
background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.3) 0%, rgba(0, 0, 0, 0) 100%);
/* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, rgba(0, 0, 0, 0.3) 0%, rgba(0, 0, 0, 0) 100%);
/* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#4d000000', endColorstr='#00000000', GradientType=0);
/* IE6-9 */
z-index: 1000;
pointer-events: none;
}
}
#media section {
display: none;
position: absolute;
z-index: 10000;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
-moz-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
-o-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
text-align: center;
}
@media (min-width: 992px) {
#media section {
width: 50%;
}
}
#media section .h2 {
font-size: 38px;
color: #ffffff;
line-height: 1.2em;
margin-bottom: 3rem;
}
@media (min-width: 992px) {
#media section .h2 {
font-size: 64px;
}
}
#media section p.subtitle {
color: #ffffff;
}
#media section:before {
color: #ffffff;
}
#media section a {
font-size: 16px !important;
color: #ffffff;
text-decoration: none;
text-align: center;
display: inline-flex;
justify-content: center;
align-items: center;
height: 44px;
width: 150px;
}
#media section {
display: block;
background: -moz-radial-gradient(center, ellipse cover, rgba(0, 0, 0, 0.4) 0%, rgba(0, 0, 0, 0.4) 20%, rgba(0, 0, 0, 0) 70%, rgba(0, 0, 0, 0) 100%);
/* FF3.6-15 */
background: -webkit-radial-gradient(center, ellipse cover, rgba(0, 0, 0, 0.4) 0%, rgba(0, 0, 0, 0.4) 20%, rgba(0, 0, 0, 0) 70%, rgba(0, 0, 0, 0) 100%);
/* Chrome10-25,Safari5.1-6 */
background: radial-gradient(ellipse at center, rgba(0, 0, 0, 0.4) 0%, rgba(0, 0, 0, 0.4) 20%, rgba(0, 0, 0, 0) 70%, rgba(0, 0, 0, 0) 100%);
/* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#59000000', endColorstr='#00000000', GradientType=1);
/* IE6-9 fallback on horizontal gradient */
padding: 100px 0;
}
@media (max-width: 767px) {
body.home #media > .canvas {
height: 600px;
}
}
@media (min-width: 992px) {
body.home #media > .canvas {
height: calc(100vh - 100px);
}
}
@media (min-width: 1302px) {
body.home #media > .canvas {
height: 100vh;
}
}
#media > .canvas > div:nth-child(n+2) {
display: none;
}
.js #media > .canvas > div:nth-child(n+2) {
display: block;
}
#media .control {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 20;
pointer-events: none;
/* #media .control a, #media .control span END */
/* #media .control a, #media .control span END */
/* #media .control .pager START */
/* #media .control .pager END */
/* #media .control .first, #media .control .last, #media .control .play START */
/* #media .control .first, #media .control .last, #media .control .play END */
}
#media .control * {
pointer-events: all !important;
}
#media .control .prev,
#media .control .next {
display: block;
cursor: pointer;
position: absolute;
top: 50%;
left: 30px;
width: 40px;
height: 40px;
z-index: 100;
margin-top: -1.25rem;
display: none;
}
#media .control .prev:before,
#media .control .next:before,
#media .control .prev:before,
#media .control .next:before {
top: 0;
font-family: 'default';
font-weight: normal;
text-indent: 0;
font-style: normal;
content: '\2304';
color: #ffffff;
font-size: 2.5rem;
height: 40px;
left: 0;
line-height: 100%;
position: absolute;
width: 40px;
z-index: 10;
background: none;
border-radius: 0;
-webkit-transform: rotate(90deg);
-moz-transform: rotate(90deg);
-ms-transform: rotate(90deg);
-o-transform: rotate(90deg);
transform: rotate(90deg);
}
#media .control .prev span,
#media .control .next span,
#media .control .prev a,
#media .control .next a {
border: 0;
}
#media .control .next {
left: auto;
right: 30px;
}
#media .control .next:before {
-webkit-transform: rotate(-90deg);
-moz-transform: rotate(-90deg);
-ms-transform: rotate(-90deg);
-o-transform: rotate(-90deg);
transform: rotate(-90deg);
}
#media .control a,
#media .control span {
background: none;
overflow: hidden;
text-indent: -999em;
}
#media .control .pager {
position: absolute;
bottom: 30px;
right: 40px;
z-index: 100;
display: none;
}
#media .control .first,
#media .control .last,
#media .control .play {
display: none;
}
#media .control .dotstyle-fillup {
display: none;
}
@media (min-width: 768px) {
#media .control .dotstyle-fillup {
display: block;
}
}
#media .control .dotstyle-fillup li {
width: 10px;
height: 10px;
top: 2px;
}
#media .control .dotstyle-fillup li.act {
width: 10px;
height: 10px;
top: 2px;
}
#media .control .dotstyle-fillup li a::after {
background-color: white;
}
#media .control .dotstyle-fillup li a {
background-color: rgba(255, 255, 255, 0.3);
backdrop-filter: blur(5px);
box-shadow: none;
}
#media .control .dotstyle-fillup li:hover a:focus,
#media .control .dotstyle-fillup li a:focus {
background-color: rgba(255, 255, 255, 0.3);
backdrop-filter: blur(5px);
}
#media .control .dotstyle-fillup li a {
background-color: rgba(255, 255, 255, 0.3);
backdrop-filter: blur(5px);
}
/****************** MEDIA ENDE ******************/
/****************** SECTION CONTENT OVERVIEW START ******************/
.layout4 main:before,
.layout3 main:before {
top: 0;
}
.layout4 main .col0,
.layout3 main .col0 {
margin-top: 130px;
}
.slide-controls {
z-index: 1;
position: absolute;
max-width: 1920px;
top: 50%;
left: 50%;
transform: translateY(-50%) translateX(-50%);
display: flex;
justify-content: space-between;
align-items: center;
pointer-events: none;
width: 100%;
padding: 0 20px;
}
@media (min-width: 992px) {
.slide-controls {
width: calc(100vw - 200px);
padding: 0 5px;
}
}
.slide-controls .btn-next,
.slide-controls .btn-prev {
height: 50px;
width: 50px;
cursor: pointer;
border-radius: 50%;
display: flex;
justify-content: center;
align-items: center;
pointer-events: auto;
border: 1.5px solid #aca194;
background-color: rgba(255, 255, 255, 0.3);
backdrop-filter: blur(5px);
}
.slide-controls .btn-next::before,
.slide-controls .btn-prev::before {
display: block;
font-family: 'default';
font-weight: normal;
text-indent: 0;
font-style: normal;
color: #393939;
font-size: 20px;
margin: 0;
transition: margin 0.3s ease;
}
.slide-controls .btn-next:hover::before,
.slide-controls .btn-prev:hover::before {
opacity: 0.8;
}
.slide-controls .btn-next.invert,
.slide-controls .btn-prev.invert {
border: none;
}
.slide-controls .btn-next.invert::before,
.slide-controls .btn-prev.invert::before {
color: white;
}
.slide-controls .btn-next::before {
content: '\2c3';
}
.slide-controls .btn-prev::before {
content: '\2c2';
}
.slide-controls .btn-prev:hover::before {
margin-right: 6px;
}
.slide-controls .btn-next:hover::before {
margin-left: 6px;
}
.overviewStandard {
width: 100%;
display: flex;
flex-wrap: wrap;
justify-content: center;
}
@media (min-width: 992px) {
.overviewStandard {
width: calc(100vw - 200px);
max-width: 1920px;
}
}
.overviewStandard .overviewItem {
aspect-ratio: 2.5;
flex-basis: 100%;
}
@media (min-width: 992px) {
.overviewStandard .overviewItem {
flex-basis: 50%;
}
}
@media (min-width: 1302px) {
.overviewStandard .overviewItem {
flex-basis: 33.333%;
}
}
.overviewHome {
width: 100%;
display: flex;
flex-wrap: wrap;
justify-content: center;
}
@media (min-width: 992px) {
.overviewHome {
width: calc(100vw - 200px);
max-width: 1920px;
}
}
.overviewHome .overviewItem {
aspect-ratio: 2.5;
flex-basis: 100%;
}
@media (min-width: 992px) {
.overviewHome .overviewItem {
flex-basis: 50%;
}
}
@media (min-width: 1302px) {
.overviewHome .overviewItem {
flex-basis: 33.333%;
}
}
@media (min-width: 1302px) {
.overviewHome .overviewItem:first-of-type {
aspect-ratio: 2.5;
flex-basis: 66.666%;
}
}
@media only screen and (max-width: 1580px) {
.overviewPackages {
display: flex;
flex-direction: column-reverse;
gap: 20px;
}
.overviewPackages .slide-controls {
transform: none;
position: static;
justify-content: center;
width: 100%;
gap: 10px;
}
}
.overview {
position: relative;
left: 50%;
-webkit-transform: translateX(-50%);
-moz-transform: translateX(-50%);
-ms-transform: translateX(-50%);
-o-transform: translateX(-50%);
transform: translateX(-50%);
}
@media (max-width: 767px), (min-width: 768px) and (max-width: 991px) {
.overview {
padding-right: 15px;
padding-left: 15px;
}
}
.overview .overviewItem {
position: relative;
overflow: hidden;
padding: 5px;
aspect-ratio: 1.25;
}
.overview .overviewItem picture {
height: 100%;
width: 100%;
display: block;
}
.overview .overviewItem img {
-webkit-transform: scale(1);
-moz-transform: scale(1);
-ms-transform: scale(1);
-o-transform: scale(1);
transform: scale(1);
-webkit-transition: 0.55s ease;
-moz-transition: 0.55s ease;
-ms-transition: 0.55s ease;
-o-transition: 0.55s ease;
transition: 0.55s ease;
height: 100%;
width: 100%;
display: block;
object-fit: cover;
}
.overview .overviewItem:hover img {
-webkit-transform: scale(1.1);
-moz-transform: scale(1.1);
-ms-transform: scale(1.1);
-o-transform: scale(1.1);
transform: scale(1.1);
}
.overview .overviewItem figure {
margin: 0;
background: none;
overflow: hidden;
height: 100%;
width: 100%;
}
.overview .overviewItem figure > a {
position: absolute;
left: 5px;
bottom: 5px;
right: 5px;
top: 5px;
font-size: 0;
}
.overview .overviewItem .price {
position: absolute;
top: 30px;
right: 30px;
background-color: #db3d53;
padding: 10px 16px;
color: white;
pointer-events: none;
}
.overview .overviewItem .text {
position: absolute;
padding: 24px 30px;
left: 5px;
bottom: 5px;
right: 5px;
min-height: 40%;
display: flex;
flex-direction: column;
justify-content: end;
z-index: 1;
pointer-events: none;
gap: 0.5rem;
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#000000+0,000000+100&0+0,0.3+100 */
background: -moz-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.4) 100%);
/* FF3.6-15 */
background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.4) 100%);
/* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.4) 100%);
/* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
color: white;
}
.overview .overviewItem .text header {
margin-bottom: 0;
}
.overview .overviewItem .text header h2 {
color: white;
margin-bottom: 0.5rem;
}
.overview .overviewItem .text header p {
margin: 0;
color: white;
}
.overview .overviewItem .text .buttonWrap {
pointer-events: auto;
left: 20px;
bottom: 18px;
z-index: 5;
}
@media (min-width: 640px) {
.overview .overviewItem .text .buttonWrap {
left: auto;
right: 20px;
}
}
@media (min-width: 768px) {
.overview .overviewItem .text .buttonWrap {
bottom: 28px;
}
}
@media (min-width: 992px) {
.overview .overviewItem .text .buttonWrap {
right: auto;
left: 20px;
}
}
@media (min-width: 1302px) {
.overview .overviewItem .text .buttonWrap {
left: auto;
right: 20px;
}
}
.overview .overviewItem .text .buttonWrap a.button {
-webkit-box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.45);
-moz-box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.45);
box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.45);
padding: 0 20px;
margin: 0 2px;
width: auto;
}
.overview .overviewItem .persons {
color: white;
}
/****************** SECTION CONTENT OVERVIEW ENDE ******************/
/****************** SECTION CONTENT TEASER START ******************/
.overviewTeaser {
position: relative;
overflow: hidden;
}
.overviewTeaser .overviewItem:hover .icon {
background: rgba(87, 86, 86, 0.1);
}
.overviewTeaser .overviewItem a {
display: block;
margin: 0.125rem 0;
padding: 1.875rem 0.9375rem;
text-decoration: underline;
text-underline-offset: 0.3em;
text-align: center;
}
@media (min-width: 992px) {
.overviewTeaser .overviewItem a {
padding: 3rem;
margin: 0.125rem;
}
}
.overviewTeaser .overviewItem .icon {
background-color: #F3F3F3;
border-radius: 100%;
width: 140px;
height: 140px;
margin: 0 auto 30px;
position: relative;
-webkit-transition: 0.25s ease;
-moz-transition: 0.25s ease;
-ms-transition: 0.25s ease;
-o-transition: 0.25s ease;
transition: 0.25s ease;
}
.overviewTeaser .overviewItem .icon img {
width: auto;
height: auto;
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
-moz-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
-o-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}
/****************** SECTION CONTENT TEASER ENDE ******************/
/****************** GOWEST START ******************/
#gowest {
display: block;
height: 45px;
line-height: 3.5em;
background: #FFF;
font-size: 0.75rem;
text-align: right;
text-decoration: none;
color: #777777;
font-family: 'Segoe Ui', 'Droid Sans', Arial, sans-serif;
font-weight: normal;
}
@media (min-width: 992px) {
#gowest {
position: fixed;
left: 50%;
-webkit-transform: translateX(-50%);
-moz-transform: translateX(-50%);
-ms-transform: translateX(-50%);
-o-transform: translateX(-50%);
transform: translateX(-50%);
bottom: 0;
width: 100%;
}
}
#gowest.grey {
background: #EEEEEE;
}
#gowest.blue {
background: #324458;
color: #FFF;
}
#gowest.blue g path {
fill: #FFF;
}
#gowest span {
display: inline-block;
text-indent: 999em;
overflow: hidden;
width: 104px;
height: 20px;
margin-left: 3.438rem;
position: relative;
}
#gowest span svg {
width: 104px;
height: 20px;
display: block;
position: absolute;
left: 0;
top: 0;
text-indent: 0;
}
#gowestImpressum {
width: 200px;
}
#gowestImpressum svg {
width: 100%;
height: auto;
}
/****************** GOWEST ENDE ******************/
/****************** QUICKFORM START ******************/
#quickform {
width: 100px;
height: 100px;
position: absolute;
right: 0px;
top: 0px;
color: #FFF;
z-index: 60;
}
@media (min-width: 620px) {
#quickform {
width: 170px;
}
}
@media (min-width: 1302px) {
#quickform {
height: 90px;
width: 140px;
}
}
#quickform > span {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
cursor: pointer;
transition: 0.15s ease;
}
.open#quickform > span {
background: #575656;
}
#quickform > span i {
height: 20px;
left: 50%;
position: absolute;
top: 18px;
-webkit-transform: translateX(-50%);
-moz-transform: translateX(-50%);
-ms-transform: translateX(-50%);
-o-transform: translateX(-50%);
transform: translateX(-50%);
width: 20px;
color: #575656;
display: none;
}
.open#quickform > span i {
top: 50%;
width: 20px;
-webkit-transform: translate(-50%, -50%);
-moz-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
-o-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
display: block;
}
#quickform > span i:before {
color: #575656;
content: '\e90a';
font-family: 'default';
text-indent: 0;
font-size: 1.375rem;
width: 22px;
height: 22px;
line-height: 1.375em;
position: absolute;
top: 0;
left: 0;
font-style: normal;
font-weight: normal;
}
@media (min-width: 620px) {
#quickform > span i:before {
width: 30px;
height: 30px;
line-height: 30px;
}
}
@media (min-width: 1302px) {
#quickform > span i:before {
width: 22px;
height: 22px;
line-height: 1.375em;
}
}
.open#quickform > span i:before {
font-size: 1.25rem;
content: '\e90b';
color: #ffffff;
}
@media (min-width: 620px) {
.open#quickform > span i:before {
font-size: 1.75rem;
}
}
@media (min-width: 1302px) {
.open#quickform > span i:before {
font-size: 1.25rem;
}
}
#quickform > span span {
top: 50%;
font-size: 16px;
font-weight: 500;
left: 50%;
opacity: 1;
position: absolute;
-webkit-transform: translate(-50%, -50%);
-moz-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
-o-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
transition: all 0.25s ease 0s;
width: 100%;
text-align: center;
color: #ffffff;
height: 100%;
line-height: 100px;
background: #db3d53;
}
@media (min-width: 1302px) {
#quickform > span span {
padding: 0 20px;
width: calc(100% - 20px);
left: auto;
right: 20px;
-webkit-transform: translateY(-50%);
-moz-transform: translateY(-50%);
-ms-transform: translateY(-50%);
-o-transform: translateY(-50%);
transform: translateY(-50%);
height: 44px;
line-height: 44px;
}
}
.open#quickform > span span {
opacity: 0;
}
#quickform #quickform-form {
width: 100vw;
background: #db3d53;
height: 0;
padding: 0 1.25rem;
position: absolute;
right: 0px;
top: 100%;
transition: 0.15s ease;
overflow: hidden;
}
@media (min-width: 992px) {
#quickform #quickform-form {
width: 400px;
right: 0;
}
}
.open#quickform #quickform-form {
height: 380px;
padding: 35px 20px;
background: #575656;
}
#quickform #quickform-form > .label {
margin: 0 0.3125rem 2rem;
}
#quickform #quickform-form > .label label {
font-size: 2rem;
line-height: 1.2em;
font-weight: 300;
}
#quickform #quickform-form .input {
margin: 0 0.3125rem 0.5rem;
}
#quickform #quickform-form .submit {
margin: 0 0.3125rem 1.5rem;
}
#quickform #quickform-form .submit .button {
border: 0;
background: #ffffff;
color: #575656;
}
#quickform #quickform-form .submit.booking .button {
border: 0;
background: #db3d53;
color: #ffffff;
}
#quickform .isDateHtmlContainer {
background: rgba(255, 255, 255, 0.05);
text-align: center;
padding: 3.5rem 0.5rem 1.5rem;
cursor: pointer;
}
#quickform .isDateHtmlContainer span {
display: inline-block;
text-align: center;
line-height: 1.2em;
font-size: 1rem;
}
#quickform .isDateHtmlContainer span.day {
font-size: 3rem;
display: inline-block;
padding-right: 0.625rem;
}
#quickform .isDateHtmlContainer span.month {
text-transform: uppercase;
padding-top: 0;
}
#quickform .isDateHtmlContainer span.year {
padding-top: 0;
display: none;
}
#quickform .isDateHtmlContainer span.dayname {
display: none;
}
#quickform .input.date.hasDateHtmlContainer .label,
#quickform .input.date.hasDateHtmlContainer.hasValue .label {
position: absolute;
top: 0;
left: 0;
width: 100%;
font-size: 0.8125rem;
line-height: 1.5em;
text-align: center;
opacity: 1;
color: rgba(255, 255, 255, 0.75);
text-transform: uppercase;
}
#quickform .input.date.hasDateHtmlContainer .label label,
#quickform .input.date.hasDateHtmlContainer.hasValue .label label {
margin-left: -1.875rem;
padding-top: 1.5rem;
height: auto;
line-height: 2.5em;
letter-spacing: 0.0625rem;
}
#quickform .hotline {
position: relative;
height: auto;
line-height: normal;
right: auto;
width: calc(100% - 10px);
border-top: 1px solid rgba(255, 255, 255, 0.2);
overflow: hidden;
padding-top: 1.25rem;
font-size: 1.25rem;
display: block;
left: 0;
text-align: center;
}
#quickform .hotline a:before {
display: none;
}
#quickform .hotline span {
color: #ffffff;
font-weight: 400;
}
#quickform .hotline span.label:after {
top: 3px;
color: #ffffff;
}
#quickform .hotline a {
color: #ffffff;
font-weight: 400;
}
#ui-datepicker-div {
z-index: 151 !important;
}
/****************** QUICKFORM ENDE ******************/
/****************** HOTLINE START ******************/
.hotline {
position: absolute;
right: 140px;
height: 100%;
top: 0;
width: 40px;
}
@media (min-width: 620px) and (max-width: 1299px) {
.hotline {
right: 270px;
width: 100px;
}
.hotline a::before {
font-size: 28px !important;
}
}
@media (max-width: 1299px) {
.hotline {
border-left: 1px solid rgba(0, 0, 0, 0.07000000000000001);
}
.hotline a::before {
color: #575656;
font-size: 20px;
margin-top: 3px;
}
}
@media (min-width: 1299px) {
.hotline {
right: 230px;
width: auto;
}
}
.hotline a {
text-decoration: none;
height: 100%;
width: 100%;
display: flex;
gap: 10px;
align-items: center;
color: white;
transition: color 0.2s ease;
justify-content: center;
}
.hotline a:before {
content: '\2706';
font-family: 'default';
font-weight: normal;
text-indent: 0;
font-style: normal;
}
.hotline a span {
display: none;
}
@media (min-width: 1450px) {
.hotline a span {
display: block;
}
}
.specialHeader .hotline a {
color: #575656;
}
html[lang="en"] .hotline a:before {
background: url('../../../../../fileadmin/template/Resources/Public/img/fragen_en.png') 0 0 no-repeat;
}
/****************** HOTLINE ENDE ******************/
/****************** BREADCRUMB START ******************/
#breadcrumb {
display: none;
width: 100%;
margin: 0 0 1.5rem 0;
padding: 0;
}
#breadcrumb ul {
margin: 0;
padding: 0;
color: #444444;
}
#breadcrumb li {
margin: 0;
padding: 0;
color: #444444;
}
#breadcrumb li:first-of-type a:before {
font-family: 'default';
font-weight: normal;
text-indent: 0;
content: '\2302';
display: inline-block;
margin: 0 1rem;
font-style: normal;
font-size: 1rem;
color: #444444;
}
#breadcrumb li:last-of-type a:after {
display: none;
}
#breadcrumb * {
display: inline-block;
text-decoration: none;
font-style: italic;
color: #444444;
}
#breadcrumb a:after {
font-family: 'default';
font-weight: normal;
text-indent: 0;
content: '\2304';
display: inline-block;
margin: 0 1rem;
font-style: normal;
font-size: 0.75rem;
color: #444444;
-webkit-transform: rotate(-90deg);
-moz-transform: rotate(-90deg);
-ms-transform: rotate(-90deg);
-o-transform: rotate(-90deg);
transform: rotate(-90deg);
}
/****************** BREADCRUMB ENDE ******************/
.footerBefore {
position: relative;
overflow: hidden;
color: #ffffff;
padding: 80px 0 80px;
z-index: 60;
background-color: #575656;
}
@media (min-width: 992px) {
.footerBefore {
margin-bottom: 448px;
}
}
.footerBefore > div {
display: grid;
grid-template-columns: 1fr 1fr;
column-gap: 10px;
row-gap: 24px;
padding: 0 20px;
}
@media (min-width: 768px) {
.footerBefore > div {
grid-template-columns: 1fr 1fr 1fr 1fr;
padding: 0 5px;
}
}
.footerBefore > div > div {
flex-basis: 25%;
display: flex;
justify-content: center;
}
.footerBefore > div > div a {
display: flex;
flex-direction: column;
align-items: center;
gap: 24px;
color: white;
text-decoration: none;
}
.footerBefore > div > div a > div.icon {
width: 90px;
height: 90px;
border-radius: 50%;
border: 1px solid #aca194;
}
.footerBefore > div > div a > div.icon.booking {
background: url('../../../../../fileadmin/template/Resources/Public/img/footer/booking.svg') 50% 50% no-repeat;
}
.footerBefore > div > div a > div.icon.inquiry {
background: url('../../../../../fileadmin/template/Resources/Public/img/footer/inquiry.svg') 50% 50% no-repeat;
}
.footerBefore > div > div a > div.icon.newsletter {
background: url('../../../../../fileadmin/template/Resources/Public/img/footer/newsletter.svg') 50% 50% no-repeat;
}
.footerBefore > div > div a > div.icon.voucher {
background: url('../../../../../fileadmin/template/Resources/Public/img/footer/voucher.svg') 50% 50% no-repeat;
}
.footerBefore > div > div a span {
display: block;
text-align: center;
}
/****************** ADDRESS FOOTER 2 ENDE ******************/
/****************** FOOTER START ******************/
#footer {
color: #ffffff;
}
@media (min-width: 992px) {
#footer {
position: fixed;
left: 50%;
bottom: 125px;
-webkit-transform: translateX(-50%);
-moz-transform: translateX(-50%);
-ms-transform: translateX(-50%);
-o-transform: translateX(-50%);
transform: translateX(-50%);
width: 100%;
z-index: 0;
}
}
#footer > div {
display: flex;
gap: 30px;
align-items: center;
flex-direction: column;
}
@media (min-width: 992px) {
#footer > div {
display: grid;
grid-template-columns: 1fr 100px 1fr;
gap: 40px;
}
}
#footer > div > div {
display: flex;
gap: 30px;
align-items: center;
justify-content: space-between;
flex-direction: column;
}
@media (min-width: 992px) {
#footer > div > div {
flex-direction: row;
}
}
#footer > div > div .contact {
flex-basis: 50%;
}
@media (max-width: 767px), (min-width: 768px) and (max-width: 991px) {
#footer > div > div .contact {
text-align: center;
}
}
#footer > div > div .contact .tel,
#footer > div > div .contact .email {
padding-left: 30px;
position: relative;
color: #ffffff;
text-decoration: none;
display: inline-block;
width: auto;
-webkit-transition: 0.25s ease;
-moz-transition: 0.25s ease;
-ms-transition: 0.25s ease;
-o-transition: 0.25s ease;
transition: 0.25s ease;
}
#footer > div > div .contact .tel:hover,
#footer > div > div .contact .email:hover {
opacity: 0.75;
}
#footer > div > div .contact .tel:before,
#footer > div > div .contact .email:before {
font-family: 'default';
font-weight: normal;
text-indent: 0;
font-style: normal;
display: inline-block;
color: #ffffff;
padding-right: 0.625rem;
font-size: 1.25rem;
position: absolute;
top: 0px;
left: 0px;
line-height: 1.5rem;
}
#footer > div > div .contact .tel:before {
content: '\2706';
}
#footer > div > div .contact .email:before {
content: '\2709';
}
#footer > div > div .address {
flex-basis: 50%;
}
@media (max-width: 767px), (min-width: 768px) and (max-width: 991px) {
#footer > div > div .address {
text-align: center;
}
}
#footer > div > div #sitelinks {
flex-basis: 90%;
}
#footer > div > div .socialLinksWrapper {
flex-basis: 50px;
}
#footer > div > div .socialLinksWrapper .headline {
display: none;
}
#footer > div .brandFooter {
height: 100px;
width: 100%;
display: flex;
justify-content: center;
align-items: center;
position: static;
transform: none;
padding: 0;
}
/****************** FOOTER ENDE ******************/
/****************** SITELINKS START ******************/
#sitelinks ul {
margin: 0;
text-align: center;
padding: 0;
display: flex;
flex-wrap: wrap;
}
#sitelinks ul li {
position: relative;
display: block;
padding: 0;
line-height: 1.75rem;
width: 100%;
}
@media (min-width: 992px) {
#sitelinks ul li {
text-align: left;
}
}
@media (min-width: 1302px) {
#sitelinks ul li {
width: 50%;
}
}
#sitelinks ul li a {
color: #ffffff;
text-decoration: none;
font-weight: 400;
font-size: 1rem;
-webkit-transition: 0.25s ease;
-moz-transition: 0.25s ease;
-ms-transition: 0.25s ease;
-o-transition: 0.25s ease;
transition: 0.25s ease;
}
#sitelinks ul li a:hover {
opacity: 0.75;
}
/****************** SITELINKS ENDE ******************/
/****************** IMAGE ZOOM START ******************/
a.ajax span.image_zoom {
background: rgba(0, 0, 0, 0.25);
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
opacity: 1;
text-indent: -999em;
overflow: hidden;
text-decoration: none;
font-size: 0px;
opacity: 0;
transition: 0.25s ease;
}
a.ajax span.image_zoom:before {
font-family: 'default';
font-weight: normal;
font-style: normal;
content: '\1f50d';
width: 40px;
height: 40px;
position: absolute;
left: 50%;
top: 50%;
display: block;
color: #ffffff;
text-indent: 0;
text-align: center;
font-size: 2.5rem;
line-height: 100%;
-webkit-transform: translate(-50%, -50%);
-moz-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
-o-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}
a.ajax:hover span.image_zoom {
opacity: 1;
}
/****************** IMAGE ZOOM ENDE ******************/
/****************** SOCIALLINKS FOOTER 2 START ******************/
.socialLinksWrapper {
position: relative;
display: block;
overflow: hidden;
line-height: normal;
font-size: 0;
}
.socialLinksWrapper .headline {
font-size: 0.8125rem;
text-transform: uppercase;
display: block;
display: inline-block;
letter-spacing: 1px;
font-weight: 600;
}
#sociallinks2 label {
display: none;
}
#sociallinks2 ul {
margin: 0;
padding: 0;
display: flex;
align-items: end;
gap: 10px;
flex-direction: row;
}
@media (min-width: 992px) {
#sociallinks2 ul {
flex-direction: column;
}
}
#sociallinks2 a {
display: flex;
width: 48px;
height: 48px;
border-radius: 50%;
background-color: rgba(255, 255, 255, 0.2);
backdrop-filter: blur(5px);
justify-content: center;
align-items: center;
text-decoration: none;
transition: opacity 0.3s ease;
}
#sociallinks2 a::before {
font-family: 'default';
font-weight: normal;
text-indent: 0;
font-style: normal;
display: block;
font-size: 20px;
color: white;
}
#sociallinks2 a:hover {
opacity: 0.8;
}
#sociallinks2 a[href*="facebook"]:before {
content: '\e900';
}
#sociallinks2 a[href*="twitter"]:before {
content: '\e906';
}
#sociallinks2 a[href*="google"]:before {
content: '\e901';
font-size: 25px;
}
#sociallinks2 a[href*="instagram"]:before {
content: '\e908';
}
#sociallinks2 a[href*="pinterest"]:before {
content: '\e903';
}
#sociallinks2 a[href*="youtube"]:before {
content: '\e90c';
}
/****************** SOCIALLINKS FOOTER 2 ENDE ******************/
/****************** DOWNLOADS START ******************/
.ce-uploads {
margin: 0px 0px 50px 0px;
margin: 0rem 0rem 3.125rem 0rem;
list-style: none;
padding: 0;
overflow: hidden;
font-size: 0.8125rem;
font-weight: bold;
letter-spacing: 1px;
}
@media (min-width: 768px) {
.ce-uploads {
margin: 0px 0px 50px 0px;
margin: 0rem 0rem 3.125rem 0rem;
}
}
@media (min-width: 992px) {
.ce-uploads {
margin: 0px 0px 50px 0px;
margin: 0rem 0rem 3.125rem 0rem;
}
}
@media (min-width: 1302px) {
.ce-uploads {
margin: 0px 0px 80px 0px;
margin: 0rem 0rem 5rem 0rem;
}
}
.ce-uploads li {
margin: 0;
list-style: none;
position: relative;
display: block;
padding: 10px 0px;
line-height: 40px;
float: none;
clear: both;
overflow: hidden;
border-bottom: 1px solid #444444;
}
.ce-uploads li:before {
display: none;
}
.ce-uploads li a {
color: #575656;
text-decoration: none;
transition: color 0.25s ease;
position: relative;
display: block;
overflow: hidden;
}
.ce-uploads li a:before {
content: '\e925';
font-family: 'default';
font-weight: normal;
text-indent: 0;
font-style: normal;
color: #575656;
width: 34px;
height: 34px;
font-size: 34px;
line-height: 100%;
position: absolute;
top: 50%;
left: 0;
-webkit-transform: translateY(-50%);
-moz-transform: translateY(-50%);
-ms-transform: translateY(-50%);
-o-transform: translateY(-50%);
transform: translateY(-50%);
}
@media (max-width: 767px) {
.ce-uploads li a:before {
display: none;
}
}
.ce-uploads li a[type="application/pdf"]:before {
content: '\e922';
}
.ce-uploads li a[type="image/jpeg"]:before {
content: '\e921';
}
.ce-uploads li a[type="application/vnd.openxmlformats-officedocument.wordprocessingml.document"]:before {
content: '\e924';
}
.ce-uploads li a[type="application/vnd.ms-office"]:before {
content: '\e920';
}
.ce-uploads li a[type="application/zip"]:before {
content: '\e925';
}
.ce-uploads li:hover a {
color: #444444;
}
.ce-uploads .filename {
white-space: nowrap;
height: 40px;
overflow: hidden;
text-overflow: ellipsis;
padding-left: 3rem;
font-size: 1rem;
color: #444444;
font-weight: normal;
text-transform: none;
}
@media (max-width: 767px) {
.ce-uploads .filename {
padding-left: 0px;
}
}
.ce-uploads .filename span {
width: 32px;
height: 40px;
line-height: 40px;
display: block;
position: absolute;
left: 0;
top: 0;
}
@media (max-width: 767px) {
.ce-uploads .filename span {
display: none;
}
}
.ce-uploads .filedownload span {
width: 40px;
height: 40px;
line-height: 40px;
text-align: center;
display: block;
float: right;
position: relative;
font-size: 24px;
font-family: 'default';
font-weight: normal;
text-indent: 0;
font-style: normal;
}
.ce-uploads .filesize {
text-align: center;
}
@media (max-width: 767px) {
.ce-uploads .filesize {
display: none;
}
}
.ce-uploads .filetype {
text-align: center;
color: #444444;
font-weight: 300;
font-size: 1rem;
}
.ce-uploads .head * {
color: #575656;
font-size: 0.875rem;
letter-spacing: 1px;
font-weight: bold;
padding-left: 0px;
}
.ce-uploads .filedescription {
letter-spacing: 0px;
color: #999;
text-transform: none;
font-weight: normal;
line-height: 1.5em;
margin-top: -5px;
padding-left: 3rem;
}
@media (max-width: 767px) {
.ce-uploads .filedescription {
padding-left: 0px;
}
}
/****************** DOWNLOADS ENDE ******************/
/****************** FOLDABLE / ACCORDION START ******************/
.foldable,
.accordion {
margin-bottom: 1.5rem;
}
.foldable > .slideContainer,
.accordion > .slideContainer {
border-bottom: 1px solid #aca194;
}
.foldable .slideHeader,
.accordion .slideHeader {
margin: 0;
padding: 0;
}
.foldable .slideHeader h2,
.accordion .slideHeader h2 {
cursor: pointer;
padding-right: 3.125rem;
padding: 1.25rem 0 1.25rem 4rem;
position: relative;
margin: 0;
color: #aca194;
font-size: 20px;
text-transform: none;
}
.foldable .slideHeader h2:before,
.accordion .slideHeader h2:before {
content: '\2b';
font-family: 'default';
font-weight: normal;
text-indent: 0;
font-style: normal;
position: absolute;
top: 50%;
left: 20px;
width: 25px;
height: 25px;
font-size: 1rem;
color: #aca194;
-ms-transition: all 0.25s ease-out;
-moz-transition: all 0.25s ease-out;
-webkit-transition: all 0.25s ease-out;
transition: all 0.25s ease-out;
-webkit-transform: translateY(-50%);
-moz-transform: translateY(-50%);
-ms-transform: translateY(-50%);
-o-transform: translateY(-50%);
transform: translateY(-50%);
transform-origin: center center;
text-align: center;
line-height: 25px;
}
.foldable .slideHeader.act h2:before,
.accordion .slideHeader.act h2:before {
color: #db3d53;
-webkit-transform: translateY(-50%) rotate(-45deg);
-moz-transform: translateY(-50%) rotate(-45deg);
-ms-transform: translateY(-50%) rotate(-45deg);
-o-transform: translateY(-50%) rotate(-45deg);
transform: translateY(-50%) rotate(-45deg);
}
.foldable .canvas,
.accordion .canvas {
padding: 0 0 0 0rem;
}
@media (min-width: 768px) {
.foldable .canvas,
.accordion .canvas {
padding: 0 0 0 4rem;
}
}
.foldable .gridelement,
.accordion .gridelement {
margin-left: 20px;
margin-right: 20px;
}
.foldable .gridelement .canvas,
.accordion .gridelement .canvas {
width: calc(100% + (2 * 20px));
position: relative;
left: -20px;
}
/****************** FOLDABLE / ACCORDION ENDE ******************/
/****************** FULLWIDTH BACKGROUND START ******************/
.fullwidth-background {
margin-bottom: 1.5rem;
position: relative;
left: 50%;
width: 100vw;
-webkit-transform: translateX(-50%);
-moz-transform: translateX(-50%);
-ms-transform: translateX(-50%);
-o-transform: translateX(-50%);
transform: translateX(-50%);
}
.fullwidth-background.overlay:before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
display: block;
overflow: hidden;
background: rgba(0, 0, 0, 0.2);
z-index: 1;
}
.gridelement .fullwidth-background {
position: absolute;
height: 100%;
left: 50%;
top: 0%;
z-index: 0;
overflow: hidden;
}
@media (min-width: 992px) {
.fullwidth-background {
width: calc(100vw - 0px);
min-width: 100%;
}
}
.fullwidth-background .overlay:before {
content: '';
width: 100%;
height: 100%;
position: absolute;
left: 0;
top: 0;
background: #575656;
opacity: 0.5;
z-index: 5;
pointer-events: none;
}
.fullwidth-background img {
display: block;
-webkit-transform: scale(1);
-moz-transform: scale(1);
-ms-transform: scale(1);
-o-transform: scale(1);
transform: scale(1);
-webkit-transition: 0.55s ease;
-moz-transition: 0.55s ease;
-ms-transition: 0.55s ease;
-o-transition: 0.55s ease;
transition: 0.55s ease;
}
.with-fullwidth-background:hover img {
-webkit-transform: scale(1.1);
-moz-transform: scale(1.1);
-ms-transform: scale(1.1);
-o-transform: scale(1.1);
transform: scale(1.1);
}
.with-fullwidth-background {
padding-top: 3rem;
padding-bottom: 3rem;
margin-bottom: 1.5rem;
position: relative;
}
.with-fullwidth-background > div.col-md-12 {
padding: 90px 0 40px;
text-align: center;
color: #ffffff;
}
.with-fullwidth-background > div.col-md-12 .subtitle {
color: #ffffff;
}
.with-fullwidth-background > div.col-md-12:before {
color: #ffffff;
}
.with-fullwidth-background > div.col-md-12 h2 {
color: #ffffff;
line-height: 1.2em;
margin-bottom: 3rem;
text-transform: none;
}
@media (min-width: 768px) {
.with-fullwidth-background > div.col-md-12 h2 {
font-size: 3.125rem;
}
}
.with-fullwidth-background > div.col-md-12 p {
margin: 0;
}
.with-fullwidth-background > div.col-md-12 a.button {
background: none;
border: 1px solid #ffffff;
-webkit-transition: 0.25s ease;
-moz-transition: 0.25s ease;
-ms-transition: 0.25s ease;
-o-transition: 0.25s ease;
transition: 0.25s ease;
}
.with-fullwidth-background > div.col-md-12 a.button:hover {
background: #575656;
opacity: 1;
}
/****************** FULLWIDTH BACKGROUND ENDE ******************/
/****************** SEARCHBUTTON START ******************/
.searchbutton {
position: absolute;
top: 0;
right: 160px;
width: 80px;
height: 100px;
cursor: pointer;
color: #ffffff;
font-size: 0.6875rem;
text-align: center;
text-transform: uppercase;
padding-top: 2.188rem;
z-index: 1;
border-left: 1px solid rgba(0, 0, 0, 0.07000000000000001);
}
.searchbutton.open {
background: #575656;
}
.searchbutton.open a span {
opacity: 0;
}
.searchbutton.open a i {
top: 50%;
-webkit-transform: translate(-50%, -50%);
-moz-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
-o-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}
.searchbutton.open a i:before {
font-size: 1.25rem;
content: '\e90b';
color: #ffffff;
}
.searchbutton a {
width: 100%;
height: 100%;
display: block;
z-index: 10;
position: absolute;
top: 0;
left: 0;
text-decoration: none;
font-size: 0.8125rem;
}
.searchbutton a span {
position: absolute;
left: 50%;
bottom: 18px;
line-height: 1.5em;
width: 90%;
-webkit-transform: translateX(-50%);
-moz-transform: translateX(-50%);
-ms-transform: translateX(-50%);
-o-transform: translateX(-50%);
transform: translateX(-50%);
opacity: 1;
transition: 0.25s ease;
font-size: 0.8125rem;
text-transform: uppercase;
color: #575656;
}
.searchbutton a i {
width: 20px;
height: 20px;
position: absolute;
left: 50%;
top: 18px;
-webkit-transform: translateX(-50%);
-moz-transform: translateX(-50%);
-ms-transform: translateX(-50%);
-o-transform: translateX(-50%);
transform: translateX(-50%);
}
.searchbutton a i:before {
font-family: 'default';
font-weight: normal;
text-indent: 0;
font-style: normal;
content: '\1f50d';
color: #575656;
width: 20px;
height: 20px;
font-size: 1.25rem;
line-height: 1.25em;
position: absolute;
top: 0;
left: 0;
}
/****************** SEARCHBUTTON ENDE ******************/
/************** SEARCH OVERLAY START ***************/
#search {
position: fixed;
width: 100%;
height: 100vh;
background: #f8f8f8;
z-index: 2000;
visibility: hidden;
-webkit-transition: opacity .35s ease, visibility 0s ease 0.35s;
-moz-transition: opacity .35s ease, visibility 0s ease 0.35s;
-ms-transition: opacity .35s ease, visibility 0s ease 0.35s;
-o-transition: opacity .35s ease, visibility 0s ease 0.35s;
transition: opacity .35s ease, visibility 0s ease 0.35s;
opacity: 0;
left: 0;
top: 100px;
}
@media (max-width: 991px) {
#search {
display: none;
}
}
#search.act {
opacity: 1;
visibility: visible;
-webkit-transition: opacity .35s ease, visibility 0s ease 0s;
-moz-transition: opacity .35s ease, visibility 0s ease 0s;
-ms-transition: opacity .35s ease, visibility 0s ease 0s;
-o-transition: opacity .35s ease, visibility 0s ease 0s;
transition: opacity .35s ease, visibility 0s ease 0s;
}
#quick_search {
width: 80%;
position: absolute;
left: 50%;
top: 30%;
-webkit-transform: translateX(-50%);
-moz-transform: translateX(-50%);
-ms-transform: translateX(-50%);
-o-transform: translateX(-50%);
transform: translateX(-50%);
}
#quick_search #q {
width: calc(100% - 140px);
height: 60px;
background: #FFF;
padding: 0;
border: none;
line-height: 100%;
font-size: 2rem;
color: #444444;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
margin: 0;
border-bottom: 5px solid #575656;
background: none;
float: left;
display: block;
-webkit-appearance: none;
}
#quick_search #q::-moz-placeholder {
color: #444444;
opacity: 1;
}
#quick_search #q::-webkit-input-placeholder {
color: #444444;
opacity: 1;
}
#quick_search #q:-ms-input-placeholder {
color: #444444;
opacity: 1;
}
#quick_search .button {
width: 60px;
height: 60px;
text-indent: -999em;
overflow: hidden;
position: relative;
border: none;
margin: 0;
min-width: auto;
float: left;
display: block;
margin-left: 0.3125rem;
background: #575656;
}
#quick_search .button:before {
font-family: 'default';
font-weight: normal;
text-indent: 0;
font-style: normal;
content: '\1f50d';
width: 20px;
height: 20px;
line-height: 1.25em;
text-indent: 0px;
text-align: center;
color: #ffffff;
font-size: 1.25rem;
position: absolute;
left: 50%;
top: 50%;
-webkit-transform: translate(-50%, -50%);
-moz-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
-o-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}
/************** SEARCH OVERLAY ENDE ***************/
/****************** SEARCH PAGE START ******************/
.tx-custom-search {
position: relative;
}
.tx-custom-search form {
margin-bottom: 2.5rem;
width: calc(100% + 2 * 20px);
position: relative;
left: -20px;
}
.tx-custom-search .section {
margin-left: 0px;
margin-right: 0px;
border-bottom: 1px solid #ccc;
margin-bottom: 1.5rem;
}
.tx-custom-search ul.f3-widget-paginator li {
display: inline-block;
margin: 0.625rem;
padding: 0;
}
.tx-custom-search ul.f3-widget-paginator li:before {
content: none;
background: none;
border-radius: 0;
}
.tx-custom-search ul.f3-widget-paginator li a {
color: #444444;
}
@media (min-width: 768px) {
main .tx-custom-search .input {
float: left;
width: calc(50% - 20px);
}
main .tx-custom-search .submit {
float: left;
width: calc(50% - 20px);
}
}
/****************** SEARCH PAGE ENDE ******************/
/****************** GOOGLE MAPS START ******************/
.tx-go-maps-ext {
margin-bottom: 1.5rem;
}
.tx-go-maps-ext form {
position: relative;
margin-bottom: 1.5rem;
}
@media (min-width: 768px) {
.tx-go-maps-ext form {
width: calc(100% + 20px);
left: -10px;
}
}
.js-gme-saddress {
width: calc(100% - 20px);
position: relative;
border: 1px solid #E1E6E8;
padding: 0 0.625rem;
background: #F9FAFB;
font-size: 1em;
height: 44px;
line-height: 2.75em;
color: #9FABB3;
color: #000;
margin: 0 10px 10px;
}
@media (min-width: 768px) {
.js-gme-saddress {
margin: 0px 10px;
}
}
.js-gme-submit {
background: #575656;
border: medium none;
color: #fff;
display: block;
font-size: 0.875rem;
font-weight: 400;
height: 44px;
line-height: 2.75em;
margin: 0;
padding: 0;
text-align: center;
text-decoration: none;
text-transform: uppercase;
width: calc(100% - 20px);
position: relative;
margin: 0 0.625rem;
}
.gm-style .gm-style-iw {
line-height: normal;
}
/****************** GOOGLE MAPS ENDE ******************/
/****************** LANG START ******************/
#lang {
width: 40px;
height: 100px;
display: block;
position: absolute;
right: 100px;
top: 0px;
z-index: 60;
border-left: 1px solid rgba(0, 0, 0, 0.07000000000000001);
overflow: hidden;
}
@media (min-width: 620px) {
#lang {
width: 100px;
right: 170px;
}
}
@media (min-width: 1302px) {
#lang {
right: 140px;
}
}
@media (min-width: 768px) {
#lang {
height: 100px;
}
}
@media (min-width: 1302px) {
#lang {
border: 0;
height: 90px;
}
}
#lang .dropdown {
position: absolute;
right: 0;
top: 100%;
min-width: 175px;
padding: 0.625rem;
opacity: 0;
transition: 0.25s ease;
}
#lang ul {
padding: 0;
margin: 0;
overflow: auto;
}
#lang ul li * {
font-weight: 600;
color: #FFF;
text-decoration: none;
padding-left: 1.563rem;
padding-right: 1.25rem;
display: block;
line-height: 2em;
white-space: nowrap;
font-size: 1rem;
}
#lang ul li.cur * {
color: #aca194;
}
#lang > span {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
display: block;
cursor: pointer;
color: #575656;
text-align: center;
transition: background 0.25s ease;
}
@media (min-width: 992px) {
#lang > span {
color: #FFF;
}
}
#lang > span span {
position: absolute;
left: 50%;
bottom: 18px;
line-height: 1.5em;
width: 90%;
-webkit-transform: translateX(-50%);
-moz-transform: translateX(-50%);
-ms-transform: translateX(-50%);
-o-transform: translateX(-50%);
transform: translateX(-50%);
opacity: 1;
transition: 0.25s ease;
font-size: 0.8125rem;
text-transform: uppercase;
color: #ffffff;
display: none;
}
#lang > span i {
width: 20px;
height: 20px;
position: absolute;
left: 50%;
top: 50%;
-webkit-transform: translate(-50%, -50%);
-moz-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
-o-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
color: #ffffff;
}
@media (min-width: 620px) {
#lang > span i {
width: 30px;
height: 30px;
}
}
@media (min-width: 1302px) {
#lang > span i {
width: 20px;
height: 25px;
}
}
#lang > span i:before {
font-family: 'default';
font-weight: normal;
text-indent: 0;
font-style: normal;
color: #575656;
content: '\1f30e';
font-size: 1.25rem;
width: 20px;
height: 20px;
line-height: 1.25em;
position: absolute;
top: 0px;
left: 0;
}
@media (min-width: 620px) {
#lang > span i:before {
font-size: 1.75rem;
}
}
@media (min-width: 1302px) {
#lang > span i:before {
color: #FFF;
font-size: 1.25rem;
}
}
#lang.open {
overflow: visible;
}
#lang.open .dropdown {
opacity: 1;
background: #575656;
}
#lang.open > span {
background: #575656;
}
#lang.open > span span {
opacity: 0;
color: #ffffff;
}
#lang.open > span i {
top: 50%;
-webkit-transform: translate(-50%, -50%);
-moz-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
-o-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}
#lang.open > span i:before {
content: '\e90b';
color: #ffffff;
}
.specialHeader #lang span i {
color: #575656;
}
.specialHeader #lang span i:before {
color: #575656;
}
.specialHeader #lang.open > span i:before {
color: #ffffff;
}
@media (min-width: 1299px) {
.specialHeader #menu > div > ul > li > a {
color: #575656;
}
}
/****************** LANG ENDE ******************/
/****************** COOKIE START ******************/
#tx_tracking {
background: rgba(0, 0, 0, 0.5);
height: auto;
min-height: 60px;
padding: 0;
line-height: 1.5rem;
text-align: left;
pointer-events: none;
}
#tx_tracking section.notice {
padding: 10px 0px;
margin: 0 10px;
text-align: center;
}
#tx_tracking .button {
background: #aca194;
color: #FFF;
height: 20px;
width: 70px;
line-height: 20px;
margin: 0;
padding: 0;
display: inline-block;
margin: 10px 0 0 10px;
border: 0;
font-size: 14px;
pointer-events: auto;
}
.c-accept {
background: #db3d53 !important;
}
.c-link {
color: #db3d53 !important;
}
/****************** COOKIE ENDE ******************/
/****************** PARTNER START ******************/
@media (min-width: 992px) {
#partner {
position: fixed;
left: 0;
bottom: 45px;
width: 100%;
}
}
#partner ul {
padding: 30px 0;
text-align: center;
margin: 0;
position: relative;
border-bottom: 1px solid #999999;
background: #ffffff;
}
@media (min-width: 992px) {
#partner ul {
padding: 0;
}
}
#partner ul li {
display: inline-block;
margin: 0.625rem 0.5rem 0 0.5rem;
}
#partner ul li img {
display: block;
-webkit-filter: grayscale(100%);
filter: grayscale(100%);
opacity: 1;
transition: 0.35s ease;
}
#partner ul li:hover img {
display: block;
-webkit-filter: none;
filter: none;
opacity: 0.75;
}
/****************** PARTNER ENDE ******************/
/****************** BEWERTUNGEN START ******************/
.elementWrapper {
width: 300px;
margin: 0 auto;
text-align: center;
}
@media (min-width: 768px) {
.elementWrapper {
text-align: left;
width: auto;
padding-top: 25px;
}
}
@media (min-width: 992px) {
.elementWrapper {
padding-top: 0;
}
}
@media (min-width: 992px) {
.elementWrapper {
text-align: right;
}
}
#bewertungen ul {
display: flex;
row-gap: 20px;
column-gap: 20px;
justify-content: center;
align-items: center;
margin: 0;
padding: 10px 20px;
flex-wrap: wrap;
}
@media (min-width: 992px) {
#bewertungen ul {
column-gap: 40px;
}
}
#bewertungen ul li {
display: inline-block;
}
#bewertungen ul li img {
display: block;
-webkit-filter: grayscale(100%);
filter: grayscale(100%);
opacity: 1;
transition: 0.35s ease;
max-height: 32px;
max-width: 180px;
}
#bewertungen ul li:hover img {
display: block;
-webkit-filter: none;
filter: none;
opacity: 0.75;
}
/****************** BEWERTUNGEN ENDE ******************/
/****************** DCE HTML5 VIDEO START ******************/
video[poster] {
object-fit: cover;
}
.dce-video video {
width: 100%;
height: auto;
}
/****************** DCE HTML5 VIDEO ENDE ******************/
/****************** DCE IMAGE-TEXT START ******************/
.dce-imgText {
left: 50%;
transform: translateX(-50%);
display: flex;
flex-direction: column;
grid-template-columns: repeat(12, 1fr);
gap: 30px;
padding: 0 20px;
}
@media (min-width: 992px) {
.dce-imgText {
display: grid;
gap: 10px;
padding: 0;
}
}
.dce-imgText .itemImg {
position: relative;
}
@media (max-width: 767px), (min-width: 768px) and (max-width: 991px) {
.dce-imgText .itemImg {
aspect-ratio: 1.25;
order: 1;
}
}
.dce-imgText .itemImg picture {
display: block;
width: 100%;
height: 100%;
position: absolute;
}
@media (min-width: 992px) {
.dce-imgText .itemImg picture {
width: 50vw;
top: 0;
}
}
.dce-imgText .itemImg picture img {
width: 100%;
height: 100%;
object-fit: cover;
display: block;
}
.dce-imgText .itemImg.left {
grid-column: 1 / span 6;
}
.dce-imgText .itemImg.left picture {
right: 0;
}
.dce-imgText .itemImg.right {
grid-column: 7 / span 6;
}
.dce-imgText .itemImg.right picture {
left: 0;
}
.dce-imgText .itemText {
display: flex;
flex-direction: column;
justify-content: center;
}
@media (min-width: 992px) {
.dce-imgText .itemText {
padding: 3.5rem 0;
}
}
.dce-imgText .itemText h3 {
width: 80%;
}
.dce-imgText .itemText p:last-of-type {
margin-bottom: 0;
}
.dce-imgText .itemText.left {
grid-column: 1 / span 5;
}
.dce-imgText .itemText.right {
grid-column: 8 / span 5;
}
/****************** DCE IMAGE-TEXT ENDE ******************/
/****************** IMAGEGALLERY START ******************/
.imgGroup .ce-textpic .ce-gallery[data-ce-columns] .ce-column {
margin: 0;
padding: 0 0.0625rem;
}
.imgGroup div.ce-textpic .ce-gallery figure,
.imgGroup div.ce-textpic figure.ce-gallery,
.imgGroup div.ce-textpic .ce-gallery .ce-media {
margin: 0 0 2px;
}
.imgGroup.width {
position: relative;
left: 50%;
-webkit-transform: translateX(-50%);
-moz-transform: translateX(-50%);
-ms-transform: translateX(-50%);
-o-transform: translateX(-50%);
transform: translateX(-50%);
}
/****************** IMAGEGALLERY ENDE ******************/
/****************** NORMALER CONTENT START ******************/
/****************** NORMALER CONTENT ENDE ******************/
/****************** LAZY LOADING IMAGES START ******************/
html.js .ce-textpic .image {
opacity: 0;
transition: 0.25s ease 0.5s;
}
html.js .ce-textpic .image.isInViewport {
opacity: 1;
}
/****************** LAZY LOADING IMAGES ENDE ******************/
/****************** GOOGLE TRANSLATE START ******************/
.skiptranslate + div #header {
top: 39px;
}
/****************** GOOGLE TRANSLATE ENDE ******************/
/****************** SPEISEKARTE START ******************/
.speisekarte {
position: relative;
background: #ffffff;
padding: 1.25rem;
margin-bottom: 32px;
margin-bottom: 2rem;
}
@media (min-width: 992px) {
.speisekarte {
margin-bottom: 0;
}
}
.speisekarte .speisekarteInner {
border: 1px solid #ddd;
display: block;
position: relative;
padding: 1.875rem;
}
.speisekarte .item {
position: relative;
clear: both;
float: none;
background-image: linear-gradient(to right, #999999 20%, rgba(255, 255, 255, 0) 0%);
background-position: bottom;
background-size: 0.625rem 0.125rem;
background-repeat: repeat-x;
margin-bottom: 2rem;
padding-bottom: 1rem;
}
@media (min-width: 1302px) {
.speisekarte .item {
min-height: 5rem;
}
}
.speisekarte header.title {
margin: 0 0 2rem;
padding: 0;
font-size: 24px;
font-size: 1.5rem;
line-height: 1.2em;
color: #aca194;
font-family: 'Noto Serif', serif;
font-weight: 400;
text-align: center;
text-transform: none;
display: block !important;
}
@media (min-width: 992px) {
.speisekarte header.title {
font-size: 2.5rem;
}
}
.speisekarte .item:last-of-type {
background-image: none;
}
.speisekarte .description {
text-align: center;
}
@media (min-width: 1302px) {
.speisekarte .description {
text-align: left;
float: left;
width: 70%;
}
}
.speisekarte .name {
color: #575656;
text-transform: uppercase;
font-size: 1.125rem;
font-weight: 400;
display: block;
}
@media (min-width: 1302px) {
.speisekarte .name {
padding-right: 0.9375rem;
}
}
.speisekarte .price {
text-align: center;
font-size: 1.875rem;
font-family: 'Noto Serif', serif;
font-weight: 400;
color: #aca194;
}
@media (min-width: 1302px) {
.speisekarte .price {
text-align: right;
float: right;
width: 30%;
}
}
@media (max-width: 767px), (min-width: 768px) and (max-width: 991px) {
.speisekarte > header {
display: none;
}
}
/****************** SPEISEKARTE ENDE ******************/
/****************** IMPRESSUM START ******************/
.impressum .realization-row {
left: 50%;
-webkit-transform: translate(-50%, 0);
-moz-transform: translate(-50%, 0);
-ms-transform: translate(-50%, 0);
-o-transform: translate(-50%, 0);
transform: translate(-50%, 0);
background-color: #eaeaea;
padding: 0 20px 20px;
}
@media (min-width: 768px) {
.impressum .realization-row {
padding: 0px;
}
}
.impressum .realization-row .realization-logo {
background-color: #EEEEEE;
position: relative;
}
@media (max-width: 767px) {
.impressum .realization-row .realization-logo {
margin: 0 -20px 20px;
width: calc(100% + 40px);
height: 250px;
}
}
.impressum .realization-row .realization-logo img {
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
-moz-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
-o-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}
.impressum .realization-row .realization-logo .gowest-logo {
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
-moz-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
-o-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
margin: 0;
height: auto;
width: 190px;
}
.impressum .realization-row .realization-content {
padding: 70px 20px;
}
@media (min-width: 992px) {
.impressum .realization-row .realization-content {
padding: 70px 60px;
}
}
.impressum .realization-row .realization-content ul {
margin: 0;
}
.impressum .realization-row .realization-address {
padding-bottom: 10px;
}
.impressum .impressum-content .bank > span {
font-weight: bold;
}
.impressum .consumers-link {
margin-bottom: 20px;
}
.impressum .row {
margin-bottom: 35px;
}
.impressum .row h2 {
margin-bottom: 0;
}
.impressum .values {
padding-bottom: 15px;
}
@media (min-width: 768px) {
.impressum .values {
padding: 0px;
}
}
.impressum .company {
padding-bottom: 15px;
}
@media (min-width: 768px) {
.impressum .company {
padding: 0px;
}
}
/****************** IMPRESSUM ENDE ******************/
/****************SOCIAL MEDIA STREAM START**************/
.tx_feedfetcher {
overflow: hidden;
left: 50%;
-webkit-transform: translateX(-50%);
-moz-transform: translateX(-50%);
-ms-transform: translateX(-50%);
-o-transform: translateX(-50%);
transform: translateX(-50%);
}
.tx_feedfetcher .feedElement {
height: 350px;
margin: 1.5px;
}
@media (min-width: 768px) {
.tx_feedfetcher .feedElement {
width: calc(50% - 3px);
float: left;
}
}
@media (min-width: 992px) {
.tx_feedfetcher .feedElement {
width: calc(33.33% - 3px);
}
}
.tx_feedfetcher .feedElement .feedImage {
position: absolute;
top: 0;
left: 0;
height: 100%;
width: 100%;
}
.tx_feedfetcher .feedElement .feedImage:before {
content: ' ';
height: 80px;
width: 100%;
display: block;
position: absolute;
background: -moz-linear-gradient(top, rgba(0, 0, 0, 0.4) 0%, rgba(0, 0, 0, 0) 100%);
/* FF3.6-15 */
background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.4) 0%, rgba(0, 0, 0, 0) 100%);
/* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, rgba(0, 0, 0, 0.4) 0%, rgba(0, 0, 0, 0) 100%);
/* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#66000000', endColorstr='#00000000', GradientType=0);
/* IE6-9 */
}
.tx_feedfetcher .feedElement .feedImage .text {
display: none;
}
.tx_feedfetcher .feedElement .feedImage img {
height: 100%;
width: 100%;
display: block;
object-fit: cover;
}
.tx_feedfetcher .feedElement .textbox {
height: 100%;
width: 100%;
background: #aca194;
}
.tx_feedfetcher .feedElement .textbox .text {
color: #575656;
position: absolute;
top: 50%;
-webkit-transform: translateY(-50%);
-moz-transform: translateY(-50%);
-ms-transform: translateY(-50%);
-o-transform: translateY(-50%);
transform: translateY(-50%);
left: 20px;
display: block;
width: calc(100% - 40px);
}
.tx_feedfetcher .feedElement .textbox .text h4 {
color: #575656;
}
.tx_feedfetcher .feedElement .description {
position: absolute;
height: 60px;
top: 10px;
line-height: 16.8px;
line-height: 1.05rem;
right: 85px;
text-align: right;
padding: 10px;
font-size: 14px;
font-size: 0.875rem;
color: #FFF;
z-index: 20;
}
.tx_feedfetcher .feedElement .description .author {
font-weight: bold;
display: block;
}
.tx_feedfetcher .feedElement .description.noimg {
color: #575656;
}
.tx_feedfetcher .feedElement a {
height: 100%;
width: 100%;
display: block;
position: absolute;
z-index: 100;
}
.tx_feedfetcher .feedElement .source {
overflow: hidden;
position: absolute;
top: 10px;
right: 10px;
height: 60px;
width: 60px;
background: #575656;
text-indent: -9999em;
z-index: 20;
display: block;
}
.tx_feedfetcher .feedElement .source:before {
font-family: 'default';
font-weight: normal;
font-style: normal;
display: block;
width: 20px;
height: 20px;
position: absolute;
color: #FFF;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
-moz-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
-o-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
text-indent: 0;
line-height: 20px;
z-index: 30;
}
.tx_feedfetcher .feedElement.facebook .source:before {
content: '\e900';
}
.tx_feedfetcher .feedElement.twitter .source:before {
background: red;
content: '\e906';
}
.tx_feedfetcher .feedElement.instagram .source:before {
background: red;
content: '\e908';
}
.tx_feedfetcher .feedElement.youtube .source:before {
background: red;
content: '\e90c';
}
.tx_feedfetcher .feedElement.google .source:before {
background: red;
content: '\e901';
}
/****************SOCIAL MEDIA STREAM ENDE**************/
/****************CONTENTSEITE START**************/
main:before {
content: '';
width: 100%;
height: 100%;
position: absolute;
left: 0;
top: 0px;
background-color: white;
}
@media (min-width: 992px) {
main:before {
top: 176px;
}
}
@media (min-width: 992px) {
.layout2 main {
pointer-events: none;
}
}
@media (min-width: 992px) {
.layout2 main > .width {
margin-top: -200px;
z-index: 1;
pointer-events: auto;
}
.layout2 main > .width:before {
content: '';
display: block;
overflow: hidden;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 177px;
background: #ffffff;
z-index: 0;
}
}
@media (min-width: 1302px) {
.layout2 main > .width {
width: 1010px;
}
}
.layout2 main > .width .col0 {
padding-top: 50px;
}
/****************CONTENTSEITE ENDE**************/
.home .impressionenStart {
margin-bottom: 100px;
}
@media (min-width: 992px) {
.home .impressionenStart {
margin-top: -120px;
}
}
.impressionenStart {
position: relative;
left: 50%;
-webkit-transform: translateX(-50%);
-moz-transform: translateX(-50%);
-ms-transform: translateX(-50%);
-o-transform: translateX(-50%);
transform: translateX(-50%);
}
.impressionenStart figure {
overflow: hidden;
}
@media (min-width: 768px) {
.impressionenStart .right {
margin-top: 130px;
}
}
@media (min-width: 992px) {
.impressionenStart .right {
margin-top: 180px;
}
}
@media (min-width: 1302px) {
.impressionenStart .right {
margin-top: 230px;
}
}
.impressionenStart .row.hidden {
display: none !important;
}
@media (min-width: 768px) {
.impressionenStart section {
margin: 5px;
}
.impressionenStart figure {
margin-bottom: 1px !important;
}
}
@media (max-width: 767px) {
.impressionenStart .buttonWrap {
text-align: center;
}
}
.impressionenStart .impressionenbutton {
cursor: pointer;
background: none;
color: #575656;
position: relative;
padding: 0;
height: 26px;
line-height: 26px;
padding-left: 30px;
-webkit-transition: 0.25s ease;
-moz-transition: 0.25s ease;
-ms-transition: 0.25s ease;
-o-transition: 0.25s ease;
transition: 0.25s ease;
font-weight: 600;
width: auto;
margin-bottom: 50px;
margin-bottom: 3.125rem;
}
@media (min-width: 768px) {
.impressionenStart .impressionenbutton {
margin-bottom: 50px;
margin-bottom: 3.125rem;
margin-top: 20px;
}
}
@media (min-width: 992px) {
.impressionenStart .impressionenbutton {
margin-bottom: 50px;
margin-bottom: 3.125rem;
}
}
@media (min-width: 1302px) {
.impressionenStart .impressionenbutton {
margin-bottom: 80px;
margin-bottom: 5rem;
}
}
.impressionenStart .impressionenbutton:before {
content: '';
position: absolute;
left: 30px;
bottom: 0;
width: calc(100% - 30px);
height: 2px;
display: block;
overflow: hidden;
background: #575656;
z-index: 10;
-webkit-transition: 0.25s ease;
-moz-transition: 0.25s ease;
-ms-transition: 0.25s ease;
-o-transition: 0.25s ease;
transition: 0.25s ease;
}
.impressionenStart .impressionenbutton:after {
font-family: 'default';
font-weight: normal;
text-indent: 0;
font-style: normal;
content: '\1f4c5';
position: absolute;
left: 0px;
bottom: 3px;
width: 16px;
height: 16px;
line-height: 16px;
font-size: 16px;
display: block;
overflow: hidden;
z-index: 10;
color: #575656;
-webkit-transition: 0.25s ease;
-moz-transition: 0.25s ease;
-ms-transition: 0.25s ease;
-o-transition: 0.25s ease;
transition: 0.25s ease;
}
.impressionenStart .impressionenbutton:hover {
color: #db3d53;
}
.impressionenStart .impressionenbutton:hover:before {
background: #db3d53;
}
.impressionenStart .impressionenbutton:hover:after {
color: #db3d53;
}
.impressionenStart .ce-gallery {
overflow: hidden;
}
.impressionenStart .ce-gallery img {
-webkit-transform: scale(1);
-moz-transform: scale(1);
-ms-transform: scale(1);
-o-transform: scale(1);
transform: scale(1);
-webkit-transition: 0.55s ease;
-moz-transition: 0.55s ease;
-ms-transition: 0.55s ease;
-o-transition: 0.55s ease;
transition: 0.55s ease;
}
.impressionenStart .ce-gallery:hover img {
-webkit-transform: scale(1.1);
-moz-transform: scale(1.1);
-ms-transform: scale(1.1);
-o-transform: scale(1.1);
transform: scale(1.1);
}
/****************** DCE GALERIE 1 SPALTIG START ****************/
.dce-gallery-1 {
position: relative;
left: 0;
z-index: 0;
margin-bottom: 50px;
margin-bottom: 3.125rem;
margin: 0 20px;
}
@media (max-width: 1300px) {
.dce-gallery-1 {
width: calc(100% - 40px);
}
}
@media (min-width: 992px) {
.dce-gallery-1 {
margin-bottom: 50px;
margin-bottom: 3.125rem;
}
}
@media (min-width: 1302px) {
.dce-gallery-1 {
left: 50%;
-webkit-transform: translateX(-50%);
-moz-transform: translateX(-50%);
-ms-transform: translateX(-50%);
-o-transform: translateX(-50%);
transform: translateX(-50%);
margin: 0;
}
}
.dce-gallery-1 .ce-textpic {
width: 100%;
}
.dce-gallery-1 .inner {
white-space: nowrap;
overflow: hidden;
line-height: 0px;
font-size: 0px;
}
.dce-gallery-1 .inner .ce-textpic {
display: inline-block;
float: none;
width: 100%;
}
.dce-gallery-1 figure {
margin: 0;
position: relative;
width: 100%;
}
.dce-gallery-1 figure a,
.dce-gallery-1 figure img,
.dce-gallery-1 figure picture {
width: 100%;
height: auto;
display: block;
}
.dce-gallery-1 figure figcaption {
z-index: 300;
}
.dce-gallery-1 .gallery-caption {
font-weight: 500;
color: rgba(255, 255, 255, 0.5);
letter-spacing: 2px;
font-size: 13px;
font-size: 0.8125rem;
position: absolute;
left: 0%;
top: 30px;
width: 100%;
padding: 0 30px;
pointer-events: none;
z-index: 100;
}
.dce-gallery-1 .gallery-caption section {
margin-left: 20px;
margin-right: 20px;
}
.dce-gallery-1 .gallery-caption .highlight {
color: #FFF;
}
.dce-gallery-1 .flickity-slider {
white-space: nowrap;
}
/****************** DCE GALERIE 1 SPALTIG ENDE *****************/
/****************** ZIMMERDETAILSEITE START *****************/
.layout5 #media header#title {
position: absolute;
top: 50%;
left: 50%;
z-index: 10;
-webkit-transform: translate(-50%, -50%);
-moz-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
-o-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
margin: 0;
width: 350px;
}
@media (min-width: 768px) {
.layout5 #media header#title {
width: 600px;
}
}
@media (min-width: 992px) {
.layout5 #media header#title {
width: 700px;
}
}
@media (min-width: 1302px) {
.layout5 #media header#title {
width: 800px;
}
}
.layout5 #media header#title p {
color: #ffffff;
}
.layout5 #media header#title:before {
color: #ffffff;
}
.layout5 #media header#title h1 {
color: #ffffff;
}
.layout5 #media .canvas:after {
content: '';
position: absolute;
top: 0;
left: 0;
background: #000000;
opacity: 0.3;
width: 100%;
height: 100%;
z-index: 1;
}
@media (min-width: 992px) {
.layout5 main {
pointer-events: none;
}
}
@media (min-width: 992px) {
.layout5 main:before {
top: 80px;
}
}
@media (min-width: 992px) {
.layout5 main > .width {
margin-top: -110px;
z-index: 1;
pointer-events: auto;
}
.layout5 main > .width:before {
content: '';
display: block;
overflow: hidden;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 80px;
background: #ffffff;
z-index: 0;
}
}
@media (min-width: 1302px) {
.layout5 main > .width {
width: 1010px;
}
}
.layout5 main > .width .col0 {
padding-top: 150px;
}
.layout5 .infoBar {
position: relative;
width: 100%;
padding-top: 100px;
margin-top: -170px;
margin-bottom: 30px;
text-align: center;
}
@media (min-width: 992px) {
.layout5 .infoBar {
width: calc(100% + 170px);
position: absolute;
top: 0;
left: 50%;
-webkit-transform: translateX(-50%);
-moz-transform: translateX(-50%);
-ms-transform: translateX(-50%);
-o-transform: translateX(-50%);
transform: translateX(-50%);
margin: 0;
}
}
.layout5 .infoBar .price {
position: absolute;
top: -10px;
transform: translateY(-100%);
left: 0;
background-color: #db3d53;
padding: 10px 16px;
color: white;
pointer-events: none;
}
.layout5 .infoBar .persons {
position: relative;
display: block;
overflow: hidden;
font-weight: 600;
font-size: 0.875rem;
text-transform: uppercase;
text-align: center;
margin-bottom: 10px;
}
@media (min-width: 640px) {
.layout5 .infoBar .persons {
text-align: left;
margin-left: 15px;
}
}
@media (min-width: 992px) {
.layout5 .infoBar .persons {
position: absolute;
top: 20px;
left: 150px;
}
}
@media (min-width: 1100px) {
.layout5 .infoBar .persons {
left: 90px;
}
}
.layout5 .infoBar .persons:before {
font-family: 'default';
font-weight: normal;
text-indent: 0;
font-style: normal;
position: relative;
width: 26px;
height: 26px;
font-size: 26px;
line-height: 26px;
display: inline-block;
overflow: hidden;
margin-right: 10px;
top: 8px;
}
.layout5 .infoBar .persons.person1:before {
content: '\e927';
}
.layout5 .infoBar .persons.person2:before {
content: '\e928';
width: 30px;
height: 30px;
font-size: 30px;
line-height: 30px;
}
.layout5 .infoBar .persons.person3:before {
content: '\e929';
width: 34px;
height: 34px;
font-size: 34px;
line-height: 34px;
}
.layout5 .infoBar .persons .size {
text-transform: none;
}
.layout5 .infoBar .button {
width: auto;
padding: 0 20px;
z-index: 2;
}
@media (min-width: 640px) {
.layout5 .infoBar .button {
position: absolute;
top: 40px;
right: 20px;
}
}
@media (min-width: 992px) {
.layout5 .infoBar .button {
top: 20px;
}
}
@media (min-width: 640px) {
.layout5 .infoBar .buttonWrap {
position: absolute;
top: 60px;
right: 0;
z-index: 1;
}
}
@media (min-width: 768px) {
.layout5 .infoBar .buttonWrap {
top: 45px;
}
}
@media (min-width: 992px) {
.layout5 .infoBar .buttonWrap {
top: -10px;
right: 180px;
}
}
.layout5 .infoBar .buttonWrap .impressionenbutton {
cursor: pointer;
background: none;
color: #575656;
position: relative;
padding: 0;
height: 26px;
line-height: 26px;
padding-left: 30px;
-webkit-transition: 0.25s ease;
-moz-transition: 0.25s ease;
-ms-transition: 0.25s ease;
-o-transition: 0.25s ease;
transition: 0.25s ease;
font-weight: 600;
width: auto;
margin-bottom: 50px;
margin-bottom: 3.125rem;
}
@media (min-width: 768px) {
.layout5 .infoBar .buttonWrap .impressionenbutton {
margin-bottom: 50px;
margin-bottom: 3.125rem;
margin-top: 20px;
}
}
@media (min-width: 992px) {
.layout5 .infoBar .buttonWrap .impressionenbutton {
margin-bottom: 50px;
margin-bottom: 3.125rem;
}
}
@media (min-width: 1302px) {
.layout5 .infoBar .buttonWrap .impressionenbutton {
margin-bottom: 80px;
margin-bottom: 5rem;
}
}
.layout5 .infoBar .buttonWrap .impressionenbutton:before {
content: '';
position: absolute;
left: 30px;
bottom: 0;
width: calc(100% - 30px);
height: 2px;
display: block;
overflow: hidden;
background: #575656;
z-index: 10;
-webkit-transition: 0.25s ease;
-moz-transition: 0.25s ease;
-ms-transition: 0.25s ease;
-o-transition: 0.25s ease;
transition: 0.25s ease;
}
.layout5 .infoBar .buttonWrap .impressionenbutton:after {
font-family: 'default';
font-weight: normal;
text-indent: 0;
font-style: normal;
content: '\1f4c5';
position: absolute;
left: 0px;
bottom: 3px;
width: 16px;
height: 16px;
line-height: 16px;
font-size: 16px;
display: block;
overflow: hidden;
z-index: 10;
color: #575656;
-webkit-transition: 0.25s ease;
-moz-transition: 0.25s ease;
-ms-transition: 0.25s ease;
-o-transition: 0.25s ease;
transition: 0.25s ease;
}
.layout5 .infoBar .buttonWrap .impressionenbutton:hover {
color: #db3d53;
}
.layout5 .infoBar .buttonWrap .impressionenbutton:hover:before {
background: #db3d53;
}
.layout5 .infoBar .buttonWrap .impressionenbutton:hover:after {
color: #db3d53;
}
.ce-div {
background-color: #C7CCC4;
border: 0;
height: 1px;
}
@media (min-width: 1302px) {
.ce-div {
width: 1260px;
position: relative;
left: 50%;
-webkit-transform: translateX(-50%);
-moz-transform: translateX(-50%);
-ms-transform: translateX(-50%);
-o-transform: translateX(-50%);
transform: translateX(-50%);
}
}
.ausstattung {
position: relative;
margin-bottom: 1.5rem;
}
.ausstattung span {
position: relative;
display: inline-block;
margin-right: 50px;
width: 40px;
}
.ausstattung span i {
position: relative;
font-style: normal;
display: inline-block;
width: 40px;
height: 40px;
overflow: hidden;
}
.ausstattung span i:before {
font-family: 'default';
font-weight: normal;
text-indent: 0;
font-style: normal;
content: '\e919';
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
-moz-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
-o-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
width: 40px;
height: 40px;
font-size: 40px;
line-height: 40px;
overflow: hidden;
z-index: 1;
display: block;
color: red;
}
.ausstattung span span {
display: none;
}
.ausstattung span.item01 i:before {
color: red;
}
.ausstattung span.item02 i:before {
color: blue;
}
.ausstattung span.item03 i:before {
color: green;
}
#browseMenu .prev,
#browseMenu .next {
position: absolute;
height: 50px;
width: 50px;
top: 50%;
-webkit-transform: translateY(-50%);
-moz-transform: translateY(-50%);
-ms-transform: translateY(-50%);
-o-transform: translateY(-50%);
transform: translateY(-50%);
z-index: 150;
display: none;
text-decoration: none;
background-color: rgba(255, 255, 255, 0.3);
backdrop-filter: blur(5px);
border-radius: 50%;
margin: 40px;
justify-content: center;
align-items: center;
}
@media (min-width: 768px) {
#browseMenu .prev,
#browseMenu .next {
display: flex;
}
}
#browseMenu .prev:before,
#browseMenu .next:before {
display: block;
font-family: 'default';
font-weight: normal;
text-indent: 0;
font-style: normal;
color: white;
font-size: 20px;
margin: 0;
transition: margin 0.3s ease;
}
#browseMenu .prev:hover::before,
#browseMenu .next:hover::before {
opacity: 0.8;
}
#browseMenu .image {
border-radius: 100%;
width: 100px;
height: 100px;
border: 5px solid #ffffff;
display: block;
overflow: hidden;
position: absolute;
top: 50%;
-webkit-transform: translateY(-50%);
-moz-transform: translateY(-50%);
-ms-transform: translateY(-50%);
-o-transform: translateY(-50%);
transform: translateY(-50%);
opacity: 0;
-webkit-transition: 0.25s ease;
-moz-transition: 0.25s ease;
-ms-transition: 0.25s ease;
-o-transition: 0.25s ease;
transition: 0.25s ease;
pointer-events: none;
z-index: -1;
text-align: center;
}
#browseMenu .prev {
border-left: 0;
left: 0;
}
#browseMenu .prev .image {
left: 130px;
}
#browseMenu .prev:hover::before {
margin-right: 6px;
}
#browseMenu .prev:hover .image {
left: 80px;
opacity: 1;
pointer-events: auto;
z-index: 0;
}
#browseMenu .next {
border-right: 0;
right: 0;
}
#browseMenu .next .image {
left: auto;
right: 130px;
}
#browseMenu .next:hover::before {
margin-left: 6px;
}
#browseMenu .next:hover .image {
right: 80px;
opacity: 1;
pointer-events: auto;
z-index: 0;
}
#browseMenu .prev:before {
content: '\2c2';
}
#browseMenu .next:before {
content: '\2c3';
}
#browseMenu .text {
display: none;
}
/****************** ZIMMERDETAILSEITE ENDE *****************/
/****************** GO.PRICES START ******************/
main .tx-goprices {
line-height: 1.3em;
}
main .tx-goprices th,
main .tx-goprices td {
padding: 14px 10px;
vertical-align: middle;
position: relative;
z-index: -1;
background-clip: padding-box;
}
main .tx-goprices th span,
main .tx-goprices td span {
position: absolute;
left: 50%;
top: 50%;
-webkit-transform: translate(-50%, -50%);
-moz-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
-o-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}
main .tx-goprices thead th {
font-size: 1rem;
letter-spacing: 0px;
}
main .tx-goprices thead th small {
font-size: 1rem;
font-weight: 300;
font-family: 'Poppins', sans-serif;
}
main .tx-goprices tbody th small {
text-transform: none;
}
main .tx-goprices a {
text-decoration: none;
color: #000;
font-size: 0.625rem;
}
@media (min-width: 440px) {
main .tx-goprices a {
font-size: 0.8125rem;
}
}
main .tx-goprices .active {
background: rgba(172, 161, 148, 0.25);
}
main .tx-goprices .controls {
position: absolute;
left: 0;
top: 0;
width: 50%;
z-index: 1000;
height: 90px;
}
@media (min-width: 410px) {
main .tx-goprices .controls {
height: 70px;
}
}
@media (min-width: 992px) {
main .tx-goprices .controls {
width: 33.3333%;
}
}
main .tx-goprices .controls .prev,
main .tx-goprices .controls .next {
height: 91px;
width: 50%;
position: absolute !important;
left: 0px;
top: 0px;
background: #db3d53;
margin: 0px !important;
padding: 0px !important;
}
@media (min-width: 410px) {
main .tx-goprices .controls .prev,
main .tx-goprices .controls .next {
height: 71px;
}
}
main .tx-goprices .controls .prev:before,
main .tx-goprices .controls .next:before {
content: '\e916' !important;
width: 54px !important;
height: 54px !important;
line-height: 54px !important;
text-align: center !important;
position: absolute !important;
left: 50% !important;
top: 50% !important;
font-family: 'default';
font-weight: normal;
text-indent: 0;
font-style: normal;
font-size: 15px !important;
color: #FFF !important;
background: none !important;
-webkit-transform: translate(-50%, -50%) rotate(-225deg);
-moz-transform: translate(-50%, -50%) rotate(-225deg);
-ms-transform: translate(-50%, -50%) rotate(-225deg);
-o-transform: translate(-50%, -50%) rotate(-225deg);
transform: translate(-50%, -50%) rotate(-225deg);
}
main .tx-goprices .controls .next {
left: auto;
right: 2px;
}
@media (min-width: 992px) {
main .tx-goprices .controls .next {
right: 1px;
}
}
main .tx-goprices .controls .next:before {
-webkit-transform: translate(-50%, -50%) rotate(-45deg);
-moz-transform: translate(-50%, -50%) rotate(-45deg);
-ms-transform: translate(-50%, -50%) rotate(-45deg);
-o-transform: translate(-50%, -50%) rotate(-45deg);
transform: translate(-50%, -50%) rotate(-45deg);
}
main .tx-goprices .controls .next:after {
content: ' ';
display: block;
position: absolute;
left: 0;
top: 0;
background: #ffffff;
height: 100%;
width: 1px;
}
@media (min-width: 1302px) {
.table-container > table.switchable tr > td {
line-height: 42px;
}
}
/****************** GO.PRICES ENDE ******************/
/************** STARTSEITE START ************************/
.home .col0 {
padding-top: 80px;
}
@media (min-width: 992px) {
.home .col0 {
padding-top: 50px;
}
}
.home .col0 > header:not(#title) {
padding-top: 100px;
padding-left: 20px;
padding-right: 20px;
}
.home .col0 > header:not(#title) h2 {
margin: 20px 0 50px;
}
/************** STARTSEITE ENDE ************************/
/************** IMG-TEXT-SLIDER START ************************/
.dce-imgTextSlider {
margin: 0 !important;
}
.imgTextSlider {
position: relative;
margin-top: 100px;
}
@media (min-width: 992px) {
.imgTextSlider header {
position: absolute !important;
top: 140px;
left: 50%;
-webkit-transform: translateX(-50%);
-moz-transform: translateX(-50%);
-ms-transform: translateX(-50%);
-o-transform: translateX(-50%);
transform: translateX(-50%);
z-index: 1000;
width: 80%;
}
}
.imgTextSlider header h2,
.imgTextSlider header p {
color: white;
}
.imgTextSlider header::before {
color: white;
}
.imgTextSlider h2 {
color: #575656;
line-height: 1.2em;
margin-bottom: 3rem;
text-transform: none;
text-align: center;
}
@media (min-width: 768px) {
.imgTextSlider h2 {
font-size: 3.125rem;
}
}
.imgTextSlider .imgTextSliderInner {
position: relative;
margin: 0 20px 50px;
}
@media (min-width: 768px) {
.imgTextSlider .imgTextSliderInner {
width: 100vw;
left: 50%;
-webkit-transform: translateX(-50%);
-moz-transform: translateX(-50%);
-ms-transform: translateX(-50%);
-o-transform: translateX(-50%);
transform: translateX(-50%);
height: 700px;
margin: 0;
}
}
@media (min-width: 992px) {
.imgTextSlider .imgTextSliderInner {
overflow: hidden;
position: relative;
height: calc(100vh - 100px);
}
}
@media (min-width: 1302px) {
.imgTextSlider .imgTextSliderInner {
height: calc(100vh - 90px);
overflow: hidden;
position: relative;
}
}
@media (min-width: 992px) and (max-height: 900px) {
.imgTextSlider .imgTextSliderInner {
height: 800px;
}
}
.imgTextSlider .imgTextSliderInner .image {
position: relative;
filter: brightness(0.8);
}
@media (min-width: 768px) {
.imgTextSlider .imgTextSliderInner .image {
height: 100%;
}
}
.imgTextSlider .imgTextSliderInner .image img {
position: relative;
display: block;
}
@media (min-width: 768px) {
.imgTextSlider .imgTextSliderInner .image img {
position: absolute;
}
}
.imgTextSlider .imgTextSliderInner .item {
width: 100%;
height: 100%;
}
.imgTextSlider .imgTextSliderInner .descriptionInner {
padding: 40px 20px;
background: #ffffff;
}
@media (min-width: 768px) {
.imgTextSlider .imgTextSliderInner .descriptionInner {
position: absolute;
top: 50%;
-webkit-transform: translateY(-50%);
-moz-transform: translateY(-50%);
-ms-transform: translateY(-50%);
-o-transform: translateY(-50%);
transform: translateY(-50%);
right: 30px;
width: 400px;
padding: 20px;
}
}
@media (min-width: 992px) {
.imgTextSlider .imgTextSliderInner .descriptionInner {
width: 460px;
right: 100px;
margin-top: 50px;
}
.imgTextSlider .imgTextSliderInner .descriptionInner .name {
font-size: 32px;
}
}
@media (min-width: 1302px) {
.imgTextSlider .imgTextSliderInner .descriptionInner {
right: auto;
left: 50%;
margin-left: 70px;
padding: 40px;
}
}
.imgTextSlider .imgTextSliderInner .descriptionInner .name {
font-family: 'Noto Serif', serif;
font-weight: 600;
color: #575656;
font-size: 28px;
display: block;
margin-bottom: 1.5rem;
}
.imgTextSlider .imgTextSliderInner .descriptionInner a {
width: auto;
padding: 0 20px;
display: inline-block;
}
.imgTextSlider .control {
margin-bottom: 0;
position: relative;
z-index: 3000;
top: 30px;
}
@media (min-width: 768px) {
.imgTextSlider .control {
position: absolute;
bottom: 30px;
left: 50%;
-webkit-transform: translateX(-50%);
-moz-transform: translateX(-50%);
-ms-transform: translateX(-50%);
-o-transform: translateX(-50%);
transform: translateX(-50%);
z-index: 1000;
top: auto;
}
.imgTextSlider .control::after {
display: block;
position: absolute;
left: 0;
top: 5px;
content: '';
background-color: rgba(255, 255, 255, 0.5);
height: 1px;
width: 100%;
}
}
@media (min-width: 1302px) {
.imgTextSlider .control {
bottom: 50px;
}
}
.imgTextSlider .control ul {
text-align: center;
}
.imgTextSlider .control ul .dotstyle-fillup li {
width: 12px;
height: 12px;
}
@media (min-width: 768px) {
.imgTextSlider .control ul .dotstyle-fillup li {
margin: 0 40px 0 0;
}
}
@media (min-width: 1302px) {
.imgTextSlider .control ul .dotstyle-fillup li {
margin: 0 80px 0 0;
}
}
@media (min-width: 768px) {
.imgTextSlider .control ul .dotstyle-fillup li:last-of-type {
margin: 0;
}
}
.imgTextSlider .control ul .dotstyle-fillup li a::after {
background-color: #575656;
}
@media (min-width: 768px) {
.imgTextSlider .control ul .dotstyle-fillup li a::after {
background-color: #ffffff;
}
}
.imgTextSlider .control ul .dotstyle-fillup li a {
background: #ffffff;
}
.imgTextSlider .control ul .dotstyle-fillup li:hover a:focus,
.imgTextSlider .control ul .dotstyle-fillup li a:focus {
background: #ffffff;
}
.imgTextSlider .control ul .dotstyle-fillup li a {
box-shadow: inset 0 0 0 1px #575656;
}
@media (min-width: 768px) {
.imgTextSlider .control ul .dotstyle-fillup li a {
box-shadow: inset 0 0 0 1px #ffffff;
}
}
@media (min-width: 768px) {
.imgTextSlider .control ul .dotstyle-fillup li.act {
width: 24px;
height: 24px;
top: -5px;
position: relative;
}
.imgTextSlider .control ul .dotstyle-fillup li.act:before {
content: '';
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
-moz-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
-o-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
width: 50px;
height: 50px;
background: rgba(255, 255, 255, 0.5);
border-radius: 100%;
backdrop-filter: blur(5px);
}
}
/************** IMG-TEXT-SLIDER ENDE ************************/
/************** STARTPAGE OVERLAY START ************************/
.overlayStartpage {
position: fixed;
top: 0;
left: 0;
width: 100vw;
height: 100vh;
background: #575656;
z-index: 10000;
transition: all 1s ease;
}
.overlayStartpage .svgWrap {
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
-moz-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
-o-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
width: 250px;
margin-top: -25px;
}
@media (min-width: 768px) {
.overlayStartpage .svgWrap {
width: 400px;
}
}
.overlayStartpage .svgWrap svg {
display: block;
height: auto;
max-height: 100%;
position: relative;
width: 100%;
z-index: 100;
}
.overlayStartpage .bg-image,
.overlayStartpage .tx-dce-pi1,
.overlayStartpage .overlayImage {
position: relative;
width: 100%;
height: 100%;
}
.overlayStartpage.close {
top: -100vh;
}
html.no-js .overlay {
display: none;
}
/************** STARTPAGE OVERLAY ENDE ************************/
/****************** MORE INFO START ******************/
@-webkit-keyframes scrollToContent {
0%,
20%,
50%,
80%,
100% {
-webkit-transform: translate(0px, 0px);
}
40% {
-webkit-transform: translate(0px, -30px);
}
60% {
-webkit-transform: translate(0px, -15px);
}
}
@-moz-keyframes scrollToContent {
0%,
20%,
50%,
80%,
100% {
-moz-transform: translate(0px, 0px);
}
40% {
-moz-transform: translate(0px, -30px);
}
60% {
-moz-transform: translate(0px, -15px);
}
}
@-o-keyframes scrollToContent {
0%,
20%,
50%,
80%,
100% {
-o-transform: translate(0px, 0px);
}
40% {
-o-transform: translate(0px, -30px);
}
60% {
-o-transform: translate(0px, -15px);
}
}
@keyframes scrollToContent {
0%,
20%,
50%,
80%,
100% {
transform: translate(0px, 0px);
}
40% {
transform: translate(0px, -30px);
}
60% {
transform: translate(0px, -15px);
}
}
.scrollToContent {
display: none;
width: auto;
position: absolute;
left: 50%;
-webkit-transform: translateX(-50%);
-moz-transform: translateX(-50%);
-ms-transform: translateX(-50%);
-o-transform: translateX(-50%);
transform: translateX(-50%);
bottom: 30px;
color: #ffffff;
text-transform: uppercase;
z-index: 200;
font-size: 1.125rem;
font-weight: 500;
letter-spacing: 2px;
margin-left: -35px;
cursor: pointer;
-webkit-animation: scrollToContent 2s infinite;
-moz-animation: scrollToContent 2s infinite;
-o-animation: scrollToContent 2s infinite;
animation: scrollToContent 2s infinite;
height: 60px;
font-size: 0.8125rem;
text-shadow: 0px 3px 15px rgba(0, 0, 0, 0.5);
}
@media (min-width: 992px) {
.scrollToContent {
display: block;
}
}
.scrollToContent:before {
position: absolute;
left: 50%;
-webkit-transform: translateX(-50%);
-moz-transform: translateX(-50%);
-ms-transform: translateX(-50%);
-o-transform: translateX(-50%);
transform: translateX(-50%);
bottom: 0px;
margin-left: -1px;
content: '';
width: 25px;
height: 25px;
font-family: 'default';
font-weight: normal;
text-indent: 0;
font-style: normal;
content: '\2304';
font-size: 25px;
line-height: 100%;
text-shadow: 0px 3px 15px rgba(0, 0, 0, 0.5);
}
/****************** MORE INFO ENDE ******************/
/****************** WEBCAM IFRAME START ******************/
.iframe {
height: 250px;
}
@media (min-width: 420px) {
.iframe {
height: 300px;
}
}
@media (min-width: 557px) {
.iframe {
height: 500px;
}
}
@media (min-width: 768px) {
.iframe {
height: 500px;
}
}
@media (min-width: 992px) {
.iframe {
height: 600px;
}
}
@media (min-width: 1302px) {
.iframe {
height: 500px;
}
}
/****************** WEBCAM IFRAME ENDE ******************/
.col0 > header {
margin: 0 20px;
}
/****************** WETTER START ******************/
.wetterSmall {
width: 300px;
margin: 0 auto;
}
.wetterLarge {
width: 600px;
margin: 0 auto;
}
/****************** WETTER ENDE ******************/
.hc-widget-large {
margin: 0 auto;
}
/****************** PRINT START ******************/
@media print {
html {
font-size: 0.6875rem;
}
#menu,
#menu2,
#lang,
#search,
#quickform,
#media,
#breadcrumb,
#brand a,
a.ajax span.image_zoom {
display: none !important;
}
#brand img {
display: block;
}
section p a[href]:after {
content: ' (' attr(href) ')';
}
}
/****************** PRINT ENDE ******************/
/****************** STARTSEITE BUTTON START ******************/
.home .mediabutton {
display: none;
position: absolute;
bottom: -6rem;
right: 1rem;
background: #db3d53;
z-index: 100;
height: 150px;
width: 150px;
border-radius: 50%;
-webkit-transition: 0.25s ease;
-moz-transition: 0.25s ease;
-ms-transition: 0.25s ease;
-o-transition: 0.25s ease;
transition: 0.25s ease;
}
@media (min-width: 768px) {
.home .mediabutton {
height: 200px;
width: 200px;
bottom: 5rem;
right: 2rem;
}
}
.home .mediabutton a {
color: #FFFFFF;
text-decoration: none;
position: absolute;
text-align: center;
height: 100%;
width: 100%;
top: 0;
left: 0;
display: flex;
align-items: center;
padding: 5px;
font-family: 'Glegoo', serif;
font-weight: 400;
font-size: 14px;
font-size: 0.875rem;
-webkit-transform: rotate(8deg);
-moz-transform: rotate(8deg);
-ms-transform: rotate(8deg);
-o-transform: rotate(8deg);
transform: rotate(8deg);
line-height: 1.6em;
}
@media (min-width: 768px) {
.home .mediabutton a {
font-size: 18px;
font-size: 1.125rem;
padding: 1rem;
}
}
.home .mediabutton a:before {
content: ' ';
pointer-events: none;
position: absolute;
top: 5px;
left: 5px;
height: calc(100% - 12px);
width: calc(100% - 12px);
border: 1px dashed #ffffff;
border-radius: 50%;
opacity: 0.6;
}
@media (min-width: 768px) {
.home .mediabutton a:before {
top: 7px;
left: 7px;
height: calc(100% - 16px);
width: calc(100% - 16px);
}
}
.home .mediabutton:hover {
opacity: 0.9;
}
/****************** STARTSEITE BUTTON ENDE ******************/
/****************** NOTFALL OVERLAY ******************/
.frame-type-notfalloverlay {
position: fixed;
top: 50%;
left: 50%;
height: 100vh;
width: 100vw;
-webkit-transform: translate(-50%, -50%);
-moz-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
background: rgba(0, 0, 0, 0.5);
z-index: 2000;
backdrop-filter: blur(5px);
display: none;
}
.frame-type-notfalloverlay.visible {
display: block;
}
.frame-type-notfalloverlay .inside {
position: absolute;
top: 50%;
left: 50%;
margin: 0;
-webkit-transform: translate(-50%, -50%);
-moz-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
max-height: calc(80vh);
max-width: calc(80vw);
overflow: auto;
}
.frame-type-notfalloverlay .inside .innerWrap {
background: #fff;
box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.25);
padding: 0;
}
.frame-type-notfalloverlay .text {
padding: 20px;
}
.frame-type-notfalloverlay h2 {
width: calc(100% - 50px);
}
.frame-type-notfalloverlay p {
margin: 0 0 1em 0;
}
.frame-type-notfalloverlay .image {
position: relative;
height: 200px;
padding: 0;
}
.frame-type-notfalloverlay .close-button {
position: absolute;
top: 10px;
right: 10px;
height: 40px;
width: 40px;
background: #9b7560;
color: #fff;
}
.frame-type-notfalloverlay .withIMG .close-button {
top: -190px;
}
.frame-type-notfalloverlay .close-button:before {
content: '\e90b';
display: inline-block;
width: 100%;
text-align: center;
line-height: 40px;
font-family: 'default';
font-size: 13px;
cursor: pointer;
}
@media (min-width: 992px) {
.frame-type-notfalloverlay .inside .close-button {
top: -50px;
right: 0;
}
.frame-type-notfalloverlay .image {
position: absolute;
height: 100%;
}
.frame-type-notfalloverlay .inside {
overflow: visible;
}
.frame-type-notfalloverlay .text {
padding: 50px 40px;
}
.frame-type-notfalloverlay h2 {
width: 100%;
}
}
.fullWidthImageSlider {
position: relative;
left: 50%;
-webkit-transform: translateX(-50%);
-moz-transform: translateX(-50%);
-ms-transform: translateX(-50%);
-o-transform: translateX(-50%);
transform: translateX(-50%);
width: 100vw;
max-height: 960px;
aspect-ratio: 1.77777778;
}
.fullWidthImageSlider picture {
width: 100%;
height: 100%;
}
.fullWidthImageSlider picture img {
width: 100%;
height: 100%;
object-fit: cover;
}
.frame-type-eyecatcher {
position: relative;
z-index: 100;
}
.frame-type-eyecatcher a.bubble {
position: absolute;
right: 70px;
display: block;
background-color: #db3d53;
border-radius: 50%;
height: 170px;
width: 170px;
text-decoration: none;
transition: transform 0.3s ease;
transform: rotate(-10deg);
scale: 0.7;
top: -120px;
}
@media (min-width: 768px) {
.frame-type-eyecatcher a.bubble {
right: 100px;
}
}
@media (min-width: 1302px) {
.frame-type-eyecatcher a.bubble {
right: 0;
}
}
@media (min-width: 768px) {
.frame-type-eyecatcher a.bubble {
scale: 0.8;
top: -130px;
}
}
@media (min-width: 992px) {
.frame-type-eyecatcher a.bubble {
scale: 0.9;
top: -140px;
}
}
@media (min-width: 1302px) {
.frame-type-eyecatcher a.bubble {
scale: 1;
top: -150px;
}
}
.frame-type-eyecatcher a.bubble .content {
width: calc(100% - 12px);
height: calc(100% - 12px);
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
margin: 6px;
border-radius: 50%;
border: 1px rgba(255, 255, 255, 0.5) solid;
padding: 10px;
gap: 5px;
}
.frame-type-eyecatcher a.bubble .content::before {
font-family: 'default';
font-weight: normal;
text-indent: 0;
font-style: normal;
content: '\e91f';
line-height: 1em;
font-size: 25px;
display: block;
color: white;
margin-bottom: 10px;
}
.frame-type-eyecatcher a.bubble .content .title {
font-weight: 700;
margin: 0;
color: white;
line-height: 1em;
}
.frame-type-eyecatcher a.bubble .content p {
font-weight: 700;
margin: 0;
color: white;
line-height: 1em;
}
.frame-type-eyecatcher a.bubble .content::after {
content: '\2304';
font-family: 'default';
font-weight: normal;
text-indent: 0;
font-style: normal;
font-size: 20px;
line-height: 1em;
transform: rotate(-90deg);
color: #db3d53;
border-radius: 50%;
height: 20px;
width: 20px;
background-color: white;
margin-top: 10px;
}
.frame-type-eyecatcher a.bubble:hover {
transform: rotate(-13deg) scale(1.1);
}
@media (min-width: 1302px) {
.layout2 .frame-type-eyecatcher {
transform: translateY(180px);
}
}
.layout2 .frame-type-eyecatcher > div.row {
transform: translateX(-50%);
left: 50%;
}
@media (min-width: 1302px) {
.layout2 .frame-type-eyecatcher > div.row {
width: calc(100vw - 200px);
max-width: 1920px;
margin: 0;
}
}
.layout3 .frame-type-eyecatcher {
transform: translateY(300px);
}
.layout3 .frame-type-eyecatcher > div.row {
transform: translateX(-50%);
left: 50%;
width: calc(100vw - 200px);
max-width: 1920px;
margin: 0;
}
.layout3 .frame-type-eyecatcher > div.row a.bubble {
right: 0;
}
body.layout4 .frame-type-eyecatcher a {
top: -20px !important;
right: 0px !important;
}
body.layout3 .frame-type-eyecatcher a {
top: -315px;
right: -100px !important;
}