/* for home page title text*/
html, body {
    height: 100%;
    width: 100%;
    background-color:#ffffff;
    font-family: 'Space Grotesk';
    font-size: 22px;
    
  }
  
  
  /*styling nav bar*/
  nav ul{
    list-style-type: none;
    background-color: #ffffff;
    text-align: center;
    padding:5px;
    display: flex;
    justify-content: space-evenly;
  }
  
  nav li{
    margin: 0;
    padding: 0;
    display: block;
  }
  
  nav a {
    color: #050505;
    font-size: 1.2vw;
    text-decoration: none;
    font-family: 'Space Grotesk';
    font-weight:300;
    padding:12px;
    border-radius:25%;
  }
  
  nav a:hover{
    background-color:#bdbfc2;
    font-weight:400;
    color:black;
    border-radius:25%;
  }

  /*lines across pages style*/

  hr {
    margin-left: 300px; 
    margin-right: 300px; 
    border: none; 
    border-top: 1px solid #ccc; 
  }
  
/*have absolutely no idea what this is*/
  
  
  img{
    width:100%;
    height: auto;
  }
  .flex-container{
    display:flex;
    flex-direction:row;
    flex-wrap:nowrap;
  
  
   align-items:center;
    justify-content:center;
  }
  
  .flex-item{
    flex-basis:100%;
    margin:1%;
    
  }
  
  /*button {
      color:#04395E;
      
    font-family: 'Koulen', cursive;
    font-size:20px;
      background-color: #e3ddee;
    border-radius:15%;
    height:20%;
    width:20%
  }*/


  /*styling text*/
  h1{
    color:#000000;
    font-family: 'Space Grotesk';
    font-size:50px;
    
  
  }
  #mainTitle{
    color:#000000;
    font-family: 'Space Grotesk';
    font-size:400%;
  
  #brandName{
    color:#000000;
    font-family: 'Space Grotesk';
    font-size:400%;
    align-items:center;

  }

  }
  h9{
    color:#000000;
    font-family: 'Space Grotesk';
    font-size:400%;
    text-align: right;

  }
    
  
  
  #mainTitle:hover{
    color:#ad0b0b;
    background-color:#f3ecec;
    
    
    
    
  }
  
  
  h3{
    font-family: 'Space Grotesk';
    color:#04395E;
  }
  
  
  p{
    color:#031D44;
    font-family: 'Space Grotesk';
    margin-left:5%;
    margin-right:5%;
  }

  iframe {
     display: block;
     margin: 0 auto;
  }
  
  /*MAIN PAGE*/
  .bigHeader{
    padding-top:0px;
    display:flex;
    align-items:center;
    justify-content:center;
    text-align: center;
    mix-blend-mode: normal;
    width:100%;
    height:100%;
    font-size:300%;
    
  }

  .initialSubtext{
    padding-top:0px;
    display:flex;
    align-items:center;
    justify-content:center;
    text-align: center;
    mix-blend-mode: normal;
   
  }

  
  
  #title{
    font-size:5vw;
    margin-top: 10px;
    display:inline;
    margin-bottom: 2px;
    margin-right:5%;
  }
  
  .mainimages{
    display:flex;
    flex-direction:row;
    flex-wrap: nowrap;
  }
  
  .mainflexitem{
    flex-basis:100%;
    margin: 1%;
  }
  
  
  #classPrompt{
    padding-left:100px;
    padding-right:100px;
    display: flex;
    font-size: 70%;
    margin-top:0%;
    color:#000000;
    font-family: 'Space Grotesk';
    align-items: center;
    justify-content: center;
    text-align: center;
    mix-blend-mode: normal;
  } 
  
  #siteinfo{
    /*padding-left:400px;
    padding-right:400px;*/
    display: flex;
    font-size: 1.5vw;
    margin-top:2%;
    color:#000000;
    margin-right:5%;
    font-family: 'Space Grotesk';
    text-align:center;
  } 
  
  #secondsubtitle{
    padding-left:10px;
    padding-right:10px;
    display: flex;
    font-size: vw;
    margin-top:2%;
    color:#000000;
    margin-right:5%;
    font-family: 'Space Grotesk';
    text-align:center;
  } 
  
  .flex-container{
    display:flex;
    flex-direction: row;
    flex-wrap: nonwrap;

  }
  
  .flex-item{
    flex-basis: 100%;
    margin: 1%;


  }
  
  #codingPic{
    height:20%;
    width:20%;
    padding-left:900px;
    padding-right:5px;
    margin-top:-21em;
    border-radius:5%;
  }
  /*second page*/
  #textRight{
    margin-right:10%;
    margin-left: 5%;
    font-size: 1.5vw;
  }
  
  #secondPageTitle{
    color:#000000;
    font-family: 'Space Grotesk';
    margin-left:5%;
    font-size: 3vw; 
    margin-bottom:0;
    margin-top:0;
    
  }
  
  #digitalWorld{
    height:20%;
    width:25%;
    border-radius:10%;
  }
  #factTitle{
    font-size:2.5vw;
    text-align: center;
    color: white;
    margin-bottom: 0px;
    letter-spacing: 1px;
  }
  
  .classButtonContainer{
    
    height: 100px;
    text-align: center; /* Center the button horizontally */
    margin-top: 20px; 
      
  }
  button{
  
    color:#fdfafa;
  
    font-family: 'Space Grotesk';
    font-size:25px;
    background-color: #e83b3b;
    border-radius:5%;
    border-color:#e15353;
    margin: 0 auto; /* Center the button */
    display: block; /* Allow it to take the full width */
    width: 200px;
    height: 50px;

  
  }

  button:hover{
    color:#ffffff;
    background-color: #322424;
    border-color:#322424;
    
  }


  .prioritiesContainer{
    
    height: 100px;
    text-align: center; /* Center the button horizontally */
    margin-top: 20px; 
      
  }

  priorityButton{
    color:#fdfafa;
  
    font-family: 'Space Grotesk';
    font-size:16px;
    background-color: #e83b3b;
    border-radius:5%;
    border-color:#e15353;
    margin: 0 auto; /* Center the button */
    display: block; /* Allow it to take the full width */
    width: 200px;
    height: 50px;

  }
  







  


  

  

  
  
  
  #fact{
    text-align: center;
    color: white;
    font-size:1.5vw;
    margin-right:2.5%;
  }
  .factGenerator{
    background-color:#3c6244;
    margin-top: 2%;
    padding-left:100px;
    padding-right:100px;
    border-radius:10%;
  }
  
  /*third page*/
  
  #CIAtriad{
    border-radius: 20%;
    float: right;
    height:50%;
    width:50%;
    border:solid 5px #ccccff;
  }
  
  #thirdpagetitle{
    font-size:3vw;
    margin-left:5%; 
    padding-top:10px;
    right: 20px;
    -webkit-text-stroke:.003px #fa00e5;
  }
  
  #thirdtext{
    margin-left:5%;
    padding-right:50%;
    font-family: 'Poppins', sans-serif;
    font-size: 1.5vw;
    color:#f0f9ff;
    
  }
  
  #SecurityInfo{
    font-size: 2vw;
    color:#c2a9c7;
    font-family: 'Koulen', cursive;
  }
  
  .passwordGenerator{
    background-color:#d080ab;
    margin-top: 10%;
    padding:0;
  }
  
  #passwordtext{
    color:white;
    font-family: monospace;
    text-align:center;
    font-size:15px;
  
  }
  /*fourth page*/
  
  #fourthtitle{
    margin-left:5%;
    margin-right:5%;
    margin-bottom:0;
    font-size: 3vw;
    -webkit-text-stroke:.003px #e9fa00;
  }
  
  h4{
    font-family: 'Koulen', cursive;
    color:#e9f2a6;
    font-size: 25px;
    margin-right:5%;
    margin-left:5%;
    margin-bottom:0;
    margin-top:0;
  }
  
  #subtitle4{
    font-size:2vw;
    font-family: 'Koulen', cursive;
    color:#ddd736;
  }
  
  
  .fourthpagetext{
    margin-left:5%;
    margin-right:5%;
    color:#ece87e;
    font-size:1.8vw;
    font-family: 'Koulen', cursive;
  }
  .careerGenerator{
    background-color:#000000;
    font-size: 1.5vw;
    color:#dfa8e6;
    margin-top:0;
    margin-bottom:0;
  }
  .tips{
    font-size: .85vw;
    color:#e5e3ae;
    margin-top:0;
  }
  
  .tipstitle{
    font-size: 2.5vw;
    color:#f8f2aa;
    margin-bottom:0;
  }
  
  .mad{
    width:50%;
    float:right;
    margin-left:5%;
    margin-right:5%;
    border: solid 5px #f8f2aa;
    margin-top:5%;
  }
  
  hr{
    border: 1px solid #0c0d0d;
  }
  
  #womencard{
   width:50%;
   height:50%; 
   object-position: 50% 49%;
   object-fit: cover;
   border: 5px solid #031D44;
   margin-right:5%;
   margin-left:5%;
  }
  
  /*page 5*/
  .refs{
    margin-left:5%;
    padding-right:50%;
    font-family: 'Poppins', sans-serif;
    font-size: 1.5vw;
    color:#031D44;
    white-space: nowrap;
    margin-top:10%;
  }
  
  #title5{
    margin-left:5%;
    margin-right:5%;
    font-size: 3.5vw; 
    margin-bottom:0;
    -webkit-text-stroke:.003px red;
  }
  
  #subtitle5{
    margin-left:5%;
    margin-right:5%;
    font-size:2.25vw;
    margin-top:0;
    color:#f44e4e
  }
  .cryptvideo{
    width:50%;
    float:right;
    margin-left:5%;
    margin-right:5%;
    border: solid 5px #ff000d;
    margin-top:5%;
  }
  .python{
    width:50%;
    height:40%;
    margin-left:2%;
    margin-right:50%;
    margin-bottom:10%
  }
  .game{
    width:50%;
    height:40%;
    margin-left:50%;
    margin-right:2%;
    margin-top:-28%;
  }
  #closewords{
    margin-left:2%;
    margin-right:50%;
    font-size: 1.8vw;
    color: #eabdbd;
    font-family: 'Koulen', cursive;
    
  }
  /*page6*/
  #sixthtitle{
    margin-left:5%;
    margin-right:5%;
    font-size: 3.5vw; 
    margin-bottom:0;
    -webkit-text-stroke:.003px #0126f9;
  }
  #add{
    color:white;
  }
  #poemone{
    font-size:1.5vw;
    color:#d8dbdf;
    font-family: 'Koulen', cursive;
  
  }
  #poemtwo{
    font-size:1.5vw;
    color:#6f97d8;
    font-family: 'Koulen', cursive;
    margin-top: -160%;
  }
  #poemthree{
    font-size:1.5vw;
    color:#2f7ef4;
    font-family: 'Koulen', cursive;
    margin-top: -140%;
  
  }
  #poemfour{
    font-size:1.5vw;
    color:#9eb8df;
    font-family: 'Koulen', cursive;
    margin-top: -160%;
  
  
  }