#portfolio{position:relative}#portfolio .case-studies{display:relative}#portfolio .case-studies .single-case{flex:33%;float:left;height:500px;max-width:50%;position:relative;width:100%}#portfolio .case-studies .only-case .single-case{max-width:100%}#portfolio .case-studies .single-case:before{background:rgba(0,0,0,.5);bottom:0;content:"";left:0;opacity:0;position:absolute;right:0;top:0;transition:.5s;z-index:8}#portfolio .case-studies .single-case:after{background:#000;background:linear-gradient(180deg,transparent,rgba(0,0,0,.9));bottom:0;content:"";display:table;height:35%;position:absolute;width:100%;z-index:0}#portfolio .case-studies .single-case:hover:before{opacity:1;transition:.5s}#portfolio .case-studies .single-case .text{bottom:60px;left:45px;margin:auto;padding-left:15px;padding-right:15px;position:absolute;right:45px;text-align:left;transition:.5s;word-break:break-word;z-index:99}#portfolio .case-studies .single-case .read-more{display:flex;opacity:0;position:absolute;right:0;top:120px;transform:rotate(270deg);transition:.5s}#portfolio .case-studies .single-case .read-more p{color:#fff;font-size:15px;font-weight:500;line-height:3;margin:0;text-transform:uppercase}#portfolio .case-studies .single-case .read-more img{margin-left:15px}#portfolio .case-studies .single-case:hover .read-more{opacity:0;transition:.5s;z-index:99}#portfolio .case-studies .single-case:hover .text{transition:.5s}#portfolio .case-studies .single-case .text p{color:#fff;margin-bottom:5px}#portfolio .case-studies .single-case .text p.title{color:#fff;font-size:40px;line-height:1.3;margin-bottom:5px}@keyframes fade_in_show{0%{opacity:0;transform:scale(0)}to{opacity:1;transform:scale(1)}}#portfolio .case-studies .single-case .img{aspect-ratio:1/1;height:100%;object-fit:cover;width:100%}@media (min-width:320px) and (max-width:768px){#portfolio .case-studies .single-case{flex:100%;height:280px;max-width:100%}#portfolio .case-studies .single-case .text p.title{color:#fff;font-size:33px;margin-bottom:5px}#portfolio .case-studies .single-case .read-more{right:-30px;top:90px}#portfolio .case-studies .single-case .text{bottom:15px;left:10px;margin:auto;padding-left:10px;padding-right:10px;right:30px}}