/*
* Tinman.css | v1.0.0 | MIT | July 4th, 2017
* Copyright 2023, Selwyn Orren @ Linuxweb
* Free to use under the MIT license.
* http://www.opensource.org/licenses/mit-license.php
* 04/07/2017
*/

/* Overides
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.button {
	border-style: none;
	outline: none;
	position: relative;
	border-radius: 0;
}
.button:before,
.button:after {
	border-width: 0;
	border-style: solid;
	-webkit-transition: all 0.25s;
	transition: all 0.25s;
	content: '';
	height: 24px;
	position: absolute;
	width: 0px;
}
.button:before {
	border-top-width: 2px;
	left: 0px;
	top: -5px;
}
.button:after {
	border-bottom-width: 2px;
	bottom: -5px;
	right: 0px;
}
.button:hover:before,
.button:hover:after {
	height: 100%;
	width: 100%;
}


/* Home Page Exclusive
–––––––––––––––––––––––––––––––––––––––––––––––––– */
#cd-vertical-nav {
	position: fixed;
	right: 20px;
	top: 50%;
	bottom: auto;
	-webkit-transform: translateY(-50%);
	        transform: translateY(-50%);
	z-index: 10;
}
#cd-vertical-nav li {
	text-align: right;
	list-style: none;
	margin-bottom: 0;
}
#cd-vertical-nav a {
	display: inline-block;
	/* prevent weird movements on hover when you use a CSS3 transformation - webkit browsers */
	-webkit-backface-visibility: hidden;
	        backface-visibility: hidden;
}
#cd-vertical-nav a:after {
	content: "";
	display: table;
	clear: both;
}
#cd-vertical-nav a span {
	float: right;
	display: inline-block;
	-webkit-transform: scale(0.6);
	        transform: scale(0.6);
}
#cd-vertical-nav a:hover span {
	-webkit-transform: scale(1);
	        transform: scale(1);
}
#cd-vertical-nav a:hover .cd-label {
	opacity: 1;
}
#cd-vertical-nav a.is-selected .cd-dot {
	-webkit-transform: scale(1.2);
	        transform: scale(1.2);
	background-color: white;
}
#cd-vertical-nav .cd-dot {
	position: relative;
	/* we set a top value in order to align the dot with the label. If you change label's font, you may need to change this top value*/
	top: 8px;
	height: 12px;
	width: 12px;
	border-radius: 50%;
	background-color: #fff;
	-webkit-transition: background-color 0.5s, -webkit-transform 0.2s;
	transition: background-color 0.5s, -webkit-transform 0.2s;
	transition: transform 0.2s, background-color 0.5s;
	transition: transform 0.2s, background-color 0.5s, -webkit-transform 0.2s;
	-webkit-transform-origin: 50% 50%;
	        transform-origin: 50% 50%;
}
#cd-vertical-nav .cd-label {
	position: relative;
	margin-right: 10px;
	/* padding: .4em .5em; */
	color: #fff;
	font-size: 0.875rem;
	-webkit-transition: opacity 0.2s, -webkit-transform 0.2s;
	transition: opacity 0.2s, -webkit-transform 0.2s;
	transition: transform 0.2s, opacity 0.2s;
	transition: transform 0.2s, opacity 0.2s, -webkit-transform 0.2s;
	opacity: 0;
	-webkit-transform-origin: 100% 50%;
	        transform-origin: 100% 50%;
}

.paralax {
	width: 100%;
	height: 100vh;
	overflow: hidden;
	/* top: 91px; */
	position: relative;
}
.paralax img {
	   -o-object-fit: cover;
	      object-fit: cover;
	z-index: -1;
}
.paralax video {
	-o-object-fit: cover;
	   object-fit: cover;
	aspect-ratio: 16 / 9;
	width: 100%;
}

.paralax .filter {
	z-index: 5;
	position: absolute;
	background: rgba(0, 0, 0, 0.6);
	width: 100%;
	height: 100%;
}
.paralax .content {
	z-index: 99;
	color: #fff;
	text-align: center;
}
.paralax .content small, .paralax .content h1, .paralax .content h2 {
	margin: 0;
	font-weight: 300;
	letter-spacing: initial;
}
 .paralax .content h1, .paralax .content h2  {
	font-weight: 700;
	text-transform: uppercase;
	/*white-space: nowrap;*/
	margin-bottom: 1.25rem;
	font-size: 4rem;
 }
 .paralax .content small {
	white-space: nowrap;
	text-transform: initial;
	margin-bottom: 0;
	font-size: 1.5rem;
 }

/* Layout Structure
–––––––––––––––––––––––––––––––––––––––––––––––––– */
#headerContainer {
	position: fixed;
	width: 100%;
	z-index: 999;
	background-color: rgba(0, 0, 0, 0.2);
	height: 65px;
	-webkit-transition: all 1s;
	transition: all 1s;
	top: 0;
}
	#logo_container {
		position: relative;
		display: block;
		top: 0.5rem;
	}
	.sticky {
		background-color: rgba(0, 0, 0, 1)!important;
		height: 65px;
	}

#mainContainer {
	padding: 4rem 0;
}
	#mainContainer h1 {
		font-size: 4rem;
		letter-spacing: -0.25rem;
		text-transform: uppercase;
		font-weight: 900;
		margin: 0px;
	}
	#mainContainer p {
		font-size: 1.5rem;
		line-height: 1.4;
	}

#resourcesContainer .column, #resourcesContainer .columns {
	margin-bottom: 1.4em;
}

#eventsContainer {
	padding: 0 0 4rem;
}
	#eventsContainer i {
		margin-right: 1rem;
		display: inline-block;
		width:1rem;
		text-align: center;
	}
	#eventsContainer p {
		margin-bottom: 1rem;
	}

#teamContainer {
	padding: 0 0 4rem;
}
	#teamContainer .spacing {
		margin-bottom: 4rem;
	}
	#teamContainer .image-wrapper {
		position: relative;
		height: 100px;
		overflow: hidden;
/*		margin-bottom: 1.4em;*/
/*		padding-bottom: 56.25%; 16:9, for an aspect ratio of 1:1 change to this value to 100% */
		min-height: 400px;
	}
	#teamContainer .image-wrapper img {
		-o-object-fit: cover;
		   object-fit: cover;
		position: absolute;
		top: 50%;
		left: 50%;
		-webkit-transform: translate(-50%,-50%);
		        transform: translate(-50%,-50%);
		-webkit-transition: -webkit-transform 0.8s;
		transition: -webkit-transform 0.8s;
		transition: transform 0.8s;
		transition: transform 0.8s, -webkit-transform 0.8s;
		min-height: 100%;
	}
	#teamContainer .image-wrapper:hover img {
		-webkit-transform: scale(1.1) translate(-50%,-50%);
		        transform: scale(1.1) translate(-50%,-50%);
	}
	#teamContainer .image-wrapper .content-overlay {
	  background: #ffffff;
	  position: absolute;
	  left: 0;
	  top: 0;
	  bottom: 0;
	  right: 0;
	  opacity: 0;
	  -webkit-transition: all 0.4s ease-in-out 0s;
	  transition: all 0.4s ease-in-out 0s;
	}
	#teamContainer .image-wrapper:hover .content-overlay{
	  opacity: 1;
	  z-index: 1;
	}
	#teamContainer h5 {
		margin: 0;
	}
	#teamContainer .content-details {
	  position: absolute;
	  text-align: center;
	  padding-left: 2rem;
	  padding-right: 2rem;
	  width: 100%;
	  top: 50%;
	  left: 50%;
	  opacity: 0;
	  -webkit-transform: translate(-50%, -50%);
	          transform: translate(-50%, -50%);
	  -webkit-transition: all 0.3s ease-in-out 0s;
	  transition: all 0.3s ease-in-out 0s;
	  z-index: 2;
	}
	#teamContainer .image-wrapper:hover .content-details{
	  top: 50%;
	  left: 50%;
	  opacity: 1;
	  cursor:-webkit-grab;
	  cursor:grab;
	}
	#teamContainer .image-wrapper:hover .block {
		background: #000;
		color: #fff;
	}
	#teamContainer .content-details h6{
	  color: #333;
	  font-weight: 500;
	  letter-spacing: 0.15em;
	  margin-bottom: 0.1em;
	  text-transform: uppercase;
	}
	#teamContainer .content-details p{
	  color: #333;
	  font-size:1rem;
	  margin: 0em;
	}
	#teamContainer .fadeIn-bottom{
	  top: 80%;
	}
	#teamContainer .image-wrapper .title {
		background: #fff;
		position: absolute;
		width: 100%;
		bottom: 0px;
	}
	#teamContainer .image-wrapper .title p {
		margin: 0px;
	}


#podcastContainer {
  background: #dddddd;
  padding: 4rem 0;
}
	#podcastContainer a {
	  text-decoration: none;
	  color: #333333;
	}
	#podcastContainer a:hover {
	  text-decoration: bold;
	  color: #00b2ff;
	}

#seriesContainer {
	margin-bottom: 4rem;
}



/* Sub Pages & Detail Pages
–––––––––––––––––––––––––––––––––––––––––––––––––– */
#breadcrumbContainer {
	margin: 65px 0 0;
	padding: 2rem 0;
}
	#breadcrumbContainer h1 {
		font-size: 28px;
		letter-spacing: -1px;
		float: left;
		border-right: solid 1px #222;
		margin-top:10px;
		padding-right: 40px;
		margin-right: 40px;
		color:#222;
		font-weight:bold;
		line-height: 1.2;
	}

	#breadcrumbContainer span {
		display: inline-block;
		padding-top: 15px;
		font-size: 16px;
	}
.card {
  background: #fff;
  -webkit-box-shadow: 0 0 10px #ccc;
          box-shadow: 0 0 10px #ccc;
  padding: 1rem 0;
  margin: 1rem 0;
}
.card p {
	margin-bottom: 0;
}
.video {
  aspect-ratio: 16 / 9;
  width: 100%;
}


/* Navigation Styles
–––––––––––––––––––––––––––––––––––––––––––––––––– */
#navigation {
	position: relative;
	text-align: right;
	margin-bottom: 0px;
	top: 0.6rem;
}

#navigation ul {
	/* float: right; */
	-webkit-transition: .5s;
	transition: .5s;
	display: inline-block;
	margin: 0;
	padding: 0;
}
#navigation li {
	float: left;
	position: relative;
	list-style: none;
	-webkit-transition: .2s;
	transition: .2s;
	padding: 10px 12px;
	color: #fff;
	margin-bottom: initial;
}
#navigation ul ul li:first-of-type {
	/* margin-right: -16px; */
	border-radius: 0 5px 0 0;
}
#navigation ul ul li:last-of-type {
	/* margin-right: -16px; */
	border-radius: 0 0 5px 5px;
}
#navigation li a {
	display: block;
	text-decoration: none;
	color: #fff;
	text-transform: uppercase;
	letter-spacing:1px;
	font-weight: 700;
}
#navigation li a:hover {
	color: #333;
}
#navigation ul ul {
	position: absolute;
	left: 0;
	top: 100%;
	visibility: hidden;
	opacity: 0;
	/* min-width:180px; */
	z-index: 999;
	text-align: left;
}
#navigation li > a:not(:only-child):after {
	content: '\f0d7';
	font-family: FontAwesome;
	float: right;
	margin-left: 10px;
	font-size: 0.5rem;
}
#navigation ul ul ul {
	left: 100%;
	top: 0;
}
#navigation ul ul a {
	min-width:150px;
	color:#333;
	font-weight: 300;
}
#navigation ul li:hover > a {
	color: #333;
}
#navigation li:hover, #navigation li:hover li {
	background: #fff;
	z-index: 999;
}
#navigation li li:hover, #navigation li li:hover li {
	background: #333;
}
#navigation li li:hover a, #navigation li li:hover li a {
	color: #fff;
}

#navigation li:hover > ul {
	visibility: visible;
	opacity: 1;
}

/* Responsive Navigation Styles
–––––––––––––––––––––––––––––––––––––––––––––––––– */
#navigation .menu-btn,
#navigation .menu-icon,
#navigation .sub-toggle {
	display: none;
}

#navigation li.menu-social .social li a {
	min-width: 0; /* not the sub-menu link width */
	padding: 0;
	color: #fff; /* not the sub-menu's dark text */
	font-weight: 400;
	letter-spacing: 0;
}
#navigation li.menu-social .social li a:hover {
	color: #333; /* stays dark on the white hover circle */
}

	#navigation li.menu-social {
		padding: 7px 0 10px 12px;
	}
	#navigation li.menu-social:hover,
	#navigation li.menu-social li,
	#navigation li.menu-social li:hover {
		background: transparent; /* not the menu's white/dark hover */
	}
	#navigation li.menu-social ul.social {
		position: static; /* not a hidden dropdown */
		visibility: visible;
		opacity: 1;
	}
	#navigation li.menu-social li {
		padding: 0;
	}

/* Contact Form
–––––––––––––––––––––––––––––––––––––––––––––––––– */


/* Gallery
–––––––––––––––––––––––––––––––––––––––––––––––––– */


/* Social Icons
–––––––––––––––––––––––––––––––––––––––––––––––––– */
	.social {
    overflow:hidden;
    margin:0; padding:0;
    list-style:none;
  }
		.social li {
			display:inline-block;
		}
		.social li:last-of-type a {
		  margin-right: 0px;
		}
		.social li a {
			font-weight: 400;
			-webkit-transition:.1s;
			transition:.1s;
      -webkit-transform: translateZ(0);
              transform: translateZ(0);

			overflow:hidden;
			text-decoration:none;
			text-align:center;
			display:block;
			position: relative;
			z-index: 1;
			width: 30px;
			height: 30px;
			line-height: 30px;
			font-size: 16px;
			border-radius: 5px;
			margin-right: 10px;
			color: #fff;
			/*background-color: #009BA9;*/
		}

		.social li a:hover {
		    border-radius: 50%;
		    background:  #fff;
		    color: #333;
		}

/* Bottom & Footer
–––––––––––––––––––––––––––––––––––––––––––––––––– */
#bottomContainer {
	padding: 3rem 0;
	/*background: #1b2125;*/
	background: #111111;
	color: #ffffff;
}
	#bottomContainer img {
		margin-top: -4px;
	}
	#bottomContainer i {
		margin-right: 1rem;
		width: 15px;
	}
	#bottomContainer h4 {
		margin-top: 0;
	}
	#bottomContainer h6 {
		margin-top: 1.5rem;
		margin-bottom: 0;
	}
	#bottomContainer p {
		margin: 0rem;
	}
	#bottomContainer a {
		color: #ffffff;
	}
		#bottomContainer a:hover {
			text-decoration: underline;
			text-underline-offset: 5px;
		}

#footerContainer {
	padding: 2rem 0 1rem;
	background: #000000;
	color: #ffffff;
}
	#footerContainer p a {
		color: #ffffff;
	}
	#footerContainer p a:hover {
		font-weight: 600;
		text-decoration: none;
	}
	#footerContainer p, #footerContainer li {
		margin: 0;
		padding: 0;
	}


/* Back to Top
–––––––––––––––––––––––––––––––––––––––––––––––––– */


/* Cookie Cutter
–––––––––––––––––––––––––––––––––––––––––––––––––– */


/* Animations
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.heartbeat {
	-webkit-animation-name: heartbeat;
	        animation-name: heartbeat;
	-webkit-animation-duration: 1.5s;
	        animation-duration: 1.5s;
	-webkit-animation-iteration-count: infinite;
	        animation-iteration-count: infinite;
	-webkit-animation-timing-function: linear;
	        animation-timing-function: linear;
}

@-webkit-keyframes heartbeat {
	0% {
	-webkit-transform: scale(1.1);
	        transform: scale(1.1); }
	50% {
	-webkit-transform: scale(0.8);
	        transform: scale(0.8); }
	100% {
	-webkit-transform: scale(1);
	        transform: scale(1); }
}

@keyframes heartbeat {
	0% {
	-webkit-transform: scale(1.1);
	        transform: scale(1.1); }
	50% {
	-webkit-transform: scale(0.8);
	        transform: scale(0.8); }
	100% {
	-webkit-transform: scale(1);
	        transform: scale(1); }
}

/* Media Queries
–––––––––––––––––––––––––––––––––––––––––––––––––– */
/*
Note: The best way to structure the use of media queries is to create the queries
near the relevant code. For example, if you wanted to change the styles for buttons
on small devices, paste the mobile query code up in the buttons section and style it
there.
*/

/*
The following media queries are calculated using the universal em measurement
and are geared toward the base grid as setup in the tinman.css file. As a base its using 16px
Example
=============
30em = 480px
60em = 960px
So we are targeting all three core viewpoints for each typical device.
*/

/* Mobile Devices */
/*@media screen and (max-width: 30em) {
	#headerContainer {
		background-color: rgba(0, 0, 0, 1.0);
	}
}*/

/* Phablet to Desktop */
/*@media screen and (min-width: 30.0625em) and (max-width: 60em) {*/
@media screen and (max-width: 60em) {
	#headerContainer {
		background-color: rgba(0, 0, 0, 1.0);
	}
	/* Header: logo on the left, hamburger on the right */
	#navigation {
		position: static;
		top: 0;
	}

	/* Hamburger icon - three bars that turn into an X when open */
	#navigation .menu-icon {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-align: center;
		    -ms-flex-align: center;
		        align-items: center;
		-webkit-box-pack: center;
		    -ms-flex-pack: center;
		        justify-content: center;
		position: fixed;
		top: 0;
		right: 0;
		width: 60px;
		height: 65px;
		margin: 0;
		cursor: pointer;
		z-index: 1000;
		-webkit-tap-highlight-color: transparent;
	}
	#navigation .menu-icon .navicon {
		display: block;
		position: relative;
		width: 24px;
		height: 2px;
		background: #fff;
		-webkit-transition: background .2s ease-out;
		transition: background .2s ease-out;
	}
	#navigation .menu-icon .navicon:before,
	#navigation .menu-icon .navicon:after {
		content: '';
		display: block;
		position: absolute;
		width: 100%;
		height: 100%;
		background: #fff;
		-webkit-transition: all .2s ease-out;
		transition: all .2s ease-out;
	}
	#navigation .menu-icon .navicon:before {
		top: 7px;
	}
	#navigation .menu-icon .navicon:after {
		top: -7px;
	}
	#navigation .menu-btn:checked ~ .menu-icon .navicon {
		background: transparent;
	}
	#navigation .menu-btn:checked ~ .menu-icon .navicon:before {
		top: 0;
		-webkit-transform: rotate(-45deg);
		    transform: rotate(-45deg);
	}
	#navigation .menu-btn:checked ~ .menu-icon .navicon:after {
		top: 0;
		-webkit-transform: rotate(45deg);
		    transform: rotate(45deg);
	}

	/* Menu panel - drops down below the 65px header. Direct child only, since
	   navigation.php gives the nested sub-menus the "navigation" class too. */
	#navigation > ul.navigation {
		display: block;
		position: fixed;
		top: 65px;
		left: 0;
		right: 0;
		max-height: 0;
		overflow: hidden;
		visibility: hidden;
		background: rgba(0, 0, 0, 0.95);
		text-align: left;
		-webkit-transition: max-height .3s ease-out, visibility 0s .3s;
		transition: max-height .3s ease-out, visibility 0s .3s;
	}
	#navigation > .menu-btn:checked ~ ul.navigation {
		max-height: calc(100vh - 65px);
		overflow-y: auto;
		visibility: visible;
		-webkit-transition: max-height .3s ease-out;
		transition: max-height .3s ease-out;
	}

	/* Menu items - stacked full-width rows instead of floated tabs */
	#navigation ul.navigation li {
		float: none;
		padding: 0;
		border-top: 1px solid rgba(255, 255, 255, 0.1);
		border-radius: 0;
	}
	#navigation ul.navigation a {
		padding: 14px 16px;
		line-height: 20px;
		color: #fff;
	}
	#navigation ul.navigation li.sub-navigations > a {
		padding-right: 68px; /* keep the text clear of the toggle button */
	}

	/* Touch screens have no hover - cancel the desktop hover colours */
	#navigation ul.navigation li:hover,
	#navigation ul.navigation li:hover li,
	#navigation ul.navigation li li:hover {
		background: transparent;
	}
	#navigation ul.navigation li:hover > a,
	#navigation ul.navigation li li:hover a,
	#navigation ul.navigation a:hover {
		color: #fff;
	}

	/* The desktop caret after parent links is replaced by the toggle button */
	#navigation ul.navigation li > a:after {
		display: none;
	}

	/* Sub-menus - shown in place, only once their toggle is tapped */
	#navigation ul.navigation ul {
		display: none;
		position: static;
		visibility: visible;
		opacity: 1;
		background: rgba(255, 255, 255, 0.05);
	}
	#navigation ul.navigation li.open > ul {
		display: block;
	}
	#navigation ul.navigation ul a {
		min-width: 0;
		padding-left: 32px;
	}
	#navigation ul.navigation ul ul a {
		padding-left: 48px;
	}

	/* Sub-menu toggle - opens a sub-menu without following the parent link */
	#navigation ul.navigation .sub-toggle {
		display: block;
		position: absolute;
		top: 0;
		right: 0;
		width: 52px;
		height: 48px;
		margin: 0;
		padding: 0;
		border: 0;
		border-left: 1px solid rgba(255, 255, 255, 0.1);
		border-radius: 0;
		background: transparent;
		color: #fff;
		line-height: 48px;
		text-align: center;
		cursor: pointer;
		-webkit-tap-highlight-color: transparent;
	}
	#navigation ul.navigation .sub-toggle:hover,
	#navigation ul.navigation .sub-toggle:focus {
		background: transparent;
		color: #fff;
	}
	#navigation ul.navigation .sub-toggle:after {
		content: '\f0d7';
		display: inline-block;
		font-family: FontAwesome;
		font-size: 1rem;
		-webkit-transition: transform .2s ease-out;
		-webkit-transition: -webkit-transform .2s ease-out;
		transition: -webkit-transform .2s ease-out;
		transition: transform .2s ease-out;
		transition: transform .2s ease-out, -webkit-transform .2s ease-out;
	}
	#navigation ul.navigation li.open > .sub-toggle:after {
		-webkit-transform: rotate(180deg);
		    transform: rotate(180deg);
	}
	#navigation ul.navigation li.menu-social {
		display: block;
		padding: 12px 16px;
	}
	#navigation ul.navigation li.menu-social ul.social {
		display: block; /* undo the header-icon and closed-sub-menu hiding above */
		background: transparent; /* not the sub-menu shading */
	}
	#navigation ul.navigation li.menu-social .social li {
		display: inline-block;
		border-top: 0;
	}
	#navigation ul.navigation li.menu-social .social a {
		padding: 0;
		line-height: 30px;
	}
	#navigation ul.navigation li.menu-social .social a:hover {
		color: #333;
	}
}

/* Desktop to HD Desktop */
@media screen and (min-width: 60.0625em) {}