/* Theme Name: DEV Version: 1.0 Description: AGENCY sở hữu hơn 500+ mẫu giao diện về tất cả các lĩnh vực và ngành hàng khác nhau, đáp ứng mọi nhu cầu của khách hàng với từng phân khúc giá. Cập nhật những mẫu thiết kế mới chuẩn xu hướng. */ #language{width: 200px} @font-face { font-family: 'Montserrat'; src: url(fonts/Montserrat-Light.ttf); font-weight: 300; } @font-face { font-family: 'Montserrat'; src: url(fonts/Montserrat-LightItalic.ttf); font-weight: 300; font-style: italic; } @font-face { font-family: 'Montserrat'; src: url(fonts/Montserrat-Regular.ttf); font-weight: 400; } @font-face { font-family: 'Montserrat'; src: url(fonts/Montserrat-Italic.ttf); font-weight: 400; font-style: italic; } @font-face { font-family: 'Montserrat'; src: url(fonts/Montserrat-Medium.ttf); font-weight: 500; } @font-face { font-family: 'Montserrat'; src: url(fonts/Montserrat-MediumItalic.ttf); font-weight: 500; font-style: italic; } @font-face { font-family: 'Montserrat'; src: url(fonts/Montserrat-SemiBold.ttf); font-weight: 600; } @font-face { font-family: 'Montserrat'; src: url(fonts/Montserrat-SemiBoldItalic.ttf); font-weight: 600; font-style: italic; } @font-face { font-family: 'Montserrat'; src: url(fonts/Montserrat-Bold.ttf); font-weight: 700; } @font-face { font-family: 'Montserrat'; src: url(fonts/Montserrat-BoldItalic.ttf); font-weight: 700; font-style: italic; } @font-face { font-family: 'Montserrat'; src: url(fonts/Montserrat-ExtraBold.ttf); font-weight: 800; } @font-face { font-family: 'Montserrat'; src: url(fonts/Montserrat-ExtraBoldItalic.ttf); font-weight: 800; font-style: italic; } @font-face { font-family: 'Montserrat'; src: url(fonts/Montserrat-Black.ttf); font-weight: 900; } @font-face { font-family: 'Montserrat'; src: url(fonts/Montserrat-BlackItalic.ttf); font-weight: 900; font-style: italic; } /* Option */ body{font-size: 16px;color: #000;font-family: 'Montserrat';padding-top: 72px;} *{margin:0;padding:0;line-height:1.5} a{text-decoration:none;color:#000;cursor:pointer;-webkit-transition:all 300ms ease-in-out;-moz-transition:all 300ms ease-in-out;-o-transition:all 300ms ease-in-out;transition:all 300ms ease-in-out} a:hover,a:focus,a:visited{text-decoration:none;outline:none} a:active,a:hover{color: #3f9926;} ul{padding-left:0;} img{max-width:100%;border:none;height:auto} b,strong{font-weight: bold;} h1,h2,h3,h4,h5,h6{line-height:1.3;margin-top:0;margin-bottom: 1rem;font-weight: 600;letter-spacing: -.02em;} h1 *,h2 *,h3 *,h4 *,h5 *,h6 *{line-height: normal;} h1{font-size: 40px;} h2{font-size: 32px;} h3{font-size: 24px;} h4{font-size: 20px;} h5{font-size: 16px;} h6{font-size: 16px;} .table{max-width: 100%;table-layout: fixed;word-wrap: break-word;} .img img{width:100%;height:auto;object-fit:cover} .background{background-size:cover;background-repeat:no-repeat;background-position:center} .relative{position: relative;} .overlay{display: block;width: 100%;height: 100%;position: absolute;top: 0;left: 0;z-index: 2;background-color: rgba(0, 0, 0, 0.2);} .linkfull{display: block;width: 100%;height: 100%;position: absolute;top: 0;left: 0;z-index: 5;} .screen-reader-text{display:none} .head{animation: stuckMoveUp .5s;} .head.navbar-fixed-top{box-shadow:1px 1px 10px rgba(0,0,0,0.15);position: fixed !important;top: 0;left: 0;width: 100%;z-index: 999;animation: stuckMoveDown .5s;} @keyframes stuckMoveDown { 0%{transform:translateY(-100%)} 100%{transform:translateY(0)} } @keyframes stuckMoveUp { 0%{transform:translateY(100%)} 100%{transform:translateY(0)} } @keyframes stuckFadeIn { 0%{opacity:0} 100%{opacity:1} } /* Container (FAKE theo từng web) */ .row-margin{--bs-gutter-y:var(--bs-gutter-x);margin-top: calc(-.5 * var(--bs-gutter-y));margin-bottom: calc(-.5 * var(--bs-gutter-y));} .row-margin>*{margin-top: 0;padding-top: calc(var(--bs-gutter-x) * .5);padding-bottom: calc(var(--bs-gutter-x) * .5)} .container,.row{--bs-gutter-x: 30px;} .container-fluid{--bs-gutter-x: 120px;} .flex{display:flex;flex-wrap:wrap} .align-center{align-items:center} .align-end{align-items:flex-end;} .align-start{align-items:flex-start;} .justify-between{justify-content: space-between;} .justify-center{justify-content: center;} .justify-end{justify-content: flex-end;} .justify-start{justify-content: flex-start;} .row-reverse{flex-direction:row-reverse;} .column-reverse{flex-direction:column-reverse;} @media (min-width: 576px){ .container, .container-sm {max-width: 100%;} } @media (min-width: 768px){ .container, .container-md, .container-sm { max-width: 100%;} } @media (min-width: 992px){ .container, .container-lg, .container-md, .container-sm {max-width: 100%;} } @media (min-width: 1200px){ .container, .container-lg, .container-md, .container-sm, .container-xl {max-width: 1140px;} } @media (min-width: 1400px){ .container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {max-width: 1320px;} } /* input-button */ input[type="text"],input[type="search"],input[type="password"],input[type="email"],input[type="number"],input[type="date"],input[type="tel"],textarea,select{width:100%;max-width:100%;display:block;outline:none;border: 1px solid #0a152b1a;padding: 15px 22px;font-weight: 500;border-radius: 0;background-color: #fff;color: #000;} input::-webkit-input-placeholder,textarea::-webkit-input-placeholder,select::-webkit-input-placeholder{color: #000;} input[type="file"]{display: block;} .sub-file{color: #747474;font-size: 13px;margin-top: 5px;font-weight: 500;} input[type="submit"]{font-weight: 500;padding: 15px 52px 15px 22px;color: #fff;background-color: #3f9926;border-radius: 0;text-align: center;border: none;transition: all .3s;font-size: 12px;text-transform: uppercase;background-image: url(images/icon-submit.png);background-size: 12px;background-repeat: no-repeat;background-position: right 20px center;} input[type="submit"]:hover{background-color: #3f9926;color: #fff;padding-right: 62px;} .wpcf7-list-item:first-child{margin-left: 0;} /* Contact-form7 */ form .row{--bs-gutter-x: 20px;} .wpcf7-spinner{position: absolute;} .form-group{margin-bottom: 16px;position: relative;} .form-group label.name{margin-bottom: 5px;font-weight: 500;} .form-group .note{color: #747474;font-size: 14px;margin-top: 5px;font-weight: 500;} div.wpcf7 .ajax-loader{position:absolute} .wpcf7-form-control-wrap{position:initial} .wpcf7 .wpcf7-not-valid-tip{position:relative;padding:5px 10px!important;line-height:1.2em;left:auto!important;border-radius:3px;background-color:#f1f1f1!important;border:0!important;color:#000;position:absolute;right:0;top:40px;z-index:99;font-size:12px;margin-bottom:5px} .wpcf7 .wpcf7-not-valid-tip:after{bottom:100%;left:30px;border:solid transparent;content:" ";height:0;width:0;position:absolute;pointer-events:none;border-color:rgba(136,183,213,0);border-bottom-color:#f1f1f1;border-width:5px;margin-left:-10px} .wpcf7 .wpcf7-validation-errors{display:none!important} /* Content-post */ .wp-block-image.aligncenter>figcaption, .wp-block-image .aligncenter>figcaption, .wp-block-image.alignleft>figcaption, .wp-block-image .alignleft>figcaption, .wp-block-image.alignright>figcaption, .wp-block-image .alignright>figcaption{display: block;} .content-post ul,.content-post ol{padding-left:18px;} .content-post li{position:relative;margin-bottom:6px} .content-post blockquote{background:#f6f6f6;position: relative;padding: 16px 16px 6px 32px;} .content-post blockquote:before{content: open-quote;font-weight: bold;font-size: 30px;position: absolute;left: 8px;top: 0;} .content-post blockquote:after{content: close-quote;font-weight: bold;font-size: 30px;position: absolute;bottom: 0;right: 8px;opacity: 0;visibility: hidden;} .content-post .gallery{display:grid;grid-column-gap:16px;grid-row-gap:16px} .content-post .gallery br{display:none} .content-post .gallery.gallery-columns-2{grid-template-columns:repeat(2,1fr)} .content-post .gallery.gallery-columns-4{grid-template-columns:repeat(4,1fr)} .content-post .gallery.gallery-columns-3{grid-template-columns:repeat(3,1fr)} .content-post .gallery.gallery-columns-5{grid-template-columns:repeat(5,1fr)} .content-post .gallery.gallery-columns-5{grid-template-columns:repeat(6,1fr)} .content-post .gallery.gallery-columns-5{grid-template-columns:repeat(7,1fr)} .content-post .gallery.gallery-columns-5{grid-template-columns:repeat(8,1fr)} .content-post .gallery.gallery-columns-5{grid-template-columns:repeat(9,1fr)} .content-post .gallery-item{margin:0!important;width:100%!important;display:flex;align-items:flex-start;float:none !important;flex-wrap: wrap;} .content-post .gallery-item img{border:none!important;width: 100%;height: auto;object-fit: cover;} .content-post a:hover{text-decoration:underline} .content-post .wp-caption.aligncenter{max-width:100%!important} img.aligncenter{display:block;margin:0 auto} .content-post .alignnone{margin:0 16px 16px 0} .content-post .aligncenter,.content-post div.aligncenter{display:block;margin:0 auto 16px;} .content-post .alignright{float:right;margin:0 0 16px 16px} .content-post .alignleft{float:left;margin:0 16px 16px 0} a img.alignright{float:right;margin:0 0 16px 16px} a img.alignnone{margin:0 16px 16px 0} a img.alignleft{float:left;margin:0 16px 16px 0} a img.aligncenter{display:block;margin-left:auto;margin-right:auto} .wp-caption{border:none;max-width:100%;padding:0;} .wp-caption.alignnone{margin:0 16px 16px 0} .wp-caption.alignleft{margin:0 16px 16px 0} .wp-caption.alignright{margin:0 0 16px 16px} .wp-caption img{border:0 none;height:auto;margin:0;max-width:100%;padding:0;width:100%} .content-post .wp-caption-text{margin:0;padding:6px;text-align: center;background: #eee;font-size: 14px;} /* Widget */ .widget ul,.widget ol{list-style: none;} .widget iframe{width: 100%;height: auto; object-fit: cover;} .widget .gallery{display:grid;grid-column-gap:10px;grid-row-gap:10px} .widget .gallery br{display:none} .widget .gallery.gallery-columns-2{grid-template-columns:repeat(2,1fr)} .widget .gallery.gallery-columns-4{grid-template-columns:repeat(4,1fr)} .widget .gallery.gallery-columns-3{grid-template-columns:repeat(3,1fr)} .widget .gallery.gallery-columns-5{grid-template-columns:repeat(5,1fr)} .widget .gallery-item{margin:0!important;width:100%!important;display:flex;align-items:center;float:none} .widget .gallery-item img{border:none!important} /* Remove-woo */ .woocommerce a.remove{width:30px;height:22px;position:relative;transition:opacity 200ms;vertical-align:top;display:block;-webkit-appearance:none;background:none;border:none;cursor:pointer;outline:none;padding:0;text-indent:-9999px} .woocommerce a.remove:before,.woocommerce a.remove:after{background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAQCAQAAACMnYaxAAAAXUlEQVR4XsWQQQrAQAgD84Pti/JSoaftN1MCdgXxXgYvGfUQyABE4DEIUJmeuKgVlJI5em0RGTesFXXZuLwCzvL2pYbHmfCTNSXxpyyajLGClFy7K1dgaaho7YYovIpO3rju6hYFAAAAAElFTkSuQmCC) 0 0 no-repeat;left:8px;position:absolute;right:8px;top:2px;display:inline-block;content:''} .woocommerce a.remove:before{height:6px;transform-origin:-7% 100%;-moz-transform-origin:-7% 100%;-webkit-transform-origin:-7% 100%;transition:transform 150ms;-moz-transition:transform 150ms;-webkit-transition:transform 150ms;width:14px} .woocommerce a.remove:after{background-position:-1px -4px;height:12px;margin-left:1px;margin-right:2px;margin-top:4px;width:11px} .woocommerce a.remove:hover:before{transform:rotate(-45deg);-moz-transform:rotate(-45deg);-webkit-transform:rotate(-45deg);transition:transform 250ms;-moz-transition:transform 250ms;-webkit-transition:transform 250ms} .woocommerce a.remove:hover{background:transparent} /* Support */ .sticky{position:-webkit-sticky;position:sticky;top:72px;z-index: 99;} .supports{position: fixed;z-index: 999;bottom: 120px;right: 20px;} .supports .item:not(:first-child){margin-top: 16px;} .supports .item a{height:48px;width:48px;background:#fff;border-radius:50%;box-shadow: 0px 0px 5px 0px #00000033;display:flex;align-items:center;justify-content:center;} .supports .item a img{object-fit: contain;max-width: 30px;max-height: 30px;} .supports .item a.zalo img{max-width: 37px;} .supports .item a:hover{box-shadow: 0px 0px 10px 0px #00000087;} .backtop{position: fixed;right: 20px;bottom: 40px;transition: .5s;z-index: 999;} .backtop a{height:48px;width:48px;background:#fff;border-radius:50%;box-shadow: 0px 0px 5px 0px #00000033;display:flex;align-items:center;justify-content:center;} .backtop a img{object-fit: contain;max-width: 30px;max-height: 30px;} .backtop a:hover{box-shadow: 0px 0px 10px 0px #00000087;} .swiper-button-next, .swiper-button-prev{width: 44px;height: 44px;border-radius: 50%;margin-top: 0;transform: translateY(-50%);background-color: rgba(255, 255, 255, 1);background-size: 10px;background-repeat: no-repeat;background-position: center;transition: all .2s;border: 2px solid #3f9926;} .swiper-button-next:hover, .swiper-button-prev:hover{background-color: #3f9926;} .swiper-button-next:after, .swiper-button-prev:after{display: none;} .swiper-button-next{background-image: url(images/swiper-next.png);right: -22px;} .swiper-button-prev{background-image: url(images/swiper-prev.png);left: -22px;} .swiper-button-next:hover{background-image: url(images/swiper-next-white.png);} .swiper-button-prev:hover{background-image: url(images/swiper-prev-white.png);} .home-cta a{display: inline-flex;align-items: center;padding: 0 60px 0 16px;height: 50px;text-transform: uppercase;font-size: 12px;font-weight: 600;letter-spacing: .04em;background-image: url(images/icon-submit.png);background-size: 12px;background-repeat: no-repeat;background-position: right 16px center;color: #fff;background-color: #3f9926;white-space: nowrap;overflow: hidden;justify-content: center;} .home-cta a:hover{padding-right: 72px;} .home-slider{position: relative;} .swiper-nav{display: flex;gap: 12px;align-items: center;} .swiper-nav .swiper-button-prev,.swiper-nav .swiper-button-next{position: unset;top: auto;transform: translateY(0);} /* Header */ #header .col-touch{display: none;} #menu-mobile{display: none;} #header{background: #e5e5e5;position: fixed;z-index: 999;transition: all .3s;width: 100%;left: 0;top: 0;} body.logged-in #header{top: 32px;} #header.shift{top: -72px;} body.logged-in #header.shift{top: -40px;} #header .col-logo{margin-right: auto;width: 190px;} #header .logo img{object-fit: contain;max-height: 72px;} #header .col-menu{width: calc(100% - 190px - 200px);} #header ul{list-style: none;margin-bottom: 0;} #header .menu{display: flex;justify-content: flex-end;font-size: 14px;column-gap: 64px;} #header .menu>li{height: 72px;cursor: pointer;display: flex;align-items: center;position: relative;gap: 5px;} #header .menu>li.product{position: unset;} #header .menu>li>svg{width: 14px;height: 14px;transition: all .3s;} #header .menu>li:hover>svg{fill: #3f9926;transform: rotate(180deg);} #header .menu>li>a{display: flex;align-items: center;gap: 5px;min-height: 40px;text-transform: uppercase;font-weight: 600;} #header .menu>li:hover>a{color: #3f9926;} #header .menu>li ul{position: absolute;z-index: 99;background-color: #fff;min-width: 220px;border: 1px solid rgba(10,21,43,.1);padding: 10px 0;display: none;} #header .menu>li>ul li{display: flex;align-items: center;gap: 5px;padding: 5px 20px;} #header .menu>li>ul li>svg{width: 14px;height: 14px;transition: all .3s;margin-left: auto;transform: rotate(-90deg);} #header .menu>li>ul li>a{display: flex;align-items: center;gap: 5px;min-height: 30px;font-weight: 600;} #header .menu>li>ul li:hover>a{color: #3f9926;} #header .menu>li>ul li:hover>svg{fill: #3f9926;} #header .menu>li>ul{top: 100%;left: -20px;} #header .menu>li>ul ul{left: 100%;top: -1px;min-height: calc(100% + 2px);} #header .menu li:hover>ul{display: block;} #header .menu>li.product>ul{width: 100%;left: 0;height: 560px;padding: 32px calc(50% - 645px);z-index: 98;} #header .menu>li.product>ul:before{content: "Các dòng sản phẩm";display: block;margin-bottom: 12px;text-transform: uppercase;font-weight: 700;color: #3f9926;} #header .menu>li.product>ul:after{content: "";display: block;width: 1px;height: 100%;background: rgba(10,21,43,.1);position: absolute;top: 0;left: calc(50% - 645px + 250px);} #header .menu>li.product>ul>li{margin-bottom: 5px;padding: 0;width: 230px;border-radius: 5px;transition: all .3s;} #header .menu>li.product>ul>li>a{padding: 5px 16px;min-height: 50px;font-weight: 600;font-size: 16px;font-weight: 100%;padding-right: 5px;} #header .menu>li.product>ul>li.active{background: #3f9926;color: #fff;} #header .menu>li.product>ul>li.active>a{color: #fff;} #header .menu>li.product>ul>li>svg{position: absolute;top: 50%;transform: translateY(-50%);right: 5px;fill: #fff;} #header .menu>li.product>ul>li>ul{width: calc(1290px - 270px);height: calc(100% - 60px);position: absolute;top: 40px;left: calc(50% - 645px + 270px);min-height: inherit;border: none;padding: 0;display: none;flex-wrap: wrap;align-content: flex-start;z-index: 1;overflow-y: auto;} #header .menu>li.product>ul>li.active>ul{display: flex;} #header .menu>li.product>ul>li>ul>li{width: 25%;padding: 15px;} #header .menu>li.product>ul>li>ul>li>a{display: flex;flex-direction: column;gap: 12px;} #header .menu>li.product>ul>li>ul>li>a img{object-fit: contain;width: 100%;aspect-ratio: 6/5;object-fit: contain;transition: all .3s;} #header .menu>li.product>ul>li>ul>li:hover>a img{transform: scale(1.05);} #header .menu>li.product>ul>li>ul>li>a span{display: flex;flex-direction: column;} #header .menu>li.product>ul>li>ul>li>a span span{color: #747474;} /* Footer */ #footer{background: #1a1a1a;color: #fff;} #footer a{color: #fff;} #footer a:hover{color: #fff !important;} .footer-main{padding: 80px 0 60px;} .footer-main .f-widget{flex-wrap: nowrap;} .footer-main .col-item{width: auto;max-width: 50%;} .footer-main .widget-title{text-transform: uppercase;font-weight: bold;margin-bottom: 12px;} .footer-main .widget:not(:last-child){margin-bottom: 24px;} .footer-main p,.footer-main ul,.footer-main table,.footer-main blockquote,.footer-main h1,.footer-main h2,.footer-main h3,.footer-main h4,.footer-main h5,.footer-main h6{margin-bottom: 10px;} .footer-main li:not(:last-child){margin-bottom: 10px;} .footer-main .social{display: flex;flex-wrap: wrap;column-gap: 16px;} .footer-main .social img{object-fit: contain;width: 22px;height: 22px;transition: all .3s;-webkit-filter: brightness(0) invert(1); filter: brightness(0) invert(1);} .footer-main .social img:hover{-webkit-filter: none; filter: none;} /* Page */ .breadcrumbs{font-weight: 500;} .breadcrumbs p{margin-bottom: 0;} .breadcrumbs .separator{padding: 0 10px;} .page-body{padding: 80px 0;} .page-body .section:not(:last-child){margin-bottom: 100px;} .page-banner{height: 400px;overflow: hidden;display: flex;align-items: center;} .page-banner .background{position: absolute;top: 0;left: 0;width: 100%;height: 100%;} .page-banner .inner{width: 100%;position: relative;z-index: 2;color: #fff;} .page-banner .inner .title{text-transform: uppercase;font-size: 48px;margin-bottom: 4px;} .page-banner .inner a{color: #fff;} .page-faqs .accordion-item{border-bottom: 1px solid rgba(0,0,0,.1);padding: 32px 0;} .page-faqs .accordion-item:first-child{border-top: 1px solid rgba(0,0,0,.1);} .page-faqs .accordion-button{width: 100%;font-weight: bold;font-size: 24px;color: #3f9926 !important;text-align: left;padding-right: 40px;font-weight: 600;} .page-faqs .accordion-button.collapsed{color: #000 !important;} .page-faqs .accordion-button .icon{width: 30px;height: 30px;border-radius: 50%;background-color: #3f9926;display: flex;align-items: center;justify-content: center;position: absolute;right: 0;top: 50%;transform: translateY(-50%);} .page-faqs .accordion-button .icon svg{fill: #fff;width: 14px;height: 14px;} .page-faqs .accordion-button.collapsed .icon{background-color: #000;transform: translateY(-50%) rotate(-90deg);} .page-faqs .accordion-body{padding: 32px 32px 16px;border: 1px solid #e5e5e5;margin-top: 16px;} /* Contact */ .contact-content{max-width: 560px;} .contact-form{background: #f5f5f5;padding: 40px;} .contact-content .content-post table{border: none;} .contact-content .content-post .table-bordered>:not(caption)>*>*{border-width: 0;} .contact-content .content-post .table-bordered>:not(caption)>*{border-width: 0;} .contact-content .content-post table td{padding: 8px 16px 8px 0;} .contact-content .content-post table td:last-child{padding-right: 0;} .contact-form .form textarea{height: 140px;} /* Technology */ .technology-body{padding: 50px 0 0;background-size: cover;background-repeat: no-repeat;background-position: top center;color: #fff;font-weight: 500;} .technology-body a{color: #fff;} .technology-body table{color: #fff;border: none;} .technology-body .table-bordered>:not(caption)>*>*{border-width: 0;} .technology-body .table-bordered>:not(caption)>*{border-width: 0;} .technology-body table td{padding: 8px 16px 8px 0;} .technology-body table td:last-child{padding-right: 0;} .technology-body .section:not(:last-child){padding-bottom: 140px;} .tech-sec1 .home-block{gap: 20px;max-width: 1006px;margin: 0 auto;} .tech-sec1 .sub{font-size: 20px;font-weight: 600;} .tech-sec1 .title{font-size: 48px;font-weight: 600;text-transform: uppercase;margin-bottom: 0;} .tech-sec1 .title span{color: #3f9926;} .tech-sec1 .image{padding-top: 20px;} .tech-sec2 .block{display: flex;align-items: center;flex-wrap: wrap;padding-bottom: 140px;} .tech-sec2 .block:last-child{padding-bottom: 0;} .tech-sec2 .block:nth-child(even){flex-direction: row-reverse;} .tech-sec2 .block .img{width: 50%;} .tech-sec2 .block .inner{width: 50%;padding: 0 40px;} .tech-sec2 .block .inner .box{display: block;margin: 0 auto;max-width: 475px;} /* About */ .about-banner{height: 600px;overflow: hidden;} .about-banner .background{position: absolute;top: 0;left: 0;width: 100%;height: 100%;} .about-banner .title{position: absolute;z-index: 2;left: 50%;transform: translateX(-50%);top: 0;display: inline-block;padding: 20px 40px;font-weight: 600;text-transform: uppercase;margin-bottom: 0;font-size: 40px;} .about-title{text-transform: uppercase;font-size: 32px;margin-bottom: 24px;} .about-title span{display: block;font-size: 24px;} .about-sec1{padding: 80px 0 40px;background-size: 100% auto;background-repeat: no-repeat;background-position: bottom center;} .about-sec1 .video{width: 100%;aspect-ratio: 16/9;overflow: hidden;border-radius:20px;} .about-sec1 .video iframe{width: 100%;height: 100%;} .about-sec2{padding: 40px 0;} .about-sec2 .item{height: 100%;display: flex;flex-direction: column;gap: 20px;} .about-sec2 .item .icon{height: 80px;display: flex;justify-content: center;} .about-sec2 .item .icon img{object-fit: contain;height: 100%;} .about-sec2 .item .inner{flex: 1;height: 100%;border-radius: 20px;border: 1px solid #e1e1e1;padding: 20px;} .about-sec2 .item .inner .name{text-transform: uppercase;font-size: 24px;margin-bottom: 20px;text-align: center;} .about-sec2 .item .inner .content p,.about-sec2 .item .inner .content ul,.about-sec2 .item .inner .content ol,.about-sec2 .item .inner .content table,.about-sec2 .item .inner .content blockquote{margin-bottom: 8px;} .about-sec2 .item .inner .content ul,.about-sec2 .item .inner .content ol{padding-left: 16px;} .about-sec3{padding: 40px 0 80px;} .about-sec3 .img{overflow: hidden;border-radius: 20px;} .about-sec4 .about-title{margin-bottom: 40px;} .about-sec4 .block{padding: 30px 0;background: #f9f6f1;display: flex;flex-wrap: wrap;overflow: hidden;} .about-sec4 .inner{width: 500px;padding: 0 40px 0 20px;display: flex;flex-direction: column;gap: 20px;} .about-sec4 .inner .capt{font-weight: 600;font-size: 48px;margin-bottom: 0;} .about-sec4 .inner .capt span{display: block;font-weight: normal;} .about-sec4 .inner .swiper-nav{margin-top: auto;} .about-sec4 .home-slider{width: calc(100% - 500px);} .swiper-feedback{margin: 0 -10px;} .swiper-feedback .swiper-slide{height: auto;padding: 0 10px;} .item-feedback{height: 100%;border: 1px solid #e1e1e1;padding: 10px;background: #fff;display: flex;flex-direction: column;gap: 20px;} .item-feedback .img{width: 100%;aspect-ratio: 3/2;overflow: hidden;} .item-feedback .img img{height: 100%;} .item-feedback .info{display: flex;flex-direction: column;gap: 15px;} .item-feedback .info .name{font-weight: 600;text-transform: uppercase;font-size: 20px;} .about-sec5{padding: 80px 0;} .about-sec6{padding: 80px 0;} /* Store */ .store-body{padding: 40px 0 80px;} .block-store .store-title{color: #fff;height: 60px;display: flex;align-items: center;justify-content: center;padding: 10px;background: #3f9926;font-weight: 600;text-transform: uppercase;} .block-store .store-filter{padding: 6px;display: flex;flex-wrap: wrap;border-left: 1px solid #f2f2f4;border-right: 1px solid #f2f2f4;} .block-store .store-filter .col{width: 50%;padding: 6px;} .block-store .store-body{border: 1px solid #f2f2f4;padding: 12px;max-height: 620px;overflow-y: auto;} .block-store .store-body .item:not(:last-child){padding-bottom: 12px;margin-bottom: 12px;border-bottom: 1px solid #f2f2f4;} .block-store .store-body .item .name{font-size: 18px;font-weight: 600;position: relative;padding-left: 25px;margin-bottom: 3px;} .block-store .store-body .item .name img{object-fit: contain;width: 20px;height: 20px;position: absolute;left: 0;top: 2px;} .block-store .store-body .item .it{padding-left: 25px;position: relative;font-size: 13px;margin-top: 2px;font-weight: 500;} .block-store .store-body .item .it img{object-fit: contain;width: 20px;height: 16px;position: absolute;left: 0;top: 0;} /* Category */ .category-menu{padding: 30px 0 50px;background: #fff;} .category-menu ul{list-style: none;margin-bottom: 0;} .category-menu .menu{display: flex;flex-wrap: wrap;gap: 16px;} .category-menu .menu li>a{display: inline-flex;align-items: center;justify-content: center;padding: 0 16px;height: 56px;min-width: 96px;border: 1px solid rgba(10,21,43,.1);font-weight: 600;} .category-menu .menu li:hover>a,.category-menu .menu li.current-menu-item>a{color: #fff;background: #3f9926;border-color: #3f9926;} .category-body{background: #f5f5f5;overflow: hidden;} .item-news{display: flex;flex-direction: column;gap: 20px;position: relative;} .item-news .img{overflow: hidden;aspect-ratio: 27/20;box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.2);} .item-news .img img{height: 100%;transition: all .7s;} .item-news .single-meta{padding: 10px 0;gap: 12px;} .item-news .single-meta .name{margin-bottom: 0;font-size: 20px;} .item-news .single-meta .desc *{margin-bottom: 0;} .category-list .col-item.action{width: 100%;padding-bottom: 140px;position: relative;} .category-list .col-item.action:after{content: "";display: block;width: 100vw;height: 100%;position: absolute;background: #fff;left: 50%;transform: translateX(-50%);top: -65px;} .category-list .col-item.action .item-news{z-index: 2;} .category-list .col-item.action:before{content: "";display: block;width: calc(100% - 30px);position: absolute;left: 15px;top: -60px;background: rgba(10,21,43,.2);height: 1px;z-index: 2;} .category-list .col-item.action .item-news{flex-direction: row;gap: 0;} .category-list .col-item.action .item-news .img{width: 55%;} .category-list .col-item.action .item-news .single-meta{width: 45%;padding: 0 20px 0 56px;gap: 24px;} .category-list .col-item.action .item-news .single-meta .name{font-size: 32px;} .item-news:hover .img img{transform: scale(1.05);} .pagination{justify-content: center;padding-top: 24px;margin-top: 50px;border-top: 1px solid rgba(10,21,43,.20);position: relative;} .pagination ul{margin-bottom: 0;list-style: none;display: flex;justify-content: center;align-items: center;column-gap: 30px;row-gap: 10px;} .pagination ul li{display: block;} .pagination ul li span,.pagination ul li a{display: flex;align-items: center;justify-content: center;font-weight: 600;height: 40px;} .pagination ul li span:hover,.pagination ul li a:hover{color: #3f9926;} .pagination ul li .current{background: #3f9926;width: 40px;color: #fff !important;} .pagination ul li a.next,.pagination ul li a.prev{width: 40px;height: 40px;border: 2px solid #3f9926;border-radius: 50%;transition: all .2s;background-size: 10px;background-repeat: no-repeat;background-position: center;font-size: 0;position: absolute;top: 24px;} .pagination ul li a.next{background-image: url(images/swiper-next.png);right: 0;} .pagination ul li a.prev{background-image: url(images/swiper-prev.png);left: 0;} .pagination ul li a.next:hover{background-image: url(images/swiper-next-white.png);background-color: #3f9926;} .pagination ul li a.prev:hover{background-image: url(images/swiper-prev-white.png);background-color: #3f9926;} /* Single */ .single-body.page-body{padding-top: 50px;} .single-block{display: flex;flex-direction: column;gap: 50px;} .single-bread{padding-bottom: 20px;border-bottom: 1px solid rgba(10,21,43,.2);display: flex;justify-content: space-between;} .single-bread .back{padding: 1px 0 1px 18px;position: relative;border-bottom: 1px solid #000;font-weight: 600;line-height: 20px;} .single-bread .back svg{width: 12px;height: 12px;position: absolute;left: 3px;top: 4px;transition: all .3s;} .single-bread .back:hover{border-bottom-color: #3f9926;} .single-bread .back:hover svg{fill: #3f9926;left: 0;} .single-bread .breadcrumbs{max-width: 680px;width: calc(100% - 80px); display: -webkit-box;overflow: hidden;-webkit-box-orient: vertical; -webkit-line-clamp: 1;color: #3f9926;} .single-bread .breadcrumbs a{color: #000;} .single-bread .breadcrumbs a:hover{color: #3f9926;} .single-bread .breadcrumbs .separator{color: #000;} .single-meta{display: flex;flex-direction: column;gap: 16px;} .single-meta .meta{display: flex;flex-wrap: wrap;column-gap: 12px;row-gap: 6px;} .single-meta .meta div{padding: 2px 12px;border: 2px solid #d2d2d2;text-transform: uppercase;font-size: 14px;line-height: 16px;font-weight: 600;} .single-meta .meta .cat{background: #3f9926;color: #fff;border-color: #3f9926;} .single-meta .home-title{margin-bottom: 0;} .single-content .content-post #ftwp-container-outer{width: 380px;overflow: unset;} .single-content .content-post #ftwp-postcontent{width: calc(100% - 380px);padding-left: 50px;} .ftwp-in-post#ftwp-container-outer.ftwp-float-none #ftwp-contents{border: 1px solid rgba(0,0,0,.1);} #ftwp-container.ftwp-wrap #ftwp-header{padding: 15px 25px;border-bottom: 1px solid rgba(0,0,0,.1);} #ftwp-container.ftwp-wrap #ftwp-header-control{display: none;} #ftwp-container.ftwp-wrap #ftwp-header-title{font-weight: 600;text-transform: uppercase;} #ftwp-container.ftwp-wrap #ftwp-list{padding: 10px 25px;} #ftwp-container.ftwp-wrap #ftwp-list .ftwp-anchor{padding: 10px 0;} #ftwp-container.ftwp-wrap #ftwp-list .ftwp-item:not(:last-child){border-bottom: 1px dashed rgba(0,0,0,.1);} #ftwp-container #ftwp-list.ftwp-list-nest.ftwp-colexp-icon .ftwp-anchor{padding-left: 0;} #ftwp-container #ftwp-list.ftwp-strong-first>.ftwp-item>.ftwp-anchor .ftwp-text{font-size: 16px;font-weight: 600;} #ftwp-container #ftwp-list.ftwp-list-nest.ftwp-liststyle-none .ftwp-anchor::before{display: none;} #ftwp-container.ftwp-wrap #ftwp-list .ftwp-anchor:focus, #ftwp-container.ftwp-wrap #ftwp-list .ftwp-active, #ftwp-container.ftwp-wrap #ftwp-list .ftwp-active:hover,#ftwp-container.ftwp-wrap #ftwp-list .ftwp-anchor:hover{color: #3f9926;} #ftwp-container #ftwp-list.ftwp-effect-bounce-to-left .ftwp-text::before, #ftwp-container #ftwp-list.ftwp-effect-bounce-to-right .ftwp-text::before, #ftwp-container #ftwp-list.ftwp-effect-radial-in .ftwp-text::before, #ftwp-container #ftwp-list.ftwp-effect-radial-out .ftwp-text::before, #ftwp-container #ftwp-list.ftwp-effect-rectangle-in .ftwp-text::before, #ftwp-container #ftwp-list.ftwp-effect-rectangle-out .ftwp-text::before, #ftwp-container #ftwp-list.ftwp-effect-shutter-in .ftwp-text::before{display: none;} .single-related{padding-top: 48px;border-top: 1px solid rgba(10,21,43,.2);} /* Recruitment */ .recruitment-block{background: #f5f5f5;padding: 60px 110px 80px;border: 1px solid rgba(10,21,43,.2);width: 1086px;max-width: 100%; display: block;margin: -360px auto 0;position: relative;z-index: 3;display: flex;flex-direction: column;gap: 32px;} .recruitment-block .home-title{margin-bottom: 0;} .recruitment-nb{font-weight: bold;} .recruitment-form .title{text-transform: uppercase;font-size: 24px;font-weight: 600;margin-bottom: 16px;} .recruitment-form .form textarea{height: 140px;} .recruitment-form .form input[type="submit"]{width: 100%;background-position: right calc(50% - 40px) center;} .category2-body{padding-top: 60px;} .category2-top .inner{display: flex;flex-direction: column;gap: 20px;} .category2-top .inner .home-title{margin-bottom: 0;} .category2-top .inner .sub span{display: inline-block;padding: 12px 25px;border-top: 1px solid #3f9926;border-bottom: 1px solid #3f9926;font-weight: 600;font-size: 20px;} .item-recruitment{margin-bottom: 40px;background: #f9f9f9;border: 1px solid #ddd;border-radius: 8px;padding: 15px;display: flex;flex-wrap: wrap;transition: all .2s;align-items: flex-start;} .item-recruitment:last-child{margin-bottom: 0;} .item-recruitment:hover{box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);} .item-recruitment .logo{width: 100px;aspect-ratio: 1/1;} .item-recruitment .logo img{object-fit: contain;width: 100%;height: 100%;} .item-recruitment .link{width: 165px;} .item-recruitment .link a{display: flex;align-items: center;justify-content: center;color: #fff;height: 42px;background: #3f9926;text-align: center;border-radius: 5px;} .item-recruitment .link a:hover{background: #545454;} .item-recruitment .info{width: calc(100% - 165px - 100px);padding-left: 15px;display: flex;flex-direction: column;gap: 6px;} .item-recruitment .info .name{text-transform: uppercase;margin-bottom: 0;font-size: 18px;font-weight: 600;} .item-recruitment .info .company{font-style: italic;color: #666;text-transform: uppercase;} .item-recruitment .info .meta{list-style: none;margin-bottom: 0;margin-top: 4px;display: flex;flex-wrap: wrap;column-gap: 15px;row-gap: 3px;font-size: 14px;color: #555;font-weight: 500;} .item-recruitment .info .meta li{display: flex;align-items: center;gap: 5px;} .item-recruitment .info .meta li svg{width: 16px;height: 14px;fill: #555;} .category2-form{display: block;margin: 0 auto;max-width: 1086px;} .category2-form .home-block{gap: 20px;} .category2-form .text{font-weight: 500;margin-bottom: 20px;} .category2-form .form textarea{height: 140px;} /* Page-product */ .product-top .group-image{height: calc(100vh - 72px);display: flex;align-items: flex-end;justify-content: center;} .product-top .group-image .tab-image{width: 930px;height: 80%;position: relative;max-width: 90%;} .product-top .group-image .tab-image .image{position: absolute;top: 0;left: 0;width: 100%;height: 100%;opacity: 0;} .product-top .group-image .tab-image .image.active{opacity: 1;} .product-top .group-image .tab-image .image img{width: 100%;height: 100%;object-fit: contain;} .product-top .group-info{position: absolute;z-index: 2;width: 100%;height: 100%;top: 0;left: 0;} .product-top .group-info .left{max-width: 390px;display: flex;flex-direction: column;gap: 20px;padding-top: 10vh;} .product-top .group-info .left .box-title{border-bottom: 1px solid rgb(10 21 43 / 20%);padding-bottom: 20px;display: flex;flex-direction: column;gap: 15px;} .product-top .group-info .left .box-title .title{text-transform: uppercase;font-size: 48px;margin-bottom: 0;} .product-top .group-info .left .box-title .sub{font-size: 20px;font-weight: 500;text-transform: uppercase;} .product-top .group-info .left .box-price{display: flex;flex-direction: column;font-weight: 500;} .product-top .group-info .left .box-price .price{font-size: 24px;font-weight: 600;color: #3f9926;} .product-top .group-info .left .box-button{display: flex;flex-direction: column;gap: 20px;} .product-top .group-info .left .box-button .home-cta:nth-child(even) a{background-color: transparent;border: 1px solid #3f9926;color: #3f9926;background-image: url(images/icon-submit2.png);} .product-top .group-info .right{max-width: 200px;width: 100%;padding-top: 10vh;display: flex;flex-direction: column;gap: 20px;} .product-top .group-info .right .box-info{border: 1px solid rgba(131,131,131,.3);background: rgba(255,255,255,.1);padding: 40px 20px;gap: 36px;display: flex;flex-direction: column;} .product-top .group-info .right .box-info .it{font-size: 12px;font-weight: 500;} .product-top .group-info .right .box-info .it span{display: block;} .product-top .group-info .right .box-info .it .value{font-size: 24px;line-height: 1;font-weight: 600;} .product-top .group-info .right .box-color{background: rgba(255,255,255,.1);padding: 8px 12px;border: 1px solid rgba(131,131,131,.3);border-radius: 30px;width: fit-content;display: flex;gap: 14px;margin: 0 auto;} .product-top .group-info .right .box-color .color{width: 12px;height: 12px;border-radius: 50%;background-color: transparent;position: relative;cursor: pointer;box-shadow: 0 0 0 1px rgba(0,0,0,.05);} .product-top .group-info .right .box-color .color:after{content: "";display: block;width: 16px;height: 16px;border-radius: 50%;position: absolute;top: -2px;left: -2px;opacity: 0;} .product-top .group-info .right .box-color .color.active:after{opacity: 1;} .product-content{padding: 50px 0;} .product-content .section:not(:last-child){padding-bottom: 100px;} .product-content .sec1 .home-block{margin: 0 auto;padding: 0 60px;width: 1200px;max-width: 100%;gap: 80px;} .product-content .sec1 .box-title{display: flex;flex-direction: column;gap: 15px;} .product-content .sec1 .box-title .home-title{margin-bottom: 0;} .product-content .sec1 .box-title .text{font-weight: 500;} .product-content .sec1 .box-360{aspect-ratio: 2/1;margin-bottom: 8%;} .product-content .sec1 .box-360 .box-circle{position: absolute;top: 0;left: 0;width: 100%;height: 100%;} .product-content .sec1 .box-360 .box-circle img{width: 100%;height: 100%;object-fit: cover;object-position: top center;} .product-content .sec1 .box-360 .box-shadow{position: absolute;width: 102%;bottom: -17%;left: -1%;} .product-content .sec1 .box-360 .box-shadow img{width: 100%;height: auto;object-fit: cover;} .product-content .sec1 .box-360 .box-image{width: 100%; z-index: 2;position: absolute;top: 50%;transform: translateY(-45%); left: 0;height: auto;} .product-content .sec1 .box-360 .box-image .swiper{width: 1000px;max-width: 100%;margin: 0 auto;} .product-content .sec1 .box-360 .box-image .image{width: 100%;aspect-ratio: 5/4;opacity: 0;} .product-content .sec1 .box-360 .box-image .swiper-slide-active .image{opacity: 1;} .product-content .sec1 .box-360 .box-image .image img{height: 100%;width: 100%;object-fit: contain;} .product-content .sec1 .box-360 .box-button{position: absolute;left: 50%;transform: translateX(-50%);bottom: -60px;z-index: 3;display: flex;align-items: center;gap: 14px;justify-content: center;} .product-content .sec1 .box-360 .box-button .icon{width: 50px;height: 50px;border-radius: 50%;border: 1px solid #000;font-weight: 600;position: relative;display: inline-flex;align-items: center;justify-content: center;text-align: center;} .product-content .sec1 .box-360 .box-button .icon:after{content: "";display: block;width: 70%;height: 100%;border: 1px solid #000;border-radius: 50%;position: absolute;top: 0;left: 50%;transform: translateX(-50%);} .product-content .sec1 .box-360 .box-button .gallery-prev,.product-content .sec1 .box-360 .box-button .gallery-next{top: auto;position: unset;transform: translateY(0);border: none;background: none;width: 24px;height: 24px;} .product-content .sec1 .box-360 .box-button .gallery-prev svg,.product-content .sec1 .box-360 .box-button .gallery-next svg{width: 18px;height: 18px;} .product-content .sec1 .box-info{position: absolute;width: 100%;height: 100%;top: 0;left: 0;} .product-content .sec1 .box-info .it{position: absolute;width: 10px;height: 10px;border-radius: 50%;background: #3f9926;box-shadow: 0 0 0 6px #3f99264d;} .product-content .sec1 .box-info .it .box{position: absolute;bottom: calc(100% + 10px);font-weight: 500;width: auto;left: 50%;transform: translateX(-50%);white-space: nowrap;} .product-content .sec1 .box-info .it .box .value{font-size: 34px;font-weight: 600;color: #3f9926;} .product-content .sec1 .box-info .it1{left: 0;bottom: 24%;} .product-content .sec1 .box-info .it2{left: 30%;top: 6%;} .product-content .sec1 .box-info .it3{right: 30%;top: 6%;} .product-content .sec1 .box-info .it4{right: 0;bottom: 24%;} .product-content .sec2 .home-block{gap: 50px;} .product-content .sec2 .block{display: flex;align-items: center;flex-wrap: wrap;} .product-content .sec2 .block:not(:last-child){padding-bottom: 100px;} .product-content .sec2 .block:nth-child(even){flex-direction: row-reverse;} .product-content .sec2 .block .inner{width: 50%;padding: 0 60px;} .product-content .sec2 .block .inner .box{max-width: 475px;display: block;margin: 0 auto;} .product-content .sec2 .block .img{width: 50%;} .product-content .sec2 .block table{border: none;} .product-content .sec2 .block .table-bordered>:not(caption)>*>*{border-width: 0;} .product-content .sec2 .block .table-bordered>:not(caption)>*{border-width: 0;} .product-content .sec2 .block table td{padding: 8px 16px 8px 0;} .product-content .sec2 .block table td:last-child{padding-right: 0;} .product-content .sec2 .bottom{display: flex;} .product-content .sec2 .bottom:after,.product-content .sec2 .bottom:before{content: "";display: block;width: 50%;height: 100%;position: absolute;top: 0;} .product-content .sec2 .bottom:before{left: 0;background: linear-gradient(180deg,#e3f9ed 1.41%,rgba(0,0,0,0) 27.38%);} .product-content .sec2 .bottom:after{right: 0;background: linear-gradient(-180deg,#e3f9ed 1.41%,rgba(0,0,0,0) 27.38%)} .product-content .sec2 .bottom .img{width: 100%;height: 100%;} .product-content .sec2 .bottom .img img{height: 100%;object-fit: cover;} .product-content .sec2 .bottom .img img.mb{display: none;} .product-content .sec2 .bottom .box{position: absolute;top: 56px;left: 50%;transform: translateX(-50%);z-index: 2;padding: 60px 20px;width: 412px;max-width: 100%;} .product-feature{padding: 50px 0;background: #fff;} .product-feature .home-block{gap: 36px;} .product-feature .home-title{padding-bottom: 12px;} .product-feature .tab-title{list-style: none;margin-bottom: 0;border-bottom: 1px solid #ebebeb;display: flex;justify-content: center;column-gap: 45px;} .product-feature .tab-title button{padding: 0 15px 8px;background: transparent;border: none; border-bottom: 3px solid transparent;text-transform: uppercase;color: #636363;font-weight: 600;font-size: 14px;} .product-feature .tab-title button.active{color: #3f9926;border-bottom-color: #3f9926;} .product-feature .tab-content{background: #f5f5f5;} .product-feature .tab-content .img{width: 56.25%;} .product-feature .tab-content .inner{width: 43.75%;padding: 40px 60px;} .product-specs{padding: 50px 0 80px;background: #f5f5f5;} .fade{transition: all .1s;} .product-specs .box-info{display: flex;flex-wrap: wrap;} .product-specs .box-info .col-title{width: calc(100% / 3);padding-top: 72px;} .product-specs .box-info .col-info{width: calc(100% / 3);padding: 0 20px 0 40px;} .product-specs .box-info .box-image{width: 300px;max-width: 100%;aspect-ratio: 6/5;overflow: hidden;position: relative;} .product-specs .box-info .box-image .image{position: absolute;top: 0;left: 0;width: 100%;height: 100%;opacity: 0;} .product-specs .box-info .box-image .image.active{opacity: 1;} .product-specs .box-info .box-image .image img{width: 100%;height: 100%;object-fit: contain;} .product-specs .box-info .box-color{background: rgba(255,255,255,.1);padding: 8px 12px;border: 1px solid rgba(131,131,131,.3);border-radius: 30px;width: fit-content;display: flex;gap: 14px;margin-bottom: 15px;} .product-specs .box-info .box-color .color{width: 12px;height: 12px;border-radius: 50%;background-color: transparent;position: relative;cursor: pointer;box-shadow: 0 0 0 1px rgba(0,0,0,.05);} .product-specs .box-info .box-color .color:after{content: "";display: block;width: 16px;height: 16px;border-radius: 50%;position: absolute;top: -2px;left: -2px;opacity: 0;} .product-specs .box-info .box-color .color.active:after{opacity: 1;} .product-specs .box-info .home-cta{margin-bottom: 15px;} .product-specs .box-info .name{text-transform: uppercase;font-size: 18px;margin-bottom: 8px;font-weight: 600;} .product-specs .box-info .price{font-size: 18px;font-weight: bold;color: #3f9926;} .product-specs .box-specs{margin-top: 40px;display: flex;flex-direction: column;gap: 20px;} .product-specs .accordion-button{background: #e5e5e5;font-weight: bold;width: 100%;text-transform: uppercase;font-size: 20px;min-height: 68px;} .product-specs .accordion-button>div{width: calc(100% / 3);padding: 8px 20px 6px 40px;} .product-specs .accordion-button svg{position: absolute;width: 18px;height: 18px;top: 50%;transform: translateY(-50%);right: 24px;} .product-specs .accordion-button.collapsed svg{transform: rotate(180deg);} .product-specs .accordion-body{background: #fff;padding: 35px 0;display: flex;flex-direction: column;gap: 30px;font-weight: 500;} .product-specs .accordion-body .hang{display: flex;} .product-specs .accordion-body .hang>div{width: calc(100% / 3);padding: 0 20px 0 40px;} .product-specs .box-note{padding-top: 28px;margin-top: 56px;border-top: 1px solid rgba(10,21,43,.2);} .product-specs .box-note .content{max-width: 1360px;color: #a6a6a6;} .product-specs .box-note .content *{margin-bottom: 0;} .product-specs .box-note .content ul,.product-specs .note .content ol{padding-left: 16px;} /* Product */ .swiper-product{margin: -10px;} .swiper-product .swiper-wrapper{justify-content: center;} .swiper-product .swiper-slide{padding: 10px;} .product-prev,.product-next{background-color: transparent;border: none;background-image: none !important;width: 32px;height: 32px;} .product-prev svg,.product-next svg{transition: all .2s;width: 18px;height: 18px;} .product-prev:hover svg,.product-next:hover svg{fill: #fff;} .item-product{height: 100%;display: flex;flex-direction: column;gap: 20px;} .item-product .box-thumb{background: #fff;box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.1);border-radius: 5px;} .item-product .box-thumb .top{padding: 20px;display: flex;align-items: center;justify-content: space-between;} .item-product .box-thumb .top .sub{text-transform: uppercase;font-weight: 600;} .item-product .box-thumb .top .tag{height: 30px;display: flex;align-items: center;justify-content: center;text-align: center;text-transform: uppercase;color: #3f9926;border: 1px solid #3f9926;font-weight: 600;white-space: nowrap;padding: 0 16px;font-size: 14px;} .item-product .box-thumb .image{position: relative;width: 100%;aspect-ratio: 6/5;overflow: hidden;} .item-product .box-thumb .image img{position: absolute;width: 100%;height: 100%;top: 0;left: 0;object-fit: contain;transition: all .2s;} .item-product .box-thumb .image img.hover{opacity: 0;} .item-product .box-thumb .color{position: absolute;bottom: 20px;left: 50%;transform: translateX(-50%);border: 1px solid #e0e0e0;background: #fff;display: flex;align-items: center;justify-content: center;padding: 8px 12px;gap: 8px;border-radius: 30px;} .item-product .box-thumb .color .dot{width: 8px;height: 8px;border-radius: 50%;box-shadow: 0 0 0 1px rgba(0,0,0,.05);} .item-product:hover .box-thumb .image img.hover{opacity: 1;} .item-product:hover .box-thumb .image img.main{opacity: 0;} .item-product .box-info .name{text-transform: uppercase;margin-bottom: 4px;font-size: 24px;} .item-product .box-info .price{font-size: 18px;font-weight: 600;color: #7e7e7e;} .item-product .box-info .home-cta{padding-top: 12px;} .item-product .box-info .home-cta a{background-color: #fff;border: 1px solid #3f9926;color: #3f9926;background-image: url(images/icon-submit2.png);} /* Detail */ body.single-product{padding-top: 0;} body.single-product #header,body.single-product #footer{display: none;} .detail-body{height: 100vh;display: flex;flex-wrap: wrap;} .detail-body .col-menu{width: 117px;} .detail-body .menu-product{list-style: none;margin-bottom: 0;display: flex;flex-direction: column;gap: 24px;padding: 24px 0;overflow-y: auto;height: 100vh;} .detail-body .menu-product::-webkit-scrollbar{width: 4px;background: #f5f5f5;} .detail-body .menu-product::-webkit-scrollbar-thumb{background-color: #3f9926;} .detail-body .menu-product>li>a{display: flex;flex-direction: column;gap: 8px;font-size: 12px;font-weight: 500;text-align: center;padding: 8px;opacity: .4;position: relative;color: #000;} .detail-body .menu-product>li>a:after{content: "";display: block;width: calc(100% - 16px);height: 66px;background: #e9e9e9;transition: all .5s;position: absolute;top: 8px;left: 8px;z-index: -1;} .detail-body .menu-product>li.current-menu-item>a,.detail-body .menu-product>li:hover>a{opacity: 1;} .detail-body .menu-product>li.current-menu-item>a:after,.detail-body .menu-product>li:hover>a:after{height: 100%;width: 100%;top: 0;left: 0;} .detail-body .menu-product>li.current-menu-item>a:after{background: #393939;} .detail-body .menu-product>li.current-menu-item>a{color: #fff;} .detail-body .menu-product>li>a img{width: 100%;aspect-ratio: 5/3;object-fit: contain;} .detail-body .menu-product>li>a span{padding: 0 !important;} .detail-body .col-main{width: calc(100% - 117px);display: flex;flex-wrap: wrap;box-shadow: 0 0 0 1px #E5E5E5;} .detail-body .detail-image{width: 56%;padding: 0 24px;position: relative;display: flex;align-items: center;} .detail-body .detail-image .swiper{width: 100%;} .detail-body .detail-image .swiper-slide{transition: none !important;} .detail-body .detail-image .image{width: 100%;aspect-ratio: 7/5;overflow: hidden;opacity: 0;} .detail-body .detail-image .image img{width: 100%;height: 100%;object-fit: contain;} .detail-body .detail-image .swiper-slide-active .image{opacity: 1;} .images-prev{left: 0;} .images-next{right: 0;} .detail-body .detail-image:before{content: "";display: block;height: 36%;top: auto;left: 0;width: 100%; bottom: 0;position: absolute;background: linear-gradient(180deg,#ededed 0%,rgba(237,237,237,0) 100%);} .detail-body .detail-image .back{position: absolute;z-index: 2;top: 24px;right: 24px;line-height: 20px;font-weight: 600;border-bottom: 1px solid #000;padding: 1px 0 1px 18px;} .detail-body .detail-image .back svg{width: 12px;height: 12px;position: absolute;left: 3px;top: 4px;transition: all .3s;} .detail-body .detail-image .back:hover{border-bottom-color: #3f9926;} .detail-body .detail-image .back:hover svg{fill: #3f9926;left: 0;} .detail-body .detail-image .specs{height: 25%;position: absolute;bottom: 0;left: 0;z-index: 2;width: 100%;display: flex;align-items: center;} .detail-body .detail-image .specs .list{display: flex;align-items: center;flex-wrap: wrap;width: 700px;max-width: 100%;margin: 0 auto;} .detail-body .detail-image .specs .list .it{width: calc(100% / 3);padding: 0 15px;font-weight: 500;font-size: 12px;white-space: nowrap;} .detail-body .detail-image .specs .list .it .value{font-size: 24px;font-weight: 600;color: #3f9926;} .detail-body .detail-info{width: 44%;max-height: 100vh;overflow-y: auto;border-left: 1px solid rgba(10,21,43,.1);padding: 64px 48px;} .detail-body .detail-info .title{text-transform: uppercase;font-size: 56px;margin-bottom: 36px;} .detail-body .detail-info .box-color{margin-bottom: 24px;} .detail-body .detail-info .box-color .capt{font-size: 20px;font-weight: 600;margin-bottom: 12px;} .detail-body .detail-info .box-color .slide-color{position: relative;} .detail-body .detail-info .box-color .swiper-wrapper{display: inline-flex;width: auto;border: 1px solid rgba(131,131,131,.3);background: rgba(255,255,255,.11);border-radius: 30px;padding: 6px 6px;} .detail-body .detail-info .box-color .swiper-slide{width: 16px;margin: 0 6px;} .detail-body .detail-info .box-color .color{width: 16px;height: 16px;border-radius: 50%;display: flex;align-items: center;justify-content: center;border: 1px solid transparent;cursor: pointer;} .detail-body .detail-info .box-color .color .dot{width: 12px;height: 12px;border-radius: 50%;display: block;background-color: transparent;box-shadow: 0 0 0 1px rgba(0,0,0,.05);} .detail-body .detail-info .box-color .color .name{display: block;font-weight: 500;position: absolute;left: calc(100% + 20px);white-space: nowrap;display: none;} .detail-body .detail-info .divider{display: block;width: 100%;height: 1px;background: rgb(10 21 43 / 20%);margin: 20px 0;} .detail-body .detail-info .box-price{display: flex;align-items: flex-start;margin-bottom: 20px;justify-content: space-between;} .detail-body .detail-info .box-price .capt{font-weight: 600;} .detail-body .detail-info .box-price .box{text-align: right;max-width: 204px;} .detail-body .detail-info .box-price .box .price{font-size: 20px;font-weight: 600;color: #3f9926;} .detail-body .detail-info .box-price .box .price del{margin-bottom: 8px;opacity: 1;color: #555;} .detail-body .detail-info .box-price .box .price ins{text-decoration: none;} .detail-body .detail-info .box-price .box .sub{font-size: 10px;font-style: italic;font-weight: 500;} .detail-body .detail-info .home-cta a{width: 100%;background-position: right calc(50% - 40px) center;} .detail-body .detail-info .home-cta a:hover{background-position: right calc(50% - 50px) center;} /* Cart */ .woocommerce-notices-wrapper{display: none;} .woocommerce table.shop_table thead,.woocommerce table.shop_table tbody,.woocommerce table.shop_table tfoot{padding: 15px 0;display: flex;flex-direction: column;gap: 20px;} .woocommerce table.shop_table thead{border-bottom: 1px solid #e8e8e8;} .woocommerce table.shop_table thead th,.woocommerce table.shop_table thead td{font-weight: 600 !important;} .woocommerce table.shop_table tfoot{border-top: 1px solid #e8e8e8;} .woocommerce table.shop_table tr{display: flex;justify-content: space-between;padding: 0 15px;border-width: 0 !important;align-items: center;gap: 20px;} .woocommerce table.shop_table tr.tr-actions{display: none;} .woocommerce table.shop_table td,.woocommerce table.shop_table th{padding: 0;border-width: 0 !important;} .woocommerce table.shop_table tr td:last-child,.woocommerce table.shop_table tr th:last-child{margin-left: auto;} .woocommerce table.shop_table .product-quantity{display: none;} .woocommerce table.shop_table .cart-subtotal{display: none;} .woocommerce table.shop_table .product-price{display: none;} .woocommerce table.shop_table .product-thumbnail img{width: 80px;height: auto;aspect-ratio: 6/5; object-fit: contain;} .woocommerce table.shop_table .product-name{font-weight: 500;font-size: 18px;} .woocommerce table.shop_table span.amount{font-weight: 600;font-size: 21px;color: #3f9926;} .cart-collaterals h2{font-size: 24px;} #customer_details{float:left;width:calc(100% - 440px - 60px);margin-bottom:0;margin-right: 60px;} #customer_details .col-1,#customer_details .col-2,.woocommerce div.product form.cart table.variations td.value{width:100%} #order_review{float:right;width:440px;} .woocommerce-billing-fields__field-wrapper{margin: 0 -10px;} .woocommerce-additional-fields__field-wrapper{margin: 0 -10px;} .woocommerce form .form-row{padding: 0 10px;margin: 0 0 20px;} .woocommerce form .form-row-first, .woocommerce form .form-row-last, .woocommerce-page form .form-row-first, .woocommerce-page form .form-row-last{width: 50%;} .woocommerce form .form-row label{line-height: normal;margin-bottom: 5px;font-weight: 500;} .woocommerce form .form-row .input-text, .woocommerce form .form-row select{line-height: 24px;border-radius: 5px;border: 1px solid #e8e8e8;background: #fbfbfb;padding: 12px 16px;} .woocommerce form .form-row textarea{height: 140px !important;} .select2-container .select2-selection--single{height: 50px;} .select2-container .select2-dropdown, .select2-container .select2-selection{background-color: #fbfbfb;border: 1px solid #e8e8e8;border-radius: 5px;} .select2-container .select2-selection--single .select2-selection__rendered{color: #000;line-height: 48px;padding: 0 16px;} .select2-container .select2-selection--single .select2-selection__arrow{} #add_payment_method #payment, .woocommerce-cart #payment, .woocommerce-checkout #payment{background: transparent;border-radius: 0;} #add_payment_method #payment ul.payment_methods, .woocommerce-cart #payment ul.payment_methods, .woocommerce-checkout #payment ul.payment_methods{display: none;} #add_payment_method #payment .place-order.woocommerce-cart #payment .place-order, .woocommerce-checkout #payment .place-order{padding: 0 !important;margin-bottom: 0 !important;} .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) #respond input#submit, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) a.button, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) button.button, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) input.button, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor)) .woocommerce #respond input#submit, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor)) .woocommerce a.button, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor)) .woocommerce button.button, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor)) .woocommerce input.button{font-weight: 500;color: #fff !important; text-transform: uppercase;font-size: 14px !important;height: 50px;padding: 0 20px !important;display: flex !important;align-items: center;justify-content: center;background: #3f9926 !important;width: 100%;line-height: normal !important;} .woocommerce #payment #place_order, .woocommerce-page #payment #place_order{float: none;} .woocommerce-checkout-review-order-table thead{display: none !important;} .woocommerce-checkout-review-order-table tbody .product-total{display: none;} .woocommerce-checkout-review-order-table .product-name img{margin-right: 15px;width: 80px;height: 80px;object-fit: contain;border: 1px solid #e8e8e8;border-radius: 5px;} /* Thankyou */ .woocommerce-customer-details{display: none;} /* Account */ .account-body .box-login{background: #fff;padding: 20px;border: 2px solid #1a1a1a;width: 468px;max-width: 100%;display: block;margin: 0 auto;} .account-body .box-login #customer_login h2{font-weight: bold;} .account-body .box-login .woocommerce form.login,.account-body .box-login .woocommerce form.register{border: none;margin: 0;padding: 0;border-radius: 0;} .account-body .box-login [type="submit"]{width: 100%;} .account-body .box-login .lost_password{margin-bottom: 16px;float: right; font-size: 14px;font-weight: 500;} .account-body .box-login .woocommerce-form-login__rememberme{margin-bottom: 16px;float: left;font-size: 14px;} .account-body .box-login .note{font-size: 14px;font-weight: 500;padding-top: 4px;} .account-body .box-login .note a{color: #02AEEE;} .account-body .box-login .u-column2{display: none;} .account-body .box-login .note .note2{display: none;} .account-body .box-login.active .u-column2{display: block;} .account-body .box-login.active .u-column1{display: none;} .account-body .box-login.active .note .note2{display: block;} .account-body .box-login.active .note .note1{display: none;} .zek_block_login{background: #fff;padding: 30px;border: 2px solid #19334C;} .woocommerce-account .woocommerce-MyAccount-navigation{float: none;width: 100%;} .woocommerce-account .woocommerce-MyAccount-navigation ul{list-style: none;display: flex;flex-wrap: wrap;gap: 10px;margin-bottom: 24px;} .woocommerce-account .woocommerce-MyAccount-navigation ul li{width: calc((100% - 50px) / 6);margin-bottom: 0;text-align: center;} .woocommerce-account .woocommerce-MyAccount-navigation ul li a{font-weight: 600;display: block;padding: 10px;border: 2px solid #1A1A1A;color: #19334C;} .woocommerce-account .woocommerce-MyAccount-navigation ul li.is-active a{color: #fff;background: #1A1A1A;} .woocommerce-account .woocommerce-MyAccount-content{float: none;width: 100%;} .woocommerce-account .addresses .title .edit{font-size: 12px;font-weight: 500;padding: 2px 4px;background: #1A1A1A;color: #fff;border-radius: 4px;} .woocommerce table.my_account_orders td.woocommerce-orders-table__cell-order-actions a, .woocommerce table.my_account_orders th.woocommerce-orders-table__cell-order-actions a{margin: 5px;} .woocommerce-EditAccountForm fieldset legend{font-weight: bold;font-size: 20px;margin-bottom: 16px;} .woocommerce-account .addresses .title h3{font-size: 18px;font-weight: bold;} /* Home */ .home-banner .img{width: 100%;aspect-ratio: 8/3;overflow: hidden;} .home-banner .img img{height: 100%;} .banner-prev{left: 1%;border: none;background-color: rgba(255, 255, 255, 0.1);background-image: url(images/swiper-prev-white.png);} .banner-next{right: 1%;border: none;background-color: rgba(255, 255, 255, 0.1);background-image: url(images/swiper-next-white.png);} .home-body{padding-top: 80px;background: #f2f3f4;} .home-body .section{padding-bottom: 100px;} .home-block{display: flex;flex-direction: column;gap: 48px;} .home-title{text-transform: uppercase;font-size: 40px;margin-bottom: 32px;font-weight: 600;} .home-title.small{font-size: 32px;margin-bottom: 24px;} .home-block .home-title{margin-bottom: 0;} .home-sec1 .item{display: block;position: relative;aspect-ratio: 6/5;overflow: hidden;} .home-sec1 .item:after{content: "";display: block;width: 100%;height: 40%;position: absolute;top: 0;left: 0;transition: all .7s;background: linear-gradient(0deg,rgba(0,0,0,0),rgba(0,0,0,1));opacity: .4;} .home-sec1 .item:hover:after{opacity: .6;} .home-sec1 .item img{width: 100%;height: 100%;object-fit: cover;transition: all .7s;} .home-sec1 .item:hover img{transform: scale(1.03);} .home-sec1 .item .box{width: 100%;position: absolute;z-index: 2;top: 0;left: 0;padding: 48px 40px 0;display: flex;flex-direction: column;gap: 8px;color: #fff;} .home-sec1 .item .box .name{font-weight: 600;text-transform: uppercase;margin-bottom: 0;font-size: 32px;} .home-sec1 .item .box .link .vl{padding: 4px 20px 4px 0;font-weight: 500;position: relative;display: inline-flex;} .home-sec1 .item .box .link .vl .txt{display: inline-block;transition: all .3s;} .home-sec1 .item .box .link .vl:before{content: "";width: 0;height: 1px;background: #3f9926;position: absolute;bottom: 0;left: 0;transition: all .3s;} .home-sec1 .item .box .link .vl:after{content: attr(data-button-text);font-weight: 500;opacity: 0;transform: translateY(150%);position: absolute;left: 0;top: 50%;color: #3f9926;transition: all .3s;} .home-sec1 .item .box .link .vl img{width: 10px;height: 10px;object-fit: contain;position: absolute;right: 0;top: 11px;} .home-sec1 .item .box .link .vl:hover:before{width: 100%;} .home-sec1 .item .box .link .vl:hover:after{transform: translateY(-50%);opacity: 1;} .home-sec1 .item .box .link .vl:hover .txt{transform: translateY(-100%);opacity: 0;} .swiper-news{margin: -15px;} .swiper-news .swiper-slide{padding: 15px;} .news-prev,.news-next{top: 36%;} .home-sec4 .gallery{margin-top: 60px;} .home-sec4 .img{width: 100%;overflow: hidden;aspect-ratio: 1/1;position: relative;} .home-sec4 .img img{height: 100%;} .home-sec4 .col-item:nth-child(even) .img{margin-top: -60px;} .home-sec5{padding: 15% 0 150px;display: flex;align-items: center;position: relative;} .home-sec5:before{content: "";display: block;position: absolute;top: 0;left: 0;height: 15%;width: 100%;background: linear-gradient(0deg,rgba(0,0,0,0),#f2f3f4);} .home-sec5 .inner{width: 100%;display: flex;justify-content: space-around;position: relative;z-index: 2;flex-wrap: wrap;gap: 40px;} .home-sec5 .inner .item{display: flex;flex-direction: column;gap: 4px;color: #fff;min-width: 300px;} .home-sec5 .inner .item .name{text-transform: uppercasef;font-weight: 600;} .home-sec5 .inner .item .number .vl{font-size: 44px;font-weight: 500;} .home-sec5 .inner .item .number .sub{font-size: 20px;top: -1em;left: .2em;font-weight: 500;} @media (max-width: 1399px) { .container-fluid{--bs-gutter-x: 60px;} #header .menu{column-gap: 40px;} #header .menu > li.product > ul{padding: 32px 30px;} #header .menu > li.product > ul::after{left: 280px;} #header .menu > li.product > ul > li > ul{left: 300px;width: calc(100% - 60px - 270px);} .about-sec4 .inner{width: 420px;} .about-sec4 .home-slider{width: calc(100% - 420px);} } @media (max-width: 1199px) { body{font-size: 15px;} .container{--bs-gutter-x: 60px;} h1{font-size: 32px;} h2{font-size: 28px;} h3{font-size: 22px;} h4{font-size: 18px;} h5{font-size: 14px;} h6{font-size: 14px;} #header .menu{column-gap: 30px;} .home-sec5{min-height: 500px;padding-bottom: 100px;} .footer-main{padding: 50px 0 30px;} .page-banner{height: 320px;} .page-banner .inner .title{font-size: 40px;} .page-body{padding: 60px 0;} .home-title{font-size: 32px;margin-bottom: 24px;} .home-title.small{font-size: 24px;margin-bottom: 20px;} .contact-form{padding: 30px;} .page-body .section:not(:last-child){margin-bottom: 60px;} .home-block{gap: 32px;} .home-block .home-title{margin-bottom: 0;} .page-faqs .accordion-item{padding: 20px 0;} .page-faqs .accordion-button{font-size: 18px;} .page-faqs .accordion-body{padding: 20px 20px 10px;} .category-menu{padding: 30px 0;} .category-menu .menu li > a{height: 45px;} .item-news{gap: 15px;} .item-news .single-meta .name{font-size: 18px;} .category-list .col-item.action{padding-bottom: 110px;} .category-list .col-item.action:after{top: -45px;} .category-list .col-item.action:before{top: -35px;} .pagination{margin-top: 40px;} .category-list .col-item.action .item-news .single-meta{padding: 0 0 0 40px;gap: 20px;} .category-list .col-item.action .item-news .single-meta .name{font-size: 24px;} .single-body.page-body{padding-top: 40px;} .single-block{gap: 40px;} .single-content .content-post #ftwp-container-outer{width: 300px;} .single-content .content-post #ftwp-postcontent{width: calc(100% - 300px);padding-left: 30px;} #ftwp-container.ftwp-wrap #ftwp-header{padding: 15px;font-size: 20px;} #ftwp-container.ftwp-wrap #ftwp-list{padding: 10px 15px;} .single-related{padding-top: 40px;} .about-banner{height: 500px;} .about-banner .title{font-size: 36px;padding: 15px 30px;} .about-sec1{padding: 60px 0 30px;} .about-sec2{padding: 30px 0;} .about-sec2 .item .inner .name{font-size: 22px;margin-bottom: 15px;} .about-sec3{padding: 30px 0 60px;} .about-sec4 .about-title{margin-bottom: 30px;} .about-sec4 .inner .capt{font-size: 42px;} .item-feedback{gap: 15px;} .item-feedback .info{gap: 10px;} .about-sec5{padding: 60px 0;} .about-sec6{padding: 60px 0;} .item-feedback .info .name{font-size: 18px;} .technology-body{padding: 80px 0 0;} .technology-body .section:not(:last-child){padding-bottom: 100px;} .tech-sec1 .sub{font-size: 18px;} .tech-sec1 .title{font-size: 40px;} .tech-sec2 .block{padding-bottom: 100px;} .item-recruitment{margin-bottom: 30px;} .recruitment-block{padding: 40px 60px 60px;margin: -260px auto 0;} .product-top .group-info .left .box-title .title{font-size: 40px;} .product-content{padding: 80px 0;} .product-content .section:not(:last-child){padding-bottom: 80px;} .product-content .sec2 .block .inner{padding: 0 30px;} .product-content .sec2 .block:not(:last-child){padding-bottom: 80px;} .product-content .sec2 .bottom .box{padding: 40px 20px;} .product-content .sec2 .bottom{min-height: 480px;} .product-feature{padding: 80px 0;} .product-feature .tab-title{column-gap: 40px;} .product-feature .home-title{padding-bottom: 0;} .product-feature .tab-content .inner{padding: 20px 30px;} .product-specs .box-note{padding-top: 20px;margin-top: 40px;} .product-specs .accordion-button{font-size: 18px;min-height: 60px;} .product-specs .accordion-button > div{padding: 8px 10px 6px 20px;} .product-specs .accordion-body{padding: 25px 0;gap: 20px;} .product-specs .accordion-body .hang > div{padding: 8px 15px 6px 20px;} .detail-body .menu-product{padding: 20px 0;gap: 20px;} .detail-body .detail-info{padding: 45px 30px;} .detail-body .detail-info .title{font-size: 42px;margin-bottom: 24px;} .detail-body .detail-info .box-color .capt{font-size: 18px;} .home-body{padding-top: 60px;} .home-body .section{padding-bottom: 70px;} } @media (max-width: 991px) { html { overflow-y: scroll; height: 100%; -webkit-overflow-scrolling: touch; overflow-scrolling: touch; } body {padding-top: 65px; overflow-y: visible; position: relative; } html, body { overflow-x: hidden; margin: 0; } .container-fluid{--bs-gutter-x: 40px;} .container{--bs-gutter-x: 40px;} #main{overflow: hidden;} .supports .item a{width: 44px;height: 44px;} .supports .item a img{max-width: 24px;max-height: 24px;} .supports .item a.zalo img{max-width: 30px;} .backtop a{width: 44px;height: 44px;} .backtop a img{max-width: 24px;max-height: 24px;} #header .col-menu{display: none;} #header .col-touch{display: block;width: 50px;} #header .logo{height: 65px;display: flex;align-items: center;} #touch-menu{cursor: pointer;height: 20px;display: flex;align-items: center;} #touch-menu span{position: relative;width: 20px;height: 16px;display: block;} #touch-menu span i{width: 100%;height: 2px;background: #000;display: block;position: absolute;left: 0;transition-duration: .25s; transition-property: all; transition-timing-function: ease; transition-delay: 0s;} #touch-menu span i:nth-child(1){top: 0;} #touch-menu span i:nth-child(2){top: 7px;} #touch-menu span i:nth-child(3){bottom: 0;width: 15px;left: auto;right: 0;} html.active-menu{overflow: hidden;} html.active-menu #touch-menu span i:nth-child(1){transform: rotate(45deg);top: 9px;} html.active-menu #touch-menu span i:nth-child(2){width: 0;left: 50%;} html.active-menu #touch-menu span i:nth-child(3){transform: rotate(-45deg);bottom: 5px;width: 100%;} .line-dark{opacity: 0;transition: all .5s;visibility: hidden;width: 100%;height: 100%;position: fixed;top: 0;left: 0;background-color: rgba(0,0,0,.6);z-index: 990} html.active-menu .line-dark{opacity: 1;visibility: visible;cursor: url(images/close.png) 20 20,default;} #menu-mobile{display: block;transition: all .5s; background: #fff;z-index: 990;position: fixed;width: 425px;max-width: 100%; height: calc(100% - 65px);top: 65px;left: -425px;opacity: 0;visibility: hidden;padding: 30px 20px;overflow-y: auto;} html.active-menu #menu-mobile{opacity: 1;visibility: visible;left: 0;} #menu-mobile .close{width: 24px;height: 24px;cursor: pointer;background-image: url(images/close-menu.png);background-size: 18px;background-repeat: no-repeat;background-position: center;position: absolute;top: 12px;right: 12px;} #menu-mobile ul{list-style: none;margin-bottom: 0;} #menu-mobile .menu{font-weight: 600;} #menu-mobile .menu ul{display: none;padding-left: 15px;padding-top: 5px;margin-top: 5px;} #menu-mobile .menu li{position: relative;border-bottom: 1px solid rgba(10,21,43,.1);margin-bottom: 10px;padding-bottom: 10px;} #menu-mobile .menu ul>li:first-child{border-top: 1px solid rgba(10,21,43,.05);padding-top: 10px;} #menu-mobile .menu ul>li:last-child{border-bottom: 0;margin-bottom: 0;padding-bottom: 0;} #menu-mobile .menu li>a{display: flex;align-items: center;min-height: 36px;} #menu-mobile .menu li>svg{width: 24px;height: 24px;cursor: pointer;padding: 6px;position: absolute;right: 0;top: 6px;transition: all .3s;} #menu-mobile .menu li.re-arrow>svg{transform: rotate(180deg);} #menu-mobile .menu ul>li:first-child>svg{top: 16px;} #menu-mobile .menu li.re-arrouw>svg{transform: rotate(180deg);} #menu-mobile .menu>li.product>ul>li>ul{border-top: 1px solid rgba(10,21,43,.1);margin-top: 10px;padding-left: 0;} #menu-mobile .menu>li.product>ul>li>ul>li{width: 50%;padding: 10px !important;margin: 0 !important;display: inline-block;border: none !important;float: left;} #menu-mobile .menu>li.product>ul>li>ul>li:nth-child(2n+1){clear: both;} #menu-mobile .menu>li.product>ul>li>ul>li>a{flex-direction: column;gap: 8px;font-size: 13px;} #menu-mobile .menu>li.product>ul>li>ul>li>a img{width: 100%;aspect-ratio: 6/5;object-fit: contain;transition: all .3s;} #menu-mobile .menu>li.product>ul>li>ul>li:hover>a img{transform: scale(1.04);} #menu-mobile .menu>li.product>ul>li>ul>li>a span{padding: 0 !important;display: flex;flex-direction: column;} #menu-mobile .menu>li.product>ul>li>ul>li>a span span{color: #747474;} .footer-main .col-item{max-width: 40%;} .sticky{position: relative;top: auto;} .page-banner{height: 254px;} .category-list .col-item.action .item-news .single-meta{padding: 0 0 0 30px;} .single-content .content-post #ftwp-container-outer{width: 100%;} .single-content .content-post #ftwp-postcontent{width: 100%;padding-left: 0;padding-top: 20px;} .ftwp-in-post#ftwp-container-outer.ftwp-float-none #ftwp-contents{width: 100% !important;} .about-banner{height: 320px;} .about-banner .title{font-size: 32px;} .about-sec1{background: none !important;} .about-title{font-size: 26px;} .about-title span{font-size: 20px;} .technology-body{padding: 70px 0 0;} .technology-body .section:not(:last-child){padding-bottom: 70px;} .tech-sec1 .title{font-size: 36px;} .tech-sec2 .block .inner{padding: 0 30px;} .tech-sec2 .block{padding-bottom: 70px;} .category2-top .inner .sub span{font-size: 18px;padding: 10px 20px;} .recruitment-block{padding: 30px;margin: -200px auto 0;} .swiper-product .swiper-slide{width: 45vw;} .swiper-product .swiper-wrapper{justify-content: flex-start;} .home-sec5{padding-bottom: 0;} .home-sec5 .inner .item .number .vl{font-size: 36px;} .home-sec5 .inner .item .number .sub{font-size: 16px;} .product-top .group-info{position: relative;width: 580px;max-width: 100%;margin: 0 auto;padding: 40px 20px;left: auto;top: auto;} .product-top .group-info .flex{flex-direction: column;} .product-top .group-image{height: 500px;max-height: calc(100vh - 65px);} .product-top .group-info .left{width: 100%;max-width: 100%;padding-top: 0;gap: 15px;} .product-top .group-info .right{padding-top: 20px;max-width: 100%;} .product-top .group-info .left .box-title{gap: 5px;padding-bottom: 15px;} .product-top .group-info .left .box-button{flex-direction: row;gap: 15px;} .product-top .group-info .right .box-info{padding: 15px 20px;flex-direction: row;justify-content: space-between;flex-wrap: wrap;} .product-top .group-info .right .box-info .it{flex: 1;} .product-top .group-info .right .box-info .it .value{font-size: 20px;} .product-top .group-info .right .box-color{position: absolute;left: 50%;transform: translateX(-50%);top: -50px;z-index: 3;} .product-content .sec1 .box-360 .box-circle{display: none;} .product-content .sec1 .box-info{position: unset;padding-top: 30px;display: flex;justify-content: center;flex-wrap: wrap;column-gap: 40px;row-gap: 15px;} .product-content .sec1 .box-info .it{position: unset;width: auto;height: auto;border-radius: 0;background: transparent;box-shadow: none;} .product-content .sec1 .box-info .it .box{position: unset;transform: none;} .product-content .sec1 .box-info .it .box .value{font-size: 30px;} .product-content .sec1 .home-block{padding: 0 20px;gap: 40px;} .product-content .sec2 .home-block{gap: 30px;} .product-content .section:not(:last-child){padding-bottom: 60px;} .product-content{padding: 60px 0;} .product-content .sec2 .block:not(:last-child){padding-bottom: 60px;} .product-content .sec2 .block .inner{padding: 0 20px;} .product-content .sec2 .bottom{min-height: inherit;flex-direction: column;} .product-content .sec2 .bottom .img img.pc{display: none;} .product-content .sec2 .bottom .img img.mb{display: block;} .product-content .sec2 .bottom .box{padding: 0 20px;position: unset;transform: none;width: 100%;} .product-feature{padding: 60px 0;} .product-feature .tab-content .inner{padding: 20px;} .product-specs{padding: 40px 0 60px;} .product-specs .box-info .col-title{width: 50%;padding-top: 40px;} .product-specs .box-info .col-info{width: 50%;padding: 0 20px;} .product-specs .accordion-button > div{width: 50%;} .product-specs .accordion-body .hang > div{width: 50%;} .detail-body{flex-direction: column;height: auto;min-height: 100vh;} .detail-body .col-menu{width: 100%;border-bottom: 2px solid #e5e5e5;} .detail-body .menu-product{overflow-y: inherit;overflow-x: auto;flex-direction: row;height: 90px;padding: 10px 0;gap: 15px;} .detail-body .menu-product > li > a{padding: 0;font-weight: 600;min-width: 70px;gap: 4px;line-height: 1;white-space: nowrap;align-items: center;} .detail-body .menu-product > li > a img{width: 70px;} .detail-body .menu-product > li > a span{line-height: normal;} .detail-body .menu-product > li > a::after{display: none;} .detail-body .menu-product > li{width: auto;} .detail-body .menu-product > li.current-menu-item > a{color: #000;} .detail-body .col-main{width: 480px;padding: 20px 20px 60px;max-width: 100%;margin: 0 auto;box-shadow: none;flex-direction: column;} .detail-body .detail-image{width: 100%;padding: 0 0 24px;display: block;} .detail-body .detail-info{width: 100%;padding: 0;max-height: inherit;border-left: 0;} .detail-body .detail-image::before{display: none;} .detail-body .detail-image .specs{position: unset;padding: 15px 20px;border: 1px solid rgba(131,131,131,.3);background: rgba(255,255,255,.1);} .detail-body .detail-image .specs .list .it{padding: 0;white-space: wrap;width: auto;flex: 1;} .detail-body .detail-image .specs .list .it .value{font-size: 20px;} .detail-body .detail-image .back{top: 0;right: 0;} .detail-body .detail-info .title{font-size: 30px;margin-bottom: 15px;} .detail-body .detail-info .box-price{flex-direction: column;} .detail-body .detail-info .box-price .box{text-align: left;max-width: 100%;} .detail-body .detail-info .home-cta{position: fixed;z-index: 99;bottom: 0;left: 0;width: 100%;} #customer_details{float: none;width: 100%;margin-right: 0;} #order_review{float: none;width: 100%;} .swiper-news .swiper-slide{width: 45vw;} .swiper-button-prev{left: -20px;} .swiper-button-next{right: -20px;} .banner-prev{left: 1%;} .banner-next{right: 1%;} .images-prev{left: 0;} .images-next{right: 0;} /* Acount */ .woocommerce-account .woocommerce-MyAccount-navigation ul li{width: calc((100% - 20px) / 3);} } @media(max-width:767px) { #header .col-logo{width: 150px} .home-sec1 .item .box .name{font-size: 28px;} .swiper-product .swiper-slide{width: 60vw;} .swiper-news .swiper-slide{width: 60vw;} .home-sec4 .gallery{margin-top: 0;} .home-sec4 .col-item:nth-child(2n) .img{margin-top: 0;} .footer-main .f-widget{flex-wrap: wrap;} .footer-main .col-item{width: 100%;max-width: 100%;} .page-banner .inner .title{font-size: 36px;} .pagination{margin-top: 30px;} .category-list .col-item.action .item-news{flex-direction: column;gap: 15px;} .category-list .col-item.action .item-news .img{width: 100%;} .category-list .col-item.action .item-news .single-meta{width: 100%;padding: 10px 0 0;} .single-related{padding-top: 30px;} .item-recruitment{flex-direction: column;gap: 15px;align-items: center;text-align: center;} .item-recruitment .logo{margin: 0 auto;} #language { width: 160px;font-size: 12px; } .item-recruitment .info{padding-left: 0;} .item-recruitment .info .meta{justify-content: center;} .about-sec4 .inner{width: 100%;padding: 0 20px 20px;} .about-sec4 .inner .capt{font-size: 36px;} .about-sec4 .inner .capt br{display: none;} .about-sec4 .home-slider{width: 100%;padding: 0 20px;} .tech-sec2 .block{flex-direction: column !important;} .tech-sec2 .block .img{width: 100%;max-width: 520px;padding: 0 20px;} .tech-sec2 .block .inner{width: 100%;padding: 0 20px;} .product-content .sec2 .block{flex-direction: column !important;} .product-content .sec2 .block .inner{width: 100%;} .product-content .sec2 .block .img{width: 100%;max-width: 520px;padding: 0 20px;} .product-feature .tab-title{column-gap: 30px;overflow-x: auto;} .product-feature .tab-content .img{width: 100%;} .product-feature .tab-content .inner{width: 100%;} .product-specs .accordion-button{font-size: 16px;} .woocommerce .cart-collaterals .cart_totals, .woocommerce-page .cart-collaterals .cart_totals{width: 100%;} } @media(max-width:575px) { .page-banner{height: 240px;} .page-body{padding: 40px 0;} .contact-form{padding: 20px;} .category-list .col-item{width: 100%;} .category-list .col-item.action{padding-bottom: 80px;} .category-list .col-item.action:after{top: -30px;} .category-list .col-item.action:before{top: -20px;} .category-menu{padding: 20px 0;} .single-body.page-body{padding-top: 20px;} .page-body .section:not(:last-child){margin-bottom: 40px;} .home-block{gap: 28px;} .about-banner{height: 280px;} .about-sec1{padding: 40px 0 20px;} .about-sec2{padding: 20px 0;} .about-sec3{padding: 20px 0 40px;} .about-sec5{padding: 40px 0;} .about-sec6{padding: 40px 0;} .technology-body{padding: 60px 0 0;} .technology-body .section:not(:last-child){padding-bottom: 60px;} .tech-sec2 .block{padding-bottom: 40px;} .footer-main{padding: 40px 0 20px;} .home-body{padding-top: 40px;} .home-body .section{padding-bottom: 50px;} .home-sec5 .inner{gap: 30px;} .home-sec5{padding-bottom: 20%;} .product-specs .box-info .col-title{width: 100%;padding-top: 0;} .product-specs .box-info .col-info{width: 100%;} .product-specs .box-info .col-title .home-title br{display: none;} .woocommerce table.shop_table tr{gap: 15px;} .woocommerce table.shop_table .product-thumbnail img{width: 60px;} .woocommerce table.shop_table .product-name{font-size: 16px;} .woocommerce table.shop_table span.amount{font-size: 16px;} .cart-collaterals h2{font-size: 20px;} .woocommerce-checkout h3{font-size: 20px;} /* Acount */ .woocommerce-account .woocommerce-MyAccount-navigation ul li{width: calc(50% - 5px);} #customer_login h2{font-size: 20px;} } @media(max-width:428px) { }