@charset "utf-8";
/* bagot.fr : styles de base, chargés AVANT output.css (Tailwind compilé).
   Reprend uniquement les règles encore utiles de boilerplate.css, bagot_responsive.css et commun.css,
   dans leur ordre d'origine. Points de rupture : 482 px et 770 px. */

/* ---------- Normalisation (issue de boilerplate.css) ---------- */
article, aside, details, figcaption, figure, footer, header, hgroup, nav, section { display: block; }
html { font-size: 100%; overflow-y: scroll; -webkit-text-size-adjust: 100%; }
body { margin: 0; font-size: 13px; line-height: 1.231; }
body, button, input, select, textarea { font-family: sans-serif; color: #222; }
a { color: #7e7c7c; text-decoration: none; }
a:visited:not(#contactbutton) { color: #eeeeee; text-decoration: none; }
a:hover:not(#contactbutton) { color: #d4d4d4; }
ul, ol { margin: 1em 0; padding: 0 0 0 40px; }
nav ul, nav ol { list-style: none; list-style-image: none; margin: 0; padding: 0; }
img { border: 0; vertical-align: middle; }
svg:not(:root) { overflow: hidden; }
form { margin: 0; }
label { cursor: pointer; }
button, input, select, textarea { font-size: 100%; margin: 0; vertical-align: baseline; }
button, input { line-height: normal; }
button, input[type="button"], input[type="reset"], input[type="submit"] { cursor: pointer; -webkit-appearance: button; }
button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; }
textarea { overflow: auto; vertical-align: top; resize: vertical; }
.clearfix:before, .clearfix:after { content: ""; display: table; }
.clearfix:after { clear: both; }
.clearfix { zoom: 1; }

@media print {
  * { background: transparent !important; color: black !important; text-shadow: none !important; filter: none !important; }
  a, a:visited { text-decoration: underline; }
  a[href]:after { content: " (" attr(href) ")"; }
  .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; }
  tr, img { page-break-inside: avoid; }
  img { max-width: 100% !important; }
  @page { margin: 0.5cm; }
  p, h2, h3 { orphans: 3; widows: 3; color: #FFF; font-weight: lighter; }
  h2, h3 { page-break-after: avoid; }
}

/* ---------- Mise en page (issue de bagot_responsive.css) ---------- */
img, object, embed, video { max-width: 100%; }

.gridContainer { display: flex; flex-direction: column; margin-left: auto; margin-right: auto; width: 88.2061%;
  padding-left: 1.3969%; padding-right: 1.3969%; min-height: 93vh; }
#video_home { aspect-ratio: 16/9; }

/* Page « Articles » : deux colonnes à partir de 770 px */
.presse { margin-left: 3.1674%; width: 74.2081%; display: block; height: 50%; }

/* Vidéos YouTube de l'accueil : deux colonnes à partir de 770 px */
.videos > div { clear: both; float: left; margin-left: 0; width: 100%; display: block; }

/* Logos des références : 3 par ligne, 4 à partir de 482 px */
#references_bagot_magicien { clear: both; float: left; margin-left: 0; width: 100%; display: block; }
.ref { clear: none; display: block; float: left; margin-left: 0; width: 33%; }
.ref:nth-child(3n+1) { clear: both; }

#photos_portfolio_1 { clear: both; width: 100%; display: block; padding-left: 0%; }
#nav_portfolio { clear: both; margin-left: 0; width: 100%; }

#mentions_legales { clear: none; float: left; margin-left: 3.1674%; width: 100%; display: block;
  font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; font-size: 0.8em; color: #FFF; text-align: justify; }
#mentions_legales a { color: #FFF; }
#mentions_legales a:hover { color: #c30025; }
#mentions_legales h1 { font-weight: bold; color: #fff; }

/* À partir de 482 px puis de 770 px : seules les valeurs qui changent sont redonnées. */
@media only screen and (min-width: 482px) {
  .gridContainer { width: 91.5723%; padding-left: 0.7138%; padding-right: 0.7138%; }
  .presse { float: left; margin-left: 1.559%; width: 74.6102%; }
  .ref { width: 25%; }
  .ref:nth-child(3n+1) { clear: none; }
  .ref:nth-child(4n+1) { clear: both; }
  .ref--centre { text-align: center; }
  #photos_portfolio_1 { clear: none; width: 74.6102%; padding-left: 1.559%; }
  #mentions_legales { margin-left: 1.559%; width: 74.6102%; }
}

@media only screen and (min-width: 770px) {
  .gridContainer { width: 89.0789%; padding-left: 0.4605%; padding-right: 0.4605%; margin: auto; }
  .presse { margin-left: 1.0339%; width: 74.7415%; }
  .presse > div { clear: both; float: left; margin-left: 0; width: 49%; display: block; }
  .presse > div:nth-child(even) { clear: none; margin-left: 2%; }
  .videos > div { width: 49%; }
  .videos > div:nth-child(even) { clear: none; margin-left: 2%; }
  #references_bagot_magicien { clear: none; margin-left: 1.0339%; width: 74.7415%; text-align: center; }
  /* Mosaïque photo : réglages propres à chaque photo dans inc/galerie.php (variables --w, --ml, --mt, --clear) */
  .photo { clear: var(--clear, none); display: block; float: left; margin-left: var(--ml, 0); margin-top: var(--mt, 0); width: var(--w); }
  #photos_portfolio_1 { width: 74.7415%; padding-left: 1.0339%; }
  #nav_portfolio { clear: none; float: right; text-align: right; }
  #mentions_legales { margin-left: 1.0339%; width: 74.7415%; }
}

/* ---------- Commun (issu de commun.css) ---------- */
body { background-color: #2e2c2c; color: #FFF; }
#header img { display: block; }
#header a:hover { border-bottom-width: 0.10em; border-bottom-style: solid; border-bottom-color: #ffffff; color: #D4D4D4; font-size: 1em; }
footer { background-color: #282626; }