body {
	position: relative;
	max-width: 100%;
	overflow-x:hidden;
	/*font-weight: 600;*/
}
header {
	background: white;
}
section {
	overflow: visible;
}
section p {
	font-size: 1.2em;
	line-height: 1.4em;
	text-align: justify;
	font-weight: normal;
	margin-bottom: 1em;
}
section .inner {
	z-index: 1;
}

h2{
	font-size: 1em;
	margin: 0;
}

.subh2{
    font-weight: 200;
    padding: 0;
    margin: 0.2em 0 0.2em 0.4em;
    font-size: 2.2em;
    text-transform: uppercase;
    line-height: 1.3em;
    display: inline-block;
    vertical-align: top;
}

nav li.nav-top.active,
nav li.nav-top:hover,
section.top h2 {
	background-color: #FE7829;
}
nav li.nav-history.active,
nav li.nav-history:hover,
section.history h2 {
	background-color: #77ff33;
}

section.history h3 {
	background-color: #FE7829;
}

nav li.nav-manga:hover,
section.manga h3 {
	background-color: #4c0e7c;
}

nav li.nav-epub.active,
nav li.nav-epub:hover {
	background-color: #FE7829;
}

h3 {
	margin: 0;
}

h3.title {
    font-family: Asuka;
    color: #fff;
    font-size: 2em;
    line-height: 1em;
    padding: .2em 0.8em;
    margin: 0;
    text-transform: uppercase;
    display: inline-block;
    font-weight: normal;
}

nav li.nav-univers.active,
nav li.nav-univers:hover {
	background-color: #FE7829;
}

nav li.nav-characters.active,
nav li.nav-characters:hover {
	background-color: #01ABD4;
}


nav li.nav-serie.active,
nav li.nav-serie:hover,
section.serie h2 {
	background-color: #CB1264;
}

section.serie h3 {
	background-color: #CB1264;
}
nav li.nav-preview.active,
nav li.nav-preview:hover,
section.preview h2 {
	background-color: #F8016A;
}
p strong {
	font-size: 1.3em;
	line-height: 1.2em;
}

#player {
	background-color: black;
}

/*univers*/

.colorbestia{
    color: #924000;
}
.univers-introduction-image,
.univers-introduction-text {
	display: inline-block;
	vertical-align: top;
	overflow: hidden;
}
.univers-introduction-text {
	width: 58%;
	text-align: center;
	background-image: url(visuels/BC-MS-VISUEL_fond-univers.jpg);
}
.univers-title {
	text-align: right;
    background-color: #FE7829;
    display: inline-block;
    vertical-align: top;
    font-family: Asuka;
    color: #fff;
    font-size: 2.8em;
    float: left;
    line-height: 1em;
    padding: .2em 0.8em;
    margin: 0;
    text-transform: uppercase;
    font-weight: normal;
}
.univers-introduction-text .univers-autor-image img {
	margin-top:0;
}
.univers-block-text {
	margin-top: 30px;
	margin-bottom: 10px;
}
.univers-introduction-text .logo {
	width: 80%;
	height: auto;
	display: inline-block;
	vertical-align: top;
	margin-top: 10%;
}
.univers blockquote {
	font-weight: 200;
	padding: 0;
	margin: 0.2em 0 0.8em 0;
	font-size: 2.2em;
	text-transform: uppercase;
	line-height: 1.3em;
	color: #924000;
}
.univers-introduction-text p {
	padding: 0 3em;
	display: inline-block;
	vertical-align: top;
}
.univers-introduction-image {
	width: 42%;
}
.univers-introduction-image img {
	display: block;
	width: 100%;
	height: auto;
    margin-top: 0;
}

h2.title {
    font-family: Asuka;
    color: #fff;
    font-size: 2.8em;
    line-height: 1em;
    padding: .2em 0.8em;
    margin: 0;
    text-transform: uppercase;
    display: inline-block;
    font-weight: normal;
}

/*black-clover*/


.black-clover-subtitle {
    font-family: Asuka;
    background-color: #01ABD4;
    color: #fff;
    font-size: 2.8em;
    line-height: 1em;
    padding: .2em 0.8em;
    margin: 0;
    text-transform: uppercase;
    display: inline-block;
    font-weight: normal;
}

.black-clover-text {
	display: inline-block;
	vertical-align: top;
}
.black-clover-text {
	width: 100%;
}
.black-clover-text p {
	margin-right: 2em;
}
.black-clover-firstperso-left, .black-clover-firstperso-right {
	display: inline-block;
    vertical-align: top;
}
.black-clover-firstperso-left {
	width: 60%;
}
.black-clover-firstperso-left ul {
	padding: 0;
    margin: 0;
    width: 100%;
    display: block;
}
.black-clover-firstperso-left li {
	display: inline-block;
    vertical-align: middle;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    max-height: 220px;
    overflow: hidden;
}
.black-clover-firstperso-right {
	width: 39%;
}
.black-clover-firstperso-right img {
	width: 100%;
}
.personnage-first-image {
	margin-top: 5%;
}
.black-clover-secondperso-left, .black-clover-secondperso-right {
	display: inline-block;
    vertical-align: top;
}
.black-clover-secondperso-right ul {
	padding: 0;
    margin: 0;
    width: 100%;
    display: block;
}
.black-clover-secondperso-right li {
	display: inline-block;
    vertical-align: middle;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    max-height: 220px;
    overflow: hidden;
}
.black-clover-secondperso-left {
	width: 45%;
}
.black-clover-secondperso-right {
	width: 54%;
}
.black-clover-secondperso-left img {
	width: 100%;
}
.personnage-second-image {
	margin-top: 1%;
}
.personnage-second-image img {
	height: 210px;
	width: auto;
}
.firstperso-title h3 {
	visibility: hidden;
}
.firstperso-title {
	position: relative;
	background-image: url(visuels/ASTA.png);
	background-repeat:no-repeat;
	height: 55px;
}
.secondperso-title h3 {
	visibility: hidden;
}
.secondperso-title {
	position: relative;
	background-image: url(visuels/YUNO.png);
	background-repeat:no-repeat;
	height: 55px;
}


/*history*/
.history-text-left,
.history-text-right {
	display: inline-block;
	vertical-align: top;
	width: 100%;
}
.history-text-left {
	padding-top: 10%;
}
.history-text-right {
	padding-left: 1.1em;
}
.history-img {
	margin-top: -18px;
}
.history-img img {
	display: block;
	width: 100%;
	height: auto;
}
.synopsis-image-left, .synopsis-right {
	display: inline-block;
	vertical-align: top;
}
.synopsis-image-left {
	width: 55%;
}
.synopsis-image-left img {
	width: 100%;
	display: block;
}
.synopsis-right {
	width: 44%;
}
.history-title {
	font-family: Asuka;
    background-color: #77ff33;
    color: #fff;
    font-size: 2.8em;
    line-height: 1em;
    padding: .2em 0.8em;
    margin: 0;
    text-transform: uppercase;
    display: inline-block;
    font-weight: normal;
}
.history-img img {
	width: 60%;
	margin: auto;
}
.image-superpose {
	margin-top: -35%;

}


/*serie section*/
section.serie {
	background: url(../visuels/background-manga-list.png) bottom center repeat-x;
	min-height: 0;
}
#offre {
	background: none;
}
section.serie p {
	text-indent: 0;
	margin: 0.7em 2.4em;
}
section.serie p.copyright {
	margin-bottom: 1.4em;
}
.offre-text {
	position: absolute;
	top: 0;
	left: 0;
	width: 45%;
	padding: 5.96em 2em 2em 2em;
}
.offre-text p {
	font-size: 1.1em;
}

.serie-couvertures {
	padding: 2em;
	margin: 0;
	white-space: nowrap;
}
.serie-couvertures.ex-libris {
	text-align: right;
}
.serie-couvertures li {
	display: inline-block;
	list-style: none;
	vertical-align: top;
	margin-right: 20px;
}
.serie-couvertures.ex-libris li {
	margin-right: 0;
	margin-left: 20px;
}
.serie-couvertures li a {
	display: block;
	/*width: 200px;*/
}
.serie-couvertures li a img {
	width: 100%;
}
.serie-title {
	font-family: Asuka;
    background-color: #CB1264;
    color: #fff;
    font-size: 2.8em;
    line-height: 1em;
    padding: .2em 0.8em;
    margin: 0;
    text-transform: uppercase;
    display: inline-block;
    font-weight: normal;
}
.serie-text {
	padding-top: 1%;
	padding-bottom: 1%;
}
.serie-image img {
	display: block;
}

/*fiche technique*/
.technique-title {
	font-family: Asuka;
    background-color: #4c0e7c;
    color: #fff;
    font-size: 2.8em;
    line-height: 1em;
    padding: .2em 0.8em;
    margin: 0;
    text-transform: uppercase;
    display: inline-block;
    font-weight: normal;
}
.manga-text {
	text-align: center;
}
.serie-couvertures, .inview-text {
	display: inline-block;
	vertical-align: middle;
}
.inview-text {
	border: 1px solid black;
	padding: 10px;
}
.inview-text p {
    margin: auto;
}
.inview-text img {
	margin-top: 10px;
	max-width: 440px;
	height: auto;
}
.serie-copyright {
	margin-top: 3%;
}

/*preview*/
section.preview {
	background: #666666;
	/*url(../visuels/lecture-en-ligne-rokka-melt.jpg) center center no-repeat;*/
	min-height: 310px;
	width: 100%;
}

/*epub*/
.epub-link {
	background: url(../visuels/prsiteBLACK_CLOVER-ANNONCE-NUMERIQUE.jpg) center center no-repeat;
	display: block;
	height: 591px;
	width: 100%;
}

/*popup*/
.popup-video {
	position: fixed;
	display: none;
	background-color: black;
	width: 640px;
	height: 360px;
	top: 50%;
	left: 50%;
	margin-left: -320px;
	margin-top: -180px;
	border: 1px solid #666;
	z-index: 1;
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.7);
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
.popup-video-close {
	cursor: pointer;
	position: absolute;
	z-index: 1;
	display: block;
	right: 0;
	top: 0;
	width: 20px;
	height: 20px;
	background: url(../visuels/close_button.png) top left no-repeat;
}
.popup-video-close:hover {
	background-position: 0 -20px;
}
.popup-video video {
	display: block;
	position: relative;
	width: 100%;
	height: 100%;
}
.show-popup {
	display: block;
	text-indent: -9999px;
	width: 309px;
	height: 50px;
	position: absolute;
	top: 0;
	right: 0;
}
.show-popup-yuno {
	background: url(../visuels/view-yuno-video-button.png) top left no-repeat;
}
.show-popup-asta {
	background: url(../visuels/view-asta-video-button.png) top left no-repeat;
}
.adn-video-js {
	width: 100%;
	height: 100%;
}

/* interview */
nav li.nav-interview.active,
nav li.nav-interview:hover,
section.interview h2 {
	background-color: #e11b27;
}
section.interview .inner {
	height: auto;
}
.interview-player {
	width: 100%;
	height: 540px;
}
.interview-player iframe {
	width: 100%;
	height: 100%;
}