:root {
    --nano-goes-oost-primary: #2d3b8e;
    --nano-goes-oost-secondary: #009ee2;
    --nano-goes-oost-off-white: #fefffe;
    --nano-goes-oost-bg: #f3f5ff;
    --nano-goes-active-menu-item: #ccecf9;
}

body {
    font-family: Georgia, serif ;
    background: var(--nano-goes-oost-bg);
}

h1 {
    color: var(--nano-goes-oost-primary);
}

#updates-title {
	color: var(--nano-goes-oost-primary);
}

.bg-go {
    background: var(--nano-goes-oost-primary);
}

.mod-menu {
    .nav-item {
        & a {
            padding: var(--bs-nav-link-padding-y) var(--bs-nav-link-padding-x);
            font-size: 1.25rem;
            font-weight: var(--bs-nav-link-font-weight);
            background: 0 0;
            border: 0;
            text-decoration: none;
            transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out;
            display: block;
            color: var(--nano-goes-oost-off-white);
        }

        & a:hover {
            text-decoration-line: underline;
        }
    }

    .active > a:first-of-type {
        color: var(--nano-goes-active-menu-item);
    }

    .deeper {
        @media (width >= 768px) {
            & ul {
                padding-left: 2.5rem;
            }
        }
    }
}

@media (width >= 768px) {
    #menu {
        width: 280px;
    }

    #content {
        width: calc(100% - 280px);
    }

    /*Slideshow module doesn't work properly*/
    .slideshowck {
        width: 50% !important;
    }

    .home-banner, .home-image-1, .home-image-2 {
        max-width: 95%;
    }
}

@media (width < 768px) {
    #menu {
        & img {
            display: none;
        }
    }

    #mainmenu {
        .nav-item {
            & a {
                padding-left: 0;
                padding-right: 0;
                text-align: center;
            }
        }

        .deeper {
            & ul {
                display: none;
            }
        }
    }

    #mainmenu {
        .menu-title {
            display: none;
        }
    }

    #menu {
        width: 50px;
    }

    #content {
        width: calc(100% - 50px);
    }

    /*Slideshow module doesn't work properly*/
    .slideshowck {
        width: 100% !important;
    }

    .camera_pag {
        display: none;
    }

    .home-banner, .home-image-1, .home-image-2 {
        max-width: 100%;
    }
	
}

@media (width >= 1025px) {
    .home-banner, .home-image-1, .home-image-2 {
        max-height: 400px;
    }
}

#menu {
    min-height: fit-content;
}

#activities {

    justify-content: start;
    padding: 0;
    margin-left: -0.5rem;

    & span {
        color: var(--nano-goes-oost-primary);
    }

    & li {
        border: 1px solid var(--nano-goes-oost-primary);
        box-shadow: 0 .5rem 1rem var(--nano-goes-oost-primary);
        border-radius: 0.5rem;
    }

    & a {
        display: flex;
    }

    .nav-item {
        margin: 0.5rem;
    }

    .menu-title {
        align-content: center;
    }
}

/*Slideshow module*/
.border-go {
    border: 1px solid var(--nano-goes-oost-primary);
    box-shadow: 0 .5rem 1rem var(--nano-goes-oost-primary);
    border-radius: 0.5rem;
}

.camera_fakehover {
    background: var(--nano-goes-oost-primary);
    border-radius: 0.4rem;
}

.camera_prevThumbs, .camera_nextThumbs, .camera_prev, .camera_next, .camera_commands, .camera_thumbs_cont {
    background: var(--nano-goes-active-menu-item);
}