/*********************** BOITE JAUNE PROMO DELF ********************************/

.BannerBlock{					/* Block global de la bannière */
    background-color:#FFCF40;
	color:#333;
    padding:35px;
    display:flex;
    flex-direction:row;
    border-radius: 10px;
	margin-bottom: 20px;
}

.TitleBannerBlock{					/* Titre de la bannière */
    font-size:30px;
    font-weight: 800;
    line-height:1.2;
    display:flex;
    flex-direction:row;
}

.TextBannerBlock{					/* Texte sous le titre de la bannière */
    font-size:22px;
    font-weight: 500;
    line-height:1.5;
    margin-bottom:25px;
}

.ButtonCTABannerBlock{					/* Block qui contient le bouton de la bannière */
    display:flex;
    flex-direction:row;
}

.CTABannerBlock{						/* Bouton de la bannière */
    background: #f96f33;
    color: #fff;
    border-color: #f96f33;
    border-radius: 5px;
    padding: 8px 20px 8px 20px;
    font-size: 20px;
    font-weight: 600;
}

.CTABannerBlock:hover{						/* Hover de : Bouton de la bannière */
    background: #fff;
    color: #f96f33;
}

.ContImgBannerBlock{					/* Block qui contient l'image de la bannière */
    margin-left:10px;
    display:flex;
    justify-content: center;
    align-items: center;
}

@media only screen and (max-width: 960px){  /*  ----- TABLETTE*  ----- */ 

    .BannerBlock{					/* Block global de la bannière */
        flex-direction:column-reverse;
        padding:20px;
    }
    
    .TitleBannerBlock{					/* Titre de la bannière */
	    text-align:center;
	    font-size:32px;
	    font-weight:700;
	    margin-bottom:25px;
	}
	
	.TextBannerBlock{					/* Texte sous le titre de la bannière */
        margin:0 7px 0 7px;
        font-size:23px;
        text-align:center;
	}
	
    .ImgBannerBlock{					/* Image de la bannière */
        padding-bottom:20px;
        width:40%;
    }
    
    .ButtonCTABannerBlock{					/* Block qui contient le bouton de la bannière */
        justify-content: center;
        margin:25px 0 8px 0!important;
    }
}

@media only screen and (max-width: 767px){  /* ----- TELEPHONE ----- */ 

    .BannerBlock{					/* Block global de la bannière */
        border-radius: 7px;
    }
	
	.ContImgBannerBlock{					/* Block qui contient l'image de la bannière */
        margin-left:0;
	}
    
    .ImgBannerBlock{					/* Image de la bannière */
        width:55%;
    }
    
    .CTABannerBlock{						/* Bouton de la bannière */
        border-radius: 3px;
    }
}

/*********************** BOITE BLEU PROMO PRONONCIATION ********************************/


.BannerBlockPrononciation{					/* Block global de la bannière */
    background: rgb(44,90,116);
    background: radial-gradient(circle, rgba(44,90,116,1) 0%, rgba(27,58,74,1) 100%);
	color:#fff;
}

.TitleBannerBlockPrononciation{					/* Titre de la bannière */
    font-size:36px;
}

@media only screen and (max-width: 960px){  /*  ----- TABLETTE*  ----- */ 

	.TitleBannerBlockPrononciation{					/* Titre de la bannière */
		justify-content: center;
		font-weight:800;
	}

}


/*********************** BOITE PROMO COURS FRANCAIS CLASSIQUES ********************************/


.BannerBlockCoursFrancaisClassic{					/* Block global de la bannière */
    background: #F1EBE2;
	color:#000;
}

.TitleBannerBlockCoursFrancaisClassic{					/* Titre de la bannière */
    font-size:34px;
}

.TextBannerBlockCoursFrancaisClassic{					/* Texte sous le titre de la bannière */
    font-size:20px;
}

.CTABannerBlockCoursFrancaisClassic:hover{						/* Hover de : Bouton de la bannière */
    background: #000;
    color: #fff;
}

.ContImgBannerBlockCoursFrancaisClassic{
    margin-left: 20px;
}

@media only screen and (max-width: 960px){  /*  ----- TABLETTE*  ----- */ 

	.TitleBannerBlockCoursFrancaisClassic{					/* Titre de la bannière */
		justify-content: center;
		font-weight:800;
	}
	
	.ContImgBannerBlockCoursFrancaisClassic{					/* Texte sous le titre de la bannière */
        margin-left:0px;
    }

}



/*********************** BOITE PROMO COURS FRANCAIS PRO ********************************/


.BannerBlockCoursFrancaisPro{					/* Block global de la bannière */
    background-color: #f9f9f9;
	color: #414141;
    margin-right: 15px;
    box-shadow: 5px 5px 11px 0px #d5d5d5;
}

.ContentBannerBlockCoursFrancaisPro{					/* Block content de la bannière */
    max-width: 70%;
}

.TextBannerBlockCoursFrancaisPro{					/* Texte sous le titre de la bannière */
    font-size:20px;
    line-height:1.7;
    margin-right: 35px;
}

.CTABannerBlockCoursFrancaisPro{						/* Bouton de la bannière */
    font-size: 21px;
    font-weight: 800;
}

.CTABannerBlockCoursFrancaisPro:hover{						/* Hover de : Bouton de la bannière */
    background: #333;
    color: #fff
}


@media only screen and (max-width: 960px){  /*  ----- TABLETTE*  ----- */ 

	.TitleBannerBlockCoursFrancaisPro{					/* Titre de la bannière */
		justify-content: center;
		font-weight:800;
	}
	
	.ContImgBannerBlockCoursFrancaisPro{					/* Texte sous le titre de la bannière */
        margin-left:0px;
    }

}