@font-face {
    font-family: 'Hector';
    src: url('/static/smartwork/fonts/Hector-Regular.woff2') format('woff2'),
        url('/static/smartwork/fonts/Hector-Regular.woff') format('woff'),
        url('/static/smartwork/fonts/Hector-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}


@font-face {
  font-family: SuperGBXC;
  src: url("/static/smartwork/fonts/SuperGroteskWeb-CondMedium.eot");
  src: url("/static/smartwork/fonts/SuperGroteskWeb-CondMedium.eot?#iefix") format('embedded-opentype'),
  		url("/static/smartwork/fonts/SuperGroteskWeb-CondMedium.woff") format("woff");
	font-weight:600;
}

@font-face {
  font-family: 'Open Sans';
  src: url('/static/smartwork/fonts/OpenSans-Regular.eot');
  src: url('/static/smartwork/fonts/OpenSans-Regular.eot?#iefix') format('embedded-opentype'),
    url('/static/smartwork/fonts/OpenSans-Regular.woff2') format('woff2'),
    url('/static/smartwork/fonts/OpenSans-Regular.woff') format('woff'),
    url('/static/smartwork/fonts/OpenSans-Regular.ttf') format('truetype'),
    url('/static/smartwork/fonts/OpenSans-Regular.svg#OpenSans-Regular') format('svg');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'Open Sans';
  src: url('/static/smartwork/fonts/OpenSans-SemiBold.eot');
  src: url('/static/smartwork/fonts/OpenSans-SemiBold.eot?#iefix') format('embedded-opentype'),
    url('/static/smartwork/fonts/OpenSans-SemiBold.woff2') format('woff2'),
    url('/static/smartwork/fonts/OpenSans-SemiBold.woff') format('woff'),
    url('/static/smartwork/fonts/OpenSans-SemiBold.ttf') format('truetype'),
    url('/static/smartwork/fonts/OpenSans-SemiBold.svg#OpenSans-SemiBold') format('svg');
  font-weight: 600;
  font-style: normal;
}

@font-face {
  font-family: 'Open Sans';
  src: url('/static/smartwork/fonts/OpenSans-Bold.eot');
  src: url('/static/smartwork/fonts/OpenSans-Bold.eot?#iefix') format('embedded-opentype'),
    url('/static/smartwork/fonts/OpenSans-Bold.woff2') format('woff2'),
    url('/static/smartwork/fonts/OpenSans-Bold.woff') format('woff'),
    url('/static/smartwork/fonts/OpenSans-Bold.ttf') format('truetype'),
    url('/static/smartwork/fonts/OpenSans-Bold.svg#OpenSans-Bold') format('svg');
  font-weight: bold;
  font-style: normal;
}

h1, h2, h3, h4, h5 {
	font-family: 'Hector', sans-serif;
  font-weight: 300;
  text-transform: lowercase;
}

h1 {
	clear: both;
}

h2 {
  font-size: 36px;
	line-height: 1.2;
}

h2, h3, h4, h5 {
	color: #0079AB;
}
h3 {
  font-size: 24px;
  line-height: 34px;
  /*font-weight: 700;*/
  margin-bottom: 25px;
}

h5, h4 {
	font-size: 2rem;
}

h6 {
	font-size: 1.4rem;
  font-weight: 600;
}

.h5, .h4 {
  font-size: 2rem;
  font-weight: 300;
  font-family: 'Hector', sans-serif;
  text-transform: lowercase;
  color: #0079AB;
}

.text26px {
	font-size:26px;
}

body {
	font-family: 'Open Sans', sans-serif;
  font-weight: 400;
	background: #FFFFFF;
}

#main-nav {
	height: 130px;
  z-index: 100;
}

#main-nav #navigation {
	color: #007D50;
}

#main-nav.active #navigation {
	color: #444444;
}

#main-nav #navigation:focus,
#main-nav #navigation:hover {
	color: #0079AB !important;
}

#main-nav #slide_out_menu ul li a:hover {
	color: #0079AB;
}

.d-flex {display:flex!Important;}
.align-items-start {align-items: flex-start!Important;}
.align-items-center {align-items: center!Important;}
.h-100 {height:100%!Important;}

ul {
	clear: both;
}

ul li {
	color: #35383D;
  font-size: 18px;
  padding: 0 0 10px 20px;
	position: relative;
}

ul li:before {
	position: absolute;
  left: 0;
	content: "\f111";
  font-family: "Font Awesome 5 Free";
  font-size: 1.25rem;
  margin-top: 5px;
}

.btn {
	color: #FFFFFF;
  background-color: #007D50;
  transition: all 0.3s;
}

.btn:hover,
.btn:focus,
.btn:active {
	color: #FFFFFF;
	background-color: #0079AB;
}

.header-split {
	padding: 300px 0 519px 0 !important;
}

.header-split h1 {
	position: absolute;
  top: 300px;
	font-size: 50px;
  text-shadow: 0 1px 2px rgba(0,0,0,0.25);
}

.left {
	float: left;
	text-align: left;
}

.header-split h1 p {
	font-size: 32px !important;
  line-height: 1;
}

.left p {
	color: #0079AB !important;
}

.right {
	float: right;
	text-align: right;
}

.right p {
	color: #FFFFFF !important;
}

.pill {
	background: #E6ECEE;
  line-height: 2.2;
  border-radius: 16px;
  padding: 4px 18px;
}




.m1 { margin: 10px; }
.m2 { margin: 25px; }
.m3 { margin: 50px; }
.m4 { margin: 15px; }
.m5 { margin: 100px; }

.mx-1 { margin-left: 10px; margin-right: 10px; }
.mx-2 { margin-left: 25px; margin-right: 25px; }
.mx-3 { margin-left: 50px; margin-right: 50px; }
.mx-4 { margin-left: 75px; margin-right: 75px; }
.mx-5 { margin-left: 100px; margin-right: 100px; }

.my-1 { margin-top: 10px; margin-bottom: 10px; }
.my-2 { margin-top: 25px; margin-bottom: 25px; }
.my-3 { margin-top: 50px; margin-bottom: 50px; }
.my-4 { margin-top: 75px; margin-bottom: 75px; }
.my-5 { margin-top: 100px; margin-bottom: 100px; }

.mt-0 { margin-top: 0px; }
.mt-1 { margin-top: 10px; }
.mt-2 { margin-top: 25px; }
.mt-3 { margin-top: 50px; }
.mt-4 { margin-top: 75px; }
.mt-5 { margin-top: 100px; }

.mr-1 { margin-right: 10px; }
.mr-2 { margin-right: 25px; }
.mr-3 { margin-right: 50px; }
.mr-4 { margin-right: 75px; }
.mr-5 { margin-right: 100px; }

.mb-1 { margin-bottom: 10px; }
.mb-2 { margin-bottom: 25px; }
.mb-3 { margin-bottom: 50px; }
.mb-4 { margin-bottom: 75px; }
.mb-5 { margin-bottom: 100px; }

.ml-1 { margin-left: 10px; }
.ml-2 { margin-left: 25px; }
.ml-3 { margin-left: 50px; }
.ml-4 { margin-left: 75px; }
.ml-5 { margin-left: 100px; }


.p1 { padding: 10px; }
.p2 { padding: 25px; }
.p3 { padding: 50px; }
.p4 { padding: 15px; }
.p5 { padding: 100px; }

.px-0 { padding-left: 0px; padding-right: 0px; }
.px-1 { padding-left: 10px; padding-right: 10px; }
.px-2 { padding-left: 25px; padding-right: 25px; }
.px-3 { padding-left: 50px; padding-right: 50px; }
.px-4 { padding-left: 75px; padding-right: 75px; }
.px-5 { padding-left: 100px; padding-right: 100px; }

.py-1 { padding-top: 10px; padding-bottom: 10px; }
.py-2 { padding-top: 25px; padding-bottom: 25px; }
.py-3 { padding-top: 50px; padding-bottom: 50px; }
.py-4 { padding-top: 75px; padding-bottom: 75px; }
.py-5 { padding-top: 100px; padding-bottom: 100px; }

.pt-1 { padding-top: 10px; }
.pt-2 { padding-top: 25px; }
.pt-3 { padding-top: 50px; }
.pt-4 { padding-top: 75px; }
.pt-5 { padding-top: 100px; }

.pr-1 { padding-right: 10px; }
.pr-2 { padding-right: 25px; }
.pr-3 { padding-right: 50px; }
.pr-4 { padding-right: 75px; }
.pr-5 { padding-right: 100px; }

.pb-1 { padding-bottom: 10px; }
.pb-2 { padding-bottom: 25px; }
.pb-3 { padding-bottom: 50px; }
.pb-4 { padding-bottom: 75px; }
.pb-5 { padding-bottom: 100px; }

.pl-1 { padding-left: 10px; }
.pl-2 { padding-left: 25px; }
.pl-3 { padding-left: 50px; }
.pl-4 { padding-left: 75px; }
.pl-5 { padding-left: 100px; }


/* ########## Styling RichText-Editor in Verwaltung ########## */
#designbody {
	font-size:12px;
}

/* ########## Styling Editbutton für Redakteure Beginn ########## */
@media only screen and (min-width: 768px) {
  .editButtonForm {
    z-index:1000; right:0; position:absolute;
  }
  .editGlobalButtonMenue {
    padding:0;
    background-color: #ffdddd;
  }
  .editGlobalButtonMenueGn {
    padding:0;
    background-color: #81ff88;					
  }
  .editButtonMenue {
    padding:0;
  }
  .editButtonContainer {
    padding:0;
    color:#3895b1;
  }
  .hideEditButtons {
    display:none;
  }
  #penGlobal {
  	position: fixed;
    top: 0;
    left: 0;
  }
}



@media only screen and (max-width: 767px) {
  .editGlobalButtonMenue, .editButtonContainer, #penGlobal {display:none;}
  .editButtonMenue, .editButtonContainer, #penGlobal {display:none;}
  #theSidebar {display:none;}
  #footer .spaced {padding: 20px 15px 0 15px;}
  
  .left p,
  .right p {
  	display: none;
  }
  
  
}

/* ########### Styling Editbutton für Redakteure Ende ########### */

a {
	text-decoration: none;
  color: #007D50;
}

a:focus,
a:hover {
	color: #0079AB;
}

#footer .socials li a {
	color: #007D50;
  transition: all 0.2s;
}

#footer .socials li a:hover {
	color: #0079AB;
}

#footer .socials li:before {
	display: none;
}

.error {color:#cc0000;}
.form-group {
	width: 100%;
	margin-bottom:15px !important;
}

#header.folgeseite {
	/*background-image:url(/static/smartwork/images/hg-nav-folgeseite-desktop.jpg);*/ 
  background-position-x: center;
  background-position-y: center; 
  padding: 200px 0 100px;
}

/*#header.folgeseite h1 {color:#000;}
#header.folgeseite p {color:#000;}*/

.partnerText .h4PartnerZusatz {
	font-family: "SuperGBXC", sans-serif;
  font-weight: 600;
  font-size: 2.2rem;
  text-transform: uppercase;
	color: #0079AB;
}
.row.partner span.icon-diamond2 {float:left; line-height:1.1; margin-right:10px;}

.row.fallbeispiel span.icon-diamond2,
.row.diamond span.icon-diamond2 {
	float: left;
  line-height: 1.1;
  margin: 18px 10px 0 0;
}

/*.row.fallbeispiel ul > li {list-style:none; background: rgba(4, 122, 219, 0.1); padding:17px 20px; margin:0 0 6px 0; font-size:16px; border-radius:6px; color:#40577B; font-weight: 500; line-height: 22px;}
.row.fallbeispiel ul > li > ul {margin-top:10px;}
.row.fallbeispiel ul > li > ul > li {background-color:#fff; padding:12px 15px 8px 15px; margin:0 0 4px 0; line-height:18px;}*/
a.btn.btn-blue i {margin-left: 10px; font-size: 14px;}
ul.listContactData li {float:left; margin-right:29px;}
ul li.highlight {background: #ee8259 !important;color: #ffffff !important;}

.icon-diamond2 .path1:before,
.icon-diamond2 .path2:before,
.icon-diamond2 .path3:before {
	color: #FEC937;
}

p {
	font-weight: 300;
  color: #35383D;
  word-break: break-word;
  clear: both;
}

.SignHolder {
	float: left;
}

.content_box {
	height: 100%;
  background: #FFF;
  box-shadow: 0 10px 20px rgba(0,0,0,0.2);
  border-radius: 30px;
  padding: 20px 40px;
}

.zitat_box {
	height: 100%;
	background: #F6F6F6;
  padding: 20px 40px;
}

.zitat_box p {
	font-style: italic;
}

#header .header_iphone {
	width: 350px;
	margin-left: -170px;
}

.owl-nav {
  font-size: 2rem;
}

/* ########## Styling für verschiedene Displaygrößen Beginn ########## */

@media only screen and (max-width: 436px) {
	section#secFallbeispiele .clearfix:first-child {height:0 !important;}
  #header.folgeseite {/*background-image:url(/static/smartwork/images/hg-nav-folgeseite-mobile.jpg);*/ background-position-x:center; background-position-y:inherit; padding: 200px 0 100px;}
h1 {font-size:32px !important;}
  /*#main-nav {background-image: url(/static/smartwork/images/hg-nav-folgeseite.jpg);}*/
  #header.folgeseite {padding:120px 0 50px;}
  
	.partnerText .h4PartnerZusatz {}
	
  /*.partnerText .h4PartnerZusatz+.clearfix {height:30px;}*/
  .partnerText h4 {margin:20px 0 7px 0; font-size:22px;}
  .row.partner span.icon-diamond2 {line-height:1.6;}
  .row.partner span.h4PartnerZusatz {line-height:0; margin-left:0; margin-bottom:40px; display:block;}
  .row.fallbeispiel span.icon-diamond2 {line-height:1.6;}
  
  .row.fallbeispiel span.h4PartnerZusatz {
  }
  
  #footer .container.footer-container {border-top:2px solid #bbb;}
  ul.listContactData li {float:none; margin-right:0; line-height:2;}
  .border_spacer{width: 200px !important; margin-top: 5px;}
  #header p{top: 5px!important;}

}
@media only screen and (min-width: 768px) {

}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .footerAdress, .footerLinks {float:left;}
}
@media only screen and (min-width: 768px) and (max-width: 1199.98px) {
  .no-gutters-md {padding:0!Important;}
}

@media only screen and (max-width: 991.98px) {
  #aktDate {position:relative; bottom:0px; left:42%; font-size:12px; display: inline-block;}
	.beispielbox h4{font-size: 22px !important;}
  .boxedelement{min-height: 120px !important;}
 	div.col-md-3.feature-item.beispielbox{padding-right: 15px;padding-left: 15px;margin-bottom: 10px;}
  section.headH2 h2 {
    color:#fff!Important;
    -webkit-text-fill-color: unset;
  }
  section.headH2 {
    margin: 100px 0 -40px 0!Important;
  }
  #main-nav #slide_out_menu ul {
    margin-top: 0;
  }
  
  #main-nav #slide_out_menu li {
  	margin-right: 10px !important;
  }
}

@media only screen and (min-width: 992px) {
  #aktDate {position:relative; bottom:-3px; left:42%; display: inline-block;}
	div.col-md-3.feature-item.beispielbox{padding-right: 15px;padding-left: 15px;margin-bottom: 10px;}
  #main-nav ul{
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-left: 0!Important;
  }
  #main-nav ul li{
    padding: 0;
    display: block;
    margin-right: unset!Important;
  }
  section.headH2 {
    margin: 0 0 40px 0!Important;
  }
  section.headH2 h2 {
    font-size: 50px!Important;
    color:#007D50!Important;
    -webkit-text-fill-color: unset;
  }
}

@media (min-width: 1420px) {
  .container {width: 1400px;}
  .boxedelement{min-height: 160px;}
}

@media (min-width: 1200px) {
	.beispielbox h4{font-size: 22px !important;}
}


@media (min-width:992px) {
	.nopadding-992 {padding:0!important;}
  
}


/* ########### Styling für verschiedene Displaygrößen Ende ########### */


body > section:not(#header) {margin-top:20px;margin-bottom:20px;}

#header {
	z-index: 50;
}

.boxedelement {
    padding: 0;
    font-size: 16px;
    border-radius: 6px;
    color: #FFFFFF;
    font-weight: 500;
    line-height: 22px;
}

a:hover.nodecoration {text-decoration:none;}
.beispielbox h4 {font-size:18px;}
.beispielbox .kategorie {font-size:14px;}

.img-responsive {display:inline-block;}

#secFallbeispiele {
	position: relative;
	z-index: 10;
}

#trenner {
    background-image: url(/static/smartwork/images/bg_gradient_smartwork.jpg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
    width: 100%;
    padding: 120px 0 40px 0;
    margin-bottom: 80px !important;
}

#trenner h5 {
	color: #FFFFFF;
  margin: 20px 0 10px 0;
}

input[type="text"], input[type="email"], textarea { 
	background: #FFFFFF;
  padding: 10px 20px;
  border-radius: 6px;
}

.checkbox label {
	color: #FFFFFF;
}

#footer {
	background: #E6ECEE;
}

#footer .footer-container {padding-top:100px;}

#header p {
	position: relative;
  /*font-weight: 700;*/
  top: 20px;
}

#header p .normal{
	font-size: 1.8em;
}

#header p sup{

}

#header p .column{
  font-size: 2em;
  position: relative;
  top: 2px;
}

#header p .small_heading{
  font-size: 0.8em;
  padding: 0 5px;
  position: relative;
  top: -5px;
}

.row-flex {
	display: flex;
  flex-wrap: wrap;
}

.border_spacer{
  height: 0;
  width: 300px;
  border-top: 2px solid #fff;
  margin: auto;
  margin-top: 0;
}

/*.boxedelement{
	min-height: 300px;
}*/

.beispielbox .boxedelement {
	height: 100%;
	background: #E6ECEE;
  border-radius: 6px;
  padding: 10px 30px 30px 30px;
}
.margin-auto {
  margin: 0 auto;
  float: unset;
}
.centerBlock {
  width: 100%;
  text-align: center;
}

.img-shadow {
	box-shadow: 0 1px 2px rgba(0,0,0,0.25);
  border-radius: 25px;
}

#main-nav ul.c-green li a {
	color: #007D50;
}

#main-nav ul.c-green li a:hover {
	color: #0079AB;
}

#main-nav ul li:before {
	display: none;
}

#main-nav ul li a {
	transition: all 0.3s; 
}

#main-nav ul li a:hover {
	color: #ADBBBF;
}

#main-nav.active a {
	color: #007D50;
}

#main-nav.active a:hover {
	color: #0079AB;
}


.btn-blue {
	background-color: rgba(255,255,255,0.3);
	transition: all 0.3s;
}

.btn-blue:hover {
	background-color: rgba(255,255,255,0.5);
}

.btn-color {
	color: #35383D !important;
	background-color: #E6ECEE;
	transition: all 0.3s;
}

.btn-color:hover,
.btn-color:focus,
.btn-color:active {
	background-color: #ADBBBF;
}

h2 {
	margin-bottom: 20px;
}

.mt-20 {
 margin-top: 20px !important;
}

.btn-green {
	transition: all 0.3s;
}

.btn-green:hover {
	background-color: #64ad4e;
}

#subscribe {
	background: #0079AB;
  background-image: url("/static/smartwork/images/bg_gradient_smartwork.jpg");
  background-size: cover;
}

#subscribe h2,
#subscribe h4,
#subscribe p {
	color: #FFFFFF;
}

#subscribe a {
	color: rgba(255,255,255,0.7);
  transition: all 0.3s;
}

#subscribe a:hover {
	color: rgba(255,255,255,1);
  text-decoration: none;
}

.form-control {
	-moz-appearance: none;
  -webkit-appearance: none;
  appearance: none;
	height: 50px;
  font-size: 16px;
  padding: 10px 20px;
}

.icon-diamond4 {
	opacity: 0;
}

#main-nav.active {
	height: 100px;
}

#main-nav .event-logo {
	height: 44px;
	background: url("/static/smartwork/images/Sign.svg") no-repeat;
  background-size: 44px;
}

.event-logo-subsites {
	height: 44px;
	background: url("/static/smartwork/images/Sign-Neg.svg") no-repeat;
  background-size: 44px;
}

#main-nav.active .event-logo,
#main-nav.active .event-logo-subsites {
	height: 44px;
	background: url("/static/smartwork/images/Sign-Col.svg") no-repeat;
  background-size: 44px;
}

#-feature,
#first-feature,
#second-feature,
#third-feature,
#fourth-feature {
	position: relative;
  z-index: 10;
}

#-feature .icon-diamond2,
#first-feature .icon-diamond2,
#second-feature .icon-diamond2,
#third-feature .icon-diamond2,
#fourth-feature .icon-diamond2 {
	float: left;
  margin: 0 10px 0 0;
}

.no-margintop {
	margin: 0 10px 0 0 !important;
}

.bg-yellow {
	background: -moz-linear-gradient(45deg,  rgba(173,129,9,1) 0%, rgba(255,195,40,1) 95%, rgba(255,255,255,0) 95%, rgba(255,255,255,0) 100%);
	background: -webkit-linear-gradient(45deg,  rgba(173,129,9,1) 0%,rgba(255,195,40,1) 95%,rgba(255,255,255,0) 95%,rgba(255,255,255,0) 100%);
	background: linear-gradient(45deg,  rgba(173,129,9,1) 0%,rgba(255,195,40,1) 95%,rgba(255,255,255,0) 95%,rgba(255,255,255,0) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ad8109', endColorstr='#00ffffff',GradientType=1 );
  padding: 10px 30px;
}

.bg-yellow .partnerText {
	margin: 30px 0 25px 0;
}

.bg-yellow p {
	color: #FFFFFF;
  font-style: italic;
}

.bg-yellow p.quote {
	font-style: normal;
}

.timeline {
	background: rgba(255,255,255,0.15);
  border-radius: 10px;
  padding: 25px;
  margin: 0 0 20px 0;
}

.timeline_year {
	float: left;
  clear: both;
	font-family: "SuperGBXC", sans-serif;
  font-weight: 600;
  font-size: 24px;
  text-transform: uppercase;
  color: #FFFFFF;
  margin-bottom: 10px;
}

.roundedCorner img {
	border-radius: 20px;
}

#main-nav ul li {
  display: inline-block;
  margin-right: 40px!Important;
}
section.headH2 .boxH2 {
  z-index:10;
}

#footer .made-by {
  color: #35383D;
}

.ap-box p {
  font-size: 14px;
  line-height: 1.4;
}

.ap-box a {
  font-size: 2.2rem;
}

.ansprechpartner {
  border-radius: 0 50% 50% 50%;
  box-shadow: 0px 2px 4px rgba(0,0,0,0.15);
}

.clearfix {
  clear: both;
}

.wechDormid {
	position:absolute;
  left:-10000px;
  top:-10000px;
}

.example-animation .typing-animation {
	width: 100%;
	overflow-x: auto;
  white-space: nowrap;
  font-size: 18px;
  /*font-weight: 700;*/
  background-color: #FFF;
  background-image: url("/static/smartwork/images/right-arrow-in-circle_gradient.svg");
  background-repeat: no-repeat;
  background-size: 40px;
  background-position: right 10px center;
  border: 3px solid #0079AB;
  border-radius: 33px;
  padding: 30px 60px 30px 30px;
}

.owl-section {
	background: #d5e8f5;
	background: linear-gradient(274deg,rgba(213, 232, 245, 1) 0%, rgba(231, 245, 225, 1) 100%);
}

.owl-theme .owl-nav {
}

.owl-theme .owl-nav button {
	margin: 5px 10px !important;
}

.owl-carousel .owl-item img {
	max-height: 500px;
  width: unset !important;
  margin: 0 auto;
}

.img-description {
	font-size: 1.6rem;
  text-align: center;
}

@media only screen and (max-width: 1199px) {

	#header p {
  	top: 80px;
  }

}

@media only screen and (max-width: 699px) {
  /*** iPhone Screens ***/
  .no-mobile {
  	display: none;
  }
  
  .header-split {
  	padding: 72px 0 519px 0 !important;
  }
}
