:root {
  --bg-color: white;
  --placeholder-color: white;
  --button-color: white;
  --input-color: white;
  --border-color: white;
  --green-color: #1DB954;
  --dark-green-color: white;
  --pink-color: #822664;
  --alt-color: gray;
}

div#NowPlaying {
    background: none;
}
body, *, html, .tabcontent {
    background: var(--bg-color) !important;
    box-shadow: none !important;
}
div#Home * {
    background: var(--bg-color)!important;
}

input#fname::placeholder {
    color: var(--placeholder-color) !important;
}
::placeholder {
    color: var(--placeholder-color) !important;
}

p#usePlaylist {
    background: var(--button-color) !important;
    color: black !important;
}

.wrap-login100 {
background: var(--bg-color) !important;
}

.login100-form-bgbtn {
    background: var(--button-color) !important;
    -webkit-transition: none !important;
    transition: none !important;
    }
    .wrap-login100-form-btn {
        border: 5px solid var(--border-color);
    }
    #albumImage {
    border: 5px solid var(--border-color);
    }
    

    .wrap-input100 {
        border-bottom: 2px solid var(--border-color);
    }
    input#partyID::placeholder {
        color: var(--input-color);
    }

    #fname {
            color: var(--input-color) !important;
        }
        #Search {
            margin-top: 36px !important;
            border-top: none !important;
            }
            #usePlaylist {
                border: 3px solid var(--border-color) !important;
                padding-top: 5px !important;
                padding-bottom: 5px !important;
            }
            .albumName {
                color: var(--alt-color) !important;
            }
            .artistName, span#artist {
                color: var(--green-color) !important;
            }

            #searchResults {
                            margin-top: 125px;
                            padding-bottom: 125px;
                            }
                          .tablinks {
                                          font-size: 12px !important;
                                      }.navLink {
                                          font-size: 48px !important;
                                      }
                                      a.navLink.w {
                                      width: 70%!important;
                                      margin: 0px 5% 15px!important;
                                      }
                                      .wholeTop {
                                          width: 100vw!important;
                                          height: 50vw!important;
                                          z-index: 100!important;
                                          position: fixed;
                                      }.player {
                                           margin-top: 49vw !important;
                                           z-index: -10 !important;
                                       }.sidenav {
                                           z-index: 10000 !important;
                                       }#albumImage {
                                            height: 42vw;
                                            width: 42vw;
                                            margin: auto 12px auto auto !important;

                                        }
                                        #albumImage {
                                            height: 35vw !important;
                                            width: 35vw !important;
                                            display: block !important;
                                            top: 10vw;
                                            /*left: 32.5vw;*/
                                            z-index: 0;
                                        }

                                                                                #albumImage2 {
                                                                                    height: 35vw !important;
                                                                                    width: 35vw !important;
                                                                                    display: block !important;
                                                                                    top: 10vw;
                                                                                    /*left: 32.5vw;*/
                                                                                    z-index: 0;
                                                                                }
div#results {
    padding-top: 0px !important;
    margin-top: 0px !important;
    
}
#wait {
    width: 100%;
    height: 100%;
    position: fixed;
    z-index: 9999;
    display:none;
    background: rgba(1, 1, 1, 0) !important;
}
input, * {
    text-transform:uppercase !important;
    font-weight: 600 !important;
}
.container-login100, .wrap-login100 {
    min-height: 94vh !important;
}
.hostButton {
    background: white !important;
   
    
}

.guestButton {
    background: white !important;
    
}
.wrap-login100-form-btn {
border: 2px solid gray !important;
}
* {
scroll-behavior: smooth !important;
}


@-webkit-keyframes blinky {
  0% {
    background-color: var(--green-color) !important;
    border: 10px solid var(--green-color);
  }
  50% {
    background-color: var(--pink-color) !important;
    border: 10px solid var(--pink-color);
  }
  100% {
    background-color: var(--green-color) !important;
    border: 10px solid var(--green-color);
  }
}

.wholeTop {
    /*display: none !important;*/
}
.player {
    margin-top: 50vw !important;
}
div.songLinkClick * {
    color: white !important;
}
* {
    background-color: white !important;
    color: white !important;
}
#load {
    width: 100%;
    height: 100%;
    position: fixed;
    z-index: 9999;
    background: url("../images/swaggerbgpink.png") no-repeat center center rgba(255,255,255, 1) !important;
    zoom: 20%;
    bottom: 0 !important;
}
#results {
visibility: collapse;
}
#results div {
visibility: visible;
}
.songLinkClick1 h5 {
    color: white !important;
}
.artistName, .tabLinks * {
    color: #1DB954 !important;
}
#fname, input, input[type=text] {
    border: 3px solid white !important;
    border-radius: 100px !important;
    caret-color: white !important;
    color: white !important;
}
#partyID {
    border: none !important;
}
.artistName, span.artist, span#artist {
    color: var(--green-color) !important;
}


.albumItem {
font-size: 10px !important;    height: 12px !important;
    padding: 0px !important;
    margin: 8px 0px !important;
    overflow: hidden !important;
}
@media screen and (min-width: 600px) {
    .albumItem {
    font-size: 12px !important;
    height: 16px !important;
        padding: 0px !important;
        margin: 8px 0px !important;
        overflow: hidden !important;
    }
}
.albumName {
    margin-bottom: 5px;
}
.wholeTop {
    
    border-bottom: 2px solid #949494;
}
#albumImage2 {
    background-size: cover !important;
}
#songInformation p {
width: 89vw !important;
overflow: scroll;
}
 div#results {
padding-top: 0px !important;
margin-top: 0px !important;
padding-bottom: 105px !important;
}



div#playlistContainer, div#playlistsListed, div#playlistItemsListed {
    padding-top: 0px !important;
    margin-top: 0px !important;
    padding-bottom: 105px !important;
}

div#playlistsListed {
/* padding-top: 105px !important; */
}


div#Home {
    height: auto !important;
}

div#playlistItemsListed, div#playlistsListed {
    max-width: 90% !important;
margin: 30px auto 100px auto !important;
}
#albumImage2 {
    background: url("../images/swaggerbgpink.png") no-repeat center center;
    background-size: cover !important;
}
.alertButton {
  border-radius: 100px;
  border: 1px solid white;
  padding: 8px 12px;
  color: #FFFFFF;
  width: 100%;
  font-size: 20px;
  font-weight: 500;
  background: #000000;
  text-decoration: none;
  text-transform: uppercase;
}
#restricted {
    max-width: 30px;
}
* {
    color: black !important;
    border-color: black !important;
}

* {
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif !important;
    font-weight: normal !important;
  }