@font-face {
    font-family: 'Garamond-Regular';
    src: url('fonts/Garamond-Regular.woff') format('woff'),
    url('fonts/Garamond-Regular.ttf')  format('truetype');
}

body{
	font-family: Garamond-Regular, serif;
	color:#000050;
	width:100%;
	background:#EEEEFF
}
body .container {
	background: #f7f6f6;
	max-width: 1200px;
	margin-left:auto;
	margin-right:auto;
}
.menu a{
	color:#454555;
	text-decoration:none
}
a:hover{
	color: #aaaabc;
	text-decoration:none
}
h2{
	background-color:#000050;
	color:#FFFFFF;
	padding:2px;
	padding-left:10px
}
hr{
	border:none;
	border-bottom:1px solid #000050
}
ul li{
	list-style-image:url('../images/tux_li.png')
}
textarea{
	width:600px;
	height:200px
}

.header {
	border-bottom: 1px solid #aaaabc;
	padding-bottom: 10px;
	margin-bottom: 10px;
}

.footer {
	text-align: right;
	border-top: 1px solid #aaaabc;
	margin-top: 10px;
	padding-top: 10px;
	margin-bottom: 10px;
}
.footer .mastodon {
	text-align: left;
}
.footer .mastodon img {
	height: 32px;
}

.menu div {
	float: left;
}
.menu .links {
	float: right;
}
.menu.active {
	text-decoration: underline;
}
.menu a {
	font-size: 2em;
	line-height: 70px;
	text-underline-offset: 0.5rem;
}

.logo img {
	height: 100px;
}
.logo-txt a {
	font-size: 4em;
	margin-left: 20px;
	line-height: inherit;
}
ul.secondLvl li{
	list-style-type:none;
	list-style-image:none
}
div#page{
	background:#FFFFFF
}
div#logoImg{
	float:left;
	margin-right:20px
}
div#logo{
	float:left;
	color:#000050;
	margin-right:20px
}
.clear{
	clear:both
}
ul#menu li{
	list-style-type:none;
	list-style-image:none;
	padding:5px;
	float:left;
	padding-top:21px
}

#footer{
	text-align:right
}

.technologies .logo {
	width: 128px;
	height: 128px;
	margin: 30px 0;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}
.technologies .logo.css img, .technologies .logo.js img {
	height: 128px;
	width: auto;
}
.technologies .logo a {
	vertical-align: middle;
    display: table-cell;
}
.technologies .logo img {
	width: auto;
	max-height: 120px;
	max-width: 120px;
	height: auto;
}
.icon-css {
	width: 120px!important;
}

ul.cv a{
	font-weight:bold;
	color:#808099
}

.experience{
	font-style:italic;
	font-size:.9em
}

div.screenshot {
	width: 100%;
}
div.screenshot img{
	border:none;
	width: 100%;
}

div.thumbnail {
	margin: 2px;
}
div.thumbnail img {
	width: 100%;
	max-width: 200px;
}

.project div{
	padding-left:20px
}
.project div.intro{
	font-style:italic;
	padding-bottom:5px
}
.project div.link{
	padding-bottom:5px;
	padding-top:5px
}
.project button{
	margin-left:20px
}

.download {
	margin-bottom: 20px;
}
.download a img {
	height: 70px;
}

button {
	margin-top: 10px;
}

div.error{
	color:#880000
}
div.confirmation{
	color:#008800
}
div#page{
	padding:10px
}

.h-captcha {
	margin-top: 15px;
}

.navbar-light .navbar-toggler {
	border: none;
}

.mobile-only {
	display: none;
}

.apod h3 img {
	width: 30px;
}

@media (max-width: 480px) {
	.logo img {
		height: 50px;
	}
	.logo-txt a {
		font-size: 2rem;
	}
	#menu li {
		text-align: right;
	}
	.intro {
		margin-bottom: 1rem;
		padding-bottom: 1rem;
		border-bottom: 1px solid rgba(0, 0, 80, 0.1);
	}
	.content {
		font-size: 1.5rem;
	}

	.carousel, .carousel-inner, .carousel-item {
		padding-left: 0!important;
	}
	.carousel-control-prev-icon {
		background-image: url('../images/left-arrow.svg');
	}
	.carousel-control-next-icon {
		background-image: url('../images/right-arrow.svg');
	}

	.no-mobile {
		display: none;
	}
	.mobile-only {
		display: block;
	}

	.apod .description {
		margin-bottom: 20px;
	}
}

@media (max-width: 320px) {
	.logo img {
		height: 40px;
	}
	.logo-txt a {
		font-size: 1.5rem;
	}
}