.custom_tag_hellowrap {
background: var(--black-bg);
padding: 10px;
position: relative;
display: flex;
flex-direction: column;
margin-bottom: 20px
}
.custom_tag_hellowrap p, .custom_tag_hellowrap img {
padding: 0 !important;
margin: 0 !important;
line-height: 0 !important;
}
.custom_tag_helloimg {
height: 120px;
width: 70%;
overflow: hidden
}
.custom_tag_helloimg img {
width: 100%;
height: 100%;
object-fit: cover;
filter: grayscale(100%);
transition: all .3s cubic-bezier(.64, .51, .55, 1.16) 0s
}
.custom_tag_helloimg:before {
content: "";
background: var(--base-bg2);
display: block;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 1;
transition: all .3s cubic-bezier(.64, .51, .55, 1.16) 0s
}
.custom_tag_helloimg:after {
content: "";
background: var(--base-bg3);
display: block;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
mix-blend-mode: screen;
transition: all .3s cubic-bezier(.64, .51, .55, 1.16) 0s
}
.custom_tag_hellowrap:hover .custom_tag_helloimg:after, .custom_tag_hellowrap:hover .custom_tag_helloimg:before {
opacity: 0;
}
.custom_tag_hellowrap:hover .custom_tag_helloimg img {
filter: none
}
.custom_tag_hellotext {
background: red;
z-index: 10;
position: absolute;
top: 10px;
right: 10px;
background: var(--black-bg2);
width: 40%;
height: calc(100% - 20px);
display: flex;
align-items: center;
justify-content: center;
padding: 30px 50px 30px 30px;
box-sizing: border-box;
flex-direction: column;
align-items: flex-end
}
.custom_tag_hellotext p {
line-height: 150% !important;
}
.custom_tag_hellotext:after {
content: "";
background: var(--black-bg2);
width: 67px;
height: 100%;
position: absolute;
display: block;
top: 0;
left: -67px;
clip-path: polygon(100% 0, 0% 100%, 100% 100%);
-webkit-clip-path: polygon(100% 0, 0% 100%, 100% 100%);
}
.custom_tag_hellotext:before {
content: "welcome to hight city";
background: var(--logo);
background-clip: text !important;
-webkit-background-clip: text !important;
-moz-background-clip: text !important;
-o-background-clip: text !important;
color: transparent;
font: normal 20px var(--font-a);
}
