/**
 * Styles for Fusion Extension - Menu Modal
 */

.fsn-menu.menu_modal .menu-modal-trigger  {
  display:inline-block;
  border:0;
  background:transparent;
  box-shadow:none;
  position:relative;
  padding:9px 10px;
}
.fsn-menu.menu_modal .menu-modal-trigger .icon-bar  {
  display:block;
  width:22px;
  height:2px;
  background:#333;
}
.fsn-menu.menu_modal .menu-modal-trigger .icon-bar + .icon-bar  {
  margin-top:4px;
}
.fsn-menu.menu_modal .menu-logo {
  text-align:center;
}
.fsn-menu.menu_modal .menu-logo img {
  height:auto;
}
#menu-modal .modal-dialog {
  background:#ffffff;
  -ms-transform:none;
  -moz-transform:none;
  -webkit-transform:none;
  transform:none;
  -moz-transition:none;
  -webkit-transition:none;
  transition:none;
}
.menu-modal-controls {
  position:absolute;
  top:0;
  left:0;
  right:0;
}
.menu-modal-controls .close  {
  position:absolute;
  top:21px;
  right:15px;
  padding:9px 10px;
  display:inline-block;
  border:0;
  background:transparent;
  box-shadow:none;
  opacity:1;
}
.menu-modal-controls .close .icon-bar  {
  display:block;
  width:22px;
  height:2px;
  background:#333;
  -ms-transform:rotate(45deg) translateZ(0);
  -moz-transform:rotate(45deg) translateZ(0);
  -webkit-transform:rotate(45deg) translateZ(0);
  transform:rotate(45deg) translateZ(0);
}
.menu-modal-controls .close .icon-bar + .icon-bar  {
  margin-top:-2px;
  -ms-transform:rotate(-45deg) translateZ(0);
  -moz-transform:rotate(-45deg) translateZ(0);
  -webkit-transform:rotate(-45deg) translateZ(0);
  transform:rotate(-45deg) translateZ(0);
}
#menu-modal .multi-col-nav-column a,
#menu-modal .multi-col-nav-column .menu-item-parent-label {
  font-size:18px;
}
#menu-modal .multi-col-nav-column .nested-menu-items a {
  font-size:14px;
}
.menu-modal-open .modal.component {
  z-index:1051;
}
.menu-modal-open .modal-backdrop + .modal-backdrop  {
  z-index:1050;
}

@media (max-width: 767px) {
  body.menu-modal-open  {
    position:fixed;
    top:0;
    left:0;
    right:0;
    bottom:0;
  }
  .fsn-menu.menu_modal .menu-container  {
    padding:10px 0;
  }
  .fsn-menu.menu_modal .menu-button,
  #menu-modal .menu-button {
    display:none;
  }
  .fsn-menu.menu_modal .menu-trigger  {
    position:absolute;
    top:15px;
    right:15px;
    z-index:1;
  }
  #menu-modal .modal-dialog {
    text-align:center;
    margin:0;
    padding:0;
    min-height:100%;
  }
  #menu-modal .menu-modal-inner	{
    padding:100px 15px 120px;
  }
  #menu-modal .multi-col-nav-column {
    width:100% !important;
  }
}

@media (min-width: 768px) {
  .fsn-menu.menu_modal .menu-container  {
    padding:30px 60px 30px 50px;
  }
  .fsn-menu.menu_modal .menu-container:before,
  .fsn-menu.menu_modal .menu-container:after  {
    content:' ';
    display:table;
  }
  .fsn-menu.menu_modal .menu-container:after  {
    clear:both;
  }
  .fsn-menu.menu_modal .menu-trigger,
  .fsn-menu.menu_modal .menu-logo,
  .fsn-menu.menu_modal .menu-button  {
    float:left;
    width:33.33333333%;
  }
  .fsn-menu.menu_modal .menu-button {
    text-align:right;
  }
  #menu-modal .menu-button  {
    position:absolute;
    top:30px;
    right:60px;
  }
  #menu-modal .modal-dialog {
    width:auto;
    margin:0 auto;
    width:100%;
    height:100vh;
  }
  #menu-modal .menu-modal-inner	{
    display: -ms-flexbox;
    display:-webkit-flex;
    display:flex;
    -ms-flex-align: center;
    -webkit-align-items:center;
    align-items:center;
    padding-top:100px;
    padding-bottom:10vh;
    height:auto;
    min-height:100vh;
  }
  .menu-modal-controls .close  {
    top:36px;
    left:50px;
    right:auto;
  }
  #menu-modal .multi-col-nav-container  {
    width:100%;
    padding-left:8.33333333%;
    padding-right:8.33333333%;
  }
  #menu-modal .multi-col-nav-container:before,
  #menu-modal .multi-col-nav-container:after {
    content:" ";
    display:table;
  }
  #menu-modal .multi-col-nav-container:after {
    clear:both;
  }
  #menu-modal .multi-col-nav-column {
    float:left;
    padding-left:6px;
    padding-right:6px;
  }
  #menu-modal .multi-col-nav-column a,
  #menu-modal .multi-col-nav-column .menu-item-parent-label {
    font-size:24px;
  }
  #menu-modal .multi-col-nav-column .nested-menu-items a {
    font-size:16px;
  }
}