html {
  scroll-behavior: smooth;
}

body{
	overflow-x: hidden;
}


footer{
	margin-top: 4.5rem!important;
}

.floating {  
  animation-name: floating;
  animation-duration: 3.5s;
  animation-iteration-count: infinite;
  animation-timing-function: ease-in-out;
}
  
@keyframes floating {
  0% { transform: translate(0,  0px); }
  50%  { transform: translate(0, 30px); }
  100%   { transform: translate(0, -0px); }    
}


/*
.chevron {
  box-sizing: border-box;
    position: relative;
    display: block;
    transform: scale(var(--ggs,1));
    width: 33px;
    height: 33px;
    border: 3px solid;
    border-radius: 8px;
    margin-bottom: 2.5rem;
    margin-left: calc(50% - 16px);
}

.chevron::after {
  content: "";
    display: block;
    box-sizing: border-box;
    position: absolute;
    width: 14px;
    height: 14px;
    border-bottom: 4px solid;
    border-right: 4px solid;
    border-radius: 2px;
    transform: rotate(45deg);
    left: 6px;
    top: 4px;
}
*/

li{
  font-style: italic;
  opacity: 0.7;
  font-size: 1.25rem;
  font-weight: 300;
}
@media (min-width: 1400px){
  .container{
    max-width: 1100px;
  }
}

.cover-container{
	height: 85vh;
  padding-bottom: 20vh!important;
}

.modal-dialog{
  margin-top: 10vh;
}

.modal-header{
  border-bottom: 0;
}

.modalImg{
	max-height: 600px;
  width: 100%;
}


.headerImg {
	max-height: 30vh;
}

.miniImg {
  max-width: 20%;
}


.btn-truc {
  padding: 5px 40px;
  font-size: 20px;
  color: #212529;
  border-color: #212529;
  background: white;
  box-shadow: 0 0 0 black;
  transition: all 0.2s;
}

.btn-truc:hover {
  box-shadow: 0.4rem 0.4rem 0 black;
  transform: translate(-0.4rem, -0.4rem);
}

.btn-truc:active {
  box-shadow: 0 0 0 black;
  transform: translate(0, 0);
}





.btn-primary{
  padding: 5px 40px;
  font-size: 20px;
  -webkit-transition: all .35s;
  color: #212529;
  border-color: #212529;
  background-color: transparent;
}

.btn-primary:hover, .btn-primary:focus {
  color: #fff;
  background-color: #d8567f!important;
  border-color: #d65482!important;
  box-shadow: 0 0 0 0.25rem rgb(214 84 129 / 50%)!important;
}


.bgColor{
	background: #888;
	background: linear-gradient(166deg, rgba(182,56,172,1) 0%, rgba(233,101,103,1) 100%);
}

p, a, li, h1, h2, h3, h4, h5, h6{
	font-family: 'Montserrat', sans-serif;
}

a{
	color: white;
}

a:hover{
	color: white;
}

.text-dark a{
 color:#212529;
}

.lead{
	font-style: italic;
	opacity: 0.7;
}

.lead-sm{
	font-style: italic;
	opacity: 0.7;
	font-size: 1rem;
}

.animDelay{
	animation-delay: 100ms;
}

.animDelay2{
  animation-delay: 200ms;
}

#subHeaderText{
	text-shadow: 0.15rem 0.15rem 0.1rem #000;
	opacity: 1;
}

#subHeaderText a {
  text-decoration: none;
  font-size: 22px;
}

#subHeaderText a:hover {
  text-decoration: underline;
  font-size: 22px;
}


.progress-bar{
	background: rgb(182,56,172);
  background: linear-gradient(166deg, rgba(182,56,172,1) 0%, rgba(233,101,103,1) 100%);
}




.nav-link{
  position: relative;
  font-size:1.1rem;
  font-style: italic;
  text-shadow: 0.15rem 0.15rem 0.1rem #000;
  transition: all 0.2s;
}

.nav-link:hover {
  text-shadow: 0.35rem 0.35rem 0.1rem #000;
  transform: translate(-0.2rem, -0.2rem);
}

.nav-link:active {
  text-shadow: 0 0 0 black;
  transform: translate(0, 0);
}


.modal-content{
  padding:0 1rem 1rem;
}

.modalBox > .textImg{
	transition: all 0.2s;
  max-width: 60%;
  z-index: 2;
}

.modalBox:hover > .textImg{
  max-width: 70%;
  transform: translate(-50%,-50%) rotate(-0.01turn)!important;
}


.modalBox > .bigImg{
  transition: all 0.8s;
  max-width: 90%;
  bottom: -50%;
  right: -30%;
}

@media (max-width: 992px) {
  .modalBox > .bigImg{
  max-width: 100%;
  bottom: -20%;
  right: -40%;
  }
}

.modalBox:hover > .bigImg{
  transform: translate(0%,-5%)!important;
}

.modalBox{
  width: 100%;
  height: 500px;
  overflow: hidden;
}

.boxParcours{
	background-color: #ff710b;
}

.boxComp{
	background-color: #5f28a0;
}

.boxProj{
	background-color: #015aff;
}

.boxPass{
	background-color: #aa1f5a;
}



/* Fade Reveal */
.hideme
{
	-webkit-transition: opacity 1.1s ease-in-out; 
	transition: opacity 1.1s ease-in-out;
  opacity:0;
}

.showme {
  opacity:1!important;
}


/* Blobs */
.shape-blob {
	background:#fff;
	height: 20vw;
	width: 20vw;
	border-radius: 30% 50% 20% 40%;
  animation: transform 20s ease-in-out infinite both alternate, movement_one 30s ease-in-out infinite both;
	/*opacity:0.8;*/
	position: absolute;
	left: 75%;
	top: 60%;
}
.shape-blob.one{
	height: 40vw;
	width: 40vw;
	left: -15%;
	bottom: 30%;
	transform: rotate(-180deg);
	animation: transform 30s ease-in-out infinite both alternate, movement_two 50s ease-in-out infinite both;
}

.shape-blob.two{
	height: 25vw;
	width: 25vw;
	left: -10%;
	top: -20%;
	transform: rotate(-180deg);
	animation: transform 30s ease-in-out infinite both alternate, movement_two 40s ease-in-out infinite both;
}

@keyframes transform
{
    0%,
  100% { border-radius: 33% 67% 70% 30% / 30% 30% 70% 70%; } 
   20% { border-radius: 37% 63% 51% 49% / 37% 65% 35% 63%; } 
   40% { border-radius: 36% 64% 64% 36% / 64% 48% 52% 36%; } 
   60% { border-radius: 37% 63% 51% 49% / 30% 30% 70% 70%; } 
   80% { border-radius: 40% 60% 42% 58% / 41% 51% 49% 59%; } 
}


@keyframes movement_one
{
    0%,
  100% { transform: none; }
   50% { transform: translate(50%, 20%) rotateY(10deg) scale(1.2); }
}

@keyframes movement_two
{
    0%,
  500% { transform: none; }
   50% { transform: translate(50%, 20%) rotate(-200deg) scale(1.2);}
}