﻿body{ margin: 0;padding: 0;}
#flipbook{ margin: 100px auto;}
#flipbook div{ text-align: center;}
#flipbook .pic img{ margin-top: 20px;}
#flipbook .page{ background-color: white;-webkit-box-shadow:0 0 20px rgba(0,0,0,0.2);
	-moz-box-shadow:0 0 20px rgba(0,0,0,0.2);
	-ms-box-shadow:0 0 20px rgba(0,0,0,0.2);
	-o-box-shadow:0 0 20px rgba(0,0,0,0.2);
	box-shadow:0 0 20px rgba(0,0,0,0.2);}
.shadow{
	-webkit-transition: -webkit-box-shadow 0.5s;
	-moz-transition: -moz-box-shadow 0.5s;
	-o-transition: -webkit-box-shadow 0.5s;
	-ms-transition: -ms-box-shadow 0.5s;

	-webkit-box-shadow:0 0 20px #ccc;
	-moz-box-shadow:0 0 20px #ccc;
	-o-box-shadow:0 0 20px #ccc;
	-ms-box-shadow:0 0 20px #ccc;
	box-shadow:0 0 20px #ccc;
}
#flipbook .even{
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	background-image:url(/pics/right-border.png);
	background-position:right top;
	background-repeat: repeat-y;
}

#flipbook .odd{
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	background-image:url(/pics/left-border.png);
	background-position:left top;
	background-repeat: repeat-y;
}
#flipbook .ct{ background-color: #eee;}

.animated{
	-webkit-transition:margin-left 0.2s ease-in-out;
	-moz-transition:margin-left 0.2s ease-in-out;
	-o-transition:margin-left 0.2s ease-in-out;
	-ms-transition:margin-left 0.2s ease-in-out;
	transition:margin-left 0.2s ease-in-out;
}

.btns{ width: 400px;margin: 10px auto;}
.btns a{ display: block;width: 120px;height: 30px;line-height: 30px;text-align: center;text-decoration: none;color: white;background-color: #666;border-radius: 8px;float: left;}
.btns a:hover{ background-color: #444;}
.turnprev a{ margin-right: 20px;}
.turnnext a{ margin-left: 20px;}
