body{
       width:100%;
       color:black;
       background-color:whitesmoke;
       overflow:hidden;
       font-family:helvetica;
       background-image:url('https://64.media.tumblr.com/8ca3f7d994951c521657ca255bc72d7f/43fdbe12e26b76c8-68/s540x810/704070e4518933abbfcf2f3014345bbc5ce46680.jpg');
       }
   
    #container{
      height:600px;
      width:800px;
      border-radius:10px;
      border:1px black;
      box-shadow:0px 0px 15px grey;
      background-color:white;
      color:black;
      background-image:linear-gradient(white,#ECF0FF);
     position:relative;
     overflow:hidden;
     margin:0 auto;
     margin-top:50px;
    
    
      }
      
      #navb{
        top:0;
        height:40px;
        width:800px;
        position:absolute;
        color:white;
        background-color:blue;
        border-radius:5px 5px 0 0;
        background-image:linear-gradient(#5262D2,#081888);
        z-index:10000;}
        
        .navlinks
        {color:white;}
        
         #navb2{
           top:40px;
        height:25px;
        width:800px;
        position:absolute;
        color:black;
        background-color:white;
        box-shadow:0px 0px 10px grey;
        z-index:1000;
        border:5px yellow;}
        
        a{color:aqua;}
        a:hover{color:aqua;}
        a:visited{color:aqua;}
        
        .flex-container {

    display: flex;
    /* flex-flow: row; */ 
    flex-direction: row;  
    background-color: white;
    top:65px;
    height: 300px;
    padding: 0;
    position:absolute;

  }

  .flex-container > div:nth-child(1){
    background-color: white;
    border: 1px solid whitesmoke;
    border-radius: 5px;
    padding: 8px;
    box-shadow:0px 0px 2px grey;
    height:100%;
    width:515px;
    overflow:hidden;
    background-image:url('https://imagesvc.meredithcorp.io/v3/mm/image?url=https%3A%2F%2Fcf-images.us-east-1.prod.boltdns.net%2Fv1%2Fstatic%2F3281700261001%2Fa0d231cc-a242-48bd-a8dc-b0956cf36b63%2F699ec464-b3e3-462a-a2ea-ac4e74e9196a%2F1280x720%2Fmatch%2Fimage.jpg');
    background-size:contain;
    
  }
  
  .flex-container > div:nth-child(2){
    background-color: white;
    border: 1px solid whitesmoke;
    border-radius: 5px;
    padding: 8px;
    box-shadow:0px 0px 2px grey;
    height:100%;
    width:266px;
    background-image:linear-gradient(white,#ECF0FF);
  }





.textmap{
  width:150px;
  height:50px;
  position:absolute;
  z-index:1000000;
  background-color:blue;
  left:0;
  top:270px;
  border-radius: 0px 5px 5px 0px;
  margin-left:1px;
  font-size:14px;
  text-align:center;
  line-height:50px;
  color:gold;
  background-image:linear-gradient(#5262D2,#081888);
  opacity:0.8;}

.fflogo{
  position:absolute;
  z-index:10000000;
  left:350px;
  top:-10px;}


.flex-container2 {

    display: flex;
    /* flex-flow: row; */ 
    flex-direction: row;  
    background-color: white;
    top:365px;
    height: 230px;
    padding: 0;
    position:absolute;
    left:0;
    justify-content:space-evenly;
    width:800px;

  }

  .flex-container2 > div{
    background: white;
    border: 1px solid whitesmoke;
    border-radius: 5px;
    box-shadow:0px 0px 2px grey;
    height:100%;
    width:266px;
    background-image:linear-gradient(white,#ECF0FF);
  }

   
   
   .flextitleb{
        top:0;
        height:20px;
        width:100%;
        left:0px;
        color:gold;
        background-color:blue;
        border-radius:5px 5px 0 0;
        background-image:linear-gradient(#5262D2,#081888);
        z-index:10000;
        font-size:10px;
        justify-content:space-evenly;
        margin:0;
        padding:0;
        text-align:center;
        line-height:20px;
        }
        
      
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        
        @media only screen and (max-width: 900px) {

}