@import url(https://fonts.googleapis.com/css?family=Raleway);
/* list of variables to edit */

/* body, form {
  margin: 0;
  padding: 0;
}
body {
  background: white;
} */

.fa-amazon {
  color: orange;
}

/* black buttons */
.btn-primary {
    color: #fff;
    background-color: #000;
    border-color: #000;
}

.btn-primary:hover {
    color: #fff;
    background-color: #000;
    border-color: #000;
}

.btn-success {
    color: #fff;
    background-color: #000;
    border-color: #000;
}

.btn-success:hover {
    color: #fff;
    background-color: #000;
    border-color: #000;
}

.pubwriter a {
  color: orange;
}

/* Center all Images + Responsive */
.pubwriter img {
  display: block;
  height: auto;
  margin: 0 auto;
  max-width: 100%;
}

body{
  margin: 0;
  padding: 0;
  font-family: "montserrat";
  background-image: linear-gradient(125deg,#2c3e50,#27ae60,#2980b9,#e74c3c,#8e44ad);
  background-size: 400% 400%;
  animation: bganimation 15s infinite;
}

@keyframes bganimation {
  0%{
    background-position: 0% 50%;
  }
  50%{
    background-position: 100% 50%;
  }
  100%{
    background-position: 0% 50%;
  }
}

@media print {
  /* Don't print link hrefs */
  a[href]:after {
    content: none;
  }
}
/* Default font */
* {
  font-family: Helvetica;
}
* {
  font-family: "Raleway";
}
body {
  padding: 70px 0 2rem;
}
.pubwriter {
  background-color: #fff;
  padding: 1rem 3rem;
  /* give the elevated page look */
  border: 1px solid rgba(0, 0, 0, 0.2);
  border-radius: 0.6rem;
  box-shadow: 0px 10px 15px rgba(0, 0, 0, 0.5);
  /* Default to centering header text */
  /* increase spacing between list items */
  /* Increase font size of bulleted and numbered lists */
  /* Make font larger and increase default spacing */
  /* Make the default line break darker */
  /* Images */
}
.pubwriter > h1 {
  text-align: center;
}
.pubwriter > ul {
  line-height: 2rem;
}
.pubwriter > ul > li {
  font-size: 1rem;
}
.pubwriter > p {
  font-size: 1.1rem;
  line-height: 2rem;
}
.pubwriter > a {
  color: red;
}
.pubwriter > hr {
  border-color: #d5d5d5;
}
.pubwriter > p > img {
  display: inline-block;
  height: auto;
  max-width: 100%;
}


.pubwriter > blockquote {
  // background-color: rgb(173, 189, 227);
  background: url(https://source.unsplash.com/user/erondu/1000x200);
  color: white;
  opacity: 2;
  /* relative positioning for the quote */
  position: relative;
  font-size: 1rem;
  /* standout */
  padding: 1rem 3rem;
  // border: 1px solid #000 2;
  /* add blue side borders */
  border-left: 10px solid #27a2d5;
  border-right: 10px solid #27a2d5;
  /* make it stand out with a small shadow*/
  box-shadow: 0px 10px 15px #000 5;
}

blockquote p:first-letter {
  font-size: 4.5em;
  float: left;
  margin-top: -.3em;
}

.pubwriter > blockquote::before {
  content: "\201C";
  /*Unicode for Left Double Quote*/
  position: absolute;
  left: 5px;
  top: 0;
  /* pick a font that has a good quote character */
  font-family: Georgia, serif;
  font-size: 4rem;
  font-weight: bold;
  color: white;
}

.flat {
  /* removing border and shadow to flatten into page */
  border: 0;
  box-shadow: none;
}

/*------- STATE -------*/
/* Mobile styles */
@media screen and (max-width: 768px) {
  /* Make font normal size on mobile */
  .pubwriter > p {
    font-size: 1rem;
  }
  .pubwriter > blockquote {
    font-size: 1rem;
  }
}