body{
    background: linear-gradient(rgb(0, 0, 51),black);
    color: white;
    background-repeat: repeat;
    background-size: 100vw 100vh;
    font-family: "Noto Sans", sans-serif;
}

img{
    width: 0vw;
}

 .backButton,.backButton1{
        color:transparent;
        background-color:transparent ;
        border-width:0;
         padding-right:0vw
    }
    
    .backButton1{
        padding-left:0vw
    }
    

.whiteLogo{
    width:3.6vw;
    margin-left: 82vw; 
    margin-top: 0.6vw;
}

.bted{
    margin-left: 0.1vw;
    font-size: 1.6vw;
    margin-top: 2.6vw;
    color: #ED007F;
    font-weight: 700;
}

.whiteR{
    width:0.8vw;
    padding-top: 1.4vw;
    margin-left: 0.1vw; 
}
.topBar{
    width: 96vw;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-content: flex-start;
    justify-content: flex-start;
    align-items: center;
    padding-left: 1vw; 
}

.backArrow{
    width: 2.2vw;
}

.back{
    margin-top: 1vw;
    font-style: normal;
    text-decoration: none;
    color: white;
    font-size: 1vw;
}

.stripeBox{
    position: absolute;
    bottom: 0;
    left: 0;
    width: 45vw;
    height:43vw;
    overflow: hidden;

}
.stripe{
    position: absolute;
    top: 0vw;
    width: 46vw;
    /* height: 75vh; */
}

.getReady,.toLeaveEm1,.toLeaveEm2,.speechless{
    font-size: 7vw; 
    left: 4vw;   
    font-family: "Noto Sans", sans-serif;
    position: absolute;
    font-weight: 700;
}

.getReady{
    text-shadow: -0.3vw 0.3vw 0.4vw rgb(0 0 0);
    margin-top: 4vw;
    font-weight: 700;
}

.toLeaveEm1,.toLeaveEm2{
     margin-top: 13vw;
    margin-bottom: 0.5vw;
    font-weight: 900;
    height: 7vw;
    font-size: 5.6vw;
    /* font-family: sans-serif; */
    border-width: 4vw;
    -webkit-text-fill-color: transparent;
    -webkit-text-stroke-color: #ffffff;
    -webkit-text-stroke-width: 0.2vw;
}

.toLeaveEm2{
    /* display: none; */
}

.toLeaveEm1{
   margin-top: 13.2vw;
   margin-bottom: 0.5vw;
   font-weight: 900;
   height: 7vw;
   font-size: 5.6vw;
   left: 3.7vw;
   opacity: 100%;
   /*font-family: sans-serif;*/
   border-width: 4vw;
   filter: blur(0.12vw); 
   -webkit-text-fill-color: transparent;
   -webkit-text-stroke: 0.3vw rgb(0, 0, 0);
}


.speechless{
    text-shadow: -0.3vw 0.3vw 0.4vw rgb(0 0 0);
    margin-top: 20.5vw;
    font-size: 5.85vw;
}

.rightForm{
    position: absolute;
    width: 25vw;
    margin-top: 6vw;
    right: 19vw;
}

.nameBar,.emailBar,.messageBar{
width: 35vw;
height: 2vw;
margin-bottom: 5vw;
background-color: transparent;
border-bottom: 1vw  solid #000;
color: white;
  border: none;
  border-bottom: 1px solid #ffffff;
  outline: none;
  padding: 5px;
  padding-bottom: 0;
}



::placeholder {
    color: white; 
    font-weight: 600;
    font-size: 0.8vw;
    opacity: 1; 
    font-family: "Noto Sans", sans-serif;

  }
  
  :-ms-input-placeholder {
    color: white; 
    font-weight: 600;
    font-size: 0.8vw;
    opacity: 1; 
    font-family: "Noto Sans", sans-serif;
  }
  
  ::-moz-placeholder {
    color: white; 
    font-weight: 600;
    font-size: 0.8vw;
    opacity: 1; 
    font-family: "Noto Sans", sans-serif;
  }
  
  ::-webkit-input-placeholder {
    color: white; 
    font-weight: 600;
    font-size: 0.8vw;
    opacity: 1; 
    font-family: "Noto Sans", sans-serif;
  }
  
.button{
    background-color:#ED007F;
        color: white;
        margin: 0px;
        padding-left: 2vw;
        padding-top: 0.6vw;
        padding-bottom: 0.6vw;
        padding-right: 2vw;
        text-align: center;
        border-width: 0.2vw;
        font-size: 0.9vw;
        border-radius: 1000px 0px;
        border-color: #ED007F;
        border-style:solid;
        font-weight: 700;
        cursor: pointer;
        overflow: hidden;
        z-index: 1;
        transition: transform 0.3s ease-in-out;
    }
    
    
.button:hover{
        background-color:transparent;
        color: #ffffff;
        border-color: #ED007F;
        border-style:solid;
        transition: 600ms;
        transform: scale(1.1);
    }

footer{
    position: absolute;
    bottom: 0;
    font-family: "Noto Sans", sans-serif;
    font-weight: 500;
    right: 20vw;
    /* font-family: "Noto Sans Miao", sans-serif; */
    font-size: 0.7vw;
    letter-spacing: 90%;
}

.circ {
    opacity: 0;
    stroke-dasharray: 130;
    stroke-dashoffset: 130;
    transition: all 1s;
}

.tick {
    stroke-dasharray: 50;
    stroke-dashoffset: 50;
    transition: stroke-dashoffset 1s 0.5s ease-out;
}

.drawn + svg .path {
    opacity: 1;
    stroke-dashoffset: 0;
}

.doneTick{
    width: 25vw;
    /* left:0vw ; */ 
    position: absolute;
}
@media screen and (max-width: 450px) {

    body{
        background: linear-gradient(rgb(0, 0, 51),black);
        color: white;
        background-repeat: repeat;
        background-size: 100vw 137vh;
        font-family: "Noto Sans", sans-serif;
    }
    
    img{
        width: 0vw;
    }
    
    .whiteLogo{
        width:9vw;
        margin-left: 55vw; 
        margin-top: 0vw;
    }
    
    .bted{
        margin-left: 0.1vw;
        font-size: 4vw;
        margin-top: 5vw;
        color: #ED007F;
        font-weight: 700;
    }
    
    .whiteR{
        width:2vw;
        height: 2vw;
        padding-top: 1.4vw;
        margin-left: 0.1vw; 
    }
    .topBar{
        width: 94vw;
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        align-content: flex-start;
        justify-content: flex-start;
        align-items: center;
        padding-left: 0vw; 
    }
    
    .backArrow{
        width: 7vw;
    }
    
    .back{

        margin-top: 2vw;
        font-style: normal;
        text-decoration: none;
        color: white;
        font-size: 2.8vw;
    }
    
    .stripeBox{
        overflow: visible;
        top:10vw;
        width: 100%;
        height: 100%;
        position: absolute;
    }
    .stripe{
        position: absolute;
        top: 0vw;
        left: 0;
        height: 55%;
        width: 100%;
        /* height: 75vh; */
    }
    
    .getReady,.toLeaveEm1,.toLeaveEm2,.speechless{
        font-size: 15.8vw; 
        left: 7vw;   
        font-family: "Noto Sans", sans-serif;
        position: absolute;
        font-weight: 700;
    }
    
    .getReady{
        text-shadow: -0.3vw 0.3vw 0.4vw rgb(0 0 0);
        margin-top: 10vw;
        font-weight: 700;
    }
    
    .toLeaveEm1,.toLeaveEm2{
         margin-top: 30vw;
        margin-bottom: 0.5vw;
        font-weight: 900;
        height: 7vw;
        left: 19.7vw;
        font-size:9vw;
        /* font-family: sans-serif; */
        border-width: 4vw;
        -webkit-text-fill-color: transparent;
        -webkit-text-stroke-color: #ffffff;
        -webkit-text-stroke-width: 0.2vw;
    }
    
    
    .toLeaveEm1{
       margin-top: 30.2vw;
       margin-bottom: 0.5vw;
       font-weight: 900;
       height: 7vw;
       left: 19.7vw;
       opacity: 100%;
       /*font-family: sans-serif;*/
       border-width: 4vw;
       filter: blur(0.12vw); 
       -webkit-text-fill-color: transparent;
       -webkit-text-stroke: 0.3vw rgb(0, 0, 0);
    }
    
    
    .speechless{
        text-shadow: -0.3vw 0.3vw 0.4vw rgb(0 0 0);
        margin-top: 42.5vw;
        font-size: 13.2vw;
    }
    
    .rightForm{
        position: absolute;
        width: 25vw;
        margin-top: 100vw;
        right: 58vw;
    }
    
    .nameBar,.emailBar,.messageBar{
    width: 66vw;
    height: 10vw;
    margin-bottom: 5vw;
    background-color: transparent;
    border-bottom: 1vw  solid #000;
    color: white;
      border: none;
      border-bottom: 1px solid #ffffff;
      outline: none;
      padding: 5px;
      padding-bottom: 0;
    }
    
    
    
    ::placeholder {
        color: white; 
        font-weight: 600;
        font-size: 12vw;
        opacity: 1; 
        font-family: "Noto Sans", sans-serif;
    
      }
      
      :-ms-input-placeholder {
        color: white; 
        font-weight: 600;
        font-size: 0.8vw;
        opacity: 1; 
        font-family: "Noto Sans", sans-serif;
      }
      
      ::-moz-placeholder {
        color: white; 
        font-weight: 600;
        font-size: 0.8vw;
        opacity: 1; 
        font-family: "Noto Sans", sans-serif;
      }
      
      ::-webkit-input-placeholder {
        color: white; 
        font-weight: 600;
        font-size: 2.2vw;
        opacity: 1; 
        font-family: "Noto Sans", sans-serif;
      }
      
    .button {
  background-color: #ED007F;
  color: white;
  margin: 0;
  padding-left: 3.5vw;
  padding-top: 1vw;
  padding-bottom: 1vw;
  padding-right: 3.5vw;
  text-align: center;
  border-width: 0.2vw;
  font-size: 2.8vw;
  -webkit-border-radius: 1000px 0;
  border-radius: 1000px 0;
  border-color: #ED007F;
  border-style: solid;
  font-weight: 700;
  cursor: pointer;
  overflow: hidden;
  z-index: 1;
  margin-left: 26vw;
  margin-top: 4vw;
  -webkit-transition: -webkit-transform 0.3s ease-in-out;
  transition: transform 0.3s ease-in-out;
}

        
        
    .button:hover{
            background-color:transparent;
            color: #ffffff;
            border-color: #ED007F;
            border-style:solid;
            transition: 600ms;
            font-weight: 600;
            transform: scale(1.1);
        }
    
    footer{
        position: absolute;
        top: 200vw;
        margin-bottom: 5vw;
        font-family: "Noto Sans", sans-serif;
        font-weight: 500;
        right: 30vw;
        /* font-family: "Noto Sans Miao", sans-serif; */
        font-size: 1.7vw;
        letter-spacing: 90%;
        margin-bottom: 4vw;
    }
    
    
    .circ {
        opacity: 0;
        stroke-dasharray: 130;
        stroke-dashoffset: 130;
        transition: all 1s;
    }
    
    .tick {
        stroke-dasharray: 50;
        stroke-dashoffset: 50;
        transition: stroke-dashoffset 1s 0.5s ease-out;
    }
    
    .drawn + svg .path {
        opacity: 1;
        stroke-dashoffset: 0;
    }
    
    .doneTick{
        top: 100vw;
        width: 25vw;
        /* left:0vw ; */
        position: absolute;
    }
    
   
    
    

}
footer, .rights6 {
    text-align: center !important;
    width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    left: 0 !important;
}