@font-face
{
    font-family: "Sekuya-Regular";
    src: 
		url("polices/Sekuya-Regular.woff") format("woff");
}

@font-face
{
	font-family: "BebasNeue-Regular";
    src: 
		url("polices/BebasNeue-Regular.woff") format("woff");
}

@font-face
{
	font-family: "BBHHegarty-Regular";
    src: 
		url("polices/BBHHegarty-Regular.woff") format("woff");
}

@font-face
{
	font-family: "Pacifico-Regular";
    src: 
		url("polices/Pacifico-Regular.woff") format("woff");
}

@font-face
{
    font-family: "ChangaOne-Regular";
    src: 
		url("polices/ChangaOne-Regular.woff") format("woff");
}

@font-face
{
    font-family: "Ramabhadra-Regular";
    src: 
		url("polices/Ramabhadra-Regular.woff") format("woff");
}

body {
    margin: 0;
    background: rgba(93, 94, 96, 0.85);
    background-size: 200% 200%;
    color: #1E0F1C;
}

header {
    background: rgba(78,78,79,0.65);
    padding: 1em 0;
    opacity: 100;
}

/*Barre de navigation*/

.navaccueil {
  list-style-type: none;
  margin: 0;
  width: 7em;
  background-color: rgba(78,78,79,0.65);
  height: 65em;
  overflow: auto;
  font-size: 1.5em;
  line-height: 1.7em;
  float: left;
  justify-content: center;
  text-decoration: none;
  font-weight: 600;
  position: relative;
}

.navprogramme {
  list-style-type: none;
  margin: 0;
  width: 7em;
  background-color: rgba(78,78,79,0.65);
  height: 76em;
  overflow: auto;
  font-size: 1.5em;
  line-height: 1.7em;
  float: left;
  justify-content: center;
  text-decoration: none;
  font-weight: 600;
  position: relative;
}

.navtarif {
  list-style-type: none;
  margin: 0;
  width: 7em;
  background-color: rgba(78,78,79,0.65);
  height: 31em;
  overflow: auto;
  font-size: 1.5em;
  line-height: 1.7em;
  float: left;
  justify-content: center;
  text-decoration: none;
  font-weight: 600;
  position: relative;
}

.activenav{
	color: #007BFF;
	font-weight: bolder;
	font-size: 1.7em;
	font-family: "BebasNeue-Regular";
}

.sourisnav:hover {
	color: #8CC4FF;
	font-size: 1.7em;
}

.sourisnav2:hover {
	color: #8CC4FF;
}
.boxnav{
	text-decoration: none;
	color: white;
	font-family: "BebasNeue-Regular";
	font-size: 1.5em;
}


/*Box*/

.decale {
    margin-left: 11em;
}

.card {
    background: rgba(32,37,36,0.75);
    border-radius: 1em;
    padding: 3em;
    margin: 4em auto;
    width: 70%;
	min-width: 70%;
    transform-origin: top;
}

.cardtarif {
    background: rgba(32,37,36,0.75);
    border-radius: 1em;
    padding: 1em;
    margin: 1em auto;
    width: 10em;
	height: 20em;
    transform-origin: top;
}

.cardprogramme {
    background: rgba(32,37,36,0.75);
    border-radius: 1em;
    padding: 1em;
    margin: 1em auto;
    width: 70em;
	height: 20em;
    transform-origin: top;
}

.layout {
  display: flex;
  gap: 4em;
}

.block {
  flex: 1;
}

.block.small {
  flex: 0.4; 
}


/*Textes*/

h1 {
    text-align: center;
    font-size: 2.7em;
    margin-top: 1em;
    font-weight: 700;
    opacity: 100;
	text-decoration-line: underline;
	text-decoration-color: black;  
}

h2 {
	text-align: center;
    margin-top: 0em;
    margin-bottom: 0.5em;
    font-size: 1.6em;
    font-weight: 600;
    color: #ffff;
    position: relative;
	text-decoration-line: underline;
	text-decoration-color: aqua;
	font-family: "Sekuya-Regular", serif;
	font-variant: small-caps;
	font-size: 3em;
	font-style: normal;
}

h3 {
	text-align: center;
    margin-top: 0.2em;
    margin-bottom: 1.5em;
    font-size: 1.6em;
    font-weight: 600;
    color: #ffff;
    position: relative;
	text-decoration-line: underline;
	text-decoration-color: green;
	font-family: "BBHHegarty-Regular";
	font-variant: small-caps;
	font-size: 3em;
	font-style: normal;
}

.titre{
	color: #fff;
    text-shadow:
      0 0 1em #FF7171,
      0 0 1em #FF7171,
      0 0 1em #FF7171,
      0 0 1em #FF0000,
      0 0 1em #FF0000,
      0 0 1em #FF0000,
      0 0 1em #FF0000,
      0 0 1em #FF0000;
	text-decoration: underline;
	font-family: "Pacifico-Regular";
	margin-left: 3em;
}

.film-text {
  position: absolute;
  bottom: 1em;
  left: 50%;
  transform: translateX(-50%);
  background: rgba(0, 0, 0, 0.65);
  color: white;
  padding: 1em 2em;
  border-radius: 1em;
  font-size: 1em;
  text-align: center;
  pointer-events: none;
}

.moyendepaiement{
	font-size: 1em;
	text-align: left;
    margin-top: 2em;
    margin-bottom: 0em;
    font-weight: 600;
    color: #ffff;
    position: relative;
	text-decoration: none;
	font-family: sans-serif;
	font-variant: normal;
	font-style: normal;
}

.tariftexte {
	text-align: center;
    margin-top: 0em;
    margin-bottom: 0.5em;
    font-size: 1.6em;
    font-weight: 600;
    color: #ffff;
    position: relative;
	text-decoration: underline;
	text-decoration-color: white;
	font-family: fantasy;
	font-variant: small-caps;
	font-size: 3em;
	font-style: normal;
}

.tarifprix {
	text-align: center;
    margin-top: 0em;
    margin-bottom: 0.5em;
    font-weight: 600;
    color: #ffff;
    position: relative;
	text-decoration: none;
	text-decoration-color: white;
	font-family: fantasy;
	font-variant: small-caps;
	font-size: 2.5em;
	font-style: normal;
	border-top-style: solid;
	border-top-color: white;
}

.tarifinfo {
	text-align: center;
    margin-top: 0em;
    margin-bottom: 0.5em;
    font-weight: 600;
    color: #ffff;
    position: relative;
	font-variant: small-caps;
	font-size: 1.2em;
	font-style: normal;
	border-top-style: solid;
	border-top-color: white;
}

.programmetexte {
	text-align: center;
    margin-top: 4em;
    margin-bottom: 4em;
    font-weight: 600;
    color: #ffff;
	text-decoration: none;
	font-family: "ChangaOne-Regular";
	font-variant: small-caps;
	font-size: 2em;
	font-style: normal;
	padding: 1em;
}

.programmetab {
	text-align: center;
    margin-top: 1em;
    margin-bottom: 1em;
    font-weight: 600;
    color: #E793E3;
	text-decoration: underline;
	text-decoration-color: #E793E3;
	font-family: "Ramabhadra-Regular";
	font-variant: small-caps;
	font-size: 2em;
	font-style: normal;
	padding: 1em;
}


/*Informations bloc dernière bande annonce*/

.infofilm{
	color: #ECECEC;
	font-family: Georgia;
	text-decoration: none;
	margin-top: 0em;
    margin-bottom: 1em;
	font-size: 2.5em;
}

.production{
	font-size: 2em;
	text-align: center;
    margin-top: 0em;
    margin-bottom: 0em;
    font-weight: 600;
    color: #ffff;
    position: relative;
	text-decoration: none;
	font-family: serif;
	font-variant: small-caps;
	font-style: normal;
}

.genre{
	font-size: 1.5em;
	text-align: center;
    margin-top: 2em;
    margin-bottom: 0em;
    font-weight: 600;
    color: #ffff;
    position: relative;
	text-decoration: none;
	font-family: sans-serif;
	font-variant: normal;
	font-style: normal;
}

.resume{
	font-size: 2em;
	text-align: center;
    margin-top: 2em;
    margin-bottom: 0em;
    font-weight: 600;
    color: #ffff;
    position: relative;
	text-decoration: none;
	font-family: monospace;
	font-variant: normal;
	font-style: normal;
}



table {
  font-family: arial, sans-serif;
  border-collapse: collapse;
  width: 100%;
}

td, th {
  text-align: center;
  padding: 1em;
}

.center {
  display: block;
  margin-left: auto;
  margin-right: auto;
  width: 100%;
}

nav {
    display: inline-block;
    text-align: center;
    width: 100%;
}

nav.center {
  display: flex;
  justify-content: center;
  gap: 2em;
  flex-wrap: wrap;
}


.video{
	border: 0.5em solid black;
	border-radius: 1em;
}

.film {
  position: relative;
  display: inline-block;
  margin: 1em;
}

.image {
  width: 12em;
  border-radius: 1em;
  display: block;
}


/* Responsive*/

@media screen and (max-width: 1200px) {

body {
  font-size: 14px;
}

header {
  padding: 0.5em 0;
}

.navaccueil {
  width: 100%;
  height: auto;
  float: none;
  display: flex;
  justify-content: space-around;
  align-items: center;
  padding: 0.5em 0;
  font-size: 1.2em;
}

.navprogramme {
  width: 100%;
  height: auto;
  float: none;
  display: flex;
  justify-content: space-around;
  align-items: center;
  padding: 0.5em 0;
  font-size: 1.2em;
}


.navtarif {
  width: 100%;
  height: auto;
  float: none;
  display: flex;
  justify-content: space-around;
  align-items: center;
  padding: 0.5em 0;
  font-size: 1.2em;
}

.navaccueil li {
  display: inline-block;
}

.navprogramme li {
  display: inline-block;
}

.navtarif li {
  display: inline-block;
}

.boxnav {
  font-size: 1.2em;
}

.activenav {
  font-size: 1.2em;
}

.decale {
  margin-left: 0;
}

.card {
  width: 90%;
  min-width: unset;
  padding: 1.5em;
  margin: 2em auto;
}

.cardprogramme {
  width: 90%;
  min-width: unset;
  padding: 1.5em;
  margin: 2em auto;
}

.cardtarif {
  width: 90%;
  min-width: unset;
  padding: 1.5em;
  margin: 2em auto;
}

.layout {
  flex-direction: column;
  gap: 2em;
}

.block.small {
  flex: 1;
}

.video {
 width: 100%;
 height: auto;
  }

h1 {
  font-size: 2em;
}

h2 {
  font-size: 2em;
}

h3 {
  font-size: 1.8em;
}

.infofilm {
  font-size: 1.8em;
}

.production {
  font-size: 1.5em;
}

.genre {
  font-size: 1.2em;
}

.resume {
  font-size: 1.3em;
}

nav.center {
  flex-direction: column;
  gap: 1.5em;
}

.image {
  width: 80%;
  margin: auto;
}

.film-text {
  font-size: 0.9em;
  padding: 0.5em 1em;
}

table {
  font-size: 0.9em;
}

.programmetexte {
	text-align: center;
    margin-top: 4em;
    margin-bottom: 4em;
    font-weight: 600;
    color: #ffff;
	text-decoration: none;
	font-variant: small-caps;
	font-size: 1.5em;
	font-style: normal;
	padding: 1em;
}

.programmetab {
	text-align: center;
    margin-top: 1em;
    margin-bottom: 1em;
    font-weight: 600;
    color: #E793E3;
	text-decoration: underline;
	text-decoration-color: #E793E3;
	font-variant: small-caps;
	font-size: 1.2em;
	font-style: normal;
	padding: 1em;
}

.titre {
	margin-left: 0em;
}
}