/*
 Theme Name:   Gold Star Gamers
 Description:  Child Theme based on Ultra Theme
 Author:       OFF unit | Brand Motif
 Author URI:   https://offunit.com | http://brandmotif.com
 Template:     themify-ultra
 Version:      1.0.0
*/

/* Custom Fonts */
@import url("https://use.typekit.net/zfd3fzd.css");
/* font-family: "rigid-square",sans-serif; */

/* Variables */
:root { --gold: #d89728; --white: #fff; --black: #000; --dark-gray: #353535; --light-gray: #eaeaea; --red: #ed2224; --header-dark: rgba(0,0,0,.8); }

/* Reset */
body {
  /* Improve text rendering */
  -webkit-font-smoothing: antialiased;
  /* https://marco.org/2012/11/15/text-rendering-optimize-legibility */
  text-rendering: optimizeSpeed;
  /* Allow percentage-based heights in the application */
  min-block-size: 100%;
  /* https://developer.mozilla.org/en-US/docs/Web/CSS/scrollbar-gutter#example_2 */
  /* scrollbar-gutter: stable both-edges; Removed until this bug is fixed: https://bugs.chromium.org/p/chromium/issues/detail?id=1318404#c2 */
	
	color: var(--dark-gray); 
}
:where(body *) { font-family: "rigid-square", sans-serif; }
:where(h1, h2, h3, h4) { text-transform: uppercase; letter-spacing: .02em; }
:where(h3, h4) { font-weight: 400; }
h4 { line-height: 1.3em; }
a:hover { color: var(--gold); text-decoration: none; }

#headerwrap, #footerwrap {border: none; }
#content { padding:0; }

ul, li { padding: 0; margin: 0; }

/* Header */
#header { padding: 0 0 2em; }
#site-logo { margin: 0; }
.header--cta { padding-top: 1em; }
.header--cta li { margin-left: 1em; }

/* Auto generated pages header */
#headerwrap, #headerwrap.fixed-header { background-color: var(--header-dark);}


/* Sticky header hot fix */
.fixed-header .header-bar, .fixed-header .search-button, .fixed-header .header-widget {
    display: block;
}

/* Nav Menu */
#main-nav li, .footer--nav .ui.nav li { display: inline-flex; }
#main-nav > li::after, .footer--nav .ui.nav > li::after { display: inline;
    content: "+";
    color: var(--red);
    font-weight: 600;
    top: 10px;
    position: relative; }
.footer--nav .ui.nav > li::after {top: 5px;}
#main-nav li:last-child::after, .footer--nav .ui.nav li:last-child::after { display: none; }
#main-nav li:last-child a, .footer--nav .ui.nav li:last-child a { padding-right: 0; }
#main-nav a, .footer--nav .ui.nav > li a { font-weight: 600; text-transform: uppercase; color: var(--white); }
.footer--nav .ui.nav .sub-menu > li a { color: var(--dark-gray); }
#main-nav a:hover, .footer--nav .ui.nav li a:hover { color: var(--gold); }

/* Mobile Menu */
#mobile-menu .list--inline li { margin-left: 0; }
#mobile-menu #main-menu  li::after { display: none; }
.header-icons a { color: var(--white);}

/* Hero */
.hero p { font-size: 1.7em; }
.hero p.small-font { font-size: 1.1em; }

/* Buttons */
.button { padding: .2em 1em; text-align: center; text-transform: uppercase; transition: all .3s ease-in-out; display: inline-block; box-sizing: border-box; }
.button--large { padding: 1em 0; text-align: center; text-transform: uppercase; width: 100%; display: inline-block; transition: all .3s ease-in-out; box-sizing: border-box; }

.button--highlight { background-image: url("/wp-content/uploads/2022/07/programs_highlights__background-1.png"); background-position: 0 0; background-repeat: no-repeat; background-size: contain; width: 100%; display: block;     padding-top: 45px;
    padding-bottom: 21px;
    text-transform: uppercase;
    font-size: 1.3em; font-weight: 600; }

/* Gold Star List */
.gold-star--list { margin: 0; padding: 0; }
.gold-star--list li { list-style: none; list-style-position: inside; display: flex; padding: .5em 1em; }
.gold-star--list li::before { display: inline; content: "\2605"; color: var(--gold); padding-right: 1.5em; }


/* Modifiers */

.color--white { color: var(--white); }
.color--gold { color: var(--gold); }
.color--red { color: var(--red); }
.color--dark-gray { color: var(--dark-gray); }
.color--black { color: var(--black); }
.background-color--red { background-color: var(--red); }
.background-color--gold { background-color: var(--gold); }
.background-color--dark-gray { background-color: var(--dark-gray); }
.background-color--white { background-color: var(--white); }
.gradient--white-to-gray { background: rgb(255,255,255);
background: linear-gradient(180deg, rgba(255,255,255,1) 0%, rgba(230,230,230,1) 100%); }
.gradient--gray-to-white { background: rgb(230,230,230);
background: linear-gradient(180deg, rgba(230,230,230,1) 0%, rgba(255,255,255,1) 100%);}
.gradient--radial--yellow-to-orange { background: rgb(216,151,40);
background: linear-gradient(45deg, rgba(216,151,40,1) 75%, rgba(234,51,37,1) 100%);}

.font-size--_9 { font-size: .9em; }
.font-size--1_5 { font-size: 1.5em; }
.font-weight--600 { font-weight: 600; }
.align--center { text-align: center; }
.align--right { text-align: right; }
.list--inline { list-style: none; display: inline-flex; }
.text--uppercase { text-transform: uppercase; }
.margin--center { margin: 0 auto; }
.margin-top--minus-100 { margin-top: -100px; }
.margin-left--60 { margin-left: 60%; }

.text--shadow { text-shadow: 0px 0px 5px rgba(150, 150, 150, 0.5); }

.border--thin { border: 1px solid; }
.border--right { border-right: 1px solid; }
.border-color--gold { border-color: var(--gold); }
.border-color--red { border-color: var(--red); }

.heading--large { font-size: 2em; }

a:is(.color--gold:hover, .background-color--gold:hover) { color: var(--red); }

.float--left { float: left; }

.float--left::after { display: none; content: ""; clear: both; }
.bio-image { margin: 0 1em 1em 0; border-radius: 50%; }

.no--margin { margin: 0; }
.no--padding { padding: 0; }

/* Footer */

#footerwrap { background-color: var(--dark-gray); }
#footer { color: var(--white); }


/* Column Flex box */

.flex-container {
  padding: 0;
  margin: 0;
  margin: 0 auto;
  display: flex;
  justify-content: space-around;
}

.flex-item {
  flex: 1 1 auto;
}
@media screen and (min-width: 320px) {
  .flex-item {
    width: 100vw;
  }
}
@media screen and (min-width: 640px) {
  .flex-item {
    width: calc(50vw - 4em);
  }
}
@media screen and (min-width: 960px) {
  .flex-item {
    width: calc(25vw - 4em);
  }
}

/* Accessibility */
.sr-only {
position:absolute;
left:-10000px;
top:auto;
width:1px;
height:1px;
overflow:hidden;
}


/* Mosaic Grid */
.mosaic-container{
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-gap: 2rem;
}

.mosaic-tile { object-fit: cover; }
.mosaic-tile img { margin: o auto; }

.mosaic-tile--column-2 {
	grid-column: span 2;
}

.mosaic-tile--row-2 {
	grid-row: span 2;
}
.mosaic-container { counter-reset: my-sec-counter; }
.mosaic-tile :is(.card, .card--no-after) { padding: 1.5em 1em; }
.mosaic-tile .card p { position: relative; z-index: 10; }
.mosaic-tile .card::after { display: inherit;counter-increment: my-sec-counter; content:counter(my-sec-counter); position: relative; text-align: right; margin-top: -50px; font-size: 5em; font-weight: 600; z-index: 0; color: var(--light-gray); mix-blend-mode: multiply;  }
.mosaic-tile .card-image { width: 100%; display: inline-grid; }

@media screen and (max-width: 650px){
    .mosaic-container{
        display: block;
    }
    .mosaic-tile{
        margin-bottom: 1rem;
    }
	
	.list--inline { display: contents; }
	.border--right { border-right: 0; }
	
	#mobile-menu .header--cta .list--inline li { text-align: left; }
	.flex-container { display: contents; }
	.flex-item { width: auto; }
	
	.bio-image { margin: 0 0 1em; width: auto; }
	#main-nav > li::after, .footer--nav .ui.nav > li::after { display: none; }
	#main-nav .toggle-on>a>.child-arrow { display: none; }
}

/* ECS Event */
.ecs-event-list li { list-style: none; color: var(--white); min-height: 200px; margin: 2em 0; padding: 2em; }
.ecs-event:nth-of-type(3n+1) {background-color: var(--gold);}
.ecs-event:nth-of-type(3n+2) {background-color: var(--dark-gray);}
.ecs-event:nth-of-type(3n+3) {background-color: var(--red);}

.ecs-event { text-align: center;}
.ecs-event h4 a { color: var(--white); font-size: 2em; }
.ecs-event img { width: 100%; margin: 1.5em 0; }
.ecs-event p { text-align: left; }
.ecs-event .duration { font-size: 1.5em; font-weight: 600; }

p.tribe-events-back, .single-tribe_events .tribe-events-c-subscribe-dropdown .tribe-events-c-subscribe-dropdown__button, .tribe-events .tribe-events-c-subscribe-dropdown .tribe-events-c-subscribe-dropdown__button { display: none; }

.tribe-events-event-url-label, .tribe-events-event-url { display: none; }

.tribe-events-event-meta.primary, .tribe-events-event-meta.secondary { width: 100% !important; }