.tooltips {

	position: relative;

	z-index: 999;

}



/* Trigger text */



.tooltips-item {

	cursor: pointer;

	display: inline-block;

	font-weight: 700;

}



/* Gap filler */



.tooltips-item::after {

	content: '';

	position: absolute;

	width: 280px;

	height: 20px;

	bottom: 100%;

	left: 50%;

	pointer-events: none;

	-webkit-transform: translateX(-50%);

	transform: translateX(-50%);

}



.tooltips:hover .tooltips-item::after {

	pointer-events: auto;

}



/* Tooltip */



.tooltips-content {

	position: absolute;

	z-index: 9999;

	width: 280px;

	left: 50%;

	margin: 0 0 77px -140px;

	bottom: 100%;

	line-height: 1.4;

	box-shadow: -5px -5px 15px rgba(48,54,61,0.2);

	background: rgba(255,181,51,.9);

	opacity: 0;

	cursor: default;

	pointer-events: none;

	border-radius:6px;

}



.tooltips-effect-1 .tooltips-content {

	-webkit-transform: translate3d(0,-10px,0);

	transform: translate3d(0,-10px,0);

	-webkit-transition: opacity 0.3s, -webkit-transform 0.3s;

	transition: opacity 0.3s, transform 0.3s;

}



.tooltips-effect-2 .tooltips-content {

	-webkit-transform-origin: 50% calc(100% + 10px);

	transform-origin: 50% calc(100% + 10px);

	-webkit-transform: perspective(1000px) rotate3d(1,0,0,45deg);

	transform: perspective(1000px) rotate3d(1,0,0,45deg);

	-webkit-transition: opacity 0.2s, -webkit-transform 0.2s;

	transition: opacity 0.2s, transform 0.2s;

}



.tooltips-effect-3 .tooltips-content {

	-webkit-transform: translate3d(0,10px,0) rotate3d(1,1,0,25deg);

	transform: translate3d(0,10px,0) rotate3d(1,1,0,25deg);

	-webkit-transition: opacity 0.3s, -webkit-transform 0.3s;

	transition: opacity 0.3s, transform 0.3s;

}



.tooltips-effect-4 .tooltips-content {

	-webkit-transform-origin: 50% 100%;

	transform-origin: 50% 100%;

	-webkit-transform: scale3d(0.7,0.3,1);

	transform: scale3d(0.7,0.3,1);

	-webkit-transition: opacity 0.2s, -webkit-transform 0.2s;

	transition: opacity 0.2s, transform 0.2s;

}



.tooltips-effect-5 .tooltips-content {

	width: 180px;

	margin-left: -90px;

	-webkit-transform-origin: 50% calc(100% + 6em);

	transform-origin: 50% calc(100% + 6em);

	-webkit-transform: rotate3d(0,0,1,15deg);

	transform: rotate3d(0,0,1,15deg);

	-webkit-transition: opacity 0.2s, -webkit-transform 0.2s;

	transition: opacity 0.2s, transform 0.2s;

	-webkit-transition-timing-function: ease, cubic-bezier(.17,.67,.4,1.39);

	transition-timing-function: ease, cubic-bezier(.17,.67,.4,1.39);

}



.tooltips:hover .tooltips-content {

	pointer-events: auto;

	opacity: 1;

	-webkit-transform: translate3d(0,0,0) rotate3d(0,0,0,0);

	transform: translate3d(0,0,0) rotate3d(0,0,0,0);

}



.tooltips.tooltips-effect-2:hover .tooltips-content {

	-webkit-transform: perspective(1000px) rotate3d(1,0,0,0deg);

	transform: perspective(1000px) rotate3d(1,0,0,0deg);

}



/* Arrow */



.tooltips-content::after {

	content: '';

	top: 100%;

	left: 50%;

	border: solid transparent;

	height: 0;

	width: 0;

	position: absolute;

	pointer-events: none;

	border-color: transparent;

	border-top-color: rgba(255,181,51,.9);

	border-width: 10px;

	margin-left: -10px;

}



/* Tooltip content*/



.tooltips-content img {

	position: relative;

	height: 170px;

	display: block;

	float: left;

	margin-right: 1em;

}



.tooltips-text {

	line-height: 1.35;

	display: block;

	padding: 1em;

	color: #333;

}



.tooltips-effect-5 .tooltips-text {

	padding: 1.4em;

}



.tooltips-text a {

	font-weight: bold;

}



/* =================CAMERAS SENSORS===========================================*/



.tooltips {

	position: relative;

	z-index: 999;

}



/* Trigger text */



.tooltips-item {

	cursor: pointer;

	display: inline-flex;

	font-weight: 700;

}



/* Gap filler */



.tooltips-item::after {

	content: '';

	position: absolute;

	width: 280px;

	height: 20px;

	bottom: 100%;

	left: 50%;

	pointer-events: none;

	-webkit-transform: translateX(-50%);

	transform: translateX(-50%);

}



.tooltips:hover .tooltips-item::after {

	pointer-events: auto;

}



/* Tooltip */



.tooltips-content {

	position: absolute;

	z-index: 9999;

	width: 280px;

	left: 50%;

	margin: 0 0 77px -140px;

	bottom: 100%;

	line-height: 1.4;

	box-shadow: -5px -5px 15px rgba(48,54,61,0.2);

	background: rgba(255,181,51,.9);

	opacity: 0;

	cursor: default;

	pointer-events: none;

	border-radius:6px;

}



.tooltips-effect-1 .tooltips-content {

	-webkit-transform: translate3d(0,-10px,0);

	transform: translate3d(0,-10px,0);

	-webkit-transition: opacity 0.3s, -webkit-transform 0.3s;

	transition: opacity 0.3s, transform 0.3s;

}



.tooltips-effect-2 .tooltips-content {

	-webkit-transform-origin: 50% calc(100% + 10px);

	transform-origin: 50% calc(100% + 10px);

	-webkit-transform: perspective(1000px) rotate3d(1,0,0,45deg);

	transform: perspective(1000px) rotate3d(1,0,0,45deg);

	-webkit-transition: opacity 0.2s, -webkit-transform 0.2s;

	transition: opacity 0.2s, transform 0.2s;

}



.tooltips-effect-3 .tooltips-content {

	-webkit-transform: translate3d(0,10px,0) rotate3d(1,1,0,25deg);

	transform: translate3d(0,10px,0) rotate3d(1,1,0,25deg);

	-webkit-transition: opacity 0.3s, -webkit-transform 0.3s;

	transition: opacity 0.3s, transform 0.3s;

}



.tooltips-effect-4 .tooltips-content {

	-webkit-transform-origin: 50% 100%;

	transform-origin: 50% 100%;

	-webkit-transform: scale3d(0.7,0.3,1);

	transform: scale3d(0.7,0.3,1);

	-webkit-transition: opacity 0.2s, -webkit-transform 0.2s;

	transition: opacity 0.2s, transform 0.2s;

}



.tooltips-effect-5 .tooltips-content {

	width: 180px;

	margin-left: -90px;

	-webkit-transform-origin: 50% calc(100% + 6em);

	transform-origin: 50% calc(100% + 6em);

	-webkit-transform: rotate3d(0,0,1,15deg);

	transform: rotate3d(0,0,1,15deg);

	-webkit-transition: opacity 0.2s, -webkit-transform 0.2s;

	transition: opacity 0.2s, transform 0.2s;

	-webkit-transition-timing-function: ease, cubic-bezier(.17,.67,.4,1.39);

	transition-timing-function: ease, cubic-bezier(.17,.67,.4,1.39);

}



.tooltips:hover .tooltips-content {

	pointer-events: auto;

	opacity: 1;

	-webkit-transform: translate3d(0,0,0) rotate3d(0,0,0,0);

	transform: translate3d(0,0,0) rotate3d(0,0,0,0);

}



.tooltips.tooltips-effect-2:hover .tooltips-content {

	-webkit-transform: perspective(1000px) rotate3d(1,0,0,0deg);

	transform: perspective(1000px) rotate3d(1,0,0,0deg);

}



/* Arrow */



.tooltips-content::after {

	content: '';

	top: 100%;

	left: 50%;

	border: solid transparent;

	height: 0;

	width: 0;

	position: absolute;

	pointer-events: none;

	border-color: transparent;

	border-top-color: rgba(255,181,51,.9);

	border-width: 10px;

	margin-left: -10px;

}



/* Tooltip content*/



.tooltips-content img {

	position: relative;

	height: 170px;

	display: block;

	float: left;

	margin-right: 1em;

}



.tooltips-text {

	line-height: 1.35;

	display: block;

	padding: 1em;

	color: #333;
	position: absolute;

}



.tooltips-effect-5 .tooltips-text {

	padding: 1.4em;

}



.tooltips-text a {

	font-weight: bold;

}

/*end */



body.cameras-sensors .tooltips-content {

	background:rgba(201,76,20,.9);} 

/*arrow*/

body.cameras-sensors .tooltips-content::after{

	border-top-color: rgba(201,76,20,.9);}

body.cameras-sensors .tooltips-text {

	color:#FFFFFF;}

