#watool__toolbar, #watool__toolbarH {
	display: block!important;
	letter-spacing: initial!important;
	word-spacing: initial!important;
}
#watool__toolbar *, #watool__toolbarH * {
	font-size: 13.33px;
	letter-spacing: initial!important;
	word-spacing: initial!important;
}

/**
 * WATOOL IFRAME
 */

	#watool__iframe {width: 0!important; height: 0!important; position: absolute; visibility: hidden;}

/**
 * Watool icons
 */

	button:focus{outline:none;}

	div[id*="watool_niv"] {font-size: 13.33px;}
	
	#watool__icon {
		display: table;
		width: 100%;
		vertical-align: top;
		background:	-webkit-linear-gradient(330deg, rgba(0,0,0,0), rgba(0,0,0,0.35));
		background:	-o-linear-gradient(330deg, rgba(0,0,0,0), rgba(0,0,0,0.35));
		background: linear-gradient(60deg, rgba(0,0,0,0), rgba(0,0,0,0.35));
		background-color:#003A6B;
	}		

	#watool__toolbar_open_features {
		width: 50px;
		border-right: 5px solid #003A6B;
		height: 100%;
		min-height: 50px;
		padding: 0;
		background:	url(../images/ico_watool.svg) no-repeat center;
		background-size:74px;
		border: none;
		text-indent: -9999px;
		box-sizing: border-box;
		vertical-align: bottom;
	}

	#watool__toolbar_open_features:hover {
		background-color:#00335E;
		transition: background-color 0.2s!important;
	}
	#watool__toolbar.watool__feature_desc #watool__icon span.watool {
		padding-left: 0!important;
		opacity: 1;
		transition: 0.2s opacity!important;
	}

	#watool__toolbarH.watool__features #watool__icon span.watool {
		padding-left: 0!important;
		opacity: 1;
		transition: 0.2s opacity!important;
	}
	
	#watool__toolbarH.watool__feature_desc #watool__icon span.watool {
		padding-left: 0!important;
		opacity: 1;
	}

	#watool__icon span.watool {
		display:table-cell;
		vertical-align: middle;
		width:100%;
		color:#BCDAF5;
		opacity: 0;
		font-size:1.2em!important;
		max-width: 400px;
		padding-right: 5px;
		/*padding-left: 50px;*/
		line-height: 1.5em;
		font-family:"quicksandbook"!important;
	}

	#watool__icon span strong {
		font-size:1.1em!important;
		margin-right:5px;
		font-family:"novecento_sans_wide_bookbold"!important;
		color:#fff;
	}

	
	#watool__icon span em {
		font-style:normal;
		font-size:inherit;
	}
	
	@media screen and (max-width:450px){
		#watool__icon span em {
			display:none;
		}
	}


	/**
	 * Reset Features (Button)
	 */
		#watool__reset_features {
			width: 50px;
			border-left: 5px solid #003A6B;
			height: 100%;
			min-height: 50px;
			padding: 0;
			background:	url(../images/btn-off.svg) no-repeat center;
			background-size:76%;
			border: none;
			text-indent: -9999px;
			box-sizing: border-box;
			vertical-align: bottom;
		}

/**
 * Features
 */
	#watool__features {
		font-size: 0!important;
	}

	/**
	 * Level 2 - Features icons
	 */

		#watool__features_icons {
			display: inline-block;
			vertical-align: top;
			margin: 0;
			background: -webkit-linear-gradient(15deg, rgba(0,0,0,0), rgba(0,0,0,0.35));
			background: -o-linear-gradient(15deg, rgba(0,0,0,0), rgba(0,0,0,0.35));
			background: linear-gradient(105deg, rgba(0,0,0,0), rgba(0,0,0,0.35));
			background-color: #005baa;
			position:relative;
		}

		.watool__feature {
			padding: 0;
			background:none;
			border:none;
			font-size:0;
			box-sizing: border-box;
			text-align:left;
		}

		.watool__feature img {
			max-width: 40px;
			max-height: 40px;
			margin:5px;
		}
	
		/**
		 * Survol + fonctionnalité en cours de traitement
		 */
			button.watool.watool__feature {font-size: 0!important;}

			button.watool.watool__feature:hover, button.watool.watool__feature:hover, 
			button.watool.watool__feature.watool__selected, button.watool.watool__feature.watool__selected, 
			button.watool.watool__feature.active:hover{
				background: #00325E!important;
				border-color: #00325E!important;
			}

			.watool__feature.watool__selected::after, button.watool.watool__feature:hover::after {
				content:"";
				opacity:1;
				display:inline-block;
				width:0;
				height:0;
				border-style:solid;
				position:absolute;
				transition:right 2s!important;
			}


		/**
		 * Témoin activation rouge / vert
		 */
			.watool__feature.watool__active {
				border-color: #328505!important;
			}
	
	/**
	 * Description block
	 */
		

		#watool__features_desc {
			display: inline-block;
			vertical-align: top;
	        background: -webkit-linear-gradient(95deg, rgba(0,0,0,0.15) 0%, rgba(0,0,0,0) 25%);
	        background: -o-linear-gradient(95deg, rgba(0,0,0,0.15) 0%, rgba(0,0,0,0) 25%);
	        background: linear-gradient(185deg, rgba(0,0,0,0.15) 0%, rgba(0,0,0,0) 25%);
			background-color: #f5f5f5;
			padding:0;
			color:#222;
			box-sizing: border-box;
			font-size:0; /* nécessaire pour enlever le bug sur les display inline-block */
		}

		#watool__features_desc > div{font-size:13.33px;} /* nécessaire pour enlever le bug sur les display inline-block */

		.watool__feature_content.watool__active {display: block;}
		.watool__feature_content.watool__disabled {display: none;}
		
		/* Background selon fontionnalité */

		/* SWITCH ON OFF */
			#watool__features_desc .watool__switch_on_off{display:inline-block;}

			/* Checkbox */
				#watool__features_desc .watool__switch_on_off .watool__switch_box {
					position: absolute;
					margin-left: -9999px;
					visibility: hidden;			  
				}
			
			/* Label -> décor du switch */
				#watool__features_desc .watool__switch_on_off .watool__switch_box + label {
					width:22px;
					height:40px;
					box-shadow:0px 0px 5px #000 inset;
					border-radius:11px;
					display: block;
					position: relative;
					cursor: pointer;
					outline: none;
					user-select: none;			
				}

				/* OFF */

					/* Switch off */
						#watool__features_desc .watool__switch_on_off .watool__switch_box + label {
							background: -webkit-linear-gradient(bottom, rgba(0,0,0,0), rgba(0,0,0,0.65));
							background: -o-linear-gradient(bottom, rgba(0,0,0,0), rgba(0,0,0,0.65));
							background: linear-gradient(to top, rgba(0,0,0,0), rgba(0,0,0,0.65));
							background-color: #be1626;
							transition: background 0.4s!important;
							transition: background-color 0.4s!important;
						}	

					/* Cursor */
						#watool__features_desc .watool__switch_on_off .watool__switch_box + label:before{
							display:block;
							content:"";
							position:absolute;
							top:0;
							width:20px;
							height:20px;
							margin:1px;
							border-radius:50%;
					        background: -webkit-linear-gradient(top left, rgba(0,0,0,0.25) 0%, rgba(0,0,0,0.15) 15%, rgba(255,255,255,0.65) 50%, rgba(255,255,255,0) 90%);
					        background: -o-linear-gradient(top left, rgba(0,0,0,0.25) 0%, rgba(0,0,0,0.15) 15%, rgba(255,255,255,0.65) 50%, rgba(255,255,255,0) 90%);
					        background: linear-gradient(to bottom right, rgba(0,0,0,0.25) 0%, rgba(0,0,0,0.15) 15%, rgba(255,255,255,0.65) 50%, rgba(255,255,255,0) 90%);
							background-color:#bbb;
							transition: top 0.2s!important;
						}

					/* text "OFF" */
						#watool__features_desc .watool__switch_on_off .watool__switch_box + label:after{
							display:block;
							content:"off";
							position:absolute;
							top:22px;
							opacity:0.5;
							color:#fff;
							font-size:7px;
							line-height:15px;
							text-transform:uppercase;
							width:22px;
							height:18px;
							text-align:center;
							font-family:Arial!important;
							transition: opacity 0.2s!important;
						}	

				/* ON */

					/* Switch on */
						#watool__features_desc .watool__switch_on_off .watool__switch_box.watool__active + label {
							background: -webkit-linear-gradient(rgba(0,0,0,0), rgba(0,0,0,0.65));
							background: -o-linear-gradient(rgba(0,0,0,0), rgba(0,0,0,0.65));
							background: linear-gradient(rgba(0,0,0,0), rgba(0,0,0,0.65));
							background-color: #328505;				
							transition: background 0.4s!important;
							transition: background-color 0.4s!important;
						}

					/* Cursor */
						#watool__features_desc .watool__switch_on_off .watool__switch_box.watool__active + label:before{
							display:block;
							content:"";
							position:absolute;
							top:18px;
							width:20px;
							height:20px;
							margin:1px;
							border-radius:50%;
					        background: -webkit-linear-gradient(top left, rgba(0,0,0,0.25) 0%, rgba(0,0,0,0.15) 15%, rgba(255,255,255,0.65) 50%, rgba(255,255,255,0) 90%);
					        background: -o-linear-gradient(top left, rgba(0,0,0,0.25) 0%, rgba(0,0,0,0.15) 15%, rgba(255,255,255,0.65) 50%, rgba(255,255,255,0) 90%);
					        background: linear-gradient(to bottom right, rgba(0,0,0,0.25) 0%, rgba(0,0,0,0.15) 15%, rgba(255,255,255,0.65) 50%, rgba(255,255,255,0) 90%);
							background-color:#bbb;
							transition: top 0.2s!important;
						}
					
					/* text "ON" */
						#watool__features_desc .watool__switch_on_off .watool__switch_box.watool__active + label:after{
							display:block;
							content:"on";
							position:absolute;
							top:0px;
							opacity:0.5;
							color:#fff;
							font-size:7px;
							line-height:22px;
							text-transform:uppercase;
							width:22px;
							height:18px;
							text-align:center;
							font-family:Arial!important;
							transition: opacity 0.2s!important;
						}

			/* Feature Title */
				#watool__features_desc h1{
					width:calc(100% - 50px);
					display:inline-block;
					vertical-align:top;
					padding:0 0 40px 20px;
					margin:0;
					font-weight:normal;
				}

				#watool__features_desc h1:after{
					content:"";
					display:table;
					clear:both;
				}

				#watool__features_desc h1 span{
					display:block;
					text-transform:uppercase;
				}

				#watool__features_desc h1 .watool__feature_title_small{
					font-size:1.2em;
					line-height:1;
					font-family:"montserratlight"!important;
				}

				#watool__features_desc h1 .watool__feature_title_big{
					font-size:1.6em;
					line-height:1.2;
					font-family:"montserratbold"!important;
				}

			/* Title "paramétrage" */
				#watool__features_desc h2{
					font-size:1.1em;
					font-weight:lighter;
					text-transform:uppercase;
					line-height:1.35;
					text-align: center;
					display:block;
					overflow:hidden;
					margin:0;
					padding:0;
					padding-bottom:30px;
					font-family:"montserratlight"!important;
					font-weight:normal;
				}
				
				/* Ornement */
					#watool__features_desc h2:before,
					#watool__features_desc h2:after{
						content:"";
						display:inline-block;
						border-top:1px solid #adadad;
						border-bottom:1px solid #fff;
						width:9999px;
						position:relative;
						top:-4px;
					}
					
					#watool__features_desc h2:before{
						margin-left:-9999px;
						margin-right:20px;
					}
					
					#watool__features_desc h2:after{
						margin-right:-9999px;
						margin-left:20px;
					}

/* ==========================================================================
   Vertical Toolbar
   ========================================================================== */
	
	#watool__toolbar, #watool__toolbar * {letter-spacing: initial!important; word-spacing: initial!important;}
	#watool__toolbar {
		position: fixed;
		height: 100%;
		z-index: 9999999;
		font-size: 13.33px;
		max-width: 505px;
		top: 0;
	}
	
	#watool__toolbar.watool__close {right: calc(0px - 455px);}
	#watool__toolbar.watool__features{right: calc(0px - 400px);}
	#watool__toolbar.watool__feature_desc {right: 0;}

	/*
	 * Features
	 */
		/**
		 * Level 2 - Features icons
		 */

			#watool__toolbar #watool__features_icons {
				width: 55px;
				margin-left:50px;
				height:calc(100vh - 50px);
			}
			
			#watool__toolbar .watool__feature {
				width: 55px;
				height: 50px;
				display:block;
			}
			
			/**
			 * Survol + fonctionnalité en cours de traitement
			 */
				
				#watool__toolbar .watool__feature.watool__selected::after, #watool__toolbar button.watool.watool__feature:hover::after {
					border-color:transparent transparent transparent #00325E;
					border-width:10px 0px 10px 8px;
					margin-top:15px;
					right:-8px;
				}

			/**
			 * Témoin activation rouge / vert
			 */
				
				#watool__toolbar .watool__feature {
					border-right: 5px solid #be1626;
				}


		/**
		 * Description block
		 */
			

			#watool__toolbar #watool__features_desc {
				width: 400px;
				padding:40px;
				height:calc(100vh - 50px);
			}


/* ==========================================================================
   Horizontal Toolbar
   ========================================================================== */
	

	#watool__toolbarH {
		position: fixed;
		width: 100%;
		z-index: 9999999;
		top: 0;
	}

	#watool__toolbarH.watool__disabled {left: calc(100% - 50px);}
	#watool__toolbarH.watool__active {left: 0;}
	
	/*
	 * Features
	 */
		/**
		 * Level 2 - Features icons
		 */

			#watool__toolbarH #watool__features_icons {
				width: 100%;
				font-size: 0;
			}
			
			#watool__toolbarH #watool__features_icons.watool__disabled {height: 0; overflow: hidden;}
			#watool__toolbarH #watool__features_icons.watool__active {height: 100%; overflow: visible;}
			
			#watool__toolbarH .watool__feature {
				width: 50px;
				height: 55px;
				display:inline-block;
				vertical-align: top;
				position: relative;
			}
			

			/**
			 * Survol + fonctionnalité en cours de traitement
			 */
				
				#watool__toolbarH .watool__feature.watool__selected::after,
				#watool__toolbarH button.watool.watool__feature:hover::after {
					border-color: #00325E transparent transparent transparent;
					border-width:10px 8px 0px 10px;
					bottom:-14px;
					left : calc(50% - 9px);
				}


			/**
			 * Témoin activation rouge / vert
			 */
				
				#watool__toolbarH .watool__feature {
					border-bottom: 5px solid #be1626;
				}
		
	/**
	 * Description block
	 */
		

		#watool__toolbarH #watool__features_desc {
			width: 100%;
			max-height: calc(100vh - 150px);
			overflow: auto;
		}

		#watool__toolbarH #watool__features_desc.watool__active {
			height:auto;
			min-height: calc(250px - 80px);
			padding:40px;
			box-shadow:0 2px 3px rgba(0,0,0,0.2);
		}

		#watool__toolbarH #watool__features_desc.watool__disabled {height:0;}