@charset 'UTF-8';

/**********************************
	GLOBAL COL
**********************************/
.col {
  position:relative;
  float:left;
  display: block;
  width:100%;
  overflow: hidden;
  -webkit-transform: translateZ(0);
}

@media only screen and (max-width :700px) {
  .col {position:relative; width:100% !important; height: auto !important; padding-bottom:0; margin-bottom: 5px;}
  .col.background_image {display:none !important;}
  .col.video {display:none !important;}
  .col.toggle_box.submenu_style {padding-bottom:0; height: auto !important;}
}






/**********************************
	INTRO ON IMAGE
**********************************/
.col.intro {height: 100% !important;}
.col.intro .bottom {position: absolute; width: 100%; height: auto; padding:35px 0; bottom:0; left:0;}
.col.intro h1 {width:100%; float:left; height:auto; text-align: center; margin: 0 0 10px 0; text-shadow:1px 1px 1px #666;}
.col.intro .scroll_down {float: left; width:100%; height: 103px; display: block; background: url(img/scroll_down_neu.png) center center no-repeat; cursor: pointer;}




/**********************************
	PAGE ENTRYS
**********************************/
.overflow {position: absolute; width:100%; height: 430px; bottom:-430px; overflow:hidden;}
.col.page_entry {width:25%; height: 430px !important; overflow:visible; cursor: pointer;}
.col.page_entry .table {height: 80%;}
.col.page_entry:hover {z-index: 999;}
.col.page_entry .corner_bg {position: absolute; width:100%; height: 100%; display:block;}
.col.page_entry:hover .corner_bg {transform: scale(1.1); -webkit-transform: scale(1.1);}
.col.page_entry .corner_bg.nr_0 {background: url(img/small_corner_bg_01.png) left top no-repeat;}
.col.page_entry .corner_bg.nr_1 {background: url(img/small_corner_bg_02.png) left top no-repeat;}
.col.page_entry .corner_bg.nr_2 {background: url(img/small_corner_bg_03.png) left top no-repeat;}
.col.page_entry .corner_bg.nr_3 {background: url(img/small_corner_bg_04.png) left top no-repeat;}
.col.page_entry .corner_bg.nr_4 {background: url(img/small_corner_bg_white.png) left top no-repeat;}
.col.page_entry h3 {width:80%; margin:0 10% 0.5em 10%; color: #FFF;}
.col.page_entry p {width:80%; height: 50px; margin:0 10%; opacity: 0; transform: translate(0,-20px); -webkit-transform: translate(0,-20px); color: #FFF;}
.col.page_entry:hover p {opacity: 1; transform: translate(0,0); -webkit-transform: translate(0,0);}
.col.page_entry a.page_entry_link {position: absolute; width:100%; height: 100%; left:0; top:0; display:none;}
.col.page_entry:hover a.page_entry_link {display:block;}

@media only screen and (max-width :1024px) {
  .col.page_entry {height:360px !important;}
  .col.page_entry .table {height: 60%;}
  .overflow {height:360px !important; bottom:auto; position: relative; float:left;}
  .col.page_entry h3 {font-size:25px;}
  .col.page_entry p {opacity: 1 !important; transform: translate(0,0) !important; -webkit-transform: translate(0,0) !important;}
  .col.page_entry a.page_entry_link {display: block !important;}
}

@media only screen and (max-width :960px) {
  .col.page_entry {width:50% !important; height:320px !important; margin:0;}
  .overflow {position:relative; float:left; height:auto !important;}
  .col.page_entry h3 {font-size:25px;}
}

@media only screen and (max-width :700px) {
  .col.page_entry.messe {display:block;}
  .col.page_entry {width:100% !important; height:220px !important; margin:0; overflow:hidden;}
  .col.page_entry .table {height: 60%;}
  .col.page_entry .corner_bg {transform: scale(1.1); -webkit-transform: scale(1.1); border:none;}
  .overflow {position:relative; float:left; height:auto !important;}
  .col.page_entry h3 {font-size:25px;}
  .col.page_entry a.page_entry_link {display: block !important;}
}





/**********************************
	COL SUBMENU
**********************************/
.col.subMenu {width:50%;}
.col.subMenu ul {width:80%; padding: 10%; height: auto; display: block; float:left;}
.col.subMenu ul li {float:left; display:block; width:100%; height: auto; margin-bottom:1em;color: #ffffff;font-size: 24px;cursor: pointer;}
.col.subMenu ul li span {font-family:"Mark W01 Bold"; font-size:3em; text-transform: uppercase; cursor: pointer; height: 100%; line-height: 40px; display: block; margin-top:-10px; letter-spacing: 1px;}
.col.subMenu ul li:hover span,
.col.subMenu ul li.active span {color:#FFF !important;}
.col.subMenu ul li ul {display: none;}

@media only screen and (max-width :700px) {
  .col.subMenu {padding-bottom:0;}
  .col.subMenu ul li span {font-size:2em;}
}





/**********************************
	COL ABOUT
**********************************/
@media (min-width: 992px) {
	.col.about {width:50%;}
}




/**********************************
	COL ABOUT
**********************************/
.col.about.more.hidden {position: absolute; left:0; top:100%; width:100%; height: 100%;}
.col.about.more.active .col.about.more.hidden {top:0;}

@media only screen and (max-width :700px) {
  .col.about {height: auto !important;}
  .col.about.more.hidden {position: relative; left:0; top:0; width:100%; height: auto; margin:2em 0 0 0; padding: 0;}
  .col.about.more.hidden h3 {display: none;}
}





/**********************************
	GOOGLE MAP
**********************************/
.col.google_map {height:620px; position: absolute; bottom:0;}
.google_map_overlay {position: absolute; width:100%; height: 620px; display: block; left:0; bottom:0; background: url(img/google_map_overlay.png) left top repeat;}
.google_map_overlay p {text-align: center; margin-top:30px; color:#FFF !important;}
.gm-style-iw {}
.map_description {overflow: hidden;}
.map_description h3 {font-size:1.5em; margin:5%; width:400px; color:#0069b4 !important;}
.map_description p {font-size:1em; margin:5%; width:400px; color: #4b4b4b !important;}

@media only screen and (max-width :1024px) {
  .col.google_map {height:250px !important; position: absolute; bottom:0; margin:0; padding: 0;}
  .google_map_overlay {height: 250px; cursor: pointer;}
}





/**********************************
	TEXT ONLY
**********************************/
.col.text_only {width:100%; height:auto !important; padding:5% 0; background: #FFF;}
.col.text_only .content {float:left; width:40%; padding:0 5%;}

@media only screen and (max-width :700px) {
  .col.text_only .content {float:left; width:80%; padding:0 10%;}
  .col.text_only .content.right {margin-top:2em;}
}



/**********************************
	COL TOGGLE BOX
**********************************/
.col.toggle_box p {color:#FFF;}
.col.toggle_box .col.subMenu ul li span {color:#a6bed9;}
.col.toggle_box .col.subMenu ul li span:hover {color:#FFF;}
.col.toggle_box .col.subMenu.submenu_style ul li span {color:#FFF;}
.col.toggle_box .col.subMenu.submenu_style ul li span:hover {color:#FFF;}
.col.toggle_box .col.hidden2 h3 {color:#0069b4 !important;}
.col.toggle_box .col.hidden2 p {color:#4b4b4b;  opacity: 1;}
.col.toggle_box {width:100%; overflow:hidden;}
.col.toggle_box .col.about {background: none;}
.col.toggle_box  div.toggle_back {margin-top:1em;}
.col.toggle_box  div.toggle_back span {border:1px solid #7C7C7E; padding:5px 10px; cursor: pointer;}
.col.toggle_box .col.about.hidden2 {position: absolute !important; height: 100%; top:100%; right:0; display: block; background: #FFF;}
.col.toggle_box .col.about.hidden2 h3 {color:#004694 !important; opacity: 1;}
.col.toggle_box .col.about.hidden2.active {top:0;}
.col.toggle_box .col.background_image.hidden2 {position: absolute !important; height: 100%; top:-100%; left: 0;}
.col.toggle_box .col.background_image.hidden2.active {top:0;}
.col.toggle_box.submenu_style h3 {color: #FFF;}
.col.toggle_box .col.about.stylish.hidden2 {position: absolute !important; width:50%; height: 100%; top:-100%; left: 0; background: #FFF;}
.col.toggle_box .col.about.stylish.hidden2.left {left: 0;}
.col.toggle_box .col.about.stylish.hidden2.right {right: 0;}
.col.toggle_box .col.about.stylish.hidden2 h3 {color:#16bae7 !important;}
.col.toggle_box .col.about.stylish.hidden2.active {top:0;}
.col.toggle_box .col.about.contain_text.hidden2 {position: absolute !important; width:50%; height: 100%; top:100%; right: 0;}
.col.toggle_box .col.about.contain_text.hidden2.left {left: 0;}
.col.toggle_box .col.about.contain_text.hidden2.right {right: 0;}
.col.toggle_box .col.about.contain_text.hidden2 h3,
.col.toggle_box .col.about.contain_text.hidden2 p {color:#FFF !important;}
.col.toggle_box .col.about.contain_text.hidden2 p span {border-color: #FFF;}
.col.toggle_box .col.about.contain_text.hidden2.active {top:0;}

@media only screen and (max-width :700px) {
  .col.toggle_box {overflow:visible;}
  .col.toggle_box .col.about.hidden2 {position: relative !important; float:left; display: block;}
  .col.toggle_box .col.about.stylish.hidden2 {position: relative !important; float:left; display: block; top:0;}
  .col.toggle_box .col.about.contain_text.hidden2 {position: relative !important; float:left; display: block; top:0; margin-bottom: 0; background: url(img/belongs_to_job.png) center bottom no-repeat;}
  .col.toggle_box .col.about.hidden2 div.toggle_back {display: none;}
  .col.toggle_box.submenu_style {padding: 0;}
  .col.toggle_box.submenu_style .col.about {margin-bottom:0;}
  .col.toggle_box.submenu_style .col.about.hidden2 {margin-bottom:0;}
  .col.toggle_box.submenu_style .col.about.contain_text.hidden2 {margin-bottom:0;}
}






/**********************************
	IMAGE ONLY - FULL WIDTH
**********************************/
.col.image_only {height: auto !important;}
.col.image_only img {display:block; width: 100%; height: auto;}
.col.image_only img.desktop_image {display:block;}
.col.image_only img.mobile_image {display:none;}

@media only screen and (max-width :700px) {
  .col.image_only img.desktop_image {display:none;}
  .col.image_only img.mobile_image {display:block;}
}



/**********************************
	COL BACKGROUND IMAGE
**********************************/
.col.background_image {width:50%; background-size: cover;}
.col.background_image .anystretch {z-index: 0 !important;}





/**********************************
	GRAFIK BG
**********************************/
.grafik_bg_wrap {height: 350px !important; overflow:hidden;}
.grafik_bg {height: 450px; background-size: cover; overflow:hidden; transform: scale(1.2); -webkit-transform: scale(1.2);}
.grafik_bg:hover {transform: scale(1.0); -webkit-transform: scale(1.0);}
/*#UNTERNEHMEN .grafik_bg {background: url(img/grafik_unternehmen.png) center top no-repeat;}
#LEISTUNGEN .grafik_bg {background: url(img/grafik_leistungen.png) center top no-repeat;}
#CONTRACTING .grafik_bg {background: url(img/grafik_contracting.png) center top no-repeat;}
#KARRIERE .grafik_bg {background: url(img/grafik_karriere.png) center top no-repeat;}*/





/**********************************
	COL SIMPLE VIDEO
**********************************/
.col.video {width:50%; background: #FFF;}

.col_video_only_fullscreen {
  position: relative;
  float:left;
  width:100%; height:100%;
  display:block;
}

@media only screen and (max-width :1024px) {
  .col_video_only_fullscreen {
    height:580px;
  }  
  .logo-2 {
    position: absolute;
  }
  .burger-wrap {
    background-color: #f29400;
  }
  /*
  .header-wrapper {
    height: 60px;
  }
  #main-menu.right .burger-wrap {
    margin: 10px 0 0 10px;
  }
  */
}

@media only screen and (max-width :768px) {
  .col_video_only_fullscreen {
    height:430px;
  }
}

@media only screen and (max-width :640px) {
  .col_video_only_fullscreen {
    height:250px;
  }
}

.col.about .container {
  padding: 10%;
  width: auto;
}

.col.about .equal-height {
  height: 100%
}

.header {
  z-index: 250;
}

.col.subMenu .title-fs-45 {
  margin-left: 10%;
  padding-top: 140px;
}

.col.subMenu .title-fs-45 ~ ul {
    padding: 40px 10% 10% 10%!important;
}

.toggle_back.menu-close {
    overflow: hidden;
    width: 40px;
    height: 34px;
}

.fes2-main-text-cont {
  max-width: 100%;
}

input#datenschutz {
  margin-right: 10px;
  height: 18px;
}
input#datenschutz + label {
  font-weight: 500;
}


#main-menu .menu-close {
    height: 30px;
    margin: 30px 30px 0 0;
    overflow: hidden;
}

.menu-close .menu1,
.menu-close .menu2 {
    width: 40px;
    height: 4px;
    background-color: #6b6d6f;
    -webkit-transition: background-color 0.2s ease-in-out;
    -moz-transition: background-color 0.2s ease-in-out;
    -ms-transition: background-color 0.2s ease-in-out;
    transition: background-color 0.2s ease-in-out;
}

.menu-close .menu1 {
    margin-top: 13px;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}

.menu-close .menu2 {
    margin-top: -4px;
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg);
}

.menu-close:hover .menu1,
.menu-close:hover .menu2 {
	background-color: #6b6d6f;
}

span.hover_underlined:hover {
	text-decoration: underline;
}

/**********************************
  SIMPLE TRANSITION
**********************************/
.grafik_bg,
.col.about.hidden2,
.col.background_image.hidden2,
.col.job_kontakt.hidden2
{
  transition: all 0.7s ease-in-out;
  -webkit-transition: all 0.7s ease-in-out;
}

.mce-item-table {
	overflow: hidden;
    text-overflow: ellipsis;
    white-space: pre;
}
