/*Fonts: 
PressStart2P: font-family: 'Press Start 2P', cursive;
Londrina Shadow: font-family: 'Londrina Shadow', cursive;
Bungee: font-family: 'Bungee', cursive;
*/
@import url('https://fonts.googleapis.com/css?family=Bungee|Londrina+Shadow|Press+Start+2P');@font-face {
    font-family: LondrinaShadow;
    src: url(../assets/fonts/Londrina_Shadow/LondrinaShadow-Regular.ttf);
}

/*###################################################
  General Whole Page CSS Styling 
  ###################################################*/
body{
    background-image: linear-gradient(-90deg, black, #181818);
}
/*###################################################
  CSS For The Top Title Bar
  ###################################################*/
#header{
    text-align: center;
    color: #ffffff;
    font-family: 'Press Start 2P', cursive;
    font-size: 4vw;
}
#headerSubtitle{
    text-align: center;
    color: #ffffff;
    font-family: 'Press Start 2P', cursive;
    font-size: 1vw;
}
/*###################################################
  CSS To Make The Bio Look Good
  ###################################################*/
#bio{
    background-color: #181818;
    color: white;
}
#bioExteneded{
  background-color: #686868;
  color: white;
}

#bioExtenededProgramming {
  background-color: #e2e0e0;
  color: black;
}
/*###################################################
  The Stuff Below here Helps the Website Fit To Any 
  Devices Screen Size/Width
  ###################################################*/
.ButtonOptimization{
    font-family: 'Bungee', cursive;
}
.IconOmptimization{
    font-size: 1vw;
}
.BioTitleOptimization{    /*Title Font Sizing*/
    font-family: 'Londrina Shadow', cursive;
    font-size: 3.5vw;
}
.BioSubTitleOptimization{ /*Subtitle Font Sizinf*/
    font-size: 1.5vw;
}
/*###################################################
  Allows Resizing Of The Title, Subtitle, And Buttons
  Everything Below Just Resizes The Font, Which Works 
  Perfectly With Bootstrap, Since Its Very Responsive
  With Fonts. DO NOT TOUCH, UNLESS YOU KNOW WHAT YOUR 
  DOING       ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
  ^^^^^
  ###################################################*/
@media (min-width: 10px) and (max-width: 1100px) {
    #header{
        font-size: 5vw;
    }
    #headerSubtitle{
        font-size: 3vw;
 }
    .ButtonOptimization{
        font-size: 3vw;
}
    .IconOmptimization{
        font-size: 3.5vw;
}
    .BioTitleOptimization{
        font-size: 8.5vw;
 }
 .BioSubTitleOptimization{ /*Subtitle Font Sizing*/
    font-size: 4.5vw;
}
}