:root {
  
--brand-black: hsl(197, 44%, 19%);
  
--bot-height: 80vh;

}

* {
  
box-sizing: border-box;

}


body {
  
  padding: 3rem 1rem;

  font-family: sans-serif;

  color: var(--brand-black);

}


@media (min-width: 800px) {

  body {

    max-width: 800px;

    margin: 0 auto;

  }
}


p {
  
font-size: 1.2rem;

  line-height: 1.3;

}


.container {

  width: 100%;
  margin: 0;

}


.text-center {

  text-align: center;


}


/* Font sizes */
/* .xl {
  font-size: 3.5rem;
} */

/* .large {
  font-size: 2rem;
} */

/* Padding */
/* .reset-padding {
  padding: 0;
} */

/* Margin */
/* .reset-margin {
  margin: 0;
} */

/* .large-margin {
  margin-top: 2rem;
} */

/* .medium-margin {
  margin-top: 1.5rem;
} */


header {

  width: 100%;

  margin-bottom:
 3rem;

}


main {

  width: 100%;

  height: 80vh;

}


header img {

  display: inline-block;

  width: 100%;

  max-width: 400px;

  height: auto;

}


h1 {

  font-family: 'Source Sans Pro', sans-serif;

  line-height: 1.2;

}


h2, h3, h4 {

  font-family: 'Source Sans Pro', sans-serif;

  line-height: 1.2;

}


@media (min-width: 768px) {


  body {
    display: flex;
  
}


  header {
    width: 50vw;

    margin-right: 5vw;
  
}
  

  main {
    width: 45vw;
  
}


  .xl {
    font-size: 5rem;
  
}


  .large {
    font-size: 3rem;
  
}


}