@import url('https://fonts.googleapis.com/css2?family=VT323&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Share+Tech+Mono&display=swap');

body {
background-image: linear-gradient(90deg, rgba(164,47,236,1) 0%, rgba(26,159,245,1) 15%, rgba(82,247,21,1) 30%, rgba(255,233,59,1) 50%, rgba(255,161,45,1) 70%, rgba(255,82,199,1) 85%, rgba(164,47,236,1) 100%);
}

.main {
    background-color: rgba(255, 255, 255, 0.8);
    border-radius: 5px;
    margin: 30px 380px 30px 380px;
    padding: 15px 30px 30px;
    box-shadow: 3px 1px 10px #1d1c1d;
    height: 800px;
    overflow: auto;
}

h1 {
    color: rgba(164,47,236,1);
    text-align: center;
    font-family: "VT323", monospace;
    font-weight: 400;
    font-style: normal;
    animation: h1 5s infinite;
}
@keyframes h1 {
    0% {color: rgba(164,47,236,1);}
    15% {color: rgba(26,159,245,1);}
    30% {color: rgba(82,247,21,1);}
    50% {color: rgba(255,233,59,1);}
    75% { color: rgba(255,82,199,1);}
}

.card {
    border-radius: 4px;
    padding: 7px;
    height: 250px;
}

.column {
    bottom: 40px;
    position: relative;
    display: inline-block;
    font-size: 14pt;
    font-family: "Share Tech Mono", monospace;
}

.row {
    display: flex;
    border-radius: 4px;
    padding: 3px;
    margin: 10px;
}

.col-1 {
    text-align: left;
    padding-left: 10px;
    text-shadow: 1px 1px 3px black;
}

.col-2 {
    align-items: right;
    padding-left: 30px;
    padding-right: 10px;
}

.ava {
    height: 250px;
    width: 250px;
    object-position: left;
}

h3 {
    font-family: "VT323", monospace;
    font-size: 18pt;
    font-weight: 400;
    font-style: normal;
    color: white;
    background-color: #1d1c1d;
    text-align: center;
}

p {
    text-align: justify;
    font-family: "Share Tech Mono", monospace;
    font-size: 14pt;
}