/* CSS Document */

/*Color: vert #334f45 */

* {margin: 0; padding: 0;}
html {scroll-behavior: smooth; height: calc(100% - 25px);}
body {color: #222222;  font-family: 'Roboto', Verdana, Arial; font-size: 18px; line-height: 26px;}


/*Formulari*/
.form_caixa {display: flex; flex-direction: row; flex-wrap: wrap; justify-content: space-between;}
.form_casella {width: 49%; position:relative;}
.form_casella_gran {width: 100%;  position:relative;}
.pot_mel {display:none;}
input, textarea {font-family: 'Roboto'; width: 98%; margin: 6px 0; padding: 5px 1%; border: none; background-color: #dedfe1; color: #334f45; font-size: 18px;}
select {font-family: 'Roboto'; padding: 3px 4%; margin: 0 10px; border: none; background-color: #dedfe1; color: #334f45; font-size: 18px;}
textarea {height: 95px; margin: 6px 0 0;}
textarea::placeholder, input::placeholder {font-family: 'Roboto';}
input[type="checkbox"] {width: auto;}
.boto_envia {width: auto; padding: 2px 10px 2px; border: solid 1px #334f45; border-radius: 16px; font-weight:bold; color: #334f45; 
	background-color: white;}
.accepto {font-size: 80%; line-height: 14px;}
.peu_form {font-size: 80%; line-height: 16px; padding-right: 90px;}

/*resposta*/
.form_resposta {position: relative; width: 100%; height: 100%; padding-bottom: 20px; background-color: #dedfe1;}
h4 {font-size: 20px; margin: 10px 0; padding: 25px 10px; text-align: center;}
.comentari {width: 85%; padding: 10px; margin: 0 auto 25px; background-color: white; min-height: 95px;}

.tanca, .tanca_blanc {position: absolute; top: 0; right: 0; width: 25px; height: 25px;
	background-image: url('../img/tanca_gris.png'); background-repeat: no-repeat; background-position: top right;}
.tanca_blanc {background-image: url('../img/tanca_blanc.png');}

label:hover, input[type="submit"] {cursor: pointer;}
.dreta {text-align: right;}

@media only screen and (max-width: 640px) {
.peu_form {padding-right: 0; margin-top: 10px;}
}

@media only screen and (max-width: 360px) {
.form_casella {width: 100%;}
}