/* POPUP MESSAGE */

.ui-dialog.webform-confirmation-modal {background:rgba(215, 6, 42, .85);}
.ui-dialog.webform-confirmation-modal .ui-widget-content {color:white;border: 0px solid #dddddd!important;}
.ui-dialog.webform-confirmation-modal .ui-widget-header {
  border: 0px solid #dddddd!important;
  background: rgba(0, 0, 0, 0);
  color: white;
  font-weight: 700;
  text-transform: uppercase;
}
.ui-dialog.webform-confirmation-modal .ui-dialog-titlebar-close {
  position: absolute;
  right: .3em;
  top: 50%;
  width: 20px;
  margin: -10px 0 0 0;
  padding: 1px;
  height: 20px;
  border:0px!important;
  outline: none!important;
  background:transparent!important;
  background-image: url("../images/webform-close.png")!important;
  background-size: contain!important;
  background-position: 0 0!important;
  background-repeat: no-repeat!important;
}
.widget-content-spacer {padding-top:10px!important;float:left;}

@media (max-width: 767px) {
.ui-dialog.webform-confirmation-modal {width:80%!important;}
}









#block-system-main .block-content .content .form-item.form-type-item,
#block-system-main .block-content .links.inline {display:none;}



.anleser-rechts {padding:0px 0px 0px 0px;}
.anleser-rechts h1.black { font-size: 36px; line-height: 40px; margin:0px 0px 15px 0px; color:#009EE6!important;-moz-hyphens: auto!important;
   -o-hyphens: auto!important;
   -webkit-hyphens: auto!important;
   -ms-hyphens: auto!important;
   hyphens: auto!important; }
.anleser-rechts h2.black { font-size: 34px; line-height: 38px; margin:0px 0px 0px 0px; color:#AAAAAA!important; font-weight:300;-moz-hyphens: auto!important;
   -o-hyphens: auto!important;
   -webkit-hyphens: auto!important;
   -ms-hyphens: auto!important;
   hyphens: auto!important;  }
   
@media (max-width: 1600px) {
	.anleser-rechts h1.black { font-size: 28px; line-height: 32px; margin:0px 0px 15px 0px; color:#009EE6!important; }
.anleser-rechts h2.black { font-size: 26px; line-height: 30px; margin:0px 0px 0px 0px; color:#AAAAAA!important; font-weight:300;  }}

@media (min-width: 768px) {
  .row.equal { display: flex; flex-wrap: wrap;}
  .equal-div { display: flex; display: -webkit-flex; flex-wrap: wrap;}
}

@media (max-width: 768px) {
.height-xs-400 {height:400px;}
.anleser-rechts {padding:30px 30px 30px 30px;}
.editorial .anleser-rechts {padding:30px 0px 30px 0px;}}

@media (max-width: 570px) {
.height-xs-400 {height:250px;}}


@media (max-width: 991px) { .height-sm-400 {height:400px;}}




@media (max-width: 768px) {
	.responsive-hidden {display:none;}
}

.responsive-show {display:none;}

@media (max-width: 768px) {
	.responsive-show {display:block;}
}



.text-r-xs-l p,
.text-r-xs-l a{text-align:right!important;}

@media (max-width: 767px) {
.text-r-xs-l p {text-align:left!important;}
}


.col-left h1 {text-align:right!important;}

.col-left p {text-align:right;}

@media (min-width: 767px) {
.show-col-xs {display:none;}
}

@media (max-width: 767px) {
.show-col-xs {display:block;}
}

@media (max-width: 1199px) {
.margin-10_col-md {margin-top:10px;}
	
.margin-20_col-md {margin-top:20px;}

.margin-25_col-md {margin-top:25px;}
	
.margin-30_col-md {margin-top:30px;}
	
.margin-40_col-md {margin-top:40px;}
	
.margin-50_col-md {margin-top:50px;}
	
.margin-60_col-md {margin-top:60px;}
	
.margin-70_col-md {margin-top:70px;}
	
.margin-80_col-md {margin-top:80px;}
	
.margin-90_col-md {margin-top:90px;}
	
.margin-100_col-md {margin-top:100px;}
}

@media (max-width: 991px) {
.margin-10_col-sm {margin-top:10px;}
	
.margin-20_col-sm {margin-top:20px;}

.margin-25_col-sm {margin-top:25px;}
	
.margin-30_col-sm {margin-top:30px;}
	
.margin-40_col-sm {margin-top:40px;}
	
.margin-50_col-sm {margin-top:50px;}
	
.margin-60_col-sm {margin-top:60px;}
	
.margin-70_col-sm {margin-top:70px;}
	
.margin-80_col-sm {margin-top:80px;}
	
.margin-90_col-sm {margin-top:90px;}
	
.margin-100_col-sm {margin-top:100px;}
}

@media (max-width: 767px) {
.col-left h1 {text-align:left!important;}

.col-left p {text-align:left;}

.hide_col-xs {display:none;}

.margin-10-float_col-xs {margin-top:10px;float:left;width:100%;}
	
.margin-20-float_col-xs {margin-top:20px;float:left;width:100%;}
	
.margin-30-float_col-xs {margin-top:30px;float:left;width:100%;}
	
.margin-40-float_col-xs, 
.margin-40_col-sm.margin-40_col-sm {margin-top:40px;float:left;width:100%;}
	
.margin-50-float_col-xs {margin-top:50px;float:left;width:100%;}
	
.margin-60-float_col-xs {margin-top:60px;float:left;width:100%;}
	
.margin-70-float_col-xs {margin-top:70px;float:left;width:100%;}
	
.margin-80-float_col-xs {margin-top:80px;float:left;width:100%;}
	
.margin-90-float_col-xs {margin-top:90px;float:left;width:100%;}
	
.margin-100-float_col-xs {margin-top:100px;float:left;width:100%;}
	
.margin-10_col-xs {margin-top:10px;}
	
.margin-20_col-xs {margin-top:20px;}

.margin-25_col-xs {margin-top:25px;}
	
.margin-30_col-xs {margin-top:30px;}
	
.margin-40_col-xs {margin-top:40px;}
	
.margin-50_col-xs {margin-top:50px;}
	
.margin-60_col-xs {margin-top:60px;}
	
.margin-70_col-xs {margin-top:70px;}
	
.margin-80_col-xs {margin-top:80px;}
	
.margin-90_col-xs {margin-top:90px;}
	
.margin-100_col-xs {margin-top:100px;}

.padding-10_col-xs {margin-top:10px;}
	
.padding-20_col-xs {margin-top:20px;}
	
.padding-30_col-xs {margin-top:30px;}
	
.padding-40_col-xs {margin-top:40px;}
	
.padding-50_col-xs {margin-top:50px;}
	
.padding-60_col-xs {margin-top:60px;}
	
.padding-70_col-xs {margin-top:70px;}
	
.padding-80_col-xs {margin-top:80px;}
	
.padding-90_col-xs {margin-top:90px;}
	
.padding-100_col-xs {margin-top:100px;}

.padding-lr-10_col-xs {margin-left:10px; margin-right:10px;}
	
.padding-lr-20_col-xs {margin-left:20px; margin-right:20px;}

.padding-lr-30_col-xs {margin-left:30px; margin-right:30px;}

.padding-lr-40_col-xs {margin-left:40px; margin-right:40px;}

.padding-lr-50_col-xs {margin-left:50px; margin-right:50px;}

.padding-lr-60_col-xs {margin-left:60px; margin-right:60px;}

.padding-lr-70_col-xs {margin-left:70px; margin-right:70px;}

.padding-lr-80_col-xs {margin-left:80px; margin-right:80px;}

.padding-lr-90_col-xs {margin-left:90px; margin-right:90px;}

.padding-lr-100_col-xs {margin-left:100px; margin-right:100px;}
	
.nopadding-col-xs {padding: 0px;}

.textcenter_col-xs p {
    text-align:center!important;
}
}










/* ANPASSUNGEN SHORTCODE: title */

.mksuite-title-color-red {color:#A21F47!important;}
.mksuite-titlebg-color-orange {background:#FF9E3F;color:white;}
.mksuite-title-color-blue {color:#0092d3!important;}
.mksuite-title-color-purple {color:#720b44;}
.mksuite-title-color-green {color:#74af27!important;}
.mksuite-title-color-darkgreen {color:#008e36;}
.gray {color:#575656!important;}

.bg-green h1,
.bg-green h2,
.bg-green h3,
.bg-green h4,
.bg-green h5,
.bg-green h6,
.bg-green p,
.bg-green li{ color:white!important; }

.fw-300 {font-weight:300;}
.fw-400 {font-weight:400;}
.fw-600 {font-weight:600;}
.fw-700 {font-weight:700;}
.fw-800 {font-weight:800;}


.table-striped>tbody>tr:nth-child(odd){background-color:transparent}
.table>thead>tr>th,.table>tbody>tr>th,.table>tfoot>tr>th,.table>thead>tr>td,.table>tbody>tr>td,.table>tfoot>tr>td{padding:8px;line-height:1.42857143;vertical-align:top;border-top:0px solid #ddd}
.table>thead>tr>th{vertical-align:bottom;border-bottom:0px solid #ddd}
.table>tbody+tbody{border-top:0px solid #ddd}
.table-bordered{border:0px solid #ddd}
.table-bordered>thead>tr>th,.table-bordered>tbody>tr>th,.table-bordered>tfoot>tr>th,.table-bordered>thead>tr>td,.table-bordered>tbody>tr>td,.table-bordered>tfoot>tr>td{border:0px solid #ddd}


/* SPRACHUMSCHALTER */

#sprache {width:60px; height:30px; position:absolute; right:80px; top:37px;}
#sprache ul {list-style:none; margin:0px;padding:0px;}
#sprache ul li {list-style:none; margin:0px;padding:0px;float:left; margin:0px 5px;}
#sprache ul li a{font-size:13px; color:#999;}
#sprache ul li a:hover{color:#A21F47;}

/* HEADERBILD */

#headermotiv {
	background:url(../images/header-startseite-gc-big.jpg) 50% 0 no-repeat fixed;
	-webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
	position:relative;
}

@media (max-width: 767px) {
#headermotiv {
	background:url(../images/header-startseite-gc-small.jpg) 50% 0 no-repeat fixed;
	-webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
	position:relative;
	}}
/* STARTSEITE HEADER */

.start-header-txt {background: rgba(164,27,70,0.8); padding:30px 20px 30px 20px;}

.start-header-txt h1{
	font-size: 44px!important;
	line-height: 46px!important;
	margin: 0px 0px 0px 0px;
	padding: 0px!important;
	color:white!important;
	font-weight:400;
	letter-spacing:0px!important;
}

.start-header-txt h2{
	font-size: 30px!important;
	line-height: 32px!important;
	margin: 0px 0px 0px 0px;
	padding: 0px!important;
	color:white!important;
	font-weight:400;
	letter-spacing:0px!important;
}

@media (max-width: 992px) {
.start-header-txt {background: rgba(164,27,70,0.8); padding:20px 20px 20px 20px;}
.start-header-txt h1{
	font-size: 32px!important;
	line-height: 35px!important;
	margin: 0px 0px 0px 0px;
	padding: 0px!important;
	color:white!important;
	font-weight:400;
	letter-spacing:0px!important;
}

.start-header-txt h2{
	font-size: 26px!important;
	line-height: 31px!important;
	margin: 0px 0px 0px 0px;
	padding: 0px!important;
	color:white!important;
	font-weight:400;
	letter-spacing:0px!important;
}}

@media (max-width: 767px) {
.start-header-txt {background: rgba(164,27,70,0.8); padding:20px 15px 20px 15px;}

.start-header-txt h1{
	font-size: 18px!important;
	line-height: 21px!important;
	margin: 0px 0px 0px 0px;
	padding: 0px!important;
	color:white!important;
	font-weight:400;
	letter-spacing:0px!important;
}

.start-header-txt h2{
	font-size: 14px!important;
	line-height: 17px!important;
	margin: 0px 0px 0px 0px;
	padding: 0px!important;
	color:white!important;
	font-weight:400;
	letter-spacing:0px!important;
}
}

.headline-start {
	position:absolute; left:10%;top:46%; background:#D7062A; color:white;padding:10px 25px 5px 10px;}

.headline-start p {
	color:white;margin:0px;font-size:42px;line-height:48px;}

.headline-start-marker {
width:44px;height:34px;background:transparent;right:-54px;top:-10px;position:absolute;background-repeat: repeat;
	background-size: auto;
	background-image: url(../images/headline-start-marker.png);}

@media (max-width: 991px) {
	.headline-start p {
	color:white;margin:0px;font-size:34px;line-height:38px;}}

@media (max-width: 767px) {
	
	.headline-start {
	position:absolute; left:50%; top:65%; background:transparent; color:white;padding:0px 0px 0px 0px;}
	
	#headline-start-center {
  float: left;
  position: relative;
  left: -50%;
}
	.headline-start-marker {
width:44px;height:34px;background:transparent;right:-44px;top:0px;position:absolute;background-repeat: repeat;
	background-size: auto;
	background-image: url(../images/headline-start-marker.png);}
	
	.headline-start p {
	color:white;margin:0px;font-size:22px;line-height:26px;background:#D7062A;padding:10px 10px 10px 10px;}}


@media (max-width: 520px) {
	
	.headline-start p {
	color:white;margin:0px;font-size:16px;line-height:20px;background:#D7062A;padding:10px 10px 10px 10px;}}


@media (max-height: 500px) {
	
	.headline-start {display:none;}}






#parallaxmotiv {
	background:url(../images/zwischenbild1.jpg) 50% 0 no-repeat fixed;
	-webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
	position:relative;
}

@media (max-width: 767px) {
#parallaxmotiv {
	background:url(../images/zwischenbild1-small.jpg) 50% 0 no-repeat fixed;
	-webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
	position:relative;
}}


.headline-parallax {background:#D7062A; color:white;padding:10px 10px 1px 18px;margin-top:90px;}

.headline-parallax p {
	color:white;margin:0px;font-size:24px;line-height:28px;word-wrap:break-word;-moz-hyphens: auto;
   -o-hyphens: auto;
   -webkit-hyphens: auto;
   -ms-hyphens: auto;
   hyphens: auto;}

@media (max-width: 991px) {
	.headline-parallax p {
	color:white;margin:0px;font-size:20px;line-height:24px;word-wrap:break-word;-moz-hyphens: auto;
   -o-hyphens: auto;
   -webkit-hyphens: auto;
   -ms-hyphens: auto;
		hyphens: auto;}}

.headline-parallax-marker {
width:39px;height:28px;background:transparent;left:-24px;top:90px;position:absolute;background-repeat: repeat;
	background-size: auto;
	background-image: url(../images/headline-parallax-marker.png);}


/* STARTSEITE PARALLAX */

.parallax_bck h1{
	margin: 0px 0px 0px 0px;
}

/* ANPASSUNG OWL CAROUSSEL */

.owl-wrapper p,
.owl-wrapper ul {color:white;}


/* SLIDER */

.slider-wrapper ul{
	padding: 0px 0px 15px 15px!important;
	margin: 0px 0px 0px 0px!important;
}

/* FOOTER */

#footer{
    /*text-align: center;
    font-size: 12px;   */
	text-align: left!important;color:#727b82;
}

#socialmedia-links {width:100px;left:50%;position:absolute;margin-left:-50px;}

#footer img {height:34px!important; width:auto!important; text-align: left!important; float:left;margin:0px 10px;}

#footer p {color:white; font-size:14px;line-height:19px;}
#footer a {color:white; font-size:14px;line-height:19px;}
#footer a:hover {color:black;}



/* WEBFORM */

.form-actions {width:100%!important;float:left!important; margin-top:20px!important;}

.webform-component-fieldset {padding:0px!important;}

.webform-component--col-50-3 {padding-right:10px!important;}
.webform-component--col50-4 {padding-left:10px!important;}

@media (max-width: 767px) {
.webform-component--col-50-3 {padding-right:0px!important;}
.webform-component--col50-4 {padding-left:0px!important;}
}


.datenschutz-radio input[type="radio"] {height:30px;float:left!important;}

.datenschutz-radio .webform-element-description {float:left!important; margin-left:30px; margin-top:-25px; font-size:13px;line-height:17px;color: #686868;text-align:left;}

.captcha {width:100%;float:left;padding:20px 0px 10px 0px;}


/*----------------------------------------------
    MOD: MARKER OUTLINE
----------------------------------------------*/
.marker-outline .timeline-marker:before {
  background: transparent;
  border-color: #FF6B6B;
}
.marker-outline .timeline-item:hover .timeline-marker:before {
  background: #FF6B6B;
}




.field-name-body .nav {padding:0px!important;margin:0px!important;}
.nav-tabs {padding:0px!important;margin:0px!important;}

/*
 * Tabs
 */

.tpl-tabs{
	border-color: #e5e5e5;
	font-size: 12px;
	font-weight: 400;
	text-transform: uppercase;
	letter-spacing: 1px;	
}
.tpl-tabs > li > a{
    text-decoration: none;
    color: #777;
	font-size: 12px;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
	border-color: #e5e5e5!important;
	margin:0px -1px 0px 0px!important;
}
.tpl-tabs > li > a:hover{
	background:#A21F47!important;
	color:white!important;
	border-bottom:1px solid #A21F47!important;
}
.tpl-tabs li.active a{
	color: white!important;
	border-color: #e5e5e5!important;
	border-bottom:1px solid #A21F47!important;
	background:#A21F47!important;
}
.tpl-tabs-cont{
	padding: 30px 0;
	color: #777;
    line-height: 1.8;
	background:#A21F47;
	
}


.tab-content {padding:40px 40px 20px 40px!important;margin:0px!important;border-left: 1px solid #e5e5e5;border-right: 1px solid #e5e5e5;border-bottom: 1px solid #e5e5e5;}


.accordion > dt{
	margin-bottom: 0px!important;
	text-transform: uppercase;
}

.accordion > dt > a{
	display: block;
	position: relative;
	color: #777;
	text-decoration: none;
	padding: 14px 20px;
	border: 1px solid #e5e5e5;
	text-align:left!important;
	background:white;
	-webkit-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);  
    -moz-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); 
    -o-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);
    -ms-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); 
    transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);
}

.accordion > dt > a:hover{
	text-decoration: none;
	border-color: #F0F0F0;
	background-color: #fcfcfc;
	background-color:#F0F0F0!important;
}

.accordion > dt > a.active{
	border-color: #F0F0F0!important;
	background-color: #F0F0F0!important;
	cursor: default;
}

.accordion > dd{
	/*margin-top:-10px!important;
	margin-bottom: 10px;*/
	margin-bottom: 0px!important;
	padding: 20px 20px 10px 20px!important;
	font-size: 14px;
	line-height: 1.8;
	color: #777;
	background:white;
}


.tbl-color td {color:#727b82!important;}

#faq-kategorie {text-align:left; padding-bottom:70px;}

/*#Content ul {padding:0px; margin:0px 0px 20px 18px;}*/

#Content li {text-align:left;}



.form-submit {background:red;}

.form-actions .btn-mod,
.form-actions a.btn-mod{
    /*-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	padding: 4px 13px;
  	color: #fff;
  	background: #A21F47;
	border: 2px solid transparent;
	font-size: 11px;
	font-weight: 400;
	text-transform: uppercase;
	text-decoration: none;
	letter-spacing: 2px;
    
	-webkit-border-radius: 0;
	-moz-border-radius: 0;
	border-radius: 0;
    
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
	
	-webkit-transition: all 0.2s cubic-bezier(0.000, 0.000, 0.580, 1.000);  
    -moz-transition: all 0.2s cubic-bezier(0.000, 0.000, 0.580, 1.000); 
    -o-transition: all 0.2s cubic-bezier(0.000, 0.000, 0.580, 1.000);
    -ms-transition: all 0.2s cubic-bezier(0.000, 0.000, 0.580, 1.000); 
    transition: all 0.2s cubic-bezier(0.000, 0.000, 0.580, 1.000);*/
	*-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	padding: 4px 20px!important;
	margin-top:-15px;
  	color: #fff;
  	background: #D7062A;
	border: 2px solid transparent;
	font-size: 14px;
	font-weight: 400;
	text-transform: uppercase;
	text-decoration: none;
	letter-spacing: 0px;
    text-indent:0px;
	-webkit-border-radius: 0;
	-moz-border-radius: 0;
	border-radius: 0;
	float:left;
    
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
	
	-webkit-transition: all 0.2s cubic-bezier(0.000, 0.000, 0.580, 1.000);  
    -moz-transition: all 0.2s cubic-bezier(0.000, 0.000, 0.580, 1.000); 
    -o-transition: all 0.2s cubic-bezier(0.000, 0.000, 0.580, 1.000);
    -ms-transition: all 0.2s cubic-bezier(0.000, 0.000, 0.580, 1.000); 
    transition: all 0.2s cubic-bezier(0.000, 0.000, 0.580, 1.000);
}






/* TIMELINE */

.flex-parent {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
}

.input-flex-container {
  display: flex;
  justify-content: space-around;
  align-items: center;
  width: 80vw;
  height: 100px;
  max-width: 1000px;
  position: relative;
  z-index: 0;
}

.input { /* VOR DEM AKTIVEN PUNKT */
  width: 40px;
  height: 40px;
  background-color: white;
  position: relative;
  border-radius: 50%;
}
.input:hover {
  cursor: pointer;
}
.input::before, .input::after { /* TEIL DER LINIE VOR AKTIVEM PUNKT */
  content: "";
  display: block;
  position: absolute;
  z-index: -1;
  top: 50%;
  transform: translateY(-50%);
  background-color: white;
  width: 13vw;
  height: 3px;
  max-width: 400px;
}
.input::before {
  left: calc(-4vw + 12.5px);
}
.input::after {
  right: calc(-4vw + 12.5px);
}
.input.active { /* AKTIVER PUNKT */
  background-color: #ED7987;
}
.input.active::before { /* TEIL DER LINIE */
  background-color: white;
}
.input.active::after { /* TEIL DER LINIE */
  background-color: white;
}
.input.active span {
  font-weight: 700; 
}
.input.active span::before {
  font-size: 13px;
}
.input.active span::after {
  font-size: 15px;
}
.input.active ~ .input, .input.active ~ .input::before, .input.active ~ .input::after { /* TEIL DER LINIE */
  background-color: white;
}
.input span {
  width: 1px;
  height: 1px;
  position: absolute;
  top: 30%;
  left: 50%;
  transform: translate(-50%, -50%);
  visibility: hidden;
}
.input span::before, .input span::after {
  visibility: visible;
  position: absolute;
  left: 50%;
}
.input span::after { /* SCHRIFT UNTERHALB DER POINTS */
  content: attr(data-year);
  top: 25px;
  transform: translateX(-50%);
  font-size: 14px;
  display:none;
}
.input span::before {
  content: attr(data-info);
  top: -65px;
  width: 70px;
  transform: translateX(-5px) rotateZ(-45deg);
  font-size: 13px;
  text-indent: -10px;color:white;
}

.description-flex-container {
  width: 80vw;
  font-weight: 400;
  font-size: 22px;
  margin-top: 30px;
  max-width: 1000px;
}
.description-flex-container p {
  margin-top: 0;
  display: none;
  color:white;
  line-height:20px;
}
.description-flex-container br {
  content: "";
  margin: 15px;
  display: block;
  font-size: 20px;
}
.description-flex-container p.active {
  display: block;
}

@media (min-width: 1250px) {
  .input::before {
    left: -37.5px;
  }

  .input::after {
    right: -37.5px;
  }
}
@media (max-width: 850px) {
  .input {
    width: 30px;
    height: 30px;
  }
  .input::before, .input::after {
    height: 3px;
  }
  .input::before {
    left: calc(-4vw + 8.5px);
  }
  .input::after {
    right: calc(-4vw + 8.5px);
  }
}
@media (max-width: 600px) {

  .input-flex-container {
    flex-wrap: wrap;
    justify-content: center;
    width: 100%;
    height: auto;
    margin-top: 0px;
  }

  .input {
    width: 60px;
    height: 60px;
    margin: 0 20px 50px;
  }
  .input::before, .input::after {
    content: none;
  }
  .input span {
    width: 100%;
    height: 100%;
    display: block;
	top: 50%;
  }
	
  .input span::before {
    top: calc(100% + 5px);
    transform: translateX(-50%);
    text-indent: 0;
    text-align: center;word-wrap:break-word;-moz-hyphens: auto;
   -o-hyphens: auto;
   -webkit-hyphens: auto;
   -ms-hyphens: auto;
   hyphens: auto;width:100px;
  }
  .input span::after {
    top: 50%;
    transform: translate(-50%, -50%);
    color: #ECF0F1;
  }

  .description-flex-container {
    margin-top: 30px;
    text-align: center;
  }
}
@media (max-width: 400px) {
  body {
    min-height: 950px;
  }
}


#side-panel-menu {width:100%;float:left;}
.inner-nav.desktop-nav.rendered {float:left;width:100%;}