body {
    padding: 0;
    margin: 0;
    background-color: #f7f7f1;
    align: center;
    display: block;
    min-width: 1024px;
}

div {
    display: block;
}

#body_wrapper {
    align-content: center;
}

.content {
    max-width: 1400px;
    margin: auto;
}

#name_space {
    background: repeating-linear-gradient(
      180deg,
      #00587a,
      #00587a 4px,
      #086285 4px,
      #086285 8px
    );
    background-size: 100% 15px;
    padding-top: min(5%, 100px);
    padding-bottom: min(2%, 40px);
}

.top_space {
    height: 60vh;
    background-size: cover;
    width: 100%;
    display: table;
    overflow: hidden;
    background-position: center;
}

#top_space_data_science {
    background-image: linear-gradient(0deg, rgba(0, 25, 50, 0.8), rgba(0, 25, 50, 0.8)), url('../assets/data_science.jpg');
}

#top_space_software {
    background-image: linear-gradient(0deg, rgba(0, 25, 50, 0.8), rgba(0, 25, 50, 0.8)), url('../assets/software.jpg');
}

#top_title {
    font-family: arial;
    font-size: 64px;
    color: #e7e7de;
    font-weight: 500;
}

.signature {
    width: 80%;
    max-width: 1400px;
}

#navbar {
    overflow: hidden;
    background-color: #00587a;
    border-top: 5px solid #0f3037;
    border-bottom: 1px solid #0f3037;
}

#navbar .nav_btn {
    /* float: left; */
    font-family: "Courier New";
    font-size: 24px;
    display: inline-block;
    color: #e7e7de;
    text-align: center;
    padding: 15px 25px 15px 25px;
    margin: 0 -5px 0 -5px;
    width: auto;
    text-decoration: none;
    background-color: transparent;
    transition: 0.5s;
}

#navbar .nav_btn:hover {
    background-color: #008891;
    transition: 0.2s;
}

#navwrap1 {
    overflow: hidden;
    border-top: 6px solid #f7f7f1;
    border-bottom: 6px solid #f7f7f1;
    text-align: center;
    /* padding: 15px 0 15px 0; */
}

#navwrap3 {
    overflow: hidden;
    border-bottom: 5px solid #0f3037;
}

#navwrap2 {
    overflow: hidden;
    border-bottom: 2px solid #e7e7de;
}

#current_page {
    font-family: "Courier New";
    font-size: 24px;
    display: inline-block;
    color: #e7e7de;
    text-align: center;
    padding: 15px 25px 15px 25px;
    margin: 0 -5px 0 -5px;
    width: auto;
    text-decoration: none;
    background-color: #008891;
}

.nav_btn {
    width: 100px;
}

/* The sticky class is added to the navbar with javascript when navbar gets to the top */
.sticky {
    position: fixed;
    top: 0;
    width: 100%;
}

/* TODO correct this to prevent snapping even when toolbar becomes two rows */
.sticky + .content {
    padding-top: 82px;
}

h3 {
    font-family: georgia;
    font-weight: 600;
    font-size: 36px;
    color: #555;
    margin-bottom: 0px;
}

.entry_grid {
    margin: auto;
    padding: 20px;
    min-width: 500px;
    max-width: 1200px;
    font-size: 0;
    text-align: center;
    margin-top: 20px;
}

.no_underline {
    text-decoration: none;
}

.entry_img {
    height: 240px;
    background-color: #999;
}

.port_entry {
    height: 500px;
    max-width: 400px;
    width: 100%;
    margin: 0;
    padding: 20px;
    display: inline-block;
    text-align: center;
    vertical-align: top;
    box-sizing: border-box;
    transition: 0.5s;
    background: transparent;
}

.port_entry:hover {
    /* border: 2px solid #008891; */
    transition: 0.2s;
    background: #9bbec0;
}

.snippet {
    font-family: georgia;
    font-weight: 400;
    font-size: 24px;
    color: #777;
    margin-top: 10px;
}

.footer {
    font-family: georgia;
    font-weight: 300;
    font-size: 18px;
    color: #888;
    text-align: center;
    width: auto;
    border-top: 1px solid #888;
    margin: 50px;
}

#current_page {
    text-decoration: underline;
}