#_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, 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 { padding:40px; }
#_echoverlay._echoverlay_medium ._echoverlay-instance { padding:40px; }

/* _echoverlay_compact */
#_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_medium */
#_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; }

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