.center{
    text-align: center;
}

html {
    font-family: Verdana, Geneva, Tahoma, sans-serif;
    background-color:black;
    background: #000000;
    background: linear-gradient(90deg,rgba(0, 0, 0, 1) 0%, rgb(12, 5, 12) 76%, rgb(34, 0, 48) 100%);
    color:white;
    overflow-x: hidden; /* no horizontal scroll */
    text-wrap: balance;
}


h1{
    font-size:5em;
}
.coindir{
    font-size:3em;
}

.flipbutton{
    color:white;
    background-color:#500050;
    font-size:8em;
    border-color: purple;
    border-width: 10px;
    border-radius:50px;
}

.flipbutton:hover{
    background-color: #8d008d;
}

.parent {
display: grid;
grid-template-columns: repeat(5, 1fr);
grid-template-rows: repeat(5, 1fr);
}

.div1 { grid-area: 1 / 1 / 6 / 2; transition: all 0.75s ease-in-out; transform: translateX(calc(-25em)); position: relative; height: 80vh; background-color:#111;}
.div2 { grid-area: 1 / 1 / 6 / 6; transition: all 0.75s ease-in-out; }
.div2.opened {  transform: translateX(25em) }
.div1.opened {  transform: translateX(0) }

.sidebararrow {
    cursor: pointer;
    transition: all 0.75s ease-in-out;
}

.sidebararrow.opened {
    transform: translateX(25em)
}

.custom{
    display: none;
}

input{
    background-color: #111111;
    color:white;
}

.graph{
    display: none;
}