 body{
   background-color: black;
 }

  .container{
  padding-left:0px!important;
}

.content {
  border-radius: 25px;
  color: #f1f1f1;
  height: 100%;
  padding: 20px;
  margin-left:5%;
  min-height: 500px;

/* color - https://www.gradient-animator.com/ */
  background: linear-gradient(270deg, #000705, #d41906, #0d47d7, #d7ca0d, #1ce308, #71137b, #e842e2, #93e4e4, #e39f17);
  background-size: 1800% 1800%;
  
  -webkit-animation: remembertoday 46s ease infinite;
  -moz-animation: remembertoday 46s ease infinite;
  animation: remembertoday 46s ease infinite;
}

@-webkit-keyframes remembertoday {
  0%{background-position:0% 50%}
  50%{background-position:100% 50%}
  100%{background-position:0% 50%}
}
@-moz-keyframes remembertoday {
  0%{background-position:0% 50%}
  50%{background-position:100% 50%}
  100%{background-position:0% 50%}
}
@keyframes remembertoday {
  0%{background-position:0% 50%}
  50%{background-position:100% 50%}
  100%{background-position:0% 50%}
}


.slideshow-container { 
  max-width: 80%;
  margin-left: 10%;
  font-size: 30px; 
  text-align: center;
}

.prev, .next {
  cursor: pointer;
  margin-top: 15%;
  /* padding: 16px; */
  color: #888;
  font-weight: bold;
  font-size: 40px;
  border-radius: 0 3px 3px 0;
  user-select: none; 
  /* z-index: 200; */
}

/* .mySlides {
} */

.prev{
  float:left;
}

.next {
  float:right;
}

.prev:hover, .next:hover {
  background-color: rgba(0,0,0,0.8);
  color: white;
  text-decoration: none;
}

q {font-style: italic;}

.mymessage{
display:block;
}
.author {
  color: #888; 
  display:inline-block;
}

.date {
  padding-left:10px;
  color: #888; 
  display:inline-block; 
}

.rating {
  color: #888; 
}
.author, .date, .rating{
font-size: 22px;
font-weight: bolder;
}

footer{
color:white;
}


@media screen and (max-width: 992px) {
  .slideshow-container {
    font-size: 18px;
  }
  .author, .date, .rating{
    font-size: 12px;    
    }
  .prev, .next {
    font-size: 18px;
    margin-top: 30%;
  }
}

@media screen and (max-width: 600px) {
  .slideshow-container {
    font-size: 18px;
  }
  .author, .date, .rating{
    font-size: 12px;    
    }
  .prev, .next {
    font-size: 18px;
    margin-top: 50%;
  }  
} 