#_echoverlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 10009; }

#_echoverlay-background {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(200, 200, 200, 0.8);
  z-index: 2; }

#_echoverlay-instance-container {
  position: absolute;
  top: 40px;
  left: 40px;
  right: 40px;
  bottom: 40px;
  z-index: 3; }

._echoverlay-instance {
  position: absolute;
  top: 0px;
  left: 0px;
  right: 0px;
  bottom: 0px;
  background-color: #FFFFFF;
  /*padding: 40px;*/
  padding: 40px 40px 123px 40px;
  display: none;
  border-radius: 10px; }
  ._echoverlay-instance._echoverlay-instance-activeingroup._echoverlay-instance-activegroup {
    display: block; }

._echoverlay-instance-inner {
  width: 100%;
  height: 100%;
  overflow: auto;
  display: none; }

._echoverlay-instance-inner-active {
  display: block; }

._echoverlay-close {
  position: absolute;
  top: 20px;
  right: 20px;
  height: 40px;
  width: 40px;
  border-radius: 50%;
  background-color: #000000;
  z-index: 5; }
  ._echoverlay-close:before, ._echoverlay-close:after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 20px;
    height: 2px;
    margin: -1px 0 0 -10px;
    background-color: #FFFFFF; }
  ._echoverlay-close:before {
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg); }
  ._echoverlay-close:after {
    -webkit-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg); }

._echoverlay-page {
  display: none;
  position: absolute;
  top: 50%;
  right: 20px;
  height: 40px;
  width: 40px;
  border-radius: 50%;
  background-color: #000000;
  z-index: 5;
  margin-top: -20px; }
  ._echoverlay-page:before, ._echoverlay-page:after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 35%;
    height: 2px;
    margin: -1px 0 0 -18%;
    background-color: #FFFFFF; }
  ._echoverlay-page:before {
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    margin-top: -13%; }
  ._echoverlay-page:after {
    -webkit-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg);
    margin-top: 8%; }
  ._echoverlay-page._echoverlay-page-prev {
    right: auto;
    left: 20px;
    margin-top: -20px; }
    ._echoverlay-page._echoverlay-page-prev:before {
      -webkit-transform: rotate(-45deg);
      -ms-transform: rotate(-45deg);
      transform: rotate(-45deg); }
    ._echoverlay-page._echoverlay-page-prev:after {
      -webkit-transform: rotate(45deg);
      -ms-transform: rotate(45deg);
      transform: rotate(45deg); }

._echoverlay-amount {
  display: block;
  width: 20px;
  height: 20px;
  line-height: 10px;
  font-size: 10px !important;
  padding: 5px 0;
  text-align: center;
  border-radius: 50%;
  position: absolute;
  top: 10px;
  right: 15px;
  background-color: #ED6B00;
  z-index: 10;
  color: #FFFFFF;
  font-weight: bold; }
  ._echoverlay-amount[data-amount="1"] {
    display: none; }

._echoverlay-pager {
  display: inline-block;
  vertical-align: middle;
  position: absolute;
  top: 10px;
  left: 50%;
  background-color: #FFFFFF;
  z-index: 5;
  padding: 6px 20px;
  min-width: 200px;
  margin-left: -100px;
  text-align: center;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px; }
  ._echoverlay-pager[data-amountingroup="1"] {
    display: none; }
  ._echoverlay-pager ._echoverlay-page {
    width: 20px;
    height: 20px;
    margin-top: -10px; }

._echoverlay-tabs {
  position: absolute;
  top: -30px;
  left: 0px;
  height: 30px;
  z-index: -1; }

._echoverlay-tab {
  display: inline-block;
  padding: 10px 20px;
  line-height: 10px;
  background-color: #F4F4F4;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
  text-decoration: none;
  position: relative;
  color: #333333; }
  ._echoverlay-tab:before {
    content: '';
    display: block;
    position: absolute;
    bottom: 0;
    height: 10px;
    width: 100%;
    background-color: #FFFFFF;
    margin-bottom: -10px;
    left: 0;
    right: 0; }

._echoverlay-tab-active {
  background-color: #FFFFFF;
  color: #ED6B00; }

html._echoverlay-active {
  margin: 0 !important;
  /*height: 100% !important;*/
  overflow: hidden !important; }
  html._echoverlay-active body {
    margin: 0 !important;
    /*height: 100% !important;*/
    overflow: hidden !important; }

.echoverlay-inner-wrap {
  position: relative;
  width: 100%;
  height: 100%; }

/*******************************************************************************************************/
/* classes that can be given as parameters in show_echoverlay() to alter the appearance of the overlay */
/*******************************************************************************************************/
#_echoverlay._echoverlay_compact ._echoverlay-instance, #_echoverlay._echoverlay_medium ._echoverlay-instance {
  padding: 40px; }
#_echoverlay._echoverlay_compact #_echoverlay-instance-container {
  max-width: 400px;
  max-height: 400px;
  width: calc(100% - 80px);
  height: calc(100% - 80px);
  top: 50%;
  left: 50%;
  right: auto;
  bottom: auto;
  transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%); }
#_echoverlay._echoverlay_compact ._echoverlay-close {
  top: calc(50% - 200px - 20px);
  right: calc(50% - 200px - 20px); }
#_echoverlay._echoverlay_medium #_echoverlay-instance-container {
  max-width: 700px;
  max-height: 700px;
  width: calc(100% - 80px);
  height: calc(100% - 80px);
  top: 50%;
  left: 50%;
  right: auto;
  bottom: auto;
  transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%); }
#_echoverlay._echoverlay_medium ._echoverlay-close {
  top: calc(50% - 350px - 20px);
  right: calc(50% - 350px - 20px); }
#_echoverlay .adminListContainer.echonet_listselect_active {
  padding: 0 10px; }
#_echoverlay .adminListElement {
  box-shadow: none;
  background-color: #F4F4F4;
  border-radius: 9px; }
#_echoverlay .adminList.raster .adminListElement {
  border: 1px solid #919191;
  background-color: transparent; }

/* _echoverlay_compact */
/* _echoverlay_medium */
@media screen and (min-width: 720px) {
  #_echoverlay .adminList {
    width: 100%; } }