@charset "utf-8"
/* PARAMETRE GENERALE */
*{
	margin:0px;
	padding: 0px;
	font-family: 'Montserrat', sans-serif;
}

.navbar-inverse {
    background-color: black;
    border-color: black;
}
.navbar-inverse .navbar-nav>li>a {
    color: white;
	font-weight:500;
	line-height: 30px;
	font-size: 1.2em;
}
.navbar-inverse .navbar-nav>li>a:hover {
    color: #038e8a;
	font-weight: 500;
	line-height: 30px;
	font-size: 1.2em;
}
/* Header fond */
.large-header {
	position: relative;
 	width: 100%;
  	background: #333;
  	background-size: cover;
  	background-position: center center;
  	z-index: 1;
}
#large-header {
	background: #fffcf9; /* Old browsers */
background: -moz-radial-gradient(center, ellipse cover, #fffcf9 5%, #038e8a 29%, #283c5c 69%); /* FF3.6-15 */
background: -webkit-radial-gradient(center, ellipse cover, #fffcf9 5%,#038e8a 29%,#283c5c 69%); /* Chrome10-25,Safari5.1-6 */
background: radial-gradient(ellipse at center, #fffcf9 5%,#038e8a 29%,#283c5c 69%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fffcf9', endColorstr='#283c5c',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
}
.main-title {
  	position: absolute;
 	margin: 0;
 	padding: 0;
 	color: white;
 	font-size: 3em;
	margin: -39% 0 0 -2%;
}
.demo-1 .main-title {
  text-transform: uppercase;
  font-size: 4.2em;
  letter-spacing: 0.1em;
}
.main-title .thin {
  font-weight: 200;
}
@media only screen and (max-width: 768px) {
  .demo-1 .main-title {
    font-size: 3em;
  }
}
.logo{
    margin-top: -15px;
}
.logo-sm{
    margin: -15px -17px 0 0;
}
#ordinateur{
	margin-top:-48%;
}
.orange{
	color: white;
	font-style: normal;
	font-weight: 500;
	font-size: 1.3em;
}
.main-title2 {
  	position: relative;
  	margin: 0;
  	padding: 0;
 	color: white;
  	font-size: 2.42em;
	margin: -55% 0 0 25%;
	text-align: center;
	float: left;
}
#portfolio{
	background: url(fond-port4.jpg) no-repeat fixed top;
	background-size: cover;
}
#fond{
	padding: 150px;
}
.lien-portfolio{
	font-size: 3em;
	color: white;
	padding: 20px 80px 20px 80px;
	border: 1px solid white;
}
a.lien-portfolio:hover{
	font-size: 3em;
	color:#038e8a;
	padding: 20px 80px 20px 80px;
	border: 1px solid #038e8a;
	text-decoration: none;
	background: rgba(255,255,255,0.4);
}
.agence{
    color: #038e8a;
    margin-top: 70px;
    margin-bottom: 40px;
}
.trait{ 
border-bottom : 1px solid #038e8a; 
    position: relative;
    margin-top:40px;
}
.services{
    margin-bottom: 80px;
    color: #038e8a;
}
.bas{
    margin-bottom: 40px;
}
#referencement{
	background: url(wantedmyweb-fondreferencement.jpg) no-repeat fixed center;
	background-size: cover;
   margin: 50px 0 0 0;
}
#referencement-xs{
	background: url(wantedmyweb-fondreferencement.jpg) no-repeat;
	background-size: cover;
   margin: 50px 0 0 0;
}
.lien-referencement{
    color: white;
   background: rgba(0, 0, 0, 0.44);
    border: 1px solid white;
    font-size: 36px;
    padding: 10px 30px 10px 30px;
    margin: 125px 0 125px 0;
    
}
.lien-referencement:hover{
    color: #038e8a;
   background: rgba(255,255,255,0.4);
    border: 1px solid #038e8a;
    font-size: 36px;
    padding: 10px 30px 10px 30px;
    margin: 125px 0 125px 0;
    
}
.enveloppe-commentaire{
    overflow: auto;
    height: 500px;
    padding-top: 24px;
}
#equipes{
    margin-top: 40px;
}
#contact{
    margin-top:80px;
    background: #fffcf9; /* Old browsers */
    background: -moz-radial-gradient(center, ellipse cover, #fffcf9 5%, #038e8a 29%, #283c5c 69%); /* FF3.6-15 */
    background: -webkit-radial-gradient(center, ellipse cover, #fffcf9 5%,#038e8a 29%,#283c5c 69%); /* Chrome10-25,Safari5.1-6 */
    background: radial-gradient(ellipse at center, #fffcf9 5%,#038e8a 29%,#283c5c 69%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fffcf9', endColorstr='#283c5c',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
}
.control-label{
    color:white;
}

#pied{
    background: black;
    line-height: 50px;
    color:white;
}
#pied_configurateur{
    background: black;
    line-height: 50px;
    color:white;
    position:fixed;
    bottom:0px;
    left:0px;
    right:0px;
    margin-bottom:0px;
}
.blanc{
    color:white;
}
a.pointer{
    cursor: default;
}
.portfolio{
    color: #038e8a;
    margin-top: 10%;
    margin-bottom: 40px;
}
.turquoise{
    color: white;
   
}
.turquoise:hover{
    color: #038e8a;
    cursor: pointer;
}
::-webkit-scrollbar { 
    display:none; 
}
.couleur-reseaux{
    color:white;
}
.couleur-reseaux:hover{
    color:#038e8a;
}
.fond-commentaire{
    background: #efefef;
    padding: 45px 80px 52px 118px;
    border-radius: 5px 5px 5px 5px;
    margin-bottom: 48px;
}
.guillemet{
        margin: -71px 0 0 0;    
}
.image-commentaire{
   width: 7%;
}
.text-commentaire{
    margin:25px 0 0 0;
}
/* PARAMETRE MD */
#ordinateur-md{
    margin-top:-60%;
}
.main-title-md{
    padding: 0;
    color: white;
    font-size: 3em;
    margin: -70% 0 0 15%;
}
.main-title2-md{
  	margin: 0;
  	padding: 0;
 	color: white;
  	font-size: 2.42em;
	margin: -15% 0 0 20%;
}
/* PARAMETRE SM */
#fond-index-sm{
     background: #fffcf9; /* Old browsers */
    background: -moz-radial-gradient(center, ellipse cover, #fffcf9 5%, #038e8a 29%, #283c5c 69%); /* FF3.6-15 */
    background: -webkit-radial-gradient(center, ellipse cover, #fffcf9 5%,#038e8a 29%,#283c5c 69%); /* Chrome10-25,Safari5.1-6 */
    background: radial-gradient(ellipse at center, #fffcf9 5%,#038e8a 29%,#283c5c 69%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fffcf9', endColorstr='#283c5c',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
}
.main-title-sm{
    padding:15% 0 5% 0;
    color:white;
    margin: 0 0 0 -12%;
}
.main-title2-sm {
 	color: white;
    padding-bottom: 60px;
    margin: 0 0 0 -10%;
}
#commentaire{
    margin: 25px 0 0 0;
}
/* PARAMETRE XS */
.logo-xs{
      margin-top: -20px;
}
#fond-index{
     background: #fffcf9; /* Old browsers */
    background: -moz-radial-gradient(center, ellipse cover, #fffcf9 5%, #038e8a 29%, #283c5c 69%); /* FF3.6-15 */
    background: -webkit-radial-gradient(center, ellipse cover, #fffcf9 5%,#038e8a 29%,#283c5c 69%); /* Chrome10-25,Safari5.1-6 */
    background: radial-gradient(ellipse at center, #fffcf9 5%,#038e8a 29%,#283c5c 69%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fffcf9', endColorstr='#283c5c',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
}
.main-title-xs{
    padding:20% 0 0 0;
    color:white;
}
.main-title2-xs {
 	color: white;
    padding-bottom: 30px;
}
#fond-xs{
	padding: 80px;
}
.lien-portfolio-xs{
	font-size: 2em;
	color: white;
	padding: 20px 50px 20px 50px;
	border: 1px solid white;
}
.portfolio-xs{
    color: #038e8a;
    margin-top: 20%;
    margin-bottom: 40px;
}
/* page tarif.php */
.portfolio-tarifs {
    color: #038e8a;
    margin-top: 10%;
    margin-bottom: 10px;
}
.titre-tarifs{
    font-size:1.4em;
    text-align: center;
    line-height: 31px;
    margin: 24px 0 20px 0;
}

.trait-tarifs{
    border-top: solid 2px white;
}
.carre-1{
    background: #283c5c;
    color: white;
    padding: 20px 62px 50px 57px;
    margin: 50px -33px 0 0;
}
.enveloppe-text{
    margin: 36px 0 0 0;
    font-size: 16px;
}
#pied-tarifs{
    background: black;
    line-height: 50px;
    color: white;
    position: fixed;
    bottom: 0px;
    left: 0px;
    right: 0px;
    margin-bottom: 0px;
}
.point{
    color: #038e8a;
    font-size: 1.7em;
}
.prix-tarifs{
   font-size: 2.5em;
    color: #038e8a;
    margin: 35px 0 0 0;
    text-align: center;
    font-weight: bold;
}
.prix-tarifs2{
   font-size: 2.5em;
    color: white;
    margin: 35px 0 0 0;
    text-align: center;
    font-weight: bold;
}
.carre-2{
    background: white;
    padding: 20px 62px 50px 57px;
    border: solid 6px #038e8a;
    margin: 0 -30px 0 0;
}
.titre-tarifs2{
    font-size:1.4em;
    text-align: center;
    line-height: 31px;
    margin: 24px 0 20px 0;
    color:#038e8a;
    font-weight: bold;
}
.trait-tarifs2{
    border-top: solid 2px #038e8a;
}
.ecran-vide{
    margin: 102px -38px 0 0;
}
.configurateur-lien{
      position: relative;
    margin: -22% 35% 31% 436px;;
    padding: 10px;
    background: #038e8a;
    font-size: 2em;
}
a:focus, a:hover {
    color: #23527c;
    text-decoration: none;
}
.blanc-tarifs{
    color: white;
}
.marge-choisir{
   margin: 27px 0 0 0;
}
.choisir{
    border: 2px solid white;
    color: white;
   padding: 10px 68px 10px 77px;
    font-size: 1.2em;
    font-weight: bold;
}
.choisir:hover{
    border: 2px solid white;
    color: #038e8a;
    padding: 10px 68px 10px 77px;
    background: white;
    font-size: 1.2em;
    font-weight: bold;
}
.choisir2{
    border: 2px solid #038e8a;
    color: #038e8a;
   padding: 10px 65px 10px 65px;
    font-size: 1.2em;
    font-weight: bold;
}
.choisir2:hover{
    border: 2px solid #038e8a;
    color: white;
    padding: 10px 65px 10px 65px;
    background:  #038e8a;
    font-size: 1.2em;
    font-weight: bold;
}
.titre{
  color :  #038e8a;
  font-family: 'Montserrat', sans-serif;
  font-size:1.8em;
  margin:9% 0 3% 1%;
}
/* PARAMETRE MD */
.choisir-md{
    border: 2px solid white;
    color: white;
    padding: 10px 35px 10px 44px;
    font-size: 1.2em;
    font-weight: bold;
}
.choisir-md:hover{
    border: 2px solid white;
    color: #038e8a;
   padding: 10px 35px 10px 44px;
    background: white;
    font-size: 1.2em;
    font-weight: bold;
}
.choisir2-md{
    border: 2px solid #038e8a;
    color: #038e8a;
   padding: 10px 35px 10px 29px;
    font-size: 1.2em;
    font-weight: bold;
}
.choisir2-md:hover{
    border: 2px solid #038e8a;
    color: white;
    padding: 10px 35px 10px 29px;
    background:  #038e8a;
    font-size: 1.2em;
    font-weight: bold;
}
.configurateur-lien-md{
      position: relative;
    margin:-27% 32% 30% 339px;
    padding: 10px;
    background: #038e8a;
    font-size: 2em;
}
/* PARAMETRE SM */
.choisir-sm{
    border: 2px solid white;
    color: white;
    padding: 10px 3px 10px 2px;
    font-size: 1.2em;
    font-weight: bold;
}
.choisir-sm:hover{
    border: 2px solid white;
    color: #038e8a;
   padding:10px 3px 10px 2px;
    background: white;
    font-size: 1.2em;
    font-weight: bold;
}
.choisir2-sm{
    border: 2px solid #038e8a;
    color: #038e8a;
       padding: 10px 2px 10px 2px;
    font-size: 1.2em;
    font-weight: bold;
}
.choisir2-sm:hover{
    border: 2px solid #038e8a;
    color: white;
    padding: 10px 2px 10px 2px;
    background:  #038e8a;
    font-size: 1.2em;
    font-weight: bold;
}
.configurateur-lien-sm2 {
    position: relative;
    margin: -36% 27% 31% 32%;
    padding: 10px;
    background: #038e8a;
    font-size: 2em;
}
.carre-2-sm {
    background: white;
    padding: 20px 58px 50px 47px;
    border: solid 6px #038e8a;
    margin: 0 -30px 0 0;
}
/* PARAMETRE XS */
.choisir-xs{
    border: 2px solid white;
    color: white;
    padding: 10px 13px 10px 13px;
    font-size: 1.2em;
    font-weight: bold;
}
.choisir-xs:hover{
    border: 2px solid white;
    color: #038e8a;
   padding: 10px 13px 10px 13px;
    background: white;
    font-size: 1.2em;
    font-weight: bold;
}
.choisir2-xs{
    border: 2px solid #038e8a;
    color: #038e8a;
   padding: 10px 7px 10px 7px;
    font-size: 1.2em;
    font-weight: bold;
}
.choisir2-xs:hover{
    border: 2px solid #038e8a;
    color: white;
    padding: 10px 7px 10px 7px;
    background:  #038e8a;
    font-size: 1.2em;
    font-weight: bold;
}
.configurateur-lien-sm{
      position: relative;
    margin: -29% 31% 31% 315px;
    padding: 10px;
    background: #038e8a;
    font-size: 2em;
}
.carre-1-xs{
    background: #283c5c;
    color: white;
    padding: 20px 62px 50px 57px;
}
.carre-2-xs{
    background: white;
    padding: 20px 62px 50px 57px;
    border: solid 6px #038e8a;
}
.titre_xs{
  color :  #038e8a;
  font-family: 'Montserrat', sans-serif;
  font-size:1.2em;
  margin: 21% 0 5% 1%;
}
.ecran-vide-xs{
    margin: 102px 0px 0 0;
}
.configurateur-lien-xs {
    position: relative;
    margin: -57% 16% 98% 15%;
    padding: 2%;
    background: #038e8a;
    font-size: 1.2em;
}
/* page inscription.php */
#inscription{
    background: #fffcf9; /* Old browsers */
    background: -moz-radial-gradient(center, ellipse cover, #fffcf9 5%, #038e8a 29%, #283c5c 69%); /* FF3.6-15 */
    background: -webkit-radial-gradient(center, ellipse cover, #fffcf9 5%,#038e8a 29%,#283c5c 69%); /* Chrome10-25,Safari5.1-6 */
    background: radial-gradient(ellipse at center, #fffcf9 5%,#038e8a 29%,#283c5c 69%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fffcf9', endColorstr='#283c5c',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
    background-size: cover;
    height: 600px
}
.form-horizontal{
    
    padding:50px 0 0 0;
}
.formulaire_inscription{
    margin:0 0 0 19px;
}
h2.agenceblanc{
    margin-bottom: 40px;
    color: white;
    font-size: 1.9em;
    padding: 37px 0 0 0;
}
.text-inscription{
    color: white;
    font-size: 1.9em;
    padding:28px 0 40px 0;
}
input[type=text]:focus:valid, input[type=email]:focus:valid {
 box-shadow: 0 0 3px 1px #00FF00;
 webkit-box-shadow:0 0 3px 1px #00FF00;
}
input[type=text]:focus:invalid, input[type=email]:focus:invalid {
 box-shadow: 0 0 3px 1px red;
}
input:focus:invalid + p.error {
display:inline-block;
color:red;
}
input:focus:valid + p.error {
display:inline-block;
}
input:focus:invalid + i.error {
display:inline-block;
color:red;
}
input:focus:valid + i.error {
display:inline-block;
}