h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: 'Arial black', sans-serif;
}

.h1,
h1 {
    font-size: 1.5em;
}

h3 {
    display: block;
    font-size: 1.17em;
    margin-block-start: 1em;
    margin-block-end: 1em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    font-weight: bold;
}

.mobile-only{
    display: none;
}

.header-content a {
    color: #FFF;
}

.header-content a:hover {
    color: #FFF;
}

.header-content .logo {
    height: 35px;
    filter: brightness(0) invert(1);
}
.header.scrolled  *:not(.links ul a):not(font) {
    color: black;
}
.header.scrolled {
    background-image: linear-gradient(90deg, #ffffff 0%,  #ffffff 100%);
    transition: background-color 200ms linear;
    box-shadow: 0 3px 12px -6px rgb(0 0 0 / 90%);
}
.header.scrolled.header-content .logo{
    filter:brightness(1) invert(0);
}
.hero,
.header {
    background-image: linear-gradient(90deg, rgba(230, 72, 72, 1) 0%, rgba(224, 125, 48, 1) 100%);
}

.home-label {
    font-weight: bold;
}

.home-page .icons--home p {
    display: block;
    margin-block-start: 1em;
    margin-block-end: 1em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
}

.form-control {
    appearance: auto;
}

.blog .posts-list .post-img {
    max-height: fit-content;
    margin:0px;
    background-size: contain;
}

.pro-listing-con .product-img {
    text-align: center;
}

/* .page-header{
    clear: none;
    float: left;
    padding-left: 8%;
    width: 70%;
    display: block;
}
.breadcrumbs .page-header{
    float: none;
    padding-left: 8% ;
    padding-top: 0px;
    padding-bottom: 0px;
    padding-right: 0px;
    min-height: auto;
    position: relative;
    background-color: transparent;
} */
.product-image {
    align-content: center;
    margin: 0 auto;
    padding-left: 44px;
}

.product-box-text {
    color: black;
}

.product .product-get-quote {
    border: none;
    font-size: 16px;
}

.home-page .slider-page-header {
    display: flex;
    padding-top: 30px;
    position: relative;
    justify-content: center;
    /* background-image: linear-gradient(90deg, rgba(230, 72, 72, 1) 0%, rgba(224, 125, 48, 1) 100%); */
    min-height: 40vh;
}

.waves-slider {
    position: absolute;
    left: 0;
    right: 0;
    top: 4%;
    z-index: 999;
    height: 10vw;
    background-image: url('/hanbay/home/waves.svg');
    background-position: 50% 100%;
    background-size: cover;
    background-repeat: no-repeat;
}

.waves-slider.scale-slider {
    transform: scale(-1);
    bottom: calc(19vw - 5px);
}


/* .accordion-custom ul:hover li:hover, .accordion-custom ul li:focus, .accordion-custom ul:focus-within li:focus {
    width: 33% !important;
}

.accordion-custom ul:hover li, .accordion-custom ul:focus-within li {
    width: 33% !important;
} */



.pull-right {
    float: right;
}

p {
    font-size: 0.9rem;
}

.product .product-img {
    width: 50%;
}

.product .heading {
    /* background-color: #e55243; */
    padding: 10px 0px;
    /* color: #fff; */
    font-size: 1rem;
    font-weight: 600;
}

/* .product .divBorder {
    border: 1px solid #e55243;
} */

.product ul .padding-li {
    padding: 10px;
}

/* Product page */
.product section {
    padding: 25px;
}

.product ul {
    padding-left: 1rem;
}

.setting-label {
    margin-left: 5px;
    font-size: 12px;
}

.testimonial-img {
    text-align: center;
}

.testimonials-main .img-fluid {
    max-width: 30%;
}

a:hover {
    color: var(--color-primary);
}

.product-listing .more-info:hover {
    color: #fff;
}

.testimonials-main h1,
.industries-main h1,
.industries-aerospace h1,
.industries-automated-extraction h1 {
    font-size: 1.5rem;
}

.industries-main .page-container {
    background: linear-gradient(to bottom, transparent -100%, #fff 70%), url('/hanbay/pages/Picture2.png') no-repeat center;
    background-size: cover;
}

.industries-aerospace .page-container {
    background: linear-gradient(to bottom, transparent -100%, #fff 70%), url('/hanbay/pages/plane.jpg') no-repeat center;
    background-size: cover;
}

.industries-automated-extraction .page-container {
    background: linear-gradient(to bottom, transparent -100%, #fff 70%), url('/hanbay/pages/Picture3.png') no-repeat center;
    background-size: cover;
}

.industries-automated-extraction .page-content {
    width: 60%;
    margin: 100px auto 50px auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}
.industries-automated-extraction .page-content figure {
    flex: 0 0 50%;
    text-align: center;
    margin: 0;
}
.industries-automated-extraction .page-content img {
    width: 100%;
    min-width: 350px;
    cursor: zoom-in;
}
.industries-automated-extraction .page-content figure figcaption {
    font-size: 16px;
    text-align: left;
    padding-left: 15px;
    padding-bottom: 50px;
}
.actuator-list {
    display: flex;
    justify-content: center;
    margin: 0 auto;
    flex-wrap: wrap;
    padding-top: 100px;
}

.actuator-item {
    text-align: center;
    flex: 0 0 23%;
}

.actuator-item img {
    width: 180px;
}

.actuator-item h3,
.actuator-series h4 {
    font-size: 0.9em;
}

.actuator-series .series-text h4 {
    font-size: 1.1em;
}

.actuator-series .series-text p {
    font-size: 1rem;
}

.page-content {
    width: 70%;
    margin: 100px 50px 50px auto;
    display: grid;
    grid-template-columns: 1fr 2fr;
    grid-auto-rows: auto;
}

.page-content>div:nth-child(odd) {
    font-weight: 700;
    padding: 10px 0;
}

.page-content>div:first-child {
    text-decoration: underline;
    font-size: 20px;
}

.page-content>div:nth-child(even) {
    font-family: arial;
    padding: 10px 0;
}

.page-content>div:nth-child(odd) {
    font-weight: 700;
    padding: 10px 0;
}

.bot-border {
    border-bottom: 1px solid #cfcfcf;
}

.img-overlay {
    position: relative;
    text-align: center;
}

.img-overlay span {
    cursor: pointer;
}

.info-container img {
    width: 100%;
    max-width: 400px;
    height: auto;
    object-fit: contain;
}

.img-overlay a {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.header-phone-details a{
    font-size: 14px;
}

.contact .contacusform {
    width: 100%;
    height: 100%;
    background: #fff;
    box-shadow: 0px 2px 25px rgb(0 0 0 / 10%);
    padding: 30px;
    border-radius: 0 10px 10px 0;
    border: 0;
}

.get-started-btn,.get-started-custom-btn {
    color: white !important;
    background: linear-gradient(to left, #931A1D 50%, #EC1D1D 50%) right;
    background-size: 200%;
    padding: 0.55em .7em;
    /* border-radius: 3em; */
    box-sizing: border-box;
    text-decoration: none;
    font-weight: 400;
    text-align: center;
    transition: .5s ease-out;
    cursor: pointer;
    border: none;
}

.get-started-btn-border-radius{
    border-radius: 3em;
}

.get-started-btn:hover {
    background-position: left;
}

.footer {
    background-color: rgb(20, 18, 18);
}

.bg-gradient {
    background-image: linear-gradient(151deg, rgba(230, 72, 72, 1) 0%, rgba(224, 125, 48, 1) 100%) !important;
    color: white;
}

.electric-actuators-main .custom-grid{
    font-size: 0.8em !important;
    padding-top: 26%;
}
.electric-actuators-main .custom-grid h3{
    padding: 0;
    margin: 0;
}

.navbar a,
.navbar a:focus {
    color: #FFFFFF;
    font-weight: normal;
}

.choose-section {
    padding: 100px 20px;
    display: flex;
    flex-direction: column;
    max-width: 1000px;
    margin: 0 auto;
    width: 100%;
    box-sizing: border-box;
}

.choose-section ul {
    margin: 5px 0 15px;
    padding: 0;
}

.choose-section li {
    list-style: none;
    position: relative;
    padding: 0 0 0 20px;
}

/* Blog Page */
.breadcrumbs .page-header-custom {
    padding: 30px 0px 0px 30px;
}

/* section#blog {
    padding: 10px;
} */

.blog-list {
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}

/* About us */

.mt-5 {
    margin-top: 5rem;
}

.mt-10 {
    margin-top: 10px;
}

.mt-20 {
    margin-top: 20px;
}

.text-align-right {
    text-align: right;
}

.industries-automated-extraction .extraction-systems figure {
    flex: 0 0 50%;
    text-align: center;
    margin: 0;
}

.industries-automated-extraction .extraction-systems img {
    width: 80%;
    min-width: 350px;
    cursor: zoom-in;
}

.industries-automated-extraction .extraction-systems figure figcaption {
    font-size: 16px;
    text-align: left;
    padding-left: 15px;
    padding-bottom: 50px;
}

section#page-container\ research-engineering {
    background: linear-gradient(to bottom, transparent -100%, #fff 70%), url('/hanbay/pages/Picture4.png') no-repeat center;
    background-size: cover;
}

.universities img {
    width: 100px;
    height: auto;
    filter: grayscale(1);
    transition: 100ms;
}

.universities img:hover {
    filter: grayscale(0);
    transform: scale(1.05);
}

.oronos img {
    width: 100%;
    max-width: 350px;
}

section#page-container\ industries-water {
    background: linear-gradient(to bottom, transparent -100%, #fff 70%), url('/hanbay/pages/water-wastewater-management.png') no-repeat center;
    background-size: cover;
}

.fig img {
    width: 100%;
    max-width: 400px;
}

section#page-container\ gas-prone-container {
    background: linear-gradient(to bottom, transparent -100%, #fff 70%), url('/hanbay/pages/lpg-propane-natural-gas.png') no-repeat center;
    background-size: cover;
}

section#page-container\ semiconductor-container {
    background: linear-gradient(to bottom, transparent -100%, #fff 70%), url('/hanbay/pages/Picture15.png') no-repeat center;
    background-size: cover;
}

section.page-content-series {
    width: 60%;
    margin: 0 auto;
    font-size: 1.1rem;
}

.page-content-series img {
    width: 100%;
    max-width: 500px;
}

.grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 10px;
}

.item {
    text-align: center;
}

.item img {
    width: 250px;
    height: 250px;
    object-fit: cover;
    border-radius: 50%;
    opacity: 0.8;
}

.item h3 {
    color: black;
    font-weight: bolder;
    font-size: 1rem;
    margin-top: 10px;
}

section#page-container\ oil-gas-container {
    background: linear-gradient(to bottom, transparent -100%, #fff 70%), url('/hanbay/pages/Picture17.png') no-repeat center;
    background-size: cover;
}

.tradeshow-container {
    width: 70%;
    display: flex;
    margin: 20px auto;
    max-width: 1100px;
}

.tradeshow-events {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    flex: 2 0 50%;
    justify-content: space-evenly;
    padding-bottom: 100px;
}

.tradeshow-events>figure {
    border: 1px solid black;
    text-align: center;
    flex: 1 1 auto;
    max-width: 250px;
    box-shadow: 7px 7px 10px -5px rgb(0 0 0 / 80%);
    min-width: 250px;
    margin: 5px;
    padding: 20px;
    box-sizing: border-box;
    animation: fadein 2s;
    animation-fill-mode: both;
}

.tradeshow-figure {
    display: flex;
    align-items: center;
}

.tradeshow-figure>figure>img {
    width: 100%;
    height: auto;
    max-width: 15vw;
    min-width: 200px;
}

.masonry-with-columns {
    columns: 2 380px;
    column-gap: 1rem;
    width: 100%;
    margin: 0 auto 50px auto;
}

.card__container {
    display: grid;
    margin: 100px auto 50px;
    max-width: 1400px;
    justify-content: center;
    grid-template-columns: repeat(auto-fit, minmax(200px, 350px));
}

.card {
    box-sizing: border-box;
    line-height: 1.5;
    position: relative;
    border-radius: 6px;
    padding: 2rem;
    box-shadow: 0 0.25rem 0.25rem rgba(0, 0, 0, 0.2), 0 0 1rem rgba(0, 0, 0, 0.2);
    overflow: hidden;
    margin: 10px;
}

.card img {
    max-width: 100%;
}

.card__image-container {
    margin: -2rem -2rem 1rem -2rem;
}

.card__line {
    opacity: 0;
    animation: LineFadeIn 0.8s 0.8s forwards ease-in;
}

.card__image {
    /* opacity: 0; */
    animation: ImageFadeIn 0.8s 1.4s forwards;
}

.card__title {
    margin-top: 28px;
    font-weight: 800;
    letter-spacing: 0.01em;
}

.card__content {
    margin-top: -1rem;
    /* opacity: 0; */
    animation: ContentFadeIn 0.8s 1.6s forwards;
}

.card__svg {
    position: absolute;
    left: 0;
    right: 0;
    width: 100%;
    top: 100px;
}

/* Start Home Page */

.home-page .page-header {
    display: flex;
    padding-top: 30px;
    position: relative;
    justify-content: center;
    background-image: linear-gradient(90deg, rgba(230, 72, 72, 1) 0%, rgba(224, 125, 48, 1) 100%);
    min-height: 40vh;
}
.header-content .container-xl{
    padding-right: 0px !important;
    padding-left: 0px !important;
}
.header-content .container, .container-lg, .container-md, .container-sm, .container-xl{
    max-width: calc(100% - 75px);
}
.home-page .text-section h2 {
    font-size: 1.5rem;
}

.side-intro {
    display: flex;
    color: white;
    flex-basis: 700px;
    margin-left: 50px;
}

.side-intro>div {
    margin: auto;
    padding-bottom: 100px;
}

.side-intro :is(h1, p) {
    padding: 10px;
}

.side-intro h1 {
    font-size: 44px;
}
.side-intro p {
    font-size: 16px;
}

.side-intro a {
    color: white;
}

.border-btn {
    display: inline-block;
    padding: 0.5em 3em;
    border: 0.16em solid #FFFFFF;
    border-radius: 3em;
    box-sizing: border-box;
    text-decoration: none;
    text-transform: uppercase;
    font-weight: 400;
    color: #FFFFFF;
    text-align: center;
    transition: all 150ms;
    min-width: 17em;
    max-width: 18em;
    width: 100%;
    z-index: 5;
    position: relative;
}

.btn-gray {
    background: #595959 !important;
}
.btn-black {
    background: #000000 !important;
}

.side-image {
    width: 25%;
    z-index: 3;
    flex-basis: 600px;
    margin-right: 50px;
}

.side-image img {
    width: 100%;
}

.waves.scale {
    transform: scaleY(2);
    bottom: calc(4vw - 5px);
}

.waves {
    position: absolute;
    left: 0;
    right: 0;
    bottom: -1px;
    z-index: 2;
    height: 8vw;
    background-image: url('/hanbay/waves.svg');
    background-position: 50% 100%;
    background-size: cover;
    background-repeat: no-repeat;
}

.text-section {
    display: flex;
    flex-direction: column;
    max-width: 1000px;
    margin: 100px auto 0;
    padding: 20px;
    width: 100%;
    box-sizing: border-box;
}

.accordion {
    width: 100%;
    overflow: hidden;
    margin: 0 auto;
}

.accordion ul {
    width: 100%;
    display: table;
    table-layout: fixed;
    margin: 0;
    padding: 0;
}

.accordion ul li {
    display: table-cell;
    vertical-align: bottom;
    position: relative;
    width: 20%;
    background-size: 190px;
    background-repeat: no-repeat;
    background-position: center center;
    transition: all 175ms ease;

}

.accordion ul li div {
    display: block;
    overflow: hidden;
    width: 100%;

}

.accordion ul li div a {
    display: block;
    width: 75%;
    margin-left: 15%;
    position: relative;
    z-index: 3;
    padding: 15px 20px;
    box-sizing: border-box;
    color: #fff;
    text-decoration: none;
    transition: all 300ms ease;
    height: 400px;
}

.accordion ul li div a * {
    opacity: 0;
    margin: 0;
    width: 100%;
    position: relative;
    z-index: 5;
    white-space: wrap;
    -webkit-transform: translateX(-20px);
    transform: translateX(-20px);
    -webkit-transition: all 300ms ease;
    transition: all 300ms ease;
}

.accordion ul li div a h3 {
    font-size: 18px;
    margin-top: 15px;
    padding-left: 5%;
    width: 99%;
    color: #000;
}

.accordion ul li div a p {
    font-size: 18px;
    padding-left: 5%;
    margin-top: 15px;
    width: 99%;
    color: #000;
}

.accordion ul li div p1 {
    font-weight: lighter;
    font-size: 16px;
    padding-left: 5%;
    width: 99%;
    color: #000;
    clear: both;

}

.accordion ul li:nth-child(1) {
    background-image: url('/hanbay/pages/testC1.png');
}

.accordion ul li:nth-child(2) {
    background-image: url('/hanbay/pages/testC2.png');
}

.accordion ul li:nth-child(3) {
    background-image: url('/hanbay/pages/testC3.png');
}

.accordion ul li:nth-child(4) {
    background-image: url('/hanbay/pages/testC4.png');
}

.accordion ul:hover li,
.accordion ul:focus-within li {
    width: 8%;
}

.accordion ul li:focus {
    outline: none;
}

.accordion ul:hover li:hover,
.accordion ul li:focus,
.accordion ul:focus-within li:focus {
    width: 60%;
}


/*----------ACCORDIAN BACKGROUND GRADIENT -------------*/
.accordion ul:hover li:hover a,
.accordion ul li:focus a,
.accordion ul:focus-within li:focus a {
    /* background-image: linear-gradient(to bottom, rgba(238, 238, 238, 1), rgba(255, 255, 255, 0.9));*/
    background-color: rgba(255, 255, 255, 0.96);
    box-shadow: 0px 0px 50px rgba(0, 0, 0, 0.2);

}

.accordion ul:hover li:hover a *,
.accordion ul li:focus a *,
.accordion ul:focus-within li:focus a * {
    -webkit-transform: translateX(0);
    transform: translateX(0);

}

.accordion ul:hover li {
    width: 20% !important;

}

.accordion ul:hover li a * {
    opacity: 0 !important;
    width: 95% !important;

}

.accordion ul:hover li:hover {
    width: 60% !important;
}

.accordion ul:hover li:hover a * {
    opacity: 1 !important;
    -webkit-transform: translateX(0);
    transform: translateX(0);
}

.accordion-button:not(.collapsed) {
    color: var(--color-primary);
    border-color: #fff;
    background-color: #fff;
}

.accordion-button:focus {
    border-color: #fff;
    box-shadow: var(--bs-accordion-bg);
}

.logo-container {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    margin-top: 20px;
}

.logo-container a {
    filter: grayscale(1);
    transition: 150ms;
}

.logo-container a:hover {
    filter: grayscale(0);
}

.logo-container a:hover {
    filter: grayscale(0);
}

.home-page .img-fluid {
    max-width: 100px;
    height: auto;
}

.bg-grey {
    background: #EDEDED;
    margin-top: 100px;
    position: relative;
    min-height: 400px;
}

.icons--home {
    display: flex;
    max-width: 1000px;
    margin: 20px auto 0;
    padding: 40px 20px 30px;
    gap: 20px;
    flex-wrap: wrap;
    justify-content: center;
}

.bg-flip {
    transform: scaleX(-1);
}

.home-page li.checkmark::before {
    content: "";
    position: absolute;
    left: 2px;
    top: 5px;
    width: 3px;
    height: 6px;
    border: solid white;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}

.icons--home>div {
    flex: 0 1 220px;
    text-align: center;
}

.icons--home>div p {
    text-align: left;
}

/* End Home Page */



.swiper-container {
    width: 100%;
    margin-bottom: 100px;
}

.swiper-slide {
    background-color: transparent;
}

.swiper-slide img {
    width: 100%;
    height: auto;
    vertical-align: middle;

}

.swiper-slide span p b {
    font-weight: 900;
    font-size: 19px;
}

.swiper-slide span p {
    display: none;
    visibility: hidden;
}

.swiper-slide span:hover p {
    display: block;
    visibility: visible;
    margin-top: -250px;
    color: #000;
    z-index: 98;
    width: 70%;
    padding-left: 15% !important;
    line-height: 1.40em;
    font-size: 18px;
}

.swiper-slide span:hover p a {
    display: block;
    visibility: visible;
    color: #930209;
    z-index: 100;
    text-decoration: underline;
    font-size: 18px;
}

.swiper-slide img:hover {
    opacity: 0.1;
    -webkit-transition: all .25s ease-in-out;
    -moz-transition: all .25s ease-in-out;
    -o-transition: all .25s ease-in-out;
    -ms-transition: all .25s ease-in-out;
    transition: all .25s ease-in-out;
    cursor: pointer;
    z-index: 97;
}

.swiper-button-prev {
    left: 11%;
    bottom: 0;
    display: none;
}

.swiper-button-next {
    right: 11%;
    bottom: 0;
    display: none;

}

.swiper-pagination {
    bottom: 0;
    cursor: pointer;
}

h1.card__title {
    font-size: 2rem;
}

a.black {
    color: black;
    border-color: black;
    background: linear-gradient(to left, white 50%, #ECECEC 50%) right;
    background-size: 200%;
    transition: .5s ease-out;
}

a.black:hover {
    background-position: left;
    color: black !important;
    border-color: black !important;
}

.order-details img {
    width: 60%;
}

.order-details ul li {
    padding: 11px;
    list-style: none;
}

.calculation-form {
    max-width: 500px;
}

.calculation-form input {
    min-width: 0;
    font-size: revert;
}

.calculation-form .row {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    margin-bottom: 10px;
}

.calc-entry {
    display: flex;
    flex-direction: column;
    margin-bottom: 10px;
    gap: 5px;
}

input#calculateButton {
    border: none;
}

input#calculateButton:hover {
    background-position: left;
}

.calc-entry input {
    background-color: #fff;
    border: .0625rem solid #828a8f;
    margin: 0 0 1rem;
    margin-bottom: 1rem;
    border-radius: 0;
    padding: .5rem;
    box-sizing: border-box;
    transition: all .15s linear;
}

.calc-entry select {
    background-color: #EDEDED;
    border: .0625rem solid #828a8f;
    background-image:
        linear-gradient(45deg, transparent 50%, #000 50%),
        linear-gradient(135deg, #000 50%, transparent 50%),
        linear-gradient(to right, #000, #000);
    background-position:
        calc(100% - 20px) calc(1em + 2px),
        calc(100% - 15px) calc(1em + 2px),
        calc(100% - 2.5em) 0.35em;
    background-size:
        5px 5px,
        5px 5px,
        1px 1.5em;
    background-repeat: no-repeat;
    margin: 0 0 1rem;
    padding: .5rem;
    min-width: 125px;
    font-size: revert;
}

option {
    font-weight: normal;
    display: block;
    white-space: nowrap;
    min-height: 1.2em;
    padding: 0px 2px 1px;
    font-size: revert;
}

.calc-entry .calc-entry-input {
    display: flex;
    font-size: revert;
}

.calc-entry .calc-entry-input>* {
    flex-grow: 1;
    font-size: revert;
}

#calculation-value {
    background: #EDEDED;
    padding: 20px;
    border-radius: 20px;
    width: 200px;
    text-align: center;
    margin: 20px 10px;
}

input#calculateButton {
    border-radius: 3em;
    border: none;
    padding: 5px 10px 5px 10px;
}

#vlink {
    display: block;
    width: 200px;
    margin-bottom: 50px;
}

/* Support Page */

.support-main .grid {
    display: grid;
    grid-template-columns: 1fr;
    grid-auto-rows: 75px;
    width: 70%;
    /* margin: 0 auto 50px auto; */
    gap: 0px;
}

.grid-item {
    border-top: 1px solid black;
    display: flex;
    align-items: center;
}

.grid-item:last-child {
    border-bottom: 1px solid black;
}

.grid-item a {
    line-height: 75px;
    color: black;
    width: 100%;
    height: 100%;
    padding-left: 10px;
    background: white;
    position: relative;
    z-index: 1;
    font-weight: bolder;
}

.grid-item a::before {
    position: absolute;
    content: "";
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: linear-gradient(90deg, rgba(218, 218, 218, 1) 4%, rgba(255, 255, 255, 1) 100%);
    z-index: -1;
    transition: opacity 0.3s linear;
    opacity: 0;
}

.grid-item a:hover::before,
.grid-item a:focus::before {
    opacity: 1;
}

.grid-item a:hover {
    color: #8A0000;
    text-decoration: underline;
}


/* End Support Page */

.contact-container {
    display: flex;
    width: 82%;
    margin: 0 auto;
    justify-content: space-between;
}

.contact-container>* {
    flex: 1 1 30%;
    margin-bottom: 30px;
    margin-right: 50px;
}

.contact-container>* :is(h3, p) {
    margin: 0;
}

.contact-info-link {
    cursor: pointer;
    color: #8A0000;
    text-decoration: underline;
}

.contact-info-link:hover {
    color: red;
}

.videos-container {
    margin: 0 auto;
    width: 88%;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    /* padding: 20px; */
}

.video-item {
    flex: 1;
    width: 100%;
    margin-bottom: 20px;
}

.video-item>iframe {
    width: 35vw;
    height: 20vw;
    margin: 0px;
    border: .0625rem solid #828a8f;
}

.video-item-frame>iframe {
    width: 100%;
    height: 20vw;
    border: .0625rem solid #828a8f;
}

/* spec-sheets page css start */
.middle-column {
    display: flex;
    /* justify-content: center; */
    position: relative;
}

.middle-column>span {
    right: 150px;
    position: relative;
    top: 75px;
}

table {
    border-collapse: collapse;
    border-spacing: 0;
}

table tr:nth-of-type(2n+1) {
    background-color: #ededed;
}

table tr:nth-of-type(2n) {
    background-color: white !important;
}

/* table tr td:nth-child(4) {
    text-align: center;
} */

.center {
    position: absolute;
    top: 50%;
    /* left: 50%; */
    left: 26%;
    transform: translate(-50%, -50%);
}

.center__left {
    position: absolute;
    top: 50%;
    left: 42%;
    transform: translate(-50%, -50%);
}


.specsheet table tr td:first-child {
    width: 2%;
    /* width: 15%; */
}

.spec-left-content {
    padding-top: 6%;
    /* justify-content: flex-end; */
    display: flex;
}
.spec-left-content a{
    color: #000;
}
.spec-left-content a:hover{
    color: #e55243;
}

.img-container img{
    height: 320px;
    background-size: cover;
    width: 100%;
}

/* table tr td:last-child {
    width: 22%;
} */


#LayoutDiv39 table tr h3,
#LayoutDiv39 table tr p {
    float: none;
    margin: 0;
}

#LayoutDiv40 table tr h3 {
    margin-bottom: 0;
}

#LayoutDiv40 table tr p {
    float: none;
    margin: 0 0 20px;
    text-align: center;
}

.mobile-img-container {
    position: relative;
    text-align: center;
}

.mobile-img-container span {
    position: absolute;
    top: 35%;
    left: 45%;
    transform: translate(-50%, -50%);
}

.mobile-img-container img {
    width: 100%;
    max-width: 400px;
}

#LayoutDiv39 table {
    table-layout: auto;
    width: 100%;
}

#LayoutDiv39 h3 {
    font-family: arial black;
    float: left;
    margin-left: 15px;
}

#LayoutDiv39 tr:nth-child(even) {
    background-color: #f9f9f9;
}

#LayoutDiv39 .spec {
    margin-left: 11.5% !important;
    z-index: 1;
    width: 250px;
}

#LayoutDiv39 .actuator {
    /* margin-left: -10% !important; */
    /* width: 250px; */
    width: 470px;
}

#LayoutDiv40 table {
    margin-left: auto;
    margin-right: auto;
}

#LayoutDiv40 h3 {
    text-align: center;
}

#LayoutDiv39 {
    clear: both;
    float: left;
    margin-left: 0;
    width: 100%;
    display: none;
    visibility: hidden;

}

#LayoutDiv40 {
    clear: both;
    float: left;
    margin-left: 0;
    width: 100%;
    display: block;
    visibility: visible;
}

/* Partnumber page css */

.guide-container {
    display: flex;
    width: 85%;
    margin: 0 auto 20px;
    flex-wrap: wrap;
}

.guide-item {
    flex: 1 1 50%;
    text-align: center;
    box-sizing: border-box;
    padding: 5px;
}

.guide-item>div {
    position: relative;
    text-align: center;
}

.guide-item img {
    width: 100%;
    opacity: 0.6;
    box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
    max-width: 500px;
    min-width: 250px;
}

.guide-item span {
    cursor: pointer;
}

.guide-item a {
    z-index: 1;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.partnumber-guide {
    background: #F2F2F2;
    text-align: center;
    margin-top: 50px;
}

.partnumber-guide img {
    max-width: 1000px;
    width: 100%;
    margin-bottom: 50px;
}


.partnumber-container {
    display: flex;
    background: #F2F2F2;
    justify-content: center;
    flex-wrap: wrap;
    text-align: left;
    align-items: start;
}

.partnumber-item {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 5px;
    margin-top: 30px;
}

.partnumber-item div:nth-child(odd) {
    text-align: right;
}

.partnumber-item div:nth-child(even) {
    font-weight: 700;
}

/* End Partnumber end css  */

/* Start 3D-Drawing end css  */
.mytabs {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    margin: 50px auto;
    /* padding: 0px 7%; */
    padding: 0px 2%;
    box-sizing: border-box;
    background: linear-gradient(to bottom, #E0DCDC 74px, transparent 74px), linear-gradient(to bottom, black 75px, white 75px);
}

.mytabs input[type="radio"] {
    display: none;
}

.mytabs label {
    box-sizing: border-box;
    padding: 25px;
    font-weight: bold;
    width: 50%;
    border-bottom: 1px solid black;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    height: 75px;
}

.mytabs .tab {
    width: 100%;
    order: 1;
    display: none;
}

.mytabs .tab h2 {
    font-size: 3em;
}

.mytabs input[type='radio']:checked+label+.tab {
    display: block;
}

.mytabs input[type="radio"]:checked+label {
    background: #FFF;
    border: 1px solid black;
    border-bottom: 0;
}

.tab-content {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    padding-top: 50px;
    gap: 20px;
}

.download-container {
    border: 1px solid black;
}

.drawings-main .title-black {
    background: #000000;
    padding: 25px;
    text-align: center;
    font-weight: bolder;
    font-size: 20px;
    color: white;
}
.drawings-main .title {
    background: #931A1D;
    padding: 25px;
    text-align: center;
    font-weight: bolder;
    font-size: 20px;
    color: white;
}

.download-list {
    height: 250px;
    display: flex;
    flex-direction: column;
    overflow-y: scroll;
}

.download-list a {
    color: black;
    padding: 10px;
}

.download-list a:hover {
    background: linear-gradient(to right, #f0ecef, #f3f1f3, #f7f6f7, #fbfafb);
}

.preview-image {
    width: 75%;
    margin: 0 auto;
}

.preview-image img {
    width: 100%;
}

/* End 3D-Drawing end css  */

.usermanual-main .manuals-container {
    clear: both;
    display: flex;
    flex-wrap: wrap;
}

.usermanual-main .manuals-entry {
    flex-basis: 100%;
    display: flex;
    flex-wrap: wrap;
}

.usermanual-main .manuals-entry:nth-child(2n) {
    border-top: 1px solid black;
    border-bottom: 1px solid black;
}

.usermanual-main .manuals-title {
    flex: 1 1 20%;
    min-width: 150px;
    padding-left: 1%;
}

.usermanual-main .manuals-links {
    flex: 3 1 50%;
    margin-right: 15%;
    display: flex;
    flex-wrap: wrap;
}

.usermanual-main .manuals-link {
    flex: 1 1 100%;
    display: flex;
    flex-wrap: wrap;
    padding: 10px;
}

.usermanual-main .manuals-link>*:first-child {
    flex-basis: 0;
    flex-grow: 0;
    margin-right: 20px;
}

.usermanual-main .manuals-links>* img {
    width: 50px;
    filter: grayscale(100%);
    margin-top: 10px;
}

.usermanual-main .manuals-link>* {
    flex: 1 1 70%;
}

.manuals-links>* img:hover {
    filter: none;
}

/* START electric-actuators CSS */

.electric-actuators-main .grid {
    width: 100%;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr 2.5fr;
    grid-auto-rows: minmax(50px, auto);
    padding-top: 25px;
}

.electric-actuators-main .grid>div {
    padding-top: 20px;
    padding-bottom: 20px;
}

.electric-actuators-main .grid-row-title {
    font-size: 20px;
    font-weight: 800;
    padding-left: 7vw;
}

.electric-actuators-main .row-title h1{
    font-size: 20px;
    font-weight: 800;
}

.electric-actuators-main .grid-product-img img {
    /* display: block; */
    /* height: 100%; */
    height: 200px;
    /* margin-top: 20px; */
}

.align-button-left a{
    margin-left: 30px;
}

.electric-actuators-main .grid-product-containter {
    padding-right: 7vw;
}

.electric-actuators-main .grid-product-containter ul {
    margin-bottom: 40px;
    list-style-position: inside;
}

.electric-actuators-main .grid-product {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-evenly;
    max-width: 900px;
}

.electric-actuators-main .grid-product>div {
    flex-basis: 50%;
    flex-shrink: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-bottom: 40px;
    min-width: 250px;
}

.electric-actuators-main .grid-product-containter :is(ul, h3) {
    padding: 0;
    margin: 0;
}

.electric-actuators-main .grid-product-containter ul {
    margin-bottom: 40px;
    list-style-position: inside;
}

.electric-actuators-main .grid-product img {
    display: block;
    height: 100%;
    max-height: 200px;
    margin-top: 20px;
}

.electric-actuators-main .grid>div:nth-of-type(4n+3) {
    background: #f2f2f2;
}

.electric-actuators-main .grid>div:nth-of-type(4n+4) {
    background: #f2f2f2;
}

/* END electric-actuators */

.infoform .form-container {
    width: 70%;
    clear: both;
    margin: 94px auto;
    text-align: center;
}

.infoform .form-container :is(h1, p) {
    padding: 0;
}

.infoform #contact-form {
    width: 50%;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    margin: 0 auto 50px;
}

.infoform #contact-form> :is(input, textarea) {
    width: 100%
}

.infoform #contact-form>input:last-of-type {
    border: none;
}

input:invalid,
textarea:invalid {
    background-color: #f0dddd;
}

input[type="text"],
input[type="tel"],
input[type="email"],
textarea {
    box-sizing: border-box;
    padding: 10px;
    border: 0;
    border: 1px solid gray;
}

.infoform #part-number {
    font-weight: bold;
}

/* start formsubmit css */

.main-container {
    padding-bottom: 1%;
    padding-top: 150px;
    text-align: center;
    line-height: 3;
    width: 70%;
    margin: 0 auto;
}

.main-container p {
    font-size: 16px;
    font-weight: normal;
}

.main-container a {
    font-size: 16px;
    color: #8A0000;
}

.main-container a:hover {
    text-decoration: underline !important;
    font-size: 16px;
    color: #8A0000;
}

.images {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

.images img {
    max-width: 300px;
    margin: 10px;
    width: 100%;
}

.actuator-series .series-text {
    position: relative;
    top: 80px;
}

.series-semiconductor {
    position: relative;
    top: 30px;
    left: 25px;
}

/* End  formsubmit css */



.actuator-certifications .tradeshow-container {
    width: 100%;
    display: flex;
    margin: 20px auto;
    max-width: 1500px;
}

.actuator-certifications .tradeshow-events {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    flex: 0 0 100%;
    justify-content: space-evenly;
    padding-bottom: 100px;
}

.actuator-certifications .tradeshow-events>figure {
    border: none;
    text-align: center;
    flex: 1 1 auto;
    max-width: 300px;
    box-shadow: none;
    min-width: 300px;
    margin: 5px;
    padding: 20px;
    box-sizing: border-box;
}


.actuator-certifications .tradeshow-events>figure>p {
    margin-top: 100px;
    color: rgb(232, 232, 232);
}

.actuator-certifications .tradeshow-events figure:before {
    content: '';
    float: left;
    padding-top: 100%;
}

.actuator-certifications .tradeshow-figure {
    display: flex;
    align-items: left;
}

.actuator-certifications .tradeshow-figure>figure>img {
    width: 100%;
    height: auto;
    max-width: 15vw;
    min-width: 200px;
}




#Layoutdiv37 p {
    color: #000;
    padding: 10px;
    margin: 10px;
    font-size: 18px;
}

.timeline {
    position: relative;
    width: 70vw;
    margin: 0 auto;
    padding-bottom: 50px;
    padding-top: 180px;
}

.timeline::before {
    content: '';
    background: #000;
    width: 5px;
    height: 93%;
    margin-top: -55px;
    position: absolute;
    margin-left: 0;
    left: 50%;
    transform: translateX(-50%);
}

.texs {
    opacity: 1;
    transition: .75s ease-in-out 1s;
    display: block;
    padding: 7px;
}

.timeline-item {
    /*! width: 100%; */
    /*! margin-bottom: 50px; */
    /*! height: 250px; */
    width: 50%;
    opacity: 1;

}

.timeline-item:nth-child(even) .timeline-content {
    float: right;
    padding: 40px 30px 10px 30px;
}

.timeline-item:nth-child(even) .timeline-content::after {
    content: '';
    position: absolute;
    border-style: solid;
    width: 0;
    height: 0;
    top: 30px;
    left: -15px;
    border-width: 10px 15px 10px 0;
    border-color: transparent;
}

.timeline-item::after {
    content: '';
    display: block;
    clear: both;
}

.timeline-content {
    position: relative;
    width: 50%;
    padding: 15px;
    background: transparent;
}

.timeline-content::after {
    content: '';
    position: absolute;
    border-style: solid;
    width: 0;
    height: 0;
    top: 30px;
    right: -15px;
    border-width: 10px 0 10px 15px;
    border-color: transparent;
}

.timeline-img {
    width: 50px;
    height: 5px;
    background: #000;
    border-radius: 0;
    position: absolute;
    left: 50%;
    margin-top: 25px;
    margin-left: -25px;
}

.timeline-imgA {
    width: 150px;
    height: 5px;
    background: #000;
    border-radius: 0;
    position: absolute;
    left: 50%;
    margin-top: 125px;
    margin-left: -150px;
}

.timeline-imgB {
    width: 150px;
    height: 5px;
    background: #000;
    border-radius: 0;
    position: absolute;
    left: 50%;
    margin-top: 125px;
    margin-right: -25px;
}

#Layoutdiv37 a {
    background: #000;
    color: #FFFFFF;
    padding: 8px 20px;
    text-transform: uppercase;
    font-size: 14px;
    margin-bottom: 20px;
    margin-top: 10px;
    display: inline-block;
    border-radius: 2px;
    box-shadow: 0 1px 3px -1px rgba(0, 0, 0, 0.6);
}



#Layoutdiv37 a p {
    padding: 0 20px;
}

#Layoutdiv37 a a {
    margin-left: 20px;
}

.timeline-item .timeline-img-header {
    background: linear-gradient(transparent, rgba(0, 0, 0, 0.4)), url("") center center no-repeat;
    background-size: cover;
}

#Layoutdiv37 h2 {
    color: #FFFFFF;
    position: absolute;
    bottom: 5px;
    left: 20px;
}

.date {
    background: #000;
    display: inline-block;
    color: #FFFFFF;
    padding: 10px;
    position: absolute;
    top: 10px;
    right: 0;
}

.dateA {
    background: transparent;
    display: inline-block;
    color: black;
    font-size: 18px;
    padding: 10px;
    position: absolute;
    left: 27vw;
    margin-top: 45px;
    text-align: center;
    width: 75px;
}

.dateB {
    background: transparent;
    display: inline-block;
    color: black;
    padding: 10px;
    position: absolute;
    top: 45px;
    text-align: center;
    right: 27vw;
    width: 75px;
}

.aboutus-old .container {
    display: flex;
    flex-wrap: wrap;
}

.timeline-item:nth-child(odd) {
    margin-top: -180px;
}


@media screen and (max-width: 1305px) {
    .dateA {
        left: 25vw;

    }
}

@media screen and (max-width: 1125px) {
    .timeline {
        margin-left: 8%;
        padding: 50px;
    }

    .timeline-item {
        height: auto;
    }

    .timeline::before {
        left: 50px;
        height: 100%;
    }

    .timeline .timeline-img {
        left: 50px;
    }

    .timeline .dateA,
    .timeline .dateB {
        left: -90px;
        top: 75px;
        margin-top: 45px;
    }

    .timeline .timeline-imgA,
    .timeline .timeline-imgB {
        left: 50px;
        margin-left: 0;
        width: 0;
        height: 0;
        border-top: 20px solid transparent;
        border-bottom: 20px solid transparent;
        border-left: 20px solid black;
        background: transparent;
    }

    .timeline .timeline-content {
        max-width: 100%;
        width: auto;
        margin-left: 70px;
    }


    .timeline .timeline-item:nth-child(even) .timeline-content {
        float: none;
    }

    .timeline .timeline-item:nth-child(odd) .timeline-content::after {
        content: '';
        position: absolute;
        border-style: solid;
        width: 0;
        height: 0;
        top: 30px;
        left: -15px;
        border-width: 10px 15px 10px 0;
        border-color: transparent;
    }

    .texs {
        opacity: 1;
    }

    .container {
        flex-direction: column;
    }

    .timeline-item {
        width: 100%;
        margin-left: 50px;
    }

    .timeline-item:nth-child(odd) {
        margin-top: 0;
    }
}

.navbar {
    padding: 0 0px 0px 5%;
}

.header .logo img {
    margin-right: 0px !important;
}
.algin-items{
    padding-left: 11% !important;
}


@media screen and (max-width: 768px) {

    .breadcrumbs nav ol {
        padding-top: 15px;
        padding-left: 1rem !important;
        font-size: 13px;
    }
    .timeline {
        margin-left: 0;
        width: 100vw;
    }
    .desktop-only{
        display: none !important;
    }
    .mobile-only{
        display: block !important;
    }
    .navbar ul {
        background-image: linear-gradient(90deg, rgba(230, 72, 72, 1) 0%, rgba(224, 125, 48, 1) 100%);
    }
    .slider-content{
        background-color: rgba(255, 255, 255, 0.96);
        box-shadow: 0px 0px 50px rgba(0, 0, 0, 0.2);
        opacity: 0.8 !important;
        outline: none;
        text-align: center;
        width: 100%;
        padding: 100px;
    }
    .specsheet .img-container img {
        height: 200px;
        margin-top: 0px;
        /* margin-left: -169px; */
        margin-left: -25px;
    }

    .spec-left-content {
        justify-content: flex-start;
    }

    .pro-listing-con  .content-section{
        padding-left: 25px;
    }

   .page-container{
        background: transparent !important;
    }
    .actuator-list {
        padding-top: 30px;
    }
    .page-content{
        width: 90% !important;
    }
    .actuator-item:not(:nth-child(2)) {
        display: block !important;
    }
    .series-text {
        left: 32px !important;
    }
    .width-48{
        width: 48%;
    }

    /*.industries-main .page-container, .industries-aerospace .page-container {
        background: transparent;
    }

    .industries-main .page-content, .industries-aerospace .page-content{
        width: 90%;
    }

    .industries-main .actuator-item:not(:nth-child(2)),  .industries-aerospace .actuator-item:not(:nth-child(2)) {
        display: block;
    }

    .industries-aerospace  .actuator-series .series-text {
        left: 32px;
    }*/

    .home-page .side-intro h1 {
        font-size: 25px;
    }
    .header-wave-slider{
        padding-top: 0px !important;
    }

    .mobile-h1 h1 {
        font-size: 1.4em;
    }

    .mobile-h6 h6 {
        font-size: 0.9rem;
        padding: 10px;
    }
    
    .valve_type, .line_size {
        display: flex;
    }

    .video-item-frame>iframe {
        height: 50vw;
    }
}

@media not all and (min-resolution:.001dpcm) {
    .timeline::before {
        height: 85%;
    }
}

@media screen and (max-width: 1125px) {
    .timeline::before {
        height: 98%;
    }
}












@media only screen and (min-width: 767px) {
    #LayoutDiv39 {
        clear: both;
        float: left;
        margin-left: 0;
        width: 100%;
        display: none;
        visibility: hidden;
    }

    #LayoutDiv40 {
        clear: both;
        float: left;
        margin-left: 0;
        width: 100%;
        display: block;
        visibility: visible;
    }
}

@media only screen and (min-width: 1100px) {
    #LayoutDiv39 {
        clear: both;
        float: left;
        padding-left: 0;
        width: 100%;
        /*padding-left:12.5%;
    	width: 75%;*/
        display: block;
        visibility: visible;
    }

    #LayoutDiv40 {
        clear: none;
        float: left;
        margin-left: 0;
        width: 100%;
        display: none;
        visibility: hidden;
    }
}

/* spec-sheets page css end */

@media only screen and (max-width: 1100px) {
    .videos-container {
        flex-direction: column;
    }

    .video-item>iframe {
        width: 60vw;
        height: 33.756vw;
    }
}

@media only screen and (max-width: 767px) {
    .partnumber-guide {
        display: none;
    }
    .align-items{
        text-align: center;
    }
    .align-button-left a{
        margin: 0px !important;
    }
    .slider-content{
        background-color: rgba(255, 255, 255, 0.96);
        box-shadow: 0px 0px 50px rgba(0, 0, 0, 0.2);
        opacity: 1 !important;
        outline: none;
        text-align: center;
        width: 100%;
        padding: 5px 20px 0px 20px;
        height: 430px;
    }
}

@media only screen and (max-width: 1125px) {
    .card__container {
        grid-template-columns: minmax(200px, 400px);
    }

    .choose-cols>div:last-child {
        display: none;
    }

    .actuator-item:not(:nth-child(2)) {
        display: none;
    }

    .logo-container a {
        filter: none;
    }

    .accordion ul {
        display: flex;
        flex-direction: column;
    }

    .accordion ul li {
        width: 100%;
    }

    .accordion ul li a * {
        opacity: 1 !important;
    }

    .accordion ul li div a {
        background-color: rgba(255, 255, 255, 0.95);
        height: auto;
    }

    .swiper-slide span:hover p {
        font-size: 13px;
        margin-top: -175px;

    }

    .swiper-slide span p a {
        font-size: 13px;
    }

    .swiper-slide span:hover p a {
        font-size: 13px;
    }

    .card__container {
        grid-template-columns: minmax(200px, 400px);
    }

    .contact-container {
        flex-direction: column;
    }
    .algin-items{
        padding-left: 15% !important;
    }
}

@media only screen and (max-width: 768px) {
    .side-image {
        display: none;
    }

    .side-intro {
        text-align: center;
        margin: 0;
    }

    .text-section {
        margin: 20px auto 0;
    }

    .swiper-slide span p {
        display: block;
        visibility: visible;
        margin-top: -450px;
        margin-bottom: 50px;
        color: #000;
        z-index: 98;
        width: 70%;
        padding-left: 15% !important;
        line-height: 1.40em;
        font-size: 18px;
    }

    .swiper-slide span p a {
        display: block;
        visibility: visible;
        color: #930209;
        z-index: 100;
        text-decoration: underline;
        font-size: 18px;
    }

    .swiper-slide span:hover p a {
        font-size: 18px;
    }

    .swiper-slide span:hover p {
        font-size: 18px;
        margin-top: -450px;
        margin-bottom: 50px;
    }

    .swiper-slide img {
        opacity: 0.2;
    }

    input,
    textarea {
        display: flex;
        width: 80%;
        border: 1px solid gray;
    }

    input[type="text"],
    input[type="tel"],
    input[type="email"],
    textarea {
        border: 1px solid gray;
    }

    .infoform #contact-form {
        width: 100%;
    }

    .infoform .form-container {
        margin-top: 20px;
    }

    .actuator-series .series-text {
        top: 0px;
    }

    .series-semiconductor {
        top: 0px;
        left: 0px;
    }
    .algin-items{
        padding-left: 15% !important;
    }

    .industries-main.page-container {
        background: transparent;
    }
}

@media (min-width: 1025px) and (max-width: 1200px) {
    /* styles for browsers larger than 1440px; */
    .mytabs {
        /* padding: 0px 7%; */
        padding: 0px 2%;
    }
    .algin-items{
        padding-left: 15% !important;
    }
}

@media (min-width: 1201px) and (max-width: 1440px) {
    /* styles for browsers larger than 1440px; */
    .mytabs {
        /* padding: 0px 11%; */
        padding: 0px 2%;
    }
    /* .specsheet table tr td:first-child {
        width: 12%;
    } */
    .center {
        /* left: 50%; */
        left: 20%;
    }
    .algin-items{
        padding-left: 0% !important;
    }
}   
@media (min-width: 769px) and (max-width: 850px) {
    .waves-slider{
        top: 8.7%
    }
}
@media (min-width: 851px) and (max-width: 910px) {
    .waves-slider{
        top: 7.8%
    }
}
@media (min-width: 911px) and (max-width: 991px) {
    .waves-slider{
        top: 8%
    }
}
@media (min-width: 992px) and (max-width: 1016px) {
    .waves-slider{
        top: 9.4%
    }
}
@media (min-width: 1017px) and (max-width: 1082px) {
    .waves-slider{
        top: 10%
    }
}
@media (min-width: 1083px) and (max-width: 1128px) {
    .waves-slider{
        top: 10.5%
    }
}
@media (min-width: 1129px) and (max-width: 1196px) {
    .waves-slider{
        /* top: 13.5% */
    }
}

@media (min-width: 1197px) and (max-width: 1272px) {
    .waves-slider{
        /* top: 14.5% */
    }
}

@media (min-width: 1273px) and (max-width: 1365px) {
    .waves-slider{
        /* top: 15.2% */
    }
}


@media (min-width: 1365px) and (max-width: 1439px) {
    .waves-slider{
        /* top: 15.9% */
    }
}

@media (min-width: 1560px) and (max-width: 1900px) {
    /* styles for browsers larger than 1440px; */
    .mytabs {
        /* padding: 0px 11%; */
        padding: 0px 2%;
    }
    .dateA {
        left: 27vw;
    }

    .dateB {
        right: 28vw;
    }
    .usermanual-main .manuals-title {
        padding-left: 1%;
    }
    /* .specsheet table tr td:first-child {
        width: 12%;
    } */
    .center {
        /* left: 50%; */
        left: 26%;
    }

    .navbar {
        padding: 0 0px 0px 14%;
    }

    .algin-items{
        padding-left: 10% !important;
    }
    .spec-left-content {
        padding-top: 7%;
    }
    .img-container img {
        height: 350px;
    }
}

@media only screen and (min-width: 1920px) {
    .mytabs {
        /* padding: 0px 15%; */
        padding: 0px 2%;
    }
    .center {
        /* left: 50%; */
        left: 20%;
    }
    /* .specsheet table tr td:first-child {
        width: 16%;
    } */

    .navbar {
        padding: 0 0px 0px 18%;
    }

    .algin-items{
        padding-left: 18% !important;
    }
    .spec-left-content {
        padding-top: 7%;
    }
    .img-container img {
        height: 390px;
    }
}

@media (min-width: 1921px) and (max-width: 2048px) {
    /* styles for browsers larger than 1440px; */
    .mytabs {
        /* padding: 0px 18%; */
        padding: 0px 2%;
    }
    .dateA {
        left: 23vw;
    }

    .dateB {
        right: 25vw;
        top: 2vw;
    }
    .usermanual-main .manuals-title {
        padding-left: 1%;
    }
    /* .specsheet table tr td:first-child {
        width: 18%;
    } */
    .center {
        /* left: 50%; */
        left: 20%;
    }

    .algin-items{
        padding-left: 20% !important;
    }
    .spec-left-content {
        padding-top: 8%;
    }
    .img-container img {
        height: 420px;
    }
}

@media (min-width: 2050px) and (max-width: 2560px) {
    /* styles for browsers larger than 1440px; */
    .mytabs {
        /* padding: 0px 21%; */
        padding: 0px 2%;
    }
    .center {
        /* left: 50%; */
        left: 20%;
    }
    /* .specsheet table tr td:first-child {
        width: 22%;
    } */

    .algin-items{
        padding-left: 25% !important;
    }
    .spec-left-content {
        padding-top: 7%;
    }
    .img-container img {
        height: 458px;
    }
}
@media only screen and (min-width: 2560px) {

    /* styles for browsers larger than 2560px; */
    .mytabs {
        /* padding: 0px 28%; */
        padding: 0px 1%;
    }

    .dateA {
        left: 17vw;
    }

    .dateB {
        right: 18vw;
        top: 2vw;
    }
    /* .specsheet table tr td:first-child {
        width: 29%;
    } */
    .center {
        /* left: 50%; */
        left: 15%;
    }

    .algin-items{
        padding-left: 40% !important;
    }
    .spec-left-content {
        padding-top: 7%;
    }
    .img-container img {
        height: 590px;
    }
}

@media only screen and (min-width: 3840px) {

    /* styles for browsers larger than 2560px; */
    .mytabs {
        /* padding: 0px 32%; */
        padding: 0px 1%;
    }

    .dateA {
        left: 23vw;
    }

    .dateB {
        right: 24vw;
    }
}

@media only screen and (min-width: 4096px) {

    /* styles for browsers larger than 2560px; */
    .mytabs {
        /* padding: 0px 36%; */
        padding: 0px 1%;
    }

    .dateA {
        left: 11vw;
    }

    .dateB {
        right: 11vw;
        top: 1vw;
    }
}

@media only screen and (min-width: 5120px) {

    /* styles for browsers larger than 2560px; */
    .mytabs {
        /* padding: 0px 39%; */
        padding: 0px 1%;
    }

    .dateA {
        left: 9vw;
    }

    .dateB {
        right: 9vw;
        top: 1vw;
    }
}


/* input slider */

.noUi-target,.noUi-target * {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -ms-touch-action: none;
    touch-action: none;
    -ms-user-select: none;
    -moz-user-select: none;
    user-select: none;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
  }
  
  .noUi-target {
    position: relative;
    direction: ltr;
  }
  
  .noUi-base {
    width: 100%;
    height: 100%;
    position: relative;
    z-index: 1;
  /* Fix 401 */
  }
  
  .noUi-origin {
    position: absolute;
    right: 0;
    top: 0;
    left: 0;
    bottom: 0;
  }
  
  .noUi-handle {
    position: relative;
    z-index: 1;
  }
  
  .noUi-stacking .noUi-handle {
  /* This class is applied to the lower origin when
     its values is > 50%. */
    z-index: 10;
  }
  
  .noUi-state-tap .noUi-origin {
    -webkit-transition: left 0.3s,top .3s;
    transition: left 0.3s,top .3s;
  }
  
  .noUi-state-drag * {
    cursor: inherit !important;
  }
  
  /* Painting and performance;
   * Browsers can paint handles in their own layer.
   */
  .noUi-base,.noUi-handle {
    -webkit-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
  }
  
  /* Slider size and handle placement;
   */
  .noUi-horizontal {
    height: 4px;
  }
  
  .noUi-horizontal .noUi-handle {
    width: 18px;
    height: 18px;
    border-radius: 50%;
    left: -7px;
    top: -7px;
    background-color: var(--color-primary)
  }
  
  /* Styling;
   */
  .noUi-background {
    background: #D6D7D9;
  }
  
  .noUi-connect {
    background: var(--color-primary);
    /* -webkit-transition: background 450ms;
    transition: background 450ms; */
  }
  
  .noUi-origin {
    border-radius: 2px;
  }
  
  .noUi-target {
    border-radius: 2px;
  }
  
  /* Handles and cursors;
   */
  .noUi-draggable {
    cursor: w-resize;
  }
  
  .noUi-vertical .noUi-draggable {
    cursor: n-resize;
  }
  
  .noUi-handle {
    cursor: default;
    -webkit-box-sizing: content-box !important;
    -moz-box-sizing: content-box !important;
    box-sizing: content-box !important;
  }
  
  .noUi-handle:active {
    border: 8px solid #345DBB;
    border: 8px solid rgba(53,93,187,0.38);
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
    left: -14px;
    top: -14px;
  }
  
  /* Disabled state;
   */
  [disabled].noUi-connect,[disabled] .noUi-connect {
    background: #B8B8B8;
  }
  
  [disabled].noUi-origin,[disabled] .noUi-handle {
    cursor: not-allowed;
  }

/* .product listing page environment */
  .environment input[type='radio'] {
    accent-color: var(--color-primary)
  }
  .display-hide {
      display: none;
  }

  .form-check-input {
      width: 18px;
      height: 18px;
      background: #fff;
      border: 1px solid #e55243;
  }

  .show-more-content {
    height: 270px;
    overflow: auto;
}

.breadcrumbs nav ol{
    padding-left: 2rem;
}

.font-size-15 {
    font-size: 14px;
}

/* custom .accordion */
.accordion-custom {
    width: 100%;
    overflow: hidden;
    margin: 0 auto;
}

.accordion-custom ul {
    width: 100%;
    display: table;
    table-layout: fixed;
    margin: 0;
    padding: 0;
}

.accordion-custom ul li {
    display: table-cell;
    vertical-align: bottom;
    position: relative;
    width: 20%;
    background-size: 190px;
    background-repeat: no-repeat;
    background-position: center center;
    /* transition: all 175ms ease; */

}

.accordion-custom ul li div {
    display: block;
    overflow: hidden;
    width: 100%;
    text-align: center;

}

.accordion-custom ul li div a {
    display: block;
    /* width: 75%; */
    margin-left: 15%;
    position: relative;
    z-index: 3;
    padding: 15px 20px;
    box-sizing: border-box;
    color: #fff;
    text-decoration: none;
    /* transition: all 300ms ease; */
    height: 400px;
}

.accordion-custom ul li div a * {
    opacity: 0;
    /* margin: 0; */
    width: 100%;
    position: relative;
    z-index: 5;
    white-space: wrap;
    /* -webkit-transform: translateX(-20px); */
    /* transform: translateX(-20px); */
    /* -webkit-transition: all 300ms ease; */
    /* transition: all 300ms ease; */
}

.accordion-custom ul li div a h3 {
    font-size: 18px;
    margin-top: 45px;
    padding-left: 5%;
    width: 99%;
    color: #000;
    text-align: center;
}

.accordion-custom ul li div a p {
    font-size: 18px;
    padding-left: 5%;
    margin-top: 15px;
    width: 99%;
    color: #000;
}

.accordion-custom ul li div p1 {
    font-weight: lighter;
    font-size: 16px;
    padding-left: 5%;
    width: 99%;
    color: #000;
    clear: both;
}

.accordion-custom ul li:nth-child(1) div.bgImage {
    background-image: url(/hanbay/home/homepage-column-indoor-background.png);
    position: relative;
    z-index: -1;
    background-size: cover;
}

.accordion-custom ul li:nth-child(2) div.bgImage {
    background-image: url(/hanbay/home/outdoor-background.png);
    position: relative;
    z-index: -1;
    background-size: cover;
}
.accordion-custom ul li:nth-child(3) div.bgImage {
    background-image: url(/hanbay/home/hazardous-background.png);
    position: relative;
    z-index: -1;
    background-size: cover;
}

.indoor-image{
    background-image: url(/hanbay/home/indoor-background-formatted.png);
    margin: 0px;
    padding: 0px;
    height: 430px;
    background-size: cover;
    background-position: bottom;
}
.outdoor-image{
    background-image: url(/hanbay/home/outdoor-background-formatted.png);
    margin: 0px;
    padding: 0px;
    height: 430px;
    background-size: cover;
    background-position: bottom;
}
.hazardous-image{
    background-image: url(/hanbay/home/hazardous-background-formatted.png);
    margin: 0px;
    padding: 0px;
    height: 430px;
    background-size: cover;
    background-position: bottom;
}

.accordion-custom ul li div a {
    margin: 0px !important;
}
.accordion-custom ul li:nth-child(1) {
    /* background-image: url('/hanbay/pages/testC1.png'); */
}

.accordion-custom ul li:nth-child(2) {
    /* background-image: url('/hanbay/pages/testC2.png'); */
}

.accordion-custom ul li:nth-child(3) {
    /* background-image: url('/hanbay/pages/testC4.png'); */
}

.accordion-custom ul:hover li,
.accordion-custom ul:focus-within li {
    width: 8%;
}

.accordion-custom ul li:focus {
    outline: none;
}

/* .accordion-custom ul:hover li:hover,
.accordion-custom ul li:focus,
.accordion-custom ul:focus-within li:focus {
    width: 60%;
} */


/*----------ACCORDIAN BACKGROUND GRADIENT -------------*/
.accordion-custom ul:hover li:hover a,
.accordion-custom ul li:focus a,
.accordion-custom ul:focus-within li:focus a {
    /* background-image: linear-gradient(to bottom, rgba(238, 238, 238, 1), rgba(255, 255, 255, 0.9));*/
    background-color: rgba(255, 255, 255, 0.96);
    box-shadow: 0px 0px 50px rgba(0, 0, 0, 0.2);

}

.slider-main-div{
    float: left;
    width: 100%;
    height: 430px;
}

.slider-content{
    opacity: 0;
}
.slider-content:hover, .slider-content:focus, .slider-content:focus-within{
    background-color: rgba(255, 255, 255, 0.96);
    box-shadow: 0px 0px 50px rgba(0, 0, 0, 0.2);
    opacity: 1 !important;
    outline: none;
    text-align: center;
    width: 100%;
    /* padding: 50px; */
    height: 430px;
}



.indoor-image .slider-content:hover {
    margin-top: 30px;
    padding: 50px;
    height: 430px;
}
.outdoor-image .slider-content:hover {
    margin-top: -23px;
    padding: 85px;
    height: 485px;
}
.hazardous-image .slider-content:hover {
    margin-top: -16px;
    padding: 50px;
    height: 480px;
}


/* .accordion-custom ul:hover li {
    width: 20% !important;
} */

.accordion-custom ul:hover li a * {
    opacity: 0 !important;
    width: 95% !important;

}
/* 
.accordion-custom ul:hover li:hover {
    width: 60% !important;
} */

.accordion-custom ul:hover li:hover a * {
    opacity: 1 !important;
    text-align: center;
}

.accordion-custom-button:not(.collapsed) {
    color: var(--color-primary);
    border-color: #fff;
    background-color: #fff;
}

.accordion-custom-button:focus {
    border-color: #fff;
    box-shadow: var(--bs-accordion-custom-bg);
}

.get-started-custom-btn {
    color: white !important;
    background: linear-gradient(to left, #931A1D 50%, #EC1D1D 50%) right;
    background-size: 200%;
    padding: 0.55em .7em;
    /* border-radius: 3em; */
    box-sizing: border-box;
    text-decoration: none;
    font-weight: 400;
    text-align: center;
    /* transition: .5s ease-out; */
    cursor: pointer;
    border: none;
    /* margin-top:15px !important; */
    width: 35% !important;
    margin: 15px auto !important;
}
.get-started-custom-btn a{
    color: #ffffff;
}
.product-specs ul{
    padding: 10px 0px;
}
.thankyou-main .main-container{
    padding-top: 10px;
}