.btn04 {
            margin: 300 10;   
            color: #fff;
            text-decoration: none;
            text-shadow: 1px 3px 1px #000;
            text-align: center;
            display: block;
            line-height: 30px; 
            width: 100px;
            height: 30px;
            font-size: min(1.1vw, 12px);

        }

        .btn04::before {
         content: '';
         background-color: #0080FF;  
         display: block;
         position: fixed; 
            width: 100px;
            height: 30px;  
         z-index: -1;
         border-radius: 5%;
         box-shadow:
                0 0 0 0 #000,   
                0 0 0 0 #0080FF;   
          transition: all .2s ease;
            -webkit-transition: all .3s ease;
        }

        .btn04:hover::before {
            transform: scale(0.3);
            -webkit-transform: scale(0.7);
            box-shadow:
                0 0 0 15px #000,  
                0 0 0 20px #0080FF;
 
        }
        
         .btn05 {
            margin: -300 10;
            color: #fff;
            text-decoration: none;
            text-shadow: 1px 3px 1px #000;
            text-align: center;
            display: block;
            line-height: 30px;
           font-size: min(1.1vw, 12px);
        }

        .btn05::before {
            content: '';
            background-color: #33e333;
            display: block;
            position: fixed;
            width: 100px;
            height: 30px;
            z-index: -1;
            border-radius: 5%;
            box-shadow:
                0 0 0 0 #000,
                0 0 0 0 #dda284;
            transition: all .2s ease;
            -webkit-transition: all .3s ease;
        }
        .btn05:hover::before {
            transform: scale(0.3);
            -webkit-transform: scale(0.7);
            box-shadow:
                0 0 0 15px #000,
                0 0 0 20px #33e333;
        }
          .btn06 {
            margin: 300 10;
            color: #fff;
            text-decoration: none;
            text-shadow: 1px 3px 1px #000;
            text-align: center;
            display: block;
            line-height: 30px;
            font-size: min(1.1vw, 12px);
        }

        .btn06::before {
            content: '';
            background-color: #ff3333;
            display: block;
            position: fixed;
            width: 100px;
            height: 30px;
            z-index: -1;
            border-radius: 5%;
            box-shadow:
                0 0 0 0 #000,
                0 0 0 0 #dda284;
            transition: all .2s ease;
            -webkit-transition: all .3s ease;
        }
        .btn06:hover::before {
            transform: scale(0.3);
            -webkit-transform: scale(0.7);
            box-shadow:
                0 0 0 15px #000,
                0 0 0 20px #ff3333;
        }
          
           .btn07 {
            margin: -300 10;
            color: #fff;
            text-decoration: none;
            text-shadow: 1px 3px 1px #000;
            text-align: center;
            display: block;
            line-height: 30px;
            font-size: min(1.1vw, 12px);
        }

        .btn07::before {
            content: '';
            background-color: #ff33ff;
            display: block;
            position: fixed;
            width: 100px;
            height: 30px;
            z-index: -1;
            border-radius: 5%;
            box-shadow:
                0 0 0 0 #000,
                0 0 0 0 #ff33ff;   /*#dda284*/
            transition: all .2s ease;
            -webkit-transition: all .3s ease;
        }
        .btn07:hover::before {
            transform: scale(0.3);
            -webkit-transform: scale(0.7);
            box-shadow:
                0 0 0 15px #000,
                0 0 0 20px #ff33ff;
        }

           .btn08 {
            margin: 300 10;
            color: #fff;
            text-decoration: none;
            text-shadow: 1px 3px 1px #000;
            text-align: center;

             display: block;
            line-height: 30px;
            font-size: min(1.1vw, 12px);
        }

        .btn08::before {
            content: '';
            background-color: #FFFF00;
            display: block;
            position: fixed;
            width: 100px;
            height: 30px;
            z-index: -1;
            border-radius: 5%;
            box-shadow:
                0 0 0 0 #000,
                0 0 0 0 #FFFF00;   /*#dda284*/
            transition: all .2s ease;
            -webkit-transition: all .3s ease;
        }
        .btn08:hover::before {
            transform: scale(0.3);
            -webkit-transform: scale(0.7);
            box-shadow:
                0 0 0 15px #000,
                0 0 0 20px #FFFF00;
        }