
@font-face{
	font-family:"ETmodules";
	src:url("./Fonts/ElegantIcons.woff") format("woff");
}

sup{font-size:0.6em;} 
 
 body {margin:0; font-size:16px; line-height:1.4;}
 .container{width: 90%;    max-width: 1080px; margin: auto;}
 
.groessenfinder_content, .select2-container { font-family: 'Helvetica Neue LT W06_65 Md',Helvetica,Arial,Lucida,sans-serif;}
.groessenfinder_content_box{padding-top: 36px; padding-bottom: 30px;}
 

 
.form_page{display: none; max-width:400px; margin: 0 auto;}
.result{ max-width:400px;}
.form_page.vis{display: block;}

.invis{display:none;} 


.btn_box{margin-top:35px; display:flex;}

.btn{ flex-basis: calc(100% - 50px); background: #82a5c4; padding:9px 20px; display:block; font-size:19px; font-weight:bold; text-align: center;  cursor:pointer; position: relative;}
.btn:after{content: '5';font-family: ETmodules;    speak: none;    font-weight: 400; font-feature-settings: normal;    font-variant: normal;    text-transform: none;    line-height: 1;    -webkit-font-smoothing: antialiased; position: absolute; right: 0px;    font-size: 44px;    top: -1px;}


.btn_back{ flex-basis: 50px; background: #d0dce7; padding:9px 0px; display:block; font-size:19px; font-weight:bold; text-align: center; cursor:pointer; position: relative; margin-right: 10px;}
.btn_back:after{content: '\34';font-family: ETmodules;    speak: none;    font-weight: 400; font-feature-settings: normal;    font-variant: normal;    text-transform: none;    line-height: 1;    -webkit-font-smoothing: antialiased; position: absolute; right: 0px;    font-size: 44px;    top: -1px; }


.headline{font-size:22px; margin-bottom: 10px; line-height:1.2;}
hr{border-width: 1px; border-style: solid;}
.headline + hr{    margin-bottom: 18px;}

/* PAGE 1 Info*/

p{margin-bottom:1.5em;}
p.red{color:#e02b20;}
.form_page_1 .headline{ margin-bottom: 20px;}

/* PAGE 2 Radio*/
.radiobox.red .label{color:#e02b20;}
.radiobox{display:flex;}
.radiobox .label{flex-basis: 50%; font-size:16px; font-weight:bold;}
.radiobox .radios{flex-basis: 50%; font-size:16px;}
.radio_type{margin-bottom:20px;}

.radios > div > label {display: grid; gap: 12px; grid-template-columns: 21px auto; margin-bottom:8px;}


input[type=radio] {
  /* Add if not using autoprefixer */
  -webkit-appearance: none;
  /* Remove most all native input styles */
  -moz-appearance: none;
       appearance: none;
  /* For iOS < 15 */
  background-color: #fff;
  /* Not removed via appearance */
  margin: 0;
  font: inherit;
  width: 21px;
  height: 21px;
  border: 2px solid #000;
  border-radius: 50%;
  display: grid;
  place-content: center;
}

input[type=radio]::before {
  content: "";
  width: 13px;
  height: 13px;
  border-radius: 50%;
  transform: scale(0);
  transition: 120ms transform ease-in-out;
  box-shadow: inset 1em 1em #e02b20;
  /* Windows High Contrast Mode */
  background-color: CanvasText;
}

input[type=radio]:checked::before {
  transform: scale(1);
}

.arrowImg{    width: 10px;    height: 10px;    margin: 0 3px 3px;}


.form_page_1 .lang_change{width:100%; display:block;}
.form_page_1 .lang_change span{margin-left:15px; float:right;}
.form_page_1 .lang_change {font-weight: bold;}
.form_page_1 .lang_change a{font-weight: normal;}
.form_page_1 .lang_change a, .form_page_1 .lang_change a:visited{color:#000;}
.form_page_1 .headline{clear:both;} 


/* PAGE 3 Img*/

.form_page_3 img { width:100%;}
.form_page_3 .img_text{display:none; font-size:15px; line-height: 1.6;}
.form_page_3 .img_text.vis {display:block;}

@media (min-width: 1024px){
	.form_page_3{max-width:820px;}
	.form_page_3 .img_text.vis{display:flex;}
	.form_page_3 .img_text p{flex-basis:50%; width: 50%;}
	.form_page_3 .img_text img{flex-basis:50%; width: 50%; padding-left: 20px;}
	.form_page_3 .btn_box{max-width:400px;     margin-left: auto;    margin-right: auto;}
}



/* PAGE 4 Input*/
/*.row label{flex-basis: 20%;}
.row .input{flex-basis: 20%;}
.row .info-icon{flex-basis: 10%;}*/
 


.form_page_4 .row{float: none; clear:both; margin-top:0px; margin-bottom:16px; height:40px; display:none;}
.form_page_4 .row.vis{/*display: grid; gap: 12px; grid-template-columns: auto 21px auto;*/ display:flex;}

.form_page_4 .row label{flex-basis: calc(62% - 37px); }
.form_page_4 .row .info-icon{ flex-basis: 37px; cursor:pointer;}
.form_page_4 .row .input{flex-basis: calc(38% - 22px);}
.form_page_4 .row .clear-icon{ flex-basis: 22px; cursor:pointer;}

.form_page_4 .row .input input{width:100%; height:40px;  text-align: right;  padding: 0 6px 0 6px; font-size:1rem;
-webkit-appearance: none;
    background-color: #eee;
    width: calc(100% - 12px);
    border-width: 0;
    border-radius: 0;
    color: #000;
	font-weight:bold;
	line-height:40px;
	font-family: 'Helvetica Neue LT W06_65 Md',Helvetica,Arial,Lucida,sans-serif;
}
.form_page_4 .row .input input:focus{border-width: 0; box-shadow:none; outline: none;}


.form_page_4 .row .info-icon div{background:#a6c619; border:2px solid #000; width:26px; height:22px;border-radius: 50%;display: inline-block; font-size:16px; font-weight:bold;text-align:center;line-height: 17px; padding-top: 4px; margin-top:5px;}
.form_page_4 .row .clear-icon div{color:#e02b20; /*border:2px solid #000;*/ width:20px; height:22px;border-radius: 50%;display: inline-block; font-size:16px; font-weight:bold;text-align:right;line-height: 17px; padding-right: 3px; line-height: 40px;}

.form_page_4 .row label{font-size:16px; font-weight:bold; line-height: 40px;}
.form_page_4 .row.red label{color:#e02b20;}

.form_page_4 .row + hr{margin-top: 12px;}


.submit_btn{display:none;}

.form_page_4 .infotext{display: flex;  margin-top:15px; margin-bottom:13px; padding-right: 28px;}
.form_page_4 .infotext	.infotext_change{flex-basis: 70%;}
.form_page_4 .infotext	.infotext_text{flex-basis: 30%; font-weight:bold; text-align:right;  }
.form_page_4 .infotext	.infotext_change span{background: #d0dce7; padding: 8px 40px 8px 15px; cursor:pointer; position:relative;}
.form_page_4 .infotext	.infotext_change span:after {
    content: '5';
    font-family: ETmodules;
    speak: none;
    font-weight: 400;
    font-feature-settings: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    position: absolute;
    right: 2px;
    font-size: 31px;
    top: 0px;
}

.form_page_4 .infotext .var1{display:inline; }
.form_page_4 .infotext .var2{display:none;}

.form_page_4 .infotext.var2 .var1{display:none;} 
.form_page_4 .infotext.var2 .var2{display:inline;}


.form_page_4 .mandatorytext{font-size:12px; margin-top:7px;}

 
.info_lightbox{display:none;}
.info_lightbox.vis{display:block; position:fixed; top:0; left:0; background:rgba(0,0,0,0.8);     z-index: 999;    width: 100%;    height: 100%;}
.info_lightbox .info{width:300px; height:auto; position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); background:#FFF;}
.info_lightbox .info .close{position: absolute; top:5px; left: auto; right:5px; font-weight:bold; cursor:pointer;}
.info_lightbox .info img{width:100%;} 
.info_lightbox .info .text{padding: 5px 10px;}
 
 
  
.radio_compliance, .radio_with_without_trousers  {  display: none;     margin-top: 30px;}
.radio_compliance.vis, .radio_with_without_trousers.vis  {  display: block;  }
.radio_compliance .label, .radio_with_without_trousers .label{flex-basis: 100%; margin-bottom:10px;}


 
 
 
  
 
  
/* PAGE 5 Result*/
.result .inputs{ font-size:16px; line-height:1.6;}


.result .inputs .row2.m_bot{margin-bottom:10px;}
.result .inputs .row, .result .inputs .row2{display:flex;}
.result .inputs .row .left{flex-basis: 36%; text-align:left;}

.result .inputs .row{border-bottom: 1px solid #d0dce7; padding: 2px 0;}

.result .inputs .row .right{flex-basis: 64%; text-align:center;}
.result .inputs.found_sizes_2 .row .right, 
.result .inputs .row_shoes .right, 
.result .inputs .row_gloves .right{flex-basis: 32%; }

.result .inputs.found_sizes_2 .row .right.big{flex-basis: 64%;}



.result .inputs.in_inch .center{flex-basis: 15%; } 
.result .inputs.in_inch .center2{flex-basis: 15%; text-align:right;}

.result .inputs .center2{display:none;}
/*.result .inputs.in_inch .center2{display:block;}
.result .inputs.in_inch .center{display:none;}
*/

.result .grey {font-weight:normal;}

.result .inputs .row2 .left{flex-basis: 40%; text-align:left;}
.result .inputs .row2 .right{flex-basis: 60%; text-align:left;}

@media (max-width: 400px){
	.result .inputs .row .right, .result .inputs.found_sizes_2 .row .right.big{flex-basis: 70%;}
	.result .inputs.found_sizes_2 .row .right{flex-basis: 35%; }
	.result .inputs .row .left{flex-basis: 30%; }
	
	.result .inputs{ font-size:14px;}
	/*.result .inputs.found_sizes_2 .row .right{flex-basis: 25%; } 
	.result .inputs.found_sizes_2 .row .right.big{flex-basis: 50%;}
	.result .inputs .row .left{flex-basis: 32%; text-align:left;}
	.result .inputs .row .center{flex-basis: 18%;}
	.result .inputs .row .center2{flex-basis: 18%;}*/
 }


.result .headline_clothingsize{text-align:center; font-size:20px; font-weight:bold;     margin-top: 22px; margin-bottom: 8px;}
.result .clothingsize_infotext{text-align:center; margin-top: 25px; margin-bottom: 30px;}
.result .clothingsize_result{background: #82a5c4; border:2px solid #000;     display: flex; line-height: 20px; text-align:center;}
.result .clothingsize_result span{flex-basis: 60px;display: inline-block;padding: 7px 10px 7px; font-size:14px;}
.result .clothingsize_result .spacer{flex-basis: calc((100% - 180px) / 2); padding:0;}
.result .clothingsize_result .left{}
.result .clothingsize_result .center{font-size:24px; background:#a6c619; border-left: 5px solid #fff;  border-right: 5px solid #fff; font-weight:bold;  }
.result .clothingsize_result .right{ }
.result .clothingsize_result small{font-size: 10px; font-weight: normal; }

.clothingsize_result + .clothingsize_result{margin-top:10px;}

.result .clothingsize_noresult{    text-align: center;    font-size: 12px;    padding: 10px 0; border:1px solid #f5c6cb; background-color: #f8d7da;}
.result .small{font-size: 12px;    line-height: 1.4;    display: inline-block;    margin-top: 10px;}

.result .length_text{font-size: 12px; margin-top:5px;     margin-bottom: 15px;}


.start_new .btn, .send_mail .btn{width:100%; background: #d0dce7; border:none; margin-bottom: 15px; font-size: 15px; -webkit-appearance: none; border-radius: 0; color:#000;}
.btn[name="action_back"]{margin-top:20px;} 
.send_mail .btn{width:calc(100% - 40px);}
.send_mail .btn:after{content:'';}


.send_mail_form .btn{width:100%; background: #82a5c4; border:none; margin-bottom: 15px; font-size: 17px; -webkit-appearance: none; border-radius: 0; color:#000;}


.info_lightbox.mail_lightbox .info{padding:50px 15px 15px;}
.info_lightbox.mail_lightbox label{width:50%; float: left;  line-height: 40px; clear: left;}

.info_lightbox.mail_lightbox label.red{color:#f00;}
.info_lightbox.mail_lightbox input[type="text"], .info_lightbox.mail_lightbox textarea{width:calc(50% - 12px); height:40px;  text-align: left;  padding: 0 6px 0 6px; font-size:1rem;
-webkit-appearance: none;
    background-color: #eee;
    border-width: 0;
    border-radius: 0;
    color: #000;
	font-weight:bold;
	line-height:40px;
	font-family: 'Helvetica Neue LT W06_65 Md',Helvetica,Arial,Lucida,sans-serif;
	margin-bottom: 20px;
	float: left;
}
.info_lightbox.mail_to_partner label{width:100%; }
.info_lightbox.mail_to_partner input[type="text"]{width:calc(100% - 12px);}
.info_lightbox.mail_lightbox .select2{width: 100% !Important;    margin-bottom: 20px; clear:left;}
.info_lightbox.mail_lightbox textarea{width:calc(100% - 12px); height:100px;}
