/* GLOBAL - Font --------------------------------------------------------------------------------------------------------------------*/
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6
{
    /* Monserrat font source : https://fonts.googleapis.com/css?family=Montserrat */
	/* /templates/purity_iii/tpls/blocks/head.php [Line 41] */
	font-family: 'Montserrat',"Helvetica Neue",Helvetica,Arial,sans-serif !important;
}

h1{font-weight: 800;}

@media screen and (max-width: 525px){ h3{ font-size:22px; } }

.logo-image a
{	
    background: transparent !important;
}

img.logo-img
{
    max-width: 200px !important;	/* Original value : 160px */
    max-height: 69px !important;
}

#t4-topbar{ display: none !important; } /* Hide the dark mode button */


/* Reduce the top menu height */
.t4-megamenu .navbar-nav > li > a, .t4-megamenu .navbar-nav > li > .nav-link { height: 40px !important; }  /* previous value : 80px */

.t4-header .header-wrap { min-height: 60px !important; }


/* Set the drop down menu background to black */
@media (min-width: 992px) { .dropdown-menu.level1.show, .dropdown-menu.level2.show {background: #000C; border-top-left-radius: 0px; border-top-right-radius: 0px; } }
@media (max-width: 991.98px) {	.dropdown-menu.level1.show, .dropdown-menu.level2.show {background: #0001;}  .nav-breakpoint-lg .t4-megamenu { background: #000C; 	}	.navbar-toggler {  color: #dee2e6; }}

.dropdown-menu.level1.show a { display: inline-block; } /* align left */

/* .t4-megamenu.animate.slide .dropdown.show.animating > .dropdown-menu */
/* { */
    /* background-color: #444444 !important; */
/* } */
/* .t4-megamenu.animate.slide .dropdown.show.animating > .dropdown-menu li */
/* { */
    /* border-top: 1px #515151 solid; */
    /* border-bottom: 1px #515151 solid; */
/* } */
/* .t4-megamenu.animate.slide .dropdown.show.animating > .dropdown-menu li a */
/* { */
	/* color: #eeeeee !important; */
/* } */


/* Hide 2nd menu on mobile verion */
#triggerButton { display: none !important;	}

/* set the back to top button color */
#back-to-top { background-color: #0077bb; }

/* top menu always visible */
/* @media (min-width: 992px) { */
	/* #t4-header */
	/* { */
		/* overflow: hidden; */
		/* position: fixed; */
		/* top: 0; */
		/* width: 100%; */
		/* z-index: 1000; */
	/* } */
/* } */

/* Add a shadow on the top menu */
#t4-header
{	
	box-shadow: 0px 5px 20px #000000aa;
	border-bottom: none !important;
	z-index:10;
}

/* Enable the stiky top menu on mobile version */
@media (max-width: 575.98px)
{
  .t4-sticky {
    position: sticky !important;
    top: 0 !important;
  }
} 



/* HOME PAGE - Background image -----------------------------------------------------------------------------------------------------*/
.t4-header
{	
	background-color: #0077bbAA !important;
}

body
{
	background-image: url(https://unmessagebienveillant.fr/images/wallpaper/soap-bubbles.jpg) !important;
	background-size: cover !important;
	background-position: center !important;
	background-attachment: fixed !important;
}

.t4-section .t4-section-inner { max-width: 1200px !important; }


/* HOMEPAGE - Intro -----------------------------------------------------------------------------------------------------------------*/
/* .row-feature .jumbotron */
.jumbotron
{
	padding: 0 20px !important;
}

.jumbotron p
{
	font-size: 28px !important;
}

/* .row-feature .jumbotron h1 */
.jumbotron h1
{
	font-style: italic;
	font-weight: normal;
}

/* .row-feature.row-feature-primary .jumbotron */
.jumbotron
{
    margin-top: 75px !important;
    margin-bottom: 50px !important;
}
/*.row-feature.row-feature-primary*/ .jumbotron p
{
	color: #292A2B !important;
}

/* .row-feature.row-feature-primary .jumbotron .btn-primary */
.jumbotron .btn-primary
{
    border-color: #fff !important;
    margin-top: 50px !important;
	border-radius: 30px !important;
	padding: 15px 40px !important;
}

.row-feature.row-feature-primary
{
    background: none !important;	
}
/* .page-masthead */
.t4-content { background: none !important;  }
.t4-breadcrumbs { background: #0077bb44 !important; padding-bottom: 50px !important;  }



/* HOMEPAGE - Blockquote -------------------------------------------------------------------------------------------------------------*/
/* source : https://codepen.io/jupago/pen/dwZKbM */

/* center the blockquote in the page */
.blockquote-wrapper
{
   display: flex !important;
   padding: 0 20px !important;
}

/* Blockquote main style */
.blockquote
{
    position: relative !important;
    font-family: 'Montserrat', sans-serif !important;
    font-weight: 800 !important;
    color: #ffffff !important;
    padding: 30px 0 !important;
    width: 100% !important;
    max-width: 500px !important;
    z-index: 1 !important;
    margin: 20px auto !important;
    align-self: center !important;
    border-top: solid 1px !important;
    border-bottom: solid 1px !important;
	margin-top: 50px !important;
}

/* Blockquote header */
.blockquote h1
{
    position: relative !important;
    color: #FFFFFF !important;
    font-size: 40px !important;
    font-weight: 800 !important;
    line-height: 1 !important;
    margin: 0 !important;
}

.colored
{
	color: #0077bbEE;
	text-shadow: 1px 1px #ccc;
}

/* Blockquote right double quotes */
.blockquote:after
{
    position: absolute !important;
    content: "”" !important;
    color: rgba(255, 255, 255, 1) !important;
    font-size: 10rem !important;
    line-height: 0 !important;
    bottom: -43px !important;
    right: 30px !important;
}

/* increase header size after 600px */
@media all and (min-width: 600px)
{
    .blockquote h1
	{
        font-size: 60px !important;
	}
}

/* Blockquote subheader */
.blockquote h4
{
    position: relative !important;
    color: #292a2b !important;
    font-size: 1.3rem !important;
    font-weight: 900 !important;
    line-height: 1 !important;
    margin: 0 !important;
    padding-top: 20px !important;
    z-index: 1 !important;
	
	float:right;
	padding-right:10%;
}


/* GLOBAL - Footer ------------------------------------------------------------------------------------------------------------------*/
.t4-footer small
{
    display: none !important;
}
.t4-footer .module small
{
    display: block !important;
}

.t3-copyright
{
	/* padding: 40px 0 80px; */
	padding: 40px 0;
}


/* PHOCA - Categories ---------------------------------------------------------------------------------------------------------------*/
.pg-category-box-title, 		/* categories view - image title */
.pg-item-box-info, 				/* category view - image title */
.pg-detail-top-box-back-title, 	/* item view - 'back to category' arrow */
.pg-detail-nav-box				/* item view - items navigation arrow */
{
	display: none !important;
}
.pg-category-box-label-new
{
	background: #0077bbAA;
}
.pg-category-box-label-hot
{
    background: #e02121AA;;
}

/* Hide the back button (to solve the pagination issue : 12 elements selected, but with the back button, the 12th element is on a new line */
#pg-msnr-container .pg-item-box:has(> a > div > svg.ph-si.ph-si-back-medium) { display: none !important; }

#pg-msnr-container > div > a > div > svg > use
{	
	color: #0077bb88 !important;
}
#pg-msnr-container > div > a > div > svg > use:hover
{	
	color: #0077bb !important;
}

@media screen and (min-width: 992px)
{
	.page-masthead .row-feature
	{
		padding: 50px 0 !important;		/* initial value : 100px */
	}
}

.pg-detail-item-image-box .social_icon
{
	padding:20px;
	/* margin: 20px; */
	/* background-color: #FFFFFF55; */
	cursor:pointer;
	
	margin: 0px;
	background-color: none;
	box-shadow:none;
}

.pg-detail-item-image-box #gender_selector_div, .pg-detail-item-image-box #random_selector_div
{
	padding-top: 15px;
	font-size: 22px;
    font-weight: 900;
}
.pg-detail-item-image-box #gender_selector_label, .pg-detail-item-image-box #random_selector_label
{
	margin-right: 5px;
}

.pg-detail-item-image-box .kindness_switch
{
	vertical-align: middle;
}

@media screen and (max-width: 400px)
{
	.pg-detail-item-image-box #gender_selector_div, .pg-detail-item-image-box #random_selector_div{ font-size: 18px; }
}

.pg-detail-item-image-box #gender_selector_div input:checked + .slider
{
    background-color: #0077bb;
}

.pg-detail-item-image-box #random_selector_div input:checked + .slider
{
    background-color: #ff33cc;
}

#phocagallery .quota-notice
{
	width:100%;
	float:left;
	text-align:justify;
	margin-top:20px;
}

/* Hide Page X/Y */
#phocagallery .pagination .counter
{
	display: none !important;
}

/* Center Pagination (Start) */
/* #phocagallery .pagination-centered */
/* { */
	/* width: 100% !important; */
/* } */

/* #phocagallery .pagination */
/* { */
	/* display: flex !important; */
    /* margin: 20px auto !important; */
/* } */

.com_phocagallery .pagination
{
    align-items: center;
    justify-content: center;
}
/* Center Pagination (End) */

/* #phocagallery .pagination li.page-item */
/* { */
    /* background-color: #ffffff; */
    /* border: 1px solid #dddddd; */
/* } */
/* #phocagallery .pagination li.active.page-item */
/* { */
	/* color: #ffffff; */
	/* background-color: #0077bb; */
	/* border: 1px solid #0077bb; */
/* } */


.pagination .page-item .page-link{ background-color: #ffffff; color: var(--t4-pagination-color); font-weight: 800; }
.pagination .active.page-item .page-link{ background-color: var(--t4-pagination-active-color); color: #ffffff; font-weight: 800; }

#overquota-img
{
	border-radius: 0  !important;
    box-shadow: none !important;
	max-height:25px;
	vertical-align: text-bottom;
}

#process_step_2 input:not([type=radio]):not([type=checkbox]),
#process_step_2 #send_button,
.backlink h3
{
	width: 100% !important;
    margin: 8px 0 !important;
    display: inline-block !important;
    border: 1px solid #ccc !important;
    box-shadow: inset 0 1px 3px #ddd !important;
    border-radius: 4px !important;
    -webkit-box-sizing: border-box !important;
    -moz-box-sizing: border-box !important;
    box-sizing: border-box !important;
    padding: 20px 30px !important;
 	
	font-family: 'Montserrat',"Helvetica Neue",Helvetica,Arial,sans-serif !important;
	font-size: 24px !important;
    font-weight: 600 !important;
	color: #0077bb !important;
}

#process_step_2 .warn_me_label
{
	cursor: pointer;
    float: left;
    margin-top: 15px;
    margin-bottom: 15px;
    margin-right: 20px;
}
#process_step_2 input#warn_me
{
	width: 30px !important;
	margin-left : 5px !important;
	margin-right: 5px !important;
	border: none !important;
	box-shadow: none !important;
}

#process_step_2 #username_div
{
	display: flex !important;
}
#process_step_2 #username_div button#show_tip
{
	margin: 8px 0 !important;
	border-radius: 0.5rem;
    border-bottom-right-radius: 0;
    border-top-right-radius: 0;
    background: #cccccc;
    border: 1px solid #cccccc;	
	font-size: 25px;
}
#process_step_2 #username_div button#show_tip:hover
{
	color: #FFF;
    border: 1px solid #0077bbEE;	
	background: #0077bbEE;
}
#process_step_2 #username_div input[type=text]
{
    border-bottom-left-radius: 0 !important;
    border-top-left-radius: 0 !important;
    margin-left: -1px;	
}

#process_step_2 .rgpd-reminder
{
	font-weight: 700;
}

#overquota-notice
{
	font-size: 18px !important;
	text-align: justify;
	padding: 20px;
	background-color: #f0818488;
    margin-top: 20px;
	box-shadow: 2px 2px;
}

#overquota-notice .row_1{ font-weight: 800; margin-bottom: 10px;}

@media screen and (max-width: 450px)
{
	#process_step_2 input:not([type=radio])
	{
		font-size: 20px !important;
		padding: 15px 15px !important;
	}
}

@media screen and (max-width: 350px)
{
	#process_step_2 input:not([type=radio])
	{
		font-size: 16px !important;
		padding: 10px 10px !important;
	}
}

#process_step_2 input[type=radio]
{
	margin: 0px 10px;
}


#process_step_2 #send_button,
.backlink h3
{
	text-align: center !important;
	cursor:pointer !important;
	background-color: #FFF5 !important;
}

#process_step_2 #send_button:active,
.backlink h3:active
{
	color: #FFFFFF !important;
	background-color: #0077bb44 !important;
}

.backlink h3
{
	margin-bottom: 30px !important;
}
.backlink:hover
{
	text-decoration: none;
}

@media screen and (max-width: 750px)
{
	#process_step_2 input,
	#process_step_2 #send_button
	{
		font-size: 16px !important;
		padding: 15px !important;
	}
}

@media screen and (max-width: 600px)
{
	#process_step_2 input,
	#process_step_2 #send_button
	{
		font-size: 14px !important;
		padding: 10px !important;
	}
}

@media screen and (max-width: 450px)
{
	#process_step_2 input,
	#process_step_2 #send_button
	{
		font-size: 12px !important;
		padding: 5px !important;
	}
}

#process_step_2 .error_label
{
	font-family: 'Montserrat',"Helvetica Neue",Helvetica,Arial,sans-serif !important;
	font-size: 24px !important;
    font-weight: 600 !important;
	text-align: left !important;
	color: red !important;
}





/* Customized bootstrap */
@media screen and (max-width: 767px)
{
	.social_icon.col-xs-6
	{
		width: 33.33333333%;
	}
}
@media screen and (max-width: 575px)
{
	.social_icon.col-xs-6
	{
		width: 50%;
	}
}

/* Social network autocomplete input */
.autocomplete-items
{
	position: absolute;
	border: none;
	z-index: 99;
	left: 0;
	right: 0;

	width: 100% !important;
	padding: 0px 30px !important;
}
.autocomplete-items div
{
	padding: 10px;
	cursor: pointer;
	background-color: #fff;
	border-bottom: 1px solid #d4d4d4;
}
.autocomplete-active
{
	background-color: #0077bb !important;
	color: #ffffff;
}


/* Message Sent ---------------------------------------------------------------------------------------------------------------------*/
/* .row-feature .jumbotron .embedded_message */
.jumbotron .embedded_message
{
	text-align: center !important;
	margin-bottom: 20px !important;
}

.fb_iframe_widget iframe {background: #FFF !important;}
iframe.instagram-media {margin: 0 auto !important;}
#permalink{display: none;}

.mastodon-post{border:5px #8C8DFF solid; padding: 50px; font-size: 50px; font-weight:900;}

.twitter-tweet{ margin: 0 auto !important; }


/* Login page -----------------------------------------------------------------------------------------------------------------------*/
.login-wrap{background-color: #fff6; padding: 100px 20px;}


/* Articles -------------------------------------------------------------------------------------------------------------------------*/
.kindness-article{background-color: #fff6; padding: 40px; text-align: justify !important;}
.desc-article .paragraph, .desc-article .line-spacing{ margin-bottom: 15px !important; text-align: justify !important; }
.desc-article h1, .desc-article h3, .desc-article h4{ text-align: left; }
.desc-article .intro{ margin-bottom: 40px; }
.desc-article .kindness-privacy-notice{ margin-top: 50px; background-color: /*#66ff6644*/ #1112; padding: 10px 20px 15px 20px; font-size: 17px;}
.desc-article .kindness-privacy-notice .fa-lightbulb-o{ font-size:28px; color: #ffe680; margin-right:10px; }
.desc-article a{ cursor: pointer; }
.desc-article .colored{ 	color: #0077bbEE; font-weight: 800; }
.desc-article .btn-actions{ margin-top: 25px; margin-bottom: 25px; }

/* Add some space before a h3 title in an article, and remove the space after */
.desc-article .paragraph:has(legend):has(h3){ margin-top: 40px !important ;margin-bottom: 0px !important; }

.page-header h2{ color: #444444; font-weight: 800; text-align: left; }
.paragraph legend{ display: block; width: 100%; margin-bottom: 20px; font-size: 21px; line-height: inherit; color: #444444; border: 0; border-bottom: 1px solid #e5e5e5; }

.desc-article .important, .paragraph .important{ font-weight: 900; color: #0077bb; }
/* .desc-article li{ margin: 5px 0px; list-style-type: none; } */
/* .desc-article li .fa{ margin-right: 10px; } */

.desc-article .sub-chapter{ padding-left: 25px; }

.desc-article .kindness-anchor, .desc-article .kindness-anchor:hover{ color: #444444; cursor: default; text-decoration: none}

.sitename{ font-weight: 900; color: #0077bb; }

#t4-footnav{ display: none !important; }
#t4-footer .kindness-links{}
#t4-footer .kindness-copyright{ text-align:right;}

@media screen and (max-width: 739px)
{
	#t4-footer .kindness-links,	#t4-footer .kindness-copyright{ margin-bottom: 5px; text-align:center; width:100% !important;}
}

@media screen and (min-width: 740px) { #t4-footer .col-lg-7, #t4-footer .col-lg-5{ float: left !important; } }  

#t4-footer .container {  max-width: 100% !important; }


.moduletable { border: none !important; }
.item-page.layout-default.no-sidebar .top-article-info { max-width: 100% !important; }

h4 #download-message, h4 #personal-data{ color: var(--headings-color) !important; }
#selectPostMethodForm a{ color: var(--footer-link-color) !important;}


/* Confirmation popup ---------------------------------------------------------------------------------------------------------------*/
#dialog h3, #dialog h4, #dialog h5{ color: #FFFFFF !important;  }


/* Social Networks Footer -----------------------------------------------------------------------------------------------------------*/
#follow-us, #context-icons
{
	padding-top: 20px;
	text-align: center;
}
#follow-us img
{
	max-height: 25px;
	margin: 0 5px;
}
#context-icons img
{
	max-height: 35px;
	margin: 0 5px;
}
#follow-us .hr-title, #context-icons .hr-title
{
  display: table;
  white-space: nowrap;
  text-align: center;
  margin-bottom:5px;
}        
#follow-us .hr-title:before, #follow-us .hr-title:after,
#context-icons .hr-title:before, #context-icons .hr-title:after
{
  content: "";
  display: table-cell;
  width: 35px;
  background: url(data:image/gif;base64,R0lGODlhAQABAIAAAAUEBAAAACwAAAAAAQABAAACAkQBADs=) repeat-x left center;
}



@media screen and (min-width: 710px) and (max-width: 1199px)
{
	#follow-us{padding-top: 40px;}
}

/* Handle Social Networks -----------------------------------------------------------------------------------------------------------*/
@media screen and (max-width: 370px)
{
	#handle-social-networks .col-xs-6{padding-right: 10px; padding-left: 10px;}
}

/* (admin) article edition links hidde */
.item-page .article-aside{display : none;}


/* Admin actions div ----------------------------------------------------------------------------------------------------------------*/
#admin-action
{
	margin-top: 20px;
	padding: 20px;
	background-color: #c2cb6c;
    box-shadow: 5px 5px;
}
#admin-action .fa
{
	margin-right: 15px;
}
#admin-action a
{
	cursor:pointer;
}
#admin-action .error_label
{
    font-weight: 600 !important;
	color: red !important;
}
#admin-action .success_label
{
    font-weight: 600 !important;
	color: green !important;
}


/* Deferred sending -----------------------------------------------------------------------------------------------------------------*/

/* Reduce the warn_me and error_label font size on small devices */
@media screen and (max-width: 525px){ #warn_me_title, #process_step_2 .error_label{ font-size:22px !important; } }
@media screen and (max-width: 492px){ #warn_me_title, #process_step_2 .error_label{ font-size:20px !important; } }
@media screen and (max-width: 458px){ #warn_me_title, #process_step_2 .error_label{ font-size:18px !important; } }
@media screen and (max-width: 368px){ #warn_me_title, #process_step_2 .error_label{ font-size:14px !important; } }

#warn_me_title.colored
{
	font-weight: bold;
}


/* Sliders --------------------------------------------------------------------------------------------------------------------------*/
.kindness_switch 
{
  position: relative;
  display: inline-block;
  width: 60px;
  height: 34px;
}

.kindness_switch input
{ 
  opacity: 0;
  width: 0;
  height: 0;
}

.kindness_switch .slider
{
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ccc;
  -webkit-transition: .4s;
  transition: .4s;
}

.kindness_switch .slider:before
{
  position: absolute;
  content: "";
  height: 26px;
  width: 26px;
  left: 4px;
  bottom: 4px;
  background-color: white;
  -webkit-transition: .4s;
  transition: .4s;
}

.kindness_switch input.available:checked + .slider
{
  background-color: #0077bb;
}

.kindness_switch input.available:focus + .slider
{
  box-shadow: 0 0 1px #0077bb;
}

.kindness_switch input.displayed:checked + .slider
{
  background-color: #00e68a;
}

.kindness_switch input.displayed:focus + .slider
{
  box-shadow: 0 0 1px #00e68a;
}

.kindness_switch input:checked + .slider:before
{
  -webkit-transform: translateX(26px);
  -ms-transform: translateX(26px);
  transform: translateX(26px);
}

/* Rounded sliders */
.kindness_switch .slider.round { border-radius: 34px; }
.kindness_switch .slider.round:before { border-radius: 50%; }






.TBD
{
	font-size:24px;
	color:red;
	background-color: #e9a55544;
	padding:20px;
	border: 1px red solid;
}