@font-face {
    font-family: "BombFactory";
    src: url("bombfact.ttf") format("truetype");
}

/*THIS IS FOR THE HOMEPAGE!*/
.HTMLhome {
    background-image: url(/site-wide/backgrounds/greenNebula6.png);
    font-family:'Courier New', Courier, monospace;
    color: aliceblue;
    background-attachment:fixed;

    a {
        background-image: url(/site-wide/rainbowBorder.gif);
        background-clip: text;
        -webkit-background-clip: text;
        color: transparent;
    }
}

/*This is for the SHRINES page!*/
.HTMLshrine {
    background-image: url(/site-wide/backgrounds/backstar.gif);
    font-family:'Courier New', Courier, monospace;
    color: aliceblue;
    background-attachment:fixed;

    a {
        background-image: url(/site-wide/rainbowBorder.gif);
        background-clip: text;
        -webkit-background-clip: text;
        color: transparent;
    }
}


/*THIS WAS GENNED FROM https://grid.layoutit.com/!!*/
/* NOTE: THIS IS FOR THE WHOLE 3-COLUMN LAYOUT!!!*/
.container {
  display: grid; 
  grid-template-columns: 300px 1200px; 
  grid-template-rows: 1fr; 
  gap: 0px 10px; 
  grid-template-areas: 
    "left center"; 
  justify-content: center; 
  align-content: stretch; 
  justify-items: stretch; 
  align-items: stretch; 
}
.left {
        grid-area: left;
        border-style: solid;
        border-color: #ffffff;
        background-color: black;
        border-radius: 13px;
        padding: 10px;
        filter:
            drop-shadow(0px 0px 20px #15ff00);
        
        h3 { margin-bottom: 0px;}
        hr {
            color:rgb(250, 194, 8);
            height: 2px;
            border: none;
            background-color: rgb(250, 194, 8);
        }
        img {
            max-width: 275px;
        }

        iframe {
            max-width: 275px;
            border-style: none;
    }
    }
.center {
        z-index: 1;
        grid-area: center;
        border-style: solid;
        border-color: rgb(255, 255, 255);
        background-color: black;
        border-radius: 13px;
        padding: 10px;
        filter:
            drop-shadow(0px 0px 20px #15ff00);
        hr {
            color: #0285ff;
            height: 2px;
            border: none;
            background-color: #0285ff;
        }
        
        .myPages {
            img {
                padding: 12px;
            }
        }

    }
    .centerTop {
        grid-area: left;
        padding: 10px;
    }
.right {
        grid-area: right;
        border-style: solid;
        border-color: #c6e3ff;
        background-color: black;
        border-radius: 13px;
        padding: 10px;
        filter:
            drop-shadow(0px 0px 20px #008cff);
        h3 { margin-bottom: 0px;}
        hr {
            color:rgb(250, 194, 8);
            height: 2px;
            border: none;
            background-color: rgb(250, 194, 8);
        }
        img {
            max-width: 275px;
        }

        iframe {
            max-width: 275px;
            border-style: none;
    }
}

/* FROM OLD VERSION! */
.rainbowText {
  background-image: url(/site-wide/rainbowBorder.gif);
  background-clip: text;
  -webkit-background-clip: text;
  color: transparent;
  filter:
    drop-shadow(2px 2px #0285ff);
}

.pageCharacterRight {
    z-index: 100;
    position: absolute;
    left: 1180px;
    bottom: 50%;
    float: left;
}