Initial Fork from https://bitbucket.org/raphaelmutschler/calibreserver/
This commit is contained in:
Jan Broer
Executable
+7
@@ -0,0 +1,7 @@
|
||||
Created by Codrops
|
||||
|
||||
http://tympanus.net/codrops
|
||||
|
||||
License: http://tympanus.net/codrops/licensing/
|
||||
|
||||
Wood background from pixeden.com
|
||||
+569
@@ -0,0 +1,569 @@
|
||||
.bk-list {
|
||||
list-style: none;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.bk-list li {
|
||||
position: relative;
|
||||
width: 300px;
|
||||
float: left;
|
||||
z-index: 1;
|
||||
margin: 0px 50px 40px 0;
|
||||
-webkit-perspective: 1800px;
|
||||
-moz-perspective: 1800px;
|
||||
perspective: 1800px;
|
||||
}
|
||||
|
||||
.bk-list li:last-child {
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
.bk-info {
|
||||
position: relative;
|
||||
margin-top: 440px;
|
||||
}
|
||||
|
||||
.bk-info h3 {
|
||||
padding: 25px 0 10px;
|
||||
margin-bottom: 20px;
|
||||
border-bottom: 1px solid rgba(0,0,0,0.3);
|
||||
font-size: 26px;
|
||||
}
|
||||
|
||||
.bk-info h3 span:first-child {
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
text-transform: uppercase;
|
||||
padding-bottom: 5px;
|
||||
display: block;
|
||||
color: #777;
|
||||
}
|
||||
|
||||
.bk-info p {
|
||||
line-height: 24px;
|
||||
color: #444;
|
||||
min-height: 160px;
|
||||
}
|
||||
|
||||
.bk-info button {
|
||||
background: #FC756F;
|
||||
border: none;
|
||||
color: #fff;
|
||||
display: inline-block;
|
||||
padding: 3px 15px;
|
||||
font-weight: 700;
|
||||
font-size: 14px;
|
||||
text-transform: uppercase;
|
||||
cursor: pointer;
|
||||
margin-right: 4px;
|
||||
box-shadow: 1px 1px 1px rgba(0,0,0,0.15);
|
||||
}
|
||||
|
||||
.bk-info button.bk-active,
|
||||
.bk-info button:active {
|
||||
box-shadow:
|
||||
0 1px 0 rgba(255, 255, 255, 0.8),
|
||||
inset 0 -1px 1px rgba(0,0,0,0.2);
|
||||
}
|
||||
|
||||
.no-touch .bk-info button:hover,
|
||||
.bk-info button.bk-active {
|
||||
background: #d0544e;
|
||||
}
|
||||
|
||||
.bk-list li .bk-book {
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 400px;
|
||||
-webkit-transform-style: preserve-3d;
|
||||
-moz-transform-style: preserve-3d;
|
||||
transform-style: preserve-3d;
|
||||
-webkit-transition: -webkit-transform .5s;
|
||||
-moz-transition: -moz-transform .5s;
|
||||
transition: transform .5s;
|
||||
}
|
||||
|
||||
.bk-list li .bk-book.bk-bookdefault:hover {
|
||||
-webkit-transform: rotate3d(0,1,0,35deg);
|
||||
-moz-transform: rotate3d(0,1,0,35deg);
|
||||
transform: rotate3d(0,1,0,35deg);
|
||||
}
|
||||
|
||||
.bk-list li .bk-book > div,
|
||||
.bk-list li .bk-front > div {
|
||||
display: block;
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
.bk-list li .bk-front {
|
||||
-webkit-transform-style: preserve-3d;
|
||||
-moz-transform-style: preserve-3d;
|
||||
transform-style: preserve-3d;
|
||||
-webkit-transform-origin: 0% 50%;
|
||||
-moz-transform-origin: 0% 50%;
|
||||
transform-origin: 0% 50%;
|
||||
-webkit-transition: -webkit-transform .5s;
|
||||
-moz-transition: -moz-transform .5s;
|
||||
transition: transform .5s;
|
||||
-webkit-transform: translate3d(0,0,20px);
|
||||
-moz-transform: translate3d(0,0,20px);
|
||||
transform: translate3d(0,0,20px);
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
.bk-list li .bk-front > div {
|
||||
-webkit-backface-visibility: hidden;
|
||||
-moz-backface-visibility: hidden;
|
||||
backface-visibility: hidden;
|
||||
-webkit-transform-style: preserve-3d;
|
||||
-moz-transform-style: preserve-3d;
|
||||
transform-style: preserve-3d;
|
||||
}
|
||||
|
||||
.bk-list li .bk-page {
|
||||
-webkit-transform: translate3d(0,0,19px);
|
||||
-moz-transform: translate3d(0,0,19px);
|
||||
transform: translate3d(0,0,19px);
|
||||
display: none;
|
||||
width: 295px;
|
||||
height: 390px;
|
||||
top: 5px;
|
||||
-webkit-backface-visibility: hidden;
|
||||
-moz-backface-visibility: hidden;
|
||||
backface-visibility: hidden;
|
||||
z-index: 9;
|
||||
}
|
||||
|
||||
.bk-list li .bk-front,
|
||||
.bk-list li .bk-back,
|
||||
.bk-list li .bk-front > div {
|
||||
width: 300px;
|
||||
height: 400px;
|
||||
}
|
||||
|
||||
.bk-list li .bk-left,
|
||||
.bk-list li .bk-right {
|
||||
width: 40px;
|
||||
left: -20px;
|
||||
}
|
||||
|
||||
.bk-list li .bk-top,
|
||||
.bk-list li .bk-bottom {
|
||||
width: 295px;
|
||||
height: 40px;
|
||||
top: -15px;
|
||||
-webkit-backface-visibility: hidden;
|
||||
-moz-backface-visibility: hidden;
|
||||
backface-visibility: hidden;
|
||||
}
|
||||
|
||||
.bk-list li .bk-back {
|
||||
-webkit-transform: rotate3d(0,1,0,-180deg) translate3d(0,0,20px);
|
||||
-moz-transform: rotate3d(0,1,0,-180deg) translate3d(0,0,20px);
|
||||
transform: rotate3d(0,1,0,-180deg) translate3d(0,0,20px);
|
||||
box-shadow: 10px 10px 30px rgba(0,0,0,0.3);
|
||||
border-radius: 3px 0 0 3px;
|
||||
}
|
||||
|
||||
.bk-list li .bk-cover-back {
|
||||
background-color: #000;
|
||||
-webkit-transform: rotate3d(0,1,0,-180deg);
|
||||
-moz-transform: rotate3d(0,1,0,-180deg);
|
||||
transform: rotate3d(0,1,0,-180deg);
|
||||
}
|
||||
|
||||
.bk-list li .bk-right {
|
||||
height: 390px;
|
||||
top: 5px;
|
||||
-webkit-transform: rotate3d(0,1,0,90deg) translate3d(0,0,295px);
|
||||
-moz-transform: rotate3d(0,1,0,90deg) translate3d(0,0,295px);
|
||||
transform: rotate3d(0,1,0,90deg) translate3d(0,0,295px);
|
||||
-webkit-backface-visibility: hidden;
|
||||
-moz-backface-visibility: hidden;
|
||||
backface-visibility: hidden;
|
||||
}
|
||||
|
||||
.bk-list li .bk-left {
|
||||
height: 400px;
|
||||
-webkit-transform: rotate3d(0,1,0,-90deg);
|
||||
-moz-transform: rotate3d(0,1,0,-90deg);
|
||||
transform: rotate3d(0,1,0,-90deg);
|
||||
}
|
||||
|
||||
.bk-list li .bk-top {
|
||||
-webkit-transform: rotate3d(1,0,0,90deg);
|
||||
-moz-transform: rotate3d(1,0,0,90deg);
|
||||
transform: rotate3d(1,0,0,90deg);
|
||||
}
|
||||
|
||||
.bk-list li .bk-bottom {
|
||||
-webkit-transform: rotate3d(1,0,0,-90deg) translate3d(0,0,390px);
|
||||
-moz-transform: rotate3d(1,0,0,-90deg) translate3d(0,0,390px);
|
||||
transform: rotate3d(1,0,0,-90deg) translate3d(0,0,390px);
|
||||
}
|
||||
|
||||
/* Transform classes */
|
||||
|
||||
.bk-list li .bk-viewinside .bk-front {
|
||||
-webkit-transform: translate3d(0,0,20px) rotate3d(0,1,0,-160deg);
|
||||
-moz-transform: translate3d(0,0,20px) rotate3d(0,1,0,-160deg);
|
||||
transform: translate3d(0,0,20px) rotate3d(0,1,0,-160deg);
|
||||
}
|
||||
|
||||
.bk-list li .bk-book.bk-viewinside {
|
||||
-webkit-transform: translate3d(0,0,150px) rotate3d(0,1,0,0deg);
|
||||
-moz-transform: translate3d(0,0,150px) rotate3d(0,1,0,0deg);
|
||||
transform: translate3d(0,0,150px) rotate3d(0,1,0,0deg);
|
||||
}
|
||||
|
||||
.bk-list li .bk-book.bk-viewback {
|
||||
-webkit-transform: translate3d(0,0,0px) rotate3d(0,1,0,180deg);
|
||||
-moz-transform: translate3d(0,0,0px) rotate3d(0,1,0,180deg);
|
||||
transform: translate3d(0,0,0px) rotate3d(0,1,0,180deg);
|
||||
}
|
||||
|
||||
.bk-list li .bk-viewback .bk-back {
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
/* Main colors and content */
|
||||
|
||||
.bk-list li .bk-page,
|
||||
.bk-list li .bk-right,
|
||||
.bk-list li .bk-top,
|
||||
.bk-list li .bk-bottom {
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.bk-list li .bk-front > div {
|
||||
border-radius: 0 3px 3px 0;
|
||||
box-shadow:
|
||||
inset 4px 0 10px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
.bk-list li .bk-front:after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 1px;
|
||||
bottom: 1px;
|
||||
left: -1px;
|
||||
width: 1px;
|
||||
}
|
||||
|
||||
.bk-list li .bk-cover:after,
|
||||
.bk-list li .bk-back:after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 10px;
|
||||
bottom: 0;
|
||||
width: 3px;
|
||||
background: rgba(0,0,0,0.06);
|
||||
box-shadow: 1px 0 3px rgba(255, 255, 255, 0.1);
|
||||
}
|
||||
|
||||
.bk-list li .bk-back:after {
|
||||
left: auto;
|
||||
right: 10px;
|
||||
}
|
||||
|
||||
.bk-left h2 {
|
||||
width: 400px;
|
||||
height: 40px;
|
||||
-webkit-transform-origin: 0 0;
|
||||
-moz-transform-origin: 0 0;
|
||||
transform-origin: 0 0;
|
||||
-webkit-transform: rotate(90deg) translateY(-40px);
|
||||
-moz-transform: rotate(90deg) translateY(-40px);
|
||||
transform: rotate(90deg) translateY(-40px);
|
||||
}
|
||||
|
||||
.bk-content {
|
||||
position: absolute;
|
||||
top: 30px;
|
||||
left: 20px;
|
||||
bottom: 20px;
|
||||
right: 20px;
|
||||
padding: 30px;
|
||||
overflow: hidden;
|
||||
background: #fff;
|
||||
opacity: 0;
|
||||
pointer-events: none;
|
||||
-webkit-backface-visibility: hidden;
|
||||
-moz-backface-visibility: hidden;
|
||||
backface-visibility: hidden;
|
||||
-webkit-transition: opacity 0.3s ease-in-out;
|
||||
-moz-transition: opacity 0.3s ease-in-out;
|
||||
transition: opacity 0.3s ease-in-out;
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
.bk-content-current {
|
||||
opacity: 1;
|
||||
pointer-events: auto;
|
||||
}
|
||||
|
||||
.bk-content p {
|
||||
padding: 0 0 10px;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
color: #000;
|
||||
font-size: 13px;
|
||||
line-height: 20px;
|
||||
text-align: justify;
|
||||
-webkit-touch-callout: none;
|
||||
-webkit-user-select: none;
|
||||
-khtml-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
.bk-page nav {
|
||||
display: block;
|
||||
text-align: center;
|
||||
margin-top: 20px;
|
||||
position: relative;
|
||||
z-index: 100;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.bk-page nav span {
|
||||
display: inline-block;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
color: #aaa;
|
||||
background: #f0f0f0;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
/* Individual style & artwork */
|
||||
|
||||
/* Book 1 */
|
||||
.book-1 .bk-front > div,
|
||||
.book-1 .bk-back,
|
||||
.book-1 .bk-left,
|
||||
.book-1 .bk-front:after {
|
||||
background-color: #ff924a;
|
||||
}
|
||||
|
||||
.book-1 .bk-cover {
|
||||
background-image: url(../images/1.png);
|
||||
background-repeat: no-repeat;
|
||||
background-position: 10px 40px;
|
||||
}
|
||||
|
||||
.book-1 .bk-cover h2 {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
left: 0;
|
||||
padding: 30px;
|
||||
background: rgba(255,255,255,0.2);
|
||||
color: #fff;
|
||||
text-shadow: 0 -1px 0 rgba(0,0,0,0.1);
|
||||
}
|
||||
|
||||
.book-1 .bk-cover h2 span:first-child,
|
||||
.book-1 .bk-left h2 span:first-child {
|
||||
text-transform: uppercase;
|
||||
font-weight: 400;
|
||||
font-size: 13px;
|
||||
padding-right: 20px;
|
||||
}
|
||||
|
||||
.book-1 .bk-cover h2 span:first-child {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.book-1 .bk-cover h2 span:last-child,
|
||||
.book-1 .bk-left h2 span:last-child {
|
||||
font-family: "Big Caslon", "Book Antiqua", "Palatino Linotype", Georgia, serif;
|
||||
}
|
||||
|
||||
.book-1 .bk-content p {
|
||||
font-family: Georgia, Times, "Times New Roman", serif;
|
||||
}
|
||||
|
||||
.book-1 .bk-left h2 {
|
||||
color: #fff;
|
||||
font-size: 15px;
|
||||
line-height: 40px;
|
||||
padding-right: 10px;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.book-1 .bk-back p {
|
||||
color: #fff;
|
||||
font-size: 13px;
|
||||
padding: 40px;
|
||||
text-align: center;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
/* Book 2 */
|
||||
|
||||
.book-2 .bk-front > div,
|
||||
.book-2 .bk-back,
|
||||
.book-2 .bk-left,
|
||||
.book-2 .bk-front:after {
|
||||
background-color: #222;
|
||||
}
|
||||
|
||||
.book-2 .bk-cover {
|
||||
background-image: url(../images/2.png);
|
||||
background-repeat: no-repeat;
|
||||
background-position: 98% 0%;
|
||||
}
|
||||
|
||||
.book-2 .bk-cover h2,
|
||||
.book-2 .bk-left h2 {
|
||||
color: #fff;
|
||||
font-family: 'the_godfatherregular', Georgia, serif;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.book-2 .bk-cover h2 {
|
||||
font-size: 138px;
|
||||
line-height: 102px;
|
||||
padding: 30px;
|
||||
}
|
||||
|
||||
.book-2 .bk-cover h2 span:first-child {
|
||||
position: relative;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.book-2 .bk-cover h2 span:first-child:before {
|
||||
content: 'A novel';
|
||||
font-family: "Big Caslon", "Book Antiqua", "Palatino Linotype", Georgia, serif;
|
||||
text-transform: uppercase;
|
||||
position: absolute;
|
||||
color: red;
|
||||
font-size: 20px;
|
||||
right: -15px;
|
||||
bottom: -60px;
|
||||
}
|
||||
|
||||
.book-2 .bk-cover h2 span:last-child {
|
||||
font-size: 100px;
|
||||
line-height: 80px;
|
||||
display: block;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.book-2 .bk-cover h2 span:last-child:before {
|
||||
content: 'by';
|
||||
font-size: 16px;
|
||||
color: red;
|
||||
position: absolute;
|
||||
top: -32px;
|
||||
left: 62px;
|
||||
font-family: "Big Caslon", "Book Antiqua", "Palatino Linotype", Georgia, serif;
|
||||
}
|
||||
|
||||
.book-2 .bk-cover h2 span:last-child:after {
|
||||
content: '';
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
border-radius: 50%;
|
||||
background: #f9ed65;
|
||||
position: absolute;
|
||||
top: 5px;
|
||||
left: 101px;
|
||||
}
|
||||
|
||||
.book-2 .bk-left h2 {
|
||||
font-size: 20px;
|
||||
line-height: 40px;
|
||||
padding-right: 10px;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.book-2 .bk-back p {
|
||||
color: red;
|
||||
font-size: 13px;
|
||||
font-family: "Big Caslon", "Book Antiqua", "Palatino Linotype", Georgia, serif;
|
||||
padding: 40px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* Book 3 */
|
||||
|
||||
.book-3 .bk-front > div,
|
||||
.book-3 .bk-back,
|
||||
.book-3 .bk-left,
|
||||
.book-3 .bk-front:after {
|
||||
background-color: #a4c19e;
|
||||
}
|
||||
|
||||
.book-3 .bk-cover {
|
||||
background-image: url(../images/3.png);
|
||||
background-repeat: no-repeat;
|
||||
background-position: 100% 95%;
|
||||
}
|
||||
|
||||
.book-3 .bk-cover h2 {
|
||||
position: absolute;
|
||||
top: 40px;
|
||||
right: 40px;
|
||||
left: 40px;
|
||||
padding-top: 15px;
|
||||
color: #fff;
|
||||
text-shadow: 0 -1px 0 rgba(0,0,0,0.1);
|
||||
}
|
||||
|
||||
.book-3 .bk-cover h2 span:first-child,
|
||||
.book-3 .bk-left h2 span:first-child {
|
||||
text-transform: uppercase;
|
||||
font-weight: 400;
|
||||
font-size: 13px;
|
||||
padding-right: 20px;
|
||||
}
|
||||
|
||||
.book-3 .bk-cover h2 span:first-child {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.book-3 .bk-cover h2 span:last-child,
|
||||
.book-3 .bk-left h2 span:last-child,
|
||||
.book-3 .bk-content p {
|
||||
font-family: Georgia, Times, "Times New Roman", serif;
|
||||
}
|
||||
|
||||
.book-3 .bk-left h2 {
|
||||
color: #fff;
|
||||
font-size: 14px;
|
||||
line-height: 40px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.book-3 .bk-back img {
|
||||
width: 200px;
|
||||
display: block;
|
||||
margin: 30px auto 0;
|
||||
}
|
||||
|
||||
.book-3 .bk-back p {
|
||||
color: #fff;
|
||||
font-size: 13px;
|
||||
font-family: Georgia, Times, "Times New Roman", serif;
|
||||
padding: 40px;
|
||||
text-align: center;
|
||||
text-shadow: 0 -1px 0 rgba(0,0,0,0.1);
|
||||
}
|
||||
|
||||
/* Fallbacks */
|
||||
|
||||
.no-csstransforms3d .bk-list li .bk-book > div,
|
||||
.no-csstransforms3d .bk-list li .bk-book .bk-cover-back {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.no-csstransforms3d .bk-list li .bk-book > div.bk-front {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.no-csstransforms3d .bk-info button,
|
||||
.no-js .bk-info button {
|
||||
display: none;
|
||||
}
|
||||
+597
@@ -0,0 +1,597 @@
|
||||
.bk-list {
|
||||
list-style: none;
|
||||
position: relative;
|
||||
width: 533px; /* 13 books * 40px + 13 books * margin (1px) */
|
||||
margin: 0 auto;
|
||||
-webkit-perspective: 1800px;
|
||||
-moz-perspective: 1800px;
|
||||
perspective: 1800px;
|
||||
-webkit-perspective-origin: 50% 15%;
|
||||
-moz-perspective-origin: 50% 15%;
|
||||
perspective-origin: 50% 15%;
|
||||
}
|
||||
|
||||
.bk-list li {
|
||||
position: relative;
|
||||
width: 40px;
|
||||
height: 400px;
|
||||
float: left;
|
||||
z-index: 1;
|
||||
margin: 0px 0px 0px 1px;
|
||||
-webkit-transform-style: preserve-3d;
|
||||
-moz-transform-style: preserve-3d;
|
||||
transform-style: preserve-3d;
|
||||
}
|
||||
|
||||
.bk-list li:last-child {
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
.bk-list li .bk-book {
|
||||
cursor: pointer;
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 400px;
|
||||
-webkit-transform-style: preserve-3d;
|
||||
-moz-transform-style: preserve-3d;
|
||||
transform-style: preserve-3d;
|
||||
-webkit-transition: -webkit-transform .5s;
|
||||
-moz-transition: -moz-transform .5s;
|
||||
transition: transform .5s;
|
||||
-webkit-transform: rotate3d(0,1,0,90deg);
|
||||
-moz-transform: rotate3d(0,1,0,90deg);
|
||||
transform: rotate3d(0,1,0,90deg);
|
||||
}
|
||||
|
||||
.bk-list li .bk-book:hover {
|
||||
-webkit-transform: rotateY(90deg) rotateZ(-15deg) translate3d(-100px,0,0);
|
||||
-moz-transform: rotateY(90deg) rotateZ(-15deg) translate3d(-100px,0,0);
|
||||
transform: rotateY(90deg) rotateZ(-15deg) translate3d(-100px,0,0);
|
||||
}
|
||||
|
||||
.bk-list li .bk-book > div,
|
||||
.bk-list li .bk-front > div {
|
||||
display: block;
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
.bk-list li .bk-front {
|
||||
-webkit-transform-style: preserve-3d;
|
||||
-moz-transform-style: preserve-3d;
|
||||
transform-style: preserve-3d;
|
||||
-webkit-transform-origin: 0% 50%;
|
||||
-moz-transform-origin: 0% 50%;
|
||||
transform-origin: 0% 50%;
|
||||
-webkit-transition: -webkit-transform .5s;
|
||||
-moz-transition: -moz-transform .5s;
|
||||
transition: transform .5s;
|
||||
-webkit-transform: translate3d(0,0,20px);
|
||||
-moz-transform: translate3d(0,0,20px);
|
||||
transform: translate3d(0,0,20px);
|
||||
}
|
||||
|
||||
.bk-list li .bk-front > div {
|
||||
-webkit-backface-visibility: hidden;
|
||||
-moz-backface-visibility: hidden;
|
||||
backface-visibility: hidden;
|
||||
-webkit-transform-style: preserve-3d;
|
||||
-moz-transform-style: preserve-3d;
|
||||
transform-style: preserve-3d;
|
||||
}
|
||||
|
||||
.bk-list li .bk-page {
|
||||
-webkit-transform: translate3d(0,0,19px);
|
||||
-moz-transform: translate3d(0,0,19px);
|
||||
transform: translate3d(0,0,19px);
|
||||
display: none;
|
||||
width: 295px;
|
||||
height: 390px;
|
||||
top: 5px;
|
||||
-webkit-backface-visibility: hidden;
|
||||
-moz-backface-visibility: hidden;
|
||||
backface-visibility: hidden;
|
||||
}
|
||||
|
||||
.bk-list li .bk-front,
|
||||
.bk-list li .bk-back,
|
||||
.bk-list li .bk-front > div {
|
||||
width: 300px;
|
||||
height: 400px;
|
||||
}
|
||||
|
||||
.bk-list li .bk-left,
|
||||
.bk-list li .bk-right {
|
||||
width: 40px;
|
||||
left: -20px;
|
||||
}
|
||||
|
||||
.bk-list li .bk-top,
|
||||
.bk-list li .bk-bottom {
|
||||
width: 295px;
|
||||
height: 40px;
|
||||
top: -15px;
|
||||
}
|
||||
|
||||
.bk-list li .bk-back {
|
||||
-webkit-transform: rotate3d(0,1,0,-180deg) translate3d(0,0,20px);
|
||||
-moz-transform: rotate3d(0,1,0,-180deg) translate3d(0,0,20px);
|
||||
transform: rotate3d(0,1,0,-180deg) translate3d(0,0,20px);
|
||||
border-radius: 3px 0 0 3px;
|
||||
}
|
||||
|
||||
.bk-list li .bk-cover-back {
|
||||
background-color: #000;
|
||||
-webkit-transform: rotate3d(0,1,0,-180deg);
|
||||
-moz-transform: rotate3d(0,1,0,-180deg);
|
||||
transform: rotate3d(0,1,0,-180deg);
|
||||
}
|
||||
|
||||
.bk-list li .bk-right {
|
||||
height: 390px;
|
||||
top: 5px;
|
||||
-webkit-transform: rotate3d(0,1,0,90deg) translate3d(0,0,295px);
|
||||
-moz-transform: rotate3d(0,1,0,90deg) translate3d(0,0,295px);
|
||||
transform: rotate3d(0,1,0,90deg) translate3d(0,0,295px);
|
||||
-webkit-backface-visibility: hidden;
|
||||
-moz-backface-visibility: hidden;
|
||||
backface-visibility: hidden;
|
||||
}
|
||||
|
||||
.bk-list li .bk-left {
|
||||
height: 400px;
|
||||
-webkit-transform: rotate3d(0,1,0,-90deg);
|
||||
-moz-transform: rotate3d(0,1,0,-90deg);
|
||||
transform: rotate3d(0,1,0,-90deg);
|
||||
box-shadow:
|
||||
inset 4px 0 5px rgba(255,255,255,0.1),
|
||||
inset 5px 0 5px rgba(0,0,0,0.05),
|
||||
inset -5px 0 5px rgba(0,0,0,0.04);;
|
||||
}
|
||||
|
||||
.bk-list li .bk-top {
|
||||
-webkit-transform: rotate3d(1,0,0,90deg);
|
||||
-moz-transform: rotate3d(1,0,0,90deg);
|
||||
transform: rotate3d(1,0,0,90deg);
|
||||
}
|
||||
|
||||
.bk-list li .bk-bottom {
|
||||
-webkit-transform: rotate3d(1,0,0,-90deg) translate3d(0,0,390px);
|
||||
-moz-transform: rotate3d(1,0,0,-90deg) translate3d(0,0,390px);
|
||||
transform: rotate3d(1,0,0,-90deg) translate3d(0,0,390px);
|
||||
}
|
||||
|
||||
/* Transform classes */
|
||||
|
||||
.bk-list li .bk-viewinside .bk-front {
|
||||
-webkit-transform: translate3d(0,0,20px) rotate3d(0,1,0,-160deg);
|
||||
-moz-transform: translate3d(0,0,20px) rotate3d(0,1,0,-160deg);
|
||||
transform: translate3d(0,0,20px) rotate3d(0,1,0,-160deg);
|
||||
}
|
||||
|
||||
.bk-list li .bk-book.bk-viewinside {
|
||||
-webkit-transform: rotate3d(0,1,0,0deg) translateX(0px) translateZ(100px) !important;
|
||||
-moz-transform: rotate3d(0,1,0,0deg) translateX(0px) translateZ(100px) !important;
|
||||
transform: rotate3d(0,1,0,0deg) translateX(0px) translateZ(100px) !important;
|
||||
}
|
||||
|
||||
.bk-list li .bk-book.bk-outside {
|
||||
-webkit-transform: rotate3d(0,1,0,90deg) translateX(-300px);
|
||||
-moz-transform: rotate3d(0,1,0,90deg) translateX(-300px);
|
||||
transform: rotate3d(0,1,0,90deg) translateX(-300px);
|
||||
}
|
||||
|
||||
.bk-list li .bk-book.bk-viewback {
|
||||
-webkit-transform: translate3d(0,0,0px) rotate3d(0,1,0,180deg);
|
||||
-moz-transform: translate3d(0,0,0px) rotate3d(0,1,0,180deg);
|
||||
transform: translate3d(0,0,0px) rotate3d(0,1,0,180deg);
|
||||
}
|
||||
|
||||
/* Main colors and content */
|
||||
|
||||
.bk-list li .bk-page,
|
||||
.bk-list li .bk-right,
|
||||
.bk-list li .bk-top,
|
||||
.bk-list li .bk-bottom {
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.bk-list li .bk-front > div {
|
||||
border-radius: 0 3px 3px 0;
|
||||
box-shadow:
|
||||
inset 4px 0 10px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
.bk-list li .bk-front:after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 1px;
|
||||
bottom: 1px;
|
||||
left: -1px;
|
||||
width: 1px;
|
||||
}
|
||||
|
||||
.bk-list li .bk-cover:after,
|
||||
.bk-list li .bk-back:after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 10px;
|
||||
bottom: 0;
|
||||
width: 3px;
|
||||
background: rgba(0,0,0,0.06);
|
||||
box-shadow: 1px 0 3px rgba(255, 255, 255, 0.1);
|
||||
}
|
||||
|
||||
.bk-list li .bk-back:after {
|
||||
left: auto;
|
||||
right: 10px;
|
||||
}
|
||||
|
||||
.bk-left h2 {
|
||||
width: 400px;
|
||||
height: 40px;
|
||||
-webkit-transform-origin: 0 0;
|
||||
-moz-transform-origin: 0 0;
|
||||
transform-origin: 0 0;
|
||||
-webkit-transform: rotate(90deg) translateY(-40px);
|
||||
-moz-transform: rotate(90deg) translateY(-40px);
|
||||
transform: rotate(90deg) translateY(-40px);
|
||||
}
|
||||
|
||||
.bk-content {
|
||||
position: absolute;
|
||||
top: 30px;
|
||||
left: 20px;
|
||||
bottom: 20px;
|
||||
right: 20px;
|
||||
padding: 30px;
|
||||
overflow: hidden;
|
||||
background: #fff;
|
||||
opacity: 0;
|
||||
pointer-events: none;
|
||||
-webkit-backface-visibility: hidden;
|
||||
-moz-backface-visibility: hidden;
|
||||
backface-visibility: hidden;
|
||||
-webkit-transition: opacity 0.3s ease-in-out;
|
||||
-moz-transition: opacity 0.3s ease-in-out;
|
||||
transition: opacity 0.3s ease-in-out;
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
.bk-content-current {
|
||||
opacity: 1;
|
||||
pointer-events: auto;
|
||||
}
|
||||
|
||||
.bk-content p {
|
||||
padding: 0 0 10px;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
color: #000;
|
||||
font-size: 13px;
|
||||
line-height: 20px;
|
||||
text-align: justify;
|
||||
-webkit-touch-callout: none;
|
||||
-webkit-user-select: none;
|
||||
-khtml-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
.bk-page nav {
|
||||
display: block;
|
||||
text-align: center;
|
||||
margin-top: 20px;
|
||||
position: relative;
|
||||
z-index: 100;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.bk-page nav span {
|
||||
display: inline-block;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
color: #aaa;
|
||||
background: #f0f0f0;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
/* Individual style & artwork */
|
||||
|
||||
/* Book 1 */
|
||||
.book-1 .bk-front > div,
|
||||
.book-1 .bk-back,
|
||||
.book-1 .bk-left,
|
||||
.book-1 .bk-front:after {
|
||||
background-color: #ff924a;
|
||||
}
|
||||
|
||||
.book-1 .bk-cover {
|
||||
background-image: url(../images/1.png);
|
||||
background-repeat: no-repeat;
|
||||
background-position: 10px 40px;
|
||||
}
|
||||
|
||||
.book-1 .bk-cover h2 {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
left: 0;
|
||||
padding: 30px;
|
||||
background: rgba(255,255,255,0.2);
|
||||
color: #fff;
|
||||
text-shadow: 0 -1px 0 rgba(0,0,0,0.1);
|
||||
}
|
||||
|
||||
.book-1 .bk-cover h2 span:first-child,
|
||||
.book-1 .bk-left h2 span:first-child {
|
||||
text-transform: uppercase;
|
||||
font-weight: 400;
|
||||
font-size: 13px;
|
||||
padding-right: 20px;
|
||||
}
|
||||
|
||||
.book-1 .bk-cover h2 span:first-child {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.book-1 .bk-cover h2 span:last-child,
|
||||
.book-1 .bk-left h2 span:last-child {
|
||||
font-family: "Big Caslon", "Book Antiqua", "Palatino Linotype", Georgia, serif;
|
||||
}
|
||||
|
||||
.book-1 .bk-content p {
|
||||
font-family: Georgia, Times, "Times New Roman", serif;
|
||||
}
|
||||
|
||||
.book-1 .bk-left h2 {
|
||||
color: #fff;
|
||||
font-size: 15px;
|
||||
line-height: 40px;
|
||||
padding-right: 10px;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.book-1 .bk-back p {
|
||||
color: #fff;
|
||||
font-size: 13px;
|
||||
padding: 40px;
|
||||
text-align: center;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
/* Book 2 */
|
||||
|
||||
.book-2 .bk-front > div,
|
||||
.book-2 .bk-back,
|
||||
.book-2 .bk-left,
|
||||
.book-2 .bk-front:after {
|
||||
background-color: #222;
|
||||
}
|
||||
|
||||
.book-2 .bk-cover {
|
||||
background-image: url(../images/2.png);
|
||||
background-repeat: no-repeat;
|
||||
background-position: 98% 0%;
|
||||
}
|
||||
|
||||
.book-2 .bk-cover h2,
|
||||
.book-2 .bk-left h2 {
|
||||
color: #fff;
|
||||
font-family: 'the_godfatherregular', Georgia, serif;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.book-2 .bk-cover h2 {
|
||||
font-size: 138px;
|
||||
line-height: 102px;
|
||||
padding: 30px;
|
||||
}
|
||||
|
||||
.book-2 .bk-cover h2 span:first-child {
|
||||
position: relative;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.book-2 .bk-cover h2 span:first-child:before {
|
||||
content: 'A novel';
|
||||
font-family: "Big Caslon", "Book Antiqua", "Palatino Linotype", Georgia, serif;
|
||||
text-transform: uppercase;
|
||||
position: absolute;
|
||||
color: red;
|
||||
font-size: 20px;
|
||||
right: -15px;
|
||||
bottom: -60px;
|
||||
}
|
||||
|
||||
.book-2 .bk-cover h2 span:last-child {
|
||||
font-size: 100px;
|
||||
line-height: 80px;
|
||||
display: block;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.book-2 .bk-cover h2 span:last-child:before {
|
||||
content: 'by';
|
||||
font-size: 16px;
|
||||
color: red;
|
||||
position: absolute;
|
||||
top: -32px;
|
||||
left: 62px;
|
||||
font-family: "Big Caslon", "Book Antiqua", "Palatino Linotype", Georgia, serif;
|
||||
}
|
||||
|
||||
.book-2 .bk-cover h2 span:last-child:after {
|
||||
content: '';
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
border-radius: 50%;
|
||||
background: #f9ed65;
|
||||
position: absolute;
|
||||
top: 5px;
|
||||
left: 101px;
|
||||
}
|
||||
|
||||
.book-2 .bk-left h2 {
|
||||
font-size: 20px;
|
||||
line-height: 40px;
|
||||
padding-right: 10px;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.book-2 .bk-back p {
|
||||
color: red;
|
||||
font-size: 13px;
|
||||
font-family: "Big Caslon", "Book Antiqua", "Palatino Linotype", Georgia, serif;
|
||||
padding: 40px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* Book 3 */
|
||||
|
||||
.book-3 .bk-front > div,
|
||||
.book-3 .bk-back,
|
||||
.book-3 .bk-left,
|
||||
.book-3 .bk-front:after {
|
||||
background-color: #a4c19e;
|
||||
}
|
||||
|
||||
.book-3 .bk-cover {
|
||||
background-image: url(../images/3.png);
|
||||
background-repeat: no-repeat;
|
||||
background-position: 100% 95%;
|
||||
}
|
||||
|
||||
.book-3 .bk-cover h2 {
|
||||
position: absolute;
|
||||
top: 40px;
|
||||
right: 40px;
|
||||
left: 40px;
|
||||
padding-top: 15px;
|
||||
color: #fff;
|
||||
text-shadow: 0 -1px 0 rgba(0,0,0,0.1);
|
||||
}
|
||||
|
||||
.book-3 .bk-cover h2 span:first-child,
|
||||
.book-3 .bk-left h2 span:first-child {
|
||||
text-transform: uppercase;
|
||||
font-weight: 400;
|
||||
font-size: 13px;
|
||||
padding-right: 20px;
|
||||
}
|
||||
|
||||
.book-3 .bk-cover h2 span:first-child {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.book-3 .bk-cover h2 span:last-child,
|
||||
.book-3 .bk-left h2 span:last-child,
|
||||
.book-3 .bk-content p {
|
||||
font-family: Georgia, Times, "Times New Roman", serif;
|
||||
}
|
||||
|
||||
.book-3 .bk-left h2 {
|
||||
color: #fff;
|
||||
font-size: 14px;
|
||||
line-height: 40px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.book-3 .bk-back img {
|
||||
width: 200px;
|
||||
display: block;
|
||||
margin: 30px auto 0;
|
||||
}
|
||||
|
||||
.book-3 .bk-back p {
|
||||
color: #fff;
|
||||
font-size: 13px;
|
||||
font-family: Georgia, Times, "Times New Roman", serif;
|
||||
padding: 40px;
|
||||
text-align: center;
|
||||
text-shadow: 0 -1px 0 rgba(0,0,0,0.1);
|
||||
}
|
||||
|
||||
/* Some color variation for the other books */
|
||||
.bk-list li:nth-child(4) .bk-book .bk-front > div,
|
||||
.bk-list li:nth-child(4) .bk-book .bk-back,
|
||||
.bk-list li:nth-child(4) .bk-book .bk-left,
|
||||
.bk-list li:nth-child(4) .bk-book .bk-front:after {
|
||||
background-color: #cfa6ef;
|
||||
}
|
||||
|
||||
.bk-list li:nth-child(5) .bk-book .bk-front > div,
|
||||
.bk-list li:nth-child(5) .bk-book .bk-back,
|
||||
.bk-list li:nth-child(5) .bk-book .bk-left,
|
||||
.bk-list li:nth-child(5) .bk-book .bk-front:after {
|
||||
background-color: #FFC2CE;
|
||||
}
|
||||
|
||||
.bk-list li:nth-child(6) .bk-book .bk-front > div,
|
||||
.bk-list li:nth-child(6) .bk-book .bk-back,
|
||||
.bk-list li:nth-child(6) .bk-book .bk-left,
|
||||
.bk-list li:nth-child(6) .bk-book .bk-front:after {
|
||||
background-color: #80B3FF;
|
||||
}
|
||||
|
||||
.bk-list li:nth-child(7) .bk-book .bk-front > div,
|
||||
.bk-list li:nth-child(7) .bk-book .bk-back,
|
||||
.bk-list li:nth-child(7) .bk-book .bk-left,
|
||||
.bk-list li:nth-child(7) .bk-book .bk-front:after {
|
||||
background-color: #FD6E8A;
|
||||
}
|
||||
|
||||
.bk-list li:nth-child(8) .bk-book .bk-front > div,
|
||||
.bk-list li:nth-child(8) .bk-book .bk-back,
|
||||
.bk-list li:nth-child(8) .bk-book .bk-left,
|
||||
.bk-list li:nth-child(8) .bk-book .bk-front:after {
|
||||
background-color: #A2122F;
|
||||
}
|
||||
|
||||
.bk-list li:nth-child(9) .bk-book .bk-front > div,
|
||||
.bk-list li:nth-child(9) .bk-book .bk-back,
|
||||
.bk-list li:nth-child(9) .bk-book .bk-left,
|
||||
.bk-list li:nth-child(9) .bk-book .bk-front:after {
|
||||
background-color: #439877;
|
||||
}
|
||||
|
||||
.bk-list li:nth-child(10) .bk-book .bk-front > div,
|
||||
.bk-list li:nth-child(10) .bk-book .bk-back,
|
||||
.bk-list li:nth-child(10) .bk-book .bk-left,
|
||||
.bk-list li:nth-child(10) .bk-book .bk-front:after {
|
||||
background-color: #5E445D;
|
||||
}
|
||||
|
||||
.bk-list li:nth-child(11) .bk-book .bk-front > div,
|
||||
.bk-list li:nth-child(11) .bk-book .bk-back,
|
||||
.bk-list li:nth-child(11) .bk-book .bk-left,
|
||||
.bk-list li:nth-child(11) .bk-book .bk-front:after {
|
||||
background-color: #A8936D;
|
||||
}
|
||||
|
||||
/* Fallbacks */
|
||||
|
||||
.no-csstransforms3d .bk-list li .bk-book > div,
|
||||
.no-csstransforms3d .bk-list li .bk-book .bk-cover-back {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.no-csstransforms3d .bk-list li .bk-book > div.bk-front {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.no-csstransforms3d .bk-info button,
|
||||
.no-js .bk-info button {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.no-csstransforms3d .bk-list {
|
||||
width: auto;
|
||||
}
|
||||
|
||||
.no-csstransforms3d .bk-list li {
|
||||
position: relative;
|
||||
width: 300px;
|
||||
margin: 10px;
|
||||
float: left;
|
||||
}
|
||||
+164
@@ -0,0 +1,164 @@
|
||||
/* General Demo Style */
|
||||
@import url(http://fonts.googleapis.com/css?family=Lato:400,700);
|
||||
|
||||
@font-face {
|
||||
font-family: 'the_godfatherregular';
|
||||
src: url('../fonts/thegodfather-v2-webfont.eot');
|
||||
src: url('../fonts/thegodfather-v2-webfont.eot?#iefix') format('embedded-opentype'),
|
||||
url('../fonts/thegodfather-v2-webfont.woff') format('woff'),
|
||||
url('../fonts/thegodfather-v2-webfont.ttf') format('truetype'),
|
||||
url('../fonts/thegodfather-v2-webfont.svg#the_godfatherregular') format('svg');
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
html { height: 100%; }
|
||||
|
||||
*,
|
||||
*:after,
|
||||
*:before {
|
||||
-webkit-box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
/* Clearfix hack by Nicolas Gallagher: http://nicolasgallagher.com/micro-clearfix-hack/ */
|
||||
.clearfix:before,
|
||||
.clearfix:after {
|
||||
content: " ";
|
||||
display: table;
|
||||
}
|
||||
|
||||
.clearfix:after {
|
||||
clear: both;
|
||||
}
|
||||
|
||||
.clearfix {
|
||||
*zoom: 1;
|
||||
}
|
||||
|
||||
body {
|
||||
font-family: 'Lato', Calibri, Arial, sans-serif;
|
||||
background: #f6f6f6;
|
||||
font-weight: 400;
|
||||
font-size: 15px;
|
||||
color: #333;
|
||||
overflow: scroll;
|
||||
overflow-x: hidden;
|
||||
}
|
||||
|
||||
.demo-2 body {
|
||||
background: url(../images/wood.jpg);
|
||||
}
|
||||
|
||||
a {
|
||||
color: #555;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.container {
|
||||
width: 100%;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.main,
|
||||
.container > header {
|
||||
width: 90%;
|
||||
max-width: 1060px;
|
||||
margin: 0 auto;
|
||||
position: relative;
|
||||
padding: 0 30px 50px 30px;
|
||||
}
|
||||
|
||||
.container > header {
|
||||
padding: 30px 30px 40px 30px;
|
||||
}
|
||||
|
||||
.container > header h1 {
|
||||
font-size: 34px;
|
||||
line-height: 38px;
|
||||
margin: 0;
|
||||
font-weight: 700;
|
||||
color: #333;
|
||||
float: left;
|
||||
}
|
||||
|
||||
/* Header Style */
|
||||
.codrops-top {
|
||||
line-height: 24px;
|
||||
font-size: 11px;
|
||||
background: #fff;
|
||||
background: rgba(255, 255, 255, 0.5);
|
||||
text-transform: uppercase;
|
||||
z-index: 9999;
|
||||
position: relative;
|
||||
box-shadow: 1px 0px 2px rgba(0,0,0,0.2);
|
||||
}
|
||||
|
||||
.codrops-top a {
|
||||
padding: 0px 10px;
|
||||
letter-spacing: 1px;
|
||||
color: #333;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.codrops-top a:hover {
|
||||
background: rgba(255,255,255,0.8);
|
||||
color: #000;
|
||||
}
|
||||
|
||||
.codrops-top span.right {
|
||||
float: right;
|
||||
}
|
||||
|
||||
.codrops-top span.right a {
|
||||
float: left;
|
||||
display: block;
|
||||
}
|
||||
|
||||
/* Demo Buttons Style */
|
||||
.codrops-demos {
|
||||
float: right;
|
||||
}
|
||||
|
||||
.codrops-demos a {
|
||||
display: inline-block;
|
||||
margin: 10px;
|
||||
color: #666;
|
||||
font-weight: 700;
|
||||
line-height: 30px;
|
||||
border-bottom: 4px solid transparent;
|
||||
}
|
||||
|
||||
.codrops-demos a:hover {
|
||||
color: #000;
|
||||
border-color: #000;
|
||||
}
|
||||
|
||||
.codrops-demos a.current-demo,
|
||||
.codrops-demos a.current-demo:hover {
|
||||
color: #aaa;
|
||||
border-color: #aaa;
|
||||
}
|
||||
|
||||
.support-note {
|
||||
color: #d7823e;
|
||||
font-size: 16px;
|
||||
display: block;
|
||||
font-weight: bold;
|
||||
text-align: center;
|
||||
padding: 5px 0;
|
||||
text-align: left;
|
||||
clear: both;
|
||||
}
|
||||
|
||||
.bookshelf {
|
||||
width: 100%;
|
||||
height: 63px;
|
||||
z-index: -1;
|
||||
margin-top: -25px;
|
||||
background: transparent url(../images/shelf.png) no-repeat center center;
|
||||
position: relative;
|
||||
}
|
||||
+20
@@ -0,0 +1,20 @@
|
||||
"THE GODFATHER Version 2" font was created by Jeff Bell for www.geocities.com/boltonbroscom
|
||||
|
||||
#2 in the "GREATEST FILMS THAT YOU MIGHT HAVE HAD THE OPERTUNITY BUT JUST DIDN'T CARE TO SEE" collection
|
||||
Previous fonts:
|
||||
The Addams Family
|
||||
Casper
|
||||
The Godfather Version 1
|
||||
|
||||
"THE GODFATHER" is a trademark of some company that filmed it almost 30 years ago...sorry, too lazy to look it up
|
||||
"GodFather" font is copyrighted BoltonBros.Com 2003
|
||||
|
||||
You may distribute this font at your will, but do not change the font in any way
|
||||
without my permission. You must also give me full credit for the creation of
|
||||
this font. Thank you. If you wish to contact me about possible future font wants, or
|
||||
wanting to change something in font, you can email me at bellini@ticon.net
|
||||
|
||||
|
||||
|
||||
|
||||
Also, if you're still reading the "Legal Mumbo Jumbo" it's boring isn't it?
|
||||
Binary file not shown.
@@ -0,0 +1,102 @@
|
||||
<?xml version="1.0" standalone="no"?>
|
||||
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd" >
|
||||
<svg xmlns="http://www.w3.org/2000/svg">
|
||||
<metadata></metadata>
|
||||
<defs>
|
||||
<font id="the_godfatherregular" horiz-adv-x="636" >
|
||||
<font-face units-per-em="2048" ascent="1638" descent="-410" />
|
||||
<missing-glyph horiz-adv-x="390" />
|
||||
<glyph horiz-adv-x="2048" />
|
||||
<glyph horiz-adv-x="2048" />
|
||||
<glyph unicode="
" horiz-adv-x="390" />
|
||||
<glyph unicode=" " horiz-adv-x="390" />
|
||||
<glyph unicode="	" horiz-adv-x="390" />
|
||||
<glyph unicode=" " horiz-adv-x="390" />
|
||||
<glyph unicode="!" horiz-adv-x="249" />
|
||||
<glyph unicode=""" horiz-adv-x="522" d="M-15 1379q137 -117 83 -244l209 -125l-80 322zM220 1349q137 -117 83 -244l209 -125l-80 322z" />
|
||||
<glyph unicode="#" />
|
||||
<glyph unicode="$" />
|
||||
<glyph unicode="%" />
|
||||
<glyph unicode="&" horiz-adv-x="486" />
|
||||
<glyph unicode="'" horiz-adv-x="160" d="M-15 1379q137 -117 83 -244l209 -125l-80 322z" />
|
||||
<glyph unicode="(" horiz-adv-x="336" />
|
||||
<glyph unicode=")" horiz-adv-x="384" />
|
||||
<glyph unicode="*" horiz-adv-x="1449" d="M9 1222l22 -22l-22 22l22 -22h45l110 -23l45 -22l44 -44h22l22 -22h23l22 -22h22l22 -22v-45h-44l-22 -22l-23 -22l-110 -111l22 -22h66l22 -22h67l22 22h22l22 22l23 22l22 23l89 88h44v-22l89 -89h66l22 23l22 -23l23 -22h22l44 22v-642l22 22v643h45l44 44h22l22 22 l23 22l22 22h177l22 -22l22 22h23v-775l22 22v665l22 22v88l-22 23v44h22v44h-44l-23 22h-133v45l-2 288h2l-22 22l45 22v22l-23 22l-66 22h-67l-44 -44v44l-22 22v222h-67v-244l23 -44l22 -22v-44l22 -23l22 -22h22v-44l22 -22v-22l23 -22v-156l-23 23h-110l-23 22h-111 l-22 -22v-133h89v-22l-22 -23l-22 -22l-23 -22l-44 -44h-22l-22 -22l-22 22l-23 22l-44 44v22l-22 23l22 22v110l22 23v44h-44v-44l-22 -23h-22l-23 -22l-88 -88h-23l-22 22l22 22l23 22l22 44l22 23v44h22l22 22v22h-44l-44 -44l-23 -22v-45l-66 -66v44l22 22v67l22 22 l-22 67v-45h-22v-66l-22 -22v-23l-22 -22l-23 -22v133l23 22v67l44 44l18 21l48 23l23 45l111 110v222l-23 22h-44l22 -66v-156l-177 -177l-37 -30l-22 -22l-30 -36v-45h-111l-22 23h-24l-20 -23l-22 -22l-23 -22zM31 624h22v553h-22v-553zM319 424l20 -27l3 72v243l-23 67 v-355zM630 624l22 22v22l12 44v133l10 45l-22 22h-22v-288zM874 867v67h66l-22 -22v-22zM896 956v22l67 67h66l22 -23l-66 -66h-89zM1118 1288v155l22 22l22 23l22 -23v-288h-44v89zM1184 225h22v687l-22 66v-753z" />
|
||||
<glyph unicode="+" />
|
||||
<glyph unicode="," horiz-adv-x="285" d="M-47 -229q376 -17 335 391h-56l-167 -84q-2 -184 -112 -307z" />
|
||||
<glyph unicode="-" horiz-adv-x="471" />
|
||||
<glyph unicode="." horiz-adv-x="295" d="M40 107q0 44 33 77.5t76 33.5t72 -31.5t29 -78.5q0 -48 -31 -80t-74 -32q-42 0 -73.5 33t-31.5 78z" />
|
||||
<glyph unicode="/" horiz-adv-x="357" d="M-89 -29h57h22h146l509 1298l44 41h-233l-496 -1279z" />
|
||||
<glyph unicode="0" horiz-adv-x="675" d="M15 1345l2 -1281l26 -42l38 -22h474l38 18l21 25l8 37l1 1326l-16 26l-26 19l-18 11h-468l-39 -11l-28 -26l-12 -37zM227 289l1 854l28 57l131 4l25 -56l1 -30l3 -825l-30 -33h-128z" />
|
||||
<glyph unicode="1" horiz-adv-x="425" d="M-16 1259l95 -24l38 -70v-98l-1 -935l-59 -56v-76h340v73l-60 53v1349h-94z" />
|
||||
<glyph unicode="2" horiz-adv-x="817" d="M0 77v576l224 164l142 78l118 72l3 240l-51 37h-77l-54 -48l-1 -190l-304 -144v498l92 71l111 50l163 20h120l129 -20l152 -113v-475l-59 -62l-130 -73l-206 -128l-62 -118l1 -244l77 -73l155 2l-1 114l225 98v-307l-59 -103h-631z" />
|
||||
<glyph unicode="3" horiz-adv-x="798" d="M7 149v382l271 -142v-199q37 -38 40 -40q19 -13 53 -13q90 0 92 71v437h-420v42l192 103q-5 0 111 0q49 0 117 -3l-1 486q0 32 -26.5 52t-64.5 20q-43 0 -93 -54v-199l-271 -142v382q-2 57 113 109q93 42 134 42h215q52 0 154 -54q113 -60 113 -112v-1153 q0 -54 -114 -116q-95 -50 -117 -50h-288q-29 0 -114 50q-98 58 -96 101z" />
|
||||
<glyph unicode="4" horiz-adv-x="851" d="M1 683v116l456 620h224q11 1 54 -51v-563h40q15 0 35 45v-306q-14 26 -19 30q-10 5 -21 11h-35v-530l24 -53h-217q-39 36 -38 49v534h-436zM238 806h264v343z" />
|
||||
<glyph unicode="5" horiz-adv-x="754" d="M-2 -1h35h18h118h76h24h106h24h23h24h100h47h41l12 23l59 92v30v31v38v99v31v130v23v91q-9 95 -59 169h-100h-65h-23h-101h-17h-71v30v31v130v22v198h77h23h24h23h100h18h71q103 119 -12 238h-24h-17h-118h-24h-17h-106h-77h-23h-101h-17h-71q17 -45 35 -76v-612 q-2 -54 6 -117q43 -49 65 -92h24h29h24h29h77h23h100h18h71v-264h-77h-23h-106h-24h-24h-23h-100h-18h-71q12 -144 -35 -245z" />
|
||||
<glyph unicode="6" horiz-adv-x="775" d="M12 150q192 -179 394 -156t307 163l6 67v296q34 297 -404 276l1 381q83 71 155 -8l-1 -191l253 -182l-4 431l-13 40q-171 159 -391 128q-195 -20 -303 -148v-1097zM308 588l48 33l51 -27l-2 -345l-46 -39l-50 48z" />
|
||||
<glyph unicode="7" horiz-adv-x="713" d="M9 1104l8 16l64 104h399v-120l-287 -1100h319q-25 83 0 151l231 901v295l-72 96h-662v-343z" />
|
||||
<glyph unicode="8" horiz-adv-x="741" d="M16 178q138 -199 364.5 -182t319.5 189v451l-54 72l58 71l1 480q-201 181 -398.5 157t-290.5 -161v-470l59 -84l-59 -52v-471zM309 243v292l25 46h49l29 -39v-310l-17 -37l-68 -2zM309 863v292l25 46h49l29 -39v-310l-17 -37l-68 -2z" />
|
||||
<glyph unicode="9" d="M0 763q175 -160 415 -131v-396q-69 -71 -157 -13v224l-255 176l1 -458q355 -336 723 7l2 1060l-20 82q-120 104 -253 130h-157q-329 -58 -299 -396v-285zM318 884v304l29 38h53l34 -41v-303l-28 -56l-67 1z" />
|
||||
<glyph unicode=":" horiz-adv-x="349" d="M-300 474q0 62 45.5 108t105.5 46q59 0 99.5 -43.5t40.5 -108.5q0 -66 -43 -110.5t-103 -44.5q-58 0 -101.5 45.5t-43.5 107.5zM-300 1010q0 61 45.5 107t105.5 46q59 0 99.5 -43.5t40.5 -108.5q0 -66 -43 -110.5t-103 -44.5q-58 0 -101.5 45.5t-43.5 108.5z" />
|
||||
<glyph unicode=";" horiz-adv-x="374" d="M-47 -229q376 -17 335 391h-56l-167 -84q-2 -184 -112 -307zM15 482q0 62 46 109t107 47q60 0 101 -44t41 -111q0 -66 -43.5 -111.5t-104.5 -45.5q-59 0 -103 46t-44 110z" />
|
||||
<glyph unicode=">" horiz-adv-x="575" d="M-12 1026q100 156 256 205v-1023l-128 -204h335q-53 81 -49 776q3 438 164 438q94 0 242 -149v392h-820v-435zM373 9l225 -5l-140 220v1057q150 -85 350 -221l-10 363l-385 -6z" />
|
||||
<glyph unicode="?" horiz-adv-x="832" d="M-5 938q191 80 315 158l-1 241h139q77 -536 -236 -576l-1 -374h315q-23 328 256 433v158v453q-450 275 -787 -40v-453zM210 164q0 68 50 118.5t116 50.5q64 0 108.5 -47.5t44.5 -119.5t-47 -121t-113 -49q-64 0 -111.5 50t-47.5 118z" />
|
||||
<glyph unicode="@" horiz-adv-x="579" />
|
||||
<glyph unicode="A" horiz-adv-x="580" d="M-67 -2h295v118l59 59l59 -59v-118h295l-26 62v129l-42 59l-118 1220h-354l-109 -1234l-59 -59v-177zM228 471l54 322l54 -323z" />
|
||||
<glyph unicode="B" horiz-adv-x="678" d="M12 -3h334h165l137 107v515l-77 72l76 73v568l-134 134h-501v-33l33 -34v-1335l-33 -34v-33zM308 146v403h100v-403h-100zM313 898v334h100v-334h-100z" />
|
||||
<glyph unicode="C" d="M5 40l45 -45h478l81 88l1 80v172l-120 -113h-257v957l68 68h956l224 205h-1362l-114 -159v-1253z" />
|
||||
<glyph unicode="D" horiz-adv-x="665" d="M2 -2h538l100 100v1238l-134 134h-501v-33l33 -34v-1335l-33 -34zM306 232v1004h100v-1004h-100z" />
|
||||
<glyph unicode="E" horiz-adv-x="774" d="M0 0v63l38 38v1259l-35 36v57h1414l-162 -196h-921v-443h303l82 -83v-80l-86 -87h-310v-367h438l-132 -197h-629z" />
|
||||
<glyph unicode="F" horiz-adv-x="774" d="M0 0v64l39 39v1278l-36 36v58h1435l-164 -199h-935v-450h307l84 -84v-108l-88 -88h-314v-447l40 -36l1 -63h-369z" />
|
||||
<glyph unicode="G" horiz-adv-x="653" d="M12 44l45 -45h478l45 47l1 772l46 46v68h-319v-68l46 -45v-593h-114v957l68 68h956l224 205h-1362l-76 -60l-38 -99v-1253z" />
|
||||
<glyph unicode="H" horiz-adv-x="810" d="M-17 1447l58 -58l-5 -1395l5 3h302l-69 61v526h260l2 263l-263 2v598h-145h-145zM473 1447l58 -58l-5 -1395l5 3h302l-69 61l-1 1389h-290z" />
|
||||
<glyph unicode="I" horiz-adv-x="310" d="M0 1447l58 -58l1 -1395l-1 3h302l-69 61l-1 1389h-290z" />
|
||||
<glyph unicode="J" horiz-adv-x="602" d="M3 70l81 -78h378l119 72v268l-264 3l-61 -66l-153 3l-100 179v-381zM318 1396l2 -1058l260 -53l1 1199l-147 1z" />
|
||||
<glyph unicode="K" horiz-adv-x="623" d="M3 -4h235v548h117v-548h235v646l-59 59l59 59v502l-59 59h-175l2 -529l-116 2v553l-239 118v-1469z" />
|
||||
<glyph unicode="L" horiz-adv-x="598" d="M0 1453l58 -58v-1392h597l-71 61l1 171h-295v1218h-290z" />
|
||||
<glyph unicode="M" horiz-adv-x="1169" d="M17 7h318l-45 46l45 -46l-45 46v956l45 45h46l46 -45v-956l45 -46h274v183l-46 45v1092l-91 91h-288l-56 -46h-21l-45 45h-130l-52 -55v-1355zM436 7h318l-45 46l45 -46l-45 46v956l45 45h46l46 -45v-956l45 -46h274v183l-46 45v1092l-91 91h-288l-56 -46h-21l-45 45 h-130l-52 -55v-1355z" />
|
||||
<glyph unicode="N" horiz-adv-x="751" d="M17 7h318l-45 46l45 -46l-45 46v956l45 45h46l46 -45v-956l45 -46h274v183l-46 45v1092l-91 91h-288l-56 -46h-21l-45 45h-130l-52 -55v-1355z" />
|
||||
<glyph unicode="O" horiz-adv-x="672" d="M18 81l33 -53l45 -30h488l62 36l15 74v1294l-21 41l-41 23l-32 6h-448l-49 -14l-35 -33l-16 -47l-1 -54v-1243zM288 366v701l32 38l35 2l34 -40l2 -702l-35 -35h-33z" />
|
||||
<glyph unicode="P" horiz-adv-x="690" d="M2 -3h337l1 54l-37 16v464h234l100 100v701l-134 134h-501v-33l33 -34v-1335l-33 -34v-33zM310 769v467h100v-467h-100z" />
|
||||
<glyph unicode="Q" horiz-adv-x="672" d="M18 81l33 -53l45 -30h488l50 19l26 53l1 38l1 1314l-31 33l-32 11l-32 6h-448l-49 -14l-35 -33l-16 -47l-1 -54v-1243zM288 366v701l35 73l35 -2l31 -71l2 -38v-664l-35 -35h-33z" />
|
||||
<glyph unicode="R" horiz-adv-x="673" d="M-34 -5h273v529l38 48l79 -107v-470h235v646l-59 59l59 59v646l-59 59h-564v-55l36 -35v-1282l-38 -45v-52zM255 825v411h117v-411h-117z" />
|
||||
<glyph unicode="S" horiz-adv-x="812" d="M20 241l18 -101l19 -41l18 -20l73 -40l55 -21l91 -20h257l92 20l36 21l37 20l55 61l18 40v528l-18 40l-73 81l-331 163l-36 40v284l18 20h111l18 -20v-223l18 -20l256 -142h37v426l-18 20l-19 20l-18 21l-36 40l-55 41l-73 20h-312l-73 -20l-55 -21l-37 -20l-18 -20 l-31 -33l-24 -89v-304l18 -61l19 -41l36 -40l367 -195l36 -33v-360l-18 -61l-18 -20l-93 3l-36 57v366l-18 20l-256 101h-37v-487z" />
|
||||
<glyph unicode="T" horiz-adv-x="686" d="M0 1060l133 133l98 35l3 -1014l-136 -214h486l-126 204l-1 1022l104 -35l125 -140v391l-686 2v-384z" />
|
||||
<glyph unicode="U" horiz-adv-x="853" d="M18 1226l51 -51v-1070l25 -52l27 -26l76 -25h203l52 25l25 26l25 25v-51l51 -25h306v103l-25 25l-26 24v1327l-331 -179l-25 -25l-27 -26l27 -25l25 -25v-841l-25 -27h-27l-25 27v1070l-357 -179z" />
|
||||
<glyph unicode="V" horiz-adv-x="890" d="M-1 1369l25 -25l202 -1346h538l249 1382l-348 -3l26 -52l-148 -988l-25 -26h-24l-25 26v49l-103 1009l-342 -3z" />
|
||||
<glyph unicode="W" horiz-adv-x="1169" d="M1 88l91 -91h91l197 -1l56 46h21l45 -45h130l52 55l4 1355h-270l-6 -1002l-45 -45l-46 1l-46 45l3 956l-45 46h-227zM602 -4l197 -1l56 46h21l45 -45h130l52 54l-2 1288l-48 68l-219 1l-3 -1003l-45 -45h-46l-46 46z" />
|
||||
<glyph unicode="X" horiz-adv-x="901" d="M17 1l255 -2l14 34l577 1330l-234 -2l-569 -1340zM63 1172l47 -29l8 -30l505 -1086l-31 -28l308 3l-475 1032l-176 324l-19 -12z" />
|
||||
<glyph unicode="Y" horiz-adv-x="642" d="M-1 1115l1 -630l72 -66l74 -1h184v-123l257 -9l4 1146l-249 -186l-1 -550l-105 2l-1 468l-181 -2l-18 -17zM20 74l82 -75h370l113 75v251l-255 4l-60 -64h-116l-134 89v-280z" />
|
||||
<glyph unicode="Z" horiz-adv-x="790" d="M-2 26l28 -28h654l26 28l28 26l28 28v437l-56 -136l-26 -28l-28 -28l-27 -26l-27 -28h-81l-28 28l-28 26v56l355 1038v54h-682l-82 -54l-26 -54v-383l26 28l28 54l136 136h81l56 -54l-301 -1012z" />
|
||||
<glyph unicode="[" horiz-adv-x="282" />
|
||||
<glyph unicode="\" horiz-adv-x="318" />
|
||||
<glyph unicode="]" horiz-adv-x="312" />
|
||||
<glyph unicode="a" horiz-adv-x="522" d="M5 96l8 -29l40 -43l24 -24h169l24 24l24 -24h217v24l-24 48v844l-72 72l-333 -2l-54 -63l1 -7v-193l24 -24l121 96h72v-96h-48l-97 -72l-24 -25l-72 -72v-434zM222 241v217l24 24h48v-169l-5 -40l-10 -19l-9 -13h-48z" />
|
||||
<glyph unicode="b" horiz-adv-x="559" d="M5 -9h180l30 30h30l30 -30h150l60 60v810l-60 60h-210v180l120 120l-330 210v-1440zM215 261v450h60v-450h-60z" />
|
||||
<glyph unicode="c" horiz-adv-x="486" d="M18 44l46 -46h346l46 46l17 20l6 26v207l-115 -92h-92l-47 46l1 366l49 58h94l110 -81v256l-67 69h-302l-92 -69v-806z" />
|
||||
<glyph unicode="d" horiz-adv-x="495" d="M-5 60l14 -29l9 -13l16 -14l26 -10h88l65 22h65v-22h175l2 1480l-318 -276l22 -22l10 -2l-10 2l32 -2l44 -44l22 -43v-153l-22 -22l-183 -1l-32 -17l-20 -26l-5 -44v-764zM191 256v437h66v-439l-22 -20h-22z" />
|
||||
<glyph unicode="e" horiz-adv-x="486" d="M18 44l46 -46h346l46 46l17 20l6 26v207h-23l-92 -92h-92l-23 23l-24 23l1 23l115 115l46 23l46 24l46 46v368l-67 69h-302l-92 -69v-806zM226 574v138h46v-115l-23 -23h-23z" />
|
||||
<glyph unicode="f" horiz-adv-x="294" d="M10 -3h286v22l-87 110l-1 109v418l66 44v197l-66 52l1 300l43 -1l22 -22v-219l176 110v241l-66 66l-310 -2l-64 -58v-1367z" />
|
||||
<glyph unicode="g" horiz-adv-x="516" d="M20 69l29 -30l30 -30l60 -1h150v-83l210 -1v-7l3 1020h-60l-30 1h-90l-30 -30h-30l-30 30h-90l-60 1l-60 -60zM36 -51v-256l67 -69h302l92 69v230l-208 3l-49 -58h-94zM230 218l1 450h60l-1 -450h-60z" />
|
||||
<glyph unicode="h" horiz-adv-x="495" d="M13 -3h196l24 2l-2 -2v22l-22 21v631l18 39l31 -2l16 -37v-674h218v25l-22 22v801l-13 26l-9 17l-33 18l-32 4h-131l-41 -10l-2 54v478l-196 -109v-1326z" />
|
||||
<glyph unicode="i" horiz-adv-x="313" d="M15 -7h246v950h-92l-154 -123v-61l31 -31v-612l-31 -31v-92zM15 1061l62 -57h122l31 31l31 30v154l-31 30l-31 31h-122l-31 -31l-31 -30v-158z" />
|
||||
<glyph unicode="j" horiz-adv-x="290" d="M-218 -51v-256l67 -69h302l92 69v230l-208 3l-49 -58h-94zM26 1041l62 -57h122l31 31l31 30v154l-31 30l-31 31h-122l-31 -31l-31 -30v-158zM35 -105l210 -8l3 1050h-60l-30 1h-72l10 1l-60 -60z" />
|
||||
<glyph unicode="k" horiz-adv-x="521" d="M-9 1135l16 -21v-1117h198v463h99v-463h199v546l-50 50l50 50v408l-50 50h-148l2 -402l-117 -1l1 518l-13 27z" />
|
||||
<glyph unicode="l" horiz-adv-x="252" d="M-4 -3h220v1316l-31 31l-189 -114l31 -32l-1 -1168z" />
|
||||
<glyph unicode="m" horiz-adv-x="847" d="M-4 777l31 25l31 -61v-742h216l-31 31l31 -31l-31 31v649l31 31h31l31 -31v-649l31 -31h186v124l-31 31v741l-62 62h-196l-38 -31h-14l-30 31h-31l-155 -93v-87zM276 777l31 25l31 -61v-742h216l-31 31v649l31 31h31l31 -31v-649l31 -31h186v124l-31 31v741l-62 62h-196 l-38 -31h-14l-30 31h-31l-155 -93v-87z" />
|
||||
<glyph unicode="n" horiz-adv-x="577" d="M17 785l31 25l31 -61v-742h216l-31 31v649l31 31h31l31 -31v-649l31 -31h186v124l-31 31v741l-62 62h-196l-38 -31h-14l-30 31h-31l-155 -93v-87z" />
|
||||
<glyph unicode="o" horiz-adv-x="473" d="M18 51l23 -34l31 -19h338l34 12l18 34l1 24l-6 834l-15 21l-22 7l-22 4h-310l-34 -9l-24 -21l-11 -30l-1 -34v-789zM205 232v445l24 46l24 -1l22 -45l1 -24v-422l-24 -22h-23z" />
|
||||
<glyph unicode="p" horiz-adv-x="495" d="M6 918l2 -1362l319 275l-22 22l-10 2l10 -2l-32 2l-44 44l-21 43l-2 35l22 22h183l32 17l20 26l6 44l3 764l-14 29l-9 13l-16 14l-26 10l-44 1l44 -1l-44 1h-44l-65 -22h-65v22zM225 662l22 20h22l22 -22l-2 -437h-63z" />
|
||||
<glyph unicode="q" horiz-adv-x="559" d="M7 53l29 -30l30 -30l60 -1h150v-113l-121 -120l330 -211l1 1373l-177 1l-30 -30h-30l-30 30h-90l-60 1l-60 -60zM217 202l1 450h60l-1 -450h-60z" />
|
||||
<glyph unicode="r" horiz-adv-x="449" d="M7 -7h337l-67 67l-23 45v541l46 45h44l23 -23l45 -67v315h-112l-46 -45l-22 22l-23 45h-49l-153 -112v-45l22 -23v-675l-22 -23v-67z" />
|
||||
<glyph unicode="s" horiz-adv-x="566" d="M20 150l13 -64l12 -25l13 -12l50 -26l38 -12l64 -13h177l63 13l25 12l25 13l13 13l13 12l12 13l13 25v329l-13 25l-50 50l-228 101l-12 13l-13 13v177l13 12h75l13 -12v-139l13 -13l177 -88h25v265l-38 38l-13 12l-12 13l-38 25l-51 13h-215l-50 -13l-38 -12l-25 -13 l-13 -13l-21 -20l-17 -55v-190l13 -38l12 -25l13 -13l13 -12l252 -122l25 -20l1 -225l-13 -38l-13 -12l-63 2l-25 36v227l-13 13l-177 63h-25v-303z" />
|
||||
<glyph unicode="t" horiz-adv-x="269" d="M-36 1098l43 -43v-1014l22 -43h194v43l-22 22v582l63 44v172l-63 43v216l12 24v86l-12 19v22l-236 -146z" />
|
||||
<glyph unicode="u" horiz-adv-x="605" d="M18 837l35 -35v-730l17 -35l18 -18l52 -17h139l35 17l17 18l17 17v-35l35 -17h209v70l-17 17l-18 17v905l-226 -122l-35 -35l18 -17l17 -17v-574l-17 -18h-18l-17 18v730l-244 -122z" />
|
||||
<glyph unicode="v" horiz-adv-x="692" d="M-1 935l17 -17l138 -920h368l170 945l-238 -2l18 -36l-101 -675l-17 -18h-17l-17 18v33l-70 690l-234 -2z" />
|
||||
<glyph unicode="w" horiz-adv-x="828" d="M15 94l79 -85l65 -3l-31 -1l31 1h165l38 32h14l30 -31h31l155 94l-1 87l-30 -25l-32 60l-3 742l-184 -1l2 -680l-31 -31h-31l-31 31l-3 649l-31 31h-62l-31 -1h-31l-28 1l-1 -737l-33 -71l-15 32zM342 809l1 -30l-1 30l1 -30l3 -710l62 -62h62l134 1l38 31h14l30 -31h31 l91 52l-2 907l-62 -1h-123l3 -680l-31 -31h-31l-31 30l-3 649l-31 31h-124z" />
|
||||
<glyph unicode="x" horiz-adv-x="593" d="M-6 0l177 -1l10 24l18 43l10 20l18 42l19 43l8 21l19 43l9 21l19 43l9 20l9 21l18 43l10 21l38 90l197 456l-162 -1l-397 -935zM25 817l34 -20l5 -22l352 -756l-22 -20l214 2l-330 720l-122 225l-15 -7z" />
|
||||
<glyph unicode="y" horiz-adv-x="559" d="M8 765l1 -704l29 -30l30 -30l60 -1h150v-113l210 -8v1050h-57l-118 -95l-5 -566h-103v556l-134 1zM25 -59v-256l67 -69h302l92 69v230l-208 3l-49 -58h-94z" />
|
||||
<glyph unicode="z" horiz-adv-x="529" d="M-2 16l18 -18h424l53 53v283l-36 -88l-17 -18l-18 -18l-18 -17l-17 -18h-53l-18 18l-18 17v36l230 672v35h-442l-53 -35l-17 -35v-248l17 18l18 35l88 88h53l18 -17l18 -18l-195 -655z" />
|
||||
<glyph unicode="" horiz-adv-x="950" d="M0 0v950h950v-950h-950z" />
|
||||
</font>
|
||||
</defs></svg>
|
||||
|
After Width: | Height: | Size: 16 KiB |
Binary file not shown.
Binary file not shown.
Binary file not shown.
|
After Width: | Height: | Size: 18 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 8.5 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 144 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 35 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 19 KiB |
Executable
+182
@@ -0,0 +1,182 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en" class="no-js">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>3D Book Showcase</title>
|
||||
<meta name="description" content="3D Book Showcase with CSS 3D Transforms" />
|
||||
<meta name="keywords" content="3d transforms, css3 3d, book, jquery, open book, css transitions" />
|
||||
<meta name="author" content="Codrops" />
|
||||
<link rel="shortcut icon" href="../favicon.ico">
|
||||
<link rel="stylesheet" type="text/css" href="css/default.css" />
|
||||
<link rel="stylesheet" type="text/css" href="css/component.css" />
|
||||
<script src="js/modernizr.custom.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div class="container">
|
||||
<!-- Codrops top bar -->
|
||||
<div class="codrops-top clearfix">
|
||||
<a href="http://tympanus.net/Tutorials/ItemSlider/"><strong>« Previous Demo: </strong>Simple Item Slider</a>
|
||||
<span class="right"><a href="http://tympanus.net/codrops/?p=13406"><strong>Back to the Codrops Article</strong></a></span>
|
||||
</div><!--/ Codrops top bar -->
|
||||
<header class="clearfix">
|
||||
<h1>3D Book Showcase</h1>
|
||||
<nav class="codrops-demos">
|
||||
<a class="current-demo" href="index.html">Demo 1</a>
|
||||
<a href="index2.html">Demo 2</a>
|
||||
</nav>
|
||||
<span class="support-note">Best viewed in WebKit browsers</span>
|
||||
</header>
|
||||
<div class="main">
|
||||
<ul id="bk-list" class="bk-list clearfix">
|
||||
<li>
|
||||
<div class="bk-book book-1 bk-bookdefault">
|
||||
<div class="bk-front">
|
||||
<div class="bk-cover">
|
||||
<h2>
|
||||
<span>Anthony Burghiss</span>
|
||||
<span>A Catwork Orange</span>
|
||||
</h2>
|
||||
</div>
|
||||
<div class="bk-cover-back"></div>
|
||||
</div>
|
||||
<div class="bk-page">
|
||||
<div class="bk-content bk-content-current">
|
||||
<p>Red snapper Kafue pike fangtooth humums slipmouth, salmon cutlassfish; swallower European perch mola mola sunfish, threadfin bream. Billfish hog sucker trout-perch lenok orbicular velvetfish. Delta smelt striped bass, medusafish dragon goby starry flounder cuchia round whitefish northern anchovy spadefish merluccid hake cat shark Black pickerel. Pacific cod.</p>
|
||||
</div>
|
||||
<div class="bk-content">
|
||||
<p>Whale catfish leatherjacket deep sea anglerfish grenadier sawfish pompano dolphinfish carp large-eye bream, squeaker amago. Sandroller; rough scad, tiger shovelnose catfish snubnose parasitic eel? Black bass soldierfish duckbill--Rattail Atlantic saury Blind shark California halibut; false trevally warty angler!</p>
|
||||
</div>
|
||||
<div class="bk-content">
|
||||
<p>Trahira giant wels cutlassfish snapper koi blackchin mummichog mustard eel rock bass whiff murray cod. Bigmouth buffalo ling cod giant wels, sauger pink salmon. Clingfish luderick treefish flatfish Cherubfish oldwife Indian mul gizzard shad hagfish zebra danio. Butterfly ray lizardfish ponyfish muskellunge Long-finned sand diver mullet swordfish limia ghost carp filefish.</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="bk-back">
|
||||
<p>In this nightmare vision of cats in revolt, fifteen-year-old Alex and his friends set out on a diabolical orgy of robbery, rape, torture and murder. Alex is jailed for his teenage delinquency and the State tries to reform him - but at what cost?</p>
|
||||
</div>
|
||||
<div class="bk-right"></div>
|
||||
<div class="bk-left">
|
||||
<h2>
|
||||
<span>Anthony Burghiss</span>
|
||||
<span>A Catwork Orange</span>
|
||||
</h2>
|
||||
</div>
|
||||
<div class="bk-top"></div>
|
||||
<div class="bk-bottom"></div>
|
||||
</div>
|
||||
<div class="bk-info">
|
||||
<button class="bk-bookback">Flip</button>
|
||||
<button class="bk-bookview">View inside</button>
|
||||
<h3>
|
||||
<span>Anthony Burghiss</span>
|
||||
<span>A Catwork Orange</span>
|
||||
</h3>
|
||||
<p>Social prophecy? Black comedy? Study of freewill? A Clockwork Orange is all of these. It is also a dazzling experiment in language, as Burghiss creates a new language - 'meow', the cat slang of a not-too-distant future.</p>
|
||||
</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="bk-book book-2 bk-bookdefault">
|
||||
<div class="bk-front">
|
||||
<div class="bk-cover">
|
||||
<h2>
|
||||
<span>The Catfather</span>
|
||||
<span>Mario Purrzo</span>
|
||||
</h2>
|
||||
</div>
|
||||
<div class="bk-cover-back"></div>
|
||||
</div>
|
||||
<div class="bk-page">
|
||||
<div class="bk-content">
|
||||
<p>Whale catfish leatherjacket deep sea anglerfish grenadier sawfish pompano dolphinfish carp large-eye bream, squeaker amago. Sandroller; rough scad, tiger shovelnose catfish snubnose parasitic eel? Black bass soldierfish duckbill--Rattail Atlantic saury Blind shark California halibut; false trevally warty angler!</p>
|
||||
</div>
|
||||
<div class="bk-content">
|
||||
<p>Trahira giant wels cutlassfish snapper koi blackchin mummichog mustard eel rock bass whiff murray cod. Bigmouth buffalo ling cod giant wels, sauger pink salmon. Clingfish luderick treefish flatfish Cherubfish oldwife Indian mul gizzard shad hagfish zebra danio. Butterfly ray lizardfish ponyfish muskellunge Long-finned sand diver mullet swordfish limia ghost carp filefish.</p>
|
||||
</div>
|
||||
<div class="bk-content bk-content-current">
|
||||
<p>Red snapper Kafue pike fangtooth humums's slipmouth, salmon cutlassfish; swallower European perch mola mola sunfish, threadfin bream. Billfish hog sucker trout-perch lenok orbicular velvetfish. Delta smelt striped bass, medusafish dragon goby starry flounder cuchia round whitefish northern anchovy spadefish merluccid hake cat shark Black pickerel. Pacific cod.</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="bk-back">
|
||||
<p>Tyrant, blackmailer, racketeer, murderer - his influence reaches every level of American society. Meet Cat Corleone, a friendly cat, a just cat, a reasonable cat. The deadliest lord of the Cata Nostra. The Catfather.</p>
|
||||
</div>
|
||||
<div class="bk-right"></div>
|
||||
<div class="bk-left">
|
||||
<h2>
|
||||
<span>The Catfather</span>
|
||||
<span>by Mario Purrzo</span>
|
||||
</h2>
|
||||
</div>
|
||||
<div class="bk-top"></div>
|
||||
<div class="bk-bottom"></div>
|
||||
</div>
|
||||
<div class="bk-info">
|
||||
<button class="bk-bookback">Flip</button>
|
||||
<button class="bk-bookview">View inside</button>
|
||||
<h3>
|
||||
<span>Mario Purrzo</span>
|
||||
<span>The Catfather</span>
|
||||
</h3>
|
||||
<p>A modern masterpiece,The Godfather is a searing portrayal of the 1940s criminal underworld. It is also the intimate story of the Corleone family, at once drawn together and ripped apart by its unique position at the core of the American Mafia. </p>
|
||||
</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="bk-book book-3 bk-bookdefault">
|
||||
<div class="bk-front">
|
||||
<div class="bk-cover">
|
||||
<h2>
|
||||
<span>J.C. Salinger</span>
|
||||
<span>The Catcher in the Rye</span>
|
||||
</h2>
|
||||
</div>
|
||||
<div class="bk-cover-back"></div>
|
||||
</div>
|
||||
<div class="bk-page">
|
||||
<div class="bk-content bk-content-current">
|
||||
<p>Oceanic flyingfish spotted danio fingerfish leaffish, Billfish halibut Atlantic cod threadsail poacher slender mola. Swallower muskellunge, turbot needlefish yellow perch trout dhufish dwarf gourami false moray southern smelt cod dwarf gourami. Betta blue catfish bottlenose electric ray sablefish.</p>
|
||||
</div>
|
||||
<div class="bk-content">
|
||||
<p>Whale catfish leatherjacket deep sea anglerfish grenadier sawfish pompano dolphinfish carp large-eye bream, squeaker amago. Sandroller; rough scad, tiger shovelnose catfish snubnose parasitic eel? Black bass soldierfish duckbill--Rattail Atlantic saury Blind shark California halibut; false trevally warty angler!</p>
|
||||
</div>
|
||||
<div class="bk-content">
|
||||
<p>Trahira giant wels cutlassfish snapper koi blackchin mummichog mustard eel rock bass whiff murray cod. Bigmouth buffalo ling cod giant wels, sauger pink salmon. Clingfish luderick treefish flatfish Cherubfish oldwife Indian mul gizzard shad hagfish zebra danio. Butterfly ray lizardfish ponyfish muskellunge Long-finned sand diver mullet swordfish limia ghost carp filefish.</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="bk-back">
|
||||
<img src="images/3.png" alt="cat"/>
|
||||
<p>Holden Catfield is a seventeen-year-old dropout who has just been kicked out of his fourth school. Navigating his way through the challenges of growing up, Holden dissects the 'phony' aspects of society.</p>
|
||||
</div>
|
||||
<div class="bk-right"></div>
|
||||
<div class="bk-left">
|
||||
<h2>
|
||||
<span>J.C. Salinger</span>
|
||||
<span>The Catcher in the Rye</span>
|
||||
</h2>
|
||||
</div>
|
||||
<div class="bk-top"></div>
|
||||
<div class="bk-bottom"></div>
|
||||
</div>
|
||||
<div class="bk-info">
|
||||
<button class="bk-bookback">Flip</button>
|
||||
<button class="bk-bookview">View inside</button>
|
||||
<h3>
|
||||
<span>J.C. Salinger</span>
|
||||
<span>The Catcher in the Rye</span>
|
||||
</h3>
|
||||
<p>Originally published for adults, this novel has since become popular with adolescent readers for its themes of cat confusion, angst, alienation, and rebellion.</p>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div><!-- /container -->
|
||||
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
|
||||
<script src="js/books1.js"></script>
|
||||
<script>
|
||||
$(function() {
|
||||
|
||||
Books.init();
|
||||
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
Executable
+519
@@ -0,0 +1,519 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en" class="no-js demo-2">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>3D Book Showcase</title>
|
||||
<meta name="description" content="3D Book Showcase with CSS 3D Transforms" />
|
||||
<meta name="keywords" content="3d transforms, css3 3d, book, jquery, open book, css transitions" />
|
||||
<meta name="author" content="Codrops" />
|
||||
<link rel="shortcut icon" href="../favicon.ico">
|
||||
<link rel="stylesheet" type="text/css" href="css/default.css" />
|
||||
<link rel="stylesheet" type="text/css" href="css/component2.css" />
|
||||
<script src="js/modernizr.custom.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div class="container">
|
||||
<!-- Codrops top bar -->
|
||||
<div class="codrops-top clearfix">
|
||||
<a href="http://tympanus.net/Tutorials/ItemSlider/"><strong>« Previous Demo: </strong>Simple Item Slider</a>
|
||||
<span class="right"><a href="http://tympanus.net/codrops/?p=13406"><strong>Back to the Codrops Article</strong></a></span>
|
||||
</div><!--/ Codrops top bar -->
|
||||
<header class="clearfix">
|
||||
<h1>3D Book Showcase</h1>
|
||||
<nav class="codrops-demos">
|
||||
<a href="index.html">Demo 1</a>
|
||||
<a class="current-demo" href="index2.html">Demo 2</a>
|
||||
</nav>
|
||||
<span class="support-note">Best viewed in WebKit browsers</span>
|
||||
</header>
|
||||
<div class="main">
|
||||
<ul id="bk-list" class="bk-list clearfix">
|
||||
<li>
|
||||
<div class="bk-book book-1">
|
||||
<div class="bk-front">
|
||||
<div class="bk-cover">
|
||||
<h2>
|
||||
<span>Anthony Burghiss</span>
|
||||
<span>A Catwork Orange</span>
|
||||
</h2>
|
||||
</div>
|
||||
<div class="bk-cover-back"></div>
|
||||
</div>
|
||||
<div class="bk-page">
|
||||
<div class="bk-content bk-content-current">
|
||||
<p>Red snapper Kafue pike fangtooth humums slipmouth, salmon cutlassfish; swallower European perch mola mola sunfish, threadfin bream. Billfish hog sucker trout-perch lenok orbicular velvetfish. Delta smelt striped bass, medusafish dragon goby starry flounder cuchia round whitefish northern anchovy spadefish merluccid hake cat shark Black pickerel. Pacific cod.</p>
|
||||
</div>
|
||||
<div class="bk-content">
|
||||
<p>Whale catfish leatherjacket deep sea anglerfish grenadier sawfish pompano dolphinfish carp large-eye bream, squeaker amago. Sandroller; rough scad, tiger shovelnose catfish snubnose parasitic eel? Black bass soldierfish duckbill--Rattail Atlantic saury Blind shark California halibut; false trevally warty angler!</p>
|
||||
</div>
|
||||
<div class="bk-content">
|
||||
<p>Trahira giant wels cutlassfish snapper koi blackchin mummichog mustard eel rock bass whiff murray cod. Bigmouth buffalo ling cod giant wels, sauger pink salmon. Clingfish luderick treefish flatfish Cherubfish oldwife Indian mul gizzard shad hagfish zebra danio. Butterfly ray lizardfish ponyfish muskellunge Long-finned sand diver mullet swordfish limia ghost carp filefish.</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="bk-back">
|
||||
<p>In this nightmare vision of cats in revolt, fifteen-year-old Alex and his friends set out on a diabolical orgy of robbery, rape, torture and murder. Alex is jailed for his teenage delinquency and the State tries to reform him - but at what cost?</p>
|
||||
</div>
|
||||
<div class="bk-right"></div>
|
||||
<div class="bk-left">
|
||||
<h2>
|
||||
<span>Anthony Burghiss</span>
|
||||
<span>A Catwork Orange</span>
|
||||
</h2>
|
||||
</div>
|
||||
<div class="bk-top"></div>
|
||||
<div class="bk-bottom"></div>
|
||||
</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="bk-book book-2">
|
||||
<div class="bk-front">
|
||||
<div class="bk-cover">
|
||||
<h2>
|
||||
<span>The Catfather</span>
|
||||
<span>Mario Purrzo</span>
|
||||
</h2>
|
||||
</div>
|
||||
<div class="bk-cover-back"></div>
|
||||
</div>
|
||||
<div class="bk-page">
|
||||
<div class="bk-content">
|
||||
<p>Whale catfish leatherjacket deep sea anglerfish grenadier sawfish pompano dolphinfish carp large-eye bream, squeaker amago. Sandroller; rough scad, tiger shovelnose catfish snubnose parasitic eel? Black bass soldierfish duckbill--Rattail Atlantic saury Blind shark California halibut; false trevally warty angler!</p>
|
||||
</div>
|
||||
<div class="bk-content">
|
||||
<p>Trahira giant wels cutlassfish snapper koi blackchin mummichog mustard eel rock bass whiff murray cod. Bigmouth buffalo ling cod giant wels, sauger pink salmon. Clingfish luderick treefish flatfish Cherubfish oldwife Indian mul gizzard shad hagfish zebra danio. Butterfly ray lizardfish ponyfish muskellunge Long-finned sand diver mullet swordfish limia ghost carp filefish.</p>
|
||||
</div>
|
||||
<div class="bk-content bk-content-current">
|
||||
<p>Red snapper Kafue pike fangtooth humums's slipmouth, salmon cutlassfish; swallower European perch mola mola sunfish, threadfin bream. Billfish hog sucker trout-perch lenok orbicular velvetfish. Delta smelt striped bass, medusafish dragon goby starry flounder cuchia round whitefish northern anchovy spadefish merluccid hake cat shark Black pickerel. Pacific cod.</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="bk-back">
|
||||
<p>Tyrant, blackmailer, racketeer, murderer - his influence reaches every level of American society. Meet Cat Corleone, a friendly cat, a just cat, a reasonable cat. The deadliest lord of the Cata Nostra. The Catfather.</p>
|
||||
</div>
|
||||
<div class="bk-right"></div>
|
||||
<div class="bk-left">
|
||||
<h2>
|
||||
<span>The Catfather</span>
|
||||
<span>by Mario Purrzo</span>
|
||||
</h2>
|
||||
</div>
|
||||
<div class="bk-top"></div>
|
||||
<div class="bk-bottom"></div>
|
||||
</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="bk-book book-3">
|
||||
<div class="bk-front">
|
||||
<div class="bk-cover">
|
||||
<h2>
|
||||
<span>J.C. Salinger</span>
|
||||
<span>The Catcher in the Rye</span>
|
||||
</h2>
|
||||
</div>
|
||||
<div class="bk-cover-back"></div>
|
||||
</div>
|
||||
<div class="bk-page">
|
||||
<div class="bk-content bk-content-current">
|
||||
<p>Oceanic flyingfish spotted danio fingerfish leaffish, Billfish halibut Atlantic cod threadsail poacher slender mola. Swallower muskellunge, turbot needlefish yellow perch trout dhufish dwarf gourami false moray southern smelt cod dwarf gourami. Betta blue catfish bottlenose electric ray sablefish.</p>
|
||||
</div>
|
||||
<div class="bk-content">
|
||||
<p>Whale catfish leatherjacket deep sea anglerfish grenadier sawfish pompano dolphinfish carp large-eye bream, squeaker amago. Sandroller; rough scad, tiger shovelnose catfish snubnose parasitic eel? Black bass soldierfish duckbill--Rattail Atlantic saury Blind shark California halibut; false trevally warty angler!</p>
|
||||
</div>
|
||||
<div class="bk-content">
|
||||
<p>Trahira giant wels cutlassfish snapper koi blackchin mummichog mustard eel rock bass whiff murray cod. Bigmouth buffalo ling cod giant wels, sauger pink salmon. Clingfish luderick treefish flatfish Cherubfish oldwife Indian mul gizzard shad hagfish zebra danio. Butterfly ray lizardfish ponyfish muskellunge Long-finned sand diver mullet swordfish limia ghost carp filefish.</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="bk-back">
|
||||
<img src="images/3.png" alt="cat"/>
|
||||
<p>Holden Catfield is a seventeen-year-old dropout who has just been kicked out of his fourth school. Navigating his way through the challenges of growing up, Holden dissects the 'phony' aspects of society.</p>
|
||||
</div>
|
||||
<div class="bk-right"></div>
|
||||
<div class="bk-left">
|
||||
<h2>
|
||||
<span>J.C. Salinger</span>
|
||||
<span>The Catcher in the Rye</span>
|
||||
</h2>
|
||||
</div>
|
||||
<div class="bk-top"></div>
|
||||
<div class="bk-bottom"></div>
|
||||
</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="bk-book book-1">
|
||||
<div class="bk-front">
|
||||
<div class="bk-cover">
|
||||
<h2>
|
||||
<span>Anthony Burghiss</span>
|
||||
<span>A Catwork Orange</span>
|
||||
</h2>
|
||||
</div>
|
||||
<div class="bk-cover-back"></div>
|
||||
</div>
|
||||
<div class="bk-page">
|
||||
<div class="bk-content bk-content-current">
|
||||
<p>Red snapper Kafue pike fangtooth humums slipmouth, salmon cutlassfish; swallower European perch mola mola sunfish, threadfin bream. Billfish hog sucker trout-perch lenok orbicular velvetfish. Delta smelt striped bass, medusafish dragon goby starry flounder cuchia round whitefish northern anchovy spadefish merluccid hake cat shark Black pickerel. Pacific cod.</p>
|
||||
</div>
|
||||
<div class="bk-content">
|
||||
<p>Whale catfish leatherjacket deep sea anglerfish grenadier sawfish pompano dolphinfish carp large-eye bream, squeaker amago. Sandroller; rough scad, tiger shovelnose catfish snubnose parasitic eel? Black bass soldierfish duckbill--Rattail Atlantic saury Blind shark California halibut; false trevally warty angler!</p>
|
||||
</div>
|
||||
<div class="bk-content">
|
||||
<p>Trahira giant wels cutlassfish snapper koi blackchin mummichog mustard eel rock bass whiff murray cod. Bigmouth buffalo ling cod giant wels, sauger pink salmon. Clingfish luderick treefish flatfish Cherubfish oldwife Indian mul gizzard shad hagfish zebra danio. Butterfly ray lizardfish ponyfish muskellunge Long-finned sand diver mullet swordfish limia ghost carp filefish.</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="bk-back">
|
||||
<p>In this nightmare vision of cats in revolt, fifteen-year-old Alex and his friends set out on a diabolical orgy of robbery, rape, torture and murder. Alex is jailed for his teenage delinquency and the State tries to reform him - but at what cost?</p>
|
||||
</div>
|
||||
<div class="bk-right"></div>
|
||||
<div class="bk-left">
|
||||
<h2>
|
||||
<span>Anthony Burghiss</span>
|
||||
<span>A Catwork Orange</span>
|
||||
</h2>
|
||||
</div>
|
||||
<div class="bk-top"></div>
|
||||
<div class="bk-bottom"></div>
|
||||
</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="bk-book book-2">
|
||||
<div class="bk-front">
|
||||
<div class="bk-cover">
|
||||
<h2>
|
||||
<span>The Catfather</span>
|
||||
<span>Mario Purrzo</span>
|
||||
</h2>
|
||||
</div>
|
||||
<div class="bk-cover-back"></div>
|
||||
</div>
|
||||
<div class="bk-page">
|
||||
<div class="bk-content">
|
||||
<p>Whale catfish leatherjacket deep sea anglerfish grenadier sawfish pompano dolphinfish carp large-eye bream, squeaker amago. Sandroller; rough scad, tiger shovelnose catfish snubnose parasitic eel? Black bass soldierfish duckbill--Rattail Atlantic saury Blind shark California halibut; false trevally warty angler!</p>
|
||||
</div>
|
||||
<div class="bk-content">
|
||||
<p>Trahira giant wels cutlassfish snapper koi blackchin mummichog mustard eel rock bass whiff murray cod. Bigmouth buffalo ling cod giant wels, sauger pink salmon. Clingfish luderick treefish flatfish Cherubfish oldwife Indian mul gizzard shad hagfish zebra danio. Butterfly ray lizardfish ponyfish muskellunge Long-finned sand diver mullet swordfish limia ghost carp filefish.</p>
|
||||
</div>
|
||||
<div class="bk-content bk-content-current">
|
||||
<p>Red snapper Kafue pike fangtooth humums's slipmouth, salmon cutlassfish; swallower European perch mola mola sunfish, threadfin bream. Billfish hog sucker trout-perch lenok orbicular velvetfish. Delta smelt striped bass, medusafish dragon goby starry flounder cuchia round whitefish northern anchovy spadefish merluccid hake cat shark Black pickerel. Pacific cod.</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="bk-back">
|
||||
<p>Tyrant, blackmailer, racketeer, murderer - his influence reaches every level of American society. Meet Cat Corleone, a friendly cat, a just cat, a reasonable cat. The deadliest lord of the Cata Nostra. The Catfather.</p>
|
||||
</div>
|
||||
<div class="bk-right"></div>
|
||||
<div class="bk-left">
|
||||
<h2>
|
||||
<span>The Catfather</span>
|
||||
<span>by Mario Purrzo</span>
|
||||
</h2>
|
||||
</div>
|
||||
<div class="bk-top"></div>
|
||||
<div class="bk-bottom"></div>
|
||||
</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="bk-book book-3">
|
||||
<div class="bk-front">
|
||||
<div class="bk-cover">
|
||||
<h2>
|
||||
<span>J.C. Salinger</span>
|
||||
<span>The Catcher in the Rye</span>
|
||||
</h2>
|
||||
</div>
|
||||
<div class="bk-cover-back"></div>
|
||||
</div>
|
||||
<div class="bk-page">
|
||||
<div class="bk-content bk-content-current">
|
||||
<p>Oceanic flyingfish spotted danio fingerfish leaffish, Billfish halibut Atlantic cod threadsail poacher slender mola. Swallower muskellunge, turbot needlefish yellow perch trout dhufish dwarf gourami false moray southern smelt cod dwarf gourami. Betta blue catfish bottlenose electric ray sablefish.</p>
|
||||
</div>
|
||||
<div class="bk-content">
|
||||
<p>Whale catfish leatherjacket deep sea anglerfish grenadier sawfish pompano dolphinfish carp large-eye bream, squeaker amago. Sandroller; rough scad, tiger shovelnose catfish snubnose parasitic eel? Black bass soldierfish duckbill--Rattail Atlantic saury Blind shark California halibut; false trevally warty angler!</p>
|
||||
</div>
|
||||
<div class="bk-content">
|
||||
<p>Trahira giant wels cutlassfish snapper koi blackchin mummichog mustard eel rock bass whiff murray cod. Bigmouth buffalo ling cod giant wels, sauger pink salmon. Clingfish luderick treefish flatfish Cherubfish oldwife Indian mul gizzard shad hagfish zebra danio. Butterfly ray lizardfish ponyfish muskellunge Long-finned sand diver mullet swordfish limia ghost carp filefish.</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="bk-back">
|
||||
<img src="images/3.png" alt="cat"/>
|
||||
<p>Holden Catfield is a seventeen-year-old dropout who has just been kicked out of his fourth school. Navigating his way through the challenges of growing up, Holden dissects the 'phony' aspects of society.</p>
|
||||
</div>
|
||||
<div class="bk-right"></div>
|
||||
<div class="bk-left">
|
||||
<h2>
|
||||
<span>J.C. Salinger</span>
|
||||
<span>The Catcher in the Rye</span>
|
||||
</h2>
|
||||
</div>
|
||||
<div class="bk-top"></div>
|
||||
<div class="bk-bottom"></div>
|
||||
</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="bk-book book-1">
|
||||
<div class="bk-front">
|
||||
<div class="bk-cover">
|
||||
<h2>
|
||||
<span>Anthony Burghiss</span>
|
||||
<span>A Catwork Orange</span>
|
||||
</h2>
|
||||
</div>
|
||||
<div class="bk-cover-back"></div>
|
||||
</div>
|
||||
<div class="bk-page">
|
||||
<div class="bk-content bk-content-current">
|
||||
<p>Red snapper Kafue pike fangtooth humums slipmouth, salmon cutlassfish; swallower European perch mola mola sunfish, threadfin bream. Billfish hog sucker trout-perch lenok orbicular velvetfish. Delta smelt striped bass, medusafish dragon goby starry flounder cuchia round whitefish northern anchovy spadefish merluccid hake cat shark Black pickerel. Pacific cod.</p>
|
||||
</div>
|
||||
<div class="bk-content">
|
||||
<p>Whale catfish leatherjacket deep sea anglerfish grenadier sawfish pompano dolphinfish carp large-eye bream, squeaker amago. Sandroller; rough scad, tiger shovelnose catfish snubnose parasitic eel? Black bass soldierfish duckbill--Rattail Atlantic saury Blind shark California halibut; false trevally warty angler!</p>
|
||||
</div>
|
||||
<div class="bk-content">
|
||||
<p>Trahira giant wels cutlassfish snapper koi blackchin mummichog mustard eel rock bass whiff murray cod. Bigmouth buffalo ling cod giant wels, sauger pink salmon. Clingfish luderick treefish flatfish Cherubfish oldwife Indian mul gizzard shad hagfish zebra danio. Butterfly ray lizardfish ponyfish muskellunge Long-finned sand diver mullet swordfish limia ghost carp filefish.</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="bk-back">
|
||||
<p>In this nightmare vision of cats in revolt, fifteen-year-old Alex and his friends set out on a diabolical orgy of robbery, rape, torture and murder. Alex is jailed for his teenage delinquency and the State tries to reform him - but at what cost?</p>
|
||||
</div>
|
||||
<div class="bk-right"></div>
|
||||
<div class="bk-left">
|
||||
<h2>
|
||||
<span>Anthony Burghiss</span>
|
||||
<span>A Catwork Orange</span>
|
||||
</h2>
|
||||
</div>
|
||||
<div class="bk-top"></div>
|
||||
<div class="bk-bottom"></div>
|
||||
</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="bk-book book-2">
|
||||
<div class="bk-front">
|
||||
<div class="bk-cover">
|
||||
<h2>
|
||||
<span>The Catfather</span>
|
||||
<span>Mario Purrzo</span>
|
||||
</h2>
|
||||
</div>
|
||||
<div class="bk-cover-back"></div>
|
||||
</div>
|
||||
<div class="bk-page">
|
||||
<div class="bk-content">
|
||||
<p>Whale catfish leatherjacket deep sea anglerfish grenadier sawfish pompano dolphinfish carp large-eye bream, squeaker amago. Sandroller; rough scad, tiger shovelnose catfish snubnose parasitic eel? Black bass soldierfish duckbill--Rattail Atlantic saury Blind shark California halibut; false trevally warty angler!</p>
|
||||
</div>
|
||||
<div class="bk-content">
|
||||
<p>Trahira giant wels cutlassfish snapper koi blackchin mummichog mustard eel rock bass whiff murray cod. Bigmouth buffalo ling cod giant wels, sauger pink salmon. Clingfish luderick treefish flatfish Cherubfish oldwife Indian mul gizzard shad hagfish zebra danio. Butterfly ray lizardfish ponyfish muskellunge Long-finned sand diver mullet swordfish limia ghost carp filefish.</p>
|
||||
</div>
|
||||
<div class="bk-content bk-content-current">
|
||||
<p>Red snapper Kafue pike fangtooth humums's slipmouth, salmon cutlassfish; swallower European perch mola mola sunfish, threadfin bream. Billfish hog sucker trout-perch lenok orbicular velvetfish. Delta smelt striped bass, medusafish dragon goby starry flounder cuchia round whitefish northern anchovy spadefish merluccid hake cat shark Black pickerel. Pacific cod.</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="bk-back">
|
||||
<p>Tyrant, blackmailer, racketeer, murderer - his influence reaches every level of American society. Meet Cat Corleone, a friendly cat, a just cat, a reasonable cat. The deadliest lord of the Cata Nostra. The Catfather.</p>
|
||||
</div>
|
||||
<div class="bk-right"></div>
|
||||
<div class="bk-left">
|
||||
<h2>
|
||||
<span>The Catfather</span>
|
||||
<span>by Mario Purrzo</span>
|
||||
</h2>
|
||||
</div>
|
||||
<div class="bk-top"></div>
|
||||
<div class="bk-bottom"></div>
|
||||
</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="bk-book book-3">
|
||||
<div class="bk-front">
|
||||
<div class="bk-cover">
|
||||
<h2>
|
||||
<span>J.C. Salinger</span>
|
||||
<span>The Catcher in the Rye</span>
|
||||
</h2>
|
||||
</div>
|
||||
<div class="bk-cover-back"></div>
|
||||
</div>
|
||||
<div class="bk-page">
|
||||
<div class="bk-content bk-content-current">
|
||||
<p>Oceanic flyingfish spotted danio fingerfish leaffish, Billfish halibut Atlantic cod threadsail poacher slender mola. Swallower muskellunge, turbot needlefish yellow perch trout dhufish dwarf gourami false moray southern smelt cod dwarf gourami. Betta blue catfish bottlenose electric ray sablefish.</p>
|
||||
</div>
|
||||
<div class="bk-content">
|
||||
<p>Whale catfish leatherjacket deep sea anglerfish grenadier sawfish pompano dolphinfish carp large-eye bream, squeaker amago. Sandroller; rough scad, tiger shovelnose catfish snubnose parasitic eel? Black bass soldierfish duckbill--Rattail Atlantic saury Blind shark California halibut; false trevally warty angler!</p>
|
||||
</div>
|
||||
<div class="bk-content">
|
||||
<p>Trahira giant wels cutlassfish snapper koi blackchin mummichog mustard eel rock bass whiff murray cod. Bigmouth buffalo ling cod giant wels, sauger pink salmon. Clingfish luderick treefish flatfish Cherubfish oldwife Indian mul gizzard shad hagfish zebra danio. Butterfly ray lizardfish ponyfish muskellunge Long-finned sand diver mullet swordfish limia ghost carp filefish.</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="bk-back">
|
||||
<img src="images/3.png" alt="cat"/>
|
||||
<p>Holden Catfield is a seventeen-year-old dropout who has just been kicked out of his fourth school. Navigating his way through the challenges of growing up, Holden dissects the 'phony' aspects of society.</p>
|
||||
</div>
|
||||
<div class="bk-right"></div>
|
||||
<div class="bk-left">
|
||||
<h2>
|
||||
<span>J.C. Salinger</span>
|
||||
<span>The Catcher in the Rye</span>
|
||||
</h2>
|
||||
</div>
|
||||
<div class="bk-top"></div>
|
||||
<div class="bk-bottom"></div>
|
||||
</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="bk-book book-1">
|
||||
<div class="bk-front">
|
||||
<div class="bk-cover">
|
||||
<h2>
|
||||
<span>Anthony Burghiss</span>
|
||||
<span>A Catwork Orange</span>
|
||||
</h2>
|
||||
</div>
|
||||
<div class="bk-cover-back"></div>
|
||||
</div>
|
||||
<div class="bk-page">
|
||||
<div class="bk-content bk-content-current">
|
||||
<p>Red snapper Kafue pike fangtooth humums slipmouth, salmon cutlassfish; swallower European perch mola mola sunfish, threadfin bream. Billfish hog sucker trout-perch lenok orbicular velvetfish. Delta smelt striped bass, medusafish dragon goby starry flounder cuchia round whitefish northern anchovy spadefish merluccid hake cat shark Black pickerel. Pacific cod.</p>
|
||||
</div>
|
||||
<div class="bk-content">
|
||||
<p>Whale catfish leatherjacket deep sea anglerfish grenadier sawfish pompano dolphinfish carp large-eye bream, squeaker amago. Sandroller; rough scad, tiger shovelnose catfish snubnose parasitic eel? Black bass soldierfish duckbill--Rattail Atlantic saury Blind shark California halibut; false trevally warty angler!</p>
|
||||
</div>
|
||||
<div class="bk-content">
|
||||
<p>Trahira giant wels cutlassfish snapper koi blackchin mummichog mustard eel rock bass whiff murray cod. Bigmouth buffalo ling cod giant wels, sauger pink salmon. Clingfish luderick treefish flatfish Cherubfish oldwife Indian mul gizzard shad hagfish zebra danio. Butterfly ray lizardfish ponyfish muskellunge Long-finned sand diver mullet swordfish limia ghost carp filefish.</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="bk-back">
|
||||
<p>In this nightmare vision of cats in revolt, fifteen-year-old Alex and his friends set out on a diabolical orgy of robbery, rape, torture and murder. Alex is jailed for his teenage delinquency and the State tries to reform him - but at what cost?</p>
|
||||
</div>
|
||||
<div class="bk-right"></div>
|
||||
<div class="bk-left">
|
||||
<h2>
|
||||
<span>Anthony Burghiss</span>
|
||||
<span>A Catwork Orange</span>
|
||||
</h2>
|
||||
</div>
|
||||
<div class="bk-top"></div>
|
||||
<div class="bk-bottom"></div>
|
||||
</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="bk-book book-2">
|
||||
<div class="bk-front">
|
||||
<div class="bk-cover">
|
||||
<h2>
|
||||
<span>The Catfather</span>
|
||||
<span>Mario Purrzo</span>
|
||||
</h2>
|
||||
</div>
|
||||
<div class="bk-cover-back"></div>
|
||||
</div>
|
||||
<div class="bk-page">
|
||||
<div class="bk-content">
|
||||
<p>Whale catfish leatherjacket deep sea anglerfish grenadier sawfish pompano dolphinfish carp large-eye bream, squeaker amago. Sandroller; rough scad, tiger shovelnose catfish snubnose parasitic eel? Black bass soldierfish duckbill--Rattail Atlantic saury Blind shark California halibut; false trevally warty angler!</p>
|
||||
</div>
|
||||
<div class="bk-content">
|
||||
<p>Trahira giant wels cutlassfish snapper koi blackchin mummichog mustard eel rock bass whiff murray cod. Bigmouth buffalo ling cod giant wels, sauger pink salmon. Clingfish luderick treefish flatfish Cherubfish oldwife Indian mul gizzard shad hagfish zebra danio. Butterfly ray lizardfish ponyfish muskellunge Long-finned sand diver mullet swordfish limia ghost carp filefish.</p>
|
||||
</div>
|
||||
<div class="bk-content bk-content-current">
|
||||
<p>Red snapper Kafue pike fangtooth humums's slipmouth, salmon cutlassfish; swallower European perch mola mola sunfish, threadfin bream. Billfish hog sucker trout-perch lenok orbicular velvetfish. Delta smelt striped bass, medusafish dragon goby starry flounder cuchia round whitefish northern anchovy spadefish merluccid hake cat shark Black pickerel. Pacific cod.</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="bk-back">
|
||||
<p>Tyrant, blackmailer, racketeer, murderer - his influence reaches every level of American society. Meet Cat Corleone, a friendly cat, a just cat, a reasonable cat. The deadliest lord of the Cata Nostra. The Catfather.</p>
|
||||
</div>
|
||||
<div class="bk-right"></div>
|
||||
<div class="bk-left">
|
||||
<h2>
|
||||
<span>The Catfather</span>
|
||||
<span>by Mario Purrzo</span>
|
||||
</h2>
|
||||
</div>
|
||||
<div class="bk-top"></div>
|
||||
<div class="bk-bottom"></div>
|
||||
</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="bk-book book-3">
|
||||
<div class="bk-front">
|
||||
<div class="bk-cover">
|
||||
<h2>
|
||||
<span>J.C. Salinger</span>
|
||||
<span>The Catcher in the Rye</span>
|
||||
</h2>
|
||||
</div>
|
||||
<div class="bk-cover-back"></div>
|
||||
</div>
|
||||
<div class="bk-page">
|
||||
<div class="bk-content bk-content-current">
|
||||
<p>Oceanic flyingfish spotted danio fingerfish leaffish, Billfish halibut Atlantic cod threadsail poacher slender mola. Swallower muskellunge, turbot needlefish yellow perch trout dhufish dwarf gourami false moray southern smelt cod dwarf gourami. Betta blue catfish bottlenose electric ray sablefish.</p>
|
||||
</div>
|
||||
<div class="bk-content">
|
||||
<p>Whale catfish leatherjacket deep sea anglerfish grenadier sawfish pompano dolphinfish carp large-eye bream, squeaker amago. Sandroller; rough scad, tiger shovelnose catfish snubnose parasitic eel? Black bass soldierfish duckbill--Rattail Atlantic saury Blind shark California halibut; false trevally warty angler!</p>
|
||||
</div>
|
||||
<div class="bk-content">
|
||||
<p>Trahira giant wels cutlassfish snapper koi blackchin mummichog mustard eel rock bass whiff murray cod. Bigmouth buffalo ling cod giant wels, sauger pink salmon. Clingfish luderick treefish flatfish Cherubfish oldwife Indian mul gizzard shad hagfish zebra danio. Butterfly ray lizardfish ponyfish muskellunge Long-finned sand diver mullet swordfish limia ghost carp filefish.</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="bk-back">
|
||||
<img src="images/3.png" alt="cat"/>
|
||||
<p>Holden Catfield is a seventeen-year-old dropout who has just been kicked out of his fourth school. Navigating his way through the challenges of growing up, Holden dissects the 'phony' aspects of society.</p>
|
||||
</div>
|
||||
<div class="bk-right"></div>
|
||||
<div class="bk-left">
|
||||
<h2>
|
||||
<span>J.C. Salinger</span>
|
||||
<span>The Catcher in the Rye</span>
|
||||
</h2>
|
||||
</div>
|
||||
<div class="bk-top"></div>
|
||||
<div class="bk-bottom"></div>
|
||||
</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="bk-book book-1">
|
||||
<div class="bk-front">
|
||||
<div class="bk-cover">
|
||||
<h2>
|
||||
<span>Anthony Burghiss</span>
|
||||
<span>A Catwork Orange</span>
|
||||
</h2>
|
||||
</div>
|
||||
<div class="bk-cover-back"></div>
|
||||
</div>
|
||||
<div class="bk-page">
|
||||
<div class="bk-content bk-content-current">
|
||||
<p>Red snapper Kafue pike fangtooth humums slipmouth, salmon cutlassfish; swallower European perch mola mola sunfish, threadfin bream. Billfish hog sucker trout-perch lenok orbicular velvetfish. Delta smelt striped bass, medusafish dragon goby starry flounder cuchia round whitefish northern anchovy spadefish merluccid hake cat shark Black pickerel. Pacific cod.</p>
|
||||
</div>
|
||||
<div class="bk-content">
|
||||
<p>Whale catfish leatherjacket deep sea anglerfish grenadier sawfish pompano dolphinfish carp large-eye bream, squeaker amago. Sandroller; rough scad, tiger shovelnose catfish snubnose parasitic eel? Black bass soldierfish duckbill--Rattail Atlantic saury Blind shark California halibut; false trevally warty angler!</p>
|
||||
</div>
|
||||
<div class="bk-content">
|
||||
<p>Trahira giant wels cutlassfish snapper koi blackchin mummichog mustard eel rock bass whiff murray cod. Bigmouth buffalo ling cod giant wels, sauger pink salmon. Clingfish luderick treefish flatfish Cherubfish oldwife Indian mul gizzard shad hagfish zebra danio. Butterfly ray lizardfish ponyfish muskellunge Long-finned sand diver mullet swordfish limia ghost carp filefish.</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="bk-back">
|
||||
<p>In this nightmare vision of cats in revolt, fifteen-year-old Alex and his friends set out on a diabolical orgy of robbery, rape, torture and murder. Alex is jailed for his teenage delinquency and the State tries to reform him - but at what cost?</p>
|
||||
</div>
|
||||
<div class="bk-right"></div>
|
||||
<div class="bk-left">
|
||||
<h2>
|
||||
<span>Anthony Burghiss</span>
|
||||
<span>A Catwork Orange</span>
|
||||
</h2>
|
||||
</div>
|
||||
<div class="bk-top"></div>
|
||||
<div class="bk-bottom"></div>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="bookshelf"></div>
|
||||
</div>
|
||||
</div><!-- /container -->
|
||||
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
|
||||
<script src="js/books2.js"></script>
|
||||
<script>
|
||||
$(function() {
|
||||
|
||||
Books.init();
|
||||
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,87 @@
|
||||
var Books = (function() {
|
||||
|
||||
var $books = $( '#bk-list > li > div.bk-book' ), booksCount = $books.length;
|
||||
|
||||
function init() {
|
||||
|
||||
$books.each( function() {
|
||||
|
||||
var $book = $( this ),
|
||||
$other = $books.not( $book ),
|
||||
$parent = $book.parent(),
|
||||
$page = $book.children( 'div.bk-page' ),
|
||||
$bookview = $parent.find( 'button.bk-bookview' ),
|
||||
$content = $page.children( 'div.bk-content' ), current = 0;
|
||||
|
||||
$parent.find( 'button.bk-bookback' ).on( 'click', function() {
|
||||
|
||||
$bookview.removeClass( 'bk-active' );
|
||||
|
||||
if( $book.data( 'flip' ) ) {
|
||||
|
||||
$book.data( { opened : false, flip : false } ).removeClass( 'bk-viewback' ).addClass( 'bk-bookdefault' );
|
||||
|
||||
}
|
||||
else {
|
||||
|
||||
$book.data( { opened : false, flip : true } ).removeClass( 'bk-viewinside bk-bookdefault' ).addClass( 'bk-viewback' );
|
||||
|
||||
}
|
||||
|
||||
} );
|
||||
|
||||
$bookview.on( 'click', function() {
|
||||
|
||||
var $this = $( this );
|
||||
|
||||
$other.data( 'opened', false ).removeClass( 'bk-viewinside' ).parent().css( 'z-index', 0 ).find( 'button.bk-bookview' ).removeClass( 'bk-active' );
|
||||
if( !$other.hasClass( 'bk-viewback' ) ) {
|
||||
$other.addClass( 'bk-bookdefault' );
|
||||
}
|
||||
|
||||
if( $book.data( 'opened' ) ) {
|
||||
$this.removeClass( 'bk-active' );
|
||||
$book.data( { opened : false, flip : false } ).removeClass( 'bk-viewinside' ).addClass( 'bk-bookdefault' );
|
||||
}
|
||||
else {
|
||||
$this.addClass( 'bk-active' );
|
||||
$book.data( { opened : true, flip : false } ).removeClass( 'bk-viewback bk-bookdefault' ).addClass( 'bk-viewinside' );
|
||||
$parent.css( 'z-index', booksCount );
|
||||
current = 0;
|
||||
$content.removeClass( 'bk-content-current' ).eq( current ).addClass( 'bk-content-current' );
|
||||
}
|
||||
|
||||
} );
|
||||
|
||||
if( $content.length > 1 ) {
|
||||
|
||||
var $navPrev = $( '<span class="bk-page-prev"><</span>' ),
|
||||
$navNext = $( '<span class="bk-page-next">></span>' );
|
||||
|
||||
$page.append( $( '<nav></nav>' ).append( $navPrev, $navNext ) );
|
||||
|
||||
$navPrev.on( 'click', function() {
|
||||
if( current > 0 ) {
|
||||
--current;
|
||||
$content.removeClass( 'bk-content-current' ).eq( current ).addClass( 'bk-content-current' );
|
||||
}
|
||||
return false;
|
||||
} );
|
||||
|
||||
$navNext.on( 'click', function() {
|
||||
if( current < $content.length - 1 ) {
|
||||
++current;
|
||||
$content.removeClass( 'bk-content-current' ).eq( current ).addClass( 'bk-content-current' );
|
||||
}
|
||||
return false;
|
||||
} );
|
||||
|
||||
}
|
||||
|
||||
} );
|
||||
|
||||
}
|
||||
|
||||
return { init : init };
|
||||
|
||||
})();
|
||||
@@ -0,0 +1,98 @@
|
||||
var Books = (function() {
|
||||
|
||||
var transEndEventNames = {
|
||||
'WebkitTransition' : 'webkitTransitionEnd',
|
||||
'MozTransition' : 'transitionend',
|
||||
'OTransition' : 'oTransitionEnd',
|
||||
'msTransition' : 'MSTransitionEnd',
|
||||
'transition' : 'transitionend'
|
||||
},
|
||||
transEndEventName = transEndEventNames[ Modernizr.prefixed( 'transition' ) ],
|
||||
$books = $( '#bk-list > li > div.bk-book' ), booksCount = $books.length, currentbook = -1;
|
||||
|
||||
function init() {
|
||||
|
||||
$books.each( function( i ) {
|
||||
|
||||
var $book = $( this ),
|
||||
$other = $books.not( $book ),
|
||||
$parent = $book.parent(),
|
||||
$page = $book.children( 'div.bk-page' ),
|
||||
$content = $page.children( 'div.bk-content' ), current = 0;
|
||||
|
||||
if( i < booksCount / 2 ) {
|
||||
$parent.css( 'z-index', i ).data( 'stackval', i );
|
||||
}
|
||||
else {
|
||||
$parent.css( 'z-index', booksCount - 1 - i ).data( 'stackval', booksCount - 1 - i );
|
||||
}
|
||||
|
||||
$book.on( 'click', function() {
|
||||
|
||||
if( currentbook !== -1 && currentbook !== $parent.index() ) {
|
||||
closeCurrent();
|
||||
}
|
||||
|
||||
if( $book.data( 'opened' ) ) {
|
||||
$book.data( 'opened', false ).removeClass( 'bk-viewinside' ).on( transEndEventName, function() {
|
||||
$( this ).off( transEndEventName ).removeClass( 'bk-outside' );
|
||||
$parent.css( 'z-index', $parent.data( 'stackval' ) );
|
||||
currentbook = -1;
|
||||
} );
|
||||
}
|
||||
else {
|
||||
$book.data( 'opened', true ).addClass( 'bk-outside' ).on( transEndEventName, function() {
|
||||
$( this ).off( transEndEventName ).addClass( 'bk-viewinside' );
|
||||
$parent.css( 'z-index', booksCount );
|
||||
currentbook = $parent.index();
|
||||
} );
|
||||
current = 0;
|
||||
$content.removeClass( 'bk-content-current' ).eq( current ).addClass( 'bk-content-current' );
|
||||
}
|
||||
|
||||
} );
|
||||
|
||||
if( $content.length > 1 ) {
|
||||
|
||||
var $navPrev = $( '<span class="bk-page-prev"><</span>' ),
|
||||
$navNext = $( '<span class="bk-page-next">></span>' );
|
||||
|
||||
$page.append( $( '<nav></nav>' ).append( $navPrev, $navNext ) );
|
||||
|
||||
$navPrev.on( 'click', function() {
|
||||
if( current > 0 ) {
|
||||
--current;
|
||||
$content.removeClass( 'bk-content-current' ).eq( current ).addClass( 'bk-content-current' );
|
||||
}
|
||||
return false;
|
||||
} );
|
||||
|
||||
$navNext.on( 'click', function() {
|
||||
if( current < $content.length - 1 ) {
|
||||
++current;
|
||||
$content.removeClass( 'bk-content-current' ).eq( current ).addClass( 'bk-content-current' );
|
||||
}
|
||||
return false;
|
||||
} );
|
||||
|
||||
}
|
||||
|
||||
} );
|
||||
|
||||
}
|
||||
|
||||
function closeCurrent() {
|
||||
|
||||
var $book = $books.eq( currentbook ),
|
||||
$parent = $book.parent();
|
||||
|
||||
$book.data( 'opened', false ).removeClass( 'bk-viewinside' ).on( transEndEventName, function(e) {
|
||||
$( this ).off( transEndEventName ).removeClass( 'bk-outside' );
|
||||
$parent.css( 'z-index', $parent.data( 'stackval' ) );
|
||||
} );
|
||||
|
||||
}
|
||||
|
||||
return { init : init };
|
||||
|
||||
})();
|
||||
File diff suppressed because one or more lines are too long
Reference in New Issue
Block a user