:root { 
  /***** Font Sizes *****/
  --body-font-size-default: 14px;
  --header-font-size: 56px;
  --subheader-font-size: 24px;

  /***** Colors *****/
  --ds-background-color-n98: #F5F8FB;
  --ds-color-carbon-shadow-n18: #2F3237;
  --ds-color-dolphin-tale-n45: #6A717C;


  /***** Margin *****/


  /***** Padding *****/

}

* {
  margin: 0;
  padding: 0;
}

body {
  background-color: var(--ds-background-color-n98);
  height: 100%;
  overflow: hidden;
  font-family: Roboto, arial, sans-serif;
  font-size: var(--body-font-size-default);    
}

.logo-container img {
  max-width: 100px;
}

.logo-container {
  margin: 1.5rem 1.5rem 5rem 1.5rem;
}

.content-container {
  position: relative;
  display: flex;
  flex-direction: row;
  height: 100vh;
  width: 100vw;
}

.maintenance-img-wrapper {
  position: relative;
  display: flex;
  flex: 1 1 50%;
  align-items: start;  
}

.maintenance-img-wrapper .maintenance-img {
  width: 100%;
  animation: .5s cubic-bezier(0, 0, 0.2, 1) 0s 1 LandingGraphic;
}

.platform-message-wrapper {
  padding: 0 3rem 0 0;
  position: relative;
  display: flex;
  flex-direction: column;
  flex: 1 1 50%;
  transition: padding .3s ease-in-out;
  animation: .5s cubic-bezier(0, 0, 0.2, 1) 0s 1 PlatformMessage;
}

.platform-message-wrapper .header-container {
  display: flex;
  margin-bottom: 0.65rem;
  max-width: 575px;  
}

.platform-message-wrapper .header-container h1 {
  font-size: var(--header-font-size);
  font-weight: normal;
  color: var(--ds-color-carbon-shadow-n18);
  /*flex: 1 1 90%;*/
}

.platform-message-wrapper .header-container img {
  margin-right: 0.5rem;
  max-width: 42px;
  /*flex: 1 1 43px;*/
}

.platform-message-wrapper .subheader-text {
  font-size: var(--subheader-font-size);
  color: var(--ds-color-dolphin-tale-n45);
  font-weight: normal;
  max-width: 575px;  
}

.platform-message-wrapper .subheader-text p {
  margin-bottom: 1.5rem;
}


/***** Keyframe Animations *****/
@keyframes LandingGraphic {
  0% {
     transform: scale(0);
     transform-origin: left center;
  }
  100% {
    transform: scale(1);
    transform-origin: center center;
  }
}

@keyframes PlatformMessage {
  0% {
     transform: scale(0);
     transform-origin: right center;
  }
  100% {
    transform: scale(1);
    transform-origin: center center;
  }
}


/***** Media Querires *****/
@media screen and (max-width: 960px) {
  .content-container {
    flex-direction: column-reverse;
    height: auto;
  }
  .platform-message-wrapper {
    padding: 0 1.5rem;
  }  
  .platform-message-wrapper .subheader-text {
    max-width: none;
  }
  .maintenance-img-wrapper .maintenance-img {
    position: relative;
    top: 30px;
  }  
}

@media screen and (max-width: 640px) {
  .platform-message-wrapper .header-container {
    max-width: none;
  }
  .platform-message-wrapper .header-container h1 {
    font-size: 10vw;
  }  
  .platform-message-wrapper .subheader-text {
    font-size: 3.75vw;
  } 
  .platform-message-wrapper .header-container img {
    width: 7vw;
  }  
}

@media screen and (max-width: 360px) {
  .platform-message-wrapper .subheader-text {
    font-size: 5vw;
  }
  .platform-message-wrapper .header-container img {
    display: none;
  }   
}