/*   ============================================================

     General Items for PrimeCharts Styles

     Drop Down mmenu Cascading Style Sheet information is 
     contained in a seperate Style Sheet

     ============================================================  */



.iFramMainText {
    font-family: Arial, Helvetica, sans-serif;
    font-size: small;
    color: #000000;
    font-weight: normal;
    position: center;
    width: 795px;
    height: 500px;
    border: none;
}

.FooterStyle 
     {
	font-family: Arial, Helvetica, sans-serif;
	font-size: xx-small;
	color: #25866C;
	width: 800px;
	margin-left: auto;
     margin-right: auto;
	border: 0px solid #B9B9B9;
	text-align: center;
     }

.FooterLine
    {
     border: 1px solid #B9B9B9;
     width: 800px;
     text-align: center;
     padding: 0px;
     margin-top: 10px;
    }
    
.AboveMenuHeaderStyle 
     {
     border-style: none;
     width: 800px;
     margin-left: auto;
     margin-right: auto;
     text-align: center;
     }

.PageHeading
     {
     font-family: Arial, Helvetica, sans-serif;
     font-size: medium;
     color: #582676;
     font-weight: bold;
     }

.style1 
     {
     font-family: Arial, Helvetica, sans-serif;
     font-size: xx-small;
     color: #25866C;
     width: 800px;
     margin-left: auto;
     margin-right: auto;
     border: 1px solid #B9B9B9;
     text-align: center;
     }

.style6
     {
     font-size: medium;
     color: #000000;
     }
    
.style7 
     {
	text-align: left;
     }
     
.CentreInCell 
     {
	text-align:center;
     }
     
.style8
     {
     font-size: large;
     color: #000000;
     font-weight: bold;
     }


.MainTextTable
    {
     font-family: Arial, Helvetica, sans-serif;
     font-size: small;
     color: #000000;
     font-weight:normal;
     width: 100%;
    }

.CenteredMainTextTable {
    font-family: Arial, Helvetica, sans-serif;
    font-size: small;
    color: #000000;
    font-weight: normal;
    width: 100%;
    align-self:center;
}

.MainTextTableWithBorder 
{
    font-family: Arial, Helvetica, sans-serif;
    font-size: small;
    color: #000000;
    font-weight: normal;
    width: 100%;
    border: 1px solid #B9B9B9;
    padding: 1px;
    margin: 1px;
}

.MainText
    {
     font-family: Arial, Helvetica, sans-serif;
     font-size: small;
     font-weight:normal;
     color: #000000;
    }  

.RedText
    {
     font-family: Arial, Helvetica, sans-serif;
     font-size: small;
     color: #FF0000;
    }

.BlueText
    {
     font-family: Arial, Helvetica, sans-serif;
     font-size: small;
     color: #0000FF;
    }

.GreenText
    {
     font-family: Arial, Helvetica, sans-serif;
     font-size: small;
     color: #00FF00;
    }

.MainTextHyperLink
    {
     font-family: Arial, Helvetica, sans-serif;
     font-size: x-large; 
     font-weight: 700;
     color: #000080; 
     text-decoration: none;
    }    

.MainTextHyperLink:link 
     {
     font-family: Arial, Helvetica, sans-serif;
     color: #0000FF;
     text-decoration: none;
     }
     
.MainTextHyperLink:visited 
     {
     font-family: Arial, Helvetica, sans-serif;
     text-decoration: none;
     color: #0000FF;
     }
     
.MainTextHyperLink:hover 
     {
     font-family: Arial, Helvetica, sans-serif;
     text-decoration: none;
     color: #FF0000;
     }
     
.MainTextHyperLink:active 
     {
     font-family: Arial, Helvetica, sans-serif;
	text-decoration: none;
	color: #00FF00;
     }          

.TableText
     {
     font-family: Arial, Helvetica, sans-serif;
     font-size: x-small;
     color: #000000;
     }

.InvoiceTableText
     {
     font-family: Arial, Helvetica, sans-serif;
     font-size: small;
     margin-left: auto;
     margin-right: auto;
     text-align: center;
     color: #000000;
     }
     
.Table
     {
     font-family: Arial, Helvetica, sans-serif;
     border: 1px solid #B9B9B9;
     font-size: medium;
     color: #000000;
     width: 788px;
     text-align: center;
     padding: 0px;
     margin: 0px;
     }
       
.Table_No_Border
     {
     width: 100%;
     border: 0px none #FFFFFF;
     }


.Center 
    {
    justify-content: center;
    }

.Left {
    float: left;
    padding: 0 30px 0px 0px;
}

.Right 
{
    float: right;
    padding: 0 0px 0px 30px;    
}

/* ======================================================================== */
/*      Code for clicking on and Zooming an image                           */
/* ======================================================================== */
#mask {
    position: fixed;
    left: 0;
    top: 0;
    bottom: 0;
    right: 0;
    margin: auto;
    visibility: hidden;
    z-index: -2;
    background: #000;
    background: rgba(0,0,0,0.8);
    overflow: hidden;
    opacity: 0;
    transition: all .5s ease-in-out;
}

#mask.showing {
    opacity: 1;
    z-index: 9000;
    visibility: visible;
    overflow: auto;
    transition: all .5s ease-in-out;
}

#boxes {
    display: table;
    width: 100%;
    height: 100%;
}

.window {
    max-width: 800px;
    z-index: 9999;
    padding: 25px;
    border-radius: 15px;
    text-align: center;
    margin: auto;
    background-color: #ffffff;
    font-family: 'Segoe UI Light', sans-serif;
    font-size: 15pt;
}

    .window img {
        width: 100%;
        height: auto;
    }

.inner {
    display: table-cell;
    vertical-align: middle;
}

#popupfoot {
    font-size: 16pt;
}

.showImage {
    margin: 0 0 3em;
    display: table;
    text-align: left;    
}

    .showImage img {
        display: block;
    }



/* ======================================================================== */
/*      Code for hovering over item and getting a tool tip Window           */
/* ======================================================================== */

/* Tooltip container */
.tooltip {
    position: relative;
    display: inline-block;
    border-bottom: none; /* 1px dotted black;  If you want dots under the hoverable text */
}
    /* Tooltip text */
    .tooltip .tooltiptext {
        visibility: hidden;
        width: 450px;
        background-color: #555;
        color: #fff;
        text-align: center;
        padding: 5px 0;
        border-radius: 6px;
        /* Position the tooltip text */
        position: absolute;
        z-index: 1;
        bottom: 125%;
        left: 50%;
        margin-left: -60px;
        /* Fade in tooltip */
        opacity: 0;
        transition: opacity 0.3s;
    }

        /* Tooltip arrow */
        .tooltip .tooltiptext::after {
            content: "";
            position: absolute;
            top: 100%;
            left: 50%;
            margin-left: -5px;
            border-width: 5px;
            border-style: solid;
            border-color: #555 transparent transparent transparent;
        }

    /* Show the tooltip text when you mouse over the tooltip container */
    .tooltip:hover .tooltiptext {
        visibility: visible;
        opacity: 1;
    }