/*!
Theme Name: High Camp Home
Theme URI: http://underscores.me/
Author: Dave Granvold
Author URI: http://specimenbox.com
Description: Custom Wordpress Template for High Camp Home
*/



/*
	*** SITE WIDE ***
*/
a[href^="tel"]{
    color:inherit;
    text-decoration:none;
}
body { 
	font-family: "Metropolis Regular", Helvetica, Arial, sans-serif; font-style: normal;
	letter-spacing:0.075em;
    background:#efece6;
	color:#261e1b;
	font-size:12px;
	line-height:100%;
}

@media screen and (prefers-color-scheme:dark) {
  body {
    background:#efece6;
	color:#666666;
  }
}

html, body { 
	margin:0;
	padding:0;
	overflow-x:hidden;
	-webkit-font-smoothing:antialiased !important;
	-moz-osx-font-smoothing:grayscale !important;
	-webkit-tap-highlight-color:rgba(0,0,0,0) !important;
	-webkit-text-size-adjust:100% !important;
}
img		{ -ms-interpolation-mode:bicubic; border:0; outline:none; padding:0; margin:0; }
p, div, h1, h2, h3, h4, h5	{ padding:0; margin:0; }
a		{ outline:none; padding:0; margin:0; }
img.rollover { cursor:pointer; }

h1 {
    margin-block: 0;
	font-family: 'Metropolis Regular'; 
    font-size: 20px;
	text-align:center;
    text-transform: uppercase;
    padding: 0px 0 24px 0;
    letter-spacing: 0.3em;
}

.CF { clear:both; height:0; font-size:1px; line-height:0px; }

@font-face {
	font-family: 'Metropolis Light'; 
	src: local('Metropolis Light'), url('fontsM/Metropolis-Light.woff') format('woff'); 
	font-weight: normal; font-style: normal;
}
@font-face {
	font-family: 'Metropolis Extra Light'; 
	src: local('Metropolis Extra Light'), url('fontsM/Metropolis-ExtraLight.woff') format('woff'); 
	font-weight: normal; font-style: normal;
}
@font-face {
	font-family: 'Metropolis Regular'; 
	src: local('Metropolis Regular'), url('fontsM/Metropolis-Regular.woff') format('woff'); 
	font-weight: normal; font-style: normal;
}
    @font-face {
    font-family: 'Metropolis Bold';
    src: local('Metropolis Bold'), url('fontsM/Metropolis-Bold.woff') format('woff');
    font-style: normal; font-weight: normal;
    }
	
    @font-face {
		font-family: 'Metropolis Thin';
		src: local('Metropolis Thin'), url(fontsM/'Metropolis-Thin.woff') format('woff');
 		font-style: normal; font-weight: normal;
   }

.pageTitle h1 {
	font-family:'Metropolis Extra Light';
	margin-block: 0;
	margin-inline: 0;
    font-size: 20px;
    text-align: center;
    text-transform: uppercase;
    padding: 121px 0 25px 0;
    letter-spacing: 0.14em;
}



a:link    {text-decoration:none; color:#261e1b; }
a:visited {text-decoration:none; color:#261e1b; }
a:hover   {text-decoration:none; color:black; }
a:active  {text-decoration:none; color:black; }



/*
	*** TOP BAR:LOGO ***
*/
#divTopBar { 
	height: 93px;
    padding: 24px 83px 0 83px;
    position: fixed;
    z-index: 9999;
    top: 0;
    width: calc(100% - 166px);
	background-color:#efece6;
} 
@media only screen and (max-width:1025px) { #divTopBar { padding:24px 25px 0px 25px; width:calc(100% - 50px);} }
@media only screen and (max-width:499px)  { #divTopBar { height:95px; } }

#divLogo { 
	float:left; 
	margin-top: -6px;
	width:250px;
	opacity:1.0;
}
#divLogo:hover{ cursor:pointer; }
@media only screen and (max-width:350px) { #divLogo { width: 200px; } } 


/*
	*** PRIMARY NAV ***
*/

#divPriNav   { display:block; position:fixed; z-index:2; right:83px; top:33px; }
@media only screen and (max-width:1025px) { #divPriNav { right:25px; } }
@media only screen and (max-width: 813px) { #divPriNav { display:none; } }

#divMenuIcon { display:none; position:fixed; z-index:2; right:25px; top:42px; width:32px; height:32px; }
@media only screen and (max-width:813px) { #divMenuIcon { display:block; } }

.navMarks {
	display:none;
	position:fixed;
	height:54px;
	z-index:-1;
	background:#e6e4dd;
	top:0px;
}
@media only screen and (max-width:813px) { .navMarks { display:none !important; } }

#markProjects { right:437px; width:93px; }
@media only screen and (max-width:1025px) { #markProjects { right:379px; } }

#markTeam   { right:378px; width:55px; }
@media only screen and (max-width:1025px) { #markTeam { right:320px; } }

#markAbout  { right:307px; width:68px; }
@media only screen and (max-width:1025px) { #markAbout { right:249px; } }

#markPress    { right:241px; width:65px; }
@media only screen and (max-width:1025px) { #markPress { right:182px; } }

#markContact  { right:153px; width:88px; }
@media only screen and (max-width:1025px) { #markContact { right:94px; } }

.classPriNavItemSHOP {
    border-left: 1px #cccccc solid;
    margin-left: 19px;
    height: 30px;
    margin-top: -8px;
    line-height: 29px !important;
}
.classPriNavItemSHOP:hover { cursor:pointer; color:#000000 !important; }

.classPriNavItem {
	padding:0 0 0 20px;
    letter-spacing: 0.19em;
    font-family: 'Metropolis Regular';
	font-size:11px;
	line-height:15px;
}

.classPriNavItem:hover{ cursor:pointer; color:#000000; font-family:'Metropolis Bold'; }

.classPriNavItemMarked {
    font-family: 'Metropolis Bold';
	letter-spacing:0.1em;
}



/*
	*** POP UP MENU ***
*/
#divPopupMenu { display:none; position:fixed; left:0; top:0; z-index:10000; background-color:#261e1b; width:calc(100% - 50px); height:100%; padding:18px 25px; }

#divCloseIcon { display:none; position:fixed; z-index:10001; right:29px; top:45px; width:25px;  }

#divMenuLogo { width: 250px; padding:0 0 4vh 0; }
#divMenuLogo:hover{ cursor:pointer; }
@media only screen and (max-width:350px) { #divMenuLogo { width: 200px; } } 

.classPriNavItemPopUp {
	font-family: "Metropolis Thin";
	color:white;
	font-size: min(9vh, 13vw);
	line-height:100%;
	opacity:1;
	letter-spacing: 0.02em;
	margin-left:-5px;
	padding-bottom:4vh;
}
@media only screen and (max-width: 500px) { .classPriNavItemPopUp { font-size: min(9vh, 13vw); } }
@media only screen and (max-width: 400px) { .classPriNavItemPopUp { font-size: min(9vh, 12vw); } }
@media only screen and (max-height:540px) { .classPriNavItemPopUp { font-size: min(8vh, 12vw); } }
@media only screen and (max-height:400px) { .classPriNavItemPopUp { font-size: min(7vh, 12vw); } }

a.classPriNavPopup:link     {text-decoration:none; color:white; }
a.classPriNavPopup:visited  {text-decoration:none; color:white; }
a.classPriNavPopup:hover    {text-decoration:none; color:#999999; }
a.classPriNavPopup:active   {text-decoration:none; color:#999999; }

a.classBLOG:link     {text-decoration:none; color:white; }
a.classBLOG:visited  {text-decoration:none; color:white; }
a.classBLOG:hover    {text-decoration:none; color:white; opacity:0.5; }
a.classBLOG:active   {text-decoration:none; color:white; opacity:0.5; }

.classPriNavItemPopUpSHOP {
	color:white;
	font-family: "Metropolis Thin";
 }
@media only screen and (max-width: 500px) { .classPriNavItemPopUpSHOP { font-size: min(9vh, 13vw); } }
@media only screen and (max-width: 400px) { .classPriNavItemPopUpSHOP { font-size: min(9vh, 12vw); } }
@media only screen and (max-height:540px) { .classPriNavItemPopUpSHOP { font-size: min(8vh, 12vw); } }
@media only screen and (max-height:400px) { .classPriNavItemPopUpSHOP { font-size: min(7vh, 12vw); } }



/*
	*** CONTENT ***
*/
ss3-loader {
    display: none !important;
}

.classDivContent { padding:5px 83px 50px 83px; }
@media only screen and (max-width:1025px) { .classDivContent { padding:5px 0 50px 0; } }

.thumbsCat {
	display: grid;
	margin:0;
	grid-template-columns: repeat(5, minmax(0, 1fr));
	grid-gap: 48px 48px;
}
@media only screen and (max-width: 2400px) { .thumbsCat { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media only screen and (max-width: 1800px) { .thumbsCat { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media only screen and (max-width: 1025px) { .thumbsCat { padding:0 25px 25px 25px; } }
@media only screen and (max-width:  850px) { .thumbsCat { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media only screen and (max-width:  600px) { .thumbsCat { grid-template-columns: repeat(1, minmax(0, 1fr)); } }

.thumbHolder { position:relative; }

@media (hover: hover) {
	.thumbHolder:hover { cursor:pointer; }
	.thumbHolder:hover .thumbImg { opacity:0.75; }
	.thumbHolder:hover .thumbTitles {  opacity:0.75; }
}

.thumbImg { width:100%; transition:0.5s; }
.thumbCaps {
    font-size: 17px;
    line-height: 120%;
    padding: 15px 0 0 0;   /* remove left offset */
    text-align: center;    /* center name + title */
    font-family: 'Metropolis Regular';
    letter-spacing: 0.025em;
}

.jobTitles {
    font-size: 14px;
    text-align: center;
}


/*
	*** FOOTER ***
*/
	#hchFooter {
		font-size: 14px;
		line-height:100%;
		font-family: 'Metropolis Extra Light';
		letter-spacing: 0.07em;
		margin: 0px 83px;
		padding: 15px 0 15px 0;
		border-top: 1px solid #261e1b;
		display:block;
		
	}
	@media only screen and (max-width:1025px) { #hchFooter { margin: 0px 25px; } }	
	@media only screen and (max-width: 700px) { #hchFooter { display:none; } }
	
	#hchFooterPhone {
		font-size: 14px;
		line-height:200%;
		font-family: 'Metropolis Extra Light';
		letter-spacing: 0.07em;
		margin: 0px 25px;
		padding: 15px 0 40px 0;
		border-top: 1px solid #261e1b;
		display:none;
	}
	@media only screen and (max-width:700px) { #hchFooterPhone { display:block; } }
	
