/* Webfonts in use
  OpenSans, Italic = font-style: italic;, Bold = font-weight: 700;
*/
/* FontAwesome:
   Brands: :"Font Awesome 5 Brands";font-style:normal;font-weight:normal;
   Light: :"Font Awesome 5 Pro"; font-style:normal; font-weight:300;
   Reg: font-family:"Font Awesome 5 Pro"; font-style:normal; font-weight:400;
   Bold: font-family:"Font Awesome 5 Pro"; font-style:normal; font-weight:900;
*/

/* General */
* {box-sizing:border-box;}
*:focus {outline: none;}
html {height:100.2%; font-size: 62.5%;}
body {margin:0; padding:0; font-size:15px; font-size:1.5rem; line-height:1.5; font-family:"Helvetica Neue", Helvetica, Arial, sans-serif; background-color:#fff;}
img {border:none;}
p, li, th, td, dt, dd {color:#333333; }
h1,h1 a, 
h2, h2 a, 
h3,h4,h5,h6 {font-family:Verdana, Arial, Helvetica, sans-serif; font-weight:bold; color:#F9542A; margin:0 0 16px 0; 
  font-size: 15px; font-size:1.5rem; line-height: 22px; text-transform: none; margin-bottom: 16px; font-style: normal; }
h1, h1 a { font-size: 17px; line-height: 20px; font-weight: bold;}
h2, h2 a {font-weight: normal; font-weight: bold; margin-bottom:5px;}
a {color:#F9542A; text-decoration:none;}
a:hover::before,
a:hover {color:#959595;}
th, td {vertical-align:top;}
figure {margin:0;}
.news-img-caption,
figcaption {}
blockquote {padding: 10px 20px; margin: 0 0 20px; font-size: 15px; color:#666; border-left: 5px solid #eee; font-family: Georgia, "Times New Roman", Times, serif;}
blockquote p {color:#666;}
img {max-width:100%; height:auto;}
hr {margin:30px 0; height:0; border-style:none none solid none; border-width:1px; border-color:#d6d6d6;}
strong {font-weight:bold;}
label {font-weight: bold; font-size:1.5rem;}
input, button, select, textarea {font-weight: bold; font-size:1.5rem;}
textarea:focus-visible,
input:focus-visible,
select:focus-visible {border:solid 2px #000;}


/* frame, rte and link styles */
.text-center {text-align:center;}
.text-right {text-align:right;}

.frame-space-before-large {margin-top:50px;}
.frame-space-after-large {margin-bottom:50px;}

.link-mail {color:#000;}

.link-button {padding:8px 12px; background-color:rgb(108, 117, 125); color:#fff; border-radius:0.5rem; font-size:1.6rem;}
.link-button:hover {background-color:rgb(90, 98, 104); color:#fff;}

/* header */
#wrapper > header {padding:0; margin:0 0 78px 0; /* background:#E9EDF0 url("/typo3conf/ext/ff_sitepackage_tww/Resources/Public/Images/header-ausschnitt.jpg") center top no-repeat; */ height:290px; }
/* slider */
#headerslider {max-width:2500px; height: 290px; margin:auto; overflow:hidden;}
#headerslider img {width:100%; height:auto; object-fit: cover; object-position: center;}
#mheaderslider {display:none; overflow:hidden;}
#mheaderslider figcaption {position:  absolute; background-color:  #f9542a; color:  white; font-size:  18px;
	line-height:  1.2; padding:  10px 15px; top:  50%; display:  inline-block; width:  auto;}
.slider {visibility: hidden; opacity: 0; transition: opacity 0.6s ease;}

/* Sichtbar, sobald Slick initialisiert */
.slider.slick-initialized {visibility: visible; opacity: 1;}


/* logo */
#logo.section-inner {display:flex; align-items: end; max-width:1530px; margin-left: auto; margin-right:auto; margin-top:-80px; width:100%; padding:0 15px;}
#logo.section-inner a {position: relative; z-index: 2;  display: block; }
#logo.section-inner img {max-width:100%; height:auto; padding:0 0;}
.slick-dots {position: relative; bottom: inherit; text-align: left; padding:0; margin:0 0 8px 0; list-style-type:none; font-size:0;}
.slick-dots li {display:inline-block; margin: 0 3px; font-size:0;}
.slick-dots li button {background-color: #CCEAE7;  height: 10px; width: 10px; margin: 0; padding: 0; border:none; font-size:0; cursor:pointer;}
.slick-dots li.slick-active button {background-color: #F9542A;}
.slick-dots li button:before {font-size: inherit; position: absolute; width: auto; content: inherit; height: auto;}

/* mobile meta */
#mobile-header {display:none; justify-content: space-between; align-items: center; width: 100%; padding:10px 15px 10px 15px;}
#mobile-header a#mhomelink {display:block; max-width: 80px;}
#mobile-header img {display:block; max-width: 100%; height:auto;}
#responsive-menu-button {font-size:24px;}

/* mmenu */
.mm-menu {margin-top:0 !important;}
.mm-menu .secondlvl {display:block !important;}
.mm-menu .mm-listitem__text i {display:none;}

/* side nav */
#sidenav {margin-bottom:45px;}
#sidenav ul {margin:0; padding:0;list-style-type:none;}
#sidenav ul > li {text-align: right; border:solid 1px #333333; margin-bottom:13px;}
#sidenav ul > li.act,
#sidenav ul > li:hover {border: solid 1px #F9542A; background-color: #F9542A;}
#sidenav ul > li > a {display:block; text-transform:uppercase; color:#333333; padding: 5px 15px;}
#sidenav ul > li.act a,
#sidenav ul > li > a:hover {color:#fff;}
#sidenav ul .secondlvl {display:none;}
#sidenav ul > li > a[href*="online-infotage"]::after {display:inline-block; content:"\NEU"; border-radius:10px; color: #fff; background-color: #007bff; 
  line-height:1; font-size:12px; padding: 3px 7px; margin-left:5px; font-weight:bold;}

#sidenav ul ul {padding-left:15px; margin:6px 0;}
#sidenav ul ul > li.act > a {background-color:#ffc095; color:#333;}

#sidenavsub {margin-bottom:0;}
#sidenavsub ul {list-style-type: none; margin:0; padding:0;}
#sidenavsub ul li {text-align: right; line-height: 1.2;}
#sidenavsub ul li a {display:block; color:#333; font-size:1.4rem; margin-bottom:10px; padding:5px 0px 5px 12px;}
#sidenavsub ul li.act a,
#sidenavsub ul li a:hover {color: #F9542A;}
#sidenavsub ul li:last-child a {margin-bottom:0;}

/* content */
#content.section-inner {display:flex; flex-wrap:wrap; margin:auto; max-width:1300px; margin-top:50px; margin-bottom:50px;}

/* left */
#leftcol {width:20%; max-width: 245px; margin-left:40px;}

/* main */
#maincol {padding:0 30px 0 45px; width:60%; max-width: 710px;}
.col-1 #maincol {width: 80%; padding-right: 15px; margin-top:20px; max-width: 985px;}
#maincol .frame-default {margin-bottom:40px;}
#maincol .ce-bodytext h3,
#maincol .text-frame h3 {margin-top:25px; }
#maincol p {margin:0 0 10px;}
#maincol .frame-type-text ol,
#maincol .frame-type-textmedia ol {margin:0 0 15px 0; padding:0 0 0 20px; list-style-position:outside;}
#maincol .frame-type-text ul,
#maincol .frame-type-textmedia ul {margin:0 0 15px 0; padding:0 0 0 24px; list-style-type:none;}
#maincol .frame-type-textmedia ol li,
#maincol .frame-type-text ol li,
#maincol  .frame-type-text ul li,
#maincol  .frame-type-textmedia ul li {margin-bottom:5px; position:relative;}
#maincol .frame-default .text-frame  ul li::before,
#maincol .frame-default .ce-bodytext ul li::before {position:absolute; top:8px; display:inline-block; content:""; margin:0 8px 0 -20px; width:5px; height:5px; background-color:#000; border-radius:100%;}
#maincol .frame-type-header {margin-bottom:25px;}

/* css for one col */
.col-1 #maincol .frame-default {margin-bottom:20px;}
.col-1 #maincol h1 {font-size:3rem; font-weight: normal; line-height:1.3;}
.col-1 #maincol h2 {font-size:2.8rem; font-weight: normal; line-height:1.3;}

/* removes first child because first child is a shortcut an we dont need this one in menu of subpages */
.frame-type-menu_subpages ul {margin-left:15px; margin-bottom:10px; margin-top:0; padding:0;}
.frame-type-menu_subpages ul li {margin-left:12px;}
/* .frame-type-menu_subpages ul li:first-child {display:none;} */

/* content images */
.img-right,
.ce-image,
.ce-textpic img {margin:10px 0;}
#maincol .ce-textpic {overflow:hidden;}
#maincol .ce-intext .ce-gallery {margin-top:6px;}
#maincol .ce-intext .ce-gallery[data-ce-images="1"] {margin-bottom:0;}
#maincol .ce-textpic .ce-border {border:solid 1px #F9542A;}
#maincol .ce-textpic .ce-border img {border:none;}
#maincol .frame-type-textmedia .ce-outer,
#maincol .frame-type-textmedia .ce-inner {position:static; float:none;}
#maincol .frame-type-textmedia .ce-column {float:none;}

.frame-responsive-row .ce-gallery {display:flex; gap:2%;}

/* socialnav */
#socialnav {width:100%; padding:0 15px; margin-top:-20px;}
#socialnav ul {display:flex; width:100%; gap:0 15px; align-items: end; justify-content: end; padding:0; margin:0; list-style-type: none;}
#socialnav ul li {line-height:1;}
#socialnav ul li a {display:block;}

/* rightcol */
#rightcol {width:25%; max-width: 302px;}
#rightcol h1,  
#rightcol h2, 
#rightcol h3, 
#rightcol h3 a {color: #009899;}
#rightcol h2 {font-size:1.7rem; font-size: 17px; line-height: 20px; font-weight: bold; margin-bottom: 10px;}

/* container */
.flex-grid {display:flex; flex-wrap:wrap; justify-content: space-between; gap:2%; margin:30px 0;}
.flex-grid .col-4 {width:32%;}
.flex-grid .frame-layout-1 {height:100%;}
.flex-grid .col-6 {width:49%;}

/* frames */
/* card*/
.frame-layout-1 {border:2px solid #009899; padding:20px;}
.frame-layout-1 figcaption {color:#F9542A;}
.frame-layout-1 .image a {position:relative; color:#F9542A; display:flex; align-items: center; justify-content: center;}
.frame-layout-1 .image a::before { content:"\f144"; font-family:"Font Awesome 5 Pro"; font-style:normal; font-weight:300; position:absolute; font-size:6rem;}
.frame-layout-1 figcaption {margin-top:5px;}
.frame-layout-1 .image img {margin-bottom:0;}
.frame-layout-1 p:last-child {margin-bottom:0;}
.frame-layout-1 .image a:hover {color: #0056b3; text-decoration: underline;}
.frame-layout-1 .link-button {display:block; text-align: center; margin:10px 0;}
.frame-layout-1 h1,
.frame-layout-1 h2,
.frame-layout-1 h3 {hyphens: auto;}

/* powermail */
.tx-powermail {margin-top:20px;}
.tx-powermail form > h3 {display:none;}
.tx-powermail fieldset {padding:0; margin:0; border:none;}
.tx-powermail .flex-container {display:flex; flex-wrap:wrap; justify-content: space-between;}
.tx-powermail .flex-container > legend {display:none;}
.tx-powermail label {display:block; margin-bottom:4px; font-family:OpenSans, sans-serif; font-weight:700; color:#333333;}
/* fields */
.powermail_fieldwrap {margin-bottom:15px;}

.powermail_fieldwrap_type_input,
.powermail_fieldwrap_type_select {width:48%;}
.tx-powermail .layout1,
.powermail_fieldwrap_type_radio,
.powermail_fieldwrap_type_textarea,
.powermail_fieldwrap_type_submit,
.powermail_fieldwrap_type_text {width:100%;}

.powermail_fieldwrap_type_text {margin-top:10px;}

.powermail_fieldwrap input[type="email"],
.powermail_fieldwrap input[type="text"],
.powermail_fieldwrap textarea,
.powermail_fieldwrap select {width:100%;}

.powermail_fieldwrap input[type="email"],
.powermail_fieldwrap input[type="text"],
.powermail_fieldwrap select,
.powermail_fieldwrap textarea {height:40px; padding:0 15px;  color:#333333; border:solid 1px #cbcbcb; font-size:14px; font-size:1.4rem; color:#333333;
  -webkit-box-shadow: inset 0px 0px 5px 0px rgba(0,0,0,0.1);
  -moz-box-shadow: inset 0px 0px 5px 0px rgba(0,0,0,0.1);
  box-shadow: inset 0px 0px 5px 0px rgba(0,0,0,0.1); font-family:OpenSans, sans-serif;}
.powermail_fieldwrap textarea {padding:10px 15px; height:200px; resize: none;}
.powermail_fieldwrap_type_submit input {background-color:#d75c09; color:#fff; padding:10px 14px; font-size:18px; font-size:1.8rem;
  transition: background 0.2s ease; border:none; cursor:pointer;}
.powermail_fieldwrap_type_submit input:hover {background-color:#8d8d8d; color:#fff;}
.powermail_fieldwrap input[type="radio"] {width:15px; height:15px; border:solid 1px #cbcbcb; margin:0; border-radius:100%;}

/* special */
.powermail_fieldwrap_datenschutz > label {display:none;}
.powermail_fieldwrap_datenschutz input[type="checkbox"] {margin-left:0;}
.powermail_fieldwrap_datenschutz .checkbox label {}

/* powermail errors */
#maincol .parsley-errors-list {padding:0; margin:0;}
#maincol .parsley-errors-list li {padding:6px 15px; background-color:#c30000; color:#fff; font-size:14px; font-size:1.4rem; line-height:14px;}

/* forms */
.frame-type-form_formframework .form-group {margin-bottom:15px;}
.frame-type-form_formframework label {color:#333; margin-bottom:4px; display:block;}
.frame-type-form_formframework select,
.frame-type-form_formframework textarea,
.frame-type-form_formframework input[type="email"], 
.frame-type-form_formframework input[type="text"] {width:100%; padding:6px 12px; background-color: #E3E3E3; border-radius:0; height:34px; font-size:1.4rem; color: #555; border: 1px solid #ccc;}
.frame-type-form_formframework textarea {height:170px;}
.frame-type-form_formframework button[type="submit"] {border:solid 1px #f9542a; color:#f9542a; background:none; padding: 6px 12px; font-weight: normal;}
#anmeldungOnlineInfotage-208-singleselect-1 {max-width:100px;}
.frame-type-form_formframework .clearfix {margin:15px 0 25px;}
.frame-type-form_formframework .clearfix h2 {font-size:2rem !important;}

#anmeldungOnlineInfotage-208 > h2 {display:none;}

/* faq */
.tx-jpfaq .jpfaqAll {margin-bottom:10px;}
.jpfaqHideAll {display:none; cursor: pointer;}
.jpfaqShowAll {cursor: pointer;}

.jpfaqList {padding:0; margin:0;}
.tx-jpfaq label, 
.tx-jpfaq .jpfaqHideAll, 
.tx-jpfaq .toggleTriggerContainer, 
.tx-jpfaq #jpfaq-filter-count, 
.jpfaqFinfo {display: none;}
.tx-jpfaq li {list-style: none; margin: 0 0 10px 0; padding: 0;}
.tx-jpfaq li h3 {margin-bottom:3px; cursor: pointer;}
.tx-jpfaq li h3,
.tx-jpfaq li h3.questionUnfolded {
  background: url('/typo3conf/ext/ff_sitepackage_tww/Resources/Public/Images/arrow.png') no-repeat right center;
  padding-left: 0px; padding: 5px 30px 5px 0; background-size: 30px 17px; border-bottom: 1px solid #ccc;}
.tx-jpfaq li h3.questionUnfolded {background: url(/typo3conf/ext/ff_sitepackage_tww/Resources/Public/Images/arrowup.png) no-repeat right center; background-size: 30px 17px;}

/* seminars */
.tx-tww > h2 { font-size:24px; line-height:28px; font-weight:normal; margin-bottom:5px;}
.tx-tww > ul { padding-left:0; margin-left:0; }
.tx-tww > ul li { padding-left:0; margin-left:0; }
.location { list-style:none; margin-bottom:20px; }
.location h2 { background-image:url("/fileadmin/css/space_TR.png"); background-position:14.5em top; background-repeat:no-repeat; font-weight:normal; font-size:1.5em; line-height:1.5em; margin-bottom:0.25em; width:100%; padding-left:0.25em; color:white; }
.branch h2 { background-color:#f9542a; border-bottom:1px solid #f9542a; }
.branch h3 { margin:16px 0 6px 0; }
.location1 h2 { background-color:#fd7318; border-bottom:1px solid #fd7318; } /* Wolfsburg */
.location2 h2 { background-color:#0094de; border-bottom:1px solid #0094de; } /* Wolfenbüttel */
.location3 h2 { background-color:#6eaa24; border-bottom:1px solid #6eaa24; } /* Salzgitter */
.location4 h2 { background-color:#e30917; border-bottom:1px solid #e30917; } /* Suderburg */
.location ul { list-style-type:disc; }
ul.seminars { list-style-type:none; margin-left:0; padding:0;}

.tx-tww fieldset { margin:20px 0; border:solid 1px #333333; padding:5px 10px; }
.tx-tww legend { margin:10px 0; border:none!important; width:auto; color:#F9542A; word-wrap:break-word; -webkit-hyphens:auto; -moz-hyphens:auto; -ms-hyphens:auto; hyphens:auto; max-width:100%; }
.tx-tww label { width:100%; float:left; clear:both; margin-bottom:5px; position:relative; }
.tx-tww label input, .tx-tww label select { position:absolute; left:50%; width:48%; }
.tx-tww label input[type=checkbox] { float:left; position:relative; left:0; width:auto; margin-right:10px; }
.tx-tww .agb div { max-height:300px; overflow-y:scroll; margin-bottom:10px; }
.tx-tww .agb > label, .tx-tww .course > label { border-top:1px solid #333333; padding-top:10px; }
.tx-tww fieldset.submit { border:none; padding:0; }
.tx-tww input[type=submit], a.button.right { background-color:white; border:1px solid #f9542a; border-radius:0; color:#f9542a; padding:5px 10px; }
.tx-tww .typo3-messages { display:none; }
.tx-tww li.alert, .tx-tww li.alert li { list-style:none; padding-left:10px; }
.eventdates {padding:0; margin-left:15px;}

.hideContent label {display:none;}

/* news */
.news-list-view .article {padding-bottom: 15px; margin-bottom: 15px;}
.news-list-view p {margin-bottom:0; font-size:15px; font-size:1.5rem;}
.news-list-view .more {display:none;}
.news-list-view h2,
.news-list-view h2 a {font-weight: normal;}
#maincol .news-list-view h2,
#maincol .news-list-view h2 a {margin-bottom:5px;}
#contenthead .news-date {display:block; margin-bottom:10px; color:rgba(224,224,224,0.6); font-size:16px; font-size:1.6rem; line-height:20px;}
#content .news-img-caption {margin-bottom:0;}

.news-single .header h3 {margin:0 0 10px;}
.news-single .footer {display:none;}
.news-single .teaser-text p {color:#888;}
.news-single .news-img-wrap {float:right; margin-left:25px; max-width:282px;}
.news-single .mediaelement-image,
.news-single .mediaelement-image a {line-height:inherit; font-size:0;}
.news-single .frame-default {overflow: hidden;}
.news-backlink-wrap {margin-top:30px; padding-top:20px; border-top:solid 1px #d6d6d6;}
.news-backlink-wrap a::before {margin-right:5px; content:"\f104"; font-family:"Font Awesome 5 Pro";}


/* footer */
footer {padding:44px 15px 0; text-align: center; color: #fff; background-color: #009899; border: none; min-height: 115px;}
footer .section-inner {max-width: 1300px; margin:0 auto; padding: 20px 0;}
footer a,
footer p {color:#fff;}
footer a:hover {color:#fff;}

/* slick slider */
/* Arrows */
.slick-prev,
.slick-next {font-size:0; line-height:0; position:absolute; top:50%; display:block; width:20px; height:20px; padding:0;
     color: transparent; border: none; outline: none; background: transparent;
    -webkit-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    transform: translate(0, -50%);}
.slick-prev:hover,
.slick-prev:focus,
.slick-next:hover,
.slick-next:focus {color:transparent; outline:none; background:transparent;}
.slick-prev:hover:before,
.slick-prev:focus:before,
.slick-next:hover:before,
.slick-next:focus:before {opacity: 1;}
.slick-prev.slick-disabled:before,
.slick-next.slick-disabled:before{opacity: .25;}

.slick-prev:before,
.slick-next:before {font-family:"Font Awesome 5 Pro"; font-style:normal; font-weight:900; font-size: 20px; line-height: 1; opacity: .75; color: white;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
.slick-prev {left: -25px;}
[dir='rtl'] .slick-prev {right: -25px; left: auto;}
.slick-prev:before {content:'\f137';}
[dir='rtl'] .slick-prev:before{content:'\f138';}
.slick-next {right:-25px;}
[dir='rtl'] .slick-next {right:auto; left: -25px;}
.slick-next:before {content:'\f138';}
[dir='rtl'] .slick-next:before {content: '\f137';}

figure.video {display:block;}
.video-embed {position: relative; padding-bottom:56.25%; padding-top:30px; height:0; overflow:hidden;}
.video-embed iframe,
.video-embed object,
.video-embed embed {position:absolute; top:0; left:0; width:100%; height:100%;}

.powered-by {display:block;}

/* mobile optimize */

@media only screen and (max-width:1680px) {
  #logo.section-inner {max-width: 1300px; margin-left:auto; margin-right:auto; padding-left:40px;}
  #logo.section-inner #dots {order:2; margin-left:15px;}
   #leftcol {padding-left:40px; margin-left:0;}
  #rightcol {padding-right:15px;}
  #homelink {order:1;}
}

@media only screen and (max-width:1280px) {
  #leftcol {padding-left:15px; margin-left:0;}
  #logo.section-inner {padding-left:15px;}
  #maincol {width:55%;}

}

@media only screen and (max-width:1024px) {
  div#wrapper > header {display:flex; flex-wrap: wrap; margin-bottom:20px; height:auto; background-image:none; background-color:#fff;}
  #headerslider {display:none;}
  #mheaderslider {display:block; width:100%;}
  .slick-slide img {width:100%; height:auto;}
  #logo.section-inner {display:none;}
  #mobile-header {display:flex; flex-wrap:wrap;}
  #content.section-inner {margin-top:30px;}
  #content {padding:0 15px; justify-content: space-between; gap:5%;}
  #socialnav {padding:0; margin:-10px 0 15px 0;}
  #leftcol {display:none;}
  #maincol {padding:0; width:60%; max-width: none;}
  .col-1 #maincol {width:100%; padding-right:0;}
  #rightcol {padding-right:0; width:35%; max-width: none;}
  ul.secondlvl {display:block;}
}

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

}

@media only screen and (max-width:800px) {
  #maincol {width:100%;}
  #rightcol {width:100%;}
  footer {padding:20px 15px; min-height:auto;}
  .tx-jpfaq li h3 {font-weight: normal;}
  .branch h2,
  .location h2 {font-size:1.2em;}

.flex-grid .col-4 {width:49%; margin-bottom:15px;}
}

@media only screen and (max-width:640px) {
  h1, h2, h3, h4 {hyphens: auto;}
  #mheaderslider img {min-height:150px; width:auto; object-fit: cover; object-position: right;}
  #mheaderslider figcaption {	font-size:  14px; line-height:  1.2; padding:  8px 10px; top:  50%; display:  inline-block; width:  auto;}

  .frame-responsive-row .ce-gallery {flex-wrap:wrap;}
  .frame-responsive-row .ce-gallery .ce-row {width:49%;}
}

@media only screen and (max-width:560px) {
  .flex-grid .col-6,
  .flex-grid .col-4 {width:100%;}
  .flex-grid .col-6 {margin-bottom:15px;}
}  

@media only screen and (max-width:480px) {
  #mheaderslider figcaption {position:static; width: 100%; display: block; margin-top: -14px; z-index: 10; position: relative;}
  .tx-tww > h2 {font-size:20px;}
}

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

}
