@charset "UTF-8";
/*!
 * Bootstrap  v5.2.3 (https://getbootstrap.com/)
 * Copyright 2011-2022 The Bootstrap Authors
 * Copyright 2011-2022 Twitter, Inc.
 * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
 */
:root {
  --page-front-bg-color: #eef2f8;
  --page-commande-bg-color: #fff;
  --page-contact-bg-color: #fff;    

}
*, *::before, *::after {
    box-sizing: border-box;
}
body {
    background: #FFF;
    font-family: Arial, sans-serif;
    font-size: 16px;
    color: #000;
    margin: 0;
    line-height: 1.3;
}
body.page-front {
  background: var(--page-front-bg-color);
}
body.commande, body.contact {
  background: #eee;
}
a:not([class]), a {
    color: inherit;
    text-decoration: none;
}
p {
    text-align: justify;
}
/* Paragraphe : texte avec lien */
p {
	text-align: justify;
}
.lien-texte a {
	text-decoration: none;
	color: currentColor;
}
.lien-texte a:hover {
  text-decoration: underline;
}
.border-arr {
	border-style: solid;
	border-width: 5px;
	border-color: #2c0ad6c2;
	border-radius: 20px;
}
.border-rect {
	border-style: solid;
	border-width: 5px;
	border-color: #2c0ad6c2;
}

/* HEADER SITE */
.header {
    background: #2c3e50;
    color: #fff;
}
.container-header {
    display: flex;
    flex-wrap: nowrap;
    justify-content: space-between;  
}
.container-header .container-below-top {
    margin: 0;
}
.card-header {
    padding: 10px;
    position: relative;
}
.card-header-avatar {
    padding-left: 65px;
}
.card-avatar {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 10px;
    border-radius: 50%;    
}
.card-title {
    font-weight: bold;
    font-size: 28px;
    margin-bottom: 5px;
}
.container-header .container-nav {
    width: 200px;
    margin: 0;
    align-items: center;
}
.container-header .container-nav .menu {
    background: #2c3e50;
}
.container-header nav {
  margin-top: .7em;
  padding: 0;
}
.container-header .metismenu.mod-menu {
    margin-top: .5em;
}

@media (width <= 767.98px) {
.container-header .container-nav nav {
    margin-top: 0.7em;
  }
}

/* SITE */
@supports (display:grid) {
  @media (width < 992px) {
    .site-grid {
        grid-template-areas:
            ".banner banner banner banner." 
            ".top-a  top-a  top-a  top-a. " 
            ".top-b  top-b  top-b  top-b. "
            ".side-l side-l side-l side-l."
            ".comp   comp   comp   comp.  " 
            ".side-r side-r side-r side-r." 
            ".bot-a  bot-a  bot-a  bot-a. " 
            ".bot-b  bot-b  bot-b  bot-b. ";
    }
}
}

/* Top A */
.top-a .art-container {
    width: 100%;
    height: auto;
    margin-top: 40px;
    margin-bottom: 30px;
    padding: 0;
}
 .art-topa .art-card {
    border: 3px solid;
    border-color: rgba(48, 99, 141, 1);
    border-radius:2rem;
    background: #FFF;
    box-shadow: 0 2px 8px #0000001f;
}
.art-topa .art-card-header {
   	width: 65%;
	margin-top: 10px;
    margin-bottom: 25px;
    padding-bottom: 5px;
	margin-left: auto !important;
	margin-right: auto !important;
    background-color: #FFF;
	text-align: center;
	font-family: "verdana, geneva";
	font-size: 2rem;
	font-weight: 500;
	line-height: 1em;
    color: #000;    
}
.art-topa .art-content-header {
    font-weight: bold;
    color: #0c419a;
    font-size: 18px;
    margin: 10px 0 10px 10px;    
}
.art-topa .art-content-body {
    width: 100%;
    height: auto;

}
.art-topa .art-content-body .art-img {
    width: 100%;
    height: 227px;
}
.art-topa .art-img img {
    width: auto;
    height: 100%;
}
.art-topa .art-content-body .art-texte {
    padding: 10px 20px 0 20px;
}
.art-topa.mod-litterature .art-content-body .art-img, .art-topa.mod-billet .art-content-body .art-img {
    width: 95%;
    text-align: center;
    margin-left: auto;
    margin-right: auto;   
}
.art-topa.mod-billet .art-content-body .art-img {
    width: 237px;
}
.art-topa.mod-litterature .art-content-body .art-img img, .art-topa.mod-billet .art-content-body .art-img img {
   border: 3px solid rgba(0, 0, 0, 0.67); 
}

/* PAGE-FRONT : Chronique du menteur */
.page-front .blog-featured {
    margin: 10px 0;
    padding: 10px;    
    background: #fff;
}
.page-front .blog-featured .page-header {
    margin: 20px 0;
}

.page-front .blog-featured .blog-item {
    border: 3px solid;
    border-color: rgba(48, 99, 141, 1);
    border-radius:2rem;
    background: #FFF;
    box-shadow: 0 2px 8px #0000001f;
}

/* SIDEBAR : left */
.site-grid .container-sidebar-left {
    display: block;
    width: 100%;
}
.container-sidebar-left .sidebar-left:first-child {
    margin-top: 3em;
}
.sidebar-left, .mod-left {
    padding: 24px 16px;
    border-radius: 8px;
    background: #CED9EB;
}
.mod-left .menu-left {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}
.mod-left .menu-left .metismenu-item {
    width: 50%;
    display: block;
    padding: 0.6em 0;
    transition: .3s;
    border: solid 1px transparent;
    padding-left: 10px;
    font-size: 14px;
    line-height: 1.3;  
}
.mod-left .menu-left .metismenu-item > a {
  color: #07275c;
  font-size: 1.125rem;
  line-height: 1;
  font-weight: 700;
}
.mod-left .menu-left .metismenu-item > a:hover {
    color: #000;
    border: solid 1px #dbdbdb;
    border-radius: 3px;
    background: #FFF;
    font-weight: bold;
    text-decoration: none;
}
.mod-left .menu-left .metismenu-item.active > a {
    color: #000;
    text-decoration: underline;
}

/* MAIN */
.site-grid .container-component {
    width: 100%;
}

/* SITE (menu) */
/* Titres de base : h1, h2 */
.page-front .blog-featured .page-header h1,
.item-pagesite .page-header h1,
.item-pagesite .page-header h2,
.item-pagelitterature .page-header h1,
.item-pagelitterature .page-header h2,
.litterature .blog .page-header h1,
.litterature .blog h2,
.item-pagepoesies .page-header h1,
.item-pagepoesies .page-header h2,
.item-pagechronique .page-header h1,
.item-pagechronique .page-header h2,
.chronique .blog .page-header h1,
.chronique .blog h2,
.item-pagecommande .page-header h1,
.com-contact h1 {
    font-family: Arial, sans-serif;    
    color: #07275c;
    font-weight: 900;
    line-height: 1;
}
.page-front .blog-featured .page-header h1,
.item-pagesite .page-header h1,
.item-pagelitterature .page-header h1,
.litterature .blog .page-header h1,
.item-pagepoesies .page-header h1,
.item-pagechronique .page-header h1,
.chronique .blog .page-header h1,
.item-pagecommande .page-header h1,
.com-contact h1 {
    text-align: center;
    font-size: 2rem;
    margin-bottom: 20px;
    padding-bottom: 10px;    
    border-bottom: 2px solid #07275c;
}
.item-pagesite .page-header h2,
.item-pagelitterature .page-header h2,
.litterature .blog h2,
.item-pagepoesies .page-header h2,
.item-pagechronique .page-header h2,
.chronique .blog h2 {
    text-align: left;
    margin-bottom: 20px;
    font-size: 1.875rem;
}
.img-right {
    text-align: center;
}
/* Article : style de base */
.com-content-article__body .art-container {
    width: 100%;
    height: auto;
    margin: 0;
    padding-bottom: 20px;
}
.art-content-body {
    height: auto;
}
.art-content-body .art-img {
    width: 100%;
    height: 227px;
    margin-top: 20px;
    margin-bottom: 20px;
    text-align: center;
}
.art-content-body img {
    width: auto;
    height: 100%;
}
.art-content-body .art-texte {
    padding: 10px 20px 0 20px;
}

/* LITTERATURE */
.art-table .art-card {
    border: 2px solid #000;
}
.art-table .art-content-body .table-items {
    display: block;
}
.table-item.one {
    flex: none;
    padding-right: 10px;

}
.art-table .table-item ul {
    padding-left: 0;
    list-style-type: none;
}
.table thead th {
  white-space: wrap;
}
.litterature .com-content-category-blog.blog .readmore  a,
.page-front .blog-featured .readmore  a {
	display: none;
}
.litterature .blog .blog-item .page-header h2 {
    height: 10px;
    font-weight: bold;
    color: #0c419a;
    font-size: 18px;
    margin: 10px 0 10px 10px;
}
/* Lire des extraits */
.litterature .com-content-category-blog__item.blog-item {
    max-width: 296px;
    height: 422px;
    margin-left: auto;
    margin-right: auto;
}
.litterature .com-content-category-blog__item.blog-item .item-content img {
    	transition: transform 2s;
}
.litterature .com-content-category-blog__item.blog-item .item-content img {
    transform: translate(0, 53px) scale(2, 2);
}
.litterature .com-content-category-blog__item.blog-item .item-content img:hover {
    transform: none;
}
.art-edition li {
    padding: 6px 0;
}
.art-edition li:first-child {
    padding-top: 0;
}
.art-edition li:last-child {
    padding-bottom: 0;
}

/* CHRONIQUE DU MENTEUR (menu) */
.chronique .com-content-category-blog__item.blog-item,
.litterature .com-content-category-blog__item.blog-item {
    border: 3px solid;
    border-color: rgba(48, 99, 141, 1);
    border-radius:2rem;
    background: #FFF;
    box-shadow: 0 2px 8px #0000001f;
}
.page-front .blog-featured .blog-item h2,
.chronique .blog .blog-item .page-header h2 {
    height: 30px;
    font-weight: bold;
    color: #0c419a;
    font-size: 18px;
    margin: 10px 10px 10px 10px;
}
.com-content-category-blog__item .art-container {
    width: 100%;
    height: auto;
    margin-top: 40px;
    padding: 0;
}
.shadowbox {
  width: 100%;
  border: 1px solid #333;
  box-shadow: 8px 8px 5px #444;
  padding: 8px 12px;
  background-image: linear-gradient(180deg, #fff, #ddd 40%, #ccc);
  text-align: center;
}
.actu_histo_social dl dd {
    margin-bottom: 0;
}

/* Readmore */
.chronique .com-content-category-blog.blog .readmore  a,
.page-front .blog-featured .readmore  a {
	display: none;
}

/* COMMANDE (menu) */
.item-pagecommande .com-content-article__body {
    display: block;
    max-width: 392px;
    margin-left: auto;
    margin-right: auto;    
}
.com-content-article .page-header {
    text-align: left;
}
.item-pagecommande article.art-decouvre {
    margin: 20px 0;
    padding: 5px;    
    background: var(--page-commande-bg-color);
    border: 3px solid blue;
    border-radius:2rem;
}
.item-pagecommande article.art-cdeline {
    margin: 20px 0;
    background: #FFF;
    border: 3px solid green;
    border-radius: 2rem;
}
.item-pagecommande article.art-achatlibrairie {
    margin: 20px 0;
    background: #FFF;
    border: 3px solid red;
    border-radius: 2rem;   
}

/* Découvre */
.art-decouvre .couverture {
    padding: 5px 5px 0 5px;
    text-align: center;
}
.art-decouvre .couverture img {
    width: auto;
    height: 227px;
}
.art-body .informations {
    margin: 10px 0;
}
.art-body .informations .decouvre-btn {
    text-align: center;
}
.btn-decouvre {
  margin-top: 0;
  display: inline-block;
  padding: 13px 20px;
  border-radius: 8px;
  border: 2px solid #0c419a;
  background: #eee;
  color: #0c419a;
  font-weight: 700;
  font-size: 1rem;
  text-transform: none;
  display: inline-flex;
  align-items: center;
}
.btn-decouvre:hover {
  background: #0c419a;
  color: #fff;
  text-decoration: none;
}
.art-body .montant {
    text-align: center;
}

/* Commande / Achat */
.ctn-wrapper-cdeachat {
    display: block;
    width: 100%;
}
article .art-header {
    text-align: center;
    margin-top: 10px;
}
.art-cdeline .art-body {
    padding-top: 10px;
}
.art-cdeline .art-body img {
    width: 100%;
    height: 500px;
    border-bottom-left-radius: 2rem;
    border-bottom-right-radius: 2rem;
}
.art-achatlibrairie .art-body {
    padding-top: 10px;
}
.art-achatlibrairie .art-body img {
    width: 100%;
    height: 300px;
    border-bottom-left-radius:2rem;
    border-bottom-right-radius: 2rem;  
}

/* Contact */
.contact .com-contact {
    margin: 20px 0;
    padding: 20px;   
    background: var(--page-contact-bg-color);
}

/* BOTTOM */
.banniere-annonces {
    height: 100px;
    margin: 10px 0 20px 0;
    padding: 22px 0;
	background-color: #5466001a;
}
.banniere-annonces img {
    height: 60px;
}
.footer .grid-child {
    padding: 0.5rem;
    justify-content: center !important;
}
.footer {
    margin-top: 0;
}

@media only screen and (min-width: 992px) {
    .site-grid {
       max-width: 1080px;
       width: 100%;
       margin-left: auto;
       margin-right: auto;
    }
    body.has-sidebar-right .site-grid {
        max-width: 1400px;
    }
    /* Header */
    .container-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 64px;
    }
    .container-header .container-nav {
    position: relative;
    right: 0;
    width: 75%;
    }
    .header-logo,
    .container-nav {
        padding: 0;
    }
    .container-header .menu {
        display: block;
        margin-left: auto;
    }
    .metismenu.mod-menu .metismenu-item {
        padding: .5em 0.1em
    }
    .container-header .mod-menu > li > a {
        color: rgba(255, 255, 255, 0.67);
    }
    .container-nav a {
        display: inline-block;
        margin: 0 12px;
        transition: color .3s;
    }
    .metismenu.mod-menu .mm-toggler {
        color: rgba(255, 255, 255, 0.67);        
    }
    .container-header .metismenu > li.level-1.active > a,
    .container-header .metismenu > li.level-1 > a:hover,
    .container-header .metismenu > li.level-1.active .mm-toggler,
    .container-header .metismenu > li.level-1:hover .mm-toggler {
        color: #FFF;
    }
    /* Top A */
    .art-topa .art-img img {
    width: 100%;
    height: 100%;
    }
    /* Main top */
    .art-topa.mod-imgalea .art-content-body .art-img {
      width: 640px;
      height: 380px;
      text-align: center;
      margin-left: auto;
      margin-right: auto;    
    }
    .art-topa.mod-imgalea .art-content-body .art-img img {
      border: 3px solid rgba(0, 0, 0, 0.67);
    }
    /* Left */
    .container-sidebar-left .sidebar-left:first-child {
        margin-top: 54px;
    }
    .mod-left .menu-left .metismenu-item {
        width: 100%;
    }
    /* Site */
    .img-right {
        margin-top: 40px;
    }
    /* Articles */
    .art-content-body .art-img {
        height: 380px;
    }
    .art-chronique .art-content-body .art-img.intro {
        height: 227px;
    }
    .art-site .art-content-body .art-img.texte,
    .art-litterature .art-content-body .art-img.texte,
    .art-chronique .art-content-body .art-img.texte {
        width: auto;
        height: auto;
        text-align: center;
    }
    .art-site .art-content-body .art-img.texte img,
    .art-litterature .art-content-body .art-img.texte img,
    .art-chronique .art-content-body .art-img.texte img {
        width: auto;
        height: auto;
        max-height: 390px;
    }        
    .art-blog-itemchronique .art-content-body .art-img {
        height: 227px;
    }
    /* Littérature : Chronique du menteur */
    /* Table */
    .art-table .art-content-body .table-items {
        display: flex;
        justify-content: space-between;
    }
    /* Lire des extraits */
    .litterature .com-content-category-blog__item.blog-item {
        max-width: 547px;
        height: auto;
        margin-left: auto;
        margin-right: auto;
    }
    .litterature .com-content-category-blog__item.blog-item .item-content img {
        transform: translate(0, 128px) scale(2, 2);        
    }
    .litterature .com-content-category-blog__item.blog-item .item-content img:hover {
        transform: none;
    }
    /* Commande / Achat */
    .item-pagecommande .com-content-article__body {
        display: flex;
        justify-content: space-evenly;
        align-items: stretch;
        max-width: 100%;
    }
    .item-pagecommande .com-content-article__body article.art-decouvre {
        width: 40%;
    }
    .art-decouvre .couverture img {
    width: 100%;
    height: 400px;
}
    .item-pagecommande .com-content-article__body .ctn-wrapper-cdeachat {
        width: 40%;
        display: flex;
        flex-direction: column;
    }
	.art-img-large-seconde  {
		transition: transform 2s;
	}
	.art-img-large-seconde  {
		transform: translate(0, 0) scale(2, 2);
	}
	.art-img-large-normale  {
		transition: transform 2s;
	}
	.art-img-large-normale  {
		transform: translate(0, 0) scale(1, 1);
	}
    .art-chronique .art-content-body .art-img.texte img.image-ronde {
        width : 500px;
        height : 380px;
        border-radius : 50%;
        border: 5px solid black;
    }  
}