body, html { font-size: 14px; height: auto; }
/*h1 { font-size:unset; }
h2 { font-size:unset; }*/
h3 { font-size:1.3em; }

body:not(.dev):not(.mce-content-body) {
	margin:0 auto; 
	min-height: 100vh;
	min-height: 100dvh;
	display: grid;
	grid-template-rows:50px minmax(700px,auto) 1fr;
}
body.main-middle:not(:has(menu.navbar)) { grid-template-rows:minmax(700px,auto) 1fr; }
body:not(.dev):not(.mce-content-body).no_footer { grid-template-rows:minmax(700px,auto); }

a { color: var(--a-link); transition: color .25s ease-in-out; }
@media (hover: hover) { a:hover{ color:var(--a-link-hover); }}

@media (hover: hover) { 
	body:not(.noline) main section[data-type=text] a:not(.abtn):not(.noline) {
	  background: linear-gradient(0deg, var(--a-link), var(--a-link)) no-repeat right bottom / 0 2px;
	  transition: background-size .3s;
	  padding-bottom: 2px;
	  color:var(--a-link);
	}
	body:not(.noline) main section[data-type=text] a:not(.noline):not(.b-icn):where(:hover, :focus-visible) {
	  background-size: 100% 2px;
	  background-position-x: left;
	  color:var(--a-link-hover) !important;
	}
}

p, li, li ul li  {
	font-family: "Roboto", sans-serif;
	font-size: 16px;
    line-height: 175%;
 }
li ul li  { font-size: 16px; }

div.hr {
	border-top:1px solid var(--light-border);
	margin-block: 20px;
	height: 1px;
	width: 100%;
}
div.hr.less { margin-block: 10px; }
div.hr.soft { border-top-color:rgba(0,0,0,.075); }
div.hr.dash { border-top-style: dashed; }
div.hr.logo { height:20px; margin-top: 20px; position: relative; }
div.hr.logo::before {
	font-family: "kui";
	content: "\e952";
	font-size: 52px;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	line-height: 1;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	position: absolute;
	top: -30px;
	left: 50%;
	background: white;
	padding-inline: 10px;
	transform: translateX(-50%);
	color: rgba(0,0,0,.75);
}

.bdiv { 
	border-bottom:1px solid var(--light-border) !important;
	padding-bottom: 20px;
	margin-bottom: 20px;
 }

.pg-hdr p { margin:0; }
.pg-hdr picture img, .img-pg-hdr { border-bottom: 8px solid; user-select: none; -webkit-user-select:none; }
.mobile .pg-hdr picture img, .mobile .img-pg-hdr { object-fit: cover; height: 350px; border-bottom: 4px solid; }
.tablet .pg-hdr picture img, .tablet .img-pg-hdr { object-fit: cover; height: 400px; }

section.bthr {
	border-bottom:1px solid var(--light-border);
	margin-bottom: 40px !important;
	padding-bottom: 40px !important;
}

/********************/
/*     scrollUp     */
/********************/

#scrollUp {
	position: fixed;
	width: 40px;
	bottom: 20px;
	right: 30px;
	z-index: 50000;
	background-color: rgba(44, 44, 48, .8);
	transition: bottom .3s ease-in-out;
}
.mobile #scrollUp, .tablet #scrollUp { bottom: 20px; right: 20px;}

/******************/
/*     Images     */
/******************/

.ux-picture { width: max-content; position: relative; }
.ux-picture.center { margin-inline: auto;  }
.ux-picture.center img { margin-inline: auto; }
.ux-picture.fleft { float: left; margin-right: 40px; }
.ux-picture.fright { float: right; margin-left: 40px; }
.mobile .ux-picture.mfull { margin-inline: auto; float: unset; }
.ux-picture.rounded img { border-radius:10px; }
.ux-picture.maxw img { width:100%; }
.ux-picture.border { border: 10px solid rgba(0,0,0,.09); border-radius: 20px; }
/*	shadow center*/
.ux-caption { 
	position: absolute;
	bottom: 10px;
	width: 100%;
	background-color: rgba(0,0,0,var(--opacity,.7));
	color: white;
	padding: 5px 20px;
	text-align: center; 
	text-shadow: 1px 1px 1px black;
}
.ux-caption.center {
    width: calc(100% - 20px);
    margin-inline: 10px;
    border-radius: 5px;
}

/********************************/
/*     Module: Audio Player     */
/********************************/

.audio_player img {
	width: 100px;
	border-radius: 12px;
	box-shadow: 0px 0px 0px 4px rgba(0,0,0,.1);
	border: 3px solid white;
}
.audio_player {
	display: flex;
	gap: 20px;
	width: 500px;
	margin-inline: auto;
	padding: 20px 10px;
	border-radius: 10px;
	justify-content: center;
	background: rgba(0,0,0,.045);
	box-shadow: 0 0 5px 0px rgba(0,0,0,.35);
	--plyr-color-main: #437ee2;
	--plyr-audio-controls-background: transparent;
}
.mobile .audio_player { width:100%; }
.audio_player .player {
	display: flex;
	flex-direction: column;
	justify-content: center;
}
.audio_player .title {
	text-align: center;
	font-size: 18px;
	font-weight: bold;
}


/**********************/
/*     Page Hero     */
/**********************/

.noborder .hero { border-bottom:0; }

.hero { position:relative; border-bottom:8px solid; }
.mobile .hero { border-bottom: 4px solid; }

.hero picture img { width:100%; }
:is(.tablet,.mobile) .hero picture img { object-fit: cover; height: 300px; }

.mobile .hero img.noborder, .noborder .hero img, .hero img.noborder { border-bottom:0; }

.h100p .hero { height:100%; }
.h100p .hero picture, .h100p .hero picture img,
.h100p .hero img { height: 100%; object-fit: cover; }

.nominh .hero { min-height:unset !important; }

.desktop.wide .hero { min-height:500px; }
.desktop.wide .no_min .hero { min-height:unset; }
:is(.tablet,.mobile) .no_min .hero picture img { height: 250px; }

.hero .text { bottom:30px; }

.shaded .hero .text {
	background-color: rgba(0,0,0,.5);
	border-radius: 9px;
	padding: 20px;
}
.shaded .hero .text h1,
.shaded .hero .text h5 { 
	background-color:unset; 
	padding:0; 
	margin:0;
	margin-top:10px; 
	padding-inline: 20px; 
}

.hero .text h1 {
	display: inline;
	font-size: 36px;
	color: #fff;
	text-shadow: 1px 1px 4px rgba(0,0,0,.8);
	padding: 6px 20px 4px 20px;
	background-color: rgba(0,0,0,.5);
	border-radius: 9px;
	text-wrap: balance;
}
.tablet .hero .text h1 { font-size:30px; }
.mobile .hero .text h1 { font-size:22px; display:block; }
.hero .text h5 {
	color: var(--white);
	padding: 10px 30px;
	text-shadow: 1px 1px 1px rgba(0,0,0,.65);
}

.hero .cta { }

.hero .cta.center {
	position: absolute;
	left: 50%;
	bottom: 40px;
	padding: 0 40px 40px;
	transform: translate(-50%,-50%);
	background: rgba(255,255,255,.1);
	border: 2px solid rgba(255,255,255,.35);
	line-height: 40px;
	font-size: 14pt;
	height: 40px;
}

.desktop:not(.wide) .hero .cta.center {
	bottom: 20px;
	height: 30px;
	line-height: 30px;
	padding: 0 30px 30px;
	font-size: 12pt;
}

.tablet .hero .cta.center,
.mobile .hero .cta.center {
	bottom: 10px;
	height: 24px;
	line-height: 24px;
	padding: 0 24px 24px;
	font-size: 11pt;
}

/***************************/
/*     Decks and Cards     */
/***************************/

/*.deck {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	margin-inline: auto;
	gap:15px;
}

.desktop.wide .deck { max-width: 1280px; }

.card {
	width: 350px;
	height: 250px;
	position: relative;
	cursor: pointer;
	border-radius: 8px;
	background-color: black;
	transition: box-shadow .35s ease;
}

.desktop.wide .card { width:calc((100%/3) - 15px) }
.mobile .card { width:calc(100% - 22px); }

.card_img { overflow: hidden; border-radius: 8px; height: 250px; }
.card_img img {
	height: 100%;
	width: 100%;
	object-fit: cover;
	transition: transform .85s ease;
}

.card-arrow {
	width: 30px;
	font-size: 24px;
	position: absolute;
	right: 20px;
	bottom: 20px;
	height: 36px;
}
@-webkit-keyframes slide { 0%, to { transform: translate(0) }	50% { transform: translate(10px) }}
@keyframes slide { 0%, to { transform: translate(0) }	50% {	transform: translate(10px) }}

@media (hover: hover) { 
	.card:hover { box-shadow: 0 0 0px 6px rgba(0,0,0, .15); }
	.card:hover .card_img img { transform:scale(1.1); }
	.card:hover .card-arrow { animation: slide 1.3s ease-in-out infinite; }
}

.card-content {
	background: linear-gradient(
		rgba(0, 0, 0, 0.0) 0%,
		rgba(0, 0, 0, 0.1) 5%,
		rgba(0, 0, 0, 0.2) 10%,
		rgba(0, 0, 0, 0.5) 30%,
		rgba(0, 0, 0, 0.6) 40%,
		rgba(0, 0, 0, 0.7) 60%,
		rgba(0, 0, 0, 0.8) 70%,   
		rgba(0, 0, 0, .9) 100%
    );
	min-height: 90px;
	border-radius: 0 0 10px 10px;
	color: white;
	padding: 10px;
	display: flex;
	flex-direction: column;
	position: absolute;
	bottom: 0;
	width: 100%;
	transition: background-color .3s ease-in-out;
}
.card-content.row { flex-direction:row; }

.card-content:has(.card-subtitle:empty) { min-height:60px; }
.card-content:has(.card-subtitle:empty) .card-arrow { bottom:13px; }

.card-title {
	font-size: 22px;
	font-weight: bold;
	color: white;
	margin-bottom: 5px;
	font-family: Lato;
	text-shadow: 1px 1px 1px rgba(0,0,0,.8);
	text-wrap: balance;
	width: calc(100% - 50px);
	padding-left: 10px;
}
.card-subtitle {
	text-shadow: 1px 1px 1px rgba(0,0,0,.8);
	width: calc(100% - 50px);
	padding-left: 10px;
}
.card-subtitle:empty { display:none; }*/

/***********************/
/*     Video Embed     */
/***********************/

/* Embedded Video Related  */
p.video_frame {
	margin: 0 auto;
	width: max-content;
	border: 6px solid rgba(255, 255, 255, 0.35);
	border-radius: 5px;	
}

p.video_frame iframe { display: block; }
.mobile p.video_frame iframe { width: 100%; aspect-ratio: 16/9; height: 100%; }

.video16x9 {
	aspect-ratio: 16/9;
  	width: 100%;
  	height: auto;
  	border-radius: 10px; 
}

/***********************/

.main-middle main {
	height:calc(100vh - 50px); /* 50px Header */
	min-height: 400px;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
}
.main-middle:not(:has(menu.navbar)) main { height:calc(100vh); }

.main-middle footer { margin-top:0; }

.main-middle main section {
	height: 100%;
	width: 100%;
	max-width: 100%;
	margin:0;
	display: flex;
	align-items: center;
	justify-content: center;
}
.main-middle main.nonone section.none { display:flex }

.main-middle main section.none { display:none; }

body:not(.admin) section.w100p {
	width:100%;
	max-width: unset;
	padding:0;
	margin:0;
	border:0;
}
section:not(.w100p) .section { padding-inline:24px; }

section.h100p, section.h100p .section { height:100vh; }
section.h100p:first-of-type, section.h100p:first-of-type .section { height:calc(100vh - 50px); }

body:not(.admin) section { 
	position: relative; 
	max-width: 1200px;
	margin: 0 auto 10px;
}

section.w100p.boxed .section {
	max-width: 1200px;
	margin: 0 auto 10px;
}
.mobile section.w100p.boxed .section { padding:20px; }

.desktop .boxed { width: 1200px; margin-inline: auto; }
.tablet .boxed, .mobile .boxed { width: 96%; margin-inline: auto; }

/*.admin section.off.show { display: block; }*/
.admin section.off {
  background-color: rgba(255,255,255,.15);
  opacity: .65 !important;
/*  display: none;*/
}

section h1:first-child, section h2:first-child, section h3:first-child, 
section h4:first-child, section h5:first-child { padding-top: 20px; }

h1 { 
	font-family: var(--title);
	font-size: 2.35em;
	margin-block: 20px 20px;
	letter-spacing: -0.5px;
	font-style: italic;
	text-wrap: balance;
}
.mobile h1 { font-size: 2.05em; }

section h1.tight:first-child, h1.tight { padding:0; margin:0; }

h2 { 
	font-family: var(--title);
	font-size: 1.85em;
	margin-block: 10px;
	letter-spacing: -0.5px;
	font-style: italic;
}
.mobile h2 { font-size: 1.55em; }

p { margin-block: 14px; }

ul { 
	margin-block: 14px;
	padding:0;
/*	padding-inline: 24px 0;*/
	list-style: square; 
	padding-left: 30px;
}
ul li::marker { color:var(--prime); }

/* --------~~~~~~~~ Blockquote ~~~~~~~~-------- */

blockquote {
	font-family: 'Source Serif Pro', serif;
  	font-size: var(--blockquote-size,2em);
	width: 75%;
	margin: 40px auto;
	position: relative;
	font-style: italic;
	line-height: var(--blockquote-line-height);
}

blockquote:before {
	position: absolute;
  	font-size: var(--blockquote-q-size,2em);
  	color: rgba(0,0,0,.25);
	content:'\201C'; 
	left: -50px; 
	top: var(--blockquote-top,-20px);
}


blockquote.quote:before {
	content: '"';
	position: absolute;
	left: -35px;
	top: -20px;
	font-family: Georgia;
	font-style: italic;
	font-size: 2.7em;
	color: rgba(0,0,0,.15);
}

/*blockquote, blockquote p {
	font-family: 'Source Serif Pro', serif;
	font-size: 1.5em;
	width: 75%;
	margin-inline: auto;
	position: relative;
}*/

blockquote.define {
	margin-block: 10px 30px;
	font-size: 1.35em;
	width: 90%;
	line-height: 175%;
	font-weight: normal;
}
blockquote.define .large {
	font-size: 1.4em;
	line-height: 185%;
}
blockquote.define .dotted { border-bottom: 1px dotted rgba(0,0,0,.55); }
blockquote.define .dotted.red { border-color:red; border-width:2px; }

blockquote.right {
	float: right;
	width: 40%;
	padding: 40px;
}

.quote_source {
	font-size: .7em;
	color: rgba(0,0,0,.4);
	margin-left:20px;
}
.quote_source:before { content:"~ "; }
.quote_source a { color: rgba(0,0,0,.4); border-bottom: 1px dotted rgba(0,0,0,.55); transition: color .2s ease-in-out; }
@media (hover: hover) { .quote_source a:hover { color:var(--blue); } }



/*blockquote {
	font-family: 'Source Serif Pro', serif;
	font-size: 1.35em;
	width: 75%;
	margin: 20px auto;
	position: relative;
}

blockquote:before {
	position: absolute;
  	font-size: 2em;
  	color: rgba(0,0,0,.25);
}
blockquote:before { content:'\201C'; left: -40px; }
*/

/*---------------
   Social Links
-----------------*/

/*-----------------------------------------------------*/

a.clr {
	padding: 5px 15px 4px;
	border-radius: 5px;
	transition: all .25s ease-in-out;
}
a.clr:focus, a.clr:hover {
	background-color: rgba(0,0,0,.75);
	color: white;
}

span.dropcap {
	display: block !important;
	float: left;
	font-family: Vollkorn !important;
	font-size: 2.5em;
	background-color: rgba(255,255,255,.9);
	margin: 8px 10px -5px 0;
	font-weight: bold;
	border-radius: 2px;
	color: rgba(0,0,0,0.8);
	position: relative;
	height: 50px;
	width: 50px;
}
span.dropcap span.letter {
	position: absolute;
	left: 50%;
	top: 58%;
	transform: translate(-50%,-50%);
}


/*---------------
   Social Links
-----------------*/

.social-links { 
	gap: 60px;
	height: 60px;
	margin-top: 30px; 
}

.social-links a { 
	height: 40px;
	position: relative;
	transition: color .1s ease-in-out, transform .3s ease-in-out;
	color: rgba(255, 255, 255, 0.6);
}

.social-links a i { 
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	font-size: 22px;
	width:20px;
	height:22px;
	color:inherit;
/*	transition: all .3s ease-in-out;*/
}

@media (hover: hover) { .social-links a:hover { color:var(--social-links-hover); transform: scale(1.3); } }

/*---------------
   Social Links
-----------------*/

.profile_rnd { 
	padding-block: 40px;
	margin-block: 40px;
	border-top:2px solid var(--prime); 
}

.profile_wrap {
	margin-inline: auto;
	border-radius: 50%;
	width: 150px;
	height: 150px;
	border: 8px solid var(--prime);
	box-shadow: 0px 0px 0px 8px rgba(159, 184, 255, .4);
	position: relative;
	margin-bottom: 30px;
	transition: all .75s ease;
}

@media (hover: hover) { .social-links a:hover { color:var(--prime); transform: scale(1.3); } }

.profile_wrap img { border-radius: 50%; position: relative; z-index: -1; }
.profile_wrap span:before {
	content: '';
	position: absolute;
	width: 100%;
	height: 100%;
	box-shadow: inset 0 0 0 3px rgb(255,255,255,0.75);
	border-radius: 50%;
}

.sociallinks a { color:#737373; font-size: 24px; }
@media (hover: hover) { 
	.sociallinks a:hover i { color:var(--prime); animation:flip ease-in-out .3s both 1; }
}

.col {
	flex:0 0 calc(50% - 20px);
	max-width:calc(50% - 20px);
	margin:10px;
}

.mobile .col { 
	flex: 0 0 calc(100% - 20px);
	max-width: calc(100% - 20px);
}

.w75g20 { width: calc(75% - 20px); }
.tablet .tw55g20 { width: calc(55% - 20px); }
.tablet .tw45p { width:45%; }
.hm300 img { max-height:300px; }
.tablet .thm400 img, .mobile .mhm400 img { max-height:400px; max-width: unset; }

.cols { display: flex; flex-wrap: wrap; gap: 20px; }
.cols.ac { align-items: center; }
.mobile .cols.mcols100 div { width:100%; }

/* ----~~~~ Breadcrumbs ~~~~---- */

.crumbs {
	display: flex;
	gap: 20px;
	align-items: center;
	justify-content: center;
	margin-block: 40px 20px;
}
.mobile .crumbs { flex-direction: column; }

.crumbs a {
	position: relative;
	color: #333;
	border: 1px solid rgba(0,0,0,.25);
	padding: 5px 14px;
	border-radius: 4px;
	background-color: rgba(0,0,0,.1);
	box-shadow: 2px 2px 2px rgba(0,0,0,.15);
	cursor: pointer;
	transition:all .2s ease-in-out;
	&:is(:hover) {
		background-color: rgba(0,0,0,.2);
	}
	&:is(:focus,:active) {
		top: 2px;
		left: 2px;
		box-shadow: none;	
	}
}

/* ----~~~~ Featured Url ~~~~---- */

.featured {
	display: flex;
	gap: 20px;
	background: rgba(0,0,0,.08);
	padding: 20px;
	border-radius: 10px;
}
.mobile .featured { flex-direction: column; }
.feat_img { min-width: 200px; }
.mobile .feat_img { width: 100%;  min-width: 100%; }

.feat_img a img:hover { box-shadow:0 0 3px 2px rgba(0,0,0,.25);   }

.feat_img img { width:100%; max-height:150px; border-radius: 10px; transition:all .3s ease-in-out; }
.feat_img button { width: 100% !important; margin-top: 10px; }

.feat_title { font-weight:bold; font-size:20px; margin-bottom:0; }
.feat_sub_title { font-size:16px; margin:5px 0 20px 20px; }

.feat_desc button { margin:20px auto 0; }