/*!*****************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[4].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[4].use[2]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[4].use[3]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[10].use[0]!./src/scripts/gutenberg/blocks/mega-menus/styles/view.scss ***!
  \*****************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
/******************************************************************
Stylesheet: Variables

Here is where we declare all our variables like colors, fonts,
base values, and defaults. We want to make sure this file ONLY
contains variables that way our files don't get all messy.
No one likes a mess.

******************************************************************/
/*
SM
Phone sizes
*/
/*
MD
Phone / tablet sizes
*/
/*
LG
Tablet / laptop sizes
*/
/*
XL
Laptop sizes
*/
/*
Custom sizes
*/
/* 
This mixin is so we can have more consistency with the front-end & editor styles 
Add styles here that are not yet supported through theme.json
*/
.keep-all {
  word-break: keep-all !important;
}

.wp-block-madden-blocks-mega-menus {
  position: relative;
}

@media screen and (max-height: 700px) {
  .wp-block-madden-blocks-mega-menus {
    max-width: 75rem !important;
  }
}
.wp-block-madden-blocks-mega-menu {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
  width: 100%;
  height: auto;
  opacity: 0;
  transform: translateY(-20px);
  overflow: hidden;
  visibility: hidden;
  transition: transform 0.5s ease, opacity 0.5s ease;
}

.wp-block-madden-blocks-mega-menu.visible {
  opacity: 1;
  transform: translateY(-5px);
}

.wp-block-madden-blocks-mega-menu.active {
  visibility: visible;
}

.wp-block-madden-blocks-mega-menu nav a {
  transition: color 0.25s ease;
}

.wp-block-madden-blocks-mega-menu nav a:hover {
  color: var(--wp--preset--color--red) !important;
}

.wp-block-madden-blocks-mega-menu .wp-block-image:has(> a) > a {
  /* fix gap between anchor tag and figcaption */
  display: block;
}

/*# sourceMappingURL=view.css.map*/