/*
 *
 *	
 	cssHomeSwipper.css
 	> styles de la page home et du diparama swiper 
 */



.titleHome{
	padding-top: 25%;
	padding-left: 6%;
	
}

.categoryHome{
	font-family: 'din-condensed-web';
	color:white;
	font-size: 25px;
	text-transform: uppercase;
	background-color: rgba(0, 0, 0, 0.65);
	display: inline !important;
	padding: 10px !important;
	
}


.mainCourseTitle,
.contentTitle{
	font-family: 'ronnia';
	font-style: italic;
	font-weight: 600;
	color:white;
	font-size: 50px;
	display: inline-block !important;
	background-color: rgba(0, 0, 0, 0.65);
	padding: 0px 10px 10px 10px;
	margin-top: 7px;
	margin-left: 20px;
}


.mainCourseTitle{
	padding-top: 20%;
/* 	font-size: 40px; */
}
.contentTitle{
	padding: 0px;
	font-size: 70px;
	font-style:italic;
	background-color: transparent;
	text-shadow: 3px 3px 2px rgba(0, 0, 0, 0.30);
	opacity: 0.98;
}

.contentTitleMini{
	font-family: 'din-condensed-web';
	text-transform: uppercase;
	font-weight: 600;
	color:white;
	font-size: 19px;
	top:0px;
	text-align: center;
	margin-top: 18px;
	}



.mainCourseTitle{
	position: absolute;
	
	z-index: 200;
/*
	font-size:65px;
	line-height: 70px;
*/
	background-color: transparent;
	text-shadow: 3px 3px 2px rgba(0, 0, 0, 0.20);
	opacity: 0.98;
}



.contentHomeSwiper{
	font-family: 'ronnia';
	display: inline-block;
	padding: 10px;
	background-color: rgba(255, 255, 255, 0.7);
	color: black;
}

.descriptionImage:before{
	
}
.descriptionImage{
	font-family: 'ronnia-italic';
	font-size: 13px;
	display: inline;
/* 	width: 210px; */
	max-width: 450px;
	line-height: 18px;
	position: absolute;
	margin-right: 10px;
	bottom:40px;
	color:black;
	background-color: rgba(255, 255, 255, 0.35);
	padding:4px ;
	padding-top: 6px;
	border-radius: 2px;
	margin: 5px 0px 0px 15px;
}


.vignetteTitre{
	font-family: 'din-condensed-web';
	font-size: 30px;
	line-height: 30px;
	text-transform: uppercase;
	color:white;
	padding: 5px;
}



/* Page Home colonnes et bandeaux */

.Colums{
	font-family: 'ronnia';
	clear: both;
	height:100px;
	color:black;
	margin-bottom: 20px;

}
.containerColumns{

}


.titleColum,
.bandeauHomeTitle{
	font-weight: 600;
	font-size: 30px;
	font-style: italic;
	text-align: center;
	margin-top: 20px;
	
}


.contentCol{
	margin-top: 8px;
	padding-bottom: 40px;
}



.introColumn{
	margin-bottom: 40px; 
	font-weight: 300;
	font-size: 20px;
	line-height: 30px;
	text-align: center;
	margin-left: auto;
	margin-right: auto;
}

.titreHomeColumn{
	display: inline-block;
	border:none;
	padding-right: 40px;
	border-top:solid 3px black;
	font-family: 'din-condensed-web';
	text-transform: uppercase;
	color: black;
	font-size: 26px;
	padding-top: 3px;
	margin-bottom: 0px;
}




/* bandeaux de la home */

.BandeauCourse{
	
}

.BandeauHome{
	width: 100%;
	height: 450px;
	background-position: center center;
	background-attachment:scroll;
	background-size: cover;
	background-repeat:no-repeat;
	background-attachment: fixed;
	overflow: hidden;
	
}

.bandeauHomeTitle{
	font-family: 'din-condensed-web';
	color: white;
	margin: 0px;
	background-color: rgba(0,0,0, 0.25);
	height: 120px;
	width: 120px;
	font-size: 21px;
	padding-top: 41px;
	border-radius: 70px;
	margin-top: 150px;
	border:solid 4px white;
	text-align: center;
	font-style:  normal;
	text-transform: uppercase;
	margin-left: auto;
	margin-right: auto;
/* 	box-shadow: 2px 2px 1px rgba(0, 0, 0, 0.20); */
	margin-bottom: 30px;
}
.bandeauPermalien{
	color: black;
	text-decoration: none;
	font-size: 14px;
}


.bandeauPermalien:hover{
	color: black;
	text-decoration: underline;
}

/* footer et liens des bandeaux */
.BandeauFooter{
	text-align: center;
}

.contentBandeauActif{
	display: inline-block;
	margin-left: auto;
	margin-right: auto;
}

.titlePicto{
	font-weight: 300;
	padding-bottom: 10px;
	margin-bottom: 10px;
	display: inline-block;
	width: 200px;
	border-bottom: solid 2px rgba(255, 255, 255, 1);
}

.pictoHome{
	
}




/* Footer page home */

footer, footer a{
	font-family: 'ronnia';
	color: rgba(255, 255, 255, 0.63) !important;
	font-size: 12px;
	line-height: 18px;
}


/* Swiper */

.swiper-button-next,
.swiper-button-prev,
.swiper-button-white,
.swiper-button-black{
	z-index:12000 !important;
	margin-top: 60px;
	cursor: pointer;
	border: 2px solid white;
	border-width: 3px;
	width: 30px;
	height: 30px;
	border-radius: 125px;
	font-size: 18px !important;
}
.swiper-container {
	margin-top: 80px;
    width: 100%;
    height: 300px;
    margin-left: auto;
    margin-right: auto;
}
.swiper-slide {
    background-size: cover;
    background-position: center;
    cursor: pointer;
    color:white;
}

/**/
.gallery-top {
    height: 90%;
    width: 100%;
}

.gallery-thumbs {
    height: 60px;
    box-sizing: border-box;
    padding: 0px 1px 0px 0px 0px;
    margin-top: 1px;
}
.gallery-thumbs .swiper-slide {
    width: 25%;
    height: 100%;
    opacity: 0.6;
	  -webkit-filter:  grayscale(100%);
	  -moz-filter: grayscale(100%);
	  -ms-filter:  grayscale(100%);
	  -o-filter:  grayscale(100%);
	  filter:  grayscale(100%);
	  filter: url(grayscale.svg); /* Firefox 4+ */
	  filter: gray; /* IE 6-9 */
}
.gallery-thumbs .swiper-slide-active {
	opacity: 1;
    	  -webkit-filter:  grayscale(0%);
	  -moz-filter: grayscale(0%);
	  -ms-filter: grayscale(0%);
	  -o-filter: grayscale(0%);
	  filter:  grayscale(0%);
	  filter: url(grayscale.svg); /* Firefox 4+ */
	  filter: gray; /* IE 6-9 */
;
}


.swiper-pagination-bullet {
        width: 10px;
        height: 10px;
        text-align: center;
        line-height: 20px;
        font-size: 12px;
        color:white;
        opacity: 1;
        background: rgb(255) !important;
        opacity: 0.5 !important;
    }
.swiper-pagination-bullet-active {
        color:black;
        background: white;
         opacity: 1.0;
    }