body, html {
    font-family: 'Open Sans', sans-serif;
}
body{
  background: #FFF; margin:0; padding:0;
}
iframe{
	z-index:100000;
}
h1, h2, h3, h4, h5, h6 {
    font-family: 'Open Sans', sans-serif;
}

h1, h2 {
    font-weight: 700;
}

h3, h4, h5 {
    font-weight: 400;
}

h6 {
    font-weight: 600;
}
h6 a{
    font-family: 'Open Sans', sans-serif;
    font-weight: 600;
	color:#000;
	text-decoration:none;
	border-bottom: dotted thin #000;
}
h6 a:hover{
	border-bottom: solid thin #000;
}
.explanation h1 {
    font-size: 5em;
    line-height: 0em;
}
.explanation h2 {
    font-size: 40px;
    line-height: 0em;
}
.explanation h3 {
    font-size: 14px;
    line-height: 0em;
}
.explanation h4 {
    font-size: 16px;
    line-height: 1.2em;
}
.explanation h5 {
    font-size: 12px;
    line-height: 0em;
}
.explanation h6 {
    font-size: 16px;
    line-height: 0em;
	margin-right:30px;
}


section {
  min-height: 1200px;
}

#menu {
  position: fixed;
  left: 50px;
  top: 30%;
}

#menu {
  list-style-type: disc;
  color: #626264;
}
#menu li.skrollable-between,
#menu li.skrollable-after:last-child {
  list-style-type: disc;
  color: #797979;
}
#menu a,
#menu a:link, 
#menu a:visited {
  color: #000;
  text-decoration: none;
  font-size: 12px;
  font-weight: 400;
  font-style:italic;
}

.bordure_img {
	border: #FFF 4px solid;
	box-shadow: 0px 0px 14px 4px rgba(119, 119, 119, 0.35);
	-moz-box-shadow: 0px 0px 14px 4px rgba(119, 119, 119, 0.35);
	-webkit-box-shadow: 0px 0px 14px 4px rgba(119, 119, 119, 0.35);
	z-index: 100000 !important;
}
.btn-facebook {
  position:fixed; /* don't you move */
  top:25%;
  width:47px;
  height:41px;
  background:url(../images/social/icon_facebook.png);
  z-index: 1001;
  border: none;
}
.btn-twitter {
  position:fixed; /* don't you move */
  top:30%;
  width:47px;
  height:41px;
  background:url(../images/social/icon_twitter.png);
  z-index: 1001;
  border-top: 1px solid rgba(0, 0, 0, 0.2);
  border-bottom: 1px solid rgba(0, 0, 0, 0.2);
}
.btn-instagram {
  position:fixed; /* don't you move */
  top:35%;
  width:47px;
  height:41px;
  background:url(../images/social/icon_instagram.png);
  z-index: 1001;
  border: none;
  border-bottom: 1px solid rgba(0, 0, 0, 0.2);
}
.btn-angel {
  position:fixed; /* don't you move */
  top:40%;
  width:47px;
  height:41px;
  background:url(../images/social/icon_angel.png);
  z-index: 1001;
  border: none;
}

.right {
  left:95%; /* 1% (start) + 14 (width) + 70 (main width) */
}

#ombre-smartphone {
	background-image: url(../images/ombre_smartphone.png);
	background-repeat: no-repeat;
    min-width:599px;
    max-width:599px;
	height: 175px;
    margin-right:5%;
    float:left;
	position: fixed;
	margin-left: 23%;
	margin-top: 450px;
}

#phone {
    min-width:216px;
    max-width:216px;
	height: 501px;
    margin-right:5%;
    float:left;
	position: fixed !important;
	margin-left: 30%;
	margin-top: 100px;
}

#phone_vide {
    min-width:216px;
    max-width:216px;
	height: 424px;
    margin-right:5%;
    margin-left:30%;
    float:left;
}
#screen {
    height: 424px;
    overflow: hidden;
    padding:0;
    position: relative;
    min-width:216px;
    max-width:216px;
}
#reflet {
    height: 77px;
    overflow: hidden;
    padding:0;
    position: relative;
    min-width:216px;
    max-width:216px;
	background-image:url(../images/reflet_smartphone.png);
	position: fixed;
	margin-top: 424px;
}

.section{
position:absolute;
  display:block;
  width:100%;
  //top:400px;
  //margin: auto;
  //z-index:100;
  color:white;
  text-align: left; 
  //padding-left: 3em;
}

#sect1 { 
  top:100px;
}

#sect2 { 
  top:1300px;
}

#sect3 { 
  top:2500px;
}

#sect4 { 
  top:3700px;
}

#sect5 { 
  top:4900px;
}

#map { 
  position: fixed;
  top:0; 
  bottom:0; 
  width:216px;
  height:2000px;
  background-image: url(../images/smartphones-screens_01.png);
  background-repeat: no-repeat;
  margin-top: 100px;
}

#map2 { 
  position: fixed;
  top:0; 
  bottom:0; 
  width:216px;
  height:2000px;
  background-image: url(../images/smartphones-screens_02.png);
  background-repeat: no-repeat;
  margin-top: 100px;
}

#map3 { 
  position: fixed;
  top:0; 
  bottom:0; 
  width:216px;
  height:2000px;
  background-image: url(../images/smartphones-screens_03.png);
  background-repeat: no-repeat;
  margin-top: 100px;
}

#map4 { 
  position: fixed;
  top:0; 
  bottom:0; 
  width:216px;
  height:2000px;
  background-image: url(../images/smartphones-screens_04.png);
  background-repeat: no-repeat;
  margin-top: 100px;
}

#map5 { 
  position: fixed;
  top:0; 
  bottom:0; 
  width:216px;
  height:2000px;
  background-image: url(../images/smartphones-screens_05.png);
  background-repeat: no-repeat;
  margin-top: 100px;
}
.explanation {
  min-width: 12.42em;
  float:left;
  //padding-top:5%;
  /*width:40%;*/
  //display:block;
  z-index:1000 !important;
}
.explanation-suite {
  min-width: 12.42em;
  max-width: 364px;
  float:left;
  //padding-top:5%;
  /*width:40%;*/
  //display:block;
}
.explanation-suite h1 {
    font-size: 54px;
    line-height: 0em;
	margin-top: 175px;
}
.explanation-suite h3 {
    font-size: 14px;
    line-height: 1.2em;
}

#footer-div {
     position: fixed;
     bottom: 15px;
     width: 100%;
	 z-index: 2000;
}

#footer-div-about{
     position: relative;
     bottom: 15px;
     width: 100%;
	 margin-top: 100px;
}
.inner-div {
     margin: 0 auto;
     width: 560px;
	 color: #000;
}
.inner-div > h5 {
	font-size: 11px;
	font-weight:400;
	line-height: 0;
	display: inline-block;
}
.inner-div > h5 a {
	font-size: 11px;
	font-weight:400;
	line-height: 0;
	 color: #000;
	 text-decoration: none;
}

.inner-div > h6 {
	font-size: 9px;
	font-weight:400;
	line-height: 1.2;
	display: inline-block;
	margin: 0;
}

.animated {
	animation-duration: 1s;
	animation-fill-mode:both;
}

.animated2 {
	animation-duration: 3s;
	animation-fill-mode:both;
}

@-webkit-keyframes fadeInLeftBig {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-2000px);
    transform: translateX(-2000px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

@keyframes fadeInLeftBig {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-2000px);
    -ms-transform: translateX(-2000px);
    transform: translateX(-2000px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
}

.fadeInLeftBig {
  -webkit-animation-name: fadeInLeftBig;
  animation-name: fadeInLeftBig;
}



@-webkit-keyframes fadeInUpBig {
  0% {
    opacity: 0;
    -webkit-transform: translateY(2000px);
    transform: translateY(2000px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}

@keyframes fadeInUpBig {
  0% {
    opacity: 0;
    -webkit-transform: translateY(2000px);
    -ms-transform: translateY(2000px);
    transform: translateY(2000px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
}

.fadeInUpBig {
  -webkit-animation-name: fadeInUpBig;
  animation-name: fadeInUpBig;
}



@-webkit-keyframes fadeIn {
  0% {
    opacity: 0;
    -webkit-transform: translateX(0px);
    transform: translateX(0px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

@keyframes fadeIn {
  0% {
    opacity: 0;
    -webkit-transform: translateX(0px);
    -ms-transform: translateX(0px);
    transform: translateX(0px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
}

.fadeIn {
  -webkit-animation-name: fadeIn;
  animation-name: fadeIn;
}

.columns-about {
	-webkit-columns: 2;
	-moz-columns: 2;
	columns: 2;
	-moz-column-gap: 50px;
	-webkit-column-gap: 50px;
	column-gap: 50px;
	margin: 0;
}
.text-justify {
  text-align: justify;
}
.center-about {
     margin: 0 auto;
     max-width: 980px;
	 margin-top: 100px;
}
.center-about h1{
    font-size: 54px;
	font-weight:700;
    line-height: 1em;
}
.center-about h2{
    font-size: 12px;
	font-weight:800;
    line-height: 0em;
}
.center-about p{
    font-size: 12px;
	font-weight:400;
}
.center-about a{
    font-size: 12px;
	font-weight:bold;
	text-decoration:underline;
	color: #000;
}
.titre-about {
    font-family: 'Open Sans', sans-serif;
    font-size: 13px;
	font-weight: bold;
}
.center-about h3 {
    font-family: 'Open Sans', sans-serif;
    font-size: 30px;
	font-weight: bold;
	line-height: 1;
	margin-bottom: 25px;
}
.center-CGU {
     margin: 0 auto;
     max-width: 980px;
	 margin-top: 100px;
}
.center-CGU h1{
    font-size: 40px;
	font-weight:700;
    line-height: 1em;
}
.center-CGU h2{
    font-size: 16px;
	font-weight:800;
    line-height: 1em;
}
.center-CGU h3{
    font-size: 14px;
	font-weight:800;
    line-height: 1em;
}
.center-CGU h6{
    font-size: 10px;
	font-weight:400;
    line-height: 1em;
}
.center-CGU p{
    font-size: 12px;
	font-weight:400;
}
.center-CGU ul{
    font-size: 12px;
	font-weight:400;
	margin: 0;
}
.center-CGU li{
	list-style: none;
}
.add-margin {
	margin-right: 10px;
}