#portfolio-grid .portfolio .inner{
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  transition: all 0.3s ease;  
  border-radius: 0px;
  position: relative;
  overflow: hidden;
}
#portfolio-grid .portfolio .inner:hover{
  border-radius: 2px;
  margin-top:-4px;
  box-shadow:0px 3px 6px 1px rgba(0,0,0,0.05);
}
a.mag{
  border:none;
}
article.new .inner:after{
  font-weight: 600;
  text-align: center;
  -webkit-transform: rotate(35deg);
  -moz-transform:    rotate(35deg);
  -ms-transform:     rotate(35deg);
  -o-transform:      rotate(35deg);
  transform:         rotate(35deg);
  display: block;
  content:'New';
  pointer-events: none;
  position: absolute;
  padding: 7px 0;
  right: -31px;
  top: 4px;
  width: 130px;
  background-color: #eeeeef;
  color: #ef6250;
  box-shadow: 0px 0px 3px rgba(0,0,0,0.2);
}
.avprofile{
  border: 2px solid #ccc;
  border-radius: 50%;
  overflow: hidden;
  width: 180px;
  float: right;
  margin: 24px 16px;
}
.avprofile img{
  opacity: 0.85;
}
.imgside{
  width:180px;
  float:right;
  margin:24px;
}

.copyright{
  text-align: center;
}
.copyright h3{
  font-family: 'Josefin Slab';
  font-size: 42px;
  color: #bbb;
  font-weight: 400;
  left: 16px;
  position: absolute;
  top: 16px;
  display: none;
}
.copyright.home h3{
  display: block;
}

.copyright p{
  margin:0;
  font-size:14px;
  color:#aaa;
}

.copyright span{
  display: block;
  margin: 0 0 12px 0;
  color: #dadada;
  font-size: 14px;
  line-height: 18px;
}

.copyright span a{
  color:#262626;
}

.copyright span a:hover{
  color:#ef6250;
}

.copyright.home p{
  margin-top:6px;
}
.copyright.home{
  text-align: right;
}

.copyright.home h3{
  top:8px;
}

.copyright.home span{
  display: none;
}

.project ul,
.project ol{
  margin:12px 0;
  display: inline-block;
  width: 100%;
}

.project ol li,
.project ul li{
  list-style-position: outside;
  margin: 16px 24px;
  padding: 0 12px;
  font-size:16px;
  line-height: 24px;
  color: #6b6b6b;
}

.project ul.lg,
.project ol.lg{
  margin:-6px 0 12px 0;
}

.project ul.lg li,
.project ol.lg li{
  font-size:19px;
  line-height: 34px;
  padding-bottom:6px;

}

.project ol li{
  list-style-type: decimal;
}
.project ul li{
  list-style-type: circle;
}
.project ol li strong,
.project ul li strong{
  font-weight: 600;
  color:#444;
}

.project p{
  line-height: 28px;
  font-size: 18px;
  color:#1c1c1c;
}

.project p.tldr{ 
  padding: 20px 36px 20px 70px;
  background: #fffaf6;
  position: relative;
  display: inline-block;
  margin-left: -20px;
}

.project p.tldr::before{
  position: absolute;
  content: 'tldr';
  font-size: 18px;
  font-style: italic;
  color: #a54438;
  left: 20px;
  top: 20px;
}
.project .projectintro p{
  line-height: 26px;
  font-size: 16px;
  color:#333;
}

.cutout{
  background:#e8e8ea;
  background:#f8f8fb;
  /*background:linear-gradient(#eaeaec, #efeff2 25%);*/
  box-shadow: 0px 1px 2px 1px rgba(0,0,0,0.1);
  border-radius: 6px;
  padding:12px;
  position: relative;
}
.cutout img{
  width:80%;
  margin:0px 10% 20px;
  display: inline-block;
  box-shadow: 0px 1px 1px 1px rgba(0,0,0,0.15);
}
.drop{
  margin-top: 60px;
}
.cutout ul{
  text-align: center;
  margin:0;
}
.cutout ul li{
  list-style: none;
  padding: 0;
  margin: 16px 4px;
}
.cutout h6{
  display: block;
  margin: 16px 0 0;
  text-align: center;
  line-height: 24px;
  font-size: 18px;
  font-weight: 600;
  color: #5f5f5f;
}
.cutout h6 i{
  font-size:18px;
  margin-right: 8px;
}
.cutout a{
  font-size:18px;
}

.project h2, .aboutintro h2{
  margin: 24px 0;
  display: inline-block;
  font-size: 24px;
  letter-spacing: 0.1px; 
}
.cutout .fourfive{
  font-size:15px;
  margin-left: 10px;
}
.fourfive{
  transform:rotate(45deg);
  -webkit-transform:rotate(45deg);
  -moz-transform:rotate(45deg);
  -o-transform:rotate(45deg);
  -ms-transform:rotate(45deg);  
}
.project h1, .aboutintro h1{
  font-size: 30px;
  margin: 24px 0 48px;
  letter-spacing: 0.1px;
}

.project figure{
  margin:12px 0;
  text-align: center;
}
.project figure.video-half{
  margin-right:1%;
}

.project figure a:hover{
  cursor:zoom-in;
}

.project figure.bare >img{
  box-shadow: none;
  border-radius: 0;
  border:none;
}

.project figure figcaption{
  font-size:15px;
  color:#555;
  text-align: center;
  line-height: 30px;
  padding: 0;
  margin:16px 0;
  position: relative;
  font-style: italic;
}

.project .invert figure figcaption{
  color:#efefef;
}

.project figcaption.top{
  margin-top:0;
}

.project figcaption.link{
  
}

.project figcaption.link a{
  position: absolute;
  right:0;
  text-align: center;
  padding: 4px 16px;
  box-shadow: 0px 0px 1px 0px rgba(0,0,0,0.1);
  border:1px solid #ddd;
  border-radius: 8px;
  line-height: 22px;
  font-style: normal;
  font-size: 16px;
}
.project figcaption.link a:hover{
  background: #f4f4f9;
  border-bottom: 1px solid #b3b7bf;
  color: #6e7596;
}

.project > div{ 
  /*margin:12px 0;*/
}
.project .col-spread{
  display: inline-block;
  background: #f7f7f7;
  box-shadow: 0px 1px 6px 0px rgba(0,0,0,0.1);
  border-radius: 4px;
  margin:42px 0;
  width:100%;
}
@media screen and (min-width:1200px){
  .project .col-spread{
    margin: 48px 0;
    width: calc(100% + 1800px);
    position: relative;
    left: -900px;
    padding: 24px 900px;
  }
  #site-body img.projectlogo{
    max-width: 80%;
    margin: 42px auto 0;
    display: block;
  }
  #site-logo{ 
    
  }
  .projectintro{
    margin:0 15px 48px;
    width: calc(100% + 1800px);
    position: relative;
    left: -900px;
    display: inline-block;
    /*background: linear-gradient(#eeeeef, #eeeeef 90%, #ffffff);*/
    border-bottom:2px solid #ddd;
    padding: 0px 900px 64px;
    box-shadow: 0px 1px 1px 0px rgba(255, 255, 255, 0.1);
  }
}
@media screen and (max-width:1199px){
  .project .col-spread{
    /*
    width:110%;
    margin:36px -5% 36px -5%;
    */
    padding: 12px;
  }
  .project .col-spread > div{
    margin:12px 0;
  }
}

.project > div:first-of-type{
  margin-top: 0;
}