/* GOOGLE FONT */
@import url(http://fonts.googleapis.com/css?family=Open+Sans+Condensed:300|Open+Sans|Francois+One);

/* GENERALE - 7f7db2 */
body { background: #222282; margin: 0; padding: 0; color: #787878; font-family: 'Open Sans', verdana, arial, tahoma, sans-serif; font-size: 14px; }
a { color: #222282; text-decoration: underline; }
img { display: block; border: 0; }
h1, h2, h3 { padding: 0; margin: 0 0 5px 0; font-family: 'Open Sans Condensed', sans-serif; font-size: 36px; color: #222282; }
h1.home, h2 { font-size: 24px; }
h1.catalogo { line-height: 40px; font-size: 28px; }
h1.fixh { line-height: 50px; margin: 0; }
h3 { font-size: 18px; }
p { text-align: justify; line-height: 160%; }

/* FORM */
input, textarea { display: block; width: 100%; padding: 10px 5px; margin: 0; box-sizing: border-box; outline: none; background-color: #FFF; border: 1px solid #DDD; }
input { height: 35px; }
textarea { resize: none; }

/* STRUTTURA */
div#contenitore { position: relative; background: #FFF; width: 960px; margin: 0 auto; box-shadow: 6px 0 10px #121245, -6px 0 10px #121245;}
div#header { position: relative; height: 100px; }
div#contenuto { margin: 10px 10px 0 10px; }
div#footer { position: absolute; bottom: 0; right: 20px; left: 20px; width: 920px; border-top: 4px solid #EEE; line-height: 40px; font-size: 11px; color: #999; }

/* HEADER - LOGO */
#header img.logo { position: absolute; top: 15px; left: 20px; width: auto; height: 90px; }

/* HEADER - condiviso HEADLINE e MENU */
div#headline,
div#menu { position: relative; width: 740px; margin-left: 200px; }

/* HEADER - HEADLINE */
div#headline { height: 50px; }
#headline span { line-height: 50px; font-family: 'Francois One', sans-serif; font-size: 38px; color: #222282; font-weight: bold; }
#headline a { position: absolute; top: 0; display: block; line-height: 50px; width: 42px; color: #CCC; text-decoration: none; text-align: center; background-color: #FAFAFA; }
#headline a.it { right: 42px; }
#headline a.en { right: 0; }
#headline a.sel,
#headline a:hover { background: #222282; color: #FFF; }

/* HEADER - MENU */
div#menu { height: 55px; border-top: 1px solid #EEE; }
#menu ul { list-style-type: none; margin: 0; padding: 0; }
#menu li { position: relative; display: block; float: left; }
#menu li > img { position: absolute; top: -20px; right: -8px; z-index: 999; }
#menu a { display: block; font-family: 'Open Sans Condensed', sans-serif; font-size: 16px; line-height: 55px; color: #999; text-decoration: none; padding: 0 15px; font-weight: bold; }
#menu a.contatti { position: absolute; width: 84px; color: #222282; text-align: center; right: 0; top: 0; padding: 0; }
#menu a:hover,
#menu a.sel { background: #222282; color: #FFF; margin-top: -1px; border-top: 1px solid #222282; border-bottom: 1px solid #222282; }

/* FOTO FOOTER */
div#copertina,
div#miniature { margin-bottom: 40px; }
#copertina > img { width: 580px; height: 300px; }
#miniature { position: relative; height: 300px; }
#miniature > div { position: absolute; width: 130px; height: 130px; background: #CCC; cursor: pointer; }
#miniature > div > img { position: absolute; width: 130px; height: 130px; z-index: 8; }
#miniature > div > span { position: absolute; bottom: 0; left: 0; width: 100%; height: 5px; background: #222282; border-top: 2px solid #FFF; z-index: 9; }
#miniature > .mini-a { top: 0; left: 0; }
#miniature > .mini-b { top: 0; left: 170px; }
#miniature > .mini-c { top: 170px; left: 0; }
#miniature > .mini-d { top: 170px; left: 170px; }

/* FOOTER */
#footer .credits { position: absolute; top: 0; right: 0; }
#footer .credits > a { color: #999; }

/* HOME - CATALOGO */
ul.home-catalogo { list-style-type: none; margin: 0; padding: 0; }
.home-catalogo li { width: 150px; float: left; border-bottom: 1px dotted #DDD; }
.home-catalogo li.nobord { border: 0; }
.home-catalogo li > a { display: block; line-height: 40px; color: #787878; text-decoration: none; }
.home-catalogo li > a:hover { color: #222282; }

/* AZIENDA - GALLERIA LATERALE */
.azi-gallery > img { margin-bottom: 30px; }

/* CATALOGO */
ul.catalogo { list-style-type: none; padding: 0; width: 320px; float: left; }
ul.catalogo.dx { margin-left: 40px; }
.catalogo li { margin-bottom: 20px; }
.catalogo li.stop { clear: both; width: 0; margin: 0; float: none; }
.catalogo li > img { width: 320px; height: 200px; }
.catalogo li > table { display: block; border-collapse: collapse; margin-top: 10px;}
.catalogo th { background: #222282; color: #FFF; }
.catalogo th,
.catalogo td { text-align: center; line-height: 24px; font-size: 12px; }
.catalogo td { border: 1px solid #EEE; }
.catalogo p.nota { font-size: 11px; }

/* COLORI */
div.colori { padding: 0 15px; background: #FCE6E3; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; }
.colori > div.tit { line-height: 30px; font-size: 12px; text-align: center; border-bottom: 1px solid #777; margin-bottom: 10px; }
.colori > div.c { position: relative; width: 25%; float: left; height: 30px; line-height: 18px; }
.colori > div.c > i { position: absolute; top: 0; left: 0; display: block; width: 16px; height: 16px; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; -webkit-box-shadow: 2px 2px 0px 0px rgba(0,0,0,0.3); -moz-box-shadow: 2px 2px 0px 0px rgba(0,0,0,0.3); box-shadow: 2px 2px 0px 0px rgba(0,0,0,0.3); }
.colori > div.c > i.bianco { background: #FFF; }
.colori > div.c > i.miele { background: #ed6e5b; }
.colori > div.c > i.blu { background: #4a6ec6; }
.colori > div.c > i.nero { background: #000; }
.colori > div.c > span { display: block; margin-left: 24px; font-size: 12px; }

/* DUE COLONNE - 580 + 300 */
#due-colonne-a { width: 920px; position: relative; margin: 20px auto 0; padding-bottom: 60px; }
#due-colonne-a > .col-a { float: left; width: 580px; margin-right: 40px; }
#due-colonne-a > .col-b { float: left; width: 300px; }

/* DUE COLONNE - 630 + 250 */
#due-colonne-b { width: 920px; position: relative; margin: 20px auto 0; padding-bottom: 60px; }
#due-colonne-b > .col-a { float: left; width: 630px; margin-right: 40px; }
#due-colonne-b > .col-b { float: left; width: 250px; }

/* DUE COLONNE - 200 + 680 */
#due-colonne-c { width: 920px; position: relative; margin: 20px auto 0; padding-bottom: 60px; }
#due-colonne-c > .col-a { float: left; width: 200px; }
#due-colonne-c > .col-b { float: left; width: 680px; padding-left: 40px; }
#due-colonne-c > .col-a > ul { list-style-type: none; margin: 0; padding: 0;}
#due-colonne-c > .col-a > ul > li { line-height: 40px; }
#due-colonne-c > .col-a > ul > li > a { display: block; text-decoration: none; border-bottom: 1px dotted #EEE; padding-left: 10px; }
#due-colonne-c > .col-a > ul > li > a.sel,
#due-colonne-c > .col-a > ul > li > a:hover { background-color: #EEE; color: #777; border-bottom-color: #EEE; border-bottom-style: solid; }

/* LAVORAZIONE (GALLERIA SU DUE COLONNE) */
#lavorazione { width: 920px; position: relative; margin: 20px auto 0; padding-bottom: 60px; }
#lavorazione ul { list-style-type: none; margin: 0 0 0 -40px; padding: 0;}
#lavorazione ul > li { float: left; width: 280px; margin:  0 0 40px 40px; }
#lavorazione ul > li.clearfix { clear: both; width: 0; margin: 0; }
#lavorazione ul > li > img { width: 280px; height: 200px; }

/* ERRORE 404 */
#err404 { width: 920px; position: relative; margin: 20px auto 0; padding-bottom: 60px; }
#err404 > .avviso { width: 500px; margin: 50px auto 0; padding: 50px 0; border: 1px solid #DDD; background: #EEE; }
#err404 h1,
#err404 p { text-align: center; }

/* TUTTA PAGINA */
#tutta-pagina { width: 760px; position: relative; margin: 20px auto 0; padding-bottom: 60px; }

/* PAGINA CONTATTI */
#contatti .mezzo { float: left; width: 375px; }
#contatti input, #contatti textarea { display: block; padding: 10px; border: 1px solid #DDD; background-color: #EFEFEF; margin-bottom: 10px; }
#contatti input { width: 100%; }
#contatti textarea { width: 100%; height: 100px; }
#contatti div.btn { position: relative; height: 40px; line-height: 40px; color: #999; }
#contatti .btn strong { color: #222282; }
#contatti .btn span { position: absolute; top: 0; right: 0; display: block; line-height: 40px; width: 160px; background-color: #222282; color: #FFF; font-weight: bold; cursor: pointer; text-align: center; }
#contatti .btn span:hover { background-color: #7f7db2; }
#contatti-exe .err, #contatti-exe .suc { padding: 10px; margin-bottom: 10px; }
#contatti-exe .err { background-color: #FFC2B3; color: #333; } 
#contatti-exe .suc { background-color: #B3FFB3; color: #333; }

/* VARIE */
.clearfix { clear: both; }
.ragsoc { color: #222282; }
.rounded { -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; }