@charset "utf-8";
/* -------------------------------------------------------------------
Edizioni Terra Santa - CSS per layout di pagina
Versione: 1.0 del 10.09.07
Ultima revisione: 1.4 del 14.06.09
Ultima validazione: 11.09.07
Autore: Alessandro Placidi
Contatto: a.placidi@mindgear.it
© 2007 Edizioni Terra Santa
------------------------------------------------------------------- */
/* -- INDEX ----------------------------------------------------------
Layout generale
[1.0] - Generale
[2.0] - Contenitori
[2.1] - Menu testata
[2.2] - Testata
[2.3] - Colonna sinistra
[2.4] - Colonna destra
[2.4.1] - Subcolonna sinistra
[2.4.2] - Subcolonna destra
[2.5] - Footer
Layout box
[3.0] - Box grigio chiaro
[4.0] - Box grigio scuro
-------------------------------------------------------------------- */
/* [1.0] GENERALE
------------------------------------------------------------------------------------------ */
body {
margin: 0;
font-family: Verdana, Arial, Helvetica, sans-serif;
}
/*questo in demo non c'era*/
body.popup {
color: #000;
background-color: #EEE;
}
body * {
margin: 0 0 10px 0;
}
/* [2.0] CONTENITORI
------------------------------------------------------------------------------------------ */
#contenitorePrincipale {
width: 942px;
margin: auto;
}
/*questo in demo non c'era*/
body.popup #contenitorePrincipale {
width: auto;
margin: 20px;
}
/* [2.1] MENU TESTATA
------------------------------------------------------------------------------------------ */
#menuTestata {
height: 30px;
margin-bottom: 0; /* NOTA: regola inserita per avere la precedenza sul wildcard * (vedi body *). */
border: 1px solid #B9B9B9;
color: #999999;
background: #FFF url(../img/pulsanteTestata.jpg) repeat-x left center;
}
/* [2.2] TESTATA
------------------------------------------------------------------------------------------ */
#testata {
height: 108px;
margin-bottom: 0; /* NOTA: regola inserita per avere la precedenza sul wildcard * (vedi body *). */
padding-bottom: 30px; /* BUG: Usando il margin IE6 e IE7 ne applicano uno superiore anche al footer. */
color: #000000;
background: #FFF url(../img/sfondoTestata.jpg) no-repeat 0 0;
}
/* [2.3] COLONNA SINISTRA
------------------------------------------------------------------------------------------ */
#colonnaSinistra {
float: left;
width: 205px;
}
/* [2.4] COLONNA DESTRA
------------------------------------------------------------------------------------------ */
#colonnaDestra {
width: 706px;
float: right; /* NOTA: questa regola era impostata a sinistra. Perchè??? */
padding-left: 30px; /* BUG: utilizzando il padding, al posto del margin di un elemento contenuto, evito il double-float margin bug di IE */
}
/* [2.4.1] SUBCOLONNA SINISTRA
------------------------------------------------------------------------------------------ */
#colonnaDestra #colonnaSecondariaSinistra {
float: left;
width: 504px; /* NOTA: gestendo le dimensioni fisse delle due colonne non ho bisogno di specificare un margine che le separi. */
}
/* [2.4.1.1] SUB-SUBCOLONNA SINISTRA (da Demo)
------------------------------------------------------------------------------------------ */
/* Per gli stili delle colonne di terzo livello uso una classe e non un id, in modo da poterle eventualmente usare più volte nella pagina */
#colonnaDestra #colonnaSecondariaSinistra .colonnaTerziariaSinistra {
float: left;
width: 245px;
margin: 20px 0 0 0;
}
/* [2.4.1.2] SUB-SUBCOLONNA SINISTRA (da Demo)
------------------------------------------------------------------------------------------ */
/* Per gli stili delle colonne di terzo livello uso una classe e non un id, in modo da poterle eventualmente usare più volte nella pagina */
#colonnaDestra #colonnaSecondariaSinistra .colonnaTerziariaDestra {
float: right;
width: 241px;
margin: 20px 0 0 0;
padding-top: 5px;
}
/* [2.4.2] SUBCOLONNA DESTRA
------------------------------------------------------------------------------------------ */
#colonnaDestra #colonnaSecondariaDestra {
float: right;
width: 170px; /* NOTA: gestendo le dimensioni fisse delle due colonne non ho bisogno di specificare un margine che le separi. */
}
/* [2.5] COLONNA DESTRA (da Demo)
------------------------------------------------------------------------------------------ */
#colonnaUnica {
width: 940px;
}
/* [2.5] FOOTER
------------------------------------------------------------------------------------------ */
#footer {
clear: both;
}
/* [3.0] BOX GRIGIO CHIARO
------------------------------------------------------------------------------------------ */
.boxGrigioChiaro {
background: url(../img/imgBoxesHeaders/png/sfondoBoxGrigioChiaroBL.png) no-repeat left bottom;
}
.boxGrigioChiaro .boxEsterno {
padding-bottom: 10px; /* NOTA: si somma ai 10 px del margine inferiore degli elementi tipo . */
background: url(../img/imgBoxesHeaders/png/sfondoBoxGrigioChiaroBR.png) no-repeat right bottom;
}
.boxGrigioChiaro .boxInterno {
background: url(../img/imgBoxesHeaders/png/sfondoBoxGrigioChiaroTL.png) no-repeat left top;
}
/* NOTA: le regole per l'
ed il
qui sotto sono separate dalle regole presenti nel CSS della tipografia, perchè distinte da esse enecessarie al buon funzionamento del box */
.boxGrigioChiaro h2 {
height: 50px;
line-height: 50px;
margin: 0;
padding: 0 15px;
background: url(../img/imgBoxesHeaders/png/sfondoBoxGrigioChiaroTR.png) no-repeat right top;
}
.boxGrigioChiaro p {
padding: 0 15px;
}
/* [4.0] BOX GRIGIO SCURO
------------------------------------------------------------------------------------------ */
.boxGrigioScuro {
background: url(../img/imgBoxesHeaders/png/sfondoBoxGrigioScuroBL.png) no-repeat left bottom;
}
.boxGrigioScuro .boxEsterno {
padding-bottom: 10px; /* NOTA: si somma ai 10 px del margine inferiore degli elementi tipo
. */
background: url(../img/imgBoxesHeaders/png/sfondoBoxGrigioScuroBR.png) no-repeat right bottom;
}
.boxGrigioScuro .boxInterno {
background: url(../img/imgBoxesHeaders/png/sfondoBoxGrigioScuroTL.png) no-repeat left top;
}
/* NOTA: le regole per l'
ed il
qui sotto sono separate dalle regole presenti nel CSS della tipografia, perchè distinte da esse enecessarie al buon funzionamento del box */
.boxGrigioScuro h2 {
height: 50px;
line-height: 50px;
margin: 0;
padding: 0 15px;
background: url(../img/imgBoxesHeaders/png/sfondoBoxGrigioScuroTR.png) no-repeat right top;
}
.boxGrigioScuro p {
padding: 0 15px;
}
/* [5.0] BOX NOSTRI PERIODICI (da Demo)
------------------------------------------------------------------------------------------ */
.boxNostriPeriodici {
background: url(../img/imgBoxesHeaders/png/sfondoPeriodiciL.png) no-repeat left bottom;
}
.boxNostriPeriodici * {
margin: 0;
}
.boxNostriPeriodici li {
margin: 5px auto ;
}
.boxNostriPeriodici .boxEsterno {
padding-bottom: 10px;
background: url(../img/imgBoxesHeaders/png/sfondoPeriodiciR.png) no-repeat right bottom;
}
.boxNostriPeriodici .boxInterno {
background: url(../img/imgBoxesHeaders/png/sfondoHeaderPeriodiciL.png) no-repeat left top;
}
/* NOTA: le regole per l'
ed il
qui sotto sono separate dalle regole presenti nel CSS della tipografia, perchè distinte da esse e necessarie al buon funzionamento del box */
.boxNostriPeriodici h2 {
position: relative;
height: 30px;
line-height: 30px;
padding: 0 15px;
color: #666;
background-color: inherit;
background: url(../img/imgBoxesHeaders/png/sfondoHeaderPeriodiciR.png) no-repeat right top;
font-size: 14px;
}
.boxNostriPeriodici h2 span {
position: absolute;
left: 13px;
top: -2px;
color: #FFF;
background-color: inherit;
}
.boxNostriPeriodici p {
padding: 0 15px;
color: #3F3F3F;
background-color: inherit;
}
.boxNostriPeriodici p.linkTerrasantaMag, .boxNostriPeriodici p.linkEcoTerrasanta {
padding: 0;
}
.boxNostriPeriodici p a {
border-bottom: none;
}
.boxNostriPeriodici p.linkTerrasantaMag a, .boxNostriPeriodici p.linkEcoTerrasanta a {
display: block;
height: 87px;
text-indent: -3000px;
}
.boxNostriPeriodici p.linkTerrasantaMag a {
background: url(../img/linkTerrasantaMag.png) no-repeat;
}
.boxNostriPeriodici p.linkEcoTerrasanta a {
background: url(../img/linkEcoTerrasanta.png) no-repeat;
}
.boxNostriPeriodici .linkTerrasantaMag a:hover, .boxNostriPeriodici .linkEcoTerrasanta a:hover {
border: none;
}