html {scroll-behavior: smooth;}
body {
	font-size: 100%;
	text-align: center;
	font-family: verdana;
	color: black;
	background-color: white;
	font-size: 1em; /* 16px */
}
h1 {
	letter-spacing: 0.0625em; /* 1px */
	font-size: 1.875em; /* 30px */
}
h3 {
	font-style: italic; 
	font-weight: normal; 
	letter-spacing: 0.0625em; /* 1px */
	font-size: 0.75em; /* 12px */
}
h6 {
	letter-spacing: 0.0625em; /* 1px */
	font-size: 0.625em; /* 10px */
}
a:link {text-decoration: none; color: black;}
a:visited {color: black;}
a:hover {text-decoration: underline;}

#navbar {
	overflow: hidden;
	background-color: black;
	padding: 0.75em 0em; /* Large padding which will shrink on scroll (using JS) */
	transition: 0.4s; /* Adds a transition effect when the padding is decreased */
	position: fixed; /* Sticky/fixed navbar */
	top: 0;
	left: 0;
	right: 0;
}

#navbar a {
	letter-spacing: 0.125em; /* 2px */
	text-align: center;
	color: white;
	padding: 0.625em; /* 10px */
	text-decoration: none;
	font-size: 1em; /* 16px */
}

#navbar a:hover {
	background-color: white;
	color: black;
	border-radius: 0.125em; /* 2px */
}

#navbar #mHome, #navbar #mCv, #navbar #mRiders, #navbar #mContact {transition: 0.2s;}
#home, #cv, #riders, #contact {
    font-family: verdana; 
    font-size: 0.9375em; /* 15px */
    padding-top: 8em;
    padding-bottom: 8em;
}

#contact #links {
    padding-top: 3em;
    padding-bottom: 3em;
    letter-spacing: 0.5em;
    font-size: 1.2em;
}

#home h5 a:link {text-decoration: underline;}
#cv a {color: #993366;}

#links #fb {color:#3b5998;}
#links #ig {color:black;}
#links #yt {color:#c4302b;}
#links #mail {color:#0088cc;}

#bottom {padding-top: 8em;}

@media screen and (max-width: 700px) {body {font-size: 85%;}} /* Resize for tablet like screens */
@media screen and (max-width: 640px) {body {font-size: 60%;}} /* Resize for phone like screens */