/* -------------------------- VARIABLES ---------------------------------- */
@font-face {
	font-family: 'CenturyGothic';
	src: url('../Fonts/Century Gothic/CenturyGothic.woff2') format('woff2'), url('../Fonts/Century Gothic/centurygothic.eot') format('embedded-opentype'), url('../Fonts/Century Gothic/CenturyGothic.svg') format('svg'), url('../Fonts/Century Gothic/centurygothic.ttf') format('truetype'), url('../Fonts/Century Gothic/CenturyGothic.woff') format('woff');
}
@font-face {
	font-family: 'istok-regular';
	src: url('../fonts/istok-regular.woff') format('woff');
}
@font-face {
	font-family: 'istok-bold';
	src: url('../fonts/istok-bold.woff') format('woff');
}
@font-face {
	font-family: 'poppins-bold';
	src: url('../fonts/poppins-bold.woff') format('woff');
}
@font-face {
	font-family: 'poppins-regular';
	src: url('../fonts/poppins-regular.woff') format('woff');
}
:root {
	/*Color*/
	--Primary-Color: #293E5E;
	--Secondary-Color: #0B111D;
	--Tertirary-Color: #fff;
	/*Font*/
	--Primary-Font: 'poppins-bold';
	--Secondary-Font: 'poppins-regular';
	--Tertirary-Font: CenturyGothic;
	/*Text*/
	--Main-Text: clamp(32px,4vw,50px);
	--Sub-Text: clamp(25px,2vw,27px);
	--Body-Text: clamp(18px,1vw,18px);
}

/*Custom*/
#divAnnouncement {
	background-color: #8080805c;
}
.pr75{
	padding-right:75px;
}
.pl75 {
	padding-left: 75px;
}
.pt40{
	padding-top:40px;
}
.desktopFlexaRoo {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}

.marqFlex {
	display: grid;
	justify-content: start;
}

.lblAnouncement {
	color: #ca1616 !important;
	/*text-shadow: 0px 1px 2px white;*/
	font-size: 19px;
}
.marqueee {
	background-color: transparent;
}

#mobileServices {
	display: none;
}
.mobileServicesFlex{
	display:none;
}

@media screen and (max-width: 1166px) {

	@-ms-viewport {
		width: 100%;
	}
	#rndpServices{
		width:100%;
	}
	.leftsideTopBannerLinksContainer {
		display: none !important;
	}
	#mobileServices{
		display:flex;
	}
	.mobileServicesFlex {
		display:flex;
		flex-direction:column;
		width:100%;
	}
	.DefaultButton {
		padding: 6px !important;
		margin-top:5px;
		margin-bottom:5px;
	}
	.productResultButtonsContainer {
		display: flex;
		justify-content: space-evenly;
		flex-direction: row;
		flex-wrap:wrap;
	}
}


@media screen and (max-width: 1342px) {

	@-ms-viewport {
		width: 100%;
	}
	.nav-link {
		padding-left: 5px !important;
		padding-right: 5px !important;
	}
	.navbrand {
		max-width: 210px !important;
	}
	.chooseUs {
		align-items: center;
	
	}
}


	@media screen and (max-width: 1366px) {

		@-ms-viewport {
			width: 100%;
		}

		.homePageServices {
			font-size: 17px !important;
		}

		.homePageDiv {
			padding-right: 8px !important;
			padding-left: 8px !important;
		}
	}






	.productResultDescriptionContainer {
		padding: 15px;
	}

	.productResultButtonsContainer {
		display: flex;
		justify-content: space-evenly;
	}

	.mw-400 {
		max-width: 400px !important;
	}

	.resultHeaderContainer {
		position: absolute;
		width: 100%;
		height: 100%;
		display: flex;
		justify-content: center;
		align-items: center;
	}




	.noGutters {
		padding-right: 0;
		padding-left: 0;
	}

	.mobileFooter {
		width: 50px;
	}

	.footerLogo {
		max-width: 400px;
		width: 100%;
	}

	.footerlink {
		text-decoration: none;
		color: white;
	}

	.reviewFlex {
		display: flex;
		align-items: center;
		justify-content: center;
	}

	.reviewsFlex2 {
		display: flex;
		align-items: center;
		flex-direction: column-reverse;
	}

	.reviewsContainer {
		display: flex;
		justify-content: center;
		padding: 1rem;
		position: relative;
		height: 60vh;
		background-image: url('../images/supplementary/home testimonial desktop.jpg');
		background-position: center;
		background-repeat: no-repeat;
		background-size: cover;
	}

	.reviewsBackgroundImage {
		/*position:absolute;*/
	}

	.pr15 {
		padding-right: 15px;
	}

	.pl15 {
		padding-left: 15px;
	}

	.serviceProductsFlex {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
	}

	.DefaultButtonForServices.selected {
		background-color: #007bff;
		color: white;
		font-weight: bold;
	}

	.DefaultButtonForServices {
		border: 3px solid var(--Primary-Color);
		padding: 10px;
		display: flex;
		text-decoration: none;
		color: var(--Secondary-Color);
		font-size: var(--Body-Text);
		text-transform: uppercase;
		transition: 0.6s;
		width: 100%;
		justify-content: center;
		max-width: 300px;
	}

		.DefaultButtonForServices:hover {
			transition: 0.6s;
			background-color: var(--Primary-Color);
			color: white;
			border: 3px solid white;
		}

	.DefaultButtonForServicesSelected {
		border: 3px solid var(--Primary-Color);
		padding: 10px;
		display: flex;
		text-decoration: none;
		color: white;
		background-color: var(--Primary-Color);
		font-size: var(--Body-Text);
		text-transform: uppercase;
		transition: 0.6s;
		width: 100%;
		justify-content: center;
		max-width: 300px;
	}




	.DefaultButton {
		border: 3px solid var(--Primary-Color);
		padding: 15px;
		display: flex;
		text-decoration: none;
		color: var(--Secondary-Color);
		font-size: var(--Body-Text);
		text-transform: uppercase;
		transition: 0.6s;
		width: 100%;
		justify-content: center;
		max-width: 300px;
	}

		.DefaultButton:hover {
			transition: 0.6s;
			background-color: var(--Primary-Color);
			color: white;
			border: 3px double white;
		}


	.bigDefaultButton {
		border: 3px solid var(--Primary-Color);
		padding: 30px;
		display: flex;
		text-decoration: none;
		color: var(--Secondary-Color);
		font-size: var(--Body-Text);
		text-transform: uppercase;
		transition: 0.6s;
		width: 100%;
		justify-content: center;
		max-width: 300px;
	}

		.bigDefaultButton:hover {
			transition: 0.6s;
			background-color: var(--Primary-Color);
			color: white;
			border: 3px double white;
		}




	.mainFontSize {
		font-size: var(--Main-Text);
	}

	.extraPaddingLeft {
		padding-left: 25%;
	}



	@keyframes slideIn {
		0% {
			transform: translateX(100%);
			opacity: 0;
		}

		100% {
			transform: translateX(0);
			opacity: 1;
		}
	}

	@keyframes slideIn2 {
		0% {
			transform: translateX(-100%);
			opacity: 0;
		}

		100% {
			transform: translateX(0);
			opacity: 1;
		}
	}

	.slide-in2 {
		animation: slideIn2 2s ease forwards;
	}

	.slide-in {
		animation: slideIn 2s ease forwards;
	}

	.linksHeadings {
		font-size: 40px;
		color: var(--Primary-Color);
		text-transform: uppercase;
		/*    text-decoration: underline;
	text-underline-offset: 20px;*/
		position: relative;
	}

	.linksHeadings1 {
		font-size: 40px;
		color: var(--Primary-Color);
		text-transform: uppercase;
		text-decoration: underline;
		text-underline-offset: 20px;
		position: relative;
	}

	.pt20 {
		padding-top: 20px;
	}

	.underline-50-white {
		position: relative;
		display: inline-block;
	}

		.underline-50-white::after {
			content: '';
			position: absolute;
			bottom: 0;
			left: 50%;
			transform: translateX(-50%);
			width: 50%;
			border-bottom: 4px solid white;
			text-underline-offset: 20px;
		}

	.underline-50 {
		position: relative;
		display: inline-block;
	}

		.underline-50::after {
			content: '';
			position: absolute;
			bottom: -10px;
			left: 50%;
			transform: translateX(-50%);
			width: 50%;
			border-bottom: 4px solid;
			text-underline-offset: 20px;
		}

	.marginleftforhomebutton {
		margin-left: 9.5%;
		margin-top: 60px;
	}

	.home-underline {
		height: 5px;
		background-color: var(--Primary-Color);
		width: 100%;
		position: relative;
		max-width: 213px;
		margin: 20px 0 20px 15%;
		color: #4C638C;
	}

	.chooseUs {
		display: flex;
		flex-direction: column;
		justify-content: space-evenly;
	}



	.underlineCorrection {
		padding-top: 50px;
	}

	.underlineCorrectionMargin {
		margin-bottom: 40px;
	}

	.mainHeadingHomePage {
		font-size: var(--Main-Text);
		font-family: var(--Primary-Font);
		color: white;
		text-transform: uppercase;
		text-shadow: rgba(0, 0, 0) 0px 0px 5px;
	}

	.subtext {
		color: var(--Primary-Color);
		font-weight: bold;
		font-size: 32px;
		display: flex;
		justify-content: flex-end;
	}

	.rightsideTopBannerTextContainer {
		width: 100%;
		height: 100%;
		position: absolute;
		display: flex;
		justify-content: center;
		align-items: center;
	}


	.leftsideTopBannerLinksContainer {
		padding-right: 0;
		padding-left: 0;
	}

	.rightsideTopBannerContainer {
		padding-right: 0;
		padding-left: 0;
		position: relative;
	}

	.homePageDiv {
		display: flex;
		flex-direction: column;
		height: 100%;
		width: 100%;
		padding-left: 15px;
		padding-right: 15px;
		border-right: 1px solid var(--Primary-Color);
		border-top: 1px solid var(--Primary-Color);
		border-bottom: 1px solid var(--Primary-Color);
	}
	/*.homePageServices {
	text-decoration: none;
	color: var(--Secondary-Color);
	font-size: var(--Sub-Text);
	font-weight: 300;
	transition: color 0.3s ease, font-weight 0.3s ease;
}
	.homePageServices:hover{
		color:var(--Primary-Color);
		font-weight:600;
	}*/
	.homePageServices {
		text-decoration: none;
		color: var(--Secondary-Color);
		margin-top: 25px;
		font-size: 20px;
		text-transform: uppercase;
		transition: color 1s ease, transform 2s ease;
	}

		.homePageServices:hover {
			transition: color 1s ease, transform 2s ease;
			color: var(--Primary-Color);
			transform: scale(1); /* Slightly increase size for emphasis */
		}

	.pt20 {
		padding-top: 20px;
	}


	.abovenavIcons {
		max-width: 30px;
		width: 100%;
	}

	.abovenavLogo {
		width: 100%;
		max-width: 270px;
	}

	.socialmediagrouped {
		margin-left: 10px;
		margin-right: 10px;
	}

	.requestaQuote {
		font-weight: bold;
		/*margin-right: 140px;*/
	}

	/* -------------------------- Global ---------------------------------- */
	.defaultButton {
		width: 100% !important;
		max-width: 400px;
		height: 60px;
		background-color: var(--Secondary-Color);
		color: white;
		font-family: var(--Primary-Font);
		text-decoration: none !important;
		display: flex;
		justify-content: center;
		align-items: center;
		font-size: var(--Body-Text);
		border: 2px solid var(--Secondary-Color);
		transition: 2s;
		cursor: pointer;
	}

		.defaultButton:hover {
			transition: 1s;
			background-color: white;
			color: var(--Secondary-Color);
		}


	.cl_Primary {
		color: var(--Primary-Color) !important;
	}

	.italic {
		font-style: italic;
	}


	.lblEditor {
		color: var(--Secondary-Color);
		/*font-size: 18px;*/
		font-size: var(--Body-Text);
	}

	.mainHeading {
		font-size: var(--Main-Text);
		font-family: var(--Primary-Font);
		text-transform: uppercase;
	}

	.subHeading {
		font-size: var(--Sub-Text);
	}

	html {
		scroll-behavior: smooth;
		background-color: transparent;
	}

	hr {
		margin-top: 20px;
		margin-bottom: 20px;
		border: 0;
		border-top: 1px solid #757575;
	}

	h1, h2, h3, h4, h5 {
		color: var(--Primary-Color);
	}

	body {
		font-family: var(--Secondary-Font), Arial;
		font-size: 11pt;
		color: var(--Primary-Color);
		background-color: transparent;
	}

	* {
		box-sizing: border-box;
	}



	/* -------------------------- Important Labels ---------------------------------- */

	.lblSnippetName {
		font-size: 25px;
		color: var(--Primary-Color);
	}

	.bannerHeading {
		font-size: 40px;
		color: var(--Primary-Color);
	}

	.contactDetailsAboveNav {
		width: 20px;
	}
	/* -------------------------- Important Containers ---------------------------------- */
	.mainFrame {
		max-width: 1400px; /*1400px */
		top: 10px;
		margin-left: auto;
		margin-right: auto;
		width: 100%;
	}

	.mainFrame1 {
		max-width: 1600px; /*1400px */
		top: 10px;
		margin-left: auto;
		margin-right: auto;
		width: 100%;
	}

	/* -------------------------- NavBar Related ---------------------------------- */
	.lnkAccountOptions {
		font-size: 12pt;
		text-decoration: none;
		color: black;
		background-color: var(--Primary-Color);
	}

		.lnkAccountOptions:hover {
			color: White;
		}

	.bgAboveBoiler {
		background-color: var(--Secondary-Color);
		padding: 5px 20px 5px 20px;
		display: flex;
		justify-content: space-between;
		align-items: center;
	}



	.popupAccountItem {
		width: 100%;
		padding: 10px;
		border-bottom: 1px solid var(--Primary-Color);
	}

		.popupAccountItem:hover {
			background-color: var(--Tertirary-Color);
		}


	.boilerPlate {
		padding: 10px;
		background-color: var(--Primary-Color);
	}

	.nav-item {
		padding: 1px !important;
	}

	.nav-link {
		font-size: 20px;
		font-family: var(--Secondary-Font);
		color: var(--Primary-Color);
		padding-left: 20px ;
		padding-right: 20px ;
		text-transform: uppercase;
	}

		.nav-link:hover {
			color: var(--Primary-Color);
			transition: color 0.5s;
		}

	.navbar.solid {
		/*background-color: var(--Secondary-Color) !important;*/
		transition: background-color 0.5s;
		box-shadow: 0 0 4px grey;
		color: var(--Secondary-Color) !important;
	}

	.navbrand {
		max-width: 390px;
		width: 100%;
		padding-top: 10px;
		padding-bottom: 10px;
		margin-left: 10px;
	}

	.navbar {
		background-color: white !important;
		--bs-navbar-padding-y: 0 !important;
	}

	.navSelected {
		color: var(--Secondary-Color) !important;
		border-bottom: 2px solid var(--Primary-Color);
		padding-bottom: 10px;
	}

	.footer {
		width: 100%;
		background-color: var(--Primary-Color);
	}

	.underlineWhite {
		position: relative;
		display: inline-block;
	}

		.underlineWhite::after {
			content: '';
			position: absolute;
			width: 0;
			height: 3px;
			bottom: 0;
			left: 50%;
			background-color: white;
			transition: width 0.3s ease, left 0.3s ease;
		}

		.underlineWhite:hover::after {
			width: 100%;
			left: 0;
		}



	.underline {
		position: relative;
		display: inline-block;
	}

		.underline::after {
			content: '';
			position: absolute;
			width: 0;
			height: 3px;
			bottom: 0;
			left: 50%;
			background-color: var(--Primary-Color);
			transition: width 0.3s ease, left 0.3s ease;
		}

		.underline:hover::after {
			width: 100%;
			left: 0;
		}


	/* -------------------------- General Utilities  ---------------------------------- */
	.clrPrimary {
		color: var(--Primary-Color) !important;
	}

	.clrSecondary {
		color: var(--Secondary-Color) !important;
	}

	.clrTertirary {
		color: var(--Tertirary-Color) !important;
	}

	.bgPrimary {
		background-color: var(--Primary-Color) !important;
	}


	.fntPrimary {
		font-family: var(--Primary-Font);
	}

	.fntSecondary {
		font-family: var(--Secondary-Font);
	}

	.fntTertirary {
		font-family: var(--Tertirary-Font);
	}

	.textWhite {
		color: white !important;
	}

	.borderBottom {
		border-bottom: 1px solid #adadad;
	}

	.mainFrame-Fix {
		display: flex;
		justify-content: center;
	}

	.bannerImageDesktop {
		display: inline-block;
	}

	.bannerImageDesktop1 {
		display: flex;
		position: absolute;
		width: 100%;
		height: 700px;
	}

	.bannerImageMobile1 {
		display: none;
	}

	.bannerImageMobile {
		display: none !important;
	}

	.pointer {
		cursor: pointer;
	}

	.hide {
		display: none !important;
	}

	.mobileCentre {
		left: 50%;
		transform: translateX(-50%);
	}

	.text-right {
		text-align: right !important;
	}

	.text-center {
		text-align: center !important;
	}

	.text-left {
		text-align: left !important;
	}

	.containerSpacing {
		padding-top: 60px;
		padding-bottom: 60px;
	}

	.layer, .layer2 {
		width: 100%;
		height: 100%;
	}

	.layer {
		/*	background-color: rgba(0, 0, 0, 0.0);*/
		position: absolute;
	}

	.mobile {
		display: none !important;
	}

	.lblEditor {
		color: var(--Secondary-Color);
	}

	.lnkNodec {
		text-decoration: none !important;
		color: var(--Secondary-Color);
	}

	.hlnkNodec {
		text-decoration: none !important;
	}

	.hover-underline:hover {
		text-decoration: underline !important;
	}

	.floatLeft {
		float: left !important;
	}

	.floatRight {
		float: right !important;
	}

	.scrollable-menu {
		max-height: 200px; /* Set your desired maximum height for the dropdown menu */
		overflow-y: auto;
		overflow-x: hidden;
	}

	.contentCenter {
		position: absolute;
		width: 100%;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
	}
	/* -------------------------- Carousel Items ---------------------------------- */
	.carousel-control-prev-icon {
		background-image: url('../images/general/icons8-left-50.png');
	}

	.carousel-control-next-icon {
		background-image: url('../images/general/icons8-right-50.png');
	}

	/* -------------------------- Specials ---------------------------------- */

	.loader {
		border: 4px solid var(--Secondary-Color); /* The color wherein the circle spins */
		border-top: 4px solid var(--Tertirary-Color); /* Color inside the Circle that is spinning */
		border-radius: 50%;
		width: 200px;
		height: 200px;
		animation: spin 1s linear infinite;
		margin: auto;
		margin-top: 50px;
	}

	@keyframes spin {
		0% {
			transform: rotate(0deg);
		}

		100% {
			transform: rotate(360deg);
		}
	}

	.full-page {
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background: linear-gradient(to right, var(--Primary-Color), var(--Secondary-Color));
		background-size: 200% 100%;
		animation: gradientAnimation 4s ease infinite alternate;
		z-index: 9999;
		display: flex;
		align-content: center;
		flex-wrap: wrap;
	}

	@keyframes gradientAnimation {
		0% {
			background-position: 0% 50%;
		}

		50% {
			background-position: 100% 50%;
		}

		100% {
			background-position: 0% 50%;
		}
	}

	/* style.css */

	.hidden {
		display: none;
	}

	#popup {
		position: fixed;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
		background-color: white;
		padding: 20px;
		border: 1px solid #ddd;
		box-shadow: 0 2px 5px rgba(0,0,0,0.3);
	}

		#popup img {
			max-width: 100%;
			max-height: 300px; /* Adjust height as needed */
			display: block;
			margin-bottom: 10px;
		}

	#close-popup {
		padding: 5px 10px;
		background-color: #ddd;
		border: none;
		cursor: pointer;
	}





	/* -------------------------- HEADINGS ---------------------------------- */


	.heading1 {
		padding-top: 5px;
		font-size: 40px;
		margin: 0 0 20px;
		color: var(--Primary-Color);
		letter-spacing: 0;
		font-weight: 400;
	}

	.headingCMS {
		padding-top: 5px;
		font-size: 24px;
		margin: 0 0 20px;
		color: var(--Primary-Color);
		letter-spacing: 0;
		font-weight: 400;
	}

	/*--------------- DEVEXPRESS OVERRIDE ---------------*/

	.dxeBase_Office365 {
		color: var(--Secondary-Color);
	}

	.dxbplc {
		vertical-align: top !important;
	}

	.dxis-passePartout {
		background-color: Transparent !important;
	}

	.dxflItem_Office365 {
		padding: 3px 0 !important;
	}

	.dxm-hovered {
		background-color: #0d8599 !important;
		color: var(--Primary-Color) !important;
	}

	.dxmLite_Office365 .dxm-vertical .dxm-image-l .dxm-content, .dxmLite_Office365 .dxm-vertical .dxm-image-r .dxm-content, .dxmLite_Office365 .dxm-popup .dxm-content {
		padding: 15px;
	}

	.dxmLite_Office365.dxm-side-menu-mode .dxm-selected {
		background: none;
		color: var(--Primary-Color);
		background-color: #000000 !important;
		border-color: #000000 !important;
	}


	.dxmLite_Office365 .dxm-main {
		border: none !important;
		background-color: transparent !important;
	}

	.dxm-spacing, .dxm-separator, .dxm-separator b {
		font-size: 0;
		line-height: 0;
		display: none !important;
	}

	/*--------------- COOKIE POPUP ---------------*/
	#myCookieConsent {
		z-index: 999;
		padding: 20px 20px 10px 20px;
		font-family: OpenSans, arial, "sans-serif";
		background: rgba(0,0,0,0.6);
		overflow: hidden;
		position: fixed;
		color: white;
		bottom: 0px;
		right: 10px;
		display: none;
		left: 0;
		text-align: center;
		font-size: 13px;
		font-weight: bold;
		width: 100%;
	}

		#myCookieConsent div {
			padding: 5px 0 0;
		}

		#myCookieConsent a {
			color: #ffba55;
			display: inline-block;
			padding: 0 10px;
		}

			#myCookieConsent a:hover {
				color: #fda016;
			}

			#myCookieConsent a#cookiesAcceptButton {
				display: inline-block;
				color: #000000;
				font-size: 1.1em;
				background: White;
				text-decoration: none;
				cursor: pointer;
				padding: 5px 60px 5px 60px;
				border-radius: 5px;
			}

				#myCookieConsent a#cookiesAcceptButton:hover {
					background-color: lightgrey;
					color: #000;
				}




	/*--------------- Hardcode BACKGROUND colors ---------------*/



	.background_main {
		background-size: cover;
		background-repeat: no-repeat;
		width: 100%;
		background-attachment: fixed;
		background-position: center;
		position: relative;
		height: 100vh;
	}

	.background_banner, .bannerAbout, .bannerServices, .bannerFAQ {
		background-size: cover;
		background-repeat: no-repeat;
		width: 100%;
		background-attachment: fixed;
		background-position: center;
		position: relative;
		height: 50vh;
	}








	/*--------------- DIVISION ---------------*/

	.contentPlaceholder {
	}


	.divOnlineShop_Footer {
		padding: 10px 20px;
		background-color: var(--Primary-Color);
		transition: all 0.3s ease;
	}

		.divOnlineShop_Footer:hover {
			background-color: var(--Secondary-Color);
		}


	.contactBtnContainer {
		width: 100%;
		max-width: 550px;
		margin: 0 auto;
	}



	.createAccountAddress {
		min-height: 248px;
	}


	.cardRecent {
		width: 100%;
		min-height: 260px;
	}

	.cardfeedback {
		width: 100%;
		min-height: 220px;
	}

	.cardReview {
		width: 100%;
		min-height: 150px;
	}




	.divSpotlightPrice {
		position: relative;
		text-align: center;
		float: right;
	}


	/*--- Sign In and Create Password ---*/

	.divSignIn {
		max-width: 500px;
		width: 100%;
		margin: auto;
	}

	.pnlSignIn {
		max-width: 500px;
		width: 100%;
	}

	.productTotal {
		width: 100%;
		text-align: right;
		font-size: 15pt;
	}

	/*--- Text Box ---*/


	.txtSignInEmail {
		width: 100%;
		/*   min-width: 280px;
	max-width: 320px;*/
	}

	.txtVertMiddle {
		padding-top: 9px;
	}

	/*--- Shopping ---*/

	.Quantity {
		display: flex;
		align-items: center;
	}

	.ShoppingDetails {
		display: flex;
		flex-direction: column;
		justify-content: space-evenly;
		padding: 20px;
	}

	.ProductName, .Quantity, .UnitPrice, .UnitTotal {
		padding: 10px;
	}

	.ShoppingActions {
	}

	.btnRemove {
		border: 1px solid var(--Primary-Color);
		background-color: var(--Secondary-Color);
	}

		.btnRemove:hover {
			background-color: darkred;
		}

	.btnShoppingCart {
		/*width: 100px !important;*/
		font-size: 18px;
		padding: 5px;
		margin-top: 10px;
		margin-bottom: 10px;
		width: 100%;
		background-color: var(--Secondary-Color);
		/*min-width:250px;*/
	}

		.btnShoppingCart:hover {
			background-color: var(--Primary-Color);
		}

	.txtSignInEmail {
		width: 100%;
	}



	.divShoppingBtnAlign {
		text-align: right;
	}

	.shoppingButtons {
		padding-top: 10px;
		padding-bottom: 10px;
		width: 100%;
	}

	.lblShopQty {
		font-size: 11pt;
		font-weight: bold;
	}

	.lblShopPackName {
		font-size: 13pt;
		font-weight: bold;
		color: var(--Primary-Color) !important;
	}

	.checkoutTotals {
		max-width: 200px;
		text-align: right;
	}

	/*--- Product ---*/


	.pnlProductMedia {
		width: 100%;
		/*max-width: 1080px;*/
		margin: auto;
	}

	.spanBuyProduct {
		color: var(--Secondary-Color);
		font-size: 13pt;
	}

	.productHeading {
		width: 100%;
		background-color: var(--Primary-Color);
		padding: 1px 0px 1px 15px;
		color: var(--Primary-Color);
	}




	.productDescription {
		box-sizing: border-box;
		padding: 0px 5px 0px 5px;
		width: 72%;
	}

	.cmsContent {
		width: 100%;
		padding: 10px;
		padding-top: 30px; /* Temporary to compensate for yellow broadcast banner. Please remove this line for final release */
		box-sizing: border-box;
	}

	.divFaq {
		width: 100%;
		max-width: 1000px;
		margin: auto;
	}

	.divGreyPanel {
		background-color: #e5e5e5;
		border-radius: 3px;
		padding: 11px 5px 11px 5px;
		width: 100px;
	}

	.divGreyPanelCms {
		background-color: transparent;
		width: 80px;
	}



	.htmlEditor, .page100 {
		width: 100%;
	}

	.searchParameterDesktop {
		background-color: white;
		padding-left: 10px;
		padding-right: 10px;
		height: 40px !important;
		/*border: 1px solid #adadad;*/
	}

	.footerLinkMobile {
		display: none;
		width: 100%;
	}

	.containerTreelist {
		width: 600px;
		margin: auto
	}


	.searchButton {
		width: 10%;
		margin-left: 5px;
	}


	.masterLogin, .masterLoginCms {
		float: right;
		padding-bottom: 5px;
	}

	/*---- BANNER ----*/

	.topBannerProduct {
		width: 100%;
		margin: auto;
		text-align: center;
	}

	.topBannerMainImageSlider {
		width: 100%;
		/*max-height: 350px;*/
		margin: 0;
		padding: 0;
	}


	.sitemapContainer {
		padding-left: 13px;
	}

	.cmbCountry {
		width: 100%;
		max-width: 300px;
	}

	/*--------------- FORM LAYOUT ---------------*/

	.formGroupCaption {
		font-size: 11pt !important;
	}

	.formContact {
		width: 100%;
		max-width: 600px;
		margin: auto;
	}

	.formCreateAcc {
		max-width: 800px;
	}

	.formAccess {
		width: 100%;
		max-width: 400px;
	}

	/*--------------- TABLE ---------------*/
	.tblFooter td {
		color: var(--Primary-Color) !important;
	}

/*--------------- TD ---------------*/
.tdBordered {
	border: 1px solid #adadad;
}
#lblFollowUs {
	display: flex;
	width: 100%;
	justify-content: center;
}
#lblContactUsBlock1 {
	display: flex;
	justify-content: center;
}
.tdMenuSpacing {
	padding-left: 10px;
}

	/*--------------- LABELS ---------------*/



	.lblArticleHeading {
		font-size: 25px;
		color: #000000;
	}



	.lblFormCaption, .lblOrderTotal {
		font-size: 12pt;
	}


	.lblCreateAccount-Popup {
		font-weight: bold;
		color: #0d8599;
	}

	.lblAccountMobile {
		font-size: 13pt;
	}

	.lblOrderTotal {
		color: var(--Primary-Color);
		font-weight: bold;
	}

	.lblOrderConfirm {
		font-size: 12pt;
	}

	.lblProductName {
		font-size: 15pt;
		font-weight: bold;
		color: var(--Primary-Color);
	}

	.lblHomeProductName {
		color: var(--Primary-Color);
		font-size: 25px;
	}


	.lblHomeProductLocation {
		font-size: 10pt;
	}

	.lblShoppingMessage {
		font-size: 12pt;
	}

	.lblShoppingTotal {
		font-size: 15pt;
	}

	.lblFAQ {
		font-size: 12pt;
	}

	.lblNotification {
		font-size: 12pt;
	}

	.lblShopPrice, .srchPrice {
		color: var(--Primary-Color);
		font-weight: bold;
		font-size: 13pt;
	}



	.lblSearchParameters {
		font-size: 13pt;
		font-family: Arial;
		padding-left: 5px;
		padding-right: 5px;
		vertical-align: bottom;
	}

	/*--------------- BUTTONS ---------------*/

	.btnCallToAction {
		padding: 10px 15px;
		border-radius: 10px;
		background-color: var(--Primary-Color);
		font-size: 20px;
	}

		.btnCallToAction:hover {
			background-color: black;
		}

	.btnCmsMenuItem {
		width: 100% !important;
		padding: 5px;
		background-color: var(--Primary-Color);
		transition: all 0.2s ease;
		text-align: left;
	}

		.btnCmsMenuItem:hover {
			background-color: var(--Secondary-Color);
		}

	.btnAddToHome {
		background-color: #0d8599;
		padding: 5px;
		border-radius: 5px;
		border: none;
		color: var(--Primary-Color);
		width: 100%;
		max-width: 200px;
	}

	.btnSysAdmin {
		background-color: #0d8599
	}

	.btnContact {
		width: 100% !important;
		max-width: 300px !important;
		color: var(--Primary-Color);
		font-size: 11pt;
		text-align: center;
		margin: 0 auto;
		padding: 10px;
	}

	.btnSignIn {
		padding: 5px;
		width: 200px !important;
	}

	.btnUpload {
		font-weight: bold !important;
		color: black;
	}

	.btnDnlInvoice {
		height: 40px;
		width: 150px;
	}

	.btnAddCart {
		text-align: center;
	}

	.btnMasterMenu {
		width: 100px;
		padding: 5px;
		background-color: var(--Secondary-Color);
	}

	.btnMasterMenuIcon {
		width: 100px;
		padding: 5px;
	}


	.btnPopup {
		float: left;
		margin-right: 8px;
	}

	.featureHeading {
		width: 100%;
		background-color: #0d8599;
		padding: 5px;
		color: white;
		text-align: center;
	}

	.btnLong {
		width: 100%;
		background-color: #0d8599;
		padding: 20px;
		color: var(--Primary-Color);
		text-align: center;
	}

		.btnLong:hover {
			cursor: pointer;
			width: 100%;
			background-color: #DFDFDF;
			color: #0d8599 !important;
		}

	.btnSaveClose {
		width: 50%;
		margin: auto;
		text-align: center;
	}

	.btnBuyNow, .btnEnquiry {
		margin-top: 0px;
		padding: 10px;
		color: var(--Primary-Color);
		width: 100% !important;
		max-width: 250px;
		font-size: 11pt;
		font-weight: bold;
	}

	.invisibleDefaultButton {
		display: none;
		color: transparent;
		background-color: transparent;
	}

	.btnToolbar {
		color: #303030;
		background-color: white;
		border-style: solid;
		border-color: #DDDDDD;
		border-width: 1px;
	}

	/*--------------- HYPERLINKS ---------------*/
	.lnkButton {
		display: inline-block;
		padding: 5px;
	}

	.hlnkTC {
		color: #0d8599;
		font-weight: bold;
		font-size: 11pt;
		text-decoration: none;
	}

	/*Viewport list*/

	.iPhone5 {
		display: none;
	}

	.iPhone6 {
		display: none;
	}

	.iPhone6Plus {
		display: none;
	}

	.iPhoneX {
		display: none;
	}

	.SmallTablet {
		display: none;
	}

	.iPad {
		display: none;
	}

	.iPadPro {
		display: none;
	}
	/*--------------- PANELS ---------------*/
	.pnlPromotion {
		padding: 5px;
		background-color: red;
		text-align: center;
		font-weight: 600;
	}

	.signInPanel {
		width: 100%;
		margin: auto;
	}

	.pnlServerMessage {
		background-color: #EFF1A7;
		width: 100%;
		padding-top: 10px;
		padding-bottom: 10px;
	}

	.shoppingCartBorder {
		border: 1px solid rgba(0,0,0,0.1);
		width: 100%;
		--bs-gutter-x: 0 !important;
	}
	/*--------------- IMAGES ---------------*/
	.imgAbout {
		width: 100%;
		max-width: 500px;
	}

	.imgLogoFooter {
		width: 100%;
		max-width: 150px;
	}

	.imgNews {
		width: 100%;
		max-width: 400px;
	}

	.imgMainLogo {
		width: 100%;
		max-width: 150px;
	}

	.imgRSADocumentsLogo {
		max-width: 180px;
	}

	.imgClock {
		max-width: 16px;
		position: relative;
		/*margin-top: 10px;*/
	}

	.imgProductListing {
		padding-top: 5px;
		padding-bottom: 5px;
		max-width: 250px;
		max-height: 250px;
	}

	.imgGoogleReviews {
		padding-top: 5px;
		padding-bottom: 5px;
		max-width: 150px;
		max-height: 150px;
	}

	.imgShopProdFlex {
		display: flex;
		justify-content: center;
		align-items: center;
	}

	.imgShopProd {
		max-width: 100%;
		/*width: 100%;*/
		max-height: 320px;
	}


	/*--------------- SCROLL TO TOP ---------------*/
	#myBtn {
		position: fixed;
		bottom: 20px;
		right: 100px;
		z-index: 99;
		border: 1px solid #333;
		outline: none;
		background-color: var(--Primary-Color);
		color: white;
		cursor: pointer;
		padding: 15px;
		border-radius: 4px;
	}

		#myBtn:hover {
			transition: 0.3s;
			background-color: var(--Secondary-Color);
			border: 1px solid white;
		}


	/*--------------- Social Media Icons ---------------*/
	.fixed-button {
		position: fixed;
		left: 10px; /* Adjust the left position as needed */
		padding: 2px;
		z-index: 9999 !important;
		background-color: var(--Primary-Color); /* Button background color */
		color: #fff; /* Button text color */
		border: none;
		border-radius: 5px;
		cursor: pointer;
		width: 45px;
		height: 45px;
	}

	.firstFloat {
		top: 20%; /* Adjust the top position as needed */
		transition: background-color linear 3s;
	}

		.firstFloat:hover {
			transition: background-color linear 0.2s;
			background-color: var(--Secondary-Color);
		}

	.secondFloat {
		top: 27%; /* Adjust the top position as needed */
		transition: background-color linear 3s;
	}

		.secondFloat:hover {
			transition: background-color linear 0.2s;
			background-color: var(--Secondary-Color);
		}

	.thirdFloat {
		top: 34%; /* Adjust the top position as needed */
		transition: background-color linear 3s;
	}

		.thirdFloat:hover {
			transition: background-color linear 0.2s;
			background-color: var(--Secondary-Color);
		}

	.fourthFloat {
		top: 41%; /* Adjust the top position as needed */
		transition: background-color linear 3s;
	}

		.fourthFloat:hover {
			transition: background-color linear 0.2s;
			background-color: var(--Secondary-Color);
		}
	/*--------------- FOOTER ---------------*/



	.mobileMenu {
		display: none;
	}

	/* -------------------------------------------------------------------------------------------- */
	/*--------------- MEDIA QUERIES --------------- */
	/*---All Mobile Sizes (devices and browser) ---------------www.responsinator.com---------------- */
	/* All Mobile Sizes (devices and browser) ---------------www.responsinator.com--------------------
1. 320              Blue   @media screen and (max-width: 320px) 
2. 375, 384         Green  @media screen and (min-width: 321px) and (max-width: 384px)
3. 414              Yellow @media screen and (min-width: 385px) and (max-width: 479px)
4. 568              Gold   @media screen and (min-width: 480px) and (max-width: 568px)
5. 600, 667, 736    Red    @media screen and (min-width: 569px) and (max-width: 767px)
6. 768              Pink   @media screen and (max-width: 959px) 
7. 1024             Normal @media screen and (min-width: 960px) 
----------------------------------------------------------------------------------------------------

LISTED FROM BIG TO SMALL:

/* Larger than standard 960 (devices and browsers) */
	@media screen and (max-width: 1400px) {

		@-ms-viewport {
			width: 100%;
		}
	}

	/* Smaller than standard 960 (devices and browsers) -------------------PINK---------------------------------*/

	@media screen and (max-width: 992px) {

		@-ms-viewport {
			width: 100%;
		}
		.mobileMargin{
			margin-bottom:40px;
		}
		.homePageServices {
			margin-top: 5px;
			margin-bottom: 5px;
		}

		.mobileFlexaRoo {
			display: flex;
			align-items: center;
			flex-direction: column;
		}

		.home-underline {
			display: none;
		}

		.marginleftforhomebutton {
			margin-left: 0;
			margin-top: 20px;
			margin-bottom: 20px;
		}

		.linksHeadings {
			font-size: 35px;
		}

		.linksHeadings1 {
			font-size: 35px;
		}

		.extraPaddingLeft {
			padding-left: 0;
		}
		.dxflGroupCell_Office365{
			padding:0 !important;
		}
		.mobileCentre {
			text-align: center;
			left: 10%;
		}




		.tdSpacer {
			display: none;
		}

		.lblHomeProductName {
			font-size: 20px;
		}

		.lblHomeProductLocation {
			font-size: 9pt;
		}



		.popupCookies {
			width: 500px;
		}

		.searchParameterDesktop {
			display: none;
		}

		.searchButton {
			padding-top: 5px;
			width: 100%;
		}

		.slider {
			height: 300px !important;
		}

		/*    .navbar {
		background-color: #000000 !important;
	}*/

		.mobile {
			display: inline-block !important;
		}

		.desktop {
			display: none !important;
		}

		.bgAboveBoiler {
			justify-content: center;
		}

		.mobileMarginWhatsapp {
			margin-left: 10px;
			margin-right: 10px;
		}

		.div_below_nav {
			margin: 0px;
		}

		.dxmLite_Office365, .dxmLite_Office365 .dxm-item a.dx {
			color: #000000;
		}

			.dxmLite_Office365 .dxm-item.dxm-hovered, .dxmLite_Office365 .dxm-item.dxm-hovered a.dx {
				color: #000000;
			}
	}

	/* Mobile Landscape Size to Tablet Portrait (devices and browsers)----------------------RED------------------- */

	@media screen and (max-width: 767px) {

		@-ms-viewport {
			width: 100%;
		}

		.pl75{
			padding-left:0 !important;
		}
		.pr75 {
			padding-right: 0 !important;
		}
		.productDescription {
			width: 100%;
		}

		.lblShoppingMessage {
			font-size: 10pt;
		}

		.lblShoppingTotal {
			font-size: 12pt;
		}

		.divShoppingBtnAlign {
			text-align: left;
		}

		.masterLogin {
			display: none;
		}

		.mobileMenu {
			display: inline-block;
		}

		.divGreyPanel {
			min-width: 60px;
		}



		.menuLeft {
			display: none;
		}

		.footerLinkMobile {
			display: inline-block;
		}






		.lblOrderConfirm {
			font-size: 10pt;
		}

		.filterVisible {
			display: none;
		}

		.btnVisible {
			display: none !important;
		}

		.sitemapContainer {
			padding-left: 0px;
		}


		.lblAccountMobile {
			font-size: 12pt;
		}

		.divGreyPanelCms {
			padding-top: 8px;
			padding-bottom: 9px;
			border-radius: 3px;
			padding-left: 3px;
			padding-right: 5px;
		}


		.btnBack {
			display: none;
		}



		#myCookieConsent {
			font-size: 10px;
		}

		.bannerImageDesktop {
			display: none !important;
		}

		.bannerImageMobile {
			display: inline-block !important;
		}
	}

	/* Mobile Landscape Size to Tablet Portrait (devices and browsers)----------------------Gold------------------- */

	@media screen and (max-width: 568px) {

		@-ms-viewport {
			width: 100%;
		}

		.lblSearchParameters {
			font-size: 14px;
		}

		.txtSignInEmail {
			width: 100%;
			min-width: 250px;
		}

		.divGreyPanel {
			min-width: 60px;
		}







		.txtSignInEmail {
			width: 100%;
			min-width: 250px;
		}


		.bannerHeading {
			font-size: 30pt;
			color: var(--Primary-Color);
		}

		.containerSpacing {
			padding-top: 20px;
			padding-bottom: 20px;
		}
	}

	/* Mobile Landscape Size to Tablet Portrait (devices and browsers)----------------------Yellow------------------- */

	@media screen and (max-width: 479px) {

		@-ms-viewport {
			width: 100%;
		}

		.checkoutTotals {
			text-align: left;
		}

		.productTotal {
			text-align: left;
		}

		.hlnkFooter {
			font-size: 10pt;
		}

		.lblHomeProductName {
			font-size: 18px;
		}


		.btnSaveClose {
			width: 100%;
		}

		.lblAdvertisedPrice {
			font-size: 11pt;
		}

		.lblretailPrice {
			color: black;
			font-size: 10pt;
		}

		.featured100 {
			width: 100% !important;
		}



		.containerSpacing {
			padding-top: 20px;
			padding-bottom: 20px;
		}
	}

	/* Mobile Landscape Size to Tablet Portrait (devices and browsers)----------------------Green------------------- */

	@media screen and (max-width: 384px) {

		@-ms-viewport {
			width: 100%;
		}
		.navbrand {
			max-width: 250px !important;
		}
		.slider {
			max-height: 200px;
		}

		.col-full {
			width: 100% !important;
		}

		.featured100 {
			width: 100% !important;
		}

		.hlnkFooter {
			font-size: 11pt;
		}

		.txtSignInEmail {
			width: 100%;
		}


		.socialMediaDesktop {
			display: none;
		}


		.lblAccountMobile {
			font-size: 9pt;
		}



		.containerSpacing {
			padding-top: 20px;
			padding-bottom: 20px;
		}
	}

	/* All Mobile Sizes (devices and browser) --------------------------------------------BLUE*/

	@media screen and (max-width: 320px) {
		@-ms-viewport {
			width: 100%;
		}

		.lblCartItems {
			padding-left: 8px;
			font-size: 7pt;
		}

		.txtSignInEmail {
			width: 100%;
			min-width: 220px;
		}

		.containerSpacing {
			padding-top: 20px;
			padding-bottom: 20px;
		}
	}
	/*----------------------------------------------------------- END QUERY ----------------------------------------------------------- */
