/* Basic sample */

body{
	overflow:visible;
	background-image:url(../images/bg.jpg);
	margin:0;
	padding:0;
    border: solid 0px red;

}
body.main {
    background: url(../images/livre.png) no-repeat;
    background-size:100% 100%;
    width:1018px;
    height:563px;
    border:solid 0 #000;
    position:relative;
    margin:0 auto;

}

p, h1, h2, h3 {
    margin:0;
    padding:0;
}
li {
    list-style: none;
}

a { text-decoration: none; color: #333; }
a.tab { text-decoration: none; color: #222; }
a.noPoint { text-decoration: none; color: #222; cursor: default; }


p.aslider {
    font-family: 'Calibri Light';
    font-size: 11px;
    color: #fff;
    position: absolute;
}
p.aslider2 {
    font-family: 'Calibri Light';
    font-size: 10px;
    color: #fff;
    position: absolute;

}

a.lang {
    color:#ccc;
    font-size:13px;
    padding:5px;
    text-decoration:none;
    position:relative;
    vertical-align:bottom;
    border: solid 0 red;
}

a.langSel {
    color: #fff;
    font-size:16px;
    padding:5px;
    text-decoration:none;
    font-weight: bold;
}

a.menuTop {
    color:#ccc; 
    font-size:13px; 
    padding:5px; 
    text-decoration:none; 
    position:relative;
    vertical-align:bottom;
    border: solid 0 red;

    -webkit-transition: -webkit-transform ease-in-out 250ms;
    -moz-transition: -moz-transform ease-in-out 250ms;
    -ms-transition: -ms-transform ease-in-out 250ms;
    -o-transition: -o-transform ease-in-out 250ms;
    transition: transform ease-in-out 250ms;

}
a.menuTop:hover {
    font-weight: bold;
    -webkit-transform:scale3d(1.5, 1.5, 1) translate(0px,10px);
    -moz-transform:scale3d(1.5, 1.5, 1) translate(0px,10px);
    -o-transform:scale3d(1.5, 1.5, 1) translate(0px,10px);
    -ms-transform:scale3d(1.5, 1.5, 1) translate(0px,10px);
    transform:scale3d(1.5, 1.5, 1) translate(0px,10px);

}

a.menuTopSel {
    color: #fff; 
    font-size:16px; 
    padding:5px; 
    text-decoration:none;


}


span.somaire{
    margin: 0px;
    padding: 0px;
    font-size: 14px;
    font-family: "Brush Script Std";
    text-align: left;
    color: #454636;
}

h1.somaire{
    margin: 0px;
    padding: 0px;
    padding-bottom: 5px;
    font-size: 24px;
    font-family: 'Marck Script', cursive;
    font-weight: bold;
    text-align: center;
    color: #454636;
}

h2.somaire{
    margin: 0px;
    padding: 0px;
    font-size: 20px;
    font-weight: bold;
    font-family: 'Marck Script', cursive;
    padding-top: 5px;
    margin-left: 20px;
    text-align: left;
    width: 300px;
    border: 1px;
    color: #454636;
}

h3.somaire{
    margin: 0px;
    padding: 0px;
    font-size: 16px;
    font-weight: normal;
    font-family: 'Marck Script', cursive;
    margin-left: 20px;
    text-align: left;
    width: 300px;
    border: 1px;
    color: #454636;
}

.titre {
    font-size: 30px;
    font-weight: bold;
    font-family: 'Dancing Script', cursive;
    color: #35362a;
    line-height: 38px;
}

.stitre {
    font-size: 26px;
    font-weight: bold;
    font-family: 'Dancing Script', cursive;
    color: #35362a;
    line-height: 30px;
}

.sstitre {
    font-size: 20px;
    font-weight: bold;
    font-family: 'Marck Script', cursive;
    color: #454636;
    text-align: left;
    line-height: 26px;
}

.texte {
    font-size: 18px;
    line-height: 20px;
    font-weight: normal;
    font-family: 'Marck Script', cursive;
    color: #454636;
    text-align: left;
}
.petit {
    font-size: 16px;
    line-height: 18px;
    font-weight: normal;
    font-family: 'Marck Script', cursive;
    color: #454636;
    text-align: left;
}

#trace {color: white;}
div.menu {
    color: #fff;
    font-family: Calibri, serif;
    text-align : center; 
    border: solid 0px #fff;
    position:absolute;
    line-height:30px;
    right:0;
    top:0;
}
div.lang {
    color: #fff;
    font-family: Calibri, serif;
    text-align : center;
    border: solid 0px #fff;
    position:absolute;
    right:20px;
    bottom:-20px;
}
div.titreSite {
    margin: 20px auto;
    border:solid 0px #ff6a00;
    position:relative;
    max-width:1045px;
}

p.titreSite, a.titreSite {
    color:white;
    font-family: 'Dancing Script', cursive;
    font-size:60px;
    line-height:60px;
    font-weight:bold;
}

p.sousTitreSite, a.sousTitreSite {
    color:#ccc;
    font-family: 'Dancing Script', cursive;
    font-size:40px;
    font-weight:bold;
}

p.slogan {
    color:white;
    font-size:50px;
    font-weight:normal;
    padding-top:30px; 
    text-align:center;
    font-style:normal;
    font-family: 'Kaushan Script', cursive;
}



#fullImg {
    text-align:center; 
    position:absolute; 
    z-index:900;
    display:none;
    background-image:url(../images/blackTrans85pc.png);
}

#imgFull {
    position:relative; 
    display:inline-block;
    vertical-align:middle;
    cursor:none;
}

#curseur {
    position:absolute;
    display:none;
    width:32px;
    z-index:901;
    cursor:none;


}
.main {
    overflow:hidden;
    background: url(../images/livre.jpg) no-repeat;
    background-size:100% 100%;
	width:1017px;
	height:555px;
    border:solid 0 #000;
    position:relative;
    margin:0 auto;
}
.main2 {
    width:1017px;
    height:555px;
    overflow:visible;
    position:relative;
    margin:0 auto;
    border:solid 0px #000;
}

div.tab{
    background-size:100% 100%;
    width:28px;
    height:82px;
    padding-top: 35px;
    border:solid 0 #000;
    position:absolute;
    cursor: pointer;
}
div.tab-2{
    background-size:100% 100%;
    width:28px;
    height:67px;
    padding-top: 50px;
    border:solid 0 #000;
    position:absolute;
    cursor: pointer;
}
.tab1 {
    background: url(../images/tab1.png) no-repeat;
	right:9px;
	top:30px;
}

.tab2 {
    background: url(../images/tab2.png) no-repeat;
	right:7px;
	top:110px;
}

.tab3 {
    background: url(../images/tab3.png) no-repeat;
	right:5px;
	top:190px;
}

.tab4 {

    background: url(../images/tab4.png) no-repeat;
	right:3px;
	top:270px;
}

/*noinspection ALL*/
.tab5 {

    background: url(../images/tab5.png)no-repeat;
	right:1px;
	top:350px;
}

/*noinspection CssUnknownTarget*/
.tab6 {

    background: url(../images/tab6.png) no-repeat;
	left:-12px;
	top:40px;
    position:absolute;

}

p.tab {
    -moz-transform: rotate(90deg);
    -webkit-transform: rotate(90deg) ;
    -o-transform: rotate(90deg) ;
    -ms-transform: rotate(90deg) ;
    transform: rotate(90deg);

    margin:0; padding:0;
    border:solid 0px #b6ff00;
    white-space: nowrap;
    font-family: Calibri, serif;
    font-size:13px;
    font-weight:bold;
    left:0px;
    top:0px;
    position:relative;
    cursor:pointer;
}

p.matiere {
    margin:0; padding:0;
    -moz-transform: rotate(270deg);
    -webkit-transform: rotate(270deg) ;
    -o-transform: rotate(270deg) ;
    -ms-transform: rotate(270deg) ;
    transform: rotate(270deg);
    border:solid 0 #b6ff00;

    font-family:Calibri, serif;
    font-size:12px;
    width:120px;
    left:-48px;
    top:50px;
    position:relative;
    font-weight:bold;
    cursor:pointer;
}


#page_next {
    position:absolute;
    top:50%;
    right:-50px;
    width:40px;
    border-radius:50%;
    padding:2px;
    z-index:20;
    cursor:pointer;
}

#page_prev {
    position:absolute;
    top:50%;
    left:-50px;
    width:40px;
    border-radius:50%;
    padding:2px;
    z-index:20;
    cursor:pointer;

}

#next {
    position:absolute;
    top:37px;
    right:0;
    width:40px;
    border-radius:50%;
    padding:2px;
    z-index:20;
    cursor:pointer;
}

#prev {
    position:absolute;
    top:37px;
    width:40px;
    border-radius:50%;
    padding:2px;
    z-index:20;
    cursor:pointer;

}

.SliderContainer{
    position:relative;
    height:130px;
    width:1105px;
    border:solid 0px blue;
    margin:0 auto;   
 }

.cacheSlider{
	overflow:hidden;
	width:1005px;
	height:130px;
    border:solid 0px #ffd800;
    position:relative;
    line-height:130px;
    left:50px;
}

/*noinspection ALL*/
.slider{
    position: relative;
    display:inline-block;
    vertical-align:middle;
    padding: 0 30px;
    cursor:pointer;
    white-space: nowrap; 
    border-top: solid 1px black;
    border-bottom: solid 1px black;
    height: 83px;
    line-height: 80px;
    min-width:884px;
    text-align:left;
    background-color: rgba(255, 255, 255, 0.25);
}

div.thumb {
    height: 75px;
    width: 70px;
    background-size: 100%;


    z-index: 1;
    vertical-align:middle;
    text-align: center;
    display: inline-block;
    font-family: Candara;
    color: #333;
    line-height: 73px;
    border:solid 0px #ff0000;

    -webkit-transition: -webkit-transform ease-in-out 100ms;
    -moz-transition: -moz-transform ease-in-out 100ms;
    -ms-transition: -ms-transform ease-in-out 100ms;
    -o-transition: -o-transform ease-in-out 100ms;
    transition: transform ease-in-out 100ms;


}

.thumbg { margin:0px; margin-right: 0px; }
.thumbd { margin:0px; margin-right: 3px;  }

img.thumb {
    height: 75px;
    z-index: 1;
    border: solid 0px #000;
    vertical-align:middle;

    -webkit-transition: -webkit-transform ease-in-out 100ms;
    -moz-transition: -moz-transform ease-in-out 100ms;
    -ms-transition: -ms-transform ease-in-out 100ms;
    -o-transition: -o-transform ease-in-out 100ms;
    transition: transform ease-in-out 100ms;

}

.thumb:hover {
	-webkit-transform:scale3d(1.5, 1.5, 1);
	-moz-transform:scale3d(1.5, 1.5, 1);
	-o-transform:scale3d(1.5, 1.5, 1);
	-ms-transform:scale3d(1.5, 1.5, 1);
	transform:scale3d(1.5, 1.5, 1);

	-webkit-box-shadow:0 0 10px #fff;
	-moz-box-shadow:0 0 10px #fff;
	-ms-box-shadow:0 0 10px #fff;
	-o-box-shadow:0 0 10px #fff;
	box-shadow:0 0 10px #fff;

    z-index:100;    
}

.selection {
	-webkit-box-shadow:0 0 10px red;
	-moz-box-shadow:0 0 10px red;
	-ms-box-shadow:0 0 10px red;
	-o-box-shadow:0 0 10px red;
	box-shadow:0 0 10px red;

    z-index:10;    
}

#divView{
    overflow:visible;
    position:absolute;
    width:944px;
    height:507px;
    left:34px;
    top:14px;
    border:solid 0px #ff0000;
}
#gauche{

    position:absolute;
    left:0px;
    top:1px;
    width:472px;
    height:507px;
    line-height:507px;
    background-repeat:no-repeat;
    background-size:100% 100%;
    text-align:center;
    border:solid 0px #1e30ff;
}

#droite{

    position:absolute;
    right:0px;
    top:1px;
    width:472px;
    height:507px;
    line-height:507px;
    background-repeat:no-repeat;
    background-size:100% 100%;
    text-align:center;
    border:solid 0px #ffa825;
}

.main .flipbook {
    overflow:visible;
	position:absolute;
	width:945px;
	height:507px;
	left:34px;
	top:15px;
    visibility:hidden;
    border:solid 0px #ff0000;
}

.main .page {
	width:472px;
	height:507px;
	line-height:507px;
	background-repeat:no-repeat;
	background-size:100% 100%;
    text-align:center;
    border:solid 0px gray;
    position:relative;
}

.pageContent {
    position:relative;
    display:inline-block;
    vertical-align:middle;
    border:solid 0px blue;
    line-height:normal;
    width: 380px;
    padding: 0px 0px;
    text-align:center;
}

img.imgg, img.imgd {
    position:absolute;
    top:0;
    left:0;
    display:none;
    margin-bottom:10px;
    margin-top:10px;
}

img.imgbwg, img.imgbwd {
    display:block;
    position:relative;
    margin-bottom:10px;
    margin-top:10px;
}

.Pages {
 	width:473px;
	height:509px;
    vertical-align:middle;
    text-align:center;
}

.footer {
    font-family: Calibri;
    font-size: 12px;
    position:relative;
    text-align: center;
    color: #aaa;
    line-height: 14px;
}

.titreImage {
    font-family:'Kaushan Script', cursive;
    font-size:26px;
    font-style:normal;
    color:#454636;
    margin-top:0px;
    margin-bottom: 5px;
}

.typeImage {
    font-family:'Times New Roman', serif;
    font-size:20px;
    color:#454636;
    margin-top:5px
}
.r354 {
    -ms-transform: rotate(354deg); /* IE 9 */
    -webkit-transform: rotate(354deg); /* Chrome, Safari, Opera */
    transform: rotate(354deg);
}
.r355 {
    -ms-transform: rotate(355deg); /* IE 9 */
    -webkit-transform: rotate(355deg); /* Chrome, Safari, Opera */
    transform: rotate(355deg);
}
.r356 {
    -ms-transform: rotate(356deg); /* IE 9 */
    -webkit-transform: rotate(356deg); /* Chrome, Safari, Opera */
    transform: rotate(356deg);
}


.r357 {
    -ms-transform: rotate(357deg); /* IE 9 */
    -webkit-transform: rotate(357deg); /* Chrome, Safari, Opera */
    transform: rotate(357deg);
}
.r358 {
     -ms-transform: rotate(358deg); /* IE 9 */
     -webkit-transform: rotate(358deg); /* Chrome, Safari, Opera */
     transform: rotate(358deg);
 }
.r359 {
    -ms-transform: rotate(359deg); /* IE 9 */
    -webkit-transform: rotate(359deg); /* Chrome, Safari, Opera */
    transform: rotate(359deg);
}


.r1 {
    -ms-transform: rotate(1deg); /* IE 9 */
    -webkit-transform: rotate(1deg); /* Chrome, Safari, Opera */
     transform: rotate(1deg);
}
.r2 {
    -ms-transform: rotate(2deg); /* IE 9 */
    -webkit-transform: rotate(2deg); /* Chrome, Safari, Opera */
    transform: rotate(2deg);
}
.r3 {
    -ms-transform: rotate(3deg); /* IE 9 */
    -webkit-transform: rotate(3deg); /* Chrome, Safari, Opera */
    transform: rotate(3deg);
}

.r4 {
    -ms-transform: rotate(4deg); /* IE 9 */
    -webkit-transform: rotate(4deg); /* Chrome, Safari, Opera */
    transform: rotate(4deg);
}
.r5 {
    -ms-transform: rotate(5deg); /* IE 9 */
    -webkit-transform: rotate(5deg); /* Chrome, Safari, Opera */
    transform: rotate(5deg);
}
.r6 {
    -ms-transform: rotate(6deg); /* IE 9 */
    -webkit-transform: rotate(6deg); /* Chrome, Safari, Opera */
    transform: rotate(6deg);
}
.tailleImage {
    font-family:'Brush Script Std', serif;
    font-size:16px;
    color:blue;
    margin:0; padding:0;
}

#loadImage {
    top:0px;
    left: 0px;
    position:absolute; 
    visibility:hidden; 
    overflow:hidden; 
    height:100px; 
    width:100px;
}