body {font-family: Arial, Helvetica, sans-serif;}
form {border: 3px solid #f1f1f1;}


.navbarmenu {
  overflow: hidden;
  background-color: #333; 
}

.navbarmenu a {
  float: left;
  font-size: 16px;
  color: white;
  width: 200px;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
}

.subnav {
  float: left;
  overflow: hidden;
}

.subnav .subnavbtn {
  font-size: 16px;  
  border: none;
  outline: none;
  color: white;
  width: 200px;
  padding: 14px 16px;
  background-color: inherit;
  font-family: inherit;
  margin: 0;
}

.navbarmenu a:hover, .subnav:hover .subnavbtn {
  background-color: #aaa;
}

.subnav-content {
  display: none;
  position: absolute;
  left: 0;
  background-color: #aaa;
  width: 100%;
  z-index: 1;
}

.subnav-content a {
  float: left;
  color: white;
  text-decoration: none;
}

.subnav-content a:hover {
  background-color: #ccc;
  color: black;
}

.subnav:hover .subnav-content {
  display: block;
}

/* Full-width input fields */
input[type=text], input[type=password] {
  padding: 12px 20px;
  margin: 8px 0;
  display: inline-block;
  border: 1px solid #ccc;
  box-sizing: border-box;
}

/* Set a style for all buttons */
.btn2 {
  background-color: #4CAF50;
  color: white;
  padding: 14px 20px;
  margin: 8px 0;
  border: none;
  cursor: pointer;
  width: 100%;
}
.btn2:hover {
  opacity: 0.8;
}

.btn-bacheca {
  background-color: #ddd;
  color: black;
  border: in-line;
  border-color: #aaa;
  cursor: pointer;
}
.btn-bacheca:hover {
  opacity: 0.8;
  background-color: #aaa;
}



/* Extra styles for the cancel button */
.cancelbtn {
  width: auto;
  padding: 10px 18px;
  background-color: #f44336;
}


.imgcontainer {
  text-align: center;
  margin: 24px 0 12px 0;
  position: relative;
}

img.avatar {
  border-radius: 50%;
}

.container {
  padding: 8px;	
  width: 100%;
  /*  text-align: center;  da aggiungere per il messaggio popup*/
}
span.psw {
  padding: 8px 0px 0px 0px;
}

.tlabel {
  color: black;
  width: auto;
  padding: 8px 0px 0px 0px;
}

.modal {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 1; /* Sit on top */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
/*   background-color: #474e5d;
  padding-top: 50px; */
}

.modal-content {
  background-color: #fefefe;
  margin: 5% auto 15% auto; 
  border: 1px solid #888;
}

/* Clear floats ----------- non so a che cazzo serve*/
.clearfix::after {
  content: "";
  clear: both;
  display: table;
}

/* Float cancel and delete buttons and add an equal width */
.msgcancelbtn, .msgdeletebtn {
  float: left;
  
}

/* ==========================================
message box di conferma

Add a color to the cancel button 
*/
.msgcancelbtn {
  /*width: auto; se c'è si ridimensione della lòunghezza che minima*/
  background-color: #ccc;
  color: black;
}

/* Add a color to the delete button */
.msgdeletebtn {
  background-color: #f44336;
}

.ordina {
   cursor: pointer;
}

.alert {
  padding: 10px;
  background-color: #f44336;
  color: white;
  opacity: 1;
  transition: opacity 0.6s;
  margin-bottom: 15px;
}

.alert.success {background-color: #4CAF50;}
.alert.info {background-color: #2196F3;}
.alert.warning {background-color: #ff9800;}

.closebtn {
  margin-left: 15px;
  color: white;
  font-weight: bold;
  float: right;
  font-size: 22px;
  line-height: 20px;
  cursor: pointer;
  transition: 0.3s;
}

.closebtn:hover {
  color: black;
}

.success {background-color: #4CAF50;} /* Green */
.success:hover {background-color: #46a049;}

.info {background-color: #2196F3;} /* Blue */
.info:hover {background: #0b7dda;}

.warning {background-color: #ff9800;} /* Orange */
.warning:hover {background: #e68a00;}

.danger {background-color: #f44336;} /* Red */ 
.danger:hover {background: #da190b;}

.default {background-color: #e7e7e7; color: black;} /* Gray */ 
.default:hover {background: #ddd;}

.success {background-color: #4CAF50;} /* Green */
.success:hover {background-color: #46a049;}

.info {background-color: #2196F3;} /* Blue */
.info:hover {background: #0b7dda;}

.warning {background-color: #ff9800;} /* Orange */
.warning:hover {background: #e68a00;}

.danger {background-color: #f44336;} /* Red */ 
.danger:hover {background: #da190b;}

.default {background-color: #e7e7e7; color: black;} /* Gray */ 
.default:hover {background: #ddd;}

@media screen and (max-width: 450px) {
  form[name=frmforghetusn] {
      width: 90%;
  }
  
  form[name=frmforghetpsw] {
      width: 90%;
  }
}

@media screen and (min-width: 450px) and  (max-width: 900px) {
  form[name=frmforghetusn] {
    width: 55%;
  }
  form[name=frmforghetpsw] {
      width: 55%;
  }
}

@media screen and (min-width: 900px) {
  form[name=frmforghetusn] {
      width: 40%;
  }
  form[name=frmforghetpsw] {
      width: 40%;
  }
}