:root{
    --pallete-1st:rgb(255,222,89);
    --pallete-2nd:#777;
    --pallete-black:black;
    --pallete-white:white;
}

*{
    box-sizing:border-box;
    margin:0;
    padding:0;
}

@font-face{
    font-family:Basic;
    src:url("/fonts/ShareTech-Regular.ttf");
}

body{
    font-family:Basic;
}

.flex_page{
    width:100%;
    height:100vh;
    display:flex;
    justify-content:center;
    align-items:center;
    flex-wrap:wrap;
    padding:25px;
}

.simple_container{
    width:100%;
    display:flex;
}

.flex_container{
    width:100%;
    display:flex;
    justify-content:center;
    align-items:center;
    flex-wrap:wrap;
}

input[type=text],
input[type=password]{
    min-height:35px;
    border:2px solid var(--pallete-2nd);
    border-radius:10px;
    margin:0px 5px 5px 5px;
}

button, 
input[type=submit]{
    background-color:var(--pallete-black);
    color:var(--pallete-white);
    font-weight:600;
    border:2px solid var(--pallete-black);
    border-radius:10px;
    min-width:100px;
    min-height:40px;
    padding:0px 5px;
}

button:hover, 
input[type=submit]:hover{
    background-color:var(--pallete-white);
    color:var(--pallete-black);
}

button:active, 
input[type=submit]:active{
    background-color:var(--pallete-1st);
    color:var(--pallete-black);
    transform:scale(0.95,0.95);
    font-weight:700;
}