h1, #enable h2 {font-size: 48px; font-weight: 600;}
#products h2 {font-size: 16px; font-weight: 700; text-transform: uppercase;}
h2,
h3 {color: var(--blue);}
#products h2,
h3 {letter-spacing: 2px;}
p.subheading {font-size: 20px; line-height: 32px;}

.hr {
  display: inline-block;
  width: 200px;
  border-top: 3px solid var(--green);
  margin: 40px 0 30px;
}

/* INTRO ********************************************************************/
#intro {
  display: flex;
  min-height: calc(100vh - 127px);
  color: #ffffff;
  text-align: center;
  background: url("/landing/home/SkylineMed.jpg") center no-repeat;
  background-size: cover;
  padding: 5%;
}
#intro > div {margin: auto 0;}
#intro p {padding: 0 0 30px;}
#intro span.line-break {display: none;}

/* PRODUCTS *****************************************************************/
.flex-row-text {
  padding: 100px 50px 0 50px;
}
.flex-row-text > div {padding: 0 15% 0 25%;}
.flex-row-text h2:before {
  position: absolute;
  transform: translate(-55px, -12px);
}
#flow:before        {content: url("/landing/home/arrow_45x45.png");}
#visualize:before   {content: url("/landing/home/eyegb_40x40.png");}
#intelligent:before {content: url("/landing/home/lightbulbgear_45x43.jpg");}
.flex-row-text p {
  padding-top: 8px;
  margin-bottom: 100px;
  line-height: 1.6rem;
  font-weight: 300;
}

/* DESKTOP, PHONE, TABLET****************************************************/
.grey {background-color: #e5e5e5;}
.flex-row-thumbnails div {padding: 80px 0; text-align: center;}
.img-holder {min-height: 380px;}
#desktop {background: url("/landing/home/052b.png") center no-repeat;}
#phone   {background: url("/landing/home/11c.png") center no-repeat;}
#tablet  {background: url("/landing/home/13b.png") center no-repeat;}

/* SLIDESHOW ****************************************************************/
.flex-row-slideshow {
  padding: 5% 0 20%;
  background-color: rgb(70,70,70);
  color: #ffffff;
  text-align: center;
}

.slideshow-caption {padding: 12% 3%;}

.slideshow {
  position: relative;
  width: 80vw;
  height: 80vw;
  margin: auto;
}
.slideshow div {
  position: absolute;
  opacity: 0;
  width: 100%;
  height: 100%;
  background-size: cover;
  background-position: 50% 50%;
  background-repeat: no-repeat;
  animation: slideAnimation 25s linear infinite;
}
.slideshow div:nth-child(1) {background-image: url("/landing/home/stairs.png");}
.slideshow div:nth-child(2) {background-image: url("/landing/home/breakarea.jpg");
  animation-delay: 5s;}
.slideshow div:nth-child(3) {background-image: url("/landing/home/table.png");
  animation-delay: 10s;}
.slideshow div:nth-child(4) {background-image: url("/landing/home/coffeetable.jpg");
  animation-delay: 15s;}
.slideshow div:nth-child(5) {background-image: url("/landing/home/warehouse.jpg");
  animation-delay: 20s;}
@keyframes slideAnimation {
  0%  {opacity: 0; animation-timing-function: ease-in;}
  10% {opacity: 1;}
  20% {opacity: 1; animation-timing-function: ease-out;}
  30% {opacity: 0;}
}

/* MEDIA QUERIES ************************************************************/
@media only screen and (min-width: 490px) {
  #intro span.line-break {display: initial;}
}

@media only screen and (min-width: 768px) {
  h1, #enable h2 {font-size: 64px;}
  #intro {text-align: left;}

  /* PROJECT FLOW, INTUITIVE VISUALIZATION, BUSINESS INTELLIGENCE */
  .flex-row-text,
  .flex-row-thumbnails,
  .flex-row-slideshow {display: flex;}
  .flex-row-text div {flex: 1; padding: 0 7%;}

  /* DESKTOP, PHONE, TABLET + 1 item above */
  .flex-row-thumbnails div {flex: 1;}
  
  /* SLIDESHOW + 1 items above */
  .flex-row-slideshow {text-align: left; padding: 120px 7%;}
  .flex-row-slideshow div {flex: 1;}
  .slideshow {width: initial; height: initial; margin: initial;}
}