.portfolio__single{ border-radius:4px; position:relative; overflow:hidden; z-index:0; -webkit-border-radius:4px; -moz-border-radius:4px; -ms-border-radius:4px; -o-border-radius:4px; }
.portfolio--3 .portfolio__single__img{ border-radius:4px; overflow:hidden; -webkit-border-radius:4px; -moz-border-radius:4px; -ms-border-radius:4px; -o-border-radius:4px; position: relative;}
.portfolio--3 .portfolio__single__img .case-logo{position: absolute;top: 15px;left: 15px;width: 100px;background: var(--tw-white);padding: 5px;border-radius: 4px;z-index: 1;}
.portfolio--3 .portfolio__single{padding:15px}
@media only screen and (min-width: 992px) and (max-width: 1199px),only screen and (min-width: 768px) and (max-width: 991px) {
.portfolio--3 .portfolio__single__img{border-radius:12px}
}
@media only screen and (min-width: 576px) and (max-width: 767px),(max-width: 575px) {
.portfolio--3 .portfolio__single__img{ border-radius:4px; -webkit-border-radius:4px; -moz-border-radius:4px; -ms-border-radius:4px; -o-border-radius:4px; }
}
.portfolio--3 .portfolio__single__img img{width:100%;height:100%;-o-object-fit:cover;object-fit:cover}
.portfolio--3 .portfolio__single__content{position:static;-webkit-transform:none;-ms-transform:none;transform:none;opacity:1;visibility:visible;padding:0;padding-top:20px;display:-webkit-box;display:-ms-flexbox;display:flex;gap:10px;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;-webkit-box-align:center;-ms-flex-align:center;align-items:center}
@media only screen and (min-width: 576px) and (max-width: 767px),(max-width: 575px) {
.portfolio--3 .portfolio__single__content{padding:0;padding-top:20px}
}
@media (max-width: 575px) {
.portfolio--3 .portfolio__single__content{-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}
}
.portfolio--3 .portfolio__single__tag{color: #333;font-size: 15px;display: inline-block;margin-bottom: 15px;}
.portfolio--3 .portfolio__single__tag:hover{color:var(--tw-main)!important}
.portfolio--3 .portfolio__single__title{color: var(--tw-main2);font-size: 20px;margin: 0;font-weight: 600;line-height: 28px;}
.portfolio--3 .portfolio__single__title:hover a{letter-spacing:inherit;color:var(--tw-main)}
.portfolio--3 .portfolio__single::after{display:none}
.portfolio--3 .portfolio__single__action a{visibility:visible;opacity:1;position:static;-webkit-transform:none;-ms-transform:none;transform:none;border-color:var(--tj-color-border-1);color:var(--tw-main);-webkit-transform:rotate(-45deg);-ms-transform:rotate(-45deg);transform:rotate(-45deg)}
.portfolio--3 .portfolio__single__action a i{color:var(--tw-main)}
.portfolio--3 .portfolio__single__action a:hover{border-color:transparent}
.portfolio--3 .portfolio__single__action a:hover i{color:var(--tw-white)}
.portfolio--3 .portfolio__single:hover .portfolio__single__tag{border-color:var(--tj-color-border-1);color:var(--tw-main)}
.portfolio--3 .portfolio__single:hover .portfolio__single__action a{background:var(--tw-main);-webkit-transform:rotate(315deg);-ms-transform:rotate(315deg);transform:rotate(315deg)}
.portfolio--3 .portfolio__single:hover .portfolio__single__action a i{color:var(--tw-white)}
.portfolio__single__action a{position:absolute;top:30px;right:30px;width:45px;height:45px;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;background-color:transparent;-webkit-transform:translateX(100%);-ms-transform:translateX(100%);transform:translateX(100%);opacity:0;border:1px solid var(--tw-white);border-radius:100%;line-height:1;z-index:2}
@media only screen and (min-width: 992px) and (max-width: 1199px),only screen and (min-width: 768px) and (max-width: 991px) {
.portfolio__single__action a{top:20px;right:20px;width:40px;height:40px}
}
@media only screen and (min-width: 576px) and (max-width: 767px),(max-width: 575px) {
.portfolio__single__action a{top:20px;right:20px;width:40px;height:40px}
}
.portfolio__single__action a i{display:inline-block;font-size:16px;color:var(--tw-white)}
@media only screen and (min-width: 992px) and (max-width: 1199px),only screen and (min-width: 768px) and (max-width: 991px) {
.portfolio__single__action a i{font-size:14px}
}
@media only screen and (min-width: 576px) and (max-width: 767px),(max-width: 575px) {
.portfolio__single__action a i{font-size:14px}
}
.portfolio__single__action a:hover{border-color:var(--tw-white);background-color:transparent;color:var(--tw-white);-webkit-transform:translateX(0) rotate(360deg)!important;-ms-transform:translateX(0) rotate(360deg)!important;transform:translateX(0) rotate(360deg)!important}
.portfolio__single__action a:hover i{color:var(--tw-white)}
.portfolio__single:hover .portfolio__single__img img.thumbs{ -webkit-transform:scale(1.1); -ms-transform:scale(1.1); transform:scale(1.1); -moz-transform:scale(1.1); -o-transform:scale(1.1); }