html,body,{height:100%}body{font-family: Arial, Helvetica, sans-serif;color:#555;background-color:#fff;-moz-box-sizing:border-box;box-sizing:border-box}
::-moz-selection {
    color: #fff;
    background: #9999cc;
}
::selection {
    color: #fff;
    background: #9999cc;
}
.stickmenimages { height:260px;}
.profimg {border:5px solid #fff; border-radius:100%; width:220px; height:220px;}
.pagination {width:100%;}
.pagination tr {width:100%;}
.pagination td {width:33.33%; text-align:center;}
.big-letter {
	background: #9999cc;
	margin: 40px 0 0;
	padding: 8px 13px;
	display: block;
	text-align: center;
	width: 30px;
	font-size: 1.6em;
	font-weight: bold;
	color: #fff;
}
.letters-bg {
	margin: 15px 0 0 0;
	padding: 8px 20px;
	font-size: 1.3em;
	word-spacing: .4em;
	line-height: 1.4em;
}
.letters-bg a{padding-left:0.5em; float:left;}
.glossar-bg {
	background-color: #fafafa;
	margin: 15px 0 0 0;
	padding: 2px 20px 15px 20px;
}
.glossar-bg dt {
	margin:20px 0em 1em;
	padding:0;
	font-size:1em;
	font-weight:bold;
	color:#9999cc;
	text-transform: none;
}
.glossar-bg dd {
	margin-left:0.6em;
	font-size:.9em;
	line-height:1.5em;
	color:#505050;
	margin-bottom:10px;
	text-align:justify;
}
.letters-bg-bottom {
	background-color: #fafafa;
	margin: 40px 0 30px 0;
	padding: 10px 20px;
	font-size: 1.4em;
	word-spacing: .4em;
	line-height: 1.4em;
}

.text {text-align:justify;}
#example_code{ float:left; width:95%;}
#example_code .tabpanel a{text-decoration:none;}
#example_code .tabpanel a:hover{cursor:pointer;}
#example_code .tabpanel{padding:0}
#example_code .tablist{margin:0;padding:0;list-style:none}
#example_code .tab{font-size:1.5em;padding:0.7em;font-weight:700;border-top:1px dashed #999;border-right:1px dashed #999;border-left:1px dashed #999;-webkit-border-radius-topright:5px;-webkit-border-radius-topleft:5px;-moz-border-radius-topright:5px;-moz-border-radius-topleft:5px;border-radius-topright:5px;border-radius-topleft:5px;float:left}
#example_code #tab99{border-right:none;border-left:none;background:none}
#example_code .panel{ text-align: justify;clear:both;padding:1.05em;border-left:1px dashed #999;border-right:1px dashed #999;}
#example_code h3[aria-selected="true"]{color:#9999cc}
#example_code p { line-height:1.6em}
#example_code .focus{color:#363636;margin-top:0}
#example_code div[aria-hidden="true"]{display:none}
#example_code .accordian{float:none;-webkit-border-radius:0;-moz-border-radius:0;border-radius:0;width:100%;margin:0 auto}
#example_code .hidden{position:absolute;left:-300em;top:-30em}
.blogsite { min-height:780px;}


.swiper-wrapper{
	width:100%;
}
.swiper-slide{
	width:100%;
	height:100%;
}
.swiper-slide img{
	width:100%;
	height:auto;
}
.swiper-pagination{
}
.referenzen ul.links{
	width:100%;
	padding:0;
	margin:0;
	height:30px;
}
.referenzen ul.links li{
	margin-left:10px;
	margin-right:10px;
	list-style:none;
	float:left;
	display:inline-block;
	border:none;
	height:20px;
	padding:0px;
	width:20px;
}
.referenzen ul.links li a{
	height:20px;
	width:20px;
	padding:5px;
	border-radius:20px;
	background-color:#9999cc;
	display:block;
	color:#fff;
	text-align:center;
	line-height:20px;
	font-size:1em;
}
.referenzen ul.links li a:hover{
	background-color:#707070;
}
ul.socialprofiles{
	width:100%;
	padding:0;
	margin:0;
	height:30px;
}
ul.socialprofiles li{
	margin-left:10px;
	margin-right:10px;
	list-style:none;
	float:left;
	display:inline-block;
	border:none;
	height:20px;
	padding:0px;
	width:20px;
}
ul.socialprofiles li button{
	height:30px;
	width:30px;
	padding:5px;
	border:none;
	border-radius:30px;
	background-color:#9999cc;
	display:block;
	color:#fff;
	text-align:center;
	line-height:20px;
	font-size:1em;
}
ul.socialprofiles li a{
	height:20px;
	width:20px;
	padding:5px;
	border:none;
	border-radius:20px;
	background-color:#9999cc;
	display:block;
	color:#fff;
	text-align:center;
	line-height:20px;
	font-size:1em;
}
ul.socialprofiles li button:hover, ul.socialprofiles li a:hover{
	background-color:#707070;
}

@media (max-width:767px){body{width:100%;overflow-x:hidden}}
h1{font-size:2.5em;font-weight:400;color:#9999cc}
h2{font-size:1.5em;color:#9999cc}h3{font-size:1.25em}
h4{font-size:1em}
p{font-size:1em;line-height:1.6em;color:#707070;}
a{color:#9999cc;text-decoration:none}
a:hover{text-decoration:underline}
.cf:before,.cf:after{display:table;content:" "}
.cf:after{clear:both}
.centered{max-width:960px;margin-right:auto;margin-left:auto}
.logo{display:inline-block;font-size:150%;text-decoration:none!important; padding-top:0.3em;}
.logo img{ height:50px; width:50px;}
.logo a:hover { text-decoration:none;}
.logo div { height:50px; overflow:hidden; display:inline-block;}
.logo .logo_name{ color:#888;padding-top:5px; font-size:22px; line-height:25px; font-weight:600;text-transform:uppercase; height:25px; display:block;}
.logo .logo_text{ color:#888;font-size:12px; line-height:25px; height:25px; display:block;}
.fright{float:right}
.pure-button{font-weight:700;color:#eee;background-color:#9999cc;}
.pure-button:hover{text-decoration:none;background-image:-webkit-linear-gradient(rgba(255,255,255,.1) 100%,rgba(255,255,255,.1) 0);background-image:linear-gradient(rgba(255,255,255,.1) 100%,rgba(255,255,255,.1) 0)}
.pure-button-skinny{color:#fff;background:transparent;border:.125em solid #fff}
.pure-button-green{color:#fff;background-color:#9999cc}
.pure-button-right{float:right}
.pure-form.pure-form-stacked input{margin-bottom:2em}
.pure-form input[type=text]:focus,.pure-form input[type=email]:focus,.pure-form textarea:focus{border-color:#9999cc}
.pure-form input,.pure-form textarea{width:100%;border-radius:.25em}
.pure-form fieldset.small-block{padding:0 1em;margin-bottom:3em;margin-bottom:0;-moz-box-sizing:border-box;box-sizing:border-box}
.pure-form fieldset.small-block--left{padding-right:2em;padding-left:0}
.pure-form fieldset.small-block--right{padding-right:0;padding-left:2em}
.pure-form input[type=text],.pure-form input[type=password],.pure-form input[type=email],.pure-form input[type=url],.pure-form input[type=date],.pure-form input[type=month],.pure-form input[type=time],.pure-form input[type=datetime],.pure-form input[type=datetime-local],.pure-form input[type=week],.pure-form input[type=number],.pure-form input[type=search],.pure-form input[type=tel],.pure-form input[type=color],.pure-form select,.pure-form textarea{font-size:1em;border-color:#dadac8;box-shadow:none}
.pure-form label{font-size:100%;color:inherit}
@media (max-width:767px){
	.pure-g-r>[class*=pure-u-]{padding-right:0!important;padding-left:0!important}
}
@-webkit-keyframes bounce{
	0%{opacity:.75;-webkit-transform:scale(1);transform:scale(1)}
	40%{-webkit-transform:scale(1.15);transform:scale(1.15)}
	100%{opacity:1;-webkit-transform:scale(1);transform:scale(1)}
}
@keyframes bounce{
	0%{opacity:.75;-webkit-transform:scale(1);transform:scale(1)}
	40%{-webkit-transform:scale(1.15);transform:scale(1.15)}
	100%{opacity:1;-webkit-transform:scale(1);transform:scale(1)}
}
@-webkit-keyframes slide-in{
	from{margin-top:-3em;opacity:0}
	to{margin-top:0;opacity:1}
}
@keyframes slide-in{
	from{margin-top:-3em;opacity:0}
	to{margin-top:0;opacity:1}
}
.close-main-nav, .open-main-nav{
	display:none;
}
.main-nav{position:fixed;z-index:100;width:100%;padding:0 1.25em;background:#fff;border-bottom:3px solid #efefe7;-moz-box-sizing:border-box;box-sizing:border-box;-webkit-transition:all 400ms;transition:all 400ms}
.main-nav_links{float:right;padding:0;margin:0;margin:0 -.75em;list-style:none}
.main-nav_links li{display:inline}
.main-nav_links a{display:inline-block;padding:1em .75em;font-weight:700;line-height:2.25em;letter-spacing:.0625em;color:rgba(85,85,85,.8);text-decoration:none;text-transform:uppercase}
.main-nav_links a:hover{color:#555}
.main-nav_links .active a{color:#9999cc}

.main-footer{ position:relative;bottom:0;width:100%;padding:2em 0;color:#fff;text-align:center;background:#333}
.main-footer a{color:#6f6f6f}
.main-footer__copy{display:block;margin-bottom:.5em;font-size:1.25em}
.small-block{padding:0 1em;margin-bottom:3em;-moz-box-sizing:border-box;box-sizing:border-box}
.small-block--right{padding-right:0;padding-left:2em}
.small-block--left{padding-right:2em;padding-left:0}
.small-block__image{display:block;margin:0 auto}
.landing-section{ padding-top:4em; padding-bottom:2em; padding-left:1.25em; padding-right:1.25em;}
.intro{margin:1em auto 4em;font-size:1.2em;line-height:1.7em;color:#333;border-bottom:3px solid #efefe7}
.leistungen__block{margin-bottom:4em}
@media (max-width:767px){
	.leistungen__image{text-align:center;}
}
.tags{padding-left:.75em;list-style:none}
.tags li{position:relative;display:block;float:left;padding:.25em .65em .25em .5em;margin-right:1.25em;margin-bottom:.5em;font-size:.85em;line-height:1.25em;background:#efefe7;border-radius:.25em}
.tags li:after{position:absolute;top:0;left:-1.55em;display:block;width:0;height:0;border:.85em solid transparent;border-right-color:#efefe7;content:" "}
.referenzen__heading{margin-bottom:0}
.referenzen__subheading{margin-top:0;font-weight:400;color:#888}
.referenzen_work{ font-size:1em;line-height:1.4em; padding-left:0;color:#505050;list-style:none}
.referenzen_work li{font-size:1em;text-align:left;padding:.6em 0;border-bottom:1px solid #efefe7}
.referenzen__button{margin-top:2em;text-align:center}
.referenzen__further{margin-top:2em}
.referenzen__badges{line-height:2em}
.referenzen__badge{padding:.25em .5em;background-color:#efefe7;border-radius:.25em}
.portrait__image{display:block;margin:0 auto;border-radius:50%}
.portrait__heading{font-size:2em;text-align:center}
.portrait__actions .pure-button{padding-left:3em;background:#efefe7 url(../images/mail.svg) no-repeat 1em center;background-size:22px 14px}
.portrait__actions .pure-button:hover{background-color:#f9f9f6}
.contact-form__potty{position:absolute;top:-9999px;left:-9999px}
.contact-form__message{height:129px}
@media (max-width:680px){
	.logo img{ height:45px; padding:0; margin:0; width:45px;}
	.logo a:hover { text-decoration:none;}
	.logo div { height:45px; overflow:hidden; display:inline-block;}
	.logo .logo_name{color:#888;font-size:20px; line-height:20px; font-weight:600;text-transform:uppercase; height:20px; display:block;}
	.logo .logo_text{color:#888;font-size:12px;line-height:20px; height:20px; display:block;}
	.close-main-nav, .open-main-nav{
		position:absolute;
		right:0px;
		top:0px;
		height:60px;
		width:60px;
		line-height:60px;
		font-size:1.2em;
		text-align:center;
	}
#main-nav:target .open-main-nav, .close-main-nav{
	display:none;
}
#main-nav:target .close-main-nav, .open-main-nav{
	display:block;
}
#main-nav{
	transition: width 0.3s ease;
	position:fixed !important;
	display:block;
	top: 0;
 	left: 0;
	z-index:999;
	width:100vw;
	height:60px;
	overflow:hidden;
	padding:0 1.25em;
	background:#fff;
	transition:1s ease-in-out;
   	-moz-transition:1s ease-in-out;
   	-webkit-transition:1s ease-in-out;
}
#main-nav:target {
	height:auto;
}
.main-nav_links{
	width:100%;
	padding-bottom:1em;
	margin:0;
	list-style:none
}
.main-nav_links li{
	display: block;
	width:100%;
	height:60px;
}
.main-nav_links li a{
	display: block;
	width:100%;
	padding:0 0.5em;
	height:60px;
	line-height:60px;
	font-size:1.2em;
}
}
@media (max-width:560px){
	#example_code .tab{ font-size:1.1em;}
	#example_code {margin-left:-3%}
	section img {display:none; opacity:0;}
	section.home img, section.referenzen img, section.uebermich img {display:block; opacity:1;}
	.logo{display:block; width:100%; height:60px;}
}