
* {
    -webkit-font-smoothing: antialiased;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

.demo-image {
    cursor: pointer;
    display: inline-block;
    width: 100%;
    height: 200px;
    background-size: cover;
    background-position: 50% 50%;
    margin-bottom: 16px;
    border-radius: 10px;
    box-shadow: 0px 0px 15px 2px rgba(33,37,41,0.75);
    position: relative;
}

.demo-image:hover {
    transform: scale(1.02);
    transition: transform 0.3s ease;
}

.demo-image::after {
    content: "Click to Expand View";
    position: absolute;
    bottom: 10px;
    left: 50%;
    transform: translateX(-50%);
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.05));
    backdrop-filter: blur(25px) saturate(200%) contrast(150%) brightness(120%);
    -webkit-backdrop-filter: blur(25px) saturate(200%) contrast(150%) brightness(120%);
    -moz-backdrop-filter: blur(25px) saturate(200%) contrast(150%) brightness(120%);
    color: rgb(255, 255, 255);
    padding: 6px 10px;
    border-radius: 8px;
    border: 1px solid rgba(255, 255, 255, 0.3);
    box-shadow:
        0 8px 32px rgba(0, 0, 0, 0.1),
        inset 0 1px 0 rgba(255, 255, 255, 0.2),
        inset 0 -1px 0 rgba(0, 0, 0, 0.1);
    font-size: 8px;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    font-weight: 600;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);
    letter-spacing: 0.5px;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.3s ease;
    z-index: 10;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.2);
}

.demo-image:hover::after {
    opacity: 1;
}

.demo-image[data-image="/assets/img/CityLandscape.jpg"] {
    background-image: url("/assets/img/CityLandscape.jpg");
}
.demo-image[data-image="/assets/img/CityDark.jpg"] {
    background-image: url("/assets/img/CityDark.jpg");
}
.demo-image[data-image="/assets/img/HamernickBARedCar.jpg"] {
    background-image: url("/assets/img/HamernickBARedCar.jpg");
}
.demo-image[data-image="/assets/img/HamernickTTower1.jpg"] {
    background-image: url("/assets/img/HamernickTTower1.jpg");
}
.demo-image[data-image="/assets/img/TTower2.jpg"] {
    background-image: url("/assets/img/TTower2.jpg");
}
.demo-image[data-image="/assets/img/BLACK.png"] {
    background-image: url("/assets/img/BLACK.png");
    background-color: #333;
}


.demo-image[data-image="/assets/img/MiscMain.jpg"] {
    background-image: url("/assets/img/MiscMain.jpg");
}
.demo-image[data-image="/assets/img/MiscCar2.jpg"] {
    background-image: url("/assets/img/MiscCar2.jpg");
}
.demo-image[data-image="/assets/img/MiscCar1.jpg"] {
    background-image: url("/assets/img/MiscCar1.jpg");
}
.demo-image[data-image="/assets/img/Misc2.jpg"] {
    background-image: url("/assets/img/Misc2.jpg");
}
.demo-image[data-image="/assets/img/MiscNatureHome.jpg"] {
    background-image: url("/assets/img/MiscNatureHome.jpg");
}
.demo-image[data-image="/assets/img/MiscPatriot.jpg"] {
    background-image: url("/assets/img/MiscPatriot.jpg");
}
.demo-image[data-image="/assets/img/FishchurchCross.jpg"] {
    background-image: url("/assets/img/FishchurchCross.jpg");
}
.demo-image[data-image="/assets/img/SanMartin.jpg"] {
    background-image: url("/assets/img/SanMartin.jpg");
}
.demo-image[data-image="/assets/img/HamernickTube.jpg"] {
    background-image: url("/assets/img/HamernickTube.jpg");
}


.demo-image[data-image="/assets/img/Flowers1.jpg"] {
    background-image: url("/assets/img/Flowers1.jpg");
}
.demo-image[data-image="/assets/img/NatureLandscape3.jpg"] {
    background-image: url("/assets/img/NatureLandscape3.jpg");
}
.demo-image[data-image="/assets/img/NatureLandscape4.jpg"] {
    background-image: url("/assets/img/NatureLandscape4.jpg");
}
.demo-image[data-image="/assets/img/NatureLandscape2.jpg"] {
    background-image: url("/assets/img/NatureLandscape2.jpg");
}
.demo-image[data-image="/assets/img/NatureLandscape1.jpg"] {
    background-image: url("/assets/img/NatureLandscape1.jpg");
}
.demo-image[data-image="/assets/img/NatureLandscape5.jpg"] {
    background-image: url("/assets/img/NatureLandscape5.jpg");
}


.demo-image[data-image="/assets/img/TennisPerson1.jpg"] {
    background-image: url("/assets/img/TennisPerson1.jpg");
}
.demo-image[data-image="/assets/img/PeopleCar2.jpg"] {
    background-image: url("/assets/img/PeopleCar2.jpg");
}

* {
    -webkit-font-smoothing: antialiased;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

.demo-image {
    cursor: pointer;
    display: inline-block;
    width: 100%;
    height: 200px;
    background-size: cover;
    background-position: 50% 50%;
    margin-bottom: 16px;
    border-radius: 10px;
    box-shadow: 0px 0px 15px 2px rgba(33,37,41,0.75);
    position: relative;
}

.demo-image:hover {
    transform: scale(1.02);
    transition: transform 0.3s ease;
}


.demo-image[data-image="/assets/img/CityLandscape.jpg"] {
    background-image: url("/assets/img/CityLandscape.jpg");
}
.demo-image[data-image="/assets/img/CityDark.jpg"] {
    background-image: url("/assets/img/CityDark.jpg");
}
.demo-image[data-image="/assets/img/HamernickBARedCar.jpg"] {
    background-image: url("/assets/img/HamernickBARedCar.jpg");
}
.demo-image[data-image="/assets/img/HamernickTTower1.jpg"] {
    background-image: url("/assets/img/HamernickTTower1.jpg");
}
.demo-image[data-image="/assets/img/TTower2.jpg"] {
    background-image: url("/assets/img/TTower2.jpg");
}
.demo-image[data-image="/assets/img/BLACK.png"] {
    background-image: url("/assets/img/BLACK.png");
    background-color: #333;
}


.demo-image[data-image="/assets/img/MiscMain.jpg"] {
    background-image: url("/assets/img/MiscMain.jpg");
}
.demo-image[data-image="/assets/img/MiscCar2.jpg"] {
    background-image: url("/assets/img/MiscCar2.jpg");
}
.demo-image[data-image="/assets/img/MiscCar1.jpg"] {
    background-image: url("/assets/img/MiscCar1.jpg");
}
.demo-image[data-image="/assets/img/Misc2.jpg"] {
    background-image: url("/assets/img/Misc2.jpg");
}
.demo-image[data-image="/assets/img/MiscNatureHome.jpg"] {
    background-image: url("/assets/img/MiscNatureHome.jpg");
}
.demo-image[data-image="/assets/img/MiscPatriot.jpg"] {
    background-image: url("/assets/img/MiscPatriot.jpg");
}


.demo-image[data-image="/assets/img/Flowers1.jpg"] {
    background-image: url("/assets/img/Flowers1.jpg");
}
.demo-image[data-image="/assets/img/NatureLandscape3.jpg"] {
    background-image: url("/assets/img/NatureLandscape3.jpg");
}
.demo-image[data-image="/assets/img/NatureLandscape4.jpg"] {
    background-image: url("/assets/img/NatureLandscape4.jpg");
}
.demo-image[data-image="/assets/img/NatureLandscape2.jpg"] {
    background-image: url("/assets/img/NatureLandscape2.jpg");
}
.demo-image[data-image="/assets/img/NatureLandscape1.jpg"] {
    background-image: url("/assets/img/NatureLandscape1.jpg");
}
.demo-image[data-image="/assets/img/NatureLandscape5.jpg"] {
    background-image: url("/assets/img/NatureLandscape5.jpg");
}


.demo-image[data-image="/assets/img/TennisPerson1.jpg"] {
    background-image: url("/assets/img/TennisPerson1.jpg");
}
.demo-image[data-image="/assets/img/PeopleCar2.jpg"] {
    background-image: url("/assets/img/PeopleCar2.jpg");
}
.demo-image[data-image="/assets/img/AshWednesday.jpg"] {
    background-image: url("/assets/img/AshWednesday.jpg");
}




body.intense-viewing .navbar,
body.intense-viewing header,
body.intense-viewing section,
body.intense-viewing footer,
body.intense-viewing .bg,
body.intense-viewing .bg-static,
body.intense-viewing .bg-glows,
body.intense-viewing::before {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
}


body > figure {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
    max-width: 100vw !important;
    max-height: 100vh !important;
    margin: 0 !important;
    padding: 0 !important;
    z-index: 9999999 !important;
    overflow: hidden !important;
}


body > figure > img {
    display: block !important;
    position: relative !important;
    max-width: none !important;
    max-height: none !important;
}


body > figure > figcaption {
    position: fixed !important;
    bottom: 0 !important;
    left: 0 !important;
    z-index: 10000000 !important;
}


@media (max-width: 575px) {
    .demo-image {
        height: 150px;
        margin-bottom: 12px;
    }
}
