@import url(http://fonts.googleapis.com/css?family=Cinzel+Decorative|Forum&subset=latin,latin-ext);
@import url(http://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,400,300,600,700&subset=latin,latin-ext);
@import url(http://fonts.googleapis.com/css?family=Alegreya+Sans:100,300,400,500,300italic,100italic,400italic,500italic&subset=latin,latin-ext);
@import url(http://fonts.googleapis.com/css?family=Roboto:400,100,300&subset=latin,latin-ext);
@import url(http://fonts.googleapis.com/css?family=Poiret+One&subset=latin,latin-ext);
* {
  margin: 0;
  padding: 0;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
[draggable] {
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
  -webkit-user-drag: element;
  -moz-user-drag: element;
  user-drag: element;
}
body {
  min-height: 100vh;
}
body:not(.visionneuse) {
  background-color: #3d3c49;
}
body:not(.visionneuse) .navbar {
  margin-bottom: 0;
}
body.visionneuse {
  height: 100vh;
  overflow: hidden;
}
button.boutonJaiCompris {
  color: white;
  background-color: #57b76e;
  border: 2px solid white;
  padding: 4px 6px;
  font-weight: bold;
}
.afficherChardin {
  position: absolute;
  top: 0;
  right: 0;
  width: 2em;
  flex-basis: 2em;
  height: 2em;
  border: 2px solid transparent;
  margin-right: 10px;
  font-size: 1.2em;
  font-weight: bold;
  line-height: 1em;
  box-shadow: 0 0 1px 0px rgba(0, 0, 0, 0);
  transition: border-radius 0.4s, background-color 0.4s, border-color 0.4s, box-shadow 0.4s;
  color: #676565;
  border-radius: 1em;
  background-color: rgba(255, 255, 255, 0.3);
  border-color: #666666;
}
.afficherChardin:hover {
  border-radius: 0px;
  background-color: rgba(0, 0, 0, 0.3);
  background-color: rgba(100, 148, 237, 0.45);
  border-color: lightgrey;
  border-color: cornflowerblue;
  box-shadow: 0 0 8px -1px rgba(0, 0, 0, 0.4);
  color: white;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.7);
}
.afficherChardin:active {
  transition-duration: 0s;
  background-color: orange;
  border-color: white;
  color: white;
}
button:disabled {
  color: grey;
}
.navbar {
  box-shadow: 0 0 4px 0px rgba(0, 0, 0, 0.4);
  border-radius: 0;
  border-top-width: 0;
  border-left-width: 0;
  border-right-width: 0;
}
.navbar .navbar-brand {
  color: #333333;
}
.navbar .initiale {
  color: crimson;
}
.modeEditionAvertissement {
  background-image: repeating-linear-gradient(45deg, yellow 0px, yellow 5px, black 5px, black 10px);
}
.modeEditionAvertissement span {
  background-color: yellow;
  color: black;
  font-weight: bold;
}
.texte-accueil {
  color: white;
  padding: 1em 0;
  font-size: 1.5em;
  font-family: Arial;
}
.titre-section {
  margin-bottom: .5em;
  font-family: "Cinzel-Decorative";
  font-family: "Open Sans";
  font-family: "Alegria Sans";
  font-family: Roboto;
  font-family: 'Poiret One';
  font-size: 4em;
  text-align: center;
  color: #303030;
  font-weight: 100;
}
.degrade {
  height: 40px;
  width: 100%;
  right: 10px;
  position: absolute;
  bottom: 0px;
  margin-bottom: 0;
  pointer-events: none;
  background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, white 80%);
}
.total {
  overflow: hidden;
  background-color: white;
  background-image: linear-gradient(to bottom, white 0%, #dcdcdc 80%, #fafafa 100%);
}
.manuscrit,
.infos {
  transition: all 1s;
}
.manuscrits {
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
.infos {
  /*overflow: hidden;*/
  position: relative;
  z-index: 4;
  background-color: white;
  margin: 0 10px 1em 0;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  transform: translateZ(0px);
  border: 1px solid #d9d9d9;
  border-bottom-width: 2px;
  border-top-width: 0;
  border-radius: 3px;
  transition: flex 1s;
}
.infos > * {
  /*padding: 1px 10px;*/
}
.infos h1 {
  color: white;
  text-align: left;
  font-family: "Poiret One";
  font-size: 1.9em;
  line-height: 1.3em;
  font-weight: 400;
  background-color: #e09200;
  margin-top: 0;
  margin-bottom: 0;
  padding-left: 10px;
}
.infos .boutons {
  display: flex;
  flex-shrink: 0;
  height: calc(2em + 14px);
  overflow: hidden;
  transition: height .5s 1s;
}
.infos .boutons button {
  flex: 1 1 auto;
  font-family: Roboto;
  font-size: 1em;
  line-height: 2em;
  font-weight: normal;
  float: left;
  padding: 7px 6px;
  color: white;
  background-color: #1e2d39;
  cursor: pointer;
  border: none;
  outline: none;
  border-right: 1px solid #152028;
}
.infos .boutons button:first-of-type {
  border-left: 1px solid #152028;
}
.infos .boutons button:hover {
  background-color: #49a0df;
}
.infos .tiroir .voletGauche {
  position: relative;
}
.infos .tiroir .voletGauche .ascenseur {
  position: relative;
  overflow-y: auto;
  padding: 10px 10px 40px 10px;
}
.infos .tiroir .voletGauche .ascenseur::-webkit-scrollbar {
  width: 10px;
  cursor: pointer;
}
.infos .tiroir .voletGauche .ascenseur::-webkit-scrollbar-thumb {
  border-radius: 2px;
  background: rgba(160, 160, 160, 0);
}
.infos .tiroir .voletGauche .ascenseur::-webkit-scrollbar-thumb:hover {
  background: #969696 !important;
}
.infos .tiroir .voletGauche .ascenseur::-webkit-scrollbar-thumb:active {
  background: #646464 !important;
}
.infos .tiroir .voletGauche .ascenseur:hover::-webkit-scrollbar-thumb {
  background: rgba(120, 120, 120, 0.4);
}
.infos .tiroir .voletGauche .ascenseur::-webkit-scrollbar-track {
  background: transparent;
}
.infos .tiroir .voletGauche .ascenseur::-webkit-scrollbar-thumb:window-inactive {
  background: transparent;
}
.infos .tiroir .voletGauche .ascenseur img {
  width: 100%;
  height: 300px;
  object-fit: cover;
}
.infos .tiroir .voletGauche .ascenseur h2 {
  color: #3c3d48;
  background-color: #ededed;
  font-size: 1.2em;
  font-style: italic;
  margin-bottom: 8px;
}
.infos .tiroir .voletGauche .ascenseur:hover .paragraphes p a {
  background-color: #e09200;
}
.infos .tiroir .voletGauche .ascenseur .paragraphes {
  color: #152028;
}
.infos .tiroir .voletGauche .ascenseur .paragraphes p {
  margin-bottom: 1em;
  text-align: justify;
}
.infos .tiroir .voletGauche .ascenseur .paragraphes p:last-child {
  margin-bottom: 0;
}
.infos .tiroir .voletGauche .ascenseur .paragraphes p a,
.infos .tiroir .voletGauche .ascenseur .paragraphes p a:active {
  color: white;
  font-weight: 600;
  padding: 0 2px;
  padding: 0 1ch;
  text-decoration: none;
  background-color: #e3ba6d;
  border-radius: 2px;
  transition: background-color 0.4s;
}
.infos .tiroir .voletGauche .ascenseur .paragraphes p a:hover,
.infos .tiroir .voletGauche .ascenseur .paragraphes p a:active:hover {
  text-decoration: underline;
}
.infos .tiroir .voletGauche .ascenseur ul {
  list-style-type: none;
}
.infos .tiroir .infosAvancees {
  transition: transform 1s;
  perspective: 1200px;
  perspective-origin: left center;
}
.infos .tiroir .infosAvancees .fixedWidth {
  transform: rotate3d(0, 1, 0, 90deg);
  opacity: 0;
  transform-origin: 0% center;
  backface-visibility: hidden;
  transition: transform 1s, opacity 1s;
}
.infos .tiroir .infosAvancees .conteneur {
  border-left: 1px dashed lightgray;
}
.onglets {
  background-color: #f0f0f0;
}
.onglets .separateur {
  position: relative;
  z-index: 3;
  height: 1.7em;
  width: 1px;
  background-color: gray;
  align-self: center;
}
.onglets .onglet {
  position: relative;
  z-index: 2;
  flex-grow: 1;
}
.onglets .onglet:hover {
  background-color: lightgray;
  background-color: #e3e3e3;
}
.onglets .onglet .titre {
  text-align: center;
  font-family: Roboto;
  font-size: 1em;
  line-height: 2em;
  font-weight: normal;
  padding: 7px 6px;
  padding-bottom: 3px;
  color: #152028;
  cursor: pointer;
}
.onglets .onglet .lumiere {
  height: 4px;
}
.onglets .onglet .lumiere.courant {
  background-color: #e09200;
}
.total .manuscrit {
  display: flex;
  flex: 3 1 0px;
  align-self: stretch;
}
.total .infos {
  flex: 1 1 0px;
  display: flex;
  flex-direction: column;
}
.total .infos .tiroir {
  flex: 1 1 auto;
  display: flex;
  flex-direction: row;
}
.total .infos .tiroir .voletGauche {
  display: flex;
  flex-direction: column;
  flex: 0 0 25vw;
  align-items: stretch;
}
.total .infos .tiroir .infosAvancees {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
}
.total .infos .tiroir .infosAvancees .fixedWidth {
  min-width: calc(40vw);
  flex: 1 0 calc(41.66666667vw);
}
.total .infos .tiroir .infosAvancees .fixedWidth .onglets {
  display: flex;
  flex-shrink: 0;
}
.descriptionLarge .manuscrit:hover svg {
  min-width: 25vw;
}
.descriptionLarge .infos {
  flex: 6 1 0px;
}
.descriptionLarge .infos .infosAvancees .fixedWidth {
  transform: rotate3d(0, 1, 0, 0deg);
  opacity: 1;
}
.fullscreen-mixin {
  padding: 10px;
}
.fullscreen-mixin .manuscrit {
  opacity: 0;
}
.fullscreen-mixin .infos {
  flex-shrink: 0;
  flex-basis: 100%;
  margin: 0;
  transition-delay: 1.2s;
}
.fullscreen-mixin .infos .boutons {
  height: 0;
  transition: height .5s 2s;
}
.fullscreen-mixin .infosAvancees .fixedWidth {
  opacity: 1;
  transition: opacity 1s 2s;
  transform: rotate3d(0, 1, 0, 0deg);
}
.total:-webkit-full-screen {
  padding: 10px;
}
.total:-webkit-full-screen .manuscrit {
  opacity: 0;
}
.total:-webkit-full-screen .infos {
  flex-shrink: 0;
  flex-basis: 100%;
  margin: 0;
  transition-delay: 1.2s;
}
.total:-webkit-full-screen .infos .boutons {
  height: 0;
  transition: height .5s 2s;
}
.total:-webkit-full-screen .infosAvancees .fixedWidth {
  opacity: 1;
  transition: opacity 1s 2s;
  transform: rotate3d(0, 1, 0, 0deg);
}
.total:-moz-full-screen {
  padding: 10px;
}
.total:-moz-full-screen .manuscrit {
  opacity: 0;
}
.total:-moz-full-screen .infos {
  flex-shrink: 0;
  flex-basis: 100%;
  margin: 0;
  transition-delay: 1.2s;
}
.total:-moz-full-screen .infos .boutons {
  height: 0;
  transition: height .5s 2s;
}
.total:-moz-full-screen .infosAvancees .fixedWidth {
  opacity: 1;
  transition: opacity 1s 2s;
  transform: rotate3d(0, 1, 0, 0deg);
}