<html><head><meta name="color-scheme" content="light dark"></head><body><pre style="word-wrap: break-word; white-space: pre-wrap;">/***********************************************************************************************************************************/
/************************ 							/!\	AVANT D'EDITER /!\									************************/
/************************ 									VOIR					   						************************/
/************************ 							www.dev.equideow.com/doc								************************/
/************************ 						        	  ET											************************/
/************************ 			dev.owlient.eu/wiki/index.php/Guide_Int%C3%A9gration_Equideow			************************/
/***********************************************************************************************************************************/
 
/***********************************************************************************************************************************/
/* INFOBOX *************************************************************************************************************************/
/***********************************************************************************************************************************/

#infoBox {
	position: absolute;
	z-index: 100000;
}


/***********************************************************************************************************************************/
/* TOOLTIP - INFO ******************************************************************************************************************/
/***********************************************************************************************************************************/

.tooltip-info {
	display: inline-block;
	background: url(/media/equideo/image/interface/tooltip.png) no-repeat;
	background-position: 0 0;
	width: 14px;
	height: 14px;
	margin-left: 5px;
}
.tooltip-info.hover,
.tooltip-info:hover {
	background: url(/media/equideo/image/interface/tooltip.png) no-repeat;
	background-position: -14px 0;
}


/***********************************************************************************************************************************/
/* TOOLTIP - STYLE-0 ***************************************************************************************************************/
/***********************************************************************************************************************************/

.template-v4 .tooltip-style-0 {
	background:#fafac6;
	position: relative;
	max-width: 260px;
	border: 1px solid #b0ae48;
	padding:5px 10px;
	font-size: 13px;
	color: #030;
}
.template-v4 .tooltip-style-0 ul.arrow li {
	list-style: square inside none;
	margin-left: 7px;
	text-indent: -12px;
}
.template-v4 .tooltip-style-0 li {
	padding-left: 8px;
}
.template-v4 .tooltip-style-0 img{
	max-width:200px;
}
.template-v4 .tooltip-style-0 .coche {
	background-image: url(/media/equideo/image/components/tooltip/generic.png);
	position: absolute;
	width: 20px;
	height: 11px;
}
.template-v4 .tooltip-style-0 .topLeft,
.template-v4 .tooltip-style-0 .topRight,
.template-v4 .tooltip-style-0 .left-top,
.template-v4 .tooltip-style-0 .right-top {
	background-position: center top;
	top: -11px;
}
.template-v4 .tooltip-style-0 .topRight,
.template-v4 .tooltip-style-0 .right-top{
	right: 11px;
}
.template-v4 .tooltip-style-0 .coche.topLeft,
.template-v4 .tooltip-style-0 .left-top {
	top: -11px;
	left: 11px;
}
.template-v4 .tooltip-style-0 .coche.bottomLeft,
.template-v4 .tooltip-style-0 .coche.bottomRight,
.template-v4 .tooltip-style-0 .left-bottom,
.template-v4 .tooltip-style-0 .right-bottom{
	background-position:center bottom;
	bottom: -11px;
}
.template-v4 .tooltip-style-0 .coche.bottomRight,
.template-v4 .tooltip-style-0 .right-bottom {
	right: 11px;
}
.template-v4 .tooltip-style-0 .coche.bottomLeft,
.template-v4 .tooltip-style-0 .left-bottom {
	left: 11px;
}


/***********************************************************************************************************************************/
/* BUBBLZOOM ***********************************************************************************************************************/
/***********************************************************************************************************************************/

#bubbleZoom {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 3000;
	transition: opacity .3s ease-in-out;
}
#bubbleZoom {
	-webkit-transition: opacity .3s ease-in-out;
	-moz-transition: opacity .3s ease-in-out;
	-ms-transition: opacity .3s ease-in-out;
	-o-transition: opacity .3s ease-in-out;
}
#bubbleZoom &gt; div.bubble-zoom {
	/**
	 * padding et border-radius sont calculÃ© en JS (function showBubbleZoom)
	 */
	display: inline-block;
	box-shadow:2px 0px 5px rgba(75, 74, 30, 0.3);
	background: linear-gradient(to bottom,  #ffffff 0%,#fefef6 19%,#fcfdeb 31%,#fefdeb 35%,#fafbcf 69%,#fafac6 87%,#fafac6 100%);
	margin-bottom: 8px;
	vertical-align: middle;
	text-align: center;
}
#bubbleZoom &gt; div.bubble-zoom {
	background:-moz-linear-gradient(top,  #ffffff 0%, #fefef6 19%, #fcfdeb 31%, #fefdeb 35%, #fafbcf 69%, #fafac6 87%, #fafac6 100%);
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(19%,#fefef6), color-stop(31%,#fcfdeb), color-stop(35%,#fefdeb), color-stop(69%,#fafbcf), color-stop(87%,#fafac6), color-stop(100%,#fafac6));
	background:-webkit-linear-gradient(top,  #ffffff 0%,#fefef6 19%,#fcfdeb 31%,#fefdeb 35%,#fafbcf 69%,#fafac6 87%,#fafac6 100%);
	background:-ms-linear-gradient(top,  #ffffff 0%,#fefef6 19%,#fcfdeb 31%,#fefdeb 35%,#fafbcf 69%,#fafac6 87%,#fafac6 100%);
	background:-o-linear-gradient(top,  #ffffff 0%,#fefef6 19%,#fcfdeb 31%,#fefdeb 35%,#fafbcf 69%,#fafac6 87%,#fafac6 100%);
}


/***********************************************************************************************************************************/
/* TUTORIEL - HIGHLIGHT ************************************************************************************************************/
/***********************************************************************************************************************************/

/** down ***************************************************************************************************************************/
.tutoriel-highlight-down {
	position: absolute;
	top: 0;
	z-index: 1000;
	width: 52px;
	height: 65px;
	background: url(/media/equideo/image/interface/fleches/tutoriel-bas.png);
}
.animation .tutoriel-highlight-down {
	animation: tutoriel-fleche-bas 0.5s alternate infinite;
	-webkit-animation: tutoriel-fleche-bas 0.5s alternate infinite;
	-moz-animation: tutoriel-fleche-bas 0.5s alternate infinite;
	-ms-animation: tutoriel-fleche-bas 0.5s alternate infinite;
}

/** left ***************************************************************************************************************************/
.tutoriel-highlight-left {
	position: absolute;
	right: 0;
	z-index: 2001;
	width: 65px;
	height: 52px;
	background: url(/media/equideo/image/interface/fleches/tutoriel-gauche.png);
}
.animation .tutoriel-highlight-left {
	animation: tutoriel-fleche-left 0.5s alternate infinite;
	-webkit-animation: tutoriel-fleche-left 0.5s alternate infinite;
	-moz-animation: tutoriel-fleche-left 0.5s alternate infinite;
	-ms-animation: tutoriel-fleche-left 0.5s alternate infinite;
}

/** top ****************************************************************************************************************************/
.tutoriel-highlight-top {
	position: absolute;
	top:0;
	z-index: 1000;
	width: 52px;
	height: 65px;
	background: url(/media/equideo/image/interface/fleches/tutoriel-haut.png);
}
.animation .tutoriel-highlight-top {
	animation: tutoriel-fleche-haut 0.5s alternate infinite;
	-webkit-animation: tutoriel-fleche-haut 0.5s alternate infinite;
	-moz-animation: tutoriel-fleche-haut 0.5s alternate infinite;
	-ms-animation: tutoriel-fleche-haut 0.5s alternate infinite;
}

/** right ***************************************************************************************************************************/
.tutoriel-highlight-right {
	position: absolute;
	left: 0;
	z-index: 1000;
	width: 65px;
	height: 52px;
	background: url(/media/equideo/image/interface/fleches/tutoriel-droite.png);
}
.animation .tutoriel-highlight-right {
	animation: tutoriel-fleche-right 0.5s alternate infinite;
	-webkit-animation: tutoriel-fleche-right 0.5s alternate infinite;
	-moz-animation: tutoriel-fleche-right 0.5s alternate infinite;
	-ms-animation: tutoriel-fleche-right 0.5s alternate infinite;
}


/***********************************************************************************************************************************/
/* TUTORIEL - BUBBLE ***************************************************************************************************************/
/***********************************************************************************************************************************/

.tutoriel-bubble .tutoriel-highlight{
	top: -8px;
}
.tutoriel-bubble-inner{
	position: relative;
	display: inline-block;
}
.tutoriel-bubble-content{
	background-color: rgba(74,84,58,.9);
	display: inline-block;
	width: 250px;
	padding: 10px;
	border-radius: 5px;

}
.tutoriel-bubble-content,
.tutoriel-bubble-content p{
	color: #fff;
	font-size:15px;
	font-family: Arial;
}
.tutorial-bubble-top .tutoriel-bubble-content,
.tutorial-bubble-down .tutoriel-bubble-content{
	padding-left: 60px;
}

/** left ***************************************************************************************************************************/
.tutorial-bubble-left .tutoriel-highlight{
	left: -50px;
}
.tutorial-bubble-left .tutoriel-bubble-content{
	padding-left: 40px;
}

/** right **************************************************************************************************************************/
.tutorial-bubble-right .tutoriel-highlight{
	right: -50px;
	left: inherit;
}
.tutorial-bubble-right .tutoriel-bubble-content{
	padding-right: 40px;
}

/** top ****************************************************************************************************************************/
.tutorial-bubble-top .tutoriel-highlight{
	top: -50px;
}

/** down ***************************************************************************************************************************/
.tutorial-bubble-down .tutoriel-highlight{
	top: inherit;
	bottom: -50px;
}


/***********************************************************************************************************************************/
/* EXTENSIBLE BUBBLE ***************************************************************************************************************/
/***********************************************************************************************************************************/

/* generic setups for bubble elements **********************************************************************************************/
.bubble-extensible,
.bubble-extensible-text,
.bubble-extensible-inner,
.bubble-extensible-content{
	position: relative;
}
.bubble-extensible-inner:after,
.bubble-extensible-content:after,
.bubble-extensible-inner:before{
	content: "";
	display: block;
}
.bubble-extensible-inner:after{
	position: absolute;
	
}
/* generic : top bubble background ***********************************************************************/
.bubble-extensible-inner:before{
	background-position: center top;
	background-repeat: no-repeat;
}
/* generic : repeated content ****************************************************************************/
.bubble-extensible-content{
	background-repeat: repeat-y;
}
/* generic : bottom bubble background ********************************************************************/
.bubble-extensible-content:after{
	background-position: center bottom;
	background-repeat: no-repeat;
}

/* custom : bubble width *********************************************************************************/
.bubble-extensible{
	width: 250px;
}

/***********************************************************************************************************************************/
/* EXTENSIBLE BUBBLE : CUSTOM EXEMPLE **********************************************************************************************/
/***********************************************************************************************************************************/

/* custom : bubble top styles here ***********************************************************************/
.bubble-extensible-inner:before{
	background-color: red;
	height: 30px; /* ceci est la valeur de la variable "A" */
}

/* custom : bubble spike styles here **********************************************************************/
.bubble-extensible-inner:after{
	height: 40px; /* ceci est la valeur de la variable "C" */
	bottom: -40px; /* mettre ici la mÃªme valeur que la variable "C" */
	background: pink;
	width: 20px;
}

/* custom : bubble background-repeat styles here *********************************************************/
.bubble-extensible-content{
	background-color: yellow;
}

/* custom : bubble bottom styles here *******************************************************************/
.bubble-extensible-content:after{
	background-color: blue;
	height: 40px; /* ceci est la valeur de la variable"B" */
}

/* custom : bubble text styles here **********************************************************************/
.bubble-extensible-text{
	bottom: 30px; /* mettre ici la mÃªme valeur que la variable "A" */
	margin-bottom: -70px; /* &lt;== mettre ici la valeur nÃ©gative de la somme des variables "A + B" */
	min-height: 70px; /* &lt;== mettre ici la somme des variables A + B */
	padding: 10px;
}</pre></body></html>