/*
Theme Name:     Ecogeos_theme
Description:    Theme enfant de Divi fourni par Studio Niko
Author:         Studio Niko
Template:       Divi
Version:        3.9
*/

/*
Rajoutez vos règles de CSS personnalisé ci-dessous
*/

/* LES MEDIA QUERIES DE DIVI*/
/*** Responsive Styles Large Desktop And Above ***/
@media all and (min-width: 1405px) {
  
}

 
/*** Responsive Styles Standard Desktop Only ***/
@media all and (min-width: 1100px) and (max-width: 1405px) {
 
}

/*** Responsive Styles Standard tablet paysage ***/

/*** sur page d'accueil gerer les tailles de titres en format intermediaire avant le mode tablette vertical***/
@media all and (min-width: 981px) and (max-width: 1140px) {
    .text_trois_poles {
        font-size: 15px;
    }
    .text_trois_poles_titre h2{
        font-size: 32px !important;
    }
    /*#Titretroispoles h2{
        font-size: 22px !important;
    }*/
}

/* tente d'adapter la carte internationale en petit format*/ 
@media all and (min-width: 280px) and (max-width: 442px) {
#localisation_internationale {
   /* max-height: none;
    transform: scaleX(0.75) scaleY(0.75);*/
     width : 100%;
    max-width:320px;
    }
    
    #Fond_carte_internationale {
     width : 100%;
    max-width:320px;
    }
}

 
/*** Responsive Styles Tablet And Below ***/
@media all and (max-width: 980px) {
 
}

/*** Responsive Styles Tablet Only ***/
@media all and (min-width: 768px) and (max-width: 980px) {
 
}
 
/*** Responsive Styles Smartphone Only***/

/*en dessous de 767px fait disparaitre l'image dans les archives projet et adapte la hauteur et padding du texte metadonnées*/
@media all and (max-width: 767px) {
 .filtre_equipe img {
display:none;
/*max-width: 250px;*/
    }
.filtre_equipe .post-meta {
  padding-top:6px;
height: 25px;
}
}
    
/* Élément ciblé image yvelin dans archive projet d'yvelin| https://tests.studioniko.fr/project/yvelin-bisiaux/ 
div.et_pb_portfolio_item:nth-child(10) > a:nth-child(1) > span:nth-child(1) > img {
  max-width: 50%;
}*/





 
/*** Responsive Styles Smartphone Portrait ***/
@media all and (max-width: 479px) {
 
}

/* FIN DES MEDIA QUERIES DE DIVI*/


/* habillage du texte genere en jQuery dans "local a international" sur mappemonde internationale, finalement fait en direct avec le jQuery
.villemonde {
color:#16A5AD;
display:inline-block;
padding-top:1em;
font-weight:400;
}
*/

/* change la couleur du fond de la navigation ancrée à droite de la page */

.et_pb_side_nav.et-visible, .side_nav_item {
    background-color: #16a5ad;
}


/*change la couleur des liens dans les accordeons des publications*/
.accordeons_publications a {
    color: #1BA28C;
    text-decoration: underline;
    text-decoration-line: underline;
    text-decoration-style: solid;
}


/*Fermer tous les accordeons au demarrage. Avec ce code css ci dessous est associé du code jquery inscrit dans
option du theme > integration > Ajouter ligne de code à la < head > de votre blog.
Et le code css ci-dessous est là pour faire apparaitre un btn fermeture*/
.et_pb_toggle_open .et_pb_toggle_title:before {
	display: block !important;
	content: "\e04f";
}


/* habille les liens-boutons de navigation dans les archives projets*/
.nav-single .nav-previous a,.nav-single .nav-next a{
display: inline-block;
    margin-bottom:120px;
    padding :12px 20px;
    color: white;
border-radius: 6px;
letter-spacing: 0px;
/*font-family: 'Montserrat',Helvetica,Arial,Lucida,sans-serif !important;
font-variant: small-caps !important;*/
background-color: #16a5ad;
}

.nav-single .nav-previous a:hover,.nav-single .nav-next a:hover{
color: white;
letter-spacing: 1px;
background-color: #11888e;
    transition: 0.25s
}


/* unifie la hauteur des metadescriptions dans les archives projets*/

/* ciblage initial 
.et_pb_filterable_portfolio_0.et_pb_filterable_portfolio .et_pb_portfolio_item .post-meta {
  height: 32px;
}*/
/* ciblage simplifie par class*/
.filtre_equipe .post-meta {
  height: 32px;
}


/* HABILLAGE BOUTON MENU-FLOTTANT à droite*/
/** l'installation de ce menu flottant est du code phph se trouvant dans la page index.php du theme. Voir original sur divi community*/
.menu-flottant {
    width:14em; /* Largeur des items du menu*/
        
    float: right; /* Je veux que le menu soit à droite*/
    position:fixed; /* Le menu est fixe à l'écran*/
    z-index:9999; /* Il sera au dessus de tous les éléments*/
    top: 0%; /* Il sera à 40% du bord supérieur de l'écran*/
    font-size: 1em; /* Taille de la police*/
    line-height: 50px; /* Hauteur de ligne du menu*/
    color: #fff; /* Couleur de la police*/
    font-weight:700; /* Mettre le texte en gras*/
    text-transform:uppercase; /* Mettre le texte en majuscule*/
    right: -10em; /* Décalage du menu sur la droite pour masquer le texte et ne laisser que les icônes de visibles*/
    
}
.menu-flottant ul {
    list-style: none; /* Le menu est une liste, mais je ne veux pas afficher les puces*/
    margin: 0; /* Choix des marges internes et externes*/
    padding: 0;
}
.menu-flottant ul li {
    display:block; /* Définition des items en tant que bloc*/
    background-color: #aaa; /* Couleur de fond*/
    height: 3.5em; /* Hauteur des items du menu*/
    padding: 1em 1.5em; /* Marges internes des items du menu*/
    position: relative; /* On leur attribut une position relative*/
    -webkit-transition: -webkit-transform 0.5s; /* Effet de déplacement au passage de la souris*/
    -moz-transition: -webkit-transform 0.5s; /* On le définit plusieurs fois pour assurer la compatibilité entre les navigateurs*/
	transition: transform .5s;
}
/*Couleurs de fond des items du menu*/
.menu-flottant ul li:nth-child(1) { 
	background-color: #cbed5e; /* 1er item du menu*/
    border-bottom-left-radius: 12px;
    box-shadow: -4px 2px 12px #11888e;
} 
.menu-flottant ul li:nth-child(2) { 
	background-color: #e41b1b; /* 2e item du menu*/
} 
.menu-flottant ul li:nth-child(3) { 
	background-color: #4843D2; /* 3e item du menu*/
} 
/* Si plus de 3, on ajoute ici les mêmes lignes en remplaçant les chiffres et couleurs*/

/* Création de la transformation CSS qui permet d'afficher le menu au passage de la souris*/
.menu-flottant ul li:hover {
    -webkit-transform: translateX(-10em);
    transform: translateX(-10em);
}

/* Mise en forme des liens du menu*/
.menu-flottant ul li a {
    display:block; /* On les définit en tant que bloc*/
    color: #fff; /* Couleur du texte*/
    text-decoration: none; /* On ne veut pas qu'ils soient soulignés par exemple*/
    position: absolute; /* On leur attribut une position absolue*/
    font-size:1em; /* Taille de la police*/
    line-height: 1.5em; /* Hauteur de ligne*/
    height:2em; /* Hauteur*/
    top:0; /* Positionnement*/
    bottom:0;
    right: 0.2em;
    margin:0 auto;
    padding:1em 1.5em;
}
  
/* Mise en forme des icônes du menu*/
  .menu-flottant ul li span {
    float: left;  /* On les cale à gauche */
    line-height: 1.5em; /* Hauteur de ligne */
    height:2em;
    padding-bottom: 1em;          
  }  
 /*FIN du MENU FLOTTANT*/




/* garde la mise en forme en 2 ou 3 COLONNES sur TABLET pour les class .deux_colonnes_tablet et .trois_colonnes_tablet*/
@media all and (min-width:768px) and (max-width: 980px) {
.deux_colonnes_tablet .et_pb_column {
	display:flex; /* sert à garder une disposition où apparait une gouttière*/
	width: 50%;
} 
 .trois_colonnes_tablet .et_pb_column {
	display:flex;
	width: 33%;
}
}
/*mise en forme tablet et smartphone pour le row début de page missions*/


/* @media all and (min-width:768px) and (max-width:980px) {
  .uneseulecolonne .et_pb_column { 
  display:flex!important;
  flex-wrap: wrap!important;
  justify-content:space-around!important;
  width:100%!important;}

  .smart_disappear {
    display:none;}

  .blurb_mission{
      margin-bottom: 10px!important;
    }
} */
@media all and (min-width:1331px) {
  .blurb_mission ul {
    padding: 0 0 0px 0px!important;
  }

}

@media all and (min-width:1095px) and (max-width:1330px){
  .blurb_mission h2 {
    font-size: 14px!important;}

   .blurb_mission ul {
      padding: 0 0 0px 0px!important;
      font-size: 85%!important;
    }
    /* .blurb_mission li {
      font-size: 80%!important;
    } */
}

@media all and (min-width:981px) and (max-width:1094px){
  .blurb_mission h2 {
    font-size: 12px!important;
}
.blurb_mission ul {
  padding: 0 0 0px 0px!important;
  font-size: 80%!important;
}
}

@media all and (max-width: 980px) {

  .uneseulecolonne .et_pb_column { 
  display:flex!important;
  flex-wrap: wrap!important;
  justify-content:space-around!important;
  width:100%!important;}

  .smart_disappear {
    display:none;}

  .blurb_mission{
    margin-bottom: 10px!important;
  }
  
  .blurb_mission h2 {
    font-size: 13px!important;
}
}

/* ajustements graphiques sur les modules divi blog*/
/* style.min.css | https://tests.studioniko.fr/wp-content/plugins/divi-blog-extras/styles/style.min.css?ver=2.6.4 */






/*.et_pb_post_extra.el_dbe_block_extended .post-content .post-data {
     margin-bottom: 15px; 
     margin: 0px; 
    margin-bottom: 0px;
    padding-left: 0px;
  }
  
  @media screen and (min-width: 981px) {
    .et_pb_column_4_4 .et_pb_post_extra.el_dbe_block_extended .post-content {
       padding: 30px; 
    }
  }*/
  
  /* on essaye de cibler le contenu texte du trombinoscope*/
  .post-content {
    /*text-align: center;*/
    padding: 2px;
    margin-left:-15px;
    margin-bottom: -25px;
    margin-top: -20px;
  }
  @media all and (min-width:768px) and (max-width: 980px) {
    .post-content {
      margin-top: -10px;}
    }

  /*on rapproche le trombinoscope des boutons de filtrage*/
  .el-isotope-container {
    bottom: 40px;
    }
/* Erreur de ma part ça amrche bien donc inutile. On garde pour le ciblage trouvé. forcer l'interlignage du titre car l'interlignage du module ne marche pas . il ya un 0,5em!important placé quelque part*/
 .entry-title{
    /*line-height:1em!important;*/
    padding-bottom:0px;
    text-align: center;
  }

  /*#post-2672 > div:nth-child(1n+0) {
    padding: 12px;
  }*/



/*.fiche_parcours h3.titre-niveau-4{
    font-weight: 700;
    color: #11888e!important;
    line-height: 1.2em;
}

.fiche_parcours h2.titre-niveau-3 {
    font-weight: 700;
    color: #16a5ad!important;
    line-height: 1.8em;
}*/



/*@media only screen and (max-width: 981px) {
     .piedepage { display: flex; }
    .piedepage .et_pb_column:first-child { order: 1; }
 .piedepage .et_pb_column:nth-child(2) { order: 3; margin-right: 0px!important;}
 .piedepage .et_pb_column:nth-child(3) { order: 2; margin-right: 3%!important;}
 .piedepage .et_pb_column:last-child { order: 4; }
}
    }*/

/* test fait pour trouver le bon ciblage et afficher le menu hamburger dès le départ */
/* @media only screen and (max-width: 2200px) {
  .et-menu-nav{
    display: none!important;
  }
  .et_mobile_nav_menu{
    display: flex;
  }
} */


/*aspect du menu déroulant des langues */
#divi-sticky-header #menuderoulant {
  cursor:pointer;
  width: 90px;
  background-color: transparent;
  height:32px;
  font-family: open-sans, sans-serif;
  font-weight: 400;
  line-height: 10px;
  font-size: 0.8rem;
  color: whitesmoke;
  margin-left: 15px;
  padding: 5px 5px;
  border: 0px;
  position: absolute;
  /*top: 0px;
  left: 0px;
  display:block;
  Margin-top :-37px;*/    
}
/*change l'opacité du bouton des fenetres pop up du module filtergrid */
.mfp-close {
  opacity:1!important;
  color: rgb(247, 242, 212)!important;
}
.mfp-close:hover {
  opacity:0.6!important;
  color: rgb(243, 192, 141)!important;
}

.orange-background {
  background-color: orangered !important; /* Ajoutez !important pour écraser les styles inline si nécessaire */
}

/* tentatives sur la balise option mais la balise option ne semble pas être possible à modifier en css
option {
  background-color: yellow;
 color: white;
}

#menuderoulant option a:visited {
 color: red;
}
*/

/* Page publication gere l'aspect des images au format carre*/

.formatcarre {
  margin-right: 10px;
  margin-bottom: 0px;
  border: 1px solid black;
  border-radius: 12px;}

@media screen and (max-width: 980px) {
  .formatcarre {
    margin-right: 8px;
    margin-bottom: 10px!important;
    border: 1px solid black;
    border-radius: 6px;}
  }