/*
Theme Name: NoctuWriMo
Theme URI: https://noctuwrimo.org
Author: NoctuWriMo
Description: Custom theme for NoctuWriMo, a NaNoWriMo-revival community site.
Version: 1.0
*/

@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

body.noctuwrimo-actual-homepage {
    animation: fadeIn 5s ease-in;
}

@media (max-width: 768px) {
    body {
        background-image: none;
        background-color: #000000;
    }
}

body {
    background-color: #000000;
    background-image: url("images/background-2.jpg");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
    font-family: 'Garamond', serif;
    color: ghostwhite;
    cursor: url('images/cursor.cur'), auto;
}

nav.navbar {
    width: 100%;
    font-family: 'Trebuchet MS', serif;
    background: linear-gradient(
        to bottom,
        #606060 0%,
        gray 20%,
        dimgray 50%,
        #3a3a3a 80%,
        #606060 100%
    );
}

nav.navbar .navbar-nav {
    width: 100%;
    justify-content: space-evenly;
}

/* Nav link color */
nav.navbar .nav-link {
    color: ghostwhite !important;
}

/* Nav link hover color */
nav.navbar .nav-link:hover {
    color: greenyellow !important;
}

/* Active link */
nav.navbar .nav-link.active,
nav.navbar .nav-item.active .nav-link {
    color: blue !important;
}

nav.navbar .navbar-toggler {
    border-color: #c0c0c0;
}

nav.navbar .navbar-toggler-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='30' height='30' viewBox='0 0 30 30'%3e%3cpath stroke='rgba(192, 192, 192, 1)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}

.logo-img {
    max-width: 100%;
    height: auto;
    padding: 15px 0;
    display: block;
    margin: 0 auto;
}

h1, h2, h3, h4, h5, h6 {
    text-align: center;
    font-family: 'verdana', sans-serif;
    color: ghostwhite;
    font-weight: bold;
}

.container-fluid {
    max-width: 1200px;
    margin: 0 auto;
    background-color: #000000;
    padding-left: 30px;
    padding-right: 30px;
    background-image: url("images/border-vertical-1.gif"), url("images/border-vertical-1.gif");
    background-repeat: repeat-y, repeat-y;
    background-position: left top, right top;
}

@keyframes glowPulse {
    0%, 100% { text-shadow: 0 0 5px ghostwhite; }
    50% { text-shadow: 0 0 20px ghostwhite, 0 0 40px silver; }
}

h6 {
    animation: glowPulse 3s ease-in-out infinite;
}

@keyframes popIn {
    from {
        opacity: 0;
        transform: scale(0.8);
    }
    to {
        opacity: 1;
        transform: scale(1);
    }
}

.col-12.col-md-6:nth-child(1) { animation: popIn 2s ease-out 4s both; }
.col-12.col-md-6:nth-child(2) { animation: popIn 2s ease-out 6s both; }
.col-12.col-md-6:nth-child(3) { animation: popIn 2s ease-out 8s both; }
.col-12.col-md-6:nth-child(4) { animation: popIn 2s ease-out 10s both; }

@keyframes flicker {
    0%, 100% { opacity: 1; text-shadow: 0 0 20px ghostwhite, 0 0 40px silver; }
    92% { opacity: 1; text-shadow: 0 0 20px ghostwhite, 0 0 40px silver; }
    93% { opacity: 0; text-shadow: none; }
    94% { opacity: 1; text-shadow: 0 0 20px ghostwhite, 0 0 40px silver; }
    96% { opacity: 0; text-shadow: none; }
    97% { opacity: 1; text-shadow: 0 0 20px ghostwhite, 0 0 40px silver; }
}

.welcome-home {
    animation: flicker 4s infinite;
}

@keyframes fadeOut {
    from { opacity: 1; transform: scale(1); }
    to { opacity: 0; transform: scale(0); }
}

/* ============================
   FAQ page overrides
   ============================ */

/* Full-cover cathedral background, replacing the default */
body.page-slug-faq {
    background-image: url("images/cathedral.jpg");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
}

/* No vertical knot-border side borders on this page */
body.page-slug-faq .container-fluid {
    background-image: none;
}

/* No font/heading animations on this page */
body.page-slug-faq h1,
body.page-slug-faq h2,
body.page-slug-faq h3,
body.page-slug-faq h4,
body.page-slug-faq h5,
body.page-slug-faq h6 {
    animation: none !important;
    text-shadow: none !important;
}

/* ============================
   Tips and Tricks page overrides
   ============================ */

/* Full-cover trees background */
body.page-slug-tips-and-tricks {
    background-image: url("images/tips-trees.jpg");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
}

/* No vertical knot-border side borders on this page */
body.page-slug-tips-and-tricks .container-fluid {
    background-image: none;
}

/* ============================
   Webmistress page overrides
   ============================ */

/* Full-cover faces background */
body.page-slug-webmistress {
    background-image: url("images/webmistress-faces.jpg");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
}

/* No vertical knot-border side borders on this page */
body.page-slug-webmistress .container-fluid {
    background-image: none;
}