@import url("https://fonts.googleapis.com/css2?family=Open+Sans:wght@400;500;700&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap");
.nav-bar { width: 100%; display: inline-block; background-color: #FFF; font-family: "Poppins", serif; font-weight: 700 !important; padding-top: 10px; }

.nav-content .logo-touch-target { display: inline-flex; height: 60%; width: 350px; }

.nav-content .nav-logo { height: 60px; margin: 40px 0 45px 0; }

.nav-logo { display: flex; align-items: center; justify-content: center; }

.nav-logo img { width: 200px; }

.nav-content nav { display: block; width: 100%; text-align: right; padding-top: 0px; padding-right: 0px; }

.profile { background-color: #6fd1f5; text-align: center; min-height: 320px; padding: 30px; margin-bottom: 50px; border-bottom: 6px solid #2a3339; }

.profile h1 { font-size: 50px; font-weight: 700; font-family: 'Poppins', sans-serif; color: #2a3339; }

.profile img { border-radius: 50%; max-width: 100%; max-height: 100%; margin-left: auto; margin-right: auto; display: block; padding: 20px; }

.profile .profile-picture { margin-bottom: 30px; height: 200px; }

.profile a, .profile a:hover, .profile a:visited { color: rgba(59, 71, 79, 0.92); }

h2 { font-size: large; }

body { background-color: #303072; background-size: cover; width: auto !important; overflow-x: hidden !important; font-family: 'Poppins', "Open Sans", sans-serif; color: white; }

.banner { padding: 20px 0px 50px 0px; height: 150px; background-color: #1d539f; }

.banner .logo { max-width: 180px; max-height: 60px; width: auto; height: auto; }

.banner .title { color: white; font-size: 50px; font-weight: 700; }

.page { text-align: left; }

.page h1 { text-align: left !important; font-weight: 800 !important; color: black; margin-bottom: 0.7em; }

.page h2 { text-align: left !important; font-weight: 800 !important; color: black; margin-bottom: 0.5em; }

.page h3 { font-weight: 600 !important; text-align: left !important; color: black; font-size: 1.3rem; }

.page h4 { font-weight: 600 !important; text-align: center !important; color: black; }

.page p { color: black; font-weight: 500; }

.page td { color: black; }

.page th { color: black; }

.page li { color: black; }

.page a { color: #0f90fe; }

.page a:hover { color: #0f90fe; }

.page code { color: #17a2b8; }

hr { background-color: black; padding: 1px; margin-top: 1em !important; margin-bottom: 1em !important; }

@media screen and (max-width: 768px) { .banner { padding: 20px 0px 20px 0px; height: 110px; } .banner .logo { max-width: 150px; max-height: 60px; width: auto; height: auto; } .banner .title { color: white; font-size: 30px; font-weight: 700; } .page h1 { font-size: 1.5rem !important; } .page h2 { font-size: 1.2rem !important; } .page h4 { font-size: 0.8rem !important; } }

.card { /** Global styles and utilities for cards */ /** Work Experience */ /** Education */ }

.card.fellowship { background: #1e539f; color: white; }

.card.hp { background: #212529; color: white; }

.card.hp img { filter: brightness(100); }

.card.hc { background: #07b9e8; color: #212529; }

.card.hc img { filter: brightness(0); }

.card.mlh { background: #ca1508; color: white; }

.card.mlh img { filter: brightness(100); }

.card.arm { background: #11809f; color: white; }

.card.arm img { filter: brightness(100); }

.card.uob { background: #605270; color: white; }

.card.hbk { background: #164a25; color: white; }

.card.huk { background: #e91e63; color: white; }

.card.huk img { filter: brightness(100); }

.card.htm { background: #449afd; color: white; }

.card.htm img { filter: brightness(100); }

.card.hq { background: #0e1428; color: white; }

.card.h4s { background: #5c47ff; color: white; }

.card-container { display: grid; grid-template-columns: repeat(4, 1fr); }

.card-container a:hover { text-decoration: none; }

@media only screen and (max-width: 1500px) { .card-container { grid-template-columns: repeat(3, 1fr); } }

@media only screen and (max-width: 1000px) { .card-container { grid-template-columns: repeat(2, 1fr); } }

@media only screen and (max-width: 768px) { .card-container { grid-template-columns: 1fr; } }

body { margin-bottom: 50px; }

h2 { margin-bottom: 20px; margin-top: 20px; font-weight: 700; text-align: center; font-family: 'Poppins', sans-serif; }

.card { align-items: center; margin: 20px 30px; background-color: white; border-radius: .375rem; padding: 1.5em; font-size: 1.2em; display: grid; grid-template-columns: 70px auto; grid-column-gap: 20px; box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23); transition: box-shadow .3s; }

.card:hover { box-shadow: 0 10px 20px rgba(0, 0, 0, 0.19), 0 10px 10px rgba(0, 0, 0, 0.23); }

a { color: black; }

.info p { margin-top: 5px; margin: 0px; text-align: left; }

.info .title { font-size: 16px; font-weight: bold; }

.info .location { font-size: medium; font-weight: 400; }

.info .dates { font-size: small; opacity: 0.8; }

img { max-width: 100%; }

.photos, .sailing-videos { margin: auto; width: 75%; padding: 10px; margin-bottom: 50px; }

iframe { height: 710px; max-width: 100%; width: 100%; }

.sailing-videos iframe { margin-bottom: 75px; border-radius: 25px; box-shadow: 0 10px 10px rgba(0, 0, 0, 0.19), 0 10px 10px rgba(0, 0, 0, 0.23); }

.photos img:hover { box-shadow: 0 10px 20px rgba(0, 0, 0, 0.19), 0 10px 10px rgba(0, 0, 0, 0.23); -webkit-transform: scale(1.005); /* Safari 3-8 */ transform: scale(1.005); }

.photos img { width: auto !important; border-radius: 10px !important; box-shadow: 0 10px 10px rgba(0, 0, 0, 0.19), 0 10px 10px rgba(0, 0, 0, 0.23); transition: transform .3s; }

.photos-title { text-align: center; margin-top: 50px; font-size: 72px; font-weight: 700; }

.photos-description { text-align: center; margin-top: 10px; margin-bottom: 50px; font-size: 16px; font-weight: 300; font-style: italic; }

.photos h2 { font-weight: 500; font-size: 32px; }

.exif { margin-top: 20px; text-align: center; }

.exif p { display: inline; margin-right: 10px; font-weight: 300; font-style: italic; }

.exif b { font-weight: 500; }

.home-button { color: white; text-align: center; font-style: italic; font-size: small; font-size: 15px; }

.home-button-frame { background-color: #07b9e8; margin-left: 30%; margin-right: 30%; border-radius: 25px; padding-top: 10px; padding-bottom: 2px; padding-left: 20px; padding-right: 20px; }

/*# sourceMappingURL=main.css.map */