/* Mise en page modernisée de www.reopen911.info (archive statique) — chargée après les feuilles d'origine.
   --u : valeur d'1 px du gabarit d'origine (1000 px de large) ; --t : coefficient des tailles de texte ;
   --h : coefficient des hauteurs fixes des blocs de texte. */

:root { --u: 1px; --t: 1.3; --h: 1.8; }
@media (min-width: 768px)  { :root { --u: min(1px, calc((100vw - 32px) / 1000)); --t: 1.09; --h: 1.3; } }
@media (min-width: 1024px) { :root { --u: min(1.3px, calc((100vw - 48px) / 1000)); --t: 1.12; --h: 1.15; } }
@media (min-width: 1280px) { :root { --t: 1.18; --h: 1.2; } }
@media (min-width: 1600px) { :root { --t: 1.24; --h: 1.25; } }

#container { min-width: 0; }
#footer { width: calc(1000 * var(--u)); }
.page, div.entry { line-height: 1.55; }

/* Menu : hauteur et interligne suivent la taille du texte */
div#mainmenu { height: calc(26px * var(--t)); }
.nav li a span { line-height: calc(16px * var(--t)); }

/* Bandeau : image de 1000 px centrée sur la bande noire (diaporama Nivo réduit à un fond fixe) */
#sitename { background-position: center top !important; background-color: #000; }
#sitename .nivo-slice, #sitename .nivo-box { display: none !important; }
#sitename img.nivo-main-image { width: auto !important; max-width: 100%; margin: 0 auto; }
#sitename img { display: block; max-width: 100%; height: auto; margin: 0 auto; }

/* Dégradés : les images d'origine (25 px de haut, 265 ou 380 px de large) refaites en CSS pour suivre
   la taille des blocs agrandis ; mêmes couleurs, relevées sur les images */
div#mainmenu, .nav li li a:hover { background-image: linear-gradient(#5f5f5f, #292929); }
.hometitle, .pagetitle,
.numblocs a:hover, .listblocs a:hover { background-image: linear-gradient(#878787, #4b4b4b); }
.numblocs .highlight, .listblocs .highlight, .jcarousel-control a,
#page_ptessentiels .ptbloc h3 span.numero { background-image: linear-gradient(#5f5f5f, #292929); }
div#toolbar { background-image: linear-gradient(#ced2d5, #eceff1 45%, #e0e3e6); }
#videos-essentielles-title, .video-bloc .video-title {
  background-image: linear-gradient(#f7f7f7, #d7d7d7); background-size: 100% 50px;
}
.video-bloc-4 .video-content, .video-bloc .video-content {
  background-image: linear-gradient(#e0e0e0, #f8f8f8); background-size: 100% 105px;
}

/* Colonnes du gabarit (largeurs écrites dans les pages) ; disposition fixe : un contenu trop large
   ne pousse plus les colonnes hors de l'écran */
#wrap > table, .indexcontent > table { table-layout: fixed; width: 100%; }
#wrap td[style*="width:195px"] { width: calc(195 * var(--u)) !important; }
.indexcontent td[style*="375px"] { width: calc(375 * var(--u)) !important; }

#leftside, #rightside { width: calc(175 * var(--u)); }

/* Bloc « Vidéos essentielles » de l'accueil : lecteur à la largeur du bloc */
.video-bloc-4 video, .video-bloc-4 iframe { width: 100%; height: auto; aspect-ratio: 370 / 300; }
#videos-essentielles-title { width: 100%; }

/* Contenus plus larges que leur colonne */
.content img, .content video, .content iframe, .content object, .content embed,
#rightside img { max-width: 100%; }
.content img { height: auto; }
.content table { max-width: 100%; }
.content { overflow-wrap: break-word; }

/* ------------------------------------------------------------------ smartphone */
@media (max-width: 767px) {
  body { overflow-x: clip; }
  #container, #footer { width: auto !important; }

  /* Bandeau mis à l'échelle de l'écran */
  #sitename { height: auto !important; aspect-ratio: 5 / 1; background-size: contain !important; }

  /* Menu : les entrées passent à la ligne */
  div#mainmenu { height: auto; }
  #mainmenu ul.nav { float: none; display: flex; flex-wrap: wrap; justify-content: center; }
  #mainmenu .nav li { float: none; }

  /* Tableau de mise en page → une seule colonne, colonne de droite sous le contenu */
  #wrap > table, #wrap > table > tbody, #wrap > table > tbody > tr, #wrap > table > tbody > tr > td,
  .indexcontent > table, .indexcontent > table > tbody, .indexcontent > table > tbody > tr,
  .indexcontent > table > tbody > tr > td {
    display: block; width: auto !important; padding-left: 0 !important; padding-right: 0 !important;
  }
  #wrap td[style*="width:195px"], .indexcontent td[style*="375px"] { width: auto !important; }
  #rightside { float: none; width: auto; text-align: center; }
  .content, .contentalt { padding: 12px; }
  /* Texte justifié sur une colonne étroite : grands blancs entre les mots */
  .content [style*="justify"], .content [align="justify"] { text-align: left !important; }

  /* Blocs à hauteur ou largeur fixe de l'accueil et des vidéos */
  .video-bloc-4, .video-bloc, .video-bloc-4 .video-vignette, .video-bloc .video-vignette,
  #videos-essentielles-title, .video-bloc .video-title { width: auto !important; height: auto !important; }
  .video-bloc-4 .video-content, .video-bloc .video-content { width: auto !important; height: auto !important; }
  .jcarousel-skin-tango .jcarousel-container-horizontal,
  .jcarousel-skin-tango .jcarousel-clip-horizontal,
  .jcarousel-skin-tango .jcarousel-item { width: calc(100vw - 48px) !important; }
  /* (jCarousel ne compte pas la marge entre les éléments quand leur largeur vient de la feuille) */
  .jcarousel-skin-tango .jcarousel-item-horizontal { margin-right: 0 !important; }

  /* Pied de page en une colonne */
  #footer1, #footer2, #footer3 { float: none; width: auto !important; padding: 10px 15px 0; }
  #footer .pagination { overflow: hidden; }
  #footer-credit { width: auto !important; padding: 10px 15px; }

  .content img[align="left"], .content img[align="right"] { max-width: 45%; }
}

/* --- Généré par moderniser.py à partir de : css/main2.css, css/video.css, css/superfish.css, css/jcaroussel.css --- */
body { font-size: calc(11px * var(--t)); }
input, textarea, select { font-size: calc(11px * var(--t)); }
h1 { font-size: calc(16px * var(--t)); }
h2 { font-size: calc(14.67px * var(--t)); }
h3 { font-size: calc(13.33px * var(--t)); }
html, body { font-size: calc(11px * var(--t)); }
.numblocs a { font-size: calc(11px * var(--t)); }
.listblocs a { font-size: calc(10.67px * var(--t)); }
.blocjaune .ctrl { font-size: calc(11px * var(--t)); }
.hometitle a , .pagetitle a { font-size: calc(12px * var(--t)); }
div#news1 h3 { font-size: calc(21.33px * var(--t)); }
.content h1, .content h2, .contentalt h1,.contentalt h2 { font-size: calc(18px * var(--t)); }
.page { font-size: calc(12px * var(--t)); }
.date { font-size: calc(11px * var(--t)); }
div.entry { font-size: calc(12px * var(--t)); }
.toolbarblock a { font-size: calc(11px * var(--t)); }
#footer { font-size: calc(12px * var(--t)); }
#footer-credit { font-size: calc(11px * var(--t)); }
#commentform label { font-size: calc(10px * var(--t)); }
#commentform input.field1 { font-size: calc(13.33px * var(--t)); }
#commentform #comment { font-size: calc(13.33px * var(--t)); }
.cleaner { font-size: calc(1px * var(--t)); }
.reopen911news .date { font-size: calc(11px * var(--t)); }
.bloc h4 { font-size: calc(12px * var(--t)); }
.categorie h3 { font-size: calc(14px * var(--t)); }
ul.tabbernav li a { font-size: calc(13.33px * var(--t)); }
.tooltip2 { font-size: calc(12px * var(--t)); }
#ptsessentiels1 h4 { font-size: calc(13px * var(--t)) !important; }
#ptsessentiels h4 { font-size: calc(13px * var(--t)) !important; }
#page_ptessentiels .ptbloc h3 { font-size: calc(16px * var(--t)); }
#page_ptessentiels .ptbloc h3 span.titre { font-size: calc(15px * var(--t)); }
#page_ptessentiels .ptbloc h3 span.numero { font-size: calc(16px * var(--t)); }
#page_ptessentiels .ptbloc p { font-size: calc(13px * var(--t)); }
#sidebar_pointscles p { font-size: calc(12px * var(--t)); }
#carousel_pointscles .pointcle h2 { font-size: calc(13px * var(--t)); }
.required-fields { font-size: calc(11px * var(--t)); }
#accordion h2 { font-size: calc(14px * var(--t)); }
ul#categories-list li { font-size: calc(13.33px * var(--t)); }
table.bloc_info { font-size: calc(10.67px * var(--t)); }
.video-bloc h4 { font-size: calc(12px * var(--t)); }
.video-bloc-2 h3 { font-size: calc(12px * var(--t)); }
div.date span.mois { font-size: calc(9px * var(--t)); }
div.date span.jour { font-size: calc(20px * var(--t)); }
div.date p span.annee { font-size: calc(9px * var(--t)); }
.video-bloc-3 h4 { font-size: calc(12px * var(--t)); }
.video-bloc-4 h4 { font-size: calc(12px * var(--t)); }
#video h2 { font-size: calc(14px * var(--t)); }
#video h2 { font-size: calc(14px * var(--t)); }
.nav li a span { font-size: calc(13px * var(--t)); }
.nav li li a span { font-size: calc(11px * var(--t)); }
#container { width: calc(1000 * var(--u)); }
.listblocs a { width: calc(440 * var(--u)); }
#footer { width: calc(1000 * var(--u)); }
#footer1 { width: calc(340 * var(--u)); }
#footer2 { width: calc(340 * var(--u)); }
#footer3 { width: calc(255 * var(--u)); }
#simplemodal-container { width: calc(480 * var(--u)); }
.form-errors { width: calc(570 * var(--u)); }
#ptsessentiels1 .jcarousel-item { width: calc(375 * var(--u)); }
#ptsessentiels1 .jcarousel-clip-horizontal { width: calc(375 * var(--u)); }
#ptsessentiels1 .jcarousel-container-horizontal { width: calc(375 * var(--u)); }
#ptsessentiels .jcarousel-item { width: calc(300 * var(--u)); }
#ptsessentiels .jcarousel-clip-horizontal { width: calc(300 * var(--u)); }
#ptsessentiels .jcarousel-container-horizontal { width: calc(300 * var(--u)); }
#page_ptessentiels #ptsessentiels1 ul li { width: calc(365 * var(--u)); }
#page_pointcle { width: calc(650 * var(--u)); }
#carousel_pointscles_container { width: calc(685 * var(--u)); }
#carousel_pointscles { width: calc(685 * var(--u)); }
.myform { width: calc(400 * var(--u)); }
.myform input, .myform textarea, .myform select { width: calc(380 * var(--u)); }
.video-bloc { width: calc(265 * var(--u)); }
.video-bloc .video-title { width: calc(265 * var(--u)); }
.video-bloc .video-vignette { width: calc(265 * var(--u)); }
.video-bloc .video-content { width: calc(255 * var(--u)); }
.video-bloc-4 { width: calc(370 * var(--u)); }
#videos-essentielles-title { width: calc(370 * var(--u)); }
.video-bloc-4 .video-vignette { width: calc(370 * var(--u)); }
.video-bloc-4 .video-content { width: calc(360 * var(--u)); }
.jcarousel-skin-tango .jcarousel-container-horizontal { width: calc(358 * var(--u)); }
.jcarousel-skin-tango .jcarousel-clip-horizontal { width: calc(358 * var(--u)); }
.jcarousel-skin-tango .jcarousel-item { width: calc(358 * var(--u)); }
#commentform #comment { height: calc(160px * var(--h)); }
#carousel-reopen911news .bloc { height: calc(285px * var(--h)); }
#carousel-reopen911news .jcarousel-clip-horizontal, #carousel-reopen911news .jcarousel-item { height: calc(315px * var(--h)); }
.tabberlive#tab2 .tabbertab { height: calc(200px * var(--h)); }
.tooltip2 { height: calc(170px * var(--h)); }
#ptsessentiels1 { height: calc(280px * var(--h)); }
#ptsessentiels1 .bloc { height: calc(240px * var(--h)); }
#ptsessentiels1 .jcarousel-item { height: calc(265px * var(--h)) !important; }
#ptsessentiels1 .jcarousel-clip-horizontal { height: calc(265px * var(--h)) !important; }
#ptsessentiels .jcarousel-item { height: calc(320px * var(--h)) !important; }
#ptsessentiels .jcarousel-clip-horizontal { height: calc(320px * var(--h)) !important; }
#ptsessentiels .bloc { height: calc(257px * var(--h)); }
#carousel_pointscles_container { height: calc(220px * var(--h)); }
#carousel_pointscles .pointcle { height: calc(200px * var(--h)); }
.video-bloc-4 { height: calc(535px * var(--h)); }
.jcarousel-list li, .jcarousel-item { height: calc(150px * var(--h)); }
@media (max-width: 767px) {
  #container { width: auto !important; float: none !important; }
  .listblocs a { width: auto !important; float: none !important; }
  #footer { width: auto !important; float: none !important; }
  #footer1 { width: auto !important; float: none !important; }
  #footer2 { width: auto !important; float: none !important; }
  #footer3 { width: auto !important; float: none !important; }
  #simplemodal-container { width: auto !important; float: none !important; }
  .form-errors { width: auto !important; float: none !important; }
  #page_ptessentiels #ptsessentiels1 ul li { width: auto !important; float: none !important; }
  #page_pointcle { width: auto !important; float: none !important; }
  #carousel_pointscles_container { width: auto !important; float: none !important; }
  #carousel_pointscles { width: auto !important; float: none !important; }
  .myform { width: auto !important; float: none !important; }
  .myform input, .myform textarea, .myform select { width: auto !important; float: none !important; }
  .video-bloc { width: auto !important; float: none !important; }
  .video-bloc .video-title { width: auto !important; float: none !important; }
  .video-bloc .video-vignette { width: auto !important; float: none !important; }
  .video-bloc .video-content { width: auto !important; float: none !important; }
  .video-bloc-4 { width: auto !important; float: none !important; }
  #videos-essentielles-title { width: auto !important; float: none !important; }
  .video-bloc-4 .video-vignette { width: auto !important; float: none !important; }
  .video-bloc-4 .video-content { width: auto !important; float: none !important; }
}