* {
	padding: 0;
	margin: 0;
	box-sizing: border-box;
}

html,
body {
	width: 100%;
	height: 100%;
}

body {
	font-size: 16px;
	font-family: 'Lato', 'Segoe UI', 'Meiryo', sans-serif;
	color: #2d2d2d;
}

a {
	color: #156ace;
}

li,
p {
	line-height: 1.45em;
}

p {
	margin-bottom: 0.5em;
}

li {
	margin-bottom: 0.7em;
}

ul,
ol {
	padding-left: 1em;
}

ul {
	list-style-type: none;
}

ul>li {
	padding-left: 1em;
}

ul>li:before {
	width: 1em;
	margin-left: -1em;
	padding-right: 0.04em;
	content: "\2013";
	display: inline-block;
	font-weight: bold;
}

table {
	border-collapse: collapse;
	border-top: 3px solid #222222;
	border-bottom: 1px solid #2d2d2d;
}

th {
	border-bottom: 1px solid #2d2d2d;
}

th,
td {
	padding: 7px 17px;
}

h1 {
	font-size: 36px;
}

h2 {
	font-size: 28px;
}

.navbar-container,
.container {
	width: 100%;
}

.flex {
	display: flex;
}

.flex.flex-centering {
	justify-content: center;
	align-items: center;
}

.flex.flex-space-between {
	justify-content: space-between;
}

.flex.flex-column {
	flex-direction: column;
}

.flex.flex-v-centering {
	align-items: center;
}

.flex.flex-wrap {
	flex-wrap: wrap;
}

.flex.flex-start {
	align-content: flex-start;
}

.row>.col-1 {
	width: 8%;
	width: calc(100% / 12 * 1);
}

.row>.col-2 {
	width: 16%;
	width: calc(100% / 12 * 2);
}

.row>.col-3 {
	width: 25%;
	width: calc(100% / 12 * 3);
}

.row>.col-4 {
	width: 33%;
	width: calc(100% / 12 * 4);
}

.row>.col-5 {
	width: 41%;
	width: calc(100% / 12 * 5);
}

.row>.col-6 {
	width: 50%;
	width: calc(100% / 12 * 6);
}

.row>.col-7 {
	width: 58%;
	width: calc(100% / 12 * 7);
}

.row>.col-8 {
	width: 66%;
	width: calc(100% / 12 * 8);
}

.row>.col-9 {
	width: 75%;
	width: calc(100% / 12 * 9);
}

.row>.col-10 {
	width: 83%;
	width: calc(100% / 12 * 10);
}

.row>.col-11 {
	width: 91%;
	width: calc(100% / 12 * 11);
}

.row>.col-12 {
	width: 100%;
	width: calc(100% / 12 * 12);
}

.panel {
	padding: 3px;
	margin-bottom: 3px;
}

.panel .panel-title {
	font-weight: bold;
	margin-bottom: 5px;
}

.panel .panel-footer {
	margin-top: 5px;
}

.language-badge:before {
	content: '';
	position: relative;
	top: 2px;
	margin-right: 5px;
	width: 12px;
	height: 12px;
	border-radius: 50%;
	border: 1px solid rgba(70, 70, 70, 0.1);
	display: inline-block;
}

.language-badge {
	font-size: 13px;
	line-height: 16px;
	margin-right: 5px;
	display: inline-block;
}

.language-badge.language-badge-c:before {
	background-color: #555555;
}

.language-badge.language-badge-html:before {
	background-color: #e34c26;
}

.language-badge.language-badge-javascript:before {
	background-color: #f1e05a;
}

.language-badge.language-badge-ruby:before {
	background-color: #701516;
}

.language-badge.language-badge-golang:before {
	background-color: #00ADD8;
}

.language-badge.language-badge-php:before {
	background-color: #4F5D95;
}

.language-badge.language-badge-python:before {
	background-color: #3572A5;
}

.language-badge.language-badge-perl:before {
	background-color: #0298c3;
}

.language-badge.language-badge-java:before {
	background-color: #b07219;
}

.logo {
	background-color: #f5f5f5;
	border-radius: 5px;
	padding: 22px;
}

.logo>img {
	width: 225px;
}

.card-body {
	margin-top: 25px;
}

.card-body>h1 {
	margin-bottom: 0.7em;
	text-align: center;
}

.navbar {
	background: #FFFFFF;
	box-shadow: 0px 4px 7px rgba(0, 0, 0, 0.1);
	display: flex;
	justify-content: center;
	flex-direction: column;
	align-items: center;
	margin-bottom: 107px;
}

.navbar .navbar-background {
	width: 100%;
	height: 5px;
	background-color: rgb(0, 0, 0);
	background-image: url("/navbar.png");
	background-size: cover;
	background-position: 38% center;
	background-repeat: no-repeat;
}

.navbar .navbar-container {
	padding-top: 14px;
	padding-right: 0;
	padding-bottom: 9px;
	padding-left: 10px;
}

.navbar .logo {
	width: 36px;
	height: 36px;
	padding: 3px;
	box-sizing: border-box;
	border-radius: 2px;
}

.navbar .logo .logo-img {
	width: 30px;
	height: 30px;
	background-image: url("/logo.png");
	background-size: 30px;
}

.nav-button {
	font-size: 13px;
	color: #2d2d2d;
	border: 1px solid #156ace;
	width: 70px;
	height: 70px;
	line-height: 70px;
	text-align: center;
	text-decoration: none;
	cursor: pointer;
}

.section {
	padding: 0 10px;
	margin-bottom: 2em;
}

.section h1 {
	font-size: 36px;
	font-weight: 600;
	margin-block-end: 0.4em;
}

.section h2 {
	font-size: 28px;
	font-weight: 600;
	margin-block-start: 1.4em;
	margin-block-end: 0.6em;
}

.section h3 {
	font-size: 22px;
	margin-block-start: 25px;
	margin-block-end: 0.45em;
}

.section h4 {
	font-size: 18px;
	margin-block-start: 38px;
	margin-block-end: 0.4em;
}

.section h5 {
	font-size: 16px;
	margin-block-start: 38px;
	margin-block-end: 0.4em;
}

.section h6 {
	font-size: 16px;
	margin-block-start: 38px;
	margin-block-end: 0.4em;
}

.section-body {
	margin-top: 38px;
}

.profile.profile-icon {
	width: 100%;
}

.profile.profile-location i {
	display: inline-block;
	padding: 0 0.3em 0 0;
	font-size: 120%;
	position: relative;
	top: 1.5px;
}

.profile-icon {
	display: inline-block;
}

.button:hover {
	color: #156ace;
	border-color: #156ace;
	box-shadow: 0 2px #156ace;
}

.button:active {
	position: relative;
	top: 2px;
	left: 0;
	box-shadow: none;
	transition: none;
}

a i, button i {
	margin: 0 0.35em 0 0;
	position: relative;
	top: 1.5px;
	font-size: 120%;
}

.button {
	font-size: 16px;
	font-family: 'Lato', 'Segoe UI', 'Meiryo', sans-serif;
	color: #2d2d2d;
	line-height: 1.45em;

	display: inline-block;
	margin: 0.3em 0.1em;
	padding: 0.7em 1em;
	border: solid 2px rgb(70, 70, 70);
	border-radius: 8px 8px;
	text-decoration: none;
	color: rgb(50, 50, 50);
	box-shadow: 0 2px 0 rgb(70, 70, 70);
	background-color: white;
	-webkit-transition: all 0.3s linear;
	transition: all 0.3s linear;
}

.button.button-link:after {
	content: '\f061';
	font-size: 120%;
	position: relative;
	left: 0;
	top: 1.5px;
	font-weight: 600;
	padding: 0 7px 0 11px;
	font-family: "Font Awesome 6 Free";
	display: inline-block;
	-webkit-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}

.button.button-link:hover:after {
	left: 3px;
	color: #156ace;
}

.button.button-link {
	margin: 0.55em auto;
}

@media screen and (min-width: 576px) {
	.row>.col-sm-1 {
		width: 8%;
		width: calc(100% / 12 * 1);
	}

	.row>.col-sm-2 {
		width: 16%;
		width: calc(100% / 12 * 2);
	}

	.row>.col-sm-3 {
		width: 25%;
		width: calc(100% / 12 * 3);
	}

	.row>.col-sm-4 {
		width: 33%;
		width: calc(100% / 12 * 4);
	}

	.row>.col-sm-5 {
		width: 41%;
		width: calc(100% / 12 * 5);
	}

	.row>.col-sm-6 {
		width: 50%;
		width: calc(100% / 12 * 6);
	}

	.row>.col-sm-7 {
		width: 58%;
		width: calc(100% / 12 * 7);
	}

	.row>.col-sm-8 {
		width: 66%;
		width: calc(100% / 12 * 8);
	}

	.row>.col-sm-9 {
		width: 75%;
		width: calc(100% / 12 * 9);
	}

	.row>.col-sm-10 {
		width: 83%;
		width: calc(100% / 12 * 10);
	}

	.row>.col-sm-11 {
		width: 91%;
		width: calc(100% / 12 * 11);
	}

	.row>.col-sm-12 {
		width: 100%;
		width: calc(100% / 12 * 12);
	}
}

@media screen and (min-width: 992px) {
	.row>.col-lg-1 {
		width: 8%;
		width: calc(100% / 12 * 1);
	}

	.row>.col-lg-2 {
		width: 16%;
		width: calc(100% / 12 * 2);
	}

	.row>.col-lg-3 {
		width: 25%;
		width: calc(100% / 12 * 3);
	}

	.row>.col-lg-4 {
		width: 33%;
		width: calc(100% / 12 * 4);
	}

	.row>.col-lg-5 {
		width: 41%;
		width: calc(100% / 12 * 5);
	}

	.row>.col-lg-6 {
		width: 50%;
		width: calc(100% / 12 * 6);
	}

	.row>.col-lg-7 {
		width: 58%;
		width: calc(100% / 12 * 7);
	}

	.row>.col-lg-8 {
		width: 66%;
		width: calc(100% / 12 * 8);
	}

	.row>.col-lg-9 {
		width: 75%;
		width: calc(100% / 12 * 9);
	}

	.row>.col-lg-10 {
		width: 83%;
		width: calc(100% / 12 * 10);
	}

	.row>.col-lg-11 {
		width: 91%;
		width: calc(100% / 12 * 11);
	}

	.row>.col-lg-12 {
		width: 100%;
		width: calc(100% / 12 * 12);
	}
}

@media screen and (min-width: 1200px) {
	.container {
		width: 1200px;
	}

	.navbar .navbar-container {
		width: 1200px;
		padding-left: 45px;
	}

	.section {
		padding: 0 78px;
	}

	.row>.col-xl-1 {
		width: 8%;
		width: calc(100% / 12 * 1);
	}

	.row>.col-xl-2 {
		width: 16%;
		width: calc(100% / 12 * 2);
	}

	.row>.col-xl-3 {
		width: 25%;
		width: calc(100% / 12 * 3);
	}

	.row>.col-xl-4 {
		width: 33%;
		width: calc(100% / 12 * 4);
	}

	.row>.col-xl-5 {
		width: 41%;
		width: calc(100% / 12 * 5);
	}

	.row>.col-xl-6 {
		width: 50%;
		width: calc(100% / 12 * 6);
	}

	.row>.col-xl-7 {
		width: 58%;
		width: calc(100% / 12 * 7);
	}

	.row>.col-xl-8 {
		width: 66%;
		width: calc(100% / 12 * 8);
	}

	.row>.col-xl-9 {
		width: 75%;
		width: calc(100% / 12 * 9);
	}

	.row>.col-xl-10 {
		width: 83%;
		width: calc(100% / 12 * 10);
	}

	.row>.col-xl-11 {
		width: 91%;
		width: calc(100% / 12 * 11);
	}

	.row>.col-xl-12 {
		width: 100%;
		width: calc(100% / 12 * 12);
	}
}