
.hide{
    display:none;
   
    position: absolute;
  top: 0;
  left: 0;
}
.cunt {
     position: fixed;
  top: 0;
  left: 0;

    width:100vw;
    height:100vh;
     background: white;
     opacity: 0.14;
      display: flex;
  align-items: center;
  justify-content: center;
cursor: auto;
   
}
.modal {
 position:relative;
  width: 100vw;
  height:100vh;
  display: flex;
  align-items: center;
  justify-content: center;
}

.modal-content {
  width: 400px;
  padding: 10px;
position: relative;

  background: yellow;
  border-radius: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
  
}

.modal-exit {
    width:60px;
    height:60px;
      border-radius: 50%;
  position: absolute;
  top:-70px;
  display:block;
 z-index:9;
 right:0;
}

.exit-btn {
    width:60px;
    height:60px;
  background: red;
 z-index:9;
  color: #fff;
  padding: 5px 10px;
  border-radius: 50%;
  font-weight: bold;
  line-height:60px;
  font-size: 60px;

}

.modal-buttons {
width:100%;
height:100%;
 display:block;
  border-radius: 50px;
}

.btn1,
.btn2,
.btn3,
.btn4 {
    width:90%;
    height:90px;
  padding: 10px 20px;
  font-weight: bold;
  font-size: 52px;
  background: #000;
  color: #fff;
  border-radius: 50px;

  position:relative;
  pointer-events: auto;
}

.modal2 {
  display: none;
  position: fixed;
  justify-content:center;
  align-items:center;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background-color: rgba(0, 0, 0, 0.8);
  z-index: 9999;
}

.modal2__content {
 display:block;
 width:400px;
  padding: 40px;
  background-color: #fff;
  border-radius: 10px;
  text-align: center;
}

.modal2__title {
  margin-top: 0;
  font-size: 4em;
  font-weight: 700;
}

.modal2__text {
  margin-bottom: 30px;
  font-size: 3em;
  color:green;
}

.modal2__close {
  display: inline-block;
 font-size: 3em;
 width:250px;
 height:100px;
  background-color: #ff4d4d;
  color: blue;
  border: none;
  border-radius: 5px;
  cursor: pointer;
  transition: all 0.3s ease;
}

.modal2__close:hover {
  background-color: #e60000;
}

.modal3 {
  display: none;
  position: absolute;
  justify-content:center;
  align-items:center;
  top: 0;
  left: 0;
  width: 100vw;
  height:100vh;
  background-color: rgba(0, 0, 0, 0.8);
  z-index: 9999;
}

.modal3__content {
    position:relative;
 display:block;
 padding:20px;
  border-style: solid;
  border-width:5px;
  border-color:white;
  border-radius: 50%;
  background-color:darkblue;
  text-align: center;
  margin:auto;
}


.modal3__close {
    position:absolute;
  display: block;
 font-size: 2em;
 font-weight:bold;
 width:75px;
 height:75px;
top:10px;
right:-30px;
  background-color: red;
  color: black;
  border: none;
  border-radius: 50%;
  cursor: pointer;
  transition: all 0.3s ease;
}

.modal3__close:hover {
  background-color: #e60000;
}

.musicbutton1 {
    width:100px;
    height:100px;
    display:inline-block;
    margin:auto;
    padding:25px;
    border-style: double;
  border-width:10px;
  border-color:white;
  border-radius: 50%;
     background-image: url("../img/Apple.png");
background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
}

.musicbutton2 {
    width:100px;
    height:100px;
    padding:25px;
    display:inline-block;
    margin:auto;
    border-style: double;
  border-width:10px;
  border-color:white;
  border-radius: 50%;
     background-image: url("../img/Spotify.png");
background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
}

.musicbutton3 {
   width:100px;
    height:100px;
      
    display:inline-block;
    margin:auto;
    padding:25px;
     background:none;
 
}

.musicbutton4 {
    width:100px;
    height:100px;
    display:inline-block;
    margin:auto;
    padding:25px;
    border-style: double;
  border-width:10px;
  border-color:white;
  border-radius: 50%;
     background-image: url("../img/Amazon.png");
background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
}
.musicbutton5 {
    width:100px;
    height:100px;
    display:inline-block;
    margin:auto;
    padding:25px;
    border-style: double;
  border-width:10px;
  border-color:white;
  border-radius: 50%;
     background-image: url("../img/Youtube.png");
background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
}
.modal3 {
  display: none;
  position: absolute;
  justify-content:center;
  align-items:center;
  top: 0;
  left: 0;
  width: 100vw;
  height:100vh;
  background-color: rgba(0, 0, 0, 0.8);
  z-index: 9999;
}

.modal3__content {
    position:relative;
 display:block;
 padding:20px;
  border-style: solid;
  border-width:5px;
  border-color:white;
  border-radius: 50%;
  background-color:darkblue;
  text-align: center;
  margin:auto;
}


.modal3__close {
    position:absolute;
  display: block;
 font-size: 2em;
 font-weight:bold;
 width:75px;
 height:75px;
top:10px;
right:-30px;
  background-color: red;
  color: black;
  border: none;
  border-radius: 50%;
  cursor: pointer;
  transition: all 0.3s ease;
}

.modal3__close:hover {
  background-color: #e60000;
}

.musicbutton1 {
    width:100px;
    height:100px;
    display:inline-block;
    margin:auto;
    padding:25px;
    border-style: double;
  border-width:10px;
  border-color:white;
  border-radius: 50%;
     background-image: url("../img/Apple.png");
background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
}

.musicbutton2 {
    width:100px;
    height:100px;
    padding:25px;
    display:inline-block;
    margin:auto;
    border-style: double;
  border-width:10px;
  border-color:white;
  border-radius: 50%;
     background-image: url("../img/Spotify.png");
background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
}

.musicbutton3 {
   width:100px;
    height:100px;
      
    display:inline-block;
    margin:auto;
    padding:25px;
     background:none;
 
}

.musicbutton4 {
    width:100px;
    height:100px;
    display:inline-block;
    margin:auto;
    padding:25px;
    border-style: double;
  border-width:10px;
  border-color:white;
  border-radius: 50%;
     background-image: url("../img/Amazon.png");
background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
}
.musicbutton5 {
    width:100px;
    height:100px;
    display:inline-block;
    margin:auto;
    padding:25px;
    border-style: double;
  border-width:10px;
  border-color:white;
  border-radius: 50%;
     background-image: url("../img/Youtube.png");
background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
}

.modal3 {
  display: none;
  position: absolute;
  justify-content:center;
  align-items:center;
  top: 0;
  left: 0;
  width: 100vw;
  height:100vh;
  background-color: rgba(0, 0, 0, 0.8);
  z-index: 9999;
}

.modal3__content {
    position:relative;
 display:block;
 padding:20px;
  border-style: solid;
  border-width:5px;
  border-color:white;
  border-radius: 50%;
  background-color:darkblue;
  text-align: center;
  margin:auto;
}


.modal3__close {
    position:absolute;
  display: block;
 font-size: 2em;
 font-weight:bold;
 width:75px;
 height:75px;
top:10px;
right:-30px;
  background-color: red;
  color: black;
  border: none;
  border-radius: 50%;
  cursor: pointer;
  transition: all 0.3s ease;
}

.modal3__close:hover {
  background-color: #e60000;
}

.musicbutton1 {
    width:100px;
    height:100px;
    display:inline-block;
    margin:auto;
    padding:25px;
    border-style: double;
  border-width:10px;
  border-color:white;
  border-radius: 50%;
     background-image: url("../img/Apple.png");
background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
}

.musicbutton2 {
    width:100px;
    height:100px;
    padding:25px;
    display:inline-block;
    margin:auto;
    border-style: double;
  border-width:10px;
  border-color:white;
  border-radius: 50%;
     background-image: url("../img/Spotify.png");
background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
}

.musicbutton3 {
   width:100px;
    height:100px;
      
    display:inline-block;
    margin:auto;
    padding:25px;
     background:none;
 
}

.musicbutton4 {
    width:100px;
    height:100px;
    display:inline-block;
    margin:auto;
    padding:25px;
    border-style: double;
  border-width:10px;
  border-color:white;
  border-radius: 50%;
     background-image: url("../img/Amazon.png");
background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
}
.musicbutton5 {
    width:100px;
    height:100px;
    display:inline-block;
    margin:auto;
    padding:25px;
    border-style: double;
  border-width:10px;
  border-color:white;
  border-radius: 50%;
     background-image: url("../img/Youtube.png");
background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
}


.modal4 {
  display: none;
  position: absolute;
  justify-content:center;
  align-items:center;
  top: 0;
  left: 0;
  width: 100vw;
  height:100vh;
  background-color: rgba(0, 0, 0, 0.8);
  z-index: 9999;
}

.modal4__content {
    position:relative;
 display:block;
 padding:20px;
  border-style: solid;
  border-width:5px;
  border-color:white;
  border-radius: 50%;
  background-color:darkblue;
  text-align: center;
  margin:auto;
}


.modal4__close {
    position:absolute;
  display: block;
 font-size: 2em;
 font-weight:bold;
 width:75px;
 height:75px;
top:10px;
right:-30px;
  background-color: red;
  color: black;
  border: none;
  border-radius: 50%;
  cursor: pointer;
  transition: all 0.3s ease;
}

.modal4__close:hover {
  background-color: #e60000;
}

.paybutton1 {
    width:100px;
    height:100px;
    display:inline-block;
    margin:auto;
    padding:25px;
  
  border-width:10px;
  border-color:white;
  border-radius: 50%;
     background:none;

}

.paybutton2 {
    width:100px;
    height:100px;
    padding:25px;
    display:inline-block;
    margin:auto;
  border-width:10px;
  border-color:white;
  border-radius: 50%;
  background-image: url("../img/PayPal.png");
background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
 
}

.paybutton3 {
   width:100px;
    height:100px;
      
    display:inline-block;
    margin:auto;
    padding:25px;
    
    
 
}

.paybutton4 {
    width:100px;
    height:100px;
    display:inline-block;
    margin:auto;
    padding:25px;
   
  border-width:10px;
  border-color:white;
  border-radius: 50%;
  background-image: url("../img/venmo.png");
background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
    
}
.paybutton5 {
    width:100px;
    height:100px;
    display:inline-block;
    margin:auto;
    padding:25px;
  ;
  border-width:10px;
  border-color:white;
  border-radius: 50%;
   
}

.modal5 {
  display: none;
  position: absolute;
  justify-content:center;
  align-items:center;
  top: 0;
  left: 0;
  width: 100vw;
  height:100vh;
  background-color: rgba(0, 0, 0, 0.8);
  z-index: 9999;
}

.modal5__content {
    position:relative;
 display:block;
 padding:20px;
  border-style: solid;
  border-width:5px;
  border-color:white;
  border-radius: 50%;
  background-color:darkblue;
  text-align: center;
  margin:auto;
}


.modal5__close {
    position:absolute;
  display: block;
 font-size: 2em;
 font-weight:bold;
 width:75px;
 height:75px;
top:10px;
right:-30px;
  background-color: red;
  color: black;
  border: none;
  border-radius: 50%;
  cursor: pointer;
  transition: all 0.3s ease;
}

.modal5__close:hover {
  background-color: #e60000;
}

.socialbutton1 {
    width:100px;
    height:100px;
    display:inline-block;
    margin:auto;
    padding:25px;
  background-image: url("../img/Facebook.png");
   border-style: double;
  border-width:10px;
  border-color:white;
  border-radius: 50%;
background-repeat: no-repeat;
  background-size: cover;
  background-position: center;

}

.socialbutton2 {
    width:100px;
    height:100px;
    padding:25px;
    display:inline-block;
    margin:auto;
    border-style: double;
  border-width:10px;
  border-color:white;
  border-radius: 50%;
  background-image: url("../img/IG2.png");
background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
 
}

.socialbutton3 {
   width:100px;
    height:100px;
      
    display:inline-block;
    margin:auto;
    padding:25px;
    
    
 
}

.socialbutton4 {
    width:100px;
    height:100px;
    display:inline-block;
    margin:auto;
    padding:25px;
   border-style: double;
  border-width:10px;
  border-color:white;
  border-radius: 50%;
  background-image: url("../img/Twitter.png");
background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
    
}
.socialbutton5 {
    width:100px;
    height:100px;
    display:inline-block;
    margin:auto;
    padding:25px;
  border-width:10px;
  border-color:white;
  border-radius: 50%;
   
}