.article {
  visibility: hidden;
}
.article:target {
  visibility: visible;
}
body {
  background-image: -webkit-linear-gradient(180deg, #574c76, #84b80a);
  background-image: linear-gradient(-90deg, #574c76, #84b80a);
  font-family: 'PT sans narrow';
  height: 100vh;
  overflow-x: hidden !important;
}
::-webkit-scrollbar-track {
  -webkit-box-shadow: inset 0 0 1px rgba(255,255,255,0.51);
  background-color: rgba(15,37,4,0.51);
  border-radius: 10px;
}
::-webkit-scrollbar {
  width: 5px;
  background-color: rgba(255,255,255,0.2);
}
::-webkit-scrollbar-thumb {
  border-radius: 10px;
  background-color: #111;
  background-image: -webkit-gradient(linear, 40% 0%, 75% 84%, from(#095d26), to(#5d07c0), color-stop(0.6, rgba(30,235,167,0.5)));
}
header {
  margin-bottom: 1vh;
  position: fixed;
  z-index: 2;
  top: 0;
  left: 0;
  width: 100%;
  background-image: -webkit-linear-gradient(135deg, #574c76, #6c9608);
  background-image: linear-gradient(-45deg, #574c76, #6c9608);
  border-bottom: 0.1vh solid #675a8c;
}
h4 {
  display: inline-block;
  text-align: left;
  padding-left: 3vw;
  color: rgba(129,202,136,0.7);
  font-size: 0.7em;
  line-height: 0.8;
}
b {
  color: #b5aad5;
  font-weight: normal;
  margin-left: 1.5vw;
  letter-spacing: 0.2vh;
}
em {
  font-style: italic;
}
i {
  color: #3e2a7e;
}
u {
  color: #6734f4;
  text-decoration: none;
}
hr {
  border: 0;
  height: 1px;
  background-image: -webkit-linear-gradient(left, rgba(0,0,0,0), rgba(255,255,240,0.45), rgba(0,0,0,0));
  background-image: linear-gradient(to right, rgba(0,0,0,0), rgba(255,255,240,0.45), rgba(0,0,0,0));
}
span {
  color: #7ccb92;
}
.modeemp {
  display: inline-block;
  text-align: right;
  font-size: 0.78em;
  float: right;
  margin-right: 1vw;
  color: #f00;
}
.retrait {
  margin-left: 9vw;
  text-indent: -1.2vw;
}
.stop:before {
  content: '📌 ';
  font-size: 0.6em;
}
.list {
  margin-top: 10vh;
  width: 20%;
  border-left: 0.1vh solid #fffff0;
  float: right;
  font-size: 0.7em;
  line-height: 1;
}
.list ul {
  list-style: none;
  text-align: left;
}
.list ul p {
  font-weight: normal;
  color: #8ccf93;
  text-shadow: 1px 1px 1px #666;
  padding: 1vh 3vw;
  line-height: 1.2;
}
.list ul li {
  padding: 1vh 3vw;
}
.list ul li:before {
  content: '◁         ';
  color: #fffff0;
  font-size: 0.7em;
  margin-left: -4vw;
}
.list ul li a {
  color: rgba(243,242,211,0.8);
  font-weight: normal;
  text-transform: none;
  text-decoration: none;
}
.list ul li a:hover {
  color: #99d6aa;
  text-decoration: none;
}
.list ul li a:active {
  color: #99d6aa;
  text-decoration: none;
}
.ref {
  font-size: 0.7em;
}
.content {
  float: left;
  width: 67vw;
  padding: 3vh 0 0 1vw;
  position: relative;
}
.article {
  width: 97%;
  font-size: 1em;
  position: absolute;
  margin-top: 4vh;
}
.article .chap1 {
  font-weight: normal;
  font-size: 0.6em;
  text-transform: none;
  color: #81ca88;
  margin: 8vh 0 0 2vw;
}
.article .chap1:before {
  content: 'Chapitre 1 ➛';
  color: #b7b162;
}
.article .chap1:after {
  content: 'Concernant l’offre cinématographique';
  color: #81ca88;
  font-style: italic;
}
.article .chap2 {
  font-weight: normal;
  font-size: 0.6em;
  text-transform: none;
  color: #81ca88;
  margin: 3vh 0 0 2vw;
}
.article .chap2:before {
  content: 'Chapitre 2 ➛';
  color: #b7b162;
}
.article .chap2:after {
  content: 'ZIC de Brest : réalité de l’exposition de la diversité des films';
  color: #81ca88;
  font-style: italic;
}
.article h3 {
  text-indent: -3vw;
  margin-left: 3vw;
  padding-top: 2vh;
  display: block;
  font-size: 0.8em;
  color: #6b4bc3;
}
.article h3:before {
  content: '▸  ';
  color: #dac758;
}
.article sup {
  font-size: 0.5em;
}
.article p {
  font-weight: normal;
  font-size: 1em;
  line-height: 1.2;
  color: #81ca88;
  text-shadow: 1px 1px 1px #888;
  text-align: justify;
  margin-left: 6vw;
  padding-top: 3vh;
  text-indent: 0px;
  width: 67vw;
  color: rgba(255,255,240,0.7);
}
.article p:first-child {
  margin-top: 3vh;
}
.article .focus {
  color: #c4b03b;
}
.article .zoom {
  color: #7ccb92;
}
.article .normal {
  color: rgba(255,255,240,0.7);
}
.article .sup {
  font-size: 0.7em;
  color: #81ca88;
}
.article .uppercase {
  text-transform: uppercase;
}
.article {
  opacity: 0;
  -webkit-transition: opacity 1s linear;
  transition: opacity 1s linear;
}
.article:target {
  opacity: 1;
}
iframe {
  width: 67vw;
  height: 85vh;
  border: 0;
  padding-top: 4vh;
  margin-left: 0vw;
}
.small {
  height: 25vh;
}
img {
  margin-top: 2%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  width: 67vw;
  margin-left: 10%;
  max-width: 600px;
}
.legend {
  padding-top: 1vh;
  font-size: 0.6em;
  font-style: italic;
  width: 70%;
  margin-left: 10%;
  max-width: 600px;
}
@media all {
  body {
    font-size: 5vw;
  }
}
@media all and (min-width: 401px) {
  body {
    font-size: 4vw;
  }
}
@media all and (min-width: 481px) {
  body {
    font-size: 3vw;
  }
}
@media all and (min-width: 850px) {
  body {
    font-size: 2.5vw;
  }
}
@media all and (min-width: 1000px) {
  body {
    font-size: 2.2vw;
  }
}
@-webkit-keyframes hue {
  to {
    -webkit-filter: hue-rotate(380deg) grayscale(0.5);
            filter: hue-rotate(380deg) grayscale(0.5);
  }
}
@keyframes hue {
  to {
    -webkit-filter: hue-rotate(380deg) grayscale(0.5);
            filter: hue-rotate(380deg) grayscale(0.5);
  }
}