body,html,*{
  
}


.loader {
 position: fixed;
 left: 0;
 top: 0;
 width: 100%;
 height: 100%;
 z-index: 9999;
 background: #fff url(../img/cloud_load.gif) no-repeat center center;
 text-align: center;
}


/*        LOGIN         */


#modificaPassword{
   color: #FF5716 !important;
   background-color: #fff !important;
   border: 1px solid #FF5716 !important;
   border-radius: 5px !important;
   font-weight: 300 !important;
   font-size: 16px !important;
   transition: all .3s ease !important;
   margin-top: 0px !important;
   cursor: pointer !important;
}

#modificaPassword:hover {
   color: #fff !important;
   background-color: #FF5716 !important;
   text-decoration: none !important;
}

#recuperaPassword:hover{
 color: #FF5716 ;
 transition: 0.6s;
}
.btn-orange{
    background-color: #FF5716;
    color : white;
}
.btn-orange:hover{
    background-color: #d64a13;
    color:white;
}
table.two-axis th {
  background: #09367A;
}

#contenitore_login{
  padding-top: 50px;
}
.header_titolo h1{
  margin: 30px auto;
  text-align: center !important;
  color: #333;
}
input {
  outline: none;
}

#inputs {
  width: 100%;
  height: 100%;
  margin: 0 auto;
  position: relative;
}

#inputs label {
  width: 300px;
  margin: 0 auto;
  margin-top: 10px;
  display: block;
}

#inputs input[type=text], #inputs input[type=email], #inputs input[type=password], #inputs input[type=submit], #inputs select {
  width: 300px;
  height: 55px;
  position: relative;
  margin: 0 auto;
  display: block;
  margin-bottom: -10px;
  padding: 15px;
  box-sizing: border-box;
  -webkit-text-stroke: 0.1px;
}

#inputs input[type=text], #inputs input[type=email], #inputs input[type=password], #inputs select {
  font-weight: 300;
  font-size:16px; 
  border: thin solid #ccc;
  border-radius: 5px;
  color: #378DE5;
}

#inputs input[type=text]:focus, #inputs input[type=email]:focus, #inputs input[type=password]:focus, #inputs select:focus {
  border: thin solid #378DE5;
  -webkit-transition: all .4s ease;
  -moz-transition: all .4s ease;
  -o-transition: all .4s ease;
  transition: all .4s ease;
}

#inputs input[type=text]:focus, #inputs input[type=email]:focus, #inputs input[type=password]:focus, #inputs select:focus {
  border-left: thin solid #378DE5;
}


#inputs input[type=submit] {
  color: #378DE5;
  background-color: #fff;
  border: 1px solid #378DE5;
  border-radius: 5px;
  font-weight: 300;
  font-size: 16px;
  transition: all .3s ease;
  margin-top: 0px;
  cursor: pointer;
}

#inputs input[type=submit]:hover {
  background-color: #378DE5;
  color: #fff;
}

#bottom {
  width: 300px;
  margin: 0 auto;
  margin-top: 15px;
}

#inputs a {
  text-decoration: none;
  color: #282828;
  font-size: 13px;
  font-weight: 300;
  transition: color .3s ease;
  outline: none;
}

#inputs .right_a {
  float: right;
}

#inputs .spazia_login{
  margin-bottom: 20px;
}

.fa-toggle-on {
  color: #27ae60;
}

.fa-toggle-on.fa-rotate-180 {
  color: #ccc;
}

.clickabile:hover {
  cursor: pointer;
}

.altezzaNote{
  min-height: 160px !important;
  resize: vertical;
  background-color: #f9f9f9;
}

#registrati{
    color: #FF5716 !important;
    background-color: #ffffff;
    border: 1px solid #FF5716;
    width: 300px !important;
    height: 35px !important;
    border-radius: 5px;
    font-weight: 300;
    font-size: 16px !important;
    transition: all .3s ease;
    margin-top: 0px;
    cursor: pointer;
    line-height: 35px !important;
    padding: 0 !important;
}

#registrati:hover {
    color: #fff !important;
    background-color: #FF5716;
    text-decoration: none;
}

/*        FINE LOGIN        */

/*      CONTENT       */

.content{
  font-family: 'Roboto', sans-serif !important;
  padding-top: 50px !important;
  color: #333 !important;
}

.btn-orange{
        background-color: #FF5716;
        color : white;
    }
    
    .btn-orange:hover{
        background-color: #d64a13;
        color:white;
    }

#checkboxInputCodice{
    margin: 0 auto;
    text-align: center;
}

/*      INFO AGENTE       */



#aggiungiMandato{
  width: 60px;
  height: 60px;
  background-color: #2980b9;
  color: #fff;
  cursor: pointer;
  float: right;
  text-align: center !important;
  line-height: 60px;
  transition: 0.6s;
}
  #aggiungiMandato:hover{
    background-color: #3498db;
    transition: 0.6s;
  }
  #aggiungiMandato i{
    font-size: 20px;
  }
.tdEliminaRiga{
  background-color: #e74c3c !important;
  text-align: center;
  cursor: pointer !important;
  width: 60px !important;
  height: 40px !important;
}
.tdEliminaRiga i{
  font-size: 20px;
  color: #fff;
}
#contentInfoAgente{
  width: 100% !important;
  max-width: 900px;
  margin: 0 auto;
  border-radius: 5px;
  height: 400px;
  background-color: #f7f7f7 !important;
  border: 1px #ccc solid;
  clear: both !important;
  box-shadow: 0px 4px 10px 1px #ddd;
}
  #contentInfoAgente h2{ 
    text-transform: capitalize;
  }
  #fotoAgente{
    width: 50%;
    float: left !important;
    padding: 15px;
    text-align: center !important;
    margin: 0 auto !important;
  }
  #fotoAgente img{
    border-radius: 10px;
    width: 90% !important;
    max-width: 200px !important;
  }
  #boxDettagliAgente{
    width: 50%;
    float: left !important;
    padding: 15px;
    padding-left: 30px;
    border-left: 1px #ccc solid;
  }
    #contentInfoAgente i{
      color: #27ae60;
      width: 50px;
      display: inline-block;
    }
  .bottoneCV, .bottoneCV:active, .bottoneCV:focus{
    background-color: #27ae60 !important;
    transition: 0.6s;
    max-width: 260px;
    margin: 0 auto;
  }
    .bottoneCV:hover{
      background-color: transparent !important;
      border: 1px solid #27ae60 !important;
      color: #27ae60 !important;
      transition: 0.6s;
    }
  .bottoneModProf{
    background-color:#f39c12 !important;
    transition: 0.6s;
    max-width: 260px;
    margin: 0 auto;
    border: 1px solid #f39c12 !important;
  }
    .bottoneModProf:hover{
      background-color: transparent !important;
      border: 1px solid #f39c12 !important;
      color: #f39c12 !important;
      transition: 0.6s;
    }
  #upload_cv, #agenti_cv, #upload_companyProfile, #agenti_companyProfile{
    display: none;
  }
  .bottoneCaricaCV{
    background-color:#3498db !important;
    transition: 0.6s;
    max-width: 260px;
    margin: 0 auto;
    margin-top: 0 !important;
    border: 1px solid #3498db !important;
  }
    .bottoneCaricaCV:hover{
      background-color: transparent !important;
      border: 1px solid #3498db !important;
      color: #3498db !important;
      transition: 0.6s;
    }


hr{
  margin-top: 12px !important;
  margin-bottom: 12px !important;
}

.contenitorePenna{
  position: relative !important;
}
.contenitorePenna i{
  position: absolute !important;
  z-index: 999 !important;
  top: 0;
  right: 10;
  cursor: pointer;
  opacity: 0.5;
  transition: 0.6s;
}
  .contenitorePenna i:hover{
    opacity: 1;
    transition: 0.6s;
  }

/*         PARTE ZONE PROVINCE   */

#numeroProvinceVecchieSelezionate, #numeroProvinceSelezionate{
  width: 95% !important;
  text-align: center !important;
  margin: 20px auto !important;
}
.megaBoxProvince{
  -ms-box-orient: horizontal;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -moz-flex;
  display: -webkit-flex;
  display: flex;
  width: 100% !important;
}
.superBoxProvince{
  width: 45% !important;
  max-width: 650px;
  border:1px solid #ccc;
  border-radius: 5px;
  margin: 30px auto;
  justify-content: space-between;
  -webkit-justify-content: space-between;
  background-color: #f7f7f7;
  box-shadow: 0px 4px 10px 1px #ddd;
}

.boxProvince{
  width: 100% !important;
  height: auto !important;
  float: left !important;
  margin: 20px auto;
  height: 450px !important;
  overflow-y: scroll !important;
}
  .boxProvince::-webkit-scrollbar{
    display: none;
  }
  .boxInternoProvince{
    overflow-y: scroll !important;
    margin-right: 15px;
    border: 1px solid #ccc;
    border-radius: 5px !important;
    height: 400px !important;
    background-color: #f7f7f7 !important;
    padding: 40px;
    box-shadow: 0px 4px 10px 1px #ddd;
  }
  .boxInternoProvince::-webkit-scrollbar{
    display: none;
  }

.flex-container{
  -ms-box-orient: horizontal;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -moz-flex;
  display: -webkit-flex;
  display: flex;
  width: 50% !important;
  margin: 0 auto;
}

.superBoxProvince legend{
  width: 300px;
  text-align: center;
  margin: 40px auto;
}
.contenitoreZone{
  justify-content: space-between;
  -webkit-justify-content: space-between;
}
.y{
  text-align: left !important;
}
#numeroProvinceSelezionate{
  float: left;
}
#numeroProvinceVecchieSelezionate{
  float: left;
}

/*         FORM UTENTE           */

#contenitoreNuovoAgente{
  width: 70% !important;
  margin: 0 auto;
}

.thead-inverse{
  background-color: #333 !important;
  color: #f7f7f7 !important;
}

#formPrimaParte{
  width: 100%;
  margin: 0 auto;
  text-align: center;
}

#formPrimaParte input{
  margin: 0 auto;
  text-align: center;
  background-color: #f9f9f9;
}
#formPrimaParte input[type="file"]{
  
  outline: none;
  background-color: #fff;
}
#selectSX{
  width: 70% !important;
  float: left !important;
}
#selectDX{
  width: 70% !important;
  float: right !important;
}
select{
  background-color: #f7f7f7 !important;
}

.fa-times{
  color: #e74c3c;
}

#contenitoreNuovoAgente .form-check-label input[type="checkbox"]{
  transform: scale(1.7);
  margin-top: 10px;
  margin-right: 5px !important;
  margin-left: 5px !important;
}


/*          MANAGER           */


.animate-show-hide.ng-hide {
  opacity: 0;
}

.animate-show-hide.ng-hide-add,
.animate-show-hide.ng-hide-remove {
  transition: all linear 0.5s;
}


.headerFiltri{
  width: 100%;
  margin: 30px auto;
  text-align: center;
}
  .headerFiltri h1{
    margin-bottom: 20px;
  }
  .headerFiltri a{
    padding: 10px 25px;
    margin-bottom: 20px;
    line-height: 35px;
    background-color: #f7f7f7;
    border:#333 1px solid;
    font-size: 18px;
    outline: none;
    text-decoration: none;
    color: #333 !important;
  }
  .headerFiltri .reset{
    color: #c0392b !important;
    border:1px solid #c0392b !important;
  }
  .headerFiltri i{
    font-size: 23px;
  }
.containerFiltri{
  max-width: 840px !important;
  height: 100px !important;
  margin: 0 auto !important;
  margin-top: 30px !important;
  text-align: center !important;
}
.containerFiltri input{
  background-color: #f7f7f7 !important;
}


.searchField{
  max-width: 120px;
  display: inline-block;
  margin: 8px;
}

.modificaNote{
  background-color: #fff !important;
  box-shadow: 0 5px 10px 5px #ddd !important;
  max-width: 660px !important;
  padding: 20px;
}

.modificaNote .buttonClose{
  cursor: pointer;
}

#salva{
  background-color: #27ae60;
  color: #fff;
  border:none !important;
  width: 45% !important;
  float: left;
  height: 60px;
  font-size: 18px;
  margin-top: 20px;
  transition: 0.6s;
}
  #salva:hover{
    background-color: #fff;
    color: #27ae60;
    border:1px solid #27ae60 !important;
    transition: 0.6s;
  }
#annulla{
  background-color: #e74c3c;
  color: #fff;
  border:none !important;
  width: 45% !important;
  float: right;
  height: 60px;
  font-size: 18px;
  margin-top: 20px;
  transition: 0.6s;
}
  #annulla:hover{
    background-color: #fff;
    color: #e74c3c;
    border:1px solid #e74c3c !important;
    transition: 0.6s;
  }

.formattaBusta{
  background-color: #1abc9c !important;
  width: 60px !important;
  height: 60px !important;
  text-align: center !important;
}
.formattaBustaChanged{
  background-color: #09367a !important;
}

  .formattaBusta i{
    color: #fff;
    font-size: 20px !important;
    cursor: pointer;
  }
.formattaPenna{
  background-color: #f39c12 !important; 
  width: 60px !important;
  height: 60px !important;
  text-align: center !important;
  color: #fff !important;
  cursor: pointer;
}
  .formattaPenna i{
    color: #fff;
    font-size: 20px !important;
  }


.divSuggerimentoMail{
  width: 100%;
  margin: 0 auto;
  margin-left: 0 !important;
}
  #elencoMail{
    list-style: none;
    padding-left: 0 !important;
    margin-left: 0 !important;
    margin-top: 20px !important;
    margin-bottom: 20px !important;
  }
  .divSuggerimentoMail h5{
    color: #16a085;
    font-size: 16px;
  }
  .divSuggerimentoMail li{
    padding: 10px;
    border:0.5px solid #7f8c8d;
    cursor: pointer;
    display: inline-table;
    color: #fff !important;
    background-color: #ecf0f1;
    transition: 0.4s;
    border-radius: 5px;
    color: #7f8c8d !important;
  }
    .divSuggerimentoMail li:hover{
      transition: 0.4s;
      background-color: #f7f7f7 !important;
      border:0.5px solid #bdc3c7;
    }

.divBottoniGen{
  width: auto;
  float: right;
}
#aggiungiDestinatario{
  width: 60px;
  height: 60px;
  background-color: #2980b9;
  color: #fff;
  cursor: pointer;
  float: left;
  text-align: center !important;
  line-height: 60px;
  transition: 0.4s;
  font-size: 17px;
  display: inline-table;
}
  #aggiungiDestinatario:hover{
    background-color: #3498db !important;
    transition: 0.4s;
  }
#btnInvioMail{
  display: inline-table;
  width: 60px !important;
  height: 60px !important;
  line-height: 60px !important;
  border:none;
  color: #fff !important;
  font-size: 18px;
  background-color: #27ae60;
  float: left;
  transition: 0.4s;
}
#btnInvioMail:hover{
  background-color: #2ecc71;
  transition: 0.4s;
}
#destinatariFormContainer .form-group{
  position: relative;
}
#destinatariFormContainer .fa-trash{
  background-color: #e74c3c;
  cursor: pointer !important;
  width: 33px !important;
  height: 33px !important;
  line-height: 33px;
  position: absolute;
  right: 1px;
  border-radius: 0 3px 3px 0;
  top: 25px;
  text-align: center;
  text-decoration: none;
  font-size: 17px;
  font-weight: lighter !important;
  color: #fff;
}


/*      FINE MANAGER          */


/*        STYLE PER TABELLE         */

table.bt thead,
table.bt tbody th {
  display: none;
}

table.bt tfoot th,
table.bt tfoot td,
table.bt tbody td {
  border: none;
  display: block;
  vertical-align: top;
}

table.bt tfoot th:before,
table.bt tfoot td:before,
table.bt tbody td:before {
  content: attr(data-th) ": ";
  font-weight: bold;
  width: 6.5em;
  display: inline-block;
}

table.bt tfoot th.bt-hide,
table.bt tfoot td.bt-hide,
table.bt tbody td.bt-hide {
  display: none;
}

table.bt tfoot th .bt-content,
table.bt tfoot td .bt-content,
table.bt tbody td .bt-content {
  vertical-align: top;
}

.bt-wrapper.active {
  max-height: 310px;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}

@media only screen and (max-width: 568px) {
  .phone-block {
    display: block;
  }

  .phone-hide {
    display: none;
  }
}

@media only screen and (max-width: 768px) {
  #contenitoreNuovoAgente{
    width: 100% !important;
  }
}
@media only screen and (max-width: 1100px) {
  #contentInfoAgente{
    max-width: 500px;
    min-height: 800px;
    padding: 15px;
    height: 100% !important;
  }
  #fotoAgente{
    width: 100%;
    float: left !important;
    padding: 15px;
    text-align: center !important;
    margin: 0 auto !important;
  }
  #boxDettagliAgente{
    width: 100%;
    float: left !important;
    padding: 15px;
    border-right: none !important;
    border-left: none !important;
    border-bottom: 1px solid #eee;
  }

  .flex-container{
    width: 90% !important;
  }
  .megaBoxProvince{
    display: initial;
    width: 100% !important;
  }
  .superBoxProvince{
    width: 100% !important;
    max-width: 450px;
    min-height: 600px;
    border:1px solid #ccc;
    border-radius: 5px;
    margin: 30px auto;
    justify-content: initial;
    -webkit-justify-content: initial;
  }
}

table {
  background: white;
  border-collapse: collapse;
  margin: 1.25em 0 0;
  width: 100%;
}

table tr,
table th,
table td {
  border: none;
  border-bottom: 1px solid #e4ebeb;
}

table th,
table td {
  padding: 10px 12px;
  text-align: left;
}

table th {
  background: #56a2cf;
  color: #ffffff;
  text-transform: uppercase;
}

table tr td {
  background: #eaf3f5;
  color: #999999;
}

table tr:nth-of-type(2n+2) td {
  background: #ffffff;
}

table.bt tfoot th,
table.bt tfoot td,
table.bt tbody td {
  font-size: .8125rem;
  padding: 0;
}

table.bt tfoot th:before,
table.bt tfoot td:before,
table.bt tbody td:before {
  background: #56a2cf;
  color: white;
  margin-right: 10px;
  padding: 2px 10px;
}

table.bt tfoot th .bt-content,
table.bt tfoot td .bt-content,
table.bt tbody td .bt-content {
  display: inline-block;
  padding: 2px 5px;
}

table.bt tfoot th:first-of-type:before,
table.bt tfoot th:first-of-type .bt-content,
table.bt tfoot td:first-of-type:before,
table.bt tfoot td:first-of-type .bt-content,
table.bt tbody td:first-of-type:before,
table.bt tbody td:first-of-type .bt-content {
  padding-top: 10px;
}

table.bt tfoot th:last-of-type:before,
table.bt tfoot th:last-of-type .bt-content,
table.bt tfoot td:last-of-type:before,
table.bt tfoot td:last-of-type .bt-content,
table.bt tbody td:last-of-type:before,
table.bt tbody td:last-of-type .bt-content {
  padding-bottom: 10px;
}




table.two-axis tr td:first-of-type {
  background: #cadde1;
}

@media only screen and (max-width: 568px) {
  table.two-axis tr td:first-of-type,
  table.two-axis tr:nth-of-type(2n+2) td:first-of-type,
  table.two-axis tr td:first-of-type:before {
    background: #3584b3;
    color: #ffffff;
  }

  table.two-axis tr td:first-of-type {
    border-bottom: 1px solid #e4ebeb;
  }

  table.two-axis tr td:first-of-type:before {
    padding-bottom: 10px;
  }
}



  border-radius: 5px;
    margin: 30px auto;
    justify-content: initial;
    -webkit-justify-content: initial;
  }
}

table {
  background: white;
  border-collapse: collapse;
  margin: 1.25em 0 0;
  width: 100%;
}

table tr,
table th,
table td {
  border: none;
  border-bottom: 1px solid #e4ebeb;
}

table th,
table td {
  padding: 10px 12px;
  text-align: left;
}

table th {
  background: #56a2cf;
  color: #ffffff;
  text-transform: uppercase;
}

table tr td {
  background: #eaf3f5;
  color: #999999;
}

table tr:nth-of-type(2n+2) td {
  background: #ffffff;
}

table.bt tfoot th,
table.bt tfoot td,
table.bt tbody td {
  font-size: .8125rem;
  padding: 0;
}

table.bt tfoot th:before,
table.bt tfoot td:before,
table.bt tbody td:before {
  background: #56a2cf;
  color: white;
  margin-right: 10px;
  padding: 2px 10px;
}

table.bt tfoot th .bt-content,
table.bt tfoot td .bt-content,
table.bt tbody td .bt-content {
  display: inline-block;
  padding: 2px 5px;
}

table.bt tfoot th:first-of-type:before,
table.bt tfoot th:first-of-type .bt-content,
table.bt tfoot td:first-of-type:before,
table.bt tfoot td:first-of-type .bt-content,
table.bt tbody td:first-of-type:before,
table.bt tbody td:first-of-type .bt-content {
  padding-top: 10px;
}

table.bt tfoot th:last-of-type:before,
table.bt tfoot th:last-of-type .bt-content,
table.bt tfoot td:last-of-type:before,
table.bt tfoot td:last-of-type .bt-content,
table.bt tbody td:last-of-type:before,
table.bt tbody td:last-of-type .bt-content {
  padding-bottom: 10px;
}




table.two-axis tr td:first-of-type {
  background: #cadde1;
}

@media only screen and (max-width: 568px) {
  table.two-axis tr td:first-of-type,
  table.two-axis tr:nth-of-type(2n+2) td:first-of-type,
  table.two-axis tr td:first-of-type:before {
    background: #3584b3;
    color: #ffffff;
  }

  table.two-axis tr td:first-of-type {
    border-bottom: 1px solid #e4ebeb;
  }

  table.two-axis tr td:first-of-type:before {
    padding-bottom: 10px;
  }
}