
/***  screen max-width -> 767px  ***/



@media only screen and (max-width: 767px) {


	/***  font + image voitures, avion et flash radar  ***/


	.fondImage {
		background-image: url("../images/fondSmartphone.png");
		background-size: 500px 3125px;
		background-position: center !important;
		height: 3125px;
	}

	#skrollr-body1 {
		height: 3125px;
	}

	#voiture {
		width: 30px;
		margin-left: -34px;
		margin-top: -30px;
	}

	#descendez {
		width: 68px;
		margin-left: -34px;
	}

	#descendez h4 {
		margin-top: 10px;
		font-size: 0.7em;
	}

	#descendez img {
		width: 23px;
	}

	#voiture2 {
		height: 30px;
		margin-left: 739px;
		padding-left: 0px;
	}

	#avion {
		width: 150px;
		margin-left: -960px;
		z-index: 300;
		background: url(../images/avion1iphone.png) no-repeat;
	}

	@-webkit-keyframes helice {
	    0%   {background: url(../images/avion1iphone.png) no-repeat;}
	    100% {background: url(../images/avion2iphone.png) no-repeat;}
	}

	@keyframes helice {
	    0%   {background: url(../images/avion1iphone.png) no-repeat;}
	    100% {background: url(../images/avion2iphone.png) no-repeat;}
	}

	#flash {
		width: 48px;
		margin-left: -72px;
	}


	/***  style de texte  ***/


	.texte {
		position: absolute;
		font-size: 0.4em;
	}

	ul {
		width: 68px;
	}

	li {
		margin-bottom: 3px;
	}

	.pourcentage {
		font-size: 6px;
	}

	.pourcentage3 {
		font-size: 3px;
	}


	/***  presentation  ***/


	#presentation {
		width: 91px;
		height: 60px;
		margin-left: 67px;
		font-size: 1em;
		line-height: 100%;
		margin-top: -8px;
	}

	#presentation span{
		margin-top: 0px;
	}


	/***  radar  ***/


	#radar {
		width: 10px;
		height: 80px;
		margin-left: -75px;
	}

	#texte_radar {
		width: 30px;
		height: 23px;
		margin-left: 51px;
		font-size: 2px;
	}

	#texte_radar p {
		margin-bottom: -1px;
		font-size: 1.7em;
	}

	#texte_radar span {
		font-size: 6em;
	}


	/***  competence  ***/


	.titreComp {
		margin-bottom: 17px;
		font-size: 1.7em;
	}

	.progress {
	    border-radius: 1px;
	    height: 2px;
	}

	.bar {
	    border-radius: 1px;
	    height: 2px;
	}

	#competence1 {
		margin-left: -156px;
	}

	#competence2 {
		margin-left: 87px;
	}

	#competence3 {
		margin-left: -102px;
		font-size: 8px;
		top: 44.25%;
	}

	#competence3 ul {
		width: 27px;
	}

	#competence3 ul li {
		margin-bottom: 5px;
	}

	#competence3 .progress, #competence3 .bar {
		height: 2px;
	}


	/***  mer  ***/


	#mer {
		display: none;
	}

	#mer-ipad {
		display: none;
	}

	#mer-iphone {
		display: block;
		height: 1080px;
		margin-left: -250px;
	}


	/***  realisation  ***/


	#realisation1 {
		margin-left: 80px;
	}

	#realisation1 p, #realisation2 p {
		font-size: 5px;
		margin-top: 54px;
	}

	#responsive1 {
		width: 78px;
		border: solid #fff 2px;
		transform: translateY(-67px);
	}

	#div_responsive1 {
		width: 82px;
		height: 67px;
		margin-top: -5px;
	}

	#responsive1B {
		width: 78px;
		border: solid #fff 2px;
	}

	#realisation2 {
		margin-left: 80px;
	}

	#responsive2 {
		width: 78px;
		border: solid #fff 2px;
		transform: translateY(-67px);
	}

	#div_responsive2 {
		width: 82px;
		height: 67px;
		margin-top: -5px;
	}

	#responsive2B {
		width: 78px;
		border: solid #fff 2px;
	}

	#div_responsive_web_ball_game {
		margin-left: -160px;
	}

	#responsive_web_ball_game {
		width: 86px;
	}

	#div_responsive_web_ball_game p {
		margin-top: 61px;
		font-size: 4px;
	}

	#arbre, #arbre2 {
		width: 90px;
	}

	#div_arbre, #div_arbre2 {
		margin-left: -164px;
	}

	#div_file {
		width: 25px;
		margin: 16px auto;
	}

	#file {
		width: 24px;
	}

	#div_file h6 {
		margin-top: 4px;
		font-size: 6px;
	}

	#div_arbre2 a {
		margin-top: 35px;
		font-size: 7px;
	}


	/***  contact  ***/


	#contact {
		margin-left: 80px;
		width: 83px;
		height: 200px;
		font-size: 0.4em;
	}

	#contact h3 {
		margin-top: 10px;
		margin-bottom: 5px;
		font-size: 1.7em;
	}

	.ensemble-images-contact {
		width: 83px;
		margin-top: 10px;
	}

	.images-contact {
		display: block;
		width: 100%;
		margin: 0;
		margin-top: 12px;
		margin-bottom: 12px;
	}

	.file {
		margin-top: 1px;
		width: 30px;
	}

	#contact h6 {
		margin-top: 6px;
		font-size: 7px;
	}

}
