style.css

html,body{
        padding: 0;
        margin:0;
        font-family: 'Staatliches', cursive;
}
.addButton{
        cursor: pointer;
}
.myModal{
        z-index: 5;
        position: absolute;
        left: -100%;
        top: 0px;
        background-color: white;
        width: 90%;
        padding: 20px;
        box-shadow: 2px 3px 10px black;
        border-bottom-left-radius: 5px;
        border-bottom-right-radius: 5px;
}
.circle{
	font-size: 30px;
	
}
.adc{
        width: 97%;
        height: 100%;
	padding: 20px;
        border-radius: 10px;
        font-weight: 1000;
}
.output{
	min-height: 300px;
	background-color: black;
	border: 4px solid white;
        border-radius: 5px;

}
.output pre{
	background-color: black;
	color: green;
	font-size: 20px;
}
.adc:hover{
	box-shadow: 0px 0px 30px black;
}
.myModal span{
	cursor: pointer;
}
.mainDiv{
        color: white;
}
.del{
        float: right;
        z-index: 10000;
}
.form-check {
    
        padding-bottom: 20px;
}
.cpy{
        float: right;
        border: 0.5px black solid;
}

.footer{
        background-color: #1de9b6;
        width: 100%;
        bottom: 0;
        margin-top: 2em;
        text-align: center;
        padding: 1em;
        font-weight: bold;
}
.footer p{
        margin: 0;
        padding: 0.2em;
}
.heading{
        background-color: #1de9b6;
        padding: 0.3em;
        font-family: 'Anton';
        padding-left: 1em;

}
.heading p{

        font-weight: 1000;
        font-size: 1.5em;
        margin: 0;
}