/*$white: #ffffff;
$blue: #27cbf4;
$purple: #c798f9;
$green: #9dd53a;

$gradient: linear-gradient(45deg, $green 0%, $blue 25%, $purple 86%);*/

* {
 
  margin: 0;
  box-sizing: border-box;

}


html { font-size: 14pt; }
body {
  font-size: 1.3rem;
  font-family: -apple-system, "Barlow Condensed", "Helvetica Neue", sans-serif;
}

a {
  color: $blue;
  &:visited { 
    color:  $purple;
  }
  &:hover, 
  &:active {
    color: $green;
  }
  
}

section {
  display:grid;
  grid-template-columns:1fr 1fr;
  align-items:start;}
section div.title {
  padding: 1.3rem;
  height: 100vh;

  position: sticky;
  top: 0;
}
section div.info{
  padding-right:1.3rem;
  padding-left:1.3rem;
  padding-bottom:1.3rem;
  min-height:100vh;
}

/*section {
  display:grid;
  grid-template-columns:1fr 1fr;
  align-items:start;}*/
/*  height: 100%;
  height: 100vh;*/
 /* display: flex;*/
 /* align-items: stretch;*/
  
 /* header, article {
    flex: 1 0 100%;
  }*/


section div.title {
  background: #c8cfdb;
/*  background-repeat: repeat;
  background-size:  100%;
  background-blend-mode: overlay;*/
  
 padding-top: 0rem;
  padding-left: 5%;
  margin-bottom:2px;
 /*height:100vh;*/
  
  p {
    /*text-transform: uppercase;*/
    font-weight: 900;
    font-size: .75rem;
  }
  
  h1 {
    font-weight: 100;
    font-size: 3rem;
  }
}
.title{margin-top:0rem;}


/*article {
  padding: 2em;*/
  
  h2 {
    font-size: 2rem;
    margin-top:10px;
    margin-bottom:15px;
    padding-left: 0rem;
    
  }
  
  /*hr {
    border: 0;
    height: 2px;
    background-color: $green;
    background: $gradient;
    margin-bottom: 1rem;
  }*/
  p {
    margin-bottom: 3rem;
  }
  img {
  max-width: 100%;
  vertical-align: bottom;
  overflow-clip-margin: content-box;
    overflow: clip;
}

figcaption{font-size:1.5rem;}
  @media only screen and (max-width: 600px) {

    section{grid-template-columns:1fr;}

    section:nth-child(odd) div.title,
    section:nth-child(even) div.title{
      position:static;
      height:auto;
    }
  }