/*
Theme Name: Spyre (FSE)
Author: Kieran Allen
Author URI: https://kja.io
Theme URI:
Description: Spyre Sports - Using the new WP FSE.
Tags: full-site-editing
Text Domain: full-site-editing
Requires at least: 5.8
Requires PHP: 7.4
Tested up to: 5.9
Version: 1.0.1
*/

* {
    box-sizing: border-box;
    -moz-osx-font-smoothing: grayscale;
	-webkit-font-smoothing: antialiased;
}

/*
 * Text and navigation link styles.
 * Necessary until the following issue is resolved in Gutenberg:
 * https://github.com/WordPress/gutenberg/issues/27075
 */
a {
	text-decoration-thickness: 1px;
	text-underline-offset: 0.25ch;
}
html, body {
    font-family: 'Mulish, sans-serif';
}
body {
    margin:0;
    padding:0;
}

/* Reuseable Components */
h1 {
    font-family: 'Jost', sans-serif;
    color: #0F2D6A;
    font-size: 45px;
    font-weight: 300;;
}

h2 {
    font-family: 'Jost', sans-serif;
    font-size: 50px;
    color:#032D6A;
    font-weight: 300;
}

h3 {
    font-family: 'Jost', sans-serif;
    font-size: 25px;
    color:#032D6A;
    font-weight: 300;
}

.button {
    background-color: #265AA6;
    color: #F8F8F8;
    font-family: 'Jost', sans-serif;
    border:none;
    padding: 10px 30px 10px 30px;
    text-transform: uppercase;
    font-size: 14px;
    font-weight: 800;
    cursor: pointer;
    border: 1px solid transparent;
    margin-top: 20px;
}
.button:hover {
    color: #265AA6;
    background-color: #ffffff;
    border: 1px solid #265AA6;
 }
 
 .button--grey {
     background-color: #6F6C62;
 }
 
 .button--dark-blue {
     background-color: #0F2D6A;
 }
 
 .button--white {
     background-color: #ffffff;
     border:none;
     color:#032D6A;
 }

 .inline-block {
     display:inline-block;
 }

 .max-width-690 {
     max-width:690px;
 }
.wp-block-cover__inner-container .hero-text-main-header {
    max-width:690px !important;
    margin-left:auto;
    margin-right:0 !important;
}

.navigation-overlap {
    position:relative;
}
:root {
    --wp--custom--spacing--outer: 40px;
 }
 .navigation-overlap__container {
    position: absolute;
    z-index: 2;
    height: 50px;
    top:20px;
    width:100%;
 }
.navigation-overlap__align-top {
    align-items:flex-start !important;
}
 :root {
    --wp--custom--spacing--outer: 40px;
 }
/*
 * Alignment styles.
 * These rules are temporary, and should not be relied on or
 * modified too heavily by themes or plugins that build on
 * Twenty Twenty-Two. These are meant to be a precursor to
 * a global solution provided by the Block Editor.
 *
 * Relevant issues:
 * https://github.com/WordPress/gutenberg/issues/35607
 * https://github.com/WordPress/gutenberg/issues/35884
 */

 .wp-site-blocks,
 body > .is-root-container,
 .edit-post-visual-editor__post-title-wrapper,
 .wp-block-group.alignfull,
 .wp-block-group.has-background,
 .wp-block-cover.alignfull,
  .is-root-container .wp-block[data-align="full"] > .wp-block-group,
 .is-root-container .wp-block[data-align="full"] > .wp-block-cover {
     padding-left: var(--wp--custom--spacing--outer);
     padding-right: var(--wp--custom--spacing--outer);
 }


 .wp-site-blocks .alignfull,
 .wp-site-blocks > .wp-block-group.has-background,
 .wp-site-blocks > .wp-block-cover,
 .wp-site-blocks > .wp-block-template-part > .wp-block-group.has-background,
 .wp-site-blocks > .wp-block-template-part > .wp-block-cover,
 body > .is-root-container > .wp-block-cover,
 body > .is-root-container > .wp-block-template-part > .wp-block-group.has-background,
 body > .is-root-container > .wp-block-template-part > .wp-block-cover,
 .is-root-container .wp-block[data-align="full"] {
     margin-left: calc(-1 * var(--wp--custom--spacing--outer)) !important;
     margin-right: calc(-1 * var(--wp--custom--spacing--outer)) !important;
     width: unset;
 }
 
 /* Blocks inside columns don't have negative margins. */
 .wp-site-blocks .wp-block-columns .wp-block-column .alignfull,
 .is-root-container .wp-block-columns .wp-block-column .wp-block[data-align="full"],
 /* We also want to avoid stacking negative margins. */
 .wp-site-blocks .alignfull:not(.wp-block-group) .alignfull,
 .is-root-container .wp-block[data-align="full"] > *:not(.wp-block-group) .wp-block[data-align="full"] {
     margin-left: auto !important;
     margin-right: auto !important;
     width: inherit;
 }

 /*
 * Responsive menu container padding.
 * This ensures the responsive container inherits the same
 * spacing defined above. This behavior may be built into
 * the Block Editor in the future.
 */

.wp-block-navigation__responsive-container.is-menu-open {
	padding-top: var(--wp--custom--spacing--outer);
	padding-bottom: var(--wp--custom--spacing--large);
	padding-right: var(--wp--custom--spacing--outer);
	padding-left: var(--wp--custom--spacing--outer);
}

.wp-block-cover {
    padding-left:var(--wp--custom--spacing--outer);
    padding-right:var(--wp--custom--spacing--outer);
}

.wp-block-separator {
    border-bottom:0;
}
.wp-block-separator:not(.is-style-wide) {
    width: 71px;
}

.wp-block-button {
    font-family: 'Jost', sans-serif;
}

.footer a {
}
.footer ul {
    list-style-type: none;
    margin:0;
    padding:0;
}

p {
    margin-bottom:10px !important;
    font-family: 'Jost', sans-serif;
    line-height:1.75;
}
.header {
    position:relative;
    z-index:2;
    margin:0 auto;
    width:100%;

    max-width:1024px;
}
.header__container {
    width:100%;
    position:relative;
}
.header__wrapper {
    position:absolute;
    width:100%;
    left:0;
    right:0;
}

.custom-logo {
    max-width: 100px;
    height: auto;
}

.home .custom-logo {
    max-width:none;
}

div.wpforms-container-full .wpforms-form .wpforms-field-label {
    font-weight:normal;
    font-size:18px;
}
div.wpforms-container-full .wpforms-form .wpforms-field .wpforms-field-row:last-of-type {
    max-width:none;
}
div.wpforms-container-full .wpforms-form input[type=text]{
    height:40px;
}
div.wpforms-container-full .wpforms-form button[type=submit], div.wpforms-container-full .wpforms-form button[type=submit]:hover {
    background: #265AA6;
    border:none;
    color:#fff;
    font-weight:bold;
    font-family: 'Jost', sans-serif;
    text-transform: uppercase;
}
div.wpforms-container-full .wpforms-form .wpforms-submit-container {
    text-align:right;
}

 @media (min-width: 768px) {
    .button { 
        font-size: 16px;
        margin-top: 10px;
    }
 }

.highlighted-menu a {

    background-color:none !important;
    background:#0F2D6A;
    padding-left:10px !important;
    padding-right:10px !important;
    display:inline-block;
    padding-top:10px !important;
    padding-bottom:10px !important;
    color:#fff !important;
}

.gform-field-label {
    font-family: "Jost",Sans-serif !important;
}
.wp-block-navigation-item__content {

    font-size:20px;
}
.wp-block-navigation__submenu-container {
    gap:20px !important;
}

@media screen and (min-width: 600px) {

    .wp-block-navigation-item__content {

        font-size:1rem;

    }

    .wp-block-navigation__submenu-container {
        gap:0px !important;
    }
}