/*
Theme Name: Flatsome Child
Description: This is a child theme for Flatsome Theme
Author: UX Themes
Template: flatsome
Version: 3.18.2
*/
/*************** ADD CUSTOM CSS HERE. ***************/
.nav-pagination{margin-bottom:30px !important;}
.so-sao-wrapper{margin-bottom:15px;}
.so-sao .star{font-weight:bold;}
.so-sao .star .active i {
color: #f1c40f;
}
.so-sao .star .half-active i{
color: #d4d4d4;
position: relative;
display: inline-block;
}
.so-sao .star .half-active i::after {
content: "\f005";
color: rgb(241, 196, 15);
position: absolute;
left: 0px;
width: 50%;
overflow: hidden;
}
.so-sao .star .in-active i{color:#d4d4d4}
:root {
--main-color: var(--primary-color);
--sc-color: var(--fs-color-secondary);
--color-black: #000000;
--color-white: #ffffff;
--color-grey: #cccccc;
--FontAwesome: 'Font Awesome 5 Free';
--font-poppins: 'Poppins';
}
@font-face{
font-family:'MTL';
src:url(/wp-content/themes/flatsome-child/fonts/Montserrat-Light.ttf) format('truetype');
}
@font-face {
font-family: 'Poppins';
src: url('/wp-content/themes/flatsome-child/fonts/fz-poppins-bold.ttf') format('truetype');
font-weight: bold;
}
@font-face {
font-family: 'Poppins';
src: url('/wp-content/themes/flatsome-child/fonts/fz-poppins-extrabold.ttf') format('truetype');
font-weight: 1000;
}
@font-face {
font-family: 'Poppins';
src: url('/wp-content/themes/flatsome-child/fonts/fz-poppins-semibold.ttf') format('truetype');
font-weight: 600;
}
@font-face {
font-family: 'Poppins';
src: url('/wp-content/themes/flatsome-child/fonts/fz-poppins-medium.ttf') format('truetype');
font-weight: 500;
}
@font-face {
font-family: 'Poppins';
src: url('/wp-content/themes/flatsome-child/fonts/fz-poppins-regular.ttf') format('truetype');
font-weight: 400;
}
body {
font-family: var(--font-poppins);
font-size: 14px;
font-weight: 400;
line-height: 1.5;
}
h1, h2, h3, h4, h5, h6 {
font-weight: 600;
margin-bottom: 15px;
}
h5{font-size: 17.5px;}
p{margin-bottom: 15px;}
.m-0 {
margin: 0;
}
.mb-0 {
margin-bottom: 0;
}
.p-0 {
padding: 0 !important
}
.h-full {
height: 100%
}
.w-full {
width: 100%
}
.row {
max-width: initial !important;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
margin-right: -15px auto;
margin-left: -15px auto;
}
.col{padding-bottom: 0 !important;}
.text-uppercase {
text-transform: uppercase !important;
}
.pt-7 {
padding-top: 50px !important;
}
.pb-7 {
padding-bottom: 50px !important;
}
.ptb-7 {
padding: 50px 0 !important;
}
.pt-5{padding-top: 40px !important;}
.pb-4{padding-bottom: 15px !important}
.mr-2 {
margin-right: 0.375rem
}
.header-bottom .nav > li {
margin: 0
}
.header-bottom-nav > li > a {
padding: 0 20px;
font-size: 14px;
font-weight: 600;
}
input.search-field {
border-radius: 5px !important;
height: 40px;
background: #fff !important;
padding: 8.5px 12.5px;
border-radius: 5px 0px 0px 5px !important;
box-shadow: none;
font-size: 14px;
border-right: none;
}
.header-search-form-wrapper .icon-search {
color: #9f9e9e;
font-size: 14px !important;
top: 0 !important;
}
.ux-search-submit{
border: 1px solid #e1e1e1;
background-color: transparent;
border-left: none;
border-radius: 0px 5px 5px 0 ;
padding: 8.5px 12.5px;
padding-left: 12.5px !important;
padding-right: 12.5px !important;
font-size: 14px;
line-height: unset;
min-height: unset;
min-width: 40px !important;
letter-spacing:unset;
}
.icon__box__header__contact {
display: flex;
align-items: center;
justify-content: flex-end;
font-size: 18px;
}
.icon__box__header__contact.hotline {
color: var(--main-color);
margin-bottom: 0.25rem;
}
.icon__box__header__contact.email{
color: var(--main-color);
}
.icon__box__header__contact i {
font-size: 18px;
}
.icon__box__header__contact a {
font-weight: 600
}
.nav-dropdown {
width: max-content;
width: -webkit-max-content;
padding: 1rem
}
.nav-dropdown li a {
border-bottom: 1px solid #ececec;
font-size: 0.875rem
}
.nav-dropdown li a:hover {
color: var(--main-color)
}
.btn-mini-cart i {
font-size: 14px !important;
background: var(--sc-color);
width: 29.69px;
height: 29.69px;
line-height: 2;
text-align: center;
border-radius: 100%;
margin-right: 0;
color: white;
}
.entire-cart-text span {
font-size: 14px;
text-transform: none;
font-weight: 400;
line-height: 1.5
}
.entire-cart-text {
display: flex;
flex-direction: column;
}
li.cart-item a:hover {
background-color: transparent !important
}
.button {
font-weight: 600 !important
}
.flickity-prev-next-button .arrow {
fill: #9f9e9e !important
}
.flickity-prev-next-button {
width: 30px;
opacity: 1 !important;
}
.flickity-prev-next-button svg {
padding: 0
}
.flickity-prev-next-button.previous {
left: 1%;
}
.flickity-prev-next-button.next {
right: 1%
}
.title-custom-1 h3{
padding-bottom: 1.25rem;
position: relative;
}
.title-section h3{
font-size: 24px;
}
.title-custom-1 h3:after {
content: '';
background: var(--main-color);
width: 30px;
height: 3px;
left: 50%;
transform: translate(-50%, -50%);
position: absolute;
bottom: 0;
clip-path: polygon(9% 0%, 91% 0%, 100% 100%, 0% 100%);
}
.procedure__item {
display: flex;
}
.procedure__number {
background: var(--main-color);
text-align: center;
position: relative;
overflow: hidden;
width: 80px;
padding: 0 15px;
}
.procedure__number:after {
content: '';
position: absolute;
bottom: 0;
right: 0;
border-style: solid;
border-width: 0px 0px 69px 27px;
border-color: transparent transparent #f6f6f6 transparent;
}
.title-custom-2 {
position: absolute;
left: 3px;
bottom: 0;
}
.procedure__number .title-custom-2 {
font-size: 35px;
line-height: 1.2;
color: #fff;
font-weight: 600
}
.procedure__content {
padding: 10px;
width: 100%;
background: #f6f6f6;
}
.procedure__content p {
margin: 0
}
.ml-0, .mx-0 {
margin-left: 0 !important;
}
.mr-0, .mx-0 {
margin-right: 0 !important;
}
.row__procedure {
padding-top: 0.75rem;
}
@keyframes chang-rotage-anim-1 {
0% {
transform: rotate(0deg) scale(1) skew(1deg);
}
20% {
transform: rotate(0deg) scale(1) skew(1deg);
}
25% {
transform: rotate(-25deg) scale(1) skew(1deg);
}
30% {
transform: rotate(25deg) scale(1) skew(1deg);
}
35% {
transform: rotate(-25deg) scale(1) skew(1deg);
}
40% {
transform: rotate(25deg) scale(1) skew(1deg);
}
45% {
transform: rotate(0deg) scale(1) skew(1deg);
}
100% {
transform: rotate(0deg) scale(1) skew(1deg);
}
}
@keyframes chang-rotage-anim-2 {
0% {
transform: rotate(0deg) scale(1) skew(1deg);
}
50% {
transform: rotate(0deg) scale(1) skew(1deg);
}
55% {
transform: rotate(-25deg) scale(1) skew(1deg);
}
60% {
transform: rotate(25deg) scale(1) skew(1deg);
}
65% {
transform: rotate(-25deg) scale(1) skew(1deg);
}
70% {
transform: rotate(25deg) scale(1) skew(1deg);
}
75% {
transform: rotate(0deg) scale(1) skew(1deg);
}
100% {
transform: rotate(0deg) scale(1) skew(1deg);
}
}
@keyframes chang-rotage-anim-3 {
20% {
transform: translate(0px, 0) rotate(0deg);
}
70% {
transform: translate(0px, 0) rotate(0deg);
}
85% {
transform: rotate(-180deg) translate(-30px, 30px) rotate(-180deg);
}
95% {
transform: rotate(180deg) translate(-30px, 30px) rotate(180deg);
}
100% {
transform: translate(0px, 0px);
}
}
.num-ani-0 {
animation: 4s ease-in-out 0s normal none infinite running chang-rotage-anim-1;
}
.num-ani-1 {
animation: 4s ease-in-out 0s normal none infinite running chang-rotage-anim-2;
}
.num-ani-2 {
animation: 4s ease-in-out 0s normal none infinite running chang-rotage-anim-3;
}
.block-tab ul li{margin: 0;}
.block-tab ul li a{
padding: 10px 15px;
font-size: 17.5px;
font-weight: 600;
}
.block-tab ul li.active a,
.block-tab ul li a:hover{
color: var(--main-color);
}
.nav-line-bottom>li>a:before{
width: 50%;
height: 2px;
background-color: var(--sc-color);
}
.block-tab ul li:nth-child(2) a{ padding: 10px 27px;}
.block-tab ul li:nth-child(2) a span:after{
width: 15px;
height: 15px;
display: block;
content: "";
background: url('data:image/svg+xml;utf8,');
background-repeat: no-repeat;
position: absolute;
right: 0;
top: 15px;
animation: cog 6s infinite;
animation-timing-function: linear;
}
.block-tab ul li:nth-child(2) a span:before {
width: 15px;
height: 15px;
display: block;
content: "";
background: url('data:image/svg+xml;utf8,');
background-repeat: no-repeat;
position: absolute;
left: 0;
top: 15px;
animation: cog 6s infinite;
animation-timing-function: linear;
}
@keyframes cog {
100% {
-moz-transform: rotate(360deg);
-ms-transform: rotate(360deg);
transform: rotate(360deg);
}
}
.Ss__homepage__stt2 .product-small.has-hover .box-image .image-zoom a:before {
width: 100%;
height: 100%;
content: '';
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
border: 6px solid transparent;
box-sizing: border-box;
position: absolute;
transition: 0.6s;
-moz-transition: 0.6s;
-webkit-transition: 0.6s;
-o-transition: 0.6s;
z-index: 2;
}
.Ss__homepage__stt2 .product-small.has-hover:hover .box-image .image-zoom a:before {
width: 0%;
border: 1px solid #fff;
height: 0%;
background: rgba(0, 0, 0, 0.5);
}
.Ss__homepage__stt2 .product-small.has-hover .box-image .image-zoom a:after {
width: 100%;
height: 100%;
content: '';
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
border: 10px solid transparent;
box-sizing: border-box;
position: absolute;
transition: 1s;
-moz-transition: 1s;
-webkit-transition: 1s;
-o-transition: 1s;
}
.Ss__homepage__stt2 .product-small.has-hover:hover .box-image .image-zoom a:after {
width: 0%;
border: 1px solid #fff;
height: 0%;
background: rgba(0, 0, 0, 0.5);
}
.product-small .product-title{font-size: 13px;}
.Ss__homepage__stt3 .icon-box .icon-inner{
width: 60px;
height: 60px;
margin-left: 10px;
margin-top: 20px;
background: var(--main-color);
-webkit-transform: rotate(-45deg);
}
.Ss__homepage__stt3 .icon-box .icon-inner img{
-webkit-transform: rotate(45deg);
filter: invert(100%);
padding: 10px;
}
.box-custom-1 .col .col-inner{
height: 100%;
}
.commit-slide--tile {
font-weight: 700;
font-size: 15px;
}
.commit-slide--description {
color: #666666;
font-size: 14px;
}
.title-custom-3 h3{
background-color: var(--main-color);
color: white;
font-size: 20px !important;
font-weight: 600;
padding: 5px 0 5px 40px;
margin-bottom: 15px;
}
.title-custom-3 h3:before {
width: 20px;
height: 20px;
display: block;
content: "";
background: url('data:image/svg+xml;utf8, ');
background-repeat: no-repeat;
position: absolute;
left: 10px;
top: 10px;
animation: cog 6s infinite;
animation-timing-function: linear;
}
.price-wrapper .price{
font-weight: 700;
margin-top: 10px;
margin-bottom: 5px;
font-size: 17.5px;
}
span.amount{
color: var(--main-color);
font-weight: 500;
}
.button.btn-custom-2 {
padding: 8px 16px !important;
border: 1px solid;
border-color: var(--main-color) !important;
color: var(--main-color);
min-height:auto !important;
line-height: 2;
margin-bottom: 0;
}
.btn-custom-2:before {
content: "\f101";
font-family: "Font Awesome 5 Free";
font-size: 10px;
padding-right: 0.5rem;
vertical-align: middle;
}
.button.btn-custom-2:hover{color: var(--sc-color);}
.title-custom-5 h1{
word-spacing: 2px;
letter-spacing: 1px;
line-height: 1;
font-family: MTL;
font-weight: 600;
color: black;
font-size: 35px;
}
.title-custom-5 h1:after {
content: "";
display: block;
background-color: var(--sc-color);
height: 3px;
width: 100px;
margin: 0 auto;
margin-top: 18px;
}
.title-custom-5 p{
color: #343a40;
font-size: 15px;
}
.ss-tt .post-item .box-push .box-text{
padding: 50px 20px;
margin-top: -90px;
max-width: 90.09%;
}
.post-date{font-size: 14px;}
.post-title a{
font-family: 'MTL';
font-weight: 600;
font-size: 24px;
height: 60px;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
text-overflow: ellipsis;
}
.post-item .is-divider{display: none;}
.from_the_blog_excerpt {
margin-bottom: 10px !important;
color: #959595;
font-size: 14px;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
text-overflow: ellipsis;
height:40px;
}
.ss-tt .post-item .box-text a.button{
border: 2px solid;
border-color: var(--main-color) !important;
border-radius: 3px;
padding: 8px 20px 8px 20px;
margin: 0;
font-size: 14px;
line-height: 2;
min-height: auto;
}
.ss-tt .post-item .box-text a.button:hover{color: var(--sc-color);}
.ss-tt .post-item .box-text a.button:after {
content: "\f101";
font-family: "Font Awesome 5 Free";
font-size: 10px;
padding-left: 0.5rem;
vertical-align: text-bottom;
}
.title-custom-6,
.title-custom-7{
color: var(--main-color);
padding-bottom: 10px;
position: relative;
}
.ss-video .title-custom-6,
.ss-video .title-custom-7{margin: 0 30px 5px;}
.ss-video h3,
.ss-bc h3,
.ss-dt h3{
font-size: 24px;
font-weight: 500;
margin-bottom: 0;
}
.title-custom-7 h3:after {
content: '';
width: 25px;
height: 3px;
background: var(--sc-color);
position: absolute;
bottom: 0;
right: 0;
}
.title-custom-6 h3:after {
content: '';
width: 25px;
height: 3px;
background: var(--sc-color);
position: absolute;
bottom: 0;
left: 0;
}
.ss-video .video{position: relative;}
.video .video-button-wrapper a{
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
margin: 0;
border: none;
border-radius: 0 !important;
}
.video .video-button-wrapper a:hover{background-color: transparent;}
.video .video-button-wrapper a i{display: none;}
.video .video-button-wrapper a::before{
content: "\f008";
font-family: "Font Awesome 5 free";
font-weight: 900;
color: #fff;
position: absolute;
top: 50%;
left: 50%;
z-index: 1;
font-size: 48px;
opacity: 0;
filter: opacity(0);
visibility: hidden;
transition: opacity 0.2s cubic-bezier(0.39, 1, 0.55, 1), transform 0.2s cubic-bezier(0.39, 1, 0.55, 1);
transform: translate(-50%, calc(-50% + 15px));
}
.video .video-button-wrapper a:hover{ background-color: rgba(51, 54, 69, 0.7);}
.video .video-button-wrapper a:hover:before{
opacity: 1;
filter: opacity(1);
visibility: visible;
transform: translate(-50%, -50%);
transition-delay: 0.15s;
}
.ss-video .testimonial-box{margin-left: 30px;}
.ss-video .icon-box .icon-box-img{margin: 40px 0;}
.ss-video .icon-box .icon-box-img img{
border: 8px solid var(--main-color);
transition: transform 0.5s ease-in-out;
height: 105px;
}
.ss-video .icon-box .icon-box-img img:hover{ transform: rotate(360deg);}
.article-description{
color: #343a40;
font-style: normal;
margin-bottom:10px ;
}
.box-vertical .post-title a{
font-size: 14px;
height: auto;
-webkit-line-clamp:1;
}
#post-list .post-item{padding-bottom:30px !important;}
body:not(.home) .box-blog-post{
padding:15px;
border: 1px solid #dee2e6;
height:100%;
}
.box-blog-post .image-cover{padding-top: 100% !important;}
.box-blog-post.box-vertical .post-date,
.box-blog-post:not(.box-vertical) .post-date-vertical {display: none;}
.box-vertical .blog-post-inner{
display: flex;
flex-direction: column;
}
.post-date-vertical{
order: 2;
font-size: 14px;
color: #959595;
}
.post-date-vertical span{
color: var(--sc-color);
font-size: 18px;
}
.ss-bc h3{margin-bottom: 0;}
.ss-bc .title-custom-6{margin-bottom: 5px;}
.view-small {padding-top: 10px;}
.view-small .post-item{padding-bottom: 15px;}
.view-small .post-item .box-vertical .box-image{
display: block;
width: 72px !important;
}
.view-small .post-item{margin-bottom: 15px ;}
.box-vertical{display: flex;}
.box-vertical .box-text{
padding: 0;
padding-left: 15px;
}
.breadcrumbs{
background-color: #f3f3f3;
margin-bottom: 30px;
}
.rank-math-breadcrumb p{margin: 10px 0;}
.rank-math-breadcrumb{
display: flex;
flex: 1 1 auto;
flex-wrap: wrap;
align-items: center;
font-size: 13px;
}
.rank-math-breadcrumb a{ color: var(--sc-color);}
.rank-math-breadcrumb a:hover,
.rank-math-breadcrumb .last{color: var(--main-color);}
.shop-page-title{display: none;}
.category-page-row{padding-top: 0;}
.sidebar-inner .is-divider,
.widget-area .is-divider{display: none;}
body .widget-title {
display: block;
text-transform: uppercase;
font-weight: bold;
border-bottom: 1px solid #e1e1e1;
padding-bottom: 15px;
margin-bottom: 15px;
font-size: 17.5px;
}
.widget>ul>li+li, ul.menu>li+li{border: none;}
ul li.cat-item a{
position: relative;
padding: 9px 0 9px 30px;
border-bottom: 1px dashed #e1e1e1;
display: block;
width: 100%;
}
ul li.cat-item a:before {
content: '';
position: absolute;
height: 5px;
width: 5px;
background-color: #636363;
top: 50%;
left: 0;
transform: translateY(-50%);
}
.widget li a{color: var(--sc-color)}
.widget li a:hover,
.widget .current-cat>a{
color: var(--main-color);
font-weight: normal;
}
.widget li.woof_list,
.widget .woof_list .woof_price_filter_radio {margin: 0 !important;}
.widget .woof_list label{
margin: 6px;
padding: 0;
font-size: 14px;
font-weight: normal;
color: var(--sc-color);
}
.widget .woof_list li{padding-bottom: 6px !important;}
#custom_html-5 .woof_submit_search_form_container{display: none;}
#custom_html-2 .woof_checkbox_instock,
#custom_html-2 .woof_checkbox_featured,
#custom_html-2 .woof_checkbox_sales{
display: none;
}
#custom_html-2 .woof_redraw_zone{display: flex;}
#custom_html-2 .woof_container_stock,
#custom_html-2 .woof_container_product_visibility,
#custom_html-2 .woof_container_onsales{height: 35px;}
#custom_html-2 label{
margin: 4px;
padding: 5px 10px;
border: 0.1rem solid #f3f3f3;
border-radius: 10px 10px 0 10px;
font-weight: unset;
top: -25px;
position: relative;
}
#custom_html-2 .woof_submit_search_form_container{display: none;}
#custom_html-2 label:hover{
border-color: var(--main-color);
color: var(--main-color);
}
#custom_html-2 .woof_checkbox_instock:checked + label,
#custom_html-2 .woof_checkbox_featured:checked + label,
#custom_html-2 .woof_checkbox_sales:checked + label {
border-color: var(--main-color);
color: var(--main-color);
}
#custom_html-2 .woof_checkbox_instock:checked + label::before,
#custom_html-2 .woof_checkbox_featured:checked + label::before,
#custom_html-2 .woof_checkbox_sales:checked + label::before{
content: '';
position: absolute;
display: block;
right: 0;
bottom: 0;
width: 0;
height: 0;
border-style: solid;
border-width: 0 0 12px 12px;
border-color: transparent transparent var(--main-color);
}
#custom_html-2 .woof_checkbox_instock:checked + label::after,
#custom_html-2 .woof_checkbox_featured:checked + label::after,
#custom_html-2 .woof_checkbox_sales:checked + label::after{
content: '\f00c';
position: absolute;
display: block;
font-family: "Font Awesome 5 free";
font-weight: 900;
font-size: 6px;
line-height: 1;
color: #fff;
bottom: 0;
right: 1px;
}
.woof_reset_search_form{
margin: 0;
padding: 8.5px 40px;
text-transform: unset;
line-height: 1;
min-height: 40px;
}
.woof_reset_search_form:hover{
background-color: transparent;
border: 1px solid var(--main-color);
box-shadow:none;
color: var(--main-color);
}
.sx-product{
display: flex;
flex-wrap: wrap;
justify-content: space-between;
align-items: center;
padding: 10px;
margin-bottom: 15px;
background-color: #f3f3f3;
}
.per-page-title {
font-weight: 600;
color: var(--main-color);
}
.products-per-page-links .per-page-variation{padding: 0 7px;}
.products-per-page-links span:last-child{display:none;}
.orderby-section .orderby-title {
display: block;
padding-right: 25px;
position: relative;
cursor: pointer;
color: var(--main-color);
font-weight: 600;
}
.orderby-section .dropdown{position: relative;}
.orderby-section .dropdown.show .orderby-title::after {
transform: rotate(-180deg);
}
.orderby-section .orderby-title::after {
content: "\f107";
position: absolute;
font-family: "Font Awesome 5 free";
top: 0;
right: 0;
font-weight: 900;
-webkit-transition: all 0.15s ease-in-out;
transition: all 0.15s ease-in-out;
}
.dropdown-menu {
position: absolute;
top: 100%;
left: 0;
z-index: 1000;
display: none;
color: var(--sc-color);
text-align: left;
list-style: none;
background-color: #fff;
background-clip: padding-box;
border: 1px solid rgba(136, 21, 21, 0.15);
border-radius: 2px;
}
.dropdown-item {
display: block;
width: 100%;
padding: 0 15px;
clear: both;
font-weight: 400;
color: var(--sc-color);
text-align: inherit;
white-space: nowrap;
background-color: transparent;
border: 0;
line-height: 2.858;
}
.dropdown-menu.show {
display: block;
position: absolute;
transform: translate3d(-77px, 21px, 0px);
top: 0px;
left: 0px;
will-change: transform;
}
.blog-archive .post-date-vertical{display: block!important;}
.blog-archive .post-date{display: none!important;}
.blog-archive .post-date-vertical span,
.related-posts .post-date-vertical span{font-size: 32px;}
.blog-archive .post-title a{
font-size: 16px;
height: 40px;
}
.readmore{
display:flex;
flex-wrap: wrap;
align-items:center;
}
.button.btn-submit-1 {
padding: 8px 16px !important;
border: 1px solid;
border-color: var(--main-color) !important;
color: var(--main-color);
min-height: auto !important;
line-height: 2;
margin: 0;
font-size:14px;
font-weight: unset !important;
}
.button.btn-submit-1:hover{
background-color: var(--main-color) !important;
color:#fff;
}
.widget .title-custom-6{
padding: 15px 0 10px;
text-align: right;
}
.title-custom-6 h3{margin-bottom: 0;}
.readmore .post-categories{
font-size:14px;
color: var(--main-color);
margin-right:10px;
}
.page-wrapper{padding-top:0;}
.blog-wrapper .row-large > .col{
padding-left:15px;
padding-right:15px;
}
.post-vua-dang .article-item{
margin-bottom: 15px;
display: flex;
}
.post-vua-dang .post-title a{
font-size:14px;
display: -webkit-box;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
overflow: hidden;
text-overflow: ellipsis;
}
.post-vua-dang .inner-image{ width: 35%;}
.post-vua-dang .inner-content{
width: 65%;
margin-left: 15px;
}
.post-vua-dang .post-date-vertical span{font-size:18px;}
.meta-header-post{margin-bottom:10px;}
.blog-single .entry-header-text-top{padding-bottom:0;}
.blog-single .entry-content{padding-top:0}
.blog-single .post-on{
font-weight: 700;
margin:0 5px;
padding-right: 5px;
border-right: 1px solid #e1e1e1;
}
.blog-single .post-date {
color: #959595;
}
.related-posts h3,
.product-section-title-related{
text-align:center;
text-transform: unset;
font-size:24px;
padding-top:0;
}
h1.product-title {
font-size:28px;
margin-bottom:10px;
}
.product-title-container .is-divider{display:none;}
.product-price-container .price-wrapper .price{
margin-top:0;
margin-bottom:15px;
}
.single-product .product-page-price,
.single-product .product-page-price.price{
font-size:22px;
font-weight:bold;
color: var(--main-color);
}
.woocommerce-Price-currencySymbol{margin-left: 5px;}
.product-page-price .woocommerce-Price-currencySymbol{
font-weight:bold;
}
.related-posts .post-date-vertical{display:block !important;}
.product-section{border:none;}
.woocommerce-tabs {margin:30px 0;}
.woocommerce-tabs .product-tabs{width: 17.095%;}
.woocommerce-tabs .product-tabs li a{
font-size:16px;
padding:0 15px 30px 0;
color: var(--sc-color);
}
.woocommerce-tabs .product-tabs li a:hover,
.woocommerce-tabs .product-tabs li.active a{color: var(--main-color);}
.product-tabs li a:before{display:none;}
.woocommerce-tabs .tab-panels{
border-left:none;
padding:0 15px;
}
body:not(.home) .price{font-size:14px;}
#custom-add-to-cart-form{
display: flex;
flex-wrap: wrap;
}
#custom-add-to-cart-form .ux-quantity {
position: relative;
display: flex;
align-items: center;
justify-content: flex-start;
color: var(--sc-color);
border: 1px solid #e1e1e1;
padding-right: 18px;
margin: 5px 0;
height:48px;
}
#custom-add-to-cart-form .ux-quantity .input-text.qty{
width: 70px;
max-width: none;
height: 100%;
border: none;
background-color: transparent;
padding: 0 8px;
}
#custom-add-to-cart-form .ux-quantity .ux-quantity__button{
position: absolute !important;
height: calc(50% - 1px);
border: 1px solid #e1e1e1 !important;
box-sizing: content-box;
right: -1px;
display: flex;
align-items: center;
width: 18px;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
padding: 0;
font-size: 8px;
box-shadow:none;
}
.ux-quantity .ux-quantity__button--plus {
top: -1px;
}
.ux-quantity .ux-quantity__button--minus{ bottom: -1px;}
.btn-cart-buy .add-to-cart {margin: 5px 10px;}
.btn-phone .add-to-cart {margin: 5px 0px;}
.add-to-cart {
text-transform: uppercase;
background-color: var(--sc-color);
color: #fff;
font-weight: 700;
text-align: center;
display: inline-block;
height: 48px;
line-height: 48px;
border: 1px solid var(--sc-color);
padding: 0 10px;
overflow: hidden;
}
.add-to-cart:hover{
background-color: transparent;
}
.custom-product-page form{margin-bottom: 0;}
.formsdt{display: flex;}
.form-group .wpcf7-form-control:not(.btn-submit){
box-shadow: none;
border-color: #e1e1e1;
font-size: 14px;
border-radius: 5px 0 0 5px;
height: auto;
padding: 7.65px 11.25px;
margin-bottom: 10px;
}
.form-group .btn-submit{
font-size: 14px;
border-radius: 0 5px 5px 0;
min-height: auto;
line-height:1.5;
padding: 7.65px 11.25px;
text-transform: unset;
font-weight: unset;
width: 100%;
margin: 0;
}
.form-group .btn-submit:hover{
background-color:transparent;
box-shadow:none;
border-color: var(--main-color);
color: var(--main-color);
}
.ss-lh .form-group .wpcf7-form-control{border-radius:5px;}
.ss-lh .form-group .btn-submit{width:auto;}
.mobile-nav {
flex-wrap: nowrap;
}
.mobile-nav .cart-item .entire-cart-text{display: none;}
.mobile-nav .searchform-wrapper.form-flat .flex-col{
margin-left: 0;
padding: 0;
}
.mobile-nav .header-search-form .ux-search-submit{
background-color: var(--sc-color) !important;
}
.nav-dark .mobile-nav .form-flat input.search-field:not([type=submit]){
border-radius: 0 !important;
background-color: #fff !important;
color: var(--sc-color);
}
.mobile-nav .cart-item a,
.mobile-nav .nav-icon a{padding: 0 !important;}
.mobile-nav .header-search-form {
padding: 0 50px;
}
.footer-info p{
display: flex;
gap: 10px;
color: #bebebe;
}
.footer-info i{
display: flex;
align-items: center;
}
.footer-menu{font-size: 13px;}
.footer-menu i{font-size: 7px;}
.absolute-footer{padding: 5px;}
.btn-filter-mobile{font-size: 12.6px;}
.btn-filter-mobile i{margin-right: 5px;}
.filter-url{
display: none;
margin-bottom: 15px;
}
.back-drop.open {
opacity: 1;
filter: opacity(1);
visibility: visible;
}
.back-drop {
position: fixed;
top: 0;
left: 0;
height: 100%;
width: 100%;
background-color: rgba(0, 0, 0, 0.5);
-webkit-transition: all 0.25s ease-in-out;
transition: all 0.25s ease-in-out;
z-index: 1020;
opacity: 0;
filter: opacity(0);
visibility: hidden;
}
.content-filter-product.open {transform: translate3d(0, 0, 0);}
.content-filter-product {
position: fixed;
width: 300px;
top: 0;
bottom: 0;
left: 0;
height: 100%;
z-index: 1100;
background-color: #fff;
overflow: auto;
transition: all 0.8s ease-in-out;
transform: translate3d(-300px, 0, 0);
transition: transform 0.3s cubic-bezier(0.65, 0.05, 0.51, 0.82);
box-shadow: -1px 0 3px rgba(0, 0, 0, 0.2);
padding: 15px;
}
.content-filter-head{
display: flex;
justify-content: space-between;
margin-bottom: 30px;
font-size: 22.05px;
font-weight: bold;
}
.filter-url #custom_html-2 label{top: 0;}
.blog-archive .post-item .col-inner{height:100%;}
.post .entry-header h1{
font-size: 24.5px;
margin-bottom: 10px;
}
.post .entry-header .entry-divider{display: none;}
@media (max-width: 1200px){
.icon__box__header__contact,
.icon__box__header__contact i{font-size: 14px;}
.header-bottom-nav > li > a {
padding: 0 15px;
}
}
@media screen and (max-width: 992px){
.title-section h3{font-size: 21.6px;}
.s__homepage__stt1 .row__procedure .col{padding: 4.5px 0 !important;}
.nav-line-bottom>li>a:before{display: none;}
.block-tab ul li a{
padding: 5px 7px;
font-size: 15.75px;
margin: 9px;
border: 1px solid var(--sc-color);
}
.block-tab ul li.active a,
.block-tab ul li a:hover{
background-color: var(--sc-color);
color: #fff;
}
.block-tab ul li:nth-child(2) a span:before,
.block-tab ul li:nth-child(2) a span:after{display: none;}
.block-tab ul li:nth-child(2) a{padding: 5px 7px;}
.box-custom-1 .col{margin: 9px 0;}
.box-custom-1 .col-inner{padding: 0 !important;}
.Ss__homepage__stt3 h3{display: none;}
.Ss__homepage__stt3 .icon-box{display: block;}
.Ss__homepage__stt3 .icon-box .icon-box-img{
width: 100% !important;
max-width: 100%;
background-color: var(--main-color);
padding: 9px;
display: flex;
justify-content: center;
}
.Ss__homepage__stt3 .icon-box .icon-inner{
margin-left: 0;
margin-top: 0;
background: var(--main-color);
-webkit-transform: rotate(0);
width: 64px;
height: 64px;
}
.Ss__homepage__stt3 .icon-box .icon-inner img {
-webkit-transform: rotate(0);
filter: invert(100%);
padding: 0;
}
.Ss__homepage__stt3 .icon-box .icon-box-text{
padding: 4.5px;
margin-bottom: 9px;
text-align: center;
}
.commit-slide--tile,
.commit-slide--description{ font-size: 12.6px;}
.button.btn-custom-2{
font-size: 12.6px;
line-height: 1;
}
.price{font-size: 15.75px;}
.woocommerce-Price-currencySymbol{font-size: 12px;}
.pb-7{padding-bottom: 45px;}
.box-blog-post .image-cover {
padding-top: 85% !important;
}
.ss-dt {padding-bottom: 0 !important;}
}
@media screen and (max-width: 849px){
.from_the_blog_excerpt{height:35px}
.blog-archive .sx-product,
.blog-archive #search-2,
.blog-archive #custom_html-6{display: none;}
.filter-url{display: block;}
.widget .woof_list label{font-size: 12.6px;}
.blog-archive .small-columns-1>.col{
flex-basis: 50%;
max-width: 50%;
}
.search-mobi .search-mobi-title{
font-size: 15.75px;
margin-bottom: 13.5px;
padding-bottom: 13.5px;
font-weight: bold;
text-transform: uppercase;
}
.search-mobi input.search-field{
padding-left: 0;
padding-right: 0;
font-size: 12.6px;
}
.search-mobi input.search-field,
.search-mobi .ux-search-submit{
border-left: 0;
border-right: 0;
border-top:0;
color: #000;
}
.post-date-vertical,
.from_the_blog_excerpt,
.readmore .post-categories,
.button.btn-submit-1{font-size: 12.6px;}
.blog-archive .post-title a{
font-size: 14.4px;
height: 35px;
}
.blog-archive .post-date-vertical span,
.related-posts .post-date-vertical span{font-size: 28.8px;}
.button.btn-submit-1{padding: 7.65px 11.25px !important;}
.blog-single #search-2,
.blog-single #categories-3,
.blog-single .related-posts{display: none;}
}
@media screen and (max-width: 549px){
.post .entry-header h1{font-size: 22.05px;}
.related-posts h3, .product-section-title-related{font-size: 21.6px;}
.formsdt{display: block;}
.woocommerce-tabs .product-tabs{width: 100%;}
.procedure__number .title-custom-2{
bottom: unset;
font-size: 31.5px;
}
.article-description,
.meta-header-post{font-size: 12.6px;}
.title-custom-7 h3:after{right: 45%;}
.title-custom-6 h3:after {left: 44%;}
.ss-video h3, .ss-bc h3, .ss-dt h3{font-size: 21.6px;}
.ss-video .testimonial-box {margin-left: 25px;}
.ss-video .icon-box .icon-box-img img{
height: 58px;
width: 58px !important;
border-width: 5px;
}
h1.product-title{font-size: 25.2px;}
.single-product .product-page-price,
.single-product .product-page-price span.amount{font-size: 19.8px;}
.product-page-price .woocommerce-Price-currencySymbol{font-size: 14.85px;}
}
@media (min-width: 576px) {
.container, .row{
max-width: 540px !important;
}
}
@media (min-width: 768px) {
.container, .row{
max-width: 720px !important;
}
}
@media (min-width: 992px) {
.container, .row{
max-width: 960px !important;
}
}
@media (min-width: 1200px) {
.container, .row{
max-width: 1200px !important;
}
}
@media screen and (min-width: 1440px) {
html {
font-size: 1vw;
}
}
@media screen and (min-width: 1600px) {
html {
font-size: 0.83333vw;
}
}
.the_content {
color: #212529;
font-size: 15px;
font-weight: 400;
line-height: 28px
}
.the_content h2,
.the_content h3,
.the_content h4 {
font-weight: 700;
color: #333;
margin-bottom: 1rem;
color: var(--primary-color)
}
.the_content figure {
background: #fff;
border: 1px solid #f0f0f0;
padding: 5px 3px 10px;
text-align: center
}
.the_content h6 {
font-size: 15px
}
.the_content h5 {
font-size: 17px
}
.the_content h4 {
font-size: 17px
}
.the_content h3 {
font-size: 18px
}
.the_content h2 {
font-size: 20px;
line-height: 1.5
}
.the_content h1 {
font-size: 25px;
font-weight: 700;
color: #333;
margin-bottom: 1rem
}
.the_content p {
color: #333;
margin-bottom: 1rem;
font-size: 16.5px;
line-height: 1.6
}
.the_content ul {
list-style: disc;
padding-left: 5rem;
padding-bottom: 5px
}
.the_content ul li {
color: #333;
line-height: 1.5;
margin-bottom: 10px;
font-size: 16.5px
}
.the_content ul li a {
color: #007bff
}
.the_content ol {
list-style: decimal;
padding-left: 18px;
padding-bottom: 5px;
font-size: 16.5px
}
.the_content ol li {
color: #333;
line-height: 1.5;
margin-bottom: 10px;
font-size: 16.5px
}
.the_content ol li a {
color: #ff5912
}
.the_content a {
color: var(--primary-color);
font-weight: 700
}
.the_content blockquote {
background: #f3f3f3;
color: #868686;
display: block;
font-size: 16px;
line-height: 23px;
margin: 0 0 20px;
padding: 15px 20px 15px 45px;
position: relative;
text-align: justify
}
.the_content blockquote p {
margin-bottom: 0
}
.the_content blockquote:before {
position: absolute;
top: 0;
left: 0;
height: 100%;
width: 3px;
background: var(--primary-color);
content: ""
}
.the_content code {
background: rgba(0, 0, 0, .05);
border-radius: 3px;
font-size: .85rem;
color: #e83e8c;
font-size: 15px
}
.the_content table>tbody>tr>td,
.the_content table>tbody>tr>th,
.the_content table>tfoot>tr>td,
.the_content table>tfoot>tr>th,
.the_content table>thead>tr>td,
.the_content table>thead>tr>th {
border: 1px solid #ddd;
padding: 7px 10px;
font-size: 16.5px !important
}
.the_content iframe {
margin: auto
}
.the_content .syntaxhighlighter {
padding: 10px 0
}