.ccPageHeaderFirstRow {
	
	background-color: #F8F9FA;
	
	padding-top: 5px;
	padding-bottom: 5px;
}

.ccPageHeaderDesktopCenteredDiv {
	
	padding-top: 10px; 
	padding-bottom: 10px;
}

.ccDesktopHeaderMenuLogo {
	
	max-width: 200px;
	
	display: inline-block;
	
	cursor: pointer;
	
	text-decoration: none;
}

.ccDesktopHeaderMenuLogo>img {
	
	height: auto;
	
	object-fit: contain; 
}

.ccDesktopHeaderMenuButton {
	
	color: #263238;
	
	font-family: var(--ccUIFontFamily);
	font-size: 18px;
	
	line-height: 18px;
	
	padding: 10px 0px 10px 0px;
	
	text-decoration: none;
	
	display: inline-block;
	
	position: relative;
	
	margin-left: 20px;
}

.ccDesktopHeaderMenuButton:hover {
	
	color: var(--ccMainColor01);
}
	
.ccDesktopHeaderMenuButton:after {
	
	content: "";
	
	height: 4px;
	
	width: 0%;
	
	background-color: var(--ccMainColor01);
	
	transition: all 0.3s ease;
	
	position: absolute;
	
	top: 40px;
	left: 50%;
}

.ccDesktopHeaderMenuButton:hover:after {
	
	content: "";
	
	height: 4px;
	
	width: 100%;
	
	left: 0%;
}

.ccUIHeaderSearchFieldContainer {
	
	border-radius: 20px;
	
	background-color: #FFFFFF;
	
	padding: 5px 5px 5px 15px;
	
	box-sizing: border-box;
		
	border: solid 1px #D9D9D9;
}

.ccUIPageHeaderFont {

	color: #000000; 
	
	font-family: var(--ccUIFontFamily); 
	font-size: 16px;
	
	line-height: 26px;
	
	text-decoration: none;
}

.ccUIPageHeaderContactInformationAnchor {
	
	background-size: 15px 15px;
	background-position: left center;
	background-repeat: no-repeat;
	
	font-size: 15px;
	line-height: 15px;
	
	padding-left: 20px;
	
	margin-bottom: 10px;
	
	display: inline-block;
	
	cursor: pointer;
}

.ccUIPageHeaderImageButton {
	
	cursor: pointer;
	
	background-color: #000000;
	
	border-radius: 100%;
	
	padding: 8px;
	
	display: inline-block;
	
	line-height: 0px;
	
	transition: all 0.3s ease;
}

.ccUIPageHeaderImageButton:hover {
	
	background-color: var(--ccMainColor01);
}

.ccUIPageHeaderImageButton>img {
	
	width: 18px;
	height: 18px;
}

@keyframes ccOnScrollHeaderMenuKeyFrame {
	
    from { opacity: 0; }
    to { opacity: 1; }
}

.ccOnScrollDetachedHeaderMenuHidden {
	
	visibility: hidden;
	
	position: fixed;
	
	display: none;
}

.ccOnScrollDetachedHeaderMenuVisible {

	animation-name: ccOnScrollHeaderMenuKeyFrame;
	animation-duration: 1.0s;
	animation-fill-mode: forwards;
	animation-iteration-count: 1;
	animation-timing-function: ease-in-out;
	
	visibility: visible;
	
	top: 0px;
	left: 0px;
	
	width: 100%;
	
	position: fixed;
	
	z-index: 200;
	
	background-color: #FFFFFF;
	
	display: block;

	box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.70);	
}

.ccPageHeaderMyAccountButton {
	
	width: 22px; 
	height: 22px;
	
	cursor: pointer;
}