html {
	font-size: 62.5%;
	background: #333;
	box-sizing: border-box;
}
*, *:before, *:after {
	box-sizing: inherit;
}

body {
	font: 1.6rem/1.8 "Open Sans", Arial, sans-serif;
	color:#222;
}
h1, h2, h3, h4, p {
	margin:0 0 1rem 0;
}
p { margin:0 0 2.8rem 0; }
p:last-child { margin-bottom:1.4rem; }

a { text-decoration:none; }
a:hover { text-decoration:underline; }

.clearfix:before, .clearfix:after { content: " "; display: table; }
.clearfix:after { clear: both; }

img { max-width:100%; max-height:75vh; }

#container { min-width:320px; max-width:800px; margin:1rem auto; }
#menu { }
#data { background:white; padding:2rem 0rem; box-shadow:0 0 10px rgba(0,0,0,0.5); border-radius:0.5rem; }
#data > .section {  }
h1 { color:white; font-size:4rem; margin:0 0 -1rem 0; padding:0; line-height:4rem; text-align:left; text-indent:1rem; }
h2 { font-size:2.4rem; }
h3 { font-size:2rem; font-weight:normal; }
h4 { font-size:1.6rem; font-weight:normal; }

h1.rgt { float:right; text-indent:0; margin-right:1rem; }
h1 > a { color:white; }
h1 > a:hover,
h1.selected > a { text-shadow:0 0 4px black; text-decoration:none; }

.lang { float:right; text-align:center; padding:0; font-size:1.4rem; line-height:4rem; }
.lang > a { color:gray; }

.section { padding:0rem 2rem 2rem 2rem; border-left:0.6rem solid white; margin-bottom:4rem; position:relative; }
.section:after { content:" "; width:0; height:0; left:-0.6rem; bottom:0; border:0.3rem solid white; position:absolute; border-left-color:transparent !important; border-top-color:transparent !important; }
.section > h3 { line-height:3.5rem; color:white; margin-left:-2rem; padding:0 1rem 0 2rem; display:inline-block; position:relative; }
.section > h3:after { content:" "; width:0; height:0; right:-4rem; top:0; border:2rem solid; position:absolute; border-right-color:transparent !important; border-bottom-color:transparent !important; }
.section > h3 > .fa { margin-right:0.5rem; line-height:1.8; }
.section > p:last-child { margin-bottom:0; }
.section > ul:last-child { margin-bottom:0; }
.section > ul { list-style:none; margin:2rem; padding:0; }
.section > ul > li { margin:0; padding:0; }
.section > ul > li:before { content:"■"; position:relative; top:-2px; height:auto; padding-right:1rem; }

.section-main img { float:left; max-width:160px; border-radius:50%; display:block; margin:1rem 4rem 1rem 0; }
.section-main h4 { border-bottom:1px dotted silver; margin-bottom:1.8rem; padding-bottom:1.8rem; }

.section-certificates { border-color:#FF851B; }
.section-certificates > h3 { background:#FF851B; }
.section-certificates > h3:after { border-color:#FF851B; }
.section-certificates a { color:#FF851B; }
.section-certificates li:before { color:#FF851B; }

.section-work { border-color:#2ECC40; }
.section-work > h3 { background:#2ECC40; }
.section-work > h3:after { border-color:#2ECC40; }
.section-work a { color:#2ECC40; }
.section-work li:before { color:#2ECC40; }

.section-education { border-color:#0074D9; }
.section-education > h3 { background:#0074D9; }
.section-education > h3:after { border-color:#0074D9; }
.section-education a { color:#0074D9; }
.section-education li:before { color:#0074D9; }

.section-languages { border-color:#FF4136; }
.section-languages > h3 { background:#FF4136; }
.section-languages > h3:after { border-color:#FF4136; }
.section-languages li:before { color:#FF4136; }
.section-languages a { color:#FF4136; }

.tag { margin-bottom:2px; display:inline-block; font-size:1.4rem; background:#ddd; padding:0 6px; border-radius:2px; border:1px solid silver; color:#333; text-shadow:1px 1px 0 white; }

.social { text-align:right; margin:2rem 0 0 0; padding:1rem 0 0 0; line-height:4rem; font-size:1.6rem; }
.social > a { display:inline-block; color:gray; margin:0 3rem 0 0; }
.social .fa { font-size:2rem; }
.social .long { float:left; }

.years { background:gray; color:white; display:inline-block; padding:0 1rem; margin-bottom:1.4rem; }
.years .fa { margin-right:0.5rem; line-height:1.8; }

.post { margin:0 2rem; padding:3rem 2rem 1rem 2rem; border-bottom:1px dotted silver; }
.post:last-child { border-bottom:0; }
.post a { color:#3D9970 ; }
.post h3 > a { color:white; background:#3D9970 ; display:inline-block; padding:0 2rem; }
.post .years { padding:0 2rem; }
.post h3 > a:hover { text-decoration:none; }
.post img { display:block; border:0.5rem solid silver; padding:0.5rem; background:#fff; }
.post .more { text-align:right; }
.post h4 { font-weight:bold; font-size:1.8rem; margin:2rem 0 1rem 0; }

@media (max-width: 768px) {
	.section-main img { float:none; display:block; margin:1rem auto; }
	.section-main h2 { text-align:center; }
	.section-main h4 { text-align:center; }
	.social { text-align:center; }
	.social .long { float:none; display:block; }
	.lang { float:none; }
	.lang > a > i { display:none; }
}