@import url('https://fonts.googleapis.com/css2?family=Quattrocento+Sans&display=swap');

body
{
    margin: 9px;
    background: linear-gradient( rgb(65, 128, 231) 90%,  #ffffff3f);
    font-family: 'Quattrocento Sans', sans-serif;
    color:white;
}

code
{
    font-size: 1.4em;
}

h1
{
    color: whitesmoke;
    text-align: center;
    font-size: 360%;
    margin: 1.8%;
    text-shadow: brown 9px 0px 3px, rgb(66, 0, 128) 0px 9px 6px;
}
h2
{
    font-style:unset;
    font-weight:600;
    font-size: 1.5em;
    font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
}

h3
{
    font: oblique 900 1.2em 'Franklin Gothic Medium', sans-serif;
}

.blococ
{
    display: inline-block;
    padding: 9px;
    margin: 18px;
    border: 3px groove darkblue;
    border-radius: 9px;
    background-color: whitesmoke;
    box-shadow: 2px 2px 6px 1px  rgba(128, 0, 128, 0.643);
    position: relative;
    left: 1.8%;

}

.blococ:hover
{
    color: rgba(56, 25, 158, 0.965);
    font-size: large;
    transition: 0.9s;
    transform: scale(1.08);
}

section
{
    border: solid 0.5px black;
    padding: 1%;
}

table
{
    color: black;
}

td
{
    padding: 4.5px;
}


.blocof
{
    display: inline-block;
    width: 39.9%;
    padding: 9px;
    margin: 18px;
    border: 3px groove darkblue;
    border-radius: 9px;
    background-color: whitesmoke;
    box-shadow: 2px 2px 6px 1px  rgba(128, 0, 128, 0.643);
    position: relative;
    left: 1.8%;
}

.blocof:hover
{
    color: rgba(56, 25, 158, 0.965);
    font-size: large;
    transition: 1.8s;
    transform: rotate(-36deg) scale(1.18);
}