.container{ max-width: 800px; }

a{color: #000 !important;}

.contratto-step-wrap{    
    max-width: 1200px;
    margin: 0 auto;
}
.step {
    display: none;
    /*text-align: center;*/
}
.step.active {
    display: block;
}
input[type=text].form-control,
input[type=email].form-control,
input[type=tel].form-control,
input[type=number].form-control,
input[type=password].form-control,
input[type=date].form-control,
select.form-control{border: none; text-transform: uppercase; }

.modal-content,
.modal-header,
.modal-footer{    padding: 1rem !important;}
.modal-content{border: 3px solid #195cfe;}
.modal-header{border: none;}
.modal-footer{border: none;}

.form-group{text-align: left;}
.form-group label{ display: block; color: #195cfe;}

.step-buttons{margin-top: 40px !important;}

.img-icon{display: inline-block; height: 68px;}
.btn-cs{  background-color: #e8efff; border-radius: 6px;}
.btn-cs:hover,
.btn-cs:active,
.btn-cs.selected{ background-color: #fff; border: 1px solid #195cfe;}

.step h3{text-align: center;}
div.boxed-label{    text-align: center;}
div.boxed-label span{ text-align: center;
    background: #195cfe;
    color: #fff;
    width: auto;
    display: flex;
    align-items: center;
    vertical-align: middle;
    display: inline-flex;
    align-items: center;
    padding: 5px 13px;
    border-radius: 20px;
    margin: 20px auto;}
span.blue{color: #195cfe;}

.btn{padding: 0.375rem 2rem;}
.btn-light{border: 1px solid #195cfe; text-transform: uppercase; color: #195cfe;}
.btn-primary{border: 1px solid #195cfe; text-transform: uppercase; background: #195cfe; color: #fff;}

#contratto_form span.cell-helper{width: 25px;}
#contratto_form input[name=cellulare],
#networker_form input[name=cellulare],
#utente_form input[name=cellulare],
#contratto_form input[name=b_v_cellulare],
#contratto_fotovoltaico_form input[name=cellulare],
#union_park_form input[name=cellulare],
#cambio_amministratore_form input[name=cellulare],
#appuntamento_form input[name=cellulare],
#fv_store_ordine_form input[name=cellulare],
#contatto_form input{ width: calc(100% - 45px); display: inline-block; }
#contratto_form span.pod-helper{}
#contratto_form span.pod-helper.it{background: #eee; padding: 4px 8px;}
#contratto_form span.pod-helper.e{background: #eee; padding: 4px 8px;}
#contratto_form input[name=pod_first_part],
#contratto_form input[name=fast_pod_first_part]{ width: 50px;border: none;    padding: 1px 4px;}
#contratto_form input[name=pod_second_part],
#contratto_form input[name=fast_pod_second_part]{border: none;    padding: 1px 4px; max-width: 105px;}

.file-drop-area {
    border: 2px dashed #007bff;
    padding: 20px;
    border-radius: 5px;
    text-align: center;
    cursor: pointer;
}

.file-drop-area.dragging {
    background-color: #f8f9fa;
    border-color: #007bff;
}

/* Barra di progresso */
.progress {
    width: 100%;
    height: 3px;
    background-color: #e0e0e0 !important;
    border-radius: 0;
    overflow: hidden;
    margin-bottom: 0;
    margin-top: 8px;
    height: 3px;
}

.progress-bar {
    height: 100%;
    width: 0%;
    background-color: #007bff !important;
    transition: width 0.3s ease;
    text-indent: -99999px;
}

.material-symbols-outlined {
    font-variation-settings:
    'FILL' 0,
    'wght' 400,
    'GRAD' 0,
    'opsz' 24
  }

.full-width-buttons-wrapper{}
.full-width-buttons-wrapper button{width: 100%;display: flex;
        align-items: center;
        border-radius: 10px;
        padding: 1em;
        font-family: sans-serif;
        box-shadow: 0 0 0 transparent; margin-bottom: 10px;}
.full-width-buttons-wrapper .icon-circle {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 10px;
}
.full-width-buttons-wrapper .icon-circle img{ width: 32px; height: 32px;}
.full-width-buttons-wrapper h4{color: #2367f2; font-size: 1.1rem;     margin-bottom: 2px; text-align: left;}
.full-width-buttons-wrapper p{text-align: left; margin: 0;font-size: 0.9em; color: #333;}

.step.mercato .d-flex button.btn-cs{margin: 0 5px;}
.step.mercato .d-flex{margin-top: 10px;}

.main-doc-wrapper{background-color: #e8efff;flex-basis: 100%; padding: 15px; border-radius: 10px;text-align: left;}
.main-doc-wrapper .icon-circle{display: flex;
    align-items: baseline;
    justify-content: center;
    margin-right: 10px;}
.main-doc-wrapper .icon-circle img{ height: 32px;}
.main-doc-wrapper label{    color: #2367f2;
    font-size: 1.3rem;
    margin-bottom: 2px;
    text-align: left;
    /* font-weight: 500; */
    margin-bottom: 5px;
    line-height: 1.3rem;
    }
.main-doc-wrapper p{text-align: left; margin: 0;font-size: 0.9em; color: #333;}
.main-doc-wrapper .doc_wrapper{ margin-top: 7px; }
    
.btn.rounded-circle{
      width: 170px;
      height: 170px;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      font-size: 1.5em;
      text-align: center;
}
.btn.rounded-circle i{font-size: 38px;}
 
.circle-wrap img{margin-bottom: 5px;}
.circle-wrap{    width: 170px;
      height: 170px;
      justify-content: center;
      display: flex;
      align-items: center;
      flex-direction: column;}
.circle-wrap div{color: #000;}

      .circle-wrap.d-flex {
          flex-direction: row;
      }
      
      .circle-wrap.d-flex i {
          margin: 0 2px;
      }

      @media screen and (max-width: 800px){
	
      }

.consenso-dati .input-field span{font-size: 0.9rem;}
.consenso-dati .input-field.form-check{margin-left: 0;}
.bg-section{ background: #e8effe;padding: 40px; border-radius: 10px; margin-top: 20px; }
.bg-section div.form-group-title{align-items: center; margin-bottom: 20px;}
.bg-section div.form-group-title > img{height: 48px;}
.bg-section div.form-group-title > span{    font-size: 1.4rem; margin-left: 20px; color: #2959f9;}

.input-field{margin-bottom: 10px;}
.input-field.form-check{margin-left: 1rem;}

.cellulare_prefisso{/*margin-right: 0; padding-right: 0;*/}
.cellulare_wrap{margin-left: 0; padding-left: 0;}
.cellulare_wrap input[name=cellulare]{width: 100% !important;}

.input-field:not[type=checkbox] label {
    font-size: 1.3rem;
    width: 100%;
    color: #2367f2 !important;
    margin-bottom: 6px;
}

.input-field input:not[type=checkbox],
.input-field select,
.input-field textarea{
    height: 3rem;
    width: 100%;
    font-size: 16px;
    margin: 0 0 8px 0;
}

.input-field input:not[type=checkbox]{}

.input-field input[type=checkbox]{
    border: 1px solid #2367f2;
}

.input-field .helper-text {
    display: inline-block;
    background: #195cfe1a;
    font-size: 0.8rem;
    padding: 1px 2px;
    margin-top: 2px;
}
.doc_wrapper{text-align: left;}
.doc_wrapper.inactive{display: none;}

.riepilogo input[type=text],
.riepilogo input[type=email],
.riepilogo input[type=nummber]{
    background: transparent;
    padding-left: 0;
    padding-bottom: 2px;;
    border-bottom: 1px solid #fff;
}
.residente_fornitura_wrap  .btn-icon {
    width: 80px;
    height: 80px;
    font-weight: bold;
    border-radius: 16px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 8px;
  }

.residente_fornitura_wrap  .btn-icon.active,
.residente_fornitura_wrap  .btn-icon:hover {
    background-color: white;
    border: 2px solid #0d6efd;
    color: #0d6efd;
  }

.residente_fornitura_wrap .btn-icon:not(.active) {
    background-color: #eef3ff;
    color: #0d6efd;
    border: none;
  }

.residente_fornitura_wrap  .btn-icon .icon-img {
    width: auto;
    height: 28px;
  }

.consumo_luce_wrap{}
.consumo_luce_wrap button{    border-radius: 15px;
    padding: 20px;
    background: #e8effe;    flex: 1; border: 3px solid #e8effe;}
.consumo_luce_wrap button:hover,
.consumo_luce_wrap button.active{background: #fff; border: 3px solid #195cfe;}
.consumo_luce_wrap button:hover input[type=number],
.consumo_luce_wrap button.active input[type=number]{border: 1px solid #195cfe;}
.consumo_luce_wrap h5{    font-weight: bold;color: #195cfe;text-align: left;}
.consumo_luce_wrap p{text-align: left;
    margin-bottom: 1px;
    font-size: 0.9rem;
    color: #000;}
.consumo_luce_wrap img{ width: 16px; margin-right: 5px;}
.consumo_luce_wrap span{ font-weight: bold; font-size: 1.2rem;color: #195cfe; text-align: left; margin-top: 15px;}
.consumo_luce_wrap span small{    font-weight: normal;font-size: 1rem;}
.consumo_luce_wrap label{color: #195cfe;  font-size: 0.8rem; text-align: left; margin-top: 15px;}

.icon-info{width: 16px; margin-right: 5px;}
   input:-webkit-autofill {
    background-color: white !important;
    -webkit-box-shadow: 0 0 0px 1000px white inset !important;
    transition: background-color 5000s ease-in-out 0s;
    color: #000 !important;
  }


  .titolare_conto_diverso_wrap  .btn-icon {
    width: 120px;
    height: 120px;
    font-weight: bold;
    border-radius: 16px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 8px;
  }

.titolare_conto_diverso_wrap  .btn-icon.active,
.titolare_conto_diverso_wrap  .btn-icon:hover {
    background-color: white;
    border: 2px solid #0d6efd;
    color: #0d6efd;
  }

.titolare_conto_diverso_wrap .btn-icon:not(.active) {
    background-color: #eef3ff;
    color: #0d6efd;
    border: none;
  }

.titolare_conto_diverso_wrap  .btn-icon .icon-img {
    width: auto;
    height: 28px;
  }

.ripensamento_wrap{}
.ripensamento_wrap button{ border-radius: 15px; padding: 20px; background: #e8effe;flex: 1; border: 3px solid #e8effe;}
.ripensamento_wrap button:hover,
.ripensamento_wrap button.active{background: #fff; border: 3px solid #195cfe; box-shadow: none !important;}
.ripensamento_wrap button:hover input[type=number],
.ripensamento_wrap button.active input[type=number]{border: 1px solid #195cfe;}
.ripensamento_wrap h5{    font-weight: bold;color: #195cfe;text-align: left;}
.ripensamento_wrap p{text-align: left;margin-bottom: 1px;font-size: 1.1rem;color: #000;}
.ripensamento_wrap p.small{font-size: 0.9rem;}
.ripensamento_wrap img{ width: 48px; margin-right: 5px;}

.download-contratto{margin-left: 50px;}
.download-contratto a{display: flex;align-items: center;}
.download-contratto img{    width: 48px; margin-right: 20px;}
.download-contratto span{font-size: 1.1rem;}

#offerta_wrap{  transition: all 0.3s ease;  position: fixed;
    bottom: 0;
    width: 100%;
    background: #fff;
    left: 0;
    padding: 10px 0;
    border-top: 1px solid #2367f2;}
#offerta_wrap > div{} 
#offerta_wrap > div p{    margin-bottom: 5px;}
#offerta_wrap > div p label{}
#offerta_wrap > div p span{    color: #2367f2; margin-left: 5px; font-weight: 500;}

.button.firma-ora{    color: #fff !important;
    width: 200px;
    /* float: right; */
    /* display: block !important; */
    margin-left: auto !important;margin-bottom: 15px;
    margin-top: 15px;}

.progress .indeterminate {
    background-color: #2367f2 !important;
    animation: indeterminate 1.5s infinite;
    height: 2px;
    position: absolute;
}

@keyframes indeterminate {
  0% {
    left: -30%;
    width: 30%;
  }
  50% {
    left: 35%;
    width: 30%;
  }
  100% {
    left: 100%;
    width: 30%;
  }
}


@media screen and (max-width: 600px) {
  #content_wrapper_contratto_web > .header img{max-height: 64px;}
	#offerta_wrap > div p {font-size: 0.8rem;}
  .footer p{    font-size: 0.8rem;}
  .bg-section{    padding: 40px 20px;}
  .download-contratto {margin-left: 0px;}
  .btn {padding: 0.375rem 1.7rem;font-size: 0.9rem;}
}