/*
    To change this license header, choose License Headers in Project Properties.
    To change this template file, choose Tools | Templates
    and open the template in the editor.
*/
/*
    Created on : Apr 10, 2020, 10:23:51 AM
    Author     : esabil
*/
/*rgba(#E8D1DA, 1); */
.ss_mobile_popup_main_base {
  position: fixed;
  z-index: 3;
  left: 0;
  top: 0;
  width: calc(100% - 0.2em);
  height: 100%;
  /*height:100vh;*/
  border: 0px solid blue;
  /*background-color: rgba(220,220,220,0.75);*/
  background-color: rgba(200, 200, 200, 0.85);
  font-family: Gotham-Book;
  scroll-behavior: smooth;
  overscroll-behavior: contain;
  overflow: hidden;
  z-index: 99999; }

.ss_mobile_popup_main_base_activate {
  visibility: visible; }

/* this is used to navigate the menu bar */
.ss_mobile_popup_menu_base {
  position: absolute;
  width: calc(100% - 3em);
  float: bottom;
  bottom: 3vh;
  text-align: center;
  margin-left: 1.5em; }

.ss_mobile_popup_options {
  /*box-shadow: inset 0 0 2px rgba(0,0,0,0.3);*/
  box-shadow: 0 0px 5px 0px rgba(100, 100, 100, 0.7);
  border: 1px solid rgba(240, 240, 240, 0.5);
  border-radius: 10px;
  text-align: center;
  max-height: 30vh;
  overflow-y: auto;
  overflow-y: scroll;
  background-color: white;
  /* the following three important */
  scroll-behavior: smooth;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch; }

.ss_mobile_popup_optionN {
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
  border: 1px solid rgba(240, 240, 240, 0.5);
  margin: auto;
  height: 3em;
  cursor: pointer;
  letter-spacing: 1px; }

.ss_mobile_popup_optionN_content {
  overflow: hidden; }

.ss_mobile_popup_optionN_content span:nth-of-type(2) {
  float: right;
  padding-right: 1em; }

.ss_mobile_popup_optionN_content label {
  cursor: pointer; }

/* this is only used to manage scrolling see the event */
.ss_mobile_popup_optionN_content_label {
  overflow: hidden; }

.ss_mobile_popup_optionN:hover {
  background-color: rgba(200, 200, 200, 0.3);
  cursor: pointer; }

.ss_mobile_popup_actions {
  margin-top: 0.5em;
  border-radius: 10px;
  border: 1px solid rgba(240, 240, 240, 0.5);
  text-align: center;
  box-shadow: inset 0 0 2px rgba(0, 0, 0, 0.3);
  box-shadow: 0 0px 5px 0px rgba(100, 100, 100, 0.7);
  background-color: white;
  /*background-color: rgba(240,240,240,0.85);*/
  /*
  background-color: rgba(240,240,240,0.85);
  */
  text-align: left; }

.ss_mobile_popup_actions_typebox {
  box-shadow: inset 0 0 5px rgba(100, 100, 100, 0.7);
  box-shadow: none;
  opacity: 0.55; }

.ss_mobile_popup_actionN {
  height: 2.5em;
  color: #347BB7;
  cursor: pointer; }

.ss_mobile_popup_actionN label {
  cursor: pointer; }

.ss_mobile_popup_actionN:hover {
  background-color: rgba(200, 200, 200, 0.3);
  cursor: pointer; }

.ss_mobile_popup_typebox_base {
  height: 2.5em;
  color: #347BB7;
  cursor: pointer;
  border: 0px solid #337ab7;
  box-shadow: 0 0 10px 0px #98bcdb;
  border-radius: inherit; }

.ss_mobile_popup_typebox_base label {
  cursor: pointer; }

.ss_mobile_popup_typebox {
  width: 100%;
  text-align: center;
  height: 2.4em; }

/* search icon*/
.ss_mobile_popup_typebox > span {
  position: absolute;
  padding-top: 0.7em;
  padding-left: 1em;
  padding-right: 1em;
  text-align: left; }

/* close icon*/
/* .ss_mobile_popup_typebox span:nth-of-type(2) */
.ss_mobile_popup_typebox_closeicon_wrap {
  position: absolute;
  top: 0;
  vertical-align: top;
  right: 0.5em;
  padding: 0.6em;
  color: #a8a8a8;
  /*
  width:1em;
  height:1em;
  
  padding-top:0.7em;
  right:1em;
  
  */ }

.ss_mobile_popup_typebox_inputwrap {
  margin: 0;
  width: 99%;
  vertical-align: top;
  height: 100%; }

.ss_mobile_popup_typebox_inputwrap input {
  font-size: 1em;
  vertical-align: top;
  background-color: transparent;
  width: calc(97% - 4em);
  height: calc(100% - 0.5em);
  opacity: 0.7;
  padding-left: 1em;
  border: 1px solid transparent; }

/* ********************************************************************************
    MOBILE PHONE
********************************************************************************  */
/* 
   mobile - portrait (must be max width)
   and
   keyboard poped up
*/

/*# sourceMappingURL=popup.css.map */