﻿/*
    Jumpeye framework    
	Version: 1.0.0
	www.jumpeye.com
	
	Created by Jumpeye Components
 
 
    Tooltip style-15
*/

.jtip.style-15 { font-size: 12px; padding: 4px 19px 6px; }  

.jtip.style-15:before{
    content : '';
    position: absolute;
    width   : 0; 
    height  : 0;  
}

/* general for all colors */
.jtip.style-15:before, .jtip.style-15.top-left:before { top: auto !important; bottom: -14px !important; left: -2px !important; }

.jtip.style-15.top-center:before { margin-left: -6px; left: 50% !important; }

.jtip.style-15.top-right:before { top: auto !important; bottom: -14px !important; left: auto !important; right: -2px !important; }

.jtip.style-15.bottom-left:before { bottom: auto !important; top: -14px !important; }   

.jtip.style-15.bottom-center:before { margin-left: -6px; bottom: auto !important; top: -14px !important; left: 50% !important; }

.jtip.style-15.bottom-right:before { bottom: auto !important; top: -14px !important; left: auto !important; right: -2px !important; }

.jtip.style-15.right-top:before { bottom: auto !important; top: -2px !important; left: -26px !important; right: auto !important; } 

.jtip.style-15.right-center:before { margin-top: -6px; top: 50% !important; left: -26px !important; right: auto !important; }

.jtip.style-15.right-bottom:before { top: auto !important; bottom: -2px !important; left: -26px !important; right: auto !important; }

.jtip.style-15.left-top:before { bottom: auto !important; top: -2px !important; right: -14px !important; left: auto !important; }

.jtip.style-15.left-center:before { margin-top: -6px; top: 50% !important; right: -14px !important; left: auto !important; }

.jtip.style-15.left-bottom:before { top: auto !important; bottom: -2px !important; right: -14px !important; left: auto !important; }

/* gray */
.jtip.style-15.gray { background: #d8d8d8; border: 2px solid #c7c7c7; color: #767676; }

.jtip.style-15.gray:before,
.jtip.style-15.gray.top-left:before {
    border-color:  #c7c7c7 rgba(199,199,199,0) rgba(199,199,199,0) rgba(199,199,199,0);
    border-bottom: 12px solid rgba(199,199,199,0);
    border-left: 12px solid #c7c7c7;
}

.jtip.style-15.gray.top-right:before {
    border-color:  #c7c7c7 rgba(199,199,199,0) rgba(199,199,199,0) rgba(199,199,199,0);
    border-bottom: 12px solid rgba(199,199,199,0);
    border-right: 12px solid #c7c7c7;
}

.jtip.style-15.gray.left-bottom:before,
.jtip.style-15.gray.bottom-left:before,
.jtip.style-15.gray.bottom-center:before {
    border-top: 12px solid rgba(199,199,199,0);
    border-bottom: rgba(199,199,199,0);
    border-left: 12px solid #c7c7c7;
}

.jtip.style-15.gray.right-bottom:before,
.jtip.style-15.gray.bottom-right:before {
    border-color:  #c7c7c7 rgba(199,199,199,0) rgba(199,199,199,0) rgba(199,199,199,0);
    border-top: 12px solid rgba(199,199,199,0);
    border-bottom: rgba(199,199,199,0);
    border-right: 12px solid #c7c7c7;
}

.jtip.style-15.gray.right-top:before,
.jtip.style-15.gray.right-center:before {
    border-color:  #c7c7c7 rgba(199,199,199,0) rgba(199,199,199,0) rgba(199,199,199,0);
    border-bottom: 12px solid rgba(199,199,199,0);
    border-right: 12px solid #c7c7c7;
}


/* yellow */
.jtip.style-15.yellow { background: #ffeea4; border: 2px solid #ffe77d; color: #7f6908; }

.jtip.style-15.yellow:before,
.jtip.style-15.yellow.top-left:before {
    border-color:  #ffe77d rgba(255,231,125,0) rgba(255,231,125,0) rgba(255,231,125,0);
    border-bottom: 12px solid rgba(255,231,125,0);
    border-left: 12px solid #ffe77d;
}

.jtip.style-15.yellow.top-right:before {
    border-color:  #ffe77d rgba(255,231,125,0) rgba(255,231,125,0) rgba(255,231,125,0);
    border-bottom: 12px solid rgba(255,231,125,0);
    border-right: 12px solid #ffe77d;
}

.jtip.style-15.yellow.left-bottom:before,
.jtip.style-15.yellow.bottom-left:before,
.jtip.style-15.yellow.bottom-center:before {
    border-top: 12px solid rgba(255,231,125,0);
    border-bottom: rgba(255,231,125,0);
    border-left: 12px solid #ffe77d;
}

.jtip.style-15.yellow.right-bottom:before,
.jtip.style-15.yellow.bottom-right:before {
    border-color:  #ffe77d rgba(255,231,125,0) rgba(255,231,125,0) rgba(255,231,125,0);
    border-top: 12px solid rgba(255,231,125,0);
    border-bottom: rgba(255,231,125,0);
    border-right: 12px solid #ffe77d;
}

.jtip.style-15.yellow.right-top:before,
.jtip.style-15.yellow.right-center:before {
    border-color:  #ffe77d rgba(255,231,125,0) rgba(255,231,125,0) rgba(255,231,125,0);
    border-bottom: 12px solid rgba(255,231,125,0);
    border-right: 12px solid #ffe77d;
}


/* blue */
.jtip.style-15.blue { background: #8cc0f7; border: 2px solid #5aa5f3; color: #fff; }

.jtip.style-15.blue:before,
.jtip.style-15.blue.top-left:before {
    border-color:  #5aa5f3 rgba(90,165,243,0) rgba(90,165,243,0) rgba(90,165,243,0);
    border-bottom: 12px solid rgba(90,165,243,0);
    border-left: 12px solid #5aa5f3;
}

.jtip.style-15.blue.top-right:before {
    border-color:  #5aa5f3 rgba(90,165,243,0) rgba(90,165,243,0) rgba(90,165,243,0);
    border-bottom: 12px solid rgba(90,165,243,0);
    border-right: 12px solid #5aa5f3;
}

.jtip.style-15.blue.left-bottom:before,
.jtip.style-15.blue.bottom-left:before,
.jtip.style-15.blue.bottom-center:before {
    border-top: 12px solid rgba(90,165,243,0);
    border-bottom: rgba(90,165,243,0);
    border-left: 12px solid #5aa5f3;
}

.jtip.style-15.blue.right-bottom:before,
.jtip.style-15.blue.bottom-right:before {
    border-color:  #5aa5f3 rgba(90,165,243,0) rgba(90,165,243,0) rgba(90,165,243,0);
    border-top: 12px solid rgba(90,165,243,0);
    border-bottom: rgba(90,165,243,0);
    border-right: 12px solid #5aa5f3;
}

.jtip.style-15.blue.right-top:before,
.jtip.style-15.blue.right-center:before {
    border-color:  #5aa5f3 rgba(90,165,243,0) rgba(90,165,243,0) rgba(90,165,243,0);
    border-bottom: 12px solid rgba(90,165,243,0);
    border-right: 12px solid #5aa5f3;
}


/* purple */
.jtip.style-15.purple { background: #bd9ddd; border: 2px solid #a073ce; color: #fff; }

.jtip.style-15.purple:before,
.jtip.style-15.purple.top-left:before {
    border-color:  #a073ce rgba(160,115,206,0) rgba(160,115,206,0) rgba(160,115,206,0);
    border-bottom: 12px solid rgba(160,115,206,0);
    border-left: 12px solid #a073ce;
}

.jtip.style-15.purple.top-right:before {
    border-color:  #a073ce rgba(160,115,206,0) rgba(160,115,206,0) rgba(160,115,206,0);
    border-bottom: 12px solid rgba(160,115,206,0);
    border-right: 12px solid #a073ce;
}

.jtip.style-15.purple.left-bottom:before,
.jtip.style-15.purple.bottom-left:before,
.jtip.style-15.purple.bottom-center:before {
    border-top: 12px solid rgba(160,115,206,0);
    border-bottom: rgba(160,115,206,0);
    border-left: 12px solid #a073ce;
}

.jtip.style-15.purple.right-bottom:before,
.jtip.style-15.purple.bottom-right:before {
    border-color:  #a073ce rgba(160,115,206,0) rgba(160,115,206,0) rgba(160,115,206,0);
    border-top: 12px solid rgba(160,115,206,0);
    border-bottom: rgba(160,115,206,0);
    border-right: 12px solid #a073ce;
}

.jtip.style-15.purple.right-top:before,
.jtip.style-15.purple.right-center:before {
    border-color:  #a073ce rgba(160,115,206,0) rgba(160,115,206,0) rgba(160,115,206,0);
    border-bottom: 12px solid rgba(160,115,206,0);
    border-right: 12px solid #a073ce;
}


/* green */
.jtip.style-15.green { background: #a3d063; border: 2px solid #7bbb20; color: #fff; }

.jtip.style-15.green:before,
.jtip.style-15.green.top-left:before {
    border-color:  #7bbb20 rgba(123,187,32,0) rgba(123,187,32,0) rgba(123,187,32,0);
    border-bottom: 12px solid rgba(123,187,32,0);
    border-left: 12px solid #7bbb20;
}

.jtip.style-15.green.top-right:before {
    border-color:  #7bbb20 rgba(123,187,32,0) rgba(123,187,32,0) rgba(123,187,32,0);
    border-bottom: 12px solid rgba(123,187,32,0);
    border-right: 12px solid #7bbb20;
}

.jtip.style-15.green.left-bottom:before,
.jtip.style-15.green.bottom-left:before,
.jtip.style-15.green.bottom-center:before {
    border-top: 12px solid rgba(123,187,32,0);
    border-bottom: rgba(123,187,32,0);
    border-left: 12px solid #7bbb20;
}

.jtip.style-15.green.right-bottom:before,
.jtip.style-15.green.bottom-right:before {
    border-color:  #7bbb20 rgba(123,187,32,0) rgba(123,187,32,0) rgba(123,187,32,0);
    border-top: 12px solid rgba(123,187,32,0);
    border-bottom: rgba(123,187,32,0);
    border-right: 12px solid #7bbb20;
}

.jtip.style-15.green.right-top:before,
.jtip.style-15.green.right-center:before {
    border-color:  #7bbb20 rgba(123,187,32,0) rgba(123,187,32,0) rgba(123,187,32,0);
    border-bottom: 12px solid rgba(123,187,32,0);
    border-right: 12px solid #7bbb20;
}


/* red */
.jtip.style-15.red {background: #e24d4e; border: 2px solid #d60001; color: #fff; }

.jtip.style-15.red:before,
.jtip.style-15.red.top-left:before {
    border-color:  #d60001 rgba(214,0,1,0) rgba(214,0,1,0) rgba(214,0,1,0);
    border-bottom: 12px solid rgba(214,0,1,0);
    border-left: 12px solid #d60001;
}

.jtip.style-15.red.top-right:before {
    border-color:  #d60001 rgba(214,0,1,0) rgba(214,0,1,0) rgba(214,0,1,0);
    border-bottom: 12px solid rgba(214,0,1,0);
    border-right: 12px solid #d60001;
}

.jtip.style-15.red.left-bottom:before,
.jtip.style-15.red.bottom-left:before,
.jtip.style-15.red.bottom-center:before {
    border-top: 12px solid rgba(214,0,1,0);
    border-bottom: rgba(214,0,1,0);
    border-left: 12px solid #d60001;
}

.jtip.style-15.red.right-bottom:before,
.jtip.style-15.red.bottom-right:before {
    border-color:  #d60001 rgba(214,0,1,0) rgba(214,0,1,0) rgba(214,0,1,0);
    border-top: 12px solid rgba(214,0,1,0);
    border-bottom: rgba(214,0,1,0);
    border-right: 12px solid #d60001;
}

.jtip.style-15.red.right-top:before,
.jtip.style-15.red.right-center:before {
    border-color:  #d60001 rgba(214,0,1,0) rgba(214,0,1,0) rgba(214,0,1,0);
    border-bottom: 12px solid rgba(214,0,1,0);
    border-right: 12px solid #d60001;
}