body {
    overflow-x: hidden;
    font-family: "Roboto Slab", "", sans-serif;
}
.text-muted {
    color: #777;
}
.text-primary {
    color: #fed136;
}
p {
    font-size: 14px;
    line-height: 1.75;
    padding-top: 8px;
}

p.over{
	    width: 100%;
    height: 200px;
    position: absolute;
    overflow: hidden;
    top: 40px;
    left: 160px;
    padding: 50px 20px;
    text-transform: uppercase;
    color: #fff;

}
.bouton{background-color: #f9c112;
	padding: 10px;
	border-radius: 10px;

} 
p.large {
    font-size: 16px;
}
a, a:hover, a:focus, a:active, a.active {
    outline: 0;
}
a {
    color: #585858;
}
a:hover, a:focus, a:active, a.active {
    color: #585858;
}
h1, h2, h4, h5, h6 {
    font-family: 'Roboto', sans-serif;
    text-transform: uppercase;
    font-weight: 700;
}

h2 {
    color: #FFC639;
    padding-bottom: 30px;
}
.img-centered {
    margin: 0 auto;
}
.bg-light-gray {
    background-color: #f7f7f7;
}
.bg-darkest-gray {
    background-color: #222;
}
.btn-primary {
    color: #fff;
    background-color: #fed136;
    border-color: #fed136;
    font-family: Montserrat, "Helvetica Neue", Helvetica, Arial, sans-serif;
    text-transform: uppercase;
    font-weight: 700;
}
.btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn-primary.active, .open .dropdown-toggle.btn-primary {
    color: #fff;
    background-color: #fec503;
    border-color: #f6bf01;
}
.btn-primary:active, .btn-primary.active, .open .dropdown-toggle.btn-primary {
    background-image: none;
}
.btn-primary.disabled, .btn-primary[disabled], fieldset[disabled] .btn-primary, .btn-primary.disabled:hover, .btn-primary[disabled]:hover, fieldset[disabled] .btn-primary:hover, .btn-primary.disabled:focus, .btn-primary[disabled]:focus, fieldset[disabled] .btn-primary:focus, .btn-primary.disabled:active, .btn-primary[disabled]:active, fieldset[disabled] .btn-primary:active, .btn-primary.disabled.active, .btn-primary[disabled].active, fieldset[disabled] .btn-primary.active {
    background-color: #fed136;
    border-color: #fed136;
}
.btn-primary .badge {
    color: #fed136;
    background-color: #fff;
}
.btn-xl {
    color: #fff;
    background-color: #fed136;
    border-color: #fed136;
    font-family: Montserrat, "Helvetica Neue", Helvetica, Arial, sans-serif;
    text-transform: uppercase;
    font-weight: 700;
    border-radius: 3px;
    font-size: 18px;
    padding: 20px 40px;
}
.btn-xl:hover, .btn-xl:focus, .btn-xl:active, .btn-xl.active, .open .dropdown-toggle.btn-xl {
    color: #fff;
    background-color: #fec503;
    border-color: #f6bf01;
}
.btn-xl:active, .btn-xl.active, .open .dropdown-toggle.btn-xl {
    background-image: none;
}
.btn-xl.disabled, .btn-xl[disabled], fieldset[disabled] .btn-xl, .btn-xl.disabled:hover, .btn-xl[disabled]:hover, fieldset[disabled] .btn-xl:hover, .btn-xl.disabled:focus, .btn-xl[disabled]:focus, fieldset[disabled] .btn-xl:focus, .btn-xl.disabled:active, .btn-xl[disabled]:active, fieldset[disabled] .btn-xl:active, .btn-xl.disabled.active, .btn-xl[disabled].active, fieldset[disabled] .btn-xl.active {
    background-color: #fed136;
    border-color: #fed136;
}
.btn-xl .badge {
    color: #fed136;
    background-color: #fff;
}
/* navigation */

.navbar-brand>img {
    width: 200px;
}

.nav{float:right;
	    
    vertical-align: middle;
    display: block;
    padding-top: 3%;
}

.nav > li {
    position: relative;
    display: inline-block;
    
}


#partenaires-csm{
	background-color: #cdcdcd;
	height: 700px;
	width: 100%;
}
ul.nav-tabs{
    margin-top: 21px;
    float: right;
}

.navbar-default .navbar-brand:hover, .navbar-default .navbar-brand:focus, .navbar-default .navbar-brand:active, .navbar-default .navbar-brand.active {
    color: #fec503;
}
.navbar-default .navbar-collapse {
    border-color: rgba(255, 255, 255, .02);
}
.navbar-default .navbar-toggle {
    background-color: #fed136;
    border-color: #fed136;
}
.navbar-default .navbar-toggle .icon-bar {
    background-color: #fff;
}
.navbar-default .navbar-toggle:hover, .navbar-default .navbar-toggle:focus {
    background-color: #fed136;
}
.navbar-default .nav li a {
    font-family: 'Roboto', sans-serif;
    text-transform: uppercase;
    font-weight: 400;
    letter-spacing: 1px;
    color: #585858;
}


@media (min-width:768px) {
    .navbar-default {
    background-color: transparent;
    padding: 25px 0;
    -webkit-transition: padding .3s;
    -moz-transition: padding .3s;
    transition: padding .3s;
    border: 0;
}
.third-slide{width: 100%;}
.img-projet1{width:100%;}
/* head */

}header {
    background-image: url(../img/bg/bg1.jpg);
    background-repeat: none;
    background-attachment: scroll;
    background-position: center center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
    text-align: center;
    color: #fff;
}
header .intro-text {
    padding-top: 100px;
    padding-bottom: 50px;
}
header .intro-text .intro-lead-in {
    font-family: "Roboto", sans-serif;
    font-style: bolder;
    font-size: 22px;
    line-height: 22px;
    margin-bottom: 25px;
}
header .intro-text .intro-heading {
    font-family: Montserrat, sans-serif;
    text-transform: uppercase;
    font-weight: 700;
    font-size: 50px;
    line-height: 50px;
    margin-bottom: 25px;
}
.partenaire-col2{margin-left: 10%;}
@media (min-width:768px) {
    header .intro-text {
    padding-top: 300px;
    padding-bottom: 200px;
}
header .intro-text .intro-lead-in {
    font-family: "Roboto slab", sans-serif;
    font-style: bolder;
    font-size: 40px;
    line-height: 40px;
    margin-bottom: 25px;
    color: #FFF;
}
header .intro-text .intro-heading {
    font-family: 'Roboto', sans-serif;
    text-transform: uppercase;
    font-weight: 700;
    font-size: 75px;
    line-height: 75px;
    margin-bottom: 50px;
}

.screen {
	overflow:hidden;
	width:100%;
height:200px;
}
.slider {
	position:relative;
	float:left;
	height:200px;
    width:100%;
	left:0;
	-webkit-transition:all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
}
.slider img {
	position:relative;
	float:left;
	height:200px;
	width:100%;
}

.screen:hover .slider {
    left:-100%;
}
/* home section*/

}section {
    padding: 0;
}
section h2.section-heading {
    font-size: 40px;
    margin-top: 0;
    margin-bottom: 15px;
}
section h3.section-subheading {
    font-size: 16px;
    font-family: "Roboto",sans-serif;
    text-transform: none;
    font-style: italic;
    font-weight: 400;
    margin-bottom: 75px;
}
@media (min-width:768px) {
    section {
    padding: 50px 0;
}


 /* Bloc texte qui sommes nous */

.qui-texte {
    height: 390px;
}

/* Bloc citation */


div#bloc-citation {
  padding-top: 100px;
}
#bloc-citation p {
    font-size: 30px;
}
#bloc-citation2 p {
    font-size: 30px;
}
img#img-ouvrier {
    width: 100%;
padding-top:50px;
}
img.img-icon-guillemet{
  width: 50px;
  opacity: 0.2;
}
p#strong{
color:#ffcb3e;
text-align: let;
text-transform: uppercase;
font-weight: bolder;
}
.citation{
    margin-top: -5%;
}
/* section partenaires */

img.logo{
width: 100%;
padding-left: 10%;

}
p.intro{margin:0px 80px 10px;}
img#logo-societe-generale{padding-top: 35px;}

.panel-logo{
padding-top: 8%;
width: 100%;
}




section#partenaires{
background-color:#cdcdcd;
padding: 10px;

    height: 500px;
    margin-bottom: 5%;

}

#titre-partenaire{
  color: #FFF ;
  padding-top: 1em;
}
}
#img-gazin{
  width: 80%;
}

/* section projet */
#logo309{width: 70%;  margin-top: 5%; margin-left: 10%;}
#lafourcade{padding-top: 4%;}
#premiereclasse{padding-top: 9%;}
#generale{padding-top: 17%;width: 70%;}
.logo-foncia{padding-left: 50px; width: 65%;}

img.img-projet{  width: 100%;}
.box-projet{margin-bottom: 30px;}
.bloc-souscontent{padding: 10px 10px;}

.hovereffect {
  width: 100%;
  float: left;
  overflow: hidden;
  position: relative;
  text-align: center;
  cursor: default;
  background: #ffcb3e;}

.hovereffect .overlay {
  width: 100%;
  height: 200px;
  position: absolute;
  overflow: hidden;
  top: 0;
  left: 0;
  padding: 50px 20px;
}
.img-responsive{
  height: 300px;
}
.hovereffect img {
  display: block;
  position: relative;
  max-width: none;
 
  -webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
  transition: opacity 0.35s, transform 0.35s;
  -webkit-transform: translate3d(-10px,0,0);
  transform: translate3d(-10px,0,0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

.hovereffect:hover img {
  opacity: 0.4;
  filter: alpha(opacity=40);
  -webkit-transform: translate3d(0,0,0);
  transform: translate3d(0,0,0);
}

.hovereffect h2 {
  text-transform: uppercase;
  color: #fff;
  text-align: center;
  position: relative;
  font-size: 17px;
  overflow: hidden;
  padding: 0.5em 0;
  background-color: transparent;
}

.hovereffect h2:after {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 2px;
  background: #fff;
  content: '';
  -webkit-transition: -webkit-transform 0.35s;
  transition: transform 0.35s;
  -webkit-transform: translate3d(-100%,0,0);
  transform: translate3d(-100%,0,0);
}

.hovereffect:hover h2:after {
  -webkit-transform: translate3d(0,0,0);
  transform: translate3d(0,0,0);
}

.hovereffect a, .hovereffect p {
  color: #FFF;
  opacity: 0;
  filter: alpha(opacity=0);
  -webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
  transition: opacity 0.35s, transform 0.35s;
  -webkit-transform: translate3d(100%,0,0);
  transform: translate3d(100%,0,0);
}

.hovereffect:hover a, .hovereffect:hover p {
  opacity: 1;
  filter: alpha(opacity=100);
  -webkit-transform: translate3d(0,0,0);
  transform: translate3d(0,0,0);
}

.accordion-heading{text-align: center;
padding-top: 2em;
padding-bottom: 2em;}


/************.carousel-inner{height: 600px;} ***************/
.carousel-control.left{background: none;}
.carousel-control.right{background: none;}
/************ Projet 1 ***************/

#accueilsocietegenerale{
    background-image: url(../img/projet.jpg);
    background-repeat: none;
    background-attachment: scroll;
    background-position: center center;}

/************ Projet 2  *************/

#accueil-projet{
    background-image: url(../img/bg/bg2.jpg);
    background-repeat: none;
    background-attachment: scroll;
    background-position: center center;}
      #accueil-csm{
	        background-image: url(../img/CSM/photo219.jpg);
        background-repeat: none;
        background-attachment: scroll;
        background-position: center center;}

/************ form contact *************/

    input, select, textarea {
        width: 80%;
        margin: 1px 20px;
        padding: 2%;
        border: 1px solid #CCC;
        background-color: #e7e7e7;
        font-family: "roboto",sans-serif;
        font-size: 0.9em;}

.submit-button{background-color:#fccf5b;color: #FFF; text-transform:uppercase;}

.selector{  margin: 1px 20px;}



/************ icons *************/

.glyphicon-phone{margin-top: 14px;}
.glyphicon-home{margin-top: 14px;}
.glyphicon-phone{margin-top: 14px;margin-left: 50%;}
.glyphicon-envelope{margin-top: 14px;  margin-left: 50%;}
.glyphicon-home{margin-top: 14px;  margin-left: 50%;}


/************ map *************/

#map {

    filter: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg"><filter id="g"><feColorMatrix type="matrix" values="0.3 0.3 0.3 0 0 0.3 0.3 0.3 0 0 0.3 0.3 0.3 0 0 0 0 0 1 0"/></filter></svg>#g');
    
     }
/************ footer *************/



p#egue {
    float: left;
    background-color:#434343;
    color: #fff;
    width: 100%;
    line-height: 400%;
    text-align: center;
    font-weight: 300;
    font-size: 0.65em;
    margin: 0px;
    letter-spacing: 0.5px;}

footer {
margin: 0px 0px;}
.lien-egue{color: #FFF;
text-decoration: underline;}
.accordion-toggle{text-align: center;
text-decoration: none;
text-transform: uppercase;
}
.logo-footer{
	width: 50%;
padding-bottom: 40px;
padding-top: 20px;
padding-left: 40px;
}
.telephone{text-align: left;}

.adresse{text-align: left;}
.mail{text-align:left;}
.input-group{margin-left: 22%;}
.InputName{margin-left: 22%;}
.titre-section-contact{text-align: left;
}



/************ page projet  *************/


.img-responsive2 {
    height: 500px;
}
section#chiffre-proj{;padding-top: 17%;}

.titre1{padding-bottom: 0px;font-family: 'roboto';font-style: lighter;}
.titre2{
padding-bottom: 50px;
padding-top: 40px;
}
.texte-cle{font-family: "Roboto",sans-serif;font-weight: lighter;font-size: 20px;color:#a9a9a9;}
.chiffre-cle{font-family: "Roboto",sans-serif;font-weight: lighter;font-size: 30px;color:#a9a9a9;}
.text-prez{text-align: center;}

.img-responsive, .thumbnail a > img, .thumbnail > img {display: block;max-width: 100%;}
.img-responsive2{
  height: 400px;
margin-left: 8%;
}
.img-responsive{
  height: 200px;
  width: 110%;

}


.chiffre-col{text-align: center;}
.bloc-citation2
.text-left{text-align: left;}



.carousel{
    height: 270px !important;}


.logo{ margin-bottom:8%;}


.text-item{

        width: 100%;



    text-align: left;
    

}


.intro{text-align: center;}
.introcsm{text-align: left}









/**************** Styles pour cette Media Queries ****************/

@media (max-width : 768px){

div#myCarousel.carousel-projet.slide{
    height: 200px ;}
	
	.text-prez{ margin-top: 10%;
		margin-bottom: 10%}
		
		
.carousel {
    height: 165px !important;}


.accordion-toggle{display: inline-block;}
#bloc-citation p{font-size: 24px;text-align: center;margin-top: -20px;}
.carousel-indicators {bottom: 20px;}

.navbar-brand > img {
    width: 100px;
    margin-left: 115%;
}
.section-devis{margin-left:0%;}
.logo-footer {
	margin-bottom: 10%;
    width: 30%;
    padding-left: 0px;
    margin-left: 32%;}
    
 section#partenaires {
    background-color: #CDCDCD;
    padding: 10px;
    margin-top: 10%;
    height: 2000px;
}
.text-item{

        width: 100%;
	margin-bottom: 50px;
		text-align: left;
		

}
 section#partenaires{height: 600px !important;}
 .logo{width: 50% !important;
	 padding-right: 0px;
	 
 }
 .panel-logo {
    padding-top: 8%;
    width: 100%;
    height: 1800px;
    margin-left: 9%;
}
    .nav > li {
     
    font-size: 10px;
}


}


@media screen and (min-width: 640px) and (max-width: 1280px) {
	.carousel {
    height: 10% !important;}
    
.glyphicon-phone{margin-top: 14px;}
.glyphicon-home{margin-top: 14px; margin-left: 40%;}
.glyphicon-phone{margin-top: 14px;margin-left: 50%;}
.glyphicon-envelope{margin-top: 14px; }

.glyphicon-home{margin-top: 14px;  margin-left: 50%;}

}
@media screen and (min-width: 640px) and (max-width: 669px) {
	.glyphicon-phone{margin-top: 14px;margin-left: 50%;}
.glyphicon-envelope{margin-top: 14px;  margin-left: 50%;}
.glyphicon-home{margin-top: 14px;  margin-left: 50%;}
.telephone{text-align: center;}
.adresse{text-align: center;}
.mail{text-align: center;}
div#myCarousel.carousel-projet.slide{
    height: 100px ;}


}




@media screen and (min-width: 200px) and (max-width: 760px) {
.partenaire-col2{margin-left: 0%;}
	#partenaires-csm{
	background-color: #cdcdcd;
	height: 1400px;
	width: 100%;
	margin-bottom: 2%;
}
#titre-partenaire {
    color: #FFF;
    padding-top: 1em;
    font-size: 20px;
}
h2{font-size: 20px;
	
}


.carousel-indicators {bottom: 20px;}
.logo-footer{  width: 30%;padding-left: 0px}
.glyphicon-phone{margin-top: 14px;margin-left: 50%;}
.glyphicon-envelope{margin-top: 14px;  margin-left: 50%;}
.glyphicon-home{margin-top: 14px;  margin-left: 50%;}
.telephone{text-align: center;}
.adresse{text-align: center;}
.mail{text-align: center; margin-bottom: 20%;}
.input-group{margin-left: 22%;}
.InputName{margin-left: 22%;}
.titre-section-contact{text-align: center;}

#bloc-citation p{font-size: 17px;text-align: center;}
img.logo {width: 50%;text-align: center;}
.section-devis{margin-left:0%;
	
}

.logo-footer {
   
    padding-left: 0px;
    margin-left: 30%;
    width: 35% !important;
margin-left: 32%;
margin-top: 10%;
margin-bottom: 0%;}
   
#logo309{width: 50% !important;}
#lafourcade{padding-top: 4%;}
#premiereclasse{padding-top: 9%;}
#generale{padding-top: 17%;}
.logo-foncia{padding-left: 50px; width: 65%;}


 .logo{width: 70% !important;}

.nav{
	float: left;
font-size: 10px;
margin-left: 30%;
text-align: center;
}

    
    .nav > li {
    
    display: block;
}

	 section#partenaires {
    background-color: #CDCDCD;
    padding: 10px;
    margin-top: 10%;
    height:990px  !important;
}
   
.contact-number{height:300px;}


        width: 100%;


    text-align: left;
    
}
.carousel {
    height: 170px; }

}

@media screen and (min-width: 360px) and (max-width: 640px) {
	
section#partenaires {
    background-color: #CDCDCD;
    padding: 10px;
    margin-top: 10%;
    height: 1110px !important;
    
}
	

	
}