@import url('https://fonts.googleapis.com/css?family=Merienda');

#section_animation{
    height: 500px;
    position: relative;
    font-family: 'Merienda', cursive;
    background: #FFF;
  
}
.background {
  position: absolute;
  display: block;
  top: 0;
  left: 0;
  z-index: 0;
}

/* Default Styling */
.container {
  display: flex;
  justify-content: center;
  align-items: center;
  /* height: 100vh; */
  height: 500px;
}
.box {
  /* background: #fff; */
  border-radius: 5px;
  padding: 20px;
  text-align: center;
  /* position: absolute; */
  position: relative;
  z-index: 1;
  box-sizing: border-box;
}
a {
  color: #0bd;
}

/***/

figure {
  display: flex;
  align-items: center;
  justify-content: center;
  /* height: 150px; */
  /* width: 191px; */
  max-width: 800px;
  width: 70%;
  margin: auto;
}

svg {
  padding: 5vw 0;
  width: 90vw;
}

svg > * {
  fill: #1C1C1C;
  stroke: #1C1C1C;
  stroke-width: 0.85px;
}

/* hover tip */
/* body:hover:after {
  content: "Hover to Slow Motion";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 1vh;
  color: #1C1C1C;
  text-align: center;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  font: 700 9px/14px Tahoma, sans-serif;
  -moz-animation: tip 2.5s forwards;
  -webkit-animation: tip 2.5s forwards;
  animation: tip 2.5s forwards;
} */

@-moz-keyframes tip {
  0%, 100% {
    opacity: 0;
  }
  10%, 80% {
    opacity: 1;
  }
}
@-webkit-keyframes tip {
  0%, 100% {
    opacity: 0;
  }
  10%, 80% {
    opacity: 1;
  }
}
@keyframes tip {
  0%, 100% {
    opacity: 0;
  }
  10%, 80% {
    opacity: 1;
  }
}

@media(max-width:768px){

  #section_animation{
      height: 400px;
  }
  .background {
      height: 400px;
  }
  .container {
        height: 400px;
  }  

  /* Default Styling */
  .container {
    /* height: 100vh; */
  }
  .box {
      /* top: -11%; */
      padding: 0;
  }
  

  
}

@media(max-width:480px){

  #section_animation{
      height: 300px;
  }
  .container {
        height: 300px;
  }  
  .background {
      height: 300px;
  }
  .box {
      top: 0;
  }


}