﻿/* www.menucool.com/tooltip/javascript-tooltip */

/*For tooltip target element that has set class="tooltip" */
.tooltip {text-decoration: none; border-bottom:1px dotted #004B6B;color: #004B6B; outline: none; }

/*For tooltip box*/
#mcTooltip 
{
    border-width: 1px;   
    color:#fff; 
    border-color:#c02141;
    padding:20px;
    font-size: 12px;
    border-radius:6px;
    background-color:#c02141;

}

#mcTooltip.no-padding
{
    padding:0;
    box-shadow: 0 4px 8px rgba(0,0,0,0.5);
}

#mcTooltip, #mcttCo b {
    box-shadow: 0 1px 8px rgba(0,0,0,0.5);
}

/* For hyperlink within tooltip */
#mcTooltip a { color:#fff; }

/*Close button. Available when sticky or overlay has been set to true, or is on touch-enabled devices. */
#mcttCloseButton
{ 
    border-radius:4px;
    width:18px;
    height:18px;
    margin-right:2px;
    margin-top:2px;
    background:black;    
}

/*Close button X symbol*/
#mcttCloseButton:after {
    font:normal 38px/18px arial, sans-serif;
    color:white;
    top:0;left:-2px;
}

/*Give the close button a bigger size on smaller devices*/
@media only screen and (max-width: 736px) {
    #mcttCloseButton {
        width:28px;
        height:28px;
    }
    #mcttCloseButton:after {
        font-size:48px;
        line-height:28px;
    }    
} 

/* Useful when overlay has been set to true or 1 in JS */
#mcOverlay 
{
    background-color: rgba(255,255,255,0.8);
    display:none;top:0;left:0;width:100%;height: 100%;overflow:visible;z-index:4; 
}
#mcTooltip img {border:0;vertical-align:middle;}

/*The settings below should remain unchanged*/
#mcTooltipWrapper {position:absolute;visibility:hidden;overflow:visible;z-index:9999999999;top:-2000px;}
#mcTooltip {float:left;border-style:solid;position:relative;overflow:hidden;}
.mcTooltipInner {float:left;position:relative;width:auto;height:auto;}
#mcttCo,  #mcttCo b{position:absolute;overflow:hidden;}

/*compatible with bootstrap*/
#mcTooltip, #mcTooltip div {box-sizing:content-box;}


.tooltipContentBx{ padding:0px; font-family: insigneSteagalRe, Cambria,"Hoefler Text","Liberation Serif",Times,"Times New Roman",serif;}
.tooltipContentBx .ttipleft{float:left; width:40%;}
.tooltipContentBx .ttipleft h2{ font-size:15px; font-weight:bold; padding:0px; margin:0px;}
.tooltipContentBx .ttipleft p{ font-size:15px; padding:10px 0; font-family:insigneSteagalRe;}
.tooltipContentBx .ttipleft p a{ color:#fff !important; margin-top:0px;font-weight:bold !important; font-style:italic; font-family:insigneSteagalRe; font-weight: bold;}
.tooltipContentBx .ttipleft p a img{ margin-left:5px;}
.tooltipContentBx .ttipright{ float:right;  width:50%; border-left: solid 1px #fff; padding-left:20px; padding-top:12px;}
.tooltipContentBx .ttipright .tolImgbx{float:left; margin-right:10px; width:22%;}
.tooltipContentBx .ttipright .tolcontbx{float:left; margin-right:10px; width:68%; }
.tooltipContentBx .ttipright .tolcontbx h3{margin:0px; padding:0px 0 2px 0; font-size:17px; font-weight:bold;}
.tooltipContentBx .ttipright .tolcontbx p{padding:0px; margin:0px; font-size:14px; line-height:16px; font-family:insigneSteagalRe;}

@media only screen and (min-width:0px) and (max-width:767px) {
.tooltipContentBx .ttipleft{width:90% !important; margin: 0px; padding: 0px; float:none !important;}
.tooltipContentBx .ttipright{width:90% !important; margin: 0px; padding: 0px; border: none !important; float:none !important;}
#mcTooltipWrapper{left:0px !important; width: 88%; padding: 10px !important;}
.tooltipContentBx .ttipright .tolImgbx{float:left; margin-right:10px; width:10%;}
.tooltipContentBx .ttipright .tolcontbx{float:left; margin-right:10px; width:80%;}
#mcTooltip{width:100% !important; max-width: 100%;display: table;}
.mcTooltipInner{max-width: 100%;}
#mcttCloseButton {right:-20px !important; top:20px !important;}
.tooltipContentBx .ttipright .tolcontbx{float:left; margin-right:10px; width:90%;}
#mcTooltip{width: 300px !important;}
.tooltipContentBx .ttipright .tolcontbx{float:left; margin-right:10px; width:80%;}
#mcTooltip{width: 100% !important;}
}
