@charset "UTF-8";
body { /* Addresses a small issue in webkit: http://bit.ly/NEdoDq */
	-webkit-backface-visibility: hidden;
}



/* animations diaporama */
#main-slider h1{
    opacity: 0;
}


#main-slider .active h1{

    -webkit-animation-duration: 0.8s; 
    animation-duration: 0.8s; 
    -webkit-animation-fill-mode: both; 
    animation-fill-mode: both; 
    -webkit-animation-name: fadeInDown; 
    animation-name: fadeInDown; 

    animation-timing-function: ease-out;
    -webkit-animation-timing-function: ease-out
} 


/* animations blocs projet */


#projetsListe li.demasque .imageWrapper img
{
	 -webkit-animation-duration: 0.8s; 
    animation-duration: 0.8s; 
    -webkit-animation-fill-mode: both; 
    animation-fill-mode: both; 
 -webkit-animation-name: fadeInUp; 
    animation-name: fadeInUp; 
}


#projetsListe li .projetBloc{

}

#projetsListe li.demasque .projetBloc{
 -webkit-animation-duration: 0.6s; 
    animation-duration: 0.6s; 
    -webkit-animation-fill-mode: both; 
    animation-fill-mode: both; 
 -webkit-animation-name: fadeInDown; 
    animation-name: fadeInDown; 
}

#projetsListe li .projetBloc h3,
#projetsListe li .projetBloc h4,
#projetsListe li .projetBloc p,
#projetsListe li .projetBloc a{
	

}
#projetsListe li.demasque .projetBloc h3,
#projetsListe li.demasque .projetBloc h4,
#projetsListe li.demasque .projetBloc p,
#projetsListe li.demasque .projetBloc a

{
	 -webkit-animation-duration: 0.4s; 
    animation-duration: 0.4s; 
    -webkit-animation-fill-mode: both; 
    animation-fill-mode: both; 
 -webkit-animation-name: fadeInDown; 
    animation-name: fadeInDown; 
    animation-timing-function: ease-out;
    -webkit-animation-timing-function: ease-out
}

#projetsListe li.demasque .projetBloc h3
{
	 -webkit-animation-delay: 0.2s; /* Chrome, Safari, Opera */
    animation-delay: 0.2s;
}
#projetsListe li.demasque .projetBloc h4
{
	 -webkit-animation-delay: 0.3s; /* Chrome, Safari, Opera */
    animation-delay: 0.3s;
}
#projetsListe li.demasque .projetBloc p
{
	 -webkit-animation-delay: 0.5s; /* Chrome, Safari, Opera */
    animation-delay: 0.5s;
    min-height: 65px;
}
#projetsListe li.demasque .projetBloc a
{
	 -webkit-animation-delay: 0.8s; /* Chrome, Safari, Opera */
    animation-delay: 0.8s;
}

li img.projet_fond{
 transform:scale(1,1);
	  -webkit-transition: transform 0.5s ease-in-out;
  -moz-transition: transform 0.5s ease-in-out;
  -s-transition: transform 0.5s ease-in-out;
  -o-transition: transform 0.5s ease-in-out;
  transition: transform 0.5s ease-in-out;

}
li:hover img.projet_fond{
transform:scale(1.02,1.02);

}

/* animations blocs au scroll*/
#footer{
	opacity: 1!important;
	visibility: visible !important;
}
.masque{
     visibility:hidden;
}
.demasque{
     visibility: visible;
}
.animated { 
    -webkit-animation-duration: 0.8s; 
    animation-duration: 0.8s; 
    -webkit-animation-fill-mode: both; 
    animation-fill-mode: both; 
} 
.post.fadeIn{ 
    -webkit-animation-duration: 0.5s; 
    animation-duration: 0.5s; 
    -webkit-animation-fill-mode: both; 
    animation-fill-mode: both; 
    -webkit-animation-name: fadeInUp_post; 
    animation-name: fadeInUp_post; 
} 

@-webkit-keyframes fadeInUp_post { 
    0% { 
        opacity: 0; 
    } 
    100% { 
        opacity: 1; 
    } 
} 

@keyframes fadeInUp_post { 
    0% { 
        opacity: 0; 
    } 
    100% { 
        opacity: 1; 
    } 
} 

/* animations blocs ils nous ont fait confiance*/
#nosClients img{
}

#nosClients img.demasque {
	  -webkit-animation-duration: 0.5s; 
    animation-duration: 0.5s; 
    -webkit-animation-fill-mode: both; 
    animation-fill-mode: both; 
    -webkit-animation-name: fadeInDown; 
    animation-name: fadeInDown; 
    animation-timing-function: ease-out;
    -webkit-animation-timing-function: ease-out;
}

#nosClients img.demasque:nth-child(1){
	-webkit-animation-delay: 0s; /* Chrome, Safari, Opera */
    animation-delay: 0s;
}
#nosClients img.demasque:nth-child(2){
	-webkit-animation-delay: 0.1s; /* Chrome, Safari, Opera */
    animation-delay: 0.1s;
}
#nosClients img.demasque:nth-child(3){
	-webkit-animation-delay: 0.2s; /* Chrome, Safari, Opera */
    animation-delay: 0.2s;
}
#nosClients img.demasque:nth-child(4){
	-webkit-animation-delay: 0.3s; /* Chrome, Safari, Opera */
    animation-delay: 0.3s;
}
#nosClients img.demasque:nth-child(5){
	-webkit-animation-delay: 0.4s; /* Chrome, Safari, Opera */
    animation-delay: 0.4s;
}
#nosClients img.demasque:nth-child(6){
	-webkit-animation-delay: 0.5s; /* Chrome, Safari, Opera */
    animation-delay: 0.5s;
}
#nosClients img.demasque:nth-child(7){
	-webkit-animation-delay: 0.6s; /* Chrome, Safari, Opera */
    animation-delay: 0.6s;
}
#nosClients img.demasque:nth-child(8){
	-webkit-animation-delay: 0.7s; /* Chrome, Safari, Opera */
    animation-delay: 0.7s;
}
#nosClients img.demasque:nth-child(9){
	-webkit-animation-delay: 0.8s; /* Chrome, Safari, Opera */
    animation-delay: 0.8s;
}
/* animations blocs nos compétences*/
#service .col-xs-6{
}
/* #service .col-xs-6 .clint-div */

#service .col-xs-6.demasque, .blocChrono.demasque{
	 -webkit-animation-duration: 0.5s; 
    animation-duration: 0.5s; 
    -webkit-animation-fill-mode: both; 
    animation-fill-mode: both; 
    animation-timing-function: ease-out;
    -webkit-animation-timing-function: ease-out;
}

#service .col-xs-6.demasque:nth-child(odd), .blocChrono.demasque:nth-child(odd){
	  -webkit-animation-name: fadeInLeft; 
    animation-name: fadeInLeft; 

}

#service .col-xs-6.demasque:nth-child(even), .blocChrono.demasque:nth-child(even){
	  -webkit-animation-name: fadeInRight; 
    animation-name: fadeInRight; 

}

#service .col-xs-6.demasque .clint-div{
	 -webkit-animation-duration: 0.5s; 
    animation-duration: 0.5s; 
    -webkit-animation-fill-mode: both; 
    animation-fill-mode: both; 
    animation-timing-function: ease-out;
    -webkit-animation-timing-function: ease-out;
    	-webkit-animation-delay: 0.2s; /* Chrome, Safari, Opera */
    animation-delay: 0.2s;
      -webkit-animation-name: bounceIn; 
    animation-name: bounceIn; 
}


/* types d'animations */

@-webkit-keyframes fadeInDown { 
    0% { 
        opacity: 0; 
        -webkit-transform: translateY(-30px); 
    } 
    100% { 
        opacity: 1; 
        -webkit-transform: translateY(0); 
    } 
} 

@keyframes fadeInDown { 
    0% { 
        opacity: 0; 
        transform: translateY(-30px); 
    } 
    100% { 
        opacity: 1; 
        transform: translateY(0); 
    } 
} 


@-webkit-keyframes fadeInUp{ 
    0% { 
        opacity: 0; 
        -webkit-transform: translateY(30px); 
    } 
    100% { 
        opacity: 1; 
        -webkit-transform: translateY(0); 
    } 
} 

@keyframes fadeInUp { 
    0% { 
        opacity: 0; 
        transform: translateY(30px); 
    } 
    100% { 
        opacity: 1; 
        transform: translateY(0); 
    } 
} 

@-webkit-keyframes fadeInLeft { 
    0% { 
        opacity: 0; 
        -webkit-transform: translateX(-20px); 
    } 
    100% { 
        opacity: 1; 
        -webkit-transform: translateX(0); 
    } 
} 
@keyframes fadeInLeft { 
    0% { 
        opacity: 0; 
        transform: translateX(-20px); 
    } 
    100% { 
        opacity: 1; 
        transform: translateX(0); 
    } 
} 
@-webkit-keyframes fadeInRight { 
    0% { 
        opacity: 0; 
        -webkit-transform: translateX(20px); 
    } 
    100% { 
        opacity: 1; 
        -webkit-transform: translateX(0); 
    } 
} 
@keyframes fadeInRight { 
    0% { 
        opacity: 0; 
        transform: translateX(20px); 
    } 
    100% { 
        opacity: 1; 
        transform: translateX(0); 
    } 
} 

@-webkit-keyframes bounceIn { 
    0% { 
        opacity: 0; 
        -webkit-transform: scale(.3); 
    } 

    50% { 
        opacity: 1; 
        -webkit-transform: scale(1.03); 
    } 

    70% { 
        -webkit-transform: scale(.9); 
    } 

    100% { 
         -webkit-transform: scale(1); 
    } 
} 

@keyframes bounceIn { 
    0% { 
        opacity: 0; 
        transform: scale(.3); 
    } 

    50% { 
        opacity: 1; 
        transform: scale(1.03); 
    } 

    70% { 
        transform: scale(.9); 
    } 

    100% { 
        transform: scale(1); 
    } 
} 

  
* html balises {


   -webkit-transition: none !important;
  -moz-transition: none !important;
  -o-transition: none !important;
  -ms-transition: none !important;
  transition: none !important;

    }

    /* Small Devices, Tablets */
@media only screen and (max-width : 768px) {
	.projetBloc{
		min-height: 30vh;
	}
    #main-slider h1,
    #main-slider .active h1,
    #projetsListe li.demasque .imageWrapper img,
    #projetsListe li .projetBloc,
#projetsListe li.demasque .projetBloc,
#projetsListe li .projetBloc h3,
#projetsListe li .projetBloc h4,
#projetsListe li .projetBloc p,
#projetsListe li .projetBloc a,
#projetsListe li.demasque .projetBloc h3,
#projetsListe li.demasque .projetBloc h4,
#projetsListe li.demasque .projetBloc p,
#projetsListe li.demasque .projetBloc a,
#projetsListe li.demasque .projetBloc h3,
#projetsListe li.demasque .projetBloc h4,
#projetsListe li.demasque .projetBloc p,
#projetsListe li.demasque .projetBloc a,
li img.projet_fond,
li:hover img.projet_fond,
#footer,
.masque,
.demasque,
.animated,
.post.fadeIn,
#nosClients ,
#nosClients img.demasque ,
#nosClients img.demasque:nth-child(1),
#nosClients img.demasque:nth-child(2),
#nosClients img.demasque:nth-child(3),
#nosClients img.demasque:nth-child(4),
#nosClients img.demasque:nth-child(5),
#nosClients img.demasque:nth-child(6),
#nosClients img.demasque:nth-child(7),
#nosClients img.demasque:nth-child(8),
#nosClients img.demasque:nth-child(9),
#service .col-xs-6,
#service .col-xs-6.demasque, 
.blocChrono.demasque,
#service .col-xs-6.demasque:nth-child(odd),
.blocChrono.demasque:nth-child(odd),
#service .col-xs-6.demasque:nth-child(even), 
.blocChrono.demasque:nth-child(even),
#service .col-xs-6.demasque .clint-div{
        /*CSS transitions*/
        -o-transition-property: none !important;
        -moz-transition-property: none !important;
        -ms-transition-property: none !important;
        -webkit-transition-property: none !important;
        transition-property: none !important;
        /*CSS transforms*/
        -o-transform: none !important;
        -moz-transform: none !important;
        -ms-transform: none !important;
        -webkit-transform: none !important;
        transform: none !important;
        /*CSS animations*/
        -webkit-animation: none !important;
        -moz-animation: none !important;
        -o-animation: none !important;
        -ms-animation: none !important;
        animation: none !important;
    }
    #main-slider h1{
    opacity: 1;
}

}