.widget-snippet .project-image-area {
    width: 100%;

}
.widget-snippet .project-container {
    max-width: 1900px;
 
    margin: 0 auto;
    display: flex;
    flex-wrap: wrap;
}

.widget-snippet .project-container .left-area {
    max-width: 50%;
    padding: 10px;
}

.widget-snippet .left-area a.image {
    position: relative;
    width: 100%;
    height: 100%;
    display: block;
}
.widget-snippet .project-container .right-area {
    max-width: 50%; 
    display:flex;
    flex-wrap:wrap;
}
.widget-snippet .right-area a.image {
    padding: 8px 10px;
    width: 50%;
    height: 50%;
    display: block;
    position: relative;
}
.widget-snippet .content-title {
    position: absolute;
    content: '';
    display: block;
    bottom: 18px;
    left: 17px;
    padding: 20px;
    z-index:1;
}

.widget-snippet .content-title h5 {
    color: white;
    font-family: 'Graphik';
    font-size: 21px;
    font-weight: normal;
}
.widget-snippet .content-title h5::after {
    content: url(/template/d1e69aa0/image/link-right-white.png);
    margin-left: 10px;
    vertical-align: middle;
}
.widget-snippet .content-title h5:hover{ 
 color:#E8542C;
 
}
.widget-snippet .content-title h5:hover:after{
  content: url(/template/d1e69aa0/image/link-right-large-orange.png);
}

body.widget-snippet .project-image-area{
  padding:20px;
}
.widget-snippet .left-area a.image div.box, .widget-snippet .right-area a.image div.box {
      position: relative;
      width: 100%;
    height: 100%;
}
.widget-snippet .left-area a.image div.box:after, .widget-snippet .right-area a.image div.box:after  {
    position: absolute;
    content: "";
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: rgb(0,0,0);
    background: linear-gradient(21deg, rgba(0,0,0,1) 0%, rgba(248,248,248,0) 90%); 
}
body.widget-snippet .left-area a.image div.box:after, body.widget-snippet .right-area a.image div.box:after  {
display: none
}
body.widget-snippet .content-title {
    z-index:unset;
}
.widget-snippet .left-area a.image:hover div.box:after, .widget-snippet .right-area a.image:hover div.box:after  {
    background: rgb(0,0,0);
    background: linear-gradient(21deg, rgba(0,0,0,1) 0%, rgba(248,248,248,0) 60%);

}