複数のjQueryの実装に手こずってます

http://ascii.jp/elem/000/000/914/914507/を見ながら実装し、１つのコンテンツ内でのhtmlは以下のようになりました

lang
1    <div id="section-2" class="inner gray">
2        <div id="content-2" class="perspective">
3            <div class="card">
4				<div class="box">
5					<center><img src="images/ric1.gif"></center>
6				</div>
7            </div>
8        </div>
9    </div>

ここにcrossfade.scroll.jqueryも実装しようとすると以下のようになります

lang
1
2        <div id="content-1" class="perspective">
3            <div class="card">
4				<div class="box">
5					<center><div class="banner js-example-1" data-crossfade-start="images/ser.jpg" data-crossfade-end="images/siro.jpg"></div></center>
6				</div>
7            </div>
8        </div>
9    </div>

が、box内の部分がcrossfade.scroll.jqueryを用いて表現しようとすると全く表示されません
具体的に、クラスcardまでは同様に領域を取るのですが、boxが０＊０になってしまいます

よろしくおねがいします

以下該当部分のＣＳＳ

lang
1.perspective {
2    -webkit-perspective: 1000px;
3       -moz-perspective: 1000px;
4           -ms-perspective: 1000px;
5         -o-perspective: 1000px;
6            perspective: 1000px;
7    -webkit-transform-style: preserve-3d;
8       -moz-transform-style: preserve-3d;
9        -ms-transform-style: preserve-3d;
10         -o-transform-style: preserve-3d;
11            transform-style: preserve-3d;
12
13.card {
14    position: relative;
15    display: block;
16    margin: 0;
17    
18    width: 100%;
19    height: 100%;
20    border: 10px solid #FFF;
21    -webkit-transform-origin: 5% 100%;
22       -moz-transform-origin: 5% 100%;
23        -ms-transform-origin: 5% 100%;
24         -o-transform-origin: 5% 100%;
25            transform-origin: 5% 100%;
26    -webkit-transform: rotateX(90deg);
27       -moz-transform: rotateX(90deg);
28        -ms-transform: rotateX(90deg);
29         -o-transform: rotateX(90deg);
30            transform: rotateX(90deg);
31}
32.card .box {
33	display: block;
34	position: absolute;
35	bottom: 0;
36	height: auto;
37	
38	background: #000000;
39	}
40
41.card .box .banner {       /* imgタグ場合は.card .box img */
42	clear: both;
43	position: relative;
44	width: 60%;
45	bottom: 0;
46    height: auto;
47}