*{
    margin: 0;
    padding: 0;
}
body {
    font-size: 15pt;
    font-size: clamp(1.1rem, 3.4vw, 3.4rem);
    background: #FFFFFF;
  font-family: 'Inter', 'Helvetica Neue', Helvetica, Arial, sans-serif;
 line-height: 1.5;
}
.nav-btn:hover{
    color: #6AF200;
    border: 0.2vh solid #6AF200;
}
.logo{
    color: white;
    font-size: clamp(1.5rem, 4vw, 4rem);
    font-weight: bold;
    font-weight: bold;
    font-family: 'Itin', cursive;
    margin-top: 1%;
    margin-left: 4%;
    text-decoration: none;
    cursor: none;
}
.heading{  
    font-size: clamp(1.5rem, 4.5vw, 4.5rem);
    text-align: center;
    margin-top: 6%;
    margin-bottom: 5%;
    text-align: center;
}
.heading3{
    box-shadow: 20px 20px 20px rgba(0.1, 0.1, 0.1, 0.1);
    font-size: clamp(1.6rem, 5vw, 5rem);
    color: red;
    text-align: center;
    margin-top: 6%;
    margin-bottom: 5%;
    border-radius: 1vh;
    margin-left: 7%;
    margin-right: 7%;
    text-align: center;
    padding: 2%;
    
}
.heading4{
    font-size: clamp(1.5rem, 5vw, 5rem);
    text-align: center;
    margin-top: 6%;
    margin-bottom: 5%;
    text-align: center;
    color: red;
} 
.heading2{
    font-size: clamp(1.5rem, 5vw, 5rem);
    text-align: center;
    margin-left: 5%;
    margin-right: 5%;
    margin-top: 6%;
    margin-bottom: 5%;
    text-align: center;
    
}
.form-div{
    margin-top: 5%;
    margin-bottom: 5%; 
}
.contact-info{
    display: flex;
    margin: auto;
    width: 60%;
    text-decoration: none;
    padding: 5%;
    margin-top: 3%;
    margin-bottom: 3%;
    border-radius: 1vh;
    border: 0.2vh solid #D8D8D8;
    font-size: clamp(1rem, 4vw, 4rem);
    outline: none;
    
}
.contact-info:hover{ 
    border: 0.2vh solid #00FF2E;  
}
.textarea{
    display: flex;
    margin: auto;
    width: 60%;
    height: 12vh;
    text-decoration: none;
    padding: 8%;
    margin-top: 2%;
    margin-bottom: 2%;
    border-radius: 2vh;
    outline: none;
    border: 0.2vh solid #D8D8D8;
    font-size: clamp(1rem, 4vw, 4rem);
}
.textarea:hover{
    border: 0.2vh solid #00FF2E;
}
.submit:hover{
    color: #074609;
    background: linear-gradient(10deg, #34FF00, #0FFF16, #5AC90B);
}
.submit{
   text-decoration: none;
    margin-top: 3%;
    margin-bottom: 6%;
    margin-left: 2%;
    font-size: clamp(1rem, 3vw, 3rem);
    background: linear-gradient(10deg, #34FF00, #0D9F11, #5AC90B);
    padding: 4%;
    border-radius: 1vh;
    display: flex;
    margin: auto;
    width: 60%;
    border: none;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-weight: bold;
}
.ok-btn{
    text-decoration: none;
    margin-top: 2%;
    margin-bottom: 6%;
    margin-left: 2%;
    font-size: clamp(1rem, 3vw, 3rem);
    background: #02EC59;
    padding: 4%;
    border-radius: 1vh;
    display: flex;
    margin: auto;
    width: 40%;
    border: none;
    justify-content: center;
    cursor: pointer;
    color: #000;
    font-weight: bold;
}
.link{
    text-decoration: none;
    color: #142BBF;
    border-bottom: 0.1vh solid #142BBF;
}
.link:hover{
    color: #1C0D6A;
}
.alert-paragraph{
    font-size: clamp(1rem, 3vw, 3rem);
    font-family: none;
    margin-left: 9%;
    margin-right: 9%; 
}
.alert-paragraph2{
    font-size: clamp(0.5rem, 3vw, 3rem);
    margin-top: 4%;
    font-family: none;
    margin-left: 9%;
    margin-right: 9%;
    color: #47474D; 
}
.background-alert{ 
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    background: rgba(0.6, 0.6, 0.6, 0.6);
    display: none;
}
.alert-box{
    box-shadow: 4px 4px 8px rgba(0, 1, 1, 1);
    background: #FFFFFF;
    position: absolute;
    top: 25%;
    left: 10%;
    right: 10%;
    padding: 3%;
    justify-content: center;
    align-items: center;
    text-align: center;
    border-radius: 1.5vh;
}
.logodiv{
    position: sticky; top: 0;
    background: #120179;
    padding: 2%;
    box-shadow: 5px 5px 5px rgba(0.2, 0.2, 0.2, 0.2);
    top: 0%;
}
.flex-logodiv{
    display: flex;
    justify-content: space-between;
}
.logo2{
    font-weight: bold;
    color: white;
    font-size: clamp(0.6rem, 3vw, 3rem);
    font-family: 'Itin', cursive;
}
.nav-btn{
    text-decoration: none;
    margin-left: 6%;
    border: 0.2vh solid #00ECFF;
    color: #00F7FF;
    padding: 2.5%;
    background: none;
    font-weight: bold;
    margin-right: 5%;
    border-radius: 1.2vh;
    width: 24%;
    cursor: pointer;
    font-size: clamp(1.2rem, 3vw, 3rem);
    box-shadow: 7px 7px 7px rgba(0.3, 0.3, 0.3, 0.3);
}
.li{
    list-style-type: none;
    padding: 0;
    margin: 0;
}
.content-btn{
    font-size: clamp(1rem, 3vw, 3rem);
    font-family: none;
  text-decoration: none;
  color: white;
  font-weight: bold;
  padding: 8%;
  width: 80%;
  display: flex;
  border-top: 1.2px solid #C7C7C7;
  border-bottom: 1.2px solid #C7C7C7;  
}
.content-btn2{   
    font-size: clamp(1rem, 3vw, 3rem);
    font-family: none;
  text-decoration: none;
  color: white;
  font-weight: bold;
  padding: 8%;
  width: 80%;
  display: flex;
  border-top: 2.2px solid #C7C7C7;
  border-bottom: 1.2px solid #C7C7C7;   
}
.content-btn3:hover{ 
    background: #0F09B1;
}
.content-btn:hover{
   background: #0F09B1; 
}
.content-btn2:hover{ 
  background: #0F09B1;  
}
.content-btn3{  
    font-size: clamp(1rem, 3vw, 3rem);
    font-family: none;
  text-decoration: none;
  color: white;
  font-weight: bold;
  padding: 8%;
  width: 80%;
  display: flex;
  border-top: 1.2px solid #C7C7C7;
  border-bottom: 2.2px solid #C7C7C7; 
}
.download-image{
    width: 35%;
    margin-top: 4%;
    padding: 5%;
    margin-bottom: 4%;
    background: #FF0000;
    border-radius: 1vh;
    box-shadow: 5px 5px 5px rgba(0.3, 0.3, 0.3, 0.3);   
}
.download-image2{ 
    width: 9%;
    padding: 2%;
    margin-top: 4%;
    margin-bottom: 4%;   
}
.li3{
    margin-left: 12%;
    margin-right: 9%;
    font-family: none;
    margin-top: 5%;
    margin-bottom: 3%;
}
.div{
   display: none;
   position: fixed;
   width: 50%;
   left: 0;
   height: 100%;
   overflow-y: auto;
   background: #120179;
   padding: 2%;
    box-shadow: 10px 10px 10px rgba(0.3, 0.3, 0.3, 0.3);   
}
.hide-nav{
    text-decoration: none;
    margin-top: 3%;
    margin-bottom: 4%;
    padding: 3%;
    left: 0;
    font-size: clamp(1rem, 3vw, 3rem);
    border: none;
    border-radius: 1.2vh;
    background: none;
    width: 40%;
    cursor: pointer;
    color: white;
    font-weight: bold;
}
.next-page{
    text-align: center;
    font-size: clamp(1rem, 3vw, 3rem);
    display: flex;
    justify-content: center;
    font-weight: bold;
    margin-top: 10%;
    margin-bottom: 5%;
    color: #FF0000;
}
.get-btn{
    display: flex;
    margin: auto;
    justify-content: center;
    margin-top: 5%;
    margin-bottom: 5%;
    text-decoration: none;
    font-size: clamp(1.1rem, 4vw, 4rem);
    background: #0D1891;
    width: 55%;
    border-radius: 1vh;
    padding: 3%;
    color: white;
    font-weight: bold;
    font-family: none;
    box-shadow: 10px 10px 10px rgba(0.3, 0.3, 0.3, 0.3);
    
    
}
.get-btn:hover{
    color: #0023FF;
    background: #070D50;
}
.next-page-btn{
    
    margin-left: 2%;
    margin-top: 4%;
    text-decoration: none;
    border: 0.1rem solid #000DFF;
    font-size: clamp(1rem, 4vw, 4rem);
    font-family: none;
    color: #000;
    font-weight: bold;
    text-align: center;
    padding: 3%;
    border-radius: 1.5vh;
    width: 35%;
    box-shadow: 10px 10px 10px rgba(0.2, 0.2, 0.2, 0.2);
    
}

.next-page-btn:hover{
   
    border: 0.1rem solid #091057;
    color: #2900FF;
    
}

.next-page-btn2:hover{
      
    border: 0.1rem solid #710606;
    color: #FF0000;
}

.next-page-btn3:hover{
   
    border: 0.1rem solid #091057;
    color: #2900FF;
    
}

.next-page-btn4:hover{
      
    border: 0.1rem solid #710606;
    color: #FF0000;
}



.next-page-btn3{
    
    margin-top: 4%;
    text-decoration: none;
    border: 0.1rem solid #000DFF;
    font-size: clamp(1rem, 3vw, 3rem);
    font-family: none;
    color: #000;
    font-weight: bold;
    text-align: center;
    padding: 3%;
    border-radius: 1.5vh;
    width: 35%;
    box-shadow: 10px 10px 10px rgba(0.2, 0.2, 0.2, 0.2);
    
}



.next-page-btn4{
    
    margin-top: 4%;
    text-decoration: none;
    border: 0.1rem solid #FF0000;
    font-size: clamp(1rem, 3vw, 3rem);
    font-family: none;
    color: #000;
    font-weight: bold;
    text-align: center;
    padding: 3%;
    border-radius: 1.5vh;
    width: 35%;
    box-shadow: 10px 10px 10px rgba(0.2, 0.2, 0.2, 0.2);
    
}

.next-page-btn2{
    margin-right: 2%;
    margin-top: 4%;
    text-decoration: none;
    border: 0.1rem solid #FF0000;
    font-size: clamp(1rem, 3vw, 3rem);
    font-family: none;
    color: #000;
    font-weight: bold;
    text-align: center;
    padding: 3%;
    border-radius: 1.5vh;
    width: 35%;
    box-shadow: 10px 10px 10px rgba(0.2, 0.2, 0.2, 0.2);
    
}

.next-page-div{
    display: flex;
    margin: auto;
    justify-content: center;
}

.about-paragraph{
    font-size: clamp(1rem, 3vw, 3rem);
    margin-top: 2%;
    margin-bottom: 2%;
    color: #3E3E3E;
    margin-left: 3.5%;
    font-family: none;
}

.about-paragraph2{
    font-size: clamp(1rem, 3vw, 3rem);
    margin-top: 6%;
    margin-bottom: 2%;
    color: #09F9EC;
    margin-left: 3.5%;
    font-family: none;
}


.download-btn{
    
    font-size: clamp(1rem, 3vw, 3rem);
    display: flex;
    box-shadow: 10px 10px 10px rgba(0.2, 0.2, 0.2, 0.2);
    width: 70%;
    margin: auto;
    font-weight: bold;
    color: white;
    margin-top: 3%;
    border-radius: 0.8vh;
    margin-bottom: 2%;
    text-align: center;
    justify-content: center;
    text-decoration: none;
    font-family: none;
    background: #062DC4;
    padding: 5%;

    
    
}

.download-btn:hover{
    background: #08195C;
    
}

.download-btn2{
    
    font-size: clamp(1rem, 3vw, 3rem);
    display: flex;
    box-shadow: 10px 10px 10px rgba(0.2, 0.2, 0.2, 0.2);
    width: 70%;
    margin: auto;
    font-weight: bold;
    color: white;
    margin-top: 3%;
    border-radius: 0.8vh;
    margin-bottom: 2%;
    text-align: center;
    justify-content: center;
    text-decoration: none;
    font-family: none;
    background: linear-gradient(10deg, #34FF00, #27AE04, #5AC90B);
    padding: 5%;

    
    
}


.download-btn2:hover{
    
    background: linear-gradient(10deg, #4BAE04, #337206, #1F4007);
    color: #70FF0A;
    
}

.image{
    
    width: 60%;
    height: 30%;
    border-radius: 1vh;
    display: flex;
    margin: auto;
    
}

.footer-div{
    
    background: #0E0430;
    padding: 10%;
    
}


.image-icon{
    display: flex;
    align-items: center;
    justify-content: center;
}


.image-1{
    display: flex;
    width: 40%;
    height: 40%;
    margin-left: 30%;

}

.image-2{
    width: 50%;
    height: 53%;
    margin-left: 40%;
}



.button2{
   box-shadow: 10px 10px 10px rgba(0.2, 0.2, 0.2, 0.2);
    text-decoration: none;
    display: flex;
    margin: auto;
    padding: 4%;
    width: 75%;
    justify-content: center;
    background: linear-gradient(10deg, #34FF00, #27AE04, #5AC90B);
    font-size: clamp(1.1rem, 3.4vw, 3.4rem);
    font-weight: bold;
    font-family: none;
    color: white;
    border-radius: 1vh;
}


.button:hover{
    
    color: #55FF00;
    
}

.button{
   box-shadow: 10px 10px 10px rgba(0.2, 0.2, 0.2, 0.2);
    text-decoration: none;
    display: flex;
    margin-left: 8%;
    margin-top: 6%;
    margin-bottom: 6%;
    padding: 4%;
    width: 40%;
    justify-content: center;
    background: linear-gradient(10deg, #34FF00, #27AE04, #5AC90B);
    font-size: clamp(1.1rem, 3.4vw, 3.4rem);
    font-weight: bold;
    font-family: none;
    color: white;
    border-radius: 1vh;
}


.footer-btn{
    justify-content: center;
    text-decoration: none;
    color: #02FF65;
    font-family: none;
    display: flex;
    margin: auto;
    font-size: clamp(1.1rem, 3.3vw, 3.3rem); 
    padding: 3%;
    margin-top: 10%;
    margin-bottom: 10%;
    font-weight: bold;
}


.footer-paragraph{
    margin-top: 9%;
    color: white;
    text-align: center;
    font-family: none;
    font-size: clamp(1.2rem, 3vw, 3rem); 
}


.flex-footer-btn{
    
    justify-content: center;
    text-decoration: none;
    color: #02FF65;
    font-family: none;
    display: flex;
    margin: auto;
    font-size: clamp(1.1rem, 3.3vw, 3.3rem); 
    padding: 3%;
    margin-top: 10%;
    margin-bottom: 10%;
    font-weight: bold;

}



.paragraph{
    
    font-size: clamp(1.3rem, 3.3vw, 3.3rem); 
    margin-left: 7%;
    margin-right: 7%;
    
}

.titleparagraph{
    font-size: clamp(1.5rem, 3.5vw, 3.5rem);
    text-align: center;
    margin-top: 3%;
    color: #0D014D;
    margin-bottom: 3%;
    margin-left: 5%;
    margin-right: 5%;
    font-weight: bold;
}

.titleparagraph2{
    font-size: clamp(1.5rem, 3.5vw, 3.5rem);
    text-align: center;
    margin-top: 3%;
    color: #0F0E9E;
    margin-bottom: 3%;
    border-radius: 1.5vh;
    padding: 1%;
    margin-left: 5%;
    margin-right: 5%;
}

.content-div{
    text-align: center;
    margin-left: 6%;
    margin-right: 6%;
    margin-top: 3%;
    margin-bottom: 3%;
    padding: 4%;
    border-radius: 1.5vh;
    border: 0.1vh solid #CECECE;
    box-shadow: 10px 10px 10px rgba(0.2, 0.2, 0.2, 0.2);
    
}

.blog-div{
    
    box-shadow: 10px 10px 10px rgba(0.4, 0.4, 0.4, 0.4);
    background: #070D4E;
    color: white;
    margin-left: 5%;
    padding: 8%;
    height: 70%;
    border-radius: 1vh;
    margin-right: 5%;
    margin-top: 8%;
    font-size: clamp(1.2rem, 4.2vw, 4.2rem);
}

.read-btn{
    font-size: clamp(1rem, 4vw, 4rem);
    display: flex;
    margin: auto;
    text-decoration: none;
    background: #0816AE;
    color: white;
    padding: 6%;
    width: 60%;
    justify-content: center;
    font-family: none;
    margin-top: 10%;
    border-radius: 1vh;
    box-shadow: 10px 10px 10px rgba(0.5, 0.5, 0.5, 0.5);
}

.content-div2{
    text-align: center;
    margin-left: 6%;
    margin-right: 6%;
    border: 0.1vh solid #CECECE;
    margin-top: 3%;
    margin-bottom: 3%;
    padding: 4%;
    color: white;
    text-align: center;
    margin-top: 3%;
    color: black;
    margin-bottom: 3%;
    margin-left: 5%;
    margin-right: 5%;
    border-radius: 1vh;
    font-weight: bold;
    box-shadow: 10px 10px 10px rgba(0.2, 0.2, 0.2, 0.2);
}    

.instrumental-div{
    
    border: 0.1vh solid #DBDBDB;
    margin-top: 3.8%;
    margin-left: 3%;
    margin-right: 3%;
    margin-bottom: 3.8%;
    border-radius: 1vh;
    padding: 3%;
    aspect-ratio: 16 / 9;
    box-shadow: 0.3vh 0.3vh 0.3vh 0.3vh rgba(0.1, 0.1, 0.1, 0.1);
}

.paragraphpolicy{
   font-size: clamp(1.2rem, 3vw, 3rem);
   font-family: none;
   margin-left: 7%;
   margin-right: 9%;
}

.paragraph404{
   font-size: clamp(1.5rem, 3.8vw, 3.8rem);
   font-family: none;
   color: #4C4C51;
   margin-left: 10%;
   margin-right: 10%;
   text-align: center;
    
}

.content2{
    font-size: clamp(1.5rem, 3vw, 3rem);
    font-family: none;
    text-decoration: none;
    color: #0731A6;
    border-bottom: 1px solid #0731A6;
}

.li2{
    
    margin-top: 6%;
    margin-bottom: 6%;
    margin-left: 10%;
    margin-right: 10%;
    
    
}

.paragraphpolicy2{
   
   font-size: clamp(1.2rem, 3.8vw, 3.8rem);
   font-family: none;
   margin-left: 6%;
   margin-right: 9%;
   color: #363636;
    
}

.title-beat{
    margin-right: 30%;
    margin-left: 2%;
    margin-bottom: 5%;
    font-size: clamp(1.5rem, 3.8vw, 3.8rem);
    color: #1302BA;
    
    
}

.youtube-video{
    display: flex;
    justify-content: center;
    margin: auto;
    margin-bottom: 3%;
    width: 95%;
    height: 100%;

}

.views{
    
    font-size: clamp(1rem, 3.5vw, 3.5rem);
    margin-left: 3%;
    color: #0008A2;
    border: 1.5px solid #0029FF;
    padding: 2%;
    border-radius: 1vh;
    font-weight: bold;
    font-family: none;
    margin-bottom: 2%;

    
}


.likes{
    
    font-size: clamp(1rem, 3.5vw, 3.5rem);
    margin-left: 3%;
    color: #0008A2;
    border: 1.5px solid #0029FF;
    padding: 2%;
    border-radius: 1vh;
    font-weight: bold;
    font-family: none;
    margin-bottom: 2%;
    
}

.about-instrumental{
    margin-top: 3%;
    display: flex;
    padding: 3%;
    
    
}

.play-beat{
    font-size: clamp(1rem, 3.6vw, 3.6rem);
    box-shadow: 7px 7px 7px rgba(0.2, 0.2, 0.2, 0.2);
    display: flex;
    width: 43%;
    color: white;
    border-radius: 0.8vh;
    font-weight: bold;
    margin-top: 7%;
    margin-bottom: 6%;
    margin-left: 4%;
    text-align: center;
    justify-content: center;
    text-decoration: none;
    font-family: none;
    background: #1223DF;
    padding: 4%;
    
}


.play-beat:hover{
    
    background-color: #0D1891;
    color: #CCCCCC;
}

/* COPY THIS CODE ON YOUR FINAL WEBSITES  */
  
  @media (min-width: 1200px) {
    
    .about-paragraph2{
    font-size: 53%;
    margin-top: 6%;
    margin-bottom: 2%;
    color: #09F9EC;
    margin-left: 3.5%;
    font-family: none;
}
    
    
    .read-btn{
    font-size: 54%;
    display: flex;
    margin: auto;
    text-decoration: none;
    background: #0816AE;
    color: white;
    padding: 4%;
    width: 40%;
    justify-content: center;
    font-family: none;
    margin-top: 10%;
    border-radius: 1vh;
    box-shadow: 10px 10px 10px rgba(0.5, 0.5, 0.5, 0.5);
}
    
    .blog-div{
    
    box-shadow: 10px 10px 10px rgba(0.4, 0.4, 0.4, 0.4);
    background: #070D4E;
    color: white;
    margin-left: 5%;
    padding: 8%;
    width: 50%;
    margin-left: 18%;
    margin-right: 18%;
    height: 50%;
    border-radius: 1vh;
    margin-right: 5%;
    margin-top: 8%;
}
    .contact-info{
    display: flex;
    margin: auto;
    width: 50%;
    text-decoration: none;
    padding: 4%;
    border-radius: 1vh;
    border: 0.2vh solid #D8D8D8;
    font-size: 65%;
    outline: none;
    
}

.contact-info:hover{
    
    border: 0.2vh solid #00FF2E;
    
}


.textarea{
    display: flex;
    margin: auto;
    width: 50%;
    height: 12vh;
    text-decoration: none;
    padding: 5%;
    margin-top: 2%;
    margin-bottom: 2%;
    border-radius: 2vh;
    outline: none;
    border: 0.2vh solid #D8D8D8;
    font-size: 65%;
    
    
}

.textarea:hover{
    
    border: 0.2vh solid #00FF2E;
    
}

.submit:hover{
    
    color: #074609;
    background: linear-gradient(10deg, #34FF00, #0FFF16, #5AC90B);
    
}


.submit{
   text-decoration: none;
    margin-top: 3%;
    margin-bottom: 6%;
    margin-left: 2%;
    font-size: 57%;
    background: linear-gradient(10deg, #34FF00, #0D9F11, #5AC90B);
    padding: 3%;
    border-radius: 1vh;
    display: flex;
    margin: auto;
    width: 40%;
    border: none;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-weight: bold;    
    
}
 
      
      
    .button:hover{
    
    color: #55FF00;
    
}

.button{
   box-shadow: 10px 10px 10px rgba(0.2, 0.2, 0.2, 0.2);
    text-decoration: none;
    display: flex;
    margin-left: 8%;
    margin-top: 6%;
    margin-bottom: 6%;
    padding: 3%;
    width: 25%;
    justify-content: center;
    background: linear-gradient(10deg, #34FF00, #27AE04, #5AC90B);
    font-size: 54%;
    font-weight: bold;
    font-family: none;
    color: white;
    border-radius: 1vh;
}

   .footer-btn{
    justify-content: center;
    text-decoration: none;
    color: #02FF65;
    font-family: none;
    display: flex;
    margin: auto;
    font-size: 55%;
    padding: 2%;
    margin-top: 8%;
    margin-bottom: 8%;
    font-weight: bold;

   }   
   
   .footer-btn{
    justify-content: center;
    text-decoration: none;
    color: #02FF65;
    font-family: none;
    display: flex;
    margin: auto;
    font-size: 55%;
    padding: 2%;
    margin-top: 8%;
    margin-bottom: 8%;
    font-weight: bold;
}


.footer-paragraph{
    margin-top: 9%;
    color: white;
    text-align: center;
    font-family: none;
    font-size: 55%;
}


.flex-footer-btn{
    
    justify-content: center;
    text-decoration: none;
    color: #02FF65;
    font-family: none;
    display: flex;
    margin: auto;
    font-size: 55%;
    padding: 3%;
    margin-top: 8%;
    margin-bottom: 8%;
    font-weight: bold;

}


  
  .ok-btn{
    text-decoration: none;
    margin-top: 2%;
    margin-bottom: 6%;
    margin-left: 2%;
    font-size: 53%;
    background: #02EC59;
    padding: 4%;
    border-radius: 1vh;
    display: flex;
    margin: auto;
    width: 30%;
    border: none;
    justify-content: center;
    cursor: pointer;
    color: #000;
    font-weight: bold;  
    
}
  
  .download-image2{
    
    width: 7%;
    padding: 2%;
    margin-top: 4%;
    margin-bottom: 4%;
    
    
}
  .alert-paragraph{
    font-size: 54%;
    font-family: none;
    margin-left: 9%;
    margin-right: 9%;
    
    
}

.alert-paragraph2{
    font-size: 54%;
    margin-top: 4%;
    font-family: none;
    margin-left: 9%;
    margin-right: 9%;
    color: #47474D; 
    
}

  
  .alert-box{
    box-shadow: 4px 4px 8px rgba(0, 1, 1, 1);
    background: #FFFFFF;
    position: absolute;
    top: 15%;
    left: 20%;
    right: 20%;
    padding: 2%;
    justify-content: center;
    align-items: center;
    text-align: center;
    border-radius: 1.5vh;
    
}
  
  .download-btn{
    font-size: 57%;
    display: flex;
    box-shadow: 10px 10px 10px rgba(0.2, 0.2, 0.2, 0.2);
    width: 45%;
    margin: auto;
    font-weight: bold;
    color: white;
    margin-top: 3%;
    border-radius: 0.8vh;
    margin-bottom: 2%;
    text-align: center;
    justify-content: center;
    text-decoration: none;
    font-family: none;
    background: #062DC4;
    padding: 3%;

    
    
}

.download-btn:hover{
    background: #08195C;
    
}

.download-btn2{
    
    font-size: 57%;
    display: flex;
    box-shadow: 10px 10px 10px rgba(0.2, 0.2, 0.2, 0.2);
    width: 50%;
    margin: auto;
    font-weight: bold;
    color: white;
    margin-top: 3%;
    border-radius: 0.8vh;
    margin-bottom: 2%;
    text-align: center;
    justify-content: center;
    text-decoration: none;
    font-family: none;
    background: linear-gradient(10deg, #34FF00, #27AE04, #5AC90B);
    padding: 3%;

    
    
}


.download-btn2:hover{
    
    background: linear-gradient(10deg, #4BAE04, #337206, #1F4007);
    color: #70FF0A;
    
}

  
  
  .next-page{

    text-align: center;
    font-size: 54%;
    display: flex;
    justify-content: center;
    font-weight: bold;
    margin-top: 10%;
    margin-bottom: 5%;
    color: #FF0000;
}

  
  
  .content2{
    font-size: 54%;
    font-family: none;
    text-decoration: none;
    color: #0731A6;
    border-bottom: 1px solid #0731A6;
}
  
    .li2{
   font-size: 50%; 
    margin-top: 3%;
    margin-bottom: 3%;
    margin-left: 10%;
    margin-right: 10%;
    
    
}

    
    .li3{
    
    margin-left: 13%;
    margin-right: 13%;
    font-family: none;
    margin-top: 3%;
    margin-bottom: 3%;
    font-size: 50%;
}
    .heading{
   font-size: 65%;
    text-align: center;
    margin-top: 6%;
    margin-bottom: 5%;
    text-align: center;
    
}

.heading3{
    box-shadow: 20px 20px 20px rgba(0.1, 0.1, 0.1, 0.1);
    font-size: 62%;
    color: red;
    text-align: center;
    margin-top: 6%;
    margin-bottom: 5%;
    border-radius: 1vh;
    margin-left: 10%;
    margin-right: 10%;
    text-align: center;
    padding: 2%;
    
}

.heading4{
    
    font-size: 65%;
    text-align: center;
    margin-top: 6%;
    margin-bottom: 5%;
    text-align: center;
    color: red;
} 


.heading2{
    
    font-size: 62%;
    text-align: center;
    margin-left: 10%;
    margin-right: 10%;
    margin-top: 6%;
    margin-bottom: 5%;
    text-align: center;
    
}

    
    .paragraphpolicy{
   font-size: 53%;
   font-family: none;
   margin-left: 7%;
   margin-right: 9%;
   line-height: 1.7;
}

.paragraph404{
   font-size: 55%;
   font-family: none;
   color: #4C4C51;
   margin-left: 10%;
   margin-right: 10%;
   text-align: center;
    
}


.content-div{
    text-align: center;
    margin-left: 10%;
    margin-right: 10%;
    margin-top: 3%;
    margin-bottom: 3%;
    padding: 4%;
    border-radius: 1.5vh;
    border: 0.1vh solid #CECECE;
    box-shadow: 10px 10px 10px rgba(0.2, 0.2, 0.2, 0.2);
    
}
    
   .next-page-btn{
    
    margin-left: 2%;
    margin-top: 4%;
    text-decoration: none;
    border: 0.1rem solid #000DFF;
    font-size: 55%;
    font-family: none;
    color: #000;
    font-weight: bold;
    text-align: center;
    padding: 2.5%;
    border-radius: 1.5vh;
    width: 22%;
    box-shadow: 10px 10px 10px rgba(0.2, 0.2, 0.2, 0.2);
    
}  
      
    .next-page-btn:hover{
   
    border: 0.1rem solid #091057;
    color: #2900FF;
    
}

.next-page-btn2:hover{
      
    border: 0.1rem solid #710606;
    color: #FF0000;
}

.next-page-btn3:hover{
   
    border: 0.1rem solid #091057;
    color: #2900FF;
    
}

.next-page-btn4:hover{
      
    border: 0.1rem solid #710606;
    color: #FF0000;
}



.next-page-btn3{
    
    margin-top: 4%;
    text-decoration: none;
    border: 0.1rem solid #000DFF;
    font-size: 55%;
    font-family: none;
    color: #000;
    font-weight: bold;
    text-align: center;
    padding: 2.5%;
    border-radius: 1.5vh;
    width: 22%;
    box-shadow: 10px 10px 10px rgba(0.2, 0.2, 0.2, 0.2);
    
}



.next-page-btn4{
    
    margin-top: 4%;
    text-decoration: none;
    border: 0.1rem solid #FF0000;
    font-size: 55%;
    font-family: none;
    color: #000;
    font-weight: bold;
    text-align: center;
    padding: 2.5%;
    border-radius: 1.5vh;
    width: 22%;
    box-shadow: 10px 10px 10px rgba(0.2, 0.2, 0.2, 0.2);
    
}

.next-page-btn2{
    margin-right: 2%;
    margin-top: 4%;
    text-decoration: none;
    border: 0.1rem solid #FF0000;
    font-size: 55%;
    font-family: none;
    color: #000;
    font-weight: bold;
    text-align: center;
    padding: 2.5%;
    border-radius: 1.5vh;
    width: 22%;
    box-shadow: 10px 10px 10px rgba(0.2, 0.2, 0.2, 0.2);
    
}

.next-page-div{
    display: flex;
    margin: auto;
    justify-content: center;
}

  
  .play-beat{
    font-size: 48%;
    box-shadow: 7px 7px 7px rgba(0.2, 0.2, 0.2, 0.2);
    display: flex;
    width: 30%;
    color: white;
    border-radius: 0.8vh;
    font-weight: bold;
    margin-top: 7%;
    margin-bottom: 6%;
    margin-left: 4%;
    text-align: center;
    justify-content: center;
    text-decoration: none;
    font-family: none;
    background: #1223DF;
    padding: 3%;
    
}
  
  .about-paragraph{
   font-size: 48%;
    margin-top: 2.5%;
    margin-bottom: 2.5%;
    color: #3E3E3E;
    margin-left: 3.5%;
    font-family: none;
  }
   
   
   .likes{
    font-size: 45%;
    margin-left: 3%;
    color: #0008A2;
    border: 1.5px solid #0029FF;
    padding: 2%;
    border-radius: 1vh;
    font-weight: bold;
    font-family: none;
    margin-bottom: 2%;
    
}
   .about-instrumental{
    margin-top: 3%;
    display: flex;
    padding: 2%;
    
    
}
   .views{
    
    font-size: 45%;
    margin-left: 3%;
    color: #0008A2;
    border: 1.5px solid #0029FF;
    padding: 2%;
    border-radius: 1vh;
    font-weight: bold;
    font-family: none;
    margin-bottom: 2%;

    
}
   
    
    .title-beat{
    margin-right: 30%;
    margin-left: 5%;
    margin-bottom: 5%;
    font-size: 50%;
    color: #1302BA;
    
    
}
    
    .content-btn3:hover{
    
    background: #0F09B1;
    
}

.content-btn:hover{
    
    background: #0F09B1;
    
}

.content-btn2:hover{
    
    background: #0F09B1;
    
}




.content-btn3{
    font-size: 50%;
    font-family: none;
  text-decoration: none;
  color: white;
  font-weight: bold;
  padding: 5%;
  width: 80%;
  display: flex;
  border-top: 1.2px solid #C7C7C7;
  border-bottom: 2.2px solid #C7C7C7;
    
}
    .content-btn2{
    
    font-size: 50%;
    font-family: none;
  text-decoration: none;
  color: white;
  font-weight: bold;
  padding: 5%;
  width: 80%;
  display: flex;
  border-top: 2.2px solid #C7C7C7;
  border-bottom: 1.2px solid #C7C7C7;
    
}
    
    .content-btn{
    font-size: 50%;
    font-family: none;
    text-decoration: none;
  color: white;
  font-weight: bold;
  padding: 5%;
  width: 80%;
  display: flex;
  border-top: 1.2px solid #C7C7C7;
  border-bottom: 1.2px solid #C7C7C7;
    
}
   
   .download-image{
    width: 30%;
    margin-top: 4%;
    padding: 1.5%;
    margin-bottom: 4%;
    background: #FF0000;
    border-radius: 0.5vh;
    box-shadow: 5px 5px 5px rgba(0.3, 0.3, 0.3, 0.3);

   }    
    

   
   .div{
   display: none;
   position: fixed;
   width: 40%;
   left: 0;
   height: 100%;
   overflow-y: auto;
   background: #120179;
   padding: 1%;
    box-shadow: 10px 10px 10px rgba(0.3, 0.3, 0.3, 0.3);
    
}
   
    .youtube-video{
    display: flex;
    justify-content: center;
    margin: auto;
    margin-bottom: 3%;
    width: 90%;
    height: 90%;

} 
    
    .instrumental-div{
    border: 0.1vh solid #DBDBDB;
    margin-top: 3.8%;
    width: 50%;
    margin-left: 20%;
    margin-right: 20%;
    margin-bottom: 3%;
    border-radius: 1vh;
    padding: 1%;
    aspect-ratio: 16 / 9;
    box-shadow: 0.3vh 0.3vh 0.3vh 0.3vh rgba(0.1, 0.1, 0.1, 0.1);
}
    
    .get-btn{
    display: flex;
    margin: auto;
    justify-content: center;
    margin-top: 8%;
    margin-bottom: 8%;
    text-decoration: none;
    font-size: 50%;
    background: #0D1891;
    width: 37%;
    border-radius: 1vh;
    padding: 1%;
    color: white;
    font-weight: bold;
    font-family: none;
    box-shadow: 10px 10px 10px rgba(0.3, 0.3, 0.3, 0.3); 
}   
    .nav-btn{
    text-decoration: none;
    margin-left: 6%;
    border: 0.1vh solid #00ECFF;
    color: #00F7FF;
    padding: 2%;
    background: none;
    font-weight: bold;
    margin-right: 2%;
    border-radius: 1vh;
    width: 15%;
    cursor: pointer;
    font-size: 62%;
    box-shadow: 7px 7px 7px rgba(0.3, 0.3, 0.3, 0.3);
}   
    .logodiv{
    position: sticky; top: 0;
    background: #120179;
    box-shadow: 5px 5px 5px rgba(0.2, 0.2, 0.2, 0.2);
    top: 0;
    padding: 1.3%; 
} 
    .paragraphpolicy2{
   
   font-size: 50%;
   font-family: none;
   margin-left: 14%;
   margin-right: 9%;
   color: #363636;
   line-height: 1.7; 
}  
    .logo{
    color: white;
    font-size: 60%;
    font-weight: bold;
    font-weight: bold;
    font-family: 'Itin', cursive;
    margin-top: 1%;
    margin-left: 4%;
    text-decoration: none;
    cursor: none;

}

      .logo2{
    font-weight: bold;
    color: white;
    font-size: 40%;
    font-family: 'Itin', cursive;
     

      }
   
   .paragraph{
    
    font-size: 50%;
    margin-left: 15%;
    margin-right: 15%;
    line-height: 1.7;
    
}
   
  .titleparagraph{
    font-size: 55%;
    text-align: center;
    margin-top: 2%;
    color: #0D014D;
    margin-bottom: 3%;
    margin-left: 5%;
    margin-right: 5%;
    font-weight: bold;
}
    .content-div2{
    text-align: center;
    border: 0.1vh solid #CECECE;
    justify-content: center;
    margin-bottom: 3%;
    padding: 3%;
    width: 50%;
    color: white;
    text-align: center;
    color: black;
    margin-bottom: 3%;
    margin-left: 20%;
    margin-right: 20%;
    border-radius: 1vh;
    font-weight: bold;
    box-shadow: 15px 15px 15px rgba(0.2, 0.2, 0.2, 0.2);
}    
    
  

    
    
  }


/*  THE CODE ENDS HERE */