@charset utf-8;

:root{

	--background-color:fff;
	--select-color:hsl(0 0% 78% / 1);
	--text-color:#000;
	--link-color:blue;
	--link-color-visited: purple;
}

@media (prefers-color-scheme: dark) {

	:root{
		--background-color:#0f1413;
		--select-color:hsl(168 14% 17% / 1);
		--text-color:#fff;
		--link-color: hsl(175deg 76% 62%);
	    --link-color-visited: #e8ad54;
	}
}

body,html {
margin:0;
padding:0;
}

body,td,select,th {
font-family:Roboto, sans-serif;
font-size:20px;
line-height:normal;
color:var(--text-color);
font-weight:300;
margin:10px;
}

body {
background-color:var(--background-color);
background-attachment:fixed;
margin:0;
padding:0;
}

.all {
position:relative;
padding-top:171px;
margin:0 auto;
}

wrapper {
display:block;
padding:0 40px 20px;
}

wrapper:nth-child(odd) {
background-color: var(--background-color);
}

wrapper>div {
width:900px;
margin:auto;
}

.strength li {
margin:1em;
padding:.5em 0;
}

.ad {
font-size:180%;
text-transform:uppercase;
color:var(--text-color);
line-height:120%;
padding:0 25px;
}

a {
text-decoration:none;
color:var(--link-color);
border-bottom:1px solid var(--link-color);
}

a:visited {
text-decoration:none;
color:var(--link-color-visited);
border-bottom:1px solid var(--link-color-visited);
}


a:hover {
color:red;
border-bottom:1px solid red;
}

H3 a {
text-decoration:none;
}

dt {
font-weight:400;
}

strong {
font-weight:700;
}

h1,h2,h3,h4 {
text-transform:uppercase;
}

h1 {
font-size:99px;
font-weight:300;
transition:height .2s linear;
height:99px;
overflow:hidden;
letter-spacing:1px;
white-space:nowrap;
margin:0;
padding:0;
}

.Condensed .menu li a {
font-size:22pt;
}

.Condensed .menu li:nth-child(1) a {
padding-left:9px;
}

h2 {
font-size:360%;
text-decoration:none!important;
text-transform:uppercase;
font-weight:300;
top:0;
margin:0;
padding:0 0 100px;
}

h3 {
font-size:150%;
font-weight:300;
-webkit-column-span:all;
-moz-column-span:all;
column-span:all;
}

h4 {
font-size:130%;
font-weight:400;
}

.sname {
font-size:87.5%;
margin-bottom:15px;
}

address {
font-style:normal;
}

.gray {
background-color:#FAFAFA;
padding:2px 4px;
}

.compact {
list-style:inside square;
margin:10px 0 10px 17px;
}

#portfolioHolder {
position:relative;
}

.post .compact {
margin-right:0;
list-style:inside square;
padding:0;
}

.strong {
list-style-type:circle;
margin:5px 0 10px 17px;
}

ul.devided li {
padding:0 0 10px;
}

div.describe {
padding:0 0 5px 20px;
}

.left {
border-right:1px dotted #CCC;
}

.date {
font-size:68.75%;
display:block;
text-align:left;
}

.ul_links li {
list-style-type:none;
margin:5px 0;
}

.gallery_vert {
float:left;
margin-right:30px;
}

.gallery_vert img {
margin-bottom:10px;
}

em {
font-size:87.5%;
display:block;
}

li {
padding:4px 0;
}

.skills {
display:inline-block;
width:49%;
vertical-align:top;
}

.feed {
float:right;
width:250px;
margin-top:-30px;
}

.portfolio {
clear:both;
padding-top:20px!important;
}

.portfolio p {
font-size:12px;
font-weight:700;
margin:-17px 0 0;
padding:3px;
}

.skills-set {
margin-top:40px;
}

.resume_container {
margin:10px 0 40px;
padding:10px;
}

.year {
text-align:left;
font-size:250%;
margin:50px 0 20px;
}

.year:first-child {
margin-top:-10px;
}

.post {
position:absolute;
font-size:70%;
padding:10px;
}

.post img:nth-child(1) {
border:1px solid #ccc;
box-sizing:border-box;
width:100%;
height:auto;
display:block;
}

.post-content p {
-webkit-column-break-inside:avoid;
-moz-column-break-inside:avoid;
column-break-inside:avoid;
margin:14px 0 1em;
padding:0;
}

.footer {
clear:both;
display:block;
font-size:.8em;
text-align:center;
margin:30px auto;
padding:10px;
}

.footer li {
float:left;
list-style-type:none;
display:block;
height:120px;
padding-left:70px;
margin-right:40px;
}

.footer a {
background-repeat:no-repeat;
font-weight:700;
display:block;
padding-bottom:10px;
}

.footer td {
white-space:nowrap;
}

.cleaner {
clear:both;
}

.header {
width:900px;
position:relative;
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
box-sizing:border-box;
margin:0 auto;
}

#logo {
width:150px;
float:left;
position:absolute;
right:0;
top:13px;
border:0;
transition:250ms ease-in-out;
}

#logo:before {
content:'';
width:150px;
height:150px;
background-color:#aaa;
position:absolute;
border-radius:50%;
}

#logo img {
width:148px;
border-radius:50%;
position:absolute;
top:1px;
left:1px;
background-color:#fff;
border-width:0;
}

.intro {
clear:both;
padding-top:16pt;
}

.menu {
line-height:100%;
white-space:nowrap;
margin:auto;
padding:0;
}

.menu li {
list-style:none;
text-transform:uppercase;
display:inline-block;
padding:0;
}

.menu li:nth-child(1) a {
padding-left:0;
}

.menu li a {
font-size:21pt;
text-decoration:none;
color: var(--text-color);
font-weight:400;
border:0;
display:inline-block;
padding:26px 9px;
}

.menu li.selected {
background-color: var(--select-color);
}

headerWrapper {
position:fixed;
top:0;
left:0;
width:100%;
background-color: var(--background-color);
color: var(--text-color);
z-index:100;
border-bottom:1px solid #aaa;
margin:0;
padding:0;
}

.section {
clear:both;
padding:120px 0;
}

.section:after {
content:'';
clear:both;
}

#map_canvas {
width:900px;
height:400px;
}

content,article {
transition:all 500ms linear;
}

video {
width:100%;
height:auto;
}

#headvideo {
display:flex;
margin:30px auto 20px;
}

#headvideo video {
width:731px;
height:540px;
}

#playlist {
overflow-x:auto;
height:540px;
white-space:nowrap;
margin:0;
padding:0;
}

#playlist li {
list-style-type:none;
cursor:pointer;
margin:0 10px 10px;
padding:0;
}

#playlist li:nth-last-child(1) {
margin-right:0;
}

#playlist img {
width:133px;
}

#playlist li.selected {
background-color:#444;
}

#playlist li.selected img {
opacity:0.5;
}

h1.hide,.Condensed h1 {
height:0;
margin:0;
}

.resume_visible,.post img {
display:none;
}

@media print{
body {
margin-top:0;
margin-right:2px;
background-image:none;
}

.all {
background-color:#fff;
width:960px;
margin:0 auto;
padding:0 10px;
}

.resume_visible {
display:block;
}

.maincontent {
margin-top:20px;
width:100%;
height:100%;
}

.page_break {
page-break-after:always;
}

headerWrapper {
position:static;
background-color:#FFF;
color:#000;
}

.header img {
border-radius:0;
}

.post {
page-break-inside:avoid;
}

.resume,.achievements {
background-color:#FFF;
padding:10px;
}

.footer,.menu {
display:none;
}
}