/* ==========================================================================
   Author's custom styles
   ========================================================================== */
html {
    -webkit-text-size-adjust: none; /* 2 */
    -ms-text-size-adjust: 100%; /* 2 */
}

body {
	padding-bottom:0;
	background:#F3F3F3;
} 

hr {
	
	margin: 6% 0 6% 0;
}

#global {
	min-height: 728px;
	width:100%;
	margin:0; padding:0;
} 
select {
	
	font-family: Arial, Helvetica, sans-serif !important;	
}
h1.brand {
	line-height:20px;	
	margin:0;
}
h1.brand a {
	color: #999;	
}
h1.brand a:hover {
	color: #FFF;
	text-decoration: none;	
}

img.img-center {
	margin-left: auto;
	margin-right: auto;
	display: block;
}

#main {
	min-height: 500px;	
}
#navigation {
	color: #FAFAFA;
	height:100%;	
}
#navigation .my-logo {
	/* background-color:#343434;*/
	margin:0; 
	padding:0; 
}
#navigation .my-logo img {
	 max-width: 260px;
	 width:100%;
	 
	}
#navigation .my-content-bottom {
	background-color: #343434;
	padding: 10px  20px 20px 20px;
	/* color: #79C306; */
}
#navigation h3, #navigation h2 {
	font-weight:normal;
	font-size:22px;
	line-height:30px;
	border-bottom: 1px solid #666;		
}
#navigation .my-link {
	color: #FAFAFA;
}
#navigation .my-link:hover {
	text-decoration: none;
}
#navigation nav {
margin-top:0px;		
}
#navigation nav .active {
	background-image:url(images/fleche-8x10.gif);
	background-repeat: no-repeat;
	background-position: 5px 5px;
}
#navigation section {
margin-top:50px;		
}
#navigation nav ul, #navigation nav li {
	list-style:none;
	margin:0;
	padding:0;	
}
#navigation nav li {
	padding-left: 20px;	
}

#navigation nav li:hover {
	background-color: #5F5F5F;	
}
#navigation nav li.active:hover {
	
	background-color: #343434;	
}

#navigation nav a {
	font-size:16px;
	color: #FAFAFA
}
#navigation nav a:hover {
	text-decoration: none;
}
#navigation aside {
	margin-top:0;		
}

#navigation aside a {
	color:#999;	
}
#navigation aside a:hover {
	color:#FFF;
	text-decoration:none;	
}



#content {
	/*  15/11/14 */
	background-image:url(images/fond-content.gif);
	background-position:bottom;
	background-repeat:repeat-x;
}


/* slider */
#my-slider {
	 left:0;
	 margin:0; 
	 max-width: 760px;
	 padding:0;
	 position:relative;
	 top:0;
	 width: 100%;
	 z-index:10;
}
#my-slider-cache {
	diplay:block;
	left:0;top:0;
	position:relative;	
	z-index:12;
}

#my-slider-image {
    /* image 684 x 444 */
	display:block;
	border:none !important;
	outline: none !important;
	left:5%;
	outline:1px solid blue;
	position: absolute !important;
	top:8.19%;
	width:90%;
	z-index:11;
	 
	}
	/* slider
	#content .my-slider {
		background-image: url(images/fond-slider.gif);
		background-repeat:repeat-x; 
	}
	#my-image-slider {
	 width: 680px;
	 height: 430px;
	 margin: 40px 40px 40px 40px;
	}
	#my-cache-slider {
	 width: 760px;
	 height: 77px;
	}
 */


#content .my-content-bottom {
	background-color:#FFF;
	padding: 0px  5.263% 5.263% 5.263% ; 
}
#content h2 {
		color: #495968;
		font-size:30px; 
		line-height: 1.15em;
		margin-top:0;	
	}
#content h3 {
	color: #495968;
	font-size:24px;
	line-height: 1.15em;
	margin-top:30px;
	margin-bottom:10px;	
}
#content .my-span h3 { margin-top:0; }
#content .my-intro {
	font-size: 22px;
	line-height: 1.15em;
	font-style: italic;		
}

#global-footer {
	background-color:#E5E5E5;
	padding-top:30px;
	height: auto;	
} 
#footer {
	padding-bottom: 50px;	
}
#footer p {
	text-align:center;
	color: #727272;		
}
#footer a {
	color: #727272;	
}


.my-visible-large-display { display: none !important ; }
.my-visible-small-display { display: none; }
.my-nowrap { white-space: nowrap }
.my-show { background-color: #CCC;}


/* my grid 2 */
.my-row, .quatre-l-show-row {
	width: 646px;/*626 + 20*/
	margin: 0;
	padding: 0;
	margin-left: -20px;
}

.quatre-l-show-row {
	margin-left: 0px !important;
	margin-top: 8%;
	margin-bottom: 10%;
}

.my-row:before,.quatre-l-show-row:before,
.my-row:after,.quatre-l-show-row:after {
  display: table;
  line-height: 0;
  content: "";
}
.my-row:after,.quatre-l-show-row:after {
  clear: both;
}
.my-span {
	width: 303px;
	margin:0;
	margin-top:30px;
	padding:0;
	margin-left: 20px;	
}

.my-span img {
	width: 100%;
	max-width:400px;
	margin:0 auto;
}

.my-no-margin-top {
	margin-top:0 !important;	
}

/* tableaux */
.dans-la-course table thead tr th {
	text-align:center;
	background-color:#343434;
	color: #FFF;
}
.dans-la-course table tbody tr td:nth-child(1) {
	white-space:nowrap;
}
.my-nowrap{
	white-space: nowrap;
    overflow:hidden;
	-o-text-overflow: ellipsis;
	-ms-text-overflow:ellipsis;
	text-overflow:ellipsis;
}

@media (max-width: 767px) { 
	#footer {
		padding-bottom: 20px;	
	}
	#content h2 {
		font-size:22px;	
	}
	#content h3 {
		font-size:16px;	
	}
	#content .my-intro {
		font-size: 16px;		
	}

}
@media (max-width: 979px) { 
	.my-visible-small-display { 
		font-size: 0.6em;
		display: inline; 
	}
	#navigation nav li {
		margin-bottom: 3px;	
	}
	#navigation .my-content-bottom {
		padding: 10px  10px 20px 8px ; 
	}
	#navigation nav li {
		padding-left: 10px;	
	}
	#navigation nav a {
		font-size:15px;
			
	}
	#navigation nav .active {
		background-position: 0px 5px;
	}
			/* my grid 2 */
	.my-row, .quatre-l-show-row {
		width: 100%;
		margin-left:0;
	}
	.my-span {
		width: 100%;
		margin-top: 10px;
		margin-left: 0;
		float:none;	
	}
	
}
@media (min-width: 768px) {

	
}
@media (min-width: 768px) and (max-width: 979px) { 
	body {
		padding-bottom:0;
		background:#F3F3F3 url(images/fond-page-1200.jpg) no-repeat top center;
	}
	#navigation nav li {
		padding-left: 15px;	
	}
	#content .my-content-bottom{
		min-height:1080px;	
	}

}
@media (min-width: 980px) and (max-width: 1199px) { 
	body {
		padding-bottom:0;
		background:#F3F3F3 url(images/fond-page-1200.jpg) no-repeat top center;
	}
	#content .my-content-bottom{
		min-height: 850px;	
	}
	
	.my-gallery5 .portrait {
        width: 18% !important;
    }
	

}
@media (min-width: 1200px) {
	body {
		padding-bottom:0;
		background:#F3F3F3 url(images/fond-page-1920.jpg) no-repeat top center;
	}
	#global {
		min-height: 728px;
	}
	#content .my-content-bottom{
		min-height: 800px;
	}

	
	#navigation .my-logo {
		background-color: transparent !important; 
	}
	
	/* slider */
	#my-slider {
		/*background-image: url(images/slider-fond.gif);
		background-repeat:repeat-x; */
	}
	#my-slider-image {
	 /*width: 760px;
	 height: 470px;
	 margin: 5%  0 0 0;*/
	}
	#my-slider-cache {
	 width: 760px;
	 /* height: 77px; */
	}
	#my-slider-haut {
		width: 760px;
	 	height: 45px;
	}
	
		
	.visible-large-display { display: block !important; }
	.container, .navbar-static-top .container, 
	.navbar-fixed-top .container, .navbar-fixed-bottom 	.container  {
		width: 1040px;
	}
	.row {
		margin-left:-20px;
	}
	#navigation { /*.span4  */
		margin-left:20px;
		width: 260px;
	}
	#content {/* .span8 */
		margin-left:20px;
		width: 760px;
	}
	.span12 {
		margin-left:20px;
		width: 1040px;
	}
	
	
	/* my grid 2 */
	.my-row, .quatre-l-show-row {
		width: 700px;/*680 + 20*/
	}


	.my-row:after, .quatre-l-show-row:after {
	  clear: both;
	}
	.my-span {
		width: 330px;	
	}
	
	.span-4l-ready-l {
		width: 160px;
		margin-top: 200px;
	}
	
	.span-4l-ready-r {
		width: 420px;
	}
			
}


/* form */
.form-horizontal .control-group {
margin-bottom: 15px;
}


label.valid {
	 /* width: 24px;
	  height: 24px;
	  background: url(../assets/img/valid.png) center center no-repeat;*/
	  display: inline-block;
	  text-indent: -9999px;
}
label.error {
		padding: 2px 8px;
		margin-top: 2px;
		display: inline;
		color: #B94A48;
}
/* gallery */
.my-gallery, .my-gallery2, .my-gallery3, .my-gallery4, .my-gallery5  {
	box-sizing: border-box;
	padding: 5px;
	width: 100%;
	background-color: #FFFDFD;
}
.my-gallery ul, .my-gallery2 ul, .my-gallery3 ul, .my-gallery4 ul, .my-gallery5 ul {
    width:100%;
    text-align: center;
}
.my-gallery ul, .my-gallery li, .my-gallery2 ul, .my-gallery2 li, .my-gallery3 ul, .my-gallery3 li, .my-gallery4 ul, .my-gallery4 li, .my-gallery5 ul, .my-gallery5 li {
    box-sizing:border-box;
    margin: 0;
    padding: 1%;
}
.my-gallery li, .my-gallery2 li,  .my-gallery3 li, .my-gallery4 li, .my-gallery5 li {
    list-style: none;
    display: inline-block;
	margin: 3% 0% 0% 0%;
    width: 49%;
    /*vertical-align: middle;*/

}

.my-gallery4 li {	
	width: 24%;
}

.my-gallery img, .my-gallery2 img, .my-gallery3 img, .my-gallery4 img, .my-gallery5 img    {
    width:100%;
   /* min-width:70px;*/
    margin:0; padding:0;
}

.span-4l-ready-l {
    	width: 160px;
    	margin-top: 25%;
	}

@media (min-width: 768px) and (max-width: 979px) {
    .my-gallery li{
        width: 49%;
    }
	
	.my-gallery .depart1 {
        width: 30% !important;
    }
	
	.my-gallery .depart2 {
        width: 68% !important;
    }
	
	.my-gallery3 li{
        width: 32%;
    }
	
	 .my-gallery2 li{
        width: 60%;
    }
	
	.my-gallery4 li{
        width: 24%;
    }
	
	.my-gallery5 .portrait {
        width: 18% !important;
    }
	
	
}

@media (max-width: 767px) {
    .my-gallery li{
        width: 49%;
    }
	
	.my-gallery .depart1 {
        width: 30% !important;
    }
	
	.my-gallery .depart2 {
        width: 68% !important;
    }
	
	.my-gallery3 li{
        width: 32%;
    }
	
	.my-gallery2 li{
        width: 60%;
    }
	
	.my-gallery4 li{
        width: 43%;
    }
	
	.span-4l-ready-l{
		display:none;	
	}
	
	.span-4l-ready-r{
		text-align:center;	
	}
	
	.my-gallery5 .portrait {
        width: 18% !important;
    }
	
	
}

@media (min-width: 1200px) {
     .my-gallery li{
         width: 49%;
     }
	
	.my-gallery li{
         width: 49%;
     }
	
	.my-gallery .depart1 {
        width: 30% !important;
    }
	
	.my-gallery5 li {
        margin: 1% 0 0 0;
    }
	
	.my-gallery5 .portrait {
        width: 18% !important;
    }
	
	.my-gallery5 .land200 {
        width: 38% !important;
    }
	
	.my-gallery5 .land180 {
        width: 32% !important;
    }
	
	.my-gallery5 .land150 {
        width: 30% !important;
    }
	
	.my-gallery .depart2 {
        width: 68% !important;
    }
	
	.my-gallery .depart2 img {
        margin-top: 30px;
    }
	
	.my-gallery5 .land200 img {
        margin-bottom: 10px;
    }
	 
	 .my-gallery3 li{
        width: 32%;
    }
	
	.my-gallery2 li{
        width: 60%;
    }
	
	
}



