/****** HJx Utility Styles ******/


/* ......// Display Styles //...... */

span.avoidwrap { display:inline-block; }

.hide-element {
    border: 0;
    clip: rect(1px 1px 1px 1px); /* IE6, IE7 */
    clip: rect(1px, 1px, 1px, 1px);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}

/*--- only show on mobile --- */
@media (min-width: 576px) {
	.mobile-only {
		display: none;
	}
}

.column-wrap {
    display: flex;
    flex-direction: column;
}

/* ......// Border Radius, pixels //...... */

.brdr-rad-4px {
	border-radius: 4px;
}

.brdr-rad-8px {
	border-radius: 4px;
}

.brdr-rad-12px {
	border-radius: 4px;
}

/* ......// max-width, pixels //...... */

.max-width-400 {
	max-width: 400px !important;
}

.max-width-450 {
	max-width: 450px !important;
}

.max-width-500 {
	max-width: 500px !important;
}

.max-width-550 {
	max-width: 550px !important;
}
.max-width-600 {
	max-width: 600px !important;
}

.max-width-650 {
	max-width: 650px !important;
}

.max-width-700 {
	max-width: 700px !important;
}

.max-width-750 {
	max-width: 750px !important;
}

.max-width-800 {
	max-width: 800px !important;
}

.max-width-850 {
	max-width: 850px !important;
}

.max-width-900 {
	max-width: 900px !important;
}

.max-width-950 {
	max-width: 950px !important;
}

.max-width-1000 {
	max-width: 1000px !important;
}

.max-width-1100 {
	max-width: 1100px !important;
}

.max-width-1200 {
	max-width: 1200px !important;
}

/* ......// bg colors //...... */

.bg-white-80 {
    background-color: var(--white-trans-80) !important;
}

.bg-white-60 {
    background-color: var(--white-trans-60) !important;
}

.bg-black-60 {
    background-color: var(--black-trans-60) !important;
}

.bg-cp-grey-50 {
    background-color: var(--cp-grey-50) !important;
}

.bg-cp-grey-100 {
    background-color: var(--cp-grey-100) !important;
}

.bg-cp-grey-600 {
    background-color: var(--cp-grey-600) !important;
}
.bg-cp-grey-700 {
    background-color: var(--cp-grey-700) !important;
}
.bg-cp-grey-800 {
    background-color: var(--cp-grey-800) !important;
}

.bg-cp-grey-900 {
    background-color: var(--cp-grey-900) !important;
}

.bg-cp-primary-ult-lt {
	background-color: var(--cp-primary-ultra-light) !important;
}

.bg-cp-primary {
	background-color: var(--cp-primary) !important;
}

.bg-cp-primary-md {
	background-color: var(--cp-primary-medium) !important;
}
.bg-cp-primary-md-lt {
	background-color: var(--cp-primary-medium-lt) !important;
}
.bg-cp-primary-dk {
	background-color: var(--cp-primary-dark) !important;
}
.bg-cp-primary-dker {
	background-color: var(--cp-primary-darker) !important;
}
.bg-cp-primary-dkest {
	background-color: var(--cp-primary-darkest) !important;
}

.bg-cp-primary-bold {
	background-color: var(--cp-primary-bold) !important;
}

.bg-cp-primary-comp {
	background-color: var(--cp-primary-comp) !important;
}

/* ......// text styles //...... */

/*** font-family ***/
.txt-narrow {
	font-family: pt-sans-pro-narrow, sans-serif;
}

/*** font-size ***/

.txt-sz-xxxl {
	font-size: calc(2rem + .6vw);
}

.txt-sz-xxl {
	font-size: calc(1.5rem + .6vw);
}

.txt-sz-xl {
	font-size: calc(1rem + .5vw);
}

.txt-sz-lg {
	font-size: calc(.9rem + .5vw);
}

.txt-sz-reg {
	font-size: calc(.8rem + .5vw);
}

.txt-sz-sm {
	font-size: calc(.725rem + .4vw);
}
.txt-sz-xs {
	font-size: calc(.625rem + .4vw);
}

.txt-sz-xxs {
	font-size: calc(.575rem + .4vw);
}

.txt-sz-xxxs {
	font-size: calc(.475rem + .4vw);
}


/*** text color ***/

.txt-white {
color: white;
}
.txt-cp-primary {
color: var(--cp-primary);
}

.txt-cp-primary-lt {
color: var(--cp-primary-light);
}

.txt-cp-primary-ult-lt {
color: var(--cp-primary-ultra-light);
}

.txt-cp-primary-md {
	color: var(--cp-primary-medium);
}

.txt-cp-primary-dk {
	color: var(--cp-primary-dark);
}

.txt-cp-primary-dker {
	color: var(--cp-primary-darker);
}

.txt-cp-primary-dkest {
	color: var(--cp-primary-darkest);
}

.txt-cp-primary-comp {
	color:var(--cp-primary-comp);
}

.txt-cp-bright, .txt-cp-primary-bright {
color: var(--cp-primary-bright) !important;
}

.txt-cp-brighter, .txt-cp-primary-brighter {
color: var(--cp-primary-brighter) !important;
}

.txt-cp-bold, .txt-cp-primary-bold{
color: var(--cp-primary-bold) !important;
}

.txt-cp-secondary {
	color: var(--cp-secondary);
}

.txt-cp-secondary-dk {
color: var(--cp-secondary-dark);
}

.txt-cp-grey-500 {
	color: var(--cp-grey-500)
}
.txt-cp-grey-600 {
	color: var(--cp-grey-600)
}
.txt-cp-grey-700 {
	color: var(--cp-grey-700)
}
.txt-cp-grey-800 {
	color: var(--cp-grey-800)
}
.txt-cp-grey-900 {
	color: var(--cp-grey-900)
}
/*** letter spacing ***/

.txt-ls-s {
	letter-spacing: .08em;
}
.txt-ls-m {
	letter-spacing: .12em;
}
.txt-ls-l {
	letter-spacing: .2em;
}
.txt-ls-xl {
	letter-spacing: .3em;
}

/*** font-weight ***/

.txt-fw-400 {
	font-weight: 400 !important;
}
.txt-fw-500 {
	font-weight: 500 !important;
}
.txt-fw-600 {
	font-weight: 600 !important;
}
.txt-fw-700 {
	font-weight: 700 !important;
}
.txt-fw-800 {
	font-weight: 800 !important;
}