#popup {
    position: fixed;
    margin: 0;
    top: 0;
    z-index: 1000;
    height: 100%;
    width: 100%;
    justify-content: center;
    align-items: center;
    background: rgba(104, 101, 101, 0.226);
}

#popdiv {
    width: 70%;
    height: 75%;
    background-color: white;
    border-radius: 5px;
    box-shadow: 3px 3px 10px black;
}

#popheadnav {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-left: 1em;
    padding-right: 1em;
}

#navbackpop, #close {
    font-size: 1.5em;
    font-weight: 500;
    cursor: pointer;
}

#close:hover {
    border-color: 1px black solid;
}

#popcar {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    align-items: center;
    height: 100%;
}

#didf h3 {
    font-size: 2em;
    font-weight: 600;
}

#passc, #forgot {
    width: 80%;
}

#femailput {
    width: 100%;
    height: 100%;
    margin-top: 3em;
    display: grid;
    grid-template-rows: 10% auto;
    gap: 2px;
}

#logbtn, #signupbtn, iframe {
    width: 70%;
    height: 3em;
    border-radius: 3px;
    margin-top: 5%;

}

#logbtn {
    background-color: rgb(145, 210, 80);
    font-weight: 700;
    text-transform: capitalize;
    color: white;
    cursor: pointer;

}
#logbtn:hover {
    background-color: rgb(144, 194, 93);
}

#signupbtn {
    border-radius: 3px;
    border: 2px solid;
    font-weight: 700;
    text-transform: capitalize;
    color: black;
    cursor: pointer;
}

#exgp {
    border-radius: 12px;
    /* border: 2px solid; */
    /* background-color: blue; */
    font-weight: 700;
    text-transform: capitalize;
    /* color: white; */
    cursor: pointer;
}

#Tinput, #Einput, #Pinput, #Ninput {
    width: 90%;
    height: 2.5rem;
    text-align: center;
    border: 2px rgb(34, 33, 33) solid;
    margin-top: 2em;
    border-radius: 4px;
    cursor: pointer;
}

#submit {
    width: 90%;
    height: 2rem;
    background-color: greenyellow;
    margin-top: 1.5em;
    border-radius: 3px;
    cursor: pointer;
}

#submit:hover {
    background-color: rgb(159, 207, 63);
}

#TaC {
    color: rgb(85, 85, 201);
    text-decoration: underline;
    text-transform: capitalize;
    cursor: pointer;
}

#tacdiv {
    position: relative;
}

#tclist {
    padding-left: 1em;
    max-height: 55vh;
    width: 100%;
    overflow: hidden;
    overflow-y: scroll;
    font-size: 0.8em;
    text-align: left;

}

#tclist li {
    padding-bottom: 1.5em;
}

hr {
    display: inline-flex;
    background-color: rgb(70, 67, 67);
}

#popnotify {
    display: none;
    height: 6vh;
    width: 80vw;
    z-index: 1111;
    position: fixed;
    justify-content: center;
    align-items: center;
    bottom: 12vh;
    justify-self: center;
    border-radius: 2px;
    box-shadow: 4px 4px 8px;
    background-color: white;
}

#notify {
    display: flex;
    width: 80vw;
    border-radius: 2px;
    grid-template-columns: 80% 20%;
    color: black;
}

#notex {
    font-weight: 400;
    /* text-align: center; */
    width:90%;
}

#notcl {
    font-weight: 700;
    text-align: end;
}

.playdiv {
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
    justify-items: center;
    align-items: center;
    height: 72%;
}

.playdownbtn {
    width: 22em;
    height: 4em;
    border-radius: 3px;
    background-color: rgb(149, 248, 149);
    font-size: 1em;
    font-weight: 600;
    color: white;
    box-sizing: border-box;
    text-align: center;
    text-transform: capitalize;
}
.playdownbtn:hover {
    background-color: rgb(197, 247, 197);
    box-shadow: 2px 2px 10px;
}

@media (max-width: 640px) {
    #popdiv {
        width: 100vw;
        height: 76vh;
        border-radius: 0%;
        border-top: 2px solid rgb(152, 236, 152);
    }
}

#feedbackform {
    width: 100%;
}

#feedbackform h3 {
    font-size: 1.5em;
}

#feedbackform textarea {
    border: 1px solid;
    border-radius: 8px;
    width: 100%;
    height: 10%;
}