/*
 * $Id: custom.css,v 1.17 2025/11/24 10:52:36 jby Exp jby $
 */

@import 'couleurs.css';
body {
  font-family: Verdana, Arial, sans-serif;
  background-color: var(--gris);
  color: var(--prune);
}
@font-face {
        font-family:'Mapolice';
        src:url('../fonts/mapolice.ttf');
		font-display: swap;
}
h1,h2,h3,h4,h5 {text-align:center;font-family: Mapolice;font-weight:600}
.article-list .article .article-header h1 a, .article-list .article .article-header h2 a {
	color: var(--prune);
}
.article-header h1{font-size: 1.75rem!important;}
.article-list .article .article-header h1
{
  font-size: 1.75rem;
  margin: 1.8rem 0 1.25rem 0;
  font-weight:800;
	color: var(--prune);
}

.article-list .article .article-header h2 {
	font-size: calc(1.5rem + .6vw);
	margin: 1.8rem 0 1.25rem 0;
	font-weight:800
}

#sp-header {
  height: 70px;
  background-color:var(--blanc);
  border-bottom: solid 3px var(--prune);
}
#offcanvas-toggler {height:80px}
.offcanvas-menu .offcanvas-inner ul.menu > li a, .offcanvas-menu .offcanvas-inner ul.menu > li span {
  color: var(--prune);
}
.offcanvas-menu .offcanvas-inner .sp-contact-info > li > a, .offcanvas-menu .offcanvas-inner .social-icons > li > a {
	opacity: 1.0;
}
.offcanvas-menu{background-color:var(--blanc);color:var(--prune)}
#sp-main-body {
	padding: 25px 0;
}
div .logo {margin-left:auto;margin-right:auto}

span.badge.bg-danger.featured-article-badge {
    display: none;
}
.blog-featured{background-color:var(--gris)}

.grow {font-size : 2.0em !important;}

.speasyimagegallery-album-description, .manbow {font-family: Mapolice, Verdana, Arial, sans-serif; font-size: 34px;font-weight:400;text-align: center}
.speasyimagegallery-album-meta > span {float:none}

.nav-pills a img{width:2.5em;margin:0 auto}
#sp-footer {background-color:var(--gris);color:var(--prune);text-align:center}
.btn-primary, .sppb-btn-primary {
	border-color: var(--active);
	background-color: var(--prune);
	color: var(--gris);
}
.form-control{border:solid 2px var(--prune);border-radius:0.6rem;width:10.0rem}
.breadcrumb {
	border:solid 3px var(--prune);
	border-radius: 1.2em;
	background-color: var(--grisclair);
	margin:0 10px 10px 10px;
	font-weight:800;
}
.breadcrumb-item.active{color: var(--active)}
#contact-form .form-control{width:100%}
.sp-page-title,
.sp-page-title-heading {font-family: Mapolice; font-size:2.0em!important;color:var(--prune)!important;background-color:var(--gris)!important}
/* don't work : */
.sp-column .sp-component{background-color:var(--gris)}
.btn-primary:hover,.sppb-btn-primary:hover{border-color:var(--prune);background-color:var(--gris);color:var(--prune);
}
a {color:var(--prune);font-weight:800}
a:hover,a:focus,a:active{color:var(--active)}
.sp-megamenu-parent, .sp-menu-item, .sp-megamenu-parent > li  {
	font-family: 'Verdana', sans-serif!important;
    font-size: 1.0em; font-weight: bold;
}
.sp-megamenu-parent > li > a,
.sp-megamenu-parent > li > span,
.sp-megamenu-parent .sp-dropdown li.sp-menu-item > a {
 font-family: 'Verdana', sans-serif;
 text-decoration: none;
}
.sp-megamenu-parent .sp-dropdown .sp-dropdown-inner {
	box-shadow: 0 3px 5px 0 rgba(0, 0, 0, 0.2);
	padding: 20px;
	background-color: var(--blanc);
}

.sp-megamenu-parent .sp-dropdown li.sp-menu-item.active > a {color: var(--active)}
.sp-megamenu-parent > li > a, .sp-megamenu-parent > li > span {
    font-size: 1.0em; font-weight: bold;color: var(--couleur)}
.sp-megamenu-parent .sp-dropdown li.sp-menu-item > a, .sp-megamenu-parent .sp-dropdown li.sp-menu-item span:not(.sp-menu-badge) { font-size: 1.0em; font-weight: bold;color: var(--couleur)}
.sp-megamenu-parent > li.active > a, .sp-megamenu-parent > li.active:hover > a {
	color: var(--prune);
	font-weight:bold;
}
.offcanvas-menu .offcanvas-inner ul.menu>li.menu-parent>a>.menu-toggler,
.offcanvas-menu .offcanvas-inner ul.menu>l    i.menu-parent>.menu-separator>.menu-toggler{color:var(--prune)}
.offcanvas-menu .offcanvas-inner ul.menu > li a:hover, .offcanvas-menu .offcanvas-inner ul.menu > li a:focus, .offcanvas-menu .offcanvas-inner ul.menu > li span:hover, .offcanvas-menu .offcanvas-inner ul.menu > li span:focus {
	color: var(--active);
}

.centre{margin-right:auto;margin-left:auto;text-align:center}
.gauche{text-align:left}
.article-list .article .article-intro-image, .article-list .article .article-featured-video, .article-list .article .article-featured-audio, .article-list .article .article-feature-gallery {
	margin: 0 auto;
	border-radius: 3px 3px 0 0;
	border-bottom: 1px solid #f5f5f5;
	overflow: hidden;
}
.article-list .article{
	border: solid 3px var(--prune);
	border-radius: 12px;
	background-color: var(--blanc);
	margin:5px 10px;
}
div .com-contact {margin-left:20px;margin-right:20px}

.sp-dropdown-sub{width:440px!important} 
.sp-scroll-up {
	color: var(--gris);
	background-color: var(--prune);
}
.sp-scroll-up:hover, .sp-scroll-up:active, .sp-scroll-up:focus {
	border:solid 1px var(--prune);
	color: var(--prune);
	background-color: var(--gris);
}
#sp-menu ul.social-icons a {
	color: var(--prune);
}
ul.social-icons{list-style:none;padding:0;margin:0;display:inline-block;width:100%;text-align:center}
li.social-icon-facebook {font-size: 2.5em}
.offcanvas-menu .offcanvas-inner a {
	color: var(--prune);
}
.row{--bs-gutter-x:0}
.article-details .article-full-image {
	margin-bottom: 2.0rem;
	text-align: center;
}
.article-details {
	padding: 2.0rem 2.0rem;
	background-color: var(--blanc);
	border:solid 3px var(--prune);
	border-radius: 12px;
	text-align:justify
}
.article-details li {margin-bottom:5px}


.article-body{text-align:justify}
.page-item.active .page-link {
  z-index: 3;
  color: var(--blanc);
  background-color: var(--prune);
  border-color: var(--active)/*#0d6efd*/;
  }
#sp-bottom {
  font-size: 0.8em;
  line-height: 1.0em;
}
#formulaire td.gauche{text-align:left;padding-left:10px;}
#formulaire td.gauche1{text-align:left;padding-left:10px;width:12em}
#formulaire th.gauche{text-align:left;}
#formulaire table{table-layout:fixed;width: 100%; border:solid 2px var(--prune);border-collapse: collapse}
#formulaire input{margin-right:20px}
#formulaire input[type="number"], #formulaire input[type="text"]{display:inline!important;width:4.5em!important;height:20px}
.long
{
    width: 100%;
    white-space: nowrap;
    overflow: hidden;
    display: block;
}
.long::before{content:"\0000A0 \0000A0"}
.td25{width:25%}
.td50{width:50%}
.td30{width:30%}
.td35{width:35%}
.td40{width:40%}
.td20{width:20%}
.pb{padding-bottom:15px;}
.pt{padding-top:20px}
.input-group:not(.has-validation) > .dropdown-toggle:nth-last-child(n+3), .input-group:not(.has-validation) > :not(:last-child):not(.dropdown-toggle):not(.dropdown-menu) {
	border-top-right-radius: 10px;
	border-bottom-right-radius: 10px;
}
.monlogin {text-align:center;font-family: Mapolice;margin:1.2em 0;font-size:1.4em;font-weight:bold}
.article-info > span + span::before {
  content: ",";
  padding-left:0px
}
.petit{font-size:80%}
.form-control:focus{color:red;background-color:#fff;border-color:var(--prune);outline:0;box-shadow:0 0 0 .25rem var(--couleur);}

#jform_captcha {
  text-align: center;
  margin-top: -40px;
}
#jform_contact_email_copy-lbl {
		float:left;
		margin-right:10px;
}

#jardins ol {
  counter-reset: section; /* On crée une nouvelle instance du
                                            compteur section avec chaque ol */
  list-style-type: none;
}

#jardins li::before {
  counter-increment: section;
  content: counters(section, ".") " ";
  font-weight:bold
}


#jardins .tete {text-align:center;font-style:italic;font-size:1.2em}
#jardins .par {list-style: symbols(cyclic "1)  " "2)" "3)" "4)" "5)" "6)" "7)" "8)");}
#jardins dd::before {
  content: "▸ ";}
.temoin h2, .monblog h2{  font-size: calc(1.0rem + .6vw)!important;
  margin: 0.2rem 0 1.25rem 0!important;
  font-weight: 800;
}
