body{
background-image: url(../img/back.png);
background-repeat:repeat;

}

html,body {
height:100%;
}

.container{width:1100px; margin:0 auto;}


.bloc{
width:auto; 
display:block;
margin-top: 7%;

}

#foot{
width:745px;
height:25px;
display:block;
float:right;
}

#serv{
width:325px;
height:462px;
margin-top:15px;
padding-bottom: 6px;
border-bottom: 1px dotted #938C88;
}

#nous{
width:959px;
height:250px;
margin-top:15px;
padding-bottom: 6px;
}

p.texte-projets{

font-family:"ConduitITC-Light";
font-size: 15px;
line-height: 20px;
color: #918C85;
text-decoration: none;
margin-top: -25px;

}

.blocgauche{
width:325px;
position:relative;
left:0px;
top:0px;
display:block;
float:left;
}

.blocdroite{
width:745px;
position:relative;
left:0px;
top:0px;
display:block;
float:right;
}

#nousimage{
width:959px;
height: 250px;
position:relative;
display:block;
float:left;
margin-top: 10px;
}

.top{
width: 745px;
height: 89px;
vertical-align: bottom;
display: table-cell;
}

.top img{
vertical-align: bottom;
}

.texte-right{
width: 220px;
height: 280px;
float:right;
margin-top: 0px;
border-top: 1px dotted #938C88;
}

p.rep{
font-family:"ConduitITC-Light";
font-size: 11pt;
color: #46423F;
text-decoration:none; 
text-align: center;
margin-top: 10px;

}

.texte-right2{
width: 220px;
height: 280px;
float:right;
margin-top: 10px;
border-top: 1px dotted #938C88;
}

.texte-right3{
width: 220px;
height: 280px;
float:right;
margin-top: 10px;
border-top: 1px dotted #938C88;
}

.texte-right4{
width: 220px;
height: 280px;
float:right;
margin-top: 10px;
border-top: 1px dotted #938C88;
}

.texte-right5{
width: 220px;
height: 280px;
float:right;
margin-top: 10px;
border-top: 1px dotted #938C88;
}

.texte-right6{
width: 220px;
height: 280px;
float:right;
margin-top: 10px;
border-top: 1px dotted #938C88;
}

.texte-right7{
width: 220px;
height: 280px;
float:right;
margin-top: 10px;
border-top: 1px dotted #938C88;
}

.small-line{
width: 220px;
border-top: 1px dotted #938C88;
padding-top: 10px;
}

.logo{
height: 58px;
}

.menu {
  position: relative;
  width:325px;
  margin:0;
  padding:0;
  height: 46px;
  border-top: 1px dotted #938C88;
  border-bottom: 1px dotted #938C88;
}


.menu ul{
  display: block;
  margin: 0px auto;
  width: 325px;
}
.menu ul li {list-style: none}

.menu ul li a{
display:block; 
float: left; 
padding:0px 42px 0 0px; 
text-decoration:none; 
font-weight: lighter;
font-size: 21px;
color: #ADAAA0;
margin-top: -7px;

}

.menu a {
	color: #ADAAA0;
}

.menu a:hover {
	color:#46423F;
}


#imageSub4{
margin-top:10px;
width:325px;
height: 470px;
border-bottom: 1px dotted #938C88;

}


#imageSub2 { position: absolute;  }
      #imageSub2 img { z-index: 2; }
      #imageSub2 div {
        position: absolute;
        left: 0px;
        bottom: 0px;
        top:-106px;
        width: 320px;
        padding-top: 5px;
        padding-left: 5px ;
        height: 90px;
        line-height: 20px;
        text-align: left;
        overflow: hidden;
        font-family: "ConduitITC-Light", "Gill Sans MT", Calibri, sans-serif;
        letter-spacing:1px;
        display: table-cell;
        vertical-align: middle;
        font-size: 11pt; 
      }
      #imageSub2 div.whitebg2 {
        z-index: 4;
        background-color: #584D48;
        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";
        filter: alpha(opacity=90);
        opacity: 0.9;
      }

      #imageSub2 div.label2 {
        z-index: 5;
        color: white;
}


.google a {

color:#ECECE7;
font-family: "ConduitITC-Light", "Gill Sans MT", Calibri, sans-serif;
text-decoration: none;
font-size: 9pt;
}

.google a:hover {
text-decoration: underline;
}



h2 {
text-decoration:none; 
font-size: 28px;
color: #A59F9C;
font-weight: lighter;
margin-top: 7px;
}

h1 a {
text-decoration:none; 
font-weight: lighter;
font-size: 22px;
color: #ADAAA0;
}

.left{
position: absolute;
top: 0px;
left: 0px;
text-align: left;
}

.left2{
  margin-left: 25px;
}

.left3{
  margin-left: 100px;
}


.right{
  position: absolute;
  top: 0px;
  right: 0px;
}

.right a {  padding-right: 0 !important;}


p.credits1 {  font-family:"ConduitITC-Light";
font-size: 15px;
color: #ADAAA0;
letter-spacing:1px;
}

p.credits2 {  font-family:"ConduitITC-Light";
font-size: 15px;
color: #ADAAA0;
letter-spacing:1px;
margin-top: 8px;
}

.sousm {  border-bottom: 1px dotted #938C88; }
.sousm ul {
padding: 0;  
margin: 0;
margin-top: 10px;
margin-bottom: 10px;

}

.sousm ul li {list-style: none}

.sousm ul li a{
font-family:"ConduitITC-Light";
font-size: 15px;
color: #ADAAA0;
text-decoration: none;
letter-spacing:1px;
}

.sousm ul li a:hover{
color: #7B7975;
 
}

p.txtnous{
font-family:"ConduitITC-Light";
font-size: 10pt;
color: #8E8681;
text-decoration:none; 
text-align: justify;
line-height: 12pt;
padding-left: 15px;
padding-right: 15px;

}

p.txtnous3{
font-family:"ConduitITC-Light";
font-size: 11pt;
color: #8E8681;
text-decoration:none; 
text-align: justify;
line-height: 12pt;

}


p.media{
text-align: center;
}

a.media{
font-family:"ConduitITC-Light";
font-size: 11pt;
color: #8E8681;
text-decoration: none; 
line-height: 12pt;
padding-left: 15px;
padding-right: 15px;
letter-spacing:2px
}

a.media:hover{
font-family:"ConduitITC-Light";
font-size: 11pt;
color: #8E8681;
text-decoration:underline; 
line-height: 12pt;
padding-left: 15px;
padding-right: 15px;
letter-spacing:2px
}



p.txtserv{
font-family:"ConduitITC-Light";
font-size: 11pt;
color: #8E8681;
text-decoration:none; 
text-align: left;
line-height: 15pt;
margin-top:-20px;
padding-bottom: 10px;
width: 500px;
border-bottom: 1px dotted #938C88;

}

#contact{
width:400px;
border-top: 1px dotted #938C88;

}

#services{
width:500px;
border-top: 1px dotted #938C88;
padding-top: 5px;

}

#nous{
width:604px;

}

#blocsous{
height: 220px;
width:auto; 
display:block;
}

#blocline{
width:959px;
height: 2px;
position:relative;
display:block;
float:left;
border-bottom: 1px dotted #938C88;
margin-top: 15px;
}

#blocsous h2{
font-size: 22px;
color: #A59F9C;
font-weight: lighter;
}

#bloc1{
width:359px;
height: 220px;
position:relative;
display:block;
float:left;
border-right: 1px dotted #938C88;
margin-top: 25px;
}
#bloc2{
width:300px;
height: 220px;
position:relative;
display:block;
float:left;
border-right: 1px dotted #938C88;
margin-top: 25px;

}
#bloc3{
width:300px;
height: 220px;
position:relative;
display:block;
float:left;
margin-top: 25px;

}


     #imageSub { position: relative;  }
      #imageSub img { z-index: 1; }
      #imageSub div {
        position: absolute;
        right: 0px;
        top: 0px;
              }
     #imageSubnous { position: relative;  }
      #imageSubnous img { z-index: 1; }
      #imageSubnous div {
        position: absolute;
        right: 0px;
        top: 0px;
              }

@-webkit-keyframes cf4FadeInOut {
     0% {
       opacity:1;
     }
     17% {
       opacity:1;
     }
     25% {
       opacity:0;
     }
     92% {
       opacity:0;
     }
     100% {
       opacity:1;
     }
	}

	@-moz-keyframes cf4FadeInOut {
	 0% {
       opacity:1;
     }
     17% {
       opacity:1;
     }
     25% {
       opacity:0;
     }
     92% {
       opacity:0;
     }
     100% {
       opacity:1;
     }
	}

	@-o-keyframes cf4FadeInOut {
	 0% {
       opacity:1;
     }
     17% {
       opacity:1;
     }
     25% {
       opacity:0;
     }
     92% {
       opacity:0;
     }
     100% {
       opacity:1;
     }
	}

	@keyframes cf4FadeInOut {
	 0% {
       opacity:1;
     }
     17% {
       opacity:1;
     }
     25% {
       opacity:0;
     }
     92% {
       opacity:0;
     }
     100% {
       opacity:1;
     }
	}

	#imageSub {
		position:relative;
		height:281px;
		width:450px;
		margin:0 auto;
	}
	#imageSub img {
		position:absolute;
		left:0;
	}

	#imageSub img {
		-webkit-animation-name: cf4FadeInOut;
		-webkit-animation-timing-function: ease-in-out;
		-webkit-animation-iteration-count: infinite;
		-webkit-animation-duration: 24s;

		-moz-animation-name: cf4FadeInOut;
		-moz-animation-timing-function: ease-in-out;
		-moz-animation-iteration-count: infinite;
		-moz-animation-duration: 24s;

		-o-animation-name: cf4FadeInOut;
		-o-animation-timing-function: ease-in-out;
		-o-animation-iteration-count: infinite;
		-o-animation-duration: 24s;

		animation-name: cf4FadeInOut;
		animation-timing-function: ease-in-out;
		animation-iteration-count: infinite;
		animation-duration: 24s;
	}
    #imageSub img:nth-of-type(1) {
		-webkit-animation-delay: 18s;
		-moz-animation-delay: 18s;
		-o-animation-delay: 18s;
		animation-delay: 18s;
    }
    #imageSub img:nth-of-type(2) {
		-webkit-animation-delay: 12s;
		-moz-animation-delay: 12s;
		-o-animation-delay: 12s;
		animation-delay: 12s;
    }
    #imageSub img:nth-of-type(3) {
		-webkit-animation-delay: 6s;
		-moz-animation-delay: 6s;
		-o-animation-delay: 6s;
		animation-delay: 6s;
    }
    #imageSub img:nth-of-type(4) {
		-webkit-animation-delay: 0;
		-moz-animation-delay: 0;
		-o-animation-delay: 0;
		animation-delay: 0;
    }
    
	#imageSubnous {
		position:relative;
		height:250px;
		width:959px;
		margin:0 auto;
	}
	#imageSubnous img {
		position:absolute;
		left:0;
	}

	#imageSubnous img {
		-webkit-animation-name: cf4FadeInOut;
		-webkit-animation-timing-function: ease-in-out;
		-webkit-animation-iteration-count: infinite;
		-webkit-animation-duration: 24s;

		-moz-animation-name: cf4FadeInOut;
		-moz-animation-timing-function: ease-in-out;
		-moz-animation-iteration-count: infinite;
		-moz-animation-duration: 24s;

		-o-animation-name: cf4FadeInOut;
		-o-animation-timing-function: ease-in-out;
		-o-animation-iteration-count: infinite;
		-o-animation-duration: 24s;

		animation-name: cf4FadeInOut;
		animation-timing-function: ease-in-out;
		animation-iteration-count: infinite;
		animation-duration: 24s;
	}
    #imageSubnous img:nth-of-type(1) {
		-webkit-animation-delay: 18s;
		-moz-animation-delay: 18s;
		-o-animation-delay: 18s;
		animation-delay: 18s;
    }
    #imageSubnous img:nth-of-type(2) {
		-webkit-animation-delay: 12s;
		-moz-animation-delay: 12s;
		-o-animation-delay: 12s;
		animation-delay: 12s;
    }
    #imageSubnous img:nth-of-type(3) {
		-webkit-animation-delay: 6s;
		-moz-animation-delay: 6s;
		-o-animation-delay: 6s;
		animation-delay: 6s;
    }
    #imageSubnous img:nth-of-type(4) {
		-webkit-animation-delay: 0;
		-moz-animation-delay: 0;
		-o-animation-delay: 0;
		animation-delay: 0;
    }
    

.black_overlay{
			display: none;
			position: absolute;
			top: 0%;
			left: 0%;
			width: 100%;
			height: 100%;
			background-color: black;
			z-index:1001;
			-moz-opacity: 0.8;
			opacity:.80;
			filter: alpha(opacity=80);
		}
		.white_content {
			display: none;
			position: absolute;
			top: 25%;
			left: 15%;
			width: 70%;
			height: 27%;
			padding: 3px;
			background-color: white;
			z-index:1002;
			overflow: auto;
		}

.clear, .clearTitre{
	display: none;
}

.clearFloat{clear:both;}

div.portfolio ul{
margin-left: -15px;
  margin-right: auto ;
	list-style-type: none;
}

div.portfolio ul li{
	float: left;
	padding-left: 7px;
}
    