#full-portfolio .portfolio-section{
    display:block;
    margin: 3em;
  border-radius: 10px;
}

#full-portfolio .section-modal{
    display:inline-block;
    text-align:left;
    vertical-align: top;
    width:24%
}

#full-portfolio .section-modal h3 {
    text-align: center;
    width: 100%;
}

.portfolio-flexParent {
    min-height: 400px;
    display: flex;
    display: -webkit-flex;
    flex-wrap: wrap;
    flex-direction: row;
    justify-content: center;
    align-items: stretch;
    align-content: center;
  }
  
  .portfolio-flexParent:after {
    display: block;
    content: ""
    flex(999 999 auto)
  }
  
  .portfolio-flexChild {
      border-radius: 0.5em;
      background-color: green;
      display: inline-block;
    flex: 1 0 auto;
      height: 300px;
    margin: 2px 2px;
      overflow: hidden;
      padding: 10px 20px;
      position: relative;
      text-decoration: none;
      transition:all .05s ease;
      will-change: transform;
  }
  
  .portfolio-flexChild:hover, .portfolio-flexChild:focus {
      box-shadow: 0 3px 50px rgba(0,0,0,0.8);
      transition-delay: 0;
      z-index: 99;
  }
  
  .portfolio-flexChild:active {
      box-shadow: 0 1px 1px rgba(0,0,0,1);
      transition: all 0.02s ease;
      z-index: 99;
  }
  
  .portfolio-flexChild img {
      filter: brightness(0.9);
      height: 100%;
      left: 0;
      object-fit: cover;
      position: absolute;
      top: 0;
      width: 100%;
  }
  
  .portfolio-flexChild:hover img, .portfolio-flexChild:focus img {
      filter: brightness(1.0);
  }
  
  .portfolio-flexChild:active img {
      filter: brightness(0.6);
      transition: all 0.05s linear;
  }
  
  .portfolio-flexChild h4::after {
      background: rgba(0,0,0,0);
      content: "";
      left: 0;
      position: absolute;
      height: 100%;
      top: 0;
      width: 100%
  }
  
  .portfolio-flexChild h4{
      color: rgba(255,255,255,0.9);
      filter: brightness(1);
      font-variant: small-caps;
      margin: 0;
      margin-top: 0.5em;
      padding: 0;
      text-align: left;
      text-decoration: none;
      text-shadow: 0 3px 30px rgba(0,0,0,0.5);
      text-transform: lowercase;
      vertical-align: bottom;
      width: 100%;
  }
  
  .portfolio-flexChild:hover h4, .portfolio-flexChild:focus h4 {
      transition: none;
      text-shadow: 0 1px 6px rgba(0,0,0,0.8);
  }
  
  .portfolio-flexChild:active h4 {
      transition: all 0.2s ease;
      text-shadow:  0 1px 1px rgba(0,0,0,0.9);
  }
  
  .portfolio-flexChild h3 {
      bottom: 0;
      text-shadow: 0 3px 50px rgba(0,0,0,1);
      left: 0;
      margin: 0;
      padding: 0;
      position: relative;
      text-align: left;
      width: 100%;
  }
  
  .portfolio-flexChild:hover h3, .portfolio-flexChild:focus h3 {
      transition: none;
      text-shadow: 0 1px 6px rgba(0,0,0,0.9),
                   0 0 30px rgba(0,0,0,1);
  }
  
  .portfolio-flexChild:active h3 {
      transition: all 0.2s ease;
      text-shadow:  0 1px 1px rgba(0,0,0,0.9);
  }
  
.whiteText{
    color:white
}

.whiteLinks a {
    color:#FFF;
}

.whiteLinks a:hover {
    color:#FFF;
    filter:brightness(1.2);
    top:-2px
}

.whiteLinks a:active{
    text-shadow:0 0 0 rgba(255,255,255,0.1);
    top:1px
}

.whiteLinks .chip:hover {
    color: black;
}

.whiteLinks .chip:active {
    color: black;
}