@charset "UTF-8";
/* 
*
*	Mein Perm4 Style
*
*
*/
/* -- 07.11.2018 - SECONDRED - Start  -- */
.sticky-menu .menubar,
#usermenu.sticky {
	position: fixed !important;left: 0; right:0; top: 140px; z-index: 4
} 
.admin-bar.sticky-menu .menubar,
.admin-bar #usermenu.sticky { top: 172px}

.sticky-menu #container {padding-top: 222px}
@media screen and (max-width: 1450px) {
	.sticky-menu  .menubar,
	#usermenu.sticky { top:100px}
	.admin-bar.sticky-menu  .menubar,
	.admin-bar #usermenu.sticky { top: 132px}
}
@media screen and (max-width: 736px) {
	.sticky-menu  .menubar,
	#usermenu.sticky { top:80px}
	
	.admin-bar.sticky-menu  .menubar,
	.admin-bar #usermenu.sticky { top: 112px}
}
.hide-desktop {display:none}
@media screen and (max-width: 480px) {
	.hide-desktop { display: block}
	.hide-mobi { display: none}
}
.sticky-menu  .menubar .cp-inner,
#usermenu.sticky .cp-inner{ padding: 20px 30px !important}
#teaser .swiper-slide .text-wrap h1{ font-size: 63px; padding-left: 35px; margin-bottom: 0}

/* -- Hinzugefügt 09.11.2018 - Start -- */
@media screen and (max-width: 860px){
    #teaser .swiper-slide .text-wrap h1{ font-size: 5vw; }
}
@media screen and (max-width: 736px){
	#teaser .swiper-slide .text-wrap h1{ font-size: 23px; padding-left: 15px;  margin-left: -26px}
}
@media screen and (max-width: 360px){
    #teaser .swiper-slide .text-wrap h1{ font-size: 14px; }
}
/* -- Hinzugefügt 09.11.2018 - Ende -- */
.parent-link-wrap { margin-bottom: 10px;background: #fff; font-weight: 700; padding: 20px 30px;}
.parent-link-wrap a{ text-decoration: none;  display: block; text-transform: uppercase; border-left: 2px solid #7c7c7c;padding: 5px 10px;}
.parent-link-wrap a:hover{  color: #ff5800}

/* -- 07.11.2018 - SECONDRED - Ende -- */

a.btnBack { padding: 20px 30px; font-size: 20px; margin-bottom: 14px; background: #fff;display: block; text-decoration: none}
a.btnBack span { color: #3c3c3c; text-transform: uppercase; display: block; font-weight: bold; text-decoration: none; border-left: 2px solid #3c3c3c; padding-left: 10px;}
a.btnBack:hover {  color: #ff5800}

a.scrollTop { text-decoration: none}
a.scrollTop:hover {color: #ff5800}
a.scrollTop:before {float: right; margin-left: 10px; position: relative; top: 5px}

/* -- Range Slider -- */
/*! jQuery UI - v1.12.1 - 2018-10-09
* http://jqueryui.com
* Includes: core.css, slider.css
* Copyright jQuery Foundation and other contributors; Licensed MIT */

/* Layout helpers
----------------------------------*/
.ui-helper-hidden {display: none;}
.ui-helper-hidden-accessible {border: 0;clip: rect(0 0 0 0);height: 1px;margin: -1px;overflow: hidden;padding: 0;position: absolute;width: 1px;}
.ui-helper-reset {margin: 0;padding: 0;border: 0;outline: 0;line-height: 1.3;text-decoration: none;font-size: 100%;list-style: none;}
.ui-helper-clearfix:before,
.ui-helper-clearfix:after {content: "";display: table;border-collapse: collapse;}
.ui-helper-clearfix:after {clear: both;}
.ui-helper-zfix {width: 100%;height: 100%;top: 0;left: 0;position: absolute;opacity: 0;filter:Alpha(Opacity=0); }

.ui-front {z-index: 100;}

/* Interaction Cues
----------------------------------*/
.ui-state-disabled {cursor: default !important;	pointer-events: none;}

/* Icons
----------------------------------*/
.ui-icon {display: inline-block;vertical-align: middle;margin-top: -.25em;position: relative;text-indent: -99999px;overflow: hidden;background-repeat: no-repeat;}
.ui-widget-icon-block {left: 50%;margin-left: -8px;display: block;}

/* Misc visuals
----------------------------------*/

/* Overlays */
.ui-widget-overlay {position: fixed;top: 0;left: 0;width: 100%;height: 100%;}
.ui-slider {position: relative;text-align: left;}

/* -- Anpassung 17.10.2018 - SECONDRED - Start -- */
.ui-slider .ui-slider-handle {
	position: absolute;z-index: 2;width: 5px;height: 51px;cursor: move;-ms-touch-action: none;touch-action: none;
	background: #f0500a;
}
/* -- Anpassung 17.10.2018 - SECONDRED - Ende -- */
.ui-slider .ui-slider-range {position: absolute;z-index: 1;font-size: .7em;display: block;border: 0;background-position: 0 0;}

/* support: IE8 - See #6727 */
.ui-slider.ui-state-disabled .ui-slider-handle,
.ui-slider.ui-state-disabled .ui-slider-range {filter: inherit;}

.ui-slider-horizontal {height: 41px;}
.ui-slider-horizontal .ui-slider-handle {top: -.3em;margin-left: -1px;}
.ui-slider-horizontal .ui-slider-range {top: 0;height: 100%; height: 40px; background: #f3f3f3; border: 1px solid #d5d5d5}
.ui-slider-horizontal .ui-slider-range-min {left: 0;}
.ui-slider-horizontal .ui-slider-range-max {right: 0;}

/*! jQuery-ui-Slider-Pips - v1.11.3 - 2016-03-15
* Copyright (c) 2016 Simon Goellner <simey.me@gmail.com>; Licensed MIT */

/* HORIZONTAL */
/* increase bottom margin to fit the pips */
.ui-slider-horizontal.ui-slider-pips { margin-bottom: 1.4em;}
.ui-slider-pips .ui-slider-label,
.ui-slider-pips .ui-slider-pip-hide { display: none;}
.ui-slider-pips .ui-slider-pip-label .ui-slider-label { display: block;}

.ui-slider-pips .ui-slider-pip {
	width: 2em;height: 1em;line-height: 1em;position: absolute;font-size: 0.8em;color: #999;
	overflow: visible;text-align: center;top: 20px;left: 20px;margin-left: -1em;cursor: pointer;
	-webkit-touch-callout: none;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;
}

.ui-state-disabled.ui-slider-pips .ui-slider-pip { cursor: default;}
.ui-slider-pips .ui-slider-line {background: #999;width: 1px;height: 3px;position: absolute;left: 50%;}
.ui-slider-pips .ui-slider-label {position: absolute;top: 5px;left: 50%;margin-left: -1em;width: 2em;}
.ui-slider-pips:not(.ui-slider-disabled) .ui-slider-pip:hover .ui-slider-label { color: black; font-weight: bold;}

.ui-slider-float .ui-slider-handle:focus,
.ui-slider-float .ui-slider-handle.ui-state-focus .ui-slider-tip-label,
.ui-slider-float .ui-slider-handle:focus .ui-slider-tip,
.ui-slider-float .ui-slider-handle.ui-state-focus .ui-slider-tip-label,
.ui-slider-float .ui-slider-handle:focus .ui-slider-tip-label
.ui-slider-float .ui-slider-handle.ui-state-focus .ui-slider-tip-label { outline: none;}

.ui-slider-float .ui-slider-tip,
.ui-slider-float .ui-slider-tip-label {
  position: absolute;
  visibility: hidden;
  top: -40px;
  display: block;
  width: 34px;
  margin-left: -18px;
  left: 50%;
  height: 20px;
  line-height: 20px;
  background: white;
  border-radius: 3px;
  border: 1px solid #888;
  text-align: center;
  font-size: 12px;
  opacity: 0;
  color: #333;
  -webkit-transition-property: opacity, top, visibility;
  transition-property: opacity, top, visibility;
  -webkit-transition-timing-function: ease-in;
  transition-timing-function: ease-in;
  -webkit-transition-duration: 200ms, 200ms, 0ms;
  transition-duration: 200ms, 200ms, 0ms;
  -webkit-transition-delay: 0ms, 0ms, 200ms;
  transition-delay: 0ms, 0ms, 200ms;
}

.ui-slider-float .ui-slider-handle:hover .ui-slider-tip,
.ui-slider-float .ui-slider-handle.ui-state-hover .ui-slider-tip,
.ui-slider-float .ui-slider-handle:focus .ui-slider-tip,
.ui-slider-float .ui-slider-handle.ui-state-focus .ui-slider-tip,
.ui-slider-float .ui-slider-handle.ui-state-active .ui-slider-tip,
.ui-slider-float .ui-slider-pip:hover .ui-slider-tip-label {
	opacity: 1;top: -30px;visibility: visible;-webkit-transition-timing-function: ease-out;
	transition-timing-function: ease-out;-webkit-transition-delay: 200ms, 200ms, 0ms;transition-delay: 200ms, 200ms, 0ms;
}

/* put label tooltips below slider */
.ui-slider-float .ui-slider-pip .ui-slider-tip-label { top: 42px;}
.ui-slider-float .ui-slider-pip:hover .ui-slider-tip-label { top: 32px;  font-weight: normal;}
.ui-slider-float .ui-slider-tip:after,
.ui-slider-float .ui-slider-pip .ui-slider-tip-label:after {
	content: " ";width: 0;height: 0;border: 5px solid rgba(255, 255, 255, 0);
	border-top-color: white;position: absolute;bottom: -10px;left: 50%;margin-left: -5px;
}

.ui-slider-float .ui-slider-tip:before,
.ui-slider-float .ui-slider-pip .ui-slider-tip-label:before {
	content: " ";width: 0;height: 0;border: 5px solid rgba(255, 255, 255, 0);border-top-color: #888;
	position: absolute;bottom: -11px;left: 50%;margin-left: -5px;
}

.ui-slider-float .ui-slider-pip .ui-slider-tip-label:after { border: 5px solid rgba(255, 255, 255, 0); border-bottom-color: white; top: -10px;}
.ui-slider-float .ui-slider-pip .ui-slider-tip-label:before { border: 5px solid rgba(255, 255, 255, 0); border-bottom-color: #888; top: -11px;}

.ui-slider-vertical.ui-slider-float .ui-slider-tip,
.ui-slider-vertical.ui-slider-float .ui-slider-tip-label {
	top: 50%; margin-top: -11px; width: 34px; margin-left: 0px;left: -60px; color: #333;
	-webkit-transition-duration: 200ms, 200ms, 0; transition-duration: 200ms, 200ms, 0;
	-webkit-transition-property: opacity, left, visibility; transition-property: opacity, left, visibility;
	-webkit-transition-delay: 0, 0, 200ms; transition-delay: 0, 0, 200ms;
}

.ui-slider-vertical.ui-slider-float .ui-slider-handle:hover .ui-slider-tip,
.ui-slider-vertical.ui-slider-float .ui-slider-handle.ui-state-hover .ui-slider-tip,
.ui-slider-vertical.ui-slider-float .ui-slider-handle:focus .ui-slider-tip,
.ui-slider-vertical.ui-slider-float .ui-slider-handle.ui-state-focus .ui-slider-tip,
.ui-slider-vertical.ui-slider-float .ui-slider-handle.ui-state-active .ui-slider-tip,
.ui-slider-vertical.ui-slider-float .ui-slider-pip:hover .ui-slider-tip-label { top: 50%; margin-top: -11px; left: -50px;}

/* put label tooltips to right of slider */
.ui-slider-vertical.ui-slider-float .ui-slider-pip .ui-slider-tip-label { left: 47px;}
.ui-slider-vertical.ui-slider-float .ui-slider-pip:hover .ui-slider-tip-label { left: 37px;}

/* give the tooltip a css triangle arrow */
.ui-slider-vertical.ui-slider-float .ui-slider-tip:after,
.ui-slider-vertical.ui-slider-float .ui-slider-pip .ui-slider-tip-label:after {
  border: 5px solid rgba(255, 255, 255, 0);
  border-left-color: white;
  border-top-color: transparent;
  position: absolute;
  bottom: 50%;
  margin-bottom: -5px;
  right: -10px;
  margin-left: 0;
  top: auto;
  left: auto;
}

.ui-slider-vertical.ui-slider-float .ui-slider-tip:before,
.ui-slider-vertical.ui-slider-float .ui-slider-pip .ui-slider-tip-label:before {
	border: 5px solid rgba(255, 255, 255, 0);border-left-color: #888;border-top-color: transparent;
	position: absolute;bottom: 50%;margin-bottom: -5px;right: -11px;margin-left: 0;top: auto;left: auto;
}

.ui-slider-vertical.ui-slider-float .ui-slider-pip .ui-slider-tip-label:after {border: 5px solid rgba(255, 255, 255, 0);border-right-color: white;right: auto;left: -10px;}
.ui-slider-vertical.ui-slider-float .ui-slider-pip .ui-slider-tip-label:before {border: 5px solid rgba(255, 255, 255, 0);border-right-color: #888;right: auto;left: -11px;}
.ui-slider-pips [class*=ui-slider-pip-initial] {  font-weight: bold;  color: #14CA82;}

.ui-slider-pips .ui-slider-pip-initial-2 { color: #1897C9;}
.ui-slider-pips [class*=ui-slider-pip-selected] { font-weight: bold;  color: #FF7A00;}

.ui-slider-pips .ui-slider-pip-inrange { color: black;}
.ui-slider-pips .ui-slider-pip-selected-2 { color: #E70081;}

.ui-slider-pips [class*=ui-slider-pip-selected] .ui-slider-line,
.ui-slider-pips .ui-slider-pip-inrange .ui-slider-line { background: black;}

/* -- Theme -- */
.ui-slider:before{height: 3px; background: #fff; position: absolute; content:""; width: 100%; top: 50%; left: 0; margin-top: -3px;}

.slider-btn {font-size: 40px; margin-right: -10px; cursor:pointer}
.slider-icon { font-size: 40px}
.slider-wrap { margin-left: 53px; margin-right: 25px; position: relative; margin-bottom: 30px}
.slider-wrap .ui-slider-tip{ display:none}
/* -- 17.10.2018 - SECONDRED - Auskommentiert - Start -- */
/* .slider-label { position: absolute; left: 20px; z-index: 3; pointer-events: all; top: 7px}  */
/* -- 17.10.2018 - SECONDRED - Auskommentiert - Ende -- */

fieldset.job-finder {}
fieldset.job-finder .ui-slider-float .ui-slider-tip { 
	visibility: visible; opacity: 1; border: 0; background: transparent; top: -40px !important;
	font-size: 20px; font-weight: bold; width: auto; white-space: nowrap; margin-left: 0;
	-webkit-transform: translate(-50%, 0%);-moz-transform: translate(-50%, 0%);transform: translate(-50%, 0%);

}
fieldset.job-finder .ui-slider-pips .ui-slider-label { display: none}
fieldset.job-finder .ui-slider-float .ui-slider-tip:before,
fieldset.job-finder .ui-slider-float .ui-slider-tip:after { display: none}
fieldset.job-finder .ui-slider-pips .ui-slider-line {background: #3c3c3c; height: 41px; width: 3px;top: -20px}
fieldset.job-finder .ui-slider .ui-slider-handle { width: 3px;}
fieldset.job-finder .ui-slider .ui-slider-handle,
fieldset.job-finder .ui-slider:before { background: #3c3c3c}
fieldset.job-finder .ui-slider-horizontal .ui-slider-range {
	border: 0; height: 20px;top:8px;
	background: #c6c5c4; 
	background: -moz-linear-gradient(left, #c6c5c4 0%, #c64501 100%);
	background: -webkit-linear-gradient(left, #c6c5c4 0%,#c64501 100%);
	background: linear-gradient(to right, #c6c5c4 0%,#c64501 100%);
}

fieldset.job-finder .formItem input.formText {font-size: 17px; background: #f3f3f3; border: 1px solid #d5d5d5;padding: 8px 18px 7px;}
fieldset.job-finder label{ font-weight: bold}
fieldset.job-finder .grid {  margin-top: 50px}
fieldset.job-finder .grid label { display: none}
fieldset.job-finder .grid .box:nth-child(1){ padding-right: 20px}
fieldset.job-finder .grid .box:nth-child(2){ padding-left: 10px; padding-right: 10px}
fieldset.job-finder .grid .box:nth-child(3){ padding-left: 20px}

fieldset.job-finder .formSubmit {background: #3c3c3c;color: #fff;font-size: 17px;width: 100%;padding: 0 20px;height: 40px;margin-bottom: 30px;text-align: left;}
fieldset.job-finder .formSubmit:before { margin-right: 10px; position: relative; top: 2px;}

.table-footer {margin-top: 50px}
.table-footer .box:nth-child(1){ text-align: left}
.table-footer .box:nth-child(2){ text-align: center;}
.table-footer .box:nth-child(3){ text-align: right}
.table-footer a { display: inline-block; padding: 5px 10px; text-decoration: none; color: #ff5800} 
.table-footer a span{ display: none} 

/* -- SVG Region -- */
.map-wrap { width: 290px; margin: 0 auto 35px}
.map-wrap svg { font-family: "Open-Sans", sans-serif; font-weight: bold}
.map-wrap svg path { cursor: pointer}
.map-wrap svg path:hover { fill: #ff5800}
.map-wrap svg path.active { fill: #3c3c3c}
.map-wrap svg text.regio-text { pointer-events: none; opacity: 0}
.map-wrap svg path.active + text.regio-text { opacity: 1}

/* -- Blöcke -- */
.block-catlist { background: #fff; margin-bottom: 14px}
.block-catlist h3 { padding: 20px 30px; font-size: 20px; margin-bottom: 0}
.block-catlist h3 a { color: #fff; text-transform: uppercase; display: block; font-weight: bold; text-decoration: none; border-left: 2px solid #fff; padding-left: 10px;}
.block-catlist h3 a:hover { color: #3c3c3c }
.block-catlist .inner { padding: 20px 30px; font-size: 20px; position: relative}
.block-catlist .inner::before { 
	content:""; left: 0; top: 0; right: 0; height: 10px; position: absolute; display: block;
	background: -moz-linear-gradient(top, rgba(0,0,0,0.1) 0%, rgba(0,0,0,0) 100%);
	background: -webkit-linear-gradient(top, rgba(0,0,0,0.1) 0%,rgba(0,0,0,0) 100%);
	background: linear-gradient(to bottom, rgba(0,0,0,0.1) 0%,rgba(0,0,0,0) 100%);
}
.block-catlist .inner ul { padding-left: 0; list-style: none}
.block-catlist .inner ul li{ position: relative; padding-left: 30px; margin-bottom: 10px}
.block-catlist .inner ul li::before {width: 6px; height: 6px; content:""; background: #ff5800; position: absolute;  left: 15px; top: 12px;}
.block-catlist .inner ul li:last-child{ margin-bottom: 0; padding-left: 0; }
.block-catlist .inner ul li:last-child::before{  display: none}
.block-catlist .inner ul a { text-decoration: none;}
.block-catlist .inner ul a strong { font-weight: normal}
.block-catlist .inner ul a:hover { color: #ff5800}

.block-catlist ul li:nth-child(1n+4) { display: none}
.block-catlist.viewall ul li:nth-child(1n+4) { display: block}

.block-catlist .meta { padding: 0 30px 20px}
.block-catlist a.btnToggle { text-decoration: none; text-transform: uppercase; display: block;color: #878787}
.block-catlist a.btnToggle::before { 
	width: 10px; height: 10px; content:""; border-top:2px solid #878787; border-right: 2px solid #878787; position: relative; margin-right: 10px;
	display: block; float: left; top: 8px;
	-webkit-transform: rotate(45deg);-moz-transform: rotate(45deg);transform: rotate(45deg); 
}
.block-catlist a.btnToggle:hover { font-weight: bold}

/* -- Erweitert 07.11.2018 - Start -- */
/* - Persönlichkeit - */
.block-catlist.persoenlichkeit {}
.block-catlist.persoenlichkeit h3 { background: #878787}

/* - Management - */
.block-catlist.management {}
.block-catlist.management h3 { background: #00003c}

/* - Jobwechsel - */
.block-catlist.jobwechsel {}
.block-catlist.jobwechsel h3 { background: #ff5800}
/* -- Erweitert 07.11.2018 - Ende -- */

/* -- Entfernen 07.11.2018 - Start --
.block-catlist.light { background: transparent}
.block-catlist.light h3 { background: #fff !important; font-size: 20px}
.block-catlist.light h3 a{ color: inherit; padding-left: 40px}
.block-catlist.light .inner { background: #fff}

.block-catlist.light ul li:nth-child(1n+3) { display: none}
.block-catlist.viewall.light ul li:nth-child(1n+3) { display: block}

.block-catlist.light .inner ul { }
.block-catlist.light .inner ul li { padding-left: 40px; margin-bottom: 30px}
.block-catlist.light .inner ul li::before { display: none}
.block-catlist.light .inner ul li a { }
.block-catlist.light .inner ul li a strong { font-size: 20px; font-weight: normal}
.block-catlist.light .inner ul li a small { display: block; font-size: 17px; line-height: 100%}

.block-catlist.light .meta { padding-top: 20px}

.block-catlist.light.persoenlichkeit h3 { color: #878787; }
.block-catlist.light.persoenlichkeit h3 a {border-color:#878787}

.block-catlist.light.management h3 { color: #00003c;}
.block-catlist.light.management h3 a {border-color:#00003c}

.block-catlist.light.jobwechsel h3 { color: #ff5800;}
.block-catlist.light.jobwechsel h3 a { border-color:#ff5800}
-- Entfernen 18.10.2018 - Ende -- */

@media screen and (max-width: 1450px) {

}
@media screen and (max-width: 1260px) {
	.block-catlist h3,
	.block-catlist .inner {  font-size: 16px;}
}
@media screen and (max-width: 736px){
	.block-catlist h3,
	.block-catlist .inner {  font-size: 14px;}
     .block-catlist .inner ul li:before {top:7px}
     .block-catlist a.btnToggle:before {top:4px}
}
/* -- Erweitert 18.10.2018 - Ende -- */
/* -- Tag Block -- */
.block-tags { background: #fff; margin-bottom: 14px}
.block-tags h3 { padding: 20px 30px; font-size: 20px; margin-bottom: 0}
.block-tags h3 a { color: #333; text-transform: uppercase; display: block; font-weight: bold; text-decoration: none; border-left: 2px solid #333; padding-left: 10px;}

.block-tags .inner { padding: 20px 30px; font-size: 20px; position: relative}
.block-tags .inner::before { 
	content:""; left: 0; top: 0; right: 0; height: 10px; position: absolute; display: block;
	background: -moz-linear-gradient(top, rgba(0,0,0,0.1) 0%, rgba(0,0,0,0) 100%);
	background: -webkit-linear-gradient(top, rgba(0,0,0,0.1) 0%,rgba(0,0,0,0) 100%);
	background: linear-gradient(to bottom, rgba(0,0,0,0.1) 0%,rgba(0,0,0,0) 100%);
}
.block-tags .inner ul { padding-left: 0; list-style: none}
.block-tags .inner ul li{ position: relative; margin-bottom: 10px}
.block-tags .inner ul li:last-child{ margin-bottom: 0 }
.block-tags .inner ul a { text-decoration: none;}
.block-tags .inner ul a:hover { color: #ff5800}

/* --  -- */
.block-article { background: #fff; margin-bottom: 30px}
.block-article .img { overflow: hidden; display: block}
.block-article .inner { font-size: 15px; line-height: normal}
.block-article .inner h2,
.block-article .inner h3{ font-size: 20px; margin-bottom: 20px}

@media screen and (max-width: 480px) {
    .block-article .inner h2,
    .block-article .inner h3{ 
      font-size: 16px; -webkit-hyphens: auto;
      -ms-hyphens: auto;-moz-hyphens: auto;
      hyphens: auto;
    }
}
.block-article .inner h2 a,
.block-article .inner h3 a{  text-decoration: none}

.block-article .inner p {}
.block-article .inner p:last-child { margin-bottom: 0}

.block-article .meta { padding: 0 30px 20px}
.block-article .meta a { text-decoration: none; font-weight: bold; text-transform: uppercase}
.block-article .meta a::before {margin-right: 5px}


.block-article.small { position: relative; display: table; width: 100%;}
.block-article.small h2 { margin-bottom: 11px; line-height: 100%}
.block-article.small .overlay-link span { display: none}
.block-article.small .img-wrap,
.block-article.small .inner { display: table-cell; vertical-align: top}

.block-article.small .img-wrap { width: 160px; position: relative; overflow: hidden}
.block-article.small .img-wrap::before {
    content:""; border: 5px solid rgba(255,255,255, 0.6); position: absolute;
    left: 15px; top: 15px; right: 15px;bottom: 15px; display: block; z-index: 2;
}
.block-article.small .img-wrap img {
    position: absolute;left:50%; top: 50%; max-width: 100%; min-height: 100%; width: auto !important; height: auto !important;
    -webkit-transform: translate(-50%, -50%);-moz-transform: translate(-50%, -50%);transform: translate(-50%, -50%);
    object-fit: cover;object-position: center center; z-index: 1
}
.block-article.small .inner { padding: 16px 28px; font-size: 15px; line-height: 100%;}

.block-article.persoenlichkeit a { color: #878787}
.block-article.management a { color: #00003c}
.block-article.jobwechsel a { color: #ff5800}

/* -- Erweitert 08.11.2018 - Start -- */
.block-article .img-wrap { position: relative;}
.block-article .img-wrap .img { position: relative; z-index: 1;}
.block-article .img-wrap h2,
.block-article .img-wrap h3{ 
	color: #fff;position: absolute;z-index: 3;margin-bottom: 0;font-size: 24px;line-height: 24px; 
	left: 40px;top: 40px;right: 40px;bottom: 40px;border: 6px solid rgba(255,255,255, 0.5);pointer-events: none;
	display: -ms-flexbox;display: -webkit-flex;display: flex;
	-webkit-flex-direction: column;-ms-flex-direction: column;flex-direction: column;
	-webkit-flex-wrap: nowrap;-ms-flex-wrap: nowrap;flex-wrap: nowrap;
	-webkit-justify-content: flex-end;-ms-flex-pack: end;justify-content: flex-end;
	-webkit-align-content: stretch;-ms-flex-line-pack: stretch;align-content: stretch;
	-webkit-align-items: stretch;-ms-flex-align: stretch;align-items: stretch;
	-webkit-text-shadow: 0 2px 20px rgba(0,0,0,0.3);-moz-text-shadow: 0 2px 20px rgba(0,0,0,0.3);text-shadow: 0 2px 20px rgba(0,0,0,0.3);
}
.block-article .img-wrap h2 a,
.block-article .img-wrap h3 a{text-decoration: none; color: #fff;padding: 0 20px;margin-bottom: 30px;display: block;border-left: 6px solid #F0500A;margin-left: -6px;}
/* -- Erweitert 08.11.2018 - Ende -- */
.block-article .inner {font-size: 17px; padding: 30px 40px}

.block-article.v1 .meta { padding-top: 20px; font-size: 16px}
.block-article.v1 .meta a { color: #fff}
.block-article.v1 .meta a::before {color: #fff; position: relative; top: 2px}

.block-article.v1.persoenlichkeit .meta { background:#878787 }
.block-article.v1.management .meta {background:#00003c}
.block-article.v1.jobwechsel .meta {background:#ff5800}

/* -- Erweitert 20.11.2018 - Start -- */
@media screen and (max-width: 768px) {
	.block-article .img-wrap h2, 
	.block-article .img-wrap h3 {
		font-size: 18px;
		left: 20px; top: 20px; right: 20px; bottom: 20px; 
	}
	.block-article .inner { padding: 20px 30px; font-size: 14px}
}
/* -- Erweitert 20.11.2018 - Ende -- */
/* -- Bearbeitet 09.11.2018 - Start -- */
@media screen and (max-width: 480px) {
	.block-article {position: relative}
	.block-article h2,
	.block-article h3{ position: relative; z-index: 3}
	
	.block-article h2::before,
	.block-article h3::before {content:""; width: 4px; background: #ff5800; position: absolute; left: -30px; top: 0; right: 0; display: block; height: 100%;}
	
	.block-article .img-wrap h2,
	.block-article .img-wrap h3{ display: none}
	.block-article .line{ width: 4px; position: absolute; left: 35px; top: 0; bottom: 0; background: rgba(0,0,0,0.2); z-index: 2}
	
	.block-article .inner,
	.block-article .meta { padding-left: 65px}
}
/* -- Erweitert 18.10.2018 - Emde -- */
.news-grid.grid.two {padding-right: 20px}
.news-grid.grid.two.related-grid {padding-right: 0px}
.news-grid.grid.two .box:nth-child(odd) { padding-right: 35px}
.news-grid.grid.two .box:nth-child(even) { padding-left: 35px}

/* -- Bearbeitet 09.11.2018 - Ende -- */
.related-posts { padding-top: 30px}
.related-posts h4 { font-size: 40px; margin-bottom: 50px; font-weight: normal}

.related-grid.grid.two .box:nth-child(odd) { padding-right: 20px}
.related-grid.grid.two .box:nth-child(even) { padding-left: 20px}

/* -- Bearbetiet 20.11.2018 - Start -- */
@media screen and (max-width: 1450px) {
	.news-grid.grid.two {padding-right: 20px}
    .news-grid.grid.two.related-grid {padding-right: 0px}
	.news-grid.grid.two .box:nth-child(odd) { padding-right: 20px}
	.news-grid.grid.two .box:nth-child(even) { padding-left: 20px}
}
@media screen and (max-width: 1260px) {
	.news-grid.grid.two {padding-right: 0}
	/*.news-grid.two .box {float: none; width: auto}
	.news-grid.two .box:nth-child(odd) { padding-right: 0} 
	.news-grid.two .box:nth-child(even) { padding-left: 0}*/
    
    .related-grid.two .box {float: none; width: auto}
    .related-grid.grid.two .box:nth-child(odd) { padding-right: 0}
    .related-grid.grid.two .box:nth-child(even) { padding-left: 0}
}
@media screen and (max-width: 980px){
	.news-grid.grid.two .box{ width: 50%; float: left}
	.news-grid.grid.two .box:nth-child(odd) { padding-right: 20px !important}
	.news-grid.grid.two .box:nth-child(even) { padding-left: 20px !important}
}
@media screen and (max-width: 736px){
	.news-grid.grid.two {padding-right: 0}
	.news-grid.grid.two .box {float: none; width: auto}
	.news-grid.grid.two .box:nth-child(odd) { padding-right: 0 !important} 
	.news-grid.grid.two .box:nth-child(even) { padding-left: 0 !important}
    
    .related-grid.two .box {float: none; width: auto}
    .related-grid.grid.two .box:nth-child(odd) { padding-right: 0}
    .related-grid.grid.two .box:nth-child(even) { padding-left: 0}
}
/* -- Bearbetiet 20.11.2018 - Ende -- */

/* -- Nodes -- */
.node-post {background: #fff}
.node-post .inner { padding: 40px 70px}

.node-table { margin-top: 50px}
.node-table table { width: 100%; background: #fff; color: #333}
.node-table table thead { background: #3c3c3c; color: #fff}
.node-table table thead tr{}
.node-table table thead th{padding: 15px 20px;border-left: 2px solid #fff; font-size: 20px; font-weight: normal}
.node-table table thead th:first-child{border-left: 0;}

.node-table table tbody td.btn { width: 60px}
.node-table table tbody button.favBtn{ 	width: 21px; height: 21px; background: transparent url(../gfx/fav-star-inactive.png) center no-repeat; cursor: pointer;	border: 0;}
.node-table table tbody .icon-checked { color: #ff5800; font-size: 20px}
.node-table table tbody button.favBtn.active{ background-image: url(../gfx/fav-star-active.png)}
.node-table table tbody tr {}
.node-table table tbody th,
.node-table table tbody td {padding: 15px 20px}

.node-table table tbody th { border-right: 2px solid #999}
.node-table table tbody td { border-left: 2px solid #fff;}
.node-table table tbody td small { display: block; color: #878787}
.node-table table tbody td:first-child { border-left: 0 solid #fff;border-right: 2px solid #999}

.node-table table tbody tr:nth-child(odd) th,
.node-table table tbody tr:nth-child(odd) td{ }

.node-table table tbody tr:nth-child(even) th,
.node-table table tbody tr:nth-child(even) td{background: #f3f3f3}

table .salary { display: block; text-align: center; position: relative; height: 15px;}
table .salary:before { content: ""; position: absolute; left: 0; top: 12px; right: 0; background: #c6c6c6;	height: 3px;}
table .salary em{ font-style: normal; background: #fff; padding: 0 10px; position: relative; z-index: 2}
table .salary .line-lft,
table .salary .line-rt{ background: #3c3c3c; width: 2px; height: 15px; display: block;position: absolute; z-index: 3; top: 6px}

table .salary .line-lft { left: 0}
table .salary .line-rt {right: 19px }
table .salary .orange-pipe{
	position: absolute; righT:0; top: 12px; height: 3px; width: 19px;display: block; z-index: 4;background: #ff5800;
	background: -moz-linear-gradient(left, #ff5800 0%, #ffffff 100%);
	background: -webkit-linear-gradient(left, #ff5800 0%,#ffffff 100%);
	background: linear-gradient(to right, #ff5800 0%,#ffffff 100%);
}

table tr:nth-child(even) .salary em{background: #f3f3f3}

.lightdark .node-table table thead { background: #fff; color: #3c3c3c}
.lightdark .node-table table thead tr{}
.lightdark .node-table table thead th{padding: 15px 20px;border-left: 2px solid #878787;}
.lightdark .node-table table thead th:nth-child(2){border-left: 2px solid #fff;}
.lightdark .node-table table thead th:first-child{border-left: 0;}

/* -- Formular -- */
fieldset .formCheckButton { position: relative}
fieldset .formCheckButton input {position: absolute; height: 0; width: 0; opacity: 0}
fieldset .formCheckButton label { 
	display: block; border: 1px solid #d5d5d5; background: #f3f3f3;text-align: center; cursor: pointer;	padding: 5px 20px 6px;
	-webkit-border-radius: 10px 10px 10px 0;-moz-border-radius: 10px 10px 10px 0;border-radius: 10px 10px 10px 0;
}
fieldset .formCheckButton label:hover { background:#ff5800; color: #fff; border-color: #ff5800}
fieldset .formCheckButton input:checked + label { color: #fff; background: #3c3c3c;}
.dark fieldset .formCheckButton label { color: #333}

/* -- -- */
fieldset.experience-cloud .formCheckButton { display: inline-block; margin: 0 20px 10px 0}

form.experience {}
form.experience .accordion{}
form.experience .accordion fieldset { margin-bottom: 0; padding: 0}
form.experience .accordion fieldset.experience-cloud:first-child { margin-bottom: 30px}
form.experience .accordion fieldset.experience-cloud:last-child { margin-bottom: 0}

form.experience .accordion fieldset.hasBg {
	background: -moz-linear-gradient(top, rgba(154,154,154,0.3) 0%, rgba(154,154,154,0.1) 9%, rgba(154,154,154,0) 100%);
	background: -webkit-linear-gradient(top, rgba(154,154,154,0.3) 0%,rgba(154,154,154,0.1) 9%,rgba(154,154,154,0) 100%);
	background: linear-gradient(to bottom, rgba(154,154,154,0.3) 0%,rgba(154,154,154,0.1) 9%,rgba(154,154,154,0) 100%);
	border-top: 2px solid #c0c0c0; padding: 20px 30px; background-size: 100% 100px; background-repeat: repeat-x
}

form.experience .accordion h3 { border-top: 2px solid #353535; padding: 25px 0; margin-bottom: 0; cursor: pointer}
form.experience .accordion h3:hover { color: #ff5800}
form.experience .accordion h3:hover small { color: #333}
form.experience .accordion h3 small{ display: block; font-weight: normal; padding-top: 10px}
form.experience .accordion h3 small span { padding-right: 10px}
form.experience .accordion h4 { font-size: 20px; margin-bottom: 20px}

form.experience .accordion .toggle { float: right; position: relative; width: 40px; height: 40px; margin-top: -5px; margin-right: 10px;}
form.experience .accordion .toggle::before,
form.experience .accordion .toggle::after { 
	content:""; height: 2px; background: #353535; display: block; position: absolute;
	left: 50%; margin-top: -1px; margin-left: -20px;top: 12px;
}

form.experience .accordion .toggle::before { 
	-webkit-transform: rotate(45deg);-moz-transform: rotate(45deg);transform: rotate(45deg);
	-webkit-transform-origin: 0% 0%;-moz-transform-origin: 0% 0%;transform-origin: 0% 0%;	
	left: 28px; width: 50%;
}
form.experience .accordion .toggle::after { 
	-webkit-transform: rotate(-45deg);-moz-transform: rotate(-45deg);transform: rotate(-45deg);
	-webkit-transform-origin: 100% 0%;-moz-transform-origin: 100% 0%;transform-origin: 100% 0%;	
	left: auto; right: 7px;width: 50%;
}
form.experience .accordion .acc-content{
	background: -moz-linear-gradient(top, rgba(0,0,0,0.1) 0%, rgba(0,0,0,0) 100%);
	background: -webkit-linear-gradient(top, rgba(0,0,0,0.1) 0%,rgba(0,0,0,0) 100%);
	background: linear-gradient(to bottom, rgba(0,0,0,0.1) 0%,rgba(0,0,0,0) 100%);
	background-repeat: repeat-x;background-size: 100% 10px;padding: 40px 0 30px;
}
form.experience .accordion .open .toggle {}
form.experience .accordion .open .toggle::before,
form.experience .accordion .open .toggle::after {top:50%; left: 50%;width: 100%; right: auto}

form.experience .accordion .open .toggle::before {-webkit-transform-origin:50% 50%;-moz-transform-origin: 50% 50%;transform-origin: 50% 50%;}
form.experience .accordion .open .toggle::after {-webkit-transform-origin: 50% 50%;-moz-transform-origin: 50% 50%;transform-origin: 50% 50%;}

form.experience .acc-content { border-top: 2px solid #aeaeae }

form.experience button { background: #3c3c3c; color: #fff; text-align: left; font-size: 17px; width: 100%; padding: 0 20px; height: 40px; margin-bottom: 10px}
form.experience button:hover { background: #ff5800 }

.dark form.experience .accordion h3 { border-top: 2px solid #d5d5d5; color: #fff }
.dark form.experience .accordion h4 { color: #fff}
.dark form.experience .accordion .toggle::before,
.dark form.experience .accordion .toggle::after {background: #fff}

/* -- Umzugsfrage -- */
fieldset.umzugsbereit {}
fieldset.umzugsbereit .grid{}
fieldset.umzugsbereit .grid .box-25{ padding-left: 30px}

/* -- Formular Artikel Suchen -- */
/* -- Anpassung 14.10.2018 - Start -- */
fieldset.article-search { background: #2e2e2e; border: 1px solid #4d4d4d; width: 100%; padding: 0; margin-bottom: 0; position: relative}
fieldset.article-search .formItem{ float: left; margin-bottom: 0;width: calc(100% - 40px); }
fieldset.article-search .formItem label{ display: none}
fieldset.article-search .formItem input.formText{ border: 0; color: #B5B5B5; background: transparent; width:100%; font-size: 18px; padding: 7px 20px;}
/* -- Anpassung 14.11.2018 - Start -- */

a.mobi-search-btn {	
    width: 40px;height: 40px;float: right;margin-right: 0; line-height: 40px;  cursor: pointer;position: relative;
    display: none;border: 1px solid #4d4d4d;background: #2e2e2e; color: #B5B5B5; text-align: center;text-decoration: none;
    -webkit-border-radius: 50%; -moz-border-radius: 50%;border-radius: 50%;
}
a.mobi-search-btn span { display: none}
@media screen and (max-width: 960px){
    a.mobi-search-btn { display: block}    
    fieldset.article-search { display: none}
    
    .show-search a.mobi-search-btn { display: none}    
    .show-search fieldset.article-search { display: block}
}
@media screen and (max-width: 480px){
	fieldset.article-search { width: 100%}
	fieldset.article-search .formItem { width: calc(100% - 50px)}
	fieldset.article-search .formItem input.formText{ width: 100%}
} 
/* -- Anpassung 09.11.2018 - Ende -- */
fieldset.article-search ::-webkit-input-placeholder {color: #B5B5B5; text-transform: uppercase; -webkit-transition: color .25s  ease}
fieldset.article-search :-moz-placeholder { color: #B5B5B5; text-transform: uppercase; -moz-transition: color .25s  ease}
fieldset.article-search ::-moz-placeholder { color: #B5B5B5; text-transform: uppercase; -moz-transition: color .25s  ease}
fieldset.article-search :-ms-input-placeholder { color: #B5B5B5; text-transform: uppercase;  -ms-transition: color .25s  ease}

fieldset.article-search :focus::-webkit-input-placeholder {color: rgba(255,255,255, 0.1);}
fieldset.article-search :focus:-moz-placeholder { color: rgba(255,255,255, 0.1);}
fieldset.article-search :focus::-moz-placeholder { color: rgba(255,255,255, 0.1); }
fieldset.article-search :focus:-ms-input-placeholder { color: rgba(255,255,255, 0.1);}

fieldset.article-search .formSubmit { 
	background: transparent; height: 40px; width: 40px; cursor: pointer; padding: 0;
	text-align: center; line-height: 45px; font-size: 25px; color: #c6c6c6
}
fieldset.article-search .formSubmit span { display: none}

nav.sharebar { float: left; color: #c6c6c6}
nav.sharebar ul {padding-top: 2px}
nav.sharebar ul li{ border-left: 2px solid #c6c6c6; padding: 0 20px}
nav.sharebar ul li:first-child { border-left: 0}
nav.sharebar ul li a{ font-size: 25px; text-decoration: none; padding-top: 6px; display: block}
nav.sharebar ul li a:hover { color: #fff}
nav.sharebar ul li a span{ display: none}

/* -- Login -- */
#outerlogin #myperm4-login {
  position: absolute;
  top: 100%;
  right: 100px;
  -webkit-box-shadow:0 5px 20px rgba(0,0,0,0.2);-moz-box-shadow:0 5px 20px rgba(0,0,0,0.2);box-shadow:0 5px 20px rgba(0,0,0,0.2);
}
#myperm4-login {background: #fff; padding: 20px 40px 10px; width: 384px; /*margin-bottom: 0;*/ margin: 0 auto 0; font-size: 17px;}
#myperm4-login.loggedin {padding: 20px 30px 10px; }
#myperm4-login:before { 
	content:""; left: 0; top:0; right: 0; height: 10px; display: block;position: absolute;
	background: -moz-linear-gradient(top, rgba(0,0,0,0.2) 0%, rgba(0,0,0,0) 100%);
	background: -webkit-linear-gradient(top, rgba(0,0,0,0.2) 0%,rgba(0,0,0,0) 100%);
	background: linear-gradient(to bottom, rgba(0,0,0,0.2) 0%,rgba(0,0,0,0) 100%);
}

#myperm4-login fieldset { font-size: 17px;padding: 0}
#myperm4-login fieldset strong{ font-weight: normal; text-transform: uppercase; margin-bottom: 10px; display: block}
#myperm4-login fieldset .formItem {}
#myperm4-login fieldset .formItem label{ display: none}
#myperm4-login fieldset input.formText {font-size: 17px; background: #f3f3f3; border: 1px solid #d5d5d5;}

#myperm4-login fieldset .formCheckbox input{ float: left; position: relative; top: 8px}
#myperm4-login fieldset .formCheckbox label{ display: block; margin-left: 25px;}
#myperm4-login fieldset .formCheckbox label input{ display: none}
#myperm4-login fieldset .formCheckbox label i{background: #f3f3f3; width: 23px; height: 23px}
#myperm4-login fieldset .checkbox-wrap input[type=checkbox]:checked + i:before, 
#myperm4-login fieldset .checkbox-wrap input[type=checkbox]:checked + i:after, 
#myperm4-login fieldset .checkbox-wrap input[type=checkbox]:checked + label i:before, 
#myperm4-login fieldset .checkbox-wrap input[type=checkbox]:checked + label i:after {filter: alpha(opacity=100);	opacity: 1;}

#myperm4-login fieldset button { background: #3c3c3c; color: #fff; text-align: center; font-size: 17px; width: 100%; padding: 0 20px; height: 40px; margin-bottom: 10px}
#myperm4-login fieldset button:hover { background: #ff5800}

#myperm4-login p { color:#ff5800; margin-bottom: 0}
#myperm4-login form fieldset p { margin-bottom: 10px; }
#myperm4-login p a{ color: inherit}
#myperm4-login .avatar { width: 65px; height: 65px; float: left;}
.icon-user img, 
#myperm4-login .avatar, 
.your-income figure.avatar, 
.profile-heading figure.avatar { background: #ffffff; }
#myperm4-login .name { margin-left: 95px; font-size: 17px; line-height: normal; padding-bottom: 20px}
#myperm4-login .name h5 { font-size: 15px; color:#ff5800; font-weight: normal}
#myperm4-login .name strong { display: block}
#myperm4-login .name small { font-size: 15px; line-height: 16px; min-height: 20px; display: inline-block; }

#myperm4-login .menu { position: relative; margin: 0 -30px -10px; padding: 30px 50px;}
#myperm4-login .menu:before { 
	content:""; left: 0; top:0; right: 0; height: 10px; display: block;position: absolute;
	background: -moz-linear-gradient(top, rgba(0,0,0,0.2) 0%, rgba(0,0,0,0) 100%);
	background: -webkit-linear-gradient(top, rgba(0,0,0,0.2) 0%,rgba(0,0,0,0) 100%);
	background: linear-gradient(to bottom, rgba(0,0,0,0.2) 0%,rgba(0,0,0,0) 100%);
}
#myperm4-login .menu ul {  list-style: none; text-transform: uppercase}
#myperm4-login .menu ul li { }
#myperm4-login .menu ul li a {border-left: 2px solid #c6c6c6; display: block; padding: 5px 10px 5px 50px; text-decoration: none}
#myperm4-login .menu ul li a:hover { color:#ff5800;}
/* -- Hinzugefügt 31.11.2018 - SECONDRED - Start -- */
@media screen and (max-width: 600px){
	#outerlogin #myperm4-login, 
    #myperm4-login {right: 30px;}
}
@media screen and (max-width: 480px){
	#outerlogin #myperm4-login, 
    #myperm4-login {right: 0; width: 100%}
}
/* -- Hinzugefügt 31.11.2018 - SECONDRED - Ende -- */
a.orange-link { text-decoration: none; color:#ff5800; text-transform: uppercase;}
a.orange-link::before { margin-right: 10px; position: relative; top: 2px; display: inline-block}

/* -- Profil Einstellungen Formular -- */
fieldset.profile { padding: 0}
fieldset.profile h3 { font-size: 40px; font-weight: normal; margin-bottom: 0px; }
fieldset.profile hr { margin: 20px 0 40px; }
fieldset.profile .formItem {}
fieldset.profile .formItem label { display: none}
fieldset.profile .formItem input.formText {font-size: 17px; background: #f3f3f3; border: 1px solid #d5d5d5;padding: 8px 18px 7px;}
fieldset.profile button { background: #3c3c3c; color: #fff; text-align: center; font-size: 17px; width: 100%; padding: 0 20px; height: 40px; margin-bottom: 10px}
fieldset.profile button:hover {  background: #ff5800}
fieldset.profile .grid { padding: 0 180px 0 56px}
fieldset.profile .dyn-grid { padding: 0; margin: 0 -10px 40px}
fieldset.profile .dyn-grid .box{ padding: 0 10px;}
fieldset.profile .dyn-grid.noMargin .box .formItem { margin-bottom: 0} 
fieldset.profile .dyn-grid .formSubmit { text-align: left}
fieldset.profile .nice-select{ background: #f3f3f3; border-color: #d5d5d5; height: 40px; line-height: 40px}
fieldset.profile .formCheckButton label {display: block}

/* -- Register Formular -- */
fieldset.myperm4-register {}
fieldset.myperm4-register h1 {font-size: 63px; line-height: 100%; font-weight: 800; margin-bottom: 10px }
fieldset.myperm4-register h2 {font-size: 40px; font-weight: normal; line-height: 100%; margin-bottom: 10px}
fieldset.myperm4-register p{ margin-bottom: 60px}
fieldset.myperm4-register  a {color:#ff5800;}
fieldset.myperm4-register .grid { padding: 0 180px 0 50px}
fieldset.myperm4-register .formItem {}
fieldset.myperm4-register .formItem label { display: none}
fieldset.myperm4-register .formItem input.formText {font-size: 17px; background: #f3f3f3; border: 1px solid #d5d5d5;padding: 8px 18px 7px;}

fieldset.myperm4-register .nice-select {font-size: 17px; background: #f3f3f3; border: 1px solid #d5d5d5; height: 40px; line-height: 40px}

fieldset.myperm4-register .formCheckbox input{ float: left; position: relative; top: 8px}
fieldset.myperm4-register .formCheckbox label{ display: block; margin-left: 25px;}

fieldset.myperm4-register button { background: #3c3c3c; color: #fff; text-align: center; font-size: 17px; width: 100%; padding: 0 20px; height: 40px; margin-bottom: 10px}
fieldset.myperm4-register button:hover  {  background: #ff5800}

/* -- Gehaltsrechner -- */
fieldset.gehaltsrechner {}
fieldset.gehaltsrechner h3 { font-size: 40px; font-weight: normal}
fieldset.gehaltsrechner .grid { margin-bottom: 30px}
fieldset.gehaltsrechner .grid .box:first-child{ padding-right: 30px}
fieldset.gehaltsrechner .grid .box:last-child{ padding-left: 30px}

fieldset.gehaltsrechner .formSelect {}
fieldset.gehaltsrechner .formSelect label { display: none}

fieldset.gehaltsrechner .formRadios { position: relative; margin-bottom: 29px}
fieldset.gehaltsrechner .formRadios input { position: absolute; opacity: 0;filter: alpha(opacity=0);}
fieldset.gehaltsrechner .formRadios label {font-size:80px; color: #fff; position: relative; width: 110px; height: 70px; text-align: center; cursor: pointer}
fieldset.gehaltsrechner .formRadios label:before { }
fieldset.gehaltsrechner .formRadios label span {
	color: #3c3c3c; position: absolute; font-size: 64px; left: 50%; top: 50%;display: block; margin-top: 6px;
	-webkit-transform: translate(-50%, -50%);-moz-transform: translate(-50%, -50%);transform: translate(-50%, -50%);

}
fieldset.gehaltsrechner .formRadios label.yes { float: left; margin-left: 50px;}
fieldset.gehaltsrechner .formRadios label.no { float: right; margin-right: 50px}
/* -- Anpassung 15.10.2018 - SECONDRED - Start -- */
fieldset.gehaltsrechner .formRadios input:checked + label { color: #3c3c3c}
fieldset.gehaltsrechner .formRadios input:checked + label span { color: #e6e6e6}

fieldset.gehaltsrechner .formRadios label:hover { color: #f0500a}
fieldset.gehaltsrechner .formRadios label:hover span { color: #e6e6e6}
/* -- Anpassung 15.10.2018 - SECONDRED - Ende -- */
/* -- Erweiterung 17.10.2018 - SECONDRED - Start -- */
fieldset.gehaltsrechner .ui-slider:before { width: auto; right: -50px}
fieldset.gehaltsrechner .slider-wrap {margin-right: 80px}
fieldset.gehaltsrechner .slider-label {
	height: 40px;background: #f3f3f3;border: 1px solid #d5d5d5;border-right: 0;float: left;
	width: 150px;position: relative;z-index: 2;padding: 5px 10px;white-space: nowrap;
}
fieldset.gehaltsrechner .slider-label + .slider { margin-left: 150px}
fieldset.gehaltsrechner .slider-label + .slider .ui-slider-range {border-left: 0}
fieldset.gehaltsrechner .nice-select {font-size: 17px; background: #f3f3f3; border: 1px solid #d5d5d5; height: 40px; line-height: 40px}

/* -- Erweiterung 17.10.2018 - SECONDRED - Ende -- */
fieldset.gehaltsrechner button { 
	background: #3c3c3c; color: #fff; text-align: center; 
	font-size: 17px; width: 100%; padding: 0 20px; height: 40px; 
	margin-bottom: 30px;
}
fieldset.gehaltsrechner button:hover  {  background: #ff5800}
@media screen and (max-width: 1000px){
	fieldset.gehaltsrechner .grid .box {float: none; width: auto !important}
	fieldset.gehaltsrechner .grid .box:first-child{ padding-right: 0}
	fieldset.gehaltsrechner .grid .box:last-child{ padding-left: 0}
}
@media screen and (max-width: 530px){
	fieldset.gehaltsrechner h3 { font-size: 30px; }
}
.myperm4-title {}
.myperm4-title h1 {font-size: 40px; text-align: left; font-weight: normal; margin-bottom: 0; line-height: 43px}

#inner.myperm4 #mainContent { padding: 45px 70px}
#inner.myperm4 #mainContent h1,
/* -- Erweiterung 7.11.2018 - SECONDRED - Start -- */
#inner.myperm4 #mainContent h2{font-size: 40px;  color: #333; font-weight: normal; margin-bottom: 0; line-height: 120%}
#inner.myperm4 #mainContent h1:last-child,
#inner.myperm4 #mainContent h2:last-child { margin-bottom: 0}

/* -- 20.11.2018 - SECODNRED - Hinzugefügt - Start  -- */
@media screen and (max-width: 1450px) {
	#inner.myperm4 #mainContent h1,
	#inner.myperm4 #mainContent h2 {font-size: 3.333vw;}
	#inner.myperm4 #mainContent p {font-size: 1.6vw; line-height: 120%}
}
@media screen and (max-width: 850px) {
	#inner.myperm4 #mainContent h1,
	#inner.myperm4 #mainContent h2 {font-size: 4vw;}
	#inner.myperm4 #mainContent p {font-size: 2vw;}
}
@media screen and (max-width: 734px) {
	#inner.myperm4 #mainContent h1,
	#inner.myperm4 #mainContent h2 {font-size: 5vw;}
	#inner.myperm4 #mainContent p {font-size: 4vw;}
}
/* -- 20.11.2018 - SECODNRED - Hinzugefügt - Ende  -- */

/* -- Bearbeitet 09.11.2018 - Start -- */
@media screen and (max-width: 480px){
	#inner.myperm4 #mainContent { padding: 20px 30px}
	
	#inner.myperm4 #mainContent h1,
	#inner.myperm4 #mainContent h2 { margin-bottom: 20px}
	#inner.myperm4 #mainContent h2 { font-size: 20px}
}
/* -- Bearbeitet 09.11.2018 - Ende -- */
/* -- Erweiterung 7.11.2018 - SECONDRED - Ende -- */
#inner.myperm4.article-overview-head #mainContent,
#inner.myperm4.search-result-head #mainContent{ padding: 45px 0}

#inner.myperm4.article-overview-head h1,
#inner.myperm4.search-result-head  h1{  font-weight: normal}

.article-detail .cp-inner { padding:15px 15px 0 0;}
.article-detail .node-news { background: #fff; padding: 45px 70px}
.article-detail .node-news ul { margin-bottom: 30px}

/* -- Bearbeitet 09.11.2018 - Start -- */
@media screen and (max-width: 480px) {
	.article-detail .cp-inner { padding:15px 0 0 0 !important;}
	.article-detail .node-news { padding: 25px 30px}
}
/* -- Bearbeitet 09.11.2018 - Ende -- */
/* -- Content Parts  -- */
.content-part.settings { background-attachment: scroll}

.content-part.myperm4 { }
.content-part.myperm4 h2{color: #3c3c3c;}
.content-part.myperm4 h3{color: #3c3c3c;}
.content-part.myperm4 .node h3{font-size: 40px}
.content-part.myperm4 h4{color: #3c3c3c;}
.content-part.myperm4 .node h4{font-size: 30px}

.content-part.myperm4 .shield { margin: -90px 0}

.content-part.myperm4 a.moreBtnv2 i { color: #fff; background: #3c3c3c; border-right-color: #fff}
.content-part.myperm4 a.moreBtnv2 em { color: #fff; background: #3c3c3c; border-color: #3c3c3c}

.content-part.myperm4 .teamplayer { margin-top: 50px }
.content-part.myperm4 .teamplayer h3 { font-size: 34px; font-weight: 700; margin-bottom: 24px; }
.content-part.myperm4 .teamplayer h4 {font-size: 20px; font-weight: 500; padding: 0; margin-bottom: 30px}
.content-part.myperm4 .teamplayer .portrait{ }
.content-part.myperm4 .teamplayer .details { }
.content-part.myperm4 .teamplayer .contactInfo { border-top: 6px solid #F3F3F3;	padding: 35px 35px 35px 300px; }

/* -- Dunkler Bereich -- */
.content-part.dark.myperm4 { color: #fff; background-color: #3c3c3c; }
.content-part.dark.myperm4 .node h2,
.content-part.dark.myperm4 .node h3{ color: #fff}
.content-part.dark.myperm4 .node h3:last-child{  margin-bottom: 0}

/* -- Leicht Dunkler Bereich -- */
.content-part.lightdark.myperm4 { color: #fff;background-color: #878787}
.content-part.lightdark.myperm4 .node h2,
.content-part.lightdark.myperm4 .node h3{ color: #fff}

/* -- Grauer Bereich -- */
.content-part.grey.myperm4 { color: #3c3c3c; background-color: #e6e6e6}
.content-part.grey.myperm4 .node h2,
.content-part.grey.myperm4 .node h3{ color: #3c3c3c}

.content-part.grey.myperm4 .node h2{ font-size: 63px; font-weight: 800; margin-bottom:10px; line-height: 100%;}

/* -- Erweitert 18.10.2018 - Start -- */
.content-part.grey.myperm4 .node-news { position: relative}
.content-part.grey.myperm4 .node-news h2 {font-size: 24px; margin-bottom: 30px; line-height: 120%}
.content-part.grey.myperm4 .node-news  h3 { font-size: 20px; font-weight: 700; margin-bottom: 24px; }
.content-part.grey.myperm4 .node-news  h4 {font-size: 18px; font-weight: 500; padding: 0; margin-bottom: 30px}
.content-part.grey.myperm4 .node-news ul,
.content-part.grey.myperm4 .node-news ol { margin-bottom: 30px}

.content-part.grey.myperm4 .node-news .shareBar { margin-top: 40px;}
.content-part.grey.myperm4 .node-news .inner:after {content: ".";display: block;clear: both;visibility: hidden;line-height: 0;	height: 0;}
/* -- Erweitert 18.10.2018 - Ende -- */

.content-part.dark.menubar { border-bottom: 1px solid #fff; position: relative; z-index: 6}
.content-part.dark.menubar:before { 
	position: absolute; left: 0; top: 0; right: 0; height: 10px;content:"";
	background: -moz-linear-gradient(top, rgba(0,0,0,1) 0%, rgba(0,0,0,0) 100%);
	background: -webkit-linear-gradient(top, rgba(0,0,0,1) 0%,rgba(0,0,0,0) 100%);
	background: linear-gradient(to bottom, rgba(0,0,0,1) 0%,rgba(0,0,0,0) 100%);
}
.content-part.dark.menubar .cp-inner {padding: 40px 30px}
/* -- Hinzugefügt 14.11.2018 - Start -- */
.content-part.dark.menubar .cp-inner > .fltrt { width: 33.333333%; padding-left: 45px}
/* -- Hinzugefügt 14.11.2018 - Ende -- */
.content-part.article .cp-inner {padding: 14px 14px 14px 0}

/* -- Hinzugefügt 20.11.2018 - Start -- */
@media screen and (max-width: 1120px) {
	.content-part.dark.menubar .cp-inner > .fltrt { width: 50%}
}
@media screen and (max-width: 734px) {
	.content-part.dark.menubar .cp-inner > .fltrt { width: 90%; width: calc( 100% - 50px); padding-left: 0}
}
/* -- Hinzugefügt 20.11.2018 - Ende -- */
@media screen and (max-width: 480px){
	.content-part.dark.menubar {}
	.content-part.dark.menubar .cp-inner > .fltrt { }
}
/* -- Erweitert 18.10.2018 - Start -- */
.content-part.article-overview,
.content-part.article-detail { position: relative}
/* -- Erweitert 07.11.2018 - Start -- */
.content-part.article-detail { padding-bottom: 36px}
/* -- Erweitert 07.11.2018 - Ende -- */
.content-part.article-overview:before,
.content-part.article-detail:before{
	content:""; position: absolute; left: 0; right: 0; top: 100%; height: 10px;
	background: -webkit-linear-gradient(rgba(0,0,0,0.15) 0%, rgba(0,0,0,0) 100%);
	background: -o-linear-gradient(rgba(0,0,0,0.15) 0%, rgba(0,0,0,0) 100%);
	background: linear-gradient(rgba(0,0,0,0.15) 0%, rgba(0,0,0,0) 100%);
}
/* -- Erweitert 18.10.2018 - Ende -- */
.content-part.article-overview .cp-inner {padding: 76px 0 14px 0}
.content-part.article-overview .cp-sidebar { padding-top: 76px; padding-bottom: 75px; padding-left: 45px}

/* -- Erweitert 18.10.2018 - Start -- */
@media screen and (max-width: 1366px){
	.content-part.article-overview .cp-inner {padding: 76px 0 14px 0}
}
/* -- Bearbeitet - 20.11.2018 - Start -- */
@media screen and (max-width: 1130px){
	.content-part.article-overview .row{ display: block}
	.content-part.article-overview .row .cp-inner,
	.content-part.article-overview .row .cp-sidebar{ display: block; width: auto}
	
	.content-part.article-overview .row .cp-sidebar{ display: none;}
	
	.content-part.article-detail .row{ display: block}
	.content-part.article-detail .row .cp-inner,
	.content-part.article-detail .row .cp-sidebar{ display: block; width: auto; padding-right: 0}
}
/* -- Bearbeitet - 20.11.2018 - Ende -- */
/* -- Erweitert 18.10.2018 - Ende -- */
.content-part.myperm4.cta h2 {font-size: 40px; font-weight: normal; margin-bottom: 20px}
.content-part.myperm4.cta .cp-inner{ text-align: center}

#profile-tabmenu { font-size: 18px; text-transform: uppercase;}
#profile-tabmenu ul li { margin-right: 50px}
#profile-tabmenu ul li a{ text-decoration: none; border-left:2px solid #c6c6c6; padding-left: 24px;}
#profile-tabmenu ul li.active a,
#profile-tabmenu ul li a:hover{ color: #ff5800; border-left-color:#ff5800}

#category-tabmenu { font-size: 18px; text-transform: uppercase; padding-top: 10px}
#category-tabmenu ul li { margin-right: 50px}
#category-tabmenu ul li a{ text-decoration: none; border-left:2px solid #c6c6c6; padding-left: 24px;}
#category-tabmenu ul li.current_page_item a,
#category-tabmenu ul li a:hover{ color: #ff5800;border-left-color:#ff5800}

/* -- Hinzugefügt 20.11.2018 - Start  - 27.11.2018 Angepasst-- */
#category-tabmenu .hamburger{ 
    width: 40px; height: 40px; margin-right: 0; padding: 14px 0; cursor: pointer; position: absolute; display:none;
    -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; right:0;
    border: 1px solid #4d4d4d; background: #2e2e2e;
}
#category-tabmenu .hamburger i.line { 
	height: 2px; width: 20px; background: #B5B5B5; display: block;
	  -webkit-transition: all 350ms cubic-bezier(0.2, 1, 0.3, 1);
	-moz-transition: all 350ms cubic-bezier(0.2, 1, 0.3, 1);
	transition: all 350ms cubic-bezier(0.2, 1, 0.3, 1);
}
#category-tabmenu .hamburger i.line.top { margin: 0 auto}
#category-tabmenu .hamburger i.line.middle { margin: 3px auto}
#category-tabmenu .hamburger i.line.bottom { margin: 0 auto}

#category-tabmenu.open .hamburger i.line.top,
#category-tabmenu.open .hamburger i.line.bottom { position: absolute; left: 50%; top: 50%; margin-top: -1px; margin-left: -10px}
#category-tabmenu.open .hamburger i.line.top {-webkit-transform: rotate(45deg);-moz-transform: rotate(45deg);transform: rotate(45deg);}
#category-tabmenu.open .hamburger i.line.middle {-webkit-transform: scale(0,1);-moz-transform: scale(0,1);transform: scale(0,1);}
#category-tabmenu.open .hamburger i.line.bottom {-webkit-transform: rotate(-45deg);-moz-transform: rotate(-45deg);transform: rotate(-45deg);}

@media screen and (max-width: 960px){
	#category-tabmenu { position: relative; width: auto; padding-top: 0}
	#category-tabmenu .hamburger{ display: block;}
	#category-tabmenu ul { position: absolute; left: -30px; top: -9999em;background: #3c3c3c; padding: 20px 30px}
	#category-tabmenu ul li { float: none; padding: 10px 0}
	#category-tabmenu.open ul { top: 82px; }
    
	.sticky-menu #category-tabmenu.open ul { top: 62px; }
    .content-part.menubar .cp-inner > .fltrt { margin-right: 50px; position: relative; z-index: 3; min-height: 42px}
}
/* -- Hinzugefügt 20.11.2018 - Ende -- */

/* -- Hinzugefügt 09.11.2018 - Start -- */
@media screen and (max-width: 480px){
	#profile-tabmenu ul li,
	#category-tabmenu ul li{ margin-right: 0; float: none; margin-top: 20px}
}
/* -- Hinzugefügt 09.11.2018 - Ende -- */
.stellenangebot-header { margin-bottom: 40px}
.stellenangebot-header h1 { font-size: 63px; font-weight: 800; margin-bottom: 0}

/* -- Stellenangebot Detail -- */
.stellenangebot-detail .cta-btn-wrap { text-align: center; margin-bottom: 50px}
.stellenangebot-detail .cta-btn-wrap a {display: inline-block; font-size: 28px; color: #fff;background: #353535; padding: 20px 90px;text-decoration: none; }
.stellenangebot-detail .cta-btn-wrap a:hover { background: #ff5800}

.stellenangebot-detail .accordion{ border-bottom: 2px solid #353535; margin-bottom: 30px }
.stellenangebot-detail .accordion h3 { border-top: 2px solid #353535; padding: 25px 0; margin-bottom: 0; cursor: pointer}
.stellenangebot-detail .accordion h3:hover { color: #ff5800}
.stellenangebot-detail .accordion h3:hover small { color: #333}
.stellenangebot-detail .accordion h3 small{ display: block; font-weight: normal; padding-top: 10px}
.stellenangebot-detail .accordion h3 small span { padding-right: 10px}
.stellenangebot-detail .accordion h4 { font-size: 20px; margin-bottom: 20px}

.stellenangebot-detail .accordion .toggle { float: right; position: relative; width: 40px; height: 40px; margin-top: -5px; margin-right: 10px;}
.stellenangebot-detail .accordion .toggle::before,
.stellenangebot-detail .accordion .toggle::after { 
	content:""; height: 2px; background: #353535; display: block; position: absolute;
	left: 50%; margin-top: -1px; margin-left: -20px;top: 12px;
}

.stellenangebot-detail .accordion .toggle::before { 
	-webkit-transform: rotate(45deg);-moz-transform: rotate(45deg);transform: rotate(45deg);
	-webkit-transform-origin: 0% 0%;-moz-transform-origin: 0% 0%;transform-origin: 0% 0%;	
	left: 28px; width: 50%;
}
.stellenangebot-detail .accordion .toggle::after { 
	-webkit-transform: rotate(-45deg);-moz-transform: rotate(-45deg);transform: rotate(-45deg);
	-webkit-transform-origin: 100% 0%;-moz-transform-origin: 100% 0%;transform-origin: 100% 0%;	
	left: auto; right: 7px;width: 50%;
}
.stellenangebot-detail .accordion .acc-content{
	background: -moz-linear-gradient(top, rgba(0,0,0,0.1) 0%, rgba(0,0,0,0) 100%);
	background: -webkit-linear-gradient(top, rgba(0,0,0,0.1) 0%,rgba(0,0,0,0) 100%);
	background: linear-gradient(to bottom, rgba(0,0,0,0.1) 0%,rgba(0,0,0,0) 100%);
	background-repeat: repeat-x;background-size: 100% 10px;padding: 40px 0 30px;
}
.stellenangebot-detail .accordion .open .toggle {}
.stellenangebot-detail .accordion .open .toggle::before,
.stellenangebot-detail .accordion .open .toggle::after {top:50%; left: 50%;width: 100%; right: auto}

.stellenangebot-detail .accordion .open .toggle::before {-webkit-transform-origin:50% 50%;-moz-transform-origin: 50% 50%;transform-origin: 50% 50%;}
.stellenangebot-detail .accordion .open .toggle::after {-webkit-transform-origin: 50% 50%;-moz-transform-origin: 50% 50%;transform-origin: 50% 50%;}

.stellenangebot-detail .accordion ul { list-style: none;}
.stellenangebot-detail .accordion ul li { position: relative; margin-bottom: 10px; padding-left: 20px;}
.stellenangebot-detail .accordion ul li:before { 
	width: 6px; height: 6px;background: #ff5800; content:""; display:  block; position: absolute; left: 0; top: 11px;
	-webkit-border-radius: 50%;-moz-border-radius: 50%;border-radius: 50%;
}

.stellenangebot-detail .contact-info { border-top: 2px solid #353535; border-bottom: 2px solid #353535}
.stellenangebot-detail .contact-info img { border-bottom: 5px solid #f3f3f3}
.stellenangebot-detail .contact-info h3 { color: #ff5800}
.stellenangebot-detail .contact-info .box{ padding: 35px; position: relative}
.stellenangebot-detail .contact-info a{ color: #000078; text-decoration: none}
.stellenangebot-detail .contact-info table { margin-bottom: 30px}
.stellenangebot-detail .contact-info table th{ font-weight: normal; padding-right: 10px}

.stellenangebot-detail .contact-info  ul { list-style: none;}
.stellenangebot-detail .contact-info  ul li { position: relative; margin-bottom: 10px; padding-left: 20px;}
.stellenangebot-detail .contact-info  ul li:before { 
	width: 6px; height: 6px;background: #ff5800; content:""; display:  block; position: absolute; left: 0; top: 11px;
	-webkit-border-radius: 50%;-moz-border-radius: 50%;border-radius: 50%;
}
.stellenangebot-detail .contact-info .printbtn {
	width: 30px;height: 30px;background: #000078;color: #f3f3f3;text-align: center;line-height: 32px;
	display: block;  position: absolute; bottom: 35px; right: 35px
}
.stellenangebot-detail .contact-info .printbtn span { display: none}

.stellenangebot-detail .social-bar ul li { padding-left: 0}
.stellenangebot-detail .social-bar ul li:before { display:none}
.stellenangebot-detail .social-bar ul li a span{ display: none}

.perm4-copy { font-size: 14px; text-align: center; padding-top: 20px}
.perm4-copy strong {color: #000078;}
.perm4-copy strong span {color: #ff5800}

/* -- Vorteile -- */
.myperm4-benefits { margin-top: 50px;}
.myperm4-benefits .box { margin-bottom: 25px;}
.myperm4-benefits .circle { width: 110px; height: 110px; background: #fff; float: left; text-align: center; line-height: 115px;font-size: 55px;}
.myperm4-benefits .circle:before {
	display: block; line-height: inherit; height: inherit; 
	-webkit-transition: -webkit-transform 350ms cubic-bezier(0.2, 1, 0.3, 1);
	-moz-transition: -moz-transform 350ms cubic-bezier(0.2, 1, 0.3, 1);
	transition: transform 350ms cubic-bezier(0.2, 1, 0.3, 1);
}
.myperm4-benefits .text-wrap{ margin-left: 150px;position: relative}
.myperm4-benefits .text-wrap div{ display: block; z-index: 1; position: relative}
.myperm4-benefits .text-wrap .default-txt{
	filter: alpha(opacity=100);opacity: 1;
	  -webkit-transition: -webkit-transform 350ms cubic-bezier(0.2, 1, 0.3, 1), opacity 350ms cubic-bezier(0.2, 1, 0.3, 1);
	-moz-transition: -moz-transform 350ms cubic-bezier(0.2, 1, 0.3, 1), opacity 350ms cubic-bezier(0.2, 1, 0.3, 1);
	transition: transform 350ms cubic-bezier(0.2, 1, 0.3, 1), opacity 350ms cubic-bezier(0.2, 1, 0.3, 1);
}
.myperm4-benefits .text-wrap .hover-txt{
	pointer-events:none; position: absolute; z-index:2; top:0; left:0; width:100%; height: 100%;
	-webkit-transform: scale(0.8); -moz-transform: scale(0.8); transform: scale(0.8);
	filter: alpha(opacity=0);opacity: 0;
	  -webkit-transition: -webkit-transform 350ms cubic-bezier(0.2, 1, 0.3, 1), opacity 350ms cubic-bezier(0.2, 1, 0.3, 1);
	-moz-transition: -moz-transform 350ms cubic-bezier(0.2, 1, 0.3, 1), opacity 350ms cubic-bezier(0.2, 1, 0.3, 1);
	transition: transform 350ms cubic-bezier(0.2, 1, 0.3, 1), opacity 350ms cubic-bezier(0.2, 1, 0.3, 1);
	display: -ms-flexbox;display: -webkit-flex;display: flex;
	-webkit-flex-direction: row;-ms-flex-direction: row;flex-direction: row;
	-webkit-flex-wrap: nowrap;-ms-flex-wrap: nowrap;flex-wrap: nowrap;
	-webkit-justify-content: flex-start;-ms-flex-pack: start;justify-content: flex-start;
	-webkit-align-content: stretch;-ms-flex-line-pack: stretch;align-content: stretch;
	-webkit-align-items: center;-ms-flex-align: center;align-items: center;
}
.myperm4-benefits .box:hover .circle:before {
	-webkit-transform: scale(1.3);-moz-transform: scale(1.3);-o-transform: scale(1.3);-ms-transform: scale(1.3);transform: scale(1.3);
}
.myperm4-benefits .box:hover .text-wrap{ }
.myperm4-benefits .box:hover .text-wrap .default-txt{ filter: alpha(opacity=0);opacity: 0;}
.myperm4-benefits .box:hover .text-wrap .hover-txt{
	-webkit-transform: scale(1); -moz-transform: scale(1); transform: scale(1);
	filter: alpha(opacity=100);opacity: 1;
}
.myperm4-benefits h3,
.myperm4-benefits p {  margin-bottom: 0}
.myperm4-benefits h3 { padding-top: 20px;}

/* -- Mein Profil - Einstellungen -- */
.profile-heading {}
/* -- Anpassung - 15.10.2018 - Start -- */
.profile-heading figure.avatar{ float: left; width: 100px; height: 100px; position: relative}
.profile-heading figure.avatar .addPhoto {
	background: url(../gfx/noprofile-img-addphoto.png) center no-repeat; background-size: contain; 
	position: absolute; left: 0; top: 0; width: 100%; height: 100%; display: block;
	filter: alpha(opacity=0);opacity: 0;
}
.profile-heading figure.avatar .addPhoto:hover {filter: alpha(opacity=100);opacity: 1;}
/* -- Anpassung - 15.10.2018 - Ende -- */

.profile-heading h2 { margin-bottom: 10px; font-size: 40px; line-height: 100%; font-weight: normal; padding-top: 10px}

.profile-heading p {font-size: 20px; margin-bottom: 0}
.profile-heading a {color:#ff5800; text-decoration: none}
.profile-heading .name { margin-left: 136px;}
.profile-heading .info { margin-right: 136px;}
.profile-heading .box { padding-bottom: 10px}

.profile-heading.grid.two .box:first-child {border-right: 2px solid #c6c6c6; padding-bottom: 10px; padding-right: 75px}
.profile-heading.grid.two .box:last-child { padding-left: 55px}

.donut-chart {
	position: relative;border-radius: 50%;overflow: hidden;
	width: 100px; height: 100px; background: #ff5800; 
}
.donut-chart .slice {position: absolute;top: 0;left: 0;width: 100%;height: 100%;}
.donut-chart .chart-center {
	position: absolute;top: 10px;left: 10px;width: 80px;height: 80px;background: #fff;
	-webkit-border-radius: 50%; -moz-border-radius: 50%;border-radius: 50%;
}
.donut-chart .chart-center span {display: block;text-align: center;font-size: 40px;font-weight:800; line-height: 80px; color: #333;}
.donut-chart .slice.one {clip: rect(0 100px 50px 0);background: #e1e1e1;}
.donut-chart .slice.two {clip: rect(0 50px 100px 0); background: #e1e1e1;}

/* -- Job Swiper  -- */
.jobswiper-wrap { position: relative}
.jobswiper-wrap .swiper-button-prev, 
.jobswiper-wrap .swiper-button-next{color:#ff5800; font-size: 80px; width: 80px; height: 90px} 

.jobswiper-wrap .swiper-button-prev { left: -100px} 
.jobswiper-wrap .swiper-button-next { right: -100px}

.jobswiper-wrap .block-img {background: #fff;}
.jobswiper-wrap .block-img .inner { padding: 30px 40px}
.jobswiper-wrap .block-img .inner p:last-child{ margin-bottom: 0}
.jobswiper-wrap .block-img .meta { padding: 20px 45px}
.jobswiper-wrap .block-img .meta a.more { text-transform: uppercase; color: #fff; text-decoration: none;font-weight: 500;}
.jobswiper-wrap .block-img .meta a.more::before{color:#ff5800; margin-right: 10px; position: relative; top: 2px;}

.jobswiper-wrap .block-img.deepgrey .meta { background: #7c7c7c}
.jobswiper-wrap .block-img.blue .meta { background: #00003c}

/* -- Hinzugefügt - 27.11.2018 - Start -- */
@media screen and (max-width: 480px){
    .jobswiper-wrap .swiper-button-prev, 
    .jobswiper-wrap .swiper-button-next{ display: none}
}
/* -- Hinzugefügt - 27.11.2018 - Ende -- */
/* -- Modal Window-- */
.popup {}
/* -- Anpassung SECONDRED - 15.10.2018 -  Start -- */
.popup .popup-close{
	width: 40px; height: 40px; position: absolute; background: #222; top:-10px; right: -10px;
	-webkit-box-shadow: 0 0 4px rgba(0,0,0,0.5);-moz-box-shadow: 0 0 4px rgba(0,0,0,0.5);box-shadow: 0 0 4px rgba(0,0,0,0.5);
}
.popup .popup-close:before,
.popup .popup-close:after { 
	width: 30px; height: 2px; background: #fff; content:""; position: absolute; 
	left: 50%; top: 50%; margin-left: -15px; margin-top: -1px;display: block;
}

.popup .popup-close:before {-webkit-transform: rotate(45deg);-moz-transform: rotate(45deg);transform: rotate(45deg);}
.popup .popup-close:after {-webkit-transform: rotate(-45deg);-moz-transform: rotate(-45deg);transform: rotate(-45deg);}
.popup .popup-close span { display: none}
.popup .popup-close:hover{ background:#ff5800 }

.popup .btn-grid .box:first-child{ padding-right: 15px}
.popup .btn-grid .box:last-child{ padding-left: 15px}
.popup .btn-grid button { display: block; cursor: pointer; height: 40px; text-align: center; font-size:17px; width: 100%}
.popup .btn-grid button.btnAbort { color: #3c3c3c; background: #f3f3f3; border-color: #d5d5d5}
.popup .btn-grid button.btnSave { color: #fff; background: #3c3c3c; border-color: #3c3c3c}
.popup .btn-grid button.btnSave:hover { background: #ff5800; border-color: #ff5800 }
/* -- Anpassung SECONDRED - 15.10.2018 -  Ende -- */

.popup.register .popup-contentpart-wrap {overflow: auto; max-height: calc(100vh - 200px);}

.popup.register .msg { font-size: 17px;  color: #ff0000; margin-bottom: 30px}
.popup.register .popup-content { padding: 0; max-width: 1306px; overflow: visible}
.popup.register .popup-contentpart{ padding:65px; background-attachment: fixed; background-position: center}
.popup.register .popup-contentpart h3 { font-size: 63px; font-weight: 800;line-height: 100%; }
.popup.register .popup-contentpart h4 { font-size: 40px; font-weight: normal; line-height: 100%; margin-bottom: 10px}

.popup.register .myperm4-benefits {}
.popup.register .myperm4-benefits p { margin-left: 0}

.popup.register .popup-contentpart.grey { background-color: #e6e6e6}
.popup.register .popup-contentpart.grey h3{}

.popup.register .popup-contentpart.dark { color: #fff; background-color: #3b3a39}
.popup.register .popup-contentpart.dark h3 { margin-bottom: 10px}
.popup.register .popup-contentpart.dark h4 {font-weight: normal}
.popup.register .popup-contentpart.dark .shield { margin: -90px 0}

.popup.register fieldset.myperm4-register { padding: 0; margin-left: 50px}

/* -- Erweiterung SECONDRED - 15.10.2018 -  Start -- */
/* - Gehaltsrechner-Popup - */
.popup.calc-income {}
.popup.calc-income .popup-content { overflow: visible; width: 655px; background: #e6e6e6; padding: 35px }
.popup.calc-income .popup-content h3 { text-align: center; font-size: 63px; font-weight: 800; color: #3c3c3c; line-height: 60px}

.popup.calc-income .popup-contentpart-wrap { height: 100vh; height: calc(100vh - 270px); overflow: auto}

.popup.calc-income .income-generator { position: relative; padding-top: 85px; margin-bottom: 150px}
.popup.calc-income .income-generator .forground { position: absolute; left: 0; top:0; right: 0; bottom: 0; z-index: 2}
.popup.calc-income .income-generator .your-income {width: 2px; position: absolute; left: 50%; margin-left: -1px; height: 100%;}

.popup.calc-income .income-generator .your-income-text,
.popup.calc-income .income-generator .income{
	text-align: center; white-space: nowrap; position: relative; left: 50%; width: 150px; display: block;
	-webkit-transform: translate(-50%, 0px);-moz-transform: translate(-50%, 0px);transform: translate(-50%, 0px);
}
.popup.calc-income .income-generator .your-income-text { margin-bottom: 10px;}
.popup.calc-income .income-generator .income { color: #ff5800; margin-bottom: 20px }
.popup.calc-income .income-generator .avatar { 
	display: block; position: relative; overflow: hidden; background-repeat: no-repeat; background-size: contain;
	width: 84px; height: 84px; -webkit-border-radius: 50%;-moz-border-radius: 50%;border-radius: 50%;left: 50%;
	-webkit-transform: translate(-50%, 0px);-moz-transform: translate(-50%, 0px);transform: translate(-50%, 0px);
}
.popup.calc-income .income-generator .line {width: 2px; position: absolute; background:#ff5800; bottom: 0; height: 160px}

.popup.calc-income .income-generator .bg { 
	height: 315px; max-width: 365px; margin: 0 auto; position: relative; z-index: 1;
	background: url('/mein-perm4/images/incoming-steps-bg.png') center no-repeat;
	background-size: contain;
}
.popup.calc-income .income-generator .bg .line { width: 7px; height: 280px; display: block; background: #3c3c3c; position: absolute}
.popup.calc-income .income-generator .bg .line-lft {left: 0}
.popup.calc-income .income-generator .bg .line-rt {right: 0}
.popup.calc-income .income-generator .bg .step-bg {}

.popup.calc-income .min-income,
.popup.calc-income .max-income {position: absolute; top: 100%; white-space: nowrap; width: 150px; text-align: center; padding-top: 20px}

.popup.calc-income .min-income { left: 0; margin-left: -75px;}
.popup.calc-income .max-income { right: 0;  margin-right: -75px;}

.popup.calc-income .min-income strong,
.popup.calc-income .max-income strong{ display: block}

/* - Avatar-Upload - Popup - */
.popup.avatar-upload {}
.popup.avatar-upload .popup-content h3 { text-align: center; font-size: 63px; font-weight: 800; color: #3c3c3c; line-height: 60px}
.popup.avatar-upload .popup-content { overflow: auto; width: 655px; background: #e6e6e6; padding: 35px }

.popup.avatar-upload .avatar-wrap { width: 232px; margin: 40px auto  40px}
.popup.avatar-upload .avatar-wrap a { 
	width: 232px; height: 232px; display: block;
	background: url(../gfx/noprofile-img-addphoto-woman-large.png) no-repeat center;
}

.popup.avatar-upload p {font-size: 40px; margin: 0 auto 30px; width: 400px; text-align: center; line-height: 46px}
.popup.avatar-upload p a { color: #ff5800}
.popup.avatar-upload .msg.info { text-align: center; margin-bottom: 30px}

/* - Avatar-Upload - Popup - */
.popup.avatar-crop {}
.popup.avatar-crop .popup-content h3 { text-align: center; font-size: 63px; font-weight: 800; color: #3c3c3c; line-height: 60px}
.popup.avatar-crop .popup-content { overflow: auto; width: 655px; background: #e6e6e6; padding: 35px }


/* -- Erweiterung SECONDRED - 15.10.2018 -  Ende -- */

/* -- Popup - Footer -- */
.popup-footer-wrap {background: #e6e6e6; padding: 40px 0}
.popup-footer { font-size: 14px; margin:0 40px; } 
.popup-footer p.copy { margin:0; padding:0;}
.popup-footer .grid { padding: 40px;border: 6px solid rgba(255,255,255, 0.5);}
.popup-footer address { font-style: normal; margin-bottom: 20px}

.popup-footer h4 { font-size: 14px; text-transform: uppercase; margin-bottom: 30px}
.popup-footer .box { position: relative}
.popup-footer .box:first-child h4{ position: relative}
.popup-footer .box:first-child h4:before{content:""; width: 6px; height: 100%; background: #F0500A; left:-46px; top: 0; bottom: 0; position: absolute}
.popup-footer .box:before {content: "";width: 6px;background: rgba(0,0,0,0.05);position: absolute;left: -20px;bottom: 0;top: 50px;}
.popup-footer .box:first-child:before { display: none}

.popup-footer ul { padding-left: 0; list-style: none; margin-bottom: 20px}
.popup-footer ul:last-child { margin-bottom: 0}
.popup-footer ul li a { text-decoration: none}
.popup-footer ul li div i,
.popup-footer ul li a i {
	-webkit-transition: color 350ms cubic-bezier(0.2, 1, 0.3, 1);-moz-transition: color 350ms cubic-bezier(0.2, 1, 0.3, 1);transition: color 350ms cubic-bezier(0.2, 1, 0.3, 1);
}
.popup-footer ul li a i:before {}
.popup-footer ul li a span {}

.popup-footer ul li a:hover i {background: #F0500A}
.popup-footer ul li a:hover i.icon-facebook {background:#3b5998}
.popup-footer ul li a:hover i.icon-xing {background:#126567}
.popup-footer ul li a:hover i.icon-linkedin {background:#0077B5}
.popup-footer ul li a:hover i.icon-instagram {background:#cd486b}

.popup-footer ul {}
.popup-footer ul li a {}
.popup-footer ul li a:hover {text-decoration: underline}
.popup-footer ul li i {width: 30px;height: 30px;background:#000078; color: #f3f3f3; text-align: center; line-height: 32px; float:left; margin-right: 15px; position: relative; top: 4px}
.popup-footer ul li i:before {}
.popup-footer ul li span { padding: 5px 0; display: block; overflow: hidden}

/* -- 16.10.2018 - SECODNRED - Erweiterung - Start -- */
.croppie-container {width: 100%;height: 100%;}
.croppie-container .cr-image {z-index: -1;position: absolute;top: 0;left: 0;transform-origin: 0 0;max-height: none;max-width: none;}
.croppie-container .cr-boundary {position: relative;overflow: hidden;margin: 0 auto;z-index: 1;width: 100%;height: 375px;}

.croppie-container .cr-viewport,
.croppie-container .cr-resizer {
	position: absolute;margin: auto;top: 0;bottom: 0;right: 0;left: 0;box-shadow: 0 0 2000px 2000px rgba(230, 230, 230, 0.7);z-index: 0;
	-webkit-border-radius: 50%;-moz-border-radius: 50%;border-radius: 50%;
}

.croppie-container .cr-resizer {z-index: 2;box-shadow: none;pointer-events: none;}

.croppie-container .cr-resizer-vertical,
.croppie-container .cr-resizer-horisontal {position: absolute;pointer-events: all;}

.croppie-container .cr-resizer-vertical::after,
.croppie-container .cr-resizer-horisontal::after {display: block;position: absolute;box-sizing: border-box;border: 1px solid black;background: #fff;width: 10px;height: 10px;content: '';}

.croppie-container .cr-resizer-vertical {bottom: -5px;cursor: row-resize;width: 100%;height: 10px;}
.croppie-container .cr-resizer-vertical::after {left: 50%;margin-left: -5px;}

.croppie-container .cr-resizer-horisontal {right: -5px;cursor: col-resize;width: 10px;height: 100%;}
.croppie-container .cr-resizer-horisontal::after {top: 50%;margin-top: -5px;}
.croppie-container .cr-original-image {display: none;}
.croppie-container .cr-vp-circle {border-radius: 50%;}
.croppie-container .cr-overlay {z-index: 1;position: absolute;cursor: move;touch-action: none;}
.croppie-container .cr-slider-wrap {width: 75%;margin: 55px auto;text-align: center;}
.croppie-result {position: relative;overflow: hidden;}
.croppie-result img {position: absolute;}

.croppie-container .cr-image,
.croppie-container .cr-overlay,
.croppie-container .cr-viewport {-webkit-transform: translateZ(0);-moz-transform: translateZ(0);-ms-transform: translateZ(0);transform: translateZ(0);}

/*************************************/
/***** STYLING RANGE INPUT ***********/
/*************************************/
/*http://brennaobrien.com/blog/2014/05/style-input-type-range-in-every-browser.html */
/*************************************/
.cr-slider-wrap { position: relative;}
.cr-slider-wrap:before,
.cr-slider-wrap:after { position: absolute; font-size: 17px}

.cr-slider-wrap:before {content:"Min"; right: 100%; padding-right: 20px}
.cr-slider-wrap:after {content: "Max"; left: 100%; padding-left: 20px}

.cr-slider {
	-webkit-appearance: none;width: 480px;max-width: 100%;padding-top: 10px;padding-bottom: 10px;background-color: transparent;
	border-left: 2px solid #3c3c3c; border-right: 2px solid #3c3c3c;
}
.cr-slider::-webkit-slider-runnable-track {width: 100%;height: 2px;background:#3c3c3c;border: 0;border-radius: 3px;}
.cr-slider::-webkit-slider-thumb {-webkit-appearance: none;border: none;height:35px;width: 4px;background: #ff5800;margin-top: -16px;}
.cr-slider:focus {outline: none;}

.cr-slider::-moz-range-track {width: 100%;height: 2px;background: #3c3c3c;border: 0;border-radius: 3px;}
.cr-slider::-moz-range-thumb {border: none;height:35px;width: 4px;background: #ff5800;margin-top: -16px;}
.cr-slider:-moz-focusring {outline: 1px solid white;outline-offset: -1px;}

.cr-slider::-ms-track {width: 100%;height: 2px;background: transparent;border-color: transparent;border-width: 6px 0;color: transparent;}
.cr-slider::-ms-fill-lower {background: rgba(0, 0, 0, 0.5);	border-radius: 10px;}
.cr-slider::-ms-fill-upper {background: rgba(0, 0, 0, 0.5);border-radius: 10px;}
.cr-slider::-ms-thumb {border: none;height: 35px;width: 4px;background: #ff5800;margin-top:1px;}

.cr-slider:focus::-ms-fill-lower {background: rgba(0, 0, 0, 0.5);}
.cr-slider:focus::-ms-fill-upper {background: rgba(0, 0, 0, 0.5);}

/***********************************/
/* Rotation Tools */
/***********************************/
.cr-rotate-controls {position: absolute;bottom: 5px;left: 5px;z-index: 1;}
.cr-rotate-controls button {border: 0;background: none;}
.cr-rotate-controls i:before {display: inline-block;font-style: normal;font-weight: 900;font-size: 22px;}
.cr-rotate-l i:before {content: '↺';}
.cr-rotate-r i:before {content: '↻';}
/* -- 16.10.2018 - SECODNRED - Erweiterung - Ende -- */
/* -- 08.11.2018 - SECODNRED - Erweiterung - Start -- */
.autocomplete-suggestions {
    text-align: left; cursor: default; border: 1px solid #4d4d4d; border-top: 0; background: #2e2e2e; box-shadow: -1px 1px 3px rgba(0,0,0,.1);
    position: absolute; display: none; z-index: 9999; max-height: 254px; overflow: hidden; overflow-y: auto; left: -2px; width: 100%;
}
.autocomplete-suggestion { 
	position: relative; padding: 5px 10px; line-height: 23px; white-space: nowrap; 
	overflow: hidden; text-overflow: ellipsis; font-size: 1.02em; color: #777;
	cursor: pointer
}
.autocomplete-suggestion b { font-weight: normal; color: #ff5800; }
.autocomplete-suggestion.selected { background: rgba(255,255,255, 0.1);}

#outerlogin { position: absolute; left: 0; top: 100%; right: 0; padding: 0; background: transparent; display: none; }
#outerlogin.visible {display: block;}
/* -- 08.11.2018 - SECODNRED - Erweiterung - Ende -- */

/* -- Hinzugefügt - 27.11.2018 - Start -- */
@media screen and (max-width: 1180px){
    .page-template-page-meinperm4-artikel #topmenu li:nth-child(2) {display: block}
    .page-template-page-meinperm4-artikel #topmenu li:nth-child(3) {display: none}
}
/* -- Hinzugefügt - 27.11.2018 - Start -- */
.node.overlay-minheight { min-height:1800px}

.register-overlay-wrap { position: absolute; top: 300px;left: 0; right: 0; bottom: 0;padding: 0; z-index: 6}

.register-overlay-wrap .bg-white,
.register-overlay-wrap .bg-dark { position: absolute; left: 0; right: 0; z-index: 1}
/*
.register-overlay-wrap::before {
    content:""; background:#fff; position: absolute; top: 400px; 
    left: 0; right: 0; height: 999em; z-index:0; display: block;
}
*/
.register-overlay-wrap .bg-white {
    height: 300px;top:0;z-index: 2;
    background: -moz-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(255,255,255,1) 36%, rgba(255,255,255,1) 61%, rgba(255,255,255,0) 100%);
    background: -webkit-linear-gradient(top, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 36%,rgba(255,255,255,1) 61%,rgba(255,255,255,0) 100%);
    background: linear-gradient(to bottom, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 36%,rgba(255,255,255,1) 61%,rgba(255,255,255,0) 100%);
}
.register-overlay-wrap .bg-dark { background: rgba(255,255,255,0.8); top: 150px; bottom: 0; z-index: 1}

.register-overlay {position: relative; z-index: 3}
.register-overlay::before{ 
    content:""; position: absolute; left: 0; right: 0; top: 100%; height: 300px;
    background: -webkit-linear-gradient(rgba(255,255,255,1) 0%, rgba(255,255,255,1) 38%, rgba(255,255,255,0) 81%, rgba(255,255,255,0) 100%);
    background: -o-linear-gradient(rgba(255,255,255,1) 0%, rgba(255,255,255,1) 38%, rgba(255,255,255,0) 81%, rgba(255,255,255,0) 100%);
    background: linear-gradient(rgba(255,255,255,1) 0%, rgba(255,255,255,1) 38%, rgba(255,255,255,0) 81%, rgba(255,255,255,0) 100%);
}


.register-overlay a.removeOverlay { color: #707070; float: right; text-decoration: none; margin-top: -20px; margin-right: -40px;}
.register-overlay a.removeOverlay i {
    float: right; background: #707070; width: 34px; height: 34px; position: relative;display: block;
    -webkit-border-radius: 50%;-moz-border-radius: 50%;border-radius: 50%; margin-left: 10px; top: -2px;
}
.register-overlay a.removeOverlay i::before,
.register-overlay a.removeOverlay i::after {
    width: 20px; height: 2px; background: #fff; content:""; position: absolute; 
    left: 50%; margin-left: -10px; margin-top: -1px; top: 50%
}

.register-overlay a.removeOverlay i::before {-webkit-transform: rotate(45deg);-moz-transform: rotate(45deg);transform: rotate(45deg);}
.register-overlay a.removeOverlay i::after {-webkit-transform: rotate(-45deg);-moz-transform: rotate(-45deg);transform: rotate(-45deg);}

.register-overlay .ro-head{ 
    padding: 100px 65px 30px; color: #3c3c3c;
    background: -moz-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(255,255,255,0.62) 23%, rgba(255,255,255,1) 50%, rgba(255,255,255,1) 100%);
    background: -webkit-linear-gradient(top, rgba(255,255,255,0) 0%,rgba(255,255,255,0.62) 23%,rgba(255,255,255,1) 50%,rgba(255,255,255,1) 100%);
    background: linear-gradient(to bottom, rgba(255,255,255,0) 0%,rgba(255,255,255,0.62) 23%,rgba(255,255,255,1) 50%,rgba(255,255,255,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#003c3c3c', endColorstr='#3c3c3c',GradientType=0 );
}
.register-overlay .ro-head h3{ font-size: 68px !important;font-weight: 800 !important;  margin-bottom: 10px !important; line-height: 100%}
.register-overlay .ro-head p{ font-size:40px !important; line-height: 100% !important}

.register-overlay .ro-content { 
    background: #e6e6e6 url("../images/register-overlay-bg.jpg") no-repeat;
    background-size: cover;
    padding: 60px 65px; border-top:2px solid #fff;
    border-left: 2px solid #fff;border-right: 2px solid #fff;
}
.register-overlay .ro-content h4{ font-size: 62px !important; font-weight: 800 !important; margin-bottom: 60px !important;}

.register-overlay .ro-content .grid { margin-left: 20px}
.register-overlay .ro-content .grid .box-50 { margin-bottom: 40px}
.register-overlay .ro-content .grid .box-50:nth-child(odd) { padding-right: 20px}
.register-overlay .ro-content .grid .box-50:nth-child(even) { padding-left: 20px}

.register-overlay .ro-content .circle { background: #fff; text-align: center; width: 80px; height: 80px; font-size: 48px; display: block; float: left; line-height: 90px}
.register-overlay .ro-content .circle:before {
    display: inline-block;
    -webkit-transition: -webkit-transform 350ms cubic-bezier(0.2, 1, 0.3, 1);
	-moz-transition: -moz-transform 350ms cubic-bezier(0.2, 1, 0.3, 1);
	transition: transform 350ms cubic-bezier(0.2, 1, 0.3, 1);
}

.register-overlay .ro-content .text-wrap{ margin-left: 120px;position: relative}
.register-overlay .ro-content .text-wrap div{ display: block; z-index: 1; position: relative}
.register-overlay .ro-content .text-wrap .default-txt{
	filter: alpha(opacity=100);opacity: 1;
	  -webkit-transition: -webkit-transform 350ms cubic-bezier(0.2, 1, 0.3, 1), opacity 350ms cubic-bezier(0.2, 1, 0.3, 1);
	-moz-transition: -moz-transform 350ms cubic-bezier(0.2, 1, 0.3, 1), opacity 350ms cubic-bezier(0.2, 1, 0.3, 1);
	transition: transform 350ms cubic-bezier(0.2, 1, 0.3, 1), opacity 350ms cubic-bezier(0.2, 1, 0.3, 1);
}
.register-overlay .ro-content .text-wrap .hover-txt{
	pointer-events:none; position: absolute; z-index:2; top:0; left:0; width:100%; height: 100%; line-height: 100%;
	-webkit-transform: scale(0.8); -moz-transform: scale(0.8); transform: scale(0.8);
	filter: alpha(opacity=0);opacity: 0;
	  -webkit-transition: -webkit-transform 350ms cubic-bezier(0.2, 1, 0.3, 1), opacity 350ms cubic-bezier(0.2, 1, 0.3, 1);
	-moz-transition: -moz-transform 350ms cubic-bezier(0.2, 1, 0.3, 1), opacity 350ms cubic-bezier(0.2, 1, 0.3, 1);
	transition: transform 350ms cubic-bezier(0.2, 1, 0.3, 1), opacity 350ms cubic-bezier(0.2, 1, 0.3, 1);
	display: -ms-flexbox;display: -webkit-flex;display: flex;
	-webkit-flex-direction: row;-ms-flex-direction: row;flex-direction: row;
	-webkit-flex-wrap: nowrap;-ms-flex-wrap: nowrap;flex-wrap: nowrap;
	-webkit-justify-content: flex-start;-ms-flex-pack: start;justify-content: flex-start;
	-webkit-align-content: stretch;-ms-flex-line-pack: stretch;align-content: stretch;
	-webkit-align-items: center;-ms-flex-align: center;align-items: center;
}
.register-overlay .ro-content .box:hover .circle:before {
	-webkit-transform: scale(1.2);-moz-transform: scale(1.2);-o-transform: scale(1.2);-ms-transform: scale(1.2);transform: scale(1.2);
}
.register-overlay .ro-content .box:hover .text-wrap{ }
.register-overlay .ro-content .box:hover .text-wrap .default-txt{ filter: alpha(opacity=0);opacity: 0;}
.register-overlay .ro-content .box:hover .text-wrap .hover-txt{
	-webkit-transform: scale(1); -moz-transform: scale(1); transform: scale(1);
	filter: alpha(opacity=100);opacity: 1;
}

.register-overlay .ro-content h5 { font-size: 40px; font-weight: normal; line-height: 100%; padding-top: 0px}
.register-overlay .ro-content p { font-size: 17px !important; line-height: 100% !important }

.register-overlay .ro-warranty { 
    border-top:2px solid #fff;background: #141617 url("../gfx/cp-backgrnd-sicherheit.jpg") center no-repeat; 
    padding: 40px 60px 60px 65px; color: #fff; font-size: 40px; position: relative; z-index: 3;
    border-left: 2px solid #fff;border-right: 2px solid #fff; background-size: cover;
}
.register-overlay .ro-warranty h5 {font-size: 63px;font-weight: 800; line-height: 100%;  margin-bottom: 10px }
.register-overlay .ro-warranty p { font-size: 40px; line-height: 100%}
.register-overlay .ro-warranty .shield {margin: -60px -35px -60px 20px}

.register-overlay .ro-ctabtns {
    border-top:17px solid #fff; padding: 0 65px 30px; position: relative;background: #fff;
}
.register-overlay .ro-ctabtns .grid { margin-bottom: 30px}
.register-overlay .ro-ctabtns .grid .box{ text-align: center; }
.register-overlay .ro-ctabtns a { 
    display: inline-block; text-decoration: none; width: 285px; text-align: center; padding: 6px 0; font-size: 16px;
    font-weight: bold;
    -webkit-border-radius: 10px;-moz-border-radius: 10px;border-radius: 10px;
}
.register-overlay .ro-ctabtns a.register { background: #C2C2C2; color: #fff;}
.register-overlay .ro-ctabtns a.login { background: #3C3C3C; color: #fff;}

.register-overlay .ro-ctabtns a:hover { color: #fff;	background: #ff5800; }

@media screen and (max-width: 1580px){
    .register-overlay .ro-warranty h5 {font-size: 50px}
    .register-overlay .ro-warranty p {font-size: 30px}
}
@media screen and (max-width: 1320px){
    .register-overlay .ro-warranty h5 {font-size: 40px}
    .register-overlay .ro-warranty p {font-size: 20px}
}
@media screen and (max-width: 1280px){    
    .register-overlay .ro-head h3{ font-size: 48px !important;}
    .register-overlay .ro-head p { font-size: 20px !important}
    
    .register-overlay .ro-content .grid .box-50 { float: none; width: auto;}
    .register-overlay .ro-content .grid .box-50:nth-child(even) { padding-left: 0px}
    
    .register-overlay .ro-content h4{ font-size: 42px !important }    
    .register-overlay .ro-warranty .shield img { width: 150px !important; height: auto !important}
}
@media screen and (max-width: 1024px){

}
@media screen and (max-width: 960px){
    
}
@media screen and (max-width: 820px){
    .register-overlay .ro-warranty h5 {font-size: 30px}
    .register-overlay .ro-warranty p {font-size: 20px}
    
}
@media screen and (max-width: 734px){
    .register-overlay .ro-head h3 { font-size: 26px !important;}
    .register-overlay .ro-head h4,
    .register-overlay .ro-content h4 { font-size: 20px !important;}
    
    .register-overlay .ro-content .grid { margin-left: 0}
    
    .register-overlay .ro-content h5 { font-size: 18px !important}
    
}
@media screen and (max-width: 640px){
    
    .register-overlay .ro-head { padding: 120px 30px 30px;}
    
    .register-overlay .ro-content { padding: 30px}
    .register-overlay .ro-content h4 { margin-bottom: 30px !important}
    
    .register-overlay .ro-content .text-wrap {margin-left: 100px;}
    .register-overlay .ro-content h5 {padding-top: 10px}
    .register-overlay .ro-content p {font-size: 14px !important;}
    .register-overlay .ro-content .circle { width: 70px; height: 70px; line-height: 80px; font-size:40px}
    
    .register-overlay .ro-warranty {padding: 20px 30px 30px;}
    .register-overlay .ro-warranty .shield { margin: -30px -20px -40px 20px}
    .register-overlay .ro-warranty .shield img {width: 100px !important}
    .register-overlay .ro-warranty p { margin-right: 130px}
    
    .register-overlay .ro-warranty h5 { font-size: 25px}
    .register-overlay .ro-warranty p {font-size: 14px}
    
    .register-overlay .ro-ctabtns { padding: 0 30px 30px}
    .register-overlay .ro-ctabtns a { width: 100%}
}

@keyframes fadeInOut {
    0% {opacity:1;}
    45% {opacity:1;}
    55% {opacity:0;}
    100% {opacity:0;}
}

@media screen and (max-width: 480px){
    
        /* -- Erweiterung Overlay 26.09 -- */
    
    #container { overflow: hidden}
    .content-part.article-detail { z-index: 6}
    .content-part.article-detail .cp-inner{ position: relative;z-index: 5;}
    .content-part.article-detail .node { overflow: visible}
    
    .register-overlay a.removeOverlay { margin-right: 0}
    .register-overlay-wrap { 
        top: -180px;
        -webkit-transform: translate(0px, 100%);-moz-transform: translate(0px, 100%);transform: translate(0px, 100%);
        -webkit-transition: -webkit-transform 350ms cubic-bezier(0.2, 1, 0.3, 1);
        -moz-transition: -moz-transform 350ms cubic-bezier(0.2, 1, 0.3, 1);
        transition: transform 350ms cubic-bezier(0.2, 1, 0.3, 1);
    }
    .register-overlay-wrap.visible {
        -webkit-transform: translate(0px, 0%);-moz-transform: translate(0px, 0%);transform: translate(0px, 0%);
    }
    
    .register-overlay .ro-wrap { position: relative;}
    .register-overlay .ro-content { position: relative; z-index: 1}
    .register-overlay .ro-warranty { 
        position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index:2;
        display: -ms-flexbox;display: -webkit-flex;display: flex;
        -webkit-flex-direction: column;-ms-flex-direction: column;flex-direction: column;
        -webkit-flex-wrap: nowrap;-ms-flex-wrap: nowrap;flex-wrap: nowrap;
        -webkit-justify-content: flex-start;-ms-flex-pack: start;justify-content: flex-start;
        -webkit-align-content: stretch;-ms-flex-line-pack: stretch;align-content: stretch;
        -webkit-align-items: stretch;-ms-flex-align: stretch;
        animation-name: fadeInOut;
        animation-timing-function: ease-in-out;
        animation-iteration-count: infinite;
        animation-duration: 10s;
        animation-direction: alternate;
    }
    .register-overlay .ro-warranty h5{-webkit-order: 0;-ms-flex-order: 0;order: 0;}
    .register-overlay .ro-warranty p{ -webkit-order: 0;-ms-flex-order: 0;order: 0; }
    .register-overlay .ro-warranty .shield {
        float: none !important;-webkit-order: 3;-ms-flex-order: 3;order: 3;
        margin: 0 !important; text-align: center;
    }
    .register-overlay .ro-warranty .shield img { 
        width: auto !important; height:  auto !important;
        max-width: 80%
    }
}
@media screen and (max-width: 450px){
    .register-overlay-wrap {padding: 20px}
    .register-overlay .ro-head {padding: 100px 20px 20px}
    .register-overlay .ro-head h3 {font-size: 20px !important}
    .register-overlay .ro-head p {font-size: 14px !important}
    .register-overlay .ro-content {padding: 20px}
    
    .register-overlay .ro-content .text-wrap {margin-left: 60px;}
    .register-overlay .ro-content h5 { padding-top: 0 }
    .register-overlay .ro-content .circle { width: 40px; height: 40px; line-height: 45px; font-size:20px}
    
    .register-overlay .ro-warranty {padding: 20px}
    .register-overlay .ro-warranty h5 {font-size: 20px}
    .register-overlay .ro-warranty .shield {margin: -20px -50px -40px 10px}
    
    .register-overlay .ro-footer{ padding: 40px 20px 150px}
}



/* Google Login ******************************************************************************/
#myperm4-login fieldset button.socailButton.Google {
  background: #4285F4;
  padding-left: 50px;
  padding-right: 11px;
  position: relative;
  text-align: center;
}
#myperm4-login fieldset button.socailButton.Google::before {
  background-color: rgb(255, 255, 255);
  background-position-x: center;
  background-position-y: center;
  background-repeat: no-repeat;
  background-image: url("/wp-content/themes/perm4-theme/gfx/logo-google.svg");
  background-size: 18px;
  content: '';
  display: inline-block;
  height: 38px;
  width: 38px;
  vertical-align: middle;
  position: absolute;
  top: 1px;
  left: 1px;
}
/* Google Login ******************************************************************************/