header {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  box-sizing: border-box;
  display: flex;                     /* use flexbox instead of floats */
  justify-content: space-between;    /* push logo left, menu right */
  align-items: center;               /* vertically center items */
  padding: 50px;
  z-index: 10;
  background-color: var(--darkTransparent);

  -webkit-transition: all ease-out 0.5s;
  -ms-transition: all ease-out 0.5s;
  transition: all ease-out 0.5s;
}



header .logo img {
  height:8rem;
  float:left;
  -webkit-transition: all ease-out 0.5s;
  -ms-transition: all ease-out 0.5s;
  transition: all ease-out 0.5s;
  display: inline-block;
}

header .menu {
  width:10rem;
  margin-left: auto; 
  margin-right: 0;
  cursor: pointer;
  align-self: flex-start;
}

header .menu img {
  float:right;
  height:4rem;
  -webkit-transition: all ease-out 0.5s;
  -ms-transition: all ease-out 0.5s;
  transition: all ease-out 0.5s;  
}


.dropdown {
  position: relative;
  display: inline-block;
  float: right;
}

.dropdown-content {
  display: none;
  position: absolute;
  background-color: var(--dark);
/*  background-color: red;*/
/*  background-color: none;*/
  min-width: 4rem;
/*  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);*/
  padding: 1rem 2rem;
  z-index: 10;

}

.menu:hover .dropdown-content {
  display: block;
}

header.fixed-header {
  padding: 20px;
  background-color: var(--dark);
}

header.fixed-header .logo img {
  float:left;
  height:2rem;
}

header.fixed-header .menu img {
  float:right;
  height:3rem;
}

@media screen and (max-width: 1024px) {
  .base-container {
    max-width:1024px
  }

  section {
    display: block;
  }

  .half-image
  {
      width:100%;
  }

  header {
    padding: 20px;
    background-color: var(--darkTransparent);
  }  

  header .logo img {
    height:3rem;  
  }

  header .menu img {
    height:3rem;  
  }

  header.fixed-header .logo img {
    float:left;
    height:2rem;
  }

  .column {
    width:100%;
  }  

}