popup{
  position: absolute;
  bottom:calc(100% - ( 350px + 15px ) );
  left:50%;
  transform: translateX(-50%);
  margin:0;
  width:calc(100% - 14px);
  height: 350px;
  max-width: 450px;
  background: white;
  border-radius: 15px;
  padding:30px;
  box-sizing: border-box;
  transition: bottom 0.5 ease;
}


fade{
  display: block;
  position: absolute;
  top:0;
  left:0;
  width:100%;
  height:100%;
  background: rgba(0,0,0,0.3);
  backdrop-filter:blur(5px);
  -webkit-backdrop-filter:blur(5px);
  z-index:999999999999;
  transition: opacity 0.5 ease;
}


fade[jsmgr]
{
  opacity: 0;
  display: none;
}

popup[jsmgr]
{
  bottom:100%;
}


popup.background-darkblur{
  background: rgba(30,30,30,0.85);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
}
popup.background-lightblur{
  background: rgba(255,255,255,0.85);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
}
popup.background-dark{
  background: rgba(30,30,30,1);
}
popup.background-light{
  background: rgba(255,255,255,1);
}



popup button
{
  display: block;
  font-family: "Bold";
  margin-top: 30px;
  -moz-appearance: none;
  -webkit-appearance: none;
  font-size:17px;
  border-radius: 10px;
  height: 45px;

  box-sizing: border-box;

  margin-left: auto;
  margin-right: auto;

  color : white;
  border-color: transparent;

  width:100% !important;
  max-width: 100% !important;


  transition: all 0.4 ease;
  cursor: pointer;
}


popup form{
  position: absolute;
  bottom: 0;
  left:0;
  width:100%;
}
popup.background-dark formgroup:not(.no-border) button,
popup.background-darkblur formgroup:not(.no-border) button
{
  background: rgba(50,50,50,1);
  color:white;
}
popup.background-light formgroup:not(.no-border) button,
popup.background-lightblur formgroup:not(.no-border) button
{
  background: rgba(200,200,200,1);
  color:black;
}
popup h1[center] + *
{
  margin-top : 60px;
}

popup p
{
  width:100%;
  text-align: center;
}


popup formgroup.no-border button
{
  height:25px;
  overflow: visible;
  padding:5px;
  font-size: 15px;
}
popup formgroup.no-border
{
  overflow:visible !important;
}

popup>h1{
  margin:0 !important
}
popup img.main{
  display: block;
  margin:20px;

  height:70px;
  object-fit: contain;
  margin-left: auto;
  margin-right: auto;
}

popup h1[center] + img.main{
  margin-top:50px;
}
popup>h1[center]
{
  box-sizing: border-box;
  padding:30px !important;
  padding-top:10px !important;
}

popup.square,popup.square * {
  border-radius: 0;
}

popup form formgroup.no-border:last-of-type
{
  margin-bottom: 10px !important;
}
