*{ margin:0;
  Padding:0;
 }
 ul { 
  }
 ul li{ display: inline-block; 
 list-style: 0; }
 ul li a { text-decoration: 0; 
  font size: 20 px;
  font-family: arial;
  padding:0 20 px; 
  color: black; }

 img {  
max-width: 50%;  
height: auto;  
}  

.e{
  font-size: 24pt;
}

body{
width:100%;
}

@media only screen and (max-device-width: 480px) {
body{
    width:145%;
  }
  h1{
    text-align:center;
  }
.center{
  display: block;
  margin-left: auto;
  margin-right: auto;
  width:auto;
}
footer{
  position:absolute;

    }
}
 @media only screen and (min-device-width:900px ) and (max-device-width:1100px) {
  body{
    width:145%;
  }
  h1{
    text-align:center;
  }
}
.container {
  border: 2px solid #ccc;
  background-color: #000000;
  border-radius: 5px;
  padding: 16px;
  margin: auto;
  width: 85%;
  margin-bottom: 1em;
}

/* Clear floats after containers */
.container::after {
  content: "";
  clear: both;
  display: table;
}

/* Float images inside the container to the left. Add a right margin, and style the image as a circle */
.container img {
  float: left;
  margin-right: 20px;
  border-radius: 50%;
}

/* Increase the font-size of a span element */
.container span {
  font-size: 22pt;
  margin-right: 15px;
}

/* Add media queries for responsiveness. This will center both the text and the image inside the container */
@media (max-width: 500px) {
  .container {
    text-align: center;
  }

  .container img {
    margin: auto;
    float: none;
    display: block;
  }

  .container p {
    font-size: 18pt;
  }
  
  .container h3{
    color:white;
  }
}


.testimonial-title p{
  padding-bottom: 0.5em;
}

