/*
Theme Name: Pierre Matter
Description: Theme enfant de Id Web Solution
Author: Thierry Bricault
Author URI: https://idwebsolution.fr
Template: Idweb
Version: 0.1.0
*/
/* Smartphones (portrait and landscape) ----------- */
/*@media only screen and (min-device-width : 320px) and (max-device-width : 480px) {
/* Styles */
/*}*/
/* Smartphones (portrait and landscape) ----------- */
@media only screen and (min-device-width : 720px) {
/* menu trait */
.bouton_menu .current-menu-item a::before,
.bouton_menu .current_page_item a::before {
content: "";
position: absolute;
z-index: 2;
left: 0;
right: 0;
}
.bouton_menu li a:before {
content: "";
position: absolute;
z-index: -2;
left: 0;
right: 100%;
bottom: 25%;
/*background: red; /*** COLOR OF THE LINE ***/
background: #253438; /*** COLOR OF THE LINE ***/
height: 2px; /*** THICKNESS OF THE LINE ***/
-webkit-transition-property: right;
transition-property: right;
-webkit-transition-duration: 0.3s;
transition-duration: 0.3s;
-webkit-transition-timing-function: ease-out;
transition-timing-function: ease-out;
}
.bouton_menu li a:hover {
opacity: 1 !important;
}
.bouton_menu li a:hover:before {
right: 0;
}
.bouton_menu li li a:before {
bottom: 12%;
}
}
/***********/
/* bordure bouton langue */
.trp-language-switcher > div {
border: 0px;
}
/*couleur bouton en savoir plus*/
.et_pb_blog_0 .et_pb_post div.post-content a.more-link {
padding-left: 10px;
margin-right: 68px !important;
border: 1px solid #bcbcbc;
background:#fff;transition: 0.3s;
}
.et_pb_blog_0 .et_pb_post div.post-content a.more-link:hover {
background:#000000;
color:#F2F2F2;
}
/*hauteur vignette blog*/
.et_pb_blog_0:not(.et_pb_blog_grid_wrapper) .et_pb_post {
min-height: 290px;
}
/*autre fonction pour centrer verticalement*/
.ds-vertical-align {
display: flex;
flex-direction: column;
justify-content: center;
}
/*bouton artiste accueil*/
.styled {
border : #000000 solid 2px ;
line-height: 2.5;
padding: 0 20px;
font-size: 16px;
text-align: center;
color: #000000;
border-radius: 3px;
background-color: #fff;
margin-top:10px;
}
.styled:hover {
background-color: #D3D3D3;
}
.styled:active {
box-shadow:
inset -2px -2px 3px rgba(255, 255, 255, 0.6),
inset 2px 2px 3px rgba(0, 0, 0, 0.6);
}
/* menu burger couleur */
/*.et_pb_menu_0_tb_header .mobile_nav .mobile_menu_bar:before, .et_pb_menu_0_tb_header .et_pb_menu__icon.et_pb_menu__search-button, .et_pb_menu_0_tb_header .et_pb_menu__icon.et_pb_menu__close-search-button, .et_pb_menu_0_tb_header .et_pb_menu__icon.et_pb_menu__cart-button {
background: red;
border-radius: 50%;
padding: 5px;
}*/
/*vignette accueik*/
.img_accueil img{
height:550px;
object-fit:cover;
}
/* bouton manuel*/
/*.bouton{
display: block;
background-color: #ffffff;
border: 1px solid #000000;
color: #000000;
text-align: center;
font-size: 18px;
padding: 10px;
width: 200px;
transition:0,2s;
}*/
/*.bouton:hover{
background-color: grey;
color: #000000;
text-align: center;
font-size: 18px;
}*/
.bouton {
position: relative;
padding-right: 20px; /* Ajustez en fonction de la taille de la flèche */
transition: all 0.3s ease;
display: block;
background-color: #ffffff;
border: 1px solid #000000;
color: #000000;
text-align: center;
font-size: 18px;
padding: 10px;
width: 200px;
transition:0,2s;
}
/* Ajout de la flèche */
.bouton::after {
content: '>'; /* Flèche droite */
position: absolute;
right: -20px; /* Place la flèche à droite du bouton */
opacity: 0;
transition: all 0.3s ease;
font-size: 18px; /* Taille de la flèche */
}
/* Effet de survol */
.bouton:hover::after {
right: 10px; /* Ajuste la position de la flèche à côté du texte */
opacity: 1; /* Rend la flèche visible */
}
/* Changement de couleur au survol (optionnel) */
.bouton:hover {
background-color: #F2F2F2; /* Change la couleur du fond */
color: #000000; /* Change la couleur du texte */
width:195px;
}
/*image taille defini*/
.formatImg {
width: auto;
height: 450px;
overflow: hidden;
}
.formatImg img {
width: 100%;
height: 100%;
object-fit: cover;
object-position: center center; /* Par défaut, centré */
}
.formatImg1 {
width: auto;
height: 450px;
overflow: hidden;
}
/*v2*/
.formatImg1 img {
width: 100%;
height: 100%;
object-fit: cover;
/*object-position: center center; /* Par défaut, centré */
}
/*bouton envoyer*/
.bouton_envoyer{
position: relative;
padding-right: 20px; /* Ajustez en fonction de la taille de la flèche */
transition: all 0.3s ease;
display: block;
background-color: #ffffff;
border: 1px solid #000000;
color: #000000;
text-align: center;
font-size: 18px;
padding: 10px;
width: 200px;
transition:0,2s;
}
.bouton_envoyer::after {
content: '>'; /* Flèche droite */
position: absolute;
right: -20px; /* Place la flèche à droite du bouton */
opacity: 0;
transition: all 0.3s ease;
font-size: 18px; /* Taille de la flèche */
}
.bouton_envoyer:hover::after {
right: 10px; /* Ajuste la position de la flèche à côté du texte */
opacity: 1; /* Rend la flèche visible */
}
.bouton_envoyer:hover {
background-color: #F2F2F2; /* Change la couleur du fond */
color: #000000; /* Change la couleur du texte */
width:195px;
}
/*bouton flow*/
#ff-stream-1 .ff-loadmore-wrapper .ff-btn, #ff-stream-1 .ff-square:nth-child(1) {
border: 1px solid #191b1f;
color:#191b1f!important;
}
/*bandeau filtrable portfolio*/
ul.et_pb_tabs_controls::after {
/*border-top: 1px solid #d9d9d9;*/
border-top: 0px solid;
content: "";
display: block;
visibility: visible;
position: relative;
top: -1px;
z-index: 9;
background-color:red!important;
}
/*image contact*/
.image_contact img {
object-fit: cover;
}
/* Inverser les colonnes sur page d'accueil version tablette et mobile */
@media only screen and (max-width : 980px) {
.dc_inverser_colonnes-section .dc_inverser_colonnes-ligne {
display: -webkit-flex;
display: -ms-flex;
display: flex;
-webkit-flex-direction: column-reverse;
-ms-flex-direction: column-reverse;
flex-direction: column-reverse;
}
}
/* Fin du code pour inverser colonnes */
/* croix Menu Burger*/
@media only screen and (max-width: 980px) {
.mobile_nav.opened .mobile_menu_bar:before {
content: "\4d";
}
}
.et_pb_scroll_top.et-pb-icon {
background: #7cda24;
}
/*sous menu fermé*/
/*#mobile_menu1 .menu-item-has-children > a {
background-color: transparent;
position: relative;
}
#mobile_menu1 .menu-item-has-children > a:after {
font-family: 'ETmodules';
text-align: center;
speak: none;
font-weight: normal;
font-variant: normal;
text-transform: none;
-webkit-font-smoothing: antialiased;
position: absolute;
}
#mobile_menu1 .menu-item-has-children > a:after {
font-size: 16px;
content: '\33';
top: 13px;
right: 10px;
}
#mobile_menu1 .menu-item-has-children.visible > a:after {
content: '\32';
}
#mobile_menu1 ul.sub-menu {
display: none !important;
visibility: hidden !important;
transition: all 1.5s ease-in-out;
}
#mobile_menu1 .visible > ul.sub-menu {
display: block !important;
visibility: visible !important;
}*/
/* fin du code pour refermer les sous-menus */
.trp-language-switcher > div > a {
color: #fff;
background-color:none!important;
}
.trp-language-switcher > div {
background-color: rgba(0, 0, 0, 0.0);
}
/* masquer le titre du formulaire dans les fiches dispo*/
.et_pb_contact_main_title {
display: none;
}
/* bouton dispo*/
.et_pb_blog_0 .pagination a {
position: relative;
padding-right: 20px; /* Ajustez en fonction de la taille de la flèche */
transition: all 0.3s ease;
display: block;
background-color: #ffffff;
border: 1px solid #000000;
color: #000000;
text-align: center;
font-size: 18px;
padding: 10px;
width: 220px;
transition:0,2s;
}
/* Changement de couleur au survol (optionnel) */
.et_pb_blog_0 .pagination:hover {
background-color: #F2F2F2; /* Change la couleur du fond */
color: #000000; /* Change la couleur du texte */
width:220px;
}
/* Changement de couleur au survol (optionnel) */
.et_pb_blog_0 .pagination:hover {
background-color: #F2F2F2; /* Change la couleur du fond */
color: #000000; /* Change la couleur du texte */
width:220px;
}
.alignright{
margin-top: 30px;
}
.et_pb_pagination .prev,
.et_pb_pagination .next {
display: inline-block; /* Assurez-vous que les deux boutons sont affichés */
}
/*styles the wp-pagenavi pagination links*/
.wp-pagenavi a, .wp-pagenavi span {
padding: 0.3em 0.8em !important;
font-size: 2em !important;
color: #333333;
line-height: 2em;
background: #eeeeee;
transition: all .5s;
}
/*styles the wp-pagenavi current page number*/
.wp-pagenavi span.current {
color: #ffffff !important;
background: #333333 !important;
}
/*styles the wp-pagenavi pagination links on hover*/
.wp-pagenavi a:hover {
color: #ffffff !important;
background: #333333 !important;
}
/*styles the wp-pagenavi pages text*/
.wp-pagenavi .pages {
background: none;
}
/*pers css pagenavi thierry*/
.wp-pagenavi {
clear: both;
width: max-content;
text-align: center;
font-size:12px;
display: flex;
justify-content: center;
align-items: center;
padding: 20px 0;
font-family: Arial, sans-serif;
margin: 0 3px;
flex-wrap: wrap;
}
.et_pb_blog_0 .wp-pagenavi a, .et_pb_blog_0 .wp-pagenavi span {
color: #191B1F !important;
font-size: 12px !important;
}
.et_pb_blog_0 .wp-pagenavi a:hover, .et_pb_blog_0 .wp-pagenavi span {
color: #fff !important;
}
.et_pb_blog_0 .wp-pagenavi a, .et_pb_blog_0 .wp-pagenavi span {
color: #fff !important;
}
.et_pb_blog_0 .wp-pagenavi span {
color: #191B1F !important;
border-radius: 10px;
}
.et_pb_blog_0 .wp-pagenavi a, .et_pb_blog_0 .wp-pagenavi span {
color: #191B1F !important;
border-radius: 10px;
}
/* Cibler de manière ultra-spécifique l'élément actif */
.wp-pagenavi .current,
.wp-pagenavi span.current,
.wp-pagenavi a.current {
background-color: #191B1F !important;
color: #fff !important; /* Forcer le texte blanc */
font-weight: bold !important;
border-color: #0073aa !important;
}
/* Ajouter plus de spécificité en ciblant directement les liens */
body .wp-pagenavi .current,
html .wp-pagenavi span.current,
body .wp-pagenavi a.current {
color: #fff !important; /* Cibler encore plus précisément */
}
/* Responsive design pour mobile */
/* Responsive design pour mobile */
@media only screen and (max-width: 600px) {
.wp-pagenavi {
padding: 10px; /* Ajustement de l'espacement vertical */
justify-content: center; /* Centrer les éléments sur mobile */
flex-wrap: wrap; /* Permettre aux éléments de passer à la ligne */
width: 100%; /* S'assurer que le conteneur prend toute la largeur */
}
.wp-pagenavi a, .wp-pagenavi .current {
padding: 4px 6px; /* Taille plus petite pour les cases */
font-size: 12px; /* Taille de texte plus petite pour les boutons */
margin: 2px; /* Réduire les marges pour éviter le débordement */
flex: 0 1 auto; /* Permettre aux éléments de s'ajuster automatiquement */
max-width: 80px; /* Limiter la largeur pour éviter le débordement */
box-sizing: border-box; /* Inclure le padding et la bordure dans la largeur totale */
overflow: hidden; /* Éviter le débordement du texte */
white-space: nowrap; /* Éviter le retour à la ligne dans le texte */
}
}
.no-translate {
/* Utilisez cette classe uniquement pour organisation, sans 'translate: no;' */
}
.bouton_envoi{
background-color:#191b1f!important;
color:#fff!important;
}
.bouton_envoi:hover{
background-color:#bcbcbc!important;
color:#191b1f!important;
}
/*fenêtre de confirmation mail*/
/*div.wpforms-container-full .wpforms-confirmation-container-full, div[submit-success] > .wpforms-confirmation-container-full:not(.wpforms-redirection-message) {
background: #191b1f!important;
color:#fff!important;
}*/
/*.wp-pagenavi {
padding: 330px 0!important;
margin: 0 -20%!important;
width:200px!important;
}*/
/* Corrige l'affichage de la pagination pour qu'elle soit toujours en dessous */
.et_pb_blog_grid:after {
content: "";
display: block;
clear: both;
}
/* La pagination doit venir après toutes les lignes */
.wp-pagenavi {
display: block;
clear: both;
width: 100%;
margin-top: 30px;
}