/*css to control portfolio main section on main page*/
/***COLORS***/
/* get transparency with the following:  rgba($color, .5)  */
#workFlow {
  text-align: center; }

section#Section-3 .page-header {
  border-bottom-color: #bbb;
  text-align: left; }

.kelty-col {
  width: 220px;
  height: 220px;
  display: inline-block;
  text-align: right;
  margin: 1.5%; }

.kelty-col a {
  width: 220px;
  height: 220px; }

.kelty-col h2 {
  color: white;
  font-size: 1.8em;
  font-weight: 300; }

#comingSoon {
  font-size: 7vw;
  margin: 8vh 0 8vh;
  color: #BCCBBB;
  text-shadow: 0.07em 0.07em white; }

.kelty-col a {
  text-decoration: none; }

/*OVERLAY ROLL OVERS*/
/*navy*/
.overlayNavy {
  width: 220px;
  height: 220px;
  background: rgba(64, 82, 112, 0.75);
  text-align: center;
  opacity: 0;
  padding: 70px 0 90px 0;
  -webkit-transition: opacity 0.25s ease;
  border-radius: 200px; }

.kelty-col:hover .overlayNavy {
  opacity: 1; }

/*aqua*/
.overlayAqua {
  width: 220px;
  height: 220px;
  background: rgba(112, 178, 154, 0.75);
  text-align: center;
  opacity: 0;
  padding: 70px 0 90px 0;
  -webkit-transition: opacity 0.25s ease;
  border-radius: 200px; }

.kelty-col:hover .overlayAqua {
  opacity: 1; }

/*yellow*/
.overlayYellow {
  width: 220px;
  height: 220px;
  background: rgba(221, 170, 52, 0.75);
  text-align: center;
  opacity: 0;
  padding: 70px 0 90px 0;
  -webkit-transition: opacity 0.25s ease;
  border-radius: 200px; }

.kelty-col:hover .overlayYellow {
  opacity: 1; }

.afterProjects {
  margin-top: 50px;
  margin-right: 2em; }