@import url("https://use.typekit.net/biy2zro.css");

*,
*::after,
*::before {
	box-sizing: border-box;
}

:root {
	/* font-size: 16px; */
}

body {
	margin: 0;
	--color-text: #fcee23;	/* yellow */
    --color-link: #fcee23;	/* yellow */
    --color-link-hover: black;
    --color-overlay: #451a11;
    --color-tagline: #5C8A74;
    --color-accent: #ca4b2f;
	--aspect-ratio: 1/1.5;
	--imgwidthmax: 500px;
	--size-title: 10rem;
	--font-weight-title: 400;
	--font: athelas, serif;
	color: var(--color-text);
	background-color: #ca4b2f;
	font-family: var(--font);
	font-weight: 300;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, h4, h5, h6 {
	font-family: var(--font);
}

h1, h2, h3, h4 {
	text-transform: uppercase;
}

a {
	text-decoration: none;
	color: var(--color-link);
	outline: none;
}

a:hover,
a:focus {
	color: var(--color-link-hover);
	outline: none;
	text-decoration: none;
}

.bold {
  font-weight: 600;
}

.fadein {
  opacity: 0;
}


/* ---------- Bootstrap overrides ---------- ---------- ---------- ---------- */
.card {
  border-radius: 0px;
  border: 0px;
}

.card-img-top {
  border-radius: 0px;
}

.accent-color {
  color: var(--color-accent);
}

.navbar-toggler {
	border: none;
}

.navbar {
	min-height: 5vw;
	background: #1E2C31;
}


.navbar-dark .navbar-nav .nav-link:focus,
.navbar-dark .navbar-nav .nav-link:hover,
.navbar-dark .navbar-brand:hover,
#contact a:hover {
	color: #ca4b2f; /* red */
}
.navbar-dark .navbar-toggler-icon {
	background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='30' height='30' viewBox='0 0 30 30'%3e%3cpath stroke='rgba(252,238,35, 1)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}


/* ------------ header ---------- ---------- ---------- ----------*/

.navbar .navbar-nav .nav-link {
	color: var(--color-text);
	text-transform: uppercase;
	letter-spacing: .5em;
	font-weight: 400;
	font-family: var(--font);
}

.navbar .navbar-brand {
	font-size: 1.1rem;
	letter-spacing: 0.3em;
	color: var(--color-text);
	font-family: var(--font);
}

#navbarNav a{
	/* border: 1px solid #fcee23;
	border-radius: 50%; */
	font-size: 1.2em;
	width: 30px;
	/* height: 30px; */
	padding: 5px;
	display: flex;
}

#navbarNav i{
	text-align: center;
	letter-spacing: 0px;
}


/* ------------ landing video banner ---------- ---------- ---------- ----------*/

#landing-video {
   position: relative;
   min-height: 33vh;
   overflow: hidden;
 }

#landing-video video {
   position: absolute;
   top: 50%;
   left: 50%;
   width: 100%!important;
   width: auto;
   height: auto;
   z-index: 0;
   -ms-transform: translateX(-50%) translateY(-50%);
   -moz-transform: translateX(-50%) translateY(-50%);
   -webkit-transform: translateX(-50%) translateY(-50%);
   transform: translateX(-50%) translateY(-50%);
 }

 /* ------------ banner general---------- ---------- ---------- ----------*/

 .banner {
 	padding-top: 1em;
 	padding-bottom: 2em;
 }


/* ------------ news banner ---------- ---------- ---------- ----------*/

/* ------------ tour banner ---------- ---------- ---------- ----------*/
#tour {
	background: rgb(47, 67, 54);
	/* color: white; */
	font-family: var(--font)!important;
}

/* -- plugin overrides */

.bit-widget .bit-no-dates-container .bit-track-button {
	background: #ca4b2f;
	color: white;
}

.bit-widget .bit-play-my-city-button,
.bit-top-track-button,
.bit-nav-bar-container,
.bit-button .bit-track-button .bit-offers,
.bit-widget .bit-no-dates-container .bit-track-button {
	display: none!important;
}

.bit-widget .bit-event {
  border-top: 1px solid #fff2346e!important;
}

.bit-widget .bit-event:last-child {
	border-bottom: 1px solid #fff2346e!important;
}

.bit-venue,
.bit-offers .bit-offers-text {
	color: #fcee23!important;
}

.bit-upcoming-events {
	border: none!important;
	margin: 0px!important;
}

/* ------------ video banner ---------- ---------- ---------- ----------*/

/*
.fullwidth {
  grid-area: full;
}
.halfwidth {
  grid-area: half;
}

.grid-container {
  display: grid;
  grid-template-columns: auto 1em auto;
  grid-template-rows: auto;
  grid-template-areas:
    "full full full"
    "half . half";
} */


/* ------------ merch banner ---------- ---------- ---------- ----------*/
#merch {
	background: white;
	color: #ca4b2f;
}

/* -- plugin overrides */

.mi-store-container,
.mi-store-container *  {
	color: #ca4b2f;
}

.mi-store-category-header {
	padding-top: .5em!important;
}


/* ------------ contact banner ---------- ---------- ---------- ----------*/
#contact {
	background: rgb(28, 44, 49);
}


/* ------------ email page ---------- ---------- ---------- ----------*/

#formContainer .formContainer{
	background: #ca4b2f!important;
}


/* ================ media query ==================== */

@media (min-width: 375px) {
	.navbar .navbar-brand {
		font-size: 1.1rem;
		letter-spacing: 0.5em;
		color: var(--color-text);
		font-family: var(--font);
	}
}


/* Medium devices (tablets, 768px and up) */

@media (min-width: 768px) {
	#landing-video {
	   position: relative;
	   height: 100vh;
	   min-height: 25rem;
	   width: 100%;
	   overflow: hidden;
	 }
	 #landing-video video {
	    position: absolute;
	    top: 50%;
	    left: 50%;
	    min-width: 100%;
	    min-height: 100%;
	    width: auto;
	    height: auto;
	    z-index: 0;
	    -ms-transform: translateX(-50%) translateY(-50%);
	    -moz-transform: translateX(-50%) translateY(-50%);
	    -webkit-transform: translateX(-50%) translateY(-50%);
	    transform: translateX(-50%) translateY(-50%);
	  }
		.banner {
			padding-top: 4em;
			padding-bottom: 4em;
		}
		.mi-store-category-header {
			padding-top: 1em!important;
		}
}

/* large devices and up */
@media (min-width: 991px) {
	.navbar .navbar-brand {
		font-size: 1.6rem;
		letter-spacing: 1.5rem;
	}

	.navbar .navbar-nav .nav-link {
		font-size: 1.1rem!important;}
}

	/* smaller than large devices  */

@media (max-width: 991px) {
	.hiddensm{
		display: none;
	}
}

/* // Medium devices (tablets, 768px and up)
@media (min-width: 768px) { ... } */



/* // Extra large devices (large desktops, 1100px and up) */
@media (min-width: 1100px) {

	.navbar .navbar-nav .nav-link {
		font-size: 1.5rem!important;

	}
 }