/* =============================================================================
   HTML5 CSS Reset Minified - Eric Meyer
   ========================================================================== */

   @import url(https://fonts.googleapis.com/css?family=Teko:300,400,500,600);

   html,
   body,
   div,
   span,
   object,
   iframe,
   h1,
   h2,
   h3,
   h4,
   h5,
   h6,
   p,
   blockquote,
   pre,
   abbr,
   address,
   cite,
   code,
   del,
   dfn,
   em,
   img,
   ins,
   kbd,
   q,
   samp,
   small,
   strong,
   sub,
   sup,
   var,
   b,
   i,
   dl,
   dt,
   dd,
   ol,
   ul,
   li,
   fieldset,
   form,
   label,
   legend,
   table,
   caption,
   tbody,
   tfoot,
   thead,
   tr,
   th,
   td,
   article,
   aside,
   canvas,
   details,
   figcaption,
   figure,
   footer,
   header,
   hgroup,
   menu,
   nav,
   section,
   summary,
   time,
   mark,
   audio,
   video {
     margin: 0;
     padding: 0;
     border: 0;
     outline: 0;
     font-size: 100%;
     vertical-align: baseline;
     background: transparent;
   }
   body {
     line-height: 1;
   }
   article,
   aside,
   details,
   figcaption,
   figure,
   footer,
   header,
   hgroup,
   menu,
   nav,
   section {
     display: block;
   }
   nav ul {
     list-style: none;
   }
   blockquote,
   q {
     quotes: none;
   }
   blockquote:before,
   blockquote:after,
   q:before,
   q:after {
     content: none;
   }
   a {
     margin: 0;
     padding: 0;
     font-size: 100%;
     vertical-align: baseline;
     background: transparent;
     text-decoration: none;
   }
   mark {
     background-color: #ff9;
     color: #000;
     font-style: italic;
     font-weight: bold;
   }
   del {
     text-decoration: line-through;
   }
   abbr[title],
   dfn[title] {
     border-bottom: 1px dotted;
     cursor: help;
   }
   table {
     border-collapse: collapse;
     border-spacing: 0;
   }
   hr {
     display: block;
     height: 1px;
     border: 0;
     border-top: 1px solid #ccc;
     margin: 1em 0;
     padding: 0;
   }
   input,
   select {
     vertical-align: middle;
   }
   li {
     list-style: none;
   }
   
   /* =============================================================================
      My CSS
      ========================================================================== */
   
   html,
   body {
     width: 100%;
     height: 100%;
     background: white;
   }
   
   body {
     background-image: linear-gradient(to bottom, #014653 0%, #0db1b1 100%);
     /* background: linear-gradient(to left, rgb(219, 181, 241) , rgb(147, 187, 248)); */
   }
   
   /* remove canvas default margin */
   canvas {
     display: block;

   }
   
  #particles-js {
     width: 100%;
     height: 100%;
   }
   
  #particles-js h1 {
     font-size: calc(12px + 4vw);
     position: absolute;
     top: 37%;
     left: 36%;
     color: #fff;
     font-family: teko;
     font-weight: 400;
     text-shadow: 5px 5px #5f6d72;
     text-transform: uppercase;
   }

  #particles-js h2 {
    /* font-size: 3.3vw; */
    font-size:  calc(12px + 3vw);
    position: absolute;
    top: 29%;
    left: 28%;
    color: #fff;
    font-family: teko;
    font-weight: 400;
    text-shadow: 5px 5px #5f6d72;
    text-transform: uppercase;
  }

  #particles-js h3 {
    font-size: calc(12px + 3vw) ;
    position: absolute;
    top: 49%;
    left: 45%;
    color: #fff;
    font-family: teko;
    font-weight: 400;
    text-shadow: 5px 5px #5f6d72;
    text-transform: uppercase;
  }



  /* .particle-js h1 {
    font-size: 7rem;
    position: absolute;
    top: 35%;
    left: 40%;
    color: #fff;
    font-family: teko;
    font-weight: 400;
    text-shadow: 5px 5px #5f6d72;
    text-transform: uppercase;
  }
    */