/* 3rd party tools used
https://html-css-js.com/css/generator/text-shadow/ */

/* You're on your own for now */
body {
    font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
    color: white;
    background-color: black;
}

.col {
    border-radius: 10px;
    padding: 3px;


}
.center {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.rounded {
    transition-duration: 1s;
    border-radius: 100%;
}

.links a {
    text-decoration: none;
    color: blueviolet;
    transition-duration: 100ms;
}

.links a:hover {
    transition-duration: 100ms;
    text-shadow: 0 0 5px #2600ff, 0 0 10px #0026ff, 0 0 15px #002fff, 0 0 20px #18b6ff, 0 0 30px #1c18ff, 0 0 40px #5618ff, 0 0 55px #5618ff, 0 0 75px #2718ff, 2px 2px 3px rgba(58,67,206,0);
}


.col h3 {
    color: #FFFFFF;

    text-shadow: 0 1px 0 #CCCCCC, 0 2px 0 #c9c9c9, 0 3px 0 #bbb, 0 4px 0 #b9b9b9, 0 5px 0 #aaa, 0 6px 1px rgba(0,0,0,.1), 0 0 5px rgba(0,0,0,.1), 0 1px 3px rgba(0,0,0,.3), 0 3px 5px rgba(0,0,0,.2), 0 5px 10px rgba(0,0,0,.25), 0 10px 10px rgba(0,0,0,.2), 0 20px 20px rgba(0,0,0,.15);
    color: #FFFFFF;
}

.title {
    transition-duration: 300ms;
}
.title:hover {
    transition-duration: 300ms;
    text-shadow: 0 0 5px #2600ff, 0 0 10px #0026ff, 0 0 15px #002fff, 0 0 20px #61ff18, 0 0 30px #1c18ff, 0 0 40px #5618ff, 0 0 55px #f0ff18, 0 0 75px #2718ff, 2px 2px 3px rgba(58,67,206,0);
    scale: 1.1;
    transform: translateX(20px) rotate(0.01turn);
    
}

.rounded:hover {
    transition-duration: 1s;
    transform: rotate(1turn);
}