* {box-sizing: border-box;}

html {
    margin: 0;
    padding: 0;
    width: 100%;
    height: 100%;
    scroll-behavior: smooth;
}

body {
    background-color: var(--p-bg-color) !important;
    margin: 0;
    padding: 0;
    overflow-x: hidden;
    width: 100%;
    height: 100%;
}

/*#region Themes*/

:root {
    --p-bg-color: RGB(255,255,255);
    --font-color: RGB(0,0,0);
    --font-color-reverse: RGB(255,255,255);
    --nav-hover: RGB(0,0,0);
    --nav-border: RGB(255,100,20);
	--Ezi-Orange-T-Hover: RGB(255,255,255);
    --font-color-hover: RGB(255,255,255);
	--extras-bg: none;
	--gallery-arrows: RGB(0,0,0);
	--gallery-dots: RGB(0,0,0);
	--member: RGBA(0,0,0,0.5);
	--member-shadow: RGBA(0,0,0,0.3);
	--Nav-Logo: url('../images/Ezi-Safety.png');
	--Nav-Logo-Icon: url('../images/Ezi-Safety.png');
	--Nav-Dropdown-BG: RGB(255,255,255);
	--Nav-Dropdown-Hover: RGBA(255,0,0,0.7);
	--Nav-Search-Border: 2px solid RGB(0,0,0);
	--Nav-Search-Border-Hover: 2px solid RGB(255,100,20);
	--Nav-Search-Background: RGB(255,255,255);
	--Nav-Search-Hover: RGBA(255,100,20,0.5);
	--NavSearchButton-Background-Hover: RGB(255,255,255);
	--Table-Link: RGB(255,0,0);
	--List-Input: 2px solid RGB(0,0,0);
	--List-Background: RGBA(0,0,0,0.25);
	--Toast-Border: RGBA(0,0,0,0.3);
	--Toast-Shadow: RGB(0,0,0);
	--Toast-Background: RGB(255,255,255);
	--Toast-Background-Hover: RGBA(255,0,0,0.25);
	--Toast-Font: RGB(0,0,0);
	--Toast-Close: RGB(0,0,0);
	--Help-Font-Color: RGB(0,0,0);
	--Help-Hover-FC: RGB(0,0,0);
	--Help-Hover: RGBA(255,0,0,0.1);
	--PCY-Hover: RGBA(255,0,0,0.1);
	--PCY-Copy-BG: RGBA(0,0,0,0.5);
	--PCY-Click-BG: RGBA(255,0,0,0.15);
	--Box-Shadow: RGBA(0,0,0,0.25);
	--Border-Color: RGBA(0,0,0,0.25);
	--Box-Shadow-Home: RGBA(0,0,0,0.5);
	--Spare-Part-Gen-Info-BG: RGBA(255,255,255,0.75);
	--SP-ELC-C-BG: RGB(0,0,0);
	--Img-Gen-Info: RGBA(255,255,255,0.25);
	--SPTable-BG: RGB(255,255,255);
	--SPTable-Hover-BG: RGB(175,175,175);
	--SPTable-Child: RGB(225,225,225);
	--SPTable-Child-Hover: RGB(175,175,175);
	--SPTable-Font-Hover: RGB(255,255,255);
	--SPTable-Shadow: RGBA(0,0,0,0.25);
	--SPTable-LG: linear-gradient(to right, RGB(255,0,0) 0%, RGB(0,0,0) 100%);
	--BugR-Input-HBG: RGBA(125,0,0);
	--BugR-Input-THC: RGB(255,255,255);
	--BugR-Screenshots: RGBA(255,0,0,0.25);
	--SiteMap-Hover: RGBA(255,0,0,0.50);
	--SiteMap-Border: 2px solid RGB(255,0,0);
	--Maintenance-Banner: RGB(0,0,0);
	--Data-Measurements: RGBA(0,0,0,0.25);
	--DM-Slider: RGBA(0,0,0,0.3);
	--DM-Slider-Hover: RGBA(255,100,20,0.5);
	--DM-Slider-Checked: RGBA(255,100,20,1);
	--LV-Info: RGBA(0,0,0,0);
	--BColor: RGB(0,0,0);
	--Ezi-Orange: RGB(255,100,20);
	--Ezi-Orange-T7: RGBA(255,100,20,0.7);
	--Ezi-Orange-T5: RGBA(255,100,20,0.5);
	--Ezi-Orange-T3: RGBA(255,100,20,0.3);
	--Notification-Pink: RGBA(255,0,255,0.2);
	--Pink: RGB(255,0,255);
}

[data-theme="dark"] {
    --p-bg-color: RGB(0,0,0);
    --font-color: RGB(255,255,255);
    --font-color-reverse: RGB(0,0,0);
    --nav-hover: RGBA(255,100,20,0.5);
    --nav-border: RGB(255,100,20);
	--Ezi-Orange-T-Hover: RGB(255,255,255);
    --font-color-hover: RGB(0,0,0);
	--extras-bg: RGBA(125,0,0,0.3);
	--gallery-arrows: RGB(255,255,255);
	--gallery-dots: RGB(255,255,255);
	--member: RGBA(255,255,255,0.5);
	--member-shadow: RGBA(255,255,255,0.3);
	--Nav-Logo: url('../images/Ezi-Safety.png');
	--Nav-Logo-Icon: url('../images/Ezi-Safety.png');
	--Nav-Dropdown-BG: RGB(0,0,0);
	--Nav-Dropdown-Hover: RGBA(255,0,0,0.7);
	--Nav-Search-Border: 2px solid RGB(255,255,255);
	--Nav-Search-Border-Hover: 2px solid RGB(255,100,20);
	--Nav-Search-Background: RGB(0,0,0);
	--Nav-Search-Hover: RGBA(255,100,20,0.5);
	--NavSearchButton-Background-Hover: RGB(0,0,0);
	--Table-Link: RGB(255,0,0);
	--List-Input: none;
	--List-Background: RGBA(255,255,255,0.5);
	--Toast-Border: RGBA(255,255,255,0.3);
	--Toast-Shadow: RGB(255,0,0);
	--Toast-Background: RGB(0,0,0);
	--Toast-Background-Hover: RGBA(255,0,0,0.25);
	--Toast-Font: RGB(255,255,255);
	--Toast-Close: RGB(255,255,255);
	--Help-Font-Color: RGB(255,255,255);
	--Help-Hover-FC: RGB(255,255,255);
	--Help-Hover: RGBA(255,0,0,0.1);
	--PCY-Hover: RGBA(255,0,0,0.2);
	--PCY-Copy-BG: RGBA(0,0,0,0);
	--PCY-Click-BG: RGBA(255,0,0,0.25);
	--Box-Shadow: RGBA(255,255,255,0.25);
	--Border-Color: RGBA(0,0,0,0);
	--Box-Shadow-Home: RGBA(255,0,0,0.5);
	--Spare-Part-Gen-Info-BG: RGBA(0,0,0,0.75);
	--SP-ELC-C-BG: RGB(50,50,50);
	--Img-Gen-Info: RGBA(0,0,0,0.25);
	--SPTable-BG: RGB(25,25,25);
	--SPTable-Hover-BG: RGBA(0,0,0,0);
	--SPTable-Child: RGBA(0,0,0,0.3);
	--SPTable-Child-Hover: RGBA(0,0,0,0.5);
	--SPTable-Font-Hover: RGB(255,255,255);
	--SPTable-Shadow: RGBA(0,0,0,0);
	--SPTable-LG: linear-gradient(to right, RGB(255,0,0) 0%, RGB(0,0,0) 100%);
	--BugR-Input-HBG: RGBA(125,0,0);
	--BugR-Input-THC: RGB(255,255,255);
	--BugR-Screenshots: RGBA(125,0,0,0.50);
	--SiteMap-Hover: RGBA(255,0,0,0.35);
	--SiteMap-Border: 2px solid RGB(200,0,0);
	--Maintenance-Banner: RGB(255,255,255);
	--Data-Measurements: RGBA(255,0,0,0.25);
	--DM-Slider: RGBA(0,0,0,0.3);
	--DM-Slider-Hover: RGBA(255,100,20,0.5);
	--DM-Slider-Checked: RGBA(255,100,20,1);
	--LV-Info: RGBA(255,255,255,0.25);
	--BColor: transparent;
	--Ezi-Orange: RGB(255,100,20);
	--Ezi-Orange-T7: RGBA(255,100,20,0.7);
	--Ezi-Orange-T5: RGBA(255,100,20,0.5);
	--Ezi-Orange-T3: RGBA(255,100,20,0.3);
	--Notification-Pink: RGBA(255,0,255,0.5);
	--Pink: RGB(255,0,255);
}

/*#endregion*/

@keyframes pulse {
	0% {
		background-color: RGBA(255,0,0,0.25);
	}
	50% {
		background-color: RGBA(255,0,0,0.50);
	}
	100% {
		background-color: RGBA(255,0,0,0.25);
	}
}

.lazy {
	width: 100%;
	height: auto;
	background-color: RGBA(255,0,0,0.25);
	background-size: cover;
	background-position: center;
	animation: pulse 1.5s infinite ease-in-out;
}

img.lazy {
	display: block;
	width: 100%;
	height: auto;
}

.success {
    font-family: 'Source Sans Pro', sans-serif;
	font-weight: bold;
	color: RGB(0,255,0);
}

#err, .error {
    font-family: 'Source Sans Pro', sans-serif;
	font-weight: bold;
	color: RGB(255,0,0);
}

/*#region Navbar Related*/

.List_Icon {
	position: relative;
}

.List_Badge {
    font-family: 'Source Sans Pro', sans-serif !important;
	font-size: 18px !important;
	background-color: RGB(255,0,0);
	position: absolute;
	top: 10px;
	right: 0;
	padding: 3px !important;
	border-radius: 5px !important;
}

#Spacer_Bottom {
	width: 100%;
	height: 100px;
}

#NavLogo {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: center;
	align-items: center;
	gap: 10px;
}

#Logo {
	width: 200px !important;
	height: 52px !important;
	margin: 0 0 0 25px !important;
	background-image: var(--Nav-Logo);
	background-repeat: no-repeat;
	background-size: contain;
}

#Flag {
	width: 50px;
	height: 25px;
	margin: 0;
	background-image: url('../images/US\ Flag.svg');
	background-repeat: no-repeat;
	background-size: contain;
}

@media screen and (max-width: 820px) {
    
    #Logo {
        display: flex !important;
        justify-content: center !important;
		align-items: center !important;
		width: 125px !important;
		height: 55px !important;
		margin: 0 0 0 0 !important;
		background-image: var(--Nav-Logo-Icon);
		background-repeat: no-repeat;
		background-size: contain;
	}
}

#brand-img {
	width: 200px !important;
	height: 52px !important;
	margin: 0 0 0 25px !important;
}

#Signin_Redirect {
    font-family: 'Source Sans Pro', sans-serif;
	color: var(--font-color);
	font-size: 25px;
	text-align: center;
	padding-top: 25px;
}

#Member_Information {
    font-family: 'Source Sans Pro', sans-serif;
	color: var(--font-color);
	font-size: 25px;
	text-align: center;
	padding-top: 25px;
}

/*#endregion*/

/*#region Flexbox*/

#Flex-Row {
    display: flex;
    flex-flow: row wrap;
    gap: 5px;
    justify-content: center;
    padding-bottom: 25px;
}

#Flex-Column {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

#Flex-Buttons {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

#Footer {
	display: flex;
	flex-flow: row wrap;
	gap: 5px;
	justify-content: center;
    width: 100%;
    margin: auto;
    padding: 25px 25px 25px 25px;
}

/*#endregion*/

/*#region Browser*/

::selection {
	background-color: RGBA(255,100,20,0.5);
	color: RGB(255,255,255);
}

::-webkit-scrollbar {
	width: 10px;
}

::-webkit-scrollbar-thumb {
	background-color: RGB(255,100,20);
	border-radius: 10px;
}

::-webkit-scrollbar-thumb:hover {
	background-color: RGB(255,100,20);
}

::-webkit-scrollbar-track {
	background-color: RGBA(255,100,20,0.3);
	border-radius: 10px;
}

/*#endregion*/

/*#region Dark mode*/

#DM-Toggle {
	text-align: center;
}

.switch {
	position: relative;
	display: inline-block;
	margin-top: 15px;
	width: 60px;
	height: 34px;
}

.switch input {
	opacity: 0;
	width: 0;
	height: 0;
}

.slider {
	position: absolute;
	cursor: pointer;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: var(--DM-Slider);
	-webkit-transition: .4s;
	transition: .4s;
}

.slider:hover {
	background-color: var(--DM-Slider-Hover);
}

.slider:before {
	position: absolute;
	background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' fill='RGB(255,255,255)' viewBox='0 0 384 512'><!--!Font Awesome Pro 6.7.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2024 Fonticons, Inc.--><path d='M287.6 41.2c-82.8 21.2-144 96.5-144 186c0 106 85.8 192 191.5 192c16.8 0 33.1-2.2 48.6-6.2c-40.6 41.4-97.2 67-159.8 67C100.3 480 0 379.7 0 256S100.3 32 224 32c22.1 0 43.5 3.2 63.6 9.2z'/></svg>");
	background-repeat: no-repeat;
	background-size: contain;
	content: "";
	height: 26px;
	width: 26px;
	left: 4px;
	bottom: 4px;
	background-color: RGBA(255,255,255,0);
	-webkit-transition: .4s;
	transition: .4s;
}

input:checked + .slider {
	background-color: var(--DM-Slider-Checked);
}

input:focus + .slider {
	box-shadow: 0 0 1px RGB(4,81,132);
}

input:checked + .slider:before {
	-webkit-transform: translateX(26px);
	-ms-transform: translateX(26px);
	transform: translateX(26px);
	background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' fill='RGB(255,255,255)' viewBox='0 0 512 512'><!--!Font Awesome Pro 6.7.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2024 Fonticons, Inc.--><path d='M256 0c-13.3 0-24 10.7-24 24l0 64c0 13.3 10.7 24 24 24s24-10.7 24-24l0-64c0-13.3-10.7-24-24-24zm0 400c-13.3 0-24 10.7-24 24l0 64c0 13.3 10.7 24 24 24s24-10.7 24-24l0-64c0-13.3-10.7-24-24-24zM488 280c13.3 0 24-10.7 24-24s-10.7-24-24-24l-64 0c-13.3 0-24 10.7-24 24s10.7 24 24 24l64 0zM112 256c0-13.3-10.7-24-24-24l-64 0c-13.3 0-24 10.7-24 24s10.7 24 24 24l64 0c13.3 0 24-10.7 24-24zM437 108.9c9.4-9.4 9.4-24.6 0-33.9s-24.6-9.4-33.9 0l-45.3 45.3c-9.4 9.4-9.4 24.6 0 33.9s24.6 9.4 33.9 0L437 108.9zM154.2 357.8c-9.4-9.4-24.6-9.4-33.9 0L75 403.1c-9.4 9.4-9.4 24.6 0 33.9s24.6 9.4 33.9 0l45.3-45.3c9.4-9.4 9.4-24.6 0-33.9zM403.1 437c9.4 9.4 24.6 9.4 33.9 0s9.4-24.6 0-33.9l-45.3-45.3c-9.4-9.4-24.6-9.4-33.9 0s-9.4 24.6 0 33.9L403.1 437zM154.2 154.2c9.4-9.4 9.4-24.6 0-33.9L108.9 75c-9.4-9.4-24.6-9.4-33.9 0s-9.4 24.6 0 33.9l45.3 45.3c9.4 9.4 24.6 9.4 33.9 0zM256 368a112 112 0 1 0 0-224 112 112 0 1 0 0 224z'/></svg>");
	background-repeat: no-repeat;
	background-size: contain;
	background-color: RGBA(0,0,0,0);
}

.slider.round {
	border-radius: 34px;
}

.slider.round:before {
	border-radius: 50%;
}

/*#endregion*/

.hidden {
	display: none !important;
	visibility: hidden !important;
}