/* ViVi website - CSS Document */

html, body { height: 100%; }
body { background: White; color: #333333; margin: 0; padding: 0; font-size: 11px; font-family: Verdana, Arial, Helvetica, sans-serif; }
a { text-decoration: none; color: #840266; }
a:hover { text-decoration: underline; }
a img { border: none; }
form#aspnetForm { margin: 0; padding: 0; height: 100%; }

h1 { font-size: 30px; margin: 0; }
h2 { font-size: 24px; margin: 0 0 0.4em; }
h3 { font-size: 16px; margin: 0 0 0.4em; }
h4 { font-size: 13px; margin: 0.4em 0; }
p { margin: 0.5em 0 1em; }

/* Stili generici */
.clear { clear: both; height: 1px; overflow: hidden; }
.pageclear { clear: both; height: 30px; }

img.left { float: left; margin: 0 10px 5px 0; }
img.right { float: right; margin: 0 0 5px 10px; }

/* ***** Contenitori generali ***** */
#homeheadercontainer { width: 100%; height: 330px; border-bottom: 1px solid White; background: White url(../images/bg-header_home.jpg) repeat-x; }
#headercontainer { width: 100%; height: 165px; border-bottom: 1px solid White; background: White url(../images/bg-header.jpg) repeat-x; }
#homeheadercontainer img, #headercontainer img { vertical-align: bottom; }

#bodycontainer { background: #840266; color: White; }

#footercontainer { background: White; color: #840266; height: 22px; font: 10px/22px Tahoma, Arial, Helvetica, sans-serif; }

.innercontent { position: relative; width: 980px; height: 100%; margin: 0 auto; }
#bodycontainer .innercontent { padding: 0 0 10px; height: auto; overflow: hidden; }

.mainCol { width: 630px; float: left; padding-top: 40px; }
.sideCol { width: 330px; float: right; }

/* ***** Header ***** */
#logo { position: absolute; top: 62px; left: 0; }

/* ***** Footer ***** */
#footercontainer a { color: #840266; }
#footercontainer .footleft { float: left; }
#footercontainer .footright { float: right; }

/* ***** Main Menu ***** */
#topMenu { position: absolute; top: 0; left: 0; margin-top: 10px; width: 630px; height: 30px; background: url(../images/bg-menu.gif) no-repeat; }
#topMenu ul { margin: 0; padding: 0; list-style-type: none; }
#topMenu li { float: left; width: auto; padding: 0; padding-right: 10px; margin: 0; background: url(../images/bg-menupipe.gif) top right no-repeat; }
#topMenu li a { display: block; width: 60px; height: 30px; padding: 0; margin: 0; color: White; font: bold 11px/24px Tahoma, Arial, Helvetica, sans-serif; text-decoration: none; text-indent: -9999px; }

/* ***** Contenuti ***** */
.homecontent { background: url(../images/bg-homecontent.gif) repeat-y; margin-top: 10px; }
.whitecontent { color: #990066; background: url(../images/bg-whitecontent.gif) repeat-y; padding-top: 10px; padding-left: 8px; margin-bottom: 10px; }
.whitecontent .mainCol { width: 620px; padding-bottom: 10px; overflow: hidden; }
.prodcontent { margin-top: 10px; }

h4.newsdate { margin-bottom: 0; }

ul.linklist { list-style-type: none; margin: 10px 0; padding: 0; font-size: 11px; font-weight: bold; }
ul.linklist li { background: url(../images/link-pointer.gif) no-repeat scroll 5px 4px; margin: 0 0 5px; padding-left: 15px; }
ul.linklist li a { color: #990066; }

/* ***** Prodotti ***** */
.proditem { width: 980px; padding: 0; margin: 5px 0; color: White; background: #A3418C; overflow: hidden; }
.proditem h2 { font-size: 27px; margin: 5px 0 0; }
.proditem h3 { font-size: 18px; margin: 5px 0 10px; }
.proditem .prodimg { float: left; display: inline; width: 307px; height: 157px; overflow: hidden; padding: 4px; background: White; margin: 0 10px 0 0; border-right: 4px solid #840266; }
.proditem .prodimg a { display: block; width: 307px; height: 157px; overflow: hidden; }
.proditem .prodimg img { display: block; }
.proditem .detail { margin-top: 20px; }
.proditem .detail a { font-weight: bold; color: White; background: url(../images/pointer.gif) 0 4px no-repeat; padding-left: 8px; }

h3.prodtitle { margin: 10px 0; text-transform: uppercase; border-bottom: 1px dotted #990066; padding-bottom: 5px; }

ul.prodmenu { list-style-type: none; margin: 10px 0; padding: 0 0 40px; font-size: 10px; font-weight: bold; text-transform: uppercase; background: url(../images/bg-newsitem.gif) bottom left repeat-x; }
ul.prodmenu li { background: url(../images/pointer.gif) no-repeat scroll 5px 10px; margin: 0; padding-left: 15px; border-bottom: 1px dotted #A3418C; line-height: 25px; }
ul.prodmenu li a { color: White; display: block; }
ul.prodmenu li.selected { background-color: #A3418C; }

ul.prodfeatures { list-style-type: none; margin: 15px 0 5px; padding: 0; font-size: 11px; }
ul.prodfeatures li { padding: 0 0 15px; margin: 0 0 15px; color: White; background: url(../images/bg-newsitem.gif) bottom left repeat-x; }
ul.prodfeatures li img { margin-bottom: 5px; }

/* Lanci News */
ul.newsbox { margin: 0; padding: 0; list-style-type: none; }
li.newsitem { width: 320px; padding: 0 0 15px; margin: 0 0 15px; color: White; background: url(../images/bg-newsitem.gif) bottom left repeat-x; font-size: 10px; overflow: hidden; }
li.newsitem .title { margin-left: 141px; font-weight: bold; font-size: 11px; padding-bottom: 5px; }
li.newsitem .title a { color: White; }
li.newsitem .date { margin-left: 141px; font-weight: bold; line-height: 150%; }
li.newsitem .text { margin-left: 141px; }
li.newsitem .newsimg { float: left; display: inline; width: 123px; height: 77px; overflow: hidden; padding: 4px; background: White; margin: 0; }
li.newsitem .newsimg a { display: block; width: 123px; height: 77px; overflow: hidden; }
li.newsitem .newsimg img { display: block; }
li.newsitem .leggi { margin-top: 10px; margin-left: 141px; }
li.newsitem .leggi a { font-weight: bold; color: White; background: url(../images/pointer.gif) 0 4px no-repeat; padding-left: 8px; }

/* Titoletti colonna destra */
.sideCol h2 { text-indent: -9999px; height: 30px; font-size: 16px; line-height: 30px; }

h2.prodotto { text-indent: 0; background: url(../images/bg-boxtitle.gif) no-repeat; padding-left: 8px; text-transform: uppercase; }

/* ***** Distributori ***** */
.distributore { margin: 10px 0; padding-bottom: 10px; color: #545454; border-bottom: 1px dotted #990066; }
.distributore strong { font-size: 13px; }
.distributore strong, .distributore em { color: #990066; }