*{font-family:'Lato', sans-serif;font-weight:400;}
body{color:#333;background:#f9f9f9;}
h4,
button,
.japan label,
.korea label{font-family:'Amiko', sans-serif;font-weight:600;}
.nav-item,
.display-5{font-family:'Amiko', sans-serif;font-weight:400;}
.navbar-brand{font-family:'Amiko', sans-serif;font-weight:900;}
.text-navy{color:#0A4D6D;}
.bg-navy{background-color:#185674!important;}
a{color:#0e6a95;}
a:hover{color:#185674;text-decoration:none;}
a,
button{cursor:pointer;}
button:focus{outline:none !important;}
.btn-navy{color:#f9f9f9;background-color:#0e6a95;}
.btn-navy:hover{background-color:#185674;color:inherit;``}
.btn-outline-navy{border-color:#185674;background-color:transparent;color:#185674;}
.btn-outline-navy:hover{color:#fff;background-color:#185674;}
.navbar-toggler{border:none;padding:.25rem 0;}
.navbar-toggler:focus{outline:none !important;}
#nav-icon{width:30px;height:30px;position:relative;-webkit-transform:rotate(0deg);-moz-transform:rotate(0deg);-o-transform:rotate(0deg);transform:rotate(0deg);-webkit-transition:.5s ease-in-out;-moz-transition:.5s ease-in-out;-o-transition:.5s ease-in-out;transition:.5s ease-in-out;cursor:pointer;}
#nav-icon span{display:block;position:absolute;height:2px;width:24px;background:rgba(0, 0, 0, .498039);border-radius:1px;opacity:1;left:3px;-webkit-transform:rotate(0deg);-moz-transform:rotate(0deg);-o-transform:rotate(0deg);transform:rotate(0deg);-webkit-transition:.25s ease-in-out;-moz-transition:.25s ease-in-out;-o-transition:.25s ease-in-out;
transition:.25s ease-in-out;}
#nav-icon span:nth-child(1){top:7px;}
#nav-icon span:nth-child(2), #nav-icon span:nth-child(3){top:14px;}
#nav-icon span:nth-child(4){top:21px;}
#nav-icon.open span:nth-child(1){top:14px;}
#nav-icon.open span:nth-child(4){top:14px;}
.jumbotron{height:100vh;}
.jumbotron .display-5,
.jumbotron .lead{opacity:0;color:#f9f9f9;-webkit-animation:fade-in ease-in 2s;-moz-animation:fade-in ease-in 2s;-o-animation:fade-in ease-in 2s;animation:fade-in ease-in 2s;-webkit-animation-fill-mode:forwards;-moz-animation-fill-mode:forwards;-o-animation-fill-mode:forwards;animation-fill-mode:forwards;}
@keyframes fade-in{from{opacity:0;}
to{opacity:1;}
}
.jumbotron .lead{animation-delay:1s;}
.lead a, .lead span{text-decoration:none;font-weight:inherit;}
.vertical-center{display:flex;justify-content:center;align-items:center;}
#main-arrow{width:50px;animation:bounce 3s ease-in-out infinite;cursor:pointer;}
@keyframes bounce{50%{transform:translateY(20px);}
}
.main-content{}
.border-top{border-top:1px solid lightgray;}
html{position:relative;min-height:100%;}
body{margin-bottom:40px;width:100%;}
footer{position:absolute;bottom:0;width:100%;height:40px;}
#linkedin::after{content:"";background:url('../img/linkedin.svg') no-repeat center/contain;display:inline-block;width:18px;height:18px;vertical-align:-6px;opacity:.5;}
#instagram::after{content:"";background:url('../img/instagram.svg') no-repeat center/contain;display:inline-block;width:18px;height:18px;vertical-align:-6px;opacity:.5;}
#linkedin:hover::after,
#instagram:hover::after{opacity:1;}
#home{background:linear-gradient(#f7f7f7, transparent 61.8%),
linear-gradient(0deg, #292b2c, transparent 38.2%),
url('../img/sunrise_optimized.jpg') no-repeat center/cover;}
#about{background:linear-gradient(#f7f7f7, transparent 61.8%),
linear-gradient(0deg, #292b2c, transparent 38.2%),
url('../img/crema_optimized.jpg') no-repeat center/cover;}
.intj span{position:relative;content:'INTJ';}
.intj:hover span{display:none;}
.intj:hover::after{content:'Introverted: 100% | iNtuitive: 80% | Thinking: 26% | Judging: 61%';}
.profile-photo{display:block;max-width:150px;margin:100px auto;border:1px dotted lightgray;border-radius:100%;}
#experience{background:linear-gradient(#f7f7f7, transparent 61.8%),
linear-gradient(0deg, #292b2c, transparent 38.2%),
url('../img/sky_optimized.jpg') no-repeat center/cover;}
.job-title{font-weight:900;text-transform:uppercase;}
.organization{font-style:italic;}
.date{font-weight:300;}
#gallery{background:linear-gradient(#f7f7f7, transparent 61.8%),
linear-gradient(0deg, #292b2c, transparent 38.2%),
url('../img/daimonzaka_optimized.jpg') no-repeat center/cover;}
.japan img,
.korea img{width:30%;margin:.5%;float:left;}
.japan img:hover,
.korea img:hover{opacity:.5;}
#toggle-japan,
#toggle-nagano,
#toggle-tokyo,
#toggle-kyoto,
#toggle-nara,
#toggle-osaka,
#toggle-nagasaki,
#toggle-saga,
#toggle-wakayama,
#toggle-korea,
#toggle-seoul{display:none;visibility:hidden;}
#label-japan,
#label-korea{display:inline-block;padding:0.5em;font-size:1.5em;cursor:pointer;}
#label-nagano,
#label-tokyo,
#label-kyoto,
#label-nara,
#label-osaka,
#label-nagasaki,
#label-saga,
#label-wakayama,
#label-seoul{display:inline-block;padding:0.5em;cursor:pointer;}
#label-korea::before,
#label-japan::before{content:"";background:url('../img/arrow_up.svg') no-repeat;background-size:contain;width:30px;height:30px;display:inline-block;vertical-align:text-top;margin-right:5px;transform:rotate(90deg);transition:.5s ease-in-out;}
#label-nagano::before,
#label-tokyo::before,
#label-kyoto::before,
#label-nara::before,
#label-osaka::before,
#label-nagasaki::before,
#label-saga::before,
#label-wakayama::before,
#label-seoul::before{content:"";background:url('../img/arrow_up.svg') no-repeat;background-size:contain;width:20px;height:20px;display:inline-block;vertical-align:text-top;margin-right:3px;transform:rotate(90deg);transition:.5s ease-in-out;}
#expand-japan,
#expand-nagano,
#expand-tokyo,
#expand-kyoto,
#expand-nara,
#expand-osaka,
#expand-nagasaki,
#expand-saga,
#expand-wakayama,
#expand-korea,
#expand-seoul{max-height:0;overflow:hidden;display:inline-block;transition:max-height .5s;}
#toggle-japan:checked ~ #expand-japan{max-height:21256px;}
#toggle-nagano:checked ~ #expand-nagano{max-height:2102px;}
#toggle-tokyo:checked ~ #expand-tokyo{max-height:7896px;}
#toggle-kyoto:checked ~ #expand-kyoto{max-height:3422px;}
#toggle-nara:checked ~ #expand-nara{max-height:670px;}
#toggle-osaka:checked ~ #expand-osaka{max-height:670px;}
#toggle-nagasaki:checked ~ #expand-nagasaki{max-height:3435px;}
#toggle-saga:checked ~ #expand-saga{max-height:1482px;}
#toggle-wakayama:checked ~ #expand-wakayama{max-height:1021px;}
#toggle-korea:checked ~ #expand-korea{max-height:1756px;}
#toggle-seoul:checked ~ #expand-seoul{max-height:1702px;}
#toggle-japan:checked ~ #expand-japan,
#toggle-nagano:checked ~ #expand-nagano,
#toggle-tokyo:checked ~ #expand-tokyo,
#toggle-kyoto:checked ~ #expand-kyoto,
#toggle-nara:checked ~ #expand-nara,
#toggle-osaka:checked ~ #expand-osaka,
#toggle-nagasaki:checked ~ #expand-nagasaki,
#toggle-saga:checked ~ #expand-saga,
#toggle-wakayama:checked ~ #expand-wakayama,
#toggle-korea:checked ~ #expand-korea,
#toggle-seoul:checked ~ #expand-seoul{transition:max-height .5s;}
#toggle-japan:checked ~ label::before,
#toggle-korea:checked ~ label::before{transform:rotate(180deg);transition:.5s ease-in-out;}
#toggle-nagano:checked ~ label::before,
#toggle-tokyo:checked ~ label::before,
#toggle-kyoto:checked ~ label::before,
#toggle-nara:checked ~ label::before,
#toggle-osaka:checked ~ label::before,
#toggle-nagasaki:checked ~ label::before,
#toggle-saga:checked ~ label::before,
#toggle-wakayama:checked ~ label::before,
#toggle-seoul:checked ~ label::before{transform:rotate(180deg);transition:.5s ease-in-out;}
#contact{background:linear-gradient(#f7f7f7, transparent 61.8%),
linear-gradient(0deg, #292b2c, transparent 38.2%),
url('../img/sunset_optimized.jpg') no-repeat center/cover;}
.contact-info a{color:inherit;}
.phone::before{content:"";background:url('../img/phone.svg') no-repeat center/contain;display:inline-block;width:18px;height:18px;vertical-align:-2px;margin-right:5px;}
.mail::before{content:"";background:url('../img/mail.svg') no-repeat center/contain;display:inline-block;width:18px;height:18px;vertical-align:-3px;margin-right:5px;}
.form-control:focus{border-color:#185674;}
@media (min-width:576px){.display-5{font-size:3.5rem;}
}
@media (min-width:768px){.navbar-collapse{justify-content:flex-end;}
.display-5{font-size:4.5rem;}
@media (min-width:992px){.display-5{font-size:5.5rem;}
}
@media (min-width:1200px){.display-5{font-size:6rem;}
}