/*
This file is used for wordpress to override the theme.

How it works:

- Theme Customization Variables are set inside of "gotsport-customizer.php"
- this then generates css variables inside og header.php under <style>
- Finally the customize-theme.css file is loaded and uses those variables.

*/



/*  =======================
OVERRIDE STYLES
=======================*/

/* Typography
======================= */
/*Override font settings*/

body {
  font-family: var(--body-font), sans-serif;
}

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

.navbar-nav .nav-item {
  font-family: var(--menubar-font), sans-serif;
}


/* Base
=======================
h1, h2, h3, h4, h5, h6 {
  font-family: "Oswald", sans-serif;
}*/


/* Base
======================= */

a:link,
a:visited {
  color: var(--link-color);
}

/* OVERRIDE color*/

.top-bar.top-bar-custom {
    background-image: none !important;
}

.top-bar-custom {
    background-color: var(--topbar-color);
    background-image: linear-gradient(0deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 100%); /*override primary darken*/
}

.top-bar p, .top-bar span a:link, .top-bar span a:visited {
  color: white;
  color: var(--topbar-text-color);
}

.top-bar-custom-icon span i {
  color: var(--topbar-icon-color);
}

/*Social media*/
.social-media-2 a.social-link:link i, .social-media-2 a.social-link:visited i {
 color: var(--topbar-socialmedia-icon-color);
}


.social-media-2 a.social-link:link,
.social-media-2 a.social-link:visited {
  border: 1px solid var(--topbar-socialmedia-color);
  /*background-color: white;*/
}
.social-media-2 a.social-link:active,
.social-media-2 a.social-link:hover {
  background-color: var(--topbar-socialmedia-color);
  border: 1px solid var(--topbar-socialmedia-color);
}

.top-bar .social-media-2 a.social-link:link, .top-bar .social-media-2 a.social-link:visited {
  --icon-size: var(--topbar-socialmedia-icon-size);
}


/*  Backgrounds + Overlays
=======================

.overlay,
.bg-overlay-primary::after {
  background-color: var(--primary) !important;
  background-image: linear-gradient(
    0deg,
    rgba(0,0,0,0.6) 0%,
    rgba(0,0,0,0.6) 100%);
  //opacity: 0.8;
}
*/


/*Video Overlay*/
.hero-slide .video-overlay, .row-overlay:before {
  background-image: linear-gradient(to bottom right, var(--primary), var(--primary));
  opacity: var(--overlay-opacity);
}

/*.hero-slide .video-overlay .overlay-custom, */
.row-overlay.row-overlay-custom:before {
  background-image: linear-gradient(to bottom right, var(--overlay-color), var(--overlay-color));
  opacity: var(--overlay-opacity);
}

/* Individual page custom overlay */
.row-overlay.row-individual-custom-overlay:before {
  background-image: linear-gradient(to bottom right, var(--hero-overlay-custom-color), var(--hero-overlay-custom-color));
  opacity: var(--hero-overlay-custom-opacity);
}

.page-hero .overlay-custom {
  background-color: var(--overlay-color);
  background-image: linear-gradient(
    0deg,
    rgba(0,0,0,var(--overlay-opacity)) 0%,
    rgba(0,0,0,var(--overlay-opacity)) 100%);
}

.overlay-slider {
  opacity: 0.6;
}

.overlay-slider.overlay-custom {
  background: var(--overlay-color) !important;
  opacity: var(--overlay-opacity);
}

.overlay {
    opacity: var(--overlay-opacity);
}


/* Overlay Header
=======================*/
.overlay-custom {
    background: var(--overlay-color) !important;
}





/* Homepage header size
=============================*/


/* Medium devices (tablets, 768px and up)*/
@media (min-width: 768px) {
  .hero-slide, .img-slider {
    min-height: var(--homepage-header-size)!important;
  }
  .hero-slide .row {
    min-height:var(--homepage-header-size) !important; //match height with slide-bg (image) height
  }
}



/*Menubar
=======================*/

/* OVERRIDE color*/
.nav-custom-color {
  background: var(--menubar-color);
}

/*OVERRIDE Diagonal menubar color*/
.nav-container.nav-diagonal.nav-custom-color {
  background-image: linear-gradient(300deg, var(--menubar-color) 92%, var(--secondary) 0%);
}

/*OVERRIDE Diagonal Highlight color */
.nav-container.nav-diagonal.diagonal-highlight-color {
  background-image: linear-gradient(300deg, var(--primary) 92%, var(--menu-highlight-color) 0%);
}
.nav-container.nav-diagonal.nav-custom-color.diagonal-highlight-color {
  background-image: linear-gradient(300deg, var(--menubar-color) 92%, var(--menu-highlight-color) 0%);
}



/*Menubar Links*/
.navbar-nav .nav-item .nav-link {
  color: var(--default-link-color);
}
/*Override Menubar Links*/
.navbar-link-custom .nav-item .nav-link {
  color: var(--menu-link-color);
}


/*OVERRIDE Active*/
.navbar-active-custom .nav-item.active>.nav-link,
.navbar-active-custom .nav-item:active>.nav-link,
.navbar-active-custom .nav-item:active:focus>.nav-link,
.navbar-active-custom .nav-item:focus>.nav-link,
.navbar-active-custom .nav-item:hover>.nav-link {
  color: var(--menu-active-color);
}

.navbar-active-custom .nav-item .nav-link:focus, .navbar-active-custom .nav-item .nav-link:hover, .navbar-nav.navbar-active-custom .nav-item .nav-link::before {
  background: var(--menu-active-color);
  color:black;
}


@media (min-width: 768px) {
  .navbar-active-custom .nav-item.active>.nav-link,
  .navbar-active-custom .nav-item:active>.nav-link,
  .navbar-active-custom .nav-item:active:focus>.nav-link,
  .navbar-active-custom .nav-item:focus>.nav-link,
  .navbar-active-custom .nav-item:hover>.nav-link {
    color: var(--menu-active-color);
  }

  .navbar-active-custom .nav-item .nav-link:focus, .navbar-active-custom .nav-item .nav-link:hover, .navbar-nav.navbar-active-custom .nav-item .nav-link::before {
    background: none;
      color: var(--menu-active-color);
  }

}


/* callout-btn hover
.navbar-active-custom .nav-item.callout a:link:hover, .navbar-active-custom .nav-item.callout a:visited:active {
  background: var(--menu-active-color);
  color: black;
}*/





/* Mobile Toggle */
.navbar-toggler .navbar-toggler-icon,
.navbar-toggler .navbar-toggler-icon::after,
.navbar-toggler .navbar-toggler-icon::before {
  background-color: var(--menu-toggle-color);
}



/* Drop Menu
  =======================*/
.dropdown-menu {
  background: var(--dropmenu-bg-color);
}

.dropdown-menu .dropdown-item {
  color: var(--dropmenu-link-color);
}

.dropdown-menu .dropdown-item:active,
.dropdown-menu .dropdown-item:focus,
.dropdown-menu .dropdown-item:hover,
.dropdown-menu .dropdown-item:active,
.dropdown-menu a.bg-light:focus,
.dropdown-menu a.bg-light:hover,
.dropdown-menu button.bg-light:focus,
.dropdown-menu button.bg-light:hover,
/*.dropdown-menu .dropdown:hover>a*/ {
  background-color: var(--menu-active-color) !important;
  background-image: linear-gradient(
    0deg,
    rgba(0,0,0,0.1) 0%,
    rgba(0,0,0,0.1) 100%);
}

/* Child Menu
=======================*/
.child-menu-color{
  background: var(--child-menu-bg);
}

.children-links li a:link, .children-links li a:visited {
  color: var(--child-menu-link);
}

.children-links .parent-link {
color: var(--child-menu-link);
transition: all .25s ease;
}

.children-links .current_page_item > a:link, .children-links .current_page_item a:visited, .children-links li a:hover, .children-links li a:active {
  color: var(--child-menu-active);
  transition: all .25s ease;
}
.children-links .current_page_item > a:link::after, .children-links .current_page_item a:visited::after {
  background: var(--child-menu-active);
}

.children-links li:hover > a::after, .children-links li a:hover::after, .children-links li a:focus::after, .children-links li a:active::after, .children-links li a:active:focus::after {
    background: var(--child-menu-active);
    transition: all .25s ease;
}

a.parent-link:link, a.parent-link:visited {
  color: var(--child-menu-link);
}

a.parent-link:hover, a.parent-link:active {
  color: var(--child-menu-active);
}


/* line 142, ../../../../../Users/sheuneenta/Library/CloudStorage/OneDrive-GotSoccer,LLC/01.GotSport/00.SITES/Template-Combined-2023/scss/sm-simple/_sm-simple-theme.scss */
.sm-simple a:hover, .sm-simple a:focus, .sm-simple a:active, .sm-simple a.highlighted, .sm-simple a:hover:hover, .sm-simple a:hover:focus, .sm-simple a:hover:active, .sm-simple a:hover.highlighted, .sm-simple a:focus:hover, .sm-simple a:focus:focus, .sm-simple a:focus:active, .sm-simple a:focus.highlighted, .sm-simple a:active:hover, .sm-simple a:active:focus, .sm-simple a:active:active, .sm-simple a:active.highlighted {
  background: var(--child-menu-bg-hover) !important;
   color: var(--child-menu-active) !important;
}

/* Highlight Menu -> Menu
.sm-simple a.bg-light:hover, .sm-simple a.bg-light:focus, .sm-simple button.bg-light:hover, .sm-simple button.bg-light:focus {
   background: var(--child-menu-bg-hover) !important;
   color: var(--child-menu-active) !important;
}
*/


/*.sm-simple a.bg-light:hover, .sm-simple a.bg-light:focus, .sm-simple a.bg-light:active, .sm-simple button.bg-light:hover, .sm-simple button.bg-light:focus {
  background-color: #dae0e5 !important;
   background: var(--child-menu-bg-hover) !important;
}
*/

.sm-simple ul {
 background: var(--child-menu-dropdown-color);
}


/* Mobile Toggle 2 */
.navbar-toggler.navbar-toggler-2 .navbar-toggler-icon, .navbar-toggler.navbar-toggler-2 .navbar-toggler-icon::after, .navbar-toggler.navbar-toggler-2 .navbar-toggler-icon::before {
  background: var(--menu-toggle2-color);
}

/* Buttons
=======================*/
.btn-primary {
  color: white !important;
  background-color: var(--btn-primary-custom-color);
  border-color: var(--btn-primary-custom-color);
}

.btn-primary:hover,
.btn-primary:active,
.btn-primary:focus,
.btn-primary.focus {
  color: white !important;
  background-color: var(--btn-primary-custom-color);
  background-color: var(--btn-primary-custom-color);
  border-color: var(--btn-primary-custom-color);
  background-image: linear-gradient(
    0deg,
    rgba(0,0,0,0.2) 0%,
    rgba(0,0,0,0.2) 100%);
}

.btn-primary.disabled, .btn-primary:disabled {
  background-color: var(--btn-primary-custom-color);
  border-color: var(--btn-primary-custom-color);
}
.btn-outline-primary {
  border-color: var(--btn-primary-custom-color);
  color:var(--btn-primary-custom-color);
}
.btn-outline-primary:hover {
  background-color: var(--btn-primary-custom-color);
  border-color: var(--btn-primary-custom-color);
}
.btn-outline-primary.disabled, .btn-outline-primary:disabled {
  color: var(--btn-primary-custom-color);
  background-color: transparent;
}


.btn-primary:not(:disabled):not(.disabled):active, .btn-primary:not(:disabled):not(.disabled).active,
.show > .btn-primary.dropdown-toggle {
  background-color:  var(--btn-primary-custom-color);
  border-color:  var(--btn-primary-custom-color);
}

/*Outer Glow for btns*/
.btn-primary:focus, .btn-primary.focus, .btn-secondary:focus, .btn-secondary.focus {
  box-shadow: 0 0 0 0.2rem rgba(0, 0, 0, 0.25);
}

.btn-primary:not(:disabled):not(.disabled):active:focus, .btn-primary:not(:disabled):not(.disabled).active:focus,
.show > .btn-primary.dropdown-toggle:focus,
.btn-secondary:not(:disabled):not(.disabled):active:focus, .btn-secondary:not(:disabled):not(.disabled).active:focus,
.show > .btn-secondary.dropdown-toggle:focus, .btn-outline-primary:focus, .btn-outline-secondary:focus {
  box-shadow: 0 0 0 0.2rem rgba(0, 0, 0, 0.25);
}


.btn-secondary {
  color: white !important;
  background-color: var(--btn-secondary-custom-color);
  border-color: var(--btn-secondary-custom-color);
  transition: all 0.3s;
  -webkit-transition: all 0.3s;
  -moz-transition:  all 0.3s;
}


.btn-secondary:hover,
.btn-secondary:active,
.btn-secondary:focus,
.btn-secondary.focus {
  color: white !important;
  background-color: var(--btn-secondary-custom-color);
  background-color: var(--btn-secondary-custom-color);
  border-color: var(--btn-secondary-custom-color);
  background-image: linear-gradient(
    0deg,
    rgba(0,0,0,0.2) 0%,
    rgba(0,0,0,0.2) 100%);
}

.btn-secondary.disabled, .btn-secondary:disabled {
  background-color: var(--btn-secondary-custom-color);
  border-color: var(--btn-secondary-custom-color);
}
.btn-outline-secondary {
  border-color: var(--btn-secondary-custom-color);
}
.btn-outline-secondary:hover {
  background-color: var(--btn-secondary-custom-color);
  border-color: var(--btn-secondary-custom-color);
}
.btn-outline-secondary.disabled, .btn-outline-secondary:disabled {
  color: var(--btn-secondary-custom-color);
  background-color: transparent;
}


.btn-secondary:not(:disabled):not(.disabled):active, .btn-secondary:not(:disabled):not(.disabled).active,
.show > .btn-secondary.dropdown-toggle {
  background-color:  var(--btn-secondary-custom-color);
  border-color:  var(--btn-secondary-custom-color);
}

/* For elementor Spotlight Button*/
.btn-custom {
  color: white !important;
  background-color: inherit;
}
.btn-custom:hover {
  background-image: linear-gradient(
    0deg,
    rgba(0,0,0,0.2) 0%,
    rgba(0,0,0,0.2) 100%);
  }

/* Callout Button
  =======================*/
  .navbar-nav .nav-item.callout a:link, .navbar-nav .nav-item.callout a:visited {
    border: 1px var(--callout-btn-text) solid;
    color: var(--callout-btn-text);
    background: var(--callout-btn-color);
  }

  .navbar-nav .nav-item.callout a:hover, .navbar-nav .nav-item.callout a:active {
    background-image: linear-gradient(
      0deg,
      rgba(0,0,0,0.2) 0%,
      rgba(0,0,0,0.2) 100%);
  }



/* Logo
  =======================*/
@media (min-width: 768px) {
  #logo, #logo-2 {
    height: var(--menu-logo-size) !important;
  }
}


  /* Footer
    =======================*/
.footer {
  background-color: var(--footer-bg-color);
}

.footer-custom-color {
  background-image: linear-gradient(0deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 100%); /*override primary darken*/
}

#modal-footer .modal-content {
  background-color: var(--footer-bg-color);
 background-image: linear-gradient(0deg, rgba(0, 0, 0, 0.3) 0%, rgba(0, 0, 0, 0.3) 100%);
}


.footer h5, ul.footer-menu li a:link, ul.footer-menu li a:visited, #modal-footer h6, #modal-footer button {
  color: var(--footer-headings-color);
}


.footer p, ul.footer-menu li > ul li a:link, ul.footer-menu li > ul li a:visited, .footer a:link, .footer a:visited {
  color: var(--footer-text-color);
}

/*
.bg-white {
  background: var(--bg-white-override) !important;
}*/