﻿/* Tooltip container */
.a_popup
{
    position: relative;
    display: inline-block; /*border-bottom: 1px dotted black;*/ /* If you want dots under the hoverable text */
    text-decoration: none; /*own*/
    color: Blue; /*own*/
}

/* Tooltip text */
.a_popup .span_popup
{
    visibility: hidden; /*width: 120px;*/
    width: 20em; /*background-color: #555;*/
    background-color: #e6ffe6;
    color: #006622;
    text-align: left; /*padding: 5px 0;*/
    padding: 0.5em; /*border-radius: 6px;*/ /* Position the tooltip text */
    position: absolute; /*z-index: 1;*/
    bottom: 125%;
    left: -5em;
    margin-left: -60px; /* Fade in tooltip */ /*opacity: 0;     transition: opacity 1s;*/
    font-size: 0.78em;
    border: 0.3em solid #adebad; /*own*/ /*outline: none;*/ /*own*/
    border-top: 2em solid #adebad;
}

/* Tooltip arrow */
.a_popup .span_popup::after
{
    content: "";
    position: absolute;
    top: 100%;
    left: 50%; /*margin-left: -5px;*/
    margin-left: -1em; /*border-width: 5px;*/
    border-width: 1em;
    border-style: solid;
    border-color: #adebad transparent transparent transparent;
}

/* Show the tooltip text when you mouse over the tooltip container */
.a_popup:hover .span_popup
{
    visibility: visible; /*opacity: 1;*/
}

.a_popup:hover
{
    text-decoration: underline; /*own*/
}

.gloss_popup_header
{
    font-weight: bold;
    position: relative;
    top: -2.1em;
}

.nextPrevHover /*For lesson next/prev pages*/
{
    color: #abbaab;
}
.nextPrevHover:hover /*For lesson next/prev pages*/
{
    background-color: #3399ff;   
    color: White; 
}
