.jBox-wrapper { box-sizing: border-box; text-align: left; }
.jBox-title, .jBox-content, .jBox-container { box-sizing: border-box; position: relative; word-break: break-word; }
.jBox-container { font-size: 12px; color: #3c505e; background-color: #e8e9ea; }
.jBox-content { overflow: hidden; padding: 0 15px 15px 15px; transition: opacity 0.1s; }

.jBox-Tooltip .jBox-container { border-radius: 2px; box-shadow: 0 0 3px rgba(0,0,0,0.3); }
.jBox-Tooltip .jBox-title { padding: 15px 15px 5px 15px; font-weight: bold; }

.jBox-pointer { position: absolute; overflow: hidden; }
.jBox-pointer:after { content: ''; width: 20px; height: 20px; position: absolute; transform: rotate(45deg); background-color: #e8e9ea; }

.jBox-pointer-bottom { bottom: 0; width: 30px; height: 12px; }
.jBox-pointer-bottom:after { left: 5px; bottom: 6px; box-shadow:  1px  1px 2px rgba(0,0,0,0.15); }

.jBox-animated-slideUp { animation: jBox-slideUp 0.1s; }
.jBox-animated-slideDown { animation: jBox-slideDown 0.1s; }

[class^="jBox-animated-"], [class*=" jBox-animated-"] { animation-fill-mode: both; }

@keyframes jBox-slideUp {
	0%   { transform: translateY(0); }
	100% { transform: translateY(-300px); opacity: 0; }
	}
@keyframes jBox-slideDown {
	0%   { transform: translateY(0); }
	100% { transform: translateY(300px); opacity: 0; }
	}