/*
 Color Options
 --29162C, 54337D, 785ECD, D451A2, 6ECBE3--
-- DE85D3, 593269, 35142F, 655ECF, 56B5DB--
*/
 :root {
     /*FONT VARIABLES*/
    --main-font-family: 'Audiowide', cursive;
    --body-font-family: 'VT323', monospace;
     /*COLOR VARIABLES*/
    --black: black;
    --cyan: cyan;
    --magenta: magenta;
    --white: white;
    --darkpurple: #29162C;
    --medpurple: #54337D;
    --lightpurple: #d49fff;
    --lightestpurple: #d5bbff;
    --pink: #DE85D3;
    --teal: #56B5DB;
    --bodyback: #eeeeee;
 }

 /*COLOR CLASSES*/
 .darkpurple {background-color: var(--darkpurple);}
 .medpurple {background-color: var(--medpurple);}
 .lightpurple {background-color: var(--lightpurple);}
 .pink {background-color: var(--pink);}
 .teal {background-color: var(--teal);}

 body {background-color: black;}
 .container {background-color: white;}
 .nopad {padding: 0px;}

 /*CUSTOM CLASSES*/
 .mybanner {
     background-image: url(images/city-ga833aada9_1920.jpg);
     background-size: cover;
     background-position-y: center;
     color: white;
     text-shadow: 5pt 5pt black;
     margin: 0px;
 }
.mybanner a {color: white !important;}
.mybanner a:hover {
    color: white !important; 
    text-decoration: none !important;}
.mybanner a:visited {color: white !important;}
.pad-1 {padding: 1vh !important;}
.mar-1 {margin: 1vh !important;}
.mar-2 {margin: 2vh !important;}
.snaz-bdr {
    border-radius: 1px !important;
    box-sizing: border-box !important;
    border-style: solid !important;
    border-image: linear-gradient(135deg, var(--teal) 25%, transparent 30%, transparent 70%, var(--pink)75%) 100% !important;
    border-image-slice: 1 !important;
}
.border-gradient {
    border-width: 10px !important;
    box-sizing: border-box !important;
    border-style: solid !important;
    border-image: linear-gradient(135deg, var(--teal), black 30%, black 70%, var(--pink)) 100% !important;
    border-image-slice: 1 !important;
}
.glowyshadow {
    color: var(--darkpurple);
    display: inline-block;
    text-shadow: 
    0PX 0PX 1PX white,
    0px 0px 4px var(--medpurple),
    0px 0px 7px var(--lightpurple),
    0px 0px 10px var(--lightestpurple);
    position: relative;
}
.glowyshadow::after {
    content: "";
    display: block;
    position: absolute;
    background: var(--medpurple);
    top: 50%;
    left: 5%;
    width: 90%;
    height: 100%;
    transform: perspective(1em) rotateX(25deg) scale(1, 0.15);
    filter: blur(.35em);
}
.floatfig {width: 30%;}

/*BACKGROUND MODIFICATIONS*/
.container {background-color: var(--darkpurple);}

 h1, h2, h3, h4, h5, h6 {
     font-family: var(--main-font-family);
 }

 /*FONT MODIFIERS*/
 .fontbig {
     font-size: 550%;
 }
 .neonfont {
    color: black;
    background: -webkit-linear-gradient(135deg, var(--teal), transparent, var(--pink)) 100% !important;
    -webkit-background-clip: text !important;
    -webkit-text-stroke: 5px transparent !important;    
 }

 /*NAV MODIFICATIONS*/
 .nav a {
     font-family: var(--body-font-family);
     font-size: 120%;
     color: var(--pink);
     border: none;
 }
 .nav a:active {color: var(--white);}
.dropdown-menu, .dropdown-menu a{
    background-color: var(--pink);
    color: var(--darkpurple);
}
.dropdown-item a{
    color: var(--darkpurple);
}
.dropdown-toggle:active, .open .dropdown-toggle {
    background-color: var(--darkpurple);
    color: var(--pink);
}
.form-control, .input-group {height: 45px;}
.input-group .material-icons {align-items: center; justify-items: center;}

/*MAIN MODIFICATIONS*/
main h1 {color: var(--darkpurple) !important;}
.wordbreak {
    word-wrap: break-word !important;
    word-break: break-all !important;
    white-space: normal !important;
}
main .container {
    background-color: var(--bodyback);
    color: var(--darkpurple);
    font-family: var(--body-font-family);
    font-size: 110%;
}
main p::first-letter {
    font-size: 125%;
    color: var(--darkpurple);
    text-shadow: 1px 1px var(--lightpurple);
}

/* VENDING MACHINE SHENNANIGANS */
.vend * {
    font-family:var(--body-font-family);
    background-color: black;
}
.vendhead {
    font-size: 60pt;
    color: black;
    width: 90%;
    height: auto;
    border: none;
    margin: 1vh 1vh;
    padding: 0vw 1vw;
    background: rgb(214, 214, 214);
    box-shadow: 0 0 10px #9521f3, 0 0 20px #c600ee, 0 0 40px #f704f7;
    outline: none;
    border-radius: 20px;
}
.vendmini {
    color: black;
    width: 90%;
    height: auto;
    border: none;
    margin: 1vh 1vh;
    padding: 0vw 1vw;
    background: rgb(214, 214, 214);
    box-shadow: 0 0 10px #9521f3, 0 0 20px #c600ee, 0 0 40px #f704f7;
    outline: none;
    border-radius: 20px;
}
.vendtext {
    color: linear-gradient(135deg, var(--teal) 25%, transparent 30%, transparent 70%, var(--pink)75%) 100% !important;
}