Utente:Valentina Moscardini/tmp
/*GENERALI*/ body{ background-color: #101010; font-family: sans-serif; margin: 1em auto 1em auto; width: 59em; }
img#logo { height: 170px; width: 500px; display: block; margin: 0px auto 0px auto; position: relative; }
div#content { margin: 1em auto 1em; padding-bottom: 0.25em; background-color: #EFEFEF; border-top-left-radius: 20px; border-top-right-radius: 20px; border-bottom-left-radius: 20px; border-bottom-right-radius: 20px; box-shadow: 5px 5px 8px #545454; }
/*BARRA DI NAVIGAZIONE*/
- barra {
border: 1px solid #437E7E; border-top-left-radius: 20px; border-top-right-radius: 20px; background-color: #FFE87C; border-bottom-left-radius: 20px; border-bottom-right-radius: 20px; height: 50px; }
- barra ul {
margin: 0px auto; padding: 0px; }
- barra li {
border-top-left-radius: 20px; border-top-right-radius: 20px; position: relative; float: left; list-style: none; }
- barra li#autrice {
text-transform: uppercase; }
- barra li a {
display: block; font-weight: bold; line-height: 50px; height: 50px; width: 180px; text-align: center; background-color:#FFE87C; border-left:0.5em solid #FACC2E; text-decoration:none; color:#437E7E; border-top-left-radius: 20px; border-top-right-radius: 20px; border-bottom-left-radius: 20px; border-bottom-right-radius: 20px; }
- barra ul li a:hover{
background-color:#D6FF67; border-left:0.5em solid #B8E149; color:#666666; }
- barra ul ul {
position: absolute; visibility: hidden; margin-left: 0px; z-index: 2; }
- barra ul li:hover ul {
visibility: visible; margin-top: 0px; margin-left: 0.8em; }
- barra ul ul li a {
height: 30px; line-height: 30px; width: 200px; border-left:0.4em solid #FACC2E; border-right: 0em; border-top-left-radius: 0px; border-top-right-radius: 0px; border-bottom-left-radius: 0px; border-bottom-right-radius: 0px; }
- barra ul ul li:first-child a {
border-top-right-radius: 5px; }
- barra ul ul li:last-child a {
border-bottom-right-radius: 5px; }
- barra ul ul li a:hover {
border-left:0.4em solid #B8E149; border-right:0.4em solid #B8E149; }
- barra ul ul li:first-child a:hover {
border-top-right-radius: 0px; }
- barra ul ul li:last-child a:hover {
border-bottom-right-radius: 0px; }
/*SUL TESTO GENERICO*/ p { line-height: 1.4em; padding-left: 2em; padding-right: 2em; }
h2 { padding-left: 1em; }
p.titolo2, a.titolo2 { font-size: 18px; font-weight: bold; padding-left: 1em; }
.meno_spazio_sotto { margin-bottom: -10px; }
/*STILE ELENCHI DENTRO DIV (COM PIU' MARGINI)*/ ul#beda { padding-left: 5em; }
ul#beda li { text-indent: -90px; padding-left: 90px; }
/*STILE INDEX.HTML*/
- foto_big_frecce {
margin: auto; width: 740px; display: block; }
- gallery {
display: inline; float: left; z-index: 1; }
- bordo_foto {
display: block; font-family: Verdana, sans-serif; font-size: 11px; position: relative; border: 1em double #3C3C3C; overflow: hidden; width: 598px; height: 400px; }
- bordo_foto img#foto {
display: block; width: 600px; height: 400px; }
- bordo_foto span {
position: absolute; margin: 0 auto 0 auto; width: 100%; bottom: 0; padding: 1.2em 0; background: rgba(0, 0, 0, 0.8); color: #FFFFFF; text-align: center; }
- bordo_foto span strong { /*il titolo della didascalia (quello in strong)*/
font-weight: bold; font-size: 13px; text-transform: uppercase; display: block; /*cosi' il sottotitolo andra' a capo*/ padding-bottom: 5px; }
- bordo_foto:hover span {
background: rgba(60, 60, 60, 0.8); }
- sx_big, #dx_big {
display: inline; opacity: 0.4; }
- sx_big {
float: left; cursor: pointer; }
- dx_big {
cursor: pointer; }
- sx_big:hover, #dx_big:hover {
opacity: 1; }
.clear { clear: both; }
- thumb {
display: block; margin: 0.5em auto 0 auto; border: 0.1em solid #000000; width: 665px; background-color: #101010; border-top-left-radius: 5px; border-top-right-radius: 5px; border-bottom-left-radius: 5px; border-bottom-right-radius: 5px; }
- thumb img {
margin: 0.5em; display: inline; border: 0.1em inset #000000; cursor: pointer; }
- thumb #sx_small, #thumb #dx_small {
border: none; margin: 0; cursor: pointer; opacity: 0.4; }
- thumb #sx_small:hover, #thumb #dx_small:hover {
opacity: 1; }
- thumb img.inactive {
opacity: 0.4; }
- thumb img.inactive:hover {
opacity: 1; }
.introduction { font-style: italic; }
/*STILE LIBRI.HTML*/ .book { min-height: 200px; background-color: #D8D8D8; border-top-left-radius: 20px; border-top-right-radius: 20px; box-shadow: 3px -1px 6px #888; width: 95%; margin: auto; padding-top: 0.5em; }
.book2 { min-height: 200px; background-color: #FFF3B8; border-top-left-radius: 20px; border-top-right-radius: 20px; box-shadow: 3px -1px 6px #888; width: 95%; margin: auto; padding-top: 0.5em; }
img.cover { height: 10%; width: 10%; float: right; margin: 1em 2em 1em 1em; clear: both; padding-right: 3em; }
div.book > p.titolo2, div.book2 > p.titolo2 { /*per rendere "altri libri" uguali agli altri (che hanno un ancora nel titolo)*/ display: inline; }
img.cover + p, .si_last { /*Gli ultimi paragrafi di ogni libro e i libri della sezione "altri libri" che hanno la classe, visto che hanno piu' di un paragrafo*/ padding-bottom: 0.5em; }
img.cover + p.no_last { /*i libri della sezione "altri libri" che hanno la classe (visto che hanno piu' di un paragrafo) non hanno piu' spazio*/ padding-bottom: 0; }
div#other { /*paragrafo introduttivo "altri libri"*/ line-height: 1.4em; padding: 0 2em 0 2em; margin: 2em 0 1em 0; }
/*STILE SU JK ROWLING.HTML*/ img#foto_bio { height: 20%; width: 20%; float: right; clear: both; padding-right: 3em; }
blockquote#bio { padding-left: 2em; padding-right: 2em; font-style: oblique; }
/*STILE FILM.HTML*/ .film { min-height: 350px; background-color: #D8D8D8; border-top-left-radius: 20px; border-top-right-radius: 20px; box-shadow: 3px -1px 6px #888; width: 95%; margin: auto; padding-top: 0.5em; }
.film2 { min-height: 350px; background-color: #FFF3B8; border-top-left-radius: 20px; border-top-right-radius: 20px; box-shadow: 3px -1px 6px #888; width: 95%; margin: auto; padding-top: 0.5em; }
img.loc { height: 20%; width: 20%; float: right; margin: 1em 2em 1em 1em; clear: both; }
.scheda { padding-top: 1em; }
.scheda p { /*i paragrafi di classe "scheda" hanno interlinea piu' piccola e margine sinistro maggiore*/ margin-top: -12px; font-size: 13px; margin-left: 55px; text-indent: -70px; /*Questo e padding-left servono per indentare le righe successive*/ padding-left: 50px; /*alla prima dei paragrafi dentro "scheda"*/ line-height: 1.3em; }
.scheda label { font-weight: bold; }
p.meno_spazio_sotto + p { /*Gli ultimi paragrafi di ogni film*/ padding-bottom: 0.5em; }
/*STILE PERSONAGGI.HTML*/ .pers { min-height: 300px; background-color: #D8D8D8; border-top-left-radius: 20px; border-top-right-radius: 20px; box-shadow: 3px -1px 6px #888; width: 95%; margin: auto; }
img.freccia { width: 20px; height: 20px; vertical-align: middle; cursor: pointer; }
span.info { display: none; }
.logo_casa { height: 30px; width: 30px; vertical-align: middle; }
img.ritratto { height: 200px; width: 150px; float: right; margin: 0.1em 1em 0.1em 1em; }
img#gemelli { height: 200px; width: 250px; }
img.ritratto_large { height: 170px; width: 200px; float: right; margin: 0.1em 1em 0.1em 1em; }
div.pers ul li strong { /*i nomi dei personaggi*/ font-style: italic; }
div.pers ul li { /*Per correggere l'indentazione e lo spazio degli elementi dell'elenco*/ text-indent: -120px; padding-left: 120px; margin-bottom: 10px; }
div.pers ul li:last-child { /*l'ultimo personaggio di ogni sezione ha un po' di spazio sotto*/ padding-bottom: 0.5em; }
/*STILE MONDO-DELLA-MAGIA.HTML*/ a.titolo_world .world { min-height: 15em; background-color: #D8D8D8; border-top-left-radius: 20px; border-top-right-radius: 20px; border-bottom-left-radius: 20px; border-bottom-right-radius: 20px; box-shadow: 3px -1px 6px #888; width: 95%; margin: auto auto 2em auto; display: block; }
a.titolo_world .world span { position: absolute; color: green; margin-top: 3.25em; margin-left: 3em; font-size: 30px; font-weight: bold; }
.world:hover { background-color: #FFF3B8; }
a.titolo_world .world:hover span{ color: firebrick; }
.img_world { margin-top: 1.25em; margin-right: 1.5em; width: 300px; height: 200px; vertical-align: middle; float: right; }
- last_world {
margin-bottom: 1em; }
/*STILE COMUNE LUOGHI.HTML, OGGETTI.HTML, INCANTESIMI.HTML, CREATURE-MAGICHE.HTML*/ .place, .object, .spell, .animal { min-height: 100px; background-color: #D8D8D8; border-top-left-radius: 20px; border-top-right-radius: 20px; border-bottom-left-radius: 20px; border-bottom-right-radius: 20px; box-shadow: 3px -1px 6px #888; width: 70%; margin: auto auto 10px auto; padding-bottom: 1px; }
p.intro { margin-left: 2em; min-height: 13em; }
p.intro img { margin-right: 1.5em; margin-left: 1em; width: 300px; height: 200px; float: right; }
select { margin: 1em auto 2em 20em; width: 20em; height: 2em; }
/*CREDITS*/ p#credits{ color: #ffffff; font-style: italic; font-size: 15px; }
p#credits img { height: 28px; width: 85px; }