.widget_item_style_1 {
overflow: hidden; text-align: center;
}
.widget_item_style_1 .row-flex {
position: relative;
display: grid;
grid-template-columns: var(--item1-per-row);
gap:10px;
}
.widget_item_style_1 .item {
position: relative; overflow: hidden; text-align: center; background-position: center;
}
.widget_item_style_1 .item:before, .widget_item_style_1 .item:after {
/* content: "";
position: absolute;
background-repeat: no-repeat;
opacity: 0;
transition: all .5s;
-webkit-transform: scale(.1);
transform: scale(.1);
z-index: 0; */
}
.widget_item_style_1 .item:before {
/* background-image: url('views/theme-store/widget/item/image/item-before.png');
height: 100%;
top: -30px;
left: -30px;
width: 100%; */
}
.widget_item_style_1 .item:after {
/* background-image: url('views/theme-store/widget/item/image/item-after.png');
height: 290px;
bottom: -40px;
right: -30px;
width: 250px; */
}
.widget_item_style_1 .item.active:after, .widget_item_style_1 .item.active:before,
.widget_item_style_1 .item:hover:after, .widget_item_style_1 .item:hover:before {
/* opacity: 1;
-webkit-transform: scale(0.5);
transform: scale(0.5); */
}
.widget_item_style_1 .item .img {
height: var(--item1-height); text-align: center;
}
.widget_item_style_1 .item .img img {
width: auto; height: 100%; display: inline-block;
border-radius: 5px;padding:5px; margin-top: 5px;
}
.widget_item_style_1 .item .title {
text-align: center;
padding: 10px;
width: 70%;
margin: auto;
}
.widget_item_style_1 .item .title p.heading {
color: var(--item1-title); font-size: 15px; font-weight: 500; margin: 0 0 10px 0;
}
.widget_item_style_1 .item .title p.description {
color: var(--item1-des); font-size: 14px; line-height: 20px;
}
.widget_item_style_1 .item:hover .img img {
/* -webkit-animation: toTopFromBottom .5s forwards;
animation: toTopFromBottom .5s forwards; */
}
.widget_item_style_1 .item:hover .img img {
/* box-shadow: 0 0 10px 4px rgba(31,66,135,.1); */
}
@media (max-width: 768px) {
.widget_item_style_1 .row-flex {
grid-template-columns: var(--item1-per-row-tablet);
}
.widget_item_style_1 .item .img { height: 50px; }
.widget_item_style_1 .item .title {
width: 100%;
}
}
@media (max-width: 600px) {
.widget_item_style_1 .row-flex {
grid-template-columns: var(--item1-per-row-mobile);
}
.widget_item_style_1 .item .img { height: 50px; }
}
@media (max-width: 500px) {
.widget_item_style_1 .item .img { height: auto; }
}.widget_product_category_style_1 .item .img {
height: 150px!important;
text-align: center;
}
.widget_product_category_style_1 .item .img img {
width: 100%;
height: 100%;
object-fit: none;
}
.widget_product_category_style_1 .item .title .heading {
font-size: 15px; text-align: center; margin: 0;
font-family: var(--font-header);
font-weight: bold;
}
.widget_product_category_style_1 .item .title .heading a {
color:#fff;
}
.widget_product_category_style_1 .item
{
background-color: #323232;
border-radius: 10px;
padding: 20px 0;
}
.widget_product_category_style_1 .item:hover
{
box-shadow: -4px -4px 8px rgb(134 134 134 / 20%), 4px 4px 8px rgb(28 28 28 / 40%);
}
.widget_product_category_style_1 .col-product-cate
{
padding:10px;
}
.widget_product_category_style_1 .box-content
{
overflow: unset;
}
@media (max-width: 768px) {
.widget_product_category_style_1 .item .title .heading {
font-size: 15px;
}
.widget_product_category_style_1 .item .img img {
width: 100%;
height: 100%;
object-fit: scale-down;
}
.widget_product_category_style_1 .col-product-cate
{
padding: 5px;
}
.widget_product_category_style_1 .item .img {
height: 120px!important;
text-align: center;
}
.widget_product_category_style_1 .item {
padding: 5px 10px;
}
}
@media (max-width: 500px) {
.widget_product_category_style_1 .item .title .heading {
font-size: 13px;
}
}.widget_product_style_1 { overflow: hidden; }
.widget_product_style_1 .box-content { overflow: hidden; position: relative; }
.product-slider-horizontal .item { background-color: #FFF; margin-bottom: var(--bs-gutter-x); }
/* .widget_product_style_1 .container
{
max-width: 1420px;
} */.widget_post_style_1 .box-content { position: relative; }
.widget_post_style_1 .item .img { height: 300px; width: 100%; }
.widget_post_style_1 .item .img img { height: 100%; width: 100%; object-fit: cover; }
.widget_post_style_1 .item .title {
padding: 10px;
}
.widget_post_style_1 .item .title .header {
font-size: 15px; line-height: 22px; height: 60px; font-family: var(--theme-color);
margin: 0; color: #000;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 3; /* number of lines to show */
line-clamp: 2;
-webkit-box-orient: vertical;
}
.widget_post_style_1 .item .title .header a {
color: #fff; outline: none;
font-weight:500;
}
.widget_post_style_1 .item .title .header a:hover
{
color: #fff!important;
}
.widget_post_style_1 .item .title .description {
margin-bottom: 18px; height: 55px;
text-align: initial;
color: #687385;
}
.widget_post_style_1 .item .title .post-info {
margin: 0 0 20px 0;
}
.widget_post_style_1 .item .title .read-more a {
color:#000;display: inline-block; position: relative;
transition: all 0.3s;
}
.widget_post_style_1 .item .title .read-more i {
color:red;position: relative;top:1px;
}
.widget_post_style_1 .item .title .read-more a:hover {
padding-left: 20px; color:var(--theme-color);
}
.widget_post_style_1 .item:hover {
box-shadow: 0 4px 20px 0 rgba(0,0,0,0.2), 0 0 0 transparent;
}
.widget_post_style_1 .slick-list {margin: 0 -5px;}
.widget_post_style_1 .slick-slide>div {padding: 0 10px;}
@media (max-width: 1200px) {
.widget_post_style_1 .item .img { height: 250px; }
}
@media (max-width: 600px) {
.widget_post_style_1 .item {padding:0;margin: 10px;}
.widget_post_style_1 .item .img { height: 200px; }
}.widget_videos_style_1 .slick-slide {
margin: 0 10px 10px 10px;outline: none; overflow: hidden;
}
.widget_videos_style_1 .video-item .video-img {
position: relative; height: var(--video-height);overflow: hidden;outline: none;border-radius: 15px;transition: all 0.3s ease;
}
.widget_videos_style_1 .video-item:hover
{
box-shadow: 0 4px 20px 0 rgba(255, 255, 255, 0.2), 0 0 0 transparent;
}
.widget_videos_style_1 .video-item .video-img img {
width: 100%; height: 100%; object-fit: cover;outline: none;
}
.widget_videos_style_1 .video-title .heading {
margin: 10px 0;
}
.widget_videos_style_1 .video-title .heading a {
color:#fff; font-size: 15px; outline: none;font-weight: 500;
}
.widget_videos_style_1 .play-now {
position: absolute;
left: 50%;
top: 50%;
display: block;
border-radius: 50%;
z-index: 10;
width: 60px;
height: 60px;
-webkit-transform: translateX(-50%) translateY(-50%);
transform: translateX(-50%) translateY(-50%);
transform-origin: center center;
}
.widget_videos_style_1 .play-now .icon {
position: absolute;
left: 50%;
top: 50%;
height: 65px;
width: 65px;
text-align: center;
line-height: 65px;
color: #fff;
z-index: 1;
font-size: 20px;
padding-left: 5px;
display: block;
-webkit-transform: translateX(-50%) translateY(-50%);
transform: translateX(-50%) translateY(-50%);
-webkit-transform-origin: center;
transform-origin: center center;
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
-ms-border-radius: 50%;
-o-border-radius: 50%;
border-radius: 50%;
-webkit-box-shadow: 0 5px 10px 0 rgba(255, 255, 255, .1);
-moz-box-shadow: 0 5px 10px 0 rgba(255, 255, 255, .1);
-ms-box-shadow: 0 5px 10px 0 rgba(255, 255, 255, .1);
-o-box-shadow: 0 5px 10px 0 rgba(255, 255, 255, .1);
box-shadow: 0 5px 10px 0 rgba(255, 255, 255, .1);
background-color: red;
}
.widget_videos_style_1 .play-now .ripple,
.widget_videos_style_1 .play-now .ripple:before,
.widget_videos_style_1 .play-now .ripple:after {
position: absolute;
top: 50%;
left: 50%;
height: 65px;
width: 65px;
-webkit-transform: translateX(-50%) translateY(-50%);
transform: translateX(-50%) translateY(-50%);
-webkit-transform-origin: center;
transform-origin: center center;
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
-ms-border-radius: 50%;
-o-border-radius: 50%;
border-radius: 50%;
-webkit-box-shadow: 0 0 0 0 rgba(255, 255, 255, .3);
-moz-box-shadow: 0 0 0 0 rgba(255, 255, 255, .3);
-ms-box-shadow: 0 0 0 0 rgba(255, 255, 255, .3);
-o-box-shadow: 0 0 0 0 rgba(255, 255, 255, .3);
box-shadow: 0 0 0 0 rgba(255, 255, 255, .3);
-webkit-animation: ripple 3s infinite;
-moz-animation: ripple 3s infinite;
-ms-animation: ripple 3s infinite;
-o-animation: ripple 3s infinite;
animation: ripple 3s infinite;
}
.widget_videos_style_1 .play-now .ripple:before {
-webkit-animation-delay: .9s;
-moz-animation-delay: .9s;
-ms-animation-delay: .9s;
-o-animation-delay: .9s;
animation-delay: .9s;
content: "";
position: absolute;
}
.widget_videos_style_1 .play-now .ripple:after {
-webkit-animation-delay: .6s;
-moz-animation-delay: .6s;
-ms-animation-delay: .6s;
-o-animation-delay: .6s;
animation-delay: .6s;
content: "";
position: absolute;
background-color: var(--theme-color);
}
.widget_videos_style_1 .video-item:hover .video-img {
box-shadow: 0 4px 20px 0 rgba(0,0,0,0.2), 0 0 0 transparent;
}
@media (max-width: 600px) {
.widget_videos_style_1 .video-item .video-img {
height: 250px;
}
}.widget_box_gallery_1 .grid {
display: grid;
grid-template-columns: var(--gallery-1-template);
grid-gap: var(--gallery-1-grid-gap);
}
.widget_box_gallery_1 .grid-item {
height: 300px;
overflow: hidden;
}
.widget_box_gallery_1 .grid-item img{
width: 100%; height: 100%; object-fit: cover;
}
@media(max-width: 600px) {
.widget_box_gallery_1 .grid {
display: grid;
grid-template-columns: [col1] auto [col2] auto [end];
}
.widget_box_gallery_1 .grid-item {
height: 200px;
}
}.widget_item_style_18 .row-item {
position: relative;
display: grid;
grid-template-columns: repeat(var(--item18-per-row), 1fr);
grid-gap: 20px;
}
.widget_item_style_18 .item {
box-shadow: 0 0 5px #ccc;
border-radius: 3px;
position: relative;
padding: 15px;
text-align: center;
}
.widget_item_style_18 .item a {
position: relative;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
.widget_item_style_18 .item .img {
height: 100px;
}
.widget_item_style_18 .item .img img {
width: 100%; height: 100%; object-fit: contain;
}
.widget_item_style_18 .item .title {
text-align: center;
}
.widget_item_style_18 .item .title .heading {
font-size: 16px;
font-weight: 700;
margin: 10px 0 0 0;
color: var(--item18-title-color);
text-transform: uppercase;
}
.widget_item_style_18 .item .title .divider .circle{
border: 2px solid var(--item18-divider-color);
height: 6px;
width: 6px;
border-radius: 50%;
margin: 10px auto 0 auto;
}
.widget_item_style_18 .item .title .divider .line{
width: 30%;
margin: 10px auto 0 auto;
height: 2px;
background-color: var(--item18-divider-color);
}
.widget_item_style_18 .item .title p.description {
font-size: 14px;
line-height: 20px;
color: var(--item18-des-color);
margin: 10px 0 0 0 ;
}
.widget_item_style_18 .item .title .readmore{
display: inline-block;
padding: 5px;
background-color: var(--theme-color);
position: relative;
margin-top: 10px;
}
.widget_item_style_18 .item .title .readmore:before{
content: '';
position: absolute;
width: 20%;
height: 1px;
background-color: #000;
top: 5px;
left: 5px;
transition: 200ms;
}
.widget_item_style_18 .item .title .readmore:after {
content: '';
position: absolute;
width: 20%;
height: 1px;
background-color: #000;
bottom: 5px;
right: 5px;
transition: 200ms;
}
.widget_item_style_18 .item .title .readmore:hover::before,
.widget_item_style_18 .item .title .readmore:hover::after{
width: calc(100% - 10px);
}
.widget_item_style_18 .item .title .readmore span{
display: inline-block;
padding: 5px 20px;
position: relative;
color: #000;
}
.widget_item_style_18 .item:before, .widget_item_style_18 .item:after {
content: "";
position: absolute;
background-repeat: no-repeat;
opacity: 0;
transition: all .5s;
-webkit-transform: scale(.1);
transform: scale(.1);
z-index: 0;
}
.widget_item_style_18 .item:before {
background-image: url('views/theme-store/widget/item/image/item-before.png');
height: 100%;
top: -30px;
left: -30px;
width: 100%;
}
.widget_item_style_18 .item:after {
background-image: url('views/theme-store/widget/item/image/item-after.png');
height: 290px;
bottom: -40px;
right: -30px;
width: 250px;
}
.widget_item_style_18 .item.active:after, .widget_item_style_18 .item.active:before,
.widget_item_style_18 .item:hover:after, .widget_item_style_18 .item:hover:before {
opacity: 1;
-webkit-transform: scale(0.5);
transform: scale(0.5);
}
@media (max-width: 1000px) {
.widget_item_style_18 .row-item {
position: relative;
display: grid;
grid-template-columns: repeat(var(--item18-per-row-tablet), 1fr);
grid-gap: 20px;
}
}
@media (max-width: 600px) {
.widget_item_style_18 .row-item {
position: relative;
display: grid;
grid-template-columns: repeat(var(--item18-per-row-tablet), 1fr);
grid-gap: 20px;
}
}:root{
--item-9-img-width: 80px;
}
.widget_item_style_9{
margin-top: 30px;
margin-bottom: 30px;
}
.widget_item_style_9 .container{
border: 1px solid #fff;
border-radius: 15px;
padding: 0;
max-width: 1280px;
}
.widget_item_style_9 .header-title{
margin-bottom: 25px;
width: 91%;
margin: auto;
border-bottom: 1px solid #fff;
}
.widget_item_style_9 .item{
position: relative;
margin-left: calc(var(--item-9-img-width) / 8);
padding-left: 0px;
padding-right: 15px;
height: 100px;
line-height: 30px;
-webkit-border-radius: 20px;
-moz-border-radius: 20px;
border-radius: 20px;
/* background-color: #ebebeb; */
display: flex;
align-items: center;
font-weight: 500;
}
.widget_item_style_9 .item:before{
display: none;
position: absolute;
content: '';
width: var(--item-9-img-width);
padding-bottom: calc(var(--item-9-img-width) * 1.5);
background-image: var(--item-9-img-link);
background-repeat: no-repeat;
-webkit-background-size: contain;
background-size: contain;
z-index: 1;
top: 50%;
left: calc(var(--item-9-img-width) / 8 * -1);
-webkit-transform: translate(0, -50%);
-moz-transform: translate(0, -50%);
-ms-transform: translate(0, -50%);
-o-transform: translate(0, -50%);
transform: translate(0, -50%);
}
.widget_item_style_9 .item .count{
position: absolute;
left: 30px;
top: 50%;
-webkit-transform: translate(0, -50%);
-moz-transform: translate(0, -50%);
-ms-transform: translate(0, -50%);
-o-transform: translate(0, -50%);
transform: translate(0, -50%);
z-index: 2;
color: #fff;
font-size: 22px;
font-weight: bold;
}
.widget_item_style_9_content{
display: grid;
grid-template-columns: 1fr 1fr;
grid-template-rows: auto;
gap: 15px;
margin: 0 50px;
padding: 30px 0;
}
.widget_item_style_9_content .content .title
{
font-weight: 600;
}
.widget_item_style_9_content .content .title a
{
font-weight: 400;
}
.widget_item_style_9_content .content .title,
.widget_item_style_9_content .content .description
{
color:#fff;
font-size: 15px;
}
@media (max-width: 767px) {
.widget_item_style_9_content{
display: grid;
grid-template-columns: 1fr;
grid-template-rows: auto;
gap: 15px;
}
.widget_item_style_9 .container{
border: unset;
border-radius: unset;
padding: 0 30px;
}
.widget_item_style_9_content{
margin: 0 0px;
padding: 10px 0;
}
}