@import url('https://fonts.googleapis.com/css2?family=Share+Tech+Mono&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Libre+Barcode+39+Extended+Text&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Flow+Circular&display=swap');
html{
    font-size: calc(0.6em + 1vw);
}
body{
    font-family: 'Share Tech Mono', monospace;
    margin:0;
    background-color: cornsilk;
    text-align: center;
}
header, section, ul, summary, footer{ padding:10px;}
header{
font-size: 2em;

}

section{
    font-size: 0.8em;
    background-color: aquamarine;
    border-radius: 5%;
    border: 50px;
}

ul{
background-color: azure;
border-radius: 10%;
}
#like-list{
    height: 30vh;
    font-size: 1em;
    border: 50px;
}
#title-bar{
    font-family: 'Libre Barcode 39 Extended Text', cursive; 
    font-size: 1em;
}
.like-more{
    font-size: 1em;
}
summary{
    background-color: blue;
    color: white;
}
footer{
    text-align: center;
    font-family: 'Flow Circular', cursive;
    font-size: 0.6rem;
}
h3{
    font-weight: bold;
}

li{
    padding:5px;
    opacity: 50%;
 }
li ::before{
    content: '==>   ';
    font-weight: bolder;
    line-height: 1.6em;
}
footer :hover{
    transform: scale(1.5);
    transition-duration: 500ms;

}
#messing :hover{
    cursor: grab;

}