
   		/* FONT FAMILIES */
		@font-face {
			font-family: 'Source Sans Pro';
			font-display: block;
			src: url(https://www.emenacpackaging.com/wp-content/themes/emenac/assets_old/fonts/SourceSans3-VariableFont_wght.ttf); 
		}

		.required_field{ position: relative;}
		.invalid-tooltip{text-wrap:nowrap;max-width:unset;right:0;margin-right: calc(var(--bs-gutter-x)* .5);}

		@font-face {
			font-family: 'Quicksand';
			font-weight: 400 800;
			font-display: block;
			src: url(https://www.emenacpackaging.com//wp-content/themes/emenac/assets_old/fonts/Quicksand-VariableFont_wght.ttf); 
		}
	
body{
font-family: 'Source Sans Pro', system-ui, sans-serif;
}

h1,h2,h3,h4,h5,h6{
font-family: 'Quicksand';
font-weight:700 !important;
}

	iframe#launcher {left:auto !important; right:0;}
	iframe#webWidget {left:auto !important; right:0;}
/* VARIABLES */
:root {
    /* Container Max-Width */
    --container-size: 1196px;
    --container-padding: 15px; /* Container Padding-Inline */
    /* Font Famlies */
    --ff-primary: 'Source Sans Pro', system-ui, sans-serif;
    --ff-secondary: 'Quicksand', system-ui, sans-serif;
    /* Font-Sizes */
    --fs-xl: 36px;
    --fs-lg: 30px;
    --fs-md: 24px;
    --fs-sm: 18px;
    --fs-base: 16px;
    --fs-xs: 14px;
    --fs-xxs: 12px;
    /* Colors */
    --c-primary: #0061bc;
    --c-secondary: #ef233c;
    --c-secondary-dark: #c0162b;
    --c-tertiary: #2e2e2e;
	--c-tertiary-dark: #e3001c;
    /* Styling */
    --transition: .3s;
    --fl-primary: sepia(94%) saturate(1801%) hue-rotate(194deg);
    --fl-secondary: invert(36%) sepia(94%) saturate(5083%) hue-rotate(335deg) brightness(95%) contrast(103%);
}
	/* MODIFIER CLASSES */
	.center-text{text-align: center; margin-bottom: 20px;}
	.cst-button {background-color: var(--c-tertiary-dark); border-radius: 10px; padding: 10px; text-transform: uppercase;color:white;font-weight:500;text-decoration:none;}
.cst-button:hover {background-color: var(--c-secondary-dark);color:white;font-weight:500;}

.custom__btn {background-color: var(--c-tertiary-dark); border-radius: 10px; padding: 10px; text-transform: uppercase;color:white;}
.custom__btn:hover {background-color: var(--c-secondary-dark);color:white;}
      img {max-width: 100%;height: auto;}
      a{ text-decoration: none; }
      .container {max-width: 1196px; width: 100%; margin: auto;}
      .page-heading h1{ color:var(--font-heading); }
      .page-heading p {color: var(--text-color);}
      :root{ --font-heading:#000; --text-color:#1f1f1f;overflow-x:hidden;  }
		@media (min-width: 1400px) {
		      .container {max-width: 1196px; width: 100%; margin: auto;}

	}
	.mega-dropdown span{display:none;}
	.dropdown-link span{font-size:8px;display:block;}
	button#nav-toggle:active, button#nav-toggle:focus{border:0;background:0;}

.sticky-bar {padding-block: 6px; position: fixed; top: -100%; width: 100%; background-color: #fff; --_c-light-100: #e1e1e1; --_c-blue: #007bff; z-index: 500; box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 5%);}
.sticky-bar .wrapper {display: flex; align-items: center; justify-content: space-between;}
.sticky-bar a {color: var(--_c-blue);}
.sticky-bar .logo a {width: 150px; display: block;}
.sticky-bar a:hover {color: var(--_c-blue);}
.sticky-bar ul {display: flex; align-items: center; gap:24px; justify-content:end; width:100%;  padding-right:50px; }
.sticky-bar li {list-style:none; list-style-position: inside;}
.sticky-bar li a {display: flex; align-items: center; cursor: pointer;text-decoration:none}
.sticky-bar li svg {fill: var(--c-primary);}
.sticky-bar li:hover svg {fill: var(--c-secondary);}
.sticky-bar li div {margin-left: 10px; text-wrap: nowrap;}
.sticky-bar li div * {display: block; color: var(--c-tertiary);}
.sticky-bar li div :first-child {font-size: var(--fs-sm, 18px); font-weight: 600;}
.sticky-bar li div :nth-child(2) {font-size: var(--fs-xs, 14px);}

.sticky-bar .tel-btn {font-size:18px; font-weight: 600; padding: 8px 16px 8px 8px;border-radius:5px; text-align: center; color:white; text-decoration:none; width: fit-content; text-wrap: nowrap; background-color: #C93F2C;}
.sticky-bar .tel-btn svg {margin-right: 5px;}
.sticky-bar .tel-btn:hover{color:white;}

/* header */
header { --_c-gray-100: #f5f5f5; --_c-gray-400: #757575; --_c-border-200: #cbcbcb; --_c-dark-900: #242424; --_c-light-100: #f8f9fa;}
        header .topbar {padding-block: 8px; background-color: var(--_c-gray-100);}
        header .topbar .wrapper {display: flex; align-items: center; justify-content: space-between;}
        header .topbar li {display: inline-flex; align-items: center; margin-right: 10px;}
        header .topbar li a {color: #676767;text-decoration:none;display:flex; gap: 5px;place-items:center;}
        header .topbar li:hover a {color: var(--c-secondary);}
        header .topbar li:hover svg {fill: var(--c-secondary);}
		header .topbar ul {margin-bottom: 0;}
        header .topbar ul:nth-child(2) li:hover svg {transform: scale(1.1);}
        header .topbar ul:nth-child(1) li svg {margin-right: 5px;}
        header .topbar ul:nth-child(1) li:nth-child(1) {border-right: 1px solid var(--_c-gray-400); padding-right: 10px;}
		header nav {padding-block: 10px;}
		header nav .menu-bar {display: flex; align-items: center; justify-content: space-between; gap: 20px; padding-block: 20px;}
        header nav .menu-bar form {position: relative; width: 370px;}
        header nav .menu-bar form input {width: 100%; height: 51px; border: 1px solid var(--_c-border-200); border-radius: 30px; padding-inline: 10px;}
        header nav .menu-bar form button {position: absolute; top: 14px; right: 14px;}
        header nav .menu-bar form button:hover img {filter: var(--fl-secondary);}
        header nav .menu-bar ul {display: flex; align-items: center; gap: 20px;}
		header nav .menu-bar li {list-style:none; list-style-position: inside;}
        header nav .menu-bar li a {display: flex; align-items: center; cursor: pointer;text-decoration:none}
        header nav .menu-bar li svg {fill: var(--c-primary);}
        header nav .menu-bar li:hover svg {fill: var(--c-secondary);}
        header nav .menu-bar li div {margin-left: 10px;}
        header nav .menu-bar li div * {display: block; color: var(--c-tertiary);}
        header nav .menu-bar li div :first-child {font-size: var(--fs-sm, 18px); font-weight: 600;}
        header nav .menu-bar li div :nth-child(2) {font-size: var(--fs-xs, 14px);}
        header nav .menu-links .wrapper {display: flex; align-items: center; justify-content: space-between;}
        header nav .menu-links #nav-toggle[data-hidden="true"] {display: none; height: 30px;border:none;}
        header nav .menu-links #nav-toggle svg {fill: var(--c-secondary);}
        header nav .nav-links {display: flex; align-items: center; gap: 15px;list-style:none;padding:0px; margin:0px;}
		header nav .nav-links > li:first-child > a {background-color: #f5f5f5; }
		header nav .nav-links > li > a {width: 100%; height: 54px; color: var(--c-tertiary); font-weight: 700; padding: 14px 20px; border-top: 1px solid transparent;text-decoration:none;display:flex;align-items:center;gap:5px;}
        header nav .nav-links > li:not(.mega-dropdown) > a:hover {border-top-color: var(--c-secondary); color: var(--c-secondary);}
        header nav .nav-links > li:not(.mega-dropdown) > a:hover:after {filter: var(--fl-secondary);}
        header nav .nav-links > li svg {margin-right: 5px;}
        header nav .nav-links .mega-dropdown:hover > a {background-color: var(--_c-dark-900); color: #fff;}
        header nav .nav-links .mega-dropdown-menu {width: 1166px; grid-template-columns: repeat(4, 1fr);}
        header nav .nav-links .mega-dropdown-menu li a {color: var(--c-tertiary); padding: 15px;}
        header nav .nav-links .mega-dropdown-menu img {margin: 5px 10px 0 0}
        header nav .nav-links .mega-dropdown:hover .mega-dropdown-menu {display: grid; padding-left:0px; list-style:none}
        header nav .nav-links :where(.mega-dropdown, .dropdown-link) {position: relative;}
        header nav .nav-links li [data-toggle="collapse"] {position: absolute; top: 100%; left: 0; background-color: #fff; border: 1px solid #00000026; border-radius: 0 0 5px 5px; display: none; z-index: 10; list-style:none; padding: 0;}
        header nav .nav-links li [data-toggle="collapse"] a {display: flex; align-items: center; width: 100%; text-wrap: nowrap;}
        header nav .nav-links li [data-toggle="collapse"] a:hover {background-color: var(--_c-light-100);}
        header nav .nav-links .dropdown-link-menu li a {width: 218px; color: var(--c-tertiary); padding: 10px;display: block; clear: both; font-weight: 400; color: #212529; text-align: inherit;
    text-decoration: none; white-space: nowrap; background-color: transparent; border: 0;}
        header nav .nav-links .dropdown-link:hover .dropdown-link-menu {display: block;}
        header nav .tel-btn {font-size: calc(var(--fs-md, 24px) - 2px); font-weight: 600; padding-block: 3.5px; text-align: center; color:white; text-decoration:none}
        header nav .tel-btn svg {margin-right: 5px;}
        header :where(.wrapper, .topbar *, .logo, .logo img, form, form *, .menu-bar li div *, .menu-bar li svg, .nav-links, .nav-links *, .tel-btn) {transition: var(--transition);}
		header nav form input.search-btn{border:none; position: absolute; top: 0; right: 0; height: 51px; width: 51px; background: url(https://www.emenacpackaging.com/wp-content/themes/emenac/assets/img/search.png) no-repeat center center; border:none;}
        @media only screen and (max-width: 1200px) {
            :root {
				overflow-x:hidden;
                --fs-xl: 32px;
                --fs-lg: 28px;
                --fs-md: 22px;
            }
            header nav .nav-links .mega-dropdown {width: 220px;}
            header nav .nav-links > li > a {padding-inline: 12px;border-top: 1px solid #fff;}
            header nav .nav-links .dropdown-link > a::after {right: 0;}
        }

        @media only screen and (max-width: 991px) {
            :root {
				overflow-x:hidden;
                --fs-xl: 30px;
                --fs-lg: 26px;
                --fs-md: 20px;
            }
            header nav .menu-bar {gap: 10px;}
            header nav .menu-bar .logo img {width: 120px; height: auto;}
            header nav .menu-bar form {max-width: 270px; margin-inline: 10px auto;}
            header nav .menu-links #nav-toggle[data-hidden="true"] {display: block;}
            header nav .menu-links {position: relative; background-color: var(--_c-gray-100);}
            header nav .menu-links .wrapper {align-items: center; padding-block: 7px; margin-bottom:0px;}
            header nav .nav-links {width: 100%; height: fit-content; display: block; background-color: var(--_c-gray-100); padding-top: 15px;}
            header nav .nav-links {display: none;} 
            header nav .nav-links .mega-dropdown {width: auto;}
            header nav .nav-links li [data-toggle="collapse"] {position: unset; width: auto;}
            header nav .nav-links .dropdown-link-menu li a {width: 100%;}
            header nav .nav-links .mega-dropdown-menu {grid-template-columns: repeat(3, 1fr);}
            header nav .nav-links .dropdown-link > a::after {right: unset;}
        }

        @media only screen and (max-width: 767px) {
			:root {
				
				overflow-x:hidden;
                --fs-xl: 28px;
                --fs-lg: 24px;
                --fs-md: 20px;
            }
		.sticky-bar ul > li:first-of-type {display: none;}
			header nav .tel-btn{height:35px;}
            header nav .menu-bar {flex-wrap: wrap; justify-content: center; gap: 15px 0;}
            header nav .menu-bar .logo {width: 50%; text-align: center;}
            header nav .menu-bar .logo img {width: 150px; height: auto;}
            header nav .menu-bar form {margin: 0;}
        }

        @media only screen and (max-width: 575px) {
			.categories{display:none;}
			:root {
				overflow-x:hidden;
                --fs-xl: 26px;
                --fs-lg: 22px;
                --fs-sm: 16px;
            }
			.sticky-bar {padding-block: 10px;}
			.sticky-bar .logo {display: none;}
			.sticky-bar .wrapper {gap: 15px;}
			.sticky-bar ul {width: fit-content; padding: 0;}
            header nav .menu-bar .logo {width: 100%;}
            header nav .menu-bar .logo > a {margin-inline: auto;text-align:-webkit-center;}
            header nav .nav-links .mega-dropdown:hover .mega-dropdown-menu {grid-template-columns: repeat(2, 1fr);}
			.sticky-bar .tel-btn {font-size: 20px;}
        }

        @media only screen and (max-width: 475px) {
			:root {
				overflow-x:hidden;
                --fs-xl: 24px;
                --fs-md: 18px;
                --fs-xs: 13px;
            }
            header .topbar .wrapper {justify-content: center;}
            header .topbar ul:nth-child(2) {display: none;}
            header nav .nav-links .mega-dropdown:hover .mega-dropdown-menu {grid-template-columns: 1fr;}
			.sticky-bar .tel-btn {font-size: 18px;}
        }
