body { background: #FFFFFF; margin: 0; padding: 0; position: relative; scroll-behavior: smooth; }
.holder { position: relative; margin: 0; padding: 0; width: 100%; }
header { position: absolute; top: 0px; left: 0px; width: 100%; height: 280px; margin: 0; padding: 0; z-index: 10; background: #ffffff; background-image: -webkit-linear-gradient(left top, #ffffff, #cccccc); background-image:-moz-linear-gradient(left top, #ffffff, #cccccc); background-image:-ms-linear-gradient(left top, #ffffff, #cccccc); background-image: -o-linear-gradient(left top, #ffffff, #cccccc); background-image: linear-gradient(to bottom right, #ffffff, #cccccc); -webkit-box-shadow: 0px 4px 3px #666666; -moz-box-shadow: 0px 4px 3px #666666; box-shadow: 0px 4px 3px #666666; }
header.fixed { position: fixed; }
#logo { position: absolute; top: 0px; left: 0px; margin: 10px 5px 10px 5px; padding: 0; border: 2px inset; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; -webkit-box-shadow: 2px 4px 3px #666666; -moz-box-shadow: 2px 4px 3px #666666; box-shadow: 2px 4px 3px #666666; overflow: hidden; }
img.logo { vertical-align:top; height: 256px; width: auto; margin: 0; padding: 0; }
@media all and (max-width: 450px) { #logo { left: 50%; margin-left: -175px; } }
#title { position: absolute; left: 400px; right: 450px; bottom: 4px; height: 60px; font-family: Arial; color: #aaaaaa; text-shadow: -1px -1px 0 #ffffff, 1px -1px 0 #000000, -1px 1px 0 #000000, 1px 1px 0 #000000; font-size: 60px; line-height: 60px; vertical-align: middle; text-align: center; overflow: hidden; transition: all 200ms; }
@media all and (max-width: 1280px) { #title { display: none; } }
#menu { position: absolute; right: 0px; bottom: 0px; margin: 5px 40px 15px 40px; padding: 0; white-space: nowrap; z-index: 15; }
@media all and (max-width: 450px) { #menu { margin: 5px 10px 15px 10px; } }
#menu a { background: #e63737; background-image: -webkit-linear-gradient(top, #e63737, #b82b2b); background-image:-moz-linear-gradient(top, #e63737, #b82b2b); background-image:-ms-linear-gradient(top, #e63737, #b82b2b); background-image: -o-linear-gradient(top, #e63737, #b82b2b); background-image: linear-gradient(to bottom, #e63737, #b82b2b); -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; -webkit-box-shadow: 2px 4px 3px #666666; -moz-box-shadow: 2px 4px 3px #666666; box-shadow: 2px 4px 3px #666666; font-family: Arial; color: #ffffff; font-size: 14px; padding: 5px 10px 5px 10px; border: solid #992323 1px; text-decoration: none; }
menu a:hover { background: #ff3d3d; background-image: -webkit-linear-gradient(top, #ff4d4d, #d94444); background-image: -moz-linear-gradient(top, #ff4d4d, #d94444); background-image: -ms-linear-gradient(top, #ff4d4d, #d94444); background-image: -o-linear-gradient(top, #ff4d4d, #d94444); background-image: linear-gradient(to bottom, #ff4d4d, #d94444); text-decoration: none; }
@media all and (max-width: 750px) { #menu a { font-size: 10px; } }
nav { position: fixed; margin: 0; padding: 10px 10px 10px 0px; left: -10px; top: 300px; width: 120px; background: #ffffff; background-image: -webkit-linear-gradient(left top, #ffffff, #cccccc); background-image:-moz-linear-gradient(left top, #ffffff, #cccccc); background-image:-ms-linear-gradient(left top, #ffffff, #cccccc); background-image: -o-linear-gradient(left top, #ffffff, #cccccc); background-image: linear-gradient(to bottom right, #ffffff, #cccccc); -webkit-border-radius: 0px 5px 5px 0px; -moz-border-radius: 0px 5px 5px 0px; border-radius: 0px 5px 5px 0px; -webkit-box-shadow: 2px 4px 3px #666666; -moz-box-shadow: 2px 4px 3px #666666; box-shadow: 2px 4px 3px #666666; font-family: Arial; color: #ffffff; font-size: 14px; border: solid #232323 1px; text-decoration: none; z-index: 8; }
nav.fixed { position: fixed; }
@media all and (max-width: 750px) { nav { display: none; } }
nav a { display: block; margin: 5px 10px 5px 0px; text-align: center; background: #ff0000; background-image: -webkit-linear-gradient(top left, #ff0000, #a00000); background-image:-moz-linear-gradient(top left, #ff0000, #a00000); background-image:-ms-linear-gradient(top left, #ff0000, #a00000); background-image: -o-linear-gradient(top left, #ff0000, #a00000); background-image: linear-gradient(to bottom right, #ff0000, #a00000); -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; -webkit-box-shadow: 2px 4px 3px #666666; -moz-box-shadow: 2px 4px 3px #666666; box-shadow: 2px 4px 3px #666666; font-family: Arial; color: #ffffff; font-size: 14px; padding: 5px 10px 5px 20px; border: solid #992323 1px; text-decoration: none; transition: all 400ms; }
nav a:hover { background: #ffff3d; background-image: -webkit-linear-gradient(top, #ff4d4d, #d94444); background-image: -moz-linear-gradient(top, #ff4d4d, #d94444); background-image: -ms-linear-gradient(top, #ff4d4d, #d94444); background-image: -o-linear-gradient(top, #ff4d4d, #d94444); background-image: linear-gradient(to bottom, #ff4d4d, #d94444); }
nav a.visible { display: block; font-size: 16px; font-weight: bold; color: #ffff00; margin-right: 0px; }
nav a.partial-visible { display: block; font-size: 15px; font-weight: normal; color: #ffff88; margin-right: 5px; }
#info { display: block; position: absolute; left: 410px; top: 0px; right: 40px; max-height: 180px; z-index: 20; background: #ffffff; background-image: -webkit-linear-gradient(top, #ffffff, #aaaaaa); background-image:-moz-linear-gradient(top, #ffffff, #aaaaaa); background-image:-ms-linear-gradient(top, #ffffff, #aaaaaa); background-image: -o-linear-gradient(top, #ffffff, #aaaaaa); background-image: linear-gradient(to bottom, #ffffff, #aaaaaa); -webkit-border-radius: 0 0 5px 5px; -moz-border-radius: 0 0 5px 5px; border-radius: 0 0 5px 5px; -webkit-box-shadow: 2px 4px 3px #666666; -moz-box-shadow: 2px 4px 3px #666666; box-shadow: 2px 4px 3px #666666; font-family: Arial; color: #000000; font-size: 14px; padding: 5px 10px 5px 10px; border: solid #232323 1px; border-top: none; text-align: center; vertical-align: middle; overflow: auto; overflow-x: hidden; overflow-y: auto; }
@media all and (max-width: 750px) { #info { display: none; } }
#summary { display: table; margin: auto; vertical-align: top; font-family: Arial; color: #000000; font-size: 24px; padding: 0; }
@media all and (max-width: 1024px) { #summary { font-size: 16px; } }
#summary-item { display: table-row; }
#summary-key { display: table-cell; text-align: right; white-space: nowrap; padding: 0; font-weight: bold; }
#summary-key:after { content: ':'; }
#summary-value { display: table-cell; text-align: left; padding: 0 0 0 10px; }
#summary-extra { display: table-cell; text-align: center; padding: 0 0 0 10px; }
#tags { display: inline; margin: 5px auto; }
.tag { display: inline-block; position: relative; margin: 5px; padding: 5px 10px 5px 20px; background: #ffffdd; background-image: -webkit-linear-gradient(left top, #ffffdd, #ccccaa); background-image:-moz-linear-gradient(left top, #ffffdd, #ccccaa); background-image:-ms-linear-gradient(left top, #ffffdd, #ccccaa); background-image: -o-linear-gradient(left top, #ffffdd, #ccccaa); background-image: linear-gradient(to bottom right, #ffffdd, #ccccaa); -webkit-border-radius: 100px 4px 4px 100px; -moz-border-radius: 100px 4px 4px 100px; border-radius: 100px 4px 4px 100px; -webkit-box-shadow: 2px 4px 3px #666666; -moz-box-shadow: 2px 4px 3px #666666; box-shadow: 2px 4px 3px #666666; font-family: Arial; color: #000000; font-size: 14px; text-decoration: none; border: solid #232323 1px; vertical-align: middle; text-align: center; }
#main { position: relative; margin: 0; padding: 296px 0 40px 160px; background: #ffffdd; background-image: -webkit-linear-gradient(left top, #ffffdd, #ccccaa); background-image:-moz-linear-gradient(left top, #ffffdd, #ccccaa); background-image:-ms-linear-gradient(left top, #ffffdd, #ccccaa); background-image: -o-linear-gradient(left top, #ffffdd, #ccccaa); background-image: linear-gradient(to bottom right, #ffffdd, #ccccaa); }
@media all and (max-width: 750px) { #main { padding: 296px 0 40px 0; } }
footer { position: relative; margin: 0; padding: 20px; background: #ffffff; background-image: -webkit-linear-gradient(left top, #ffffff, #cccccc); background-image:-moz-linear-gradient(left top, #ffffff, #cccccc); background-image:-ms-linear-gradient(left top, #ffffff, #cccccc); background-image: -o-linear-gradient(left top, #ffffff, #cccccc); background-image: linear-gradient(to bottom right, #ffffff, #cccccc); -webkit-box-shadow: 0px -2px 2px #666666; -moz-box-shadow: 0px -2px 2px #666666; box-shadow: 0px -2px 2px #666666; font-family: Arial; font-size: 14px; color: #000000; text-align: center; }
.anchor:before { display: block; content: " "; margin-top: -100px; height: 100px; visibility: hidden; }
.card { display: block; position: relative; padding: 0; margin: 15px 15px 15px 15px; }
@media all and (max-width: 450px) { .card { margin: 15px 4px 15px 4px; } }
.card h1 { display: block; position: relative; max-width: 200px; margin: 0; top: 1px; z-index: 1; background: #ffffff; background-image: -webkit-linear-gradient(top, #ffffff, #dddddd); background-image:-moz-linear-gradient(top, #ffffff, #dddddd); background-image:-ms-linear-gradient(top, #ffffff, #dddddd); background-image: -o-linear-gradient(top, #ffffff, #dddddd); background-image: linear-gradient(to bottom, #ffffff, #dddddd); -webkit-border-radius: 5px 5px 0 0; -moz-border-radius: 5px 5px 0 0; border-radius: 5px 5px 0 0; font-family: Arial; font-size: 28px; padding: 5px 10px 5px 10px; border: solid #232323 1px; border-bottom: none; text-align: center; vertical-align: middle; color: #888888; text-shadow: -1px -1px 0 #ffffff, 1px -1px 0 #000000, -1px 1px 0 #000000, 1px 1px 0 #000000;  }
@media all and (max-width: 450px) { .card h1 { max-width: 120px; font-size: 20px; } }
.card .card-body { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; flex-wrap:wrap; justify-content: space-around; align-items: center; position: relative; margin: 0; z-index: 0; background: #ffffff; background-image: -webkit-linear-gradient(top, #dddddd, #aaaaaa); background-image:-moz-linear-gradient(top, #dddddd, #aaaaaa); background-image:-ms-linear-gradient(top, #dddddd, #aaaaaa); background-image: -o-linear-gradient(top, #dddddd, #aaaaaa); background-image: linear-gradient(to bottom, #dddddd, #aaaaaa); -webkit-border-radius: 0 5px 5px 5px; -moz-border-radius: 0 5px 5px 5px; border-radius: 0 5px 5px 5px; -webkit-box-shadow: 2px 4px 3px #666666; -moz-box-shadow: 2px 4px 3px #666666; box-shadow: 2px 4px 3px #666666; font-family: Arial; color: #000000; font-size: 18px; padding: 5px 10px 5px 10px; border: solid #232323 1px; text-align: left; vertical-align: middle; }
@media all and (max-width: 750px) { .card .card-body { font-size: 16px; } }
@media all and (max-width: 450px) { .card .card-body { font-size: 12px; padding: 5px 2px 5px 2px; } }
.important { font-size: 120%; font-weight: bold; }
.address { display: block; width: 100%; text-align: center; }
.address a { font-size: 133%; color: #000000; text-decoration: none; padding: 5px 0px; }
.address a:before { content: ' '; clear: right; display: block; }
.address a.address-name:before { content: ""; }
.address a.address-name { font-size: 166%; font-weight: bold; }
@media all and (max-width: 450px) { .address a.address-email { font-size: 110%; } }
.references { display: block; margin: 0 auto 0 auto; text-align: center; }
.reference { display: inline-block; width: 400px; margin: 10px 20px 10px 20px; padding: 10px; background: #ffffff; background-image: -webkit-linear-gradient(top, #ffffff, #dddddd); background-image:-moz-linear-gradient(top, #ffffff, #dddddd); background-image:-ms-linear-gradient(top, #ffffff, #dddddd); background-image: -o-linear-gradient(top, #ffffff, #dddddd); background-image: linear-gradient(to bottom, #ffffff, #dddddd); -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; border: solid #232323 1px; -webkit-box-shadow: 2px 4px 3px #666666; -moz-box-shadow: 2px 4px 3px #666666; box-shadow: 2px 4px 3px #666666; vertical-align: middle; overflow: hidden; overflow-x: auto; font-family: Arial; color: #000000; font-size: 100%; }
.reference a { display: block; font-size: 133%; color: #000000; text-decoration: none; padding: 0; text-align: center; margin: 0; }
.reference a.ref-name { font-size: 155%; font-weight: bold; }
.reference a.ref-email,a.ref-phone { font-size: 110%; white-space: normal; }
.reference a.ref-title { font-style: italic; font-size: 110%; }
@media all and (max-width: 750px) { .reference { width: 300px; } }
@media all and (max-width: 450px) { .reference { width: 250px; margin: 10px 2px 10px 2px; padding: 5px 2px; } }
@media all and (max-width: 300px) { .reference { width: 170px; margin: 10px 2px 10px 2px; padding: 5px 2px; } }
.knowledge { display: block; margin: 0 auto 0 auto; text-align: center; }
.kh-item { margin: 0; padding: 5px 5px 5px 40px; text-indent: -40px; text-decoration: none; text-align: left; font-family: Arial; color: #000000; font-size: 133%; }
.kh-type:after { content: ': '; text-decoration: none; }
.kh-type { display: inline; text-decoration: none; font-weight: bold; }
.kh-list { display: inline; text-decoration: none; }
.languages { display: inline; margin: auto 0; padding: 0; background: #ffffff; background-image: -webkit-linear-gradient(top, #ffffff, #dddddd); background-image:-moz-linear-gradient(top, #ffffff, #dddddd); background-image:-ms-linear-gradient(top, #ffffff, #dddddd); background-image: -o-linear-gradient(top, #ffffff, #dddddd); background-image: linear-gradient(to bottom, #ffffff, #dddddd); -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; border: solid #232323 1px; border-collapse: collapse; -webkit-box-shadow: 2px 4px 3px #666666; -moz-box-shadow: 2px 4px 3px #666666; box-shadow: 2px 4px 3px #666666; vertical-align: middle; overflow: hidden; text-align: center; font-family: Arial; color: #000000; font-size: 133%; white-space: nowrap; vertical-align: middle; flex: 0 0 auto; }
@media all and (max-width: 450px) { .languages { font-size: 120%; } }
@media all and (max-width: 300px) { .languages { font-size: 110%; } }
.lang { display: table-row; }
.lang-name { display: table-cell; padding: 0 20px; width: 50%; text-align: center; font-weight: bold; border: solid #232323 1px; border-left: none; }
.lang-score { display: table-cell; padding: 0 20px; width: 50%; text-align: center; border: solid #232323 1px; border-right: none; }
@media all and (max-width: 450px) { .lang-name,.lang-score { padding: 0 4px; } }
.lang:first-of-type .lang-name { border-top: none; }
.lang:first-of-type .lang-score { border-top: none; }
.lang:last-of-type .lang-name { border-bottom: none; }
.lang:last-of-type .lang-score { border-bottom: none; }
.language-comment { font-size: 133%; padding: 5px 10px; display: inline; vertical-align: middle; flex: 1 1 10em; }
.experience { display: block; margin: 0 auto 0 auto; padding: 0; text-align: left; }
.exp { display: block; margin: 10px 0; padding: 10px; font-family: Arial; color: #000000; background: #ffffff; background-image: -webkit-linear-gradient(top, #ffffff, #dddddd); background-image:-moz-linear-gradient(top, #ffffff, #dddddd); background-image:-ms-linear-gradient(top, #ffffff, #dddddd); background-image: -o-linear-gradient(top, #ffffff, #dddddd); background-image: linear-gradient(to bottom, #ffffff, #dddddd); -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; border: solid #232323 1px; border-collapse: collapse; -webkit-box-shadow: 2px 4px 3px #666666; -moz-box-shadow: 2px 4px 3px #666666; box-shadow: 2px 4px 3px #666666; }
.exp-title { font-size: 150%; font-weight: bold; }
.exp-roles { margin: 10px 0 10px 20px; font-size: 110%; }
@media all and (max-width: 450px) { .exp-roles { margin-left: 0; } }
.role-title { display: inline; font-weight: bold; }
.role-desc ul { margin-top: 5px; margin-bottom: 5px; padding-left: 40px; padding-start: 40px; }
@media all and (max-width: 450px) { .role-desc ul { padding-left: 20px; padding-start: 20px; } }
.education { display: block; margin: 0 auto 0 auto; padding: 0; text-align: left; }
.edu { display: block; margin: 10px 0; padding: 10px; font-family: Arial; color: #000000; background: #ffffff; background-image: -webkit-linear-gradient(top, #ffffff, #dddddd); background-image:-moz-linear-gradient(top, #ffffff, #dddddd); background-image:-ms-linear-gradient(top, #ffffff, #dddddd); background-image: -o-linear-gradient(top, #ffffff, #dddddd); background-image: linear-gradient(to bottom, #ffffff, #dddddd); -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; border: solid #232323 1px; border-collapse: collapse; -webkit-box-shadow: 2px 4px 3px #666666; -moz-box-shadow: 2px 4px 3px #666666; box-shadow: 2px 4px 3px #666666; }
.edu-period { font-size: 150%; display: block; float: left; font-weight: bold; }
@media all and (max-width: 750px) { .edu-period { float: none; } }
.edu-title { font-size: 150%; }
.edu-title,.edu-subtitle,.edu-school,.edu-extra { display: block; margin: 0 0 0 160px; white-space: normal; }
@media all and (max-width: 750px) { .edu-title,.edu-subtitle,.edu-school,.edu-extra { margin: 0 0 0 20px; } }
.edu-title { font-weight: bold; }
.edu-extra { font-style: italic; }
.hobbies { margin: 5px; padding-left: 40px; padding-start: 40px; }
@media all and (max-width: 450px) { .hobbies { padding-left: 20px; padding-start: 20px; } }
.hobbies li { font-size: 120%; }