/******************************************
		CSS für Avantalion 2015
******************************************/

::-moz-selection { /* Code for Firefox */
    color: #ffffff;
    background: #003d6a;
}

::selection {
    color: #ffffff;
    background: #003d6a;
}


.row {padding:0 0.938em;}

.row .row {
    margin:0;
    padding:0;
    max-width: none;
    width: auto;
}

.progress .meter {
    background: #008CBA;
    display: block;
    height: 30px!important;
}

.progress {
    background-color: #F6F6F6;
    border: 1px solid white;
    height: 300px!important;
    margin-bottom: 0.625rem;
    padding: 0.125rem;
}

.highlight{overflow: auto;}

.fixed{background-color:white!important;z-index:9999!important;}
#docs-navbar{margin-top:50px;}

/*//////////////// Headings ///////////////////////////*/

h1, h2, h3, h4, h5, h6 {
    color: #666666;
    font-family: 'Open Sans', sans-serif;
    font-style: normal;
    font-weight: normal;
    line-height: 1.4;
    margin-bottom: 0.5em;
    margin-top: 1.3em;
}

h1,h2,h3,h4,h5,h6{line-height:1.35;color:#666666}

h1{font-size:40px /*2.5rem*/;font-weight:300;margin-top: 1.563rem;margin-bottom: 2.813rem;}
h2{font-size:32px;font-weight:400;}
h3{font-size:25px;font-weight:600;margin:30px 0 25px 0;}
h4{font-size:18px;font-weight:600}
h5{font-size:16px;font-weight:600}

h1, h2, h3, h4, h5, h6 {font-weight: lighter; }

#p11 .csc-default.grey .csc-textpic-text h3{margin:15px 0 10px 0;}


/* ///////////// Top-bar / Menue  ////////////////////////// */
img.logo {  width: 50%; position: relative; top: 24px;}

.top-bar {background: #ffffff; z-index: 100;}
.top-bar.row {background: #ffffff; max-width: 40.000em;}

.top-bar.row {
    background: #ffffff none repeat scroll 0 0;
    /* max-width: 40em; */
    min-height: 4em;
}

.top-bar-section ul li > a {color:#666666!important;font-size: 1.0em!important;}
.top-bar .toggle-top.top-bar.row {
    background: #ffffff none repeat scroll 0 0;
    max-width: 40em;
    min-height: 5em;
}

#menu li:first-child {
	margin-top: 0px;
}

.top-bar.menu-icon a {color: #666666!important;}
.top-bar-section li:not(.has-form) a:not(.button) {background:#ffffff!important;}

.top-bar .toggle-topbar.menu-icon a span::after {box-shadow: 0 0 0 1px #666666, 0 7px 0 1px #666666, 0 14px 0 1px #666666!important;}

.top-bar-section ul li.aktiv > a {color: #003d6a!important;}
.top-bar-section ul li ul li.aktiv > a {color:#ffffff;background:#003d6a;}
.top-bar-section ul li ul li.aktiv:not(.has-form) a:not(.button) {background: #003d6a!important;color:#ffffff!important;}


.top-bar-section ul li {background: transparent  }

/* ---- Title-Area ----- */
.suche {display: none;}
.top-bar .title-area { float: right!important; }
.top-bar .title-area .name h1{margin:0!important;padding:0;}
.top-bar.expanded .title-area {background: #FFFFFF!important;}
.top-bar-section {
	top: 0px;
}
/*
.top-bar-section ul {
	height: 315px;
}*/
/*
.top-bar-section .dropdown {
	top: 60px;
}*/

/* body id p1*/
#p1 h1 a {padding-left:0;padding-right:0}

.flaggen {float: left; position: relative;  top: 37px; left: -20px;margin: 0px 24px;}

@media only screen and (min-width: 40.0625em){
    .top-bar.row {
        min-width:40em;
    }
}

/* HEAD MENUE */
nav ul {margin-left: 0; max-width: 40em;}
nav.top-bar ul.title-area {margin: 0;padding:0;max-width: 40%;z-index: 100;}

/* LANAGUAGE MENUE */
.top-bar ul.langmenu li {float: left;}
.top-bar ul.langmenu a {color:#003d6a;}
.top-bar ul.langmenu li:first-child {margin: 0 5px 0 0;}

ul.langmenu li:first-child {margin-right: 10px;}

/* MAINMENUE */
ul#menu {width:100%}
ul#menu li a::after {  display: inline-block; width:24px; content: "/";  padding-left: 15px;margin-right: -15px;color: #666666;}

ul#menu li:last-child a::after{
    content: " ";
    padding-left: 15px;
    margin-right: -15px;
}
ul#menu li ul li a::after {
    content: " ";
    padding-left: 15px;
    margin-right: -15px;
    color: #666666;
}

ul#menu li:last-child a {
    padding-right: 0!important;
}


ul.dropdown.submenu li {
    height: auto;
    line-height: 40px!important;
    border-top:1px solid #e5e5e5;
    width: 308px;
}

ul.submenu {display: none!important;}

.submenu li:hover {background:#003d6a;}
.submenu li:hover a {color:#ffffff!important;background:#003d6a!important;}

.top-bar-section .submenu li:hover:not(.has-form) a:hover:not(.button) {
    background: /*#243e6f*/#003d6a!important;
}

#menu > li > ul > li a {line-height:40px!important;}

li:hover ul.submenu {display: block!important;}

ul.submenu {position: absolute;  top: 98px;  width: 391px;  z-index: 4;  display: block;}
ul.submenu li {float:none!important;}

li.trenner {
    background: #f0f3f8!important;
    padding: 0 0.89rem!important;
    height:40px;
    color:#003d6a;
}

@media only screen and (min-width: 40.0625em){

    img.logo {
     width: 60%;
    }
    .sticky {
        height: 100px;
        border-bottom: 1px solid #cccccc;
    }

    .top-bar.row {
        background: #ffffff none repeat scroll 0 0;
        max-width: initial;
        min-height: initial;
    }

    .top-bar-section li:not(.has-form) a:not(.button) {
        background: #333;
        line-height: 6.188em!important;}


    .top-bar-section li:not(.has-form) a:not(.button) {
        background: #333;
        line-height: 2.8125rem;
        padding: 0 0.69em!important;
    }

    ul#menu {width:100%; }
}

.top-bar .toggle-topbar {
	left: 0px !important;
	right: auto;
}

.top-bar .toggle-topbar a {
    color: #fff;
    display: block;
    font-size: 0.8125rem;
    font-weight: bold;
    height: 2.8125rem;
    line-height: 2.8125rem;
    padding: 0 0.9375rem;
    position: relative;
    text-transform: uppercase
}



@media only screen and (max-width: 40.0625em){
.top-bar-section .dropdown {
    top: 60px;
}
    img.logo {
       float: right;
       /*
	   position: relative;
       left: 10%;
       */
	   top: 4px;
       display:block;
       margin: 0 auto;
     width: 45%;
    }

    .flaggen {
        position: relative;
        float:none;
        top: 12px;
        left: 0;
        margin:0;
        padding:0;
    }

    .top-bar .name {
    height: 4.8125rem;
    margin:0;
        padding:0;
  }

    nav.top-bar ul.title-area li.name {
    margin: 0;
    padding:0;
    padding:0.625em 0 0.625em 0.625em;
    float:none;
    }

    nav.top-bar ul.title-area li.name a {
     margin: 0;
     padding:0;
     float:none;
     display:block;
     margin:0 auto;
     }

    nav.top-bar ul.title-area li.name a span {margin: 0 ;padding:0;}
    nav.top-bar ul.title-area ul.langmenu {font-size:0.85em;margin: 2px 0 0 66px;padding:0;}
    nav.top-bar ul.title-area ul.langmenu a {color:#003d6a;}
    nav.top-bar ul.title-area ul.langmenu li:first-child {margin-right: 5px;}

    #menu li:first-child a {/*.title .back .js-generated*/ padding-left: 0.9375rem!important;color:#000;}
  ul#menu li a::after {content: " ";}
}

@media only screen and (min-width: 40.0625em) {
	.top-bar-section {
		top: 0px;
	}
	
	.top-bar .toggle-topbar.menu-icon {
		left: -111px !important;
	}
}

@media only screen and (min-width: 64.0625em) {

    .row {
        padding:0 0.938em;
        max-width:60.625em;
    }
	

    img.logo {width: 55%;float: right;  position: relative;  top: 27.5px;    right: -10px;}
    .top-bar {background:white!important;}
  .top-bar.row {  max-width: 940px;padding: 0 15px 0 0;}

    .top-bar-section ul li > a {color:#666666!important;  }
    .top-bar .toggle-topbar.menu-icon a {color: #666666!important;}
    .top-bar-section li:not(.has-form) a:not(.button) {background:#ffffff!important;}

    .top-bar .toggle-topbar.menu-icon a span::after {
        box-shadow: 0 0 0 1px #666666, 0 7px 0 1px #666666, 0 14px 0 1px #666666!important;
    }

    .top-bar .title-area .name h1{margin:0!important;padding:0;line-height: 1}

    .top-bar.expanded .title-area {
        background: #ffffff!important;
    }

    .top-bar .title-area {
        float: right!important;
    }  

    /* ---- Title-area ----- */
    .suche {display: none;}

    .name h1{margin:0!important;}

  /* body id p1*/
  #p1 h1 a {padding-left:0;padding-right:0}

    .top-bar ul.langmenu li {
        float: left;
    }

    .top-bar ul.langmenu a {color:#003d6a;}
    .top-bar ul.langmenu li:first-child {
        margin-right: 10px;
    }

    .flaggen {
        float: left;
        position: relative;
        top: 37px;
        /*left: 105px;*/
		left: -20px;
    }

    ul#menu li a::after {
        content: "/";
        padding-left: 12px;
        margin-right: -12px;
        color: #666666;
    }

    ul#menu li:last-child a::after{
        content: " ";
        padding-left: 15px;
        margin-right: -15px;
    }
    ul#menu li ul li a::after {
        content: " ";
        padding-left: 15px;
        margin-right: -15px;
        color: #666666;
    }

    #menu li:first-child a {
        padding-left: 0!important;
    }

    ul.dropdown.submenu li {
        height: auto;
        line-height: 40px!important;
        border-top:1px solid #e5e5e5;
        width: 308px;
    }

    .submenu li:hover {background:#003d6a;}
    .submenu li:hover a {color:#ffffff!important;background:#003d6a!important;}
    #menu > li > ul > li a {line-height:40px!important;}
    
    ul.submenu {
        display: none!important;
    }
    li:hover ul.submenu {
        display: block!important;
    }

    ul.submenu li {float:none!important;}
    ul.submenu {
        position: absolute;
        top: 98px;
        width: 391px;
        z-index: 4;
        display: block;
    }

    .fixed{
        background-color:white!important;
        z-index:100!important;
        /* vorher z-index:9999!important ?????*/
    }


    li.trenner {
        background: #f0f3f8!important;
        padding: 0 0.89rem!important;
        height:40px;
        color:#003d6a;
    }

    nav.top-bar ul.title-area {
    margin-left: 0;
    max-width: 445px;
  }

}

/*/////////////// BRANCHEN BOX LANG //////////////////////////////*/

/* Branche Startseite lang */

#p1 .pharme {display:none}

#p1 .maschinen {
	clear:left;
    background-image:url(../img/industrie_balken.jpg);
    background-repeat:no-repeat;
    height: 134px;
    width:100%;
    max-width: 940px;
    padding: 0px 0 0 20px!important;
    margin: 0px 0 0 0;
    background-position:0
}

#p1 .maschinen:hover {
	clear:left;
    background-image:url(../img/industrie_balken_over.jpg);
    background-repeat:no-repeat;
    height: 134px;
    width:100%;
    max-width: 940px;
    padding: 0px 0 0 20px!important;
    margin: 0px 0 0 0;
    background-position:0
}

#p1 .auto {
	clear:left;
    background-image:url(../img/auto_balken_1.jpg);
    background-repeat:no-repeat;
    height: 134px;
    width:100%;
    max-width: 940px;
    padding: 0px 0 0 20px!important;
    margin: 0 0 20px 0;
    background-position:0
}

#p1 .auto:hover {
	clear:left;
    background-image:url(../img/auto_balken_over.jpg);
    background-repeat:no-repeat;
    height: 134px;
    width:100%;
    max-width: 940px;
    padding: 0px 0 0 20px!important;
    background-position:0
}

#p1 .maschinen p, #p1 .maschinen h2, #p1 .auto p, #p1 .auto h2 {color:#003d6a; text-align:left;}






.grey.branchenbox h1 {padding-left: 0.93rem;}
.auto{background-image:url(../img/automotive.png)}
.auto:hover, .maschinen:hover, .pharme:hover {background-color:#003d6a;}
.auto a, .maschinen a, .pharme a {  display: block;  width: 293px; height: 293px;}
.auto {background-position: 0px -507px;}
.maschinen{background-position:-338px -507px;}
.pharme{background-position:-677px -507px;}
.auto:hover{background-position:0px top;}
.maschinen:hover{background-position:-339px top;}
.pharme:hover{background-position:-677px top;}

.auto:hover h2, .auto:hover p, .maschinen:hover h2, .maschinen:hover p, .pharme:hover h2, .pharme:hover p {
color:white!important;
-webkit-transition: 1.3s;
  -moz-transition: 1.3s;
  -ms-transition: 1.3s;
  -o-transition: 1.3s;
  transition: 1.3s;
}

.auto h2, .auto p, .maschinen h2, .maschinen p, .pharme h2, .pharme p{color:#003d6a;}
.auto, .maschinen, .pharme {
background-image:url(../img/branchen.png);
background-repeat:no-repeat;
    height: 293px;
    max-width: 293px;
    padding: 0!important;
    margin-right: 20px;
}

.kontakt {border-top: 3px solid #f3f3f3; padding-top: 20px;}

.row.referenzen h1 {padding-left:0.96rem}

/*/////////////// ANSPRECHPARTNER //////////////////////////////*/

.heading {text-align: center; margin: 1em auto; font-size: 2.25em;text-decoration: underline;}
.container {width: 1200px;  margin: 0 auto;  padding: 0 15px;}
.col-1-4{   width: 25%;  float: left;  padding: 20px 0;}


.img-container{
    border: 1px solid #cccccc;
    position: relative;
    overflow: hidden;
    max-width:200px;
}

.img-container a{color: #3dc5f7;font-size:1rem}
.img-container p{margin-bottom: 10px;}

#p10 .img-container,
#p11 .img-container{border: 1px solid #cccccc;}
#p10 .img-container a,
#p11 .img-container a{color: #3dc5f7;}
#p10 .img-container p,
#p11 .img-container p{margin-bottom: 10px;}

#p10 #container > h2{/* margin-left: 32px; */}
#p11 #container > h2{/* margin-left: 10px; */}

#p11 #container > h2{padding-left: 0}

.ansprechpartner div.columns  {
    position: relative;
}

#p10 .ansprechpartner .large-3.columns {padding-left:0;padding-top:0.9375rem;}

.img-caption {
    width: 100%;
    height: 100%;
    padding-top: 3em;
    background: #A8A8A8;
    background: rgba(0, 61, 106, 0.8);
    color: #fff;
    text-align: center;
    font-size: 1.2em;
}
.img-caption a {    cursor: pointer;
}

.img-container img {
    display: block;
    position: relative;
}

.img-container li a {
    overflow: hidden;
}
.img-container div.img-caption {
    position: absolute;
    background: rgba(0, 61, 106, 0.8);
    width: 100%;
    height: 100%;
    max-width:200px;
}

.img-container div.img-caption a {
    word-break:break-word;
   max-width: 180px!important;
  margin:0 auto;
    display: block;
    /*padding-left: 10px;
    padding-right: 8px;*/
}


.img-container div.img-caption a,
.img-container div.img-caption p {
    position:relative;
}

/*////////////////// TEAM - MENSCHEN FCE //////////////////////////*/

.demo h3{color:#ffffff!important;}
div#container h3 {color: #ffffff !important; }
.demo li {list-style-type: none;display: inline-block;}
.demo li img {margin: 5px;}

.teamcontainer ul {margin:0;}
.teamcontainer li {list-style-type: none;display: inline-block;}
.teamcontainer li img {margin: 5px;}

.teamcontainer li.large-3.small-5 {margin: 0 5px 20px 0;padding: 0;}

/******* TeamHover ********/

.sliphover-overlay h3{color: #ffffff;}


@media only screen and (min-width: 64.0625em){
    .demo .large-3 {
        width: 24%;
    }
}



/*///////////// Bausteine Teaser BOX FCEs  /////////////////////*/
.teaser-box-bausteine .large-4 {
    height: 293px;
    max-width: 293px;
    background:#f2f2f2;
    margin-right: 20px;
    margin-left: 0;
    margin-bottom:10px;
    margin-top:10px;
    padding-top: 20px;
    padding-left: 20px;
}

.grey .teaser-box-bausteine .large-4 {
    background:#ffffff;
}

.row.teaser-box-bausteine h4 {
    margin-top: 0.2em;
	line-height: 2rem;
}


.teaser-box-bausteine h3{
    position: relative;
    z-index: 4;
    line-height:30px;
    font-size:30px;
    font-weight: 700;
}

.teaser-box-bausteine div.info-text {
    position: relative;
    z-index: 4;
}
.teaser-box-bausteine div.info-text ul li,.teaser-box-bausteine .info-text ol li {
    margin-bottom:0;
}


.teaser-box-bausteine .large-4 .info-text {display:none;}
.touch .teaser-box-bausteine .large-4.activ .info-text,
.no-touch .teaser-box-bausteine .large-4:hover .info-text {
    color:#fff;
    display:block;
    color:white!important;
    -webkit-transition: 1.3s;
    -moz-transition: 1.3s;
    -ms-transition: 1.3s;
    -o-transition: 1.3s;
    transition: 1.3s;
}

.no-touch .teaser-box-bausteine .large-4:hover h4 {display:none;}
.no-touch .teaser-box-bausteine .large-4:hover,
.teaser-box-bausteine .large-4.activ {
    background:#003d6a;/*cursor:help;*/
    -webkit-transition: .3s;
    -moz-transition: .3s;
    -ms-transition: .3s;
    -o-transition: .3s;
    transition: .3s;

}
.row.teaser-box-bausteine .activ a,.row.teaser-box-bausteine .activ p,
.no-touch .row.teaser-box-bausteine:hover a, 
.no-touch .row.teaser-box-bausteine:hover p {color:#ffffff!important;}
.row.teaser-box-bausteine a {
    display: block;
    width: 100%;
    height: 100%;
    position: relative;
    z-index: 4;
}


/*///////////// Leistungen - Kompetenzen BOX FCEs  /////////////////////*/
.leistungen h2{
    position: relative;
    z-index: 4;
    line-height:30px;
    font-size:30px;
    font-weight: 700;
}
.row.leistungen {
    margin-bottom: 65px;
}

.leistungen p {
    position: relative;color: #666666;
    z-index: 4;
}

.leistungen .large-4:hover, .leistungen .large-4:hover h2, .leistungen .large-4:hover p{/*background:#003d6a;*/ color:white!important;}

/*.row.leistungen:hover a, .row.leistungen:hover p {color:#ffffff!important;}*/
.row.leistungen a {
    color: #666666!important;
    display: block;
    width: 100%;
    height: 100%;
    position: relative;
    z-index: 4;
}
/*
.leistungen .large-4 {height: 293px;
    max-width: 293px;background:#f2f2f2;
    margin-right: 20px;
    margin-left: 20px;margin-bottom:20px;margin-top:20px;
    padding-top: 20px;
    padding-left: 20px;
}*/

.leistungen .large-4 {
    height: 293px;
    max-width: 293px;
    background: #f2f2f2;
    margin-right: 30px;
    /* margin-left: 15px; */
    /* margin-bottom: 20px; */
  margin-bottom: 30px;
    padding-top: 20px;
    /* padding-left: 20px; */
}
.row.leistungen .large-4:nth-child(3n){
    margin-right: 0px;
}

/*----- FCE Background Tangram ------*/
.projektmanage { background-image: url(../img/kompetenzen/projektmanagement.jpg)!important;}
.prozessmanage { background-image: url(../img/kompetenzen/prozessmanagement.jpg)!important;}
.requirement { background-image: url(../img/kompetenzen/requirementengineering.jpg)!important;}
.itmanage { background-image: url(../img/kompetenzen/itmanagement.jpg)!important;}
.testmanage { background-image: url(../img/kompetenzen/testmanagement.jpg)!important;}


.referenzen {
    margin-bottom: 90px;
}
  
.row.ansprechpartner {
    margin-bottom: 35px!important;
}


footer.row a {
    color: white!important;
}

/*************************
Skillbar
*************************/  

.Count:after{ content:"%" }
li.trenner {
    text-transform: uppercase;
}
.skillbar {
  position:relative;
  display:block;
  margin-bottom:5.8px;
  width:100%;
  background:#f3f3f3;
  height:24px;
  border-radius:3px;
  -moz-border-radius:3px;
  -webkit-border-radius:3px;
  -webkit-transition:0.4s linear;
  -moz-transition:0.4s linear;
  -ms-transition:0.4s linear;
  -o-transition:0.4s linear;
  transition:0.4s linear;
  -webkit-transition-property:width, background-color;
  -moz-transition-property:width, background-color;
  -ms-transition-property:width, background-color;
  -o-transition-property:width, background-color;
  transition-property:width, background-color;
}

.skillbar-title {
  position:absolute;
  top:0;
  left:0;
  /*width:295px;*/
  width: 50%;
  font-weight:bold;
  font-size:13px;
  color:#cccccc;
  height: 24px;
  /*background:#ffffff;*/
}

.skillbar-title span {
  display:block;
  background:rgba(255, 255, 255, 0.7);
  padding:0 20px;
  height:24px;
  line-height:24px;
}

.skillbar-bar {
  height:24px;
  width:0px;

}

.skill-bar-percent {
  position:absolute;
  right:10px;
  top:0;
  font-size:11px;
  height:24px;
  line-height:24px;
  color:#ffffff;
  color:rgba(0, 0, 0, 0.4);
}
a#lightwindow_title_bar_close_link {
    color: white!important;
}
.skillbar-title span p {
    margin: 0;
    float: right;
	color:#333333;
    font-family: 'Open Sans', sans-serif;
    font-weight: 600;
	font-size: 0.8em;
	line-height: 2.3em;
}

@-webkit-keyframes progress-bar {
0% { width: 0; }
}
@-moz-keyframes progress-bar {
0% { width: 0; }
}
@keyframes progress-bar {
0% { width: 0; }
}

.skillbar >.skillbar-bar {
-webkit-animation: progress-bar 4s linear;
-moz-animation: progress-bar 4s linear;
animation: progress-bar 4s linear;
} 
/*************************
Skillbar Ende
*************************/  

.large-12.lightwindow {
    height: 305px;
}
.tangram:empty {
    width: 0%;
}
.skills {
    /*height: 293px;
    width: 590px;*/
	width: 100%;
    display: block;
	float:left;
}

div#slider1_container img {
    border: 1px solid #cccccc;

}

div#slider1_container img:hover {
  cursor:initial;
}

#p1 .slider.hide-for-small {
    display: block!important;
    max-width: 100%!important;
}

.leistungen .large-4:hover::after{ background-position:48px;}

.leistungen .large-4::after {
    content: " ";
    /* background-image: url(../img/pfeil.png); */
    height: 293px;
    width: 293px;
    position: absolute;
    display: block;
    bottom: 0px;
    left: 0px;
    float: left;
    z-index: 2;
}
div#auto {
    height: 140px;
    background-color: #808080;
}
.kontakt p {
    color: #003d6a;
}

/*/////////// MENSCHEN FCE FANCYBOX //////*/

.mitarbeitername a {
    font-weight: 700;
    color: #0099ff;
    text-decoration: none;
	word-wrap:break-word;
}
.mitarbeitername  h3, .mitarbeitername p {color: #ffffff !important;}
.mitarbeitername {
    float: left;
	width: 100%;
	max-width: 293px;
	padding: 26px;
    height: 293px;
    display: block;
    background-color: #003d6a;}

.tangram {
    width: 33%;
    float: left;
    height: 33%;
    display: none;
}


/*// NO PICTURE POTRAIT CASUAL //*/

.no-picture .tangram {
    width: 50%;
    float:left;
    height: 100%;
    display: block
}


.mitarbeitername {}

.casual	{    
	float: left;
	/*clear: both;*/
	width: 100%;
	max-width: 293px;
}
  
.portrait {
	display: none;
    float: left;
}

.large-6.columns.blue {
    background-color: #003d6a;
    min-height: 9.375em;
    color: #ffffff;
	margin-bottom: 35px;
}


/*////////////////// Unternehmen Management / Vorstand Profilboxen /////////////////////*/
.aufsichtsrat h3,
.management h3, .ehemaligeraufsichtsrat h3 {
    font-size: 33px;
    font-weight: 700;
  color: #ffffff;
  margin:0;
  margin-bottom:25px;
}
.aufsichtsrat .large-3.columns ,
.management .large-3.columns, .ehemaligeraufsichtsrat .large-3.columns {
  /* padding-left: 29px;*/
   padding-right:0!important;
   margin-bottom: 29px;
}

#managementajax { padding: 45px;/* margin-bottom:35px;*/}
#aufsichtsratajax {padding: 45px;/* margin-bottom:35px;*/}
#ehemaligeraufsichtsratajax {padding: 45px; margin-bottom:35px;}

#aufsichtsratajax.large-6.columns.blue {
    background-color: #003d6a;
    min-height: 9.375em;
    color: #ffffff;
}

#ehemaligeraufsichtsratajax.large-6.columns.blue {
    background-color: #003d6a;
    min-height: 9.375em;
    color: #ffffff;
}

.row.leistungen .large-12 .large-4 {
	margin-left: 0px;
	margin-top: 0px;
	margin-right: 30px;
	margin-bottom: 30px;
}


/*##--------  Unternehmensgesichte ---------*/
.large-12.unternehmengeschichte strong{font-size:24px;}
.unternehmengeschichte .large-3{padding-left:0!important;}
.large-12.unternehmengeschichte {margin-bottom: 60px;}
.large-12.unternehmengeschichte h3 {
    font-size: 72px;
  color:#003d6a;
  line-height: 72px;
  margin-bottom: 0px;
    font-weight: 200;
}

#p4 .content .row .unternehmengeschichte {
    max-width: 940px;
    padding-left: 15px;
}


/*##--------  Management / Vorstand Boxen ---------
@media only screen and (min-width: 64.0625em){
.management .large-3 {
    width: 24%;
}
}
*/
.management .profil img ,.aufsichtsrat .profil img, .ehemaligeraufsichtsrat .profil img  {
    border: 1px solid #cccccc;
}

/* data container profil hidden */
.offscreen {position: absolute;  clip: rect(1px 1px 1px 1px);clip: rect(1px, 1px, 1px, 1px);  padding: 0;  border: 0;  height: 1px;  width: 1px;  overflow: hidden;}


/* Hover Effect jQuery plugin $.HoverDir */
.profil {position: relative;}
.profil div.thumb {position: relative;}
.profil a,.profil a img {  display: block;  position: relative;}
.profil a {overflow: hidden;}
.profil a div {position: absolute; background: #333; background: rgba(0,61,106,0.8);  width: 100%;  height: 100%;
    max-width:200px/*12.500em*/;
}

.profil a div span {
    position:relative;
    display: block;
    padding: 70px 0;
    margin: 0 20px 20px 20px;
    font-weight: normal;
    color: rgba(255,255,255,0.9);
    text-align: center;
}

#maschinenbaubreit h2,#maschinenbaubreit p,
#pharmabreit h2,#pharmabreit p,
#autobreit h2,#autobreit p{color:#003d6a; text-align:left;}
#autobreit:hover{background-image:url(../img/auto_balken_over.jpg);}
#maschinenbaubreit:hover{background-image:url(../img/maschinenbau_balken_over.jpg);}
#pharmabreit:hover{background-image:url(../img/pharma_balken_over.jpg);}
#pharmabreit:hover p, #pharmabreit:hover h2{color:white;}
#maschinenbaubreit:hover p, #maschinenbaubreit:hover h2 {color: #ffffff;}
#autobreit:hover p, #autobreit:hover h2 {color:white;}
#autobreit {background-image:url(../img/auto_balken_1.jpg);height:134px;max-width:940px;margin-bottom:30px;}
#maschinenbaubreit {background-image:url(../img/maschinenbau_balken_1.jpg);height:134px;max-width:940px;margin-bottom:30px;}
#pharmabreit {background-image:url(../img/pharma_balken_1.jpg);height:134px;max-width:940px;}


#p5 #maschinenbaubreit {background-image:url(../img/industrie_balken.jpg);height:134px;max-width:940px;margin-bottom:30px;}
#p5 #maschinenbaubreit:hover{background-image:url(../img/industrie_balken_over.jpg);}
#p5 #pharmabreit {display:none; background-image:url(../img/pharma_balken_1.jpg);height:134px;max-width:940px;}



/* TOUCH DEVICES */ 
.touch #pharmabreit{background-image:url(../img/pharma_balken_over.jpg);}
.touch #pharmabreit p, .touch #pharmabreit h2{color:white;}
.touch #maschinenbaubreit p, .touch #maschinenbaubreit h2 {color: #ffffff;}
.touch #maschinenbaubreit{background-image:url(../img/maschinenbau_balken_over.jpg);}
.touch #autobreit{background:url(../img/auto_balken_over.jpg)!important;}
.touch #autobreit p, .touch #autobreit h2 {color:white;}


#projekt1 {background-image:url(../img/projekt1.png);background-repeat:no-repeat;height:293px;max-width:293px; background-position:bottom right;}
#projekt2 {background-image:url(../img/projekt2.png);background-repeat:no-repeat;height:293px;max-width:293px; background-position:bottom right;}
#projekt1:hover {background-image:url(../img/projekt1h.png);}
#projekt2:hover {background-image:url(../img/projekt2h.png);}
#projekt3:hover {background-image:url(../img/projekt3h.png);}
#projekt3 {background-image:url(../img/projekt3.png);background-repeat:no-repeat;height:293px;max-width:293px; background-position:bottom right;}

.row.leistungen.projekte .large-4 {background: #ffffff;}
.row.leistungen.projekte .large-4::after {background-image:none;}
.row.leistungen.projekte .large-4:hover h2 {background:none;}
.row.leistungen.projekte .large-4:hover{background:#003d6a;}

.row.referenzen {margin-bottom: 45px!important;}
.row.leistungen.projekte {margin-bottom: 35px;}

.row.projekt .skills {  width: 293px; height: 293px; }
.row.projekt .skillbar,.row.projekt .skillbar-bar {height:30px;}
.row.projekt .skillbar-title span p {font-size:13px;float:left; line-height: 30px;}
.row.projekt .skillbar-title span {    padding: 0 7px; background:none;height:30px;line-height:30px;}
.row.projekt .skillbar-title {width:175px;height:30px;}
.row.projekt h3{color:#333333;font-size:24px;margin-bottom:30px;}
.row.projekt p {color:#333333;}


.row.projekt .large-4 {
    max-width: 293px;
    margin-right: 20px;
    margin-left: 0;
    padding: 0;
  height: 293px;
}

.row.projekt .large-4 {
    margin-left: 0;      
}

.large-12.projektinfo.columns.grey p {
    line-height: 75px;
    font-size: 18px;margin-bottom: 0;
}


.large-4.columns.long {
    min-height: 550px;
    margin-top: 20px;
    padding: 35px;
    max-width:293px;
    margin-right: 20px;
    margin-left: 0;
    height:auto;
}

.large-12.columns.projektinfo.grey {
    margin: 0 auto;padding:0;
    padding-left: 0.9375rem;
    max-width: 920px!important;
    /* margin-left: 20px; */

    min-height:75px;
    margin-top: 20px!important;
    margin-bottom: 40px!important;
}

.large-12.columns.projektinfo.grey strong {
    padding-left:0.5rem;
}

/*//////////////////// Standorte ///////////////////////////////////*/
.standorte {
    margin-bottom: 35px;
}


.locations {padding:0;margin:0;margin-top:35px;margin-bottom: 35px;}
.map {
	max-width:940px;
    /*
    position: relative;overflow:hidden; padding:0;margin:0;
   */
}

.map svg {width:100%;max-width:940px;}

/* Map Project Page */
#p6 .map {display:block;margin-bottom:35px;max-width:940px;}
#p6 .map svg {}

.map svg g:first-child path,

svg#worldmap-static g path {stroke: #ffffff;stroke-width:0.25px;fill:#cccccc}

svg#draw-map g.legend text.label {font-size:0.75em}

/* Map Home Page */
#p1 div.standorte { margin-top:35px;}
#p1 .map {height:609px;}
.standortemaps {  padding-top: 25px;  display: block;width: 100%;height: 300px;}

/* MARKER ANMIATION display start value */
g#tooltip-BER,g#BER,g#BIN,g#tooltip-BIN,g#LUZ,g#tooltip-LUZ,g#SIN,g#tooltip-SIN,g#STG,g#tooltip-STG {display:none}


/*/// CSS3 LOADER - Spinner //////////////
*/

.loader {
    font-size: 8px;
    margin: 50px auto;
    text-indent: -9999em;
    width: 11em;
    height: 11em;
    border-radius: 50%;
    background: #808080;
    background: -moz-linear-gradient(left, #808080 10%, rgba(255, 255, 255, 0) 42%);
    background: -webkit-linear-gradient(left, #808080 10%, rgba(255, 255, 255, 0) 42%);
    background: -o-linear-gradient(left, #808080 10%, rgba(255, 255, 255, 0) 42%);
    background: -ms-linear-gradient(left, #808080 10%, rgba(255, 255, 255, 0) 42%);
    background: linear-gradient(to right, #808080 10%, rgba(255, 255, 255, 0) 42%);
    position: relative;
    -webkit-animation: load3 1.4s infinite linear;
    animation: load3 1.4s infinite linear;
    -webkit-transform: translateZ(0);
    -ms-transform: translateZ(0);
    transform: translateZ(0);
}
.loader:before {
    width: 50%;
    height: 50%;
    background: #808080;
    border-radius: 100% 0 0 0;
    position: absolute;
    top: 0;
    left: 0;
    content: '';
}
.loader:after {
    background: #ffffff;
    width: 75%;
    height: 75%;
    border-radius: 50%;
    content: '';
    margin: auto;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
}
@-webkit-keyframes load3 {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}
@keyframes load3 {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}



.row.projektuebersicht .large-4 {height: 293px;width: 293px;background: #ffffff;}
.large-8.columns.footer {margin-left: 195px;}



/*////////// TOOLTIPS ///////////*/

div.tooltip {
    position: absolute;
    text-align: center;
    height: 2.500em;
    padding:0;
    margin:0;
    font: 1em 'Open Sans' sans-serif;
    color:#fff;
    background:transparent;
    border:0;
    border-radius: 0;
    z-index: 8;
    top: 0;
    left: 0;
    display:block;
    width:auto;
}
.tooltip-static span.inner,
div.tooltip span {
    max-width:100%;
    text-align: center;
    height: 2.188em;
    padding:0.313em;
    margin:0;
    font-size: 1em;
    font-weight:lighter;
    color:#fff;
    border: 0;
    border-radius: 0;
    display:block;
    background:#003D6A ;
    float:left;
}
.tooltip-static strong,
div.tooltip strong{
    font-size: 1.15em;
    color:#fff;
    font-weight:lighter;
}

.tooltip-static img,
div.tooltip img {
    max-width: 2.188em;
    max-height: 2.188em;
    padding:0.313em;
    background:#e2e2e2;
    border: 0px;
    border-radius: 0;
    display: block;
    float:left;
}


.tooltip-static  {
    position:absolute;
    text-align: center;
    height: 2.500em;
    padding:0;
    margin:0;
    font: 1em 'Open Sans' sans-serif;
    color:#fff;
    background:transparent;
    border:0;
    border-radius: 0;
    z-index: 8;
    top: 0;
    left: 0;
    /*visibility:visible!important;
    display: block!important; */
}



/*
.tooltip-static:after {
  box-sizing: border-box;
  display:table-cell;
  font-size: 1.6em;
  width:90%;
  line-height:0.5;
  height:0.8em;
  color: #003D6A;
  content: "\25BC";
 padding:0;
 margin:0;
 text-align:left;
}
*/


div.tooltip-static.BER  {
    margin-left:-0.52em;
    margin-top:-3.55em;
}

div.tooltip-static.BER div  {
    position:relative;
}

div.tooltip-static.BER span.arrow-bottom:after {
    box-sizing: border-box;
    font-size: 1.6em;
    line-height:0.5;
    height:0.8em;
    color: #003D6A;
    content: "\25BC";
    padding:0;
    margin:0;
    text-align:left;
    width:20px;
    height:20px;
    display:table;
    position:relative;
    margin-left:-0.15em;
}



div.tooltip-static.BIN  {
    margin-left:-7.8em;
    margin-top:-1.5em;
}


div.tooltip-static.BIN span.arrow-bottom {
    padding:0;
    margin:0;
    width:1.4em;
    height:100%;
    display:block;
    position:relative;
    margin-right:0;
    float:left;
}



div.tooltip-static.BIN span.arrow-bottom:after {
    box-sizing: border-box;
    font-size: 1.6em;
    line-height:1em;
    height:100%;
    width:0.7em;
    color: #003D6A;
    content: "\25B6";
    padding:0;
    margin:0 0 0 -0.15em;
    text-align:left;
    display:block;
    top:0.3em;
    left:0em;
    float:left;
    position:absolute;
}



div.tooltip-static.LUZ  {
    margin-left:-5.85em;
    margin-top:.2em;
}




div.tooltip-static.LUZ span.arrow-top {
    padding:0;
    margin:0;
    width:100%;
    height:100%;
    display:block;
    position:relative;
    margin-right:0;
    top:0.1em;
    left:0;
}



div.tooltip-static.LUZ span.arrow-top:after {
    box-sizing: border-box;
    font-size: 1.6em;
    line-height:0.8em;
    height:100%;
    width:100%;
    font-size: 1.6em;
    height:0.8em;
    color: #003D6A;
    content: "\25B2";
    padding:0;
    margin:0;
    text-align:right;
    display:block;
    top:0;
    left:0.1em;
    position:relative;
}



div.tooltip-static.STG  {
    margin-left:.33em;
    margin-top:-1.1em;
}

div.tooltip-static.STG span.arrow-top {
    padding:0;
    margin:0;
    width:1.1em;
    height:100%;
    display:block;
    position:relative;
    margin-right:0;
    top:0;
    left:0;
    float:left;
}

div.tooltip-static.STG span.arrow-top:after {
    box-sizing: border-box;
    font-size: 1.6em;
    line-height:1em;
    height:100%;
    width:100%;
    font-size: 1.6em;
    height:0.8em;
    color: #003D6A;
    content: "\25C0";
    padding:0;
    margin:0;
    text-align:left;
    display:block;
    top:0.1em;
    left:0;
    position:relative;
}




/*///////////////// Counter Bar ///////////////////////////////////*/

span.counter {
    font-size: 75px;
	    line-height: 75px;
    font-weight: 300;    
    display: block!important;
  color:#003d6a;
}

#p1 .large-12.count .icon img {float:left;}

span.icon {
    float: left;
    margin-right: 15px;
    display: inline;
    /* margin-bottom: 23px; */
	    margin-bottom: 5px;
}

.large-12.count p {
    font-weight: 600;
    /* text-align: center; */
    /* float: right; */
    font-size: 14px;
    vertical-align: middle;
    line-height: 20px;
    /*float: right;*/
}

#p1 .large-12.count p{ float:left;display:inline;width:50px;}


/* ---- Timeline ---- */

.timeline ol {
  position: relative;
  display: block;
  margin: 100px;
  height: 4px;
  background: #003d6a;
}
.timeline ol::before,
.timeline  ol::after {
  content: "";
  position: absolute;
  top: -8px;
  display: block;
  width: 0;
  height: 0;
  border-radius: 10px;
  border: 10px solid #003d6a;
}
.timeline  ol::before {
  left: -5px;
}
.timeline  ol::after {
  right: -10px;
  border: 10px solid transparent;
  border-right: 0;
  border-left: 20px solid #003d6a;
  border-radius: 3px;
}

/* ---- Timeline elements ---- */

.timeline li {
    position: relative;
    top: -70px;
    display: inline-block;
    float: left;
    width: 133px;
    transform: rotate(-45deg);
    font: bold 14px arial;
   left:1px;
}
.timeline li::before {
  content: "";
  position: absolute;
  top: 3px;
  left: -29px;
  display: block;
  width: 6px;
  height: 6px;
  border: 8px solid #003d6a;
  border-radius: 10px;
  background: #eee;
}

/* ---- Details ---- */

.timeline  .details {
  display: none;
  position: absolute;
  left: -85px;
  top: 60px;
  padding: 15px;
  border-radius: 3px;
  border-right: 2px solid rgba(0,0,0,.1);
  border-bottom: 2px solid rgba(0,0,0,.1);
  transform: rotate(45deg);
  font: 12px arial;
  background: #fff;
}

.timeline .details::before {
  content: "";
  position: absolute;
  left: 10px;
  top: -9px;
  display: block;
  width: 0;
  height: 0;
  border: 10px solid transparent;
  border-bottom-color: #fff;
  border-top: 0;
}
.timeline {
    height: 200px;
    margin-top: 150px;
}
/* ---- Hover effects ---- */

.timeline  li:hover {
  cursor: pointer;
  color: #28e;
}
.timeline  li:hover::before {
  top: 1px;
  left: -31px;
  width: 8px;
  height: 8px;
  border-width: 8px;
  border-color: #28e;
}
.standort.row.large-12 {
    
  border-top: 4px solid #e7e7e7;
  padding-top: 25px;
}

.large-12.count {
    /*border-top: 4px solid #e7e7e7;
    border-bottom: 4px solid #e7e7e7;*/
    display: block;
    height: 180px;
   margin-top: 30px;
}
.timeline  li:hover .details {
  display: block;
  color: #444;
}

.csc-sitemap ul li ul {
    padding-left: 30px;
}

.standort.row.large-12 p {
    font-size: 14px;
  color:#003d6a;
}
.teamconteiner ul {
    margin-left: 0!important;
}


/*///////////// Project Overview ///////////////////////*/

/*#p6 .content img:nth-of-type(1){margin:2.188em 0;}*/

.projektcontainer .large-4 a {
    display: block;
    width: 100%;
    height: 100%;
      position: relative;
    z-index: 5;
}
#p6 #container{margin-bottom:65px;}
.projektcontainer li {
    list-style: none;
}

 #p12 .projektcontainer .large-4:nth-child(3n) {
     clear:left; margin-right:30px;
}

.projektcontainer h2 {
    font-size: 1.750em;
    line-height: 2rem;
        margin-top: 0.2em;
    margin-bottom:0.3em;
}
.projektcontainer.greybg .large-4{background:#f3f3f3;}
.projektcontainer .large-4 {
    height: 293px;
    max-width: 293px;
    background: #ffffff;
    /* margin-right: 10px; */
    /* margin-left: 10px; */
    /* margin-bottom: 10px; */
    /* margin-top: 10px; */
    padding-top: 20px;
    padding-left: 20px;
    margin:10px 30px 25px 0;
}

.large-12.projekteanim .large-8 {
    padding-right: 0!important;
}

.projektcontainer .large-4:hover p, .projektcontainer .large-4:hover h2 {color:white;}
.projektcontainer .large-4:hover {
    background:#003d6a;
    color: #ffffff !important;
    -webkit-transition: 1.5s;
    -moz-transition: 1.5s;
    -ms-transition: 1.5s;
    -o-transition: 1.5s;
    transition: 1.5s;
}


/*-- Projekt Tangramm Sprite */
.projektcontainer .large-4 span.tangram-sprite {
    background-repeat:no-repeat;
    background-position:0 0;
    height: 146px;
    width: 146px;
    background-position: 0 0;
    display: block;
    z-index: 2;
    bottom: 0;
    right: 0;
    position: absolute;
}

.projektcontainer .large-4:hover span.tangram-sprite {
    background-position: 0px -146px;
}


.row.leistungen .large-4:hover:after {
   background:rgba(0, 61, 106, 0.6)!important;
}
  
  
.management.aufsichtsrat .large-6.columns.blue {
    min-height: 450px;
}
.ehemaligeraufsichtsrat .large-6.columns.blue {
    min-height: 450px;
}

#p10 .projektcontainer .large-4 {
    background: #f2f2f2;
	margin-bottom: 35px;
}
.ansprechpartner .large-3.columns {padding-left:0;}


#p10 .grey .projektcontainer .large-4 {
    background:#ffffff;
}

#p10 .projektcontainer .large-4:hover {
    background: #003d6a;
}

/*///////// LIST DEFAULT //////////////*/
.content .row ol li {
    margin-bottom: 10px;
}

.content .row ol li ul li {
    margin-bottom: 0;
}
.content .row ul li,
.content .csc-default .row ul li,
.content .csc-default .row ul,
.content .row .csc-textpic-text ul  {
    list-style-type:square;
}


.content .row .projektcontainer ul  {
  margin:0;padding:0;
  }

.content .row .projektcontainer ul li {
  list-style-type:none;}


#container h5 {
    padding-left: 0.96rem;
  font-size:40px;
  font-weight:300;
  margin-top: 40px;
}

.projektcontainer h2 p {
    margin-top: 10px;
}

.teamcontainer img {
    border: 1px solid #cccccc;
}

.kompetenztext {
    position: absolute;
    top: 80px;
    left: 15px;
    }

.kompetenztext p {
line-height: 9px;
color: #003d6a!important;
}



/*///////////// PAGE CSS ////////////////*/

/* HOME */

/* Referenzen */
/*#p1 .row.referenzen h2 {padding-top: 35px;  padding-bottom: 10px;  }*/

/* Avantlion in Zahlen */
#p1 .content .csc-default.grey +  .row + .csc-default.grey + .row h2 {margin-top: 40px;}

/* Standorte  */
#p1 .content .csc-default.grey + .row + .csc-default.grey + .row + .row h2{/* margin-left: 27px; */}
#p1 .content .csc-default.grey + .row + .row + .csc-default.grey .large-4.columns h2{margin-left: 0;}
#p1 #slider1_container{margin-left: 7px !important;}
#p1 #slider1_container div div div{cursor:pointer;}
#p1 .projektcontainer .large-4 {
    margin-left: 0;
    margin-top: 0;
    margin-right: 30px;
    margin-bottom: 65px;
}


#p1 #container li:last-child {margin-right: 25px;}
#p1 #container .projektcontainer li:last-child,
#p1 .projektcontainer li:last-child {
	margin-right: 0!important;
}
#p1 .large-12.count { /* margin-left: 15px; */}
#p1 .auto,
#p1 .maschinen,
#p1 .pharme {margin-right: 28px;}

#p1 .pharme {margin-right: 0px;}

#p1 #container {max-width: 940px;margin: 0; margin-left: 0px;}

#p1 #container h2{margin-top: 47px;}
#p1 #container li h2{margin-top: 3px;}

#p1 #container .projektcontainer ul{margin-left: 0;}

#p1  .large-12.count p{ float:left;}

#p1 .grey.branchenbox {min-height: 492px;}
.branchenbox {
    margin-bottom: 65px;
    margin-top:-50px;	
}
#p1 .row.referenzen {margin-left:0;margin-bottom: 73px!important;}


/* AUTOMOTIVE FINANCE */
#p4 h1, #p10 h1, #p11 h1 {
    margin-top: 60px !important;
    margin-bottom: 20px !important;
}


#p10 h1 + div h3 +ol{margin-top: 20px;}
#p10 .csc-default.grey h3,
#p11 .csc-default.grey h3{ margin-top: 45px;}

#p10 h1 + div h3
{
    margin-top: 20px;
    margin-bottom: 5px;
}


#p10 h1 + .csc-textpic-text,
#p11 h1 + .csc-textpic-text {
  padding-bottom: 30px;
  max-width: 940px;
}

#p10 .csc-default.grey,
#p11 .csc-default.grey {padding-bottom: 50px;}

#p10 .csc-default.grey + .row,
#p11 .csc-default.grey + .row {
     padding-top: 30px;
      max-width: 940px;
      /*padding-left: 0;*/
}

#p11 .content .row.ansprechpartner{padding-left: 0;}
#p10 .large-3.columns {padding-left: 0px;}
#p11 .projektcontainer .large-4.columns {margin-top: 5px;}
#p11 .projektcontainer ul{margin-left: 0;}


/* ///////////// Branchen Box  ////////////////////////// */

.grey {background-color: #f3f3f3;}
.grey.branchenbox {
    background-color: #f3f3f3;
    min-height:482px;
}

.grey.branchenbox h1 {
    padding-left: 0;
    padding-top: 10px;
    margin-bottom: 25px !important;
}

.branchenbox h2 {
    font-size: 30px;
    color: #003d6a;
    position: relative;
    top: -117px;
    /*right: -30px;*/
    font-weight: 700;
	margin-top: 0.2em;
    /*letter-spacing: 3px;*/
    max-width: 293px;
    line-height: 30px;
    text-align: center;
}

.slider.hide-for-small img {
    margin: 0 auto;
    display: block;
}

.row.branchenbox {
    margin-bottom: 1.25rem;
}

.branchenbox .columns {
    padding-left:45px;
    padding-right:0;
}

.branchenbox p {
    font-size: 18px;
    color: #003d6a;
    position: relative;
    top: -114px;
    /* right: -23px; */
    /*left: -30px;*/
    max-width: 293px;
    text-align: center;
}

.branchenbox a {
    text-indent: -99999px;
    position: relative;
    z-index: 4;
    /* display: none; */
    display: block;
    width: 100%;
    height: 100%;
}

/* ///////////// O-Toene / Mitarbeiter Kommentare  ////////////////////////// */

.blog {
    margin:0 0 0 0;
    display:block;
    overflow:hidden;
}

.blog h3 {
    display:block;
    font-size:/*1.875em*/2.500em;
    margin:30px 0 30px 0;
    line-height:1.5;
}
.blog-wrapper {
    background:#fff;
    display: table;
    padding-bottom:1.563em;
    width: 100%;
    margin-bottom:2.188em;
    font-size:1.2em;
}



.large-4.columns.blog-pic {
    width: 100%;
    max-width:8.063em;
   padding-top: 1.875rem;
}

.large-4.columns.blog-pic img {
    width: 100%;
    /* max-width:4.375em;*/
	max-width:100px;
    border:1px solid #cccccc;
}

.large-8.columns.blog-text {
    max-width: 40em;
    width: 100%;
       padding-top: 1.875rem;

}

.large-8.columns.blog-text p {
    font-weight: 500;
    font-style: italic;
    font-size: 16px;
    padding: 0;
    text-align: center;
}

.large-4.columns.blog-author{
    max-width:11.313em;
    width: 100%;
    padding-top:3.125em;
    font-size:1em;
}
.blog-wrapper.large-12.right {
    -moz-transform: scaleX(-1);
    -o-transform: scaleX(-1);
    -webkit-transform: scaleX(-1);
    transform: scaleX(-1);
    filter: 'FlipH';
    -ms-filter: "FlipH";
}

.blog-wrapper.large-12.right .large-4.columns.blog-pic {
    -moz-transform: scaleX(-1);
    -o-transform: scaleX(-1);
    -webkit-transform: scaleX(-1);
    transform: scaleX(-1);
    filter: 'FlipH';
    -ms-filter: "FlipH";
}

.blog-wrapper.large-12.right .large-8.columns.blog-text {
    -moz-transform: scaleX(-1);
    -o-transform: scaleX(-1);
    -webkit-transform: scaleX(-1);
    transform: scaleX(-1);
    filter: 'FlipH';
    -ms-filter: "FlipH";
}

span.author {
    text-transform:uppercase;
    font-weight:600;
}
span.function {
    display:inline-block;
    font-style:italic;
}

.blog-wrapper .large-4  {
    display:table-cell;
    text-align: center;
    vertical-align: middle;
}

.blog-wrapper {
    position: relative;
    background: #ffffff;
    border: 4px solid #fff;
}
.greybg{
	background:#f3f3f3;
}

.blog-wrapper:after, .blog-wrapper:before {
    top: 100%;
    left: 50%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
}


.blog-wrapper.greybg:after{
	border-top-color: #f3f3f3;
}


.blog-wrapper:after {
    border-color: rgba(255, 255, 255, 0);
    border-top-color: #ffffff;
    border-width: 30px;
    margin-left: -30px;
}
.blog-wrapper:before {
    border-color: rgba(255, 255, 255, 0);
    border-top-color: #fff;
    border-width: 36px;
    margin-left: -36px;
}



/***************
Footer
***************/

footer.csc-default.grey {    
    background-color: #666666;
    max-width: 100%;
     color:#fff;
     padding:10px;
}


footer.csc-default.grey a {
    padding:0 5px;
    color:#fff;
    display:inline;
    font-size:0.85em;
}


ul.footermenu {
    display: block;
    margin:10px auto 10px 4em;
  
}


.footermenu  li {
    list-style: outside none none;
    margin: 0;
    float:left;
    padding:0;
    display:block;;
}



/** Smartphone Portrait / Landscape **/
@media only screen and (max-width: 40.0625em) {
	.management .small-6 {
    width: 50%;
}
.row.ansprechpartner .large-3 {
    max-width: 200px;
    margin: 0 auto;
    float: none;
}

.large-12.count {
    display: block;
    height: 180px;
    /* margin-top: 30px; */
    margin: 0 auto;
    max-width: 160px;
}
    .large-4.columns {
        margin-bottom: 25px;
        float: left!important;
    }
	
	span.counter{float:initial!important;}
	
    footer .row {
        height: auto;
        text-align:center;
        font-size:0.85em;
    }
    
	ul.footermenu {
		display: block;
		margin:10px auto;  

	}


    .column+.column:last-child, .columns+.column:last-child, .column+.columns:last-child, .columns+.columns:last-child {
        float:none!important;
    }
}

/** Tablet **/
@media only screen and (min-width: 43.7em){
	.mitarbeitername,
	.casual {
		float: left;
		clear: none;
		width: 293px;
	}
	
	.portrait {
		margin-right: 0.938em;
	}
	
	.skillbar-title {
		width: 293px;
	}
	.skillbar-title span p {
		font-size: 0.85em;
		line-height: 1.9em;
	} 
}


/** Fancybox on Desktop **/
@media only screen and (min-width: 56em){
	.skills {
		width: 586px;
	}
	
	.tangram,
	.portrait {
		display: block;
	}
}


/** Desktop **/
@media only screen and (min-width: 60.0625em){

	.mitarbeitername {
		float: left;
		width: 293px;
		padding: 26px;
		height: 293px;
		display: block;
		background-color: #003d6a;
	}
	
    footer.csc-default.grey {
    min-height: 100px;
    background-color: #666666;
    max-width: 100%;
    height: 115px;

  }

  footer.csc-default.grey,
  footer.csc-default.grey a {
    color:#fff;
  }


  ul.footermenu {
    display: inline-block;
    margin-top: 35px;
    margin-bottom: -7px;
  }


  .footermenu  li {
    list-style: outside none none;
    margin-right: 15px;
    float:left;
  }


  /*footer.csc-default.grey > .row{padding-left: 30px;}*/
    

}

@media only screen and (min-width: 64.0625em){
    /* .large-6.columns.blue {
		min-height: 12.3em;
	 }
	#aufsichtsratajax.large-6.columns.blue {
	 min-height: 12.3em;
	 }
	 */
}

/***** Karriere FCE Newcomer-Professionals *****/
.large-12.jobs .large-6 a {
    font-size: 24px;
}
.large-12.jobs .large-6 {
    background: white;
    max-width: 450px;
	margin-top:25px;
	padding-top:25px;
	padding-left: 35px;
    padding-right: 25px;
    margin-right: 40px;
    margin-bottom: 25px;
	min-height:510px;
}
.large-12.jobs .large-6.columns.last {
    margin-right: 0px;
}

.large-12.jobs .large-6  li {margin-bottom:6px;}
.large-12.jobs .large-6 span{display:none;}

.no-touch .large-12.jobs .large-6:hover .text p ,
.touch .large-12.jobs .large-6.activ .text p{font-size:24px;line-height:15px;    margin-bottom: 13px;}

.no-touch .large-12.jobs .large-6:hover .text a,
.touch .large-12.jobs .large-6.activ .text a {color:#41c0f0;}

.touch .large-12.jobs .large-6.activ .text,
.no-touch .large-12.jobs .large-6:hover .text {
    display: block;
    position: absolute;
    top: 0;
    background: rgba(0, 61, 106, 0.8);
    width: 100%;
    left: 0px;
    height: 100%;
    color: white;
    text-align: center;
}




.touch .large-12.jobs .large-6:hover span,
.no-touch .large-12.jobs .large-6:hover span {
    position: relative;
    top: 40%;
    /* left: 50%; */
    /* right: 50%; */
    display: block;
    margin: 0 auto;
  width: 220px;
}



/*************************
Projektbar
*************************/  

.Count:after{ content:"%" }

.projektbar {
  position:relative;
  display:block;
  margin-bottom:5.8px;
  width:100%;
  background:#ffffff;
  height:50px;
  border-radius:3px;
  -moz-border-radius:3px;
  -webkit-border-radius:3px;
  -webkit-transition:0.4s linear;
  -moz-transition:0.4s linear;
  -ms-transition:0.4s linear;
  -o-transition:0.4s linear;
  transition:0.4s linear;
  -webkit-transition-property:width, background-color;
  -moz-transition-property:width, background-color;
  -ms-transition-property:width, background-color;
  -o-transition-property:width, background-color;
  transition-property:width, background-color;
}

.projektbar-title {
  position:absolute;
  top:0;
  left:0;
  /*width:295px;*/
  width: 100%;
  font-weight:bold;
  font-size:13px;
  color:#cccccc;
  background:#d9d9d9;
  height: 50px;
  /*background:#ffffff;*/
}

.projektbar-title span {
  display:block;  
  padding:0 20px;
  height:50px;
  line-height:24px;
}

.projektbar-bar {
  height:50px;
 /* width:0px;*/
  position:relative;

}
.projektbar-bar p {
    color: white;
    line-height: 50px;
    font-weight: 600;
	min-width: 16em;
    margin-left: 30px;
}
.large-12.projekteanim img {
    margin-top: 0px!important;
}

.projektbar-title span p {
    margin: 0;
    float: right;
	color:#333333;
    font-family: 'Open Sans', sans-serif;
    font-weight: 600;
	font-size: 0.8em;
	line-height: 2.3em;
}

@-webkit-keyframes progress-bar {
0% { width: 0; }
}
@-moz-keyframes progress-bar {
0% { width: 0; }
}
@keyframes progress-bar {
0% { width: 0; }
}

.projektbar >.projektbar-bar {
-webkit-animation: progress-bar 4s linear;
-moz-animation: progress-bar 4s linear;
animation: progress-bar 4s linear;
}
/*************************
Projektbar Ende
*************************/ 


/******** Meinungen Dreispalter ********/
.meinungen-wrapper.large-12 {
    text-align: center;
    float:left;
    padding-bottom:2.2em;
    margin-bottom: 1em;
}

.meinungen-wrapper h1 {
    text-align: left;
}


.meinungen-wrapper.large-12 h2{
    text-align: initial;
}
.meinungen-wrapper .large-4 {
    background: white;
    max-width: 293px;
	height:425px;
	margin-top:25px;	
    margin-right: 27px;

}
.meinungen-wrapper.graubg.large-12 .large-4 {
    background: #f3f3f3;
}
.meinungen-wrapper.graubg.large-12 .large-4:after {
    width: 0;
    height: 0;
    border-left: 20px solid transparent;
    border-right: 20px solid transparent;
    content: " ";
    border-top: 20px solid #f3f3f3;
    position: absolute;
    top: 100%;
    left: 43%;
}



.meinungen-wrapper .blog-author {
    position: absolute;
    bottom: 30px;
    left: 0;
    margin: 0 auto;
    width: 290px;
}
.meinungen-wrapper .blog-pic {
    margin-bottom: 10px;
}
.meinungen-wrapper .blog-pic img {
    border: 1px solid #666666;
}
.meinungen-wrapper .large-4.columns.last {
    margin-right: 0px;
}
.meinungen-wrapper  .blog-text {
    padding: 25px;
}
.meinungen-wrapper .large-4:after {
    width: 0;
    height: 0;
    border-left: 20px solid transparent;
    border-right: 20px solid transparent;
    content: " ";
    border-top: 20px solid #ffffff;
    position: absolute;
    top: 100%;
    left: 43%;
}



.large-12.projekteanim .large-4 img, .onloadzeitstrahl img {
opacity:0;
-moz-transition: opacity 5s; /* Firefox 4 */
-webkit-transition: opacity 5s; /* Safari and Chrome */
-o-transition: opacity 5s;
transition: opacity 5s;
}


@media only screen and (max-width: 40em) {
.ansprechpartner .img-container {
    margin-bottom: 1.563em;
}
#p1 .auto, #p1 .maschinen, #p1 .pharme {margin-left:0!important;margin-right:0!important;}
#p4 h1, #p10 h1, #p11 h1 {
    margin-top: 20px !important;
    margin-bottom: 20px !important;
}
/*
#p1 #slider1_container{
		position: relative;
		top: 0px;
		left: -0.625em!important;
		width: 15.000em!important;
		height: 43.1158px!important;
		overflow: hidden;
		margin: 0px auto;	
	}*/
.branchenbox .columns{padding-left:20px;}

	.skillbar-title span p {
    float: left;
}
.branchenbox h2 {
    top: -4.5em;
}
.branchenbox p {
    top: -8em;
	   font-size: 1em;
}
.branchenbox a {    top: -8.35em;}
div#autobreit h2, div#maschinenbaubreit h2, div#pharmabreit h2 {top: -8.5em;}
div#autobreit p , div#maschinenbaubreit p, div#pharmabreit p{top: -15.5em;}


}

.row.zahlenstrahl {
	margin-bottom: 40px !important;
}

.zahlenstrahl .jahrCol {
	opacity: 0;
}

.zahlenstrahl .jahrCol {
	width: 116px;
	padding: 0px !important;
}

.zahlenstrahl .jahrCol .standort {
	background: transparent url('../img/unternehmen/zahlenstrahlStandort.png') top left no-repeat;
	width: 118px;
	color: #001556;
	padding: 0px 10px 22px;
	text-align: center;
}

.zahlenstrahl .jahrCol .jahr {
	background: transparent url('../img/unternehmen/zahlenstrahl.png') top left no-repeat;
	width: 118px;
	color: #001556;
	padding: 11px 10px 22px;
	text-align: center;
}

.zahlenstrahl .jahrCol:last-child .jahr {
	background: transparent url('../img/unternehmen/zahlenstrahlEnde.png') top left no-repeat;
}

.zahlenstrahl .jahrCol .jahr.noStandort {
	margin-top: 46px;
}


@media only screen and (min-width: 40.0625em) and (max-width: 47.55em) {
	ul#menu {
		top: 10px;
	}
	
	ul#menu li a::after {
		width: 27px;
	}
	
	ul#menu li a {
		font-size: 71% !important;
	}
	
	img.logo {
		width: 57% !important;
	}
	
	nav.top-bar ul.title-area {
		max-width: 44%
	}
	
	.top-bar-section li:not(.has-form) a:not(.button) {
		padding: 13px 0.69em !important;
	}
}


span.author {
    font-size: 1rem;
    top: 10px;
    line-height: 0.8!important;
    position: relative;
}

#menu > li.has-dropdown.not-click.moved > ul {
    display: block!important;
}
.blog-text {
    font-style: italic;
}

.jobs .text {display:none;}


.projektbar-title a {
    display: block;
    height: 100%;
    position: relative;
    z-index: 100;
    text-indent: -9999px;
}
.standortemaps .large-4 {
    padding-left: 0;
}

.csc-sitemap li {
    font-weight: bold;
    margin-top: 0.625em;
}
.csc-sitemap li ul li {
    margin-top: 0px;
    font-weight: initial;
}
.news {
    background: #003d6a;
   /* border: 1px solid #b1c2dc;
   border-radius: 10px;*/
    padding: 15px;
    margin-top: 0.5em;
	color:white;
	}
/*
.row .newscontainer {
    padding-bottom: 30px;
}
*/

.row.leistungen h2 {
    margin-top: 10px;
}




@media only screen and (min-width: 40.0625em) and (max-width: 48em) {
.kompetenztext p {
    margin-bottom: 8px;
    line-height: 1rem;
    color: #003d6a!important;
}

div > div > div.large-12.lightwindow > div.mitarbeitername{
    float: left;
    width: 74%;
    max-width: 295px;
    padding: 26px;
    height: 293px;
    display: block;
    background-color: #003d6a;
}
.casual {
    float: left;
clear: inherit!important;}
}


body#p65 .large-12, body#p65 .large-6 {
    padding-left: 0!important;
}

.mappointer {
    margin: 0 auto;
    display: none;
    max-width: 210px;
}
.mappointer p {
    font-size: 13px;
}
.mappointer::before {
    content: '\b7\a0';
    font-size: 56px;
    line-height: 0px;
    position: relative;
    float: left;
    top: 7px;
    left: -19px;
    color: #008cba;
}

/* CSS Slider */
/*Animations are sped up so you're not sitting here all day*/

/*Desktop and Tablet*/
@-webkit-keyframes slide {
  0%, 17% { margin:0; }
  20%, 34% { margin:0 0 0 -100%; }  
  40%, 51% { margin:0 0 0 -200%; }
  60%, 68% { margin:0 0 0 -300%; }
  80%, 85% { margin:0 0 0 -400%; }
  100% { margin:0; }
}
@-moz-keyframes slide {
  0%, 17% { margin:0; }
  20%, 34% { margin:0 0 0 -100%; }  
  40%, 51% { margin:0 0 0 -200%; }
  60%, 68% { margin:0 0 0 -300%; }
  80%, 85% { margin:0 0 0 -400%; }
  100% { margin:0; }
}
@-ms-keyframes slide {
  0%, 17% { margin:0; }
  20%, 34% { margin:0 0 0 -100%; }  
  40%, 51% { margin:0 0 0 -200%; }
  60%, 68% { margin:0 0 0 -300%; }
  80%, 85% { margin:0 0 0 -400%; }
  100% { margin:0; }
}
@-o-keyframes slide {
  0%, 17% { margin:0; }
  20%, 34% { margin:0 0 0 -100%; }  
  40%, 51% { margin:0 0 0 -200%; }
  60%, 68% { margin:0 0 0 -300%; }
  80%, 85% { margin:0 0 0 -400%; }
  100% { margin:0; }
}
@keyframes slide {
  0%, 17% { margin:0; }
  20%, 34% { margin:0 0 0 -100%; }  
  40%, 51% { margin:0 0 0 -200%; }
  60%, 68% { margin:0 0 0 -300%; }
  80%, 85% { margin:0 0 0 -400%; }
  100% { margin:0; }
}

/*Mobile*/
@-webkit-keyframes slide_mobile {
  0%, 7% { margin:0; }
  10%, 17% { margin:0 0 0 -100%; }  
  20%, 27% { margin:0 0 0 -200%; }
  30%, 37% { margin:0 0 0 -300%; }
  40%, 47% { margin:0 0 0 -400%; }
  50%, 57% { margin:0 0 0 -500%; }
  60%, 67% { margin:0 0 0 -600%; }
  70%, 77% { margin:0 0 0 -700%; }
  80%, 87% { margin:0 0 0 -800%; }
  90%, 97% { margin:0 0 0 -900%; }
  100% { margin:0; }
}

@-moz-keyframes slide_mobile {
  0%, 7% { margin:0; }
  10%, 17% { margin:0 0 0 -100%; }  
  20%, 27% { margin:0 0 0 -200%; }
  30%, 37% { margin:0 0 0 -300%; }
  40%, 47% { margin:0 0 0 -400%; }
  50%, 57% { margin:0 0 0 -500%; }
  60%, 67% { margin:0 0 0 -600%; }
  70%, 77% { margin:0 0 0 -700%; }
  80%, 87% { margin:0 0 0 -800%; }
  90%, 97% { margin:0 0 0 -900%; }
  100% { margin:0; }
}

@-ms-keyframes slide_mobile {
  0%, 7% { margin:0; }
  10%, 17% { margin:0 0 0 -100%; }  
  20%, 27% { margin:0 0 0 -200%; }
  30%, 37% { margin:0 0 0 -300%; }
  40%, 47% { margin:0 0 0 -400%; }
  50%, 57% { margin:0 0 0 -500%; }
  60%, 67% { margin:0 0 0 -600%; }
  70%, 77% { margin:0 0 0 -700%; }
  80%, 87% { margin:0 0 0 -800%; }
  90%, 97% { margin:0 0 0 -900%; }
  100% { margin:0; }
}

@-o-keyframes slide_mobile {
  0%, 7% { margin:0; }
  10%, 17% { margin:0 0 0 -100%; }  
  20%, 27% { margin:0 0 0 -200%; }
  30%, 37% { margin:0 0 0 -300%; }
  40%, 47% { margin:0 0 0 -400%; }
  50%, 57% { margin:0 0 0 -500%; }
  60%, 67% { margin:0 0 0 -600%; }
  70%, 77% { margin:0 0 0 -700%; }
  80%, 87% { margin:0 0 0 -800%; }
  90%, 97% { margin:0 0 0 -900%; }
  100% { margin:0; }
}

@keyframes slide_mobile {
  0%, 7% { margin:0; }
  10%, 17% { margin:0 0 0 -100%; }  
  20%, 27% { margin:0 0 0 -200%; }
  30%, 37% { margin:0 0 0 -300%; }
  40%, 47% { margin:0 0 0 -400%; }
  50%, 57% { margin:0 0 0 -500%; }
  60%, 67% { margin:0 0 0 -600%; }
  70%, 77% { margin:0 0 0 -700%; }
  80%, 87% { margin:0 0 0 -800%; }
  90%, 97% { margin:0 0 0 -900%; }
  100% { margin:0; }
}

.rotator-wrap {
	overflow:hidden;
	position:relative;
	min-height:100px;
	width:100%;
}

.rotator {
	width:500%;
	overflow:hidden;
	margin:0;
	list-style-type:none !important;
	padding:0;
/*Change the length of the animation here*/
	-webkit-animation: slide 30s infinite ease-out 5s;
	-moz-animation:    slide 30s infinite ease-out 5s;
	-ms-animation:     slide 30s infinite ease-out 5s;
	-o-animation:      slide 30s infinite ease-out 5s;
	animation:         slide 30s infinite ease-out 5s;
}

.rotator > li {
	padding:15px;
	width:5%;
	float:left;
	margin:0;
	box-sizing:border-box;
	
	
	list-style-type:none !important;
	-webkit-transition:margin .5s ease-out;
	-moz-transition:margin .5s ease-out;
	-ms-transition:margin .5s ease-out;
	-o-transition:margin .5s ease-out;
	transition:margin .5s ease-out;
}

.rotator > li > div {
	background:#999;
	width:100%;
	height:100%;
	line-height: 0;
	overflow:hidden;
	border: 1px solid #cccccc;
}

.rotator  img {
  width:100%;
}

@media only screen and (max-width: 767px) {
	.rotator {
		width:500%;
	}
}

@media only screen and (max-width: 520px) {
	.rotator {
		width:1000%;
		-webkit-animation: slide_mobile 25s infinite ease-out;
		-moz-animation:    slide_mobile 25s infinite ease-out;
		-ms-animation:     slide_mobile 25s infinite ease-out;
		-o-animation:      slide_mobile 25s infinite ease-out;
		animation:         slide_mobile 25s infinite ease-out;
	}
}



.noscript p {
    margin: 0 auto;
    display: block;
    max-width: 640px;
    width: 100%;
    color: #ffffff;
    padding: 15px;

}

.noscript {    background-color: #666666;}



/*** Managment/Aufsichtsrat Höhe Blauerkasten ***/
.managementtwo, .aufsichttwo, .ehemaligeraufsichtsrattwo {
    min-height: 26.8em!important;
}
.managementfour, .aufsichtfour, .ehemaligeraufsichtsratfour {
    min-height: 41em!important;
}
.managementsix, .aufsichtsix, .ehemaligeraufsichtsratsix {
    min-height: 55.250em!important;
}