/**
* bstrap 1.0
*
*
**/

/* Tooltip */

.tooltip-hover {
	position:relative;
}

.tooltip-show {
	position:relative;
}

.tooltip-text, .tooltip-text:after {
	position:absolute;
	background-color: rgba(0,0,0,1.0);
	color: #fff;
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.2s ease-in, 
		bottom 0.2s ease-in-out;
}

.tooltip-text {
	bottom: 50%;
	left: -40%;
	width: auto;
	white-space: normal;
}

.tooltip-text:after {
	top:100%;
	left:30%;
	border: 4px solid transparent;
	border-top-color: rgba(0,0,0,1.0);
	background: transparent;
	content: "";
}

.tooltip-hover:hover > .tooltip-text,
.tooltip-hover:hover > .tooltip-text:after,
.tooltip-show > .tooltip-text,
.tooltip-show > .tooltip-text:after {
	visibility: visible;
	opacity: 1;
	bottom:140%;
}

/* Tooltip customization rules.
** Do not customize here. Copy into your stylesheet. 
*/

/* text bubble */
.tooltip-text {
	background-color: rgba(0,0,0,.8);
	color: #fff;
	white-space: normal; /* tooltip text wraps to width */
	font-size: 0.83em;
	border-radius: 3px;
	padding: 9px 11px;
	box-shadow:0 0 0 2px rgba(250,250,250,.9) inset;
}

/* arrow */
.tooltip-text:after {
	border-top-color: rgba(250,250,250,.9);
}

/* Phones */
@media (max-width: 480px) {
	.tooltip-text {
		left: 0;
		padding: 4px 6px;
		width: 120px;
	}
}

/* Tablet protrait */
@media (min-width: 480px) and (max-width: 768px) {
	.tooltip-text {
		left: 0;
		padding: 4px 6px;
		width: 140px;
	}
}

/* Small devices landscape (tablets, 768px and up) */
@media (min-width: 768px) { 
	.tooltip-text {
		left: -20%;
		padding: 6px 8px;
		width: 160px;
	}
}

/* Medium devices (desktops, 992px and up) */
@media (min-width: 992px) {
	.tooltip-text {
		left: -40%;
		padding: 9px 11px;
		width: 180px;
	}
}

/* Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {
	
}

/** END COPY **/
