/*
 Theme Name:   Divi Child
 Theme URI:    http://elegantthemes.com/
 Description:  Divi Child Theme
 Author:       ElegantThemes
 Author URI:   http://elegantthemes.com
 Template:     Divi
 Version:      0.1.1
 License:      GNU General Public License v2 or later
 License URI:  http://www.gnu.org/licenses/gpl-2.0.html
 Tags: responsive-layout, one-column, two-columns, three-columns, four-columns, left-sidebar, right-sidebar, custom-background, custom-colors, featured-images, full-width-template, post-formats, rtl-language-support, theme-options, threaded-comments, translation-ready
 Text Domain:  divi-child-theme
*/

/* ==== Add your own styles below this line ====
 * -------------------------------------------- */
/* On ajuste le menu */
@media (max-width: 1300px)and (min-width: 981px){
#et_top_search{right: -40px; position: absolute !important;}
}

/* On met en forme le menu */
#main-header #et-top-navigation #top-menu li a:hover{
  color: #2ea3f2;
}
 header#main-header #top-menu a{
    transition: none !important;
}
header#main-header #top-menu li li a:hover{
    background-color: transparent !important;
}
#main-header ul#top-menu li a{
padding-bottom: 0px !important;
}
#main-header ul#top-menu li {
padding-bottom: 38px !important;
}
#main-header ul.sub-menu {
width: 470px!important;
}
#main-header ul.sub-menu li a {
width: 450px !important;
}
#main-header ul#top-menu li li {
    padding-bottom: 5px !important
}
#page-container #main-header ul.sub-menu {
width: 510px!important;
}
#page-container #main-header ul.sub-menu li a {
width: 500px!important;
}
body #page-container #main-header .resourcessub li a {
    width: 100% !important;
    max-width: 100% !important;
}
body #page-container #main-header .resourcessub .sub-menu{
    width: 410px !important;
    max-width: 410px !important;}

/*On règle le menu pour le téléphone*/
@media all and (max-width: 600px) {
#page-container #main-header ul.sub-menu,
body #page-container #main-header .resourcessub .sub-menu{
    width: auto!important;
}
#page-container #main-header ul.sub-menu li a {
    width: 100%!important;
}
}

/*On mets les commentaires à gauche*/
.et_pb_comments_module .comment .children {
    margin-left: 0;
}
#page-container{
overflow:hidden!important;
}

/*On remonte et on baisse le plugin monarch dans les articles*/
.et_pb_post_content .et_social_inline {
	margin-top:-30px!important;
	margin-bottom:-20px !important;
}
.single-post .et_social_inline_bottom{
  margin-top: 15px !important;
}

/*effet zoom sur les ronds bleu dans les articles*/
.effetzoomrondbleu-articles .widget_media_image:hover img,
.effetzoomrondbleu-articles widget_media_image:hover img,
.effetzoomrondbleu-articles a:hover img {
transform: scale(1.2) !important;
transition: all 0.2s 0s ease !important;
cursor: pointer !important;
}
.effetzoomrondbleu-articles,
.effetzoomrondbleu-articles a {
overflow: hidden !important;
}
.effetzoomrondbleu-articleswidg .widget_media_image,
.effetzoomrondbleu-articles .widget_media_image,
.effetzoomrondbleu-articles a img {
transition: all 0.2s 0s ease !important;
}
.effetzoomrondbleu-articles .widget_media_image img.image {
width: 144px !important;
}

/*On affiche la boite ombre bleu dessous la zone de saisie commentaire sur iphone*/
input[type=text],
input[type=email],
input[type=password],
textarea {
  -webkit-appearance: none;
}

/*On mets en forme la zone commentaire des articles*/
section#comment-wrap {
    display: grid !important;
}
ol.commentlist.clearfix {
    order: 3 !important;
}
h2#comments {
    order: 2 !important;
}
div#respond {
    order: 1 !important;}
form#commentform {
    display: grid !important;
}
p.comment-form-author {
    order: 1 !important;
}
p.comment-form-email {
    order: 2 !important;
}
p.form-submit {
    order: 4 !important;
}
p.comment-form-comment {
    order: 3 !important;
}
p.comment-notes {
    display: none !important;
}
p.comment-form-cookies-consent {
    order: 4 !important;
}
h3#reply-title {
    margin-bottom: 25px !important;
}

@media only screen and (min-width: 980px) {
.commentlist .comment_avatar img.avatar.avatar-80.photo.wpfla {
    width: 100px !important;
    
}
.commentlist .comment_postinfo {
    left: 20px !important;
    position: relative;
}
.commentlist .comment_area {
  left: 20px !important;
  position: relative;
}
}

@media only screen and (max-width: 980px) {
.commentlist .comment_avatar img.avatar.avatar-80.photo.wpfla {
    width: 100px !important;
    }
.commentlist .comment_postinfo {
    left: 20px !important;
    position: relative;
}
.commentlist .comment_area {
  left: 20px !important;
  position: relative;
}
}
@media screen and (max-width:767px) {
#comment-wrap ol.commentlist, #comment-wrap .comment-form {
	max-width:100% !important;
}	
}

@media all and (max-width: 980px){
.et_pb_comments_module #comment-wrap{
	    display: flex !important;
    justify-content: center;
    flex-direction: column;
}

.et_pb_comments_module div#respond{
	    display: flex;
    flex-direction: column;
    align-items: center;
}

.et_pb_comments_module h2#comments{
    text-align: center;}
}
@media only screen and (max-width: 980px){
.commentlist .comment_area {
    left: 0!important;
    position: relative;
	}
.comment-body {
    padding: 0;
}
.comment-body .comment_avatar {		   position: relative;
float: left;
}
	.commentlist .comment_postinfo {
    left: 0!important;
}
	.comment_avatar img {
    max-width: 80%;
}
}

/*On regle les etoile de kk star rating*/
.single-post .kk-star-ratings.kksr-valign-bottom.kksr-align-center {
    margin-top: 0px!important;
	margin-bottom:0!important;
    padding-bottom: 2px!important;
    padding-top: 20px!important;
    background: #222323!important;
}
.page .kk-star-ratings.kksr-valign-bottom.kksr-align-center {
	margin-top: 0px;
	padding-bottom: 2px;
    padding-top: 20px;
    background: #222323;
}
.kk-star-ratings .kksr-legend {
   	color: #ffffff;
}

@media all and (min-width:981px){
.et_pb_section.et_pb_section_0_tb_footer.et_pb_with_background.et_section_regular {
    padding-top: 0px;
}}

/* On supprime le champ "site web"*/
.comment-form-url{
	display:none;
}

/*bouton bleu avec effet zoom*/
.custom-button{
	background: #2daae1!important;
    border-radius: 30px;
    color: #fff!important;
    border: none !important;
	padding:10px 10px;
    line-height: 1.7em !important;
	font-size: 20px !important;
	display: inline-block;
	float: none;
	margin: 10px;
	transition: transform .2s;
}
#custom-button1-hover:hover, .custom-button-hover:hover, a.et_pb_button.custom-button:hover {
padding: 10px 10px;
-webkit-transform: scale(1.15);/* Ch <36, Saf 5.1+, iOS < 9.2,
 An =<4.4.4 */ 
 -ms-transform: scale(1.15); /* IE 9 */
 transform: scale(1.15); /* IE 10, Fx 16+, Op 12.1+ */
}
a.et_pb_button.custom-button:hover {
    transition: 0.2s ease !important;
}
@media only screen and (max-width:480px){
	.custom-button{
		margin-top: 10px !important;
	}
}

/* Classe Bouton bleu Brillant */
.shiny {
	background: #2CAAE1;
	border-radius: 30px;
	box-shadow: 0 0 5px 0 rgba(5, 135, 200);
  	animation: pulse 2s infinite;
	color:#fff;	
	text-transform:uppercase;
	border:none;
}
.shiny:hover {
	background-color: #2CAAE1 !important;
	animation: none;
	transform: scale(1.1);
	border:none !important;
}
.shiny:hover:after {
	display:none;
}
@keyframes pulse {
    0% {
		box-shadow:0px 0px 5px 0px rgba(5, 135, 200)
    }

    50% {
        box-shadow:0px 0px 5px 5px rgba(5, 135, 200)
    }

    100% {
        box-shadow:0px 0px 5px 0px rgba(5, 135, 200)
    }
}
