@import url(https://fonts.bunny.net/css?family=heuristica:400|assistant:400);
@import url(https://unpkg.com/aos@next/dist/aos.css);

body{min-height:100vh;
background: #fff2f6;
color:#333;
  font-family:'assistant';
  margin:auto;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size:1em;
  }
  ::selection {
  background-color:#f7cde5;
  color: black;
  text-shadow: none;
}

::-moz-selection {
  background-color:#f7cde5;
  color: black;
  text-shadow: none;
}
 
.content {background:white;border-left:1px solid #f2d5e2;border-right:1px solid #f2d5e2;border-bottom:1px solid #f2d5e2;
  }
  
.box {max-width:350px;}
.box .section {margin:5px;padding:5px;font-size:0.8em;letter-spacing:1px;line-height:125%;}
.box .section p{margin-top:5px;margin-bottom:5px;text-align:justify}
.box .section p b {color:#d490cd}
.box .title {display: flex;background-image: linear-gradient(40deg,#f7cde5 0%, #ffebeb 49%, #FFEBD4 100%);color:#555;font-style:italic;
  border-top:1px solid #f2d5e2;border-bottom:1px solid #f2d5e2;
  align-items: center;}
  .box .title h1 {font-size:1.1em;margin:0; ;padding-left:3px;font-family:'Heuristica';letter-spacing:2px;color:#848fb5}
 
  .box .title .feather {padding:3px;color:#848fb5;margin:5px;
  width: 15px;
  height: 15px;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
  fill: none;
 ;
} 

.box .section .quote {border-left:1px dotted #333;padding-left:5px;margin-left:7px;font-style:italic;font-family:'heurestica';font-size:0.95em;}
.item {margin:auto;display:block}
.item a {color:#9fabd4;text-decoration:none;margin-top:5px;margin-bottom:5px;transition:0.6s}
.item a:hover {color:#848fb5;letter-spacing:2px;}
.box .bottom {text-align:center;}
.box .bottom a {letter-spacing:0px;color:#666;}
.box .bottom a:hover {letter-spacing:0px;color:#ddd}

@media screen and (max-width: 500px) {
 .box {max-width:100%}
}