@import "CSS/burger.css";
@import "CSS/contact_form.css";	
@import "CSS/project.css";
@import url('https://fonts.googleapis.com/css?family=Source+Code+Pro:200');

* {
    margin: 0px;
    padding: 0;
    font-family: 'Carter One', cursive;
}

.us{
  display: flex;
  flex-flow: row wrap;
  position: absolute;
  top: 0;
}

.fr{
  display: flex;
  flex-flow: row wrap;
  position: absolute;
  top: 25px;
}

header {
    text-align: center;
}

/* background animation */
body  {
  background-image: url('https://static.pexels.com/photos/414171/pexels-photo-414171.jpeg');
background-size:cover;
      -webkit-animation: slidein 100s;
      animation: slidein 100s;

      -webkit-animation-fill-mode: forwards;
      animation-fill-mode: forwards;

      -webkit-animation-iteration-count: infinite;
      animation-iteration-count: infinite;

      -webkit-animation-direction: alternate;
      animation-direction: alternate;              
}

@-webkit-keyframes slidein {
from {background-position: top; background-size:3000px; }
to {background-position: -100px 0px;background-size:2750px;}
}

@keyframes slidein {
from {background-position: top;background-size:3000px; }
to {background-position: -100px 0px;background-size:2750px;}

}



.center
{
display: flex;
align-items: center;
justify-content: center;
margin: auto;
top: 0;
right: 0;
bottom: 0;
left: 0;
border-radius: 3px;
}

/* body {
    background: linear-gradient(125deg, #ECFCFF 0%, #ECFCFF 40%, #B2FCFF calc(40% + 1px), #B2FCFF 60%, #5EDFFF calc(60% + 1px), #5EDFFF 72%, #3E64FF calc(72% + 1px), #3E64FF 100%);
} */

main {
    display: block;
    text-align: justify;
}

.title {
    text-align: center;
    margin-top: 1%;
}

.profil {
    width: 10%;
    border-radius: 75%;
    margin-top: 1%;
    margin-bottom: 1%;
    
}

.presentation {
    padding: 5px;
    padding-right: 50%;
    border: 1px;  
    border-radius: 1em;  
    background-color: #97FBEC; 
}

.presentation_general {
    width: 100%;
}

footer {
    background-color: #97FBEC;
    text-align: center;
}

#info_personel {
  text-align: center;
}

/* br */

.space_moyen {
  height: 150px;
  display: block;
}

.space {
    height: 50px;
    display: block;
}

.space_mini {
    height: 10px;
    display: block;
}

/* scroll up */

#scrollUp
{
position: fixed;
z-index: 2;
bottom : 10px;
right: 10px;
opacity: 0.5;
}

#CV_classique {
    text-align: center;
}

/* flex box */

#content1 {
    display: flex;
    flex-direction: row;
    justify-content: center;
    text-align: center;
  }
  
  .box { 
    margin: 2em;
    padding: 2em;
    border-radius: 1em;
  }

#content2 {
    display: flex;
    flex-direction: row;
    justify-content: center;
  }
  
.box2 {
    margin: 2em;
    padding: 2em;
    border-radius: 1em;
  }

#content3 {
    display: flex;
    flex-direction: row;
    justify-content: center;
    text-align: center;
  }
  
.box3 {
    margin: 2em;
    padding: 2em;
    border-radius: 1em;
  }

  #content0 {
    display: flex;
    flex-direction: row;
    justify-content: center;
    text-align: center;
  }
  
.box0 {
    margin: 2em;
    padding: 2em;
    border-radius: 1em;
  }

  @media (max-width: 600px) {
    #content0, #content1, #content2, #content3   {
      display: flex;
      flex-direction: column;
    }
  }

/* cookie */
.btncookie{
    
    
  color: #FAFAFA;
  padding: 1em 0 1em;
  text-align: center;
  position: fixed;
  background-color: #10171bf5;
  display: block;
  width: 100%;
  left: 0;
  bottom: 0;
  z-index: 999999;
   /* visibility: hidden; */
}

.sm_footer{
  background-color:#ea9352 !important;
  text-align: center;
  
}
.sm_hidden{
  visibility: hidden;
}

.txt-entete{color: #fff !important;}

.mini-footer{

  background: #286091; 
  border-top: solid 1px #fff;

}

/*  */
.container-fluid {
  background-color: #5EDFFF;
}

.logo_competence_glob {
  display: flex;
  flex-flow: row wrap;
  justify-content: center;
  padding: 50px 0;
}

.img_competence {
  margin: 0 10px;
}

.voir-plus {
  display: flex;
  flex-flow: row wrap;
  justify-content: center;
}

#btn-voir-plus {
  background-color: #3E64FF;
  text-align: center;
  border: none;
  outline: none;
  border-radius: 1em;
  padding: 5px;
  cursor: pointer;
}

@media (max-width: 600px) {
  #btn-voir-plus {
    background-color: #5EDFFF;
  }
}