/*
REVISION HISTORY
04/13/2018: Styles for Sweetware 3.com
*/
@font-face {font-family: Athena; src: url(athena-regular.ttf)}
@font-face {
    font-family: Athena;
    font-weight: bold;
    src: url(athena-bold.ttf)
}

@font-face {
    font-family: Athena;
    font-style: italic;
    src: url(athena-regularitalic.ttf)
}

@font-face {
    font-family: Athena;
    font-style: italic;
    font-weight: bold;
    src: url(athena-bolditalic.ttf)
}

body {
    /*font-family: Athena;*/
    background-color: gainsboro;
    background-image: none;
    min-width: 650px;
}

table {
    /*font-family: Athena;*/
    border-collapse: collapse;
    width: 100%;
}

td, th {
    border: 1px solid #dddddd;
    text-align: left;
    padding: 8px;
}

footer {
    padding: 25px;
    color: white;
    background-color: black;
    clear: left;
    text-align: center;
}

/*img {
    width: 50%;
}*/
a.menu:link {
    color: white;
}

a.notunderlined:visited {
    color: black;
}

a.menu:visited {
    color: white;
}

a.menu:hover {
    color: darkgray;
}

a.menu:active {
    color: white;
}

a#logoname, a#logodesc, a {
    color:black;
}

a#logoname:visited {
    color: black;
}

a#logodesc:visited {
    color: black;
}

td.menu:hover {
    background-color: rgb(235, 242, 249);
    color: black;
}

td.footermenu:visited {
    color: deepskyblue;
}

td.footermenu:hover {
    background-color: rgb(128, 128, 128);
}

div.link:hover {
        background-color: rgba(231, 246, 247, 1);
    }

div.link2:hover {
    background-color: rgb(128, 128, 128);
}

.caption {
    text-align: center;
    font-size: 12pt;
    margin-top: 0pt;
}

.dropbtn {
    background-color: black;
    color: white;
    font-size: 12pt;
    border: none;
}

.dropdown {
    position: relative;
    display: inline-block;
}

.dropdown-content {
    display: none;
    position: absolute;
    background-color: rgb(235, 242, 249);
    min-width: 325px;
    box-shadow: 12px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 1;
}

    .dropdown-content a {
        color: black;
        padding: 12px 16px;
        text-decoration: none;
        display: block;
    }

        .dropdown-content a:hover {
            background-color: rgb(215, 239, 246);
        }

.dropdown:hover .dropdown-content, .dropdown:active .dropdown-content {
    display: block;
}

.dropdown:hover .dropbtn {
    background-color: #c2d6d6;
}

.dropdown-content-narrow {
    min-width: 185px;
}

.footerlink {
    color: white;
}

.notunderlined {
    text-decoration: none;
}

.fontcolor-table {
    color: red;
}

a.leftmenu:hover {
    background-color: rgb(230, 255, 230);
}

.pagelogo {
    grid-area: pagelogo;
}

.pagemenu {
    grid-area: pagemenu;
    font-size: 12px;
}

.leftmenu {
    grid-area: leftmenu;
}

.leftcontent {
    grid-area: leftcontent;
    background-color: rgb(215, 239, 246);
    font-size: 13pt;
}

.maincontent {
    grid-area: maincontent;
    /*grid-column: 1 /span 4;*/
}

.homecontent {
    grid-column: 1 /span 4;
}

.footermenu {
    grid-area: footermenu;
}

.footer {
    grid-area: footer;
}

.pagegrid {
    display: grid;
    grid-gap: 0;
    grid-template-columns: 3% 16% 1fr;
    grid-template-areas: 'pagelogo pagelogo pagelogo pagelogo' 'pagemenu pagemenu pagemenu pagemenu' 'contentmargin leftcontent maincontent rightcontentmargin' 'footermenu footermenu footermenu footermenu' 'footer footer footer footer';
    width: 100%;
    max-width: 1200px;
    margin: auto;
}

.temp {
    grid-template-columns: 15% 85%;
    grid-template-areas: 'pagelogo pagelogo' 'leftmenu pagemenu' 'leftcontent maincontent' 'footermenu footermenu' 'footer footer';
}

.pagegrid > div {
    background-color: rgba(255, 255, 255, 0.8);
    text-align: left;
}

.contentmargin {
    grid-area: contentmargin;
    background-color: rgb(215, 239, 246);
}

.rightcontentmargin {
    grid-area: rightcontentmargin;
    background-color: rgb(215, 239, 246);
}

#videocanvas:hover {
    cursor: pointer;
}

.homelinks:hover {
    background-color: white;
}

.homelinks {
}

.stickypagelogo {
    position: fixed;
    width: 100%;
}

.stickypagemenu {
    position: fixed;
    width: 100%;
}

.stickyleftcontent {
    position: fixed;
    width: 100%;
}

.productpagegrid {
    display: grid;
    grid-template-columns: 200px 1fr;
    grid-template-rows: repeat(10, auto);
    grid-auto-flow: row;
}

.reportzoom {
    padding: 15px 0 0 0;
    width: 154.54px;
    height: 200px;
    transition: transformspace.2s
}

    .reportzoom:hover {
        transform: scale(2.25);
    }

.report4across {
    width: 24.5%;
    display: inline-block;
    text-align: center;
    vertical-align: bottom;
    background-color: rgb(198, 216, 235);
    margin-top: 10px;
}

.report3across {
    width: 24.7%;
    display: inline-block;
    text-align: center;
    vertical-align: top;
}

.reportcaption {
    font-size: 16pt;
    color: black;
    text-align: center;
}

.report4acrosslandscape {
}

.samplereportheading {
    background-color: rgb(235, 242, 249);
}

.reportdropbtn {
    color: Black;
    font-size: 12pt;
    border: none;
}

.reportdropdown {
    position: relative;
    display: inline-block;
}

.reportdropdown-content {
    display: none;
    position: absolute;
    background-color: rgb(235, 242, 249);
    min-width: 160px;
    margin: 0 0 0 0px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 1;
}

    .reportdropdown-content a {
        color: black;
        padding: 12px 16px;
        text-decoration: none;
        display: block;
    }

        .reportdropdown-content a:hover {
            background-color: rgb(215, 239, 246);
        }

.reportdropdown:hover .reportdropdown-content {
    display: block;
}

.reportdropdown:hover .reportdropbtn {
    background-color: rgb(215, 239, 246);
}

.productlink {
}

.productlink:hover {
    background-color: rgb(215, 239, 246);
}

.topicheader {
    background: radial-gradient(at top left, rgb(224, 235, 235), rgb(162, 195, 195));
    grid-column: 1 / 3;
    text-align: center;
    padding: 20px;
    font-family: Athena;
}

.articleheading {
    width: 100%; 
    font-size: 16pt; 
    text-align: center; 
    margin-top: 0px; 
    background-color: rgb(235, 242, 249);
}

.article {
    background-color: white;
    width: 68%;
    margin: auto;
}

.productimage {
    vertical-align: middle;
    margin-left: 25px;
    width: 175px;
    height: 175px;
}

.homebackgroundimage {
    position: absolute;
    opacity: .90;
    width: 1200px;
    min-height: 1050px;
    overflow: hidden;
    z-index: -1;   
}

.linkheader {
    display: inline-block;
    float: right;
    margin-right: 15px;
    font-size: 14pt;
}

@media only screen and (max-width: 1000px) {
    .leftcontent {
        display: none;
    }

    .maincontent {
        grid-column: 1 /span 4;
    }

    body {
        font-size: 16pt;
    }

    .productimage {
        margin-left: 25px;
        width: 140px;
        height: 140px;
    }

    .productpagegrid {
        grid-template-columns: 160px 1fr;
    }

    /*.homebackgroundimage {
        width: 150%;

    }*/
}