@charset "UTF-8";

             @font-face {
                font-family: "Avestrava-Regular";
                src: url("../src/Avestrava-Regular.woff") format("woff");
            }
            
            @font-face {
              font-family: "Px Grotesk";
              src: url("../src/PxGrotesk-Light.woff") format("woff");
              src: url("../src/PxGrotesk-Bold.woff") format("woff");
              src: url("../src/PxGrotesk-BoldIta.woff") format("woff");
              src: url("../src/PxGrotesk-LightIta.woff") format("woff");
              src: url("../src/PxGrotesk-Regular.woff") format("woff");
              src: url("../src/PxGrotesk-RegularIta.woff") format("woff");
            }

    /* -------FLASH------- */
      body{
          margin: 0;
          padding: 0;
          animation: bgcolor infinite 1s;
          }

          @keyframes bgcolor {
            0%{
            background: black;
            }
            15%{
            background: red;
            }
            20%{
            background: black;
            }
            25%{
            background: red;
            }
            30%{
            background: black;
            }
            35%{
            background: red;
            }
            40%{
            background: black;
            }
            100%{
            background: black;
            }
         }


    /* -------TEXT------- */
      h1{
        font-size: 100px;
        font-family: 'PxGrotesk-Bold';  
        color: #fff; 
        position: absolute;
        text-align: center;
        display: block;
        margin: 0 auto;
        padding: 20% 25% 0;
        }

        @media only screen and (max-width: 768px){
          h1{
            font-size: 50px;
            font-family: 'PxGrotesk-Bold';  
            padding: 0px;
            color: #fff; 
            position: absolute;
            text-align: center;
            display: block;
            margin: 0 auto;
            padding: 20% 25% 0;
            }
        }