/*
# ------------------ BEGIN LICENSE BLOCK ------------------
#
#
# Package:		theme.css
# Authors		Pluxthemes.com / G;Cyrillus.
# Licensed under the GPL license.
# See http://www.gnu.org/licenses/gpl.html
#
# ------------------- END LICENSE BLOCK -------------------
*/
html {
  scroll-behavior: smooth;
  background:#555;  
  font-size:18px;
  font-weight: bolder;
  text-shadow: #7898;
  line-height: 1.4
}
body,
body * {
  all: revert;
  box-sizing: border-box;
}
body,
body > header {
  display: grid;
  grid-template-columns: 6fr 3fr;
  gap: 1.2em;
  color:  #6fcadd;
}
body {
  grid-template-rows: auto 1fr auto;
  padding: 1.2em max(1.2em, calc(50vw - 600px));
  min-height: 100vh;
  margin: 0;
  max-width: 100%;
}
body:not(:has(aside)) {
  grid-template-columns: 1fr;
}
body>header,
body>footer{
  background: linear-gradient(90deg,#12548f 0 10vw,#089bc4 10vw 20vw,#6fcadd 20vw 30vw,#bee8  30vw 40vw,#eb7f47 40vw 50vw,#edaa6e 50vw 60vw,#f7643b)0 0 / 100% 10px no-repeat white
} 
body >header {
  border-radius:0 0 5px 5px;
}
body>main,body>aside {
  border-radius: 5px 5px 0 0;
}
@media (max-width: 800px) {
  body,
  body > header {
    grid-template-columns: 1fr;
    gap: 0em;
    padding: 0;
  }
  header nav {
    order: 0;
  }
  header nav ul {
    margin-bottom: 0;
  }

  header label[for="toggle"] {
    margin: auto auto 1em;
  }
  body> :is(header,main,aside,footer) {
    max-width:100vw;
  }
  body article>header {
    display:block;
  }
}
body > * {
  background: white;
  padding: 1em;
}

header,
footer {
  grid-column: 1/-1;
  height: max-content;
}
main,
aside {
}
a {
  color: #089bc4;
  font-weight:bolder;
  text-decoration: none;
  display: inline-block;
  border-bottom: solid transparent;
  transition: 0.05s;
}
a:hover, 
article a,
.comment a,
footer a{
  color: hotpink; /*#12548f*/
}
article h2 a {
  color: #EDAA6E;
  border-bottom: solid #EDAA6E;
  transition: .2s;
}
a:hover {
  text-indent: 0.2em;
  border-bottom: solid;
  rotate: -3deg;
}

a[href$="#form"] {
  display: inline-block;
  background:silver;
  color:white;
  font-size:14px;
  padding:0.2em 0.5em 0;
  border-radius: 1em;
  margin-inline-start:3em;
  transform:translate(0,-1em)
}
:is(nav, aside) li:nth-child(even) a:hover {
  rotate: 3deg;
}
.title {
  text-align: right;
  padding-right: 1em;
  grid-column: 1/-1;
}
nav {
  order: -1;
  display: grid;
  grid-template-rows: 1fr auto;
}
nav ul {
  display: none;
  flex-wrap: wrap;
  gap: 0.5em;
  list-style: none;
  margin-bottom: -1em;
  line-height: 2;
}
nav #toggle:checked ~ ul {
  display: grid;
  place-content: center;
  place-content: safe center;
  position: fixed;
  z-index: 9;
  background: #defd;
  height: 100vh;
  overflow: auto;
  width: 100%;
  top: 0;
  left: 0;
  margin: 0;
  backdrop-filter: blur(5px);
}
nav li.sub-menu,
nav li.sub-menu ul{
  display: contents;
}
nav #toggle:checked + label::before {
  content: "X";
  background: inherit;
  padding: 0em 0.25em;
  position: absolute;
  left: 0.8em;
  top: .5em;
}
nav ul:has(li:nth-child(12)) {
  grid-template-columns: repeat(2, auto);
}
body:has(nav #toggle:checked) {
  overflow: hidden;
}
nav ul li:not(:has(span)), 
nav ul li span {
  border: dashed 1px #6fcadd;
  text-align: center;
}
nav ul li > * {
  display: block;
  padding: 0 1em;
}
nav ul li:hover > * {
  background: #6fcadd;
  color: white;
  border-bottom: solid transparent;
  text-indent: 0;
}
nav ul li.active > * {
  background: #12548f;
  color: white;
}
li[class="menu"], .sub-menu {
  display: contents!important;
}
li[class="menu"]>span{
  display: none
}
.sub-menu li {
  margin-top: 0em;
}
#toggle {
  position: fixed;
  top: -15em;
}
label[for="toggle"] {
  display: flex;
  white-space: nowrap;
  margin: auto;
  padding: 0.5em 1em;
  background: #12548f;
  color: white;
  border-radius: 1.2em;
  cursor: pointer;
  position: fixed;
  top: 0.5em;
  left: 0.5em;
  z-index: 10;
  width: 6rem;
  box-shadow: 0 0 3px whitesmoke;
}
nav:has(:checked) label {
  margin: auto auto 0.5em;
}
.repertory.menu.breadcrumb::before {
  content:'\291c';
  font-size:1.5em;
  line-height: 1;
  margin-right: auto
}
.repertory.menu.breadcrumb {
  display: flex;
  align-items: center;
  list-style: none;
  font-size: 1.2em;
  padding: 1em ;
  background: #6FCADD22;
  margin: 0;
  border:solid 1px;
  border-bottom:none;
}
main:not(:has(.catDesc)) .repertory.menu.breadcrumb {
  border-bottom: solid 1px;
}
.repertory.menu.breadcrumb li:not(:last-child)::after {
  content: ' /';
  padding: 0 0.5em;
  color: #555;
}
.repertory.menu.breadcrumb::after {
  content:'\291b';
  color:#6FCADD;
  font-size:1.5em;
  line-height: 1;
  margin-left: auto

}
.repertory.menu.breadcrumb li.active{
  color:#12548F;
}
.catDesc {
  margin:0 0 1em;
  padding: 1em;
  background: #6FCADD22;
  border:solid 1px;
  border-top:none;
}
article + article {
  box-shadow: 0 -1px 1px -1px #edaa6e;
  padding-top: 0.1rem;
}
img.art_thumbnail {
  width: 100%;
  max-height: 240px;
  object-fit: contain;
  background: #089bc490;
}
article > header {
  display: grid;
  grid-template-columns: 65fr 35fr;
}
article header p span {
  display: block;
}
article header h2 {
  margin-top: auto;
}
article header .art-date {
  border-bottom: solid 1px;
}
.written-by {
  margin-bottom: 1em;
}
p.more {
  text-align: right;
}
.more a,
p.tag a {
  display: inline-block;
  background-color: #089bc4;
  color: white;
  font-weight: 700;
  text-transform: uppercase;
  padding: 6px 10px;
  border-bottom: none;
}
p.more a:hover,
p.tag a:hover {
  background-color: #12548f;
  color: white;
  text-indent: 0;
}

[id^="com-"] {
  border-left:solid;
  margin-bottom: 
}
.level-1 {
  margin-inline-start: .75em;
}
.level-2 {
  margin-inline-start: 1em;
}
.level-3 {
  margin-inline-start: 1.25em;
}
.level-4 {
  margin-inline-start: 1.5em;
}
.level-5 {
  margin-inline-start: 1.75em;
}
.level-6 {
  margin-inline-start: 2em;
}

.author-infos {
  border-left: solid;
  padding: 1px 1em;
  margin: 1em;
  background: midnightblue;
}
.author-infos::before{
  content:'Auteur:';
  position:absolute;
  transform:translate(-1em,-100%);
  color:#48a;
  text-decoration: underline
}
.pagination {
  display: flex;
  gap: 1em;
  padding: 1em;
  border-top: solid;
  justify-content: center;
  align-items: center;
}
.pagination span a {
  padding: 0.5em 1em;
  border: none;
  background: #f7643b;
  color: white;
}
.pagination span a:hover {
  text-indent: 0;
  background: #eb7f47;
  color: #555;
}
.pagination span.p_current {
  padding: 0.5em 1em;
  background: #edaa6e;
  color: #903522;
  rotate: 5deg;
  box-shadow: 0 0 2px;
}

aside h3,
aside ::marker {
  color: #f7643b;
}
aside a:hover {
  text-indent: 0;
  border-color: transparent;
  color: #555;
}
p.tag {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5em;
}
.searchfields p{
  display: grid;
  grid-template-columns: 1fr 3em;
  gap: 0.25em;
  padding: 0.25em;
}
#top input,
#top textarea {
  outline-offset: -2px;
  width: 100%;
  padding: 10px 10px;
  font: 0.9em "Roboto", arial, helvetica, sans-serif;
  border: 1px solid #ddd;
}
#top input[type="submit"] {
  background-color: #12548f;
  border: 0;
  color: white;
  font-size: 0.9em;
  font-weight: 700;
  text-transform: uppercase;
  cursor: pointer;
}
#top input[type="submit"]:hover {
  background-color: #6fcadd;
  color: white;
}
.footer :is(p,ul) {
  display: flex;
  flex-wrap:wrap;
  justify-content: center;
  gap: .2em;
  list-style: none;
}
footer a {
  margin: 0 1em;
}
.footer {
  background-color: #333;
  margin: -1.2em 0;
}



#goToTop {
  grid-column:-1;
  grid-row:1/4;
  width:0;
  padding:0;
  margin-inline-start: -6.2em;
  container-type: size;
  container-name: divTopLink;
  overflow: visible;
}
#goToTop::before {
  content:'';
  float:left;
  height:140vh;
}
#goToTop a,
#goToTop a:hover {
  display:block;
  background:#5555;
  aspect-ratio: 1;
  width:1.5em;
  text-align:center;
  border-radius:50%;
  color:white;
  box-shadow:1px 1px 2px silver;
  font-size:2em;
  clear:both;
  position:sticky;
  top: calc(100vh - 3.5em);
  right:1em;
  rotate:0deg;
  text-indent:0;
  border:none;  
}

@container divTopLink (max-height :140vh) {
  #goToTop::before,
  #goToTop a {
    display: none;
  }
}


/* general */
b {
    color:#F7643B;
}
table {
  border-bottom: solid 1px;
  border-collapse: collapse
}
tr{
  border-top: solid 1px
}
tr:hover {
  background:#bee8
}
tr:nth-child(even):hover {
  background:#9994
}
th,td{
  padding-inline-end: 1em;
}
::marker,
:is(h1,h2,h3,h4,h5,h6),th{
  color: #12548f;
}
pre:has(code), code {
  font-family:monospace;
  width:0;
  min-width:100%;
  background: #def8;
  line-height: 1
}
blockquote {
  margin: 1em;
  font-variant:  all-petite-caps;
  font-style: italic;
  border-inline-start: solid greenyellow;
  padding-inline: 1em
    
}


/* for pluxthemes demo */
body:has(.kzSkinSelect) label {
  top:4em;
}
/* --- PERSONNALISATION VOYANTE.TOP --- */
html {
  background: #2e1065 !important; /* Fond Violet */
}

body, body > header, body > footer {
  color: #a855f7 !important; /* Violet clair pour les textes */
}

body > header, body > footer {
  background: linear-gradient(90deg, #4c1d95 0 20%, #7c3aed 20% 40%, #a855f7 40% 60%, #ec4899 60% 80%, #f472b6 80% 100%) 0 0 / 100% 10px no-repeat white !important;
}

a { color: #7c3aed !important; }
article h2 a { color: #a855f7 !important; border-bottom-color: #ec4899 !important; }
a:hover { color: #ec4899 !important; }

nav ul li.active > * { background: #4c1d95 !important; }
footer { background-color: #2e1065 !important; }
/* --- FIN --- */