/*------------------------------------------------------*/
/*-------------------- GENERAL -------------------------*/
/*------------------------------------------------------*/
#blog {
	margin-top: 30px;
    padding-top: 50px;
}

	#blog p {
		margin: 30px 0;
	}

		#blog p:first-child {
			margin-top: 0px;
		}

.blogListingContainerExtrait img,
.blogDetailContainerExtrait img {
	width: 100% !important;
	height: initial !important;
}

.videoFrame {
	width: 100%;
	position: relative;
	height: 0;
	padding-top: 30px;
	padding-bottom: 50%;
	overflow: hidden;
}

	.videoFrame iframe {
		position: absolute;
		left: 0;
		top: 0;
		width: 100%;
		height: 100%;
	}

.blogColonneContenu {
	min-height: 1px;
	width: 620px;
	float: left;
}

.blogColonneContenu .btnEnregistrer {
    background: #73c538;
    border: 1px solid #73c538;
    line-height: 34px;
    text-decoration: none;
    color: #fff;
    padding: 9px 30px 9px 30px !important;
    text-transform: uppercase;
    font-family: 'Muli ExBold';
    font-size: 16px;
}

.blogColonneContenu .btnEnregistrer:hover
{
   border: 1px solid #73c538;
   background: #fff;
   color: #73c538;
}

.blogColonneContenu .btnSupprimer {
    background: #d75a5a;
    border: 1px solid #d75a5a;
    line-height: 34px;
    text-decoration: none;
    color: #fff;
    padding: 9px 30px 9px 30px !important;
    text-transform: uppercase;
    font-family: 'Muli ExBold';
    font-size: 16px;
}

.blogColonneContenu .btnSupprimer:hover
{
   border: 1px solid #d75a5a;
   background: #fff;
   color: #d75a5a;
}

.blogColonneContenu .btnAnnumer {
    background: #939393;
    border: 1px solid #939393;
    text-decoration: none;
    color: #fff;
    margin-left: 20px;
    float: right;
    padding: 9px 30px 9px 30px !important;
    text-transform: uppercase;
    font-family: 'Muli ExBold';
    font-size: 16px;
}

.blogColonneContenu .btnAnnumer:hover
{
   border: 1px solid #939393;
   background: #fff;
   color: #939393;
}

.blogColonneBlocs {
	min-height: 1px;
	float: right;
	width: 290px;
}

.lienArticlesBlog, .lienStudentDeconnexion {
    background-color: #686eed;
    border: 2px solid #686eed;
    box-sizing: border-box;
    font-family: Nexa;
    color: #fff;
    font-size: 18px;
    line-height: 45px;
    height: 45px;
    display: inline-block;
    width: 100%;
    text-decoration: none;
    position: relative;
    padding: 0px 20px 0px 53px;
    margin-bottom: 20px;
    -moz-transition: 0.2s all ease-out;
    -o-transition: 0.2s all ease-out;
    -webkit-transition: 0.2s all ease-out;
    transition: 0.2s all ease-out;
}

.lienArticlesBlog::before {
    content: "\e904";
    color: #fff;
    font-family: 'MEF';
    font-size: 25px;
    position: absolute;
    top: 0px;
    left: 15px;
}

.lienStudentDeconnexion::before {
    content: "\e9a6";
    color: #fff;
    font-family: 'boonIco2';
    font-size: 25px;
    position: absolute;
    top: 0px;
    left: 15px;
}


.lienArticlesBlog:hover, lienStudentDeconnexion:hover {
    color: #686eed;
    background-color: rgba(104, 110, 237, 0.00);
}

.lienArticlesBlog:hover:before {
    color: #686eed;
}

/*------------------------------------------------------*/
/*--------------------- FILTRE -------------------------*/
/*------------------------------------------------------*/

/*---------- Conteneur filtre actif --------*/
#panFiltre {
	text-transform: uppercase;
	border: 1px solid #ddd;
	padding: 3px 5px;
	margin-bottom: 30px;
	line-height: 20px;
}

	#panFiltre span {
		text-transform: capitalize;
	}

/*---------- Lien anunler filtre actif --------*/
.blogLienAnnulerFiltre {
	background: url(../images/filtre-close.png);
	text-transform: initial;
	display: inline-block;
	float: right;
	width: 20px;
	height: 20px;
	overflow: hidden;
}

	.blogLienAnnulerFiltre:hover {
		background-position: bottom;
	}


/*------------------------------------------------------*/
/*------------ PAGE LISTING ARTCILES BLOG ---------------*/
/*------------------------------------------------------*/

.blogListingTitreGrand {
    margin-bottom: 30px;
}

/*---------- Article mis en avant--------*/
.articleMisEnAvant {
	background: #f8f8f8 url(../images/blogMiseAvant.png) no-repeat top right;
}

/*---------- Conteneur de chaque article dans listing --------*/

.pageContentPanel {
    margin-top: 40px;
}

.blogListingContainerStudentArticle {
    width: 100%;
    margin: 15px;
    background: #ececec;
}

.blogStudentAdminTitre {
    margin-bottom: 12px;
    text-transform: uppercase;
    letter-spacing: 2px;
    font-weight: bold;
    font-size: 17px;
}

.blogStudentSectionAdmin:last-child .blogStudentAdminTitre
{
    border-top: 1px solid #ccc;
    padding: 20px 0 0 0;
}


.blogStudentSectionAdmin {
    padding: 0px 0px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px;
    background: #fff;
    margin-bottom: 40px;
    position: relative;
}

    .blogStudentSectionAdmin input[type="text"] {
        margin-bottom: 0px !important;
    }

    .blogStudentAdminImg {
        margin-bottom: 20px;
    }

        .blogStudentSectionAdmin .infoImage {
            margin-top: 10px;
        }

.blogStudentSectionAdmin #ctl00_cphPanColContenu_upGaleriePhotos .btnForm
{
    margin: 20px 0;
}

.blogListingContainerArticle {
    width: 280px;
    margin: 15px;
    background: #f4f4f4;
}

    .blogListingImage {
        width: 100%;
        height: auto;
        overflow: hidden;
    }

        .blogListingImage img {
            width: 100%;
            border: 1px solid #ececec!important;
            box-sizing: border-box;
        }

    .blogListingDesc {
        padding: 16px;
        position: relative;
    }

    .blogListingContainerCategories {
	    margin: 0px;
        position: absolute;
        top: -27px;
        left: 0px;
    }

        .blogListingContainerCategories a {
		    text-decoration: none;
		    display: inline-block;
		    margin-right: 3px;
            font-size: 13px;
		    padding: 6px 10px;
		    background: #73c538;
            border: 1px solid #73c538;
            color: #fff;
            transition: 0.2s all ease-out;
	    }

		    .blogListingContainerCategories a:hover {
			    color: #73c538;
                border: 1px solid #73c538;
			    background: #fff;
		    }

    .blogListingTitre {
        font-size: 18px;
        font-family: 'Muli ExBold';
        padding: 0px;
        margin-bottom: 10px;
        text-decoration: none;
        color: #393939;
        line-height: 20px; 
        margin: 0 0 10px 0;
        text-align: left; 
    }

        .blogListingTitre a {
            text-decoration: none;
        }

            .blogListingTitre a:hover {
                opacity: 0.7;
            }

    .blogListingContainerAuteur {
	    margin-bottom: 10px;
        text-align: left;
        line-height: 17px;
        color: #939393;
        font-size: 13px;
    }

        .blogDetailContainerAuteur {
	        margin-bottom: 15px;
            text-align: left;
            text-decoration: none;
            color: #939393;
            font-size: 13px;
        }

            .blogListingAuteur {
                display: none;
                color: #939393;
                font-size: 13px;
            }

        .blogDetailContainerFb {
	        float: right;
        }

        .blogListingDate {
            color: #939393;
            font-size: 13px;
        }

/*---------- Groupes --------*/
.blogListingContainerGroupes,
.blogDetailContainerGroupes {
	margin: 5px 0 10px 0;
	text-align: left;
}

	.blogListingContainerGroupes a,
	.blogDetailContainerGroupes a {
		text-decoration: none;
		display: inline-block;
		margin-right: 10px;
		padding: 2px 6px;
		background: #686eed;
		color: #fff;
	}

		.blogListingContainerGroupes a:hover,
		.blogDetailContainerGroupes a:hover {
			color: #fff;
			background: #686eed;
		}

/*---------- Extrait article dans listing --------*/
.blogListingContainerExtrait, .blogListingContainerExtrait p {
    font-family: 'Muli Light';
    font-size: 13px;
    line-height: 16px;
    text-align: left;
    margin-bottom: 0px !important;
}

    .blogListingContainerExtrait img {
        display: none;
    }

/*---------- Lire la suite --------*/

.blogListingContainerLire {
    text-align: left;
    display: inline-block;
    margin-top: 10px;
}

    .blogListingContainerLire a {
        color: #686eed;
        text-decoration: none;
        font-size: 15px;
        font-family: 'Muli ExBold';
    }

        .blogListingContainerLire a:before {
            content: '\f078';
            font-size: 18px;
            font-family: boonIco2;
            color: #686eed;
            margin-right: 7px;
            position: relative;
            top: 2px;
            -moz-transition: 0.2s all ease-out;
            -o-transition: 0.2s all ease-out;
            -webkit-transition: 0.2s all ease-out;
            transition: 0.2s all ease-out;
        }

        .blogListingContainerLire a:hover {
            color: #686eed;
        }

        .blogListingContainerLire a:hover:before {
            margin-right: 11px;
        }

/*---------- Tags --------*/
.blogListingContainerTags,
.blogDetailContainerTags {
	text-align: left;
	margin:10px 0 10px 0;
}

	.blogListingContainerTags a,
	.blogDetailContainerTags a {
		display: inline-block;
		padding: 2px 0px;
		text-decoration: none;
		margin-right: 8px;
		border-top: 1px solid rgba(104, 110, 237, 0.25);
	}

		.blogListingContainerTags a:hover,
		.blogDetailContainerTags a:hover {
			background: #ccc;
		}

/*---------- Commentaires --------*/
.blogListingContainerCommentaires {
	text-align: left;
	margin: 10px 0 0px 0;
}

	.blogListingContainerCommentaires a {
		color: #939393;
		text-decoration: none;
        font-size: 13px;
	}

		.blogListingContainerCommentaires a:hover {
			text-decoration: none;
		}

/*-----------------------------*/
/*--------- Blog Student ---------*/
/*-----------------------------*/



.blogStudent .blogColonneContenu {
    min-height: 1px;
    width: 100%;
    float: none;
}

.blogStudent .addArticle {
    margin-bottom: 10px;
    display: inline-block;
    width: 100%;
}

.blogStudent .addArticle a, .blogStudent .divDeconnexion a {
    width: 225px;
    float: right;
}

#ctl00_cphPanColContenu_upGaleriePhotos .btnForm {
    display:block;
}

.blogStudent .connexionColGauche {
    width: 100%;
    display: inline-block;
    padding-right: 0px;
    border-right: solid 0px #c9d4da;
    vertical-align: top;
    box-sizing: border-box;
    text-align: center;
}



/*------------------------------------------------------*/
/*----------------- DETAIL ARTICLE ---------------------*/
/*------------------------------------------------------*/

.blogDetailDescCt {
    width: 100%;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    text-align: center;
    padding: 30px 30px 15px 30px;
    border: 5px solid #ececec;
    position: relative;
}

    .blogDetailDescCt h1, .h1 {
        font-size: 30px;
        margin: 0 0 30px 0;
    }

    .blogDetailDescCt iframe {
        width:100%;
    }

    .blogDetailDescCt .h2blocBlog {
        border-top: 1px solid rgba(115, 197, 56, 0.31);
        padding-top: 15px;
    }


.blogDetailCommCt {
    box-sizing: border-box;
    padding: 30px 30px 10px 30px;
    margin-top: 25px;
    background: #f4f4f4;
}

.blogDetailCommCt .btnAjouterCommentaire {
    margin-bottom: 25px;
    height: 35px;
    line-height: 35px;
    font-size: 16px;
}

/*---------- Catégories --------*/


.blogDetailContainerCategories {
	margin: 0px 0 20px 0;
    text-align: left;
}

	.blogDetailContainerCategories a {
		text-decoration: none;
		display: inline-block;
		margin-right: 10px;
		padding: 7px 11px;
		background: #686eed;
        border: 1px solid rgba(104, 110, 237, 0.00);
        color: #fff;
        transition: 0.2s all ease-out;
	}

		.blogDetailContainerCategories a:hover {
			color: #686eed;
            border: 1px solid #686eed;
			background: #fff;
		}

.blogDetailContainerExtrait {
	font-size: 15px;
    font-family: 'Muli Light';
    color: #393939;
    line-height: 19px;
    text-align: justify;
    margin-bottom: 20px;
}

/*---------- Titre des articles liés --------*/
.blogDetailContainerArticlesLies, .blogDetailContainerFichiersLies, .blogDetailContainerGalerie {
	margin: 0 0 20px 0;
}

	.blogDetailContainerArticlesLies a, .blogDetailContainerFichiersLies a {
		display: block;
		color: #777 !important;
		text-decoration: none;
		padding: 10px 5px;
		border-top: 1px dotted #ccc;
	}

		.blogDetailContainerArticlesLies a:hover, .blogDetailContainerFichiersLies a:hover {
			color: #000;
			background: #fff;
		}

		.blogDetailContainerFichiersLies a:before {
			content: '\ea00';
			margin-right: 5px;
            font-family: boonIco2;
		}

        .blogDetailContainerArticlesLies a:before {
			content: '\f078';
			margin-right: 5px;
            font-family: boonIco2;
		}
/*----------- Galerie Photos -------------*/
.articleBlogGalerie {
	margin-right: 15px;
	margin-bottom: 15px;
    max-height: 130px;
}


/*---------- Commentaires --------*/
.blogDetailContainerCommentaires {
	margin-bottom: 30px;
}

#panAncreAjouterCommentaire {
	float: right;
	font-size: 11px;
}

	#panAncreAjouterCommentaire .icon-plus3:before {
		font-size: 10px;
		margin-right: 10px;
        vertical-align: unset;
	}

	#panAncreAjouterCommentaire .btn {
		margin: 0;
	}

#blogListingCommentaires {
	clear: both;
	margin: 30px 0;
}

    #blogListingCommentaires table tr {
        background-color: rgba(255, 255, 255, 0.00) !important;
    }

.blogContainerCommentaire {
	border-top: 1px solid #c3c3c3;
	padding: 30px 0px;
}


.blogCommentaireContainerOutils {
	height: 20px;
	float: none !important;
	text-align: left !important;
    margin-bottom: 3px;
}

.blogCommentaireUser {
	color: #373737;
	font-weight: bold;
	text-decoration: none;
	margin-right: 7px;
}

.blogCommentaireDate {
	font-style: italic;
	font-size: 12px;
	color: #8B8B8B;
	margin-right: 5px;
}

.adminBlogCommentaireTexte {
    font-size: 16px;
    font-family: 'Muli Light';
    color: #393939;
    line-height: 17px;
    text-align: justify;
}

.blogDetailAjouterCommentaireFormulaire {
}

.blogDetailAjouterCommentaireOutils {
	padding: 10px 0;
}


/*encart commentaires clos*/
.blogContainerCommentairesClos {
	text-align: center;
	font-size: 14px;
	border-top: 1px solid #EEEEEE;
	border-bottom: 1px solid #EEEEEE;
	padding: 5px 0;
}

.blogAncreAjouterCommentaire {
	display: inline-block;
	float: right;
}



/*encart connexion pour les commentaires*/
.blogContainerConnexion {
	text-align: center;
	font-size: 14px;
	border-top: 1px solid #EEEEEE;
	border-bottom: 1px solid #EEEEEE;
	padding: 5px 0;
}

	.blogContainerConnexion a {
		padding-left: 5px;
	}

		.blogContainerConnexion a:hover {
			text-decoration: none;
		}



/*------------------------------------------------------*/
/*------------------------ BLOCS -----------------------*/
/*------------------------------------------------------*/
.h3blocBlog {
	color: #000;
	font-size: 18px;
	font-weight: bold;
	padding: 0px 0 10px 0px;
	margin: 0 0 10px 0;
	text-decoration: none;
    display: inline-block;
}

.blocBlog a:link, .blocBlog a:visited, .blocBlog a:active {
	text-decoration: none;
	color: #939393;
}

.blocBlog a:hover {
	color: #000;
}

.blocCategories,
.blocPopulaire {
	margin-bottom: 30px !important;
}

    .blocCategories .h3blocBlog, .blocPopulaire .h3blocBlog {
        margin-bottom: 0px;
        padding-bottom: 5px;
    }

	.blocCategories a,
	.blocPopulaire a {
		display: block;
		color: #373737 !important;
		text-decoration: none;
		padding: 10px 5px;
        line-height: 17px;
		margin: 0 0 0px 0px;
		border-bottom: 1px solid rgba(195, 195, 195, 0.50);
	}

		.blocCategories a:hover,
		.blocPopulaire a:hover {
		}

		.blocCategories a:before,
		.blocPopulaire a:before {
			content: '\ea0f';
            position: relative;
            font-size: 10px;
			margin-right: 5px;
            font-family: boonIco2;
            transition: 0.2s all ease-out;
		}

        .blocCategories a:hover:before, .blocPopulaire a:hover:before {
			margin-right: 9px;
		}