body {margin: 0; padding: 0; font-family: Arial, Helvetica, sans-serif;}
p {font-size: 1.3em; line-height: 1.5;}
#kapo {background-image: url('../img/reus.jpg'); background-position: center center; background-repeat: no-repeat; background-size: cover;}
#faldo {background-color: black; color: #FFF; margin: 1em 0 0 0;}
.form-ocult {display: none;}
#llista-xxss {list-style-type: none; margin: 0; padding: 0; display: flex; flex-direction: row;}
#llista-xxss img { width: auto; height: 25px; margin: 0.3em;}
a {text-decoration: none; color:#007d13;}
#linklingvoj {position: absolute; top: 0; right: 0; margin: 1em; font-size: 1.3rem;;}
.logocap {position: relative;}

@media only screen and (max-width:600px) {
    .seccio {width: 100vw; min-height: 100vh; padding: 1em; box-sizing: border-box;}
    #kapo h1 {font-size: 4rem; font-weight: 900; color: #fff;}
    #kapo p {font-size: 1.5rem; line-height: 1; color: #fff; font-weight: bold;}
    h2,h3 {color: #007d13;}
    .logocap {width: 100vw; padding: 1em 0.5em;}
    .logocap img {width: 80%; height: auto;}
    
    .claim {padding: 0.5em; color: #FFF; background-color: #007d13; font-size: 1.5rem; text-decoration: none; border-radius: 10px;}
    .input-butlleti {width: 90vw; padding: 0.5em; margin: 0.5em 0; box-sizing: border-box; font-size: 1.2rem;}
    .boto-butlleti {width: 90vw;border-color: #007d13; border-radius: 5px; color: #fff; background-color: #007d13; font-size: 1.2rem; padding: 0.5em; text-decoration: none;}
    #llista-congressos {margin: 0; padding: 0; list-style-type: none; display: flex; flex-direction: column;}
    #llista-congressos li {width: 100%; text-align: center; margin: 1em 0 0 0;}
    #llista-congressos img {width: 50%; border-radius: 50%;}
    #xxss-seccio {background-color: #007d13;}
    #xxss-seccio h2 {color: #fff;}
    #llista-xarxes {margin: 0; padding: 0; list-style-type: none; display: flex; flex-direction: column;}
    #llista-xarxes li {width: 100%; text-align: center; margin: 1em 0 0 0;}
    #llista-xarxes img {width: 40%;}
     #peu {display: flex; flex-direction: column;}
    .elem_peu {margin: 1em 1em 0 1em; width: 75%;}
    #sub-llista {width: 85vw; display: flex; flex-direction: column; box-sizing: border-box;}
   
}

@media only screen and (min-width:600px) {
    html {scroll-behavior: smooth;}
    .seccio {width: 100vw;}
}

@media only screen and (min-width:992px) {
    .seccio {width: 100vw; }
}
@media only screen and (min-width:1200px) {
    .seccio {width: 70vw; height: auto; margin: 0px auto; box-sizing: border-box; padding: 1em;}
    .seccio2 {width: 70vw; height: auto; margin: 0px auto; box-sizing: border-box; padding: 1em;}
    .logocap {width: 70vw; padding: 1em 0.5em; margin: 0px auto;}
    .logocap img {width: 40%; height: auto;}
    .claim {padding: 0.5em; color: #FFF; background-color: #007d13; font-size: 1.5rem; text-decoration: none; border-radius: 10px; margin-left: 2.7em;}
    #kapo h1 {font-size: 4rem; font-weight: 900; color: #fff; width: 60%; padding: 0.5em 1em 0 1em;}
    h2,h3 {color: #007d13;}
    h2 {font-size: 2rem;}
    #llista-congressos {margin: 0; padding: 0; list-style-type: none; display: flex; flex-direction: row;}
    #llista-congressos li {width: 100%; text-align: center; margin: 1em 0 0 0;}
    #llista-congressos img {width: 60%; border-radius: 50%;}
    #xxss-seccio {background-color: #007d13;}
    #xxss-seccio h2 {color: #fff;}
    #llista-xarxes {margin: 0; padding: 0; list-style-type: none; display: flex; flex-direction: row; align-content: space-between;}
    #llista-xarxes li {width: 25%; text-align: center; margin: 1em 0 0 0;}
    #llista-xarxes img {height: 10%;}
    .usuari-xxss {padding: 1em 0; color: #fff;}
    #peu {display: flex; flex-direction: row;}
    .elem_peu {margin: 1em 1em 1em 0; width: 25%;}
    #sub-llista input  {border: 1px solid #000; padding: 0.5em; font-size: 18px;}
    #disclaimer-form {font-size: small;}
    .input-butlleti {padding: 0.5em; margin: 0.5em 0; box-sizing: border-box; font-size: 1.2rem;}
    .boto-butlleti {border-color: #007d13; border-radius: 5px; color: #fff; background-color: #007d13; font-size: 1.2rem; padding: 0.5em; text-decoration: none;}
    
}