
/* ----------------------------------------------------------------------------------------------------
Form
---------------------------------------------------------------------------------------------------- */

.form .form-group:not(.reveal) input.password
{
    font-family:Password!important;
    font-size:16px!important;
    letter-spacing:-3px;
    padding-top:22px!important;
    padding-bottom:12px!important;
}


.form .form-group.reveal i
{
    color:#bf9b62;
}

.form i
{
    position:absolute;
    top:26px;
    right:20px;
    opacity:0.35;
    transition: all 0.125s ease-in-out;
    cursor:pointer;
    display:none;
}

.form i.visible
{
    display:block;
}

.form i:hover
{
    opacity:1;
}


.credentials
{
    opacity:0;
}


.form
{
    list-style-type:none;
    padding:0 20px;
    width:100%;
    max-width:1024px;
    margin:0 auto;
    text-align:left;
}

.form li
{
  position:relative;
  margin-top:24px;
  display:inline-table;
  margin-right:-4px;
  padding:0 20px;
}

@media screen and (min-width: 769px)
{
    .formtwo1,
    .formtwo2
    {
        width:50%;
    }
}

@media screen and (max-width: 768px)
{
    .formtwo1,
    .formtwo2
    {
        width:100%;
    }
}



/* Keine Kollision? */



.form input:not(.btn), .form textarea
{
    position:relative;
    width:100%;
    background-color:transparent;
    border:0;
    color:#444;
    font-size:24px;
    line-height:24px;
    font-family:Netto;
    padding:26px 0 8px 0;
    transition: background 0s ease-out;
    outline: none;

    /*background-image: linear-gradient(#5689b9, #5689b9), linear-gradient(#DDD, #DDD);*/
    background-image: linear-gradient(#bf9b62, #bf9b62), linear-gradient(#DDD, #DDD);


    background-size: 0 1px, 100% 1px;
    background-repeat: no-repeat;
    background-position: center bottom, center bottom;


    font-weight:normal;

    /*transition: all 0.125s ease-in-out;*/
    
    background-color: rgba(0, 0, 0, 0);
}

.form input:not(.link-icon):focus, .form textarea:focus
{
    outline: none;
    background-size: 100% 1px, 100% 1px;
    transition-duration: 0.3s;
}

.form .error input:not(.link-icon),
.form .error textarea
{
    /*background-image: linear-gradient(#bf9b62, #bf9b62), linear-gradient(#bf9b62, #bf9b62);*/
    background-image: linear-gradient(#FF0000, #FF0000), linear-gradient(#FF0000, #FF0000);
}


.form input[readonly]
{
    color:#DDD;
}

.form data
{
    position:relative;
    width:100%;
    background-color:transparent;
    border:0;
    color:#444;
    font-size:24px;
    line-height:24px;
    font-family:Netto;
    padding:26px 0 8px 0;
    transition: background 0s ease-out;
    outline: none;

    /*background-image: linear-gradient(#5689b9, #5689b9), linear-gradient(#DDD, #DDD);*/
    background-image: linear-gradient(#bf9b62, #bf9b62), linear-gradient(#DDD, #DDD);


    background-size: 0 1px, 100% 1px;
    background-repeat: no-repeat;
    background-position: center bottom, center bottom;


    font-weight:normal;

    transition: all 0.125s ease-in-out;
    
    background-color: rgba(0, 0, 0, 0);
    display:block;
    border-bottom:soldid 1px #DDD;
}

/*
input.btn
{
    display:inline-block;
    margin-right:8px;
    text-decoration:none;
    text-transform:uppercase;
    padding:12px 16px 8px 16px;
    overflow:hidden;
    transition: all 0.125s ease-in-out;
    position:relative;
    top:-13px;
    border:0;
    color:#FFF;
    background-color:#bf9b62;
    outline:none;
    cursor:pointer;
    font-family: Netto;
    font-size:16px;
}
*/


.submit:hover
{
    background-color:#bf9b62;
}

.submit.alert
{
    background-color:#e43939;
}






.select2
{
    width:100%!important;
    text-align:left;
}

.select2-container
{
    -vertical-align:top!important;
    text-align:left;
}

.select2-container--default .select2-selection--single
{
    height:auto!important;
    background-color:transparent!important;
    border:0!important;
    width:100%!important;
    transition: background 0s ease-out;
    outline: none;
    background-image: linear-gradient(#bf9b62, #bf9b62), linear-gradient(#DDD, #DDD);
    background-size: 0 1px, 100% 1px;
    background-repeat: no-repeat;
    background-position: center bottom, center bottom;
    font-weight:normal;
    transition: all 0.125s ease-in-out;
    background-color: rgba(0, 0, 0, 0);
}

.form .error .select2-container--default .select2-selection--single
{
    /*background-image: linear-gradient(#bf9b62, #bf9b62), linear-gradient(#bf9b62, #bf9b62);*/
    background-image: linear-gradient(#FF0000, #FF0000), linear-gradient(#FF0000, #FF0000);
}


.select2-container--default .select2-selection--single:focus
{
    outline: none;
    background-size: 100% 1px, 100% 1px;
    transition-duration: 0.3s;
}

.select2-selection__rendered
{
    font-size:24px!important;
    line-height:24px!important;
    padding:25px 0 0 0!important;
    height:57px!important;
}



.form label
{
  font-size:13px;
  color:#444;
  opacity:0.35;
  position:absolute;
  top:0;
  -left:20px;
  transition: all 0.25s ease-in-out;
  /*color:#bf9b62;*/
}

.form .empty label
{
  font-size:24px;
  top:26px;
  opacity:0.35;
  color:#444;
}

@media screen and (max-width: 480px)
{
    .form .empty label
    {
      font-size:16px;
      top:26px;
      opacity:0.35;
      color:#444;
    }
    .form input:not(.submit), .form textarea
    {
        font-size:16px;
    }

    .form data
    {
        font-size:16px;
    }

    .select2-selection__rendered
    {
        font-size:16px!important;
        line-height:16px!important;
    }
}


.form .error label
{
    color:#FF0000!important;
}

.form .focus label
{
  opacity:1;
  /*color:#5689b9;*/
  color:#bf9b62;
}

.form .focus input
{
  /*color:#5689b9;*/
  color:#bf9b62;
}

.form .error label
{
  color:#bf9b62;
  opacity:1;
}






/*


.summary.closed
{
    height:0;
}

#summary-payment-1 > div
{
    float:left;
    clear:both;
    width:100%
}

#action-payserve
{
    display:none;
}

.step2 #action-voucher
{
    display:none;
}

.step2 #action-payserve
{
    display:initial;
}


.step2 .summary-detail
{
    display:none;
}

#summary-payment-1 > div
{
    padding:10px 0;
    border-top:solid 1px #DDD;
    font-weight:bold;

}


#summary-payment-1 > div > div:nth-child(1)
{
    float:left;
}

#summary-payment-1 > div > div:nth-child(2)
{
    float:right;
    width:100px;
    text-align:right;
}

#summary-payment-1 > div > div:nth-child(2):before
{
    content:"CHF";
    float:left;
}
*/

/*
.next span
{
    display:inline-block;
    float:left;
    width:80px;
    text-align:center;
    transition: all 0.25s ease-in-out;
    overflow:hidden;
}

.next:after
{
    display:inline-block;
    overflow:hidden;
    width:0;
    transition: all 2.25s ease-in-out;
    float:left;
    content:"";
    white-space: nowrap;
    opacity:0;
    text-align:center;
}

.next:not(.ready):hover span
{
    width:0;
}
.next:not(.ready):hover:after
{
    width:340px;
    content:"Bitte vervollstandigen Sie alle angaben.";
    opacity:1;
}

.next.ready
{
    opacity:1;
}
*/


/*
    

.group
{
    width:100%;
    max-width:1024px;
    padding:20px 20px;
    margin:0 auto;
}

.closed .group
{
    height:0;
    padding:0;
}    
    
fieldset
{
    margin:0;
    padding:0;
    border:0;
}

*/





/*.next.ready:hover:after
{
    width:200px;
    content:" zu Schritt 2";
}*/

.form-group
{
    margin:12px 0;
}



.fv-edit,
.fv-detail
{
    width:100%;
    margin:0;
    padding:0;
    border:0;
}

.fv-edit a,
.fv-detail a
{
    color: #bf9b62;
    text-decoration:none;
}

.fv-edit a:hover,
.fv-detail a:hover
{
    text-decoration:underline;
}

.app
{
    margin:0;
    padding:0;
    border-bottom:solid 1px #FFF;
}

.app dt
{
    border-top:solid 4px #FFF;
    transition: background-color 0.25s ease-in-out;
    padding:20px 0;
}

.app dd
{
    margin:0;
    padding:0;
    transition: background-color 0.25s ease-in-out;
    padding:0 0 20px 0;
}

.app dt.open
{
    background-color:#FFF;
}

.app dt .summary .link
{
    display:none;
}

.app dt.open .summary .link
{
    display:initial;
}


.app dd.open
{
    background-color:#FFF;
}

.step-voucher-check,
.step-voucher-skip,
.step-finalize,
.prev-voucher
{
    display:none!important;
}

.step-voucher-check.show,
.step-voucher-skip.show,
.step-finalize.show,
.prev-voucher.show
{
    display:inline-block!important;
}

section.form {
    width: 100%;
    max-width:100%!important;
    padding: 20px 0;
    margin: 0 auto;
    text-align: left;
    display: inline-block;
    margin-bottom: -4px;
    transition: all 0.125s ease-in-out;
}

.subsection.top
{
    border-bottom:solid 1px #ddd;
}










.input-before
{
    display:block;
    position:absolute;
    font-size:13px;
    line-height:13px;
    left:20px;
    top:34px;
    opacity:1;
    transition: all 0.25s ease-in-out;
}


.form .empty .input-before
{
    opacity:0;
}

.form .focus .input-before
{
    color:#bf9b62;
}

.input-after
{
    display:block;
    position:absolute;
    right:20px;
    top:26px;
    font-size:24px;
    line-height:24px;
    opacity:1;
    transition: all 0.25s ease-in-out;
}

.form .focus .input-after
{
    color:#bf9b62;
}

.form .empty .input-after
{
    opacity:0;
}

