﻿/*
Theme Name: Cherry
Theme URI: http://www.cherry-multimedia.fr
Description: Theme créer par Fabien Frayssinet
Version: 0.1
Author: Fabien Frayssinet
 */
/*####################### Commun #######################*/
body {  margin : 0 auto;  }

.h1,
h1 { margin: 40px 0 10px 0; font-size: 18px; color: #5f1916; font-weight: bold; text-transform: uppercase; }
.h2,
h2 { margin-top: 40px; font-size: 18px; color: #5f1916; font-weight: bold; text-transform: uppercase; text-decoration: none;}
.h2,
h2 a { color: #5f1916; text-transform: uppercase; text-decoration: none;}
.h3,
h3 { margin-top: 25px; font-size: 17px; color: #5f1916; font-weight: bold; }
hr { margin-top: 50px; }

a       { color: #50110e; }
a:hover { color: #50110e; }
a:focus { color: #50110e; }

table td { padding: 7px }
span[aria-current=page] { font-weight: bold; font-size: 18px; }

.red { color: #5f1916; }
.flex {
    display: flex;
    justify-content: space-between;
}
.justify-space-between {
    justify-content: space-between;
}

div.wpcf7 .wpcf7-form label     { width: 100%; font-family: Arial,sans-serif; font-size: 14px; color: #5f1916; }
div.wpcf7 .wpcf7-form input     { padding: 2px 10px; height: 28px; }
div.wpcf7 .wpcf7-form input[type=checkbox] { width: 15px; height: 15px; }
div.wpcf7 .wpcf7-form input[type=file] { padding-left: 2px }
div.wpcf7 .wpcf7-form input,
div.wpcf7 .wpcf7-form textarea            { border: 1px solid #bebfba; width: 100%; }
div.wpcf7 .wpcf7-form .message            { margin-top: -20px; }
div.wpcf7 .wpcf7-form .g-recaptcha        { margin: 0 auto; width: 302px; display: block; }
div.wpcf7 .wpcf7-form input[type=submit]          { margin: 19px auto; width: 302px; height: 44px; display: block; background: #5f1916; color: #fff; border: 0; font-weight: bolder;
                                            -webkit-transition: all 0.3s;  -moz-transition: all 0.3s;  -ms-transition: all 0.3s;  -o-transition: all 0.3s;  transition: all 0.3s; }
div.wpcf7 .wpcf7-form input[type=submit]:hover    { background: transparent; color: #5f1916; border: 1px solid #5f1916; }
div.wpcf7 .ajax-loader   { margin: 0 auto; display: block; }
div.wpcf7-response-output { padding: 0; margin: 0; }
div.wpcf7-validation-errors { margin: 0 auto; padding: 10px; max-width: 750px; border: none; text-align: center; color: #a94442; background-color: #f2dede; border-color: #ebccd1;  }

.navigation { display: block; text-align: center; }
.no-gutters { padding-left: 0; padding-right: 0; }
.back       { font-weight: bold }
.mfp-close-btn-in .mfp-close { color: #fff !important; font-size: 50px; }
/*###################### Template ######################*/
header.principal { position: fixed; right: 0; left: 0; top: 0; z-index: 1000; }
header.principal .top-wrapper     { height: 80px;  background: #000000; }
header.principal .top-wrapper a   { outline: 0; }
header.principal .search-input    { padding: 25px 0; float: right; }
header.principal .search-input .search        { height: 30px; width: 330px; border: 1px; border-radius: 0; padding: 4px 48px 4px 12px; color: #2e2e2e; font-size: 12px;  }
header.principal .search-input .search-submit { right: 15px; position: absolute; height: 30px; width: 35px; padding: 0 10px; border: 0; border-radius: 0; color: transparent; font-weight: normal; background: #672625; color: #fff; font-size: 16px;  }
/*menu*/
header.principal .nav-wrapper             { height: 58px; position: absolute; width: 100%; z-index: 1; background: rgba(115, 42, 41, 0.9); }
header.principal .nav-wrapper nav         { font-family:  "Cormorant", Arial, sans-serif; }
header.principal .nav-wrapper nav ul      { padding: 10px 0; margin: 0 0 0 -10px; letter-spacing: -0.31em; }
header.principal .nav-wrapper nav ul li   { display: inline-block; font-size: 25px; font-weight: bold; color: #fff; letter-spacing: normal; }
header.principal .nav-wrapper nav ul li a     { padding: 0 7px; color: #fff; }
header.principal .nav-wrapper nav ul li span  { margin-left: 4px; }
header.principal .nav-wrapper nav ul li.current-menu-item a { text-decoration: underline }
header.principal .nav-wrapper nav ul li a:hover {
 text-decoration: none; outline: 0; color: #000; -webkit-transition: color 0.2s ease; -moz-transition: color 0.2s ease; -ms-transition: color 0.2s ease; -o-transition: color 0.2s ease; transition: color 0.2s ease; cursor: pointer; }
header.principal .nav-wrapper nav ul li a:hover:after, header .nav-wrapper nav ul li a:hover:before {
    outline: 0; background-color: #1B98E0; -webkit-transition: all 1s ease 0s; -moz-transition: all 1s ease 0s; -ms-transition: all 1s ease 0s; -o-transition: all 1s ease 0s; transition: all 1s ease 0s; }
header.principal .nav-wrapper nav ul li a:before { content: ""; width: 3px; height: 3px; bottom: 0; right: 0; left: 0; margin: 0 auto; }
header.principal .nav-wrapper nav ul li:last-child span { display: none; }

/*menu mobile*/
.btn-mobile-menu        { padding-left: 20px; display: none; right: 0; position: absolute; z-index: 100; height: 80px; width: 60px; cursor: pointer; }
.burger,
.burger::before,
.burger::after          { margin-top: 38px; position: absolute; width: 24px; height: 4px; background: rgba(115, 42, 41, 1); transition: all 0.3s; }
.burger::before,
.burger::after          { content: ""; display: block; }
.burger::before         { margin-top: -8px; }
.burger::after          { margin-top: 8px; }
.btn-mobile-menu.active .burger{ background: transparent; }
.btn-mobile-menu.active .burger::before  { margin-top: 0; transform: rotate(-45deg); }
.btn-mobile-menu.active .burger::after   { margin-top: 0; transform: rotate(45deg); }

.mobile-menu                    { top: 50px; padding: 0 50px; width: 465px; right: 0; overflow-x: hidden; position: absolute; text-align: right; transition: all 0.2s; }
.mobile-menu:before             { right: -100%; content: ''; background: #000; width: 100%; position: fixed; height: 100%; z-index: 1; transition: right 0.2s; }
.mobile-menu .menu-menu-principal-container  { margin-top: 50px; position: relative; left: 350px; z-index: 2; transition: all 0.6s }


.mobile-menu.active             { opacity: 1 }
.mobile-menu.active:before      { right: 0 }
.mobile-menu.active .menu-menu-principal-container  { left: 0; z-index: 2; }


.mobile-menu ul                 { margin: 0; padding: 0; list-style-type: none; }
.mobile-menu ul li              { font-size: 24px; padding: 8px; }
.mobile-menu ul li a            { color: #fff; }

/*liste d'éléments*/
.list                               { margin-top: 30px; }

/*content*/
.page-content-area                  { margin-top: 140px; }
.entry-content a                    { text-decoration: underline; }
.entry-content ul                   { list-style-type: none; }
.entry-content li:before            { content:''; display: block; position: relative; width: 6px; height: 6px; left: -25px; top: 13px; background: #6b2d2b;  }
.entry-content img                  { max-width: 100%; height: auto; }
.entry-content img.alignleft { float: left; margin: 7px 24px 7px 0; }
.entry-content img.alignright { float: right; margin: 7px 0 7px 24px; }
.entry-content img.aligncenter { clear: both; display: block; margin: 7px auto; }

span.special-icon { padding-left: 40px; position: relative; }
span.special-icon:before{ margin: -6px 0 0 -34px; position: absolute; font-size: 23px; font-family: "Font Awesome 5 Free"; text-rendering: auto; }
span.bulletin:before{ content: '\f1ea'; }
span.photo-file:before{ content: '\f1c5'; }

span.panneau-link { display: block; padding: 26px 35px; }  
span.panneau-link:before{ content: ''; transform:translate(0, -10px); width: 30px; height: 56px; background: url("assets/images/icone-panneau.png") no-repeat; display: inline-block; }


/*footer top*/
footer                  { margin-top: 50px; }
footer .quick-access-module             { background: #dfe1d8; }
footer .quick-access-module .boxes-wrapper  {  }
footer .quick-access-module .box            { padding: 28px 0 18px 0; text-align: center; }
footer .quick-access-module .box span       { display: block; }
footer .quick-access-module .box .icon      { font-size: 42px; color: #6b2d2b; transition: all 0.1s; }
footer .quick-access-module .box .title     { padding: 10px; font-size: 17px; font-weight: bold; color: #5a5c57; }
footer .quick-access-module .box .resume    { height: 0; padding: 0; font-size: 14px; color: #777377; line-height: 16px; opacity: 0; transform: scale(0.8); transition: height 0.3s, padding 0s, opacity 0.2s; }

footer .quick-access-module .box:hover a        { text-decoration: none; }
footer .quick-access-module .box:hover .resume  { padding: 6px 13px; height: 60px; transform: scale(1); opacity: 1; }
footer .quick-access-module .box:hover .icon    { transform: rotate(2deg); }

/*footer bottom*/
footer .footer  { height: 110px; background: #403d3a; }
footer .footer ul#menu-menu-footer-haut         { padding: 0; margin: 0; }
footer .footer ul#menu-menu-footer-haut li      { display: inline-block; }
footer .footer ul#menu-menu-footer-haut li a    { padding: 0 5px; font-size: 12px; color: #fff; }
footer .footer ul#menu-menu-footer-haut li span { margin-left: 4px; color: #fff; }
footer .footer ul#menu-menu-footer-haut li:last-child span { display: none; }
footer .menu-menu-footer-haut-container         { margin-top: 15px; text-align: center; }

footer .footer ul#menu-menu-footer-bas          { margin-top: 10px; font-size: 10px; text-align: center }
footer .footer ul#menu-menu-footer-bas li  { display: inline-block; }
footer .footer ul#menu-menu-footer-bas li a    { padding: 0 5px; font-size: 10px; color: #fff; }
footer .footer ul#menu-menu-footer-bas li span { margin-left: 4px; color: #fff; }
footer .footer ul#menu-menu-footer-bas li:last-child span { display: none; }

/*####################### Pages d'accueil #######################*/
#page-home                          { margin-top: -62px; }
#page-home .slides-wrapper .slide   { padding: 0 6px;  }
#page-home .slides-wrapper .slide-1 { padding-left: 0; }
#page-home .slides-wrapper .slide-4 { padding-right: 0; }

#page-home .slides-wrapper .slide .inner   { height: 340px; background-size: cover; background-position: center center;}
#page-home .slides-wrapper .slide-1 .inner { background-image: url("assets/images/rieucros-1.jpg"); }
#page-home .slides-wrapper .slide-2 .inner { background-image: url("assets/images/rieucros-2.jpg"); }
#page-home .slides-wrapper .slide-3 .inner { background-image: url("assets/images/rieucros-3.jpg"); }
#page-home .slides-wrapper .slide-4 .inner { background-image: url("assets/images/rieucros-4.jpg"); }

#page-home .last-news           { margin-top: 40px; border-bottom: 1px solid rgba(115, 42, 41, 0.9); }
#page-home .last-news .h2       { line-height: 60px; margin: 0; text-align: center; display: block; }
#page-home .last-news .h2:after { margin-top: 7px; right: 0; height: 54px; display: inline-block; position: absolute; border-right: 1px solid rgba(115, 42, 41, 0.9); content: ""; }
#page-home .last-news .latest-posts { height: 76px }
#page-home .last-news a.latest-post                  { height: 0; opacity: 0; position: relative; z-index: -10; display: block }
#page-home .last-news a.latest-post .published-on    { font-size: 12px; font-style: italic; color: #797976; }
#page-home .last-news a.latest-post h4              { margin: 0; font-size: 20px; font-weight: 500; }
#page-home .last-news a.latest-post .excerpt        { color: #797976;  }
#page-home .last-news a.latest-post.active          { z-index: 1; animation: showNews 1s forwards; transform-origin: left; }

#page-home .last-news a:hover { text-decoration: none; }
#page-home .last-news a:hover h4 { text-decoration: underline; }
#page-home h1 { text-align: center;  }

@keyframes showNews {
    0%   { transform: scale(0.9); }
    100% { height: 76px; opacity: 1; transform: scale(1);}
}

/*##################### general Actualités ######################*/
.published         { padding: 5px 0 16px 0; }
.category-name a   { padding-right: 5px;  text-decoration: underline; color: #5f1916; }
.published-on      { color: #403d3a; }

/*#################### page Single Actualités ###################*/
.post-thumbnail     { margin: 0 45px 20px 0; width: 450px; float: left; }
.post-thumbnail img { width: 100% }

/*########################## List item ##########################*/
.categorie a        { padding: 0 10px 0 10px; font-size: 16px; text-decoration: none; color: #5f1916; }
.categorie a.active { font-weight: bold; text-decoration: underline; }

.list-item                { margin-top: 26px; background: #edeee8; transition: all .2s ease; box-shadow: 0 0 1px rgba(39,44,49,.1), 0 3px 16px rgba(39,44,49,.07); }
.list-item a:hover        { text-decoration: none; }
.list-item .thumbnail         { margin: 0; padding: 0; height: 150px; width: 100%; display: block; border: none; box-shadow: none; border-radius: 0; background-size: cover; background-position: center center; }
.list-item h2.entry-title     { margin: 0; padding: 0 0 5px 0 }
.list-item .list-item-content   { padding: 0 10px; }
.list-item .list-item-content a.content         { color: #403d3a }
/* liste internee */
.list-item a.interne-thumbnail strong         { color: #50110e }
.list-item:after                  { margin: 0 auto; width: 0; display: block; height: 2px; content: ""; background: #5f1916; transition: all .1s ease; }
.nav-links a { color: #403d3a; }
.list-item:hover {
    box-shadow: 0 0 3px rgba(39,44,49,.1), 0 6px 16px rgba(39,44,49,.07);
    transform: translate3D(0,-1px,0);
}
.list-item:hover:after    { width: 100%; }

.post h2:first-child { margin-top: 0; }
/*-- spécifique --*/
.item-news                { height: 360px; }
.item-news .list-item-content   { height: 205px; }

.item-interne .list-item-content { padding-top: 10px; }

/*######################## Page internes ########################*/
.categories-internes h1:first-child { padding-bottom: 20px }
.categories-internes .category      { display: inline-block; padding: 10px 0; }

/*###################### Gallerie internes ######################*/
.interne-thumbnail img              { width: 100%; height: auto; }
.interne-thumbnail p.title          { font-weight: bold }
.interne-thumbnail p                { color: black; }

.interne-popup              { max-width: 75%; margin: 0 auto; text-align: center; }
.interne-popup img          { max-width: 100%; max-height: 750px; }
.interne-popup strong       { display: block; color: white; }
.interne-popup p            { color: #ffffff; }
.interne-popup a            { color: #ffffff; text-decoration: underline }
.interne-popup a.blank      { color: #8a7473; }

@media (max-width: 1199px) {
    #page-home .slides-wrapper .slide .inner   { height: 250px; }
    header.principal .nav-wrapper nav ul li a   { font-size: 21px; }

    /*###################### Gallerie internes ######################*/
    .interne-popup,
    .interne-popup img              { max-width: 100%; }
}
@media (max-width: 991px) {
    header.principal .nav-wrapper nav ul li a     { padding: 0 7px; }
    header.principal .nav-wrapper { display: none; }
    #page-home .slides-wrapper .slide .inner   { height: 200px; }
    header.principal .search-input                  { margin-right: 50px; float: none }
    header.principal .search-input .search          { width: 100%; }
    header.principal .search-input .search-submit   { right: 65px; }
    .btn-mobile-menu { display: block; }

    .page-content-area                  { margin-top: 70px; }


    /* Page accueil */
    #page-home .last-news .h2:after { border: none }
    #page-home .last-news .latest-posts { height: 120px }

    footer .quick-access-module .box span       { display: block; }
    footer .quick-access-module .box .icon      { font-size: 42px; color: #6b2d2b; transition: all 0.1s; }
    footer .quick-access-module .box .title     { padding: 10px; font-size: 17px; font-weight: bold; color: #5a5c57; }
    footer .quick-access-module .box .resume    { padding: 6px 13px; height: 60px; transform: scale(1); opacity: 1; }
    footer .quick-access-module .box:hover .icon    { transform: rotate(0deg); }
    footer .footer  { height: auto; }
    footer .footer .logo                        { text-align: center }

}
@media (max-width: 767px) {
    .list-item            { height: 460px; }
    .item-interne         { height: auto }
    .list-item .thumbnail { height: 250px; }
}