@import url('https://fonts.googleapis.com/css?family=Scope+One&display=swap');
/*@import url('https://fonts.googleapis.com/css?family=Roboto+Slab&display=swap');*/
/*@import url('https://fonts.googleapis.com/css?family=Bellefair&display=swap');*/

body {
	font-family: Lato, Roboto, sans-serif;
	font-weight: 300;
}

h1, h2, h3, h4 {
	font-weight: 500;
	font-variant: small-caps;
	font-family: 'Scope One', serif;
	/*font-family: 'Bellefair', serif;*/
	margin-top: 0;
	margin-bottom: 3mm;
}

.page-body h1,
.page-body h2,
.page-body h3,
.page-body h4 {
	color: #f60;
}

p {
	margin-top: 0;
	margin-bottom: 1mm;
}

a {
	color: inherit;
	text-decoration: inherit;
}

.page-header {
	padding: 7mm;
	background: #ffddc3;
}

.page-header::after {
	display: block;
	content: ' ';
	clear: both;
}

	#photo,
	#personal-info {
		float: left;
		box-sizing: border-box;
	}

	#photo {
		width: 20%;
	}

		#photo img {
			width: 100%;
			border: 1px solid black;
			box-sizing: border-box;
			/*border-radius: 50%;*/
		}

	#personal-info {
		width: 77%;
		padding-left: 7mm;
	}

		#name {
			font-size: 2.5rem;
			/*font-weight: 600;*/
			margin-bottom: 0;
		}

		#occupation {
			margin-top: -2mm;
		}

		#contact-me {
			margin-top: 5mm;
		}

			#contact-me tr {
				height: 5mm;
			}

			#contact-me td:first-child {
				width: 4mm;
				text-align: center;
			}

.page-body {
	padding: 7mm;
	position: relative;
}

	aside {
		padding: 7mm;
		position: absolute;
		top: 0;
		right: 0;
		width: 80mm;
		height: 230mm;
		box-sizing: border-box;
		/*border-left: 1px solid gray;*/
	}

	aside:before {
		display: block;
		content: ' ';
		position: absolute;
		top: 13mm;
		left: 0;
		border-left: 1px solid #ccc;
	}
	.en-lang aside:before {
		height: calc(100% - 23mm);
	}
	.es-lang aside:before {
		height: calc(100% - 26mm);
	}

		aside > section > ul {
			margin-bottom: 4mm;
			padding-left: 2.5mm;
		}

		aside ul {
			list-style: none;
			padding-left: 0;
			font-size: 0.75rem;
		}

		aside ul li {
			/*text-align: justify;*/
			margin-bottom: 2.5mm;
		}

		aside li > ul {
			margin-top: 2.5mm;
			padding-left: 5mm;
		}

		ul.dev-skill-list::after {
			display: block;
			content: ' ';
			clear: both;
		}

			ul.dev-skill-list > li {
				display: block;
				float: left;
				width: 50%;
			}

				.dev-logo {
					height: 6mm;
					width: 6mm;
					object-fit: contain;
					vertical-align: middle;
					margin-right: 1mm;
				}

		.lang-list {
			padding-left: 7.5mm;
		}

        .lang-list::after {
            display: block;
            content: ' ';
            clear: both;
        }

			.lang-list > li {
                display: block;
                float: left;
                width: 50%;
				margin-bottom: 2.5mm;
			}

				.lang-flag {
					--flag-width: 1.8em;
					width: var(--flag-width);
					height: calc(var(--flag-width) * 2 / 3);
					vertical-align: bottom;
					margin-right: 1mm;
				}

	#not-aside {
		width: calc(100% - 80mm);
		box-sizing: border-box;
	}

	#career table td,
	#academic-background table td {
		padding-bottom: 2mm;
	}

		#career table td:first-child,
		#academic-background table td:first-child {
			width: 25mm;
			text-align: right;
			vertical-align: top;
			color: #666;
		}

		#career table td:last-child,
		#academic-background table td:last-child {
			padding-left: 2mm;
			vertical-align: top;
		}

			.job-position,
			.academic-degree-name {
				font-weight: 500;
			}

			.job-company,
			.academic-degree-institution {
				font-size: 0.75rem;
				font-style: italic;
			}

			.job-description,
			.academic-degree-description {
				font-size: 0.7rem;
				line-height: 0.9rem;
				text-align: justify;
				/*text-wrap: balance;*/
			}