body {text-align: justify; margin: 2em 4em; font-family:  Georgia, serif; font-size: 1.05em; color: #111; max-width: 1900px; }
h1, h2 { font-size:1em; padding:0;margin:0; text-align:left; }
h2 { margin: 1.2em 0 0 0;}
p {padding: 0; margin: 0 0 0.8em 0; }
p.inicial {margin: 0 0 -0.7em 0; text-align: left;}
footer p {text-align: left;}
p:last-of-type{ margin:0;}
a {text-decoration: none;}
a:visited{  color: #00e;}
ul, li {list-style-type: square;  margin-left: -0.5em; text-align: left;}
.responsive {width: 100%; padding: 1.4em 0 0em 0;}
.avis {color: red; background-color: #fff; font-weight: normal;}
.extracte {background-color: #FFECDD;padding: 0.5em; text-align: center; color: #555; margin: 0;}
hr { border: 0; height: 1px; margin:1em 0 1em 0; background-image: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0)); }
.riure{color:red; line-height: 0; font-size: 1.2em;}
#box {display: block; position: absolute;top: 0; float: right; z-index: 10; text-align: center;width: 90%; background-color: #fff; font-size: 0.9em;}
textarea{font-size: 1em;
    background-color: #fcfcfc;
    width: 100%;
    height: 200px;
    padding: 8px 18px;
    margin: 9px 0;
    display: inline-block;
    border: 1px solid #444;
    border-radius: 3px;
    box-sizing: border-box;
}
input {width: 98%;
  font-size: 1em;
  font-family: inherit;
  padding: 0.50em 0.5em;
  background-color: #fff;
  border: 1px solid #444;
  border-radius: 4px;
}
input.button {padding: 8px; width: 100px;}
input.button:hover { background-color: #999; color: #fff; }
  input:focus { 
        outline: none !important;
        border-color: #000;
        box-shadow: 0 0 10px #ddd;
    }
    textarea:focus { 
        outline: none !important;
        border-color: #000;
        box-shadow: 0 0 10px #ddd;
    }
.button {
  font: bold 1em Arial;
  text-decoration: none;
  background-color: #EEEEEE;
  color: #333333;
  padding: 2px 6px 2px 6px;
  border-top: 1px solid #CCCCCC;
  border-right: 1px solid #333333;
  border-bottom: 1px solid #333333;
  border-left: 1px solid #CCCCCC;
}  
.error {color: red; font-weight: bold;} 
.ok {color: darkgreen; font-weight: bold;} 
.isDisabled {
  color: currentColor;
  cursor: not-allowed;
  opacity: 0.5;
  text-decoration: none;
}
.extracte, .blogform, #blogform {
	padding: 10px 10px;
	border: 1px solid #bbb;
	background: #eee;
	color: black !important;
	width: auto;
	overflow: auto;
}
	.taula {
  display: grid;
  grid-template-columns: auto auto;
  gap: 1.5em;
}
.item1 {
  grid-column: 1 / span 2;
}
.item2 {
  grid-column: 3;
  grid-row: 1 / span 2;
}
.item5 {
  grid-column: 1 / span 3;
}
@media only screen and (max-width: 700px) {
body {margin:2em 1em;}
blockquote {margin: 0; padding: 0;}
input {width: 97%;}
	}
@media only screen and (max-width: 900px) {
.taula {  display: grid;
  grid-template-columns: auto;}
}