@font-face {
    font-family: 'Nirmala UI';
    src: url('NirmalaUI.eot');
    src: url('NirmalaUI.eot?#iefix') format('embedded-opentype'),
        url('NirmalaUI.woff2') format('woff2'),
        url('NirmalaUI.woff') format('woff'),
        url('NirmalaUI.ttf') format('truetype'),
        url('NirmalaUI.svg#NirmalaUI') format('svg');
    font-weight: normal;
    font-style: normal;
}
h3 {
    margin: 0 0 14px 0;
    padding: 0;
    color: #333;
    font: normal 24px 'Open Sans', Helvetca, Arial, sans-serif;
    font-weight: 400;
    line-height: 30px;
}
a img{
    opacity: 1;
    transition: all 0.15s linear;
    -moz-backface-visibility: hidden;
    -moz-transform: rotate(0);
    box-shadow: 0 0 0 #000;
}
.col {
    display: inline-block;
    margin: 0 0 30px;
    font-family: 'Open Sans', Helvetca, Arial, sans-serif !important;
    font-size: 13px;
    vertical-align: top;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    line-height: 20px;
}
.col img {
    width: auto;
    height: auto;
    max-width: 100%;
}
.columns.portfolio{ display:flex; flex-wrap:wrap; margin-left: -15px; margin-right: -15px;}
.columns .col3.item{ width:33.3333333%; padding: 0 15px; }
.columns .col3.item .inner-item{
    background: #fff;
    -webkit-box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.14);
    -moz-box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.14);
    box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.14);
}
.columns.portfolio article div div {
    transition: all 0.4s ease-in-out 0s;
    -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter: alpha(opacity=0);
    opacity: 0;
    position: static;
    right: 0;
    bottom: 0;
    z-index: 2;
    width: 100%;
    height: 100%;
    background: rgba(255,132,0,0.8);
    text-align: center;
    background: none;
    text-align: right;
}
.columns.portfolio article div div.img img {
    display: block;
}
.columns.portfolio .inner-item div.img {
    position: relative;
    top: auto;
    left: auto;
    display: block !important;
    opacity: 1;
    max-height: 200px;
    overflow: hidden;
}
.columns.portfolio .inner-item div.img div {
    position: absolute;
    width: 70px;
    height: 70px;
    right: 0;
    bottom: 0;
    top: auto;
    left: auto;
}
.columns.portfolio article h3{ border-bottom: none; font-size: 1.385em; margin-bottom: 0; font-family: 'Open Sans', Helvetca, Arial, sans-serif !important; }
.columns.portfolio .inner-item h3 a {
    color: #333;
    display: block;
    font-size: 16px;
    line-height: 1.4em;
    padding: 25px 21px 23px;
    transition: all 0.4s ease-in-out 0s;
}
.columns.portfolio article:hover h3 a {
    color: #fff;
    background: #333;
    text-decoration: none;
}
.columns.portfolio article div ul {
    display: inline-block;
    overflow: hidden;
    position: relative;
    z-index: 3;
    top: 50%;
    list-style: none;
    margin: -20px auto 0;
    padding: 5px;
    border-radius: 20px;
    background: rgba(255,255,255,0.3);
    text-align: center;
}
.columns.portfolio article div ul {
    border-radius: 0;
    background: rgba(34, 34, 34, 0.6);
    bottom: 0;
    right: 0;
    margin: 0;
    top: auto;
    position: absolute;
    padding: 0;
}
.columns.portfolio article div div.img div ul {
    position: static;
}
.columns.portfolio article div ul li {
    display: inline-block;
    margin: 0 0 0 0px;
    padding: 0;
}
.columns.portfolio article div ul li a.view {
    background: url(search-large2.png) no-repeat 50% 50%;
    width: 70px;
    height: 70px;
	display: block;
	text-indent: -999999px;
}
.columns.portfolio article div div.img {
    position: relative;
    top: auto;
    left: auto;
    display: block !important;
    opacity: 1;
}
.columns.portfolio article div div.img a:hover img{
    opacity: 0.8;
    -moz-backface-visibility: hidden;
    -moz-transform: rotate(0);
}
.columns.portfolio article:hover div div {
    -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=1)";
    filter: alpha(opacity=1);
	opacity: 1; 
}
.related_project_wrap{ display:flex; flex-wrap: wrap; column-gap:10px; margin-bottom: 50px; }
.related_project_wrap .related_project{ width:calc(25% - 10px); }
h2.related_project_title{
	position:relative;
	text-align: center;
	color: #333333;
	font-family: "Playfair Display", Sans-serif;
	font-size: 32px;
	font-weight: 600;
	font-style: italic; margin-bottom: 20px; padding-bottom: 20px;
}
h2.related_project_title::after{ content: ""; position: absolute; height: 3px; width: 40px; background: #994C00; left: 50%; bottom: 0px; margin-left: -20px; }
.related_project a h3{
    font-size: 18px;
    text-align: center;
    display: block;
    line-height: 1.2;
    margin-top: 15px;
	color: #b50102 !important;
	font-family: "Nirmala UI", Georgia;
}