#formContainer{
    background-color:white;
    height: 55%;
    margin: 20% auto;
    padding: 1%;
    border: 1px solid black;
    border-radius: 10px;
}

::webkit-scrollbar {
    width: 0;
    height: 0;
}
body {
    background-image: url("../../img/index/bkground.gif");
    background-repeat: no-repeat;
    background-size: cover;
}

@media (max-width: 821px) and (min-width: 545px) {
    #logIn { padding: 10px 25px;}
    .shrinkable { display: block; }
    #formContainer {width: 45%;}
    body { background-image: none;}
}

@media (max-width: 544px) {
    #logIn { padding: 1px 20px;}
    .shrinkable { display: block; }
    #formContainer {width: 55%}
}
@media (min-width: 822px) {
    .shrinkable { display: block }
    #logIn { padding: 13px 32px;}
    #formContainer {width: 25%;}
}
#email {
    width:70%;
    height:40px;
    margin: 0 auto;
    padding-top: 17px;
    border: none;
    outline:none;
    border-bottom:2px solid black;
}
#logInShort {
    background-color: #CDCDCD;
    color:black;
    border: none;
    padding: 13px 32px;
    border-radius: 10px;
    text-align: center;
    text-decoration: none;
    font-size: 17px;
    font-weight: bold;
    font-family: 'PT Serif', sans-serif;
    margin: 0 auto;

}
#password{
    width:70%;
    height:40px;
    margin: 0 auto;
    border: none;
    outline:none;
    padding-top: 17px;
    border-bottom:2px solid black;
    margin-bottom: 7px;
}

#emailshort {
    width:70%;
    height:40px;
    margin: 0 auto;
    padding-top: 17px;
    border: none;
    outline:none;
    border-bottom:2px solid black;
}

#passwordshort {
    width:70%;
    height:40px;
    margin: 0 auto;
    border: none;
    outline:none;
    padding-top: 17px;
    border-bottom:2px solid black;
    margin-bottom: 7px;
}


#logIn{
    background-color: #CDCDCD;
    color:black;
    border: none;
    border-radius: 10px;
    text-align: center;
    text-decoration: none;
    font-size: 17px;
    font-weight: bold;
    font-family: 'PT Serif', sans-serif;
    margin: 0 auto;

}

#error {
    color:red;
    font-size: 12px;
    font-weight: bold;
    font-family: 'PT Serif', sans-serif;
    margin: 0 auto;
    display: block;
    text-align: center;
}

#signup {
    text-decoration: none;
    font-size: 13px;
    font-weight: bold;
    font-family: 'PT Serif', sans-serif;
    margin: 0 auto;
    display: block;
    text-align: center;
    margin-bottom: 2%;
}

#forgot {
    bottom: 0;
    left: 0;
    background-color: #CDCDCD;
    color:black;
    border: none;
    padding: 10px 28px;
    text-align: center;
    text-decoration: none;
    font-size: 13px;
    font-weight: bold;
    font-family: 'PT Serif', sans-serif;
    display: block;
    border-radius: 10px;
    margin-top: 10px;
}

#forgot:hover {
    background-color: #c2c1c1;
}

#tos {
    bottom: 0;
    left: 100%;;
    background-color: #CDCDCD;
    color:black;
    border: none;
    padding: 10px 28px;
    text-align: center;
    text-decoration: none;
    font-size: 13px;
    font-weight: bold;
    font-family: 'PT Serif', sans-serif;
    display: block;
    border-radius: 10px;
    margin-top: 10px;
}

#tos:hover {
    background-color: #c2c1c1;
}


button:hover{
    box-shadow: 0 12px 16px 0 rgba(0,0,0,0.24), 0 17px 50px 0 rgba(0,0,0,0.19);
}