nome utente accusato » ˜ böleyn (ff - fc)
ai danni di » la sottoscritta
Stamp originali » mia sidebar
mio code
Stamp ripper » sua sidebar
suo code (stamp | stamp code -> 1 . 2 . 3 . 4)
L'utente è stato contattato? » mi ha bannata tempo fa perchè l'avevo già sorpresa a scopiazzarmi, ma sono riuscita a mandarle un mp
Note » tenete presente che la parte in cui ci sono .box e .iconspositions, etc.. nel mio sono nominati in modo diverso ma solo perchè li ho cambiati di recente perchè ho dato una sistematina e alcuni nel vecchio layout scombussolavano tutto... ma prima erano esattamente così, parola per parola. i codici vecchi li ho ancora! insomma è tutto uguale... pixel, distanze,effetti identici! la parte dell'avatar (il movimento del quadratino con la scritta) l'ha preso da quest'altra sidebar qui... eh be! facciamo 2 + 2! queste sono sidebar che ho creato l'anno scorso!
Edited by ´daenerys - 28/8/2013, 04:14
ai danni di » la sottoscritta
Stamp originali » mia sidebar
mio code
SPOILER (clicca per visualizzare)
/* SIDEBAR ALEX -se copiate vi disintegro- */
#sidebar {margin-left: 15px; margin-top: 20px; background: #FFFFFF; border: 2px solid #F3E1D6; width: 250px; height: 80%; position: fixed; z-index: 9}
.credits {bottom: 30px; width: 250px; height: auto; z-index: 9; font-family: century gothic; font-size: 9px; line-height: 9px; padding-top: 3px; padding-bottom: 3px; text-align: center; text-transform: uppercase; position: absolute}
/* SIDEBAR ALEX | LINK GENERICI -se copiate vi disintegro- */
.linguetta1 {position: fixed; margin-top: -1px; width: 52px; height: 15px; margin-left: 8px; background-color: #F3E1D6; border-top: 1px solid #F3E1D6; float: left; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; font-family: cambria, calibri; font-size: 11px; color: #D9B99B; text-align: center; line-height: 12px; -webkit-border-bottom-right-radius: 4px; -webkit-border-bottom-left-radius: 4px; -moz-border-radius-bottomright: 4px; -moz-border-radius-bottomleft: 4px; border-bottom-right-radius: 4px; border-bottom-left-radius: 4px}
.linguetta1:hover {border-top: 7px solid #F3E1D6; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; font-color: #D9B99B; -webkit-border-bottom-right-radius: 4px; -webkit-border-bottom-left-radius: 4px; -moz-border-radius-bottomright: 4px; -moz-border-radius-bottomleft: 4px; border-bottom-right-radius: 4px; border-bottom-left-radius: 4px}
.linguetta2 {position: fixed; margin-top: -1px; width: 52px; height: 15px; margin-left: 68px; background-color: #F3E1D6; border-top: 1px solid #F3E1D6; float: left; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; font-family: cambria, calibri; font-size: 11px; color: #D9B99B; text-align: center; line-height: 12px; -webkit-border-bottom-right-radius: 4px; -webkit-border-bottom-left-radius: 4px; -moz-border-radius-bottomright: 4px; -moz-border-radius-bottomleft: 4px; border-bottom-right-radius: 4px; border-bottom-left-radius: 4px}
.linguetta2:hover {border-top: 7px solid #F3E1D6; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; font-color: #D9B99B; -webkit-border-bottom-right-radius: 4px; -webkit-border-bottom-left-radius: 4px; -moz-border-radius-bottomright: 4px; -moz-border-radius-bottomleft: 4px; border-bottom-right-radius: 4px; border-bottom-left-radius: 4px}
.linguetta3 {position: fixed; margin-top: -1px; width: 52px; height: 15px; margin-left: 128px; background-color: #F3E1D6; border-top: 1px solid #F3E1D6; float: left; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; font-family: cambria, calibri; font-size: 11px; color: #D9B99B; text-align: center; line-height: 12px; -webkit-border-bottom-right-radius: 4px; -webkit-border-bottom-left-radius: 4px; -moz-border-radius-bottomright: 4px; -moz-border-radius-bottomleft: 4px; border-bottom-right-radius: 4px; border-bottom-left-radius: 4px}
.linguetta3:hover {border-top: 7px solid #F3E1D6; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; font-color: #D9B99B; -webkit-border-bottom-right-radius: 4px; -webkit-border-bottom-left-radius: 4px; -moz-border-radius-bottomright: 4px; -moz-border-radius-bottomleft: 4px; border-bottom-right-radius: 4px; border-bottom-left-radius: 4px}
.linguetta4 {position: fixed; margin-top: -1px; width: 52px; height: 15px; margin-left: 188px; background-color: #F3E1D6; border-top: 1px solid #F3E1D6; float: left; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; font-family: cambria, calibri; font-size: 11px; color: #D9B99B; text-align: center; line-height: 12px; -webkit-border-bottom-right-radius: 4px; -webkit-border-bottom-left-radius: 4px; -moz-border-radius-bottomright: 4px; -moz-border-radius-bottomleft: 4px; border-bottom-right-radius: 4px; border-bottom-left-radius: 4px}
.linguetta4:hover {border-top: 7px solid #F3E1D6; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; font-color: #D9B99B; -webkit-border-bottom-right-radius: 4px; -webkit-border-bottom-left-radius: 4px; -moz-border-radius-bottomright: 4px; -moz-border-radius-bottomleft: 4px; border-bottom-right-radius: 4px; border-bottom-left-radius: 4px}
/* SIDEBAR ALEX | TITOLO, ANTEPRIME -se copiate vi disintegro- */
.anteprima1 {position: relative; margin-left: -5px; margin-top: 30px; width: 100px; height: 100px; z-index: 9}
.prima1 {width: 100px; height: 100px; z-index: 9; font-size: 8px; text-padding: 3px; text-align: justify; background: #F3E9D6; border: 4px solid #F3E9D6; border-radius: 2px}
.dopo1 {opacity: 0.0; width: 100px; height: 0; color: #FFFFFF; background-color: #E7B7AC; width: 100px; margin-top: 0; position: absolute; font-size: 0; transition-duration: 0.6s; -moz-transition-duration: 0.6s; -webkit-transition-duration: 0.6s; -o-transition-duration: 0.6s}
.anteprima1:hover .dopo1 {opacity: 1.0; width: 108px; height: 16px; margin-top: -18px; font-family: cambria; font-size: 11px; text-align: center; line-height: 14px; text-transform: uppercase; transition-duration: 0.6s; -moz-transition-duration: 0.6s; -webkit-transition-duration: 0.6s; -o-transition-duration: 0.6s}
.anteprima2 {position: relative; margin-left: 1px; margin-top: 13px; width: 50px; height: 50px; z-index: 9; display: inline-block}
.prima2 {width: 50px; height: 50px; z-index: 9; font-size: 8px; text-padding: 3px; text-align: justify; background: #F3E9D6; border: 3px solid #F3E9D6; border-radius: 2px}
.dopo2 {opacity: 0.0; width: 50px; height: 0; color: #FFFFFF; background-color: #E7B7AC; margin-top: 0; position: absolute; font-size: 0; transition-duration: 0.6s; -moz-transition-duration: 0.6s; -webkit-transition-duration: 0.6s; -o-transition-duration: 0.6s}
.anteprima2:hover .dopo2 {opacity: 1.0; width: 56px; height: 14px; margin-top: -14px; font-family: cambria; font-size: 11px; text-align: center; line-height: 14px; text-transform: uppercase; transition-duration: 0.6s; -moz-transition-duration: 0.6s; -webkit-transition-duration: 0.6s; -o-transition-duration: 0.6s}
.anteprima3 {position: relative; margin-left: 9px; margin-top: 13px; width: 50px; height: 50px; z-index: 9; display: inline-block}
.prima3 {width: 50px; height: 50px; z-index: 9; font-size: 8px; text-padding: 3px; text-align: justify; background: #F3E9D6; border: 3px solid #F3E9D6; border-radius: 2px}
.dopo3 {opacity: 0.0; width: 50px; height: 0; color: #FFFFFF; background-color: #E7B7AC; margin-top: 0; position: absolute; font-size: 0; transition-duration: 0.6s; -moz-transition-duration: 0.6s; -webkit-transition-duration: 0.6s; -o-transition-duration: 0.6s}
.anteprima3:hover .dopo3 {opacity: 1.0; width: 56px; height: 14px; margin-top: -14px; font-family: cambria; font-size: 11px; text-align: center; text-transform: uppercase; line-height: 14px; transition-duration: 0.6s; -moz-transition-duration: 0.6s; -webkit-transition-duration: 0.6s; -o-transition-duration: 0.6s}
.titolosidebar {position: relative; margin-left: 4px; margin-top: 39px; z-index: 9; font-family: cambria, calibri; font-size: 11px; text-transform: uppercase; color: #AD9384; text-align: center; line-height; 10px}
.sottotitolosidebar {position: relative; margin-left: 4px; margin-top: -8px; z-index: 9; font-family: cambria, calibri; font-size: 10px; text-transform: lowercase; color: #AD9384; text-align: center; line-height; 10px; opacity: 0.8; font-style: italic}
/* SIDEBAR ALEX | INFO/NEWS -se copiate vi disintegro- */
.altro1 {margin-top: 9px; width: 250px; height: 60px; z-index: 9; font-family: cambria, sans-serif, times; font-size: 10px; line-height: 10px; padding-top: 4px; padding-bottom: 4px; text-align: justify; background: #FFFFFF; border-top: 2px solid #F3E1D6; border-bottom: 2px solid #F3E1D6; text-transform: lowercase; overflow-y: scroll}
/* SIDEBAR ALEX | LINK 1 -se copiate vi disintegro- */
#linkposition1 {margin-left: 9px; margin-top: -5px; display: inline-block}
#link1 {-webkit-transform-style: preserve-3d; -webkit-perspective: 1000; width: 65px; height: 20px; position: relative; margin-top: 15px}
#link-container1 {display: inline-block; text-align: center}
#link-container1:hover .dietro1 {-webkit-transform: rotatey(0deg)}
#link-container1:hover .avanti1 {-webkit-transform: rotatey(-180deg)}
.dietro1, .avanti1 {position: absolute; -webkit-backface-visibility: hidden; -webkit-transition: -webkit-transform 0.5s ease-in; width: 100%; height: 100%; padding: 5px; font-family: cambria, sans-serif; text-transform: lowercase; font-size: 11px; line-height: 10px; color: #B59F91}
.dietro1 {-webkit-transform: rotatey(180deg); background-color: #F3E1D6; overflow: hidden}
.avanti1 {background: #F3E1D6}
#linkposition2 {margin-left: 11px; margin-top: -5px; display: inline-block}
#link2 {-webkit-transform-style: preserve-3d; -webkit-perspective: 1000; width: 65px; height: 20px; position: relative; margin-top: 15px}
#link-container2 {display: inline-block; text-align: center}
#link-container2:hover .dietro2 {-webkit-transform: rotatey(0deg)}
#link-container2:hover .avanti2 {-webkit-transform: rotatey(-180deg)}
.dietro2, .avanti2 {position: absolute; -webkit-backface-visibility: hidden; -webkit-transition: -webkit-transform 0.5s ease-in; width: 100%; height: 100%; padding: 5px; font-family: cambria, sans-serif; text-transform: lowercase; font-size: 11px; line-height: 10px; color: #B59F91}
.dietro2 {-webkit-transform: rotatey(180deg); background-color: #F3EAD6; overflow: hidden}
.avanti2 {background: #F3EAD6}
#linkposition3 {margin-left: 11px; margin-top: -5px; display: inline-block}
#link3 {-webkit-transform-style: preserve-3d; -webkit-perspective: 1000; width: 65px; height: 20px; position: relative; margin-top: 15px}
#link-container3 {display: inline-block; text-align: center}
#link-container3:hover .dietro3 {-webkit-transform: rotatey(0deg)}
#link-container3:hover .avanti3 {-webkit-transform: rotatey(-180deg)}
.dietro3, .avanti3 {position: absolute; -webkit-backface-visibility: hidden; -webkit-transition: -webkit-transform 0.5s ease-in; width: 100%; height: 100%; padding: 5px; font-family: cambria, sans-serif; text-transform: lowercase; font-size: 11px; line-height: 10px; color: #B59F91}
.dietro3 {-webkit-transform: rotatey(180deg); background-color: #F3E1D6; overflow: hidden}
.avanti3 {background: #F3E1D6}
/* SIDEBAR GUINEVERE | GIF -se copiate vi disintegro- */
.gif {width: 230px; height: 110px; margin-top: 15px; margin-left: 8px}
.gifgif {width: 230px; height: 110px; border-radius: 3px; background-color: #FFFFFF; border: 2px solid #F3E1D6; position: relative; z-index: 9; background-image: url(https://i.imgur.com/qwIiknA.gif); opacity: 1}
/* SIDEBAR | LINK 2 -se copiate vi disintegro- */
#linkposition4 {margin-left: 8px; margin-top: -5px; display: inline-block}
#link4 {-webkit-transform-style: preserve-3d; -webkit-perspective: 1000; width: 65px; height: 20px; position: relative; margin-top: 15px}
#link-container4 {display: inline-block; text-align: center}
#link-container4:hover .dietro4 {-webkit-transform: rotatey(0deg)}
#link-container4:hover .avanti4 {-webkit-transform: rotatey(-180deg)}
.dietro4, .avanti4 {position: absolute; -webkit-backface-visibility: hidden; -webkit-transition: -webkit-transform 0.5s ease-in; width: 100%; height: 100%; padding: 5px; font-family: cambria, sans-serif; text-transform: lowercase; font-size: 11px; line-height: 10px; color: #B59F91}
.dietro4 {-webkit-transform: rotatey(180deg); background-color: #F3EAD6; overflow: hidden}
.avanti4 {background: #F3EAD6}
#linkposition5 {margin-left: 11px; margin-top: -6px; display: inline-block}
#link5 {-webkit-transform-style: preserve-3d; -webkit-perspective: 1000; width: 65px; height: 20px; position: relative; margin-top: 15px}
#link-container5 {display: inline-block; text-align: center}
#link-container5:hover .dietro5 {-webkit-transform: rotatey(0deg)}
#link-container5:hover .avanti5 {-webkit-transform: rotatey(-180deg)}
.dietro5, .avanti5 {position: absolute; -webkit-backface-visibility: hidden; -webkit-transition: -webkit-transform 0.5s ease-in; width: 100%; height: 100%; padding: 5px; font-family: cambria, sans-serif; text-transform: lowercase; font-size: 11px; line-height: 10px; color: #B59F91}
.dietro5 {-webkit-transform: rotatey(180deg); background-color: #F3E1D6; overflow: hidden}
.avanti5 {background: #F3E1D6}
#linkposition6 {margin-left: 11px; margin-top: -6px; display: inline-block}
#link6 {-webkit-transform-style: preserve-3d; -webkit-perspective: 1000; width: 65px; height: 20px; position: relative; margin-top: 15px}
#link-container6 {display: inline-block; text-align: center}
#link-container6:hover .dietro6 {-webkit-transform: rotatey(0deg)}
#link-container6:hover .avanti6 {-webkit-transform: rotatey(-180deg)}
.dietro6, .avanti6 {position: absolute; -webkit-backface-visibility: hidden; -webkit-transition: -webkit-transform 0.5s ease-in; width: 100%; height: 100%; padding: 5px; font-family: cambria, sans-serif; text-transform: lowercase; font-size: 11px; line-height: 10px; color: #B59F91}
.dietro6 {-webkit-transform: rotatey(180deg); background-color: #F3EAD6; overflow: hidden}
.avanti6 {background: #F3EAD6}
/* SIDEBAR | QUOTE -se copiate vi disintegro- */
.altro2 {margin-top: 15px; width: 235px; height: auto; z-index: 9; font-family: georgia; font-size: 10px; line-height: 11px; padding: 4px; text-align: justify; background: #FFFFFF; border-top: 2px solid #F3E1D6; border-bottom: 2px solid #F3E1D6; text-transform: lowercase}
/* SIDEBAR | CREDITS -se copiate vi disintegro- */
.credits {margin-bottom: -40px; width: 230px; height: 12px; background: #F7EDE7; border-bottom: 2px solid #ECD9B9; z-index: 9; font-family: cambria; font-size: 9px; letter-spacing: 1px; text-align: center; text-transform: uppercase; position: absolute; line-height: 14px; margin-left: 10px}
#sidebar {margin-left: 15px; margin-top: 20px; background: #FFFFFF; border: 2px solid #F3E1D6; width: 250px; height: 80%; position: fixed; z-index: 9}
.credits {bottom: 30px; width: 250px; height: auto; z-index: 9; font-family: century gothic; font-size: 9px; line-height: 9px; padding-top: 3px; padding-bottom: 3px; text-align: center; text-transform: uppercase; position: absolute}
/* SIDEBAR ALEX | LINK GENERICI -se copiate vi disintegro- */
.linguetta1 {position: fixed; margin-top: -1px; width: 52px; height: 15px; margin-left: 8px; background-color: #F3E1D6; border-top: 1px solid #F3E1D6; float: left; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; font-family: cambria, calibri; font-size: 11px; color: #D9B99B; text-align: center; line-height: 12px; -webkit-border-bottom-right-radius: 4px; -webkit-border-bottom-left-radius: 4px; -moz-border-radius-bottomright: 4px; -moz-border-radius-bottomleft: 4px; border-bottom-right-radius: 4px; border-bottom-left-radius: 4px}
.linguetta1:hover {border-top: 7px solid #F3E1D6; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; font-color: #D9B99B; -webkit-border-bottom-right-radius: 4px; -webkit-border-bottom-left-radius: 4px; -moz-border-radius-bottomright: 4px; -moz-border-radius-bottomleft: 4px; border-bottom-right-radius: 4px; border-bottom-left-radius: 4px}
.linguetta2 {position: fixed; margin-top: -1px; width: 52px; height: 15px; margin-left: 68px; background-color: #F3E1D6; border-top: 1px solid #F3E1D6; float: left; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; font-family: cambria, calibri; font-size: 11px; color: #D9B99B; text-align: center; line-height: 12px; -webkit-border-bottom-right-radius: 4px; -webkit-border-bottom-left-radius: 4px; -moz-border-radius-bottomright: 4px; -moz-border-radius-bottomleft: 4px; border-bottom-right-radius: 4px; border-bottom-left-radius: 4px}
.linguetta2:hover {border-top: 7px solid #F3E1D6; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; font-color: #D9B99B; -webkit-border-bottom-right-radius: 4px; -webkit-border-bottom-left-radius: 4px; -moz-border-radius-bottomright: 4px; -moz-border-radius-bottomleft: 4px; border-bottom-right-radius: 4px; border-bottom-left-radius: 4px}
.linguetta3 {position: fixed; margin-top: -1px; width: 52px; height: 15px; margin-left: 128px; background-color: #F3E1D6; border-top: 1px solid #F3E1D6; float: left; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; font-family: cambria, calibri; font-size: 11px; color: #D9B99B; text-align: center; line-height: 12px; -webkit-border-bottom-right-radius: 4px; -webkit-border-bottom-left-radius: 4px; -moz-border-radius-bottomright: 4px; -moz-border-radius-bottomleft: 4px; border-bottom-right-radius: 4px; border-bottom-left-radius: 4px}
.linguetta3:hover {border-top: 7px solid #F3E1D6; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; font-color: #D9B99B; -webkit-border-bottom-right-radius: 4px; -webkit-border-bottom-left-radius: 4px; -moz-border-radius-bottomright: 4px; -moz-border-radius-bottomleft: 4px; border-bottom-right-radius: 4px; border-bottom-left-radius: 4px}
.linguetta4 {position: fixed; margin-top: -1px; width: 52px; height: 15px; margin-left: 188px; background-color: #F3E1D6; border-top: 1px solid #F3E1D6; float: left; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; font-family: cambria, calibri; font-size: 11px; color: #D9B99B; text-align: center; line-height: 12px; -webkit-border-bottom-right-radius: 4px; -webkit-border-bottom-left-radius: 4px; -moz-border-radius-bottomright: 4px; -moz-border-radius-bottomleft: 4px; border-bottom-right-radius: 4px; border-bottom-left-radius: 4px}
.linguetta4:hover {border-top: 7px solid #F3E1D6; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; font-color: #D9B99B; -webkit-border-bottom-right-radius: 4px; -webkit-border-bottom-left-radius: 4px; -moz-border-radius-bottomright: 4px; -moz-border-radius-bottomleft: 4px; border-bottom-right-radius: 4px; border-bottom-left-radius: 4px}
/* SIDEBAR ALEX | TITOLO, ANTEPRIME -se copiate vi disintegro- */
.anteprima1 {position: relative; margin-left: -5px; margin-top: 30px; width: 100px; height: 100px; z-index: 9}
.prima1 {width: 100px; height: 100px; z-index: 9; font-size: 8px; text-padding: 3px; text-align: justify; background: #F3E9D6; border: 4px solid #F3E9D6; border-radius: 2px}
.dopo1 {opacity: 0.0; width: 100px; height: 0; color: #FFFFFF; background-color: #E7B7AC; width: 100px; margin-top: 0; position: absolute; font-size: 0; transition-duration: 0.6s; -moz-transition-duration: 0.6s; -webkit-transition-duration: 0.6s; -o-transition-duration: 0.6s}
.anteprima1:hover .dopo1 {opacity: 1.0; width: 108px; height: 16px; margin-top: -18px; font-family: cambria; font-size: 11px; text-align: center; line-height: 14px; text-transform: uppercase; transition-duration: 0.6s; -moz-transition-duration: 0.6s; -webkit-transition-duration: 0.6s; -o-transition-duration: 0.6s}
.anteprima2 {position: relative; margin-left: 1px; margin-top: 13px; width: 50px; height: 50px; z-index: 9; display: inline-block}
.prima2 {width: 50px; height: 50px; z-index: 9; font-size: 8px; text-padding: 3px; text-align: justify; background: #F3E9D6; border: 3px solid #F3E9D6; border-radius: 2px}
.dopo2 {opacity: 0.0; width: 50px; height: 0; color: #FFFFFF; background-color: #E7B7AC; margin-top: 0; position: absolute; font-size: 0; transition-duration: 0.6s; -moz-transition-duration: 0.6s; -webkit-transition-duration: 0.6s; -o-transition-duration: 0.6s}
.anteprima2:hover .dopo2 {opacity: 1.0; width: 56px; height: 14px; margin-top: -14px; font-family: cambria; font-size: 11px; text-align: center; line-height: 14px; text-transform: uppercase; transition-duration: 0.6s; -moz-transition-duration: 0.6s; -webkit-transition-duration: 0.6s; -o-transition-duration: 0.6s}
.anteprima3 {position: relative; margin-left: 9px; margin-top: 13px; width: 50px; height: 50px; z-index: 9; display: inline-block}
.prima3 {width: 50px; height: 50px; z-index: 9; font-size: 8px; text-padding: 3px; text-align: justify; background: #F3E9D6; border: 3px solid #F3E9D6; border-radius: 2px}
.dopo3 {opacity: 0.0; width: 50px; height: 0; color: #FFFFFF; background-color: #E7B7AC; margin-top: 0; position: absolute; font-size: 0; transition-duration: 0.6s; -moz-transition-duration: 0.6s; -webkit-transition-duration: 0.6s; -o-transition-duration: 0.6s}
.anteprima3:hover .dopo3 {opacity: 1.0; width: 56px; height: 14px; margin-top: -14px; font-family: cambria; font-size: 11px; text-align: center; text-transform: uppercase; line-height: 14px; transition-duration: 0.6s; -moz-transition-duration: 0.6s; -webkit-transition-duration: 0.6s; -o-transition-duration: 0.6s}
.titolosidebar {position: relative; margin-left: 4px; margin-top: 39px; z-index: 9; font-family: cambria, calibri; font-size: 11px; text-transform: uppercase; color: #AD9384; text-align: center; line-height; 10px}
.sottotitolosidebar {position: relative; margin-left: 4px; margin-top: -8px; z-index: 9; font-family: cambria, calibri; font-size: 10px; text-transform: lowercase; color: #AD9384; text-align: center; line-height; 10px; opacity: 0.8; font-style: italic}
/* SIDEBAR ALEX | INFO/NEWS -se copiate vi disintegro- */
.altro1 {margin-top: 9px; width: 250px; height: 60px; z-index: 9; font-family: cambria, sans-serif, times; font-size: 10px; line-height: 10px; padding-top: 4px; padding-bottom: 4px; text-align: justify; background: #FFFFFF; border-top: 2px solid #F3E1D6; border-bottom: 2px solid #F3E1D6; text-transform: lowercase; overflow-y: scroll}
/* SIDEBAR ALEX | LINK 1 -se copiate vi disintegro- */
#linkposition1 {margin-left: 9px; margin-top: -5px; display: inline-block}
#link1 {-webkit-transform-style: preserve-3d; -webkit-perspective: 1000; width: 65px; height: 20px; position: relative; margin-top: 15px}
#link-container1 {display: inline-block; text-align: center}
#link-container1:hover .dietro1 {-webkit-transform: rotatey(0deg)}
#link-container1:hover .avanti1 {-webkit-transform: rotatey(-180deg)}
.dietro1, .avanti1 {position: absolute; -webkit-backface-visibility: hidden; -webkit-transition: -webkit-transform 0.5s ease-in; width: 100%; height: 100%; padding: 5px; font-family: cambria, sans-serif; text-transform: lowercase; font-size: 11px; line-height: 10px; color: #B59F91}
.dietro1 {-webkit-transform: rotatey(180deg); background-color: #F3E1D6; overflow: hidden}
.avanti1 {background: #F3E1D6}
#linkposition2 {margin-left: 11px; margin-top: -5px; display: inline-block}
#link2 {-webkit-transform-style: preserve-3d; -webkit-perspective: 1000; width: 65px; height: 20px; position: relative; margin-top: 15px}
#link-container2 {display: inline-block; text-align: center}
#link-container2:hover .dietro2 {-webkit-transform: rotatey(0deg)}
#link-container2:hover .avanti2 {-webkit-transform: rotatey(-180deg)}
.dietro2, .avanti2 {position: absolute; -webkit-backface-visibility: hidden; -webkit-transition: -webkit-transform 0.5s ease-in; width: 100%; height: 100%; padding: 5px; font-family: cambria, sans-serif; text-transform: lowercase; font-size: 11px; line-height: 10px; color: #B59F91}
.dietro2 {-webkit-transform: rotatey(180deg); background-color: #F3EAD6; overflow: hidden}
.avanti2 {background: #F3EAD6}
#linkposition3 {margin-left: 11px; margin-top: -5px; display: inline-block}
#link3 {-webkit-transform-style: preserve-3d; -webkit-perspective: 1000; width: 65px; height: 20px; position: relative; margin-top: 15px}
#link-container3 {display: inline-block; text-align: center}
#link-container3:hover .dietro3 {-webkit-transform: rotatey(0deg)}
#link-container3:hover .avanti3 {-webkit-transform: rotatey(-180deg)}
.dietro3, .avanti3 {position: absolute; -webkit-backface-visibility: hidden; -webkit-transition: -webkit-transform 0.5s ease-in; width: 100%; height: 100%; padding: 5px; font-family: cambria, sans-serif; text-transform: lowercase; font-size: 11px; line-height: 10px; color: #B59F91}
.dietro3 {-webkit-transform: rotatey(180deg); background-color: #F3E1D6; overflow: hidden}
.avanti3 {background: #F3E1D6}
/* SIDEBAR GUINEVERE | GIF -se copiate vi disintegro- */
.gif {width: 230px; height: 110px; margin-top: 15px; margin-left: 8px}
.gifgif {width: 230px; height: 110px; border-radius: 3px; background-color: #FFFFFF; border: 2px solid #F3E1D6; position: relative; z-index: 9; background-image: url(https://i.imgur.com/qwIiknA.gif); opacity: 1}
/* SIDEBAR | LINK 2 -se copiate vi disintegro- */
#linkposition4 {margin-left: 8px; margin-top: -5px; display: inline-block}
#link4 {-webkit-transform-style: preserve-3d; -webkit-perspective: 1000; width: 65px; height: 20px; position: relative; margin-top: 15px}
#link-container4 {display: inline-block; text-align: center}
#link-container4:hover .dietro4 {-webkit-transform: rotatey(0deg)}
#link-container4:hover .avanti4 {-webkit-transform: rotatey(-180deg)}
.dietro4, .avanti4 {position: absolute; -webkit-backface-visibility: hidden; -webkit-transition: -webkit-transform 0.5s ease-in; width: 100%; height: 100%; padding: 5px; font-family: cambria, sans-serif; text-transform: lowercase; font-size: 11px; line-height: 10px; color: #B59F91}
.dietro4 {-webkit-transform: rotatey(180deg); background-color: #F3EAD6; overflow: hidden}
.avanti4 {background: #F3EAD6}
#linkposition5 {margin-left: 11px; margin-top: -6px; display: inline-block}
#link5 {-webkit-transform-style: preserve-3d; -webkit-perspective: 1000; width: 65px; height: 20px; position: relative; margin-top: 15px}
#link-container5 {display: inline-block; text-align: center}
#link-container5:hover .dietro5 {-webkit-transform: rotatey(0deg)}
#link-container5:hover .avanti5 {-webkit-transform: rotatey(-180deg)}
.dietro5, .avanti5 {position: absolute; -webkit-backface-visibility: hidden; -webkit-transition: -webkit-transform 0.5s ease-in; width: 100%; height: 100%; padding: 5px; font-family: cambria, sans-serif; text-transform: lowercase; font-size: 11px; line-height: 10px; color: #B59F91}
.dietro5 {-webkit-transform: rotatey(180deg); background-color: #F3E1D6; overflow: hidden}
.avanti5 {background: #F3E1D6}
#linkposition6 {margin-left: 11px; margin-top: -6px; display: inline-block}
#link6 {-webkit-transform-style: preserve-3d; -webkit-perspective: 1000; width: 65px; height: 20px; position: relative; margin-top: 15px}
#link-container6 {display: inline-block; text-align: center}
#link-container6:hover .dietro6 {-webkit-transform: rotatey(0deg)}
#link-container6:hover .avanti6 {-webkit-transform: rotatey(-180deg)}
.dietro6, .avanti6 {position: absolute; -webkit-backface-visibility: hidden; -webkit-transition: -webkit-transform 0.5s ease-in; width: 100%; height: 100%; padding: 5px; font-family: cambria, sans-serif; text-transform: lowercase; font-size: 11px; line-height: 10px; color: #B59F91}
.dietro6 {-webkit-transform: rotatey(180deg); background-color: #F3EAD6; overflow: hidden}
.avanti6 {background: #F3EAD6}
/* SIDEBAR | QUOTE -se copiate vi disintegro- */
.altro2 {margin-top: 15px; width: 235px; height: auto; z-index: 9; font-family: georgia; font-size: 10px; line-height: 11px; padding: 4px; text-align: justify; background: #FFFFFF; border-top: 2px solid #F3E1D6; border-bottom: 2px solid #F3E1D6; text-transform: lowercase}
/* SIDEBAR | CREDITS -se copiate vi disintegro- */
.credits {margin-bottom: -40px; width: 230px; height: 12px; background: #F7EDE7; border-bottom: 2px solid #ECD9B9; z-index: 9; font-family: cambria; font-size: 9px; letter-spacing: 1px; text-align: center; text-transform: uppercase; position: absolute; line-height: 14px; margin-left: 10px}
Stamp ripper » sua sidebar
suo code (stamp | stamp code -> 1 . 2 . 3 . 4)
SPOILER (clicca per visualizzare)
/* SIDEBAR ˜ BÖLEYN - copiate e vi mangio il fegato con un bel piatto di fave e un buon Chianti...- */
#sidebar {position: fixed; margin-top: 10%; margin-left: 25px; height: 43%; width: 230px; z-index: 9; border-radius: 5px; -moz-border-radius: 5px; background-color: #FFFCF7; border: 2px solid #FFE3A2}
.linguetta1 {position: fixed; margin-margin-top: -1px; width: 52px; height: 15px; margin-left: 2px; background-color: #FFDD8D; border-top: 1px solid #F5CBD0; float: left; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; font-family: georgia; font-style: italic; font-size: 12px; font-color: #DBE3D2; text-align: center; -webkit-border-bottom-right-radius: 4px; -webkit-border-bottom-left-radius: 4px; -moz-border-radius-bottomright: 4px; -moz-border-radius-bottomleft: 4px; border-bottom-right-radius: 4px; border-bottom-left-radius: 4px}
.linguetta1:hover {border-top: 7px solid #FFFCF7; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; font-color: #DBE3D2; -webkit-border-bottom-right-radius: 4px; -webkit-border-bottom-left-radius: 4px; -moz-border-radius-bottomright: 4px; -moz-border-radius-bottomleft: 4px; border-bottom-right-radius: 4px; border-bottom-left-radius: 4px}
.linguetta2 {position: fixed; margin-top: -1px; width: 52px; height: 15px; margin-left: 62px; background-color: #FFDD8D; border-top: 1px solid #F5CBD0; float: left; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; font-family: georgia; font-style: italic; font-size: 12px; color: #DBE3D2; text-align: center; -webkit-border-bottom-right-radius: 4px; -webkit-border-bottom-left-radius: 4px; -moz-border-radius-bottomright: 4px; -moz-border-radius-bottomleft: 4px; border-bottom-right-radius: 4px; border-bottom-left-radius: 4px}
.linguetta2:hover {border-top: 7px solid #FFFCF7; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; font-color: #DBE3D2 -webkit-border-bottom-right-radius: 4px; -webkit-border-bottom-left-radius: 4px; -moz-border-radius-bottomright: 4px; -moz-border-radius-bottomleft: 4px; border-bottom-right-radius: 4px; border-bottom-left-radius: 4px}
.linguetta3 {position: fixed; margin-top: -1px; width: 52px; height: 15px; margin-left: 122px; background-color: #FFDD8D; border-top: 1px solid #F5CBD0; float: left; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; font-family: georgia; font-style: italic; font-size: 12px; color: #DBE3D2; text-align: center; -webkit-border-bottom-right-radius: 4px; -webkit-border-bottom-left-radius: 4px; -moz-border-radius-bottomright: 4px; -moz-border-radius-bottomleft: 4px; border-bottom-right-radius: 4px; border-bottom-left-radius: 4px}
.linguetta3:hover {border-top: 7px solid #FFFCF7; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; font-color: #DBE3D2; -webkit-border-bottom-right-radius: 4px; -webkit-border-bottom-left-radius: 4px; -moz-border-radius-bottomright: 4px; -moz-border-radius-bottomleft: 4px; border-bottom-right-radius: 4px; border-bottom-left-radius: 4px}
.linguetta4 {position: fixed; margin-top: -1px; width: 45px; height: 15px; margin-left: 182px; background-color: #FFDD8D; border-top: 1px solid #F5CBD0; float: left; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; font-family: georgia; font-style: italic; font-size: 12px; color: #DBE3D2; text-align: center; -webkit-border-bottom-right-radius: 4px; -webkit-border-bottom-left-radius: 4px; -moz-border-radius-bottomright: 4px; -moz-border-radius-bottomleft: 4px; border-bottom-right-radius: 4px; border-bottom-left-radius: 4px}
.linguetta4:hover {border-top: 7px solid #FFFCF7; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; font-color: #DBE3D2; -webkit-border-bottom-right-radius: 4px; -webkit-border-bottom-left-radius: 4px; -moz-border-radius-bottomright: 4px; -moz-border-radius-bottomleft: 4px; border-bottom-right-radius: 4px; border-bottom-left-radius: 4px}
/* Icon*/
.box1 {position: relative; margin-left: 5px; margin-top: 10%; width: 100px; height: 100px}
.main1 {width: 100px; height: 100px; font-size: 8px; text-padding: 3px; text-align: justify; background: #FFFAEE; border: 3px solid #F5CBD0; border-radius: 100%; -moz-border-radius: 100%; z-index: 9; background-image: url(https://i.imgur.com/nKgpXjC.png); opacity: 0.8}
.b1 {opacity: 0.0; width: 100px; height: 0; z-index: 5; color: #EB9CB4; background-color: #FFFAEE; width: 100px; margin-top: 0; position: absolute; font-size: 0; transition-duration: 0.6s; -moz-transition-duration: 0.6s; -webkit-transition-duration: 0.6s; -o-transition-duration: 0.6s}
.box1:hover .b1 {opacity: 0.8; width: 108px; height: auto; line-height: 12px; margin-top: -68px; font-family: cambria; font-size: 11px; text-align: center; padding-top: 3px; padding-bottom: 3px; transition-duration: 0.6s; -moz-transition-duration: 0.6s; -webkit-transition-duration: 0.6s; -o-transition-duration: 0.6s}
.sidetext {width: 105px;
height: 75px;
position: fixed;
top: 190px;
left: 145px;
color: #A3A3A3;
line-height: 10px;
font-size: 9px;
letter-spacing: 1px;
word-spacing: 2px;
font-family: georgia}
#titolo {margin-top: 5%; width: 230px; height: auto; z-index: 9; font-family: cambria, sans-serif, georgia; font-size: 11px; text-transform: uppercase; line-height: 12px; text-align: center; color: #A3A3A3; background: #FFFAEE; border-top: 1px solid #FFDD8D; border-bottom: 2px solid #FFDD8D}
#iconsposition {margin-left: 5px; margin-top: 0; display: inline-block}
#icons {-webkit-transform-style: preserve-3d; -webkit-perspective: 1000; width: 60px; height: 25px; position: relative; margin-top: 10px}
#icons-container {display: inline-block; text-align: center}
#icons-container:hover .back {-webkit-transform: rotatey(0deg)}
#icons-container:hover .front {-webkit-transform: rotatey(-180deg)}
.back, .front {position: absolute; -webkit-backface-visibility: hidden; -webkit-transition: -webkit-transform 0.5s ease-in; width: 100%; height: 100%; padding: 5px; font-family: georgia, sans-serif; font-style: italic; text-transform: lowercase; font-size: 10px; line-height: 10px; color: #343B36}
.back {-webkit-transform: rotatey(180deg); background-color: #FFFAEE; overflow: hidden}
.front {background: #FFFAEE}
#iconsposition2 {margin-left: 11px; margin-top: 0; display: inline-block}
#icons2 {-webkit-transform-style: preserve-3d; -webkit-perspective: 1000; width: 60px; height: 25px; position: relative; margin-top: 10px}
#icons-container2 {display: inline-block; text-align: center}
#icons-container2:hover .back2 {-webkit-transform: rotatey(0deg)}
#icons-container2:hover .front2 {-webkit-transform: rotatey(-180deg)}
.back2, .front2 {position: absolute; -webkit-backface-visibility: hidden; -webkit-transition: -webkit-transform 0.5s ease-in; width: 100%; height: 100%; padding: 5px; font-family: georgia, sans-serif; font-style: italic; text-transform: lowercase; font-size: 10px; line-height: 10px; color: #FFFFFF}
.back2 {-webkit-transform: rotatey(180deg); background-color: #FEF2D4; overflow: hidden}
.front2 {background: #FEF2D4}
#iconsposition3 {margin-left: 11px; margin-top: 0; display: inline-block}
#icons3 {-webkit-transform-style: preserve-3d; -webkit-perspective: 1000; width: 60px; height: 25px; position: relative; margin-top: 10px}
#icons-container3 {display: inline-block; text-align: center}
#icons-container3:hover .back3 {-webkit-transform: rotatey(0deg)}
#icons-container3:hover .front3 {-webkit-transform: rotatey(-180deg)}
.back3, .front3 {position: absolute; -webkit-backface-visibility: hidden; -webkit-transition: -webkit-transform 0.5s ease-in; width: 100%; height: 100%; padding: 5px; font-family: georgia, sans-serif; font-style: italic; text-transform: lowercase; font-size: 10px; line-height: 10px; color: #FFFFFF}
.back3 {-webkit-transform: rotatey(180deg); background-color: #FFFAEE; overflow: hidden}
.front3 {background: #FFFAEE}
#iconsposition4 {margin-left: 5px; margin-top: -2px; display: inline-block}
#icons4 {-webkit-transform-style: preserve-3d; -webkit-perspective: 1000; width: 60px; height: 25px; position: relative; margin-top: 12px}
#icons-container4 {display: inline-block; text-align: center}
#icons-container4:hover .back4 {-webkit-transform: rotatey(0deg)}
#icons-container4:hover .front4 {-webkit-transform: rotatey(-180deg)}
.back4, .front4 {position: absolute; -webkit-backface-visibility: hidden; -webkit-transition: -webkit-transform 0.5s ease-in; width: 100%; height: 100%; padding: 5px; font-family: georgia, sans-serif; font-style: italic; text-transform: lowercase; font-size: 10px; line-height: 10px; color: #FFFFFF}
.back4 {-webkit-transform: rotatey(180deg); background-color: #FEF2D4; overflow: hidden}
.front4 {background: #FEF2D4}
#iconsposition5 {margin-left: 11px; margin-top: -2px; display: inline-block}
#icons5 {-webkit-transform-style: preserve-3d; -webkit-perspective: 1000; width: 60px; height: 25px; position: relative; margin-top: 12px}
#icons-container5 {display: inline-block; text-align: center}
#icons-container5:hover .back5 {-webkit-transform: rotatey(0deg)}
#icons-container5:hover .front5 {-webkit-transform: rotatey(-180deg)}
.back5, .front5 {position: absolute; -webkit-backface-visibility: hidden; -webkit-transition: -webkit-transform 0.5s ease-in; width: 100%; height: 100%; padding: 5px; font-family: georgia, sans-serif; font-style: italic; text-transform: lowercase; font-size: 10px; line-height: 10px; color: #FFFFFF}
.back5 {-webkit-transform: rotatey(180deg); background-color: #FFFAEE; overflow: hidden}
.front5 {background: #FFFAEE}
#iconsposition6 {margin-left: 11px; margin-top: -2px; display: inline-block}
#icons6 {-webkit-transform-style: preserve-3d; -webkit-perspective: 1000; width: 60px; height: 25px; position: relative; margin-top: 12px}
#icons-container6 {display: inline-block; text-align: center}
#icons-container6:hover .back6 {-webkit-transform: rotatey(0deg)}
#icons-container6:hover .front6 {-webkit-transform: rotatey(-180deg)}
.back6, .front6 {position: absolute; -webkit-backface-visibility: hidden; -webkit-transition: -webkit-transform 0.5s ease-in; width: 100%; height: 100%; padding: 5px; font-family: georgia, sans-serif; font-style: italic; text-transform: lowercase; font-size: 10px; line-height: 10px; color: #FFFFFF}
.back6 {-webkit-transform: rotatey(180deg); background-color: #FEF2D4; overflow: hidden}
.front6 {background: #FEF2D4}
#iconsposition7 {margin-left: 40px; margin-top: -2px; display: inline-block}
#icons7 {-webkit-transform-style: preserve-3d; -webkit-perspective: 1000; width: 60px; height: 25px; position: relative; margin-top: 12px}
#icons-container7 {display: inline-block; text-align: center}
#icons-container7:hover .back7 {-webkit-transform: rotatey(0deg)}
#icons-container7:hover .front7 {-webkit-transform: rotatey(-180deg)}
.back7, .front7 {position: absolute; -webkit-backface-visibility: hidden; -webkit-transition: -webkit-transform 0.5s ease-in; width: 100%; height: 100%; padding: 5px; font-family: georgia, sans-serif; font-style: italic; text-transform: lowercase; font-size: 10px; line-height: 10px; color: #FFFFFF}
.back7 {-webkit-transform: rotatey(180deg); background-color: #FEF2D4; overflow: hidden}
.front7 {background: #FEF2D4}
#iconsposition8 {margin-left: 11px; margin-top: -2px; display: inline-block}
#icons8 {-webkit-transform-style: preserve-3d; -webkit-perspective: 1000; width: 60px; height: 25px; position: relative; margin-top: 12px}
#icons-container8 {display: inline-block; text-align: center}
#icons-container8:hover .back8 {-webkit-transform: rotatey(0deg)}
#icons-container8:hover .front8 {-webkit-transform: rotatey(-180deg)}
.back8, .front8 {position: absolute; -webkit-backface-visibility: hidden; -webkit-transition: -webkit-transform 0.5s ease-in; width: 100%; height: 100%; padding: 5px; font-family: georgia, sans-serif; font-style: italic; text-transform: lowercase; font-size: 10px; line-height: 10px; color: #FFFFFF}
.back8 {-webkit-transform: rotatey(180deg); background-color: #FFFAEE; overflow: hidden}
.front8 {background: #FFFAEE}
.credits {margin-top: 6%; width: 178px; height: 18px; z-index: 9; font-family: georgia; font-style: italic; font-size: 9px; color: #A3A3A3; line-height: 17px; text-align: center; text-transform: lowercase}
#sidebar {position: fixed; margin-top: 10%; margin-left: 25px; height: 43%; width: 230px; z-index: 9; border-radius: 5px; -moz-border-radius: 5px; background-color: #FFFCF7; border: 2px solid #FFE3A2}
.linguetta1 {position: fixed; margin-margin-top: -1px; width: 52px; height: 15px; margin-left: 2px; background-color: #FFDD8D; border-top: 1px solid #F5CBD0; float: left; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; font-family: georgia; font-style: italic; font-size: 12px; font-color: #DBE3D2; text-align: center; -webkit-border-bottom-right-radius: 4px; -webkit-border-bottom-left-radius: 4px; -moz-border-radius-bottomright: 4px; -moz-border-radius-bottomleft: 4px; border-bottom-right-radius: 4px; border-bottom-left-radius: 4px}
.linguetta1:hover {border-top: 7px solid #FFFCF7; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; font-color: #DBE3D2; -webkit-border-bottom-right-radius: 4px; -webkit-border-bottom-left-radius: 4px; -moz-border-radius-bottomright: 4px; -moz-border-radius-bottomleft: 4px; border-bottom-right-radius: 4px; border-bottom-left-radius: 4px}
.linguetta2 {position: fixed; margin-top: -1px; width: 52px; height: 15px; margin-left: 62px; background-color: #FFDD8D; border-top: 1px solid #F5CBD0; float: left; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; font-family: georgia; font-style: italic; font-size: 12px; color: #DBE3D2; text-align: center; -webkit-border-bottom-right-radius: 4px; -webkit-border-bottom-left-radius: 4px; -moz-border-radius-bottomright: 4px; -moz-border-radius-bottomleft: 4px; border-bottom-right-radius: 4px; border-bottom-left-radius: 4px}
.linguetta2:hover {border-top: 7px solid #FFFCF7; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; font-color: #DBE3D2 -webkit-border-bottom-right-radius: 4px; -webkit-border-bottom-left-radius: 4px; -moz-border-radius-bottomright: 4px; -moz-border-radius-bottomleft: 4px; border-bottom-right-radius: 4px; border-bottom-left-radius: 4px}
.linguetta3 {position: fixed; margin-top: -1px; width: 52px; height: 15px; margin-left: 122px; background-color: #FFDD8D; border-top: 1px solid #F5CBD0; float: left; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; font-family: georgia; font-style: italic; font-size: 12px; color: #DBE3D2; text-align: center; -webkit-border-bottom-right-radius: 4px; -webkit-border-bottom-left-radius: 4px; -moz-border-radius-bottomright: 4px; -moz-border-radius-bottomleft: 4px; border-bottom-right-radius: 4px; border-bottom-left-radius: 4px}
.linguetta3:hover {border-top: 7px solid #FFFCF7; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; font-color: #DBE3D2; -webkit-border-bottom-right-radius: 4px; -webkit-border-bottom-left-radius: 4px; -moz-border-radius-bottomright: 4px; -moz-border-radius-bottomleft: 4px; border-bottom-right-radius: 4px; border-bottom-left-radius: 4px}
.linguetta4 {position: fixed; margin-top: -1px; width: 45px; height: 15px; margin-left: 182px; background-color: #FFDD8D; border-top: 1px solid #F5CBD0; float: left; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; font-family: georgia; font-style: italic; font-size: 12px; color: #DBE3D2; text-align: center; -webkit-border-bottom-right-radius: 4px; -webkit-border-bottom-left-radius: 4px; -moz-border-radius-bottomright: 4px; -moz-border-radius-bottomleft: 4px; border-bottom-right-radius: 4px; border-bottom-left-radius: 4px}
.linguetta4:hover {border-top: 7px solid #FFFCF7; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; font-color: #DBE3D2; -webkit-border-bottom-right-radius: 4px; -webkit-border-bottom-left-radius: 4px; -moz-border-radius-bottomright: 4px; -moz-border-radius-bottomleft: 4px; border-bottom-right-radius: 4px; border-bottom-left-radius: 4px}
/* Icon*/
.box1 {position: relative; margin-left: 5px; margin-top: 10%; width: 100px; height: 100px}
.main1 {width: 100px; height: 100px; font-size: 8px; text-padding: 3px; text-align: justify; background: #FFFAEE; border: 3px solid #F5CBD0; border-radius: 100%; -moz-border-radius: 100%; z-index: 9; background-image: url(https://i.imgur.com/nKgpXjC.png); opacity: 0.8}
.b1 {opacity: 0.0; width: 100px; height: 0; z-index: 5; color: #EB9CB4; background-color: #FFFAEE; width: 100px; margin-top: 0; position: absolute; font-size: 0; transition-duration: 0.6s; -moz-transition-duration: 0.6s; -webkit-transition-duration: 0.6s; -o-transition-duration: 0.6s}
.box1:hover .b1 {opacity: 0.8; width: 108px; height: auto; line-height: 12px; margin-top: -68px; font-family: cambria; font-size: 11px; text-align: center; padding-top: 3px; padding-bottom: 3px; transition-duration: 0.6s; -moz-transition-duration: 0.6s; -webkit-transition-duration: 0.6s; -o-transition-duration: 0.6s}
.sidetext {width: 105px;
height: 75px;
position: fixed;
top: 190px;
left: 145px;
color: #A3A3A3;
line-height: 10px;
font-size: 9px;
letter-spacing: 1px;
word-spacing: 2px;
font-family: georgia}
#titolo {margin-top: 5%; width: 230px; height: auto; z-index: 9; font-family: cambria, sans-serif, georgia; font-size: 11px; text-transform: uppercase; line-height: 12px; text-align: center; color: #A3A3A3; background: #FFFAEE; border-top: 1px solid #FFDD8D; border-bottom: 2px solid #FFDD8D}
#iconsposition {margin-left: 5px; margin-top: 0; display: inline-block}
#icons {-webkit-transform-style: preserve-3d; -webkit-perspective: 1000; width: 60px; height: 25px; position: relative; margin-top: 10px}
#icons-container {display: inline-block; text-align: center}
#icons-container:hover .back {-webkit-transform: rotatey(0deg)}
#icons-container:hover .front {-webkit-transform: rotatey(-180deg)}
.back, .front {position: absolute; -webkit-backface-visibility: hidden; -webkit-transition: -webkit-transform 0.5s ease-in; width: 100%; height: 100%; padding: 5px; font-family: georgia, sans-serif; font-style: italic; text-transform: lowercase; font-size: 10px; line-height: 10px; color: #343B36}
.back {-webkit-transform: rotatey(180deg); background-color: #FFFAEE; overflow: hidden}
.front {background: #FFFAEE}
#iconsposition2 {margin-left: 11px; margin-top: 0; display: inline-block}
#icons2 {-webkit-transform-style: preserve-3d; -webkit-perspective: 1000; width: 60px; height: 25px; position: relative; margin-top: 10px}
#icons-container2 {display: inline-block; text-align: center}
#icons-container2:hover .back2 {-webkit-transform: rotatey(0deg)}
#icons-container2:hover .front2 {-webkit-transform: rotatey(-180deg)}
.back2, .front2 {position: absolute; -webkit-backface-visibility: hidden; -webkit-transition: -webkit-transform 0.5s ease-in; width: 100%; height: 100%; padding: 5px; font-family: georgia, sans-serif; font-style: italic; text-transform: lowercase; font-size: 10px; line-height: 10px; color: #FFFFFF}
.back2 {-webkit-transform: rotatey(180deg); background-color: #FEF2D4; overflow: hidden}
.front2 {background: #FEF2D4}
#iconsposition3 {margin-left: 11px; margin-top: 0; display: inline-block}
#icons3 {-webkit-transform-style: preserve-3d; -webkit-perspective: 1000; width: 60px; height: 25px; position: relative; margin-top: 10px}
#icons-container3 {display: inline-block; text-align: center}
#icons-container3:hover .back3 {-webkit-transform: rotatey(0deg)}
#icons-container3:hover .front3 {-webkit-transform: rotatey(-180deg)}
.back3, .front3 {position: absolute; -webkit-backface-visibility: hidden; -webkit-transition: -webkit-transform 0.5s ease-in; width: 100%; height: 100%; padding: 5px; font-family: georgia, sans-serif; font-style: italic; text-transform: lowercase; font-size: 10px; line-height: 10px; color: #FFFFFF}
.back3 {-webkit-transform: rotatey(180deg); background-color: #FFFAEE; overflow: hidden}
.front3 {background: #FFFAEE}
#iconsposition4 {margin-left: 5px; margin-top: -2px; display: inline-block}
#icons4 {-webkit-transform-style: preserve-3d; -webkit-perspective: 1000; width: 60px; height: 25px; position: relative; margin-top: 12px}
#icons-container4 {display: inline-block; text-align: center}
#icons-container4:hover .back4 {-webkit-transform: rotatey(0deg)}
#icons-container4:hover .front4 {-webkit-transform: rotatey(-180deg)}
.back4, .front4 {position: absolute; -webkit-backface-visibility: hidden; -webkit-transition: -webkit-transform 0.5s ease-in; width: 100%; height: 100%; padding: 5px; font-family: georgia, sans-serif; font-style: italic; text-transform: lowercase; font-size: 10px; line-height: 10px; color: #FFFFFF}
.back4 {-webkit-transform: rotatey(180deg); background-color: #FEF2D4; overflow: hidden}
.front4 {background: #FEF2D4}
#iconsposition5 {margin-left: 11px; margin-top: -2px; display: inline-block}
#icons5 {-webkit-transform-style: preserve-3d; -webkit-perspective: 1000; width: 60px; height: 25px; position: relative; margin-top: 12px}
#icons-container5 {display: inline-block; text-align: center}
#icons-container5:hover .back5 {-webkit-transform: rotatey(0deg)}
#icons-container5:hover .front5 {-webkit-transform: rotatey(-180deg)}
.back5, .front5 {position: absolute; -webkit-backface-visibility: hidden; -webkit-transition: -webkit-transform 0.5s ease-in; width: 100%; height: 100%; padding: 5px; font-family: georgia, sans-serif; font-style: italic; text-transform: lowercase; font-size: 10px; line-height: 10px; color: #FFFFFF}
.back5 {-webkit-transform: rotatey(180deg); background-color: #FFFAEE; overflow: hidden}
.front5 {background: #FFFAEE}
#iconsposition6 {margin-left: 11px; margin-top: -2px; display: inline-block}
#icons6 {-webkit-transform-style: preserve-3d; -webkit-perspective: 1000; width: 60px; height: 25px; position: relative; margin-top: 12px}
#icons-container6 {display: inline-block; text-align: center}
#icons-container6:hover .back6 {-webkit-transform: rotatey(0deg)}
#icons-container6:hover .front6 {-webkit-transform: rotatey(-180deg)}
.back6, .front6 {position: absolute; -webkit-backface-visibility: hidden; -webkit-transition: -webkit-transform 0.5s ease-in; width: 100%; height: 100%; padding: 5px; font-family: georgia, sans-serif; font-style: italic; text-transform: lowercase; font-size: 10px; line-height: 10px; color: #FFFFFF}
.back6 {-webkit-transform: rotatey(180deg); background-color: #FEF2D4; overflow: hidden}
.front6 {background: #FEF2D4}
#iconsposition7 {margin-left: 40px; margin-top: -2px; display: inline-block}
#icons7 {-webkit-transform-style: preserve-3d; -webkit-perspective: 1000; width: 60px; height: 25px; position: relative; margin-top: 12px}
#icons-container7 {display: inline-block; text-align: center}
#icons-container7:hover .back7 {-webkit-transform: rotatey(0deg)}
#icons-container7:hover .front7 {-webkit-transform: rotatey(-180deg)}
.back7, .front7 {position: absolute; -webkit-backface-visibility: hidden; -webkit-transition: -webkit-transform 0.5s ease-in; width: 100%; height: 100%; padding: 5px; font-family: georgia, sans-serif; font-style: italic; text-transform: lowercase; font-size: 10px; line-height: 10px; color: #FFFFFF}
.back7 {-webkit-transform: rotatey(180deg); background-color: #FEF2D4; overflow: hidden}
.front7 {background: #FEF2D4}
#iconsposition8 {margin-left: 11px; margin-top: -2px; display: inline-block}
#icons8 {-webkit-transform-style: preserve-3d; -webkit-perspective: 1000; width: 60px; height: 25px; position: relative; margin-top: 12px}
#icons-container8 {display: inline-block; text-align: center}
#icons-container8:hover .back8 {-webkit-transform: rotatey(0deg)}
#icons-container8:hover .front8 {-webkit-transform: rotatey(-180deg)}
.back8, .front8 {position: absolute; -webkit-backface-visibility: hidden; -webkit-transition: -webkit-transform 0.5s ease-in; width: 100%; height: 100%; padding: 5px; font-family: georgia, sans-serif; font-style: italic; text-transform: lowercase; font-size: 10px; line-height: 10px; color: #FFFFFF}
.back8 {-webkit-transform: rotatey(180deg); background-color: #FFFAEE; overflow: hidden}
.front8 {background: #FFFAEE}
.credits {margin-top: 6%; width: 178px; height: 18px; z-index: 9; font-family: georgia; font-style: italic; font-size: 9px; color: #A3A3A3; line-height: 17px; text-align: center; text-transform: lowercase}
L'utente è stato contattato? » mi ha bannata tempo fa perchè l'avevo già sorpresa a scopiazzarmi, ma sono riuscita a mandarle un mp
Note » tenete presente che la parte in cui ci sono .box e .iconspositions, etc.. nel mio sono nominati in modo diverso ma solo perchè li ho cambiati di recente perchè ho dato una sistematina e alcuni nel vecchio layout scombussolavano tutto... ma prima erano esattamente così, parola per parola. i codici vecchi li ho ancora! insomma è tutto uguale... pixel, distanze,effetti identici! la parte dell'avatar (il movimento del quadratino con la scritta) l'ha preso da quest'altra sidebar qui... eh be! facciamo 2 + 2! queste sono sidebar che ho creato l'anno scorso!
Edited by ´daenerys - 28/8/2013, 04:14
.
