File: //proc/thread-self/root/proc/self/cwd/wp-content/themes/kidzieo/css/service/service-style-4.css
.pbmit-element-service-style-4 .pbmit-service-inner {
padding: 0;
list-style: none;
display: grid;
-ms-grid-columns: 1fr 1fr 1fr;
grid-template-columns: repeat(3,1fr);
grid-gap: 40px;
}
.pbmit-element-service-style-4 .pbmit-title-box-wrap {
display: flex;
align-items: center;
position: relative;
}
.pbmit-element-service-style-4 .pbmit-service-inner li {
display: inline-flex;
margin: auto;
}
.pbmit-element-service-style-4 .pbmit-service-icon-wrapper {
padding-right: 20px;
font-size: 50px;
line-height: 50px;
color: var(--pbmit-kidzieo-global-color);
}
.pbmit-element-service-style-4 .pbmit-service-icon-wrapper svg{
fill: var(--pbmit-kidzieo-global-color);
}
.pbmit-element-service-style-4 .pbmit-service-icon-wrapper img {
max-width: 50px;
}
.pbmit-element-service-style-4 .pbmit-service-title {
font-size: 24px;
line-height: 30px;
margin: 0;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 1;
line-clamp: 1;
-webkit-box-orient: vertical;
}
.pbmit-element-service-style-4 .pbmit-featured-wrapper img {
opacity: 0;
visibility: hidden;
transition: all 500ms ease;
position: absolute;
top: 50%;
right: -100px;
height: 150px;
width: 150px;
border-radius: 10px;
z-index: 2;
-khtml-transform: translateX(0%) translateY(-50%) scale(0) rotate(-10deg);
-moz-transform: translateX(0%) translateY(-50%) scale(0) rotate(-10deg);
-ms-transform: translateX(0%) translateY(-50%) scale(0) rotate(-10deg);
-o-transform: translateX(0%) translateY(-50%) scale(0) rotate(-10deg);
transform: translateX(0%) translateY(-50%) scale(0) rotate(-10deg);
}
.pbmit-element-service-style-4 .pbmit-service-inner li:hover .pbmit-featured-wrapper img {
opacity: 1;
visibility: visible;
-khtml-transform: translateX(0%) translateY(-50%) scale(1) rotate(-10deg);
-moz-transform: translateX(0%) translateY(-50%) scale(1) rotate(-10deg);
-ms-transform: translateX(0%) translateY(-50%) scale(1) rotate(-10deg);
-o-transform: translateX(0%) translateY(-50%) scale(1) rotate(-10deg);
transform: translateX(0%) translateY(-50%) scale(1) rotate(-10deg);
}
@media (max-width:1366px) {
.pbmit-element-service-style-4 .pbmit-featured-wrapper img {
right: -70px;
}
}
@media (max-width:1200px) {
.pbmit-element-service-style-4 .pbmit-featured-wrapper img {
right: -40px;
}
}
@media (max-width:1024px) {
.pbmit-element-service-style-4 .pbmit-featured-wrapper img {
right: -20px;
}
}
@media (max-width:991px) {
.pbmit-element-service-style-4 .pbmit-service-inner {
grid-template-columns: repeat(2,1fr);
}
.pbmit-element-service-style-4 .pbmit-featured-wrapper img {
right: -10px;
}
}
@media (max-width:575px) {
.pbmit-element-service-style-4 .pbmit-service-inner {
grid-template-columns: repeat(1,1fr);
}
.pbmit-element-service-style-4 .pbmit-service-inner li {
margin: 0;
}
}