body {
    font-family: 'Inter'; font-weight: 400;
}

a {
	text-decoration: none;
}

/*ANIMATE*/
	.fadeInUp {
	  -webkit-animation-name: fadeInUp;
	  animation-name: fadeInUp;
	}

	@-webkit-keyframes fadeInUpBig {
	  from {
	    opacity: 0;
	    -webkit-transform: translate3d(0, 2000px, 0);
	    transform: translate3d(0, 2000px, 0);
	  }

	  to {
	    opacity: 1;
	    -webkit-transform: none;
	    transform: none;
	  }
	}

	@keyframes fadeInUpBig {
	  from {
	    opacity: 0;
	    -webkit-transform: translate3d(0, 2000px, 0);
	    transform: translate3d(0, 2000px, 0);
	  }

	  to {
	    opacity: 1;
	    -webkit-transform: none;
	    transform: none;
	  }
	}

/*MENU BURGER*/
	.responsive {
		display: none;
	}

	#toggle {
	  position: fixed;
	  z-index: 3;
	  width: 2.85714em;
	  height: 2.85714em;
	  top: 0;
	  right: 0;
	  margin: 20px 15px 0 15px;
	  cursor: pointer;
	}

	#toggle span {
	  display: block;
	  position: absolute;
	  width: 80%;
	  height: 0.2em;
	  margin: 1.25em 0 0 0;
	  background: #ff7c00;
	  -webkit-transition: 350ms ease all;
	  -moz-transition: 350ms ease all;
	  transition: 350ms ease all;
	}

	#toggle span:before,
	#toggle span:after {
	  content: " ";
	  position: absolute;
	  width: 100%;
	  height: 0.2em;
	  background: #ff7c00;
	  -webkit-transition: 350ms ease all;
	  -moz-transition: 350ms ease all;
	  transition: 350ms ease all;
	}

	#toggle span:before { margin: -12px 0 0 0; }

	#toggle span:after { margin: 12px 0 0 0; }

	#toggle.open span { background-color: transparent; }

	#toggle.open span:before,
	#toggle.open span:after {
		margin: 0;
		background: #ff7c00;
	}

	#toggle.open span:before {
	  -webkit-transform: rotate(135deg);
	  -moz-transform: rotate(135deg);
	  transform: rotate(135deg);
	}

	#toggle.open span:after {
	  -webkit-transform: rotate(-135deg);
	  -moz-transform: rotate(-135deg);
	  transform: rotate(-135deg);
	}

	#menu {
	  visibility: hidden;
	  opacity: 0;
	  position: fixed;
	  z-index: 2;
	  width: 100%;
	  height: 100%;
	  top: 0;
	  left: 0;
	  text-align: center;
	  background: rgba(44,62,80,0.9);
	  -webkit-transform: scale(1.5);
	  -moz-transform: scale(1.5);
	  transform: scale(1.5);
	  -webkit-transition: 350ms ease all;
	  -moz-transition: 350ms ease all;
	  transition: 350ms ease all;
	}

	#menu.opened {
	  visibility: visible;
	  opacity: 1;
	  -webkit-transform: scale(1);
	  -moz-transform: scale(1);
	  transform: scale(1);
	  -webkit-transition: 350ms ease all;
	  -moz-transition: 350ms ease all;
	  transition: 350ms ease all;
	}

	#title {
	  display: block;
	  line-height: 1em;
	  margin: 50px auto;
	  color: #ff7c00;
	}

	.line {
	    width: 90%;
	    margin: 25px auto;
	    border-bottom: 2px solid #ff7c00;
	}

	#menu ul {
	  list-style: none;
	  margin: 0 auto;
	}

	#menu ul li {
	    display: block;
	    width: 90%;
	    height: 50px;
	    font-size: 20px;
	    margin: 0 auto 0.5em auto;
	    font-weight: bold;
	}

	#menu ul li:hover:after { width: 90%; }

	#menu ul li a {
		text-align: center;
		position: relative;
		z-index: 4;
		display: block;
		width: 100%;
		height: 65px;
		margin: 0 auto;
		color: #ff7c00;
		letter-spacing: 2px;
		text-decoration: none;
		-webkit-transition: 350ms ease all;
		-moz-transition: 350ms ease all;
		transition: 350ms ease all;
	}

	#menu ul li a:hover {
	  color: #cd6a0d;
	  border-color: #cd6a0d;
	}

	#menu ul li a span { font-size: 1.66667em; }

	#menu ul li a i {
	  position: absolute;
	  padding: 0 1.25em 0 0;
	  font-size: 2em;
	}

/*HEADER*/
	header {
		width: 100%;
		height: 85px;
		background: rgba(254, 236, 227, 0.8);
		position: fixed;
		z-index: 100000;
	}

	.logo {
	    float: left;
	    padding: 20px 0;
	    width: 150px;
	}

	.border-right {
	    border-right: 1px solid #757575;
	}

	header nav ul {
		text-align: right;
	}

	.desktop ul li {
		display: inline-block;
	   	padding-right: 25px;
	    padding-left: 25px;
	    position: relative;
	    top: 35px;
	}

	header nav ul li a {
		letter-spacing: 1px;
	    font-family: 'Poppins'; font-weight: 600;
	    font-weight: bold;
		color: #757575;
		text-decoration: none;
	}
	header nav ul li a:hover {
		color: #B9917C;
		transition:0.5s;
	}
	header nav ul li a:not(:hover) {
		transition:0.5s;
	}

	.desktop .disabled, .responsive .disabled {
		letter-spacing: 1px;
		font-family: 'Poppins'; font-weight: 600;
		color: #c2c2c2;
		cursor: not-allowed;
	}

		/*EFFET HOVER*/
			/* Underline From Center */
			.hvr-underline-from-center {
			  display: inline-block;
			  vertical-align: middle;
			  -webkit-transform: translateZ(0);
			  transform: translateZ(0);
			  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
			  -webkit-backface-visibility: hidden;
			  backface-visibility: hidden;
			  -moz-osx-font-smoothing: grayscale;
			  position: relative;
			  overflow: hidden;
			}
			.hvr-underline-from-center:before {
			  content: "";
			  position: absolute;
			  z-index: -1;
			  left: 50%;
			  right: 50%;
			  bottom: 0;
			  background: #cd6a0d;
			  height: 4px;
			  -webkit-transition-property: left, right;
			  transition-property: left, right;
			  -webkit-transition-duration: 0.3s;
			  transition-duration: 0.3s;
			  -webkit-transition-timing-function: ease-out;
			  transition-timing-function: ease-out;
			}
			.hvr-underline-from-center:hover:before, .hvr-underline-from-center:focus:before, .hvr-underline-from-center:active:before {
			  left: 0;
			  right: 0;
			}

/*MAIN*/
	/*PAGE ONE*/
	.page-one {
		text-align: center;
		background: url(../images/background.jpg) no-repeat;
		background-size: cover;
		color: white;
	}

	.page-one h1 {
		letter-spacing: 3px;
	    font-family: 'Poppins'; font-weight: 600;
	    font-size: 45px;
	    padding: 140px 0 50px 0;
	    width: 800px;
	    margin: auto;
	    line-height: 1.5;
	}

	.page-one p {
	    font-size: 18px;
	    width: 550px;
	    margin: auto;
	    letter-spacing: 1px;
	    line-height: 2;
	}

	.button-1,.button-2 {
		width: 250px;
		margin: auto;
		display: block;
		cursor: pointer;
	}

	.page-one a button,.page-four a button {
	    text-transform: uppercase;
	    background: #ee4136;
	    width: 250px;
	    padding: 15px 25px;
	    border: none;
	    border-radius: 30px;
	    font-weight: bold;
	    color: white;
	    margin: 51px auto;
	    display: block;
	    cursor: pointer;
	    letter-spacing: 1px;
	    font-size: 13px;
	}

	.page-one span {
	    display: block;
	    font-size: 25px;
	    line-height: 2;
	}

	.page-one small {
		display: block;
    	font-size: 13px;
		padding-bottom: 100px; 
	}

	.page-one span a,.page-one small a {
		color: #91fffc;
	}

	/*RED ARROW*/
	.arrow {
		background: white;
	    width: 20px;
	    margin: auto;
	    padding: 19px 15px 15px;
	    border-radius: 100px;
        position: relative;
		top: -25px;
		box-shadow: 0px 2px 5px #888888;
		cursor: pointer;
	}

	.arrow img {
		display: block;
		margin: auto;
	    width: 20px;
	}

	/*PAGE TWO*/
	.page-two {
		text-align: center;
		background: url(../images/back-m.jpg) no-repeat;
		background-size: cover;
		background-position: center -250px;
	}

	.page-two h1 {
	    font-family: 'Poppins'; font-weight: 600;
	    font-size: 40px;
    	padding-bottom: 50px;	    
    	width: 950px;
	    margin: auto;
	    line-height: 1.5;
	    color: #444444;
	}

	.page-two section article {
		display: inline-table;
		width: 26%;
		padding: 2%;
	}

	.page-two section article img {
		width: 60px;
	}

	.page-two section article h3 {
	    padding: 30px;
	    font-size: 15px;
	    line-height: 1.3;
	    letter-spacing: 1px;
	}
	.page-two section article p {
	    color: #878787;
		font-size: 15px;
	}

	.project {
	    width: 70%;
	    display: block;
	    margin: 2% 0 -20%;
	}


	/*PAGE THREE*/
		/*PAGE ONE - CAROUSSEL*/
		.jssorb05 {
		    position: absolute;
		    top: 470px;
		}
		.jssorb05 div, .jssorb05 div:hover, .jssorb05 .av {
		    position: absolute;
		    /* size of bullet elment */
		    width: 16px;
		    height: 16px;
		    background: url('../images/b0555.png') no-repeat;
		    overflow: hidden;
		    cursor: pointer;
		    bottom:16px;right:16px;
		}
		.jssorb05 div { background-position: -7px -7px; }
		.jssorb05 div:hover, .jssorb05 .av:hover { background-position: -37px -7px; }
		.jssorb05 .av { background-position: -67px -7px; }
		.jssorb05 .dn, .jssorb05 .dn:hover { background-position: -97px -7px; }
		.jssora22l, .jssora22r {
		    display: block;
		    position: absolute;
		    /* size of arrow element */
		    width: 40px;
		    height: 58px;
		    cursor: pointer;
		    background: url('../images/a22.png') center center no-repeat;
		    overflow: hidden;
		}
		.jssora22l { background-position: -10px -31px; }
		.jssora22r { background-position: -70px -31px; }
		.jssora22l:hover { background-position: -130px -31px; }
		.jssora22r:hover { background-position: -190px -31px; }
		.jssora22l.jssora22ldn { background-position: -250px -31px; }
		.jssora22r.jssora22rdn { background-position: -310px -31px; }

		#jssor_1 {
		    position: relative; 
		    margin: 0 auto; 
		    top: 0px; 
		    left: 0px; 
		    width: 100%;
		    height: 80vh; 
		    overflow: hidden; 
		    visibility: hidden;
		    color: white;
		}

		#slide {
		    cursor: default; 
		    position: relative; 
		    top: 0px; 
		    left: 0px; 
		    width: 100%;
		    height: 110vh; 
		    overflow: hidden;
		}

		.testify p {
		    font-size: 40px;
			font-weight: bold;
			margin-bottom: 10%;
		}

		.testify span {
			display: block;
		}
		    /*SLIDE 1*/
		    .slide1 {
		        background: url(../images/s1.jpg) no-repeat;
		        background-size: cover;
		    }
			    .content-s1 {
				    text-align: right;
				    line-height: 1.7;
				    width: 50%;
				    float: right;
					    margin-right: 50px;
					    margin-top: 25px;
			    }

		    /*SLIDE 2*/
		    .slide2 {
		        background: url(../images/s2.jpg) no-repeat;
		        background-size: cover;
		    }
			    .content-s2 {
				    text-align: left;
				    line-height: 1.7;
				    width: 50%;
				    float: left;
					    margin-left: 50px;
					    margin-top: 25px;
			    }
		    
		    /*SLIDE 3*/
		    .slide3 {
		        background: url(../images/s3.jpg) no-repeat;
		        background-size: cover;
		    }
		    .content-s3 {
		        position: absolute;
		        right: 0;
		        width: 50%;
		        height: 100vh;
		        line-height: 2;
		        color: white;
		        text-align: right;
				    margin-right: 50px;
				    margin-top: 25px;
		    }
		    
		    /*SILDE 4*/
		    .slide4 {
		        background: url(../images/s4.jpg) no-repeat;
		        background-size: cover;
		    }
		    .content-s4 {
		        position: absolute;
		        right: 0;
		        width: 50%;
		        height: 100vh;
		        line-height: 2;
		        color: white;
		        text-align: right;
				    margin-right: 50px;
				    margin-top: 25px;
		    }
		    
		    /*SLIDE 5*/
		    .slide5 {
		        background: url(../images/s5.jpg) no-repeat;
		        background-size: cover;
		    }
		    .content-s5 {
		        position: absolute;
		        left: 0;
		        width: 50%;
		        height: 100vh;
		        line-height: 2;
		        color: white;
				    margin-left: 50px;
				    margin-top: 25px;
		    }
		    
		    /*SLIDE 6*/
		    .slide6 {
		        background: url(../images/s6.jpg) no-repeat;
		        background-size: cover;
		    }
		    .content-s6 {
		        position: absolute;
		        right: 0;
		        width: 50%;
		        height: 100vh;
		        line-height: 2;
		        color: white;
		        text-align: right;
				    margin-right: 50px;
				    margin-top: 25px;
		    }
		    
		    /*SLIDE 7*/
		    .slide7 {
		        background: url(../images/s7.jpg) no-repeat;
		        background-size: cover;
		    }
		    .content-s7 {
		        position: absolute;
		        right: 0;
		        width: 50%;
		        height: 100vh;
		        line-height: 2;
		        color: white;
				    margin-right: 50px;
				    margin-top: 25px;
		    }
		    
	/*PAGE FOUR*/
		.page-four {
		    background: url(../images/back-2.jpg) no-repeat;
		    background-size: cover;
		    text-align: center;
		        padding-bottom: 150px;
		}

		.page-four h1 {
	        font-family: 'Poppins'; font-weight: 600;
	    	font-size: 40px;
		    padding: 80px 0;
		    width: 600px;
		    margin: auto;
		    line-height: 1.5;
		    color: #444444;
		}

		.page-four p {
		    font-family: 'Poppins'; font-weight: 600;
		    font-weight: bold;
		    font-size: 15px;
		    width: 600px;
		    margin: auto;
		    letter-spacing: 1px;
		    line-height: 2;
		}

/*FOOTER*/
	footer {
		width: 100%;
		background: black;
		color: white;
	}

	footer h3 {
		padding-bottom: 35px;
	}

	footer ul li {
		padding-bottom: 10px;
	}

	footer ul li a {
		color: white;
		font-family: 'Poppins'; font-weight: 600;
	}
	footer ul li a:hover {
		color: #A2A0A0;
		transition:0.5s;
	}
	footer ul li a:not(:hover) {
		transition:0.5s;
	}

	footer ul li .disabled {
		color: #6b6b6b;
		font-family: 'Poppins'; font-weight: 600;
		cursor: not-allowed;
	}

	footer div {
		display: inline-table;
		padding: 50px;
	}

	.foot-5 {
		float: right;
	}

	.foot-5 p {
	    padding-bottom: 10px;
		font-family: 'Poppins'; font-weight: 600;
	}


/*---------------------------------PARTIE RESPONSIVE----------------------------------*/



/*FAIRE APPARAITRE LE MENU BURGER*/
@media screen and (max-width: 1090px) {
	/*HEADER*/
		.desktop {
			display: none;
		}
		.responsive {
			display: block;
		}

	/*PAGE ONE*/
		.page-one h1 {
		    width: 90%;
		}

	/*FOOTER*/
		footer {
			text-align: center;
		}
		.foot-5 {
		    float: none;
		}

}

/*PASSAGE EN % DES PX*/
@media screen and (max-width: 970px) {
	/*HEADER*/

	/*PAGE ONE*/
		.page-two h1 {
		    width: 95%;
		}
	/*PAGE TWO*/

	/*PAGE THREE*/

	/*PAGE FOUR*/
		.page-four h1 {
		    width: 95%;
		}

	/*FOOTER*/

}

/*DIMENSION IPAD*/
@media screen and (max-width: 768px) {
	/*HEADER*/

	/*PAGE ONE*/
		.page-one h1 {
		    font-size: 40px;
   			padding: 200px 0 100px 0;
		}

		.page-one a button, .page-four a button {
		    width: 350px;
		    margin: 80px auto;
		}

		.button-1,.button-2 {
		    width: 350px;
		}

		.page-one small {
		    padding-bottom: 20%;
		}
	/*PAGE TWO*/
		.page-two h1 {
		    font-size: 35px;
		}

		.page-two section article {
		    display: inline-table;
		    width: 25%;
		    padding: 4% 2% 10%;
		}
	/*PAGE THREE*/
		/*CAROUSEL*/
		.jssorb05 {
		    position: absolute;
		    top: 500px;
		}
		.content-s1,.content-s2,.content-s3,.content-s4,
		.content-s5,.content-s6,.content-s7 {
			float: none;
			width: 90%;
			margin: 25px auto;
			text-align: center;
			position: static;
		}

		.testify p {
		    font-size: 30px;
		}

	/*PAGE FOUR*/
		.page-four {
		    padding-bottom: 15%;
		}
		.page-four button{
		    margin:80px auto 0;
		}
		.page-four h1 {
		    font-size: 35px;
		}
	/*FOOTER*/

}

/*DIMENSION NEXUS*/
@media screen and (max-width: 650px) {
	/*HEADER*/
		header {
		    height: 70px;
		}

		.logo {
		    width: 100px;
		}

		#toggle {
		    margin: 15px 5px 0 15px;
		}

		#toggle span {
		    width: 70%;
		}

		#toggle span:before {
		    margin: -10px 0 0 0;
		}
		#toggle span:after {
		    margin: 10px 0 0 0;
		}

		#title {
		    margin: 30px auto;
		    width: 20%;
		}
	/*PAGE ONE*/
		.page-one h1 {
		    font-size: 28px;
   			padding: 150px 0 100px 0;
		}

		.page-one p {
		    width: 90%;
		}

		.page-one span {
		    font-size: 25px;
		    line-height: 1.5;
		    width: 95%;
		    margin: auto;
		    padding-bottom: 30px;
		}

		.page-one small {
			width: 90%;
			margin: auto;
		    padding-bottom: 20%;
		    line-height: 1.5;
		}

		.page-one a button, .page-four a button {
		    width: 100%;
		}

		.button-1,.button-2 {
		    width: 80%;
		}
	/*PAGE TWO*/
		.page-two h1 {
		    font-size: 30px;
		    padding: 50px 0;
		}
		.page-two section article {
		    display: block;
		    margin: auto;
		    width: 70%;
		    padding: 3% 0 12%;
		}
	/*PAGE THREE*/
		.testify p {
		    font-size: 25px;
		}
	/*PAGE FOUR*/
		.page-four h1 {
		    font-size: 30px;
		}
		.page-four p {
		    width: 90%;
		    margin: auto;
		}
	/*FOOTER*/
		footer div {
		    display: block;
		}

}

/*DIMENSION IPHONE 6 PLUS*/
@media screen and (max-width: 414px) {
	/*HEADER*/

	/*PAGE ONE*/
		.page-one h1 {
		    font-size: 35px;
		}
	/*PAGE TWO*/

	/*PAGE THREE*/

	/*PAGE FOUR*/

	/*FOOTER*/

}

/*DIMENSION IPHONE 6*/
@media screen and (max-width: 360px) {
	/*HEADER*/

	/*PAGE ONE*/
		.page-one h1 {
		    font-size: 30px;
		    padding: 130px 0 100px 0;
		}
	/*PAGE TWO*/

	/*PAGE THREE*/

	/*PAGE FOUR*/

	/*FOOTER*/

}	

/*DIMENSION IPHONE 5*/
@media screen and (max-width: 320px) {
	/*HEADER*/

	/*PAGE ONE*/
		.page-one h1 {
		    font-size: 25px;
	        padding: 130px 0 50px 0;
		}
		.page-one p {
		    font-size: 15px;
		}

		.page-one span {
		    font-size: 20px;
		}

		.page-one small {
		    font-size: 11px;
		}
	/*PAGE TWO*/
		.page-two h1 {
		    font-size: 25px;
		    padding: 20px 0 50px;
		}

		.page-two section article h3 {
		    font-size: 15px;
		}

		.page-two section article p {
		    font-size: 13px;
		}

	/*PAGE THREE*/
		.testify p {
		    font-size: 20px;
		}

		.testify span {
		    display: block;
		    font-size: 12px;
		    letter-spacing: 1px;
		}
	/*PAGE FOUR*/
		.page-four h1 {
		    font-size: 25px;
		    padding: 50px 0;
		}

		.page-four p {
		    font-size: 15px;
		}
	/*FOOTER*/

}