/* CSS DOES NOT AFFECT PAGES AND BLOG ANYMORE ! FILE INTEGRATED INTO systema.css */




/***** Location H2 ***********/

h2.continent {
  border-bottom: 1px solid #003978;
  padding-bottom: 5px;
}


.contact-menu a {
  padding-left: 10px;
  padding-right: 10px;
  border-right: 1px solid #bfbfbf;
}

.mobile-menu-logo {
  -moz-box-shadow: 0 2px 4px rgba(0, 0, 0, .1);
    -webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, .1);
    box-shadow: 0 2px 4px rgba(0, 0, 0, .1);
}

.pt180{
  padding-top:180px!important;
}

@media (min-width: 1140px){
	#wimpel.space {
  	top: 92px;
   }
  
  .scrollHide.hide{
  	display:none!important;
	}

	.fixedNavigation.fixed {
  	position: fixed;    
  	top: 0;     
 		z-index: 9999; 
	}
  
 
  .body-container-wrapper.space {
		margin-top: 92px;
   }
}

@media (max-width: 1139px) {
  
  
  .body-container-wrapper {
		margin-top: 92px;
   }

	#wimpel {
  	top: 92px!important;
   }
  
  .scrollHide{
  	display:none!important;
	}

	.fixedNavigation {
  	position: fixed;    
  	top: 0;     
 		z-index: 9999;
    height: 92px;
	}
}

/*********** Blog Clickable Logo  ************/

/*********** Blog Headers  ************/

.blog-text h1 {
    font-size: 42px !important;
}

.blog-text h2 {
    font-size: 32px !important;
}

.blog-text h3 {
    font-size: 26px !important;
}

.blog-text h4 {
    font-size: 19px !important;
}

.blog-text h5 {
    font-size: 18px !important;
}

/*********** reCaptcha box ************/

.hs_recaptcha {
  transform:scale(0.835);
  -webkit-transform:scale(0.835);
  transform-origin:0 0;
  -webkit-transform-origin:0 0;
}

/*********** Custom Integrate Optimize  ************/

/* Breakpoint for mobile devices */
@media (max-width: 767px) {
  .mh-276 {
    min-height: 180px!important;
  }
}

@media (min-width: 767px) {
  .mh-276 {
    min-height: 276px!important;
  }
}
.w710 {
    max-width: 710px;
}

.partner-name h3 {
    margin-bottom: 10px;
}

.bdb.blue{
    border-bottom: 1px solid #003978;
}


.quote {
text-shadow: 0 0 10px rgba(0, 57, 120, 1);
}

.quote p{
    font-weight: 200;
    font-size: 22px;
    margin-bottom: 0;
    font-style: italic;
    
}

.quote-source {
    font-size: 15px;
    font-weight: 400!important;
}

.definition p {
    margin-bottom: 1em;
    line-height: 1.3;
    font-size: 22px;
    color: #003978;
    font-weight: 200;
    font-style: italic;
}

.definition {
    padding-bottom: 16px;
}


.body-text h2 {
    font-size: 24px;
    margin-bottom: 0.3em;
    line-height: 1.2;
    color: #51697b;
    font-weight: normal;
    color:#2273a2;
  	margin-top: 0.6em;
  
}

.body-text h3 {
    margin-bottom: 0.3em;
    line-height: 1.2;
    color: #51697b;
    font-weight: normal;
    font-style: normal;
}

.body-text p {
    margin-bottom: 1em;
}

.sidebar-modul {
    background: #003978;
    padding: 25px;
    font-size: 15px;
    color: #ffffff;
    -webkit-clip-path: polygon(0 0, 100% 0, 100% -webkit-calc(100% - 0.6vw), 0 100%);
            clip-path: polygon(0 0, 100% 0, 100% calc(100% - 0.6vw), 0 100%);
}

.sidebar-modul a:hover {
  color: #f0871e;
}

.sidebar-modul h3 {
    color: #fff;
    margin-bottom: 0.5em;
}

.sidebar-modul.grey{
    color: #000;
}

.sidebar-modul.grey a:hover {
    color: #8c8c8c;
}

.sidebar-modul.grey h3 {
    font-size: 24px;
    margin-bottom: 0.6em;
    line-height: 1.32;
    color: #003978;
    font-weight: normal;
}

.sidebar-modul.grey h4 {
    color: #51697b;
    margin-bottom: 10px;
    font-style: normal;
}

.featured-event {
    padding: 35px;
}

.featured-event h3 {
    font-size: 24px;
    margin-bottom: 0.6em;
    line-height: 1.32;
    color: #003978;
    font-weight: normal;
}

.wrapper-cta-bottom {
    padding-top: 1em !important;    
    padding-bottom: 4em !important; 
    margin-bottom: -5.5em; 
    margin-top: 2em;
}

.wrapper-cta-bottom h3 {
    margin-bottom: 0;
    font-weight: bold;
}

.wrapper-cta-bottom p {
    margin-bottom: 1.2em;
}




/************************************************* End Custom Style Integrate ******************/



.round-image img {
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%;
}


.footer a {
    font-size: 14px;
    font-weight: normal;
}


#wimpel {
    width: 100px;
    position: absolute;
    right: 10px;
    z-index: 2;
    top: 0;
}


.header-wrapper {
	width: 100%!important;
  background: #fff;
  -moz-box-shadow: 0 2px 4px rgba(0, 0, 0, .1);
  -webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, .1);
  box-shadow: 0 2px 4px rgba(0, 0, 0, .1);
}



.event-category {
    border-bottom: 1px solid #bfbfbf;
    padding: 5px 0px;
    color: #8c8c8c;
}

.event-details {
    padding: 40px 30px 35px 0px;
}




h3.list-header {
    font-size: 20px;
}

.menu-bar .hs-menu-wrapper ul ul li a {
    min-width: 12rem;
}

.event-link {
    padding-top: 10px;
}


a.mm-menu {
    color: #003978;
    font-weight: normal;

}

a.mm-menu:hover {
    color: #f8ae3f;
}

/********************** Slider mit Pfeilen **************/


.slider-container.arrows-outside-30 .nboslick-prev{
    left: -30px;
}

.slider-container.arrows-outside-30 .nboslick-next {
    right: -30px;
}

.slider-container.arrows-outside-10 .nboslick-prev{
    left: -10px;
}

.slider-container.arrows-outside-10 .nboslick-next {
    right: -10px;
}



/********************** Solution-Finder Button ****************/


.btn-sol-finder {
    position: absolute;
    top: 45%;
    left: -120px;
    z-index: 2;
}

#close-overlay {
    position: absolute;
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    width: 100%;
    height: 100%;
    background: transparent;
    z-index: -1;
    display: none;
}

.sidr-open #close-overlay {
    display: block;
}



/************************* Location Map **************************/

#map {
    height: 350px;
    margin-bottom: -100px;
}


/************************* Social Profiles Links ******************/

.social-profiles i {
    font-size: 24px!important;
    margin-right: 10px;
    width: 30px;
}

.social-profiles ul li {
    margin-bottom: 10px;
}

/****************************** CTAs with Custom Icons ************************/


a.cta-contact:before {
  font-family: FontAwesome;
   content: "\f086";
   margin-right: 10px;
}


/*********************** Start-Seite **************/

.content-section.angle--bottom-right.home {
    padding-top: 0px;
}

@media (max-height: 720px){

    .home h1 {
        font-size: 2em!important;
    }
}

.content-section.angle--bottom-right.small {
    padding-top: 90px;
    padding-bottom: 90px;
}


.start-header h1 {
    margin-bottom: 10px;
    text-shadow: 0 0 10px rgba(0, 57, 120, 0.8);
}

.start-header p {
    text-shadow: 0 0 10px rgba(0, 57, 120, 0.8);
    margin-bottom: 10px; 
    font-weight: 300;
}



/*************************** Menü Pfeile TopMenu ***************************/

.menu-bar li.hs-menu-item.hs-menu-depth-1.mega-menuized > a:after, .menu-bar li.hs-menu-item.hs-menu-depth-1.hs-item-has-children > a:after {
    font-family: FontAwesome;
    content: "\f107";
    display: block;
    padding-left: 15px;
    font-size: 18px;
}

.menu-bar li.hs-menu-item.hs-menu-depth-1.mega-menuized:hover > a:after, .menu-bar li.hs-menu-item.hs-menu-depth-1.hs-item-has-children:hover > a:after,
.menu-bar li.hs-menu-item.hs-menu-depth-1.mega-menuized:active > a:after, .menu-bar li.hs-menu-item.hs-menu-depth-1.hs-item-has-children:active > a:after,
.menu-bar li.hs-menu-item.hs-menu-depth-1.mega-menuized.mega-menuized-active > a:after{
    font-family: FontAwesome;
    content: "\f106";
    display: block;
    padding-left: 15px;
    font-size: 18px;
}



.menu-bar li.hs-menu-item.hs-menu-depth-1 > a {
    font-size: 1.2rem;
}


/**************** 25 Years *****************/

.wimpel {
    position: absolute;
    top: 92px;
    z-index: 1;
}


/***** Special Grid for the 5 Menu-Boxes ******/

@media (min-width: 768px) {
.menu-boxes {
        margin-top: -180px;
    }
}

.menu-boxes .menu-boxes-items {
    background-color: #ffffff;
    box-shadow: 0 2px 4px rgba(0, 0, 0, .1);
    font-size: 18px;
    position: relative;
    z-index: 1;
}

.menu-boxes .menu-boxes-items:hover {
        box-shadow: 0 15px 25px -10px rgba(0, 0, 0, 0.3); 
}

.menu-boxes .menu-boxes-items .change-image-img-2 {
  width: 100%!important;
}


a.box-link {
    display: block;
    color: #04326e;
}



.menu-boxes .first-in-row, .grid-10 .row-fluid [class*="span"]:nth-child(2) {
        margin-left: 0!important;
    }

@media (min-width: 768px){
    .menu-boxes .menu-boxes-items:hover {
        box-shadow: 0 15px 25px -10px rgba(0, 0, 0, 0.3); 
    }

    .grid-10{
        max-width: 1260px;
    }

    .menu-boxes .row-fluid .span1, .grid-10 .row-fluid .span1 {
        width: 0px!important;
        margin-left: 0;
        margin-right: 0;
    }

    .menu-boxes .row-fluid .span2, .grid-10 .row-fluid .span2 {  
      width: 220px;
      margin-left: 10px;
    }

    .menu-boxes .first-in-row, .grid-10 .row-fluid [class*="span"]:nth-child(2) {
        margin-left: 0!important;
    }

    .menu-boxes .row-fluid [class*="span"]:nth-child(6), .grid-10 .row-fluid [class*="span"]:nth-child(6) {
        margin-right: 0;
    }

}

@media (min-width: 1140px) and (max-width: 1214px) {
  .grid-10 .row-fluid .span2 {
    width: 204px!important;
  }
}

@media (min-width: 768px) {
    .menu-boxes .row-fluid .span1, .grid-10 .row-fluid .span1 {
        width: 0px!important;
        margin-left: 0;
        margin-right: 0;
    }
}

@media (min-width: 768px) and (max-width: 1219px){
    .menu-boxes .row-fluid .span2 {
        width: 19%;
        margin-left: 1.25%;
    }
}

@media (min-width: 768px) and (max-width: 960px){
    .menu-boxes .menu-boxes-items {
        font-size: 12px;
    }
}


/******************* Mobile Version der Boxen auf der Startseite *****************/

 .mobileStartbox-wrapper {
    margin-top: -70px;
    position: relative;
    
  }
  
  
a.mobileStartbox {
	background: #fff;
	display: block;
	padding: 10px 25px 10px 30px;
	box-shadow: 0 15px 25px -10px rgba(0, 0, 0, 0.3);
	margin-bottom: 10px;
  color: #04326e;
  text-transform: uppercase;
  font-size: 18px;
  font-weight: 400;
  
}
  
a.mobileStartbox span {
  margin-left: 25px;
  }

  a.mobileStartbox img {
    width: 50px;
    height: auto;
  
  }



/*************** zusätzliche Border-Klassen **********/


.border-t2 {
    border-top: 2px solid #8c8c8c;
}

.border-t1 {
    border-top: 1px solid #8c8c8c;
}

/****************** Error Pages Header **************/

.error-header h1 {
  font-size: 130px;
}

.error-header h2 {
  font-size: 30px;
}

/****************** Temporary Blogpost Title  **************/

.hero-format span.title {
  font-size: 48px;
  font-weight: bold;
  margin-bottom: .35rem;
  line-height: 1.1;
  letter-spacing: -.05em;
  text-shadow: 0 0 10px rgba(0, 57, 120, 0.8);
}


.author-box {
  background: #f1f1f1;
  padding: 30px;
  margin-bottom: 30px;
}

img.author-avatar {
  border-radius: 50%;
}


@media (max-width: 767px) {
img.author-avatar {
 	 max-width: 200px;
  display: block;
  margin: 0 auto;
}
}

.hs-common-confirm-message {
    background-color: #f1f1f1!important;
    border: 1px solid #003978 !important;
    color: #003978 !important;
    font-size: 15px !important;
    border-radius: 0!important;
    padding: 30px !important;
    margin: 8px 0px 8px 0px !important;
}


.ss-buttons ul li a {
   	font-size: 20px;
}
    
.ss-buttons ul li {
   display: inline;
   margin-right: 15px;
}
    
.ss-buttons ul {
   padding-left: 0;
}
    
a.sslinkedin {
  background: #3A72B4;
  padding: 5px;
}

a.ssxing{
  background: #327474;
  padding: 5px;
}

a.ssfacebook{
  background: #3b5998;
  padding: 5px;
}

a.sstwitter{
  background: #559AF1;
  padding: 5px;
}

a.ssmail{
  background: #f8ae3f;
  padding: 5px;
}

a.sswhatsapp{
  background: #60EA76;
  padding: 5px;
}
    
    @media (max-width: 767px){
        .ss-buttons {
            margin-top: 30px;
        }
        
        .ss-buttons ul li {
            display: inline;
            margin-right: 4px;
        }

        .ss-buttons ul li.mobileOnly{
            margin-right: 0;
        }
}
    
    
    
@media (min-width: 767px) {
    .mobileOnly {
        display: none!important;
    }
    
}


.listing-template .section-intro h2{
  font-size: 24px;
  font-weight: normal;
  line-height: 1.3;
  color: #51697b;

}
  


/******** Classes for angled backgrounds ****/

.angle--top-left {
  position: relative;
  overflow: hidden;
  -webkit-clip-path: polygon(0 calc(0% + 4vw), 100% 0, 100% 100%, 0 100%);
          clip-path: polygon(0 calc(0% + 4vw), 100% 0, 100% 100%, 0 100%);
}

@supports not ((-webkit-clip-path: polygon(0 calc(0% + 4vw), 100% 0, 100% 100%, 0 100%)) or (clip-path: polygon(0 calc(0% + 4vw), 100% 0, 100% 100%, 0 100%))) {
  .angle--top-left::before, .angle--top-left::after {
    content: "";
    position: absolute;
    left: 0;
    /*z-index: 10;*/
    display: block;
    border-style: solid;
  }
  .angle--top-left::before {
    top: 0;
    border-width: 5vw 100vw 0 0;
    border-color: #fff transparent transparent transparent;
  }
}

.angle--top-right {
  position: relative;
  overflow: hidden;
  -webkit-clip-path: polygon(0 0, 100% calc(0% + 4vw), 100% 100%, 0 100%);
          clip-path: polygon(0 0, 100% calc(0% + 4vw), 100% 100%, 0 100%);
}

@supports not ((-webkit-clip-path: polygon(0 0, 100% calc(0% + 4vw), 100% 100%, 0 100%)) or (clip-path: polygon(0 0, 100% calc(0% + 4vw), 100% 100%, 0 100%))) {
  .angle--top-right::before, .angle--top-right::after {
    content: "";
    position: absolute;
    left: 0;
    /*z-index: 10;*/
    display: block;
    border-style: solid;
  }
  .angle--top-right::before {
    top: 0;
    border-width: 5vw 0 0 100vw;
    border-color: #fff transparent transparent transparent;
  }
}

.angle--bottom-left {
  position: relative;
  overflow: hidden;
  -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0 calc(100% - 4vw));
          clip-path: polygon(0 0, 100% 0, 100% 100%, 0 calc(100% - 4vw));
}

@supports not ((-webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0 calc(100% - 4vw))) or (clip-path: polygon(0 0, 100% 0, 100% 100%, 0 calc(100% - 4vw)))) {
  .angle--bottom-left::before, .angle--bottom-left::after {
    content: "";
    position: absolute;
    left: 0;
    /*z-index: 10;*/
    display: block;
    border-style: solid;
  }
  .angle--bottom-left::after {
    bottom: 0;
    border-width: 0 100vw 5vw 0;
    border-color: transparent transparent #fff transparent;
  }
}

.angle--bottom-right {
  position: relative;
  overflow: hidden;
  -webkit-clip-path: polygon(0 0, 100% 0, 100% calc(100% - 4vw), 0 100%);
          clip-path: polygon(0 0, 100% 0, 100% calc(100% - 4vw), 0 100%);
}

@supports not ((-webkit-clip-path: polygon(0 0, 100% 0, 100% calc(100% - 4vw), 0 100%)) or (clip-path: polygon(0 0, 100% 0, 100% calc(100% - 4vw), 0 100%))) {
  .angle--bottom-right::before, .angle--bottom-right::after {
    content: "";
    position: absolute;
    left: 0;
    /*z-index: 10;*/
    display: block;
    border-style: solid;
  }
  .angle--bottom-right::after {
    bottom: 0;
    border-width: 0 0 5vw 100vw;
    border-color: transparent transparent #fff transparent;
  }
}

.angle--both-left-left {
  position: relative;
  overflow: hidden;
  -webkit-clip-path: polygon(0 calc(0% + 4vw), 100% 0, 100% 100%, 0 calc(100% - 4vw));
          clip-path: polygon(0 calc(0% + 4vw), 100% 0, 100% 100%, 0 calc(100% - 4vw));
}

@supports not ((-webkit-clip-path: polygon(0 calc(0% + 4vw), 100% 0, 100% 100%, 0 calc(100% - 4vw))) or (clip-path: polygon(0 calc(0% + 4vw), 100% 0, 100% 100%, 0 calc(100% - 4vw)))) {
  .angle--both-left-left::before, .angle--both-left-left::after {
    content: "";
    position: absolute;
    left: 0;
    /*z-index: 10;*/
    display: block;
    border-style: solid;
  }
  .angle--both-left-left::before {
    top: 0;
    border-width: 5vw 100vw 0 0;
    border-color: #fff transparent transparent transparent;
  }
  .angle--both-left-left::after {
    bottom: 0;
    border-width: 0 100vw 5vw 0;
    border-color: transparent transparent #fff transparent;
  }
}

.angle--both-right-right {
  position: relative;
  overflow: hidden;
  -webkit-clip-path: polygon(0 0, 100% calc(0% + 4vw), 100% calc(100% - 4vw), 0 100%);
          clip-path: polygon(0 0, 100% calc(0% + 4vw), 100% calc(100% - 4vw), 0 100%);
}

@supports not ((-webkit-clip-path: polygon(0 0, 100% calc(0% + 4vw), 100% calc(100% - 4vw), 0 100%)) or (clip-path: polygon(0 0, 100% calc(0% + 4vw), 100% calc(100% - 4vw), 0 100%))) {
  .angle--both-right-right::before, .angle--both-right-right::after {
    content: "";
    position: absolute;
    left: 0;
    /*z-index: 10;*/
    display: block;
    border-style: solid;
  }
  .angle--both-right-right::before {
    top: 0;
    border-width: 5vw 0 0 100vw;
    border-color: #fff transparent transparent transparent;
  }
  .angle--both-right-right::after {
    bottom: 0;
    border-width: 0 0 5vw 100vw;
    border-color: transparent transparent #fff transparent;
  }
}

.angle--both-left-right {
  position: relative;
  overflow: hidden;
  -webkit-clip-path: polygon(0 calc(0% + 4vw), 100% 0, 100% calc(100% - 4vw), 0 100%);
          clip-path: polygon(0 calc(0% + 4vw), 100% 0, 100% calc(100% - 4vw), 0 100%);
}

@supports not ((-webkit-clip-path: polygon(0 calc(0% + 4vw), 100% 0, 100% calc(100% - 4vw), 0 100%)) or (clip-path: polygon(0 calc(0% + 4vw), 100% 0, 100% calc(100% - 4vw), 0 100%))) {
  .angle--both-left-right::before, .angle--both-left-right::after {
    content: "";
    position: absolute;
    left: 0;
    /*z-index: 10;*/
    display: block;
    border-style: solid;
  }
  .angle--both-left-right::before {
    top: 0;
    border-width: 5vw 100vw 0 0;
    border-color: #fff transparent transparent transparent;
  }
  .angle--both-left-right::after {
    bottom: 0;
    border-width: 0 0 5vw 100vw;
    border-color: transparent transparent #fff transparent;
  }
}

.angle--both-right-left {
  position: relative;
  overflow: hidden;
  -webkit-clip-path: polygon(0 0, 100% calc(0% + 4vw), 100% 100%, 0 calc(100% - 4vw));
          clip-path: polygon(0 0, 100% calc(0% + 4vw), 100% 100%, 0 calc(100% - 4vw));
}

@supports not ((-webkit-clip-path: polygon(0 0, 100% calc(0% + 4vw), 100% 100%, 0 calc(100% - 4vw))) or (clip-path: polygon(0 0, 100% calc(0% + 4vw), 100% 100%, 0 calc(100% - 4vw)))) {
  .angle--both-right-left::before, .angle--both-right-left::after {
    content: "";
    position: absolute;
    left: 0;
    /*z-index: 10;*/
    display: block;
    border-style: solid;
  }
  .angle--both-right-left::before {
    top: 0;
    border-width: 5vw 0 0 100vw;
    border-color: #fff transparent transparent transparent;
  }
  .angle--both-right-left::after {
    bottom: 0;
    border-width: 0 100vw 5vw 0;
    border-color: transparent transparent #fff transparent;
  }
}

.angle__content {
  display: block;
  width: 100%;
  height: auto;
}

.angle--colour {
  color: #fff;
  background-color: #2196F3;
  text-align: center;
  padding: 10% 0;
}