*,
*::after,
*::before {
  margin: 0;
  padding: 0;
  box-sizing: inherit; }

html {
  font-size: 62.5%; }

body {
  box-sizing: border-box;
  background-color: #F8F8F8; }

body {
  font-family: "Lato", sans-serif;
  font-weight: 400;
  line-height: 1.7;
  color: #000000; }

.mynav {
  display: flex;
  width: 100%;
  height: 4rem;
  align-items: center; }

.mynav__title {
  padding-left: 10rem;
  flex-grow: 2; }

.mynav__navs {
  padding-right: 5rem;
  flex-grow: 1;
  display: flex;
  justify-content: end; }
  .mynav__navs a {
    text-decoration: none;
    color: #000000; }
    .mynav__navs a:not(:last-child) {
      padding-right: 2rem; }

#image-front {
  width: 100%;
  max-height: 50vh;
  object-fit: cover; }

.index {
  width: 75vw;
  margin: 0 auto;
  display: flex;
  align-content: space-between; }
  .index .index__blogpost {
    background-color: #FFFFFF;
    border-radius: 4px;
    width: 75%;
    margin-right: 2rem; }
    .index .index__blogpost h1 {
      text-align: center; }
  .index .index__rightpanel {
    width: 25%;
    border-radius: 4px;
    display: flex;
    flex-direction: row; }
    .index .index__rightpanel .profile {
      background-color: #FFFFFF; }
      .index .index__rightpanel .profile img {
        max-height: 20vh;
        display: block;
        margin: 0 auto; }
      .index .index__rightpanel .profile h2 {
        text-align: center; }