/* #PRODUIRE{fond=css/html5up_telephasic.spip.css}
   md5:d2be5c3109bb10eb731fa551d3d349df */
/* source-sans-pro-300 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Source Sans Pro';
  font-style: normal;
  font-weight: 300;
  src: url('https://www.nathalie-maillol.fr/plugins/auto/html5up_telephasic/v0.5.0/polices/source-sans-pro-v21-latin-300.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+ */
       url('https://www.nathalie-maillol.fr/plugins/auto/html5up_telephasic/v0.5.0/polices/source-sans-pro-v21-latin-300.woff') format('woff'); /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}

/* source-sans-pro-regular - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Source Sans Pro';
  font-style: normal;
  font-weight: 400;
  src: url('https://www.nathalie-maillol.fr/plugins/auto/html5up_telephasic/v0.5.0/polices/source-sans-pro-v21-latin-regular.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+ */
       url('https://www.nathalie-maillol.fr/plugins/auto/html5up_telephasic/v0.5.0/polices/source-sans-pro-v21-latin-regular.woff') format('woff'); /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}

/* source-sans-pro-600 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Source Sans Pro';
  font-style: normal;
  font-weight: 600;
  src: url('https://www.nathalie-maillol.fr/plugins/auto/html5up_telephasic/v0.5.0/polices/source-sans-pro-v21-latin-600.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+ */
       url('https://www.nathalie-maillol.fr/plugins/auto/html5up_telephasic/v0.5.0/polices/source-sans-pro-v21-latin-600.woff') format('woff'); /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}

:root {
  --couleur-emphase: #36007b;
}

h1, h2, h3 { font-size: 2em; line-height: 1.25em; }
h2 { font-size: 1.625em; }
h3 { font-size: 1.25em; }
img { vertical-align: top; }
strong {color: inherit;}
a:hover, a:active, a:focus { color: var(--couleur-emphase);}

picture.adapt-img-wrapper { vertical-align: top; } /* cf https://github.com/nursit/AdaptiveImages/issues/13 */

/* *** Le menu principal *** */
#nav ul { padding: 0;}
#nav ul li.accueil {margin: 0 1em; text-transform: uppercase; font-weight: 600;}
.dropotron li.active > a, .dropotron li.active > span {  color: var(--couleur-emphase); }
#nav .accueil a { display: block; padding-top:0; height: 4em; background:rgba(255, 255, 255, 0.15); border: 1px solid rgba(255, 255, 255, 0.75); border-top: 0; border-radius: 0 0 0.35em 0.35em; }
#nav a:hover, #nav a:active, #nav a:focus { color: var(--couleur-emphase);}
#nav #formulaire_menu_lang label { display: none; }
#nav #formulaire_menu_lang select { padding: 0; }
#nav #menu_lang { text-transform: uppercase; }
#nav #menu_lang a { color: #fff; border: 0; }
#nav #menu_lang strong {color: #fff; opacity: 0.5; }

/* *** L'entête *** */

.homepage #header-wrapper,  #header-wrapper {
    min-height: 5em;
  
    background-image: url('https://www.nathalie-maillol.fr/plugins/auto/html5up_telephasic/v0.5.0/css/images/overlay.png'), url('https://www.nathalie-maillol.fr/plugins/auto/html5up_telephasic/v0.5.0/css/images/header.svg'), 
    linear-gradient(75deg, #36007b 15%, #8095cf 55%);
    
}
header > p { color: var(--couleur-emphase); }

/* *** L'accueil *** */
#hero { max-width: 580px; }
#hero h1 { margin-bottom: 0.5em; color: #fff; font-size: 3em; }

#promo-wrapper {
  background-image: url('https://www.nathalie-maillol.fr/plugins/auto/html5up_telephasic/v0.5.0/css/images/overlay.png'),
  
  
  background-attachment: fixed;
}

/* *** Le contenu des pages *** */
.chapo { font-weight: 400; font-size: 1.125em; }
.spip_documents > a { border: 0;}
.spip_documents > a { display: block; } /* Cf https://git.spip.net/spip-contrib-extensions/adaptive_images/issues/1 */

/* Les rubriques */
.page_rubrique #page-wrapper > .wrapper { padding-bottom: 0; }
.page_rubrique #content { margin-bottom: 4em; }
.page_rubrique .row.features {position: relative; z-index: 0; margin-bottom: 0; padding-bottom: 2em;}
.page_rubrique .row.features::before { content: ''; display: block; width: 2000%; height: 100%; position: absolute; left: -1000%; top: 0; z-index: -1; box-shadow: inset 0px 0px 0px 1px #e8e8e8; background: #f6f8fb url('https://www.nathalie-maillol.fr/plugins/auto/html5up_telephasic/v0.5.0/css/images/image-wrapper.svg');}
.page_rubrique .row.features h2 {font-size: 1.5em; line-height: 1.5em;}
.page_rubrique .row.features .image.featured {margin-bottom: 1em;}
.page_rubrique .row.features .button {background-color: #fff;}

/* La sidebar */
#sidebar h2 { font-size: 1.5em; }
#sidebar article:not(:first-of-type) { border-top: solid 1px #d2d7dc; margin-top: 3em; padding-top: 3em; }

/* La page auteur */
.logo_auteur { overflow: hidden; margin: 0.5em; width: 250px; max-width: 100%; border-radius: 50%; float: right; }
.logo_auteur img { margin: 0; }
.sur_le_web { font-size: 1.125em; font-weight: 700;}
.connexe {max-width: 900px; margin: 2.5em auto 0 auto;}
.connexe li span { font-size: 0.875em; font-style: italic;}

/* Les autres pages */
.page_plan #content .texte { margin: auto;  max-width: 700px; }
.page_recherche #content > header {text-align: center; }
.page_recherche #main h2 {margin-bottom : 1em;text-align: center; }

/* *** Le pied de page *** */
#footer .major p { padding: 0.75em 0 1em 0; color: var(--couleur-emphase); font-size: 1.5em;  line-height: 1.5em; }
#footer #formulaire_contact fieldset {margin-top: 0; padding-top: 0;}
#footer #formulaire_contact br.bugajaxie {display: none;}
#footer .col-12 {margin-bottom: 2em;}

/* Le formulaire de recherche */
#formulaire_recherche { padding: 3em 0.5em; text-align: center; background: #fff; }
#formulaire_recherche input#recherche {transition: background-color 0.25s ease-in-out; -webkit-appearance: none; 
  margin-right: 1em; padding: 0.75em 1em 0.75em 1em; min-width: 25em; height: 4rem;
	background: #f9fbfe; line-height: 1.5em; border: 1px solid #d2d7dc; border-radius: 0.35em; }
#formulaire_recherche input.submit { height: 4rem; }

/* Le formulaire de contact */
#formulaire_contact fieldset {margin-top: 0;}
#formulaire_contact legend {display: none;}
form ul.editer-groupe { padding-left: 0; list-style: none; }
form ul.editer-groupe li.editer { margin: 0 0 1.5em 0; padding: 0;}
label[for=infolettre] {display: flex; line-height: 1.2em;}
label[for=infolettre] p {margin: 0 ;}
label strong { font-size: 0.85em ; font-weight:normal; }
input[type="checkbox"] {margin:0 1em 0 0;opacity:1;-moz-appearance:checkbox;-webkit-appearance:checkbox;-ms-appearance:checkbox;appearance:checkbox;}
input[type="radio"] {margin:0 1em 0 0;opacity:1;-moz-appearance:radio;-webkit-appearance:radio;-ms-appearance:radio;appearance:radio;}

/* Formulaire de login */
.formulaire_menu_lang, .formulaire_login,
#oubli_form {margin: auto; max-width: 700px;}
#formulaire_login .choix {display: flex;}
#formulaire_login .choix label {padding: 0 !important;}

/* Les réseaux sociaux */
#footer .sociaux * .socicon { background: #61666b; border-radius: 0.35em; transition: background-color 0.2s; }
#footer .sociaux * .socicon:hover { background: var(--couleur-emphase); }

/* Le portofolio */
.documents_portfolio { margin: 1.5em 0;}
ul.portfolio { padding: 0; list-style: none;}
ul.portfolio li { line-height: 1.5em; font-size: 0.75em ;}
ul.portfolio li a, ul.portfolio li a:hover, ul.portfolio li a:active, ul.portfolio li a:focus { text-decoration:none; border:0;}
ul.portfolio li a:hover, ul.portfolio li a:active, ul.portfolio li a:focus { text-decoration:none; border:0;}
ul.portfolio li figcaption {margin-top: 0.25em;}
ul.portfolio li small { font-size: 0.75em; }

/* Les documents joints */
.documents_joints { margin: 1.5em 0;}
.documents_joints ul, .documents_joints li { padding: 0; list-style: none;  line-height: 1.5em;}
.documents_joints li { clear: both; margin-bottom: 1.5em; }
.documents_joints ul .spip_logo { float: left; margin: 0 1em 0 0;}
.documents_joints .publication { font-size: 0.75em; }
.documents_joints .descriptif p {margin:0;}

/* Pagination */
.pagination { margin-top: 3em; }
.pagination .pagination-items { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: row; justify-content: center; }
.pagination .pagination-item { margin: 0em; flex-basis: 7.5%; display: flex;align-items: center; color: var(--couleur-emphase);}
.pagination .pagination_precedent_suivant .pagination-item { flex-basis: auto;}
.pagination .pagination-item + .pagination-item { margin-left: 0.5em }
.pagination .pagination-item-label { display:block; flex-basis: 100%; background: var(--couleur-emphase); text-decoration: none; padding:.5em; text-align: center; border: 1px solid var(--couleur-emphase); }
.pagination a.pagination-item-label {color: #fff;}
.pagination .active span.pagination-item-label,
.pagination a.pagination-item-label:hover,
.pagination a.pagination-item-label:focus,
.pagination a.pagination-item-label:active { background: #fff; color: var(--couleur-emphase); text-decoration: none; }
.pagination .pagination-item.disabled { visibility: initial; }
.pagination .pagination-item.disabled .pagination-item-label {color:var(--couleur-emphase); background: transparent;}

/* Les boutons */
input[type="button"]:hover, input[type="button"]:active, input[type="button"]:focus,
input[type="submit"]:hover, input[type="submit"]:active, input[type="submit"]:focus, 
input[type="reset"]:hover, input[type="reset"]:active, input[type="reset"]:focus, 
button:hover, button:active,  button:focus,
.button:hover, .button:active,.button:focus { color: var(--couleur-emphase); border-color: var(--couleur-emphase); }

/* Divers */
figure.spip_doc_inner a { border: none; }
.spip_doc_legende {font-size: 1rem; line-height: 1.2em;}
body .oe-play-button:hover button, body .oe-play-button button:focus { background: var(--couleur-emphase); }
.adapt-img.spip_logo {margin: 0;}

/* Les boutons d'administration */
body .spip-admin-bloc, body .spip-admin-float { top:auto; bottom: 0; }
body .spip-admin-boutons { border-radius: 0.3em 0.3em 0 0 ; }

@media screen and (max-width: 1080px) {
  #header-wrapper { padding-top: 0 !important; }
  #nav { margin-top: 0; height: auto !important;}
  #nav .accueil a { height: auto ; }
}

@media screen and (max-width: 736px) {
  #navButton { margin: auto; left: 50%; width: 80px; height: 30px; text-align: center; background: rgba(128, 132, 136, 0.35);
    border-radius: 0 0 0.35em 0.35em; border-top: 0; transform: translateX(-50%);}
  #navButton a { display: block; position: relative; height: 100%; border: 0; }
  #navButton .toggle { display: block; position: relative; top: 50%; left: auto; margin: auto; width: 20px; height: 3px; background: #fff; transform: translateY(-50%); }
  body.navPanel-visible #navButton { transform: translate(-50%, 50vh); }
  #navButton .toggle::before, #navButton .toggle::after { display: block; position: absolute; content: ''; left: 0; margin: 0; width: 100%; height: 3px; background: #fff; border: 0; border-radius: 0;}
  #navButton a.toggle::before, #navButton .toggle::before { top: -7px; }
  #navButton a.toggle::before, #navButton .toggle::after { bottom: -7px; }

}
