body {font-family: 'Lexend', sans-serif;
font-size:1em; font-weight:200;
line-height:1.7em; margin:0; text-align:left; transition: all ease-in-out 0.7s;}

.bacK {
background: linear-gradient(230deg, rgba(255,255,255,1) 0%, rgba(42,184,255,1) 100%);
background-position: 1px 1px; min-height:100vh;
}

#head > h1 {margin: 5% 0 0;}
h1 {font-size:1.5em; font-weight:500; color:#000000; margin:5% 0 0; color: #000000;}
h2 {font-size:1.3em; font-weight:500; color:#000000; margin: 0;}
h3 {font-size:1.3em; font-weight:300; color:#000000; margin:5% 0 0;}
h4 {font-size:1.3em; font-weight:300; color:#218890; margin:0;}
.big {font-size:4em; font-weight:500; color:#218890; margin:0; color: #000000; text-transform: none;}

#content {width:80%; margin:1% auto 1%; padding:0 20px; padding-bottom:0; min-height: 90vh;}

#head, #top, #ref, #footer {transition: transform 10s;}
#top:hover {transform: skew(0.9deg, -0.9deg);}
#ref:hover {transform: skew(-0.9deg, 0.9deg);}
#head:hover, #footer:hover {transform: skew(-1deg, 2deg);}

.fa-solid {
font-size: 18px;
color: #000;
margin-right: 10px;
}

p {color:#000000;}
#top > p, #content > h3 {margin:2% 0 0;}
div {margin: 0;}
#ref > h3 {font-weight: 500;}
#ref > p {margin: 10px 0;}

a {color:#FF33E9; text-decoration:none; background:#33F0FF; padding: 0px 2px; font-size:14px;
transition: background 1s ease-out, color 1s ease-out; text-transform: uppercase; font-weight: 500;}

a:hover {background-color:#FF33E9; color:#33F0FF; cursor: pointer; text-decoration: none; border: none;}
.centre, #footer {text-align:center;}

#footer > p {font-size:12px;font-weight:300;padding-bottom:0; margin-top: 3%;}

@media screen and (max-width: 768px) {#content { width:90%; margin-top:10%;} #ref > p {margin: 20px 0;}}