:root{
    --logo-primary-color: #C99383;
    --logo-secondary-color: #83B8C9;
    --logo-third-color:#b8c983;
    --logo-dark: #232C33;

    /*App Specific Color Pallette*/
    --light: #fefefe;
    --dark: #0F1814;
    --black-color: #000000;
    --lightmode-primary: #57722f;
    --lightmode-secondary:#363c67;
    --lightmode-accent: #720109;
    --darkmode-accent: ;
    --darkmode-primary: ;

    --lightmode-large: #ed4103;

    --striped-table: #f1f1f1;


    /* FizzBuzz Palette */
--fern-green: #57722Fff;
--blood-red: #720109;
--Night: #0F1814;





}


body{
    color: var(--dark);
    background-color: var(--light);
}

nav{
    background-color: var(--logo-dark);
}



footer{
    background-color: var(--logo-dark);
    padding: 1rem;
}

footer .social>a{
    color: var(--light);
    opacity: .75;
}

footer .social>a:hover{
    opacity: .9;
    color: var(--logo-secondary-color)

}


h1, h2, h3, h4, h5, h6 {
    color: var(--lightmode-primary);
}

.subheading {
    color: var(--lightmode-large);
}

main>.container{
    padding: 60px 15px 0;
    margin-bottom: 5rem;
}
.sticky-nav{
    position: fixed;
    left: 0;
    bottom: 0;
    width: 100%;
}

.checklist{
    color: var(--lightmode-primary);
}

.checklist >li i{
    color: var(--lightmode-large);    
}

.alert{
    color: var(--light);
    background-color: var(--dark);
}

.Fizz {
    color: var(--lightmode-primary);
    font-weight: bold;
    font-size: larger;
}

.Buzz {
    color: var(--lightmode-secondary);
    font-weight: bold;
    font-size: larger;
}

.FizzBuzz {
    color: var(--lightmode-accent);
    font-weight: bold;
    font-size: larger;

}

code[class*="language-"],
pre[class*="language-"] {
white-space: pre-wrap;
word-break: break-all;
word-wrap: break-word;
}

.bsicon{
    color:#7c09f8;
}

.jsicon{
    color: #e2d304;
}

.html5icon{
    color:#fe4e1d;
}

.css3icon{
    color:#0b52d6;
}