

@font-face {
    font-family: 'Quicksand';
    font-family: 400 700;
    src: url(../../assets/fonts/Quicksand/Quicksand-VariableFont_wght.ttf);
	font-display: block;
	font-style: normal;
	font-weight: 400 700;	  
}

/* ? Source-Sans-Pro (400, 600, 700) ? */
@font-face {
    font-family: 'Source-Sans-Pro';
    src: url(../../assets/fonts/Source-Sans-Pro/SourceSans3-VariableFont_wght.ttf);
	 font-weight: normal;
	font-display: block;
    font-style: normal;
}

.quote-btn {position: fixed; top: 64%; right: -40px; transform: rotate(270deg); z-index: 100;}
.quote-btn a {display: block; padding: 14px 22px; border-radius: 5px;}
/* TOP BAR */
.th_top-bar {background-color: var(--clr-white); height: 34px; --_clr-grey-dk: #424242;}
.th_top-bar .th_bar-links {display: flex; align-items: center; justify-content: space-between;}
.th_top-bar ul {display: inline-flex; align-items: center; padding-block: 8px;}
.th_top-bar ul:nth-child(1) svg {width: 16px; margin-right: 5px; fill: var(--clr-grey-dk); transition: var(--transition);}
.th_top-bar ul:nth-child(1) li {padding-inline: 10px;}
.th_top-bar ul:nth-child(1) li:first-child {border-right: 1px solid var(--clr-grey-dk);}
.th_top-bar ul:nth-child(1) a {display: flex; align-items: center; color: var(--_clr-grey-dk)!important; transition: var(--transition);}
.th_top-bar ul:nth-child(2) svg {width: 16px; height: 16px; fill: var(--_clr-grey-dk); transition: var(--transition);}
.th_top-bar ul:nth-child(2) li {padding-inline: 6px;}
.th_top-bar ul:nth-child(1) a:hover {color: var(--clr-red);}
.th_top-bar ul:nth-child(1) a:hover > svg {fill: var(--clr-red);}
.th_top-bar ul:nth-child(2) a:hover > svg {fill: var(--clr-red); transform: scale(1.15);}
.ul.pagination.loop-pagination { display:flex; }

/* Nav BAR */
.th_navbar {position: sticky; top: 0; z-index: 100; background: #fff;}
.th_navbar .wrapper {display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; padding: 20px 0;}
.th_navbar .th_logo img {width: 170px; transition: var(--transition);}
.th_navbar .th_btn {display: flex; align-items: center; margin-inline: auto 48px;}
.th_navbar .th_btn li {padding-right: 20px; transition: var(--transition);}
.th_navbar .th_btn li:last-child {padding: 0;}
.th_navbar .th_btn a {display: flex; align-items: center; gap:5px}
.th_navbar .th_btn a div > * {display: block}
.th_navbar .th_btn a strong {font-size: var(--fs-18); font-weight: var(--fw-600); transition: var(--transition);}
.th_navbar .th_btn a span {font-size: var(--fs-14); margin-top: 5px; transition: var(--transition);}
.th_navbar .th_btn a:hover > svg {fill: var(--clr-red);}
.th_navbar .th_btn svg {width: 40px; height: 40px; margin-right: 8px; fill: var(--clr-blue-dk); transition: var(--transition);}
.th_navbar .th_contact-btn {display: flex; align-items: center; font-weight:700; font-size: var(--fs-24); color: #fff; border-radius: 5px; padding: 12px;} 
.th_navbar .th_contact-btn svg {width: 22px; height: 22px; margin-right: 8px; padding-right: 8px; fill: #fff; border-right: 1px solid #fff;}

/* Nav BAR menu */
.th_nav .th_nav-links {padding-bottom: 10px; background-color: #fff; z-index:10; position: relative; display: flex; align-items: center; justify-content: space-between;}
.th_nav .th_nav-links button {display: none; background: none; border: none; cursor: pointer;}
.th_nav .th_nav-links button svg {width: 30px; height: 30px; fill: var(--clr-red);}
.th_nav .th_nav-links .th_links {display: inline-flex; align-items: center; justify-content: center;}
.th_nav .th_nav-links li svg {width: 8px; height: 8px; margin-left: 4px; fill: var(--clr-black);}
.th_nav .th_nav-links .th_dropdown-btn > li > a svg {width: 24px; height: 24px; margin: 0 10px 0 0;}
.th_nav .th_nav-links .th_dropdown-btn > li > a {background-color: var(--clr-white); padding: 15px 26px; transition: var(--transition); font-size: 16px; display: flex; align-items: center;}
.th_nav .th_nav-links .menu-item {position: relative;}
.th_nav .th_nav-links .menu-item a {display: flex; align-items: center; padding: 15px 25px; font-weight: var(--fw-700); font-size: 16px; border-top: 1px solid transparent}
.th_nav .th_nav-links .menu-item:has(.dropdown-menu):after {position: absolute; top: 20px; right: 10px; width: 10px; height: 10px; background: no-repeat center/cover url('https://emenacpackaging.ca/wp-content/themes/epca_new/assets/images/icons/caret-down-fill.svg'); filter: brightness(0); content: '';}
.th_nav .th_nav-links .th_mega-dropdown-menu {display: none; grid-template-columns: repeat(4, 1fr); position: absolute; top: 55px; width: 100%; height: fit-content; background-color: #fff; border: 1px solid var(--clr-grey-lt);}
.th_nav .th_nav-links .th_mega-dropdown-menu img {width: 34px; height: 34px;}
.th_nav .th_nav-links .th_dropdown {position: relative;}
.th_nav .th_nav-links .dropdown-menu {display: none; position: absolute; top: 46px; width: 220px; height: fit-content; background-color: #fff; border: 1px solid var(--clr-grey-lt);}
.th_nav .th_nav-links .dropdown-menu a {font-weight: var(--fw-600); padding: 15px; transition: var(--transition);}
.th_nav .th_nav-links .th_mega-dropdown-menu a {display: flex; align-items: center; padding: 15px 25px;}
.th_nav .th_search-bar {position: relative; transition: var(--transition);}
.th_nav .th_search-bar input[type="search"] {width: 100%; height: 51px; border: 1px solid var(--clr-grey-lt);border-radius: 10px; padding-inline: 10px 60px; font-size: var(--fs-16); transition: var(--transition);}
.th_nav .th_search-bar input[type="submit"] {position: absolute; top: 10px; right: 13px; background: no-repeat center/cover transparent url(https://emenacpackaging.ca/wp-content/themes/epca_new/assets/images/icons/search.svg); border: none; height: 25px; width: 25px; cursor: pointer;}
.th_nav .th_nav-links .th_dropdown-btn > li > a:hover {background-color: #000; color: #fff; border: none;}
.th_nav .th_nav-links .th_dropdown-btn > li > a:hover > svg {fill: #fff;}
.th_nav .th_nav-links .th_mega-dropdown-menu a:hover,
.th_nav .th_nav-links .th_dropdown-menu a:hover, .dropdown-item:hover {background: var(--clr-white); border: none; color: var(--clr-black); padding-top: 15px;}
.th_nav .th_nav-links .menu-item:hover > a {color: var(--clr-red); border-top: 1px solid var(--clr-red);}
.th_nav .th_nav-links .menu-item:hover:has(.dropdown-menu):after {filter: var(--filter-red);}
.th_nav .th_nav-links .menu-item .dropdown-menu li a {border: none}
/* Media Quries */
@media only screen and (min-width: 991px) {
.th_nav .th_nav-links .menu-item:hover .dropdown-menu {display: block;}
.th_nav .th_nav-links .th_mega-dropdown:hover ul {display: grid;}
}
@media only screen and (max-width: 1400px) {
.th_nav .th_nav-links .th_links a {padding: 15px 18px;}
.th_nav .th_nav-links .menu-item:has(.dropdown-menu):after {right: 5px;}
}
@media only screen and (max-width: 1300px) {
.th_nav .th_nav-links .th_links a {padding: 15px 10px;}
.th_nav .th_nav-links .menu-item:has(.dropdown-menu):after {right: -3px;}
}
@media only screen and (max-width: 1200px) {
.container {padding-inline: var(--container-px);max-width: 1140px!important;}
.section__h2 {font-size: var(--fs-28);}
.th_nav .th_nav-links ul a {font-size: var(--fs-15); padding-inline: 12px;}
.th_nav .th_nav-links .th_links a {font-size: 15px}
.th_nav .th_nav-links .th_links :nth-child(n+5) {display: none;}
.th_nav .th_nav-links .menu-item:has(.dropdown-menu):after {right: 0; width: 8px; height: 8px;}
}
@media only screen and (max-width: 991px) {
.section__h2 {font-size: var(--fs-24);}
.th_nav {background-color: #f5f5f5;}
.th_nav .container {background-color: #fff;}
.th_navbar,
.th_nav .th_nav-links button {display: block;}
.th_nav {position: relative; z-index: 200;}
.th_navbar .th_logo img {width: 160px;}
.th_nav .th_nav-links .th_links {display: none; height: auto;}
.th_nav .th_nav-links .th_links li {padding-left: 12px;}
.th_nav .th_nav-links .th_links > li:first-child > a {margin-right: 0px;}
.th_nav .th_nav-links .th_links a {padding: 0; height: 54px; width: 100%; font-size: var(--fs-16);}
.th_nav .th_nav-links .th_dropdown-btn {display: none;}
.th_nav .th_nav-links .th_dropdown-menu {z-index:1;width: 100%; left: 0; z-index: 10;}
.th_nav .th_nav-links .th_mega-dropdown-menu {top: 95px; left: 0; right: 0; margin-inline: auto; z-index: 10;}
.th_nav .th_nav-links .th_mega-dropdown:hover > .th_mega-dropdown-menu {grid-template-columns: repeat(2, 1fr); position: unset;}
.th_nav .th_nav-links .th_dropdown-btn > li > a {height: 54px; padding: 0 15px;}
.th_navbar .th_btn li {padding-right: 10px;}
.th_navbar .th_btn a strong {font-size: var(--fs-16);}
.th_nav .th_nav-links .dropdown-menu {position: unset; width: 100%;}
.th_nav .th_nav-links .th_dropdown-btn > li > a {background-color: #fff;}
.quote-btn {right: -36px;}
.quote-btn a {padding: 10px 16px;}
.th_navbar .th_btn {margin-right: 8px;}
}
@media only screen and (max-width: 767px) {
.section__h2 {font-size: var(--fs-20);}
.th_navbar .th_logo img {width: 150px;}
.th_navbar .th_btn > li:last-of-type {display: none;}
.th_navbar .th_btn li {padding: 0;}
.th_navbar .th_contact-btn svg {display: none;}
}
@media only screen and (max-width: 575px) {
.section__h2 {font-size: var(--fs-18); margin-bottom: 15px;}
.section__p {font-size: var(--fs-15);}
.th_top-bar .th_bar-links {justify-content: center;}
.th_top-bar ul:nth-child(2) {display: none;}
.th_navbar .th_contact-btn {font-size: var(--fs-22)-2;}
.quote-btn {right: -34px;}
.quote-btn a {padding: 6px 12px;}
.th_navbar .th_contact svg ,.th_navbar .th_btn div{display: none;}
.th_navbar .th_logo img {width: 130px;}
.th_navbar .th_logo video {width: 150px;}
.th_nav .th_search-bar input[type="search"] {font-size: var(--fs-14); padding-inline: 8px;}

}