body,form,figure{margin:0;padding:0}img{border:0}header,footer,nav,section,aside,article,figure,figcaption{display:block}body{font-size:100.01%}select,input,textarea{font-size:99%}#container,.inside{position:relative}#main,#left,#right{float:left;position:relative}#main{width:100%}#left{margin-left:-100%}#right{margin-right:-100%}#footer{clear:both}#main .inside{min-height:1px}.ce_gallery>ul{margin:0;padding:0;overflow:hidden;list-style:none}.ce_gallery>ul li{float:left}.ce_gallery>ul li.col_first{clear:left}.float_left{float:left}.float_right{float:right}.block{overflow:hidden}.clear,#clear{height:.1px;font-size:.1px;line-height:.1px;clear:both}.invisible{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}.custom{display:block}#container:after,.custom:after{content:"";display:table;clear:both} @media (max-width:767px){#wrapper{margin:0;width:auto}#container{padding-left:0;padding-right:0}#main,#left,#right{float:none;width:auto}#left{right:0;margin-left:0}#right{margin-right:0}}img{max-width:100%;height:auto}.ie7 img{-ms-interpolation-mode:bicubic}.ie8 img{width:auto} /* ColorBox, (c) 2011 Jack Moore, MIT license */ #colorbox,#cboxOverlay,#cboxWrapper{position:absolute;top:0;left:0;z-index:9999;overflow:hidden}#cboxWrapper{max-width:none}#cboxOverlay{position:fixed;width:100%;height:100%}#cboxMiddleLeft,#cboxBottomLeft{clear:left}#cboxContent{position:relative}#cboxLoadedContent{overflow:auto;-webkit-overflow-scrolling:touch}#cboxTitle{margin:0}#cboxLoadingOverlay,#cboxLoadingGraphic{position:absolute;top:0;left:0;width:100%;height:100%}#cboxPrevious,#cboxNext,#cboxClose,#cboxSlideshow{cursor:pointer}.cboxPhoto{float:left;margin:auto;border:0;display:block;max-width:none;-ms-interpolation-mode:bicubic}.cboxIframe{width:100%;height:100%;display:block;border:0;padding:0;margin:0}#colorbox,#cboxContent,#cboxLoadedContent{box-sizing:content-box;-moz-box-sizing:content-box;-webkit-box-sizing:content-box}#cboxOverlay{background:#000;opacity:.9;filter:alpha(opacity = 90)}#colorbox{outline:0}#cboxContent{margin-top:20px;background:#000}.cboxIframe{background:#fff}#cboxError{padding:50px;border:1px solid #ccc}#cboxLoadedContent{border:5px solid #000;background:#fff}#cboxTitle{position:absolute;top:-20px;left:0;color:#ccc}#cboxCurrent{position:absolute;top:-20px;right:0;color:#ccc}#cboxLoadingGraphic{background:url("../../assets/jquery/colorbox/1.6.1/images/loading.gif") no-repeat center center}#cboxPrevious,#cboxNext,#cboxSlideshow,#cboxClose{border:0;padding:0;margin:0;overflow:visible;width:auto;background:0}#cboxPrevious:active,#cboxNext:active,#cboxSlideshow:active,#cboxClose:active{outline:0}#cboxSlideshow{position:absolute;top:-20px;right:90px;color:#fff}#cboxPrevious{position:absolute;top:50%;left:5px;margin-top:-32px;background:url("../../assets/jquery/colorbox/1.6.1/images/controls.png") no-repeat top left;width:28px;height:65px;text-indent:-9999px}#cboxPrevious:hover{background-position:bottom left}#cboxNext{position:absolute;top:50%;right:5px;margin-top:-32px;background:url("../../assets/jquery/colorbox/1.6.1/images/controls.png") no-repeat top right;width:28px;height:65px;text-indent:-9999px}#cboxNext:hover{background-position:bottom right}#cboxClose{position:absolute;top:5px;right:5px;display:block;background:url("../../assets/jquery/colorbox/1.6.1/images/controls.png") no-repeat top center;width:38px;height:19px;text-indent:-9999px}#cboxClose:hover{background-position:bottom center} .ce_lr_socialmessengers .teambox { max-width: 350px; margin: auto; } .ce_lr_socialmessengers h1 { text-align: center; } .teambox { text-align: center; padding-top: 100px; position: relative; } .ce_lr_socialmessengers .teambox .image_container { position: absolute; left: 25%; width: 50%; top: 25px; padding: 5px; border-radius: 100%; background: #f8f8f8; } .teambox .image_container img { border-radius: 100%; } .ce_lr_socialmessengers .teambox .teambox_content { background: #f8f8f8d6; padding: 126px 25px 25px 25px; border-radius: 15px; } .teambox h3 { font-size: 16px; text-transform: uppercase; letter-spacing: 2px; font-weight: bold; } .teambox .funktion { color: #A2BD30; text-transform: uppercase; line-height: 1.2em; } .text-standard .teambox .funktion { color: #444751; text-transform: none; text-align: left; } .text-standard .teambox .funktion ol { list-style-type: decimal; margin-left: 1rem; padding: 0 0 1rem; } .text-standard .teambox .funktion ol { list-style-type: decimal; margin-left: 1rem; padding: 0 0 1rem; } .text-standard .teambox .funktion li { padding-left: 0.25rem; } .ce_lr_socialmessengers ul { display: flex; flex-wrap: nowrap; justify-content: space-around; } li.socialmes { margin: 0 0.5em; width: 30%; } .socialmes img { width: 100%; max-width: 154px; cursor: pointer; } .funktion a { color: #a2bd30 !important; font-size: 1em; font-family: initial; } .ce_lr_avatar.ce_lr_socialmessengers.block { max-width: 422px; } .teambox input[type="text"],.teambox textarea { background: #fff; margin-top: 1em; } .teambox {max-height: initial;} .teambox_info { max-height: 200px; transition: max-height 0.5s ease-in; } .teambox_form { max-height: 575px; transition: max-height 0.5s ease-in; } .teambox_form.hide { display: block; max-height: 0 !important; overflow: hidden; -moz-animation-delay: 3.5s; -webkit-animation-delay: 3.5s; -o-animation-delay: 3.5s; opacity: 0; transition: max-height 0.5s ease-in; } .lnk-email { text-align: left; padding: 0.25em 0; cursor: pointer; } @media only screen and (max-width: 767px) { .ce_lr_avatar.ce_lr_socialmessengers.block { float: none; } } /* ============================================================================= * --forms * ========================================================================== */ /* --hide br ------------------------------------------------- */ form br {display: none;} /* --input-wrapper ------------------------------------------------- */ .input-wrapper {margin-bottom: 12px; position: relative;} .input-wrapper * {width: 99.9%; margin-left: 0!important;} .ce_form .full {width: 99.9%;} /* --fieldset+legend ------------------------------------------------- */ fieldset {border: 1px solid #ccc; padding: 0.5em; margin-bottom: 20px;} legend {display: none;} /* --input, select, textarea ------------------------------------------------- */ input, select, textarea {width: 100%; padding: 20px; margin: 0; border: 1px solid #dadada; color: #333; background: #FAFAFA; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; line-height: 18px; border-radius: 0; font-size: 18px;} input[type="search"] {-webkit-appearance: none; border-radius: 0!important;} select {height: 40px; padding: 8px;} textarea {min-height: 185px;} *::-webkit-input-placeholder {color: #b9bcbe; text-transform: uppercase; font-family: Arial, sans-serif;} *:-moz-placeholder {color: #7f7f7f; text-transform: uppercase; font-family: Arial, sans-serif;} *::-moz-placeholder {color: #7f7f7f; text-transform: uppercase; font-family: Arial, sans-serif;} *:-ms-input-placeholder {color: #7f7f7f; text-transform: uppercase; font-family: Arial, sans-serif;} /* --radio-buttons ------------------------------------------------- */ .radio_container {margin-top: 1px;} .radio_container legend span {margin-bottom: 5px; display: inline!important;} .radio_container label {float: none;} .radio_container input {width: 20px; padding: 0; box-shadow: none; -webkit-box-shadow: none; border-radius: 100%;} .radio_container legend {display: block; overflow: hidden;} .radio_container span {display: block;} .radio_container.horizontal span {display: inline-block; margin-right: 15px;} /* --checkboxes ------------------------------------------------- */ .checkbox_container {margin-top: 1px;} .checkbox_container legend span {margin-bottom: 5px; display: inline!important;} .checkbox_container label {float: none;} .checkbox_container input {width: 20px!important; padding: 0; box-shadow: none; -webkit-box-shadow: none;} .checkbox_container legend {display: block; overflow: hidden;} .checkbox_container span {display: block;} .checkbox_container.horizontal span {display: inline-block; margin-right: 15px;} /* --submit-button ------------------------------------------------- */ .submit_container input {width: auto!important;} .submit {-webkit-appearance:none; -webkit-box-shadow: none; box-shadow: none; border: 0;} input[type="submit"], input.submit {-webkit-transition: All 0.3s ease; -moz-transition: All 0.3s ease; -o-transition: All 0.3s ease; -ms-transition: All 0.3s ease; transition: All 0.3s ease;} input[type="submit"]:hover, input.submit:hover {opacity: 0.9; -webkit-transition: All 0.3s ease; -moz-transition: All 0.3s ease; -o-transition: All 0.3s ease; -ms-transition: All 0.3s ease; transition: All 0.3s ease;} /* --errors ------------------------------------------------- */ label.error {color: red;} input.error {border: 1px solid red;} p.error {color: red; clear: both;} /* --captcha ------------------------------------------------- */ .ce_form .captcha {width: 20%;} .ce_form .captcha-container label {width: 100%; display: block;} .ce_form .captcha_text {display: block; margin-top: 10px;} .ce_form .captcha-container {background: #ecd0d0; padding: 2%; margin-bottom: 15px;} /* --icon ------------------------------------------------- */ .input-wrapper:hover span i:before {-webkit-animation: rotateIn 500ms ease; -moz-animation: rotateIn 500ms ease; -ms-animation: rotateIn 500ms ease; animation: rotateIn 500ms ease;} .input-wrapper-inside[class^="icon-"] span, .input-wrapper-inside[class*="icon-"] span {border-right: 0!important;} .input-wrapper-inside[class^="icon-"] span, .input-wrapper-inside[class*="icon-"] span { background: #FFF; color: #CCC; font-size: 28px; padding: 16px 1px 16px 12px; } @charset "UTF-8"; /*! Animate.css - http://daneden.me/animate Licensed under the MIT license Copyright (c) 2013 Daniel Eden Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions: The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software. THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. */ .animate {opacity: 0;} .animated { -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; animation-fill-mode: both; } .animated.infinite { -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; } .animated.hinge { -webkit-animation-duration: 2s; animation-duration: 2s; } @-webkit-keyframes bounce { 0%, 20%, 50%, 80%, 100% { -webkit-transform: translateY(0); transform: translateY(0); } 40% { -webkit-transform: translateY(-30px); transform: translateY(-30px); } 60% { -webkit-transform: translateY(-15px); transform: translateY(-15px); } } @keyframes bounce { 0%, 20%, 50%, 80%, 100% { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } 40% { -webkit-transform: translateY(-30px); -ms-transform: translateY(-30px); transform: translateY(-30px); } 60% { -webkit-transform: translateY(-15px); -ms-transform: translateY(-15px); transform: translateY(-15px); } } .bounce { -webkit-animation-name: bounce; animation-name: bounce; } @-webkit-keyframes flash { 0%, 50%, 100% { opacity: 1; } 25%, 75% { opacity: 0; } } @keyframes flash { 0%, 50%, 100% { opacity: 1; } 25%, 75% { opacity: 0; } } .flash { -webkit-animation-name: flash; animation-name: flash; } /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ @-webkit-keyframes pulse { 0% { -webkit-transform: scale(1); transform: scale(1); } 50% { -webkit-transform: scale(1.1); transform: scale(1.1); } 100% { -webkit-transform: scale(1); transform: scale(1); } } @keyframes pulse { 0% { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } 50% { -webkit-transform: scale(1.1); -ms-transform: scale(1.1); transform: scale(1.1); } 100% { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } } .pulse { -webkit-animation-name: pulse; animation-name: pulse; } @-webkit-keyframes rubberBand { 0% { -webkit-transform: scale(1); transform: scale(1); } 30% { -webkit-transform: scaleX(1.25) scaleY(0.75); transform: scaleX(1.25) scaleY(0.75); } 40% { -webkit-transform: scaleX(0.75) scaleY(1.25); transform: scaleX(0.75) scaleY(1.25); } 60% { -webkit-transform: scaleX(1.15) scaleY(0.85); transform: scaleX(1.15) scaleY(0.85); } 100% { -webkit-transform: scale(1); transform: scale(1); } } @keyframes rubberBand { 0% { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } 30% { -webkit-transform: scaleX(1.25) scaleY(0.75); -ms-transform: scaleX(1.25) scaleY(0.75); transform: scaleX(1.25) scaleY(0.75); } 40% { -webkit-transform: scaleX(0.75) scaleY(1.25); -ms-transform: scaleX(0.75) scaleY(1.25); transform: scaleX(0.75) scaleY(1.25); } 60% { -webkit-transform: scaleX(1.15) scaleY(0.85); -ms-transform: scaleX(1.15) scaleY(0.85); transform: scaleX(1.15) scaleY(0.85); } 100% { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } } .rubberBand { -webkit-animation-name: rubberBand; animation-name: rubberBand; } @-webkit-keyframes shake { 0%, 100% { -webkit-transform: translateX(0); transform: translateX(0); } 10%, 30%, 50%, 70%, 90% { -webkit-transform: translateX(-10px); transform: translateX(-10px); } 20%, 40%, 60%, 80% { -webkit-transform: translateX(10px); transform: translateX(10px); } } @keyframes shake { 0%, 100% { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } 10%, 30%, 50%, 70%, 90% { -webkit-transform: translateX(-10px); -ms-transform: translateX(-10px); transform: translateX(-10px); } 20%, 40%, 60%, 80% { -webkit-transform: translateX(10px); -ms-transform: translateX(10px); transform: translateX(10px); } } .shake { -webkit-animation-name: shake; animation-name: shake; } @-webkit-keyframes swing { 20% { -webkit-transform: rotate(15deg); transform: rotate(15deg); } 40% { -webkit-transform: rotate(-10deg); transform: rotate(-10deg); } 60% { -webkit-transform: rotate(5deg); transform: rotate(5deg); } 80% { -webkit-transform: rotate(-5deg); transform: rotate(-5deg); } 100% { -webkit-transform: rotate(0deg); transform: rotate(0deg); } } @keyframes swing { 20% { -webkit-transform: rotate(15deg); -ms-transform: rotate(15deg); transform: rotate(15deg); } 40% { -webkit-transform: rotate(-10deg); -ms-transform: rotate(-10deg); transform: rotate(-10deg); } 60% { -webkit-transform: rotate(5deg); -ms-transform: rotate(5deg); transform: rotate(5deg); } 80% { -webkit-transform: rotate(-5deg); -ms-transform: rotate(-5deg); transform: rotate(-5deg); } 100% { -webkit-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); } } .swing { -webkit-transform-origin: top center; -ms-transform-origin: top center; transform-origin: top center; -webkit-animation-name: swing; animation-name: swing; } @-webkit-keyframes tada { 0% { -webkit-transform: scale(1); transform: scale(1); } 10%, 20% { -webkit-transform: scale(0.9) rotate(-3deg); transform: scale(0.9) rotate(-3deg); } 30%, 50%, 70%, 90% { -webkit-transform: scale(1.1) rotate(3deg); transform: scale(1.1) rotate(3deg); } 40%, 60%, 80% { -webkit-transform: scale(1.1) rotate(-3deg); transform: scale(1.1) rotate(-3deg); } 100% { -webkit-transform: scale(1) rotate(0); transform: scale(1) rotate(0); } } @keyframes tada { 0% { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } 10%, 20% { -webkit-transform: scale(0.9) rotate(-3deg); -ms-transform: scale(0.9) rotate(-3deg); transform: scale(0.9) rotate(-3deg); } 30%, 50%, 70%, 90% { -webkit-transform: scale(1.1) rotate(3deg); -ms-transform: scale(1.1) rotate(3deg); transform: scale(1.1) rotate(3deg); } 40%, 60%, 80% { -webkit-transform: scale(1.1) rotate(-3deg); -ms-transform: scale(1.1) rotate(-3deg); transform: scale(1.1) rotate(-3deg); } 100% { -webkit-transform: scale(1) rotate(0); -ms-transform: scale(1) rotate(0); transform: scale(1) rotate(0); } } .tada { -webkit-animation-name: tada; animation-name: tada; } /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ @-webkit-keyframes wobble { 0% { -webkit-transform: translateX(0%); transform: translateX(0%); } 15% { -webkit-transform: translateX(-25%) rotate(-5deg); transform: translateX(-25%) rotate(-5deg); } 30% { -webkit-transform: translateX(20%) rotate(3deg); transform: translateX(20%) rotate(3deg); } 45% { -webkit-transform: translateX(-15%) rotate(-3deg); transform: translateX(-15%) rotate(-3deg); } 60% { -webkit-transform: translateX(10%) rotate(2deg); transform: translateX(10%) rotate(2deg); } 75% { -webkit-transform: translateX(-5%) rotate(-1deg); transform: translateX(-5%) rotate(-1deg); } 100% { -webkit-transform: translateX(0%); transform: translateX(0%); } } @keyframes wobble { 0% { -webkit-transform: translateX(0%); -ms-transform: translateX(0%); transform: translateX(0%); } 15% { -webkit-transform: translateX(-25%) rotate(-5deg); -ms-transform: translateX(-25%) rotate(-5deg); transform: translateX(-25%) rotate(-5deg); } 30% { -webkit-transform: translateX(20%) rotate(3deg); -ms-transform: translateX(20%) rotate(3deg); transform: translateX(20%) rotate(3deg); } 45% { -webkit-transform: translateX(-15%) rotate(-3deg); -ms-transform: translateX(-15%) rotate(-3deg); transform: translateX(-15%) rotate(-3deg); } 60% { -webkit-transform: translateX(10%) rotate(2deg); -ms-transform: translateX(10%) rotate(2deg); transform: translateX(10%) rotate(2deg); } 75% { -webkit-transform: translateX(-5%) rotate(-1deg); -ms-transform: translateX(-5%) rotate(-1deg); transform: translateX(-5%) rotate(-1deg); } 100% { -webkit-transform: translateX(0%); -ms-transform: translateX(0%); transform: translateX(0%); } } .wobble { -webkit-animation-name: wobble; animation-name: wobble; } @-webkit-keyframes bounceIn { 0% { opacity: 0; -webkit-transform: scale(.3); transform: scale(.3); } 50% { opacity: 1; -webkit-transform: scale(1.05); transform: scale(1.05); } 70% { -webkit-transform: scale(.9); transform: scale(.9); } 100% { opacity: 1; -webkit-transform: scale(1); transform: scale(1); } } @keyframes bounceIn { 0% { opacity: 0; -webkit-transform: scale(.3); -ms-transform: scale(.3); transform: scale(.3); } 50% { opacity: 1; -webkit-transform: scale(1.05); -ms-transform: scale(1.05); transform: scale(1.05); } 70% { -webkit-transform: scale(.9); -ms-transform: scale(.9); transform: scale(.9); } 100% { opacity: 1; -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } } .bounceIn { -webkit-animation-name: bounceIn; animation-name: bounceIn; } @-webkit-keyframes bounceInDown { 0% { opacity: 0; -webkit-transform: translateY(-2000px); transform: translateY(-2000px); } 60% { opacity: 1; -webkit-transform: translateY(30px); transform: translateY(30px); } 80% { -webkit-transform: translateY(-10px); transform: translateY(-10px); } 100% { -webkit-transform: translateY(0); transform: translateY(0); } } @keyframes bounceInDown { 0% { opacity: 0; -webkit-transform: translateY(-2000px); -ms-transform: translateY(-2000px); transform: translateY(-2000px); } 60% { opacity: 1; -webkit-transform: translateY(30px); -ms-transform: translateY(30px); transform: translateY(30px); } 80% { -webkit-transform: translateY(-10px); -ms-transform: translateY(-10px); transform: translateY(-10px); } 100% { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } } .bounceInDown { -webkit-animation-name: bounceInDown; animation-name: bounceInDown; } @-webkit-keyframes bounceInLeft { 0% { opacity: 0; -webkit-transform: translateX(-2000px); transform: translateX(-2000px); } 60% { opacity: 1; -webkit-transform: translateX(30px); transform: translateX(30px); } 80% { -webkit-transform: translateX(-10px); transform: translateX(-10px); } 100% { -webkit-transform: translateX(0); transform: translateX(0); } } @keyframes bounceInLeft { 0% { opacity: 0; -webkit-transform: translateX(-2000px); -ms-transform: translateX(-2000px); transform: translateX(-2000px); } 60% { opacity: 1; -webkit-transform: translateX(30px); -ms-transform: translateX(30px); transform: translateX(30px); } 80% { -webkit-transform: translateX(-10px); -ms-transform: translateX(-10px); transform: translateX(-10px); } 100% { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } } .bounceInLeft { -webkit-animation-name: bounceInLeft; animation-name: bounceInLeft; } @-webkit-keyframes bounceInRight { 0% { opacity: 0; -webkit-transform: translateX(2000px); transform: translateX(2000px); } 60% { opacity: 1; -webkit-transform: translateX(-30px); transform: translateX(-30px); } 80% { -webkit-transform: translateX(10px); transform: translateX(10px); } 100% { -webkit-transform: translateX(0); transform: translateX(0); } } @keyframes bounceInRight { 0% { opacity: 0; -webkit-transform: translateX(2000px); -ms-transform: translateX(2000px); transform: translateX(2000px); } 60% { opacity: 1; -webkit-transform: translateX(-30px); -ms-transform: translateX(-30px); transform: translateX(-30px); } 80% { -webkit-transform: translateX(10px); -ms-transform: translateX(10px); transform: translateX(10px); } 100% { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } } .bounceInRight { -webkit-animation-name: bounceInRight; animation-name: bounceInRight; } @-webkit-keyframes bounceInUp { 0% { opacity: 0; -webkit-transform: translateY(2000px); transform: translateY(2000px); } 60% { opacity: 1; -webkit-transform: translateY(-30px); transform: translateY(-30px); } 80% { -webkit-transform: translateY(10px); transform: translateY(10px); } 100% { -webkit-transform: translateY(0); transform: translateY(0); } } @keyframes bounceInUp { 0% { opacity: 0; -webkit-transform: translateY(2000px); -ms-transform: translateY(2000px); transform: translateY(2000px); } 60% { opacity: 1; -webkit-transform: translateY(-30px); -ms-transform: translateY(-30px); transform: translateY(-30px); } 80% { -webkit-transform: translateY(10px); -ms-transform: translateY(10px); transform: translateY(10px); } 100% { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } } .bounceInUp { -webkit-animation-name: bounceInUp; animation-name: bounceInUp; } @-webkit-keyframes bounceOut { 0% { -webkit-transform: scale(1); transform: scale(1); } 25% { -webkit-transform: scale(.95); transform: scale(.95); } 50% { opacity: 1; -webkit-transform: scale(1.1); transform: scale(1.1); } 100% { opacity: 0; -webkit-transform: scale(.3); transform: scale(.3); } } @keyframes bounceOut { 0% { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } 25% { -webkit-transform: scale(.95); -ms-transform: scale(.95); transform: scale(.95); } 50% { opacity: 1; -webkit-transform: scale(1.1); -ms-transform: scale(1.1); transform: scale(1.1); } 100% { opacity: 0; -webkit-transform: scale(.3); -ms-transform: scale(.3); transform: scale(.3); } } .bounceOut { -webkit-animation-name: bounceOut; animation-name: bounceOut; } @-webkit-keyframes bounceOutDown { 0% { -webkit-transform: translateY(0); transform: translateY(0); } 20% { opacity: 1; -webkit-transform: translateY(-20px); transform: translateY(-20px); } 100% { opacity: 0; -webkit-transform: translateY(2000px); transform: translateY(2000px); } } @keyframes bounceOutDown { 0% { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } 20% { opacity: 1; -webkit-transform: translateY(-20px); -ms-transform: translateY(-20px); transform: translateY(-20px); } 100% { opacity: 0; -webkit-transform: translateY(2000px); -ms-transform: translateY(2000px); transform: translateY(2000px); } } .bounceOutDown { -webkit-animation-name: bounceOutDown; animation-name: bounceOutDown; } @-webkit-keyframes bounceOutLeft { 0% { -webkit-transform: translateX(0); transform: translateX(0); } 20% { opacity: 1; -webkit-transform: translateX(20px); transform: translateX(20px); } 100% { opacity: 0; -webkit-transform: translateX(-2000px); transform: translateX(-2000px); } } @keyframes bounceOutLeft { 0% { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } 20% { opacity: 1; -webkit-transform: translateX(20px); -ms-transform: translateX(20px); transform: translateX(20px); } 100% { opacity: 0; -webkit-transform: translateX(-2000px); -ms-transform: translateX(-2000px); transform: translateX(-2000px); } } .bounceOutLeft { -webkit-animation-name: bounceOutLeft; animation-name: bounceOutLeft; } @-webkit-keyframes bounceOutRight { 0% { -webkit-transform: translateX(0); transform: translateX(0); } 20% { opacity: 1; -webkit-transform: translateX(-20px); transform: translateX(-20px); } 100% { opacity: 0; -webkit-transform: translateX(2000px); transform: translateX(2000px); } } @keyframes bounceOutRight { 0% { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } 20% { opacity: 1; -webkit-transform: translateX(-20px); -ms-transform: translateX(-20px); transform: translateX(-20px); } 100% { opacity: 0; -webkit-transform: translateX(2000px); -ms-transform: translateX(2000px); transform: translateX(2000px); } } .bounceOutRight { -webkit-animation-name: bounceOutRight; animation-name: bounceOutRight; } @-webkit-keyframes bounceOutUp { 0% { -webkit-transform: translateY(0); transform: translateY(0); } 20% { opacity: 1; -webkit-transform: translateY(20px); transform: translateY(20px); } 100% { opacity: 0; -webkit-transform: translateY(-2000px); transform: translateY(-2000px); } } @keyframes bounceOutUp { 0% { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } 20% { opacity: 1; -webkit-transform: translateY(20px); -ms-transform: translateY(20px); transform: translateY(20px); } 100% { opacity: 0; -webkit-transform: translateY(-2000px); -ms-transform: translateY(-2000px); transform: translateY(-2000px); } } .bounceOutUp { -webkit-animation-name: bounceOutUp; animation-name: bounceOutUp; } @-webkit-keyframes fadeIn { 0% { opacity: 0; } 100% { opacity: 1; } } @keyframes fadeIn { 0% { opacity: 0; } 100% { opacity: 1; } } .fadeIn { -webkit-animation-name: fadeIn; animation-name: fadeIn; } @-webkit-keyframes fadeInDown { 0% { opacity: 0; -webkit-transform: translateY(-20px); transform: translateY(-20px); } 100% { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } } @keyframes fadeInDown { 0% { opacity: 0; -webkit-transform: translateY(-20px); -ms-transform: translateY(-20px); transform: translateY(-20px); } 100% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } } .fadeInDown { -webkit-animation-name: fadeInDown; animation-name: fadeInDown; } @-webkit-keyframes fadeInDownBig { 0% { opacity: 0; -webkit-transform: translateY(-2000px); transform: translateY(-2000px); } 100% { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } } @keyframes fadeInDownBig { 0% { opacity: 0; -webkit-transform: translateY(-2000px); -ms-transform: translateY(-2000px); transform: translateY(-2000px); } 100% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } } .fadeInDownBig { -webkit-animation-name: fadeInDownBig; animation-name: fadeInDownBig; } @-webkit-keyframes fadeInLeft { 0% { opacity: 0; -webkit-transform: translateX(-20px); transform: translateX(-20px); } 100% { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } } @keyframes fadeInLeft { 0% { opacity: 0; -webkit-transform: translateX(-20px); -ms-transform: translateX(-20px); transform: translateX(-20px); } 100% { opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } } .fadeInLeft { -webkit-animation-name: fadeInLeft; animation-name: fadeInLeft; } @-webkit-keyframes fadeInLeftBig { 0% { opacity: 0; -webkit-transform: translateX(-2000px); transform: translateX(-2000px); } 100% { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } } @keyframes fadeInLeftBig { 0% { opacity: 0; -webkit-transform: translateX(-2000px); -ms-transform: translateX(-2000px); transform: translateX(-2000px); } 100% { opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } } .fadeInLeftBig { -webkit-animation-name: fadeInLeftBig; animation-name: fadeInLeftBig; } @-webkit-keyframes fadeInRight { 0% { opacity: 0; -webkit-transform: translateX(20px); transform: translateX(20px); } 100% { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } } @keyframes fadeInRight { 0% { opacity: 0; -webkit-transform: translateX(20px); -ms-transform: translateX(20px); transform: translateX(20px); } 100% { opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } } .fadeInRight { -webkit-animation-name: fadeInRight; animation-name: fadeInRight; } @-webkit-keyframes fadeInRightBig { 0% { opacity: 0; -webkit-transform: translateX(2000px); transform: translateX(2000px); } 100% { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } } @keyframes fadeInRightBig { 0% { opacity: 0; -webkit-transform: translateX(2000px); -ms-transform: translateX(2000px); transform: translateX(2000px); } 100% { opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } } .fadeInRightBig { -webkit-animation-name: fadeInRightBig; animation-name: fadeInRightBig; } @-webkit-keyframes fadeInUp { 0% { opacity: 0; -webkit-transform: translateY(20px); transform: translateY(20px); } 100% { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } } @keyframes fadeInUp { 0% { opacity: 0; -webkit-transform: translateY(20px); -ms-transform: translateY(20px); transform: translateY(20px); } 100% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } } .fadeInUp { -webkit-animation-name: fadeInUp; animation-name: fadeInUp; } @-webkit-keyframes fadeInUpBig { 0% { opacity: 0; -webkit-transform: translateY(2000px); transform: translateY(2000px); } 100% { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } } @keyframes fadeInUpBig { 0% { opacity: 0; -webkit-transform: translateY(2000px); -ms-transform: translateY(2000px); transform: translateY(2000px); } 100% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } } .fadeInUpBig { -webkit-animation-name: fadeInUpBig; animation-name: fadeInUpBig; } @-webkit-keyframes fadeOut { 0% { opacity: 1; } 100% { opacity: 0; } } @keyframes fadeOut { 0% { opacity: 1; } 100% { opacity: 0; } } .fadeOut { -webkit-animation-name: fadeOut; animation-name: fadeOut; } @-webkit-keyframes fadeOutDown { 0% { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } 100% { opacity: 0; -webkit-transform: translateY(20px); transform: translateY(20px); } } @keyframes fadeOutDown { 0% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } 100% { opacity: 0; -webkit-transform: translateY(20px); -ms-transform: translateY(20px); transform: translateY(20px); } } .fadeOutDown { -webkit-animation-name: fadeOutDown; animation-name: fadeOutDown; } @-webkit-keyframes fadeOutDownBig { 0% { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } 100% { opacity: 0; -webkit-transform: translateY(2000px); transform: translateY(2000px); } } @keyframes fadeOutDownBig { 0% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } 100% { opacity: 0; -webkit-transform: translateY(2000px); -ms-transform: translateY(2000px); transform: translateY(2000px); } } .fadeOutDownBig { -webkit-animation-name: fadeOutDownBig; animation-name: fadeOutDownBig; } @-webkit-keyframes fadeOutLeft { 0% { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } 100% { opacity: 0; -webkit-transform: translateX(-20px); transform: translateX(-20px); } } @keyframes fadeOutLeft { 0% { opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } 100% { opacity: 0; -webkit-transform: translateX(-20px); -ms-transform: translateX(-20px); transform: translateX(-20px); } } .fadeOutLeft { -webkit-animation-name: fadeOutLeft; animation-name: fadeOutLeft; } @-webkit-keyframes fadeOutLeftBig { 0% { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } 100% { opacity: 0; -webkit-transform: translateX(-2000px); transform: translateX(-2000px); } } @keyframes fadeOutLeftBig { 0% { opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } 100% { opacity: 0; -webkit-transform: translateX(-2000px); -ms-transform: translateX(-2000px); transform: translateX(-2000px); } } .fadeOutLeftBig { -webkit-animation-name: fadeOutLeftBig; animation-name: fadeOutLeftBig; } @-webkit-keyframes fadeOutRight { 0% { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } 100% { opacity: 0; -webkit-transform: translateX(20px); transform: translateX(20px); } } @keyframes fadeOutRight { 0% { opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } 100% { opacity: 0; -webkit-transform: translateX(20px); -ms-transform: translateX(20px); transform: translateX(20px); } } .fadeOutRight { -webkit-animation-name: fadeOutRight; animation-name: fadeOutRight; } @-webkit-keyframes fadeOutRightBig { 0% { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } 100% { opacity: 0; -webkit-transform: translateX(2000px); transform: translateX(2000px); } } @keyframes fadeOutRightBig { 0% { opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } 100% { opacity: 0; -webkit-transform: translateX(2000px); -ms-transform: translateX(2000px); transform: translateX(2000px); } } .fadeOutRightBig { -webkit-animation-name: fadeOutRightBig; animation-name: fadeOutRightBig; } @-webkit-keyframes fadeOutUp { 0% { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } 100% { opacity: 0; -webkit-transform: translateY(-20px); transform: translateY(-20px); } } @keyframes fadeOutUp { 0% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } 100% { opacity: 0; -webkit-transform: translateY(-20px); -ms-transform: translateY(-20px); transform: translateY(-20px); } } .fadeOutUp { -webkit-animation-name: fadeOutUp; animation-name: fadeOutUp; } @-webkit-keyframes fadeOutUpBig { 0% { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } 100% { opacity: 0; -webkit-transform: translateY(-2000px); transform: translateY(-2000px); } } @keyframes fadeOutUpBig { 0% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } 100% { opacity: 0; -webkit-transform: translateY(-2000px); -ms-transform: translateY(-2000px); transform: translateY(-2000px); } } .fadeOutUpBig { -webkit-animation-name: fadeOutUpBig; animation-name: fadeOutUpBig; } @-webkit-keyframes flip { 0% { -webkit-transform: perspective(400px) translateZ(0) rotateY(0) scale(1); transform: perspective(400px) translateZ(0) rotateY(0) scale(1); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } 40% { -webkit-transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1); transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } 50% { -webkit-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 80% { -webkit-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95); transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 100% { -webkit-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1); transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } } @keyframes flip { 0% { -webkit-transform: perspective(400px) translateZ(0) rotateY(0) scale(1); -ms-transform: perspective(400px) translateZ(0) rotateY(0) scale(1); transform: perspective(400px) translateZ(0) rotateY(0) scale(1); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } 40% { -webkit-transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1); -ms-transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1); transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } 50% { -webkit-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); -ms-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 80% { -webkit-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95); -ms-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95); transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 100% { -webkit-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1); -ms-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1); transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } } .animated.flip { -webkit-backface-visibility: visible; -ms-backface-visibility: visible; backface-visibility: visible; -webkit-animation-name: flip; animation-name: flip; } @-webkit-keyframes flipInX { 0% { -webkit-transform: perspective(400px) rotateX(90deg); transform: perspective(400px) rotateX(90deg); opacity: 0; } 40% { -webkit-transform: perspective(400px) rotateX(-10deg); transform: perspective(400px) rotateX(-10deg); } 70% { -webkit-transform: perspective(400px) rotateX(10deg); transform: perspective(400px) rotateX(10deg); } 100% { -webkit-transform: perspective(400px) rotateX(0deg); transform: perspective(400px) rotateX(0deg); opacity: 1; } } @keyframes flipInX { 0% { -webkit-transform: perspective(400px) rotateX(90deg); -ms-transform: perspective(400px) rotateX(90deg); transform: perspective(400px) rotateX(90deg); opacity: 0; } 40% { -webkit-transform: perspective(400px) rotateX(-10deg); -ms-transform: perspective(400px) rotateX(-10deg); transform: perspective(400px) rotateX(-10deg); } 70% { -webkit-transform: perspective(400px) rotateX(10deg); -ms-transform: perspective(400px) rotateX(10deg); transform: perspective(400px) rotateX(10deg); } 100% { -webkit-transform: perspective(400px) rotateX(0deg); -ms-transform: perspective(400px) rotateX(0deg); transform: perspective(400px) rotateX(0deg); opacity: 1; } } .flipInX { -webkit-backface-visibility: visible !important; -ms-backface-visibility: visible !important; backface-visibility: visible !important; -webkit-animation-name: flipInX; animation-name: flipInX; } @-webkit-keyframes flipInY { 0% { -webkit-transform: perspective(400px) rotateY(90deg); transform: perspective(400px) rotateY(90deg); opacity: 0; } 40% { -webkit-transform: perspective(400px) rotateY(-10deg); transform: perspective(400px) rotateY(-10deg); } 70% { -webkit-transform: perspective(400px) rotateY(10deg); transform: perspective(400px) rotateY(10deg); } 100% { -webkit-transform: perspective(400px) rotateY(0deg); transform: perspective(400px) rotateY(0deg); opacity: 1; } } @keyframes flipInY { 0% { -webkit-transform: perspective(400px) rotateY(90deg); -ms-transform: perspective(400px) rotateY(90deg); transform: perspective(400px) rotateY(90deg); opacity: 0; } 40% { -webkit-transform: perspective(400px) rotateY(-10deg); -ms-transform: perspective(400px) rotateY(-10deg); transform: perspective(400px) rotateY(-10deg); } 70% { -webkit-transform: perspective(400px) rotateY(10deg); -ms-transform: perspective(400px) rotateY(10deg); transform: perspective(400px) rotateY(10deg); } 100% { -webkit-transform: perspective(400px) rotateY(0deg); -ms-transform: perspective(400px) rotateY(0deg); transform: perspective(400px) rotateY(0deg); opacity: 1; } } .flipInY { -webkit-backface-visibility: visible !important; -ms-backface-visibility: visible !important; backface-visibility: visible !important; -webkit-animation-name: flipInY; animation-name: flipInY; } @-webkit-keyframes flipOutX { 0% { -webkit-transform: perspective(400px) rotateX(0deg); transform: perspective(400px) rotateX(0deg); opacity: 1; } 100% { -webkit-transform: perspective(400px) rotateX(90deg); transform: perspective(400px) rotateX(90deg); opacity: 0; } } @keyframes flipOutX { 0% { -webkit-transform: perspective(400px) rotateX(0deg); -ms-transform: perspective(400px) rotateX(0deg); transform: perspective(400px) rotateX(0deg); opacity: 1; } 100% { -webkit-transform: perspective(400px) rotateX(90deg); -ms-transform: perspective(400px) rotateX(90deg); transform: perspective(400px) rotateX(90deg); opacity: 0; } } .flipOutX { -webkit-animation-name: flipOutX; animation-name: flipOutX; -webkit-backface-visibility: visible !important; -ms-backface-visibility: visible !important; backface-visibility: visible !important; } @-webkit-keyframes flipOutY { 0% { -webkit-transform: perspective(400px) rotateY(0deg); transform: perspective(400px) rotateY(0deg); opacity: 1; } 100% { -webkit-transform: perspective(400px) rotateY(90deg); transform: perspective(400px) rotateY(90deg); opacity: 0; } } @keyframes flipOutY { 0% { -webkit-transform: perspective(400px) rotateY(0deg); -ms-transform: perspective(400px) rotateY(0deg); transform: perspective(400px) rotateY(0deg); opacity: 1; } 100% { -webkit-transform: perspective(400px) rotateY(90deg); -ms-transform: perspective(400px) rotateY(90deg); transform: perspective(400px) rotateY(90deg); opacity: 0; } } .flipOutY { -webkit-backface-visibility: visible !important; -ms-backface-visibility: visible !important; backface-visibility: visible !important; -webkit-animation-name: flipOutY; animation-name: flipOutY; } @-webkit-keyframes lightSpeedIn { 0% { -webkit-transform: translateX(100%) skewX(-30deg); transform: translateX(100%) skewX(-30deg); opacity: 0; } 60% { -webkit-transform: translateX(-20%) skewX(30deg); transform: translateX(-20%) skewX(30deg); opacity: 1; } 80% { -webkit-transform: translateX(0%) skewX(-15deg); transform: translateX(0%) skewX(-15deg); opacity: 1; } 100% { -webkit-transform: translateX(0%) skewX(0deg); transform: translateX(0%) skewX(0deg); opacity: 1; } } @keyframes lightSpeedIn { 0% { -webkit-transform: translateX(100%) skewX(-30deg); -ms-transform: translateX(100%) skewX(-30deg); transform: translateX(100%) skewX(-30deg); opacity: 0; } 60% { -webkit-transform: translateX(-20%) skewX(30deg); -ms-transform: translateX(-20%) skewX(30deg); transform: translateX(-20%) skewX(30deg); opacity: 1; } 80% { -webkit-transform: translateX(0%) skewX(-15deg); -ms-transform: translateX(0%) skewX(-15deg); transform: translateX(0%) skewX(-15deg); opacity: 1; } 100% { -webkit-transform: translateX(0%) skewX(0deg); -ms-transform: translateX(0%) skewX(0deg); transform: translateX(0%) skewX(0deg); opacity: 1; } } .lightSpeedIn { -webkit-animation-name: lightSpeedIn; animation-name: lightSpeedIn; -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } @-webkit-keyframes lightSpeedOut { 0% { -webkit-transform: translateX(0%) skewX(0deg); transform: translateX(0%) skewX(0deg); opacity: 1; } 100% { -webkit-transform: translateX(100%) skewX(-30deg); transform: translateX(100%) skewX(-30deg); opacity: 0; } } @keyframes lightSpeedOut { 0% { -webkit-transform: translateX(0%) skewX(0deg); -ms-transform: translateX(0%) skewX(0deg); transform: translateX(0%) skewX(0deg); opacity: 1; } 100% { -webkit-transform: translateX(100%) skewX(-30deg); -ms-transform: translateX(100%) skewX(-30deg); transform: translateX(100%) skewX(-30deg); opacity: 0; } } .lightSpeedOut { -webkit-animation-name: lightSpeedOut; animation-name: lightSpeedOut; -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } @-webkit-keyframes rotateIn { 0% { -webkit-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(-200deg); transform: rotate(-200deg); opacity: 0; } 100% { -webkit-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(0); transform: rotate(0); opacity: 1; } } @keyframes rotateIn { 0% { -webkit-transform-origin: center center; -ms-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(-200deg); -ms-transform: rotate(-200deg); transform: rotate(-200deg); opacity: 0; } 100% { -webkit-transform-origin: center center; -ms-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); opacity: 1; } } .rotateIn { -webkit-animation-name: rotateIn; animation-name: rotateIn; } @-webkit-keyframes rotateInDownLeft { 0% { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(-90deg); transform: rotate(-90deg); opacity: 0; } 100% { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(0); transform: rotate(0); opacity: 1; } } @keyframes rotateInDownLeft { 0% { -webkit-transform-origin: left bottom; -ms-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(-90deg); -ms-transform: rotate(-90deg); transform: rotate(-90deg); opacity: 0; } 100% { -webkit-transform-origin: left bottom; -ms-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); opacity: 1; } } .rotateInDownLeft { -webkit-animation-name: rotateInDownLeft; animation-name: rotateInDownLeft; } @-webkit-keyframes rotateInDownRight { 0% { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(90deg); transform: rotate(90deg); opacity: 0; } 100% { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(0); transform: rotate(0); opacity: 1; } } @keyframes rotateInDownRight { 0% { -webkit-transform-origin: right bottom; -ms-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(90deg); -ms-transform: rotate(90deg); transform: rotate(90deg); opacity: 0; } 100% { -webkit-transform-origin: right bottom; -ms-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); opacity: 1; } } .rotateInDownRight { -webkit-animation-name: rotateInDownRight; animation-name: rotateInDownRight; } @-webkit-keyframes rotateInUpLeft { 0% { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(90deg); transform: rotate(90deg); opacity: 0; } 100% { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(0); transform: rotate(0); opacity: 1; } } @keyframes rotateInUpLeft { 0% { -webkit-transform-origin: left bottom; -ms-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(90deg); -ms-transform: rotate(90deg); transform: rotate(90deg); opacity: 0; } 100% { -webkit-transform-origin: left bottom; -ms-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); opacity: 1; } } .rotateInUpLeft { -webkit-animation-name: rotateInUpLeft; animation-name: rotateInUpLeft; } @-webkit-keyframes rotateInUpRight { 0% { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(-90deg); transform: rotate(-90deg); opacity: 0; } 100% { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(0); transform: rotate(0); opacity: 1; } } @keyframes rotateInUpRight { 0% { -webkit-transform-origin: right bottom; -ms-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(-90deg); -ms-transform: rotate(-90deg); transform: rotate(-90deg); opacity: 0; } 100% { -webkit-transform-origin: right bottom; -ms-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); opacity: 1; } } .rotateInUpRight { -webkit-animation-name: rotateInUpRight; animation-name: rotateInUpRight; } @-webkit-keyframes rotateOut { 0% { -webkit-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(0); transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(200deg); transform: rotate(200deg); opacity: 0; } } @keyframes rotateOut { 0% { -webkit-transform-origin: center center; -ms-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: center center; -ms-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(200deg); -ms-transform: rotate(200deg); transform: rotate(200deg); opacity: 0; } } .rotateOut { -webkit-animation-name: rotateOut; animation-name: rotateOut; } @-webkit-keyframes rotateOutDownLeft { 0% { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(0); transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(90deg); transform: rotate(90deg); opacity: 0; } } @keyframes rotateOutDownLeft { 0% { -webkit-transform-origin: left bottom; -ms-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: left bottom; -ms-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(90deg); -ms-transform: rotate(90deg); transform: rotate(90deg); opacity: 0; } } .rotateOutDownLeft { -webkit-animation-name: rotateOutDownLeft; animation-name: rotateOutDownLeft; } @-webkit-keyframes rotateOutDownRight { 0% { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(0); transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(-90deg); transform: rotate(-90deg); opacity: 0; } } @keyframes rotateOutDownRight { 0% { -webkit-transform-origin: right bottom; -ms-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: right bottom; -ms-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(-90deg); -ms-transform: rotate(-90deg); transform: rotate(-90deg); opacity: 0; } } .rotateOutDownRight { -webkit-animation-name: rotateOutDownRight; animation-name: rotateOutDownRight; } @-webkit-keyframes rotateOutUpLeft { 0% { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(0); transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(-90deg); transform: rotate(-90deg); opacity: 0; } } @keyframes rotateOutUpLeft { 0% { -webkit-transform-origin: left bottom; -ms-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: left bottom; -ms-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(-90deg); -ms-transform: rotate(-90deg); transform: rotate(-90deg); opacity: 0; } } .rotateOutUpLeft { -webkit-animation-name: rotateOutUpLeft; animation-name: rotateOutUpLeft; } @-webkit-keyframes rotateOutUpRight { 0% { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(0); transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(90deg); transform: rotate(90deg); opacity: 0; } } @keyframes rotateOutUpRight { 0% { -webkit-transform-origin: right bottom; -ms-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: right bottom; -ms-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(90deg); -ms-transform: rotate(90deg); transform: rotate(90deg); opacity: 0; } } .rotateOutUpRight { -webkit-animation-name: rotateOutUpRight; animation-name: rotateOutUpRight; } @-webkit-keyframes slideInDown { 0% { opacity: 0; -webkit-transform: translateY(-2000px); transform: translateY(-2000px); } 100% { -webkit-transform: translateY(0); transform: translateY(0); } } @keyframes slideInDown { 0% { opacity: 0; -webkit-transform: translateY(-2000px); -ms-transform: translateY(-2000px); transform: translateY(-2000px); } 100% { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } } .slideInDown { -webkit-animation-name: slideInDown; animation-name: slideInDown; } @-webkit-keyframes slideInLeft { 0% { opacity: 0; -webkit-transform: translateX(-2000px); transform: translateX(-2000px); } 100% { -webkit-transform: translateX(0); transform: translateX(0); } } @keyframes slideInLeft { 0% { opacity: 0; -webkit-transform: translateX(-2000px); -ms-transform: translateX(-2000px); transform: translateX(-2000px); } 100% { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } } .slideInLeft { -webkit-animation-name: slideInLeft; animation-name: slideInLeft; } @-webkit-keyframes slideInRight { 0% { opacity: 0; -webkit-transform: translateX(2000px); transform: translateX(2000px); } 100% { -webkit-transform: translateX(0); transform: translateX(0); } } @keyframes slideInRight { 0% { opacity: 0; -webkit-transform: translateX(2000px); -ms-transform: translateX(2000px); transform: translateX(2000px); } 100% { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } } .slideInRight { -webkit-animation-name: slideInRight; animation-name: slideInRight; } @-webkit-keyframes slideOutLeft { 0% { -webkit-transform: translateX(0); transform: translateX(0); } 100% { opacity: 0; -webkit-transform: translateX(-2000px); transform: translateX(-2000px); } } @keyframes slideOutLeft { 0% { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } 100% { opacity: 0; -webkit-transform: translateX(-2000px); -ms-transform: translateX(-2000px); transform: translateX(-2000px); } } .slideOutLeft { -webkit-animation-name: slideOutLeft; animation-name: slideOutLeft; } @-webkit-keyframes slideOutRight { 0% { -webkit-transform: translateX(0); transform: translateX(0); } 100% { opacity: 0; -webkit-transform: translateX(2000px); transform: translateX(2000px); } } @keyframes slideOutRight { 0% { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } 100% { opacity: 0; -webkit-transform: translateX(2000px); -ms-transform: translateX(2000px); transform: translateX(2000px); } } .slideOutRight { -webkit-animation-name: slideOutRight; animation-name: slideOutRight; } @-webkit-keyframes slideOutUp { 0% { -webkit-transform: translateY(0); transform: translateY(0); } 100% { opacity: 0; -webkit-transform: translateY(-2000px); transform: translateY(-2000px); } } @keyframes slideOutUp { 0% { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } 100% { opacity: 0; -webkit-transform: translateY(-2000px); -ms-transform: translateY(-2000px); transform: translateY(-2000px); } } .slideOutUp { -webkit-animation-name: slideOutUp; animation-name: slideOutUp; } @-webkit-keyframes slideInUp { 0% { opacity: 0; -webkit-transform: translateY(2000px); transform: translateY(2000px); } 100% { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } } @keyframes slideInUp { 0% { opacity: 0; -webkit-transform: translateY(2000px); -ms-transform: translateY(2000px); transform: translateY(2000px); } 100% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } } .slideInUp { -webkit-animation-name: slideInUp; animation-name: slideInUp; } @-webkit-keyframes slideOutDown { 0% { -webkit-transform: translateY(0); transform: translateY(0); } 100% { opacity: 0; -webkit-transform: translateY(2000px); transform: translateY(2000px); } } @keyframes slideOutDown { 0% { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } 100% { opacity: 0; -webkit-transform: translateY(2000px); -ms-transform: translateY(2000px); transform: translateY(2000px); } } .slideOutDown { -webkit-animation-name: slideOutDown; animation-name: slideOutDown; } @-webkit-keyframes hinge { 0% { -webkit-transform: rotate(0); transform: rotate(0); -webkit-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 20%, 60% { -webkit-transform: rotate(80deg); transform: rotate(80deg); -webkit-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 40% { -webkit-transform: rotate(60deg); transform: rotate(60deg); -webkit-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 80% { -webkit-transform: rotate(60deg) translateY(0); transform: rotate(60deg) translateY(0); -webkit-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; opacity: 1; } 100% { -webkit-transform: translateY(700px); transform: translateY(700px); opacity: 0; } } @keyframes hinge { 0% { -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); -webkit-transform-origin: top left; -ms-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 20%, 60% { -webkit-transform: rotate(80deg); -ms-transform: rotate(80deg); transform: rotate(80deg); -webkit-transform-origin: top left; -ms-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 40% { -webkit-transform: rotate(60deg); -ms-transform: rotate(60deg); transform: rotate(60deg); -webkit-transform-origin: top left; -ms-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 80% { -webkit-transform: rotate(60deg) translateY(0); -ms-transform: rotate(60deg) translateY(0); transform: rotate(60deg) translateY(0); -webkit-transform-origin: top left; -ms-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; opacity: 1; } 100% { -webkit-transform: translateY(700px); -ms-transform: translateY(700px); transform: translateY(700px); opacity: 0; } } .hinge { -webkit-animation-name: hinge; animation-name: hinge; } /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ @-webkit-keyframes rollIn { 0% { opacity: 0; -webkit-transform: translateX(-100%) rotate(-120deg); transform: translateX(-100%) rotate(-120deg); } 100% { opacity: 1; -webkit-transform: translateX(0px) rotate(0deg); transform: translateX(0px) rotate(0deg); } } @keyframes rollIn { 0% { opacity: 0; -webkit-transform: translateX(-100%) rotate(-120deg); -ms-transform: translateX(-100%) rotate(-120deg); transform: translateX(-100%) rotate(-120deg); } 100% { opacity: 1; -webkit-transform: translateX(0px) rotate(0deg); -ms-transform: translateX(0px) rotate(0deg); transform: translateX(0px) rotate(0deg); } } .rollIn { -webkit-animation-name: rollIn; animation-name: rollIn; } /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ @-webkit-keyframes rollOut { 0% { opacity: 1; -webkit-transform: translateX(0px) rotate(0deg); transform: translateX(0px) rotate(0deg); } 100% { opacity: 0; -webkit-transform: translateX(100%) rotate(120deg); transform: translateX(100%) rotate(120deg); } } @keyframes rollOut { 0% { opacity: 1; -webkit-transform: translateX(0px) rotate(0deg); -ms-transform: translateX(0px) rotate(0deg); transform: translateX(0px) rotate(0deg); } 100% { opacity: 0; -webkit-transform: translateX(100%) rotate(120deg); -ms-transform: translateX(100%) rotate(120deg); transform: translateX(100%) rotate(120deg); } } .rollOut { -webkit-animation-name: rollOut; animation-name: rollOut; } @-webkit-keyframes zoomIn { 0% { opacity: 0; -webkit-transform: scale(.3); transform: scale(.3); } 50% { opacity: 1; } } @keyframes zoomIn { 0% { opacity: 0; -webkit-transform: scale(.3); -ms-transform: scale(.3); transform: scale(.3); } 50% { opacity: 1; } } .zoomIn { -webkit-animation-name: zoomIn; animation-name: zoomIn; } @-webkit-keyframes zoomInDown { 0% { opacity: 0; -webkit-transform: scale(.1) translateY(-2000px); transform: scale(.1) translateY(-2000px); -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 60% { opacity: 1; -webkit-transform: scale(.475) translateY(60px); transform: scale(.475) translateY(60px); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } } @keyframes zoomInDown { 0% { opacity: 0; -webkit-transform: scale(.1) translateY(-2000px); -ms-transform: scale(.1) translateY(-2000px); transform: scale(.1) translateY(-2000px); -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 60% { opacity: 1; -webkit-transform: scale(.475) translateY(60px); -ms-transform: scale(.475) translateY(60px); transform: scale(.475) translateY(60px); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } } .zoomInDown { -webkit-animation-name: zoomInDown; animation-name: zoomInDown; } @-webkit-keyframes zoomInLeft { 0% { opacity: 0; -webkit-transform: scale(.1) translateX(-2000px); transform: scale(.1) translateX(-2000px); -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 60% { opacity: 1; -webkit-transform: scale(.475) translateX(48px); transform: scale(.475) translateX(48px); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } } @keyframes zoomInLeft { 0% { opacity: 0; -webkit-transform: scale(.1) translateX(-2000px); -ms-transform: scale(.1) translateX(-2000px); transform: scale(.1) translateX(-2000px); -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 60% { opacity: 1; -webkit-transform: scale(.475) translateX(48px); -ms-transform: scale(.475) translateX(48px); transform: scale(.475) translateX(48px); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } } .zoomInLeft { -webkit-animation-name: zoomInLeft; animation-name: zoomInLeft; } @-webkit-keyframes zoomInRight { 0% { opacity: 0; -webkit-transform: scale(.1) translateX(2000px); transform: scale(.1) translateX(2000px); -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 60% { opacity: 1; -webkit-transform: scale(.475) translateX(-48px); transform: scale(.475) translateX(-48px); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } } @keyframes zoomInRight { 0% { opacity: 0; -webkit-transform: scale(.1) translateX(2000px); -ms-transform: scale(.1) translateX(2000px); transform: scale(.1) translateX(2000px); -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 60% { opacity: 1; -webkit-transform: scale(.475) translateX(-48px); -ms-transform: scale(.475) translateX(-48px); transform: scale(.475) translateX(-48px); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } } .zoomInRight { -webkit-animation-name: zoomInRight; animation-name: zoomInRight; } @-webkit-keyframes zoomInUp { 0% { opacity: 0; -webkit-transform: scale(.1) translateY(2000px); transform: scale(.1) translateY(2000px); -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 60% { opacity: 1; -webkit-transform: scale(.475) translateY(-60px); transform: scale(.475) translateY(-60px); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } } @keyframes zoomInUp { 0% { opacity: 0; -webkit-transform: scale(.1) translateY(2000px); -ms-transform: scale(.1) translateY(2000px); transform: scale(.1) translateY(2000px); -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 60% { opacity: 1; -webkit-transform: scale(.475) translateY(-60px); -ms-transform: scale(.475) translateY(-60px); transform: scale(.475) translateY(-60px); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } } .zoomInUp { -webkit-animation-name: zoomInUp; animation-name: zoomInUp; } @-webkit-keyframes zoomOut { 0% { opacity: 1; -webkit-transform: scale(1); transform: scale(1); } 50% { opacity: 0; -webkit-transform: scale(.3); transform: scale(.3); } 100% { opacity: 0; } } @keyframes zoomOut { 0% { opacity: 1; -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } 50% { opacity: 0; -webkit-transform: scale(.3); -ms-transform: scale(.3); transform: scale(.3); } 100% { opacity: 0; } } .zoomOut { -webkit-animation-name: zoomOut; animation-name: zoomOut; } @-webkit-keyframes zoomOutDown { 40% { opacity: 1; -webkit-transform: scale(.475) translateY(-60px); transform: scale(.475) translateY(-60px); -webkit-animation-timing-function: linear; animation-timing-function: linear; } 100% { opacity: 0; -webkit-transform: scale(.1) translateY(2000px); transform: scale(.1) translateY(2000px); -webkit-transform-origin: center bottom; transform-origin: center bottom; } } @keyframes zoomOutDown { 40% { opacity: 1; -webkit-transform: scale(.475) translateY(-60px); -ms-transform: scale(.475) translateY(-60px); transform: scale(.475) translateY(-60px); -webkit-animation-timing-function: linear; animation-timing-function: linear; } 100% { opacity: 0; -webkit-transform: scale(.1) translateY(2000px); -ms-transform: scale(.1) translateY(2000px); transform: scale(.1) translateY(2000px); -webkit-transform-origin: center bottom; -ms-transform-origin: center bottom; transform-origin: center bottom; } } .zoomOutDown { -webkit-animation-name: zoomOutDown; animation-name: zoomOutDown; } @-webkit-keyframes zoomOutLeft { 40% { opacity: 1; -webkit-transform: scale(.475) translateX(42px); transform: scale(.475) translateX(42px); -webkit-animation-timing-function: linear; animation-timing-function: linear; } 100% { opacity: 0; -webkit-transform: scale(.1) translateX(-2000px); transform: scale(.1) translateX(-2000px); -webkit-transform-origin: left center; transform-origin: left center; } } @keyframes zoomOutLeft { 40% { opacity: 1; -webkit-transform: scale(.475) translateX(42px); -ms-transform: scale(.475) translateX(42px); transform: scale(.475) translateX(42px); -webkit-animation-timing-function: linear; animation-timing-function: linear; } 100% { opacity: 0; -webkit-transform: scale(.1) translateX(-2000px); -ms-transform: scale(.1) translateX(-2000px); transform: scale(.1) translateX(-2000px); -webkit-transform-origin: left center; -ms-transform-origin: left center; transform-origin: left center; } } .zoomOutLeft { -webkit-animation-name: zoomOutLeft; animation-name: zoomOutLeft; } @-webkit-keyframes zoomOutRight { 40% { opacity: 1; -webkit-transform: scale(.475) translateX(-42px); transform: scale(.475) translateX(-42px); -webkit-animation-timing-function: linear; animation-timing-function: linear; } 100% { opacity: 0; -webkit-transform: scale(.1) translateX(2000px); transform: scale(.1) translateX(2000px); -webkit-transform-origin: right center; transform-origin: right center; } } @keyframes zoomOutRight { 40% { opacity: 1; -webkit-transform: scale(.475) translateX(-42px); -ms-transform: scale(.475) translateX(-42px); transform: scale(.475) translateX(-42px); -webkit-animation-timing-function: linear; animation-timing-function: linear; } 100% { opacity: 0; -webkit-transform: scale(.1) translateX(2000px); -ms-transform: scale(.1) translateX(2000px); transform: scale(.1) translateX(2000px); -webkit-transform-origin: right center; -ms-transform-origin: right center; transform-origin: right center; } } .zoomOutRight { -webkit-animation-name: zoomOutRight; animation-name: zoomOutRight; } @-webkit-keyframes zoomOutUp { 40% { opacity: 1; -webkit-transform: scale(.475) translateY(60px); transform: scale(.475) translateY(60px); -webkit-animation-timing-function: linear; animation-timing-function: linear; } 100% { opacity: 0; -webkit-transform: scale(.1) translateY(-2000px); transform: scale(.1) translateY(-2000px); -webkit-transform-origin: center top; transform-origin: center top; } } @keyframes zoomOutUp { 40% { opacity: 1; -webkit-transform: scale(.475) translateY(60px); -ms-transform: scale(.475) translateY(60px); transform: scale(.475) translateY(60px); -webkit-animation-timing-function: linear; animation-timing-function: linear; } 100% { opacity: 0; -webkit-transform: scale(.1) translateY(-2000px); -ms-transform: scale(.1) translateY(-2000px); transform: scale(.1) translateY(-2000px); -webkit-transform-origin: center top; -ms-transform-origin: center top; transform-origin: center top; } } .zoomOutUp { -webkit-animation-name: zoomOutUp; animation-name: zoomOutUp; } .ce_fpSimpleAjaxChange{padding: 5px;background-color: #fff;background-color: rgba(255,255,255,0.5);text-align: center}.ce_fpSimpleAjaxChange h4{display: inline-block;margin: 0;line-height: 20px;margin-right: 0.5em;color: #000}.ce_fpSimpleAjaxChange a{display: inline-block;vertical-align: middle}.ce_fpSimpleAjaxChange span.ajax-toggle{position: relative;display: inline-block;width: 80px;height: 28px;background-color: #A7A7A7;border: 1px solid #999;border-radius: 42px}.ce_fpSimpleAjaxChange .initajax.active span.ajax-toggle{background: #a1c9c7}.ce_fpSimpleAjaxChange span.ajax-toggle:before{content: 'Off';position: absolute;top: 0;left: 18px;color: #fff;width: 40px;text-align: center;font-size: 12px;font-size: .75rem;line-height: 25px}.ce_fpSimpleAjaxChange .active span.ajax-toggle:before{content: 'On'}.ce_fpSimpleAjaxChange span.ajax-toggler{position: absolute;display: inline-block;background: linear-gradient(45deg, #7d7d7d 0%, #dedede 50%);width: 26px;height: 26px;top: 0px;left: 0px;transition: 300ms all;border-radius: 100%}.ce_fpSimpleAjaxChange .active span.ajax-toggler{left: 100%;margin-left: -26px}.flex-wrap.block{display: flex;flex-flow: wrap}.promotion-link{width: 31.3%;margin: 1%}.promotion-link h2{text-align: center;font-size: 1.5rem;margin: 0.5em}.promotion-link input.copyLink{font-size: 1rem;text-align: center}.promotion-link .ce_fpSimpleAjaxChange h4{font-size: 1rem}.promotion-link .ce_image_social{width: 100%;background-color: #f1f1f1;text-align: center;padding: 2px;color: #fafafa}.promotion-link .ce_image_social i{color: #91b5b3}.promotion-link i.fa-facebook-square:hover{color: #3B5998}.promotion-link i.fa-twitter-square:hover{color: #00aced}.promotion-link i.fa-google-plus-square:hover{color: #dd4b39}.promotion-link i.fa-vk.fa-2x:hover{color: #6383A8}.promotion-link .image_container img{width: 100%}.promotion-link .label-c3.label-qr{text-align: center;background: #F1F1F1;padding: 0.5em;display: block}.promotion-link .label-c3.label-qr:hover{background: #357680;color: #fff}@media only screen and (max-width: 767px){.promotion-link{width: 48.0%;margin: 1%}.promotion-link h2{font-size: 1.2rem}}@media only screen and (max-width: 481px){.promotion-link{width: 100%;margin: 1em}}.checkbox_tree .daredevel-tree{padding: 0.5em}.checkbox_tree ul.level_1 ul{margin-left: 21px;border-left: 3px solid #809580}.checkbox_tree li{padding: 1px 0}.checkbox_tree input{margin-left: 10px}.checkbox_tree span.daredevel-tree-anchor{display: inline-block;width: 21px;height: 21px;background-color: #357680}.checkbox_tree span.daredevel-tree-anchor:before{content: '+';display: block;line-height: 21px;text-align: center;color: #fff;cursor: pointer;font-size: 1rem}.checkbox_tree .expanded > span.daredevel-tree-anchor:before{content: '-'}.checkbox_tree .leaf > span.daredevel-tree-anchor:before{content: '+';visibility: hidden}.checkbox_tree span.daredevel-tree-label{display: inline-block}.cropper{width: 50%}.img-preview{width: 250px;overflow: hidden} body {padding-top: 0;} html, body{ overflow-x: hidden; } .servicebox:before {margin: 0em !important}; .nocheck label:before { display: none !important; } .colorbox .subheadline_h1 { color: #fff; } .anschreiben .servicebox_2::before { font-size: 4em; margin: 1em; } .anschreiben .servicebox_2 { margin: auto; padding: 0; } .ce_colorbox h1 { color: #fff; } .nocheck label{padding-left: 1em;} /*Umfrage*/ input[type="checkbox"] ,input[type="radio"] { opacity: 0; display: none; } .noradio .radio_container label:before { display: none; } input.submit { display: -webkit-box; width: 100% !important; font-size: 1.5em; } @media only screen and (max-width: 1200px){ .checkbox label, .radio_container label { font-size: 1.5rem; } } @media only screen and (max-width: 767px){ .checkbox label, .radio_container label { font-size: 1.3rem; }#container { padding-left: 1em; padding-right: 1em; } } @media only screen and (max-width: 480px){ .checkbox label, .radio_container label { font-size: 1.0rem; margin: 0.5rem 0; }} /*Einstieg*/ .ce_form .flex .widget {margin-bottom: 10px;} .widget label { display: none; } .inline { display: -webkit-box; } .ce_form .flex .widget { width: 32%; } .wrp_street, .wrp_city { width: 70% !important; } .wrp_nr, .wrp_postal { width: 28% !important; } .button { white-space: inherit; } @media only screen and (max-width : 768px){ .ce_form .flex .widget { width: 49%; } } @media only screen and (max-width : 480px){ .ce_form .flex .widget { width: 100%; } } .fa.fullscreen { background: #ccccccbd; padding: 0.2em; font-size: 1.5em; opacity: 0.5; position: absolute; z-index: 999; margin: 0.5em; display: none; border-radius: 2px; } .video.expand:hover .fa.fullscreen {display: block;} .expand.active { position: fixed; z-index: 999; top: 0; left: 0; width: 100vw; height: 100vh; } .ce_video_background video {width: 100%} .ce_video_background { position: relative; overflow: hidden; } .ce_video_background .ce_video_background_inside { position: relative; z-index: 10 } .ce_video_background .video { position: absolute; top: 50%; left: 50%; z-index: 1; min-width: 100%; min-height: 100%; width: auto; height: auto; max-width: 1206px; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .ce_video_background .video-overlay { opacity: 0.50; position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 2; background: rgba(146, 205, 80, 1); } .pt-xxl{padding-top:170px!important;}.pt-xl{padding-top:150px!important;}.pt-l{padding-top:120px!important;}.pt-m{padding-top:100px!important;}.pt-s{padding-top:90px!important;}.pt-xs{padding-top:50px!important;}.pt-xxs{padding-top:30px!important;} .pb-xxl{padding-bottom:170px!important;}.pb-xl{padding-bottom:150px!important;}.pb-l{padding-bottom:120px!important;}.pb-m{padding-bottom:100px!important;}.pb-s{padding-bottom:90px!important;}.pb-xs{padding-bottom:50px!important;}.pb-xxs{padding-bottom:30px!important;} @media only screen and (min-device-width : 768px) and (max-device-width : 1024px) { .pt-xxl{padding-top:130px!important;}.pt-xl{padding-top:110px!important;}.pt-l{padding-top:100px!important;}.pt-m{padding-top:80px!important;}.pt-s{padding-top:70px!important;}.pt-xs{padding-top:40px!important;}.pt-xxs{padding-top:30px!important;} .pb-xxl{padding-bottom:130px!important;}.pb-xl{padding-bottom:110px!important;}.pb-l{padding-bottom:100px!important;}.pb-m{padding-bottom:80px!important;}.pb-s{padding-bottom:70px!important;}.pb-xs{padding-bottom:40px!important;}.pb-xxs{padding-bottom:30px!important;} } @media only screen and (max-width: 767px) { .pt-xxl{padding-top:80px!important;}.pt-xl{padding-top:70px!important;}.pt-l{padding-top:70px!important;}.pt-m{padding-top:60px!important;}.pt-s{padding-top:50px!important;}.pt-xs{padding-top:40px!important;}.pt-xxs{padding-top:30px!important;} .pb-xxl{padding-bottom:80px!important;}.pb-xl{padding-bottom:70px!important;}.pb-l{padding-bottom:70px!important;}.pb-m{padding-bottom:60px!important;}.pb-s{padding-bottom:50px!important;}.pb-xs{padding-bottom:40px!important;}.pb-xxs{padding-bottom:30px!important;} } /*anmeldung*/ .timedContentBox.banner { top: auto; background: #92cd50; margin-top: -7em; position: fixed; overflow: hidden; } .timedContentBox.banner.active{ bottom: 0px; transition: all 1s; } .tc_inside .submit a:before{ animation: pulse 2s infinite;} @keyframes pulse { 0% { font-size:1em; } 70% {font-size:2em; } 100% { font-size:2em; } } .tcb_article { max-height: 100vh; overflow-y: auto; position: fixed; } .timedContentBox.banner .tc_inside { background: none; } .banner a { background: #ffa30a; color: #fff; padding-left: 3em !important; font-size: 2em !important; padding-right: 1em !important; margin: 0 !important; } .banner a:hover { background: #92cd50; } button.button.next.previous.small.left { background: none; } button.submit.button.next.nextblock:disabled { opacity: 0.5; cursor: no-drop; } .p1 span, .p1 button { height: auto; max-height:100px; opacity: 1; transition: all 0.5s; } .radio_container input { position: absolute; } .p1.deactive span:not(.show), .p1.deactive button { max-height:0px; opacity: 0; padding: 0; margin: 0; } .p2.deactive { max-height: 0; height: 0; opacity: 0; visibility: hidden; transition: all 0.5s; } .p2 { height: auto; max-height: 500px; overflow: hidden; transition: max-height 0.5s ease-in-out; } .p1.deactive span.show { display: block; opacity: 1; max-height:100px; height: auto; } #msform fieldset{ border: none; padding: 0; margin: 0; } div#msform { border: 1px solid #ccc; padding: 14px; box-shadow: 1px 4px 14px #ccc; max-width: 400px; margin: 50px auto; text-align: center; position: relative; } .radio_container label, .checkbox_container label { background: #f0f0f0; border-bottom: 2px solid #fff; } .radio_container label, .checkbox_container label { background: #f0f0f0; border-bottom: 2px solid #fff; } button.submit { background: #F18F4E; color: #fff; width: 100%; } .button:hover, submit a:hover { background: #92cd50; } #msform button.button.previous.small.left#msform { border: none; } input[type="checkbox"]:checked + label, input[type="radio"]:checked + label { background: rgba(146, 205, 80, 1); color: #fff; } .radio_container input[type=radio]:checked + label:before { color: #fff !important; } /*Hide all except first fieldset*/ /*inputs*/ /*buttons*/ #msform button.button.previous.small.left { border: none; } #msform .p2 label { display: none; } .input-wrapper.block {width: 100%;} /*headings*/ /*webinar*/ .videocontainer { width: calc(100% - 250px); } .timedContentBox { width: 100%; position: absolute; top: 0; z-index: 1000; left: 0; bottom: 0; background: #ccc; right: 0; } .tc_inside { background: #fff; max-width: 1290px; margin: auto; padding: 1em; } .wblist a { font-size: 2em; background: #e8e8e8; /* width: 1em; */ display: block; padding: 0.5em; text-align: center; } .wblist a:hover { background: rgba(146, 205, 80, 1); color: #fff;} .video { background: #000; } .timedContentBox iframe { width: 100%; height: 100%; } .videocontainer video { max-height: 100vh; } .overlay { position: absolute; z-index: 999999; left: 0; right: 0; top: 0; bottom: 0; } .wmenu { width: 250px; } .webinarcontainer { display: -webkit-box; position: relative; min-height: 100vh; } .countdown { position: relative; } .overlay_back { background: url(../../files/img/start-image.jpg) bottom right no-repeat; background-size: cover; position: fixed; -webkit-background-size: cover; height: 100%; width: 100%; } .countdown_head { padding: 10px; text-align: center; padding-top: 15px; margin: auto; display: block; width: fit-content; background: rgba(204, 204, 204, 0.32); } .countdown_head h3 {text-transform: uppercase;color: #fff;margin-bottom: 0;} .timer .timer-wrapper { display: inline-block; margin: 2vw; } .timer .timer-wrapper .time { font-size: 5vw; font-weight: bold; color: #ffffff; line-height: 1em; } .timer .timer-wrapper .text { font-size: 2vw; color: rgba(255, 255, 255, 0.6); } .wenuetoggler { background: #779780; color: #fff; text-align: center; } .wenuetoggler .fa::before { content: "\f101"; } .menueoff .wenuetoggler .fa::before { content: "\f100"; } .menueoff .videocontainer { width: calc(100% - 63px); } .menueoff .wmenu { width: 63px; } span.togglemute { position: absolute; top: 0; height: 100%; width: 100%; cursor: pointer; text-align: center; } .togglemute i { font-size: 8em; } span.togglesymbole { display: inline-block; width: 15em; height: 15em; background: rgba(68, 68, 68, 0.77); border-radius: 100%; color: #fff; margin-top: 10%; } .mobile .togglemute.visible { display: block !important; } /*Tabs*/ ul.tabs{ margin: 10px 0 0 0; padding: 0px; list-style: none; } ul.tabs li{ background: none; color: #222; display: inline-block; cursor: pointer; width: 64px; text-align: center; } ul.tabs li.current{ background: #ededed; color: #222; } .tab-content{ display: none; background: #ededed; } .tab-content.current{ display: inherit; } ul.tabs i { color: #779780; font-size: 2.2em; } ul.tabs p { font-size: 0.8em; } .menueoff .tab-content { display: none; } .chatuser {display:none;} .flip {display:block;} span#displayCount { position: absolute; font-size: 10px; background: #C94444; border-radius: 100%; height: 2.0em; line-height: 1.9em; width: 2.0em; margin-top: 22px; color: #fff; margin-left: -6px; font-family: arial; } .tab-content.default { height: 570px; overflow: auto; padding: 1em; } .chatuser i { padding-right: 9px; } /*chat*/ .chat { position: relative; /* top: 50%; left: 50%; transform: translate(-50%, -50%);*/ width: 100%; height: calc(100% - 15px); max-height: 500px; z-index: 10; overflow: hidden; /*box-shadow: 0 5px 30px rgba(0, 0, 0, .2);*/ /* background: rgba(0, 0, 0, .5);*/ background: transparent; border-radius: 20px; -webkit-border-radius: 20px; -moz-border-radius: 20px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } /*-------------------- Chat Title --------------------*/ .chat-title { -webkit-box-flex: 0; -ms-flex: 0 1 45px; flex: 0 1 45px; position: relative; z-index: 2; width: 100%; border-bottom: 1px solid #ccc; color: #777; padding-bottom: 5px; background-color: #fff; text-transform: uppercase; text-align: center; } . } .chat-title .avatar { position: absolute; z-index: 1; top: 8px; left: 9px; border-radius: 30px; width: 60px; height: 60px; overflow: hidden; margin: 0; padding: 0; border: 1px solid #fff; } .chat-title .avatar img { width: 100%; height: auto; } /*-------------------- Messages --------------------*/ .messages { position: relative; width: 100%; display: block; min-height: 455px;} .messages .messages-content { position: absolute; top: 0; left: 0; height: 101%; width: 100%; } .messages .message { clear: both; float: left; padding: 6px 10px 7px; border-radius: 20px 20px 20px 0; background: #86BB71; margin: 8px 0; color: #fff; font-size: 14px; line-height: 1.4; margin-left: 5px; position: relative; border: 1px solid #ccc;} .messages .message .timestamp { position: absolute; bottom: -15px; font-size: 10px; color: #555; right: 30px; /* color: rgba(255, 255, 255, .7);*/ } .messages .message .checkmark-sent-delivered { position: absolute; bottom: -15px; right: 10px; font-size: 12px; color: #999; } .messages .message .checkmark-read { color: blue; position: absolute; bottom: -15px; right: 16px; font-size: 12px; } .messages .message .avatar img { width: 100%; height: auto; } .messages .message.message-personal { float: right; text-align: right; background: #94C2ED; border-radius: 20px 20px 0px 20px; } .messages .message:last-child { margin-bottom: 30px; } .messages .message.new { } .messages .message.loading::before { position: relative; /* top: 50%; left: 50%; transform: translate(-50%, -50%);*/ content: ''; display: block; width: 5px; height: 5px; border-radius: 50%; /* background: rgba(255, 255, 255, .5);*/ background: #888; z-index: 2; margin-top: 4px; -webkit-animation: ball 0.45s cubic-bezier(0, 0, 0.15, 1) alternate infinite; border: none; -webkit-animation-delay: .15s; } .messages .message.loading span { display: block; font-size: 0; width: 20px; height: 10px; position: relative; } .messages .message.loading span::before { position: relative; content: ''; display: block; width: 5px; height: 5px; border-radius: 50%; background: #888; z-index: 2; margin-top: 4px; -webkit-animation: ball 0.45s cubic-bezier(0, 0, 0.15, 1) alternate infinite; animation: ball 0.45s cubic-bezier(0, 0, 0.15, 1) alternate infinite; margin-left: -7px; } .messages .message.loading span::after { position: relative; display: block; width: 5px; height: 5px; border-radius: 50%; background: #888; z-index: 2; margin-top: 4px; -webkit-animation: ball 0.45s cubic-bezier(0, 0, 0.15, 1) alternate infinite; margin-left: 7px; -webkit-animation-delay: .3s; } /*-------------------- Message Box --------------------*/ .message-box { -webkit-box-flex: 0; -ms-flex: 0 1 42px; flex: 0 1 42px; width: 90%; background: #fff; margin: 2px auto; padding: 10px; position: relative; border-radius: 20px; height: 14px; border: 1px solid #ccc; } .message-box .message-input { background: none; border: none; outline: none !important; resize: none; font-size: 15px; height: 24px; margin: 0; padding-right: 20px; max-width: 265px; color: #444; min-height: unset; padding: 0; overflow:auto; } .message-box textarea:focus:-webkit-placeholder { color: transparent; } .message-box .message-submit { position: absolute; top: 9px; right: 10px; color: #4A90E2; border: none; background: #fff; text-transform: uppercase; line-height: 1; padding: 6px 10px; border-radius: 5px; outline: none !important; cursor: pointer;} .message-box .message-submit:hover { background: #fff; color: #333; } /*-------------------- Custom Srollbar --------------------*/ .mCSB_scrollTools { margin: 1px -3px 1px 0; opacity: 0; } .mCSB_inside > .mCSB_container { margin-right: 0px; padding: 0 10px; } .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { background-color: rgba(0, 0, 0, 0.5) !important; } /*-------------------- Bounce --------------------*/ @-webkit-keyframes ball { from { -webkit-transform: translateY(0) scaleY(0.8); transform: translateY(0) scaleY(0.8); } to { -webkit-transform: translateY(-10px); transform: translateY(-10px); } } @keyframes ball { from { -webkit-transform: translateY(0) scaleY(0.8); transform: translateY(0) scaleY(0.8); } to { -webkit-transform: translateY(-10px); transform: translateY(-10px); } } .avenue-messenger { height: calc(100% - 60px) !important; max-height: 530px !important; background: rgba(255, 255, 255, 0.9); right: 20px; bottom: 20px; } .avenue-messenger div.agent-face { left: 0; right: 0; margin: auto; } .avenue-messenger div { font-size: 14px; color: #232323; } .circle { display: block; width: 80px; height: 80px; margin: 1em auto; background-size: cover; background-repeat: no-repeat; background-position: center center; border-radius: 99em; border: 2px solid #fff; /*#4A90E2;*/ /* -webkit-box-shadow: 0px 0px 10px rgba(0,0,0,.8); -moz-box-shadow: 0px 0px 10px rgba(0,0,0,.8); box-shadow: 0px 0px 10px rgba(0,0,0,.8);*/ } @media (max-width: 800px) { .videocontainer { width: 100% !important; } .wmenu { width: 100% !important; } .webinarcontainer { display: block; } .messages { /* overflow: auto; */ min-height: 20vh; } } img { -moz-user-select: none; -webkit-user-select: none; -ms-user-select: none; user-select: none; -webkit-user-drag: none; user-drag: none; -webkit-touch-callout: none; } .vh100 { min-height: 100vh; } .off_c_nano{ position: relative; height: 100vh; } .margin-mobile-top { height: 4em; background: #fff; } #footer { display: none; } body .logo { background-image: none} .ce_revolutionslider .ce_hyperlink a { background:rgba(146, 205, 80, 1); } .ce_text p a:not(.button) { color:rgba(146, 205, 80, 1); } .color { color:rgba(146, 205, 80, 1); } .bg_color { background-color:rgba(146, 205, 80, 1); } .articlewrapper.typ4 .ce_hyperlink a:hover { background:rgba(146, 205, 80, 1); } .bx-wrapper .bx-pager.bx-default-pager a.active { background:rgba(146, 205, 80, 1); } nav.mainmenu ul li a:hover, nav.mainmenu ul a.trail, nav.mainmenu ul a.active { color:rgba(146, 205, 80, 1); } #submenu a:hover, #submenu a.* { color:rgba(146, 205, 80, 1); } .no_margin{margin:0;} .pushy a { color: #FFF;} } .servicebox[class*="icon-"]:before { margin: 0 0 5px 0; } span.open_subnav { position: absolute; right: 20px; width: 2em; height: 3em; margin-top: 5px; z-index: 99; opacity: 0; cursor: pointer; } #off_canvas { background: rgba(146, 205, 80, 1);} #off_canvas a:hover, #off_canvas a.active, #off_canvas a.trail { color:#E6DEB0; } .ce_hyperlink.style2_dark a:hover { background:rgba(146, 205, 80, 1); border-color:rgba(146, 205, 80, 1); } .testimonial .autor { color:rgba(146, 205, 80, 1); } .ce_team .funktion { color:rgba(146, 205, 80, 1); } .ce_team .overlay_content { background:rgba(146, 205, 80, 1); } .ce_blog .blog .comments a, .ce_blog .blog .morelink { color:rgba(146, 205, 80, 1); } .ce_blog .morelink a:hover { color:rgba(146, 205, 80, 1); } .ce_blog .port_overlay { background:rgba(146, 205, 80, 1); } .ce_preistabelle .titel { background:rgba(146, 205, 80, 1); } .ce_preistabelle .link { background:rgba(146, 205, 80, 1); } .pagination li span.current { background:rgba(146, 205, 80, 1); } .pagination li a:hover { color:rgba(146, 205, 80, 1); } .servicebox a:hover { color:rgba(146, 205, 80, 1); } .servicebox_2 h1, .servicebox_2 h2, .servicebox_2 h3, .servicebox_2 h4, .servicebox_2 h5, .servicebox_2 h6 { color:rgba(146, 205, 80, 1); } .servicebox_4:hover { border-color: rgba(146, 205, 80, 1); } .servicebox_2[class^="icon-"]:before, .servicebox_2[class*="icon-"]:before { color: rgba(146, 205, 80, 1); } .portfolioliste .port_overlay { background:rgba(146, 205, 80, 1); } .customelement_layout_charts span.prozent { color:rgba(146, 205, 80, 1); } .backgroundvideo.overlay .backgroundvideo_content_wrapper { background:rgba(146, 205, 80, 1); } .mod_faqpage section h3::before { background:rgba(146, 205, 80, 1); } .tabs.horizontal_clean ul li a:hover, .tabs.horizontal_clean ul li a.current { background:rgba(146, 205, 80, 1); } .servicebox_3[class^="icon-"]:before, .servicebox_3[class*="icon-"]:before { background:rgba(146, 205, 80, 1); } .servicebox.color_accent[class^="icon-"]:before, .servicebox.color_accent[class*="icon-"]:before { background:rgba(146, 205, 80, 1); } .articlewrapper.typ2 { background: rgba(146, 205, 80, 1); } #header .mod_search input:not(.captcha) { background: rgba(0,0,0,0.0); } #header .search_trigger:hover { color: rgba(146, 205, 80, 1); } .ce_revolutionslider .border-left { border-color: rgba(146, 205, 80, 1); } .nachrichtenteaser .morelink a:hover { color: rgba(146, 205, 80, 1); } .button, .ce_hyperlink a { border-color: rgba(146, 205, 80, 1); } a.button , .ce_hyperlink a { padding: 3px 18px; line-height: 2.5em; } input[type="submit"], input.submit { background: rgba(146, 205, 80, 1); } .button, .ce_hyperlink a { color: #fff;); } .metaheader .sprachwechsler span:hover { color: rgba(146, 205, 80, 1); } .blogwrapper_col1 .comments a, .ce_blog .blog .morelink { color: rgba(146, 205, 80, 1); } .ce_revolutionslider .bg_accent { background: rgba(146, 205, 80, 1); } .servicebox.color_turquoise:before { background-color: #f18f4e; } #footer { border-color: rgba(146, 205, 80, 1); } .nachrichtenteaser_v2 .date { background-color: rgba(146, 205, 80, 1); } .nachrichtenliste .subline { border-color: rgba(146, 205, 80, 1); } .divider_2 .ext_txtpic_headline h1:before, .divider_2 .ext_txtpic_headline h2:before, .divider_2 .ext_txtpic_headline h3:before, .divider_2 .ext_txtpic_headline h4:before, .divider_2 .ext_txtpic_headline h5:before, .divider_2 .ext_txtpic_headline h6:before { background-color: rgba(146, 205, 80, 1); } #footer, #footer a { color: #eec2be; } #footer .socials a:before { color: #eec2be; } #footer input, #footer textarea { border-color: #eec2be; } #footer input.submit { border-color: #eec2be; color: #eec2be; } #footer *::-webkit-input-placeholder { color: #eec2be; } #footer *:-moz-placeholder { color: #eec2be; } #footer *::-moz-placeholder { color: #eec2be; } #footer *:-ms-input-placeholder { color: #eec2be; } #footer input.submit { background: #b94837; } #footer { border-color: #b94837; } #contentwrapper { box-shadow: 0 0 4px rgba(0, 0, 0, 0.2); } #header, #stickyheader .inside, nav.mainmenu .layer_two, nav.mainmenu .level_3 { background: #fff; } nav.mainmenu > ul li a { color: #393939; } .menu-btn-inside .line:before, .menu-btn-inside .line:after, .menu-btn-inside .line { background: #393939; } .metaheader .search_trigger { color: #393939; } #stickyheader .inside { background: #fff; } .metaheader .socials a:before { color: #393939; } .metaheader .search_trigger { color: #393939; } .metaheader .sprachwechsler span { color: #393939; } nav.mainmenu ul ul li a { color: #393939; } .metaheader .sprachwechsler ul li a { color: #393939; background: #fff; } .metaheader .inside:before { background: rgba(0,0,0,0.1); } #header .metaheader .search_trigger, #header .metaheader .mod_search { display: none; } #header .metaheader .socials { display: none; } #footer { background: rgba(146, 205, 80, 1); } #bottom { background: #f18f4e; } #bottom, #bottom a, #bottom .ce_hyperlink a { color: #f7f7f7; } #contentwrapper { max-width: 100%; } .flex .formbody { display: flex; flex-wrap: wrap; align-items: flex-end; } .flex, #cfe_page_2 fieldset>div { display: flex; flex-wrap: wrap; justify-content: space-between; } .flex.around { justify-content: space-around; } input{ padding:8px;} #off_canvas a:hover { background: #8D9F8D; } .inav { margin-left: 1em; display: inline-block; } .inav nav { z-index: 999999; background: #fff; position:absolute; left:0; visibility:hidden; opacity:0; filter:alpha(opacity=0); transition:200ms ease; } .openicon span { line-height: 3em; height: 2.7em; display: inline-block; vertical-align: bottom; padding: 0 0px 0px 0.5em; font-size: 1.2em; } .inav:hover nav { visibility:visible; opacity:1; filter:alpha(opacity=100); } .inav a, { color: #666; font-family: 'Ubuntu', Arial, sans-serif; } .inav a:before { font-family: FontAwesome !IMPORTANT; } .inav li { padding: 0.5em 2em; } .inav li:hover { background: #F7F7F7; } i.openicon { color: rgba(146, 205, 80, 1); } button.submit, .submit a { font-size: 1.2rem; line-height: 2em; padding: 0 2em 0 3em; border: 2px solid; margin: 1em 0; cursor: pointer; position: relative; font-family: Arial; } button.submit:hover:before, .submit a:hover:before { font-size: 3em; line-height: 0.6em; left: 0.2em; opacity: 0.5; } button.submit.back:before { content: "\f100"; } button.submit.edit:before { content: "\f044"; } button.submit.save:before { content: "\f0c7"; } button.submit.trash:before { content: "\f014"; } button.submit.userplus:before { content: "\f234"; } button.submit.usergroup:before { content: "\f0c0"; } button.submit.cancel:before, .submit.cancel a:before { content: "\f00d"; } button.red, .submit.red a { color: #C97474; } button.red:hover, .submit.red a:hover { background: #C97474; color:#fff; } vf00d .mod_ti_fe_check input, .mod_ti_fe_check select { font-size: 0.8em; } .button:hover, submit a:hover { border: 2px solid #B5B5B5; color:#fff; } button.submit:before, .submit a:before { content: "\f101"; font: normal normal normal 14px/1 FontAwesome; line-height: 1.3em; font-size: 1.4em; display: inline-block; position: absolute; left: 1em; } .left{ float:left; } .right{ float:right;} input, select, textarea { border-bottom-width: 2px; } input:focus, select:focus, textarea:focus { border-bottom: 2px solid rgba(146, 205, 80, 1); transition: border-bottom 1s; } #off_canvas .level_1 a:before { background: #FFF; color: rgba(146, 205, 80, 1); padding: 5px; border-radius: 100%; } #off_canvas a.submenu:after { content: "\f101"; font-family: FontAwesome;} #off_canvas li.open > a.submenu:after { content: "\f103"; } .pde_invisible { display: none; } .w100 {width: 100%;} .w100i {width: 100% !important;} .pushy-active .site-overlay { background: rgba(204, 204, 204, 0.56); } /* forms */ .radio_container label:before, .checkbox_container label:before { content: "\f10c"; font-family: FontAwesome; font-size: 1.3em; display: inline-block; color: #666; width: 1.3em; } .radio_container input[type=radio]:checked + label:before, .checkbox_container input[type=checkbox]:checked + label:before{ content: "\f192"; color: rgba(146, 205, 80, 1); } .checkbox_container label:before { content: "\f096";} .checkbox_container input[type=checkbox]:checked + label:before, input[type=checkbox]:checked + label:before{ content: "\f046"; } .wrp_agb .checkbox_container input[type=checkbox]:checked + label:before { color: #fff; } input[type="checkbox"]:checked + label a { color: #fff; } .radio_container label, .checkbox_container label { display: inline-block; cursor: pointer; position: relative; width: 100%; font-size: 1.2em; line-height: 2em; padding: 0 0px 0 10px; } input.radio, input.checkbox, #ce_popup_checkbox { opacity: 0; } .mod_lr_calendar_fe input.radio, .mod_lr_calendar_fe input.checkbox { position:absolute; } #bottom h6 { color: #fff; } /* extern */ .extern #contentwrapper { max-width: 100%; } .extern #container { background: none; } .mittig img { margin: auto; } #main .mod_login { border: none; background: none; } .extern_home input { border-radius: 23px; text-align: center; } .extern_home ::-webkit-input-placeholder { color: #fff; } .extern_home input:-moz-placeholder { /* Firefox 18- */ color: fff; } .extern_home input::-moz-placeholder { color: #fff; } .extern_home input:-ms-input-placeholder { color: fff; } .extern_home input:not(.submit){background-color: rgba(0, 0, 0, 0); color: #fff;} .extern_home input:focus { border-bottom: 2px solid #CED1CE; background: rgba(204, 204, 204, 0.22); } .extern_home .checkbox_container input:checked + label:before { color: #FFF; } .extern_home button { background: rgba(0, 0, 0, 0); border: 1px solid #fff; color: #fff; border-radius: 20px; } .typ2 a{color:#fff;} .register.articlewrapper.typ2 { background: #f18f4e; } .mod_fpac_control { padding: 30px; max-width: 350px; margin: 0 auto; } .mod_registration.block { background: none; border: none; box-shadow: none; } .extern p.error { background: #C97474; color: #fff; padding: 1em; }. extern span.mandatory { display: inline; } .extern .margin-mobile-top { height: 0; } .rs_dark .textarea { background: rgba(58, 58, 58, 0.52); padding: 0 4em !important; } /* Home .mod_newslist.home_news .title { top: -77px !important; } .mod_newslist.home_news .content { height: 0 !important; } */ }.home_wrapper #container { background: #fff; } .home_overv .ce_iconbox-version-1 .servicebox[class^="icon-"]:before, .servicebox[class*="icon-"]:before { padding: 28px; margin-bottom: 5px; } .iconbox_content p { padding: 0 1em; display: block; } /* Jquerry slider */ .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; -ms-touch-action: none; touch-action: none; } .ui-slider .ui-slider-range { position: absolute; z-index: 1; font-size: .7em; display: block; border: 0; background-position: 0 0; } #off_canvas figure.image_container{ margin-bottom:-2em;} .magin1 { margin: 1em; } .no_lable>label { display: none; } .br_1 br{ display: block;} .bxslider { display: flex; } .ce_colorbox.block { display: flex; } .dateajax input{ position:absolute; display:block !important; opacity:0; } li.tab_more_sixth a:hover { background: rgba(146, 205, 80, 1); color: #fff; } .tab_more_sixth a.current { background: rgba(146, 205, 80, 1); color: #fff; } /* Confirmation & errors */ p.inline-error, p.message { background: #8D9F8D; padding: 1em 1em 1em 4em; color: #fff; position: relative; } p.inline-error:before, p.message:before { content: "\f05a"; font: normal normal normal 1.5em/1 FontAwesome; position: absolute; left: 1em; } p.inline-error { background: #C97474; } p.inline-error:before { content: "\f071"; } .icons i { font-size: 1.5em; color: #fff; background: rgba(146, 205, 80, 1); border-radius: 100%; width: 1.8em; height: 1.8em; line-height: 1.8em; text-align: center; } span.attend { position: absolute; font-size: 0.5em; background: #C94444; border-radius: 100%; height: 2.0em; line-height: 1.9em; width: 2.0em; margin-top: -8px; margin-left: -6px; font-family: arial; } .mod_eventlist.block { overflow: visible; } /* Nachrichten-liste */ /* Boxslider */ .bx-wrapper .bx-controls-direction { width: 100%; height: 100%; } .bx-wrapper .bx-controls-direction a { opacity: 0.5; width: 26px; height: 50px; } .bx-wrapper .bx-controls-direction a:hover { opacity: 0.9; width: 50px; } /* Sprachwechsler */ .sprachwechsler ul li a { background: #F1F1F1; color: #7A7C83; font-size: 1em;} .sprachwechsler span { cursor: pointer; color: #fff; display: block; padding:0 1em; } #off_canvas .sprachwechsler { border-color: #fff; } .sprachwechsler span:hover { background: #8D9F8D; color: #fff; } /* Infoboxen */ .ce_fp_infobox .close a, .close.coltogclose { position: absolute; right: 0px; background: rgba(146, 205, 80, 1); color: #fff; margin-top: -3px; padding: 0.5em; cursor:pointer; } .ce_fp_infobox.block .ce_text { border: 2px solid rgba(146, 205, 80, 1); padding: 1em 1em 1em 6em; } .ce_fp_infobox.block .ce_text:before { content: "\f05a"; font: normal normal normal 3em/1 FontAwesome; position: absolute; left: 0.8em; color: rgba(146, 205, 80, 1); } span.tooltip:after { display: none; } .ce_fp_infobox.block { position: relative; } /*Public events*/ /* Kontaktbörse */ /* Tabimporter */ @media only screen and (min-width: 766px){ div#wrap_home-sidebar { padding: 0 15px; } body.sidebar_right #right .inside { padding-left: 0; } body.sidebar_right #right { margin: 0; width: 30%; } .home_col .ym-g50 { width: 100%; } } /* Datei-upload */ /*Social Boost*/ /*Video Liste*/ .breadcrumb li { display: -webkit-inline-box; list-style: inherit; } .breadcrumb a{ color: #fff; text-decoration: underline; } .breadcrumb li:before { content: "\f101"; font: normal normal normal 14px/1 FontAwesome; margin-left: 1em; } span.socials.thank a:before { font-size: 3em; height: 38px; width: 50px; padding: 20px; } span.socials.thank { text-align: center; } .socials a.icon-twitter-3:hover { background: #5EAADE!important; } .socials a.icon-facebook-rect-2:hover { background: #3365A4!important; } .socials a.icon-google:hover { background: #D00!important; } /* ============================================================================= * ce_popup * ========================================================================== */ @media only screen and (max-width: 767px){ table { font-size: 10px; } .filter li { width: 48%; float: left; margin: 2px; } #cfe_page_2 fieldset span, .mod_eventlist .event_block, .download_item { width: 48%; } #gmap { height: 300px; } #nav-open-btn{ top: 20px !important; right: 43px !important; } .info_cell label { font-size: 1.3em; } .home_overv .ce_iconbox-version-1 .iconbox_content p { display: none; } .home_overv .ce_iconbox-version-1 .servicebox[class^="icon-"]:before, .servicebox[class*="icon-"]:before { padding: 21px; margin-bottom: 5px; } .m_w100 .ym-g50 { width: 100%; } td.nlimp_ip { display: block; } .mod_eventreader .event_img .header, .mod_eventreader_nocheck .event_img .header { position: relative; padding: 0; } .video li { width: 100%; } .portfolioliste.autogrid { width: 50% !important; } } @media only screen and (max-width: 480px){ .articlewrapper.boxed, .articlewrapper.fullwidth_contentboxed > .inside { padding-left: 5px!important; padding-right: 5px!important; } #cfe_page_2 fieldset span, .mod_eventlist .event_block { width: 100%; } .bxslider { display: block; } .mod_eventlist .header { width: 50%; float: left; margin: 0; } .mod_eventlist .event_img .layout_list { width: 50%; margin-left: 50%; } #nav-open-btn { right: 22px !important; } .home_overv .ce_iconbox-version-1 { width: 33.3%; } .mod_newslist.home_news .portfolioliste, .portfolioliste.autogrid { width: 100% !important; } .home_col .ym-g50 { width: 100%; } .extern .input-wrapper { width: 100%; } .widget.reg, .publicevent .widget.reg, .download_item { width: 100%; } .videocat li { width: 50%; } .banner a { font-size: 1.5em !important; } } @media only screen and (min-width: 481px){ .input-wrapper, .captcha-container { width: 25%; float: left; border: 5px solid rgba(204, 204, 204, 0); } .input-wrapper.block.textarea { width: 100%; } #freigabe .input-wrapper { width: auto; float: none; border: none; } button.submit, .submit a { font-size: 1.2rem; } .full-w-padding { padding: 1em;} .home_col .ym-g50.col_1 { padding-right: 10px; } .home_col .ym-g50.col_2 { padding-left: 10px; } .pcenter { width: 33%; } .ce_text.event_details.block { height: 132px; } } @media (max-width: 1199px) { #off_canvas { padding:0; } #off_canvas a.submenu:after { padding-right: 34px;} #off_canvas .mod_navigation { padding-left: 2em; } #nav-open-btn{ background: rgba(255, 255, 255, 0.7); position: fixed; padding: 10px 6px 6px 6px; top: 58px; height: 45px; width:50px; box-shadow: 1px 1px 1px #CCC; display: table-cell !important; } #off_canvas .mod_navigation a { font-size: 1.1rem; } .closetrigger { position: absolute; right: 3px; z-index: 999; opacity: 0.8; color: #fff; cursor: pointer; top: -3px; padding: 9px; text-align: center; } .mod_lr_member_custom_colors { position: fixed !important; z-index: 9999999999999999; top: 5%; width: 96%; left: 2%;} } @media (min-width: 1200px) { #off_canvas { opacity: 1; left: 260px; padding: 0rem 0rem 3rem 0rem; } #off_canvas .mod_navigation, .mod_changelanguage { padding-left: 5em; } #off_canvas .mod_navigation a { font-size: 1.3em; padding-left: 20px; padding-right: 35px; } #off_canvas a.submenu:after { position: absolute; right: 15px; width: 1.5em; line-height: 1.3em; text-align: center; padding: 0.2em; } #off_canvas .mod_sprachwechsler { padding-left: 5em; } .full-w #contentwrapper { } .full-w #contentwrapperp { width: auto; margin-left: auto; } #off_canvas .mod_navigation .level_2 a { font-size: 1rem; padding: 3px 0 3px 25px; } #off_canvas a.submenu:hover:after { background: rgba(51, 51, 51, 0.3); } #off_canvas figure.image_container { margin-left: 4em; margin-bottom: -2em; } .publicevent #off_canvas { display: none; } .singleSRC2, .singleSRC3 { width: 50%; float: left; padding: 0.5em; } } @media (min-width: 1700px) { .select2-results__option { width: 49%; float:left;} } @media (min-width: 467px) { .boost-item { width: 50% !important; } } @media print { div#off_canvas { display: none; } div#bottom { display: none; } .mod_eventregistrationlist tr :nth-child(5), .mod_eventregistrationlist thead :nth-child(5) { display: none; } .pdf_link { display: none; } .margin-mobile-top { display: none; } } .mod_lr_downloads button { width: 100%; display: inline-block; } .slickSlider span.slick-arrow { display: block !important; position: absolute; top: 50%; transform: translateY(-40%); background: rgba(0,0,0,0.25); z-index: 999; width: 60px; height: 120px; cursor: pointer; } .slickSlider span.next.slick-arrow { right: 0; } .slickSlider span.slick-arrow:before { content: ''; position: absolute; display: block; width: 0; height: 0; z-index: 999; top: 50%; transform: translateY(-50%); border: 20px solid rgba(255,255,255,0.4); } .slickSlider span.prev.slick-arrow:before { left: 0; border-top-color: transparent; border-bottom-color: transparent; border-left-color: transparent; } .slickSlider span.prev.slick-arrow:hover:before { border-right-color: rgba(255,255,255,0.8); } .slickSlider span.next.slick-arrow:before { right: 0; border-top-color: transparent; border-bottom-color: transparent; border-right-color: transparent; } .slickSlider span.next.slick-arrow:hover:before { border-left-color: rgba(255,255,255,0.8); }