Utente:Valentina Moscardini/tmp

Da Wikipedia, l'enciclopedia libera.
Vai alla navigazione Vai alla ricerca

/*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*/

  1. 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; }

  1. barra ul {

margin: 0px auto; padding: 0px; }

  1. barra li {

border-top-left-radius: 20px; border-top-right-radius: 20px; position: relative; float: left; list-style: none; }

  1. barra li#autrice {

text-transform: uppercase; }

  1. 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; }

  1. barra ul li a:hover{

background-color:#D6FF67; border-left:0.5em solid #B8E149; color:#666666; }

  1. barra ul ul {

position: absolute; visibility: hidden; margin-left: 0px; z-index: 2; }

  1. barra ul li:hover ul {

visibility: visible; margin-top: 0px; margin-left: 0.8em; }

  1. 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; }

  1. barra ul ul li:first-child a {

border-top-right-radius: 5px; }

  1. barra ul ul li:last-child a {

border-bottom-right-radius: 5px; }

  1. barra ul ul li a:hover {

border-left:0.4em solid #B8E149; border-right:0.4em solid #B8E149; }

  1. barra ul ul li:first-child a:hover {

border-top-right-radius: 0px; }

  1. 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*/

  1. foto_big_frecce {

margin: auto; width: 740px; display: block; }

  1. gallery {

display: inline; float: left; z-index: 1; }

  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; }

  1. bordo_foto img#foto {

display: block; width: 600px; height: 400px; }

  1. 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; }

  1. 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; }

  1. bordo_foto:hover span {

background: rgba(60, 60, 60, 0.8); }

  1. sx_big, #dx_big {

display: inline; opacity: 0.4; }

  1. sx_big {

float: left; cursor: pointer; }

  1. dx_big {

cursor: pointer; }

  1. sx_big:hover, #dx_big:hover {

opacity: 1; }

.clear { clear: both; }

  1. 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; }

  1. thumb img {

margin: 0.5em; display: inline; border: 0.1em inset #000000; cursor: pointer; }

  1. thumb #sx_small, #thumb #dx_small {

border: none; margin: 0; cursor: pointer; opacity: 0.4; }

  1. thumb #sx_small:hover, #thumb #dx_small:hover {

opacity: 1; }


  1. thumb img.inactive {

opacity: 0.4; }

  1. 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; }

  1. 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; }