﻿
/*https://css-tricks.com/almanac/properties/t/text-overflow/*/

.IsItAButton {
    background: none;
    color: inherit;
    border: none;
    padding: 0;
    font: inherit;
    cursor: pointer;
    outline: inherit;
    text-align: left;
    white-space: nowrap;
    overflow: hidden;
}

    .IsItAButton:hover {
        background-color: beige;
        /*font-weight: bold;*/
        color: black;
    }

.CaveLinkGrid {
    display: grid;
    grid-template-columns: 48% auto 48% auto;
}

.CaveLink1 {
    width: 25%
}

.CaveLink2 {
    width: 65%
}

.CaveSide {
    max-height: 768px;
    border-color: #3a0647 black;
    border-width: 0px 0px 8px 0px;
    border-style: none none solid none;
}

.CavePageBG{
    background-color: white;
}

.CavePage {
    max-width: 1200px;
    max-height: 768px;
    margin: auto;
    border-color: #3a0647 black;
    border-width: 0px 1px 8px 0px;
    border-style: none solid solid none;
    background-color: #eeeeee;
}

@media (max-height: 769px) {
    .CavePage {
        border-style: none solid none none;
    }
}

@media (max-width: 1200.98px) {
    .CavePage {
        border-style: none none solid none;
    }
}

@media (max-height: 769px) and (max-width: 1200.98px) {
    .CavePage {
        border-style: none none none none;
    }
}

@media (max-width: 780px) {
    .CaveLinkGrid {
        display: grid;
        grid-template-columns: 98% auto;
    }

    .CaveLink1 {
        width: 35%
    }

    .CaveLink2 {
        width: 55%
    }
}

@media (max-width: 640.98px) {
    .CavePageBG {
        background-color: #eeeeee;
    }

    .CavePage {
        border-style: none none none none;
    }
    .top-diagonal {
        display: none;
    }
}
