.bandeau{
margin-bottom:2.5rem;
background-image: url(//www.paysagiste-dreamis.fr/wp-content/themes/dreamis/css/img/leaves.svg);
background-position: left top;
background-size:50%;
overflow:hidden;
}
.bandeau h1 img{
width:80%; max-width:350px;
}
.bandeau .motif{
display:none;
}
.share{
margin-bottom:2rem;
text-align:right;
}
.share .sfsi_shortcode_container{
float:none;
}
.cat-descr{
font-size:1.5rem;
margin-bottom:3.5rem;
}
.liste-articles, .liste-annonces{
margin-bottom:3rem;
}
.liste-articles a{
display:block;
margin-bottom:1rem;
}
.liste-articles a .vgn{
overflow:hidden;
background: var(--grisclair) url(//www.paysagiste-dreamis.fr/wp-content/themes/dreamis/css/img/no-photo.svg) no-repeat center / 80px;
}
.liste-articles a .dt{
display:block; padding-top:0.5rem;
font-weight:bold; font-size:0.75rem;
color: var(--vert);
}
.liste-articles a .ttl{
display:block; padding-top:0.25rem;
}
.liste-articles a img{
width:100%; height:100%; object-fit:cover;
position:absolute; left:50%; top:50%;
-webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%);
-webkit-transition:all 0.2s ease; transition:all 0.2s ease;
}
.liste-articles a:hover img{
-webkit-transform: translate(-50%, -50%) scale(1.1); transform: translate(-50%, -50%) scale(1.1);
}
.liste-annonces .annonce{
border:1px solid var(--grisclair);
}
.liste-annonces .annonce .inner{
padding:1rem;
}
.liste-annonces .dt{
margin-bottom:1rem;
font-size:0.8rem;
color: var(--vert);
}
.liste-annonces .ttl{
margin-bottom:1rem;
font-weight:bold; font-size:1rem;
}
.liste-annonces a{
display: block;
background-color: var(--noir); color: var(--blanc);
padding:0.5rem 1rem; text-align:center;
border-radius:1px;
}
.liste-annonces a:hover{
background-color: var(--vert);
}
.posts-nav{
margin:3rem 0;
font-size:1.5rem; font-weight:500;
text-transform: uppercase;
}
.posts-nav a{
display:inline-block;
border:1px solid;
padding:0.5rem 1rem;
}
.infos-offre{
font-weight:bold;
font-size:1.35rem;
padding-bottom:1rem;
border-bottom: 1px solid var(--vert);
margin-bottom:2rem;
}
ul.side-liste{
list-style:none;
margin:0 0 1rem 0;
padding:0;
}
ul.side-liste li a{
display:block; padding: 0.5rem;
color: var(--noir);
}
ul.side-liste li a:hover{
background-color: var(--vert);
color: var(--blanc);
}
ul.side-liste li a span{
display:block;
}
ul.side-liste li a .dt{
font-size:0.8rem; font-weight:bold;
}
ul.side-liste li:nth-child(even) a{
background-color: var(--grisclair);
}
ul.children{
list-style:none; margin:2rem 0; padding:0;
display:flex;
flex-wrap: wrap;
justify-content: start
}
ul.children li{
margin-right:1px;
}
ul.children li a{
display:block; padding:1rem 1.5rem;
background-color: var(--noir); color: var(--blanc);
}
ul.children li.active a{
background-color: var(--orange);
}
ul.children li a:hover{
background-color: var(--vert);
}
@media screen and (min-width:1200px){
.bandeau .motif{
display:block;
position:absolute; right:0; bottom:-2px;
width:200px;
background: url(//www.paysagiste-dreamis.fr/wp-content/themes/dreamis/css/img/arbre.svg) no-repeat center / contain;
-webkit-transition:all .5s linear; transition:all .5s linear;
}
.bandeau{
margin-bottom:3.5rem; overflow:hidden;
}
.bandeau.up .motif{
-webkit-transform: translateY(100%);  transform: translateY(100%); 
}
}