/* =========================================================================================== */
/* ===================================== TOOLTIPS MAIN ===================================== */
/* =========================================================================================== */


/* --- Cursor --- */

.cursor_help{
	cursor: help;
}
.cursor_pointer{
	cursor: pointer;
}

/* --- BOX SIZING FIX --- */
.qlabs_tooltip_top *,
.qlabs_tooltip_top_center *,
.qlabs_tooltip_bottom *,
.qlabs_tooltip_bottom_center *,
.qlabs_tooltip_right *,
.qlabs_tooltip_left *,
.qlabs_tooltip_diagonal_right_bottom *,
.qlabs_tooltip_diagonal_left_bottom *,
.qlabs_tooltip_diagonal_right_top *,
.qlabs_tooltip_diagonal_left_top *,
.qlabs_tooltip_focus_top *,
.qlabs_tooltip_focus_bottom *,
.qlabs_tooltip_focus_right *,
.qlabs_tooltip_focus_left *,
.qlabs_tooltip_focus_diagonal_right_bottom *,
.qlabs_tooltip_focus_diagonal_left_bottom *,
.qlabs_tooltip_focus_diagonal_right_top *,
.qlabs_tooltip_focus_diagonal_left_top *
{
    box-sizing: content-box;
    -moz-box-sizing: content-box;
    -webkit-box-sizing: content-box;
}

/* --- Base --- */
.qlabs_tooltip_top,
.qlabs_tooltip_top_center,
.qlabs_tooltip_bottom,
.qlabs_tooltip_bottom_center,
.qlabs_tooltip_right,
.qlabs_tooltip_left,
.qlabs_tooltip_diagonal_right_bottom,
.qlabs_tooltip_diagonal_left_bottom,
.qlabs_tooltip_diagonal_right_top,
.qlabs_tooltip_diagonal_left_top,
.qlabs_tooltip_focus_top,
.qlabs_tooltip_focus_bottom,
.qlabs_tooltip_focus_right,
.qlabs_tooltip_focus_left,
.qlabs_tooltip_focus_diagonal_right_bottom,
.qlabs_tooltip_focus_diagonal_left_bottom,
.qlabs_tooltip_focus_diagonal_right_top,
.qlabs_tooltip_focus_diagonal_left_top
	{
	position: relative !important;
	display: inline-block !important;
	text-decoration: none !important;
	}
	
/* --- Container --- */
.qlabs_tooltip_top > span,
.qlabs_tooltip_top_center > span,
.qlabs_tooltip_bottom > span,
.qlabs_tooltip_bottom_center > span,
.qlabs_tooltip_right > span,
.qlabs_tooltip_left > span,
.qlabs_tooltip_diagonal_right_bottom > span,
.qlabs_tooltip_diagonal_left_bottom > span,
.qlabs_tooltip_diagonal_right_top > span,
.qlabs_tooltip_diagonal_left_top > span,
.qlabs_tooltip_focus_top > span,
.qlabs_tooltip_focus_bottom > span,
.qlabs_tooltip_focus_right > span,
.qlabs_tooltip_focus_left > span,
.qlabs_tooltip_focus_diagonal_right_bottom > span,
.qlabs_tooltip_focus_diagonal_left_bottom > span,
.qlabs_tooltip_focus_diagonal_right_top > span,
.qlabs_tooltip_focus_diagonal_left_top > span
	{
	border: none;
	font-family: arial, sans-serif !important; /* Tooltip Base Font Family */
	font-size: 13px !important; /* Tooltip Base Font Size */
	font-style: normal;
	font-weight: normal;
	line-height: normal !important;
	text-align: left !important;
	padding: 10px 10px 12px 10px !important;
	text-transform: none;
	visibility: hidden; 
	opacity: 0; 
   
	position: absolute;
	z-index: 1000;

	/* CSS3 Transitions */
	-webkit-transition-duration: 0.25s;
	-moz-transition-duration: 0.25s;
	-o-transition-duration: 0.25s;
	-ms-transition-duration: 0.25s;
	transition-duration: 0.25s;
	-webkit-transition-timing-function: cubic-bezier(0.35,0,0.35,1);
	-moz-transition-timing-function: cubic-bezier(0.35,0,0.35,1);
	-o-transition-timing-function: cubic-bezier(0.35,0,0.35,1);
	-ms-transition-timing-function: cubic-bezier(0.35,0,0.35,1);
	transition-timing-function: cubic-bezier(0.35,0,0.35,1);
	}
	
/* --- Arrow --- */	
.qlabs_tooltip_top > span:after,
.qlabs_tooltip_top_center > span:after,
.qlabs_tooltip_bottom > span:after,
.qlabs_tooltip_bottom_center > span:after,
.qlabs_tooltip_right > span:after,
.qlabs_tooltip_left > span:after,
.qlabs_tooltip_diagonal_right_bottom > span:after,
.qlabs_tooltip_diagonal_left_bottom > span:after,
.qlabs_tooltip_diagonal_right_top > span:after,
.qlabs_tooltip_diagonal_left_top > span:after,
.qlabs_tooltip_focus_top > span:after,
.qlabs_tooltip_focus_bottom > span:after,
.qlabs_tooltip_focus_right > span:after,
.qlabs_tooltip_focus_left > span:after,
.qlabs_tooltip_focus_diagonal_right_bottom > span:after,
.qlabs_tooltip_focus_diagonal_left_bottom > span:after,
.qlabs_tooltip_focus_diagonal_right_top > span:after,
.qlabs_tooltip_focus_diagonal_left_top > span:after
	{
	content: "";
	display: block;
	width: 0px;
	height: 0px;
	position: absolute;
	}

/* --- Header --- */
.qlabs_tooltip_top > span strong,
.qlabs_tooltip_top_center > span strong,
.qlabs_tooltip_bottom > span strong,
.qlabs_tooltip_bottom_center > span strong,
.qlabs_tooltip_right > span strong,
.qlabs_tooltip_left > span strong,
.qlabs_tooltip_diagonal_right_bottom > span strong,
.qlabs_tooltip_diagonal_left_bottom > span strong,
.qlabs_tooltip_diagonal_right_top > span strong,
.qlabs_tooltip_diagonal_left_top > span strong,
.qlabs_tooltip_focus_top > span strong,
.qlabs_tooltip_focus_bottom > span strong,
.qlabs_tooltip_focus_right > span strong,
.qlabs_tooltip_focus_left > span strong,
.qlabs_tooltip_focus_diagonal_right_bottom > span strong,
.qlabs_tooltip_focus_diagonal_left_bottom > span strong,
.qlabs_tooltip_focus_diagonal_right_top > span strong,
.qlabs_tooltip_focus_diagonal_left_top > span strong
	{
	width: 100%;
	padding: 8px 10px 8px 10px;
	display: block;
	position: relative;
	left: -10px;
	top: -10px;

	box-sizing: content-box;
	-moz-box-sizing: content-box;
	-webkit-box-sizing: content-box;

	/* CSS3 Borders */
	-moz-border-radius-topleft: 4px;
	-moz-border-radius-topright: 4px;
	-moz-border-radius-bottomright: 0px;
	-moz-border-radius-bottomleft: 0px;
	-webkit-border-radius: 4px 4px 0px 0px;
	border-radius: 4px 4px 0px 0px;
	}

/* --- Iframe & Images --- */		
.qlabs_tooltip_top > span img,
.qlabs_tooltip_top > span iframe,
.qlabs_tooltip_top_center > span img,
.qlabs_tooltip_top_center > span iframe,
.qlabs_tooltip_bottom > span img,
.qlabs_tooltip_bottom > span iframe,
.qlabs_tooltip_bottom_center > span img,
.qlabs_tooltip_bottom_center > span iframe,
.qlabs_tooltip_right > span img,
.qlabs_tooltip_right > span iframe,
.qlabs_tooltip_left > span img,
.qlabs_tooltip_left > span iframe,
.qlabs_tooltip_diagonal_right_bottom > span img,
.qlabs_tooltip_diagonal_right_bottom > span iframe,
.qlabs_tooltip_diagonal_left_bottom > span img,
.qlabs_tooltip_diagonal_left_bottom > span iframe,
.qlabs_tooltip_diagonal_right_top > span img,
.qlabs_tooltip_diagonal_right_top > span iframe,
.qlabs_tooltip_diagonal_left_top > span img,
.qlabs_tooltip_diagonal_left_top > span iframe,
.qlabs_tooltip_focus_top > span img,
.qlabs_tooltip_focus_top > span iframe,
.qlabs_tooltip_focus_bottom > span img,
.qlabs_tooltip_focus_bottom > span iframe,
.qlabs_tooltip_focus_right > span img,
.qlabs_tooltip_focus_right > span iframe,
.qlabs_tooltip_focus_left > span img,
.qlabs_tooltip_focus_left > span iframe,
.qlabs_tooltip_focus_diagonal_right_bottom > span img,
.qlabs_tooltip_focus_diagonal_right_bottom > span iframe,
.qlabs_tooltip_focus_diagonal_left_bottom > span img,
.qlabs_tooltip_focus_diagonal_left_bottom > span iframe
.qlabs_tooltip_focus_diagonal_right_top > span img,
.qlabs_tooltip_focus_diagonal_right_top > span iframe,
.qlabs_tooltip_focus_diagonal_left_top > span img,
.qlabs_tooltip_focus_diagonal_left_top > span iframe
	{
	margin: 0px 0px 10px 0px !important;
	border: 5px solid #ffffff !important;
	//float: left !important;
	max-width: none;
	}
	
/* --- Paragraph --- */
p.qlabs_tooltip_top,
p.qlabs_tooltip_top_center,
p.qlabs_tooltip_bottom,
p.qlabs_tooltip_bottom_center,
p.qlabs_tooltip_right,
p.qlabs_tooltip_left,
p.qlabs_tooltip_diagonal_right_bottom,
p.qlabs_tooltip_diagonal_left_bottom,
p.qlabs_tooltip_diagonal_right_top,
p.qlabs_tooltip_diagonal_left_top
	{
	display: block !important;
	}
	
p.qlabs_tooltip_top:hover,
p.qlabs_tooltip_top_center:hover,
p.qlabs_tooltip_bottom:hover,
p.qlabs_tooltip_bottom_center:hover,
p.qlabs_tooltip_right:hover,
p.qlabs_tooltip_left:hover,
p.qlabs_tooltip_diagonal_right_bottom:hover,
p.qlabs_tooltip_diagonal_left_bottom:hover,
p.qlabs_tooltip_diagonal_right_top:hover,
p.qlabs_tooltip_diagonal_left_top:hover
	{
	background: #ffecb1;
	
	/* CSS3 Transitions */
	-webkit-transition: background 0.25s cubic-bezier(0.35,0,0.35,1);
	-moz-transition: background 0.25s cubic-bezier(0.35,0,0.35,1);
	-o-transition: background 0.25s cubic-bezier(0.35,0,0.35,1);
	-ms-transition: background 0.25s cubic-bezier(0.35,0,0.35,1);
	transition: background 0.25s cubic-bezier(0.35,0,0.35,1);
	}
	
/* --- Optional Delay --- */
/* --- 700ms --- */
.delay_700.qlabs_tooltip_top > span,
.delay_700.qlabs_tooltip_top_center > span,
.delay_700.qlabs_tooltip_bottom > span,
.delay_700.qlabs_tooltip_bottom_center > span,
.delay_700.qlabs_tooltip_right > span,
.delay_700.qlabs_tooltip_left > span,
.delay_700.qlabs_tooltip_diagonal_right_bottom > span,
.delay_700.qlabs_tooltip_diagonal_left_bottom > span,
.delay_700.qlabs_tooltip_diagonal_right_top > span,
.delay_700.qlabs_tooltip_diagonal_left_top > span,
.delay_700.qlabs_tooltip_focus_top > span,
.delay_700.qlabs_tooltip_focus_bottom > span,
.delay_700.qlabs_tooltip_focus_right > span,
.delay_700.qlabs_tooltip_focus_left > span,
.delay_700.qlabs_tooltip_focus_diagonal_right_bottom > span,
.delay_700.qlabs_tooltip_focus_diagonal_left_bottom > span,
.delay_700.qlabs_tooltip_focus_diagonal_right_top > span,
.delay_700.qlabs_tooltip_focus_diagonal_left_top > span
	{
	/* CSS3 Transitions */
	transition-delay: 700ms;
	-moz-transition-delay: 700ms;
	-webkit-transition-delay: 700ms;
	-o-transition-delay: 700ms;
	}
	
/* --- 500ms --- */
.delay_500.qlabs_tooltip_top > span,
.delay_500.qlabs_tooltip_top_center > span,
.delay_500.qlabs_tooltip_bottom > span,
.delay_500.qlabs_tooltip_bottom_center > span,
.delay_500.qlabs_tooltip_right > span,
.delay_500.qlabs_tooltip_left > span,
.delay_500.qlabs_tooltip_diagonal_right_bottom > span,
.delay_500.qlabs_tooltip_diagonal_left_bottom > span,
.delay_500.qlabs_tooltip_diagonal_right_top > span,
.delay_500.qlabs_tooltip_diagonal_left_top > span,
.delay_500.qlabs_tooltip_focus_top > span,
.delay_500.qlabs_tooltip_focus_bottom > span,
.delay_500.qlabs_tooltip_focus_right > span,
.delay_500.qlabs_tooltip_focus_left > span,
.delay_500.qlabs_tooltip_focus_diagonal_right_bottom > span,
.delay_500.qlabs_tooltip_focus_diagonal_left_bottom > span,
.delay_500.qlabs_tooltip_focus_diagonal_right_top > span,
.delay_500.qlabs_tooltip_focus_diagonal_left_top > span
	{
	/* CSS3 Transitions */
	transition-delay: 500ms;
	-moz-transition-delay: 500ms;
	-webkit-transition-delay: 500ms;
	-o-transition-delay: 500ms;
	}	

/* --- 300ms --- */
.delay_300.qlabs_tooltip_top > span,
.delay_300.qlabs_tooltip_top_center > span,
.delay_300.qlabs_tooltip_bottom > span,
.delay_300.qlabs_tooltip_bottom_center > span,
.delay_300.qlabs_tooltip_right > span,
.delay_300.qlabs_tooltip_left > span,
.delay_300.qlabs_tooltip_diagonal_right_bottom > span,
.delay_300.qlabs_tooltip_diagonal_left_bottom > span,
.delay_300.qlabs_tooltip_diagonal_right_top > span,
.delay_300.qlabs_tooltip_diagonal_left_top > span,
.delay_300.qlabs_tooltip_focus_top > span,
.delay_300.qlabs_tooltip_focus_bottom > span,
.delay_300.qlabs_tooltip_focus_right > span,
.delay_300.qlabs_tooltip_focus_left > span,
.delay_300.qlabs_tooltip_focus_diagonal_right_bottom > span,
.delay_300.qlabs_tooltip_focus_diagonal_left_bottom > span,
.delay_300.qlabs_tooltip_focus_diagonal_right_top > span,
.delay_300.qlabs_tooltip_focus_diagonal_left_top > span
	{
	/* CSS3 Transitions */
	transition-delay: 300ms;
	-moz-transition-delay: 300ms;
	-webkit-transition-delay: 300ms;
	-o-transition-delay: 300ms;
	}
	
/* --- 200ms --- */
.delay_200.qlabs_tooltip_top > span,
.delay_200.qlabs_tooltip_top_center > span,
.delay_200.qlabs_tooltip_bottom > span,
.delay_200.qlabs_tooltip_bottom_center > span,
.delay_200.qlabs_tooltip_right > span,
.delay_200.qlabs_tooltip_left > span,
.delay_200.qlabs_tooltip_diagonal_right_bottom > span,
.delay_200.qlabs_tooltip_diagonal_left_bottom > span,
.delay_200.qlabs_tooltip_diagonal_right_top > span,
.delay_200.qlabs_tooltip_diagonal_left_top > span,
.delay_200.qlabs_tooltip_focus_top > span,
.delay_200.qlabs_tooltip_focus_bottom > span,
.delay_200.qlabs_tooltip_focus_right > span,
.delay_200.qlabs_tooltip_focus_left > span,
.delay_200.qlabs_tooltip_focus_diagonal_right_bottom > span,
.delay_200.qlabs_tooltip_focus_diagonal_left_bottom > span,
.delay_200.qlabs_tooltip_focus_diagonal_right_top > span,
.delay_200.qlabs_tooltip_focus_diagonal_left_top > span
	{
	/* CSS3 Transitions */
	transition-delay: 200ms;
	-moz-transition-delay: 200ms;
	-webkit-transition-delay: 200ms;
	-o-transition-delay: 200ms;
	}
	
/* --- 100ms --- */
.delay_100.qlabs_tooltip_top > span,
.delay_100.qlabs_tooltip_top_center > span,
.delay_100.qlabs_tooltip_bottom > span,
.delay_100.qlabs_tooltip_bottom_center > span,
.delay_100.qlabs_tooltip_right > span,
.delay_100.qlabs_tooltip_left > span,
.delay_100.qlabs_tooltip_diagonal_right_bottom > span,
.delay_100.qlabs_tooltip_diagonal_left_bottom > span,
.delay_100.qlabs_tooltip_diagonal_right_top > span,
.delay_100.qlabs_tooltip_diagonal_left_top > span,
.delay_100.qlabs_tooltip_focus_top > span,
.delay_100.qlabs_tooltip_focus_bottom > span,
.delay_100.qlabs_tooltip_focus_right > span,
.delay_100.qlabs_tooltip_focus_left > span,
.delay_100.qlabs_tooltip_focus_diagonal_right_bottom > span,
.delay_100.qlabs_tooltip_focus_diagonal_left_bottom > span
.delay_100.qlabs_tooltip_focus_diagonal_right_top > span,
.delay_100.qlabs_tooltip_focus_diagonal_left_top > span
	{
	/* CSS3 Transitions */
	transition-delay: 100ms;
	-moz-transition-delay: 100ms;
	-webkit-transition-delay: 100ms;
	-o-transition-delay: 100ms;
	}

/* =========================================================================================== */
/* ========================================== TOP ============================================ */
/* =========================================================================================== */

/* --- Container --- */
.qlabs_tooltip_top > span,
.qlabs_tooltip_focus_top > span
	{
	left: -10px;
	bottom: 100%;
	margin-bottom: 30px; /* Start Position */
	
	/* CSS3 Transitions */
	-webkit-transition-property: opacity, margin-bottom, visibility;
	-moz-transition-property: opacity, margin-bottom, visibility;
	-o-transition-property: opacity, margin-bottom, visibility;
	-ms-transition-property: opacity, margin-bottom, visibility;
	transition-property: opacity, margin-bottom, visibility;
	}
	
/* --- Arrow --- */	
.qlabs_tooltip_top > span:after,
.qlabs_tooltip_focus_top > span:after
	{
    border-left: 8px solid transparent !important;
    border-right: 8px solid transparent !important;
	border-top: 8px solid #000;
	border-bottom: 0 !important;
	bottom: -8px;
	left: 15px;
	}

/* --- On Hover --- */
	 
.qlabs_tooltip_top:hover > span  
	{
	margin-bottom: 10px; /* End Position */
	visibility: visible;
	opacity: 1;
	} 
	
/* --- Click Event --- */
	 
.qlabs_tooltip_top.event_click:hover > span  
	{
	margin-bottom: 30px; /* Start Position */
	visibility: hidden;
	opacity: 0;
	}
	
.qlabs_tooltip_top.event_click_active > span  
	{
	margin-bottom: 10px; /* End Position */
	visibility: visible;
	opacity: 1;
	}	
	 

/* --- On Active Fix for iOS mobile devices --- */
.qlabs_tooltip_top:active > span
	{
    -webkit-transition-property: opacity;
    -moz-transition-property: opacity;
    -o-transition-property: opacity;
    -ms-transition-property: opacity;
    transition-property: opacity;
	}            
        
        
/* --- On Focus --- */
.qlabs_tooltip_focus_top input:focus + span,
.qlabs_tooltip_focus_top textarea:focus + span
	{	
	margin-bottom: 10px; /* End Position */
	visibility: visible;
	opacity: 1;
	}

/* =========================================================================================== */
/* ========================================== TOP CENTER ===================================== */
/* =========================================================================================== */
	
/* --- Container --- */
.qlabs_tooltip_top_center > span,
.qlabs_tooltip_focus_top_center > span
	{
	position: absolute;
	left: 50%;
	bottom: 100%;
	-webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
	margin-bottom: 30px; /* Start Position */
	
	/* CSS3 Transitions */
	-webkit-transition-property: opacity, margin-bottom, visibility;
	-moz-transition-property: opacity, margin-bottom, visibility;
	-o-transition-property: opacity, margin-bottom, visibility;
	-ms-transition-property: opacity, margin-bottom, visibility;
	transition-property: opacity, margin-bottom, visibility;
	}
	
/* --- Arrow --- */	
.qlabs_tooltip_top_center > span:after,
.qlabs_tooltip_focus_top_center > span:after
	{
    border-left: 8px solid transparent !important;
    border-right: 8px solid transparent !important;
	border-top: 8px solid #000;
	border-bottom: 0 !important;
	bottom: -8px;
	left: 44%;
	}

/* --- On Hover --- */ 
	 
.qlabs_tooltip_top_center:hover > span  
	{	
	margin-bottom: 10px; /* End Position */
	 visibility: visible;
	opacity: 1; 
	 
	} 

/* --- Click Event --- */
	 
.qlabs_tooltip_top_center.event_click:hover > span  
	{
	margin-bottom: 30px; /* Start Position */
	visibility: hidden;
	opacity: 0;
	}
	
.qlabs_tooltip_top_center.event_click_active > span  
	{
	margin-bottom: 10px; /* End Position */
	visibility: visible;
	opacity: 1;
	}	
	
 /* --- On Active Fix for iOS mobile devices --- */
.qlabs_tooltip_top_center:active > span
{	  
    -webkit-transition-property: opacity;
    -moz-transition-property: opacity;
    -o-transition-property: opacity;
    -ms-transition-property: opacity;
    transition-property: opacity;
}     

/* --- On Focus --- */
.qlabs_tooltip_focus_top_center input:focus + span,
.qlabs_tooltip_focus_top_center textarea:focus + span
	{	
	margin-bottom: 10px; /* End Position */
	visibility: visible;
	opacity: 1;
	}	
	
/* =========================================================================================== */
/* ======================================== BOTTOM ========================================== */
/* =========================================================================================== */

/* --- Container --- */
.qlabs_tooltip_bottom > span,
.qlabs_tooltip_focus_bottom > span
	{
	left: -10px;
	top: 100%;
	margin-top: 30px; /* Start Position */
	
	/* CSS3 Transitions */
	-webkit-transition-property: opacity, margin-top, visibility;
	-moz-transition-property: opacity, margin-top, visibility;
	-o-transition-property: opacity, margin-top, visibility;
	-ms-transition-property: opacity, margin-top, visibility;
	transition-property: opacity, margin-top, visibility;
	}
	
/* --- Arrow --- */	
.qlabs_tooltip_bottom > span:after,
.qlabs_tooltip_focus_bottom > span:after
	{
    border-left: 8px solid transparent !important;
    border-right: 8px solid transparent !important;
	border-top: 0 !important;
	border-bottom: 8px solid #000;
	top: -8px;
	left: 15px;
	}

/* --- On Hover --- */
.qlabs_tooltip_bottom:hover > span
	{	
	margin-top: 10px; /* End Position */
	visibility: visible;
	opacity: 1;
	}
	
/* --- Click Event --- */
	 
.qlabs_tooltip_bottom.event_click:hover > span  
	{
	margin-top: 30px; /* Start Position */
	visibility: hidden;
	opacity: 0;
	}
	
.qlabs_tooltip_bottom.event_click_active > span  
	{
	margin-top: 10px; /* End Position */
	visibility: visible;
	opacity: 1;
	}	
	
/* --- On Active Fix for iOS mobile devices --- */
.qlabs_tooltip_bottom:active > span
{	  
    -webkit-transition-property: opacity;
    -moz-transition-property: opacity;
    -o-transition-property: opacity;
    -ms-transition-property: opacity;
    transition-property: opacity;
}     

/* --- On Focus --- */
.qlabs_tooltip_focus_bottom input:focus + span,
.qlabs_tooltip_focus_bottom textarea:focus + span
	{	
	margin-top: 10px; /* End Position */
	visibility: visible;
	opacity: 1;
	}

/* =========================================================================================== */
/* ======================================== BOTTOM CENTER ==================================== */
/* =========================================================================================== */

	
/* --- Container --- */
.qlabs_tooltip_bottom_center > span,
.qlabs_tooltip_focus_bottom_center > span
	{
	position: absolute;
	left: 50%;
	top: 100%;
	-webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);

	margin-top: 30px; /* Start Position */
	
	/* CSS3 Transitions */
	-webkit-transition-property: opacity, margin-top, visibility;
	-moz-transition-property: opacity, margin-top, visibility;
	-o-transition-property: opacity, margin-top, visibility;
	-ms-transition-property: opacity, margin-top, visibility;
	transition-property: opacity, margin-top, visibility;
	}
	
/* --- Arrow --- */	
.qlabs_tooltip_bottom_center > span:after,
.qlabs_tooltip_focus_bottom_center > span:after
	{
    border-left: 8px solid transparent !important;
    border-right: 8px solid transparent !important;
	border-top: 0 !important;
	border-bottom: 8px solid #000;
	top: -8px;
	left: 44%;
	}

/* --- On Hover --- */
.qlabs_tooltip_bottom_center:hover > span
	{	
	margin-top: 10px; /* End Position */
	visibility: visible;
	opacity: 1;
	}

/* --- Click Event --- */ 
.qlabs_tooltip_bottom_center.event_click:hover > span  
	{
	margin-top: 30px; /* Start Position */
	visibility: hidden;
	opacity: 0;
	}
	
.qlabs_tooltip_bottom_center.event_click_active > span  
	{
	margin-top: 10px; /* End Position */
	visibility: visible;
	opacity: 1;
	}	
	
/* --- On Active Fix for iOS mobile devices --- */
.qlabs_tooltip_bottom_center:active > span
{	  
    -webkit-transition-property: opacity;
    -moz-transition-property: opacity;
    -o-transition-property: opacity;
    -ms-transition-property: opacity;
    transition-property: opacity;
}             
        
/* --- On Focus --- */
.qlabs_tooltip_focus_bottom_center input:focus + span,
.qlabs_tooltip_focus_bottom_center textarea:focus + span
	{	
	margin-top: 10px; /* End Position */
	visibility: visible;
	opacity: 1;
	}	

/* =========================================================================================== */
/* ========================================= RIGHT =========================================== */
/* =========================================================================================== */

/* --- Container --- */	
.qlabs_tooltip_right > span,
.qlabs_tooltip_focus_right > span
	{
	left: 100%;
	top: -7px;
	margin-left: 35px; /* Start Position */
	
	/* CSS3 Transitions */
	-webkit-transition-property: opacity, margin-left, visibility;
	-moz-transition-property: opacity, margin-left, visibility;
	-o-transition-property: opacity, margin-left, visibility;
	-ms-transition-property: opacity, margin-left, visibility;
	transition-property: opacity, margin-left, visibility;
	}
	
/* --- Arrow --- */
.qlabs_tooltip_right > span:after,
.qlabs_tooltip_focus_right > span:after
	{
    border-left: 0 !important;
    border-right: 8px solid #000;
	border-top: 8px solid transparent !important;
	border-bottom: 8px solid transparent !important;
	top: 11px;
	left: -8px;
	}

/* --- On Hover --- */
.qlabs_tooltip_right:hover > span
	{	
	margin-left: 15px; /* End Position */
	visibility: visible;
	opacity: 1;
	}

/* --- Click Event --- */ 
.qlabs_tooltip_right.event_click:hover > span  
	{
	margin-left: 35px; /* Start Position */
	visibility: hidden;
	opacity: 0;
	}
	
.qlabs_tooltip_right.event_click_active > span  
	{
	margin-left: 15px; /* End Position */
	visibility: visible;
	opacity: 1;
	}
	
        /* --- On Active Fix for iOS mobile devices --- */
.qlabs_tooltip_right:active > span
{	  
    -webkit-transition-property: opacity;
    -moz-transition-property: opacity;
    -o-transition-property: opacity;
    -ms-transition-property: opacity;
    transition-property: opacity;
}     

/* --- On Focus --- */
.qlabs_tooltip_focus_right input:focus + span,
.qlabs_tooltip_focus_right textarea:focus + span
	{	
	margin-left: 15px; /* End Position */
	visibility: visible;
	opacity: 1;
	}
	
/* =========================================================================================== */
/* ========================================== LEFT ============================================ */
/* =========================================================================================== */

/* --- Container --- */	
.qlabs_tooltip_left > span,
.qlabs_tooltip_focus_left > span
	{
	right: 100%;
	top: -7px;
	margin-right: 35px; /* Start Position */
	
	/* CSS3 Transitions */
	-webkit-transition-property: opacity, margin-right, visibility;
	-moz-transition-property: opacity, margin-right, visibility;
	-o-transition-property: opacity, margin-right, visibility;
	-ms-transition-property: opacity, margin-right, visibility;
	transition-property: opacity, margin-right, visibility;
	}
	
/* --- Arrow --- */
.qlabs_tooltip_left > span:after,
.qlabs_tooltip_focus_left > span:after
	{
    border-left: 8px solid #000;
    border-right: 0 !important;
	border-top: 8px solid transparent !important;
	border-bottom: 8px solid transparent !important;
	top: 11px;
	right: -8px;
	}

/* --- On Hover --- */
.qlabs_tooltip_left:hover > span
	{	
	margin-right: 15px; /* End Position */
	visibility: visible;
	opacity: 1;
	}

/* --- Click Event --- */ 
.qlabs_tooltip_left.event_click:hover > span  
	{
	margin-right: 35px; /* Start Position */
	visibility: hidden;
	opacity: 0;
	}
	
.qlabs_tooltip_left.event_click_active > span  
	{
	margin-right: 15px; /* End Position */
	visibility: visible;
	opacity: 1;
	}
	
        /* --- On Active Fix for iOS mobile devices --- */
.qlabs_tooltip_left:active > span
{	  
    -webkit-transition-property: opacity;
    -moz-transition-property: opacity;
    -o-transition-property: opacity;
    -ms-transition-property: opacity;
    transition-property: opacity;
}     

/* --- On Focus --- */
.qlabs_tooltip_focus_left input:focus + span,
.qlabs_tooltip_focus_left textarea:focus + span
	{	
	margin-right: 15px; /* End Position */
	visibility: visible;
	opacity: 1;
	}	
	
/* =========================================================================================== */
/* =================================== DIAGONAL RIGHT BOTTOM ================================= */
/* =========================================================================================== */
	
/* --- Container --- */	
.qlabs_tooltip_diagonal_right_bottom > span,
.qlabs_tooltip_focus_diagonal_right_bottom > span
	{
	left: 100%;
	top: 100%;
	margin-top: 35px; /* Start Position */
	margin-left: 15px; /* Start Position */
	
	/* CSS3 Transitions */
	-webkit-transition-property: opacity, margin-left, margin-top, visibility;
	-moz-transition-property: opacity, margin-left, margin-top, visibility;
	-o-transition-property: opacity, margin-left, margin-top, visibility;
	-ms-transition-property: opacity, margin-left, margin-top, visibility;
	transition-property: opacity, margin-left, margin-top, visibility;
	}
	
/* --- Arrow --- */
.qlabs_tooltip_diagonal_right_bottom > span:after,
.qlabs_tooltip_focus_diagonal_right_bottom > span:after
	{
    border-left: 0 !important;
    border-right: 10px solid transparent !important;
	border-top: 0 !important;
	border-bottom: 10px solid #000;
	top: -10px;
	left: 5px;
	}

/* --- On Hover --- */
.qlabs_tooltip_diagonal_right_bottom:hover > span
	{	
	margin-top: 15px; /* End Position */
	margin-left: -5px; /* End Position */
	visibility: visible;
	opacity: 1;
         
	}
      
/* --- Click Event --- */ 
.qlabs_tooltip_diagonal_right_bottom.event_click:hover > span  
	{
	margin-top: 35px; /* Start Position */
	margin-left: 15px; /* Start Position */
	visibility: hidden;
	opacity: 0;
	}
	
.qlabs_tooltip_diagonal_right_bottom.event_click_active > span  
	{
	margin-top: 15px; /* End Position */
	margin-left: -5px; /* End Position */
	visibility: visible;
	opacity: 1;
	}
	
/* --- On Active Fix for iOS mobile devices --- */
.qlabs_tooltip_diagonal_right_bottom:active > span
{	  
    -webkit-transition-property: opacity;
    -moz-transition-property: opacity;
    -o-transition-property: opacity;
    -ms-transition-property: opacity;
    transition-property: opacity;
}          
	
/* --- On Focus --- */
.qlabs_tooltip_focus_diagonal_right_bottom input:focus + span,
.qlabs_tooltip_focus_diagonal_right_bottom textarea:focus + span
	{	
	margin-top: 15px; /* End Position */
	margin-left: -5px; /* End Position */
	visibility: visible;
	opacity: 1;
	}
	

/* =========================================================================================== */
/* =================================== DIAGONAL RIGHT TOP===================================== */
/* =========================================================================================== */

	/* --- Container --- */	
.qlabs_tooltip_diagonal_right_top > span,
.qlabs_tooltip_focus_diagonal_right_top > span
	{
	left: 100%; 
	bottom: 100%;
	  
	margin-bottom: 30px; /* Start Position */
	margin-left: 5px; /* Start Position */
	
	/* CSS3 Transitions */
	-webkit-transition-property: opacity, margin-left, margin-bottom, visibility;
	-moz-transition-property: opacity, margin-left,margin-bottom, visibility;
	-o-transition-property: opacity, margin-left,margin-bottom, visibility;
	-ms-transition-property: opacity, margin-left, margin-bottom, visibility;
	transition-property: opacity, margin-left, margin-bottom, visibility;
	}
	
/* --- Arrow --- */
.qlabs_tooltip_diagonal_right_top > span:after,
.qlabs_tooltip_focus_diagonal_right_top > span:after
	{
		border-left: 0px solid rgba(0, 0, 0, 0) !important;
		border-right: 10px solid rgba(0, 0, 0, 0) !important;
		border-top: 10px solid #000;
		border-bottom: 0 !important;
		bottom: -10px;
		left: 5px;
	}

/* --- On Hover --- */
.qlabs_tooltip_diagonal_right_top:hover > span
	{	
	
	margin-bottom: 10px; /* End Position */
	margin-left: -5px; /* End Position */
	visibility: visible;
	opacity: 1;
	}

/* --- Click Event --- */ 
.qlabs_tooltip_diagonal_right_top.event_click:hover > span  
	{
	margin-bottom: 30px; /* Start Position */
	margin-left: 5px; /* Start Position */
	visibility: hidden;
	opacity: 0;
	}
	
.qlabs_tooltip_diagonal_right_top.event_click_active > span  
	{
	margin-bottom: 10px; /* End Position */
	margin-left: -5px; /* End Position */
	visibility: visible;
	opacity: 1;
	}

        /* --- On Active Fix for iOS mobile devices --- */
.qlabs_tooltip_diagonal_right_top:active > span
{	  
    -webkit-transition-property: opacity ;
    -moz-transition-property: opacity ;
    -o-transition-property: opacity ;
    -ms-transition-property: opacity ;
    transition-property: opacity  ;
}     

/* --- On Focus --- */
.qlabs_tooltip_focus_diagonal_right_top input:focus + span,
.qlabs_tooltip_focus_diagonal_right_top textarea:focus + span
	{	
	margin-top: 15px; /* End Position */
	margin-left: -5px; /* End Position */
	visibility: visible;
	opacity: 1;
	}
	
/* =========================================================================================== */
/* ==================================== DIAGONAL LEFT BOTTOM ================================= */
/* =========================================================================================== */

/* --- Container --- */	
.qlabs_tooltip_diagonal_left_bottom > span,
.qlabs_tooltip_focus_diagonal_left_bottom > span
	{
	right: 100%;
	top: 100%;
	margin-top: 35px; /* Start Position */
	margin-right: 15px; /* Start Position */
	
	/* CSS3 Transitions */
	-webkit-transition-property: opacity, margin-right, margin-top, visibility;
	-moz-transition-property: opacity, margin-right, margin-top, visibility;
	-o-transition-property: opacity, margin-right, margin-top, visibility;
	-ms-transition-property: opacity, margin-right, margin-top, visibility;
	transition-property: opacity, margin-right, margin-top, visibility;
	}
	
/* --- Arrow --- */
.qlabs_tooltip_diagonal_left_bottom > span:after,
.qlabs_tooltip_focus_diagonal_left_bottom > span:after
	{
    border-left: 10px solid transparent !important;
    border-right: 0 !important;
	border-top: 0 !important;
	border-bottom: 10px solid #000;
	top: -10px;
	right: 5px;
	}

/* --- On Hover --- */
.qlabs_tooltip_diagonal_left_bottom:hover > span
	{	
	margin-top: 15px; /* End Position */
	margin-right: -5px; /* End Position */
	visibility: visible;
	opacity: 1;
	}

/* --- Click Event --- */ 
.qlabs_tooltip_diagonal_left_bottom.event_click:hover > span  
	{
	margin-top: 35px; /* Start Position */
	margin-right: 15px; /* Start Position */
	visibility: hidden;
	opacity: 0;
	}
	
.qlabs_tooltip_diagonal_left_bottom.event_click_active > span  
	{
	margin-top: 15px; /* End Position */
	margin-right: -5px; /* End Position */
	visibility: visible;
	opacity: 1;
	}
	
/* --- On Active Fix for iOS mobile devices --- */
.qlabs_tooltip_diagonal_left_bottom:active > span
{	  
    -webkit-transition-property: opacity;
    -moz-transition-property: opacity;
    -o-transition-property: opacity;
    -ms-transition-property: opacity;
    transition-property: opacity;
}     

/* --- On Focus --- */
.qlabs_tooltip_focus_diagonal_left_bottom input:focus + span,
.qlabs_tooltip_focus_diagonal_left_bottom textarea:focus + span
	{	
	margin-top: 15px; /* End Position */
	margin-right: -5px; /* End Position */
	visibility: visible;
	opacity: 1;
	}
	
/* =========================================================================================== */
/* ==================================== DIAGONAL LEFT TOP ==================================== */
/* =========================================================================================== */

	/* --- Container --- */	
.qlabs_tooltip_diagonal_left_top > span,
.qlabs_tooltip_focus_diagonal_left_top > span
	{
	right: 100%;
	bottom: 100%;
	  
	margin-bottom: 30px; /* Start Position */
	margin-right: 5px; /* Start Position */
	
	/* CSS3 Transitions */
	-webkit-transition-property: opacity, margin-right, margin-bottom, visibility;
	-moz-transition-property: opacity, margin-right,margin-bottom, visibility;
	-o-transition-property: opacity, margin-right,margin-bottom, visibility;
	-ms-transition-property: opacity, margin-right, margin-bottom, visibility;
	transition-property: opacity, margin-right, margin-bottom, visibility;
	}
	
/* --- Arrow --- */
.qlabs_tooltip_diagonal_left_top > span:after,
.qlabs_tooltip_focus_diagonal_left_top > span:after
	{
		border-left: 10px solid rgba(0, 0, 0, 0) !important;
		border-right: 0px solid rgba(0, 0, 0, 0) !important;
		border-top: 10px solid #000;
		border-bottom: 0 !important;
		bottom: -10px;
		right: 5px;
	}

/* --- On Hover --- */
.qlabs_tooltip_diagonal_left_top:hover > span
	{
	margin-bottom: 10px; /* End Position */
	margin-right: -5px; /* End Position */
	visibility: visible;
	opacity: 1;
	}

/* --- Click Event --- */ 
.qlabs_tooltip_diagonal_left_top.event_click:hover > span  
	{
	margin-bottom: 30px; /* Start Position */
	margin-right: 5px; /* Start Position */
	visibility: hidden;
	opacity: 0;
	}
	
.qlabs_tooltip_diagonal_left_top.event_click_active > span  
	{
	margin-bottom: 10px; /* End Position */
	margin-right: -5px; /* End Position */
	visibility: visible;
	opacity: 1;
	}
	
        /* --- On Active Fix for iOS mobile devices --- */
.qlabs_tooltip_diagonal_left_top:active > span
{	  
    -webkit-transition-property: opacity;
    -moz-transition-property: opacity;
    -o-transition-property: opacity;
    -ms-transition-property: opacity;
    transition-property: opacity;
}     

/* --- On Focus --- */
.qlabs_tooltip_focus_diagonal_left_top input:focus + span,
.qlabs_tooltip_focus_diagonal_left_top textarea:focus + span
	{	
	margin-top: 15px; /* End Position */
	margin-left: -5px; /* End Position */
	visibility: visible;
	opacity: 1;
	}

        
        