@charset "utf-8";
/* CSS Document */

*{
	margin: 0;
	padding: 0;
}

/* Color Theme Swatches in Hex */
.Swimming-pool-from-underwater-1-hex { color: #010440; }
.Swimming-pool-from-underwater-2-hex { color: #115DBF; }
.Swimming-pool-from-underwater-3-hex { color: #1570BF; }
.Swimming-pool-from-underwater-4-hex { color: #1EA4D9; }
.Swimming-pool-from-underwater-5-hex { color: #23C7D9; }

/* Color Theme Swatches in RGBA */
.Swimming-pool-from-underwater-1-rgba { color: rgba(1, 4, 64, 1); }
.Swimming-pool-from-underwater-2-rgba { color: rgba(17, 93, 191, 1); }
.Swimming-pool-from-underwater-3-rgba { color: rgba(21, 112, 191, 1); }
.Swimming-pool-from-underwater-4-rgba { color: rgba(30, 164, 217, 1); }
.Swimming-pool-from-underwater-5-rgba { color: rgba(35, 199, 217, 1); }

/* Color Theme Swatches in HSLA */
.Swimming-pool-from-underwater-1-hsla { color: hsla(237, 96, 12, 1); }
.Swimming-pool-from-underwater-2-hsla { color: hsla(213, 83, 40, 1); }
.Swimming-pool-from-underwater-3-hsla { color: hsla(207, 80, 41, 1); }
.Swimming-pool-from-underwater-4-hsla { color: hsla(197, 75, 48, 1); }
.Swimming-pool-from-underwater-5-hsla { color: hsla(185, 72, 49, 1); }



header {
	margin-top: 0px;
	margin: -5px;
	padding: 20px;
	padding-bottom: 20px;
	background-image:linear-gradient(white, white, white, white, white, transparent);
}

header h1 {
	position: relative;
	top: -10px;
	color: #1570BF;
	padding: 15px;
}

nav {
	padding: 10px;
	float: right;
	position: fixed;
	top: 0px;
	right: 10px;
	backface-visibility: hidden;
}

li {
	
	display: inline;
	border-radius: 20px;
	padding: 15px 40px;
	margin: 5px;
	background-image: radial-gradient(white, transparent);
}

li a {
	list-style: none;
	text-decoration: none;
	color: #1570BF;
}

html {
	background-image: url(background_tiles.jpg);
	background-size: 100%;
	background-repeat: repeat-y;
}

body {
	color: black;
	margin: 0px;
}

body p {
	background-image: radial-gradient(white, white, transparent);
	padding: 30px;
	width: 50%;
	text-align: center;
	border-radius: 50px;
}

#skills, #contacts, #project01, #project02, #project03, #project04 {
	display: none;
}