@import url('https://fonts.googleapis.com/css?family=Roboto:300');

* {
	margin: 0px;
	overflow: hidden;
	font-family: 'Roboto', sans-serif;
	-webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
	cursor: default;
}

#vignette {
	position: absolute;
	z-index: 2;
	width: 100%;
	height: 100%;
	background: -moz-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,0.5) 100%);
	background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,0.5) 100%);
	background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(0,0,0,0.5) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#80000000',GradientType=0 );
}

body {
	overflow: hidden;
	width: 100%;
	height: 100%;
	background: url(pattern.png);
}

#wrapper {
	background: white;
	position: absolute;
	width: 450px;
	height: 470px;
	left: 50%;
	top: 50%;
	margin-left: -225px;
	margin-top: -235px;
	z-index: 2;
}

hr {
	margin-top: 17px;
	margin-bottom: 5px;
}

#photo_wrapper {
	width: 108px;
	height: 128px;
	border-radius: 8px;
	margin-left: auto;
	margin-right: auto;
	margin-top: 15px;
	margin-bottom: 20px;
	padding: 3px;
	box-shadow: 0px 0px black;
	border: solid 1px black;
}

#photo {
	width: 100%;
	height: 100%;
	border-radius: 6px;
}

#heading_wrapper {
	margin: 4px;
	text-align: center;
	margin-top: 16px;
}

#text_wrapper {
	margin: 0px auto;
	font-size: 12pt;
	width: 50%;
}

#left_wrapper {
	float: left;
}

#right_wrapper {
	float: right;
}

.scicn {
	width: 32px;
	height: 32px;
	cursor: pointer;
	filter: brightness(100%);
    -moz-transition: filter 0.2s linear;
    -o-transition: filter 0.2s linear;
    -webkit-transition: filter 0.2s linear;
    transition: filter 0.2s linear;
}

.scicn:hover {
	filter: brightness(130%);
}

#desc_wrapper {
	height: 50px;
	background: #eeeeee;
	position: relative;
	width: 100%;
	font-size: 12pt;
	text-align: center;
	top: 15px;
}

#desc {
	position: relative;
	top: 4px;
}

#social_wrapper {
	position: relative;
	margin: 0px auto;
	height: 32px;
	top: 29px;
	width: 68px;
}

#mailto_link {
	cursor: pointer;
}

#email_b {
	cursor: pointer;
    -moz-transition: color 0.2s linear;
    -o-transition: color 0.2s linear;
    -webkit-transition: color 0.2s linear;
    transition: color 0.2s linear;
	text-decoration: underline;
	color: #2196f3;
}

#email_b:hover {
	color: #0d47a1;
}