
/***************************************************************
			Structure des pages
***************************************************************/

@font-face{ font-family: 'usuziv2-webfont'; src: url('../font/usuziv2-webfont.eot'); src: url('../font/usuziv2-webfont.eot?#iefix') format('embedded-opentype'), url('../font/usuziv2-webfont.woff') format('woff'), url('../font/usuziv2-webfont.ttf') format('truetype'), url('../font/usuziv2-webfont.svg#webfont') format('svg'); }

@font-face {
    font-family: 'ProximaNovaBold';
    src: url('../font/proximanova-bold-webfont.eot');
    src: url('../font/proximanova-bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('../font/proximanova-bold-webfont.woff') format('woff'),
         url('../font/proximanova-bold-webfont.ttf') format('truetype'),
         url('../font/proximanova-bold-webfont.svg#ProximaNovaBold') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'ProximaNovaLight';
    src: url('../font/proximanova-light-webfont.eot');
    src: url('../font/proximanova-light-webfont.eot?#iefix') format('embedded-opentype'),
         url('../font/proximanova-light-webfont.woff') format('woff'),
         url('../font/proximanova-light-webfont.ttf') format('truetype'),
         url('../font/proximanova-light-webfont.svg#ProximaNovaLight') format('svg');
    font-weight: normal;
    font-style: normal;

}
/*@font-face {
    font-family: 'DanielRegular';
    src: url('../font/daniel-webfont.eot');
    src: url('../font/daniel-webfont.eot?#iefix') format('embedded-opentype'),
         url('../font/daniel-webfont.woff') format('woff'),
         url('../font/daniel-webfont.ttf') format('truetype'),
         url('../font/daniel-webfont.svg#DanielRegular') format('svg');
    font-weight: normal;
    font-style: normal;

}
*/
@font-face {
    font-family: 'DanielBold';
    src: url('../font/danielbd-webfont.eot');
    src: url('../font/danielbd-webfont.eot?#iefix') format('embedded-opentype'),
         url('../font/danielbd-webfont.woff') format('woff'),
         url('../font/danielbd-webfont.ttf') format('truetype'),
         url('../font/danielbd-webfont.svg#DanielBold') format('svg');
    font-weight: normal;
    font-style: normal;

}

/*@font-face {
    font-family: 'DanielBlackRegular';
    src: url('../font/danielbk-webfont.eot');
    src: url('../font/danielbk-webfont.eot?#iefix') format('embedded-opentype'),
         url('../font/danielbk-webfont.woff') format('woff'),
         url('../font/danielbk-webfont.ttf') format('truetype'),
         url('../font/danielbk-webfont.svg#DanielBlackRegular') format('svg');
    font-weight: normal;
    font-style: normal;

}
*/

body{margin:auto;margin:0;
	font-size:16px;
	font-family:"ProximaNovaLight", sans-serif;
	color:#333333;
	background-color:#000000;

/*---------background---------------
	background-image: -webkit-gradient(linear, left top, left bottom, from(#6CA3D9), to(#3D5E81)); 
	background-image: -webkit-linear-gradient(top, #6CA3D9, #3D5E81);
	background-image:    -moz-linear-gradient(top, #6CA3D9, #3D5E81); 
	background-image:     -ms-linear-gradient(top, #6CA3D9, #3D5E81);
	background-image:      -o-linear-gradient(top, #6CA3D9, #3D5E81); 
	background-image:         linear-gradient(top, #6CA3D9, #3D5E81);
  	filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#6CA3D9', EndColorStr='#3D5E81');*/
	background-image:url(../../images/bg7.jpg);
	background-repeat:no-repeat;
	background-position:center top;
	background-attachment: fixed;

}
#loader { width:150px; height:150px;background-image:url('../../images/loader.gif'); background-repeat:no-repeat; position:absolute;}

#limitPage{margin:auto;width:1000px; margin-bottom:100px; overflow:hidden;}
/*header*/
#header{margin:auto;padding:0;border:0;height:100px;width:1000px;
/*---------shadow---------------
	box-shadow: 		0 2px 4px 0 #000; 
	-webkit-box-shadow: 0 2px 4px 0 #000;
	-moz-box-shadow: 	0 2px 4px 0 #000;
 */
 
}
#header #headerLogo{width:210px;height:103px;margin:0;padding:0;border:0;float:left;}
#headerRight{
	float:left;
	width:790px;
height:103px;
	background-image: url(../../images/bg_header.jpg);
}
#content{
	background-color:white;
	width:980px;
	padding:10px;
	margin:15px 0 0 0;
	clear: both; 
	overflow:hidden;
/*---------border---------------*/
	border-radius: 		    10px 10px 0 0; /* Opera10.5,IE9, Saf5, Chrome, FF4, iOS4, Android2.1+ */
	-webkit-border-radius: 	10px 10px 0 0; /* Saf3-4, iOS 1-3.2, Android <1.6 */
	-moz-border-radius: 	10px 10px 0 0; /* FF1-3.6 */
	/* useful if you don't want a bg color from leaking outside the border: */ 
	background-clip:  		 padding-box;
	-webkit-background-clip: padding-box;
	-moz-background-clip: 	 padding;
/*---------shadow---------------*/
	box-shadow: 		0 2px 4px 0 #000; 
	-webkit-box-shadow: 0 2px 4px 0 #000; 
	-moz-box-shadow: 	0 2px 4px 0 #000;

}
#footer{
	height:100px;
	width:1000px;
	margin:0;
	padding:0;
	clear:both;
	background:url(../../images/bg_footer.png); background-position: bottom;
	font-size:12px;
}
#footer #footer-container{
	padding-top:10px;
	text-align :center;
	font-weight:bolder;
	color:#FFF;
	height:52px;
/*---------background---------------*/
	background-image: -webkit-gradient(linear, left top, left bottom, from(#444444), to(#999999)); 
	background-image: -webkit-linear-gradient(top, #444444, #999999);
	background-image:    -moz-linear-gradient(top, #444444, #999999); 
	background-image:     -ms-linear-gradient(top, #444444, #999999);
	background-image:      -o-linear-gradient(top, #444444, #999999); 
	background-image:         linear-gradient(top, #444444, #999999);
  	filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#444444', EndColorStr='#999999');

/*---------border---------------*/
	border-radius: 		    0 0 8px 8px; 
	-webkit-border-radius: 	0 0 8px 8px;
	-moz-border-radius: 	0 0 8px 8px; 
}

#footer #footer-container a{
	color:#FFF;
}
/***************************************************************
			Menus de navigation
***************************************************************/

#menu{
	clear:both;
	width:1000px;
	height: 60px;
	background-color: transparent;
	font-family: 'DanielBold', sans-serif;
	font-size:20px;
	margin-top:20px;

/*---------background---------------
	background-image: -webkit-gradient(linear, left top, left bottom, from(#444444), to(#999999)); 
	background-image: -webkit-linear-gradient(top, #444444, #999999);
	background-image:    -moz-linear-gradient(top, #444444, #999999); 
	background-image:     -ms-linear-gradient(top, #444444, #999999);
	background-image:      -o-linear-gradient(top, #444444, #999999); 
	background-image:         linear-gradient(top, #444444, #999999);
  	filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#444444', EndColorStr='#999999');
  	-ms-filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#444444', EndColorStr='#999999');
*/
	
/*---------border---------------
	border-radius: 		    0 0 8px 8px; 
	-webkit-border-radius: 	0 0 8px 8px;
	-moz-border-radius: 	0 0 8px 8px; */
/*---------shadow---------------
	box-shadow: 		0 2px 4px 0 #AEB6C8; 
	-webkit-box-shadow: 0 2px 4px 0 #AEB6C8;  
	-moz-box-shadow: 	0 2px 4px 0 #AEB6C8; 
	*/ 
 }

#menu ul
	{ margin:0; padding-left:100px; list-style:none;
}
#menu ul li
	{
	float:left;
	width:auto;
	padding:12px;
	font-weight:bold;
/*	border-right-width: 1px;
	border-right-style: solid;
	border-right-color: #CCC;
*/
 color:#fff;

}
#menu ul li a
	{text-align:center; text-decoration:none;
		width:100%;
		height:100%;
 color:#fff;
 text-shadow: 5px 5px 5px #ccc;
filter: dropshadow(color=#ccc, offx=5, offy=5);
  }

#menu ul li:hover,#menu ul li a:hover
	{
	margin-top:2px;
	color:#D5E6FF;
}
#menu ul li.on, #menu ul li.on a
	{
	color:#D5E6FF;
}

#menu ul li#accueil
	{
	padding:10px;
	margin-left:5px;
}


/***************************************************************
			structure particuliere
***************************************************************/
.page_title { 

	font-family: 'usuziv2-webfont',serif;
    height: 80px;
    line-height: 80px;
    
    margin: 0 0 15px 0;
    padding: 0;
	font-size:40px;
	color:#999999;
	border-bottom:1px solid #E2001A;
	position:relative;


/*---------border---------------*/

	border-radius: 		    10px 10px 0 0; /* Opera10.5,IE9, Saf5, Chrome, FF4, iOS4, Android2.1+ */
	-webkit-border-radius: 	10px 10px 0 0; /* Saf3-4, iOS 1-3.2, Android <1.6 */
	-moz-border-radius: 	10px 10px 0 0; /* FF1-3.6 */
	/* useful if you don't want a bg color from leaking outside the border: */ 
	background-clip:  		 padding-box;
	-webkit-background-clip: padding-box;
	-moz-background-clip: 	 padding;
}
#Blocs {
    margin-top: 20px;
	margin-left:15px;
}
#section1{ position:relative; margin:0; padding:0; border:0;}
#section2{ position:relative;margin:0; padding:0; border:0;}
#section3{ position:relative;margin:0; padding:0; border:0;}

.Bloc {

    border: 5px solid #444444;
    cursor: pointer;
    float: left;
    height: 150px;
    margin-bottom: 15px;
    margin-right: 16px;
    padding: 10px;
    width: 276px;
	color: #fff;
  background-color: #444444;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#444444), to(#999999)); /* Saf4+, Chrome */
  background-image: -webkit-linear-gradient(top, #444444, #999999); /* Chrome 10+, Saf5.1+, iOS 5+ */
  background-image:    -moz-linear-gradient(top, #444444, #999999); /* FF3.6 */
  background-image:     -ms-linear-gradient(top, #444444, #999999); /* IE10 */
  background-image:      -o-linear-gradient(top, #444444, #999999); /* Opera 11.10+ */
  background-image:         linear-gradient(top, #444444, #999999);
            filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#444444', EndColorStr='#999999'); /* IE6-IE9 */

/*---------transition---------------*/
	-webkit-transition: all 0.6s ease-in-out ;
    -moz-transition: all 0.6s ease-in-out;
    -o-transition: all 0.6s ease-in-out;
	-ms-transition: all 0.6s ease-in-out;
    transition: all 0.6s ease-in-out;

}
.Bloc img {
    margin-right: 10px;
    width: 110px;
}
.Bloc:hover {

    border: 5px solid #AAAAAA;
}
.Bloc .title {
    margin: 0 0 15px 0;
    padding: 0;
	font-size:21px;
	color:#fff;
	border-bottom:1px solid #E2001A;
	font-family: 'ProximaNovaBold',serif;
}
.Bloc .subtitle {
	color: #FFF;
	font-size: 14px;
	margin: 0;
	padding: 0;
	text-align: left;
	line-height: normal;
}

.box_round {
  -webkit-border-radius: 8px; /* Saf3-4, iOS 1-3.2, Android <1.6 */
     -moz-border-radius: 8px; /* FF1-3.6 */
          border-radius: 8px; /* Opera 10.5, IE9, Saf5, Chrome, FF4, iOS 4, Android 2.1+ */
          
  /* useful if you don't want a bg color from leaking outside the border: */        
  -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box; 
}
.box_gradient {
  background-color: #444444;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#444444), to(#999999)); /* Saf4+, Chrome */
  background-image: -webkit-linear-gradient(top, #444444, #999999); /* Chrome 10+, Saf5.1+, iOS 5+ */
  background-image:    -moz-linear-gradient(top, #444444, #999999); /* FF3.6 */
  background-image:     -ms-linear-gradient(top, #444444, #999999); /* IE10 */
  background-image:      -o-linear-gradient(top, #444444, #999999); /* Opera 11.10+ */
  background-image:         linear-gradient(top, #444444, #999999);
            filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#444444', EndColorStr='#999999'); /* IE6-IE9 */
}
.box_gradient_inverse {
  background-color: #999999;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#999999), to(#444444)); /* Saf4+, Chrome */
  background-image: -webkit-linear-gradient(top, #999999, #444444); /* Chrome 10+, Saf5.1+, iOS 5+ */
  background-image:    -moz-linear-gradient(top, #999999, #444444); /* FF3.6 */
  background-image:     -ms-linear-gradient(top, #999999, #444444); /* IE10 */
  background-image:      -o-linear-gradient(top, #999999, #444444); /* Opera 11.10+ */
  background-image:         linear-gradient(top, #999999, #444444);
            filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#999999', EndColorStr='#444444'); /* IE6-IE9 */
}

.box_shadow {
  -webkit-box-shadow: 0 2px 10px 0 #000; /* Saf3-4 */
     -moz-box-shadow: 0 2px 10px 0 #000; /* FF3.5 - 3.6 */
          box-shadow: 0 2px 10px 0 #000; /* Opera 10.5, IE9, FF4+, Chrome 10+ */
}
.box_textshadow {
     text-shadow: 1px 1px 3px #000; /* FF3.5+, Opera 9+, Saf1+, Chrome, IE10 */
}
.box_rotate:hover {
  -webkit-transform: rotate(-5deg);  /* Saf3.1+, Chrome */
     -moz-transform: rotate(-5deg);  /* FF3.5+ */
      -ms-transform: rotate(-5deg);  /* IE9 */
       -o-transform: rotate(-5deg);  /* Opera 10.5 */
          transform: rotate(-5deg);  
}

.box_bounce:hover { 
/*    -webkit-transform: translate(0, -10px);
    -moz-transform: translate(0, -10px);
    -o-transform: translate(0, -10px);
    -ms-transform: translate(0, -10px);
    transform: translate(0, -10px);
*/
-moz-transform: scale(1.1) rotate(0deg) translate(0, -10px) skew(0deg, 0deg);
-webkit-transform: scale(1.1) rotate(0deg) translate(0, -10px) skew(0deg, 0deg);
-o-transform: scale(1.1) rotate(0deg) translate(0, -10px) skew(0deg, 0deg);
-ms-transform: scale(1.1) rotate(0deg) translate(0, -10px) skew(0deg, 0deg);
transform: scale(1.1) rotate(0deg) translate(0, -10px) skew(0deg, 0deg);	}

.box_slide:hover {
/*	-webkit-transform: translate(10px, 0);
    -moz-transform: translate(10px, 0);
    -o-transform: translate(10px, 0);
    -ms-transform: translate(10px, 0);
    transform: translate(10px, 0);
*/

-moz-transform: scale(1) rotate(0deg) translate(10px, 0) skew(-10deg, 0deg);
-webkit-transform: scale(1) rotate(0deg) translate(10px, 0) skew(-10deg, 0deg);
-o-transform: scale(1) rotate(0deg) translate(10px, 0) skew(-10deg, 0deg);
-ms-transform: scale(1) rotate(0deg) translate(10px, 0) skew(-10deg, 0deg);
transform: scale(1) rotate(0deg) translate(10px, 0) skew(-10deg, 0deg);}
/***************************************************************
			Styles communs
***************************************************************/
a:link{color:#000;text-decoration:none; }
a:visited{ color:#000;text-decoration:none;}
a:hover{color: #000;text-decoration:underline; }
.interligne { clear:both; }
h1 { padding:0; margin:10px 0 10px 0;}
h2 { padding:0; margin:10px 0 10px 0;}
h3 { padding:0; margin:10px 0 10px 0;}
h4 { padding:0; margin:0;}
h5 { padding:0; margin:0;}
h6 { padding:0; margin:0;}
.titre{
	font-size:20px;
	color:#C7321C;
	width:80%;
	font-weight: bold;
	
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #ccc;
}
.titre2{
	font-size:18px;
	color:#0E80A0;
	padding-left:20px;
}

.liste{
	list-style-image:url(../../images/boutonOk.gif);
}
.alert{
	background-color:#F30;
	width:1000px;
	height:50px;
	margin:auto;
}
.petit{ font-size:10px; color:#CCC;}

/***************************************************************
			page reference
***************************************************************/

#thumbs_list{overflow:hidden;float:left;width:380px;}
#thumbs_list ul{list-style-type:none;}
#thumbs_list li{float:left;cursor:pointer;width:100px;height:100px;margin:5px;}
#thumbs_list li img{width:100px;height:100px;border:0;-moz-border-radius:10px;-webkit-border-radius:10px;border-radius:10px;-webkit-box-shadow:1px 1px 12px #555;-moz-box-shadow:1px 1px 12px #555;box-shadow:1px 1px 12px #555;}
#columLeft{width:600px;float:left;}
#columRight{width:380px;float:right;}
/***************************************************************
	-webkit-transition: all 0.6s ease-in;
    -moz-transition: all 0.6s ease-in;
    -o-transition: all 0.6s ease-in;
    transition: all 0.6s ease-in;

***************************************************************/
/***************************************************************
			Les slides
***************************************************************/

#slideshow{
	margin:0 auto;
	width:640px;
	height:263px;
	position:relative;
	background-color: transparent;
	background-image: url(../../slides/img/bg_slideshow.jpg);
	background-repeat: no-repeat;
	background-position: 0 0;
}
#slideshow #slidesContainer{margin:0 auto;width:560px;height:263px;overflow:auto;position:relative;}
#slideshow #slidesContainer .slide{margin:0 auto;width:540px;height:263px;}
.control{display:block;width:39px;height:263px;text-indent:-10000px;position:absolute;cursor:pointer;}
#navDiapo{display:block;width:20px;height:20px;position:absolute;right:25px;bottom:10px;cursor:pointer;}
#leftControl{top:0;left:0;background:transparent url(../../slides/img/control_left.jpg) no-repeat 0 0;}
#rightControl{top:0;right:0;background:transparent url(../../slides/img/control_right.jpg) no-repeat 0 0;}
.slide{margin:0;padding:0;font:normal 11px Verdana, Geneva, sans-serif;color:#ccc;}
.slide a{color:#ccc;font-weight:bold;text-decoration:none;}
.slide a:hover{text-decoration:underline;}
.slide h2, .slide p{margin:8px 15px;}
.slide h2{font:italic 24px Georgia,"Times New Roman", Times, serif;color:#e9480b;letter-spacing:-1px;}
.slide img{float:left;margin:0 15px;}

/***************************************************************
			Diaporama
***************************************************************/
#diaporama{width:600px;height:334px;float:left;overflow:hidden;background-color:#000; background-color:transparent;border:1px solid #000;text-align:center;	
	 border-radius:       7px 0 0 7px;
	-moz-border-radius:   7px 0 0 7px;
	-khtml-border-radius: 7px 0 0 7px;
	-webkit-border-radius:7px 0 0 7px;
	}
.diapoImg{
		
opacity:1;
	-webkit-transition: opacity 0.6s ease-in;
    -moz-transition: opacity 0.6s ease-in;
    -o-transition: opacity 0.6s ease-in;
    transition: opacity 0.6s ease-in;
}
.diapoImg:hover, .diapoImg:focus{	
opacity:0.85;
}

ul.crossfade{padding:0;margin:0;list-style:none;position:relative;}
#fade li{position:absolute;top:0;left:0;width:600px;height:334px;background-color:#000;visibility:hidden;overflow:hidden;}
li img{display:block;}

/***************************************************************
			zone à droite du Diaporama
***************************************************************/

#zoneAccueilRight{
	width:370px;
	height:334px;
	float:left;
	overflow: auto;
	border:0;
	padding-left:5px;
	padding-right:1px;
	margin:0;
	border-top-width: 1px;
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-left-width: 0px;
	border-top-style: solid;
	border-right-style: solid;
	border-bottom-style: solid;
	border-left-style: solid;
	border-top-color: #000;
	border-right-color: #000;
	border-bottom-color: #000;
	border-left-color: #000;
	background-color:#DDDDDD;
	font-size:14px;

	
	border-radius:  0 7px 7px 0;
	-moz-border-radius: 0 7px 7px 0;
	-khtml-border-radius:0 7px 7px 0;
	-webkit-border-radius:0 7px 7px 0;
	
	-webkit-transition: background-color 0.6s ease-in;
    -moz-transition: background-color 0.6s ease-in;
    -o-transition: background-color 0.6s ease-in;
    transition: background-color 0.6s ease-in;

}
#zoneAccueilRight:hover, #zoneAccueilRight:focus{ background-color:#CCC; }
#zoneAccueilRight p{border:0; padding:0; margin:0;}
#zoneAccueilRight h2, #zoneAccueilRight h1{
	font-family: 'ProximaNovaBold',serif;
	font-size:21px;
	color:#C7321C;
	border-bottom:1px solid #E2001A;
	padding-left:21px;

}

#zoneAccueilRight .elt{
	padding-top:5px;
	padding-bottom:5px;
	font-weight:bold; 
	padding-left:21px;
}
#zoneAccueilRight .eltAccueil{
	font-weight:bold; 
	padding-left:21px;
	padding-top:4px;

}
#zoneAccueilRight ul{
	margin-bottom: 10px;
	margin-top:10px;}
.titreContact {
	color:#666;
	font-size:16px;
}
.ImgContact{
    border: 3px solid #444444;
	margin:0 2px 0 2px;
	
	-webkit-transition: all 0.6s ease-in;
    -moz-transition: all 0.6s ease-in;
    -o-transition: all 0.6s ease-in;
    transition: all 0.6s ease-in;
	
	}
.ImgContact:hover, .ImgContact:focus{
    border: 3px solid #AAAAAA
	}
	
/********************************************
			extras
***********************************************/	



/*
#box_bubble{
	width:100%;
	position:relative;
	
	}	
	
#box_bubble .bubble_200 {
    border-radius: 125px 125px 125px 125px;
    height: 250px;
    width: 250px;
	opacity: 0.8;
    -moz-transition: all 0.5s ease-in-out 0s;
	
}
#box_bubble .bubble_100 {
    border-radius: 100px 100px 100px 100px;
    height: 200px;
    width: 200px;
	opacity: 0.8;
}

#box_bubble .bubble_300:hover, #box_bubble .bubble_200:hover, #box_bubble .bubble_100:hover, #box_bubble .bubble_50:hover, #box_bubble .bubble_10:hover {
    opacity: 1;
}

#box_bubble .tuuning {
	background-attachment: scroll;
	background-color: transparent;
	background-image: url(../../images/hebergement_web.jpg);
	background-repeat: no-repeat;
	background-position: center top;
}


#startGallery {
    margin: 0 0 30px 2px;
    overflow: hidden;
    width: 872px;
}
#startGallery ul.start {
    list-style: none outside none;
}
#startGallery ul.start li {
    background: url("/_layout/media/bg_pattern_dark.gif") repeat scroll 0 0 transparent;
    float: left;
    height: 158px;
    margin: 0 4px 4px 0;
    width: 214px;
}
#startGallery img {
    border: medium none;
    margin: 0;
    outline: medium none;
    padding: 0;
}*/
