html{
    color-scheme: dark;
    background-color:#ffffff;
}

body{
    height:100vh;
    width:100%;
    margin:0;
    padding: 0;
    font-family: Arial, Helvetica, sans-serif;
}


img{
    width: 15vw;
    height: auto;
}

.mylabel{
    color: white;
    font-size:medium;
}

input{
    margin-bottom: 20px;
    margin-top: 4px;
    width: 100%;
    height: 30px;
    border-width: 1px;
    background-color: rgba(255, 255, 255, 0.2);
}

.formdiv{
    display: flex;
    flex-direction: column;
    justify-content: center;
    background-color:#470000;
    padding: 60px;
    margin: 0px 32% 0px 32%;
    box-shadow: 10px 10px 5px 7px rgb(37, 37, 37);
}

#editorBtn{
    width: fit-content;
    padding: 5px;
    align-self: center;
}

input[type=submit]{
    background-color: #470000;
    width: 100%;
    line-height:0px;
    padding: 24px 48px;
    border: solid;
    border-radius: 6px;
    font-size: larger;
    margin-bottom: 0px;
}

input[type=submit]:hover{
    background-color: rgba(121, 121, 121, 0.3);
}

select{
    background-color: #470000;
    padding: 5px;
}

#addDiv, #addDivGsmt{
    width: 100%;
    margin: 40px 0;
    text-align: center;
}

.addButton{
    padding: 10px;
    background-color: #dbdbdb;
    color: #000;
    font-size:14px;
    border-radius: 7px;
    transition: padding 0.4s, background-color 0.4s, font-size 0.4s;
}

.addButton:hover{
    padding: 12px;
    background-color: #e1ffcd;
    font-size:14.5px;
}


@media only screen and (min-width: 769px) and (max-width: 1100px) {
    /* For tablet: */
    .formdiv{
        margin: 0px 15% 0px 15%;
    }
  }
  @media only screen and (max-width: 768px) {
    /* For mobile phones: */
    .formdiv{
        margin: 0px 10% 0px 10%;
        padding: 30px;
        box-shadow: 5px 5px 3px 1px rgb(36, 36, 36);
    }
    input{
        height: 23px;
        margin-bottom: 10px;
    }
    input[type=submit]{
        font-size:medium;
        padding: 18px 36px;
    }
    .mylabel{
        font-size:small;
    }
  }