/************************  TOOLTIP LINE **********************************
/************************* STARTS HERE **********************************/
.dt-sc-tooltip-one, .dt-sc-tooltip-two, .dt-sc-tooltip-three { background:#f5f5f5; color: #000; display: inline; padding: 10px 19px; position: relative; text-transform: uppercase; z-index: 999; }
.dt-sc-tooltip-one, .dt-sc-tooltip-two .tooltip-item, .dt-sc-tooltip-three .tooltip-item { font-weight:500; }
.dt-sc-tooltip-one .tooltip-content, .dt-sc-tooltip-two .tooltip-content, .dt-sc-tooltip-three .tooltip-content { text-transform:none; }

/* Gap filler */
.dt-sc-tooltip-one::after { content: ''; position: absolute; width: 100%; height: 20px; top: 100%; left: 50%; pointer-events: none; -webkit-transform: translateX(-50%); transform: translateX(-50%); }
.dt-sc-tooltip-one:hover::after { pointer-events: auto; }

/* Tooltip */
.dt-sc-tooltip-one .tooltip-content { position: absolute; z-index: 9999; width: 200px; left: 50%; bottom: 100%; text-align: center; font-weight: 400; background: transparent; opacity: 0; margin: 0 0 20px -100px; cursor: default; pointer-events: none; -webkit-transition: opacity 0.3s 0.3s; transition: opacity 0.3s 0.3s; }
.dt-sc-tooltip-one:hover .tooltip-content { opacity: 1; pointer-events: auto; -webkit-transition-delay: 0s; transition-delay: 0s; }
.dt-sc-tooltip-one.bottom .tooltip-content { top:100%; bottom:auto; }

.dt-sc-tooltip-one .tooltip-content span { display: block; }
.dt-sc-tooltip-one .tooltip-text { border-bottom-width: 5px; border-bottom-style: solid; overflow: hidden; -webkit-transform: scale3d(0,1,1); transform: scale3d(0,1,1); -webkit-transition: -webkit-transform 0.3s 0.3s; transition: transform 0.3s 0.3s; }
.dt-sc-tooltip-one:hover .tooltip-text { -webkit-transition-delay: 0s; transition-delay: 0s; -webkit-transform: scale3d(1,1,1); transform: scale3d(1,1,1); }
.dt-sc-tooltip-one .tooltip-inner { padding: 10px; -webkit-transform: translate3d(0,100%,0); transform: translate3d(0,100%,0); webkit-transition: -webkit-transform 0.3s; transition: transform 0.3s; color:#fff; }
.dt-sc-tooltip-one:hover .tooltip-inner, .dt-sc-tooltip-one.bottom:hover .tooltip-inner { -webkit-transition-delay: 0.3s; transition-delay: 0.3s; -webkit-transform: translate3d(0,0,0); transform: translate3d(0,0,0); }

/* Arrow */
.dt-sc-tooltip-one .tooltip-content::after { content: ''; bottom: -20px; left: 50%; border: solid transparent; height: 0; width: 0; position: absolute; pointer-events: none; border-color: transparent; border-width: 10px; margin-left: -10px; }

.dt-sc-tooltip-one.bottom .tooltip-content::after {  top: -20px; bottom:auto; border-color: transparent; }
.dt-sc-tooltip-one.bottom .tooltip-content { margin-top:20px; }
.dt-sc-tooltip-one.bottom .tooltip-content .tooltip-text { border-top-width: 5px; border-top-style: solid; border-bottom:0; }
.dt-sc-tooltip-one.bottom .tooltip-content:hover .tooltip-text { -webkit-transition-delay: 0s; transition-delay: 0s; -webkit-transform: scale3d(1,1,1); transform: scale3d(1,1,1); }
.dt-sc-tooltip-one.bottom .tooltip-inner { -webkit-transform: translate3d(0,-100%,0); transform: translate3d(0,-100%,0); }

/************************  TOOLTIP BOX **********************************
/************************* STARTS HERE **********************************/
/* Trigger text */
.dt-sc-tooltip-two .tooltip-item { cursor: pointer; z-index: 100; position: relative; display: inline-block; -webkit-transition: background-color 0.3s, color 0.3s, -webkit-transform 0.3s; transition: background-color 0.3s, color 0.3s, transform 0.3s; }
.dt-sc-tooltip-two:hover .tooltip-item { color: #fff; -webkit-transform: translate3d(0,-5px,0); transform: translate3d(0,-5px,0); }

/* Tooltip */
.dt-sc-tooltip-two .tooltip-content { position: absolute; z-index: 99; width: 180px; left: 50%; margin-left: -90px; bottom: 0px; opacity: 0; padding: 11px; color: #fff; border-bottom: 50px solid #2a3035; cursor: default; pointer-events: none; -webkit-transform: translate3d(0,-0.5em,0); transform: translate3d(0,-0.5em,0); -webkit-transition: opacity 0.3s, -webkit-transform 0.3s; transition: opacity 0.3s, transform 0.3s; text-align:center; }
.dt-sc-tooltip-two .tooltip-content a { color: #32434f; }
.dt-sc-tooltip-two .tooltip-text { opacity: 0; -webkit-transform: translate3d(0,1.5em,0); transform: translate3d(0,1.5em,0); -webkit-transition: opacity 0.3s, -webkit-transform 0.3s; transition: opacity 0.3s, transform 0.3s; }
.dt-sc-tooltip-two:hover .tooltip-content, .dt-sc-tooltip-two:hover .tooltip-text { pointer-events: auto; opacity: 1; -webkit-transform: translate3d(0,0,0); transform: translate3d(0,0,0); }

.dt-sc-tooltip-two.bottom:hover .tooltip-item { -webkit-transform: translate3d(0,0.5em,0); transform: translate3d(0,0.5em,0); }
.dt-sc-tooltip-two.bottom .tooltip-content {  bottom:auto; top:0px; border-bottom:0; border-top: 50px solid #2a3035; }

/************************  TOOLTIP CLASSIC *********************************
/*************************** STARTS HERE **********************************/
/* Trigger text */
.dt-sc-tooltip-three .tooltip-item { cursor: pointer; }

/* Gap filler */
.dt-sc-tooltip-three .tooltip-item::after { content: ''; position: absolute; width: 280px; height: 20px; bottom: 100%; left: 50%; pointer-events: none; -webkit-transform: translateX(-50%); transform: translateX(-50%); }
.dt-sc-tooltip-three:hover .tooltip-item::after { pointer-events: auto; }

/* Tooltip */
.dt-sc-tooltip-three .tooltip-content { position: absolute; z-index: 9999; width: 280px; left: 50%; margin: 0 0 20px -140px; bottom: 100%; text-align: left; opacity: 0; cursor: default; pointer-events: none; }
.dt-sc-tooltip-three .tooltip-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; }
.dt-sc-tooltip-three:hover .tooltip-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); }
.dt-sc-tooltip-three.tooltip-effect-2:hover .tooltip-content { -webkit-transform: perspective(1000px) rotate3d(1,0,0,0deg); transform: perspective(1000px) rotate3d(1,0,0,0deg); }

/* Arrow */
.dt-sc-tooltip-three .tooltip-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: #2a3035;*/ border-width: 10px; margin-left: -10px; }

/* Tooltip content*/
.dt-sc-tooltip-three .tooltip-content img { position: relative; height: 170px; display: block; float: left; margin-right: 1em; }
.dt-sc-tooltip-three .tooltip-text { display: block; padding: 10px 10px 10px 0; color: #fff; font-size:13px; line-height:23px; }
.dt-sc-tooltip-three .tooltip-text a { color:#333; }
.dt-sc-tooltip-three .tooltip-text a:hover { color:#fff; }

.dt-sc-tooltip-three.bottom .tooltip-content::after { bottom: 100%; top:auto; }
.dt-sc-tooltip-three.bottom .tooltip-content::after { border-color: transparent transparent #2a3035; }
.dt-sc-tooltip-three.bottom .tooltip-content { top:100%; bottom:auto; margin-bottom:0; margin-top:20px; }

/*** Color **/
/*.dt-sc-tooltip-one .tooltip-inner { background: #9bb70d; }
.dt-sc-tooltip-one.bottom .tooltip-content::after, .dt-sc-tooltip-one .tooltip-text { border-bottom-color: #88a00b; }
.dt-sc-tooltip-one .tooltip-content::after, .dt-sc-tooltip-one.bottom .tooltip-content .tooltip-text, .dt-sc-tooltip-one .tooltip-content::after { border-top-color: #88a00b; }*/