@charset "UTF-8";
/* CSS Document */
body {
	width:100%;
	height:100%;
	margin:0;
	padding:0;
	background-color:rgba(255,255,255,1);
	color:rgba(20,33,43,1);
	font-family:'catamaran-light';
	font-size:16px;
	line-height:1.4em;
	letter-spacing:0.04em;
}

@font-face {
    font-family:'catamaran-light';
    src: url('fonts/catamaran/light/catamaran-light-webfont.eot');
    src: url('fonts/catamaran/light/catamaran-light-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/catamaran/light/catamaran-light-webfont.woff2') format('woff2'),
         url('fonts/catamaran/light/catamaran-light-webfont.woff') format('woff'),
         url('fonts/catamaran/light/catamaran-light-webfont.ttf') format('truetype'),
         url('fonts/catamaran/light/catamaran-light-webfont.svg#catamaranlight') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family:'catamaran-black';
    src: url('fonts/catamaran/black/catamaran-black-webfont.eot');
    src: url('fonts/catamaran/black/catamaran-black-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/catamaran/black/catamaran-black-webfont.woff2') format('woff2'),
         url('fonts/catamaran/black/catamaran-black-webfont.woff') format('woff'),
         url('fonts/catamaran/black/catamaran-black-webfont.ttf') format('truetype'),
         url('fonts/catamaran/black/catamaran-black-webfont.svg#catamaranblack') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family:'ibm-light';
    src: url('fonts/ibm/light/ibmplexsans-light-webfont.eot');
    src: url('fonts/ibm/light/ibmplexsans-light-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/ibm/light/ibmplexsans-light-webfont.woff2') format('woff2'),
         url('fonts/ibm/light/ibmplexsans-light-webfont.woff') format('woff'),
         url('fonts/ibm/light/ibmplexsans-light-webfont.ttf') format('truetype'),
         url('fonts/ibm/light/ibmplexsans-light-webfont.svg#ibm_plex_sanslight') format('svg');
    font-weight:normal;
    font-style:normal;
}
@font-face {
    font-family:'ibm-bold';
    src: url('fonts/ibm/bold/ibmplexsans-bold-webfont.eot');
    src: url('fonts/ibm/bold/ibmplexsans-bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/ibm/bold/ibmplexsans-bold-webfont.woff2') format('woff2'),
         url('fonts/ibm/bold/ibmplexsans-bold-webfont.woff') format('woff'),
         url('fonts/ibm/bold/ibmplexsans-bold-webfont.ttf') format('truetype'),
         url('fonts/ibm/bold/ibmplexsans-bold-webfont.svg#ibm_plex_sansbold') format('svg');
    font-weight:normal;
    font-style:normal;
}

img { width:100%; float:left;}
input.hidden {display:none;}
label:hover { cursor:pointer;}

.borderline { width:100%; float:left; margin:24px 0; border-bottom:1px solid rgba(0,0,0,0.1);}

/* LINKS */
a { color:inherit; text-decoration:none; border:0 none;}
a:hover { cursor:pointer; }
a.txtlink { text-decoration:underline;}
a.txtlink:hover, a.formdetail_link:hover { opacity:0.8;}
a:link img {border:0px;}

/* HEADLINES | TXT | MARKUPS */
h1, h2, h3, h4 { margin:0; padding:0; font-weight:normal;}
h1 { font-family:'ibm-bold'; font-size:1.8em; line-height:1.1em; letter-spacing:0.09em;}
h2 { font-family:'ibm-bold'; font-size:1.6em; line-height:1.3em; letter-spacing:0.05em;  }
h3 { font-family:'ibm-light'; font-size:1.2em; line-height:1.2em; }
h4 { font-family:'ibm-light'; font-size:1.0em; line-height:1.2em; }

b, strong { font-weight:normal; font-family:'catamaran-black';}
p { width:100%; margin:0; padding:0; line-height:1.4em; float:left;}
small { font-size:0.8em;}

ul {width:100%; float:left; margin:0 0 0 0; padding:0 0 0 21px;}
li.bigger { font-size:1.1em; font-weight:bold; }

.txt_center { text-align:center;}
.txt_left { text-align:left;}
.txt_right { text-align:right;}
.txt_block { text-align:justify;}
.uppercase { text-transform:uppercase;}

span.txt_EN {
	width:100%;
	float:left;
	margin:20px 0 0 0;
	color:rgba(120,120,120,1);
}

#nav, .navitem, .teaseritem, .jobitem, .box, .logo.small, .logo, .workflow_item .descr, .workflow_item .icon
{	transition:all 0.4s ease-in-out;
	-webkit-transition:all 0.4s ease-in-out;
	-moz-transition:all 0.4s ease-in-out;
	-ms-transition:all 0.4s ease-in-out;
	-o-transition:all 0.4s ease-in-out;
}

.teaser_noexpertyet, .address_item, .claim > p.contact
{-webkit-font-smoothing: antialiased; -moz-font-smoothing: antialiased; -ms-font-smoothing: antialiased; -o-font-smoothing: antialiased;}

#root, #vertrauen-und-diskretion .banner {
	animation:BlendInAnimation 1.8s ease;
	-webkit-animation:BlendInAnimation 1.8s ease;
	-moz-animation:BlendInAnimation 1.8s ease;
	-ms-animation:BlendInAnimation 1.8s ease;
	-o-animation:BlendInAnimation 1.8s ease;
}

.navitem_wrap, #vertrauen-und-diskretion .background {
	animation:BlendInAnimation 0.8s ease;
	-webkit-animation:BlendInAnimation 0.8s ease;
	-moz-animation:BlendInAnimation 0.8s ease;
	-ms-animation:BlendInAnimation 0.8s ease;
	-o-animation:BlendInAnimation 0.8s ease;
}

/*BlendInAnimation*/
@-webkit-keyframes BlendInAnimation {
	0% { opacity:0;}
	20% { opacity:0;}
	100% { opacity:1;}
}

@-moz-keyframes BlendInAnimation {
	0% { opacity:0;}
	20% { opacity:0;}
	100% { opacity:1;}
}

@-ms-keyframes BlendInAnimation {
	0% { opacity:0;}
	20% { opacity:0;}
	100% { opacity:1;}
}

@-o-keyframes BlendInAnimation {
	0% { opacity:0;}
	20% { opacity:0;}
	100% { opacity:1;}
}

/* COLOR */
.c_vup01 {color:rgba(20,33,43,1);}
.c_vup02 {color:rgba(43,91,100,1);}
.c_vup03 {color:rgba(0,159,160,1);}
.c_vup04 {color:rgba(80,188,189,1);}
.c_vup05 {color:rgba(142,196,193,1);}
.c_vup06 {color:rgba(215,226,230,1);}

*::-webkit-selection { background-color:rgba(80,188,189,1); color:#FFF; text-shadow:none;}
*::-moz-selection { background-color:rgba(80,188,189,1); color:#FFF; text-shadow:none;}
*::selection { background-color:rgba(80,188,189,1); color:#FFF; text-shadow:none;}

/* NAV */
#nav {width:100%; position:fixed; z-index:100;}
#nav > .inner { width:96%; float:left; margin:24px 2%;}

/*
#nav .logo { display:inline-block; padding:2em; background:#fff; }
#nav .logo.mobile { display:none; }
#nav .logo img { margin:0; width:300px; }
*/

#nav .logo {
	width:220px;
	float:left;
	margin:0;
}

.mobileicon {
	width:20px;
	height:20px;
	padding:10px;
	float:right;
	display:none;
	position:relative;
	z-index: 10;
}

.mobileicon span {
	width:90px;
	font-family:'ibm-bold';
	color:rgba(20,33,43,1);
	position:absolute;
	transform:rotate(90deg); -webkit-transform:rotate(90deg);; -moz-transform:rotate(90deg); -ms-transform:rotate(90deg); -o-transform:rotate(90deg);
	top:80px;
	right:-25px;
} 

.mobileicon[title="close"] span { color:rgba(255,255,255,1);}

#nav:not(:target) > .inner > .mobileicon[title="open"] { display:block;}
#nav:target > .inner > .mobileicon[title="close"] { display:block;}

#nav:target > .inner > .navitem_wrap { display: flex ;}

.navitem_wrap {
	width:100%;
	min-height:100%;
	background-color:rgba(20,33,43,0.95);
	color:rgba(255,255,255,1);
	position:fixed;
	top:0;
	right:0;
	display:none;
	
	flex-direction: column ;
	flex-wrap: wrap ;
	justify-content:center;
	align-items: center ;
	align-content: center ;
}

.navitem {
	width:100%;
	font-size:2.0em;
	padding:20px 0;
	float:left;
	text-align:center;
	font-family:'ibm-light';
}

.navitem:hover { opacity:0.5;}

.navitem_wrap > a:nth-of-type(1) .navitem { margin-top:5px;}

.nav_dd_item { 
	width:100%; 
	float:left; 
	text-align:center;
	background-color:rgba(0,0,0,0.2);
	padding:0 0 40px 0;
}

.nav_dd_item .closeitem { width:24px; float:right; margin:20px 20px 0 0;}
.nav_dd_item .item {
	width:100%;
	float:left;
	font-size:1.4em;
	padding:10px 0;
}

input#dd_hide:checked ~ .nav_dd_item { display:none;}
input#dd_karriere:checked ~ .nav_dd_item[title="karriere"] { display:block;}

/* SLIDE */
.slide { width:100%; min-height:auto; float:left; position:relative;}
.slide.top {box-shadow:inset 0px 0px 0px 4pt rgba(20,33,43,1); }

.slide.top:after {
	content:'';
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 14px 12px 0 12px;
	border-color: rgba(20,33,43,1) transparent transparent transparent;
	position:absolute;
    bottom:-14px;
    left:50%;
    margin-left:-12px;
}

.slide.jobs,
.slide.culture,
.slide.service,
.slide.statements {
	padding:40px 0;
}

.slide.sleeve {
	padding:0 0;
}

.slide.jobs,
.slide.sleeve {
	background-color:rgba(215,226,230,1);
}

.slide.culture {
	background-color:rgba(198,211,217,1);
}

.slide.service {
	background-color:rgba(80,188,189,1);
}

.slide.statements {
	background-color:rgba(198,211,217,1);
}

.slide.news {
	background-color:rgba(198,211,217,1);
	padding:120px 0;
}

.slide.background {
	background-image:url(../img/content/vup_bg_halle.jpg);
	background-size:cover;
	background-position:50% 50%;
	min-height:720px;
}

.slide .inner {
	width:90%;
	max-width:1200px;
	float:none;
	margin:0 auto;
	padding:0 5%;
}

.slide .side_hdln {
	font-size:10em;
	position:absolute;
	color:rgba(198,211,217,1);
	left:-3%;
    top:24%;
	z-index:0;
	transform:rotate(-90deg); -webkit-transform:rotate(-90deg); -moz-transform:rotate(-90deg); -ms-transform:rotate(-90deg); -o-transform:rotate(-90deg);
}

.slide.sleeve .inner .preview_content h1 {
	text-align:left;
	font-size:1.6em;
}

/* BUTTON */
.button_wrap {
	width:100%; 
	float:left;
	display:flex;
	flex-direction:column;
	flex-wrap:wrap;
	justify-content:center;
	align-items:center;
	align-content:center;
}

.logo_wrap {
	width:100%; 
	float:left;
	display:flex;
	flex-direction:row;
	flex-wrap:wrap;
	justify-content:center;
	align-items:center;
	align-content:center;
}

.logo_wrap img.logo {
	height:70px;
}

.button {
	width:auto;
	padding:10px 20px;
	text-align:center;
	float:left;
	margin:20px 0;
	text-transform:uppercase;
	font-family:'ibm-bold'
}

.button.small {
	padding:5px 10px;
	font-size:0.8em;
	letter-spacing:0.05em;
	margin:8px;
} 

.button_wrap > a:nth-of-type(1) .button.small { margin-top:40px;}

.button.white {
	background-color:rgba(255,255,255,1);
	color:rgba(80,188,189,1);
}

.button.darkblue {
	background-color:rgba(20,33,43,1);
	color:rgba(255,255,255,1);
}

.button.blue {
	background-color:rgba(20,33,43,1);
	color:rgba(80,188,189,1);
	box-shadow:0px 0px 0px 1pt rgba(80,188,189,1);
}

.button.turquoise {
	background-color:rgba(80,188,189,1);
	color:#fff;
}

.big.button {
	font-size:1.5em;
}

.textbutton {
	color: rgba(0,159,160,1);
	text-decoration:underline;
	text-transform:uppercase;
	letter-spacing:0.02em;
}

/* CONTENT */
.intro {
	width:34%; 
	height:100vh;
	float:left;
	background-color:rgba(20,33,43,1);
	color:rgba(255,255,255,1);
}

.intro_txt {
	width:90%;
	float:left;
	margin:40px 5%;
	font-size:1.5em;
	text-align:center;
}

.intro .logo_wrap { margin:40px 0;}
.intro .logo_wrap .logo { width:300px;}

.claim {
	width:70%;
	float:left;
	margin:80px 15% 0 15%;
	text-align:center;
	color:rgba(0,159,160,1);
}

.claim img { width:100%; float:left; margin-bottom:40px;}
.claim h2 { font-family:'ibm-light'; font-size:1.8em; text-transform:uppercase;}
.claim h1 { font-size:3.0em; text-transform:uppercase;}

.claim > p.contact { font-size:1.4em; color:rgba(255,255,255,1);}

.campaign_image { 
	width:66%;
	height:100vh;
	float:left;
	position:relative;
	z-index:-5;
	background-image:url(../img/content/vup_campaign_image.jpg);
	background-size:cover;
	background-position:50% 50%;
	background-repeat:no-repeat;
}

.campaign_image > iframe {
	z-index:1000;
	position:relative;
}

.page_image {
	width:100%;
	float:left;
	margin:80px 0 40px 0;
	box-shadow:0px 0px 20px rgba(0,0,0,0);
}

.image_wrap { width:100%; float:left; margin:40px 0;}
.image_wrap .image_square {width:32.5%; float:left; margin-right:2.5%;}
.image_wrap .image_narrow {width:65%; float:left;}

.row { 
	width:100%;
	float:left;
	margin:80px 0 50px 0;
	
	display:flex;
	flex-direction:row;
	flex-wrap:wrap;
	justify-content:center;
	align-items:stretch;
	align-content:center;
}

.column_03 {
	width:32%;
	float:left;
	margin:0 2% 0 0;
	text-align:left;
}

.column_03 h2 { margin-bottom:10px;}

.row > .column_03:last-of-type { margin:0;} 
.row > .column_03:nth-of-type(2) { 
	border-left:1px solid rgba(0,0,0,0.2);
	border-right:1px solid rgba(0,0,0,0.2);
	margin-left:-2px; 
	padding:0 2%; 
	width:28%;
} 

#vertrauen-und-diskretion { }
#vertrauen-und-diskretion:target > .banner {
	width:720px;
	height:450px;
	padding:40px;
	background-color:rgba(255,255,255,1);
	display:block;
	position:fixed;
	z-index:100;
	top:20%;
	left:50%;
	margin-left:-400px;
	box-shadow:0px 0px 120px rgba(0,0,0,1);
	text-align:center;
}

.banner { display:none;}
.banner h1 { margin:20px 0 20px 0;}
.banner p { font-size:1.4em;}

#vertrauen-und-diskretion:target > .background {
	content:'';
	width:100%;
	height:100vh;
	position:fixed;
	background-color:rgba(20,33,43,0.8);
	z-index:20;
	top:0;
	left:0;
}

.box_wrap {
	width:100%;
	float:none;
	margin:40px 0;
	
	column-count:4;
	-webkit-column-count:4;
	-moz-column-count:4;
	-ms-column-count:4;
	-o-column-count:4;
	
	column-gap:0;
	-webkit-column-gap:0;
	-moz-column-gap:0;
	-ms-column-gap:0;
	-o-column-gap:0;
}

.box {
	width:80%;
	min-height:110px;
	float:none;
	margin:10px 2% 0 2%;
	padding:25px 8%;
	background-color:rgba(215,226,230,0.5);
	box-shadow:0px 0px 10px rgba(0,0,0,0);
	font-size:1.2em;
	line-height:1.4em;
	display:inline-table;
}

.box:hover {background-color:rgba(215,226,230,1);}

/* ADDRESS ITEM */
.address_item {
	width:100%;
	float:left;
	margin-bottom:80px;
	background-color:rgba(20,33,43,1);
	color:rgba(255,255,255,1);
	display:flex;
	align-items: stretch ;
}

.address_item .address_image {width:40%;float:left;margin:0 4% 0 0;}

.address_item .descr {
	width:46%;
	float:left;
	padding:44px 0;
	font-size:1.4em;
	line-height:1.2em;
}

.address_item .contact.button_wrap {
	width:10%;
	float:left;
	
	display:flex;
	flex-direction:row;
	flex-wrap:center;
	justify-content:center;
	align-items:center;
	align-content:center;
}

.person_wrap {
	width:100%;
	float:left;
	margin:40px 0;
	
	display:flex;
	flex-direction:center;
	flex-wrap:center;
	justify-content:center;
	align-items:center;
	align-content:center;
}

.person_wrap .contact_person {
	width:300px;
	margin:0 2%;
	float:left;
	background-color:rgba(255,255,255,1);
	box-shadow:0px 20px 60px rgba(20,33,43,0.2);
}

.person_wrap .contact_person .descr { text-align:center; font-size:1.4em;}

/* TEXT CONTENT SMALL */

.text_wrap_small {}

.text_block {
	width:740px;
	float:left;
	margin:20px 0;
	padding:30px;
	background-color:rgba(255,255,255,1);
	box-shadow:0px 20px 60px rgba(20,33,43,0.2);
}

/* NEWS ITEM*/
.newsitem_wrap,
.text_wrap_small { 
	width:100%;
	float:left;
	
	display:flex;
	flex-direction:column;
	flex-wrap:center;
	justify-content:center;
	align-items:center;
	align-content:center;
}

.newsitem.big {}

.newsitem.big .descr p.txt_preview {
	width:100%;
	height:auto;
	float:left;
	margin:0 0 20px 0;
} 

.newsitem.big .descr p.txt_main {
	width:100%;
	height:auto;
	float:left;
	display:none;
}

input#show:checked + label { display:none;}
input#show:checked ~ p.txt_main { display:block;}

p.txt_main {
	animation:ContentLoadAnimation 1.0s ease;
	-webkit-animation:ContentLoadAnimation 1.0s ease;
	-moz-animation:ContentLoadAnimation 1.0s ease;
	-ms-animation:ContentLoadAnimation 1.0s ease;
	-o-animation:ContentLoadAnimation 1.0s ease;
}

table { border-collapse:collapse; }
.tbl_techdata_wrap table {  } 
.tbl_techdata_wrap table tr td { border:1px solid #000; padding:0.1em 0.5em; } 
	

/*ContentLoadAnimation*/
@-webkit-keyframes ContentLoadAnimation {
	0% { opacity:0;}
	50% { opacity:0;}
	100% { opacity:1;}
}

@-moz-keyframes ContentLoadAnimation {
	0% { opacity:0;}
	50% { opacity:0;}
	100% { opacity:1;}
}

@-ms-keyframes ContentLoadAnimation {
	0% { opacity:0;}
	50% { opacity:0;}
	100% { opacity:1;}
}

@-o-keyframes ContentLoadAnimation {
	0% { opacity:0;}
	50% { opacity:0;}
	100% { opacity:1;}
}

.newsitem {
	width:800px;
	float:left;
	margin:20px 0;
	background-color:rgba(255,255,255,1);
	box-shadow:0px 20px 60px rgba(20,33,43,0.2);
}
.newsitem .image { width:100%; float:left; border-bottom:1px solid rgba(0,0,0,0.1);}

.newsitem .descr,
.contact_person .descr {
	width:90%;
	padding:30px 5%;
	float:left;
	background-color:rgba(255,255,255,1);
}

.newsitem .descr h1 { text-transform:uppercase; margin-bottom:20px; word-wrap:break-word;}
.newsitem .descr small,
.contact_person .descr small { 
	width:100%;
	float:left;
	margin-top:20px;
	color:rgba(85,95,97,0.5);
}

/* STATEMENT ITEM */ 
.statement_item {
	width:80%;
	float:left;
	margin:50px 10%;
	display:flex;
	flex-direction:row;
	flex-wrap:wrap;
	justify-content:center;
	align-items:stretch;
	align-content:center;
}

.statement_item .descr { width:42%; padding:24px 4%;}
.statement_item .statement_image {
	width:50%;
	float:left;
	margin:0;
}

.statement_item .descr {
	text-align:center;
	display:flex;
	flex-direction:row;
	flex-wrap:wrap;
	justify-content:center;
	align-items:center;
	align-content:center;
	background-color:rgba(255,255,255,1);
}

.statement_item .descr h2 {text-transform:uppercase; margin-bottom:20px;}
.statement_item .descr p { font-size:1.2em; line-height:1.5em;}

/* TEASER ITEM */ 
.teaseritem {
	width:100%;
	height:auto;
	float:left;
	margin:40px 0;
	position:relative;
	z-index:5;
	background-color:rgba(255,255,255,1);
	box-shadow:0px 20px 60px rgba(20,33,43,0.2);
	display:flex;
	flex-direction:row;
	flex-wrap:wrap;
	justify-content:center;
	align-items:stretch;
	align-content:center;
}

.teaseritem:hover { 
	transform:scale(1.04); -webkit-transform:scale(1.04); -moz-transform:scale(1.04); -ms-transform:scale(1.04); -o-transform:scale(1.04);
	box-shadow:0px 40px 80px rgba(20,33,43,0.5);
} 

.teaseritem .teaser_image { width:45%; float:left;}

.teaseritem .descr {
	width:45%;
	padding:24px 5%;
	float:left;
	text-align:center;
	display:flex;
	flex-direction:row;
	flex-wrap:wrap;
	justify-content:center;
	align-items:center;
	align-content:center;
}

.teaseritem .descr h1 { margin-bottom:20px; text-transform:uppercase;}

.teaser_noexpertyet {
	width:90%;
	height:auto;
	float:left;
	padding:34px 5%;
	margin:40px 0;
	background-color:rgba(20,33,43,1);
	color:rgba(255,255,255,1);
}

.teaser_noexpertyet .header { width:40%; float:left; margin:0;}
.teaser_noexpertyet .header span {
	width:100%;
	float:left;
	font-size:2.6em;
	text-transform:uppercase;
	color:rgba(0,159,160,1);
	font-family:'catamaran-black';
	line-height:1.2em;
    text-align:right;
}
.teaser_noexpertyet .header span b {color:rgba(80,188,189,1);}

.teaser_noexpertyet .header small {
	width:100%;
	float:left;
	margin:12px 0 0 0;
	font-size:1.6em;
	text-align:right;
	text-transform:uppercase;
} 

.teaser_noexpertyet .descr {
	width:49%;
	float:left;
	padding:0 0 0 5%;
	margin:0 0 0 5%;
	border-left:1px solid rgba(255,255,255,1);
}

.teaser_noexpertyet .descr p { font-size:1.4em;}
.teaser_noexpertyet .descr a { color:rgba(80,188,189,1);}

.preview_content { width:100%; float:left; margin:40px 0; text-align:center;}
.preview_content h1.page_hdln { font-size:3.0em; text-transform:uppercase;}
.preview_content p { width:100%; font-size:1.4em; line-height:1.65em; margin:40px 0;}
.preview_content > span { width:100%; float:left;}
.preview_content > span:nth-of-type(1) { margin-top:24px;}

/* JOB ITEM */
.jobitem_wrap {width:100%; float:left; margin:40px 0;}
.jobitem_wrap > h1 {
	width:100%;
	float:left;
	margin:0 0 20px 0;
	text-align:center;
	text-transform:uppercase;
}

.jobitem {
	width:24%;
	min-height:214px;
	float:left;
	margin:0 0.5%;
	padding:30px 0 10px 0;
	background-color:rgba(255,255,255,1);
	text-align:center;
}

.jobitem:hover {
	transform:translate(0, -10px); -webkit-transform:translate(0, -10px); -moz-transform:translate(0, -10px); -ms-transform:translate(0, -10px); -o-transform:translate(0, -10px);
	box-shadow:0px 0px 20px rgba(20,33,43,0.4);
} 

.initiativbewerbung {
	width:100%;
	float:left;
	margin:10px 0;
	text-align:center;
}

/* SERVICE ITEM */
.service_wrap { width:100%; float:left;}

.service_item {
	width:21%;
	float:left;
	margin:20px 2%;
	padding:34px 0;
	text-align:center;
}

.service_item .icon {
	width:40%;
	float:left;
	margin:0 30% 24px 30%;
}

.service_item h1 { 
	text-transform:uppercase; 
	margin:20px 0;
	padding-bottom:20px;
	border-bottom:2px solid rgba(20,33,43,1);
}

/* WORKFLOW */

.workflow_wrap {
	width:100%;
	float:left;
	margin:30px 0;
}

.workflow_wrap  > h1 { text-align:center;}
.workflow_wrap  > p { 
	width:100%;
	float:left;
	font-size: 1.4em;
    line-height: 1.65em;
	text-align:center;
	margin:16px 0 34px 0;
}

.workflow_item { width:20%; float:left; position:relative;}
.workflow_item .icon { width:36%; float:left; margin:20px 32%;}
.workflow_item .descr {
	width:90%;
	float:left;
	padding:24px 5%;
	text-align:center;
	background-color:rgba(255,255,255,1);
	box-shadow:0px 0px 20px rgba(0,0,0,0.1);
	opacity:0;
}

.workflow_item:hover { cursor:pointer;}
.workflow_item:hover .descr  { opacity:1;}

.workflow_item .descr:before {
	content:'';
	width:0;
	height:0;
	border-style: solid;
	border-width: 0 7px 10px 7px;
	border-color: transparent transparent rgba(255,255,255,1) transparent;
	position:absolute;
	margin:-34px 0 0 -7px;
}

.workflow_item .border {
	width:32%;
	height:2px;
	background-color:rgba(20,33,43,1);
	position:absolute;
	margin:62px 0 0 0;
}

.workflow_item .border.before { left:0px;}
.workflow_item .border.after { right:0px;}

/* footer */

#footer {
	width:100%;
	float:left;
	background-color:rgba(255,255,255,1);
	padding:40px 0;
}

#footer .inner {
	width:90%;
	max-width:1200px;
	float:none;
	margin:0 auto;
	padding:0 5%;
}

#footer .logo { }
#footer .logo img { margin:4px 40px 20px 0; width:250px; }



#footer .logo.small { 
	width:180px;
	float:left;
	filter:grayscale(1);
	-webkit-filter:grayscale(1);
	-moz-filter:grayscale(1); 
	-ms-filter:grayscale(1); 
	-0-filter:grayscale(1); 
}

#footer .logo.small:hover {
	filter:grayscale(0);
	-webkit-filter:grayscale(0);
	-moz-filter:grayscale(0); 
	-ms-filter:grayscale(0); 
	-0-filter:grayscale(0); 
}

.contact_wrap { width:auto; float:left;}
.contact_wrap a,
.address_item a { color:rgba(80,188,189,1);}

.contact_wrap .contact_item { width:auto; float:left; margin:0 40px 0 0;}
.contact_wrap .contact_item:last-of-type {margin:0;}

/* MOBILE */
.mobile { display:none;}
.desktop { display:block;}

.row_el { display:block; width:100%; clear:both; }
.row_el:last-child { }
.row_el.space { margin:2em 0; }
.col { display:inline-block; float:left; padding-left:5%; }
.col:nth-of-type(1) { padding-left:0; }
.col.six { width:45%; }



@media screen and (max-width:1366px) {
	
	.navitem_wrap > a:nth-of-type(1) .navitem { margin-top:80px;}
	
	.claim {margin:80px 15% 0 15%;}
	.claim img {margin-bottom:30px;}
	.claim h1 {font-size: 2.5em;}
	.claim h2 {font-size: 1.5em;}
	
	.intro_txt {margin:30px 5%;}
	.intro .logo_wrap { margin: 20px 0 0 0;}
	
	.side_hdln { display:none;}
	
	#vertrauen-und-diskretion:target > .banner {top: 15%;}
	
	.box_wrap {
		column-count:3;
		-webkit-column-count:3;
		-moz-column-count:3;
		-ms-column-count:3;
		-o-column-count:3;
	}

	
}

@media screen and (max-width:1024px) {
	
	.claim {margin:80px 15% 0 15%;}
	.claim img {margin-bottom:30px;}
	.claim h1 {font-size: 2.0em;}
	.claim h2 {font-size: 1.0em;}
	
	.intro_txt {margin:20px 5%; font-size: 1.2em;}
	.intro .logo_wrap { margin: 20px 0 0 0;}
	
	.intro .logo_wrap .logo { width:220px; margin:20px 0;}
	
	.slide.background { min-height:500px;}
	
	#vertrauen-und-diskretion:target > .banner { width:680px; margin-left:-380px; height:auto;}
	
	.newsitem {
		width:90%;
		margin:20px 5%;
	}
	
	.workflow_item { width:50%; float:left; position:relative;}
	.workflow_item .border { display:none;}
	
	.workflow_item .descr {
		opacity:0;
		display:none;
		position:absolute;
		top:185px;
		z-index:10;
	}
	
	.workflow_item:hover .descr {
		opacity:1;
		display:block;
	}

	
}

@media screen and (max-width:768px) {
	
	.mobile,
	#nav .logo.mobile { display:block;}
	.desktop { display:none;}
	
	.campaign_image { width:100%; height:520px;}
	.intro { width:100%; height:auto; padding:20px 0;}
	
	.teaseritem { margin:20px 0;}
	.teaseritem .teaser_image {width:100%;}
	.teaseritem .descr { width:90%; padding:35px 5%;}
	
	.jobitem {width:49%; margin:3px 0.5%;}
	
	.teaser_noexpertyet { margin:20px 0;}
	.teaser_noexpertyet .header span {font-size:2.2em;}
	
	.preview_content p { font-size:1.2em;}
	
	.service_item { width:46%;}
	
	.image_wrap { margin:10px 0;}
	
	.column_03 { width:100%; margin:0;	}
	
	.row > .column_03:nth-of-type(2) { 
		border-left:0px none;
		border-right:0px none;
		margin-left:0; 
		padding:24px 0; 
		width:100%;
	} 
	
	.image_wrap .image_square,
	.image_wrap .image_narrow { width:100%; margin:0 0 10px 0;}
	
	.slide.background { min-height:450px;}
	
	.person_wrap {
		display:flex;
		flex-direction:column;
		flex-wrap:center;
		justify-content:space-around;
		align-items:center;
		align-content:center;
	}
	
	.person_wrap .contact_person { margin-bottom:20px;}
	
	#vertrauen-und-diskretion:target > .banner { 
		width:80%; 
		margin-left:0; 
		height:auto;
		position:absolute;
		top:24px;
		left:0;
		margin:0 5%;
		padding:24px 5%;
	}
	
	#vertrauen-und-diskretion:target > .banner p { font-size:1.0em;}
	
	.box_wrap {
		column-count:2;
		-webkit-column-count:2;
		-moz-column-count:2;
		-ms-column-count:2;
		-o-column-count:2;
	}
	
	.workflow_item { width:100%;}
	.workflow_item .border { display:none;}
	
	.workflow_item .descr {
		top:180px;
	}
	
	/*
	#nav .logo { padding:0; background:none; }
	#nav .logo img { margin:0 0 1em 0; width:70%; }
	*/
}

@media screen and (max-width:540px) {
	
	h1 {font-size:1.5em;}
	
	.logo {margin:8px 0 0 5%;}
	
	.slide .inner { width:96%; padding:0 2%;}
	
	#nav { background-color:rgba(255,255,255,1); border-bottom:1px solid rgba(0,0,0,0.1);}
	#nav > .inner { margin:10px 2%;}
	.navitem_wrap > a:nth-of-type(1) .navitem { margin-top:20px;}
	.navitem { font-size:1.2em; padding:12px 0;}
	
	.nav_dd_item .item {font-size: 1.2em;}
	.nav_dd_item .item:nth-of-type(1) { padding:0 0 10px 0;}
	.nav_dd_item .closeitem { width:20px;}
	
	.mobileicon span { display:none;}
	
	.slide.background { min-height:240px;}
	.slide.top { margin-top:65px;}
	
	.campaign_image { height:300px;}
	.intro {padding:20px 0 40px 0;}
	.claim {margin:20px 15% 0 15%;}
	
	.preview_content { word-wrap:break-word; margin:10px 2%; width:96%;}
	.preview_content h1.page_hdln { font-size:1.5em;}
	
	.teaseritem { margin:0;}
	.teaseritem .teaser_image {width:100%;}
	.teaseritem .descr {
		width:90%;
		padding:24px 5%;
	}
	
	.teaseritem .descr h1 { word-wrap:break-word; width:100%; float:left; font-size:1.2em;}
	
	.jobitem {width:100%; margin:5px 0%;}
	 
	.teaser_noexpertyet { margin:0; padding:20px 5%; width:90%;}
	
	.teaser_noexpertyet .header,
	.teaser_noexpertyet .descr { width:100%; text-align:center;}
	.teaser_noexpertyet .descr { margin:0; padding:0; border:0px none;}
	
	.teaser_noexpertyet .header span,
	.teaser_noexpertyet .header small { text-align:center;}
	.teaser_noexpertyet .header small { margin-bottom:20px;}
	
	.address_item { display:block;}
	.address_item .address_image,
	.address_item .descr {width:100%;}
	.address_item .descr { text-align:center;}
	.address_item .contact.button_wrap { display:none;}
	
	.statement_item { width:90%; margin:10px 5%;}
	.statement_item .descr, 
	.statement_item .statement_image { width:100%; margin:0;}
	
	.person_wrap { margin:0;}
	.newsitem {width:100%;margin:10px 0%;}
	.jobitem_wrap { margin:40px 0 20px 0;}
	
	.service_item { width:96%; padding:14px 0;}
	.service_item p { margin-bottom:20px;}
	
	#footer .logo,
	#footer .logo.small {
		width:80%;
		float:left;
		margin:24px 10%;
		padding:0;
	}
	
	.contact_wrap { width:100%;}
	
	.contact_wrap .contact_item {
		width:100%;
		float:left;
		text-align:center;
		margin-bottom:5px;
	}
	
	.row { margin:20px 0;}
	
	.box_wrap {
		column-count:1;
		-webkit-column-count:1;
		-moz-column-count:1;
		-ms-column-count:1;
		-o-column-count:1;
	}
	
	.box { min-height:auto;}
	.button { margin:5px 0;}
	.initiativbewerbung { margin:10px 0 30px 0;}
	.page_image {margin:74px 0 40px 0;}
	
	/*
	#nav .logo { padding:0; background:none; }
	#nav .logo img { margin:0 0 1em 0; width:70%; }
	*/
	
	.col.six { width:100%; }
	
	
}