/*
Theme Name: Weaver Xtreme Child
Theme URI: //weavertheme.com
Description: Bare minimum Weaver Xtreme Child demo theme
Author:       Consuljl.com
Author URI:   http://www.consuljl.com/
Version: 1.0
Tags: light, dark, white, black, gray, one-column, two-columns, three-columns, left-sidebar, right-sidebar, fixed-layout, fluid-layout, responsive-layout, custom-background, custom-colors, custom-header, custom-menu, editor-style, featured-image-header, featured-images, flexible-header, full-width-template,  post-formats, rtl-language-support, sticky-post, theme-options, threaded-comments, photoblogging
Template: weaver-xtreme


    This program is free software: you can redistribute it and/or modify
	it under the terms of the GNU General Public License as published by
	the Free Software Foundation, either version 2 of the License, or
	(at your option) any later version.

	This program is distributed in the hope that it will be useful,
	but WITHOUT ANY WARRANTY; without even the implied warranty of
	MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
	GNU General Public License for more details.

	You should have received a copy of the GNU General Public License
	along with this program.  If not, see <http://www.gnu.org/licenses/>.


About style.css:

Traditionally, a child theme provides its own style.css to override or extend the
parent style.css. This usually involved adding an "@import" to the child's style.css.

Weaver Xtreme handles the main style sheet differently. It is called "assets/css/style.weaverx.css",
and is loaded before the theme "style.css" file. Thus, there is no need to "@import" the
parent stylesheet.

So you can make overrides and extensions directly in this child style.css.

*/


/************************/


p {margin: 0 0 1em 0;}

h1,h2,h3,h4,h5,h6 {margin: 0 0 1em 0;}


body {}    /* Pour afficher une image et une couleur en même temps dans le background */ 

li.lang-item, li.lang-item-en {list-style-type: none !important;}		 /* Pour ne pas afficher la puce du sélecteur de langue dans la barre du menu  */

ul {padding-left: 4px;}     /* Pour contrôler les puces affichées dans les widgets */



li {margin-bottom: 0.3em;}	/* Pour mettre un peu d'espace entre les puces d'une liste */

.wvrx-menu * {margin-right: 1.0em;}      /* Pour appliquer également une marge de chaque côté des items du menu */

ul.wvrx-menu {margin-left: 0;}          /* Pour empêcher l'application d'une marge à gauche sur le menu par la CSS du thème */    

.widget-title {}			/* Pour modifier l'affichage des titres des widgets */

.titre_widget {font-size: 1.3em; border-bottom: solid 1px #FFFFFF; margin-bottom: 1em;}		/* Pour appliquer un style de titre dans un texte de Widget */


/*****

.lien_entete, .wrapper a {pointer-events: none;cursor: default;}

*****/


h1, h2, h3, h4, h5, h6 {} 	/* Pour afficher tous les titres dans une couleur specifique */

#primary-widget-area {}	/* Pour afficher une image de fond dans le SideBar */

#site-info {float: left; padding-top: 0px; padding-right: 1em; margin-top: 1em; margin-bottom: 1em;}     /* Pour contrôler le copyright dans le bas du footer */

.fcbk_share {margin-bottom: 0.5em;}	/* Pour dégager les boutons Facebook du titre de la page */


@media (max-width: 768px) {#container {padding: 0.8em !important;}}	/* Pour ajuster le padding du contenu de la version mobile */


.addtoany_content {margin: 0 !important;}	/* Pour éléminer la marge des boutons de partage (add to any) */


/************************/

		
#header {position: relative;}	/* Pour permettre un positionnement absolute dans ce div */

#colophon {position: relative;}	/* Pour permettre un positionnement absolute dans ce div */


/********** Réorganisation des éléments de l'entête *****************/
#title-tagline {height: 100%;}

	#site-tagline {position:absolute;left: 15%;bottom:20% ;z-index:90;}
			@media (max-width: 768px) {#site-tagline {display: none;}}

	#nav-header-mini {position:absolute; margin:0; right:0; bottom:0; z-index:100; font-size: 1.2em;}
	
	/* Pour mettre en place un fond dégradé en dessous du menu-mini */
	@media (min-width: 768px) {
	#nav-header-mini {
	padding-top: 8px;
	width: 660px;
	height: 37px;
	text-align: right;
	background-color: transparent;
	background-image: url(images/fond-menu-mini.png);
	background-position: right bottom;
	background-repeat: no-repeat;
	}
	}
	
	
	#primary-toggle-button {padding-top: 0.8em;}
	
	#site-title {position:absolute;left:5%;top:15%;z-index:120; width: 30%;}
			@media (max-width: 768px) {#site-title {position:absolute;left:0%;top:10%;z-index:120; width: 60%;}}

			
			

	/* Pour ajuster et mettre une image dans le fond du moteur de recherche */
	
	@media (min-width: 768px) {
	#header-search {
	width: 660px;
	height: 45px;
	background-color: transparent;
	background-image: url(images/fond-recherche.png);
	background-position: right top;
	background-repeat: no-repeat;
	}
	}

	.search-form:before {color: #ffffff !important;}	/* Pour changer la couleur de la loupe de l'outil de recherche */
	


/****
*
*	On utiliser le SITEWIDE TOP WIDGET AREA pour appeler les scripts de Facebook en fonction de la langue
*	nécessaires à la mise en place des boutons "like / j'aime" sur les pages du site.
*
****/

			
/* HEADER HTML - Pour appliquer une position ABSOLUTE */

@media (min-width: 768px) {
#header-html {width: 32%; position:absolute;left:30px; bottom:10%; z-index:10;}
}

@media (max-width: 768px) {
#header-html {display: block;}
}
					
			


/* HEADER WIDGET AREA - Pour appliquer une position ABSOLUTE */		

@media (min-width: 768px) {
#header-widget-area-ref {position: absolute; left: 3%; top: 5%; z-index: 1000; width: 52%;}			
}
		
		@media (max-width: 768px) {
		#header-widget-area-ref {display: block;}			
		}




/* EXTRA WIDGET AREA */

@media (min-width: 768px) {
#extra-widget-area {position: absolute; right: 5%; top: 20%; z-index: 10; background-color: red; color: white;}			
}
		
		@media (max-width: 768px) {
		#extra-widget-area {display: block;}			
		}
		

/* Pour grossir les caractères des boutons sociaux des Widgets SiteOrigin  
@media (min-width: 768px) {
.sow-social-media-button {
  font-size: 1.75em !important;
  padding: 0.2em 0.2em !important;
  }
}

@media (max-width: 768px) {
.sow-social-media-button {
  font-size: 1.5em !important;
  padding: 0.15em 0.15em !important;
  }
}
*/




/* EXTRA WIDGET AREA 2 */

@media (min-width: 768px) {
#extra-widget-area-2 {position:absolute; top:40%; right:2%; z-index:1200; background-color: red; color: white;}
}

@media (max-width: 768px) {
#extra-widget-area-2 {display: block;}
}




/************************/




/*** HEADER - Monté avec le Page Builder via une page dédiée - Post 2841 ***/

#post-2841 .widget {margin: 0 !important; padding: 0 !important;}




/*** HEADER - Bande d'information au dessus de l'entête ***/

#bande-top-entete {padding: 0.2em 3%;}

		@media (max-width: 768px) {#bande-top-entete {padding-bottom:0.5em;}}


@media (min-width: 768px) {#entete-info{
display: block;
color: #EEEEEE;
font-size: 1.2em;
}
}

		@media (max-width: 768px) {#entete-info {display: block; color: #eeeeee; font-size: 0.9em; margin-bottom: 0.5em;}}




/* Pour retirer la marge automatique qui se met en place sous les widgets en mode responsive  */
@media (max-width: 780px) {
#pgc-2841-0-0, #pgc-2841-0-1, #pgc-2841-0-2 {
    margin-bottom: 0px !important;
}
}



#entete-conteneur {
position: relative;
width: 100%;
height: 489px;
background-image: url(https://osteomasso.com/wp-content/uploads/entete-montage-2.jpg);
background-position: center center;
background-size: cover;
}	


@media (max-width: 768px) {#entete-conteneur {
height: auto;
padding-bottom:0.5em;
background-image: url(https://osteomasso.com/wp-content/uploads/entete-vague.png);
background-position: center bottom;
background-size: cover;		
}
}


@media (min-width: 768px) {#logo-entete {
position: absolute;
width: 29%;
left:8%;
top:10%;
z-index: 200;
}
}

		@media (max-width: 768px) {#logo-entete {display: block; width: 65%; padding: 1em; margin: 0 auto;}}



@media (min-width: 768px) {#entete-titre{
position: absolute;
left:44%;
bottom:20%;
z-index: 200;
color: #f37121;
font-size: 2.2em;
}
}

		@media (max-width: 768px) {#entete-titre {display: block; color: #f37121; font-size: 1.2em; text-align: center;}}

		
		
@media (min-width: 768px) {#entete-slogan{
position: absolute;
left:44%;
bottom:12%;
z-index: 200;
color: #b9dcf1;
font-size: 1.7em;
}
}

		@media (max-width: 768px) {#entete-slogan {display: block; color: #b9dcf1; font-size: 1.0em; text-align: center;}}	






#header .search-form input[type=search] {border: solid 1px #999999 !important;}



/************************/
	

/********** Pour appliquer un filet (border) autour des images *****************/
.image_border, img.fi-alignleft {border: solid 1px #aaa !important;}

@media (max-width: 768px) {.image-text-block {display: block !important; float: none !important; margin: 0 auto 1em !important; width: 100%;}}



/********** Pour forcer la présentation des images du texte en BLOCK sur les petits écrans *****************/

@media (max-width: 768px) {
#content img.alignright, #content img.alignleft, .alignright, .alignleft {
    display: inline;
    float: none;
    margin: 0em;
}
}



/* Pour intégrer les images dans des DIV */
.exemple_class {float: left; margin: 0 2em 0 0;}
.clear_line {clear: both;}



/*************************************/


blockquote {
	border-left: solid 3px #FCB315;
	color: #231F20;
    padding: 1em 1.2em 0em 1.2em;
	-webkit-margin-before: 1em;
    -webkit-margin-after: 1em;
    -webkit-margin-start: 0px;
    -webkit-margin-end: 0px;
}






 /* Pour modifier l'apparence du sélecteur de langue si on le met en place avec un widget  */ 
 /* Utile si on gère le menu avec Weaver et non pas avec l'outil MENU de WordPress  */ 
  li.lang-item-reference {list-style-type: none; text-transform: uppercase; font-size: 0.875em;}
  
  
  
 /*************************************/
 


/* Pour appliquer un style de lien personnalisé  */ 

a.a_gray:link {
color:#818284 !important;
text-decoration:none;
}

a.a_gray:visited {
color:#818284 !important;
text-decoration:none;
}

a.a_gray:hover {
color:#818284 !important;
text-decoration:underline;
}


/* Ajustements pour la présentation des articles de blogue - SLIDER et LIST */


/* Ajustements du conteneur avec padding et border */
.atw-show-posts .post-area, .slide-content {padding: 0.5em 0.5em 0 0.5em !important; border: solid 1px #aaa !important;}

/* Ajustements des images pour mettre la marge a zéro */
.atw-show-posts img.fi-alignleft, .slide-content img.fi-alignleft  {margin: 0 0 0.5em 0 !important;}



.slide-content .post-title, .slide-content .entry-summary p, .atw-show-posts .post-title {
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 2; /* number of lines to show */
	-webkit-box-orient: vertical;
}


.atw-show-posts .entry-summary p {
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 3; /* number of lines to show */
	-webkit-box-orient: vertical;
}





/* Pour afficher en bleu foncé les TITRE et les LIRE LA SUITE des articles affichés sur la page ACCUEIL */
.wrapper #post-2 .widget a {
    color: #12002E;
}





/* Ajustements des Excerpt pour limiter sur 2 lignes */
.slide-content .entry-summary p  {font-size: 0.9em;}


.post_slider_title h2 {margin: 0;}



/* Ajustements de certains titres dans le PageBuilder */

#pl-17 h2 {margin: 0;}
#pl-17 h3 {color: #F37121;}




/* Ajustements de l'excerpt dans les sommaires d'articles */
.entry-summary {padding-top: 0em !important;}





/* Ajustements du slider des articles de blogue en fonction de l'écran */
@media (max-width: 768px) {#articles-blogue-accueil {display: none;}}
@media (min-width: 768px) {#articles-blogue-accueil-responsive {display: none;}}



/* Ajustements du iframe de la page de rendez-vous. Pour que le contenu s'affiche à 100% de la heuteur sans barre de défilement */
.iframe-rendez-vous {
  overflow: hidden;
  padding-top: 120%;
  position: relative;
}

@media (max-width: 768px) {.iframe-rendez-vous {padding-top: 440%;}}

.iframe-rendez-vous iframe {
   border: 0;
   height: 100%;
   left: 0;
   position: absolute;
   top: 0;
   width: 100%;
}







/************************/