@charset "UTF-8";
/* CSS Document */

.gridContainer {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	grid-column-gap: 40px;
	grid-row-gap: 40px;
	/* overflow: hidden; */
}

.gridItem {
	position: relative;
	display: block;
	float: left;
	width: 100%;
	height: auto;
	overflow: hidden;
}

.thumb {
	display: block;
	position: relative;
	width: 100%;
	height: auto;
}

.thumbTitle {
	position: absolute;
	top: 0px;
	left: 0px;
	background: linear-gradient(180deg, rgba(255,255,0,1) 15%, rgba(0,255,255,.5) 85%);
	padding: 1em 1.5em 0 .5em;
	width: 100%;
	Height: 100%;
	color: #000000;
	font-weight: 300;
	opacity: 0;
	letter-spacing: 5px;
	text-transform: uppercase;
	transition: .4s;
}

.thumbTitle p {
	width: 90%;
}

.thumbTitle:hover {
	padding-left: 1.5em;
	opacity: 1;
}

div {
	margin: 0;
	padding: 0;
}

img {
	margin: 0;
	padding: 0;
}

body {
	margin: 0;
}

video {
	margin: 0;
	padding: 0;
	width: 100% !important;
	height: auto !important;
}

.portVideo {
	position: relative !important;
	margin: 0;
	padding: 0;
	width: 100% !important;
	height: auto !important;
}

p {
	margin-top: 0;
	font-family: 'Outfit', sans-serif;
	font-weight: 300;
	font-style: normal;
	font-size: 1.5em;
}

a {
	text-decoration: none!important;
}

.inlinePink {
	color: #FF00FF;
}

.italic {
	font-family: 'Outfit', sans-serif;
	font-weight: 300;
	font-style: italic;
}

.bold {
	font-family: 'Outfit', sans-serif;
	font-weight: 800;
	font-style: normal;
}

.italicBold {
	font-family: 'Outfit', sans-serif;
	font-weight: 800;
	font-style: italic;
}

h1 {
	font-family: 'Outfit', sans-serif;
	font-weight: 800;
	font-style: normal;
	font-size: 3em;
	text-transform: uppercase;
	letter-spacing: .25em;
	clear: both;
}

h2 {
	font-family: 'Outfit', sans-serif;
	font-weight: 300;
	font-size: 2em;
	line-height: 1.25em;
	color: #000000;
	text-decoration: none;
	margin: 0;
}

.portTitle {
	font-size: 8vw;
	font-weight: 800;
	line-height: 7vw;
	text-align: center;
	padding-top: 1.75vw;
	padding-bottom: 1.75vw;
	margin: 0px;
	color: #FFFFFF;
	transition: 1s;
}

.portSubText {
	padding-top: .5em;
	font-size: 1em;
	line-height: 1.25em;
	color: #616a73;
	clear: both;
}

.linkInline {
	font-family: 'Outfit', sans-serif;
	font-weight: 800;
	font-style: normal;
	text-decoration: none;
	text-transform: uppercase;
	color: #FF00FF;
	transition: .5s;
}

.linkInline:hover {
	text-shadow: 5px 7px #00FFFF, -5px -7px #FFFF00;
}

.linkButton {
	background-color: #FF00FF;
	margin-bottom: 20px;
	font-family: 'Outfit', sans-serif;
	font-weight: 300;
	font-style: normal;
	font-size: 1.5em;
	color: #FFFFFF;
	text-align: center;
	padding: 10px 20px;
	text-decoration: none;
	transition: .5s;
}

.linkButton:hover {
	text-shadow: 5px 7px #00FFFF, -5px -7px #FFFF00;
}

#siteContainer {
	width: 100%;
	height: 100%;
	padding: 0;
	margin: auto;
}

#banner {
	display: block;
	width: 100%;
	height: auto;
	background-color: #FF00FF;
	padding: 0;
	margin: 0; 
}

img.logo, .logo {
	display: block;
	height: auto;
	max-height: 600px;
	max-width: 1300px;
	margin: 0 auto 0 auto;
	padding: 0 auto 0 auto;
}

#navbar {
	display: block;
	width: 100%;
	padding: 10px 0 10px 0;
	background-color: #FF00FF;
	text-align: center;
	position: sticky;
	top: 0px;
	z-index: 10;
}

#navbarMobile {
	display: none;
	width: 100%;
	padding: 10px 0 10px 0;
	background-color: #FF00FF;
	text-align: center;
	position: sticky;
	top: 0px;
	z-index: 10;
}

.navItem {
	font-family: 'Outfit', sans-serif;
	font-weight: 300;
	font-size: 2em;
	text-transform: uppercase;
	color: #FFFFFF;
	letter-spacing: 5px;
	text-decoration: none;
	margin: auto 2.5%;
	transition: .5s;
}

.navItem:hover {
	text-shadow: 5px 7px #00FFFF, -5px -7px #FFFF00;
}

#siteContent {
	width:90%;
	max-width: 1200px;
	margin: auto;
}

.portHalfLeft {
	position: relative;
	display: block;
	float: left;
	width: 49%;
	margin: 0 2% 0 0;
	padding: 0;
	overflow: hidden;
}

.portHalfLeftIndex {
	position: relative;
	display: block;
	float: left;
	width: 49%;
	margin: 0 2% 0 0;
	padding: 0;
	overflow: hidden;
}

.portHalfRight {
	position: relative;
	display: block;
	float: left;
	width: 49%;
	margin: 0 0 0 0;
	padding: 0;
	overflow: hidden;
}

.portFull {
	position: relative;
	display: block;
	clear: both;
	width: 100%;
	margin: 0 0 0 0;
	padding: 0;
}

.portSpacer {
	height: 75px;
	clear: both;
}

.socialIcon {
	margin-right: 10px;
	font-size: 4em;
	line-height: 0;
	color: #FF00FF;
	transition: .4s;
}

.socialIcon:hover {
	text-shadow: 5px 7px #00FFFF, -5px -7px #FFFF00;
}

label {
	font-family: lato,sans-serif;
	font-weight: 600;
	font-style: normal;
	text-transform: uppercase;
	font-size: 1em;
	clear: both;
	display: block;
}

input, select, textarea {
	background-color: #bfffff;
	margin-bottom: 10px;
	border: 0;
	box-sizing: border-box;
	font-family: lato,sans-serif;
	font-weight: 300;
	font-style: normal;
	font-size: 1em;
	width: 100%;
	padding: 8px;
	clear: both;
	display: block;
}

textarea {
  height: 250px;
}

button {
	margin: 10px 0 40px 0;
	border: 0;
	height: 75px;
	width: 100%;
	background: #FF00FF;
	color: white;
	font-family: lato,sans-serif;
	font-weight: 800;
	font-style: normal;
	font-size: 2em;
	letter-spacing: 10px;
	text-transform: uppercase;
	text-align: center;
	cursor: pointer;
	transition: .5s;
}

button:hover {
	background: #FFFF00;
	color: #000000;
	letter-spacing: 20px;
}

.portFooter {
	margin: auto;
	width: 90%;
	max-width: 1200px;
}

#footer {
	background-color: #FF00FF;
	height: 200px;
}

#footerContent {
	width:90%;
	max-width: 1200px;
	margin: auto;
}

.footerColumn {
	position: relative;
	margin: 2em 0 0 0;
	display: block;
	float: left;
	width: 50%;
	height: auto;
}

.footerSocial {
	margin-right: 10px;
	font-size: 2em;
	color: #FFFFFF;
	transition: .4s;
}

.footerSocial:hover {
	color: #00FFFF;
}

.footerEmail {
	color: #FFFFFF;
	font-family: 'Outfit', sans-serif;
	font-weight: 300;
	font-style: normal;
	font-size: 1em;
	line-height: 3em;
	text-align: right;
	transition: .4s;
}

.footerEmail:hover {
	color: #00FFFF;
}

.copyrightInfo {
	display: block;
	color: #FFFFFF;
	text-align: center;
	font-size: 1em;
	clear: both;
	padding-bottom: 50px;
}

/* Mobile Queries */

@media (max-width:640px) {
	
#banner {
	padding: 50px 0;	
}

#navbar {
	display: none !important;
}
	
#navbarMobile {
	display: block !important;
}

.navItem {
	margin: auto 4%;
}
	
}

@media (max-width:870px) {

.gridContainer {
	display: grid;
	grid-template-columns: repeat(1, 1fr);
}
	
.portHalfLeft {
	float: none;
	clear: both;
	width: 100%;
	margin: 0 0 40px 0;
}
	
.portHalfLeftIndex {
	float: none;
	clear: both;
	width: 100%;
	margin: 0 0 0 0;
}

.portHalfRight {
	float: none;
	clear: both;
	width: 100%;
	margin: 0 0 0 0;
}
	
.portSpacer {
	height: 40px;		
}

.thumbSpacer {
	display: none;
}
	
.thumbTitle {
	position: relative;
	top: 0px;
	left: 0px;
	background: linear-gradient(180deg, rgba(0,255,255,0) 15%, rgba(0,255,255,0) 85%);
	padding: .5em 0 0 0;
	width: 100%;
	Height: auto;
	color: #000000;
	font-weight: 300;
	letter-spacing: 5px;
	opacity: 1;
	transition: .4s;
	text-decoration: none!important;
	text-transform: uppercase;
}
	
.thumbTitle:hover {
	padding-left: 0;
}
	
#footer {
	height: 190px;	
}
	
.footerColumn {
	position: relative;
	margin: 0 0 0 0;
	padding-top: 1em;
	display: block;
	float: none;
	width: 100%;
	height: 2em;
	text-align: center;
}
	
.footerSocial {
	margin-right: 10px;
	font-size: 2em;
	color: #FFFFFF;
	transition: .4s;
	text-align: center;
}

.footerEmail {
	padding: .6em 0 0 0;
	color: #FFFFFF;
	line-height: 2em;
	text-align: center;
	transition: .4s;
}
	
.copyrightInfo {
	margin-top: 3em;
	padding-bottom: 0px;
}
	
}

@media (max-width:1080px) {

.portFooter {
	width: 100%;
}
	
}