/* CSS is how you can add style to your website, such as colors, fonts, and positioning of your
   HTML content. To learn how to do something, just try searching Google for questions like
   "how to change link color." */

body {
  background-color: white;
  color: black;
  font-family: Verdana;
}
/*applies to the main container div*/
.main-container {
  padding: 5px; /*adds 5 pixels to the inside border of the main container*/
  max-width: 1024px; /*limits the width of main container to a max size of 1024 pixels*/
  background-color: black;
  /* flex display is for dynamic ordering */
  display: flex; /* change display of main container to a flex box */
  flex-direction: row; /* all flex items in main container will be ordered in a row from left to right*/
  justify-content: center; /* organize items */
}

.left-container {
  max-width: 40%; /*limits the size of this box to 40% of its parent*/
  min-width: 40%; /* this container will not be any smaller than its parent size*/
  background-color:grey;
  margin-right: 10px;
  
  
}

.right-container {
  max-width: 40%;
  min-width: 40%;
  background-color:white;
  
}

.content-box {
  background-color:pink;
 
  
}