/*
    Jumpeye framework    
	Version: 1.0.0
	www.jumpeye.com
	
	Created by Jumpeye Components
 
 
    Tooltip style-7
*/

.jtip.style-7 {
    font-size            : 12px;
    padding              : 11px 16px 13px;
    -moz-border-radius   : 3px; 
    -webkit-border-radius: 3px; 
    border-radius        : 3px;
    border               : 2 px solid #c0c0be; 
}  

.jtip.style-7:before,
.jtip.style-7:after {
    content : '';
    position: absolute;
    left    : 10px;
    width   : 0; height  : 0;
}

.jtip.style-7:before { border  : solid 11px; }
.jtip.style-7:after  { border  : solid 9px; }

/* general */
.jtip.style-7:before, .jtip.style-7.top-left:before { top: auto !important; bottom: -22px !important; left: 6px !important; }
.jtip.style-7:after, .jtip.style-7.top-left:after { top: auto !important; bottom: -17px !important; left: 8px !important; }

.jtip.style-7.top-center:before { margin-left: -11px; left: 50% !important; }
.jtip.style-7.top-center:after  { margin-left: -9px; left: 50% !important; }

.jtip.style-7.top-right:before { top: auto !important; bottom: -22px !important; left: auto !important; right: 6px !important; }
.jtip.style-7.top-right:after  { top: auto !important; bottom: -17px !important; left: auto !important; right: 8px !important; }

.jtip.style-7.bottom-left:before { bottom: auto !important; top: -22px !important; }
.jtip.style-7.bottom-left:after  { bottom: auto !important; top: -17px !important; }

.jtip.style-7.bottom-center:before { margin-left: -11px; bottom: auto !important; top: -22px !important; left: 50% !important; }
.jtip.style-7.bottom-center:after  { margin-left: -9px; bottom: auto !important; top: -17px !important; left: 50% !important; }

.jtip.style-7.bottom-right:before { bottom: auto !important; top: -22px !important; left: auto !important; right: 6px !important; }
.jtip.style-7.bottom-right:after  { bottom: auto !important; top: -17px !important; left: auto !important; right: 8px !important; }

.jtip.style-7.right-top:before { bottom: auto !important; top: 6px !important; left: -22px !important; right: auto !important; }
.jtip.style-7.right-top:after  { bottom: auto !important; top: 8px !important; left: -17px !important; right: auto !important; }

.jtip.style-7.right-center:before { margin-top: -11px; top: 50% !important; left: -22px !important; right: auto !important; }
.jtip.style-7.right-center:after  { margin-top: -9px; top: 50% !important; left: -17px !important; right: auto !important; }

.jtip.style-7.right-bottom:before { top: auto !important; bottom: 6px !important; left: -22px !important; right: auto !important; }
.jtip.style-7.right-bottom:after  { top: auto !important; bottom: 8px !important; left: -17px !important; right: auto !important; }

.jtip.style-7.left-top:before { bottom: auto !important; top: 6px !important; right: -22px !important; left: auto !important; }
.jtip.style-7.left-top:after  { bottom: auto !important; top: 8px !important; right: -17px !important; left: auto !important; }

.jtip.style-7.left-center:before { margin-top: -11px; top: 50% !important; right: -22px !important; left: auto !important; }
.jtip.style-7.left-center:after  { margin-top: -9px; top: 50% !important; right: -17px !important; left: auto !important; }

.jtip.style-7.left-bottom:before { top: auto !important; bottom: 6px !important; right: -22px !important; left: auto !important; }
.jtip.style-7.left-bottom:after  { top: auto !important; bottom: 8px !important; right: -17px !important; left: auto !important; }

/* dark */
.jtip.style-7.dark { background: #000; border: 2px solid #fff; color: #cdcdcd; }  

.jtip.style-7.dark:before,
.jtip.style-7.dark.top-left:before,
.jtip.style-7.dark.top-center:before,
.jtip.style-7.dark.top-right:before { border-color: #fff rgba(255,255,255,0) rgba(255,255,255,0) rgba(255,255,255,0); }

.jtip.style-7.dark:after,
.jtip.style-7.dark.top-left:after,
.jtip.style-7.dark.top-center:after,
.jtip.style-7.dark.top-right:after  { border-color: #000 transparent transparent transparent; }

.jtip.style-7.dark.bottom-left:before,
.jtip.style-7.dark.bottom-center:before,
.jtip.style-7.dark.bottom-right:before { border-color:  rgba(255,255,255,0) rgba(255,255,255,0) #fff rgba(255,255,255,0); }

.jtip.style-7.dark.bottom-left:after,
.jtip.style-7.dark.bottom-center:after,
.jtip.style-7.dark.bottom-right:after { border-color: transparent transparent #000 transparent; }

.jtip.style-7.dark.right-top:before,
.jtip.style-7.dark.right-center:before,
.jtip.style-7.dark.right-bottom:before { border-color: rgba(255,255,255,0) #fff rgba(255,255,255,0) rgba(255,255,255,0); }

.jtip.style-7.dark.right-top:after,
.jtip.style-7.dark.right-center:after,
.jtip.style-7.dark.right-bottom:after { border-color: transparent #000 transparent transparent; }

.jtip.style-7.dark.left-top:before,
.jtip.style-7.dark.left-center:before,
.jtip.style-7.dark.left-bottom:before { border-color: rgba(255,255,255,0) rgba(255,255,255,0) rgba(255,255,255,0) #fff; }

.jtip.style-7.dark.left-top:after,
.jtip.style-7.dark.left-center:after,
.jtip.style-7.dark.left-bottom:after { border-color: transparent transparent transparent #000; }


/* light */
.jtip.style-7.light { background: #fff; border: 2px solid #c0c0be; color: #868686; }  

.jtip.style-7.light:before,
.jtip.style-7.light.top-left:before,
.jtip.style-7.light.top-center:before,
.jtip.style-7.light.top-right:before { border-color: #c0c0be rgba(192,192,190,0) rgba(192,192,190,0) rgba(192,192,190,0); }

.jtip.style-7.light:after,
.jtip.style-7.light.top-left:after,
.jtip.style-7.light.top-center:after,
.jtip.style-7.light.top-right:after { border-color: #fff rgba(255,255,255,0) rgba(255,255,255,0) rgba(255,255,255,0); }

.jtip.style-7.light.bottom-left:before,
.jtip.style-7.light.bottom-center:before,
.jtip.style-7.light.bottom-right:before { border-color: rgba(192,192,190,0) rgba(192,192,190,0) #c0c0be rgba(192,192,190,0); }

.jtip.style-7.light.bottom-left:after,
.jtip.style-7.light.bottom-center:after,
.jtip.style-7.light.bottom-right:after { border-color: rgba(255,255,255,0) rgba(255,255,255,0) #fff rgba(255,255,255,0);}

.jtip.style-7.light.right-top:before,
.jtip.style-7.light.right-center:before,
.jtip.style-7.light.right-bottom:before { border-color: rgba(192,192,190,0) #c0c0be rgba(192,192,190,0) rgba(192,192,190,0); }

.jtip.style-7.light.right-top:after,
.jtip.style-7.light.right-center:after,
.jtip.style-7.light.right-bottom:after { border-color: rgba(255,255,255,0) #fff rgba(255,255,255,0) rgba(255,255,255,0);}

.jtip.style-7.light.left-top:before,
.jtip.style-7.light.left-center:before,
.jtip.style-7.light.left-bottom:before { border-color: rgba(192,192,190,0) rgba(192,192,190,0) rgba(192,192,190,0) #c0c0be; }

.jtip.style-7.light.left-top:after,
.jtip.style-7.light.left-center:after,
.jtip.style-7.light.left-bottom:after { border-color: rgba(255,255,255,0) rgba(255,255,255,0) rgba(255,255,255,0) #fff; }