*{ /* mais tout les styles du avigateur sans marges espaces etc... */
  padding:0;
  margin:0;
  box-sizing: border-box;
}

body{
  margin: 0;
  padding: 0;
  font-family: "Roboto", sans-serif;
  background-color:#999;
}


.main{
  display:grid; /* la div principal "main" va contenir les autres div en format grille */
  height:100%; /* 1 vh = 1% de la hauteur et 1vw = 1% de la largeur de la fenêtre de navigation */
  grid-template-columns: 0.15fr 0.85fr; /* défini le nombre et la taille des colonnes 1fr = 1 colonne */
  grid-template-rows:0.1fr 0.01fr 0.94fr 0.05fr; /* défini le nombre et la taille des lignes 1fr = 1 ligne */
  grid-template-areas: /* défini commment sont réparties les différentes div par colonne et par ligne */
  "header header"
  "vmenu hmenu"
  "vmenu contenu"
  "footer footer";
  grid-gap: 10px; /* écart entre les div */
  background-color: #999;
  padding:2px;
}

.header{
  background: #222;
  border-bottom: 2px solid #520300;
  grid-area: header; /* nom pour le grid temlate areas de "main" */
  /*border:1px solid green;*/
  border-bottom-left-radius:10px;
  border-bottom-right-radius:10px;
  padding-top:5px;
  padding-left:10px;
  box-shadow:0px 5px 8px #333;
}

.tmdb {
  float:right;
  width:300px;
  text-align:justify-all;
  margin-top:10px;
  margin-right:10%;
}

.entete{
  display:inline-block;
}

.entete1{
  display:inline-block;
  margin-left:60px;
  font-family: Roboto, sans-serif;
  font-size: 14px;
  color: white;
}

.entete2{
  display:inline-block;
  margin-left:60px;
  font-family: Roboto, sans-serif;
  font-size: 14px;
  color: white;
}

.entete2 label{
  font-size:16px;
  text-transform: uppercase;
}

.texte_connexion {
  width: 150px;
  padding: 5px 5px 5px 5px;
  background-color: #111;
  border: solid 1px #b50000;
  -moz-border-radius: 10px;
  -webkit-border-radius: 10px;
  -o-border-radius: 10px;
  border-radius: 10px;
  font-family: Roboto, sans-serif;
  font-size: 14px;
  color: #b50000;
}

.bouton_connexion{
  width: 105px;
  padding: 5px 5px 5px 5px;
  background-color: #b50000;
  border: solid 2px #333;
  -moz-border-radius: 10px;
  -webkit-border-radius: 10px;
  -o-border-radius: 10px;
  border-radius: 10px;
  font-family: Roboto, sans-serif;
  font-size: 14px;
  color: white;
}


.vmenu{
  background: #333;
  /*border:1px solid red;*/
  padding-left:0px;
  grid-area: vmenu; /* nom pour le grid temlate areas de "main" */
  box-shadow:5px 5px 8px #444;
  border-top-right-radius:10px;
  border-bottom-right-radius:10px;
  border-right: 2px solid #19B3D3;

}

.hmenu{
  background: #666;
  grid-area: hmenu; /* nom pour le grid temlate areas de "main" */
   /*border:1px solid blue;*/
  border-bottom-left-radius:8px;
  border-bottom-right-radius:8px;
  border-bottom: 2px solid #19B3D3;
  box-shadow:5px 5px 8px #444;
}

.titre-index{
  /*background-image:linear-gradient(180deg, #000 1%, red 20%, #111 100%);*/
  background-color: #666;
  font-family:'Roboto', sans-serif;;
  font-size:16px;
  color:#fff;
  
}

.contenu{
  overflow: hidden; /* overflow:hidden permet de ne pas faire déborder de l'écran les bandes d'images qui défile sur la page d'acceuil */
  background: #999;
  grid-area: contenu; /* nom pour le grid temlate areas de "main" */
  
   /*border:1px solid yellow;*/
  border-radius: 10px;
  border-bottom: 2px solid #19B3D3;
  box-shadow: 0px 5px 8px #666;
 
}

.inscription{
    font-family: 'Roboto', sans-serif;
    color:#fff;
   
}

footer{
  background: #222;
  border-top: 2px solid #520300;
  grid-area: footer; /* nom pour le grid temlate areas de "main" */
  /*border:1px solid green;*/
  border-top-left-radius:10px;
  border-top-right-radius:10px;
  padding-top:5px;
  padding-left:10px;
  box-shadow:10px 0px 20px #333;
  font-weight:bold;
  font-family:'Roboto', sans-serif;;
  font-size:14px;
  color:#fff;
  text-align: center;
  clear:both;
}



/* CHARTE GRAPHIQUE PRINCIPAL D'UNE PAGE FIN */

/* CHARTE GRAPHIQUE PRINCIPAL 2 D'UNE PAGE DEBUT */
.main2{
  display:grid; /* la div principal "main" va contenir les autres div en format grille */
  height:100%; /* 1 vh = 1% de la hauteur et 1vw = 1% de la largeur de la fenêtre de navigation */
  grid-template-columns: 0.15fr 0.85fr; /* défini le nombre et la taille des colonnes 1fr = 1 colonne */
  grid-template-rows:0.02fr 0.003fr 0.94fr 0.01fr; /* défini le nombre et la taille des lignes 1fr = 1 ligne */
  grid-template-areas: /* défini commment sont réparties les différentes div par colonne et par ligne */
  "headerd headerd"
  "vmenud hmenud"
  "vmenud contenud"
  "footer footer";
  grid-gap: 10px; /* écart entre les div */
  background-color: #999;
  padding:2px;
}

.header2{
  background: #222;
  border-bottom: 2px solid #520300;
  grid-area: headerd; /* nom pour le grid temlate areas de "main" */
  /*border:1px solid green;*/
  border-bottom-left-radius:10px;
  border-bottom-right-radius:10px;
  padding-top:5px;
  padding-left:10px;
  box-shadow:0px 5px 8px #333;
}

.vmenu2{
  background: #333;
  /*border:1px solid red;*/
  padding-left:0px;
  grid-area: vmenud; /* nom pour le grid temlate areas de "main" */
  box-shadow:5px 5px 8px #444;
  border-top-right-radius:10px;
  border-bottom-right-radius:10px;
  border-right: 2px solid #19B3D3;

}

.hmenu2{
  background: #666;
  grid-area: hmenud; /* nom pour le grid temlate areas de "main" */
   /*border:1px solid blue;*/
  border-bottom-left-radius:8px;
  border-bottom-right-radius:8px;
  border-bottom: 2px solid #19B3D3;
  box-shadow:5px 5px 8px #444;
}

.contenu2{
  overflow: hidden; /* overflow:hidden permet de ne pas faire déborder de l'écran les bandes d'images qui défile sur la page d'acceuil */
  background: #999;
  grid-area: contenud; /* nom pour le grid temlate areas de "main" */
  
   /*border:1px solid yellow;*/
  border-radius: 10px;
  border-bottom: 2px solid #19B3D3;
  box-shadow: 0px 5px 8px #666;
 
}


footer{
  background: #222;
  border-top: 2px solid #520300;
  grid-area: footer; /* nom pour le grid temlate areas de "main" */
  /*border:1px solid green;*/
  border-top-left-radius:10px;
  border-top-right-radius:10px;
  padding-top:5px;
  padding-left:10px;
  box-shadow:10px 0px 20px #333;
  font-weight:bold;
  font-family:'Roboto', sans-serif;;
  font-size:14px;
  color:#fff;
  text-align: center;
  clear:both;
}

/* CHARTE GRAPHIQUE PRINCIPAL 2 D'UNE PAGE FIN */

/* CHARTE GRAPHIQUE PRINCIPAL 3 D'UNE PAGE DEBUT */
.main3{
  display:grid; /* la div principal "main" va contenir les autres div en format grille */
  height:100%; /* 1 vh = 1% de la hauteur et 1vw = 1% de la largeur de la fenêtre de navigation */
  grid-template-columns: 280px 1fr;/*0.15fr 0.85fr; /* défini le nombre et la taille des colonnes 1fr = 1 colonne */
  grid-template-rows:110px 32px 1fr 45px; /* défini le nombre et la taille des lignes 1fr = 1 ligne */
  grid-template-areas: /* défini commment sont réparties les différentes div par colonne et par ligne */
  "headert headert"
  "vmenut hmenut"
  "vmenut contenut"
  "footer footer";
  grid-gap: 10px; /* écart entre les div */
  background-color: #999;
  padding:2px;
}

.header3{
  background: #222;
  border-bottom: 2px solid #520300;
  grid-area: headert; /* nom pour le grid temlate areas de "main" */
  /*border:1px solid green;*/
  border-bottom-left-radius:10px;
  border-bottom-right-radius:10px;
  padding-top:5px;
  padding-left:10px;
  box-shadow:0px 5px 8px #333;
}

.vmenu3{
  background: #333;
  /*border:1px solid red;*/
  padding-left:0px;
  grid-area: vmenut; /* nom pour le grid temlate areas de "main" */
  box-shadow:5px 5px 8px #444;
  border-top-right-radius:10px;
  border-bottom-right-radius:10px;
  border-right: 2px solid #19B3D3;

}

.hmenu3{
  background: #666;
  grid-area: hmenut; /* nom pour le grid temlate areas de "main" */
   /*border:1px solid blue;*/
  border-bottom-left-radius:8px;
  border-bottom-right-radius:8px;
  border-bottom: 2px solid #19B3D3;
  box-shadow:5px 5px 8px #444;
}

.contenu3{
  overflow: hidden; /* overflow:hidden permet de ne pas faire déborder de l'écran les bandes d'images qui défile sur la page d'acceuil */
  background: #999;
  grid-area: contenut; /* nom pour le grid temlate areas de "main" */
  
   /*border:1px solid yellow;*/
  border-radius: 10px;
  border-bottom: 2px solid #19B3D3;
  box-shadow: 0px 5px 8px #666;
 
}


footer{
  background: #222;
  border-top: 2px solid #520300;
  grid-area: footer; /* nom pour le grid temlate areas de "main" */
  /*border:1px solid green;*/
  border-top-left-radius:10px;
  border-top-right-radius:10px;
  padding-top:5px;
  padding-left:10px;
  box-shadow:10px 0px 20px #333;
  font-weight:bold;
  font-family:'Roboto', sans-serif;;
  font-size:14px;
  color:#fff;
  text-align: center;
  clear:both;
}

/* CHARTE GRAPHIQUE PRINCIPAL 3 D'UNE PAGE FIN */

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

nav#navcompte{
 text-transform: uppercase;
 width:100%;
 font-family:''Roboto', sans-serif;';
 background-color: #666;
 border-bottom-left-radius:8px;
 border-bottom-right-radius:8px;
 margin-left: 0px;
}

/* le séparateur ">" signifie que l'on prend uniquement les élément "ul" de "nav" et pas ceux des sous-menu */
nav#navcompte > ul{
margin:0px;
padding:0px;
}

nav#navcompte label{
 font-family:''Roboto', sans-serif;';
}

nav#navcompte > ul::after{
content:"";
display:block;
clear:both;
}

nav#navcompte > ul > li{
float:left;
position:relative;
border-right:1px solid #19B3D3;
border-left:1px solid #a1e9f7;
height:30px;
font-size:12px;
}

nav#navcompte li{
list-style-type: none;

}

.sousmenucompte{
  display:none;
 
}

nav#navcompte a {
  display:inline-block;
  text-decoration: none;
  padding:8px 10px;
  color:#fff;
}

nav#navcompte li.principal:hover{
background-color: #19B3D3;
border-bottom-left-radius: 10px;
border-bottom-right-radius: 10px;
border-top:3px solid black;
}



nav#navcompte li:hover .sousmenucompte{
  display:inline-block;
  position:absolute;
  top:100%;
  left:0px;
  padding:0px;
  z-index:1000;

  
}

.sousmenucompte li{
  border-top:1px solid black;
  background-color: #158da3;
  width:220px;
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px;
}

.sousmenucompte li:hover{
  border-top:3px solid black;
  background-color: #127285;
  width:220px;
 
}


/* MENU COMPTE FIN --------------------------------------------------------------------------------------------*/

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

nav#navsite{
 text-transform: uppercase;
 width:100%;
 font-family:''Roboto', sans-serif;';
 background-color: #333;
 margin-top:10px; 
 margin-bottom:50px;
 
}

/* le séparateur ">" signifie que l'on prend uniquement les élément "ul" de "nav" et pas ceux des sous-menu */
nav#navsite > ul{
margin-top:10px;

}

nav#navsite label{
 font-family:''Roboto', sans-serif;';
}

nav#navsite > ul::after{
content:"";
display:block;
clear:both;
}

nav#navsite > ul > li{
display:block;
position:relative;
height:40px;
font-size:14px;

}

nav#navsite li{
list-style-type: none;
margin-bottom:10px;

}



nav#navsite a {
  display:inline-block;
  text-decoration: none;
  padding:8px 10px;
  color:#fff;
}

nav#navsite li.principal:hover{
background-color:#19B3D3;
border-left: 5px solid black;
}

/* MENU SITE 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 ACCEUIL COMME NETFLIX DEBUT --------------------------------------------------------------------------------------------*/

.titre {
font-family:''Roboto', sans-serif;'; 
font-size:28px;
margin-top:5px;
margin-left:40px;
color:#fff;
background:#666;
border-bottom-left-radius:8px;
border-bottom-right-radius:8px;
border-bottom: 2px solid #19B3D3;
box-shadow:5px 5px 8px #444;
text-align:center;
}

.carrousel1{
  width:98%;
 /*border:1px solid green;*/
}

.slider{
  width:3120px;
  overflow:hidden;
  margin-left:0px;
  /*border:1px solid green;*/

}

.slides1{
  position:relative;
  width:80%;
  animation: glisse 20s infinite; /* animation anime ce qu'il y a dans le keyframes "glisse" durée 20s, à l'infini */
  height:210px;
  /*border:1px solid grey;*/
  z-index:10;
  margin-top:10px;
 
}
.slide1{
  float:left;
  padding:2px;
 
}
.image{
 border:1px solid #b9e3e5;
}

/* les keyframes permettent de donner un état au slide entre 0 et 100% suivant la durée de l'animation mise dans le slide */
@keyframes glisse {
  0% {
    transform:translateX(0);
  }
   10% {
    transform:translateX(-140px);
  }
  10% {
    transform:translateX(-140px);
  }
  10% {
    transform:translateX(-140px);
  }
   20% {
    transform:translateX(-280px);
  }
   30% {
    transform:translateX(-420px);
  }
   40% {
    transform:translateX(-560px);
  }
  50% {
    transform:translateX(-700px);
  }
  60% {
    transform:translateX(-840px);
  }
  70% {
    transform:translateX(-980px);
  }
  80% {
    transform:translateX(-1120px);
  }
  90% {
    transform:translateX(-1260px);
  }
  95% {
    transform:translateX(700px);
  }
  95% {
    transform:translateX(700px);
  }
  95% {
    transform:translateX(700px);
  }
   96% {
    transform:translateX(800px);
  }
  96% {
    transform:translateX(800px);
  }
  96% {
    transform:translateX(800px);
  }
}

.slides2{
  position:relative;
  width:100%;
  animation: glissedeux 25s infinite; /* animation anime ce qu'il y a dans le keyframes "glisse" durée 20s, à l'infini */
  height:210px;
  /*border:1px solid grey;*/
  z-index:10;
  margin-top:10px;
}

/* les keyframes permettent de donner un état au slide entre 0 et 100% suivant la durée de l'animation mise dans le slide */
@keyframes glissedeux {
  0% {
    transform:translateX(0px);
  }
  0% {
    transform:translateX(0px);
  }
  0% {
    transform:translateX(0px);
  }
   10% {
    transform:translateX(140px);
  }
  10% {
    transform:translateX(140px);
  }
  10% {
    transform:translateX(140px);
  }
  10% {
    transform:translateX(280px);
  }
  10% {
    transform:translateX(420px);
  }
   20% {
    transform:translateX(560px);
  }
   30% {
    transform:translateX(700px);
  }
   40% {
    transform:translateX(840px);
  }
  50% {
    transform:translateX(980px);
  }
  60% {
    transform:translateX(1120px);
  }
  70% {
    transform:translateX(1260px);
  }
  80% {
    transform:translateX(1400px);
  }
  90% {
    transform:translateX(1540px);
  }
  95% {
    transform:translateX(-700px);
  }
  95% {
    transform:translateX(-700px);
  }
  95% {
    transform:translateX(-700px);
  }
   96% {
    transform:translateX(-800px);
  }
  96% {
    transform:translateX(-800px);
  }
  96% {
    transform:translateX(-800px);
  }
}

.slides3{
  position:relative;
  width:100%;
  animation: glissetrois 25s infinite; /* animation anime ce qu'il y a dans le keyframes "glisse" durée 20s, à l'infini */
  height:210px;
  /*border:1px solid grey;*/
  z-index:10;
  margin-top:10px;
 
}

/* les keyframes permettent de donner un état au slide entre 0 et 100% suivant la durée de l'animation mise dans le slide */
@keyframes glissetrois {
  0% {
    transform:translateX(0);
  }
   10% {
    transform:translateX(-140px);
  }
  10% {
    transform:translateX(-140px);
  }
  10% {
    transform:translateX(-140px);
  }
   20% {
    transform:translateX(-280px);
  }
   30% {
    transform:translateX(-420px);
  }
   40% {
    transform:translateX(-560px);
  }
  50% {
    transform:translateX(-700px);
  }
  60% {
    transform:translateX(-840px);
  }
  70% {
    transform:translateX(-980px);
  }
  80% {
    transform:translateX(-1120px);
  }
  90% {
    transform:translateX(-1260px);
  }
  95% {
    transform:translateX(700px);
  }
  95% {
    transform:translateX(700px);
  }
  95% {
    transform:translateX(700px);
  }
   96% {
    transform:translateX(800px);
  }
  96% {
    transform:translateX(800px);
  }
  96% {
    transform:translateX(800px);
  }
}


.slides4{
  position:relative;
  width:100%;
  animation: glissequatre 20s infinite; /* animation anime ce qu'il y a dans le keyframes "glisse" durée 20s, à l'infini */
  height:210px;
  /*border:1px solid grey;*/
  z-index:10;
  margin-top:10px;
}

/* les keyframes permettent de donner un état au slide entre 0 et 100% suivant la durée de l'animation mise dans le slide */
@keyframes glissequatre {
  0% {
    transform:translateX(0px);
  }
  0% {
    transform:translateX(0px);
  }
  0% {
    transform:translateX(0px);
  }
   10% {
    transform:translateX(140px);
  }
  10% {
    transform:translateX(140px);
  }
  10% {
    transform:translateX(140px);
  }
  10% {
    transform:translateX(280px);
  }
  10% {
    transform:translateX(420px);
  }
   20% {
    transform:translateX(560px);
  }
   30% {
    transform:translateX(700px);
  }
   40% {
    transform:translateX(840px);
  }
  50% {
    transform:translateX(980px);
  }
  60% {
    transform:translateX(1120px);
  }
  70% {
    transform:translateX(1260px);
  }
  80% {
    transform:translateX(1400px);
  }
  90% {
    transform:translateX(1540px);
  }
  95% {
    transform:translateX(-700px);
  }
  95% {
    transform:translateX(-700px);
  }
  95% {
    transform:translateX(-700px);
  }
   96% {
    transform:translateX(-800px);
  }
  96% {
    transform:translateX(-800px);
  }
  96% {
    transform:translateX(-800px);
  }
}
/*AFFICHAGE ACCEUIL COMME NETFLIX FIN --------------------------------------------------------------------------------------------*/

/* RECHERCHE FILM UTILISATEUR DEBUT --------------------------------------------------------------------------------------------*/

#z_recherche_film {
 margin-left:30px;
  
}

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

div.elementsearch {
  margin: 5px;
  padding : 0px;
  width:140px;
  color:white;
  font-family:'Roboto';
  font-size:12px;
}

#t_ajoutfilm{
 
 border-spacing:100px;
 color:white;
  font-family:'Roboto';
  font-size:16px;
}

/* RECHERCHE FILM UTILISATEUR FIN --------------------------------------------------------------------------------------------*/

/* AFFICHAGE FILM UTILISATEUR DEBUT --------------------------------------------------------------------------------------------*/

div.gridsearch2 {
  width:100%;
  display : grid;
  grid-template-columns: repeat(10, 1fr);
  /*grid-template-rows: repeat(1, 280px);*/
 
}

div.elementsearch2 {
  margin: 5px;
  padding : 0px;
  width:140px;
  color:white;
  font-family:'Roboto';
  font-size:12px;
 }

a.decoration{
  text-decoration:none;
  color:white;
  font-family:'Roboto';
  font-size:12px;
}

/* RECHERCHE FILM UTILISATEUR FIN --------------------------------------------------------------------------------------------*/

/* AFFICHAGE FILM SAISON DEBUT --------------------------------------------------------------------------------------------*/

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

div.elementsearch3 {
  margin: 5px;
  padding : 0px;
  width:100px;
  color:white;
  font-family:'Roboto';
  font-size:12px;
 }

a.decoration{
  text-decoration:none;
  color:white;
  font-family:'Roboto';
  font-size:12px;
}

/* RECHERCHE FILM SAISON FIN --------------------------------------------------------------------------------------------*/

/* 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 */

/* STYLE AFFICHAGE FICHE FILM DEBUT -------------------------------------------------------------------------------------------*/
.ombre-img{
  border:1px solid grey; 
  filter: drop-shadow(3px 3px 6px #111);
}

.ombre-img2{
  border:1px solid grey; 
  filter: drop-shadow(3px 3px 6px #111);
  border-radius:20px;
}

.ombre-img3{
  border:1px solid grey; 
  filter: drop-shadow(3px 3px 6px #111);
  border-radius:10px;
}

.titre2 {
  color:white;
  font-style:Roboto;
  font-size:30px;
  filter: drop-shadow(1px 1px 2px #111);
}

.titre3 {
  color:white;
  font-style:Roboto;
  font-size:20px;
  filter: drop-shadow(1px 1px 2px #111);
}

.date {
  color:#444;
  font-style:Roboto;
  font-size:18px;
}

.date3 {
  color:#444;
  font-style:Roboto;
  font-size:14px;
}


.duree {
  color:#666;
  font-style:Roboto;
  font-size:15px;
}

.synopsis {
  color:white;
  font-style:Roboto;
  font-size:16px;
  filter: drop-shadow(1px 1px 1px #111);
}

.synopsis3 {
  color:white;
  font-style:Roboto;
  font-size:12px;
}


.real {
  color:#444;
  font-style:Roboto;
  font-size:15px;
}

.real2 {
  color:#666;
  font-style:Roboto;
  font-size:15px;
}

.acteur {
  color:#444;
  font-style:Roboto;
  font-size:11px;
}

.acteur2 {
  color:#444;
  font-style:Roboto;
  font-size:12px;
  max-width:100px;
}

.role_acteur {
  color:#666;
  font-style:Roboto;
  font-size:11px;
}

.video {
  color:#444;
  font-style:Roboto;
  font-size:12px;
  max-width:200px;
}

 
/* STYLE AFFICHAGE FICHE FILM FIN -------------------------------------------------------------------------------------------*/

/* MENU MARVEL ET TECHNOLOGIE DEBUT -------------------------------------------------------------------------------------------*/
.hmenu4{
  background: #666;
  border-bottom-left-radius:8px;
  border-bottom-right-radius:8px;
  border-bottom: 2px solid #19B3D3;
  box-shadow:5px 5px 8px #444;
  width:100%;
}

.marvelf {
  height:145px; 
  margin-left:170px;
}

.starwarsf {
  height:145px; 
  margin-left:100px;
}
/* MENU MARVEL ET TECHNOLOGIE FIN -------------------------------------------------------------------------------------------*/