html {
    font: normal 5vw "Open Sans", "Helvetica Neue", Helvetica, sans-serif;
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    overflow-y: hidden;
    color: #000;
}

body {
  margin: 0;

}
.heading {
	position: fixed;
	top:50%;
	width: 100vw;
	text-align: middle;
}
.container {
  min-width: 100vw;
  min-height: 100vh;
	display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: 1fr;
pointer-events: none;
}

.maincont {
pointer-events: none;
  align-self: center;
  justify-self: center;
  padding: 20px;
  border-radius: 10px;
  color: rgba(255, 255, 255, .8);
  background-image:
    repeating-linear-gradient(
      90deg,
      #606dbc,
      #606dbc 10px,
      #465298 10px,
      #465298 20px
    );
    animation: bganimate 5s linear infinite;
    box-shadow: 1px 1px 10px #333 inset;
  }


.content {
pointer-events: none;
  padding:0px 20px 0px 20px;
  background-color: rgba(255, 255, 255, 0.5);
  border-radius: 10px;
  box-shadow: 1px 1px 5px #333;
  background-image:
    repeating-linear-gradient(
      90deg,
      #606dbc,
      #606dbc 10px,
      #465298 10px,
      #465298 20px
    );
    animation: bganimate 10s linear infinite;
    animation-direction: reverse;
    border: 5px solid #606dbc;
}
@keyframes bganimate {
  from {
    background-position: 0px 0px;
  }
  to {
    background-position: 500px 0px;
  }
}