/* BODY DEBUT---------------------------------------------*/
body {
background-color: #000;
}

div#intrapat {
 margin-top:-20px;
 display: inline-block;
 margin-left:192px;
}

section {
  display: inline-block;
  vertical-align: top;
  width:44.3%;
  padding-left: 0px;
}


footer{
width: 100%;
background-image:linear-gradient(360deg, #000 1%, red 80%, #111 100%);
height:35px;
color:#fff;
font-weight:bold;
font-family:Verdana;
font-size:12px;
color:#fff;
border-bottom-left-radius: 10px;
border-bottom-right-radius: 10px;
text-align: center;
}

#hpage {
font-family:calibri; 
font-size:18px;
color:#b50000;
}

/* BODY FIN---------------------------------------------*/

/*PAGE A ONGLET PAGE ACCUEIL DEBUT-------------------------------------------------------------------------------------*/
section#onglet{
width:75%;
display: inline-block;
}

.menu_onglet { /* boite qui contient le menu (les onglets) */
  padding-top:12px ; /* marge intérieure haute */
  padding-bottom:4px} /* marge intérieure basse */

a.onglet { /* style des liens se trouvant dans un onglet inactif */
  border-bottom: 1px solid #111;/* encadrement */
  margin:0px 0px 0px 3px ; /* marge extérieure */
  padding:7px 8px 7px 8px; /* marge intérieure */
  text-decoration:none;/* les liens ne sont pas soulignés */
  font-family:arial; 
  font-size:16px;
  color:#fff;
  border-radius: 5px 5px 0px 0px;
  background-image:linear-gradient(180deg, #000 1%, grey 80%, #111 100%);
  } 

a.onglet-actif { /* style de l'onglet de la page active */
   margin:0px 0px 0px 3px ; /* marges intérieures */
   padding:7px 8px 7px 8px ; /* marges extérieures */  
   text-decoration:none;
   font-family:arial; 
   font-size:17px;
   font-weight: bold;
   color:#fff;
   border-radius: 5px 5px 0px 0px;
   background-image:linear-gradient(180deg, #000 1%, red 80%, #111 100%);
 }

div.grid5 {
  width:100%;
  height:820px;
  border:solid 1px #111 ;
  border-radius: 0px 20px 0px 0px;
  margin-left: 3px;
  display : grid;
  grid-template-columns: repeat(11, 1fr);
  grid-template-rows: repeat(2, 170px);
}

div.element5 {
  margin: 10px;
  padding : 0px;
  width:auto;
}

div.element5 a {
   font-family:arial; 
   font-size:16px;
   text-decoration: none;
   color:#fff;
 }

div.element5 img {
   margin-top:10px;
   width:100px;
   height:100px;
   border-radius: 20px;
   box-shadow: 2px 2px 5px #b50000;
}

/*PAGE A ONGLET PAGE ACCUEIL FIN-------------------------------------------------------------------------------------*/

/*SECTION LIEN DEBUT-------------------------------------------------------------------------------------*/
section#lien{
width:24%;
margin-left:10px;
}
/*SECTION LIEN FIN -------------------------------------------------------------------------------------*/

/*MENU ANDROID DEBUT-------------------------------------------------------------------------------------*/
/* The side navigation menu */
.sidenav {
    height: 100%; /* 100% Full-height */
    width: 0; /* 0 width - change this with JavaScript */
    position: fixed; /* Stay in place */
    z-index: 1; /* Stay on top */
    top: 0;
    left: 0;
    background-color: #000; /* Black*/
    overflow-x: hidden; /* Disable horizontal scroll */
    padding-top: 60px; /* Place content 60px from the top */
    transition: 0.5s; /* 0.5 second transition effect to slide in the sidenav */
}
 
/* Position and style the close button (top right corner) */
.sidenav .closebtn {
    position: absolute;
    top: 0;
    right: 25px;
    font-size: 36px;
    margin-left: 50px;
}
 
/* Style page content - use this if you want to push the page content to the right when you open the side navigation */
#main {
    transition: margin-left .5s;
    padding-left: 0px;
    overflow:hidden;
    width:100%;
}

/* Add a black background color to the top navigation */
.topnav {
    background-color: #000;
    overflow: hidden;
    /*border-bottom:1px solid red;*/
    height:90px;
}
 
#ico{
  display: none;
}

/* The navigation menu links */
.sidenav a {
    padding: 2px 2px 2px 2px;
    text-decoration: none;
    font-size: 15px;
    font-family: arial;
    color: #000;
    display: block;
    transition: 0.3s;
}

/* Style the links inside the navigation bar */
.topnav a {
    float: left;
    display: block;
    color: #000;
    text-align: center;
    padding: 20px 16px;
    text-decoration: none;
    font-size: 17px;
 }

/*MENU ANDROID FIN-------------------------------------------------------------------------------------*/

/* MENU DEBUT---------------------------------------------*/

nav.mnav
{font-family: arial, sans serif; 
font-size:15px;
width: 262px;
}

ul.first {
padding-left: 0px;
}

li.prem {
list-style-type: none;
width: 240px; /* 228 */
padding: 10px;
color:#fff;
background-color: #000;
border-right: 2px solid #b50000;
}

li.prem a{
text-decoration: none;
color:#fff;
}

li.prem:hover {
list-style-type: none;
width: 242px;
padding: 10px;
color:#fff;
background-color: #222;
}

li.prem a:hover{
text-decoration: none;
color:#fff;
}

img#fleche_bas1, #fleche_bas2, #fleche_bas3, #fleche_bas4, #fleche_bas5, #fleche_bas6, #fleche_bas7, #fleche_bas8, #fleche_bas9, #fleche_bas10, #fleche_bas11, #fleche_bas12 {
	float: right;
	padding-right: 0px;
}
/* MENU FIN---------------------------------------------*/

/* SOUS MENU DEBUT---------------------------------------------*/
ul.second{
display:none;
position:relative; 
margin-top: 10px;
margin-bottom: 0px;
border-top:1px solid red;
border-bottom:1px solid red;
width:250px;
}

li.deuz {
list-style-type: none;
width: 250px;
padding: 10px;
color:#fff;
background-color: #000;
margin-left: -50px;
}

li.deuz a{
text-decoration: none;
color:#fff;
}

li.deuz:hover {
list-style-type: none;
width: 250px;
padding: 10px;
color:#fff;
background-color: #444;
margin-left: -50px;
}

li.deuz a:hover{
text-decoration: none;
color:#fff;
}

/* SOUS MENU FIN---------------------------------------------*/

/*FORMULAIRE RECHERCHE DEBUT--------------------------------------------------------------------------------------------*/
#zone_recherche {
  width: 500px;
  position: relative;
  display:inline-block;
  float:right;
  margin-top: 20px;
  margin-right: 30px;
}

#texte_recherche {
  width: 450px;
  padding: 10px 50px 10px 10px;
  background-color: #111;
  border: solid 1px #b50000;
  -moz-border-radius: 10px;
  -webkit-border-radius: 10px;
  -o-border-radius: 10px;
  border-radius: 10px;
  font-family: arial, verdana, sans-serif;
  font-size: 16px;
  color: #b50000;
}

::placeholder {
  color: #b50000;
}

#texte_recherche:focus {
  background-color: #333;
  outline: 0 none; /* Pour enlever la "bordure" jaune qu'ajoute Google Chrome au focus */
  color: #fff;
}

#bouton_recherche {
  margin-top: -30px;
  position: absolute;
  top: 50%;
  right: 10px;
}

.radio {
font-family: arial, verdana, sans-serif;
font-size: 16px;
color: #b50000;
}

/*FORMULAIRE RECHERCHE FIN--------------------------------------------------------------------------------------------*/

/*HORLOGE DEBUT--------------------------------------------------------------------------------------------*/

div#horloge{
width:175px;
margin-left:-10px;
margin-top:-10px;
}

.date{
font-size:16pt;
font-family:arial;
color:#000;
}

/*HORLOGE FIN--------------------------------------------------------------------------------------------*/


/*TITRE PAGES (bluray, dvd, etc...) DEBUT--------------------------------------------------------------------------------------------*/
section#listebluray, #listebluray2 {
width:100%;
height:100%;
/*border:1px solid green;*/
}

div#bluray1 ul#flip{
width:100%;
-webkit-margin-left: auto; 
-webkit-margin-right: auto;
}
div.headerBloc {
width:100%;
}

div.headerBloc table{
width:100%;
background-image:linear-gradient(180deg, #000 1%, red 80%, #111 100%);
height:35px;
color:#fff;
font-weight:bold;
font-family:Verdana;
font-size:12px;
margin-top:2px;
padding:0px 0px 0px 0px;
color:#fff;
border-top-left-radius: 10px;
border-top-right-radius: 10px;
}

#block2{
border-top-left-radius: 4px;
border-top-right-radius: 4px;
border-bottom-left-radius: 4px;
border-bottom-right-radius: 4px;
-moz-box-shadow: 0px 0px 3px #158aff;
-webkit-box-shadow: 0px 0px 3px #158aff;
box-shadow: 0px 0px 3px #158aff;
}

.texte1{
color:white;
font-family: verdana; 
font-size: 12px; 
font-weight:bold;
}

/* class des numéros de pages début */
div#alpha {
width:100%;
text-align: center;
}

.inactif {
	background-color:#222222;
	margin-left:1px;
	padding:3px 3px 3px 3px;
	color:white;
	text-decoration:none;
	font-family:Verdana;
	font-size:16px;
	text-align:center;	
}

.actif {
	background-color:#f10202;
	margin-left:1px;
	padding:3px 3px 3px 3px;
	color:white;
	text-decoration:none;
	font-family:Verdana;
	font-size:16px;
	text-align:center;	
}
/* class des numéros de pages fin */

/*TITRE PAGES (bluray, dvd, etc...)  FIN--------------------------------------------------------------------------------------------*/

/*AFFICHE EN GRILLE DES AFFICHES + PARAGRAPHE NB PAGE(bluray, dvd, etc...)  FIN--------------------------------------------------------------------------------------------*/

div.grid {
  width:100%;
  display : grid;
  grid-template-columns: repeat(11, 1fr);
  grid-template-rows: repeat(1, 300px);
}

div.element {
  margin: 5px;
  padding : 0px;
  width:140px;
}

div.element a{
text-decoration: none;
color:#fff;
font-family: verdana; 
font-size: 14px; 
}

p.nbpage {
  display:block;
  padding-left:10px;
  /*border:2px solid red;*/
} 

/*AFFICHE EN GRILLE DES AFFICHES + PARAGRAPHE NB PAGE (bluray, dvd, etc...)  FIN--------------------------------------------------------------------------------------------*/


/*AFFICHAGE FICHE FILMS DEBUT -------------------------------------------------------------------------------------------------------------*/

#fiche {
width:100%;
}

#fiche2 {
width:100%;
}

.titre {
font-family:'Droid Serif'; 
font-size:28px;
margin-top:-11px;
margin-left:40px;
color:#fff;
background-image:linear-gradient(-90deg, #000 0%, red 50%, #000 100%);
}

.soustitre {
font-family:'Droid Serif'; 
font-size:16px;
margin-top:-11px;
margin-left:40px;
color:#fff;
background-image:linear-gradient(-90deg, #000 0%, red 50%, #000 100%);
}

.titre2 {
font-family:'Droid Serif'; 
font-size:24px;
margin-left:20px;
color:#fff;
font-weight:bold;
}

.titre3 {
font-family:'Droid Serif'; 
font-size:16px;
color:#fff;
font-weight:bold;
}

.suite {
margin-left:10px; 
font-family:'Droid Sans';
font-size:12px;
color:#b50000;
}

.titre4 {
font-family:'Droid Serif'; 
font-size:12px;
color:#fff;
font-weight:bold;
}

a.liste {
  color:#b50000;
  text-decoration:none;
  font-family:'Droid Sans';
  font-size:16px;
  font-weight:bold;
}

.fiche1 {
display : grid;
grid-template-columns: 260px 600px 1fr;
grid-template-rows: repeat(1, 350px);
}

.element1 {
font-family:'Droid Sans'; 
font-size:16px;
list-style:none;
color:#fff;  
}

.synopsis {
font-family:'Droid Sans'; 
font-size:16px; 
padding:5px 5px 5px 5px; 
color:#fff;  
}

.youtube {
float:right;
margin-right:20%;
}

.video {
width:800px; 
height:auto;
margin-left:50px;
border:2px solid transparent;
border-image:linear-gradient(45deg, #000 0%, red 50%, #000 100%);
border-image-slice:1;
}

/*AFFICHAGE FICHE FILMS FIN -------------------------------------------------------------------------------------------------------------*/

/*AFFICHAGE FICHE SERIES DEBUT -------------------------------------------------------------------------------------------------------------*/
.fiche4 {
display : grid;
grid-template-columns: 217px 600px 1fr;
grid-template-rows: repeat(1, 387px);
}

/*AFFICHAGE FICHE SERIES FIN -------------------------------------------------------------------------------------------------------------*/

/*AFFICHAGE FICHE SERIES SAISON DEBUT -------------------------------------------------------------------------------------------------------------*/

.fiche5 {
display : grid;
grid-template-columns: 260px 400px 1fr;
grid-template-rows: repeat(1, 300px);
}

.titre5 {
font-family:'Droid Serif'; 
font-size:28px;
margin-top:-11px;
margin-left:40px;
color:#fff;
}

/*AFFICHAGE FICHE SERIES SAISON FIN -------------------------------------------------------------------------------------------------------------*/

/*AFFICHE EN GRILLE DES PHOTOS ACTEURS DEBUT--------------------------------------------------------------------------------------------*/

div.grid2 {
  width:100%;
  display : grid;
  grid-template-columns: repeat(15, 1fr);
  grid-template-rows: repeat(1, 200px);
}

div.element2 {
  margin: 5px;
  padding : 0px;
  width:100px;
}

div.element2 a{
text-decoration: none;
color:#fff;
font-family: verdana; 
font-size: 14px; 
}

p.nbpage {
  display:block;
  padding-left:10px;
} 

                    /*AFFICHE FICHE ACTEUR*/
table.acteur {
  width:100%;
  margin-left: 200px;
}

/*AFFICHE EN GRILLE DES PHOTOS ACTEURS FIN--------------------------------------------------------------------------------------------*/

/*AFFICHE EN GRILLE DES DVD, BLUERAY ETC... DANS SUITE OU ACTEUR DEBUT --------------------------------------------------------------------------------------------*/

div.grid4 {
  width:100%;
  display : grid;
  grid-template-columns: repeat(4, 1fr);
  grid-template-rows: repeat(1, 250px);
}

div.element4 {
  margin: 30px;
  padding : 0px;
  width:auto;
}


/*AFFICHE EN GRILLE DES DVD, BLUERAY ETC... DANS SUITE OU ACTEUR FIN--------------------------------------------------------------------------------------------*/

/*SELECT DES MENUS DEROULANT DEBUT --------------------------------------------------------------------------------------------*/

select {
  background-color: #000;
  border:1px solid #b50000;
  border-radius: 6px;
  font-family: arial;
  font-size:15px;
  color: white;
}

/*SELECT DES MENUS DEROULANT FIN --------------------------------------------------------------------------------------------*/

/*AFFICHAGE PAGE HORS SERIES DEBUT --------------------------------------------------------------------------------------------*/

.fichehs {
display : grid;
grid-template-columns: 260px 500px 1fr;
grid-template-rows: repeat(1, 700px);
}

/*AFFICHAGE PAGE HORS SERIES FIN --------------------------------------------------------------------------------------------*/

/*AFFICHAGE TEXTE CHANSON DEBUT --------------------------------------------------------------------------------------------*/

.cacher{    
display:none;
}

.montrer{    
display:block;
}

/*AFFICHAGE TEXTE CHANSON FIN --------------------------------------------------------------------------------------------*/

/*AFFICHAGE PLAYLIST ALBUM DEBUT --------------------------------------------------------------------------------------------*/
#playlist{
 list-style: none;
 margin-left:-40px;
}

#playlist li a{
color:#b50000;
text-decoration: none;
font-family:'Droid Serif'; 
font-size:16px;
font-weight:bold;
}

#playlist .current-song a{
color:#1f5bfd;
text-decoration: none;
font-family:'Droid Serif'; 
font-size:16px;
font-weight:bold;
}

/*AFFICHAGE PLAYLIST ALBUM FIN --------------------------------------------------------------------------------------------*/