.menu{
  border: 1px solid #26374A;
  z-index: 10;
  position: absolute;
  width: 315px;
  max-height: 100%;
  overflow-x: auto;
  background-color: #FFF;
  transform: translate(var(--x, 0), var(--y, 0));
  touch-action: none;
}

#menu{
  top: 0;
  left: 0;
  width: 375px;
}

.mediumview .panel-container-mobile-top .menu{
  width: 49% !important;
  max-height: 400px;
  position: relative;
  display: inline-block;
}

.mediumview .panel-container-mobile-top .menu:first-child{
  margin-right: 15px;
}

.smallview .panel-container-mobile-top .menu,
.smallview .panel-container-mobile-bottom .menu,
.xsmallview .panel-container-mobile-top .menu,
.xsmallview .panel-container-mobile-bottom .menu,
.xxsmallview .panel-container-mobile-top .menu,
.xxsmallview .panel-container-mobile-bottom .menu{
  width: 100% !important;
  max-height: 500px;
  position: relative;
}

.smallview #menu{
  width: 300px;
}

.xsmallview #menu,
.xxsmallview #menu{
  top: auto;
  left: auto;
  width: 100%;
  position: relative;
}

.menu .panel-header{
  background-color: #26374A;
  color: #FFF;
  border-bottom: 1px solid #FFF;
}

.menu .panel-header span.fas{
  margin-right: 15px;
}

.menu .panel-header span.fa-chevron-right{
  margin-right: 20px;
}

.menu .panel-header:hover,
.menu .panel-header:focus{
  cursor: pointer;
}

.menu .panel-header:hover span[class*="fa-chevron-"],
.menu .panel-header:focus span[class*="fa-chevron-"]{
  color: #999;
}

.menu .panel-body{
  background-color: #FFF;
}

.menu .panel-body .radio:first-child{
  margin-top: 0;
}

.menu .panel-body .checkbox{
  margin-top: 0;
  /*margin-bottom: 0;*/
}

.menu div[data-state="expanded"]{
  display: block;
}

.menu div[data-state="collapsed"]{
  display: none;
}

/*.largeview #menu,
.mediumview #menu{
  width: 310px;
}*/

.xlargeview .menu .panel-header,
.largeview .menu .panel-header{
  border-top-left-radius: 0;
}

.xlargeview .menu .panel-header span.fas,
.largeview  .menu .panel-header span.fas{
  padding: 15px;
}

.xlargeview .menu .panel-body,
.largeview .menu .panel-body{
  padding: 15px;
}

.xlargeview .menu .panel-body fieldset,
.largeview .menu .panel-body fieldset{
  margin-top: 15px;
  margin-bottom: 15px;
  padding-left: 15px;
  padding-right: 15px;
}

.xlargeview fieldset div:first-child,
.largeview fieldset div:first-child{
  margin-top: 15px;
}

.mediumview .menu .panel-body,
.smallview .menu .panel-body,
.xsmallview .menu .panel-body,
.xxsmallview .menu .panel-body{
  padding: 10px;
}

.mediumview .menu .panel-header span.fas,
.smallview .menu .panel-header span.fas,
.xsmallview .menu .panel-header span.fas,
.xxsmallview .menu .panel-header span.fas{
  padding: 10px 15px;
}

.xlargeview .menu .panel-header span.fas,
.largeview .menu .panel-header span.fas{
  padding: 15px;
}

.mediumview .menu .panel-body .radio,
.smallview .menu .panel-body .radio,
.xsmallview .menu .panel-body .radio,
.xxsmallview .menu .panel-body .radio{
  margin-bottom: 10px;
}

.mediumview .menu .panel-body .form-group,
.smallview .menu .panel-body .form-group,
.xsmallview .menu .panel-body .form-group,
.xxsmallview .menu .panel-body .form-group{
  margin-bottom: 10px;
}

.mediumview .menu .panel-body fieldset,
.smallview .menu .panel-body fieldset,
.xsmallview .menu .panel-body fieldset,
.xxsmallview .menu .panel-body fieldset{
  margin-top: 10px;
  margin-bottom: 10px;
  padding-left: 10px;
  padding-right: 10px;
}

.mediumview fieldset div:first-child,
.smallview fieldset div:first-child,
.xsmallview fieldset div:first-child,
.xxsmallview fieldset div:first-child{
  margin-top: 10px;
}

.smallview .menu,
.xsmallview .menu,
.xxsmallview .menu{
  width: 250px;
}

.footer-sticky{
  position: sticky;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 15px;
  border-top: 1px solid #26374A;
  background-color: #FFF;
  z-index: 100;
}
