/* -- category menu :: v.: 0.01 r.: 14/05/25 @ pp */
/*
 * v. 0.01 @ pp (09/04/25): utworzenie pliku + zmiany RWD (SKCZDEV-795)
 */
#third-level-menu nav {position: relative;}
#third-level-menu nav div.container {position: relative; margin-bottom: 0; padding: 0; overflow: auto;}
.chrome #third-level-menu nav div.container, .android #third-level-menu nav div.container {position: static;}
nav.third-level {min-height: .9em; margin: 0 0 -1px;}
#header nav.third-level {background: none;}
nav.third-level ul {display: table; height: .9em; margin: auto; padding: .4em 0; list-style: none;}
/*nav.third-level ul.skip-links {position: absolute;}*/
#header nav.third-level ul {margin: 0;}
nav.third-level li {position: relative; display: table-cell; margin: 0; padding: 0; vertical-align: middle;}
#page-wrapper nav.third-level li:before {display: none;}
nav.third-level li a {display: block; margin: 0 1.1em; padding: .5em .3em; line-height: 1.2; font-size: .4rem; text-align: center; text-decoration: none; white-space: nowrap; text-transform: lowercase;}
nav.third-level li a img, nav.third-level li a img + span {display: inline-block; vertical-align: middle;}
nav.third-level li a img {max-height: 35px; max-width: 50px;}
nav.third-level li a::after {position: absolute; /*left: 2em;*/ bottom: 0; /*right: 2em;*/ height: 3px; content: '';}
nav.third-level li.active a {/*color: var(--ind-bg-color);*/ font-family: "Montserrat Lite Bold", Arial, sans-serif;}
nav.third-level.third li a {padding: .8em .5em; line-height: 1;}
body.biz nav.third-level li.active a {color: var(--biz-bg-color)}
nav.third-level span.nav {position: absolute; top: 0; z-index: 9; display: block; width: 15px; height: 100%; cursor: pointer; background-color: transparent;}
.desktop nav.third-level span.nav::after {position: relative; top: 33%; display: block; width: 14px; height: 22px; background: url(../../img/arrows.png?v2) no-repeat; cursor: pointer; content: '';}
nav.third-level span.nav.left {background-image: linear-gradient(to left, rgba(243, 243, 243, .1), rgba(255, 255, 255, 1));}
nav.third-level span.nav.left {left: 0; padding-right: 10px;}
.desktop nav.third-level span.nav.left::after {background-position: -77px 0;}
nav.third-level span.nav.right {background-image: linear-gradient(to right, rgba(243, 243, 243, .1), rgba(255, 255, 255, 1));}
nav.third-level span.nav.right {right: 0; padding-left: 10px; }
.desktop nav.third-level span.nav.right::after {background-position: -90px 0;}
nav.third-level span.nav.disabled {opacity: 0;}

nav.third-level li a::after {position: absolute; left: calc(3em - 100%); bottom: 0; width: calc(200% - 4em); height: 2px; visibility: hidden; content: '';}
nav.third-level li a::after {background-image: linear-gradient(to left, var(--ind-bg-color) 0%, var(--ind-bg-color) 50%, transparent 50%, transparent 50%, transparent 100%);}
nav.third-level li a::after {
	/* from left side, its mean first color(will be last) is color of needing class, then width, and then color of transparent, cause left half will be , but invisible */
	transition: all 0.3s ease-in-out 0s;
	transform: scaleX(0);
}

nav.third-level li a::after {bottom: 7px; left: calc(4.5em - 100%); width: calc(200% - 6em); height: 3px;}

nav.third-level li.active a::after {visibility: visible; transform: scaleX(1);}

body.sub.cats.contact nav.third-level li:nth-child(1) a::after, body.corpo.sub.cats nav.third-level li:nth-child(5) a::after {background: linear-gradient(to left, #e31818 0%, #e31818 50%, transparent 50%, transparent 50%, transparent 100%);}
body.sub.cats.contact nav.third-level li:nth-child(2) a::after {background: linear-gradient(to left, #9f1b1f 0%, #9f1b1f 50%, transparent 50%, transparent 50%, transparent 100%);}
body.sub.cats.contact nav.third-level li:nth-child(3) a::after {background: linear-gradient(to left, #70b23d 0%, #70b23d 50%, transparent 50%, transparent 50%, transparent 100%);}
body.sub.cats.contact nav.third-level li:nth-child(4) a::after {background: linear-gradient(to left, #0188cc 0%, #0188cc 50%, transparent 50%, transparent 50%, transparent 100%);}

body.ind nav.third-level li a::after, nav.third-level li.active a::after {background: linear-gradient(to left, var(--ind-bg-color) 0%, var(--ind-bg-color) 50%, transparent 50%, transparent 50%, transparent 100%);}
body.biz nav.third-level li a::after {background: linear-gradient(to left, #70b23d 0%, #70b23d 50%, transparent 50%, transparent 50%, transparent 100%);}

nav.third-level li:hover a::after {visibility: visible; transform: scaleX(1);}
.no-und-f nav.third-level li.active:first-child a {color: var(--def-links); font-family: "Montserrat Lite", Arial, sans-serif;}
.no-und-f nav.third-level li.active:first-child a::after {visibility: hidden; transform: scaleX(0);}
.no-und-f nav.third-level li.active:first-child:hover a::after {visibility: visible; transform: scaleX(1);}

@media only screen and (max-width: 1024px) {
	nav.third-level span.nav.right {
    	background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJod…IgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2dyYWQtdWNnZy1nZW5lcmF0ZWQpIiAvPgo8L3N2Zz4=);
    	background-image: linear-gradient(to right,transparent,rgba(0,0,0,.2));
	}
	nav.third-level span.nav.left {
    	background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJod…IgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2dyYWQtdWNnZy1nZW5lcmF0ZWQpIiAvPgo8L3N2Zz4=);
    	background-image: linear-gradient(to left,transparent,rgba(0,0,0,.2));
	}
	.desktop nav.third-level span.nav.left {
		background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIxMDAlIiB5Mj0iMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNmM2YzZjMiIHN0b3Atb3BhY2l0eT0iMC4xIi8+CiAgPC9saW5lYXJHcmFkaWVudD4KICA8cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2dyYWQtdWNnZy1nZW5lcmF0ZWQpIiAvPgo8L3N2Zz4=);
		background-image: linear-gradient(to left, rgba(243, 243, 243, .1), rgba(255, 255, 255, 1));
	}
	.desktop nav.third-level span.nav.right {
		background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIxMDAlIiB5Mj0iMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2YzZjNmMyIgc3RvcC1vcGFjaXR5PSIwLjEiLz4KICAgIDxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgPC9saW5lYXJHcmFkaWVudD4KICA8cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2dyYWQtdWNnZy1nZW5lcmF0ZWQpIiAvPgo8L3N2Zz4=);
		background-image: linear-gradient(to right, rgba(243, 243, 243, .1), rgba(255, 255, 255, 1));
	}
}