﻿@media only screen and (min-width:1921px) { }
@media only screen and (min-width:1681px) {
    .container { max-width: 1536px; }
}
@media only screen and (max-width:1536px) {
    .left-padding { padding-left: calc(((100% - 1320px) - 30px) / 2); }
    .heroelement-outer { padding-top: 200px; }
    .fs200 { font-size: 150px; letter-spacing: -6px; }
    .heroelement-left .mb-100 { margin-bottom: 50px; }
    .plr-100 { padding-left: 50px; padding-right: 50px; }
    .offset3 { padding-left: 280px; }
    .hero-wrap { height: 1150px; position: relative; }
    .mb-250 { margin-bottom: 200px; }
    .pt-250 {
    padding-top: 200px;
}
    .leftimg { padding: 0px 0px 100px 50px; }
    .product-item-content { width: 40%; }
    .rightimg { padding: 0px 50px 100px 0px; }
    .pi-bottom-content ul li { font-size: 30px; }
    h1, .th1, h2, .th2 { font-size: 80px; letter-spacing: -3px; }
    h3, .th3 { font-size: 60px; letter-spacing: -2px; }
    h4, .th4 { font-size: 40px; }
    h5, .th5 { font-size: 30px; }
    .industry-box { min-height: 230px; }
    .accordion-button { padding: 35px 30px; }
    .footer-contact-row { padding: 50px 80px; }
    .footer-contact-title { width: 50%; }
    .mb-150 { margin-bottom: 100px; }
    .footer-contact p { font-size: 22px; }
    .heroelement-text.mb-50 { margin-bottom: 30px; }
    .t36 { font-size: 30px; }
    .br100 { border-radius: 70px; }
    .purposerow-content { margin-right: 100px; }
    h6, .th6 { font-size: 22px; }
    .operarow {
    padding-bottom: 90px;
}
}
@media only screen and (max-width:1440px) { }
@media only screen and (max-width:1366px) {
    .left-padding { padding-left: calc(((100% - 1140px) - 30px) / 2); }
    .hero-wrap { height: 1100px; }
    .fs200 { font-size: 140px; letter-spacing: -5px; }
    .pi-bottom-content ul li { font-size: 26px; }
    h1, .th1, h2, .th2 { font-size: 70px; letter-spacing: -3px; }
    .footer-contact-btn { width: 25%; }
    .offset3 { padding-left: 230px; }
    .product-item-content { width: 45%; }
}
@media only screen and (max-width:1280px) {
    .hero-wrap { height: 1000px; }
    .pi-bottom-content ul { display: flex; flex-wrap: wrap; margin-bottom: 10px; }
    .pi-top-content { padding-bottom: 20px; }
}
@media only screen and (max-width:1200px) {
    .mainheader { padding: 20px 0px; }
    .logo1 { width: 90px; }
    .logo2 { width: 50px; }
    .plr-100 { padding-left: 30px; padding-right: 30px; }
    .btn-theme, .btn-theme-submit { font-size: 16px; padding: 13px 22px; }
    .left-padding { padding-left: 45px; }
    .fs200 { font-size: 70px; letter-spacing: -2px; }
    .offset3 { padding-left: 110px; }
    .heroelement-outer { padding-top: 130px; }
    .hero-wrap { height: 600px; }
    .pt-150 { padding-top: 70px; }
    h3, .th3 { font-size: 40px; letter-spacing: -1px; }
    h1, .th1, h2, .th2 { font-size: 40px; letter-spacing: -1px; }
    h1, h2, h3, h4, h5, h6, .th1, .th2, .th3, .th4, .th5, .th6 { margin-bottom: 20px; }
    .t36 { font-size: 26px; }
    .mb-250 { margin-bottom: 70px; }
    .pt-250 {
    padding-top: 150px;
}
    .mb-100 { margin-bottom: 50px; }
    .leftimg { padding: 0px 45px 70px 45px; }
    h4, .th4 { font-size: 30px; }
    h5, .th5 { font-size: 24px; }
    .accordion-button { padding: 20px 30px; }
    body { font-size: 20px; }
    .product-item-content { width: 100%; }
    .product-item-img { width: 100%; }
    .pi-bottom-content { margin-bottom: 30px; }
    .pi-bottom-content { margin-top: 30px; }
    .rightimg .product-item-inner { flex-direction: column-reverse; }
    .br100 { border-radius: 30px; }
    .leftsticky { position: static; }
    .bullet-list ul li:before { top: 24px; left: 0px; height: 20px; width: 15px; background-size: contain; }
    .hero-wrap { height: 750px; }
    .rightimg { padding: 0px 45px 70px 45px; }
    .bullet-list ul li { padding: 20px 0px 20px 25px; }
    .product-item-img { width: 50%; }
    .pi-top-content { padding-bottom: 0px; }
    .industry-grid { display: flex; gap: 10px; }
    .industry-box { padding: 10px 12px; min-height: auto; }
    .industry-grid { flex-direction: row; flex-shrink: 0; width: 100%; overflow-x: auto; overflow-y: hidden; display: flex; }
    .industry-grid h5  br { display: none; }
    .industry-grid h5 { white-space: nowrap; font-size: 20px; }
    .industry-content { align-items: flex-start; flex-direction: column; justify-content: end; position: relative; }
    .industry-title { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); text-align: center; padding: 0px 12px; width: 100%; }
    .industry-content, .industry-bg, .industry-section { height: 600px; }
    .mb-150 { margin-bottom: 80px; }
    footer { padding-top: 70px; }
    .footer-contact-row { padding: 50px 50px; }
    .footer-contact-btn { text-align: right; }
    .footer-logo { margin-bottom: 30px; }
    .footer-logo img { max-width: 130px; }
    .socialfooter ul li + li { margin-left: 10px; }
    .mb-150 { margin-bottom: 50px; }
    h6, .th6 { font-size: 20px; }
    .product-item.mb-100 { margin-bottom: 70px; }
    .modal-body { padding: 50px 25px; }
    .industry-section {display: none;}
    .mb-industry-section {display: block;}
    .operarow {
    padding-bottom: 0px;
}
}
@media only screen and (max-width:992px) {
    .purposerow-title { margin-top: 30px; }
    .offset3 { padding-left: 70px; }
    .hero-wrap { height: 630px; }
    .product-item-img { width: 70%; }
    .footer-contact-title { width: 100%; margin-bottom: 20px; text-align: center; }
    .footer-contact-btn { text-align: center; width: 100%; }
    .footer-contact-row { flex-wrap: wrap; }
}
@media only screen and (max-width:767px) { }
@media only screen and (max-width:580px) {
    .plr-100 { padding-left: 20px; padding-right: 20px; }
    .logo a + a { margin-left: 10px; }
    .btn-theme { font-size: 16px; padding: 13px 16px; }
    .heroelement-left { width: 100%; margin-bottom: 30px; text-align:center; }
    .left-padding { padding-left: 20px; }
    .offset3 { padding-left: 0px; }
    .heroelement-outer { padding-right: 20px; }
    .heroelement-left .mb-100 { margin-bottom: 20px; }
    .heroelement-right { width: 100%; }
    .hero-wrap { height: 1100px; }
    .fs200 { font-size: 50px; letter-spacing: -1px; }
    h1, .th1, h2, .th2 { font-size: 32px; letter-spacing: -1px; }
    h3, .th3 { font-size: 28px; letter-spacing: -1px; }
    .t36 { font-size: 24px; }
    .operamiddle-maintitle.mb-100 { margin-bottom: 40px; }
    .container, .container-fluid, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl { padding-left: 20px; padding-right: 20px; }
    .pi-bottom-content ul li { font-size: 24px; }
    .product-item-img { width: 100%; }
    .purposerow-content { margin-right: 0px; }
    .purposerow-title h3 { margin-bottom: 0px; }
    .leftimg { padding: 0px 20px 70px 20px; }
    .rightimg { padding: 0px 20px 70px 20px; }
    .pi-bottom-content ul li { font-size: 18px; }
    .industry-content, .industry-bg, .industry-section { height: 380px; }
    h5, .th5 { font-size: 20px; }
    .accordion-button::after { width: 15px; height: 15px; background-size: 15px; margin-top: 6px; }
    .pi-bottom-content { margin-top: 0px; }
    h4, .th4 { font-size: 22px; }
    .pi-bottom-content h4 { margin-bottom: 20px; padding-bottom: 10px; position: relative; }
    .pi-bottom-content h4:after { height: 1px; }
    .footer-contact p { font-size: 18px; }
    .socialfooter { width: 100%; margin-bottom: 15px; }
    .copyright { width: 100%; }
    .footermiddle { flex-wrap: wrap; }
    .mb-50 { margin-bottom: 30px; }
    .accordion-button { padding: 20px 20px; }
    .modal-body h4 {
    font-size: 30px;
}
}
@media only screen and (max-width:375px) { }

/* animation keyframe css */
.animated { animation-duration: 1s; animation-fill-mode: both; }
.animated.infinite { animation-iteration-count: infinite; }
@keyframes fadeInDown {
    0% { opacity: 0; transform: translateY(-100px); }
    100% { opacity: 1; transform: translateY(0); }
}
.fadeInDown { animation-name: fadeInDown; }
@keyframes fadeInLeft {
    0% { opacity: 0; transform: translateX(-100px); }
    100% { opacity: 1; transform: translateX(0); }
}
.fadeInLeft { animation-name: fadeInLeft; }
@keyframes fadeInRight {
    0% { opacity: 0; transform: translateX(100px); }
    100% { opacity: 1; transform: translateX(0); }
}
.fadeInRight { animation-name: fadeInRight; }
@keyframes fadeInUp {
    0% { opacity: 0; transform: translateY(100px); }
    100% { opacity: 1; transform: translateY(0); }
}
.fadeInUp { animation-name: fadeInUp; }
@keyframes fadeIn {
    0% { opacity: 0; transform: translateY(100px); }
    100% { opacity: 1; transform: translateY(0); }
}
.fadeIn { animation-name: fadeIn; }