@charset "utf-8";
/* CSS Document */

* {margin:0; padding:0;box-sizing:border-box;text-decoration:none;border:none;}

html {font-family: 'Crimson Text', serif;}
body {margin:0;padding:0;}
.wrapper {width:100%;padding:30px 0;height:100%;} 

#container {width:100%;max-width:1000px;margin:0 auto; border-radius:10px; box-shadow:0 0 10px 2px #333;border-box:5px solid #F5F5EB; background-color:#F5F5EB;padding:4px;box-sizing:border-box;}

#header {width:100%;padding:20px 0;}

#logo {display:block; margin:0 auto; width:auto; text-align:center;}

#content {padding:30px 0; background-color:#C0C07D;margin:80px 0 0 0;border-radius:5px 5px 0 0; min-height:650px;}

.tabella {display:table; width:100%;}
.riga {display:table-row; width:100%;}

#menu {width:90%; margin:-80px auto 50px auto;}

.bottone {float:left; width:25%; text-align:center;}

.bottone img {width:50%; margin:0 auto; display:block;}
.bottone span {display:block; text-align:center; text-transform:uppercase;padding:10px 0 0 0;color:#364306; font-weight:700;}

.bottone span a {color:#364306; text-decoration:none;padding:0 0 10px 0;border:none;}

div.bottone:hover span a {/*border-bottom:#364306 solid 5px;*/background:url(../img/active-submenu.gif) no-repeat center bottom;}

div.bottone.contatti:hover span a {border-bottom:none;}

#dove-siamo, #richiesta-info {padding:0 0 10px 0;color:#364306; text-decoration:none; }

#dove-siamo:hover {background:url(../img/active-submenu.gif) no-repeat center bottom;}
#richiesta-info:hover {background:url(../img/active-submenu.gif) no-repeat center bottom;}


#home div.bottone.chi-siamo span a, #olio div.bottone.olio span a, #vino div.bottone.vino span a, #contatti-dove-siamo #dove-siamo, #contatti-richiesta-info #richiesta-info {background:url(../img/active-submenu.gif) no-repeat center bottom;}

#testo {width:50%; padding:0 30px 30px 30px; float:left;}
#testo-home {width:50%; padding:0 30px 30px 30px; float:none;display:table-cell; vertical-align:middle;}

h1, h2 {color:#364306; font-weight:600; text-transform:uppercase;font-size:20px;}

p {color:#364306; font-weight:400; font-style:italic; font-size:18px; padding:0 0 10px 0;}

#immagine-sidebar {width:50%; float:left; padding:0 30px 0 0; box-sizing:border-box;}
#immagine-sidebar-home {width:50%; padding:0 30px 0 0; box-sizing:border-box;float:none;display:table-cell; vertical-align:middle;}

#immagine-sidebar img, #immagine-sidebar-home img {border:2px solid #FFF; border-radius:5px; margin:0 auto; text-align:center; display:block;}

img {max-width:100%; height:auto;}

.clear {clear:both;padding:0;margin:0;width:100%;}

#footer {background:#4E590B url(../img/background-footer.jpg) repeat-y center top; border-radius:0 0 5px 5px;}

#footer p {font-size:14px; font-weight:600; font-style:normal; text-align:center; color:#FFF; padding:10px;}

a {}

#submenu {width:80%;float:left;margin:0 0 50px 0;}


#submenu div {float:left;width:25%;margin:0 0 10px 0;}

#submenu div a {color:#364306;font-style:normal;font-size:14px; display:block;/*border-top:#C0C07D solid 5px;*/ padding:10px 0 0 0;}

#submenu div:hover a {/*border-top:#364306 solid 5px;*/ background:url(../img/active-submenu.gif) no-repeat left top;}

#submenu div a span {font-size:18px; font-weight:600;}


.bottiglia-olio-1l #bottiglia-olio-1l, .bottiglietta-olio-italiano-250ml #bottiglietta-olio-italiano-250ml, .bottiglia-olio-italiano-500ml #bottiglia-olio-italiano-500ml, .bottiglia-olio-italiano-750ml #bottiglia-olio-italiano-750ml, .bottiglia-olio-peperoncino-500ml #bottiglia-olio-peperoncino-500ml, .bottiglia-olio-italiano-1l #bottiglia-olio-italiano-1l, .latta-olio-5l #latta-olio-5l, .dama-olio-5l #dama-olio-5l, .dove-siamo #dove-siamo, .richiedi-info #richiedi-info, .vino-rosso-il-vitigno-10l #vino-rosso-il-vitigno-10l, .vino-bianco-il-vitigno-10l #vino-bianco-il-vitigno-10l {/*border-top:#364306 solid 5px;*/background:url(../img/active-submenu.gif) no-repeat left top;}

/* From */

form {width:100%;}
fieldset {width:100%;padding:20px;background-color:#EAEAEA;border-radius:5px;}
fieldset div {width:50%;float:left;padding:0 0 20px 0;}
label {color:#364306; display:block;}

#nome, #cognome, #telefono, #email {height:20px;width:98%;}
textarea {height:50px;}

#box-privacy {width:100%;float:none;}

.link-privacy {color:#364306;}
.link-privacy:hover {text-decoration:underline;} 

#invia {display:block;width:100%;background-color:#364306;color:#FFF;padding:0;margin:0 auto;height:40px; text-transform:uppercase; border-radius:20px;-moz-border-radius:20px;-webkit-border-radius:20px;}

/*validazione*/
#nome-errore,#cognome-errore,#telefono-errore,#email-errore,#provincia-errore,#privacy-errore{display:none;border:none;width:100%; text-align:left;}
.error {float:none;width:100%;margin:0;font-size:14px;/*background-color:#E10915;color:#FFF;*/color:#E10915;font-weight:700;}
input.error {width:100%;margin:0;padding:0;}

@media only screen and (max-width: 767px) {
#container {width:100%;max-width:767pxpx;}
#testo {float:none;width:100%;}
#immagine-sidebar {float:none;width:100%;padding:0 5px;}

#testo-home {float:none;width:100%; display:block;}
#immagine-sidebar-home {float:none;width:100%;padding:0 5px; display:block;}
#submenu {width:100%;}
#submenu div a {}
#submenu div:hover a {}

}

@media only screen and (max-width: 479px) {
#container {width:100%;max-width:479px;}
#testo {float:none;width:100%;}
#immagine-sidebar, #immagine-sidebar-home {float:none;width:100%;padding:0 30px;}
#dove-siamo, #richiesta-info {display:block;}
#submenu {margin:0 0 30px 0;}
#submenu div {width:33%;}

#content {margin:0;}
#menu {width:100%;margin:0; box-sizing:border-box;}




.bottone { width:50%; margin:0 0 20px 0;}

#dove-siamo, #richiesta-info {display:block;float:none;}

fieldset div {width:100%;float:none;padding:0 0 20px 0;}

textarea {width:100%;}

.bottone span.hidden {display:none;}
}

@media only screen and (max-width: 320px) {
#container {width:100%;max-width:320px;}
#testo {float:none;width:100%;}
#immagine-sidebar, #immagine-sidebar-home {float:none;width:100%;padding:0 30px;}

#content {margin:0;}

#menu {margin:0 auto 0 auto;}

}
