/*
Theme Name: F2020
Theme URI: https://www.foxcomputers.ch
Author: Fox Computers
Author URI: https://www.foxcomputers.ch
Description: Fox Computers Theme 2020
Version: 2020
License: GNU General Public License
License URI: https://www.gnu.org/licenses/gpl.html
Text Domain: f2020

F2020 WordPress Theme © 2011-2020 Fox Computers
F2020 is distributed under the terms of the GNU GPL
*/

@font-face {
    font-family: 'Fort Bold';
    src: url('fonts/Fort-Bold.woff2') format('woff2'),
        url('fonts/Fort-Bold.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Fort Book';
    src: url('fonts/Fort-Book.woff2') format('woff2'),
        url('fonts/Fort-Book.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Fort Extrabold';
    src: url('fonts/Fort-Extrabold.woff2') format('woff2'),
        url('fonts/Fort-Extrabold.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Fort Light';
    src: url('fonts/Fort-Light.woff2') format('woff2'),
        url('fonts/Fort-Light.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

* {
	margin:0;
	padding:0;
	outline: none;
	box-sizing: border-box;
	-webkit-tap-highlight-color:transparent;
	border:none;
	font-size:100%;
	font-weight: normal;
    font-variant-numeric: lining-nums;
    -moz-font-feature-settings:"lnum" 1; 
    -moz-font-feature-settings:"lnum=1"; 
    -ms-font-feature-settings:"lnum" 1; 
    -o-font-feature-settings:"lnum" 1; 
    -webkit-font-feature-settings:"lnum" 1; 
    font-feature-settings:"lnum" 1;
}
img {
	max-width:100%;
	height: auto;
}
ol,ul {
	list-style:none
}
strong {
    font-family: 'Fort Bold';
    font-weight: normal !important;
}

.portrait {
    padding-top:26px;
}
.wp-caption, .wp-caption-text, .gallery-caption {
	display: none;
}
.screen-reader-text {
	clip:rect(1px, 1px, 1px, 1px);
	position:absolute !important
}

.aligncenter {
    margin:0 auto 26px auto;
    display: block;
}

body {
	background:#fff;
	line-height:1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

#wrapper {
	margin:0 auto;
	max-width:2560px;
	background:#fff;
	box-shadow: 0 0 50px 0 rgba(0,0,0,.1);
    overflow: hidden;
    position: relative;
}
.post-type-archive-projekte #wrapper {
	background:url(images/circle.svg) #fff no-repeat right -24px top 110px;
	background-size:420px 827px;
	position: relative;
}
.left-circle {
    width: 40rem;
    height: 40rem;
    position: absolute;
    left: -24rem;
    top: 42%;
    border: 10rem solid #da2627;
    border-radius: 100%;
    -webkit-animation: 30s linear 0s normal none infinite running cell;
    animation: 30s linear 0s normal none infinite running cell;
    z-index: 0;
}
.right-circle {
    width: 60rem;
    height: 60rem;
    position: absolute;
    right: -34rem;
    top: 140px;
    border: 20rem solid #da2627;
    border-radius: 100%;
    -webkit-animation: 30s linear 0s normal none infinite running cell;
    animation: 30s linear 0s normal none infinite running cell;
    z-index: 0;
}
@-webkit-keyframes cell {
    0% {
        -webkit-transform: translate(0, 0) scale(1)
    }
    25% {
        -webkit-transform: translate(-50px, -25px) scale(1.05)
    }
    50% {
        -webkit-transform: translate(-100px, 0) scale(.9)
    }
    75% {
        -webkit-transform: translate(-50px, 25px) scale(1)
    }
    100% {
        -webkit-transform: translate(0, 0) scale(1)
    }
}
@keyframes cell {
    0% {
        -webkit-transform: translate(0, 0) scale(1)
    }
    25% {
        -webkit-transform: translate(-50px, -25px) scale(1.05)
    }
    50% {
        -webkit-transform: translate(-100px, 0) scale(.9)
    }
    75% {
        -webkit-transform: translate(-50px, 25px) scale(1)
    }
    100% {
        -webkit-transform: translate(0, 0) scale(1)
    }
}
#triangle {
	position: absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	background:url(images/htbg.svg) no-repeat top left;
	background-size:75% auto;
	z-index:0;
}
#circle {
    position: absolute;
    top:80px;
    right:-24px;
    width:508px;
    height:1000px;
	background:url(images/circle.svg) no-repeat center center;
	background-size:508px 1000px;
	z-index:0;
}

.page-template-page-contact #container {
    position: relative;
}
.page-template-page-contact #container:after {
    content:"";
    position: absolute;
    top:260px;
    right:-550px;
    display: block;
    width:1553px;
    height:785px;
	background:url(images/hcircle.svg) no-repeat;
	background-size:1553px 785px;
    z-index: 1;
}
.page-template-page-contact #container:before {
    content:"";
    position: absolute;
    top:1020px;
    left:-700px;
    display: block;
    width:1553px;
    height:785px;
	background:url(images/hwcircle.svg) no-repeat;
	background-size:1553px 785px;
    z-index: 1;
}

#header {
	position: fixed;
	top:0;
	left:0;
	width:100%;
    z-index: 9999;
	background:none;
	transition:background .4s ease;
}
#header.onscroll, .single-projekte #header {
	background:#fff;
	transition:background .4s ease;
}
#header #header-inner {
	margin:0 auto;
	padding:20px 32px;
	max-width:1604px;
	position: relative;
	font-size:0;
}
body.mopen #header {
    background:#fff;
    transition:background .4s ease;
}

#logo {
	display: inline-block;
}
#logo img {
	display: block;
	width:161px;
	height:40px;
}

#menu-toggle {
	position: absolute;
	top:0;
	right:32px;
    width: 80px;
    height: 80px;
    cursor: pointer;
    background:transparent;
    transition:background .5s ease;
}
#menu-toggle.mtopen {
    background:#191919;
    transition:background .5s ease;
}
#menu-toggle span {
    display: block;
    position: absolute;
    height: 2px;
    width: calc(100% - 40px);
    background: #191919;
    opacity: 1;
    left: 20px;
    transform: rotate(0deg);
    transition: .25s ease-in-out;
}
#menu-toggle.mtopen span {
    background: #fff;
    transition: .25s ease-in-out;
}
#menu-toggle span:nth-child(1) {
    top: 25px;
}
#menu-toggle span:nth-child(2),#menu-toggle span:nth-child(3) {
    top: 39px;
}
#menu-toggle span:nth-child(4) {
    top: 53px;
}
#menu-toggle.mtopen span:nth-child(1) {
    top: 28px;
    width: 0%;
    left: 50%;
}
#menu-toggle.mtopen span:nth-child(2) {
    transform: rotate(45deg);
}
#menu-toggle.mtopen span:nth-child(3) {
    transform: rotate(-45deg);
}
#menu-toggle.mtopen span:nth-child(4) {
    top: 28px;
    width: 0%;
    left: 50%;
}
#menu-title {
	position: absolute;
	top:calc(50% + 1px);
	right:134px;
    transform: translate(0,-50%);
}
#menu-title span.mt-text {
    font-family: 'Fort Book';
    font-size: 16px;
    line-height: 28px;
    color: #191919;
    text-transform: uppercase;
    letter-spacing: 1px;
}
.home #menu-title {
    display: none;
}

#menu {
	position: absolute;
	top:80px;
	left:32px;
	right:32px;
	background:#191919;
	transition: height .6s ease;
	height:0;
	overflow: hidden;
}
#menu.mopen {
	height:340px;
	transition: height .6s ease;
}
#menu #menu-inner {
	padding:30px 20px;
	display:flex;
	flex-wrap: wrap;
}
#menu #menu-inner .menucol-item {
	width:calc(33.333% - 40px);
	margin:0 20px
}
#menu #menu-inner .menucol-title {
    font-family: 'Fort Extrabold';
	font-size: 21px;
	line-height: 32px;
	color:#fff;
	margin:0 0 16px 0;
  	-moz-user-select: none;
  	-webkit-user-select: none;
  	-ms-user-select: none;
    opacity:0;
    transform: translate(0,-16px);
    transition: all .3s ease;
}
#menu.mopen #menu-inner .menucol-title {
    opacity:1;
    transform: translate(0,0);
    transition: all .3s ease .3s;
}
#menu #menu-inner ul li {
	display:block;
	border-bottom:1px solid rgba(255,255,255,.2);
    opacity:0;
    transform: translate(0,-12px);
    transition: all .3s ease;
}
#menu.mopen #menu-inner ul li {
    opacity:1;
    transform: translate(0,0);
    transition: all .3s ease .3s;
}
#menu #menu-inner ul li a {
    font-family: 'Fort Book';
	font-size: 16px;
	line-height: 28px;
	color:#fff;
	text-decoration: none;
	padding:8px 0;
	display: block;
}
#menu #menu-inner ul li a:hover {
	color:#ccc;
}
#menu #menu-inner ul li.current-menu-item a, .single-post #menu #menu-inner ul li.current_page_parent a, .single-projekte #menu #menu-inner ul li.menu-item-object-projekte a {
	color:#989797;
}

#container {
	padding-top:100px;
}
.single-projekte #container {
	padding-top:80px;
}
.home #container {
    padding-top:0;
}

.page-template-page-contact #container {
    background:#f9f9f9;
}

#header-img img, #slider img {
	display: block;
}

#cs-header-img {
    z-index: 0;
    position: fixed;
    top:80px !important;
}
#cs-header-img img {
    display: block;
}

.single-projekte #content {
    background:#fff;
    z-index: 1;
    position: relative;
}
.single-post #content {
    padding-bottom:88px;
}

#page-title {
    position: relative;
    z-index: 2;
}
#cs-content h1, #page-title h1 {
    font-family: 'Fort Extrabold';
    font-size:250px;
    line-height: auto;
	color:#191919;
    text-align: right;
    margin:0 32px 32px 32px;
}
.single-post #page-title h1 {
    font-family: 'Fort Extrabold';
    font-size:82px;
    line-height:92px;
	color:#191919;
    text-align: left;
    max-width:824px;
    margin:0 auto 32px auto;
    padding:0 24px;
}
#page-title h1 {
    margin:0 32px;
    padding-top:32px;
}
.page-template-default #page-title h1, .post-type-archive-testimonials #page-title h1 {
    -webkit-hyphens: auto;
    -moz-hyphens: auto;
    -ms-hyphens: auto;
    hyphens: auto;   
}
@media (max-width: 319px) {
    #page-title h1 {
        font-size: 48px;
    }
}
@media (min-width: 320px) and (max-width: 1439px) {
    #page-title h1 {
        font-size: calc(48px + (250 - 48) * (100vw - 320px) / (1439 - 320));
    }
}
@media (min-width: 1440px) {
    #page-title h1 {
        font-size: 250px;
    }
}

.blog #page-title h1 {
    margin:0 32px 96px 32px;
}
.csi-full h1 {
    font-family: 'Fort Extrabold';
    font-size:62px;
    line-height:72px;
	color:#191919;
	margin:0 0 48px 0;
}
#content h2, .cs-cta-title h2, #more-projects h2 {
    font-family: 'Fort Extrabold';
	font-size:42px;
	line-height:56px;
	color:#191919;
	margin:0 0 32px 0;
}
#content #sitebuilder-block h2 {
    margin:0 auto 24px auto;
    padding:0 24px;
    max-width:824px;
}
#content #sitebuilder-block .sbi-cta-inner h2, #content #sitebuilder-block .sbi-video-text h2 {
	font-size:28px;
	line-height:36px;
    color:#fff;
    margin:0 0 24px 0;
    padding:0;
}
#content .entry-content h2 {
	font-size:26px;
	line-height:32px;
	margin:0 0 16px 0;
    padding-top:8px;
}
#content .csi-gallery h2 {
	margin:0 auto 48px auto;
    text-align: center;
    max-width:824px;
}
.cs-cta-title h2, #more-projects h2 {
    text-align: center;
}
#content h3 {
    font-family: 'Fort Extrabold';
	font-size:26px;
	line-height:32px;
	color:#191919;
	margin:0 0 16px 0;
}
#content .tcs-author h3 {
	font-size:20px;
	line-height:26px;
	margin: 0;
}
#content .sbi-acc-trigger h3 {
	margin:0;
    padding:14px 0 8px 0;
    font-size:24px;
}
#content .sbi-tiles-text h3 {
	margin:0 0 4px 0;
}
#content .sbi-lead h3 {
    margin:0 0 32px 0;
    -webkit-hyphens: auto;
    -moz-hyphens: auto;
    -ms-hyphens: auto;
    hyphens: auto;
}
#content .csi-lead h3 {
    margin:0 0 32px 0;
}
#content blockquote h3, #content blockquote h4 {
    font-family: 'Fort Book';
    font-size:16px;
    line-height:24px;
	color:#191919;
    margin:0;
    text-align: center;
}
#content blockquote h4 {
    font-family: 'Fort Bold';
    margin-bottom:16px;
}

#content p {
    font-family: 'Fort Book';
	font-size:20px;
	line-height:26px;
	color:#191919;
	margin:0 0 28px 0;
    -webkit-hyphens: auto;
    -moz-hyphens: auto;
    hyphens: auto;
}
#content .csi-info p {
    font-size:18px;
    line-height:24px;
    margin:0 0 16px 0;
    -webkit-hyphens:none;
    -moz-hyphens: none;
    hyphens: none;
}
#content .tcs-text p {
    font-family: 'Fort Light';
    font-size: 14px;
    line-height: 20px;
    margin: 0 0 24px 0;
}
#content .tcs-text p:before, #content .tcs-text p:after {
    font-family: 'Fort Bold';
    font-size: 14px;
    line-height: 20px;
    color:#da2627;
}
#content .tcs-text p:before {
    content:"«";
    margin-right:2px;
}
#content .tcs-text p:after {
    content:"»";
    margin-left:2px;
}
.csi-info label {
    font-family: 'Fort Bold';
	font-size:18px;
	line-height:24px;
	color:#191919;
}
.csi-gallery-item-caption {
    padding-top:4px;
    font-family: 'Fort Book';
	font-size:14px;
	line-height:20px;
	color:#191919;
}
#content p.small {
	font-size:12px;
	line-height:20px;
	margin:0;
    -webkit-hyphens:none;
    -moz-hyphens: none;
    hyphens: none;
}
#content .sbi-video-text p {
    margin:0;
    font-size:18px;
    line-height: 24px;
    -webkit-hyphens:none;
    -moz-hyphens: none;
    hyphens: none;
}
#content .sbi-mstones-text p {
    margin:0;
    -webkit-hyphens:none;
    -moz-hyphens: none;
    hyphens: none;
}
span.cii-term:after {
    content:",";
    font-family: 'Fort Book';
    font-size: 18px;
    line-height: 24px;
	color:#191919;
}
span.cii-term:nth-last-child(1):after {
    display: none;
}
#content p a, #content ul li a, #content ol li a {
    color:#da2627;
    text-decoration: none;
    border-bottom: 1px solid #da2627;
}
#content p a:hover, #content ul li a:hover, #content ol li a:hover {
    border-bottom: none;
}
#content ul, #content ol {
    margin:0 0 28px 0;
    padding-left:20px;
}
#content ul li {
    font-family: 'Fort Book';
	font-size:20px;
	line-height:26px;
	color:#191919;
    list-style: square;
    margin-bottom:6px;
}
#content ol li {
    font-family: 'Fort Book';
	font-size:20px;
	line-height:26px;
	color:#191919;
    list-style: decimal;
    margin-bottom:6px;
}
#content .sbi-cta-inner p, #content .sbi-cta-inner ul li, #content .sbi-cta-inner ol li, #content .sbi-video-text p, #content .sbi-video-text ul li, #content .sbi-video-text ol li {
    color:#fff;
}
#content .sbi-cta-inner p a, #content .sbi-cta-inner ul li a, #content .sbi-cta-inner ol li a, #content .sbi-video-text p a, #content .sbi-video-text ul li a, #content .sbi-video-text ol li a {
    color:#fff;
    border-bottom: 1px solid #fff;
}

#home-content {
	position: relative;
	z-index: 1;
    overflow: hidden;
}

#lead {
	margin:0 auto;
	max-width: 1700px;
}
#lead-inner {
	display: flex;
	flex-wrap: wrap;
    height: 100vh;
	padding: 80px 20px;
}
#lead-inner .lead-item {
	width:calc(50% - 120px);
	margin:0 60px;
}
#lead-inner .lead-left {
	display: flex;
	flex-direction: column;
	justify-content: center;
    opacity: 0;
    transform: translate(0,-80px);
}
#lead-inner .lead-left h1 {
    font-family: 'Fort Extrabold';
	font-size:54px;
	line-height: 64px;
	color:#191919;
    margin:0 0 6px 0;
}
#lead-inner .lead-left h2 {
    font-family: 'Fort Light';
	font-size:54px;
	line-height: 64px;
	color:#191919;
}
#lead-inner .lead-left .lead-button {
	padding-top:40px;
	font-size:0;
}
#lead-inner .lead-left .lead-button a {
	display: inline-block;
	background:#bf1522;
    background: linear-gradient(12deg, rgba(191,21,34,1) 0%, rgba(231,47,42,1) 100%);
	height:56px;	
    font-family: 'Fort Bold';
	font-size:18px;
	line-height:28px;
	color:#fff;
	text-decoration: none;
	padding:16px 28px 14px 28px;
	border-radius: 28px;
}
#lead-inner .lead-left .lead-button a:hover {
	background:#bf1522;
    background: linear-gradient(12deg, rgba(191,21,34,1) 0%, rgba(191,21,34,1) 100%);
}
#lead-inner .lead-right {
    display: flex;
    justify-content: center;
    align-items: center;
    padding:24px 0;
    transform: translate(150%,0);
}
#lead-inner .lead-right img {
    max-height:642px;
    width:auto;
}

#services {
	margin:0 auto;
	padding: 220px 20px;
	max-width: 1384px;
}
#services-inner {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	margin:0 -16px;
}
#services-inner .service-box {
	width:calc(33.333% - 32px);
	margin:0 16px 48px 16px;
	padding:48px 48px 76px 48px;
	background:#fff;
	box-shadow: 0px 0px 25px 0px rgba(0, 0, 0, 0.16);
	border-radius:16px;
	position: relative;
}
#services-inner .service-box h2 {
	margin:0 0 28px 0;
}
#services-inner .service-box h2 a {
	display: flex;
	align-content: center;
	align-items: center;
    text-decoration: none;
}
#services-inner .service-box h2 img {
	display: block;
	height:48px;
	width:auto;
	margin-right:20px;
}
#services-inner .service-box h2 span {
    font-family: 'Fort Extrabold';
	font-size:24px;
	line-height: 32px;
	color:#191919;
}
#services-inner .service-box p {
    font-family: 'Fort Book';
	font-size:16px;
	line-height:28px;
	color:#191919;
	margin:0 0 24px 0;
}
#services-inner .service-box .service-link {
	position: absolute;
	bottom:48px;
	right:48px;
}
#services-inner .service-box .service-link a {
    font-family: 'Fort Extrabold';
	font-size:16px;
	line-height:28px;
	color:#191919;
	text-decoration: none;
	background:url(images/arrow.svg) no-repeat right center;
	background-size:11px 18px;
	padding-right:21px;
}
#services-inner .service-box .service-link a:hover {
	color:#da2627;
}

#pf-teaser {
	margin:0 0 220px 0;
}
#pf-teaser-inner {
    display: flex;
    justify-content: flex-end;
    position: relative;
}
#pf-teaser-inner #pft-text, #pf-teaser-inner #pft-teaser {
    width:50%;
}
#pf-teaser-inner #pft-text {
    width:50%;
    display: flex;
    justify-content: center;
    align-items: center;
}
#pf-teaser-inner #pft-teaser .pft-slider img {
    max-height:660px;
    width:auto;
}
#pft-caption {
    max-width: 580px;
    margin:0 24px;
}
#pft-caption #pft-ctitle {
    font-family: 'Fort Book';
    font-size: 16px;
    line-height: 28px;
    color: #191919;
    text-transform: uppercase;
    letter-spacing: 1.2px;
    margin:0 0 6px 0;
}
#pft-caption h2 {
    font-family: 'Fort Extrabold';
	font-size:54px;
	line-height: 64px;
	color:#191919;
    margin:0 0 12px 0;
    -webkit-hyphens: auto;
    -moz-hyphens: auto;
    -ms-hyphens: auto;
    hyphens: auto;   
}
#pft-caption p {
    font-family: 'Fort Book';
    font-size: 16px;
    line-height: 28px;
    color: #191919;
    margin: 0 0 24px 0;
}
#pft-caption #pft-link a {
    font-family: 'Fort Extrabold';
	font-size:16px;
	line-height:28px;
	color:#191919;
	text-decoration: none;
	background:url(images/arrow.svg) no-repeat right center;
	background-size:11px 18px;
	padding-right:21px;
}
#pft-caption #pft-link a:hover {
    color:#da2627;
}

.sarrows {
    position: absolute;
    bottom:0;
    left:50%;
    transform: translate(-50%,0);
    display: flex;
}
.sarrows .slick-arrow {
    width:60px;
    height:60px;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    opacity: 1;
    transition: opacity .3s ease;
}
.sarrows .slick-arrow:hover {
    opacity: 0.9;
    transition: opacity .3s ease;
}
.arrow-left {
    background:#e84820;
}
.arrow-right {
    background:#fff;
}

#testimonials {
	margin:0 auto 96px auto;
    position: relative;
}
#testimonials h2 {
    font-family: 'Fort Bold';
    font-size:16px;
    line-height:24px;
    color:#191919;
    text-transform: uppercase;
    padding-left:72px;
    margin-bottom:0;
}
#testimonials-content-slider {
	max-width:100%;
}
#testimonials-content-slider .slick-list {
    padding:0 0 0 72px !important;
}
#testimonials-content-slider .slick-track {
    padding:32px 0;
}
#testimonials-content-slider .tcs-box {
    width:260px;
    height:216px;
    padding: 22px 22px 24px 22px;
    background: #fff;
    box-shadow: 0px 0px 16px 0px rgba(0, 0, 0, 0.16);
    border-radius: 8px;
}
#testimonials-content-slider .slick-slide {
    margin: 0 16px;
}
#testimonials-content-slider .tcs-box .tcs-author h3 {
    font-family: 'Fort Bold';
	font-size:13px;
	line-height:20px;
	color:#191919;
}
#testimonials-content-slider .tcs-box .tcs-author h4 {
    font-family: 'Fort Book';
	font-size:13px;
	line-height:20px;
	color:#191919;
}
#testimonials-content-slider .tcs-box .tcs-text p {
    font-family: 'Fort Book';
	font-size:14px;
	line-height:20px;
	color:#191919;
    hyphens:auto;
	margin:0 0 16px 0;
}
#testimonials-content-slider .tcs-box .tcs-text p a.tcs-trigger {
    display: inline-block;
    font-family: 'Fort Book';
	font-size:14px;
	line-height:20px;
	color:#666;
}
#testimonials-content-slider .tcs-box .tcs-text p a.tcs-trigger:hover {
    text-decoration: none;
}

#testimonials-toggle {
    position:fixed;
    bottom:0;
    left:0;
    width:100%;
    background:#fff;
}

.tsarrows {
    position: absolute;
    bottom:-32px;
    left:72px;
    display: flex;
}
.tsarrows .slick-arrow {
    width:30px;
    height:30px;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    opacity: 1;
    transition: opacity .3s ease;
}
.tsarrows .slick-arrow:hover {
    opacity: 0.9;
    transition: opacity .3s ease;
}
.tsarrows .slick-arrow img {
    width:6px;
    height:10px;
}
.tsarrow-left, .tsarrow-right {
    background:#e84820;
}
.tsarrow-left {
    margin-right:2px;
}
.tsarrow-right {
}

#instagram-inner {
	margin:0 auto 150px auto;
	padding: 60px 20px;
	max-width: 1580px;
	position: relative;
}
#instagram-inner #instagram-link {
	position: absolute;
	top:10px;
	right:-12px;
	background:#fff;
	box-shadow: 0px 0px 25px 0px rgba(0, 0, 0, 0.16);
	border-radius:16px;
	padding:15px;
    z-index: 9;
}
#instagram-inner #instagram-link a {
	display: flex;
    font-family: 'Fort Extrabold';
	font-size:16px;
	line-height: 28px;
	color:#191919;
	text-decoration: none;
	background:url(images/instagram-icon.svg) no-repeat left center;
	background-size:48px 48px;
	padding-left:68px;
	min-height:48px;
	justify-content: flex-end;
	align-content: center;
	align-items: center;
}
#instagram-inner #instagram-link a span {
	background:url(images/arrow.svg) no-repeat right center;
	background-size:11px 18px;
	padding-right:21px;
}
#instafeed {
	margin:0 auto;
	max-width:1540px;
}
#instafeed-inner {
    margin:0 -5px;
	display:flex;
}
#instafeed-inner .ig-item {
	width:calc(25% - 10px);
    margin:0 5px;
}
#instafeed-inner .ig-item img {
	display: block;
    border-radius:4px;
    opacity: 1;
    transition: opacity .3s ease;
}
#instafeed-inner .ig-item:hover img {
	display: block;
    opacity: 0.8;
    transition: opacity .3s ease;
}

#pfilter {
	margin:0 auto 60px auto;
    padding-top:24px;
	max-width:960px;
}
#pfilter-inner {
	display: flex;
	justify-content: space-between;
}
#pfilter .pfilter-item {
    width:420px;
}
#pfilter-inner .pfilter-item:nth-child(2) {
    display: flex;
    justify-content: flex-end;
}
#pfilter h2 {
    font-family: 'Fort Extrabold';
	font-size:20px;
	line-height:28px;
	color:#191919;
	margin:0 0 16px 0;
}
#pfilter .button-group {
	display: flex;
	flex-wrap: wrap;
}
#pfilter .button-group .bg-item {
	width:50%;
	margin-bottom:20px;
}
#pfilter .button-group .bg-item button {
	-webkit-appearance:none;
	appearance:none;
	border:none;
	background:url(images/checkbox-bg.png) no-repeat left top;
	background-size:28px 28px;
    font-family: 'Fort Book';
	font-size:16px;
	line-height:28px;
	color:#989898;
	cursor: pointer;
	position: relative;
	padding-left:42px;
}
#pfilter .button-group .bg-item button:hover, #pfilter .button-group .bg-item button.is-checked {
	color:#191919;
}
#pfilter .button-group .bg-item button::before {
	content:"";
	width:18px;
	height:18px;
	position: absolute;
	top:5px;
	left:5px;
	background:url(images/x-fat.svg) no-repeat;
	backround-size:18px 18px;
	background-position: center -30px;
	transition: all .2s ease;
}
#pfilter .button-group .bg-item button.is-checked::before {
	background:url(images/x-fat.svg) no-repeat center center;
	backround-size:18px 18px;
	background-position: center center;
	transition: all .2s ease;
}

#filter-trigger {
    margin:24px 24px 16px 24px;
    display: inline-block;
    cursor: pointer;
    font-family: 'Fort Extrabold';
    font-size: 24px;
    line-height: 32px;
    color: #191919;
    padding-right:26px;
    position: relative;
    display: none;
    opacity:1;
    transition: opacity .3s ease;
}
#filter-trigger.active {
    opacity:.2;
    transition: opacity .3s ease;
}
#filter-trigger:after {
    content:"";
    position: absolute;
    top:50%;
    right:0;
    width:19px;
    height:12px;
    background:url(images/arrow-down-b.svg) no-repeat center center;
    background-size:19px 12px;
    opacity:1;
    transform: translate(0,-50%) rotate(0deg);
    transition: all .3s ease;
}
#filter-trigger.active:after {
    transform: translate(0,-50%) rotate(180deg);
    opacity:.7;
    transition: all .3s ease;
}

#poutput {
	margin:0 auto 24px auto;
    padding:48px 24px 0 24px;
	max-width:1588px;
}
.blog #poutput {
	max-width:1280px;
    padding:0 24px;
}
#poutput-inner, .sbi-projects-inner {
    display: flex;
    flex-wrap:wrap;
    margin:0 -16px;
}
.sbi-projects-inner {
    justify-content: center;
}
#poutput-inner .poutput-item {
	width:calc(33.333% - 32px);
    margin:0 16px 32px 16px;
}
.sbi-projects-inner .poutput-item {
	width:calc(33.333% - 48px);
    margin:0 24px 48px 24px;
}
.poutput-item-inner {
	background:#fff;
	box-shadow: 0px 0px 25px 0px rgba(0, 0, 0, 0.16);
	border-radius:8px;
    overflow: hidden;
    height: 100%;
    position: relative;
}
.poutput-item .poi-img {
    overflow: hidden;
}
.poutput-item .poi-img img {
    display: block;
}
.poutput-item .poi-img a {
    display: block;
}
.poutput-item .poi-img img2 {
    display: block;
    transform: scale3d(1,1,1);
    transition: all .6s ease;
    backface-visibility: hidden;
    -webkit-backface-visibility:hidden;
    transform-origin: 50% 50%;
}
.poutput-item:hover .poi-img img2 {
    transform: scale3d(1.1,1.1,1.1);
    transition: all .6s ease;
    transform-origin:50% 50%;
}
.poutput-item .poi-caption {
    padding: 32px 32px 88px 32px;
}
.poutput-item .poi-caption span.topic {
    font-family: 'Fort Book';
    font-size: 14px;
    line-height: 20px;
    color: #191919;
    text-transform: uppercase;
    letter-spacing: 0.8px;
    display: inline-block;
    margin:0 0 4px 0;
}
.poutput-item .poi-caption span.topic:after {
    content:",";
    font-family: 'Fort Book';
    font-size: 14px;
    line-height: 20px;
    color: #191919;
    margin-right:8px;
}
.poutput-item .poi-caption span.topic:nth-last-child(1):after {
    display: none;
}
#cs-content .poutput-item .poi-caption h2 {
    font-family: 'Fort Extrabold';
    font-size: 24px;
    line-height: 32px;
    color: #191919;
    margin:0 0 8px 0;
}
#cs-content .poutput-item .poi-caption h2 a, #content .poutput-item .poi-caption h3 a {
    color: #191919;
    text-decoration: none;
    display: inline-block;
}
#content .poutput-item .poi-caption h3 {
    font-family: 'Fort Extrabold';
    font-size: 22px;
    line-height: 32px;
    color: #191919;
    margin:0 0 8px 0;
}
.blog #cs-content .poutput-item .poi-caption h2, .single-post #content .poutput-item .poi-caption h3 {
    min-height: 64px;
}
#content .poutput-item .poi-caption h4 {
    font-size:0;
}
#cs-content .poutput-item .poi-caption h3 span.litem, #content .poutput-item .poi-caption h4 span.litem {
    font-family: 'Fort Book';
    font-size: 16px;
    line-height: 28px;
    color: #191919;
    display: inline-block;
}
#cs-content .poutput-item .poi-caption h3 span.litem:after, #content .poutput-item .poi-caption h4 span.litem:after {
    content:",";
    font-family: 'Fort Book';
    font-size: 16px;
    line-height: 28px;
    color: #191919;
    margin-right:5px;
}
#cs-content .poutput-item .poi-caption h3 span.litem:nth-last-child(1):after, #content .poutput-item .poi-caption h4 span.litem:nth-last-child(1):after {
    display: none;
}
.poutput-item .poi-caption .poi-caption-button {
    position: absolute;
    bottom:32px;
    right:32px;
}
.poutput-item .poi-caption .poi-caption-button a {
    font-family: 'Fort Extrabold';
	font-size:16px;
	line-height:28px;
	color:#191919;
	text-decoration: none;
	background:url(images/arrow.svg) no-repeat right center;
	background-size:11px 18px;
	padding-right:21px;
}
.poutput-item .poi-caption .poi-caption-button a:hover {
	color:#da2627;
}

.sbi-projects {
	margin:0 auto;
	max-width:1382px;
    padding:88px 24px 40px 24px;
}
.cs-item .sbi-projects {
    padding:88px 24px;
}
.sbi-projects h2 {
    text-align: center;
}

#sitebuilder-block {
    position: relative;
    z-index: 1;
}
.page-template-page-sitebuilder #sitebuilder-block {
    padding-bottom:88px;
}
.sbi-full, #page-lead, .entry-content, .csi-full, #cs-cta {
    margin:0 auto;
    padding:88px 24px 60px 24px;
    max-width:824px;
}
#cs-cta {
    padding:88px 24px;
}
.csi-ifull, .csi-testi, .csi-gallery {
    padding:88px 32px;
    background:#f2f2f2;
}
.csi-testi {
    background:none;
}
.csi-full.large {
    max-width:1180px;
    display: flex;
    flex-wrap: wrap;
}
.csi-testi {
    padding-bottom:72px;
}
.csi-ifull-inner {
    margin:0 auto;
    max-width:960px;
}
.csi-ifull-inner.portrait {
    max-width:640px;
}
.csi-ifull-inner.if-ipad {
    background:#1c1c1c;
    padding:28px;
    border:4px solid #d9dade;
    border-radius: 48px;
}
.csi-ifull-inner.if-ipad img {
    border-radius: 24px;
}
.csi-ifull-inner.if-screen img {
    box-shadow: 0px 12px 84px rgba(0,0,0,0.25);
}
.csi-ifull-inner.if-ipad.video video {
    width: 100% !important;
    height: auto !important;
    border-radius: 24px;
}
.csi-ifull-inner.if-iphone, .giphone .csi-gallery-item {
    max-width:395px;
    position: relative;
    border-radius: 40px;
    box-shadow: 0px 0px 0px 11px #1f1f1f, 0px 0px 0px 13px #191919, 0px 0px 0px 20px #111;
}
.giphone .csi-gallery-item {
    border-radius: 20px;
    box-shadow: 0px 0px 0px 8px #1f1f1f, 0px 0px 0px 9px #191919, 0px 0px 0px 12px #111;
}
.csi-ifull-inner.if-iphone img {
    display: block;
    border-radius: 38px;
}
.giphone .csi-gallery-item img {
    display: block;
    border-radius: 18px;
}
.if-iphone:before, .if-iphone:after {
    content: '';
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
}
.if-iphone:before {
    top: 0px;
    width: 56%;
    height: 30px;
    background-color: #1f1f1f;
    border-radius: 0px 0px 40px 40px;
}
.if-iphone i {
    position: absolute;
    display: block;
    color: transparent;
    top: 0px;
    left: 50%;
    transform: translate(-50%, 6px);
    height: 8px;
    width: 15%;
    background-color: #101010;
    border-radius: 8px;
    box-shadow: inset 0px -3px 3px 0px rgba(256, 256, 256, 0.2);
}

.csi-testi-item {
    margin:0 auto;
    max-width:780px;
    padding:24px;
    background:#fff;
    box-shadow: 0px 0px 25px 0px rgba(0, 0, 0, 0.16);
    border-radius: 8px;
}
.csi-full-top {
    width:100%;   
}
.csi-full-left {
    width:calc(100% - 420px);
    margin-right:64px;
    padding-top:0;
}
.csi-full-right {
    width:356px;
}
.csi-info {
    margin-bottom:28px;
    padding:24px;
    background:#f2f2f2;
}
.entry-content {
    padding-bottom:120px;
}
.sbi-imgl, .sbi-imgr {
	margin:0 auto;
	max-width:1560px;
	padding:48px 0;
}
.sbi-imgl-inner, .sbi-imgr-inner {
	display: flex;
	justify-content: center;
}
.sbi-imgl-inner .text, .sbi-imgr-inner .text, .sbi-imgl-inner .img, .sbi-imgr-inner .img {
	width:calc(50% - 96px);
	margin:0 48px;
	display: flex;
	flex-direction: column;
	justify-content: center;
}
.sbi-imgl-inner .img.icon, .sbi-imgr-inner .img.icon {
	flex-direction:row;
	justify-content:center;
	align-content: center;
	align-items: center;
}
.sbi-imgl-inner .img.icon img, .sbi-imgr-inner .img.icon img {
	width:50%;
	height:auto;
}
#content .sbi-imgl-inner .text h2, #content .sbi-imgr-inner .text h2 {
	padding-top:28px;
}
.sbi-img-full {
    padding:88px 0;
}
.sbi-img-full img {
    display:block;
    margin:0 auto;
}
.sbi-tiles {
	margin:0 auto;
	padding: 88px 20px 36px 20px;
	max-width: 1384px;
}
.sbi-tiles h2, .sbi-acc h2 {
    text-align: center;
}
.sbi-tiles-inner {
    display: flex;
	flex-wrap: wrap;
	justify-content: center;
	margin:0 -16px;
    padding-top:32px;
}
.sbi-tiles-item {
    width:calc(33.333% - 48px);
	margin:0 24px 52px 24px;
    padding-bottom:24px;
    border-bottom:1px solid #da2627;
}
.sbi-tiles-item .sbi-tiles-icon {
    margin-bottom:24px;
    height:64px;
}
.sbi-tiles-item .sbi-tiles-icon img {
    display: block;
    height: 64px;
    width: auto;
    max-width:72px;
}
.sbi-acc {
    margin:0 auto;
    padding:88px 0;
    max-width:780px;
}
.sbi-acc .sbi-acc-item {
    border-bottom:1px solid #191919; 
}
.sbi-acc .sbi-acc-item:nth-last-child(1) {
    border-bottom:none; 
}
.sbi-acc-trigger {
    cursor: pointer;
    padding-right:32px;
    position: relative;
}
#content .sbi-acc-trigger:hover h3, #content .sbi-acc-trigger.active h3 {
    color:#da2627;
}
.sbi-acc-trigger svg {
    position: absolute;
    top:50%;
    right:6px;
    transform: translate(0,-50%) rotate(-90deg);
    width:16px;
    height:26px;
    transition: all .3s ease;
}
.sbi-acc-trigger svg .cls-1 {
    fill:#191919;
    transition: all .3s ease;
}
.sbi-acc-trigger.active svg {
    transform: translate(0,-50%) rotate(90deg);
    transition: all .3s ease;
}
.sbi-acc-trigger.active svg .cls-1, .sbi-acc-trigger:hover svg .cls-1 {
    fill:#da2627;
    transition: all .3s ease;
}
.sbi-acc-toggle {
    display: none;
}

.csi-gallery {
    padding:88px 0 88px 12%;
    position: relative;
}
.csi-gallery-inner {
    max-width:100%;
}
.csi-gallery-inner .csi-gallery-item {
    margin-right:24px;
}
.csi-gallery-inner .csi-gallery-item:nth-last-child(1) {
    margin-right:0;
}
.csi-gallery-inner .csi-gallery-item img {
    display: block;
    max-height: 600px;
    width: auto;
}
.csi-gallery .sarrows {
    position: absolute;
    bottom:calc(50% - 48px);
    left: 12%;
    transform: translate(-50%,-50%);
    display: flex;
}

.csi-gallery.grid {
    padding:88px 24px 56px 24px;
}
.csi-gallery.grid-phone {
    padding:88px 24px 24px 24px;
}
.csi-gallery-inner-grid, .csi-gallery.grid-phone .csi-gallery-inner-grid {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    max-width:960px;
    margin:0 auto;
}
.grid .csi-gallery-inner-grid .csi-gallery-item img {
    box-shadow: 0px 8px 24px rgba(0,0,0,0.25);
}
.csi-gallery-inner-grid .csi-gallery-item {
    margin-bottom:24px;
}
.csi-gallery-inner-grid .csi-gallery-item img {
    display: block;
}
.csi-gallery.grid-phone .csi-gallery-inner-grid .csi-gallery-item {
    width:calc(33.333% - 64px);
    margin:0 32px 64px 32px;
}

.sbi-video-full {
    margin:0 auto;
    padding:88px 0;
    max-width:1330px;
}
.sbi-video-inner {
    display: flex;
    flex-wrap: wrap;
}
.sbi-video-inner .sbi-video-text {
    width:40%;
}
.sbi-video-inner .sbi-video-frame {
    width:60%;
}
.sbi-video-inner .sbi-video-text {
    padding:32px 64px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    background:#191919;
}
.sbi-video-inner .sbi-video-text .sbi-video-ctitle {
    font-family: 'Fort Book';
    font-size: 14px;
    line-height: 20px;
    color: #fff;
    text-transform: uppercase;
    letter-spacing: 0.8px;
    margin: 0 0 4px 0;   
}
.sbi-video-inner .sbi-video-frame .rvideo {
    position: relative;
    padding-bottom: 56.25%;
    width: 100%;
    height: 0;
    overflow: hidden;
}
.sbi-video-inner .sbi-video-frame .rvideo iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.sbi-mstones {
    margin-bottom:88px;
    padding-top:88px;   
}
.sbi-mstones-title {
    text-align: center;  
    padding-bottom:24px;
}
.sbi-mstones-list .sbi-mstones-list-item {
    padding:72px;
    position: relative;
    overflow: hidden;
}
.sbi-mstones-list .sbi-mstones-list-item .sbi-mstones-text {
    max-width:560px;
    margin:0 auto;
    min-height: 184px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
}
.sbi-mstones-list .sbi-mstones-list-item:nth-child(odd) {
    background:#e9e9e9;
}
.sbi-mstones-list .sbi-mstones-list-item:nth-child(even) {
    background:#fff;
}
.sbi-mstones-year {
    position: absolute;
    bottom:-50px;
    left:72px;
    font-family: 'Fort Extrabold';
    font-size: 180px;
}
.sbi-mstones-month {
    font-size: 18px;
    display: block;
    text-transform: uppercase;
}
.sbi-mstones-list .sbi-mstones-list-item:nth-child(odd) .sbi-mstones-year {
    color:#fff;
}
.sbi-mstones-list .sbi-mstones-list-item:nth-child(even) .sbi-mstones-year {
    color:#e9e9e9;
}

.sbi-cta {
    margin-top:88px;
    position: relative;
}
.sbi-cta:before {
    content:"";
    width:50%;
    position: absolute;
    top:0;
    left:0;
    bottom:0;
    background:#da2627;
    z-index: 0;
}
.sbi-cta-inner {
    margin:0 auto;
    max-width:780px;
    background:#da2627;
    clip-path: polygon(0 0, 80% 0, 100% 100%, 0% 100%);
    position: relative;
    z-index: 1;
}
.sbi-cta-inner .sbi-cta-text {
    padding:48px 22% 48px 32px;
}

.cs-cta-buttons {
    text-align: center;
    font-size:0;
}
.sbi-button, .csi-button, .csi-info-button {
    padding-top:16px;
    text-align: center;
}
.csi-button {
    padding-top:32px;
}
.sbi-cta .sbi-button {
    padding-top:0;
    text-align: left;
}
.cs-cta-buttons .cs-cta-button {
    display: inline-block;
    margin:0;
}
.sbi-button-title {
    font-family: 'Fort Bold';
    font-size: 16px;
    line-height: 28px;
    color:#191919;
    text-transform: uppercase;
    margin:0 0 12px 0;
}
.sbi-button a, .csi-button a, .csi-info-button a, .cs-cta-button a {
    display: inline-block;
    background: #da2627;
    font-family: 'Fort Bold';
    font-size: 16px;
    line-height: 28px;
    color: #fff;
    text-transform: uppercase;
    text-decoration: none;
    letter-spacing: 0.25px;
    padding: 10px 24px 8px 24px;
    border-radius: 24px;
    border:1px solid #da2627;
    transition: all .3s ease;
}
.sbi-cta .sbi-button a {
    border:1px solid #fff;
}
.sbi-button a:hover, .csi-button a:hover, .csi-info-button a:hover, .cs-cta-button a:hover {
    background: #fff;
    color: #da2627;
    transition: all .3s ease;
}

.testimonials-list-item {
    position: relative;
}
.tli-anchor {
    position: absolute;
    top:-80px;
}
.sbi-text blockquote, .csi-text blockquote, .testimonials-list-item blockquote {
    margin:48px auto;
    max-width:512px;
}
.testimonials-list-item blockquote {
    margin:0 auto 32px auto;
    max-width:640px;
}
.sbi-text blockquote:before, .sbi-text blockquote:after, .csi-text blockquote:before, .csi-text blockquote:after, .testimonials-list-item blockquote:before, .testimonials-list-item:nth-last-child(1) blockquote:after {
    content:"";
    display: block;
    margin:0 auto;
    width:128px;
    height:5px;
    background:#da2627;
}
#content .sbi-text blockquote p, #content .csi-text blockquote p, #content .testimonials-list-item blockquote p {
    font-family: 'Fort Extrabold';
    font-size: 23px;
    line-height: 29px;
    margin:0;
    padding:32px 0;
    text-align: center;
}
#content .testimonials-list-item blockquote p {
    font-family: 'Fort Light';
}
#content .testimonials-list-item blockquote p {
    padding:32px 0 8px 0;
}

#contact-block {
    max-width:1604px;
    margin:0 auto;
    padding:88px 32px 176px 32px;
    z-index: 2;
    position: relative;
}
.sbi-ltiles {
    padding:88px 24px;
}
.sbi-ltiles-title {
    margin: 0 auto 48px auto;
    max-width: 780px;
    text-align: center;
}
.sbi-ltiles-inner, #contact-block-inner {
    margin:0 auto;
    max-width:1552px;
    display: flex;
    flex-wrap: wrap;
}
.sbi-ltiles-inner {
    justify-content: center;
}
.sbi-ltiles-inner .sbi-ltiles-item {
    width:calc(20% - 4px);
    margin:2px;
    background:#f0f0f0;
    transition: all .5s ease;
}
.sbi-ltiles-inner .sbi-ltiles-item:hover {
    background:#f7f7f7;
    transition: all .5s ease;
}
.sbi-ltiles-inner .sbi-ltiles-item a img {
    display: block;
    -webkit-filter:grayscale(1);
    filter:grayscale(1);
    transition: all .5s ease;
}
.sbi-ltiles-inner .sbi-ltiles-item a:hover img {
    -webkit-filter:grayscale(0);
    filter:grayscale(0);
    transition: all .5s ease;
}

.testimonials-list {
    margin: 0 auto;
    padding: 88px 24px 60px 24px;
    max-width: 824px;   
}

#contact-block-inner #contact-address {
    width:50%;
    display: flex;
    justify-content: center;
}
#contact-block-inner #contact-address #contact-address-inner {
    margin:0 32px;
    max-width:536px;
}
#contact-block-inner #contact-address #content #contact-address-inner p a {
    margin:0 0 6px 0;
    display: inline-block;
}
#contact-block-inner #contact-address #content #contact-address-inner p a:hover {
    border-bottom:1px solid transparent;
}

#contact-address-contact {
    padding-top:12px;
}
#contact-address-contact .cline {
    margin:0 0 16px 0;
    padding-left:42px;
}
#contact-address-contact .cline a {
    font-family: 'Fort Book';
    font-size: 20px;
    line-height: 30px;
    color: #191919;
    text-decoration: none;
}
#contact-address-contact .cline a:hover {
    color: #da2627;
}
#contact-address-contact .cline.cac-tel {
    background:url(images/telephone.svg) no-repeat left center;
    background-size:28px 28px;
}
#contact-address-contact .cline.cac-mob {
    background:url(images/mobile.svg) no-repeat left center;
    background-size:28px 28px;
}
#contact-address-contact .cline.cac-email {
    background:url(images/email.svg) no-repeat left center;
    background-size:28px 28px;
}

#contact-block-inner #contact-form {
    width:50%;
}
#contact-block-inner #contact-form #contact-form-inner {
    background:#fff;
    border-radius:16px;
	box-shadow: 0px 0px 25px 0px rgba(0, 0, 0, 0.16);
    padding:88px;
}

.form-elements .form-element, .textinput {
    margin:0 0 24px 0;
	-webkit-column-break-inside: avoid;
	page-break-inside: avoid;
	break-inside: avoid;
	position: relative;	
}
.form-elements .form-element label.vlabel, .textinput label {
    position: absolute;
    top:8px;
    left:24px;
    font-family: 'Fort Bold';
    font-size: 20px;
    line-height: 26px;
    color: #191919;
    color:#000;
    transition: all .3s ease;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
	opacity: 0;
	z-index: -1;
}
.form-elements .form-element.in-focus label.vlabel, .textinput.in-focus label {
	opacity: 1;
    top:-9px;
    font-size:14px;
    line-height: 18px;
    color:#000;
    background:#fff;
    padding:0 4px;
    transition: all .3s ease; 
	z-index:1;
}
.form-elements .form-element .wpcf7-text::placeholder, .form-elements .form-element .wpcf7-textarea::placeholder, .textinput input::placeholder {
	opacity: 1;
    transition: all .3s ease; 
}
.form-elements .form-element.in-focus .wpcf7-text::placeholder, .form-elements .form-element.in-focus .wpcf7-textarea::placeholder, .textinput.in-focus input::placeholder {
	opacity: 0;
    transition: all .3s ease; 
}
.form-fields {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
}
.form-fields .form-field.cchild, .form-fields .form-field.cparent {
    width:40%;
}
.form-fields .form-field.cchild input, .form-fields .form-field.cparent input {
    text-align: center;
}
.form-fields .form-field.operator {
    width:20%;
    text-align: center;
    font-family: 'Fort Extrabold';
    font-size: 20px;
    line-height: 26px;
    color: #191919;
}
.form-fields .form-field.multiply {
    width:100%;
    text-align: center;
    font-family: 'Fort Extrabold';
    font-size: 24px;
    line-height: 32px;
    color: #191919;
    padding:24px 0;
}
.wpcf7-text, .form-field input {
    -webkit-appearance:none;
    width:100%;
    border:0;
    border-radius:0;
    background:#f8f8f8;
    font-family: 'Fort Book';
    font-size:16px;
    line-height: 28px;
    padding:15px 24px 13px 24px;
    border:1px solid #f8f8f8;
}
.form-field input::-webkit-outer-spin-button,
.form-field input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}
.form-field input[type=number] {
    -moz-appearance: textfield;
}
.wpcf7-textarea {
    -webkit-appearance:none;
    width:100%;
    max-width:100%;
    border:0;
    border-radius:0;
    background:#f8f8f8;
    font-family: 'Fort Book';
    font-size:16px;
    line-height: 28px;
    padding:15px 24px 13px 24px;
    border:1px solid #f8f8f8;
}
.wpcf7-submit, #calc-run {
    -webkit-appearance:none;
    display: inline-block;
    background: #da2627;
    font-family: 'Fort Bold';
    font-size: 16px;
    line-height: 28px;
    color: #fff;
    text-transform: uppercase;
    letter-spacing: 0.25px;
    padding: 10px 24px 8px 24px;
    border-radius: 24px;
    border:1px solid #da2627;
    cursor: pointer;
    transition: all .3s ease;
}
#calc-run {
    margin:0 auto 32px auto;
}
.wpcf7-submit:hover, #calc-run:hover {
    background: #fff;
    color: #da2627;
    transition: all .3s ease;
}
.form-submit {
    display: flex;
    justify-content:flex-end;
}
.form-submit .ajax-loader {
    order:1;
    margin:12px 16px !important;
    display: inline-block;
}
.form-submit .wpcf7-submit {
    order:2;
}
#calc-result {
    display: none;
    text-align: center;
    font-family: 'Fort Extrabold';
    font-size: 24px;
    line-height: 32px;
    color: #fff;
    max-width:340px;
    margin:0 auto;
    padding:24px 24px 20px 24px;
    background:#46b450;
    border-radius:12px;
}
#calc-result span {
    display: block;
}
span.result-title {
    font-family: 'Fort Bold';
    font-size: 16px;
    line-height: 28px;
    margin-bottom:8px;
}
.wpcf7-not-valid {
    border:1px solid #da2627 !important;
}
.wpcf7-not-valid-tip {
    font-family: 'Fort Bold';
    font-size: 14px;
    line-height: 20px;
    color:#da2627;
    text-transform: uppercase;
    padding-top:6px;
}
.wpcf7 form .wpcf7-response-output {
	margin: 2em 0 1em 0 !important;
	padding: 18px 0 14px 72px;
    font-family: 'Fort Book';
    font-size: 18px;
    line-height: 24px;
    text-align: left;
    border:none !important;
}
.wpcf7 form.invalid .wpcf7-response-output, .wpcf7 form.unaccepted .wpcf7-response-output, .wpcf7 form.failed .wpcf7-response-output, .wpcf7 form.aborted .wpcf7-response-output {
	background:url(images/error.svg) no-repeat left center;
    background-size:56px 56px;
    color:#da2627 !important;
}
.wpcf7 form.sent .wpcf7-response-output {
	background:url(images/sent.svg) no-repeat left center;
    background-size:56px 56px;
    color:#46b450 !important;
}

#footer {
	background:#191919;
	position: relative;
	z-index: 1;
}
#footer-inner {
	margin:0 auto;
	padding:100px 32px 30px 32px;
	max-width: 1604px;
}
#footer-inner #footer-items {
	margin:0 -20px 60px -20px;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
#footer-inner #footer-items .fitem-container-full {
	width:calc(100% - 40px);
	margin:0 20px 40px 20px;
}
#footer-inner #footer-items .fitem-container-full h2 {
    font-family: 'Fort Extrabold';
	font-size:34px;
	line-height:48px;
	color:#fff;
}
#footer-inner #footer-items .fitem-container.fcontact, #footer-inner #footer-items .fitem-container.floc {
	width:calc(40% - 40px);
	margin:0 20px;
}
#footer-inner #footer-items .fitem-container.fsocials {
	width:calc(20% - 40px);
	margin:0 20px;
}
#footer-inner #footer-items .fitem-container h3 {
    font-family: 'Fort Extrabold';
	font-size:20px;
	line-height:32px;
	color:#fff;
}
#footer-inner #footer-items .fitem-container p, #footer-inner #footer-items .fitem-container #social-widget .social-link a {
    font-family: 'Fort Light';
	font-size:18px;
	line-height:30px;
	color:#fff;
}
#footer-inner #footer-items .fitem-container p a, #footer-inner #footer-items .fitem-container #social-widget .social-link a {
	color:#fff;
    text-decoration: none;
    border-bottom:1px solid #fff;
}
#footer-inner #footer-items .fitem-container p a:hover, #footer-inner #footer-items .fitem-container #social-widget .social-link a:hover {
	border-bottom:none;
}
#fmenu ul {
	text-align: left;
	font-size:0;
}
#fmenu ul li {
	display: inline-block;
	margin-right:20px;
}
#fmenu ul li a {
    font-family: 'Fort Book';
	font-size:13px;
	line-height:20px;
	color:#fff;
	text-decoration: none;
}
#fmenu ul li a:hover {
	color:#ccc;
}
#copyright {
    font-family: 'Fort Book';
	font-size:13px;
	line-height:20px;
	color:#fff;
	text-align: left;
    display: flex;
    flex-wrap: wrap;
}
#copyright-right {
    display:flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: center;
}
#copyright-right .cr-logo {
    margin-left:42px;
}
#copyright-right .cr-logo img {
    display: block;
}

.come-in {
    transform: translateY(0);
    opacity: 1;
    transition: transform 1.4s ease, opacity 1.6s ease;
}
.come-in:nth-child(odd) {
    transition: transform 1s ease, opacity 1.2s ease;
}
.already-visible {
    transform: translateY(0);
    opacity: 1;
    transition: transform 1.4s ease, opacity 1.6s ease;
}
.scroll-item {
	transform-origin: center center;
}
.off-screen-top {
    transform: translateY(-200px); 
    opacity: 0;
}
.off-screen-bottom {
    transform: translateY(200px); 
    opacity: 0;
}

#global-info {
    position: fixed;
    bottom:-480px;;
    right:-480px;
    width:360px;
    background: #fff;
    box-shadow: 0px 0px 25px 0px rgba(0, 0, 0, 0.16);
    border-radius: 16px;
    z-index: 9999;
}
#global-info.disabled {
    bottom:-480px !important;
    right:-480px !important;
    transition: all 1s ease;
}
#global-info-close {
    position: absolute;
    top:16px;
    right:16px;
    width:20px;
    height:20px;
    background:url(images/x-fat.svg) no-repeat center center;
    background-size:12px 12px;
    cursor: pointer;
}
#global-info-inner {
    padding:26px 32px;
}
#global-info-inner h2 {
    font-family: 'Fort Extrabold';
    font-size: 20px;
    line-height: 28px;
    color: #191919;
    margin-bottom:8px;
}
#global-info-inner p {
    font-family: 'Fort Book';
    font-size: 14px;
    line-height: 22px;
    color: #191919;
}
#global-info-inner #global-info-button {
    font-size:0;
    padding-top:12px;
}
#global-info-inner #global-info-button a {
    display: inline-block;
    background: #da2627;
    font-family: 'Fort Bold';
    font-size: 14px;
    line-height: 22px;
    color: #fff;
    text-transform: uppercase;
    text-decoration: none;
    letter-spacing: 0.15px;
    padding: 6px 16px 4px 16px;
    border-radius: 17px;
    border:1px solid #da2627;
    transition: all .3s ease;
}
#global-info-inner #global-info-button a:hover {
    background: #fff;
    color: #da2627;
    transition: all .3s ease;
}

.mt-text.mobile {
    display: none;
}

#more-projects {
    margin:0 auto;
    padding:48px 24px;
	max-width:1588px;
}
#more-projects-items { 
    column-count: 3;
    column-gap: 32px;
}
#more-projects-items .more-projects-item {
    margin-bottom:4px;
}
#more-projects-items .more-projects-item a {
    display: inline-block;
    font-family: 'Fort Book';
    font-size: 20px;
    line-height: 26px;
    color: #191919;
    text-decoration: none;
}
#more-projects-items .more-projects-item a:hover {
    color:#da2627;
    text-decoration: underline;
}

@media only screen and (max-width:1604px) {
    #header #header-inner {
        padding: 20px 0 20px 24px;
        width: 100%;
    }
    #menu-toggle {
        right:0;
    }
    #menu {
        left:0;
        right:0;
    }
    #menu.mopen {
        height: 374px;
    }
    #menu #menu-inner {
        padding: 24px 4px;
    }
    #menu-title {
        right: 100px;
    }
    #footer-inner {
        padding: 80px 24px 30px 24px;
    }
    .right-circle {
        width: 40rem;
        height: 40rem;
        right: -22rem;
        border: 12rem solid #da2627;
    }
    .left-circle {
        display: none;
    }
    .page-template-page-contact #container:after {
        top:260px;
        right:-825px;
    }
    .page-template-page-contact #container:before {
        top:1020px;
        left:-900px;
    }
    #contact-block {
        padding:88px 24px 176px 24px;
    }
}
@media only screen and (max-width:1580px) {
    .post-type-archive-projekte #wrapper {
        background: url(images/circle.svg) #fff no-repeat right -24px top 110px;
        background-size: 315px 620px;
    }
}
@media only screen and (max-width:1440px) {
    #footer-inner #footer-items .fitem-container.fcontact, #footer-inner #footer-items .fitem-container.floc, #footer-inner #footer-items .fitem-container.fsocials {
        width: calc(33.333% - 40px);
    }
    #contact-block-inner #contact-address #contact-address-inner {
        margin: 0 32px 0 0;
    }
}
@media only screen and (max-width:1366px) {
    #contact-block-inner #contact-form #contact-form-inner {
        padding: 44px;
    }
    .page-template-page-contact #container:before {
        left:-1020px;
    }
}
@media only screen and (max-width:1280px) {
    .right-circle {
        right: -30rem;
        border: 10rem solid #da2627;
    }
    .page-template-page-contact #container:after {
        top:240px;
        right:-960px;
    }
    .post-type-archive-projekte #wrapper {
        background: url(images/circle.svg) #fff no-repeat right -24px top 85px;
        background-size: 236px 465px;
    }
}
@media only screen and (max-width:1180px) {
    .sbi-tiles-item {
        width: calc(50% - 48px);
    }
    .sbi-video-inner .sbi-video-text {
        padding: 32px;
    }
    #poutput-inner, .sbi-projects-inner {
        margin: 0 -12px;
    }
    .sbi-projects-inner .poutput-item {
        width: calc(33.333% - 24px);
        margin: 0 12px 24px 12px;
    }
    .sbi-ltiles-inner .sbi-ltiles-item {
        width: calc(25% - 4px);
    }
    #poutput-inner .poutput-item {
        width: calc(33.333% - 24px);
        margin: 0 12px 24px 12px;
    }
    #more-projects-items { 
        column-gap: 24px;
    }
    #lead-inner .lead-left h1, #lead-inner .lead-left h2 {
        font-size: 46px;
        line-height: 56px;
    }
    #lead-inner .lead-left .lead-button a {
        height: 52px;
        font-size: 16px;
        line-height: 26px;
        padding: 14px 28px 12px 28px;
        border-radius: 26px;
    }
    #services {
        padding:60px 24px 110px 24px;
    }
    #pft-caption #pft-ctitle {
        font-size: 14px;
        line-height: 26px;
        letter-spacing: 1px;
    }
    #pft-caption h2 {
        font-size: 46px;
        line-height: 56px;
        margin: 0 0 12px 0;
    }
    #pf-teaser-inner #pft-teaser .pft-slider img {
        max-height:480px;
    }
    #pf-teaser {
        margin: 0 0 110px 0;
    }
    .csi-full {
        padding: 44px 24px 30px 24px;
    }
    #cs-cta {
        padding: 44px 24px 88px 24px;
    }
    .csi-ifull, .csi-testi, .csi-gallery {
        padding: 44px 24px;
        background: #f2f2f2;
    }
    .cs-item .sbi-projects {
        padding: 44px 24px;
    }
    .csi-gallery-inner .csi-gallery-item img {
        max-height: 500px;
    }
    .csi-gallery {
        padding: 44px 0 44px 12%;
    }
}
@media only screen and (max-width:1024px) {    
    .right-circle {
        width: 20rem;
        height: 20rem;
        right: -12rem;
        top: 140px;
        border:6rem solid #da2627;
    }
    .sbi-ltiles-inner .sbi-ltiles-item a img {
        -webkit-filter: grayscale(0);
        filter: grayscale(0);
    }
    #lead-inner .lead-right img {
        max-height: 520px;
        width: auto;
    }
    #lead-inner {
        padding: 80px 24px 20px 24px;
    }
    #services-inner .service-box {
        width: calc(50% - 32px);
    }
    #pf-teaser-inner #pft-teaser .pft-slider img {
        max-height:400px;
    }
    #pft-caption h2 {
        font-size: 42px;
        line-height: 52px;
    }
    #pfilter {
        margin: 0 24px 40px 24px;
    }
    #pfilter-inner {
        justify-content:flex-start;
    }
}
@media only screen and (max-width:1023px) {
    #content h2, .cs-cta-title h2, #more-projects h2 {
        font-size: 36px;
        line-height: 48px;
    }
    #content #sitebuilder-block .sbi-cta-inner h2, #content #sitebuilder-block .sbi-video-text h2 {
        font-size: 26px;
        line-height: 34px;
    }
    #content h3 {
        font-size: 24px;
        line-height: 32px;
    }
    #content .sbi-acc-trigger h3 {
        font-size: 22px;
    }
    #content p, #content ul li, #content ol li, #contact-address-contact .cline a, .cs-cta-title p {
        font-size: 18px;
        line-height: 24px;
    }
    #content .sbi-video-text p {
        font-size: 16px;
        line-height: 22px;
    }
    #more-projects-items .more-projects-item {
        margin-bottom:6px;
    }
    #more-projects-items .more-projects-item a {
        font-size: 18px;
        line-height: 24px;
    }
    .sbi-tiles-inner {
        padding-top:12px;
    }
    .sbi-tiles-item {
        padding-bottom: 8px;
    }
    .sbi-video-inner .sbi-video-text, .sbi-video-inner .sbi-video-frame {
        width: 50%;
    }
    #footer-inner #footer-items .fitem-container.fcontact, #footer-inner #footer-items .fitem-container.floc, #footer-inner #footer-items .fitem-container.fsocials {
        width: calc(50% - 40px);
    }
    #footer-inner #footer-items .fitem-container.fcontact, #footer-inner #footer-items .fitem-container.floc {
        margin-bottom:32px;
    }
    #contact-address-contact .cline {
        margin: 0 0 8px 0;
        padding-left:0;
        background:none !important;
    }
    .csi-gallery.grid-phone .csi-gallery-inner-grid .csi-gallery-item {
        width: calc(33.333% - 48px);
        margin: 0 24px 48px 24px;
    }
}
@media only screen and (max-width:920px) {
    .sbi-video-inner .sbi-video-text, .sbi-video-inner .sbi-video-frame {
        width: 100%;
    }
    #content #sitebuilder-block .sbi-cta-inner h2, #content #sitebuilder-block .sbi-video-text h2 {
        margin: 0 0 16px 0;
    }
    .sbi-video-inner .sbi-video-text {
        padding: 32px 24px;
    }
    .sbi-video-full {
        padding: 44px 0;
    }
    .sbi-acc {
        padding: 44px 24px;
    }
    .sbi-tiles {
        padding: 44px 20px 8px 20px;
    }
    #poutput-inner, .sbi-projects-inner {
        margin: 0 12px;
    }
    .post-type-archive-projekte #poutput-inner {
        margin:0 -12px;
    }
    .blog #poutput-inner {
        margin:0 -12px;
    }
    .sbi-projects {
        padding: 44px 0 12px 0;
    }
    .sbi-projects-inner .poutput-item {
        margin: 0 12px 40px 12px;
    }
    .sbi-projects-inner .poutput-item, #poutput-inner .poutput-item {
        width: calc(50% - 24px);
    }
    #more-projects-items { 
        column-count: 2;
    }
    .right-circle {
        top: 80px;
        right:-14rem;
    }
    .sbi-ltiles-inner .sbi-ltiles-item {
        width: calc(33.333% - 4px);
    }
    #contact-block-inner {
        display:block;
    }
    #contact-block-inner #contact-address, #contact-block-inner #contact-form {
        width: 100%;
    }
    #contact-block-inner #contact-address {
        margin-bottom:48px;
    }
    #contact-block-inner #contact-form #contact-form-inner {
        margin:0 auto;
        max-width: 580px;
        padding: 44px;
    }
    .page-template-page-contact #container:after {
        top:220px;
        right:-240px;
        width:517px;
        height:261px;
        background:url(images/hcircle.svg) no-repeat;
        background-size:517px 261px;
    }
    .page-template-page-contact #container:before {
        display: none;
    }
    #contact-block-inner #contact-address #contact-address-inner {
        margin:0;
    }
    .page-template-page-contact #container {
        background: #fff;
    }
    .sbi-mstones-year {
        width:448px;
        text-align: center;
        left: 50%;
        margin-left:-224px;
    }
    #lead-inner .lead-item {
        width: calc(50% - 48px);
        margin: 0 24px;
    }
    #circle {
        top: 80px;
        right: -124px;
    }
    .post-type-archive-projekte #wrapper {
        background: url(images/circle.svg) #fff no-repeat right -24px top 80px;
        background-size: 177px 349px;
    }
    #pfilter .button-group .bg-item button {
        background:url(images/checkbox-bg.png) no-repeat left top;
        background-size:22px 22px;
        font-size: 14px;
        line-height: 26px;
        padding-left: 32px;
    }
    #pfilter .button-group .bg-item button::before {
        width:12px;
        height:12px;
        top:5px;
        left:5px;
        background:url(images/x-fat.svg) no-repeat;
        backround-size:12px 12px;
        background-position: center -24px;
    }
    #pfilter .button-group .bg-item button.is-checked::before {
        background:url(images/x-fat.svg) no-repeat center center;
        backround-size:12px 12px;
    }
    .csi-full-left {
        width:100%;
        margin-right: 0;
    }
    .csi-full-right {
        width: 100%;
    }
    .csi-info {
        display: flex;
        flex-wrap: wrap;
        margin-bottom:0;
    }
    .csi-info-item {
        width:50%;
        padding-right:24px;
    }
    .csi-info-button {
        width:100%;
    }
    .cs-item .sbi-projects {
        padding: 44px 0;
    }
    .csi-gallery-inner .csi-gallery-item img {
        max-height: 360px;
    }
    .csi-gallery .sarrows {
        bottom: calc(50% - 28px);
    }
    .csi-gallery .sarrows .slick-arrow {
        width: 40px;
        height: 40px;
    }
    .csi-gallery.grid {
        padding: 44px 24px 20px 24px;
    }
    .csi-gallery.grid-phone {
        padding: 44px 24px 24px 24px;
    }
    .grid .csi-gallery-inner-grid {
        margin: 0 -12px;
    }
    .csi-gallery-inner-grid .csi-gallery-item {
        margin: 0 12px 24px 12px;
    }
    .sbi-mstones-list .sbi-mstones-list-item {
        padding: 72px 72px 124px 72px;
    }
}
@media only screen and (max-width:768px) {
    #cs-content h1, #page-title h1 {
        text-align: left;
    }
    .sbi-full, #page-lead, .entry-content, .csi-full {
        padding: 58px 24px 30px 24px;
    }
    .single-post #page-title h1 {
        font-size: 48px;
        line-height: 58px;
        margin: 0 auto;
    }
    .page-template-page-contact #container:after {
        display: none;
    }
    #contact-block {
        padding: 44px 24px 88px 24px;
    }
    #contact-block-inner #contact-form #contact-form-inner {
        max-width:100%;
        margin: 0;
        padding: 0;
        border-radius:0;
        box-shadow:none;
        background:none;
    }
    .wpcf7-text, .wpcf7-textarea {
        background: #f1f1f1;
    }
    #contact-block-inner #contact-address #contact-address-inner {
        margin: 0;
        max-width:100%;
    }
    #page-title h1 {
        margin: 0 24px;
    }
    #content #sitebuilder-block h2 {
        padding: 0;
    }
    #content #sitebuilder-block .sbi-projects h2 {
        padding: 0 24px;
    }
    .sbi-ltiles-title {
        margin: 0 auto 24px auto;
    }
    .blog #page-title h1 {
        margin: 0 24px 48px 24px;
    }
    #pfilter {
        margin:0 12px 40px 12px;
    }
    #pfilter-inner .pfilter-item {
        width:calc(50% - 24px);
        margin:0 12px;
    }
    .error404 .entry-content {
        padding: 24px 24px 30px 24px;
    }
    #lead-inner .lead-item {
        width:60%;
        margin:0;
    }
    #lead-inner .lead-right {
        display:none;
    }
    #circle {
        right: -250px;
        width: 500px;
        height: 500px;
        border: 140px solid #da2627;
        border-radius: 50%;
        z-index: 0;
        background:none;
    }
    #circle.loaded {
        -webkit-animation: 30s linear 0s normal none infinite running cell;
        animation: 30s linear 0s normal none infinite running cell;
    }
    @-webkit-keyframes cell {
        0% {
            -webkit-transform: translate(0, 0) scale(1)
        }
        25% {
            -webkit-transform: translate(-25px, -12px) scale(1.05)
        }
        50% {
            -webkit-transform: translate(-50px, 0) scale(1.1)
        }
        75% {
            -webkit-transform: translate(-25px, 12px) scale(1)
        }
        100% {
            -webkit-transform: translate(0, 0) scale(1)
        }
    }
    @keyframes cell {
        0% {
            -webkit-transform: translate(0, 0) scale(1)
        }
        25% {
            -webkit-transform: translate(-25px, -12px) scale(1.05)
        }
        50% {
            -webkit-transform: translate(-50px, 0) scale(1.1)
        }
        75% {
            -webkit-transform: translate(-25px, 12px) scale(1)
        }
        100% {
            -webkit-transform: translate(0, 0) scale(1)
        }
    }
    .csi-ifull-inner.if-iphone {
        max-width:280px;
        border-radius: 20px;
        box-shadow: 0px 0px 0px 6px #1f1f1f, 0px 0px 0px 7px #191919, 0px 0px 0px 10px #111;
    }
    .csi-ifull-inner.if-iphone img {
        display: block;
        border-radius: 20px;
    }
    .if-iphone::before {
        width: 48%;
        height: 20px;
        border-radius: 0px 0px 30px 30px;
    }
    .if-iphone i {
        transform: translate(-50%, 6px);
        height: 6px;
        width: 12%;
        border-radius: 6px;
        box-shadow: inset 0px -3px 3px 0px rgba(256, 256, 256, 0.2);
    }
}
@media only screen and (max-width:767px) {
    body.mopen {
        overflow: hidden;
    }
    #menu {
        width:100%;
        height:calc(100vh - 62px); 
        left:100%;
        transition: left .8s ease;
    }
    #menu.mopen {
        height:calc(100vh - 62px); 
        overflow-y: scroll;
        -ms-overflow-style: none;
        scrollbar-width: none;
        left:0;
        transition: left .8s ease;
    }
    #menu.mopen::-webkit-scrollbar {
        display: none;
    }
    #menu #menu-inner .menucol-title, #menu #menu-inner ul li {
        opacity:0;
        transform: translate(56px,0);
        transition: all .8s ease;
    }
    #menu.mopen #menu-inner .menucol-title, #menu.mopen #menu-inner ul li {
        transition: all .8s ease .2s;
    }
    #menu #menu-inner .menucol-item {
        width: calc(100% - 40px);
        margin: 0 20px 32px 20px;
    }
    #menu #menu-inner .menucol-title {
        margin: 0 0 4px 0;
    }
    .sbi-tiles-inner {
        margin: 0 -24px;
    }
    .sbi-tiles-item {
        width: calc(100% - 48px);
        margin-bottom:36px;
        padding-bottom:4px;
    }
    .sbi-cta-inner {
        clip-path:none;
    }
    .sbi-cta-inner .sbi-cta-text {
        padding: 44px 24px;
    }
    .sbi-ltiles {
        padding: 44px 24px 24px 24px;
    }
    #services-inner .service-box {
        width: calc(100% - 32px);
        margin: 0 16px 24px 16px;
    }
    #pf-teaser {
        margin: 0 0 60px 0;
    }
    #pf-teaser-inner {
        flex-wrap: wrap;
    }
    #pf-teaser-inner #pft-text, #pf-teaser-inner #pft-teaser {
        width:100%;
        display: block;
    }
    #pf-teaser-inner #pft-text {
        order:2;
    }
    #pf-teaser-inner #pft-teaser {
        order:1;
    }
    #pf-teaser-inner #pft-teaser .pft-slider img {
        max-height:360px;
    }
    .pft-slider .slick-slide {
        opacity:.75;
        filter:grayscale(1);
        transition: all .3s ease;
    }
    .pft-slider .slick-slide.slick-current {
        opacity:1;
        filter:grayscale(0);
        transition: all .3s ease;
    }
    #pft-caption {
        max-width:480px;
        margin: 48px 24px;
    }
    .home .sarrows {
        bottom: inherit;
        top:360px;
        left:0;
        transform: translate(0,0);
        z-index: 999;
    }
    .home .sarrows .slick-arrow {
        width:32px;
        height:32px;
    }
    .home .sarrows .arrow-right {
        background: #f1f1f1;
    }
    #filter-trigger {
        display: inline-block;
    }
    #pfilter {
        display: none;
        padding-top:0;
    }
    #pfilter .button-group .bg-item {
        width: 100%;
        margin-bottom:10px;
    }
    #menu #menu-inner {
        padding-bottom: env(safe-area-inset-bottom);
    }
    #content #sitebuilder-block h2 {
        -webkit-hyphens: auto;
        -moz-hyphens: auto;
        -ms-hyphens: auto;
        hyphens: auto;   
    }
}
@media screen and (max-width: 767px) {
    _::-webkit-full-page-media, _:future, :root #menu.mopen {
        padding-bottom:96px; 
    }
}
@media only screen and (max-width:640px) {
    .sbi-projects-inner .poutput-item, #poutput-inner .poutput-item {
        width: calc(100% - 24px);
    }
    .csi-gallery-inner .csi-gallery-item img {
        max-height: 300px;
    }
    #more-projects-items { 
        column-count: 1;
        column-gap: 0;
    }
    #copyright-left, #copyright-right {
        width:100%;
    }
    #copyright-left {
        order:2;    
    } 
    #copyright-right {
        order:1;
        margin-bottom:32px;
    }
    #copyright-right .cr-logo {
        margin-left:0;
        margin-right:24px;
    }
}
@media only screen and (max-width:568px) {
    #header #header-inner {
        padding:16px 0 16px 24px;
    }
    #logo img {
        width:121px;
        height:30px;
    }
    #menu-toggle {
        right:0;
        width:62px;
        height:62px;
    }
    #menu-toggle span {
        width: calc(100% - 32px);
        left: 16px;
    }
    #menu-toggle span:nth-child(1) {
        top: 18px;
    }
    #menu-toggle span:nth-child(2),#menu-toggle span:nth-child(3) {
        top: 30px;
    }
    #menu-toggle span:nth-child(4) {
        top: 42px;
    }
    #menu-toggle.mtopen span:nth-child(1), #menu-toggle.mtopen span:nth-child(4) {
        top: 24px;
    }
    #menu-title {
	    right:80px;
    }
    #menu-title span.mt-text {
        font-size: 12px;
        line-height: 24px;
        letter-spacing:.6px;
    }   
    #menu {
        top:62px;
    }
    #container {
        padding-top:82px;
    }
    .single-projekte #container {
        padding-top: 62px;
    }
    #footer-inner #footer-items .fitem-container.fcontact, #footer-inner #footer-items .fitem-container.floc, #footer-inner #footer-items .fitem-container.fsocials {
        width: calc(100% - 40px);
    }
    .sbi-ltiles-inner .sbi-ltiles-item {
        width: calc(50% - 4px);
    }
    .sbi-mstones-year {
        width:342px;
        margin-left:-171px;
        font-size:120px;
        bottom: -35px;
    }
    .sbi-mstones-list .sbi-mstones-list-item {
        padding: 36px 36px 102px 36px;
    }
    #cs-header-img {
        top:62px !important;
    }
    .post-type-archive-projekte #wrapper {
        background: url(images/circle.svg) #fff no-repeat right -24px top 80px;
        background-size: 133px 262px;
    }
    .csi-ifull-inner.gifbg {
        padding: 18px;
    }
    .csi-gallery-inner .csi-gallery-item img {
        max-height: 240px;
    }
    .csi-gallery {
        padding: 44px 0 44px 24px;
    }
    .csi-gallery .sarrows {
        bottom:inherit;
        left:0;
        top:0;
        transform:none;
    }
    .csi-gallery .sarrows .slick-arrow {
        width: 32px;
        height: 32px;
    }
    #content .testimonials-list-item blockquote p {
        font-size: 16px;
        line-height: 24px;
    }
    #content blockquote h3, #content blockquote h4 {
        font-size: 14px;
        line-height: 22px;
    }
    .csi-gallery.grid-phone .csi-gallery-inner-grid .csi-gallery-item {
        width: calc(50% - 32px);
        margin: 0 16px 32px 16px;
    }
    .giphone .csi-gallery-item {
        border-radius: 16px;
        box-shadow: 0px 0px 0px 4px #1f1f1f, 0px 0px 0px 5px #191919, 0px 0px 0px 8px #111;
    }
    .giphone .csi-gallery-item img {
        border-radius: 14px;
    }
    .csi-ifull-inner.if-ipad {
        padding: 16px;
        border-radius: 32px;
        border: 3px solid #d9dade;
    }
    .csi-ifull-inner.if-ipad.video video {
        border-radius: 12px;
    }
    .csi-ifull-inner.if-ipad img {
        border-radius: 12px;
    }
    .csi-full h1 {
        font-size: 42px;
        line-height: 52px;
        margin: 0 0 32px 0;
    }
    #content h3 {
        font-size: 22px;
        line-height: 30px;
    }
}
@media only screen and (max-width:480px) {
    #footer-inner {
        padding: 48px 24px 30px 24px;
    }
    #footer-inner #footer-items .fitem-container-full h2 {
        font-size: 28px;
        line-height: 42px;
    }
    #menu #menu-inner .menucol-title, #menu #menu-inner ul li {
        opacity:0;
        transform: translate(32px,0);
        transition: all .6s ease;
    }
    #menu.mopen #menu-inner .menucol-title, #menu.mopen #menu-inner ul li {
        transition: all .6s ease .2s;
    }
    #circle {
        right: -125px;
        width:250px;
        height: 250px;
        border: 80px solid #da2627;
    }
    #circle.loaded {
        -webkit-animation: 20s linear 0s normal none infinite running cell;
        animation: 20s linear 0s normal none infinite running cell;
    }
    #services-inner .service-box {
        padding: 24px 24px 48px 24px;
    }
    #services-inner .service-box .service-link {
        bottom: 24px;
        right: 24px;
    }
    .csi-info-item {
        width:100%;
        padding-right:0;
        text-align: center;
    }
    .csi-full {
        padding: 24px 24px 4px 24px;
    }
    #cs-cta {
        padding:24px 24px 88px 24px;
    }
    .csi-info {
        margin-bottom: 20px;
    }
    #lead-inner .lead-item {
        width: 90%;
    }
    #lead-inner .lead-left h1, #lead-inner .lead-left h2 {
        font-size: 44px;
        line-height: 54px;
    }
    #content p {
        margin: 0 0 24px 0;
    }
    .csi-gallery.grid {
        padding: 28px 24px 0 24px;
    }
    #global-info {
        position: fixed;
        bottom:-480px;
        right:-480px;
        width:calc(100% - 48px);
    }
    .mt-text.desktop {
        display: none;
    }
    .mt-text.mobile {
        display: block;
    }
}
@media only screen and (max-width:414px) {
    #pfilter {
        margin: 0 12px 24px 12px;
    }
    .csi-gallery-item-caption {
        max-width:320px;
    }
    .sbi-acc-trigger svg {
        width: 12px;
        height: 20px;
    }
}
@media only screen and (max-width:375px) {
    #footer-inner #footer-items .fitem-container-full h2 {
        font-size: 24px;
        line-height: 32px;
    }
    .sbi-ltiles-inner .sbi-ltiles-item {
        width: calc(100% - 4px);
    }
    .csi-gallery-inner .csi-gallery-item img {
        max-height: 216px;
    }
    .csi-full h1 {
        font-size: 36px;
        line-height: 46px;
        margin: 0 0 20px 0;
    }
    .csi-gallery-inner-grid .csi-gallery-item {
        width: calc(100% - 24px);
        margin: 0 12px 20px 12px;
    }
    .cs-cta-button a {
        font-size: 15px;
        padding: 10px 20px 8px 20px;
    }
    #menu-title span.mt-text {
        font-size: 11px;
        letter-spacing:.5px;
    }  
    
    .tsarrows {
        left:56px;
    }
    #testimonials-content-slider .slick-list {
        padding:0 0 0 56px !important;
    }
    #testimonials h2 {
        padding-left:56px;
    }
}