/*
Theme Name: WP Bootstrap
Theme URI: https://wwwCodeWebHautesAlpes.fr
Author: MatosMc
Author URI: https://wwwCodeWebHautesAlpes.fr
Description: Thème WordPress basé sur Bootstrap

Teùplate : twentytwentyone
Version:      1.0.0
License:      GNU General Public License v2 or later
License URI:  http://www.gnu.org/licenses/gpl-2.0.html

Version: 1.1
*/

/*fond d'ecran*/

body {
  font-family: 'Lora', serif;
 }
 
 h1, h2, h3, h4, h5, h6 {
  font-family: 'Montserrat', sans-serif;
  font-weight:bolder;
  text-transform: uppercase;
 }

 h1
 {
   font-size: 1.5rem;
   font-weight:bold;
   text-align: center;
 }
 

.col, .col-1, .col-10, .col-11, .col-12, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-auto, .col-lg, .col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-auto, .col-md, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-auto, .col-sm, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-auto, .col-xl, .col-xl-1, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-auto {
  padding-right: 0px;
  padding-left: 0px;
}

.wp-block-image {
  margin-bottom: 0em;
}
figure {
  margin: 0 0 0rem;
}

.blog-post
{
    
}

.MenuIcon
{
  color: #000000;
  font-size: 1.25em;
}

h4
{
  color: #027083;
}

.footer
{
  font-size: 1.2rem;
}

a
{
  color: #027083;
}

a:hover
{
  color: #027083;
  text-decoration: underline;

}


.fond_caducee
{
  background-image: url("./img/caducee mkde.jpg");  
  background-repeat: no-repeat;
  background-position-x: center;
  background-color: #FFFFFF;
  border-radius: 25px;
  margin-top: 2rem;
  padding-top: 2rem;
  padding-bottom: 2rem;
  opacity: 0.9;
}



.fond_bleu
{
  background: linear-gradient(#027083, #3ab8ce);
  
}

.col-ecriture
{
  
  background-color: rgba(255,255,255,0.8);
  border-radius: 15px;
}

.col-ecriture.fit
{
  width: fit-content;
  padding: 1rem;
  margin-left: auto;
  margin-right: auto;
  color: #000000;
}

.carousel-caption
{
  
}


/*pour prendre au moins 1900px d'espace*/
@media (min-width: 1200px)
{
    .container {
        max-width: 1900px;
    }
}

/*Affichage barre de navigation*/
.breadcrumb {
    margin-top: 1rem;
    background-color : initial;
    color: black;

}

.breadcrumb-item.active {
  color: #000000;
}

.breadcrumb-item.active {
  color: #000000;
}

.breadcrumb-item a{
  color: #000000;
  text-decoration: none;
}

.breadcrumb-item+.breadcrumb-item::before {
  display: inline-block;
  padding-right: .5rem;
  color: #000000;
  content: "/";
}
 
.navbar
{
  background-color: rgba(255,255,255,0.7);
  font-family: 'Oswald', serif;
  text-transform: uppercase;
  font-weight: bold;
  font-size: 1rem;
 
}


/*Pour que les liens dans le menu fache juste la taille du texte afin que le bords ne depassent pas */
.navbar-nav .nav-link 
{
    width: fit-content;
    padding: 5px 15px;
}

/*gestion de l'icone d'ouverture et fermeture du menu */
.navbar-light .navbar-toggler {
    background: none;
    border: none;    
  }
  
  .navbar-light .navbar-toggler:active,
  .navbar-light  .navbar-toggler:focus {
    outline: 0;
  }
  
  .navbar-light .navbar-toggler .icon-bar {
    display: block;
    width: 22px;
    height: 2px;
    border-radius: 1px;
    margin: 4px 0 4px 0;
    transition: all 0.2s;
  }
  
  .navbar-light .navbar-toggler .icon-bar {
    background: #000000;
  }
  
  .navbar-light .navbar-toggler .icon-bar:nth-of-type(1) {
    transform: rotate(45deg);
    transform-origin: 10% 10%;
  }
  
  .navbar-light .navbar-toggler .icon-bar:nth-of-type(2) {
    opacity: 0;
    filter: alpha(opacity=0);
  }
  
  .navbar-light .navbar-toggler .icon-bar:nth-of-type(3) {
    transform: rotate(-45deg);
    transform-origin: 10% 90%;
  }
  
  .navbar-light  .navbar-toggler.collapsed .icon-bar:nth-of-type(1) {
    transform: rotate(0);
  }
  
  .navbar-light .navbar-toggler.collapsed .icon-bar:nth-of-type(2) {
    opacity: 1;
    filter: alpha(opacity=100);
  }
  
  .navbar-light .navbar-toggler.collapsed .icon-bar:nth-of-type(3) {
    transform: rotate(0);
  }

  /* pour afficher la marque a coté du menu*/
.navbar-light .navbar-brand {
    color: #027083;
    background-color: rgba(255,255,255,1);
    padding: 10px;
    border-radius: 15px;
    transition-property: color, background-color;
    transition-duration: 0.5s;   
    font-family: 'Anton', serif;
    font-size: 2rem;
    text-shadow: 4px 4px 4px #aaa;     
}

.navbar-light .navbar-brand:hover {
    color: rgba(255,255,255,1);
    background-color: #027083;
}



.navbar-light ul#menu-menu>li
{
  display: inline-block;
  position: relative;
  margin-left: 1em;
  margin-right: 1em;
  width: fit-content;
}

.navbar-light ul#menu-menu>li>a::before
{
  width: 0%;
  content: " ";
  position :absolute;
  bottom: 0;
  left: 50%;
  -ms-transform: translateX(-50%);
  transform: translateX(-50%);
  transition: all 1.0s;
  opacity: 1;
  height: 4px;
  background-color: #027083;
}

.navbar-light ul#menu-menu>li>a:focus::before,
.navbar-light ul#menu-menu>li>a:hover::before,
.navbar-light ul#menu-menu>li.active>a::before
{
  content: " ";
  position :absolute;
  bottom: 0;
  left: 50%;
  -ms-transform: translateX(-50%);
  transform: translateX(-50%);
  width: 100%;
  transition: all 1.0s;
  opacity: 1;
  height: 4px;
  background-color: #027083;
}  
.navbar-light ul#menu-menu>li.active>a::before
{
  background-color: #13bde7;
}  

ul.dropdown-menu.show li
{
    transition: border 0.5s;    
    
}

ul.dropdown-menu.show li:hover
{
    border:3px solid #027083;
}


.dropdown-toggle::after {
    content : "+";
    text-shadow: 1px 1px rgba(0, 0, 0, 0.5);
    font-weight: bold;
    display: inline-block;
    margin-left: 0.5em;
    vertical-align: 0;
    border-top: 0 solid;
    border-right: 0 solid transparent;
    border-bottom: 0;
    border-left: 0 solid transparent;    
}

.dropdown-toggle.active::after {
  content : "-";
}

.navbar-light .navbar-nav .nav-link {
    color: rgba(0,0,0,1);
}

/* les images*/
.survol{
  /*display:inline-block;*/
  overflow: hidden;
  /*position: relative;*/
  border-radius: 25px !important;    
  }

  .survol img{
  transition: transform .9s ease;
  transform: scale(1.0);
  width: 100%;
  height: auto;    
  

  }
  .survol img:hover
  {
  transform: scale(1.2);
  transition: transform  .7s ease;  
  
  }



.centpourcent>img, .centpourcent img
{  
  width: 100%;
  height: auto;  
  border-radius: 25px !important;  
}

.into_parent
{
position: absolute ;
width: 100%;
height: 100%;
top: 0;
text-align: center;
padding-top: 40%;
background:#FFFFFF;
opacity:0.0;
transition:  opacity 0.9s;
border-radius: 25px;
}

.into_parent:hover
{
opacity:0.8;
transition:  opacity 0.9s;
}

.titre_into_parent
{
  position: absolute ;
  top: 5%;
  font-family : Montserrat;
  font-weight: bolder;
  font-size: 1.5rem;
  opacity: 1.0;
  z-index: 9999;
  width: 100%;
  text-align: center;
  text-transform: uppercase;
  background-color: rgba(255,255,255,0.7);
  
}

.titre_into_parent a
{
  color: #000000;
  transition: text-shadow  .7s ease;  
}

.titre_into_parent a:hover
{
  font-weight: bolder;
  text-decoration: none;
  text-shadow: 1px 1px 5px black;
  transition: text-shadow  .7s ease;  
}

.titre_into_parent.into_center
{
  top: 40%;
}

.vignette
{
  min-width: 233px;
}


/* pour que les polices d'adaptent à l'ecran*/
@media (min-width: 1800px) {
  html {
  	font-size: 150%;
  }
}

@media (max-width: 768px) {
  html {
  	font-size: 85%;
  }
}


.loader
{
  color: #ffffff;
  display: block;
  position:absolute;  
  top:0;      
  left:0;      
  height:100%;    
  width:100%;
  background-color:#000000 ;       /* chacun ses goûts ! */   
  padding-top: 50vh;
  z-index: 5000;
}


/* Les volets depliants */

.deroulante::after
{
  content: "▼";
  margin-left: 3px;
}

#formations , #experience, #sports, #diplomes
{
    height: 0;  
    overflow: hidden;
    transition: height 0.5s ease-in;
    text-align: justify;
    margin: 0 1rem;
    
}


#formations:target, #experience:target, #sports:target, #diplomes:target{
	height: 12rem;
  
}


/* google maps */

.map-responsive{
  width: 90%;
  margin: 1rem 0;
  margin-left: auto;
  margin-right: auto;
  overflow:hidden;
  position:relative;
  height:250px;
  text-align: center;
  align-items: center;
}
.map-responsive iframe{
  left:0;
  top:0;
  height:100%;
  width:100%;
  position:absolute;
}

.wp-block-image figcaption,
.wp-block-embed figcaption
{
  text-align: center;
  font-size: smaller;  
}


.contact
{
  width: fit-content;
  color: black;
  padding : 2rem;
  margin-top: 1rem;
  margin-bottom: 1rem;
  margin-left: auto;
  margin-right: auto;
}

.contact>a
{
  text-align: center;
  width: 100%;
  border-radius: 5px;
  background-color: #027083;
  padding: 15px 0;
}

.contact>a:hover
{
  background-color: black;
}


.contact:hover
{
  background-color: #027083;
  color: white;
}