.form-container {
    margin:10px 0px;
    padding: 10px 20px;
    font-size: 14px;
    background-color: #f3f3f3;
    font-family: "Open Sans", sans-serif;
}
@media only screen and (min-width: 1024px){
    .form-container {
        padding: 10px;
    }

}
.form-sub-container{
    padding: 0px 20px;
}
.form-sub-container h3{
    font-size: 18px;
    font-family: 'Roboto', sans-serif;
}
.checkbox-registration-container{
    display: flex;
    margin: 20px 0;
}
.newsletter-cnt{
    display: flex;
    flex-direction: column-reverse;
}
.form-sub-container a,
.checkbox-registration-container a{
    margin:0 0 3px 0;
    padding:0px;
    display:block;
    font-family: 'Open Sans', sans-serif;
    font-size: 14px;
    font-weight: 100;
}
.form-container input[type=text], 
.form-container input[type=date],
.form-container input[type=datetime],
.form-container input[type=month],
.form-container input[type=number],
.form-container input[type=search],
.form-container input[type=time],
.form-container input[type=url],
.form-container input[type=email],
.form-container input[type=password],
.form-container textarea, 
.form-container select{
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    border:1px solid #b2b2b2;
    padding: 7px;
    margin:0px;
    margin-bottom: 10px;
    width:300px;
    -webkit-transition: all 0.30s ease-in-out;
    -moz-transition: all 0.30s ease-in-out;
    -ms-transition: all 0.30s ease-in-out;
    -o-transition: all 0.30s ease-in-out;
    outline: none;  
}
.form-container input[type=text]:focus, 
.form-container input[type=date]:focus,
.form-container input[type=datetime]:focus,
.form-container input[type=month]:focus,
.form-container input[type=number]:focus,
.form-container input[type=search]:focus,
.form-container input[type=time]:focus,
.form-container input[type=url]:focus,
.form-container input[type=email]:focus,
.form-container input[type=password]:focus,
.form-container textarea:focus, 
.form-container select:focus{
    -moz-box-shadow: 0 0 8px #88D5E9;
    -webkit-box-shadow: 0 0 8px #88D5E9;
    box-shadow: 0 0 8px #88D5E9;
    border: 1px solid #88D5E9;
}
.form-container input[type=submit]{
    width:300px;
}
.form-container textarea{
    width: 100%;
    height: 100px;
}

/* .form-container .button-highlighted{
    font-size: 1rem;
    padding: 8px 30px;
    background-color: #e2001a;
    color: white;
    border: none;
    margin: 10px 0;
    box-shadow: 0 3px 10px rgba(0, 0, 0, 0.2);
}
.form-container .button-highlighted:hover{
    box-shadow: 0 14px 28px rgba(0, 0, 0, 0.25), 0 10px 10px rgba(0, 0, 0, 0.22);
}
 *//*
*                 --- Embedded text - Privacy Policy ---
*/
.embedded-text{
    padding: 5px 10px;
    height: 160px;
    word-break: normal;
    overflow-y: scroll;
    border: 1px solid #b2b2b2;
    background-color: #ffffff;
}
.embedded-text a{
    word-break: break-all;
    display: inline;
    font-weight: bold;
    color: #666666;
}
.embedded-text .h2{
    font-size: 1rem !important;
}
.embedded-text .h3{
    font-size: 1rem !important;
}
/*
*                       === SPECIAL SOLUTIOS PAGE FORM ===
*/
.flex-column-container{
    flex-direction: column;
}
.form-flex-row{
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}
.form-flex-row > * {
    max-width: 49%;
}
.form-special-solutions .form-flex-row{
    margin-bottom: 15px;
}
.form-special-solutions form > a,
#hardtopneed_nein > a{
    display: block;
    margin: 16px 0px;
}
.container-dimension-data{
    display: flex;
    justify-content: space-between;
}
.form-container .container-dimension-data input{
    width:53px;
    margin-left:10px;
}
/*Equipment name field and the related header column name */
.form-container .datainput-form-table input[type="text"],
.form-container .header-form-table h4:first-child{
    width:250px;
}
/*Space between data table rows*/
.form-container .datainput-form-table .flex-container{
    margin-bottom: 10px;
}

/*Hide spinner of dimension data entry fields*/
.form-container .container-dimension-data input[type=number]::-webkit-inner-spin-button, 
.form-container .container-dimension-data input[type=number]::-webkit-outer-spin-button { 
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    margin: 0; 
}
/*Hide spinner of dimension data entry fields in Firefox*/
.form-container .container-dimension-data input[type=number]{ 
    -moz-appearance: textfield;
}

.form-container.form-special-solutions input[type=number].piece-of-element{
    width:50px;
}
.button-add-more{
    background-color: #ffffff;
    border: none;
    box-sizing: border-box;
    font-size: 14px;
    line-height: 30px;
    margin: 5px 0;
    padding: 0px 10px;
    font-family: 'Lucida Sans Unicode', 'Lucida Grande', sans-serif;
    text-align: center;
    color: #1a1a1a;
    outline: 0;
    cursor: pointer;
}
.form-container.form-special-solutions input[type=submit],
.form-container.form-special-solutions .button-highlighted{
    margin:5px auto;
}


.form-container.form-special-solutions input[type=text], 
.form-container.form-special-solutions input[type=date],
.form-container.form-special-solutions input[type=datetime],
.form-container.form-special-solutions input[type=month],
.form-container.form-special-solutions input[type=number],
.form-container.form-special-solutions input[type=search],
.form-container.form-special-solutions input[type=time],
.form-container.form-special-solutions input[type=url],
.form-container.form-special-solutions input[type=email],
.form-container.form-special-solutions input[type=password],
.form-container.form-special-solutions textarea, 
.form-container.form-special-solutions select{
    margin-bottom: auto;
}

/*
*          --- Show if selected ---
*/
#hardtopneed_ja,
#hardtopneed_nein,
#seilwinde_ja{
    display: none;
}


/*
*                       === DIALOGBOX  ===
*                  ---- Warning message if required fields ar not complete --- 
*/

.dialogbox-form-warning{
    display: none;
    position: fixed;
    top: 50%;
    left: 50%;
    background-color: #f3f3f3;
    padding: 30px;
    color: red;
    box-shadow: 0px 0px 6px black;
    text-align: center;
}
.dialogbox-form-warning button{
    color: white;
    background-color: #e2001a;
    border: none;
    padding: 5px 20px;
    box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.16);
    cursor: pointer;
}



/*
*                       === JQUERY TAB STYLING ===
*/

.ui-tabs{
    border-radius: 0px;
    padding:0px;
}
.ui-tabs-nav{
    border-radius: 0px;
}
.ui-tabs-tab{
    border-radius: 0px;
    border-color: #e5e5e5;
}
.ui-tabs .ui-tabs-panel{
    padding-top:0px;
}


@media only screen and (max-width: 640px){
    .form-sub-container{
        padding: 0px;
    }

    .form-container input[type=text], 
    .form-container input[type=date],
    .form-container input[type=datetime],
    .form-container input[type=month],
    .form-container input[type=number],
    .form-container input[type=search],
    .form-container input[type=time],
    .form-container input[type=url],
    .form-container input[type=email],
    .form-container input[type=submit],
    .form-container input[type=password],
    .form-container textarea, 
    .form-container select{
        width:100%;
    }

    /*jQuery tab no padding*/
    .ui-tabs .ui-tabs-panel{
        padding:0px;
    }
    .ui-tabs-panel > h3:first-child{
        margin-left:20px;
    }
/*
*                       === SPECIAL SOLUTIOS PAGE FORM ===
*/
    .form-flex-row > * {
        max-width: 100%;
    }
    /*
    *                        --- Table ---
    */
    .header-form-table .flex-container h4{
        width: 100%;
        margin:0px;
    }
    .header-form-table .flex-container{
        margin-bottom: 10px;
        border-bottom: 1px solid #b2b2b2;

    }
    /*Separator between data entry elemenmts (row)*/
    .datainput-form-table .flex-container {
        border-bottom: 1px solid #b2b2b2;
        margin-bottom: 5px;
    }
    /*First element of the data entry elemenmt (row)*/
    .datainput-form-table .flex-container a{
        width: 100%;
        margin-bottom: 10px;
    }
    /*Spacing between input felds (rows)*/
    .form-container.form-special-solutions .flex-container input[type="text"],
    .form-container.form-special-solutions .flex-container input[type="number"]{
        margin-bottom: 10px;
    }
    .form-container .container-dimension-data input {
        width: 30%;
        margin-left: 0px;
    }
    /*Equipment name field and the related header column name */
    .form-container .datainput-form-table input[type="text"],
    .form-container .header-form-table h4:first-child{
        width:100%;
    }

}


/*
*        === CUSTOM CHECKBOX === 
*/

/* Customize the label (the container) */
.custom-checkbox {
    display: inline-block;
    position: relative;
    padding: 5px 10px 5px 35px;
    margin: 5px 5px 5px 0;
    cursor: pointer;
    font-size: 17px;
    border: 1px solid black;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
  }
  

  
  /* Hide the browser's default checkbox */
  .custom-checkbox input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
    height: 0;
    width: 0;
  }
  
  /* Create a custom checkbox */
  .checkmark {
    position: absolute;
    left: 6px;
    top: 4px;
    height: 25px;
    width: 25px;
    background-color: #fff;
  }
  
  /* On mouse-over, add a grey background color */
  .custom-checkbox:hover input ~ .checkmark {
    background-color: #ccc;
  }
  
  /* When the checkbox is checked, add a blue background */
  .custom-checkbox input:checked ~ .checkmark {
    background-color: #2196F3;
  }
  
  /* Create the checkmark/indicator (hidden when not checked) */
  .checkmark:after {
    content: "";
    position: absolute;
    display: none;
  }
  
  /* Show the checkmark when checked */
  .custom-checkbox input:checked ~ .checkmark:after {
    display: block;
  }
  
  /* Style the checkmark/indicator */
  .custom-checkbox .checkmark:after {
    left: 9px;
    top: 5px;
    width: 5px;
    height: 10px;
    border: solid white;
    border-width: 0 3px 3px 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
  }

  /* Taxt-reduction text - temporarly */
  .mwst-senkung-txt{
    font-weight: 600;
    margin: 20px auto;
 }