FANDOM


/* 3DBook © Szynka013 */
/** Odległość między okładką a grzbietem */
.book-container-comic {
	width: 150px;
        margin:0 auto;
}
 
/** Przed i po najechaniu kursorem **/
.book,
.book-comic {
	-moz-transform-origin: 125px 0;
	-moz-transform-style: preserve-3d;
	-moz-transition: 0.75s;
	-webkit-transform-origin: 125px 0;
	-webkit-transform-style: preserve-3d;
	-webkit-transition: 0.75s;
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.25);
	transform-origin: 125px 0;
	transform-style: preserve-3d;
	transition: 0.75s;
	z-index: 5;
}
.book:after,
.book-comic:after {
	bottom: 0;
	content: "";
	left: 3px;
	position: absolute;
	top: 0;
	width: 7px;
	z-index: 20;
}
 
/** Funkcja obrotu **/
.book:hover {
	-moz-transform: translateX(-10px) translateZ(35px) translateX(35px) rotateY(45deg);
	-webkit-transform: translateX(-10px) translateZ(35px) translateX(35px) rotateY(45deg);
	transform: translateX(-10px) translateZ(35px) translateX(35px) rotateY(45deg);
}
.book-comic:hover {
	-moz-transform: translateX(-10px) translateZ(5px) translateX(5px) rotateY(45deg);
	-webkit-transform: translateX(-10px) translateZ(5px) translateX(5px) rotateY(45deg);
	transform: translateX(-10px) translateZ(5px) translateX(5px) rotateY(45deg);
}
 
/** Okładki **/
.book-cover {
	position: relative;
	z-index: 10;
}
.book-cover img {
	height: auto;
	max-width: 100%;
	vertical-align: bottom;
}
/** Grzbiety **/
.book-spine {
	background: url(LINKDOPLIKU);
}
.book-spine-comic1 {
	background: url(LINKDOPLIKU);
}
.book-spine-comic2 {
	background: url(LINKDOPLIKU);
}
.book-spine-comic3 {
	background: url(LINKDOPLIKU);
}
.book-spine-comic4 {
	background: url(LINKDOPLIKU);
}
.book-spine-comic5 {
	background: url(LINKDOPLIKU);
}
.book-spine-comic1,
.book-spine-comic2,
.book-spine-comic3,
.book-spine-comic4,
.book-spine-comic5,
.book-spine {
	-moz-transform-origin: 0;
	-moz-transform: rotateY(-90deg) translateX(-49px);
	-webkit-transform-origin: 0;
	-webkit-transform: rotateY(-90deg) translateX(-49px);
	background-size: auto 100%;
	bottom: 0;
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.25);
	color: #fff;
	smargin-left: 5px;
	overflow: hidden;
	position: absolute;
	top: 0;
	transform-origin: 0;
	z-index: 5;
}
.book-spine {
	transform: rotateY(-90deg) translateX(-30px);
	width: 30px;
}
.book-spine-comic1,
.book-spine-comic2,
.book-spine-comic3,
.book-spine-comic4,
.book-spine-comic5 {
	transform: rotateY(-90deg) translateX(-20px);
	width: 20px;
}
.book-spine-comic1 h1,
.book-spine-comic2 h1,
.book-spine-comic3 h1,
.book-spine-comic4 h1,
.book-spine-comic5 h1,
.book-spine h1 {
	-moz-transform-origin: 0;
	-moz-transform: rotateZ(90deg);
	-webkit-font-smoothing: antialiased;
	-webkit-transform-origin: 0;
	-webkit-transform: rotateZ(90deg);
	color: #fff;
	display: block;
	font-size: 2em;
	font-weight: normal;
	left: 39px;
	opacity: 0.75;
	position: absolute;
	text-align: left;
	text-indent: 43px;
	text-transform: uppercase;
	top: 0;
	transform-origin: 0;
	transform: rotateZ(90deg);
	width: 250px;
}
.book-spine-comic1:before,
.book-spine-comic2:before,
.book-spine-comic3:before,
.book-spine-comic4:before,
.book-spine-comic5:before,
.book-spine:before {
	content: "";
	display: block;
	height: 100%;
	width: 100%;
}

Ad blocker interference detected!


Wikia is a free-to-use site that makes money from advertising. We have a modified experience for viewers using ad blockers

Wikia is not accessible if you’ve made further modifications. Remove the custom ad blocker rule(s) and the page will load as expected.

Więcej z Fandomu

Losowa wiki