.project_filter_wrapper ul{margin:0 -1rem;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-webkit-flex-flow:row wrap;-ms-flex-flow:row wrap;flex-flow:row wrap;}
.project_filter_wrapper ul li{list-style:none;padding:0 1rem;-webkit-box-flex:0;-webkit-flex:0 0 auto;-ms-flex:0 0 auto;flex:0 0 auto;max-width:100%;}
.project_filter_wrapper ul li > *{cursor:pointer;padding:0.1875rem 1rem 0.1875rem;position:relative;display:block;}
.project_filter_wrapper ul li [data-project-filter-item]:after{content:'';position:absolute;top:0.25em;bottom:0.125rem;left:0;right:0;width:auto;height:auto;border:0.12em solid currentColor;border-radius:3rem;opacity:0;-webkit-transition:all .25s ease;-moz-transition:all .25s ease;-ms-transition:all .25s ease;-o-transition:all .25s ease;transition:all .25s ease;}
.project_filter_wrapper ul li [data-project-filter-item].active:after,
.project_filter_wrapper ul li [data-project-filter-item]:hover:after{opacity:1;}
@media screen and (min-width:40em){
.project_filter_wrapper ul{margin:0 -2rem;}
} .project_filter_wrapper .mobile_filter,
.project_filter_wrapper .mobile_filter_headline{display:none;}
@media screen and (max-width:39.9375em){
.project_filter_wrapper .mobile_filter, .project_filter_wrapper .mobile_filter_headline{display:block;}
.project_filter_wrapper .mobile_filter .mobile_filter_item{padding-right:3rem;position:relative;cursor:pointer;padding-left:0;}
.project_filter_wrapper .mobile_filter .filter_icon{width:2rem;height:2rem;top:50%;right:0;position:absolute;display:block;background:url(//www.stageone.at/wp-content/themes/typo-canvas-child/assets/img/filter-icon.svg) no-repeat;background-size:contain;background-position:50% 50%;-webkit-transform:translate(0,-50%);-moz-transform:translate(0,-50%);-ms-transform:translate(0,-50%);-o-transform:translate(0,-50%);transform:translate(0,-50%);}
#project_filter_wrapper{height:0;overflow:hidden;pointer-events:none;-webkit-transition:height .5s ease;-moz-transition:height .5s ease;-ms-transition:height .5s ease;-o-transition:height .5s ease;transition:height .5s ease;}
#project_filter_wrapper.active{pointer-events:all;}
.project_filter_wrapper .filter_wrapper ul{padding:1rem 0 0;}
.project_filter_wrapper .filter_wrapper ul li{width:100%;display:block;}
.project_filter_wrapper .filter_wrapper ul li.first_el{display:none;}
.project_filter_wrapper ul li [data-project-filter-item]{padding:0 2rem;}
.project_filter_wrapper .filter_wrapper ul li [data-project-filter-item]:after{content:none;}
.project_filter_wrapper .filter_wrapper ul li [data-project-filter-item]:before{content:'';position:absolute;top:0.5rem;left:0;width:1rem;height:1rem;border:1px solid currentColor;background-color:#FFFFFF;border-radius:50%;}
.project_filter_wrapper .filter_wrapper ul li [data-project-filter-item].active:before{background-color:#000000;}
.project_filter_wrapper .filter_wrapper .mobile_close{position:absolute;top:1rem;right:1rem;width:2rem;height:1rem;cursor:pointer;}
.project_filter_wrapper .filter_wrapper .mobile_close:after, .project_filter_wrapper .filter_wrapper .mobile_close:before{content:'';position:absolute;top:50%;left:50%;width:1.5rem;height:0.125rem;background-color:currentColor;-webkit-transform:translate(-50%,-50%) rotate(45deg);-moz-transform:translate(-50%,-50%) rotate(45deg);-ms-transform:translate(-50%,-50%) rotate(45deg);-o-transform:translate(-50%,-50%) rotate(45deg);transform:translate(-50%,-50%) rotate(45deg);}
.project_filter_wrapper .filter_wrapper .mobile_close:before{-webkit-transform:translate(-50%,-50%) rotate(-45deg);-moz-transform:translate(-50%,-50%) rotate(-45deg);-ms-transform:translate(-50%,-50%) rotate(-45deg);-o-transform:translate(-50%,-50%) rotate(-45deg);transform:translate(-50%,-50%) rotate(-45deg);}
} .project_listing [data-project-item]{display:none;}
.project_listing [data-project-item].active{display:block;}
.project_listing [data-project-item] > *{opacity:0;-webkit-transform:scale(0.7);-moz-transform:scale(0.7);-ms-transform:scale(0.7);-o-transform:scale(0.7);transform:scale(0.7);}
.project_listing [data-project-item].anim_in > *{opacity:1;-webkit-transform:scale(1);-moz-transform:scale(1);-ms-transform:scale(1);-o-transform:scale(1);transform:scale(1);-webkit-transition:opacity .5s ease, transform .5s ease;-moz-transition:opacity .5s ease, transform .5s ease;-ms-transition:opacity .5s ease, transform .5s ease;-o-transition:opacity .5s ease, transform .5s ease;transition:opacity .5s ease, transform .5s ease;}
.section_trenner_one .el_wrapper{width:100%;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-webkit-flex-flow:row wrap;-ms-flex-flow:row wrap;flex-flow:row wrap;}
.section_trenner_one .el_wrapper .el{padding:0 0 15%;position:relative;-webkit-box-flex:0;-webkit-flex:0 0 10%;-ms-flex:0 0 10%;flex:0 0 10%;max-width:10%}
.section_trenner_one .el_wrapper .el:after{content:'';position:absolute;top:50%;left:50%;height:100%;width:15%;border-radius:2rem;background-color:currentColor;-webkit-transform:translate(-50%,-50%) rotate(30deg);-moz-transform:translate(-50%,-50%) rotate(30deg);-ms-transform:translate(-50%,-50%) rotate(30deg);-o-transform:translate(-50%,-50%) rotate(30deg);transform:translate(-50%,-50%) rotate(30deg);-webkit-transition:all .25s ease;-moz-transition:all .25s ease;-ms-transition:all .25s ease;-o-transition:all .25s ease;transition:all .25s ease;}
.section_trenner_one .el_wrapper:hover .el:after{height:70%;-webkit-transform:translate(-50%,-50%) rotate(60deg);-moz-transform:translate(-50%,-50%) rotate(60deg);-ms-transform:translate(-50%,-50%) rotate(60deg);-o-transform:translate(-50%,-50%) rotate(60deg);transform:translate(-50%,-50%) rotate(60deg);}
.section_trenner_two .logo_wrapper{position:relative;width:50%;margin:0 auto;padding:0 0 50%;}
.section_trenner_two .logo_wrapper .logo.clock{position:absolute;top:0;left:0;bottom:0;right:0;width:auto;height:auto;-webkit-transition:all 1s ease;-moz-transition:all 1s ease;-ms-transition:all 1s ease;-o-transition:all 1s ease;transition:all 1s ease;}
.section_trenner_two:hover .logo_wrapper .logo.clock {
-webkit-transform: rotate(360deg);
-moz-transform: rotate(360deg);
-ms-transform: rotate(360deg);
-o-transform: rotate(360deg);
transform: rotate(360deg);
}