html{
  background-color: #C51C2E ;
}

body {
  font-family: "El Messiri", "BenchNine", "Patua One", sans-serif;
  background-color: #212121  ;
  color: #eeeeee;
  padding: 5%;
  margin: 5% 20% 20% 20%;
/*   min-width: 700px; */
}
h1{
/*   color: #F94854 !important; */
  color: #D0666E  !important;
  font-family: Cinzel, sans-serif;
  margin-bottom: -3%;
}
h2{
  color: #eeeeee;
  font-style: italic;
  font-size: 18px !important;  
  margin-bottom: 8%;
  text-align: center;
}
h3{ color: #eeeeee     ;}
h4{ color: #eeeeee  ; text-align:right;}
#castiel-face{
  border-color: #C51C2E            ;
  border-width: 25px;
  border-style: solid;
  border-radius: 50%;
  max-width: 125px;
}

a{
  color: #F6747D;
  color: #F6747D  !important;
}

.main-container{
  max-width: 580px;
}

.section{
    background-color: #eeeeee   ;
/*   font-size: 16px; */
  padding: 20px;
  margin-bottom: 50px;
  border-radius: 6px;
  color: #3e2723 ;
  
}

p{
/*   margin-bottom: 0px; */
}

li{
  margin-right: 40px;
  margin-bottom: 20px;
}
ul{
  margin: 20px 0px 20px 0px;
}

@media(max-width:700px){
  body{
    margin:0;
  }
  #harambe-face{
/*     display:none; */
    margin:auto;
    margin-bottom:5%;
  }
  li{
    margin:0 0 20px 0;
  }
  ul{
    margin:0 0 0 -40px;
    list-style-position:inside;
  }
}

@media(min-width:700px) and (max-width:1100px){
  body{
    margin: 5%;
  }  
  #harambe-face{
    margin:auto;
    margin-bottom:5%;
  }
}