/* Estils generals per totes les resolucions */

body {font-family: Arial, sans-serif; margin: 0; padding: 0;}
#barra-top {background-color: #f7f7f9; width: 100%;}
#barra-top-dins {max-width: 1250px; margin: 0px auto; padding: 0.5em; display: flex; flex-direction: row; align-items: center;}
.element-barra-top {margin: 0 0 0 1em;}
#xxss-fas {list-style-type: none; display: flex; flex-direction: row; margin: 0; padding: 0;}
#xxss-fas li {margin: 0 0 0 0.5em;}
#xxss-fas li img {height: 23px; width: auto;}
#logos-menupral {max-width: 1150px; margin: 2em auto; display: flex; flex-direction: row; justify-content: space-between; align-items: center;}
#capa-titol {width: 100%; margin: 0; padding: 0; background: linear-gradient(rgba(0,0,0,0.5), rgba(0,0,0,0.5)), url("https://www.uab.cat/Imatge/748/582/1,10.png"); padding: 3em 0; background-size: cover; background-position: center center;}
#titol-pagina {max-width: 1150px; margin: 0px auto; color: #fff; font-weight: bold; font-size: 2.5em; padding: 0 0.3em;}
.container {max-width: 1150px; margin: 1em auto; padding: 0 0.3em;}
#molladepa {font-size: 0.8em;}
.liniaform {display: flex; flex-direction: row; justify-content: left;}
.liniaform div {margin: 0 0.5em 0 0;}
.proteccio_dades {padding: 1em; border-radius: 10px;  border: 1px solid #aaa; font-size: 0.85em}
#peu {background-color: #f7f7f9; width: 100%; font-size: 0.80em;padding: 1em 0;}
.elem_peu {margin-right: 1em; padding: 0 1em; flex-grow: 1;}
.elem_peu ul {list-style-type: none; margin: 0; padding: 0;}
.elem_peu ul li {margin: 0 0 0.25em 0;}
a {color: #000; text-decoration: none; transition: all 0.2s linear;}
a:hover {color: #737b4c; text-decoration: underline;}
label {font-weight: bold; margin-bottom: 0.5em;}

/* Estils antics a revisar */

.textBoxBorder{border-style: inset; border-width: 2px;}
.tableForm {width: 100%; border-collapse: collapse;}
#taula td{border: 1px solid #ddd;}
.tableForm td {padding: 5px;}
.column_25 {width: 25%;}
.textBoxBorder {font-size: 16px;width: 100%; box-sizing: border-box; border-color: gray;border: 1px solid #ccc;padding: 0.5em;margin: 0.5em 0;transition: border-color 0.3s ease;}
.textBoxBorder:focus {border-color: #e7e7e7;}
.button {cursor: pointer;padding-left: 35px;padding-right: 35px;padding-bottom: 5px;padding-top: 5px;margin-bottom: 20px;border-style: inset;border: 1px solid #dedede;border-width: 1px;border-color: #dedede;background-color: #e7e7e7;font-weight: bold;color: #000;transition: background-color 0.3s, border-color 0.3s, color 0.3s;}
.button:hover {background-color: #b0c47c;border-color: #b0c47c;color: #fff;}
.textBoxBorder {width: 100%;}

/* Estils per a mòbils */

@media screen and (max-width: 576px) {
  #barra-top-dins {justify-content: center;}
  #xxss-fas li img {height: 20px;}
  #menupral {display: none;}
  #menupral-mobil-icona img {height: 28px; width: auto; margin: 0 0.5em;}
  .logopral {height: 20px; width: auto; margin: 0 1em 0 0;}
  #menupral-mobil {background-color: #f7f7f9; display: none;}
  #menupral-mobil ul {display: flex; flex-direction: column; list-style-type: none; margin: 0; padding: 1em 0 0 0.7em;}
  #menupral-mobil ul li {font-weight: bold; margin: 0 0 0.5em; }
  .liniaform {flex-direction: column;}
}

/* Estils per a pantalles petites */

@media screen and (min-width: 577px) {
  #barra-top-dins {justify-content: center;}
  #menupral {display: none;}
  #menupral-mobil-icona img {height: 28px; width: auto; margin: 0 0.5em;}
  .logopral {height: 20px; width: auto; margin: 0 1em 0 0;}
  #menupral-mobil {background-color: #f7f7f9; display: none;}
  #menupral-mobil ul {display: flex; flex-direction: column; list-style-type: none; margin: 0; padding: 1em 0 0 0.7em;}
  #menupral-mobil ul li {font-weight: bold; margin: 0 0 0.5em; }
  .logopral {height: 21px; width: auto; margin: 0 1em 0 0;}
}

/* Estils per a pantalles grans */ 

@media screen and (min-width: 993px) {
  #barra-top-dins {justify-content: flex-end;}
  #menupral {display: block;}
  #menupral-mobil {display: none;}
  #menupral-mobil-icona {display: none;}
  .logopral {height: 23px; width: auto; margin: 0 1em 0 0;}
  #menupral ul {display: flex; flex-direction: row; justify-content: flex-end; list-style-type: none; margin: 0; padding: 0;}
  #menupral ul li {font-weight: bold; margin: 0 0 0 1em;}
  #menupral ul li:not(:first-child) {border-left: 1px solid #666; padding-left: 1em;}
  .elem_peu {border-left: 1px solid #333;}

}