html {
  height: 100%;
  margin: 0;
  padding: 0;
  font-size: 100%;
  box-sizing: border-box; }

*, *:before, *:after {
  box-sizing: inherit; }

ul, ol, li {
  list-style: none;
  margin: 0;
  padding: 0; }

h1, h2, h3 {
  margin: 0;
  padding: 0; }

img {
  max-width: 100%;
  height: auto;
  vertical-align: middle; }

body {
  position: relative;
  height: 100%;
  width: 100%;
  padding: 0;
  margin: 0;
  background: #221A82;
  font-family: Tahoma, Arial, sans-serif;
  font-size: 1rem;
  line-height: 1.5;
  color: #1E1E1E; }

a, button, input, select, textarea, label, summary {
  -ms-touch-action: manipulation;
      touch-action: manipulation; }

a {
  color: #ff0404; }

a:hover {
  text-decoration: none; }

p {
  margin: 0 0 0.5em; }

.flex {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex; }

.flex.col {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column; }

.flex.align-center {
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center; }

.flex.justify-center {
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center; }

/*.btn { display: inline-block; padding: 0.45em 1.5em; background-color: #FE5068; color: #FFF; border-radius: 0.2em; box-shadow: 0 1px 2px rgba(126,24,39,0.4); text-align: center; font-size: 1rem; font-weight: 700; line-height: 1.25; cursor: pointer; transition: 0.1s ease-in all; }*/
/* will-change property hints browser to allocate animation resources */
/*.btn:hover { will-change: transform; transform: scale(0.96);}*/
/*.btn.large { font-size: 1.5rem; }*/
.wrapper {
  width: 100%;
  max-width: 46em;
  margin: auto;
  padding: 0.5em;
  background: #FFF;
  border: 10px #615bb0 solid; }

header[role=banner] {
  diplay: block;
  margin-bottom: 1.75em;
  padding: 1em 1em 0;
  text-align: center; }

header[role=banner] .subheader {
  display: block;
  font-size: 0.85rem;
  font-weight: 700; }

.psychic-block {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  margin: 0 1em; }

.psychic-block .image {
  margin-bottom: 0.25em; }

.psychic-block .image img {
  max-width: 6em; }

.psychic-block h3 {
  margin-bottom: 0.25em;
  font-size: 1.65rem;
  font-weight: 900; }

.psychic-block .review .label {
  display: inline-block;
  margin-bottom: 0.25em;
  padding: 0.15em 0.5em;
  background: #05daff;
  color: #fff;
  font-size: 0.6875rem;
  font-weight: 900;
  text-transform: uppercase; }

.psychic-block .review p {
  font-size: 0.85rem; }

.psychic-block .actions a {
  font-size: 1.25rem;
  font-weight: 900; }

.separator {
  display: block;
  margin: 1em 0;
  text-align: center; }

footer {
  background: #E7E7E7;
  overflow: hidden; }

footer p {
  margin: 0.15em 0;
  font-size: 0.6875rem; }

footer .flex {
  margin-bottom: 0.75em; }

@media (max-width: 330px) {
  html {
    font-size: 90%; } }

@media (min-width: 400px) {
  html {
    font-size: 110%; } }

@media (min-width: 760px) {
  html {
    font-size: 120%; }
  header[role=banner] {
    padding: 0; }
  .psychic-block {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row; }
  .psychic-block .image {
    margin: 0 2.5em 0 0; } }

@media (min-width: 996px) {
  html {
    font-size: 135%; } }