a,b,button,dd,div,dl,dt,form,h1,h2,h3,h4,h5,h6,input,input[type=submit],input[type=text],label,li,option,p,select,span,strong,table,td,textarea,th,ul,ol{margin:0;padding:0;border-spacing:0;border:0;outline:0;-webkit-tap-highlight-color:rgba(0,0,0,0)}
a,details summary{text-decoration:none;color:var(--link);transition:0.4s}
a svg{fill:var(--link);vertical-align:middle}
a:hover,details summary:hover{text-decoration:underline;color:var(--linkHover);cursor:pointer}
a:hover svg{fill:var(--linkHover)}
a[title]{position:relative}
label{display:block;color:var(--link);cursor:pointer;font-weight:normal;padding:4px}
label:hover{text-decoration:underline;color:var(--linkHover)}
p{line-height:135%}
small{display:block;font-size:1.4rem;margin-top:2px;font-weight:normal;line-height:1.4}
textarea{height:200px;min-height:150px;padding:var(--con8);line-height:1.4}
button{cursor:pointer;border-radius:var(--borderRadius);background-color:var(--link);vertical-align:middle;display:inline-block;font-weight:bold;padding:8px 12px;transition:.2s;width:max-content}
button,button *{color:white}
button svg{fill:white}
button:hover{background-color:var(--linkHover);box-shadow:var(--materialShadow)}
hr{margin:var(--gap) 0;border-top:1px solid var(--lighterGrey)}
img{display:block}
svg{display:inline-block;vertical-align:middle;fill:var(--darkGrey)}
h1,h2,h3,h4,h5,h6{display:block;line-height:1.2;margin-bottom:var(--gapSmall);word-wrap:break-word;white-space:normal;text-wrap:pretty}
h2{font-size:calc(var(--fontSizeXXLarge) - 0.2rem)}
h1,h2{font-weight:500}
h3{font-size:calc(var(--fontSizeXLarge) + 0.2rem)}
h4{font-size:calc(var(--fontSizeXLarge) - 0.45rem);margin-bottom:calc(var(--gapSmall) - 6px)}
h5{font-size:var(--fontSizeLarge)}
h6{font-size:var(--fontSize)}
ul,ol{list-style-position:inside}

header{display:flex;position:fixed;top:0;width:100%;flex-direction:row;height:var(--headerHeight);background:var(--headerBgColor);justify-content:flex-end;transition:0.4s;z-index:var(--zIndexLevel40);
	ul{display:flex;list-style-type:none;align-items:center}
	ul li{position:relative}
	ul li svg{display:inline-block;width:22px;height:22px}
	ul .headerMainAct > a svg{display:none}
	:is(ul li.navSearch,ul li.allFeaturesLink2>a){padding:15px 16px 14px 16px}
	ul li.navFlag a{padding:14px 16px 15px 16px}
	a{display:block;color:var(--headerLink);text-align:center;padding:15px 16px;text-decoration:none;font-weight:bold;white-space:nowrap}
	:is(a:hover,a.active){background:var(--quaternary);text-decoration:none;color:var(--navLinkColor)}
	a svg{fill:#674825}
	:is(a:hover svg,a.active svg){fill:var(--navLinkColor)}
	a .arrowDown{height:12px;width:12px;margin-left:8px}
	:is(a:hover,a.active){background:var(--quaternary);text-decoration:none;color:var(--navLinkColor)}
	a svg{fill:#674825}
	is(a:hover svg,a.active svg){fill:var(--navLinkColor)}
	.arrowDown{height:12px;width:12px;margin-left:8px}
	:is(li.navSearch>a, li.allFeaturesLink2>a){padding:15px 16px 14px 16px}
	li.navFlag a{padding:14px 16px 15px 16px}
}

:is(.mainActivity,.mainActivity1) svg.mAct1,.mainActivity5 svg.mAct5,.mainActivity10 svg.mAct10,.mainActivity12 svg.mAct12,.mainActivity15 svg.mAct15,.mainActivity20 svg.mAct20{display:block}

.navFlag svg{height:20px;width:26px;vertical-align:middle;border:1px solid var(--quaternary)}
.navAddAd {margin-right:12px}
.navAddAd .actionButton{font-size:15px}
.headerSubmenu{display:none;position:absolute;top:100%;right:0;width:auto;z-index:var(--zIndexLevel40);background:var(--quaternary)}
.headerSubmenu a{color:var(--navLinkColor);padding:16px 18px;text-decoration:none;display:block;text-align:left;font-weight:normal} 
.headerSubmenu li{margin:0}
.headerSubmenu a:hover,.headerSubmenu a.selected,.allFeaturesDiv a:hover, .mainActivity1 .mainAct1, .mainActivity5 .mainAct5, .mainActivity10 .mainAct10, .mainActivity12 .mainAct12, .mainActivity15 .mainAct15, .mainActivity20 .mainAct20{color:#fff;background:var(--primary)}

nav{display:flex;position:fixed;flex-direction:column;justify-content:space-between;list-style:none;background:var(--navBgColor);width:var(--menuWidthClosed);overflow:hidden;padding:calc(var(--headerHeight) + 8px) 0 0 8px;height:100%;text-align:left;transition:.4s ease-out;box-sizing:border-box;
	ul{list-style:none;display:flex;flex-direction:column;vertical-align:top;width:100%;align-self:flex-start;height:fit-content}
	ul li{display:block;vertical-align:top;width:100%;order:100}
	ul li.active a svg{fill:white}
	ul li.active a:not(small){font-weight:bold}
	a{font-size:1.5rem;color:var(--navLinkColor);white-space:nowrap;padding:14px 12px;display:flex;flex-direction:row;align-items:center;margin:2px 0 0 0;border-radius:100px 0 0 100px}
	a:has(small){padding:8px 12px}
	a:hover,.menuUserAccount a{text-decoration:none;color:var(--navLinkHoverColor);font-weight:bold}
	a:hover svg{fill:var(--navLinkHoverColor)}nav a:has(small){padding:8px 12px}
	a div{font-size:1.5rem;letter-spacing:.3px;display:block;margin:0 0 0 18px;transition:.8s;transition-delay:.15s;transition:background 0s,color 0s,font-weight 0s;color:var(--navLinkColor)}
	a div span{color:inherit;font-weight:inherit}
	a div small{display:block;white-space:nowrap;font-size:1.1rem;color:var(--navLinkColor);margin:1px 0 0 0;font-weight:normal;opacity:0.85}
	a:hover div small{opacity:1}
	a div small:hover{text-decoration:none!important}
	a svg{fill:var(--navLinkColor);display:block;width:20px;height:20px;margin:0;vertical-align:middle;flex-shrink:0}
	:is(.navSubmenu a,a div){overflow:hidden;text-overflow:ellipsis;box-sizing:content-box}
}
nav li.current a,nav li a:not(.navSubmenu a):hover,.bottomSubmenu,.bottomDropdown.active{background:var(--quaternary)}
nav li.current a{font-weight:bold}
.navSubmenu{width:auto;max-height:0;opacity:0;overflow:hidden}
nav li.current .navSubmenu{background:var(--quaternary);margin:0 0 0 25px;border-radius:0 0 0 8px}
nav:hover li.current .navSubmenu, nav.navOpen li.current .navSubmenu{opacity:1;max-height:none;margin-bottom:6px}
.navSubmenu a{font-size:1.4rem;padding:8px 8px 8px 16px;display:block;font-weight:normal !important}
.navSubmenu a:hover{background:rgba(255,255,255,0.2);color:white;font-weight:bold;border-radius:0}
.menuBottom{align-self:flex-end;margin-bottom:12px}
.menuMiddle{height:-webkit-fill-available}
.menuRegistration a{background:#cc6500;font-weight:bold;border:2px solid white;border-right:none}
.menuMainActivity {border-top:3px solid var(--quaternary);display:none;
	li {
		b {color:white;padding:18px 0 12px 18px;display:block}
	}
}
nav:hover{width:var(--menuWidthOpen)}
nav:hover div{opacity:1}
nav:hover .navSubmenu, nav.navOpen .navSubmenu{height:auto;opacity:1}

li.menuAccount a{background:var(--tertiary);padding:6px 14px 6px 10px;border-radius:40px;margin-right:8px}
li.menuAccount a:hover{background:var(--quaternary)}
.menuUserAccount {min-width:fit-content}
.menuUserAccount a{padding:8px 8px 8px 12px}
.menuUserAccountName {margin:0}
.menuUserAccount svg {margin:0 19px 0 0}
.menuUserAccount .logo-circle {margin:0 14px 0 0}


.sidebar{height:100vh;flex-shrink:0;z-index:var(--zIndexLevel60)}

.mainActivity1 .sidebar a.mainAct1,.mainActivity5 .sidebar a.mainAct5,.mainActivity10 .sidebar a.mainAct10,.mainActivity12 .sidebar a.mainAct12,.mainActivity15 .sidebar a.mainAct15,.mainActivity20 .sidebar a.mainAct20 {background:var(--quaternary)}

.logo-circle{border-radius:100%;display:inline-block;height:28px;width:28px;vertical-align:middle;background-color:#fff;background-position:center;background-size:cover;background-repeat:no-repeat;overflow:hidden}

@keyframes blink{0%{fill:#FF0000} 50%{fill:var(--navLinkColor)} 100%{fill:#FF0000}}
.menuMessages.newMessage svg {
	&.msgSvg{animation:blink 1.2s infinite;box-shadow:2px 2px 2px rgba(0,0,0,0.2)}
	&.newMsg0{animation:none!important;box-shadow:none!important}
}

main{display:flex;width:100%;min-height:100%}
.contentMain, .contentWrapper{display:flex;flex-grow:1}
.contentMain{max-width:calc(100% - var(--menuWidthClosed));flex-direction:column;padding-top:var(--headerHeight)}
.contentWrapper{flex-direction:row}
.content{flex-grow:1;padding:calc(var(--gap) - 5px) var(--gap);width:100%;line-height:125%;overflow-x:hidden;overflow-y:clip;container-type:inline-size;container-name:content}


logo-part{display:block;position:fixed;top:0;left:0;z-index:101;transition:0.4s;
a{display:flex;align-items:center;width:var(--menuWidthOpen);padding:8px 10px 8px 12px}
svg{display:block;width:var(--logoSizeDesktop);height:var(--logoSizeDesktop);fill:var(--logoColor);transition:0.3s}
svg.logoTitle{height:30px;width:103px;margin-left:20px} /* Ratio 3,44 */
.en svg.logoTitle{height:36px;width:268px} /* Ratio 7,44 */
a:hover svg{fill:var(--logoColorHover)}
}

.mainActivity1{
.menuCalcs{order:40}
.menuDetApp{order:50}
.menuRecApp{order:60}
.menuStock{order:70}
.menuOptiTimb{order:80}
.menuMobileApps{order:90}
.menuForms{order:100}
.menuCMR{order:105}
.menuCutPlans{order:150}
.menuVideoShowroom{order:160}
.menuFlyers{order:170}
}

.mainActivity5{
.menuOptiTimb{order:40}
.menuCalcs{order:50}
.menuDetApp{order:60}
.menuRecApp{order:70}
.menuStock{order:80}
.menuCMR{order:85}
.menuMobileApps{order:90}
.menuForms{order:90}
.menuVideoShowroom{order:120}
.menuFlyers{order:130}
.menuCutPlans{order:150}
}

.mainActivity10{
.menuCutPlans{order:40}
.menuCalcs{order:50}
.menuStock{order:80}
.menuForms{order:90}
.menuOptiTimb{order:110}
.menuDetApp{order:120}
.menuRecApp{order:130}
.menuVideoShowroom{order:140}
.menuFlyers{order:150}
.menuMobileApps{order:160}
.menuCMR{order:170}
}

.mainActivity12{
.menuCalcs{order:40}
.menuDetApp{order:50}
.menuRecApp{order:60}
.menuStock{order:70}
.menuOptiTimb{order:80}
.menuForms{order:90}
.menuCMR{order:110}
.menuMobileApps{order:140}
.menuCutPlans{order:150}
.menuVideoShowroom{order:160}
.menuFlyers{order:170}
}


.mainActivity15{
.menuCMR{order:50}
.menuCalcs{order:60}
.menuDetApp{order:70}
.menuRecApp{order:80}
.menuStock{order:90}
.menuOptiTimb{order:100}
.menuForms{order:110}
.menuMobileApps{order:120}
.menuCutPlans{order:140}
.menuVideoShowroom{order:150}
.menuFlyers{order:160}
}

.mainActivity20{
.menuVideoShowroom{order:60}
.menuFlyers{order:70}
.menuOptiTimb{order:80}
.menuCutPlans{order:90}
.menuMobileApps{order:100}
.menuRecApp{order:110}
.menuDetApp{order:120}
.menuCalcs{order:130}
.menuStock{order:140}
.menuForms{order:150}
.menuCMR{order:200}
}

.menuClassText{order:10}
.menuClassTimb{order:20}
.menuArticles{order:30}
.menuDictionary{order:300}
.menuWoodSpecies{order:310}

.menuTop{display:flex}
.menuTop>li, .menuLogout{display:none}

@media screen and (min-height:1300px) and (min-width:1025px){
.menuTop>li{display:block}
}
@media screen and (min-height:1100px) and (min-width:1199.9px){
.menuTop>li:nth-child(-n+13), .menuLogout{display:block}
}
@media screen and (min-height:1000px) and (max-height:1099.9px) and (min-width:1025px){
.menuTop>li:nth-child(-n+11), .menuLogout{display:block}
}
@media screen and (min-height:900px) and (max-height:999.9px) and (min-width:1025px){
.menuTop>li:nth-child(-n+10){display:block}
}
@media screen and (min-height:800px) and (max-height:899.9px) and (min-width:1025px){
.menuTop>li:nth-child(-n+8){display:block}
}
@media screen and (min-height:700px) and (max-height:799.9px) and (min-width:1025px){
.menuTop>li:nth-child(-n+6){display:block}
}
@media screen and (min-height:600px) and (max-height:699.9px) and (min-width:1025px){
.menuTop>li:nth-child(-n+5){display:block}
}
@media screen and (min-height:500px) and (max-height:599px) and (min-width:1025px){
.menuTop>li:nth-child(-n+4){display:block}
}
@media screen and (max-height:499px) and (min-width:1025px){
.menuTop>li:nth-child(-n+2){display:block}
}



/* H1 & TITLE BLOCK with H1 */

h1, h1 b{font-size:var(--fontSizeXXLarge)}
.content h1{margin:0 16px var(--gapSmall) 0}
h1>span{font-size:var(--fontSizeLarge);color:var(--darkGrey);white-space:nowrap;margin-left:6px}
h1>span:empty{display:none}
h1 p,h1 p *{font-size:var(--fontSize);color:var(--darkGrey);line-height:1.2}

.titleBlock{flex-wrap:nowrap;display:flex;margin:var(--gapSmall) var(--gap) 0 var(--gap);
	&.titleBlockWithAddButton{align-items:flex-end}
	&.titleBlockWithAddButton a.addButton{margin:0;width:auto}
	&.titleInContent{margin:0 0 var(--gapSmall) 0}
	&.titleBlockWithRightItem{align-items:flex-end;
		.titleBlockRightItem{display:flex;align-items:center;gap:var(--gapSmall);margin:0;
			a:not(.actionButton){color:var(--quaternary);border-bottom:3px solid transparent;padding:12px 6px;font-weight:bold}
			a:not(.actionButton):hover{text-decoration:none;color:var(--primary)}
			a:not(.actionButton) svg{width:18px;height:18px;margin-right:6px;fill:var(--quaternary)}
			a.current:not(.actionButton){border-bottom:3px solid var(--quaternary);color:var(--primary);font-weight:bold}
			a.current svg{fill:var(--primary)}
			select{max-width:180px}
		}
	}

	&.titleVerticalCentered{align-items:center;
		.titleBlockRightItem{margin:auto 0}
	}

	h1,h2{flex-grow:1;margin:0}
	h1 svg{fill:var(--darkGrey);margin:-3px 0 0 8px}
	h1 svg.iconInline{margin:0}
}


/* SUB-MENU */

sub-menu{display:flex;flex-wrap:wrap;width:auto;align-items:center;justify-content:space-between;margin:var(--gapSmall) var(--gap) 0 var(--gap);z-index:39;transition:0.3s;

	.logoPart{display:flex;align-items:center;font-weight:bold;color:var(--darkGrey);line-height:0.9;
		svg{height:48px;width:48px;margin:auto 8px auto 0}
		> div{font-size:var(--fontSizeXLarge);font-weight:bold;color:var(--darkGrey);white-space:nowrap}
		> div p{font-size:var(--fontSizeSmall);font-weight:normal;color:var(--darkGrey);margin:0}
	}

	> ul{display:flex;flex-wrap:wrap;align-items:center;flex-direction:row;width:max-content;margin:auto 0 auto auto;justify-content:normal;list-style:none;align-self:flex-end}
	> ul > li{position:relative;display:flex;margin:0 0 0 3px}
	a:not(.addButton){display:flex;color:var(--quaternary);padding:14px;align-items:center;font-weight:bold;transition:0s;border-bottom:3px solid transparent}
	a:hover:not(.addButton){text-decoration:none;color:var(--primary)}
	li.current > a{color:var(--primary);border-bottom:3px solid var(--quaternary)}
	li.current > a.active{border-bottom:3px solid transparent}
	a.active{background:var(--tertiary);text-decoration:none;color:var(--primary)}
	a svg{display:inline-block;width:18px;height:18px;margin-right:3px;vertical-align:middle;fill:var(--quaternary)}
	a svg.arrowDown{width:12px;height:12px;margin:auto 0 auto 6px}
	a.info{padding:14px 6px}
	:is(a:hover svg, a.active svg){fill:var(--primary)}
	form{display:flex;justify-content:center;align-content:center;align-items:center}
	input{max-width:160px;padding-top:4px !important;padding-bottom:4px !important}
}

sub-menu input, sub-menu select{margin:auto 8px;max-width:160px}
sub-menu:empty{display:none}

sub-menu .sub-menuSubmenu{display:none;position:absolute;top:100%;background:var(--tertiary);list-style:none;text-align:left;
	&.active{display:block}
	a{display:block;white-space:nowrap;font-weight:bold;text-align:left;border-bottom:1px solid var(--secondary)}
	li:last-child a{border-bottom:none}
	a:hover{color:var(--lightBrown);background:var(--quaternary)}
	a:hover svg{fill:var(--lightBrown)}
	a svg{margin-right:10px;width:16px;height:16px}
}


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

.content {padding:calc(var(--gap) - 5px) var(--gapSmall)}

h1 p{font-weight:normal;font-size:16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

sub-menu{position:fixed;left:0;right:0;bottom:0;margin:0;overflow-x:auto;justify-content:flex-start;background:var(--navBgColor);padding:0 3px 0 0;width:auto;align-items: stretch;scrollbar-width: none;-ms-overflow-style:none;
	.logoPart{display:none}
	> ul{display:flex;align-items:stretch;flex-wrap:nowrap;margin:0;align-self:auto}
	> ul > li{position:relative;display:flex;margin:0}
	> ul > li > a:not(.addButton) {display:flex;justify-content:center;font-size:var(--fontSizeSmall);color:var(--lightBrown);text-align:center;white-space:nowrap;overflow-x:hidden;text-overflow:ellipsis;max-width:150px;box-sizing:content-box;margin:0;padding: 16px 24px; gap: 8px}
	a.addButton{border-radius:0;padding: 16px 24px;font-size: var(--fontSizeSmall);}
	:is(a,label){color:var(--subnavBgColor)}
	a:not(.addButton) svg:not(.sub-menuDropdown){display:block;width:16px;height:16px;fill:var(--subnavBgColor)}
	a:hover:not(.addButton,.active){color:var(--lightBrown)}
	a:hover:not(.addButton,.active) svg{fill:var(--lightBrown)}
	li.current > a{background:var(--quaternary);border:none;color:var(--lightBrown)}
	li > a.active, li.current > a.active{border:none;color:var(--primary); background:var(--tertiary)}
	li > a.active svg, li.current > a.active svg{fill:var(--primary)!important}
	a svg.iconInline{width:18px;height:18px}

	label:has(input[type="checkbox"], input[type="radio"]){margin:auto}

	.sub-menuSubmenu{padding:0;left:0;right:0;top:auto;position:fixed;flex-wrap:wrap;gap:0;border-top:1px solid var(--primary); box-shadow: 0 0 4px rgba(0,0,0,0.5);
		li{display:inline-grid;width:clamp(300px, 32vw, 400px);vertical-align:top;}
		a{max-width:none;width:100%;color:var(--primary);font-size:var(--fontSize);font-weight:bold;text-align:left;justify-content:flex-start;padding:18px;white-space:nowrap;display:flex;white-space:wrap;overflow-x:hidden;text-overflow:ellipsis;}
		a svg{fill:var(--primary)!important;width:24px;height:24px;}
	}
}

}


@media screen and (max-width:768px){
sub-menu {
	.sub-menuSubmenu li{width:100%;display:block;text-align:left}
	.sub-menuSubmenu a{padding:18px}
}
}

.dropdownTrigger{position:relative}
.dropdownMenu{position:absolute;top:100%;background:var(--primary)}




@media screen and (min-width:1920px){
.content{padding:var(--gapSmall) var(--gap)}
.contentMain{max-width:calc(2560px - var(--menuWidthOpen) - 32px);margin:0 auto}
.sidebar, nav{width:var(--menuWidthOpen)}
nav{padding:calc( var(--headerHeight) + 24px) 0 0 8px;
	a{padding:14px 16px}
	a:has(small){padding:8px 16px}
	a div{opacity:1}
	.menuUserAccount a{padding:8px 12px 8px 16px}
	.logo-circle {margin:0}
}
nav li.current .navSubmenu{max-height:none;opacity:1;margin-bottom:6px}
logo-part a{padding:17px 8px;justify-content:center}
logo-part a:hover svg{filter:drop-shadow(4px 4px 2px rgba(0, 0, 0, 0.4))}
logo-part svg{width:var(--logoSizeLargeDesktop);height:var(--logoSizeLargeDesktop)}
.en svg.logoTitle{height:21px;width:157px} /* Ratio 7,44 */
svg.logoTitle{margin-left:12px;height:28px;width:96px;margin-left:12px} /* Ratio 3,44 */

}


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

.titleBlock{margin-inline:24px}
svg.logoTitle{fill:var(--navBgColor)}
svg.logoTitle.logoTitleFill, logo-part svg.logoTitle.navOpen{fill:var(--logoColor)}
logo-part svg{width:var(--logoSizeMobile);height:var(--logoSizeMobile)}
svg.logoTitle{height:28px;width:96px} /* Ratio 3,44 */
.en svg.logoTitle{height:21px;width:157px} /* Ratio 7,44 */
.sidebar, nav{width:var(--menuWidthClosed);transition:.25s ease-out}
.sidebar:hover, .sidebar:hover nav{width:var(--menuWidthOpen)}

}


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

.sidebar, nav{width:var(--menuWidthClosed);position:fixed}
header li.navSearch{display:none}
.sidebar:hover, .sidebar:hover nav{width:var(--menuWidthOpen)}
.contentMain{margin-left:var(--menuWidthClosed)}

}


@media screen and (min-width:1025px){
header ul li.mobileNavMenu{display:none}
}


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

*{font-size:var(--fontSize);font-family:Montserrat, Arial, Verdana, Tahoma, sans-serif}
html{height:auto}
nav .menuTop>li{display:block}
.contentMain{margin:0;padding-top:var(--headerMobileHeight);overflow-x:hidden;max-width:none}
.contentWrapper{flex-direction:column}
.content{width:100%;order:2}
.content h1{margin:0;text-wrap:pretty;font-weight:bold}
.contentPart {padding-inline:var(--gapLarge)}
.titleBlock{display:block !important;margin-left:var(--gapSmall);margin-right:var(--gapSmall);
	h1{margin-bottom:24px;font-weight:bold}
	&.titleBlockWithAddButton a.addButton{margin:0 auto;width:fit-content}
	&.titleBlockWithRightItem .titleBlockRightItem{overflow-x:auto;white-space:nowrap;margin-bottom:var(--gapSmall);scrollbar-width: none; -ms-overflow-style: none;
		select{width:auto;max-width:none;margin:0 auto}
		a,select {font-size:calc(var(--fontSizeSmall) + 0.2rem)}
	}
	&.titleBlockWithRightItem .titleBlockRightItem::-webkit-scrollbar {display: none}
}

header{z-index:var(--zIndexLevel100);height:var(--headerMobileHeight);background:var(--navBgColor);transition:border 0s, top 0.4s;border-bottom:3px solid transparent}
header a:has(svg){padding:14px 24px 15px 24px}
header a svg, svg.logoTitle{fill:var(--logoColor)}
header ul{margin:0}
header ul li:not(.mobileNavMenu),nav,.sidebar,.allFeaturesDiv,.menuMiddle{display:none}
logo-part a{height:var(--headerMobileHeight);width:auto}
svg.logoTitle{margin-left:16px}

.showMobileMenu{
	.sidebar,nav{width:100%!important;background:var(--navBgColor)}
	.sidebar{display:block;height:80%;padding-top:var(--headerMobileHeight)}
	header{border-bottom:3px solid var(--quaternary)}
	nav{display:flex;position:absolute;padding:0 0 8px 0;left:0;right:0;max-width:none;overflow-y:auto;-webkit-overflow-scrolling:touch;justify-content:flex-start}
	nav a{margin:0;padding:16px 12px 16px 24px}
	a:has(small){padding:12px 16px}
	nav a svg{width:24px;height:24px}
	nav a div{font-size:1.8rem}
	nav a small{font-size:1.5rem}
	nav ul{flex-direction:row;flex-wrap:wrap}
	nav ul.menuBottom{order:1}
	nav ul.menuBottom .menuRegistration a{border:none}
	nav ul.menuTop{order:2}
	nav ul.menuMainActivity{order:10;display:flex}
	nav li{width:50%;margin:0}
	nav li a.current,nav ul.current.navSubmenu li a{width:100%;padding:18px 16px}
	nav li.current .navSubmenu{display:block;opacity:1;max-height:none;margin:0;width:100%}
	nav li.current .navSubmenu li{margin-left:38px;width:100%}
	nav li.current .navSubmenu li a{font-size:1.7rem;padding:14px 16px 14px 24px;width:100%}
	nav:hover li.current .navSubmenu,nav.navOpen li.current .navSubmenu{margin-bottom:0}
	nav::-webkit-scrollbar{width:12px}
	nav::-webkit-scrollbar-track{background:var(--quaternary)}
	nav::-webkit-scrollbar-thumb{background:var(--secondary);border-radius:12px;border:none}
	nav::-webkit-scrollbar-thumb:hover{background:#bb0000}
}

.menuBottom{border-bottom:3px solid var(--quaternary);font-weight:bold;padding:0;margin:0}
nav a, nav li.current a, li.current .navSubmenu{border-radius:0}
.menuTop > a, .menuLogout{display:block}
.mobileNavMenu a.actionButton svg{margin-right:0}

}


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

header a:has(svg){padding:14px 16px 15px 16px}
.content{padding:var(--gapSmall) calc( var(--gap) - 12px)}
.onlyTablet, .onlyDesktop, .showMobileMenu .menuLogout, logo-part svg:not(.logoTitle){display:none}
.onlyMobil{display:block}
logo-part svg.logoTitle{margin-left:0}
.showMobileMenu nav{overflow-y:scroll;
	.menuBottom a:has(small){padding:16px 12px 8px 16px}
	a{padding-left:18px}
	ul{flex-direction:column}
	li{width:100%;flex:1}
}

}



/* BANNERS */

.bannerWrap{width:100%;margin:var(--gapXLarge) auto}
.bannerWrap a.banner{display:block;width:fit-content;margin:0 auto;border:1px solid var(--lightGrey);text-align:center}
#leader_banner a img, #leader_banner2 a img{width:728px;height:160px}
#leader_banner_app, #leader_banner2_app{display:none}
#leader_banner_app a img, #leader_banner2_app a img{width:260px;height:260px}
.side_banner{margin:0px auto 25px auto;display:table;background-color:#fff}
:is(#leader_banner,#leader_banner_app,#leader_banner2,#leader_banner2_app,.side_banner) a:hover{border:1px solid var(--linkHover);box-shadow:var(--materialShadowHover);transition:.3s}

@media screen and (max-width:1024px){
#leader_banner, #leader_banner2{overflow:hidden}
}

@media screen and (max-width:768px){
#leader_banner, #leader_banner2{display:none}
#leader_banner_app, #leader_banner2_app{display:block}
}



/* GENERAL CLASSES */

:disabled{cursor:not-allowed !important}
button:disabled,button[disabled]{background-color:#aaa!important}
button small{font-weight:bold;font-size:1.35rem;text-transform:none;margin-top:0}
.show0,.showInline0,.hide1,.hideInline1,.en .onlySk,.cs .onlySk,.en .onlySkCz,.sk .onlyCz,.en .onlyCz,.sk .onlyEn,.cs .onlyEn,.removeEmpty:empty,body.widthResponsive .onlyDesktop,body:not(.widthResponsive) .onlyResponsive,.removeIfEmpty:empty, .hideEmpty:empty,.hideChildrenEmpty > :empty{display:none!important}
.show,.show1,.hide0{display:block}
.showInline,.showInline1,.hideInline0{display:inline-block}
a.add::before{content:"+ "}
.bold,.bold *{font-weight:bold !important}
.text-center{text-align:center}
.text-right{text-align:right}
.noUserSelect{user-select:none}
.userSelect{user-select:auto}
.red,.red *{color:red !important}
.red svg{fill:red}
.green,.green *{color:var(--green) !important}
.green svg{fill:var(--green)}
.fader-div,#lightbox,.modal{display:none}
.flag{width:18px;height:14px;display:inline-block;border:1px solid var(--lightGrey)}

img.logo, img.table-logo{background:white}
a.info svg{fill:var(--infoColor)}
a.info:hover svg{fill:var(--infoColorHover)}
a.warningIcon svg{fill:var(--linkHover)}
a.warningIcon:hover svg{fill:var(--link)}

a:has(.iconInline,.iconInlineLarge,.iconInlineSmall){display:inline-block;vertical-align:middle;margin:-5px 0 0 6px;width:auto;padding:2px}
.iconInline{width:16px;height:16px}
.iconInlineLarge{width:24px;height:24px}
.iconInlineSmall{width:12px;height:12px}


.fontSize, .fontSize *{font-size:var(--fontSize)}
.fontSizeXSmall, .fontSizeXSmall *{font-size:var(--fontSizeXSmall)}
.fontSizeSmall, .fontSizeSmall *{font-size:var(--fontSizeSmall)}
.fontSizeLarge, .fontSizeLarge *{font-size:var(--fontSizeLarge)}
.fontSizeXLarge, .fontSizeXLarge *{font-size:var(--fontSizeXLarge)}

.marGap{margin:var(--gap)}
.marGap0{margin:0}
.marVGap{margin-block:var(--gap)}
.marHGap{margin-inline:var(--gap)}
.marTopGap{margin-top:var(--gap)}
.marBotGap{margin-bottom:var(--gap)}
.marLeftGap{margin-left:var(--gap)}
.marRightGap{margin-right:var(--gap)}
.marVGapClassic{margin-top:var(--gapLarge);margin-bottom:var(--gapSmall)}
.marVGapXClassic{margin-top:var(--gapXLarge);margin-bottom:var(--gap)}

.padGap{padding:var(--gap)}
.padGap0{padding:0}
.padVGap{padding-block:var(--gap)}
.padHGap{padding-inline:var(--gap)}
.padTopGap{padding-top:var(--gap)}
.padBotGap{padding-bottom:var(--gap)}
.padLeftGap{padding-left:var(--gap)}
.padRightGap{padding-right:var(--gap)}

.alignMiddle, .flexAlignMiddle > *{justify-content:center}
.alignTop, .flexAlignTop > *{justify-content:flex-start}
.alignBottom, .flexAlignBottom > *{justify-content:flex-end}
.alignCenter, .flexAlignCenter > *{text-align:center}
.alignLeft, .flexAlignLeft > *{text-align:left}
.alignRight, .flexAlignRight > *{text-align:right}

.borderRadius, .flexBorderRadius > *{border-radius:var(--borderRadius)}
.borderRadiusSmall, .flexBorderRadiusSmall > *{border-radius:var(--borderRadiusSmall)}
.borderRadiusLarge, .flexBorderRadiusLarge > *{border-radius:var(--borderRadiusLarge)}
.borderRadiusXLarge, .flexBorderRadiusXLarge > *{border-radius:var(--borderRadiusXLarge)}

.border, .flexBorder > *{border:1px solid var(--secondary)}

.materialShadow, .materialShadowHover:hover, .flexMaterialShadow > *, .flexMaterialShadowHover > *:hover{box-shadow:var(--materialShadow);transition:box-shadow .5s}

@media screen and (max-width:1024px){
.iconInline{width:20px;height:20px}
.iconInlineLarge{width:28px;height:28px}
.iconInlineSmall{width:12px;height:12px}
}



/* FLEX */

.flex{display:flex;flex-direction:row;flex-wrap:wrap;align-items:stretch;container-type:inline-size;container-name:flex}
.flex :is(h2,h3,h4,h5,h6){text-align:left;margin-bottom:16px}
:is(.flexAlignMiddle, .flexAlignTop, .flexAlignBottom) > *{display:flex;flex-direction:column}

.flex > *{width:100%}
.flex2 > *{width:50%}
.flex3 > *{width:33%}
.flex4 > *{width:25%}

:is(.flex2, .flex3, .flex4) > *{overflow:hidden}

.flex2.flexGap > *{flex:1 1 calc(50% - var(--gap))}
.flex3.flexGap > *{flex:1 1 calc(33% - var(--gap))}
.flex4.flexGap > *{flex:1 1 calc(25% - var(--gap))}

.flex2.flexGapLarge > *{flex:1 1 calc(50% - var(--gapLarge))}
.flex3.flexGapLarge > *{flex:1 1 calc(33% - var(--gapLarge))}
.flex4.flexGapLarge > *{flex:1 1 calc(25% - var(--gapLarge))}

.flex2.flexGapSmall > *{flex:1 1 calc(50% - var(--gapSmall))}
.flex3.flexGapSmall > *{flex:1 1 calc(33% - var(--gapSmall))}
.flex4.flexGapSmall > *{flex:1 1 calc(25% - var(--gapSmall))}

.flexGap{gap:var(--gap)}
.flexGapLarge{gap:var(--gapLarge)}
.flexGapSmall{gap:var(--gapSmall)}

.flexAlignMiddleInside{margin:auto 0}
.flexAlignBottomInside{margin:auto 0 0 0}

.paddingGap, .flexPaddingGap > *{padding:calc(var(--gap) - 8px) var(--gap)}
.paddingGapLarge, .flexPaddingGapLarge > *{padding:calc(var(--gapLarge) - 4px) var(--gapLarge)}
.paddingGapSmall, .flexPaddingGapSmall > *{padding:calc(var(--gapSmall) - 4px) var(--gapSmall)}


@media screen and (max-width:1024px){
.flex2 > *, .flex3 > *{width:100%;flex:1 1 100%}
.flex4 > *{width:50%;flex:1 1 50%}
.flex2.flexGap > *, .flex3.flexGap > *{flex:1 1 100%}
.flex4.flexGap > *{flex:1 1 calc(50% - var(--gap))}
.flexMaterialShadow > *{box-shadow:none}
}

@media screen and (max-width:768px){
.flex2 > *, .flex3 > *, .flex4 > *{width:100%;flex:1 1 100%}
.flex2.flexGap > *, .flex3.flexGap > *, .flex4.flexGap > *{flex:1 1 100%}
}

@container flex (max-width:850px){
.flex2 > *, .flex3 > *{width:100%;flex:1 1 100% !important}
.flex4 > *{width:50%;flex:1 1 calc(50% - var(--gap)) !important}
}



/* FOOTER */

footer{padding:var(--gap);background:var(--footerBgColor);
	*{font-size:var(--fontSize)}
	a{padding:4px;display:block;color:var(--footerLink);font-weight:bold}
	a:hover{font-weight:bold}
	ul{list-style:none}
	div.flex{width:100%;max-width:1024px;margin:0 auto}
	.navFlag{flex-direction:column}
	.navFlag a{font-size:var(--fontSize)}
	.navFlag svg{margin-left:8px}
	h6{margin:0 0 4px 0}
	hr{margin:var(--gap) auto;display:block;border:1px solid var(--secondary)}
	.footerLinks {gap:var(--gap);
		> div {flex: 0 0 180px; width: 180px}
		> div.footerContact {flex: 1 1 auto; width: auto; min-width: 280px}
	}
	.footerContact{border-left:0.5px solid var(--secondary);padding-left:var(--gap);text-align:center;
	svg{fill:var(--quaternary) !important}
	svg.logo{width:64px;height:64px;margin:0 auto 8px auto}
	svg.logoTitle{display:none;margin:0 auto var(--gapSmall) auto}
}
}

.footerTop{justify-content:space-between;display:grid;grid-template-columns:repeat(7, 1fr);
	a:not(.actionButton){font-size:var(--fontSize)}
	a.actionButton{margin:0;padding:14px 24px}
}

body.session .footerTop{grid-template-columns:repeat(5, 1fr)}

body.sk .footerContact svg.logoTitle.sk, body.cs .footerContact svg.logoTitle.cs, body.en .footerContact svg.logoTitle.en{display:block}
.footerContactIn{text-align:left;width:max-content;margin:0 auto}
.footerContactIn svg{width:20px;height:20px;margin-right:8px}
.footerTerms *{color:var(--quaternary)}

@media (min-width:1920px){
.footerTop a:not(.actionButton){font-size:calc(var(--fontSizeLarge) - 0.3rem)}
footer div.footerTop{max-width:1366px}
}

@media (max-width:1024px){
footer {
	a{padding:8px 4px}
	h6{margin:0 0 4px auto;text-align:center !important}
	.footerLinks{gap:24px;justify-content: center;
		> div{justify-content:center;align-items:center;text-align:center;flex:1 0 200px;}
	}
	.footerContact{border-left:none;padding:24px 0}
}
.footerTop{grid-template-columns:repeat(3, 1fr);grid-template-rows:auto;gap:8px;
> div{text-align:center;order:2;justify-content:start}
> div.footerRegistration{grid-column:1 / -1;width:100%;order:1}
a.actionButton{margin:16px auto}
}
body.session .footerTop{grid-template-columns:repeat(2, 1fr)}
footer hr{margin:24px auto}
.footerTerms{gap:var(--gapLarge)}
}

@media (max-width:768px){
.footerTop{grid-template-columns:repeat(2, 1fr)}
.footerLinks{gap:var(--gapLarge)}
.footerLinks > div{justify-content:center;flex:1 1 100% !important}
.footerContact{border-left:none;border-top:1px solid var(--quaternary)}
.footerTop a.actionButton{width:100%}
.footerContactIn{width:max-content}
}



/* BREAD-CRUMBS */

bread-crumbs{display:block;margin:0 0 0 var(--gapSmall);
*{font-size:var(--fontSizeXSmall)}
ul{display:block;list-style:none;white-space:nowrap;overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none}
ul::-webkit-scrollbar{display:none}
li{display:inline-block;padding:0 0 0 4px;color:var(--lightGrey)}
a{display:inline-block;white-space:nowrap;padding:12px 6px 0 6px}
ul::before{content:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 256 256" fill="%23bd0000"><path d="M219.571,122.667v133.3H162.289V161.92H92.117v94.043H34.624v-133.6l-34.605.32L128.553,0.038l64.593,62.143V22.374h26.443V87.622l36.427,35.045H219.571Z"/></svg>')}
li::before{content:' > '}
}

@media screen and (max-width:1024px){
bread-crumbs{margin:8px 24px}
bread-crumbs a{padding:2px 4px 2px 0}
}

@media screen and (max-width:768px){
bread-crumbs{margin:8px 16px}
}



/* ASIDE - FILTER & CATEGORIES */

aside{width:100%;min-width:240px;max-width:280px;
	> div{position:sticky;top:var(--headerHeight);padding:var(--gap) 0 24px 24px}
	> div :is(h5, h6){display:block;color:var(--black)}
	> div h5{font-weight:500;font-size:var(--fontSizeXLarge);margin-bottom:8px}
	/* > div section:first-child h5{margin-bottom:var(--gapSmall)} */
	> div h6{font-weight:700;font-size:18px;margin-bottom:4px}
	> div :is(a, label){width:100%;overflow:hidden}
	> div a{display:block;padding:5px 0;text-wrap:pretty}
	> div a.active, div a.selected{font-weight:bold;color:var(--linkHover);padding-left:8px}
	> div a.active::after, > div a.selected::after{content:">";margin-left:6px}
	> div small{display:block;font-size:var(--fontSizeXSmall);margin-top:0;color:var(--darkGrey)}
	> div select{margin-top:12px;width:100%}
	> div label:has(input[type="checkbox"],input[type="radio"]){margin:0;padding-top:8px;width:100%}
	> div ul{list-style:none}
	> div ul li{margin:0 0 8px 0}
	> div p{text-align:justify;margin:8px auto 0 auto;font-size:var(--fontSizeSmall);line-height:1.25}
	> div section{margin:0 0 32px 0}
	> div section:last-child{margin:0}
	> div section.warningSection *{color:red}
	:is(.asideClose, .asideOpen){display:none}
	.asideClose{position:fixed;right:16px;top:calc( var(--headerMobileHeight) + 16px);z-index:10}
	.asideClose:hover{background:rgba(255,255,255,0.2)}
	.asideClose svg{height:36px;width:36px;fill:var(--link);margin:auto}
	.search{white-space:nowrap;
		button{margin-left:8px}
		input{width:calc(100% - 48px)}
	}
}

aside.noSticky > div{position:static}aside.noSticky > div{position:static}
aside.asideStatic{position:static}aside.noSticky > div{position:static}
aside.asideRight{margin:0 var(--gap) var(--gap) 0;max-width:240px}
aside.asideRight > div{padding:var(--gap) 0 24px 0}
aside.asideRight h5{margin-bottom:var(--gapSmall)}

@media screen and (min-width:1920px){
aside > div{padding:var(--gap) 0 24px var(--gap)}
aside.asideRight > div{padding:var(--gap) 0 24px 0}
}


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

aside:not(.asideStatic){width:100%;min-width:0;max-width:none;z-index:var(--zIndexLevel10);background:var(--tertiary);order:1;
	> div{position:static;top:0;padding:24px!important}
	> div a{padding:8px 8px}
	.asideOpen{margin:var(--gap) auto;text-align:center;display:block}
	.asideOpen svg{height:24px;width:24px;margin-right:8px}
	> div hr{border-top:2px solid var(--secondary)}
}
aside:not(.asideStatic) > div, aside.asideShown:not(.asideStatic) .asideOpen{display:none}
aside.asideShown .asideClose{display:flex}
aside.asideHidden{background:none;font-weight:bold}
aside.asideShown{position:fixed;top:var(--headerMobileHeight);left:0;right:0;bottom:0;overflow-y:auto;z-index:var(--zIndexLevel20)}
aside.asideRight{order:3;margin:0}

aside.asideStatic{max-width:none !important;display:flex;width:auto;margin:var(--gapSmall);
	> div{margin:0;width:100%;display:flex;gap:var(--gap);padding:var(--gap) !important}
	> div section{margin:0;width:50%}
}

}


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

aside.asideStatic{
	> div{flex-direction:column;padding:var(--gapSmall) !important}
	> div section{width:auto}
}

}


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

aside:not(.asideStatic){
	.asideOpen{margin:0 auto var(--gapSmall) auto;text-align:center;display:block}
}

}



/* BOTTOM BAR menu - showed only on responsive */


.bottomBar{display:none;transition:0.3s;width:100%;position:fixed;left:0;bottom:0;overflow-x:auto;text-align:center;background:var(--navBgColor);padding:0 var(--gap);z-index:var(--zIndexLevel20);
	> ul{display:flex;align-items:stretch;flex-wrap:nowrap;padding:0;flex-direction:row;width:max-content;margin:auto;justify-content:normal;list-style:none}
	> ul > li{position:relative;display:flex}
	> ul > li a svg{height:18px;width:18px;fill:var(--subnavBgColor)}
	a{display:block;font-size:var(--fontSizeSmall);font-weight:bold;white-space:nowrap;padding:16px 16px;box-sizing:content-box;color:var(--subnavBgColor)}
	&.bottomBar2Items > *{flex:1 1 calc(50% - var(--gap))}
	&.bottomBar3Items > *{flex:1 1 calc(33% - var(--gap))}
	&.bottomBar4Items > *{flex:1 1 calc(25% - var(--gap))}
	.bottomDropdown{position:relative;display:flex;align-items:center}
	.bottomDropdown .arrowDown{margin-left:6px;transition:transform 0.2s;width:12px;height:12px}
	.bottomDropdown.active .arrowDown{transform:rotate(180deg)}
	.bottomSubmenu{display:none;position:fixed;left:0;right:0;bottom:80px;z-index:10}
	.bottomSubmenu.active{display:block}
	.bottomSubmenu li{list-style:none}
	.bottomSubmenu li a{padding:14px 6px 14px 32px;color:var(--navLinkColor);text-align:left;font-size:var(--fontSize)}
}

/* Hidding when scrolling otherwise fixed - now dropdown menu when hidding */
.bottomBar.hiddingScroll{bottom:-60px}

@media screen and (max-width:1024px){
.bottomBar{display:flex;flex-direction:row;flex-wrap:nowrap;gap:var(--gap);justify-content:space-around}
}






/* ACTION BUTTON */

.actionButton{position:relative;font-size:var(--fontSize);font-weight:bold;padding:10px 16px;margin:auto 0;display:flex;justify-content:center;align-items:center;border:1px transparent;color:var(--white);letter-spacing:.7px;text-decoration:none;transition:all 200ms ease-in-out;border-radius:30px;white-space:nowrap;width:max-content;
	&:hover{color:var(--white);fill:var(--white);text-decoration:none;box-shadow:var(--materialShadow)}
	&:hover svg{fill:var(--white)}
	svg{display:inline-block;width:var(--fontSizeSmall);height:var(--fontSizeSmall);margin-right:8px;transition:transform 0.5s ease;fill:var(--white)}
}
.actionButtonSmall{font-size:calc(var(--fontSizeSmall) - 0.3rem);padding:3px 10px;margin:0}
.actionButtonSmall svg{height:10px;width:10px;margin-right:4px}
.actionButtonLarge{font-size:var(--fontSizeLarge);padding:14px 18px}
.actionButtonLarge svg{height:var(--fontSize);width:var(--fontSize);margin-right:8px}

.addButton{background:var(--addColor);
	svg{fill:white}
}
.addButton:hover{background:var(--addColorHover);
	svg{animation:rotate 1s ease forwards}
}

.deleteButton{background:var(--deleteColor)}
.deleteButton:hover{background:var(--deleteColorHover)}
.deleteButton:hover svg{animation:horizRotate 1s ease forwards}

.actionLink{font-size:var(--fontSizeLarge);border:4px solid var(--link);padding:12px 28px;font-weight:bold;border-radius:100px;transition:0.3s;margin:var(--gap) auto;display:block;width:fit-content;
	&:hover{border-color:var(--linkHover);background:var(--linkHover);color:white;text-decoration:none}
}


@keyframes rotate{
from{transform:rotate(0deg)}
to{transform:rotate(360deg)}
}

@keyframes horizRotate{
from{transform:rotateY(0deg)}
to{transform:rotateY(360deg)}
}




/* LARGE HEADER SUBMENU - MainActivities, AllFeatures, Flags */

.headerSubmenuLarge,.allFeaturesDiv{display:flex;flex-direction:row;flex-wrap:wrap;align-items:stretch;width:max-content;max-width:900px}
:is(.headerSubmenuLarge,.allFeaturesDiv) a{border-bottom:1px solid var(--secondary);overflow:hidden;text-decoration:none;font-weight:bold}
:is(.headerSubmenuLarge,.allFeaturesDiv) a p{color:var(--navLinkColor);font-size:var(--fontSizeXSmall);font-weight:normal;display:block;margin-top:2px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
:is(.headerSubmenuLarge,.allFeaturesDiv) b{display:block;width:100%;border-bottom:2px solid var(--secondary);color:var(--white);text-align:center;padding:var(--gapSmall)}



/* ALLFEATURESDIV */

#allFeaturesDiv{display:none;background:var(--quaternary);position:fixed;z-index:var(--zIndexLevel40)}
.allFeaturesDiv a{display:flex;flex-direction:row;flex-wrap:nowrap;align-items:center;width:33.3%;padding:20px 16px;
*{color:var(--navLinkColor)}
div{width:inherit;flex-grow:1}
svg{flex-shrink:0;width:32px;height:32px;fill:var(--navLinkColor);margin-right:16px}
}


/* MAIN ACTIVITIES */
.headerMainActivities a{width:50%;padding:24px 20px;font-weight:bold}

/* DOMAIN & LANGUAGES */

.headerLanguages a{display:block;width:20%}
.headerLanguages a svg{max-width:20px;max-height:16px;margin-right:5px}


.fader-div77{display:none;position:fixed;top:50%;left:50%;transform:translate(-50%, -50%);z-index:var(--zIndexLevel100);width:100%;max-width:900px;background:var(--quaternary);border-radius:var(--borderRadiusLarge);box-shadow:var(--outsetShadow);
.allFeaturesDiv{width:auto}
.headerLanguages a{width:20%;padding:14px 14px;text-align:left;color:var(--navLinkColor)}
.headerLanguages b{display:none}
.closeParent{position:absolute;top:-16px;right:-14px;padding:12px;background:white;border-radius:100%}
:is(a.closeParent, .closeParent svg){height:42px;width:42px;border:none;margin:0;padding:0;z-index:62}
.headerLanguages a svg{margin-left:0}
}


@media (max-width:1024px){
	
.fader-div77{top:calc( var(--headerMobileHeight) + 24px);left:var(--gap);right:var(--gap);bottom:85px;transform:none;width:auto;max-width:none;
> div{overflow-y:auto;height:100%}
.headerLanguages{width:auto}
.headerLanguages a{width:33.3%;padding:12px}
}
}


@media (max-width:768px){
.fader-div77{left:var(--gapSmall);right:var(--gapSmall);transform:none;width:auto;max-width:none}
.fader-div77 .headerLanguages a{width:50%}
}



/* INPUT */

input:is([type="text"],[type="number"],[type="date"],[type="password"],[type="email"],[type="file"],[type="url"],[type="tel"],[type="search"],[type="datetime-local"]),select,textarea{padding:10px;border:2px solid var(--lightGrey);border-radius:var(--borderRadiusSmall);transition:0.3s;position:relative}
:is(textarea,input[type="text"],input[type="number"],input[type="date"],input[type="email"],input[type="password"],input[type="file"],input[type="url"],input[type="tel"],input[type="search"],input[type="datetime-local"]):hover{border:2px solid var(--darkGrey);cursor:text;box-shadow:var(--inputInsetShadow)}
:is(textarea,input[type="text"],input[type="number"],input[type="date"],input[type="email"],input[type="password"],input[type="file"],input[type="url"],input[type="tel"],input[type="search"],input[type="datetime-local"]):focus{border:2px solid var(--lightGrey);box-shadow:var(--inputInsetShadow), var(--inputOutsetShadow)!important;background-color:white!important}
input[type="search"]{padding-left:36px;background-repeat:no-repeat;background-position:left 10px center;background-size:16px;background-image:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="256" height="256" viewBox="0 0 256 256" fill="%23aaaaaa"><path d="M7.461,247.307a25.537,25.537,0,0,0,36.126.092L100.6,190.855a25.47,25.47,0,0,0,6.956-23.49A92.9,92.9,0,0,0,256,93.149,92.9,92.9,0,1,0,88.2,147.824a25.51,25.51,0,0,0-23.616,6.812L7.538,211.184A25.538,25.538,0,0,0,7.461,247.307Zm90.9-154.6A64.76,64.76,0,1,1,117.2,138.583,64.279,64.279,0,0,1,98.359,92.711Z"/></svg>')}
input[type="file"]:hover{cursor:pointer}
input[type="range"]{cursor:pointer;width:calc(100% - 60px);display:inline-block;vertical-align:middle;margin:8px auto 0 auto}
p.inputRange, .form p.inputRange{width:auto;min-width:30px;text-align:center;display:inline-block;vertical-align:middle;font-style:normal;font-weight:bold;margin-left:6px;background:#0075ff;color:white;border-radius:100px;padding:4px 8px}
input:is([autocomplete=organization],[autocomplete=street-address],[autocomplete=tel],[autocomplete=email],[type=email],[autocomplete=url],[autocomplete=name],[autocomplete=address-level2],[autocomplete=postal-code],[autocomplete=new-password],[autocomplete=current-password],[type=password]),input.password{padding-left:36px;background-repeat:no-repeat;background-position:left 10px center;background-size:16px}
input:is([autocomplete=organization],[autocomplete=street-address],[autocomplete=tel],[autocomplete=email],[type=email],[autocomplete=url],[autocomplete=name],[autocomplete=address-level2],[autocomplete=postal-code],[autocomplete=new-password],[autocomplete=current-password],[type=password])):focus{padding-left:var(--con8);background-image:none}

input.inputRight{text-align:right}
input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button{margin-left:8px}




/* RADIO + CHECKBOX */

input:is([type="checkbox"], [type="radio"]){-webkit-appearance:none;appearance:none;position:relative;height:19px;width:19px;background:var(--lightGrey);cursor:pointer;display:inline-block;vertical-align:middle;margin-right:10px;box-shadow:var(--inputInsetShadow)}
input.inputRight:is([type="checkbox"], [type="radio"]){margin-left:8px;margin-right:0}
input:is([type="checkbox"],[type="radio"]):disabled{filter:brightness(85%);cursor:not-allowed}
input:is([type="checkbox"],[type="radio"]):hover{background:var(--darkGrey)}
input:is([type="checkbox"],[type="radio"]):checked{background:var(--link)}
input:is([type="checkbox"],[type="radio"]):checked::before{width:auto;height:auto;display:flex;position:absolute;align-items:center;justify-content:center}
input:is([type="checkbox"],[type="radio"]):checked::after{-webkit-animation:click-wave 0.5s;animation:click-wave 0.5s;background:#FF0000;content:'';display:block;position:relative;border-radius:100%}
label:has(input[type="checkbox"]:disabled, input[type="radio"]:disabled){color:var(--darkGrey);cursor:not-allowed}
label:has(input[type="checkbox"]:disabled, input[type="radio"]:disabled):hover{text-decoration:none}
label:hover input:is([type="checkbox"], [type="radio"]):checked{background:var(--linkHover)}

 
/* CHECKBOX */

input:is([type="checkbox"]):checked::before{left:2px;top:2px;
content:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%2216%22%20height%3D%2216%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22%23ffffff%22%3E%3Cpath%20d%3D%22M20.285%202l-11.285%2011.567-5.286-5.011-3.714%203.716%209%208.728%2015-15.285z%22/%3E%3C/svg%3E");
}


/* RADIOBUTTON */

input:is([type="radio"]){border-radius:100%}
input:is([type="radio"]):checked::before{top:1.5px;left:1.5px;content:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2016%2016%22%20width%3D%2216%22%20height%3D%2216%22%20fill%3D%22%23ffffff%22%3E%3Ccircle%20cx%3D%228%22%20cy%3D%228%22%20r%3D%224%22%20/%3E%3C/svg%3E")}


input[type="checkbox"].checkboxLarge, input[type="radio"].radiobuttonLarge{transform:scale(1.2)}
label:has(input[type="checkbox"], input[type="radio"]){margin:4px 0}
label:has(input[type="checkbox"].checkboxLarge, input[type="radio"].radiobuttonLarge){margin:6px 0}



/* TOGGLE SWITCH */

input[type="checkbox"].toggleSwitch{background:var(--lightGrey);border-radius:24px;transition:all 0.2s;vertical-align:middle;box-shadow:var(--inputInsetShadow);width:42px;height:20px}
input[type="checkbox"].toggleSwitch::before{content:"";position:absolute;left:0;top:0;background-color:var(--lightGrey);border-radius:24px;transition:all 0.2s;box-shadow:0 4px 6px -1px rgba(0, 0, 0, 0.3), 0 2px 4px -1px rgba(0, 0, 0, 0.3);border:6px solid white;width:9px;height:9px;outline:1px solid var(--darkGrey)}
input[type="checkbox"].toggleSwitch:checked{background-color:var(--link)}
input[type="checkbox"].toggleSwitch:checked::before{background-color:var(--link);left:24px}

input[type="checkbox"].toggleSwitch.toggleSwitchSmall{width:30px;height:16px}
input[type="checkbox"].toggleSwitch.toggleSwitchSmall::before{width:8px;height:8px;border:4px solid white}
input[type="checkbox"].toggleSwitch.toggleSwitchSmall:checked::before{left:16px}

input[type="checkbox"].toggleSwitch.toggleSwitchLarge{width:52px;height:26px}
input[type="checkbox"].toggleSwitch.toggleSwitchLarge::before{width:14px;height:14px}
input[type="checkbox"].toggleSwitch.toggleSwitchLarge:checked::before{left:26px}


@keyframes click-wave{0%{height:20px;width:20px;opacity:0.35;position:relative} 100%{height:60px;width:60px;margin-left:-20px;margin-top:-20px;opacity:0}}





/* SELECT */

select{position:relative;display:block;margin:2px 0 4px 0;cursor:pointer;width:max-content;vertical-align:middle;padding:8px 12px 8px 8px;background:white;border:1px solid var(--lightGrey);border-radius:var(--borderRadiusSmall);box-shadow:inset 0 1px 2px rgba(255, 255, 255, 0.3);overflow:hidden;transition:all 0.4s;white-space:nowrap;background-image:-webkit-linear-gradient(-90deg, white 0%, #ededed 100%);	background-repeat:repeat;background-position:0 0}
select:disabled, select:disabled:hover{opacity:.6;padding-left:14px}
select:focus{box-shadow:var(--inputOutsetShadow)}
select:hover{border-color:var(--darkGrey);cursor:pointer}
select.selectFirstOption {
	option:first-child{color:var(--darkGrey);font-style:italic}
	optgroup option:first-child{color:initial;font-style:normal}
}
select option[data-prefix="+"]{color:var(--darkGrey);font-style:italic}
select optgroup[label]{color:white;background-color:var(--darkGrey);font-style:normal}
select option{font-style:normal;background:white;color:black}



@media screen and (max-width:1024px){
input:is([type="checkbox"], [type="radio"]){transform:scale(1.25);margin-right:12px}
input.toggleSwitch[type="checkbox"]{margin-right:18px}
label{padding:8px 4px}
input:is([type="text"], [type="number"], [type="date"], [type="password"], [type="email"], [type="file"], [type="url"], [type="tel"], [type="search"], [type="datetime-local"]), select, textarea{font-size:calc(var(--fontSize) + 0.3rem)}
}



/* BUTTON */

button.smallButton{padding:9px 10px;margin:-2px 0 0 0;
	svg{width:18px;height:18px;vertical-align:top}
}



/* SUBMIT BUTTON */

button[type="submit"],input[type="submit"],a.submit,input.submit,button.submit{width:100%;max-width:600px;padding:16px;background:var(--link);font-weight:bold;color:#fff;letter-spacing:1px;font-size:var(--fontSizeLarge);position:relative;transition:all .4s cubic-bezier(0.645, 0.045, 0.355, 1);cursor:pointer;display:block;border-radius:var(--borderRadiusRound);text-transform:uppercase;margin:var(--gap) auto;text-align:center;text-decoration:none;
	svg{width:21px;height:21px;margin-right:12px}
}
button[type="submit"]::after, input[type="submit"]::after,a.submit::after,input.submit::after,button.submit::after,button[type="submit"]::before, input[type="submit"]::before,a.submit::before,input.submit::before,button.submit::before{content:"";position:absolute;top:50%;right:0;transform:translateY(-50%);opacity:0;transition:all .4s cubic-bezier(0.645, 0.045, 0.355, 1)}
button[type="submit"]::after,input[type="submit"]::after,a.submit::after,input.submit::after,button.submit::after{width:25px;height:4px;background-color:white;transform:translateX(-3px);margin-top:-1px}
button[type="submit"]::before, input[type="submit"]::before,a.submit::before,input.submit::before,button.submit::before{content:"";transform:rotate(-135deg) translateX(50%);width:8px;height:8px;background-color:transparent;border-left:4px solid white;border-bottom:4px solid white;margin-top:-1px}
button[type="submit"]:hover,input[type="submit"]:hover,a.submit:hover,input.submit:hover,button.submit:hover{box-shadow:var(--materialShadow);background-color:var(--linkHover)}
button[type="submit"]:hover::after, button[type="submit"]:hover::before, input[type="submit"]:hover::after, input[type="submit"]:hover::before,a.submit:hover::after,a.submit:hover::before,input.submit:hover::after,input.submit:hover::before,button.submit:hover::after,button.submit:hover::before{opacity:1;right:15px}
button[type="submit"].noAnimation:hover::after, button[type="submit"].noAnimation:hover::before{content:"";opacity:0}


#floatingButton{display:none;z-index:var(--zIndexLevel5);position:fixed;bottom:15px;right:40px}
#floatingButton.add{border-radius:100%;width:80px;background:var(--addColor);height:80px;color:white;border:4px solid white;align-items:center;justify-content:center;font-weight:bolder;padding:8px;text-align:center}

@media screen and (max-width:1024px){
	.materialShadow{box-shadow:none}
	#floatingButton.hasBottomBar{bottom:70px}
}
@media screen and (max-width:768px){
	#floatingButton{left:50%;right:auto;transform:translateX(-50%) scale(1.1) !important}
}

/* ========== FORMS ========== */

.form{margin:0 auto;vertical-align:top;padding:0;width:100%;max-width:var(--formWidth);container-type:inline-size;container-name:form;
	.column{display:grid;margin:var(--gapSmall) 0 0 0;grid-gap:28px var(--gap);justify-content:stretch;justify-items:stretch;align-items:start;text-align:left}
	.column1, .form .column2in1, .form .column3in1, .form .column1_small, .form .column1_middle, .form .column1_wide{width:100%;text-align:left}
	.column2in1{grid-template-columns:1fr 1fr}
	.column2in1 div:nth-last-child(1):nth-child(odd){grid-column:span 2}
	.column2in1A{grid-template-columns:1fr max(200px);grid-gap:18px}
	.column2in1B{grid-gap:0}
	.column2in1B section{display:grid;grid-template-columns:1fr max(50px) 1fr;grid-gap:6px;align-items:center}
	.column2in1B section > div:nth-child(2){text-align:center;font-size:var(--fontSizeXXLarge)}
	.column3in1{grid-template-columns:1fr 1fr 1fr}
	.column4in1{grid-template-columns:1fr 1fr 1fr 1fr}
	.column5in1{grid-template-columns:1fr 1fr 1fr 1fr 1fr}
	.column > div:hover{color:var(--black)}
	> div > div.full_row, > div > div.button_row{width:100% !important;max-width:none !important}
	div{width:inherit;color:var(--darkGrey);font-size:calc(var(--fontSize) - 0.1rem);font-weight:bold;position:relative;transition:0.3s}
	h2{display:block;text-align:left;margin:0;font-size:var(--fontSizeXLarge);font-weight:300;margin:0 0 var(--gap) 0}
	h5{display:block;text-align:left;margin:0;font-size:var(--fontSizeLarge);font-weight:600;width:100%}
	h5 i{font-size:var(--fontSizeSmall);font-weight:normal;color:var(--darkGrey)}
	hr{border-color:var(--lighterGrey)}
}

.subForm{width:100%;max-width:var(--formWidth);margin:var(--gapLarge) auto 0 auto}
.subForm:first-child:has(h5){margin:0 auto}
.subForm:first-child:not(:has(h5)){margin:0 auto}


@media screen and (max-width:1366px){
	.form{box-shadow:none;border:none}
}

@media screen and (max-width:1024px){
	.form{margin:0 auto var(--gap) auto;padding:0;width:100%;max-width:none}
}




/* FORM RED NOTICE */

.formNotice{font-size:1.35rem;line-height:16px;display:block;text-align:right;
	&.formNoticeInH1{}
	&.formNoticeAboveForm{width:var(--formWidth);margin:0 auto 8px auto}
	b{font-size:1.4rem}
	small{font-size:1.2rem}
}
.formNotice, .formNotice * {color:#ff0000!important}

@media (max-width:1024px){
	.formNotice {text-align:center;text-wrap:pretty;margin-inline: auto;
		&.formNoticeAboveForm{width:auto}
	}
}


/* INPUT TEXT / NUMBER / EMAIL ... */

.form :is(textarea,input[type="text"],input[type="number"],input[type="date"],input[type="email"],input[type="password"],input[type="file"],input[type="url"],input[type="tel"],input[type="datetime-local"],select,label,.only_text){width:100%;display:block;margin:4px 0 2px 0;font-size:var(--formInputFontSize)}
.form input[type="file"]{font-size:var(--fontSize);padding:7px;background:#fff}
.form input:is([type="text"],[type="number"],[type="date"],[type="password"],[type="email"],[type="tel"],[type="file"],[type="url"],[type="datetime-local"]):disabled,.form select:disabled{opacity:0.45}
.form .only_text{text-decoration:none;font-weight:normal;color:var(--fontColor)}
.form .only_text:hover{text-decoration:none;cursor:default}
.form div input:-webkit-autofill{-webkit-box-shadow:0 0 0 30px #fff inset;box-shadow:0 0 0 30px #fff inset;-webkit-text-fill-color:#333 !important;outline:none}



/* ICON OR LINK IN ONE ROW */

.form .icon_in_row{white-space:nowrap;display:flex;justify-content:space-between;align-items:center;margin:3px 0 2px 0;
	select{width:calc(100% - 45px)}
	a{float:none}
	a svg{width:22px !important;height:22px !important;margin:0 !important}
}



/* SELECT */
.form select{padding:10px 14px 10px 8px}



/* TEXTAREA */
.form .textareaLarge textarea{height:300px}


/* LABEL */
.form label svg{height:24px;width:24px;margin:-6px 3px 0 5px}
.form label img{max-height:22px;margin:0 0 0 7px;vertical-align:middle;display:inline-block}
.form label.selected{text-decoration:underline;color:red;font-weight:bold}

.form label {padding-block:10px;margin-bottom:0}
.form label.oneNonInputItem{margin:6px 0 2px 0;
	&.onlyText {color:var(--fontColor);font-size:1.8rem}
	&.onlyText:hover {text-decoration:none;cursor:default }
}

/* MULTILABELS - IN COLUMN */
.form .labels{
	label{margin-top:10px;Padding-block:4px}
	small{margin-top:10px}
}


/* A - LINK */
.form div a{float:right}
.form a:not(.actionButtonSmall) svg{height:16px;width:16px;margin:0 6px 0 0}
.form a.actionButtonSmall{margin-bottom:40px;position:absolute;top:-8px;right:0}

.form label a{display:block;float:none;font-size:var(--formInputFontSize)}





/* SMALL INFORMATIONAL HINT BELOW INPUT */
.form small{display:block;margin:5px 0 0 12px;clear:both;float:none;font-weight:normal;color:var(--darkGrey);line-height:1}
.form small, .form small *{font-size:var(--fontSizeXSmall)}
.form div small a{float:none}


/* PLACEHOLDER */
.form .column{
	::-webkit-input-placeholder{color:rgba(0,0,0,0.35);font-weight:400;font-style:italic}
	input::-moz-placeholder{color:rgba(0,0,0,0.35);font-weight:400;font-style:italic}
	input:-ms-input-placeholder{color:rgba(0,0,0,0.35);font-weight:400;font-style:italic}
	div:hover input:focus::-webkit-input-placeholder{color:rgba(0,0,0,0)}
	div:hover input:focus::-moz-placeholder{color:rgba(0,0,0,0)}
	div:hover input:focus:-ms-input-placeholder{color:rgba(0,0,0,0)}
}


/* TEXT IN FORM */
.form div p{font-weight:normal;font-size:var(--fontSizeSmall);margin:2px 0 0 0}


@container form (max-width:740px){
.form .column:not(.column2in1B){display:flex;flex-direction:row;flex-wrap:wrap;align-items:stretch}
.form .column > *{width:100%}
.form .column2in1A{gap:12px}
.form small{margin-left:0}

}


/* INPUT REQUIRED */

.form .obl, .form div:has(input[required]){position:relative}
.form .obl::before{content:"* ";color:red}
.form .ok-data::before{content:"✔ ";color:var(--green)}


/* BAD DATA */
.form input:where([type="text"], [type="password"], [type="email"], [type="number"], [type="file"], [type="url"], [type="tel"]):required:invalid,.form .bad-data input:where([type="text"], [type="password"], [type="email"], [type="number"], [type="file"], [type="url"], [type="tel"]),.form .no-data input:where([type="text"], [type="password"], [type="email"], [type="number"], [type="file"], [type="url"], [type="tel"]),.form select:required,
textarea[required]:invalid {border-left:4px solid #ff0000;background-color:rgba(255,0,0,0.03)}

/* OK DATA */
.form input:not(:empty), .form .ok-data select, .form .ok-data input:where([type="text"], [type="password"], [type="email"], [type="number"], [type="file"], [type="url"], [type="tel"]):not([type="checkbox"],[type="radio"]):required:valid, .form .ok-data textarea[required]:valid{border-left:4px solid var(--green) !important}
.form input:-webkit-autofill, .form input:-webkit-autofill:hover, .form input:-webkit-autofill:focus{padding-left:8px}




/* FILTER - under H1 or above TABLE */

.filter{display:flex;align-items:center;justify-content:flex-end;margin:0 0 var(--gap) auto;gap:18px;
	div:has(form, select, label){margin:0 0 0 12px;white-space:nowrap}
	:is(a,details,label){margin:0;padding:4px 12px;position:relative;display:block}
	a.addButton{margin:0 16px 0 0;padding:8px 16px}
	.searchOpen input{width:170px}
	button{margin:auto 0 auto 6px}
	select{max-width:150px;margin:0}
	select,input{font-size:var(--fontSizeSmall)}
	:is(button svg, a svg){max-width:20px;max-height:20px}
	details[open]{background:var(--link);border-radius:var(--borderRadiusXLarge)}
	details[open] summary{background:var(--link);color:white}
	details div{position:absolute;right:-8px;top:calc(100% + 6px);margin:0;background:var(--lighterGrey);max-width:300px;width:max-content;border:8px solid white;padding:8px;box-shadow:var(--materialShadow);z-index:20}
	details div :is(a,select, label){display:block}
	.filter_flag{width:22px;height:16px;margin:0 2px 0 0;vertical-align:middle;border:1px solid rgba(0,0,0,0.2)}
	input:where([type="text"],[type="search"]),.searchInput{width:150px;padding-block:8px}
	.search{white-space:nowrap;
		button[type="submit"]{width:auto;padding:6px 12px;display:inline-block;border-radius:var(--borderRadius);vertical-align:top;
			svg{margin:auto}
		}
		button[type="submit"]::after, button[type="submit"]::before{content:""}
	}
}

.tableTop{display:flex;justify-content:space-between;align-items:end;margin:0 auto 16px auto;
	h5{font-size:var(--fontSizeXLarge);margin-bottom:0;align-self:flex-end;line-height:1;flex:1;
		& * {font-size:var(--fontSizeXLarge);font-weight:bold}
		span{font-weight:normal;font-size:var(--fontSize);color:var(--darkGrey);margin-left:6px}
	}
	.filter{margin:0 0 0 auto;
		.addButton{margin:0}
	}
	.formNotice, .formNoticeAboveForm {margin:0}
}



@media (max-width:1024px){
.tableTop{flex-direction:column;justify-content:start;align-items:start;overflow:hidden;margin:0;
	> *{width:100%}
	h5 {margin:0;
		span{display:block;font-size: var(--fontSize); margin: 6px 0 0 0}
	}
	.formNotice {margin: 12px auto 0 auto}
	.filterInTableTop {margin: var(--gapSmall) 0 0 0}
}

.filter{flex-direction:row;flex-wrap:nowrap;justify-content: flex-start;overflow-x:auto;margin: var(--gapSmall) 0;scrollbar-width:none;-ms-overflow-style:none}
.filter::-webkit-scrollbar {display: none}

.filter details[open] div{position:fixed;top:50%;left:50%;right:auto;transform:translate(-50%, -50%);width:clamp(200px,90%,350px);max-width:none}
.filter details::after{content:"";position:fixed;top:0;left:0;width:100vw;height:100vh;background-color:rgba(0,0,0,0.5);opacity:0;z-index:10;transition:opacity 0.3s;pointer-events:none}
.filter details[open]::after{opacity:1}

.searchOpen{position:fixed;top:50%;left:50%;right:auto;transform:translate(-50%, -50%);width:clamp(200px,80%,300px);max-width:none;z-index:20;background:var(--lighterGrey);border:8px solid white;padding:24px 32px;box-shadow:var(--materialShadow);margin:0 !important}

.filter .searchOpen input, .searchOpen button{display:block;margin:16px 0;width:100%}

}



/* TABLE */

.tableContainer{clear:both;float:none;margin:0;width:100%}
.tableWrap{overflow-x:auto;clear:both;float:none;margin:var(--gapSmall) -6px -6px 0;padding:0 6px 6px 0;width:-moz-available;width:-webkit-fill-available;width:fill-available}
.tableWrap.stickyThead{max-height:600px}
.tableContentNoWrap{box-shadow:var(--materialShadow)}
.tableContentNoWrap :is(td,th), .tableCellNoWrap{white-space:nowrap}

table.tableContentNoWrap {width:100%;margin:0 auto;border-collapse:collapse;border:1px solid var(--lightGrey);position:relative;
	*{font-size:calc(var(--fontSizeSmall) + 0.1rem)}
	th{text-align:left}
	td{text-align:right}
}

.tableMaxWidthSmall{max-width:1280px;margin-inline:auto}
.tableMaxWidthXSmall{max-width:680px}


/* CAPTION + TABLE TITLE */
table.tableContentNoWrap caption{text-align:left;font-size:var(--fontSizeXSmall);margin:0 0 6px 0;
	:is(h5,h6){font-size:var(--fontSizeXLarge);font-weight:bold;margin-bottom:4px}
	h6{font-size:var(--fontSizeLarge)}
}
table.tableContentNoWrap .captionBottom{caption-side:bottom;margin:6px 0 0 0}


/* THEAD */

table.tableContentNoWrap thead{
	tr :is(td,th){font-weight:bold;padding:10px;background:var(--lighterGrey);border:1px solid var(--lightGrey);white-space:nowrap}
	*{font-size:calc(var(--fontSizeSmall) - 1px);color:var(--darkGrey)}
	a{display:inline-block;vertical-align:middle}
	a:has(svg){margin:-4px 0 0 4px}
	a:not(:has(svg, img)){background-image:url(/ico/ui_arrow_double.svg);background-repeat:no-repeat;background-size:12px 12px;background-position:right center;display:inline-block;padding-right:18px;font-weight:bold}
	th.asc, th.desc, td.asc, td.desc {
		a:not(:has(svg,img)){color:#555}
	}
	th.asc, td.asc {
		a:not(:has(svg,img)){background-image:url(/ico/ui_arrow_up.svg)}
	}
	th.desc, td.desc {
		a:not(:has(svg,img)){background-image:url(/ico/ui_arrow_down.svg)}
	}
	tr a:hover{background-image:url(/ico/ui_arrow_double2.svg)}
	svg{max-height:14px;max-width:24px;fill:var(--darkGrey)}

}


/* STICKY THEAD */
.stickyThead table thead :is(td,th){position:sticky;top:-1px;z-index:2}


/* TBODY */
table.tableContentNoWrap >tbody{
	tr :is(td, th):not(.actionCol):not(:has(input:not([type="hidden"]))):not(:has(select)){padding:10px 10px;font-weight:normal}
	:is(img,svg){max-height:16px;max-width:24px}
	:is(td,th){border:1px solid var(--lighterGrey);border-width:0 1px 1px 1px}
	tr:nth-child(even) :is(td,th){background:#f7f7f7}
	tr:nth-child(odd) :is(td,th){background:#fff}
	tr:hover > :is(td,th){background:#fffaec;color:#000}
	svg:not(button svg,a svg){fill:var(--darkGrey)}
	button{padding:8px 12px;margin:0 8px 0 0}
	button svg{margin-right:6px}
	:is(td,th):has(input[type="range"]){text-align:center}
	.canceled :is(td,th):not(.actionCol){text-decoration:line-through;text-decoration-color:rgba(0,0,0,0.25);text-decoration-thickness:1px;color:rgba(0,0,0,0.5);font-style:italic}

	.actionCol{width:auto;max-width:none;white-space:nowrap !important;padding-left:12px;position:relative;text-align:end;
		a{display:inline-block;margin:0;padding:8px 6px 8px 6px}
		svg.show{display:inline-block;margin:0;padding:0}
		a svg, svg{fill:var(--link);max-height:18px;max-width:18px}
		a:hover svg{fill:var(--linkHover)}
	}
}



table.tableContentNoWrap a.moreActions svg{transform:rotate(90deg);/* max-height:24px;max-width:24px;*/}
table.tableContentNoWrap tr:last-child .moreActionsOpen{bottom:0;top:auto}
table.tableContentNoWrap .moreActionsOpen{display:none;position:absolute;top:calc(50% - 70px);right:40px;background:var(--lighterGrey);max-width:300px;width:max-content;border:8px solid white;box-shadow:var(--materialShadow);z-index:2;text-align:left;
	:is(a,select,label,button){display:block;padding:12px 18px;width:100%}
	:is(a,select,label):hover{background:var(--lightGrey)}
	svg{margin:0 8px 0 0}
}



/* TFOOT */

table.tableContentNoWrap tfoot{
	td,th {background:var(--darkGrey);color:white;border-top:1px solid #555;white-space:nowrap;padding:8px;font-weight:bold}
	* {color:white}
}


/* INPUT TEXT */

table.tableContentNoWrap tbody{
	input:is([type="text"], [type="number"], [type="date"], [type="email"], [type="file"], [type="url"], [type="tel"], [type="search"], [type="datetime-local"]), select{min-width:100px;width:100%;border-radius:0;background:transparent;box-shadow:none;margin:0;border:1px solid transparent;height:100%;min-height:40px;padding:4px 4px 4px 10px;outline:none !important;box-sizing:border-box}
	input:is([type="text"], [type="number"], [type="date"], [type="email"], [type="file"], [type="url"], [type="tel"], [type="search"], [type="datetime-local"]):hover, select:hover{background:var(--white);border:1px solid var(--darkGrey) !important}
	input:is([type="text"], [type="number"], [type="date"], [type="email"], [type="file"], [type="url"], [type="tel"], [type="search"], [type="datetime-local"]):focus, select:focus{background:var(--white);border:1px solid var(--link) !important}
	input:is([type="text"], [type="number"], [type="date"], [type="email"], [type="file"], [type="url"], [type="tel"], [type="search"], [type="datetime-local"]):disabled, select:disabled{color:var(--darkGrey)}
	::-webkit-input-placeholder{color:rgba(0,0,0,0.35);font-weight:400;font-style:italic}
	input::-moz-placeholder{color:rgba(0,0,0,0.35);font-weight:400;font-style:italic}
	input:-ms-input-placeholder{color:rgba(0,0,0,0.35);font-weight:400;font-style:italic}
	input:focus::-webkit-input-placeholder{color:rgba(0,0,0,0)}
	input:focus::-moz-placeholder{color:rgba(0,0,0,0)}
	input:focus:-ms-input-placeholder{color:rgba(0,0,0,0)}
}



/* ADD ROW - new item - green styled */

table tbody {
	tr.addRow {
		* {font-weight:bold}
		:is(td,th){background:#e3fde4!important;border-top:1px solid #a6e6a8 !important;border-bottom:1px solid #a6e6a8 !important}
		a{color:var(--addColor);font-weight:bold}
		button{padding:4px 8px;border-radius:var(--borderRadiusRound);margin:0 auto;background:var(--addColor);width:auto}button.noText{padding:4px 16px}
		button:hover{background:var(--addColorHover)}
		button svg{margin:auto;width:14px;height:14px;fill:white!important}
		::-webkit-input-placeholder{color:rgba(0,157,39,0.64);font-style:italic;font-weight:bold}
		input::-moz-placeholder{color:rgba(0,157,39,0.64);font-style:italic;font-weight:bold}
		input:-ms-input-placeholder{color:rgba(0,157,39,0.64);font-style:italic;font-weight:bold}
		input:focus::-webkit-input-placeholder{color:rgba(0,0,0,0)}
		input:focus::-moz-placeholder{color:rgba(0,0,0,0)}
		input:focus:-ms-input-placeholder{color:rgba(0,0,0,0)}
	}
	.addRowAboveLine {background:#a6e6a8 !important;height:3px;padding:0 !important;border:none !important}
	.addRowUnderLine {background:#a6e6a8 !important;height:3px;padding:0 !important;border:none !important}
}



/* NARROW COLUMNS for CHECKBOX or COUNTER INPUT */

table.tableContentNoWrap{
	.small,.smallX,td:not(:empty):has(> input[type="checkbox"]:only-child){text-align:center;width:36px;overflow:visible}
	td:has(> input[type="checkbox"]:only-child) input[type="checkbox"]{margin:0 auto}
	td:has(> input[type="checkbox"]:only-child) input[type="checkbox"], td:has(> input[type="checkbox"]:only-child) input[type="checkbox"]:disabled{margin:0 auto !important}
	.counter, .counter input{width:75px}
}



/* CHECKBOX CHECKED + HIGHLIGHTING ROW*/

table.tableContentNoWrap tbody{
	tr.isChecked :is(td,th){background:#fff5df !important;border:1px solid rgba(0,0,0,0.1)}
	tr.isChecked:hover :is(td,th){background:#ffedd2 !important;color:#222}
	tr:is(.isChecked,.unsolved) * {font-weight:bold !important}
}


/* MIN WIDTH AS CONTENT */

table .minWidth {width:1%;white-space:nowrap!important}

table .middleWidth {width:100%;max-width:200px;white-space:nowrap!important;}


/* DATE - COLUMN WITH DATE */

table .date_time{width:120px;white-space:nowrap}
table .date{width:80px}



/* ID - COLUMN WITH ID */

table .idColumn{width:70px;white-space:nowrap;text-align:left;
	input[type="number"] {min-width:70px}
}



/* NOTE */
table tbody tr .note, th.note {max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}


/* SELECT */

table select:disabled {appearance:none;-webkit-appearance:none;-moz-appearance:none}
table select {appearance:auto;-webkit-appearance:auto;-moz-appearance:auto}


/* LABEL */

table tbody label{padding:0px}
table tbody label:has(input[type="checkbox"]){padding:4px 10px}


/* TFOOT */

table tfoot *{font-size:calc(var(--fontSizeSmall) - 1px);color:var(--darkGrey)}



/* TABLE FOOTER */

.tableFooter{display:flex;margin:var(--gapSmall) auto var(--gapLarge) auto;justify-content:space-between;align-items:flex-start;flex-direction:row;
	> div{display:flex;vertical-align:top;flex-direction:row;flex-grow:1;gap:var(--gapSmall);flex-wrap:wrap}
	svg{max-width:22px;max-height:22px;vertical-align:middle}
	.icnTableFooter{justify-content:end;flex-wrap:wrap}
	.icnTableFooter > div{text-align:center;color:var(--darkGrey);max-width:100px;font-size:calc(var(--fontSizeSmall) - 2px);line-height:1.15;white-space:normal;flex:0 50px}
	.icnTableFooter :is(svg,img){display:block;margin:0 auto 6px auto;max-width:18px;max-height:18px;fill:var(--darkGrey)}
	.actTableFooter{align-items:center;white-space:nowrap;gap:12px;
		*{display:inline-block}
		a svg{margin-right:8px}
		&.notice{font-size:var(--fontSizeSmall);color:red}
	}
}



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

.tableFooter{flex-direction:column;justify-content:center;gap:var(--gap);
	.actTableFooter{flex-wrap:nowrap;white-space:nowrap;overflow:hidden;}
	.actTableFooter :is(a, select, form, label){font-size:var(--formInputFontSize);max-width:200px}
	.icnTableFooter{margin:var(--gapSmall);width:100%;flex-wrap:nowrap;overflow-x:auto;align-items:flex-start;justify-content:flex-start;scrollbar-width: none; -ms-overflow-style: none;
		> div {font-size: calc(var(--fontSizeSmall) - 4px);}
	}
}

.tableFooter div, .tableFooter .icnTableFooter > div{justify-content:center}


table.tableContentNoWrap {
	*:not(input[type="checkbox"]){font-size:2rem}
	thead *{font-size:var(--fontSizeSmall)!important}
	> tbody tr :is(td,th):not(.actionCol):not(:has(input)):not(:has(select)){padding:16px 12px}
	> tbody tr :is(td,th):has(input,select){padding:0}
	> tbody tr :is(td,th).actionCol{padding-top:2px;padding-bottom:2px}
	.actionCol{
		a{padding:10px 8px 10px 4px}
		a svg,svg{max-height:24px;max-width:32px}
	}
	tbody input:is([type="text"],[type="number"],[type="date"],[type="email"],[type="file"],[type="url"],[type="tel"],[type="search"]),table tbody select{min-height:40px}
}


/* RESPONSIVE TABLE */
.responsiveTable{

	table{border:0}
	table thead{border:none;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}
	table tr{display:block;margin-bottom:var(--gap);border-radius:8px;border:1px solid var(--lightGrey);border-bottom:3px solid var(--lighterGrey);overflow:hidden}
	table td{border:1px solid var(--lighterGrey);text-align:right}
	table tr:nth-child(even) :is(td,th){border:1px solid var(--lightGrey)}

	td[data-label]{display:grid;grid-template-columns:minmax(0, 50%) 1fr;gap:10px;align-items:center}
	td[data-label]::before{content:attr(data-label);font-weight:bold;color:var(--darkGrey);white-space:normal;overflow-wrap:break-word;text-align:left}
}

}



/* TABS */

.tabs{margin:var(--gap) auto var(--gapLarge) auto}
.tabs-nav{display:flex;overflow-x:auto;align-content:center;align-items:stretch;flex-direction:row;flex-wrap:nowrap;margin-bottom:-1px;
	a{display:flex;justify-content:center;align-content:center;align-items:center;padding:var(--gapSmall) var(--gap);font-weight:bold;font-size:calc(var(--fontSize) + 0.2rem);background:var(--darkGrey);color:var(--white);border:1px solid var(--lightGrey);white-space:nowrap}
	a:first-child{border-top-left-radius:var(--borderRadius)}
	a:last-child{border-top-right-radius:var(--borderRadius)}
	a svg{max-height:24px;max-width:24px;margin-right:8px;fill:var(--lighterGrey)}
	a:hover{background:var(--lightGrey);color:var(--darkGrey)}
	a:hover svg{fill:var(--darkGrey)}
	a.current{background:var(--lighterGrey);color:var(--darkGrey);border:1px solid var(--lightGrey);border-bottom:1px solid var(--lighterGrey)}
	a.current svg{fill:var(--darkGrey)}
}

.tabs-wrap{border:1px solid var(--lightGrey);background:var(--lighterGrey);border-radius:0 0 var(--borderRadius) var(--borderRadius)}
.tab-content{display:none;padding:var(--gap)}
.tab-content.current{display:block}




/* ACCORDION */

.accordion > div{position:relative;margin:0 auto var(--gapSmall) auto;
	.accordionHead{background:var(--link);color:white;padding:18px var(--gapSmall);cursor:pointer;transition:0.3s ease;display:flex;justify-content:space-between;align-items:center;font-size:calc(var(--fontSize) + 0.2rem);font-weight:bold;border-radius:var(--borderRadius)}
	.accordionHead:hover{box-shadow:var(--materialShadow)}
	.arrow{color:#FFFFFF;font-size:60px;transition:0.25s ease;opacity:0.3;transform:rotate(-90deg)}
	.accordionHead:hover .arrow{opacity:1}
	.accordionHead:not(.accordionActive):hover{background:var(--linkHover);text-decoration:underline}
	.accordionActive{background:var(--darkGrey);border-radius:var(--borderRadius) var(--borderRadius) 0 0;border:1px solid var(--lightGrey);border-width:1px 1px 0 1px}
	.accordionContent{background:white;display:none;padding:var(--gapSmall) var(--gap);color:var(--darkGrey);border-radius:0 0 var(--borderRadius) var(--borderRadius);border:1px solid var(--lightGrey);border-width:0 1px 1px 1px;display:none}
	.accordionHead::after{content:"+";float:right;font-size:32px;line-height:0}
	.accordionHead.accordionActive::after{content:"-"}
}

.accordionGroup .opened .accordionContent{display:block}



/* PAGINATION */

.pagination{text-align:center;margin:var(--gapLarge) auto;display:flex;justify-content:center;align-items:center;
	div {display:flex;flex-direction:row;align-items:center;justify-content:center}
	.pagination-container {flex-direction:column;gap:16px}
	.pagination-controls {gap:12px}
	.pagination-select {gap:6px}
	.pagination-pages {gap:6px}

	a:not(.previous,.next){width:40px;height:40px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;border:2px solid var(--lighterGrey);text-align:center}
	a.current{font-weight:bold;color:black;background:var(--lighterGrey);font-size:var(--fontSizeLarge)}
	:is(.previous,.next){background:var(--link);padding:8px 12px;border-radius:60px;display:flex;justify-content:center;align-items:center;width:auto;gap:6px}
	:is(.previous,.next) span {color:white;font-size:calc(var(--fontSizeSmall) - 0.05rem);font-weight:bold}
	a:is(.previous,.next):hover{background:var(--linkHover)}
	a.previous {padding-right:20px}
	a.next {padding-left:20px}
	a:hover{text-decoration:none;font-weight:bold;background:var(--lighterGrey)}
	.paginationItemSelect{width:auto;display:flex;justify-content:space-between;align-items:center;margin-left:8px;padding:8px 24px 8px 12px}
	div svg {display:block;height:14px;width:14px;fill:white}
	span.current{font-size:var(--fontSizeLarge);font-weight:bold;display:inline-block;margin-inline:8px}
}


@media (max-width:1366px){
	.pagination{flex-direction:column;
		.pagination-controls{flex-direction:column;gap:24px;
			:is(.previous,.next){min-width:250px;padding-block:12px;
				span {font-size:calc(var(--fontSizeSmall) + 0.05rem)}
			}
		}
	}
}

@media (max-width:768px){

}



/* IM */

.im{padding:8px 8px;font-weight:bold;
	svg{width:24px;height:24px}
	&.im_viber{color:#8f5db7}
	&.im_whatsapp{color:#25d366}
}



/* SHARE BOX */

.shareBox{width:max-content;display:flex;flex-wrap:nowrap;align-items:center;justify-content:space-between;gap:8px;margin:var(--gap) auto;position:relative;
	b{position:absolute;top:calc(100% + 6px);font-size:calc( var(--fontSizeSmall) - 0.1rem);color:var(--darkGrey);left:50%;transform:translateX(-50%);opacity:0;transition:0.4s}
	&:hover b{opacity:1}
	a{display:block;text-align:center;width:auto}
	svg{width:24px;height:24px}
	svg.twitter{width:20px;height:20px}
}


.infoBox{margin:var(--gap) auto;width:fit-content;max-width:var(--formWidth);text-align:left;
	h4{font-size:calc( var(--fontSizeLarge) - 3px);margin-bottom:8px}
	h5{font-size:20px;text-align:center;font-weight:bold}
	ul{text-align:center !important;margin:0 0 18px 28px}
	li, dd, dl{text-align:left;margin-bottom:3px;font-size:calc(var(--fontSize) - 1px)}
}

.warnBox{margin:50px auto 0 auto;display:table;text-align:center;
	ul{background:rgba(0,0,0,0.04);margin:15px 25px;border-radius:6px;padding:20px 50px;line-height:25px;display:table}
	h4{font-size:15px;text-align:left;font-weight:bold;padding-bottom:3px}
	h5{font-size:20px;text-align:center;font-weight:bold}
	li{font-size:15px;line-height:23px;text-align:left}
	dd{font-size:15px}
}


@media screen and (max-width:1024px){
	.shareBox{max-width:450px;width:100%;margin:var(--gapLarge) auto;text-align:center;justify-content:space-between;
	svg{width:32px;height:32px}
}
}

@media screen and (max-width:768px){
	.shareBox{max-width:400px;flex-wrap:wrap;gap:8px}
	
	.infoBox{
		ul{margin-left:0}
	}
}