@media (min-width: 1800px) {
    .top-bar, nav {
        padding-left: clamp(1%, 3vw + 1%, 30%);
        padding-right: clamp(1%, 3vw + 1%, 30%);
    }
}
@media (min-width: 1600px) and (max-width: 1800px) {
.top-bar, nav {
    padding-left: clamp(1%, 3vw + 1%, 30%);
    padding-right: clamp(1%, 3vw + 1%, 30%);
}
}
@media (min-width: 1400px) and (max-width: 1600px) {
.top-bar, nav {
    padding-left: clamp(1%, 2vw + 3%, 30%);
    padding-right: clamp(1%, 2vw + 3%, 30%);
}
}
@media (min-width: 992px) and (max-width: 1200px) {
.header, nav {
    padding-left: clamp(1%, 3vw + 1%, 30%);
    padding-right: clamp(1%, 3vw + 1%, 30%);
}
#logo {
    max-height: 75px;
    width: 100%;
}
#ingnsLogo {
    max-height: 75px;
    width: 100%;
}
}
@media (min-width: 600px) and (max-width: 992px) {
    body {
        padding: 0;
    }
    .video-section {
        width: 100%; 
        height: 60vh;
    }
    .video-background {
        width: 100%;
        height: 101%;
        object-fit: cover;
    }

    .sticky-header {
        width: 100%;
        height: auto;
    }

    .top-bar {
        padding: 10px 20px;
    }

    #ingnsLogo {
        max-height: 60px;
        width: auto;
    }
    #logo {
        max-height: 60px;
        width: auto;
    }

    nav ul {
        padding: 0 20px;
    }

    nav ul li {
        padding: 5px 20px;
    }

    .main-content {
        padding: 20px 5%;
    }

    .product-categories {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 20px;
        padding: 20px;
    }

    .customer-slider {
        padding: 0 20px;
    }
    .sensortool-grid {
        grid-template-columns: 1fr; 
        gap: 20px;
        padding: 20px;
    }
    .icons-container {
        justify-content: flex-end;
        gap: 20px;
    }

    .phone-numbers,
    .address-block {
        right: 20px;
        width: 250px;
    }
    .INGNS{
        display: none;
    }
    .top-bar-section{
        display: none;
    }

    .ingns-small-logo {
        order: 1;
        align-items: left;
        width: 100%;
    }

    .ingns-small-logo img {
        width: 70%; 
        height: auto;
    }

    .location-block {
        order: 2;
        padding-right: 2%;
    }

    .phoneNumber-block {
        order: 3;
        padding-right: 5%;
    }
    .phone-numbers {
        position: fixed;
        top: 120px;
        right: -50px;
        background-color: white;
        padding: 10px;
        border: 1px solid #855a2a;
        box-shadow: 0 4px 15px rgba(0,0,0,0.2);
        width: auto;
        min-width: 200px;
    }
    .address-block {
        position: fixed;
        top: 120px; 
        background-color: white;
        padding: 10px;
        border: 1px solid #855a2a;
        box-shadow: 0 4px 15px rgba(0,0,0,0.2);
        word-wrap: break-word;
        width: auto;
        max-width: 80vw;
    }
    .address-block span {
        display: block;
        color: #000000;
        margin: 5px 0;
        white-space: normal;

    }
    .phone-numbers a {
        display: block;
        color: #000000;
        margin: 5px 0;
        text-decoration: none;
    }
    .aboutUs_img {
        align-items: center;
        justify-content: center;
    }
}
@media (min-width: 600px) {
    .menu-button {
        display: none;
    }

}
@media (min-width: 360px) and (max-width: 600px) {
    body{
        padding: 0;
    }
    .main-content{
        padding: 3%
    }
    .video-background {
        display: none;

    }
    .video-section {
        position: static;
        width: 100%;
        height: 95vh;
        background: url('../images/ifm-newsletter-editorialteaser2240x1120-02.jpg') no-repeat center center;
        background-size: cover;
    }
    .top-bar-section{
        display: none;
    }
    .sticky-header {
        background-color: #ffffff00 !important; 
        height: auto;
    }
    nav {
        background-color: transparent;
        display: none;
        position: fixed;
        left: 100%;
        width: 100%;
        transition: left 0.3s ease-in-out;
        height: auto; 
        min-height: fit-content;
    }
    .sticky-header:hover .top-bar,
    .sticky-header.scrolled .top-bar {
        background-color: #fffffff6 !important;
    }

    .sticky-header .top-bar {
        transition: none !important;
        background-color: #ffffffe5 !important;
    }  
    .sticky-header nav ul li a {
        color: #000000 !important;
    }
    .sticky-header nav{
        background-color: #fdcf8a00 !important;
    }
    .sticky-header nav ul{
        background-color: #ffffff00 !important;
    }
    .icons-container {
        display: flex;
        flex-direction: row;
        align-items: center;
        width: 100%;
        padding: 5%;
        padding-left: 0;

    }
    .ingns-small-logo {
        order: 1;
        align-items: flex-start;
        width: 80%;
    }
    .ingns-small-logo img.small-logo {
        width: 100%; 
        height: auto !important;
        content: url('../images/ingns-logo-900.png');
        margin-left: 0;
    }
    .location-block {
        order: 2;
        padding-right: 2%;
    }
    .phoneNumber-block {
        order: 3;
        padding-right: 5%;
    }
    .menu-button {
        display: block !important;
        background-color: #e4e1e1;
        color: rgb(0, 0, 0);
        padding: 1px 16px;
        border: none;
        border-radius: 4px;
        cursor: pointer;
        position: fixed; 
        z-index: 1005; 
        top: 70px; 
        left: 0;
        
    }
    .menu-toggle {
        display: block !important;
        position: relative;
        background-color: rgba(255, 255, 255, 0);
    }
    nav.active {
        display: block !important;
        left: 0;
        width: 100%;
        position: fixed;
        background-color: #ffffff00;
        border-radius: 10px;
        box-shadow: 0 4px 15px rgba(0,0,0,0.2);   
    }

    nav ul {
        flex-direction: column;
        background-color: transparent;
    }

    nav ul li {
        padding: 10px 0;
        background-color: transparent;
    }

    nav.active ul {
        background-color: rgba(255, 255, 255, 0);
        text-align:left;
    }
    nav.active ul li {
        padding-left: 10%;
        border: 1px solid #d1d1d1;
        border-radius: 0px;
        opacity: 0;
        animation: slideIn 0.3s forwards;
        animation-delay: calc(0.1s * var(--item-index));
        transition: color 0.3s ease;
        background-color: white;
        padding-left: 20%;
    }
    nav.active ul li a {
        color: #ffffff;
        font-size: 1.4em;
        font-weight: 545;
    }
    nav.active ul li a:hover,
    nav.active ul li a:focus {
        color: #FFA500 !important;
    }
    .main-content {
        position: relative;
        z-index: 800;
      }
    @keyframes slideIn {
        from {
            transform: translateX(-100%);
            opacity: 0;
        }
        to {
            transform: translateX(0);
            opacity: 1;
        }
    }
    .phone-numbers {
        position: fixed;
        top: 80px;
        right: 10px;
        background-color: white;
        padding: 10px;
        border: 1px solid #855a2a;
        box-shadow: 0 4px 15px rgba(0,0,0,0.2);
        width: auto;
        min-width: 200px;
        padding-bottom: 0;
    }
    .address-block {
        position: fixed;
        top: 80px;
        right: 10px;
        background-color: white;
        padding: 10px;
        border: 1px solid #855a2a;
        box-shadow: 0 4px 15px rgba(0,0,0,0.2);
        word-wrap: break-word;
        width: auto;
        max-width: 80vw;
    }
    .address-block span {
        display: block;
        color: #000000;
        margin: 5px 0;
        white-space: normal;
    }
    .phone-numbers a {
        display: block;
        color: #000000;
        margin: 5px 0;
        text-decoration: none;
    }
    #ingnsLogo {
        display: none;
    }
    #logo {
        display: none;
    }
    .sticky-header .header-icon {
        content: url('../Ikone/callBlack.png');
    }
    .sticky-header .location-icon {
        content: url('../Ikone/locationBlack.png');
        transform: scale(1.1);
    }
    .sticky-header .location-icon:hover {
        transform: scale(1.3); 
    }
}
@media (min-width: 0px) and (max-width: 360px)  {
    body{
        padding: 0;
    }
    .main-content{
        padding: 3%
    }
    .video-background {
        display: none;
    }
    .video-section {
        position: static;
        width: 100%;
        height: 95vh;
        background: url('../images/ifm-newsletter-editorialteaser2240x1120-02.jpg') no-repeat center center;
        background-size: cover;
    }
    .top-bar-section{
        display: none;
    }
    .sticky-header {
        background-color: #ffffff00 !important; 
        height: auto;
    }
    nav {
        background-color: transparent;
        display: none;
        position: fixed;
        left: 100%;
        width: 100%;
        transition: left 0.3s ease-in-out;
        height: auto; 
        min-height: fit-content;
    }
    .sticky-header:hover .top-bar,
    .sticky-header.scrolled .top-bar {
        background-color: #fffffff6 !important;
    }
    .sticky-header .top-bar {
        transition: none !important;
        background-color: #ffffffe5 !important;
    }
    .sticky-header nav ul li a {
        color: #000000 !important;
    }
    .sticky-header nav{
        background-color: #fdcf8a00 !important;
    }
    .sticky-header nav ul{
        background-color: #ffffff00 !important;
    }
    .icons-container {
        display: flex;
        flex-direction: row;
        align-items: center;
        width: 100%;
        padding: 5%;
        padding-left: 0;

    }
    .ingns-small-logo {
        order: 1;
        align-items: flex-start;
        width: 80%;

    }
    .ingns-small-logo img.small-logo {
        width: 100%;
        height: auto !important;
        content: url('../images/ingns-logo-900.png');
        margin-left: 0;
    }
    .location-block {
        order: 2;
        padding-right: 0%;
        padding-left: 2%;
    }
    .phoneNumber-block {
        order: 3;
        padding-right: 5%;
    }
    .menu-button {
        display: block !important;
        background-color: #e4e1e1;
        color: rgb(0, 0, 0);
        padding: 1px 16px;
        border: none;
        border-radius: 4px;
        cursor: pointer;
        position: fixed; 
        z-index: 1005; 
        top: 56px; 
        left: 0;
        
    }
    .menu-toggle {
        display: block !important;
        position: relative;
        background-color: rgba(255, 255, 255, 0);
    }
    nav.active {
        display: block !important;
        left: 0;
        width: 100%;
        position: fixed;
        background-color: #ffffff00;
        border-radius: 10px;
        box-shadow: 0 4px 15px rgba(0,0,0,0.2);
    }
    nav ul {
        flex-direction: column;
        background-color: transparent;
    }
    nav ul li {
        padding: 10px 0;
        background-color: transparent;
    }
    nav.active ul {
        background-color: rgba(255, 255, 255, 0);
        text-align:left;
    }
    nav.active ul li {
        padding-left: 10%;
        border: 1px solid #d1d1d1;
        border-radius: 0px;
        opacity: 0;
        animation: slideIn 0.3s forwards;
        animation-delay: calc(0.1s * var(--item-index));
        transition: color 0.3s ease;
        background-color: white;
        padding-left: 20%;
    }
    nav.active ul li a {
        color: #ffffff;
        font-size: 1.4em;
        font-weight: 545; 
    }
    nav.active ul li a:hover,
    nav.active ul li a:focus {
        color: #FFA500 !important; 
    }
    .main-content {
        position: relative;
        z-index: 800;
      }
    @keyframes slideIn {
        from {
            transform: translateX(-100%);
            opacity: 0;
        }
        to {
            transform: translateX(0);
            opacity: 1;
        }
    }
    .phone-numbers {
        position: fixed;
        top: 80px; 
        right: 10px;
        background-color: white;
        padding: 10px;
        border: 1px solid #855a2a;
        box-shadow: 0 4px 15px rgba(0,0,0,0.2);
        width: auto;
        min-width: 200px;
        padding-bottom: 0;
    }
    .address-block {
        position: fixed;
        top: 80px; 
        right: 10px;
        background-color: white;
        padding: 10px;
        border: 1px solid #855a2a;
        box-shadow: 0 4px 15px rgba(0,0,0,0.2);
        word-wrap: break-word;
        width: auto;
        max-width: 80vw;
    }
    .address-block span {
        display: block;
        color: #000000;
        margin: 5px 0;
        white-space: normal;
    }
    .phone-numbers a {
        display: block;
        color: #000000;
        margin: 5px 0;
        text-decoration: none;
    }
    #ingnsLogo {
        display: none;
    }
    #logo {
        display: none;
    }
    .sticky-header .header-icon {
        content: url('../Ikone/callBlack.png');
    }
    .sticky-header .location-icon {
        content: url('../Ikone/locationBlack.png');
        transform: scale(1.1);
    }
    .sticky-header .location-icon:hover {
        transform: scale(1.3); 
    }
}