﻿/*
    Jumpeye framework    
	Version: 1.0.0
	www.jumpeye.com
	
	Created by Jumpeye Components
 
 
    Tooltip style-1
*/

.jtip.style-1 {
    font-size            : 11px;
    padding              : 5px 14px 7px;
    -moz-border-radius   : 3px; 
    -webkit-border-radius: 3px; 
    border-radius        : 3px;
    border-width         : 6px;    
}

.jtip.style-1:before{
    border  : 6px solid;
    bottom  : -12px;
    content : '';
    position: absolute;
    left    : 10px; 
    width   : 0; height  : 0;  
}

/* general */
.jtip.style-1.top-left:before      { top: auto !important; bottom: -12px !important; right: auto !important; left: 10px !important; }
.jtip.style-1.top-center:before    { left: 50% !important; margin-left: -6px; }
.jtip.style-1.top-right:before     { top: auto !important; bottom: -12px !important; left: auto !important; right: 10px !important; }
.jtip.style-1.bottom-left:before   { bottom: auto !important; top: -12px !important; }
.jtip.style-1.bottom-right:before  { bottom: auto !important; top: -12px !important; left: auto !important; right: 10px !important; }
.jtip.style-1.bottom-center:before { bottom: auto !important; top: -12px !important; left: 50% !important; margin-left: -6px; }
.jtip.style-1.right-top:before     { bottom: auto !important; top: 10px !important; left: -12px !important; right: auto !important; }
.jtip.style-1.right-center:before  { top: 50% !important; left: -12px !important; right: auto !important; margin-top: -6px; }
.jtip.style-1.right-bottom:before  { top: auto !important; bottom: 10px !important; left: -12px !important; right: auto !important; }
.jtip.style-1.left-top:before      { bottom: auto !important; top: 10px !important; right: -12px !important; left: auto !important; }
.jtip.style-1.left-center:before   { top: 50% !important; right: -12px !important; left: auto !important; margin-top: -6px; }
.jtip.style-1.left-bottom:before   { top: auto !important; bottom: 10px !important; right: -12px !important; left: auto !important; }

/* dark */
.jtip.style-1.dark {
    background : #4c4c4c;
    color      : #fff;
    text-shadow: 0px -1px 0 rgba(0, 0, 0, 0.75);    
}

.jtip.style-1.dark:before,
.jtip.style-1.top-left.dark:before,
.jtip.style-1.top-right.dark:before,
.jtip.style-1.top-center.dark:before    { border-color: #4c4c4c transparent transparent transparent; }
.jtip.style-1.dark.bottom-left:before, 
.jtip.style-1.bottom-right.dark:before,
.jtip.style-1.bottom-center.dark:before { border-color: transparent transparent #4c4c4c transparent; }
.jtip.style-1.right-top.dark:before,   
.jtip.style-1.right-center.dark:before,
.jtip.style-1.right-bottom.dark:before  { border-color: transparent #4c4c4c transparent transparent; }
.jtip.style-1.left-top.dark:before,   
.jtip.style-1.left-center.dark:before,
.jtip.style-1.left-bottom.dark:before   { border-color: transparent transparent transparent #4c4c4c; }


/* light */
.jtip.style-1.light {
    background : #ccc;
    color      : #000;
    text-shadow: 0px 1px 0 rgba(255, 255, 255, 0.5);    
}

.jtip.style-1.light:before,
.jtip.style-1.top-left.light:before, 
.jtip.style-1.top-right.light:before,
.jtip.style-1.top-center.light:before    { border-color: #ccc rgba(204,204,204,0) rgba(204,204,204,0) rgba(204,204,204,0); }
.jtip.style-1.bottom-left.light:before, 
.jtip.style-1.bottom-right.light:before,
.jtip.style-1.bottom-center.light:before { border-color: rgba(204,204,204,0) rgba(204,204,204,0) #ccc rgba(204,204,204,0); }
.jtip.style-1.right-top.light:before,   
.jtip.style-1.right-center.light:before,
.jtip.style-1.right-bottom.light:before  { border-color: rgba(204,204,204,0) #ccc rgba(204,204,204,0) rgba(204,204,204,0); }
.jtip.style-1.left-top.light:before,   
.jtip.style-1.left-center.light:before,
.jtip.style-1.left-bottom.light:before   { border-color: rgba(204,204,204,0) rgba(204,204,204,0) rgba(204,204,204,0) #ccc; }