body{
	font-size: 18px;
	height: 200vh;
	margin-top: 4em;
	font-family: sans-serif;

}
.resume_frame{
	display:inline-block;
	width: 207px;
	font-size: .8em;
	text-align: center;
	position: relative;

}
.resume_frame > span{
	background-color: yellow;
	z-index: 1;
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	top: 0;
	content: "";
	opacity: 0;
	cursor: pointer;
}
.resume_frame span:hover{
	opacity: .2;
}

a{
	color: blue;
	text-decoration: none;
}
a:visited{
	color: blue;
}

img.resume{
	text-align: center;
}
body.downScrolled{

}
.urgent{
	color: red;
	font-weight: bold;
}
.content{
	padding-top: 2em;
	margin: 0 auto;
	width: 800px;
	max-width: 95vw;
}
.section{
	margin-bottom: 3em;
	display:inline-block;
}
.section .heading{
	font-size: 1.4em;
	color: #808080;
	font-weight: bold;
	padding-bottom: .5em;
}
.subsection {
	margin-left: .3em;
	margin-top: 1em;
}
.subsection .label{
	font-weight: bold;
}
.subsection .label:after{
	content: ":";
}

.subsection .title{
	position: relative;
	font-weight: bold;
	font-size: 1.5em;
	margin-top: 1em;
	margin-left: .25em;
	margin-bottom:0em;
	font-style: italic;
	color: #808080;

}

.title > a{
	color: #808080;
}

.subsection .data-point{
	margin-left: 1em;
	font-size: 1.1em;
	margin-top: .5em;
}

.fineprint{
	font-size: .8em;
	max-height: 2em;
	max-width: 20em;
	opacity: 1;
	transition: max-height .5s max-width .4s, opacity .2s;
}
.icon-download:before{
	top: -.4em;
	padding: .2em;
	position: relative;
	display:inline-block;
	color: white;
	background-color: #000a99;
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0px;
	line-height: 1.5em;
	text-align: center;
	vertical-align: bottom;
	font-weight: bold;
	width:  2em;
	transition: font-size 0 .5s, line-height 0 .5s;
}
.downloader{
	cursor: pointer;
}
.downloader > div{
	margin-left: 40px;
	color: white;
	overflow:hidden;
	background-color: #0975ff;
	position: relative;
	border: .15em solid black;
	border-radius: .5em;
	display:inline-block;
	position: relative;
	padding: .1em .5em .25em 3em;
	right: 0;
}
.cloak{
	display:inline-block;
	max-height: 10em;
	max-width: 10em;
}
.fineprint, .cloak{
	overflow:hidden;
	white-space: nowrap;
	transition: opacity .2s, max-height .2s, max-width .2s;

}

.downloader > div{
	position: relative;
	display:inline-block;
}
.downloader{
	text-align: center;
	position: absolute;
	font-size: 1.4rem;
	display:inline-block;
	right: .3em;
	top: .3em;
}
.masthead{
	position: fixed;
	top: 0px;		
	left: 0px;
	width: 100%;
	z-index: 1000;
}
.masthead:before{
	display:block;
	position: absolute;
	content: ' ';
	z-index: -1;
	background-color: #6ab2d4;
	height: 100%;
	opacity: .9;
	width: 100%;
	border-bottom: 1px solid black;
}
.pageHeading{
	width: 100%;
	font-size: 1em;
	position: relative;
	margin-left: auto; margin-right: auto;
	line-height: 3.4em;
	max-width: 800px;
}
.pageHeading .title{
	font-weight: bold;
	font-size: 2.5em;
	padding-left: 1em;
	line-height: 1.5em;
	vertical-align: middle;
	transition: font-size .2s, line-height .2s;
}
body.downScrolled .pageHeading .title{
	font-size: 1.5em;
}
body.downScrolled .pageHeading{
	line-height: 2em;
}

body.downScrolled .downloader .fineprint{
	max-height: 0em;
	max-width: 0em;
	opacity: .0;
}
body.downScrolled .downloader{
	font-size: 1rem;
}
body.downScrolled .cloak{
	opacity: .0;
	max-width: 0em;
	max-height: 0em;
}

body.downScrolled .downloader .icon-download:before{
	line-height: 1em;
}


.familiar .data-point .title,
.familiar .data-point .years{
	display:inline-block;
	margin-left: 20px;
	max-width: 30vw;
}
.familiar .data-point .title{
	margin-left: .5em;
	font-size: 1em;
}
.familiar .data-point .notes{
	margin-left: .9em;
	font-size: .8em;
}



@media (max-width: 840px){
	.downloader{
		font-size: .65em;
	}
	.masthead{
	}
	.masthead .pageHeading .title{
		font-size: 1.4em;
		font-weight: bold;
	}
	.downloader .cloak,
	.downloader .fineprint{
		max-height:10em;
		max-width:30em;
		transition: max-height .1s, max-width .1s, font-size 0;
	}
	body.downScrolled .masthead .pageHeading .title{
		font-size: 1em;
	}
	body.downScrolled .downloader,
	body.downScrolled .downloader .cloak,
	body.downScrolled .downloader .fineprint{
		font-size: .8em;
	}
	body.downScrolled .downloader .cloak,
	body.downScrolled .downloader .fineprint{
		max-height: 0em;
		max-width: 0em;
	}
}

.resource{
	margin-left: .5em;
}

.contact_link{
	font-weight: bold;
}

form.human_check{
	position: fixed;
	z-index: 10000;
	left: 0;
	width: 100vw;
	top: 0;
	height: 100vh;
	display:none;
}

form.human_check.active{
	display:block;
}

form.human_check:after{
	content: '';
	z-index: -1;
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: #cfcfcf;
	opacity: .5;
}

form.human_check .title{
	background-color: darkblue;
	color: white;
	font-size: 1.2em;
	padding:.2em;
	border-top-left-radius: .4em;
	border-top-right-radius: .4em;
}

form.human_check .dialog{
	top: 5em;
	position: relative;
	display: block;
	margin: 0 auto;
	width: 450px;
	max-width: 80vw;
	text-align: center;
}

.centered_bits{
	text-align: center; 
}

form.human_check .body{
		padding: 1em;
		text-align: left;

}

form.human_check .dialog:after{
	content: '';
	border: 2px solid darkblue;
	z-index: -1;
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: #cfcfcf;
	opacity: .9;
	border-radius: .5em ;
}
.g-recaptcha{
	margin: 1rem;
}
form.human_check input[type=button]{
	margin: 1rem;
	font-size: 1.4em;
}


.closebtn{
	border-top-right-radius: .5em;
	font-size: .8em;
	padding:.25rem 1rem ;
	height: 1.55rem;
	position: absolute;
	right: 0;
	background-color: black;
	line-height: 1.55rem;
	vertical-align: middle;
	color: white;
	font-family: arial;
	top: 0;
	z-index: 1000
}

.title[class^="icon-"], .title[class*=" icon-"] {
	margin-left: -2.5em;
	position: relative;
	padding-left: 2.5em;
}

.icon-chat:before {
	left: 0;
	padding-right: .5em;
	font-size: 2em;
	position: absolute;
}

.downloader_link{
	cursor: pointer;
}

.tags{
	vertical-align: top;
	display:inline-block;
	font-size: .8em;
	max-width: 500px;
	padding: 1em;
}
.tech.tag{
	background-color: blue;
	color: white;
}
.lang.tag{
	background-color: #b3c5e2;
	color: black;
}
.roles.tag{
	background-color: darkblue;
	color: white;
}
.library.tag{
	background-color: red;
	color: white;
}

.frameworks.tag{
	background-color: #a9e8e4;
	color: black;
}
.architecture.tag,
.patterns.tag{
	background-color: #ffe27a;
	color: black;

}
.patterns.tag{

}
.shell.tag{
	background-color: #e8d3a0;
	color: black;

}
.practices.tag{
	background-color: #e6c4ff;
	color: black;

}
.database.tag{
	background-color: #8cef8b;
	color: black;

}

.tools.tag{
	background-color: grey;
	color: white;
}


.tags div.tag{
	padding: 1em;
	font-size: .8em;
	border: 1px solid #808080;
	display:inline-block;
	padding: .1em  .3em;
	border-radius: .25em;
	max-width: 500px;
	margin: .1em;
}

div.tags{
	display:inline-block;
}

span.tag,
div.tags div.tag{
    background-color: white;
    border: 0;
    padding: 0;
    color: black;
    font-size: 1em;
}

.section_title{
	font-weight: bold;
}
.section_body{
	margin-bottom:1em;

}