.modal-content
{
  /*border-radius:*/
}

.modal-import .modal-body,
.modal-share .modal-body
{
  padding:0px 30px;
}

.modal-import .modal-body label {
   width: 100%;
   float: left;
   margin-bottom: 10px;
}

.modal-body .item-input input, .modal-body .item-input textarea  {
  border: 1px solid #ccc;
  padding:10px;
}

.modal-body .item-input h1 {
   padding:10px 0px;
}

.modal-body .item-input textarea {
  height: 150px;
}

.modal-footer button {
    width: 150px;
    height: 40px;
    font-size: 16px;
    margin: 15px 15px;
    -webkit-box-shadow: 0px 0px 8px rgba(0,0,0,0.2);
    -moz-box-shadow: 0px 0px 8px rgba(0,0,0,0.2);
    box-shadow: 0px 0px 8px rgba(0,0,0,0.2);
    border: none;
    background-color: transparent;
}

.modal-import .modal-body .list,
.modal-share .modal-body .list
{
  margin: 0px 15px;
}

.modal-import .modal-body .border-box
{
  border: 1px dashed #bdbdbd;
  text-align: center;
  overflow: hidden;
}

.modal-import .modal-body .desc
{
  color: #757576;
  text-align: center;
  margin-top: 40px;
  font-size: 22px;

  white-space: normal;
  word-wrap:  normal;
}

.modal-import .modal-body .selectBtn
{
    color: #fff;
    background-color: #25c5d9;
    border: none;

    margin: 40px 0px;

    padding: 0 15px;
    border-radius: 0;
    vertical-align: top;
    text-align: center;
    font-size: 22px;
    cursor: pointer;

    white-space: normal;
    word-wrap:  normal;
 }

.modal-import .modal-body .selectBtn:hover,
.modal-import .modal-body .selectBtn:active
{
	background-color: #ee524f;
  color: #fff;
}

/********** Download panel **********/
.modal-download .modal-body .border-box-download
{
  border: none;
  text-align: center;
  overflow: hidden;
}

.modal-download .modal-header .modal-title {
      margin: 45px 0px 0px 50px;
}

.modal-download .modal-body .desc {
  margin: 40px 50px 40px 50px;
}

.modal-download .modal-body .desc .button {
  width: 100%;
  background-color: #fff;
  display: block;
  margin: 10px 0px;
}

/********** share panel **********/
.modal-share .modal-body .border-box-share
{
  border: 1px solid #bdbdbd;
  text-align: center;
  overflow: hidden;
  margin: 30px 60px 40px;
  padding-bottom: 35px;
}

.modal-share .modal-footer .border-box-share {
    border: none;
    text-align: center;
    overflow: hidden;
    margin: 0px 90px;
}

.modal-share .modal-header .modal-title,
.modal-share .modal-footer .modal-title
 {
      margin: 0;
      margin-top: 45px;
      margin-left: 60px;
      margin-right: 60px;
      color: #58585b;
      font-size: 24px;
      font-weight: bold;
      line-height: 30px;
      /* margin-left: 15px;
      margin-right: 45px; */
}

.modal-share .modal-footer .modal-title
{
    margin-left: 60px;
    margin-top: 0px;
}

.modal-share .modal-header .modal-title .right_text {
    display: block;
    float: right;
    font-size: 14px;
    color: #2962ff;
    font-style: italic;
    font-weight: bold;
}

.modal-share .modal-body .desc {
  margin: 40px 30px 40px 30px;
}

.modal-share .modal-body .desc .sharename,
.modal-share .modal-footer .embedmap {
    border: 1px solid #939597;
    width: 100%;
    padding: 12px 10px;
}

.modal-share .modal-body .desc .contain {
  margin: 15px 0px;
}

.modal-share .modal-body .desc .contain .display-button {
  float: left;
}

.modal-share .modal-body .desc .contain .display-button input[type=radio] {
  display:none;
}

.modal-share .modal-body .desc .contain .display-button input[type=radio] + label
{
  display: inline-block;
    width: 30px;
    height: 30px;
    text-align: left;
    background: none;
    border: 1px solid #bdbdbd;
    overflow: hidden;
    background-position: center center;
    background-size: 30px 30px;
    background-repeat: no-repeat;
    margin: 0;
    padding: 0;
    /* -webkit-box-shadow: 0px 0px 8px rgba(0,0,0,0.2);
    -moz-box-shadow: 0px 0px 8px rgba(0,0,0,0.2);
    box-shadow: 0px 0px 8px rgba(0,0,0,0.2);*/
}

.modal-share .modal-body .desc .contain .display-button input[type=radio]:checked + label
{

    border: none;
    -webkit-box-shadow: 0px 0px 8px rgba(0,0,0,0.2);
    -moz-box-shadow: 0px 0px 8px rgba(0,0,0,0.2);
    box-shadow: 0px 0px 8px rgba(0,0,0,0.2);
}

.modal-share .modal-body .desc .contain .display-button .title
{
    font-size: 16px;
    line-height: 18px;
    font-weight: bold;
    float: right;
    padding: 6px 15px 0px 15px;
}

.modal-share .modal-body .desc .contain .button,
.modal-share .modal-footer .button {
    background-color: #ed3f23;
    float: right;
    font-size: 16px;
    line-height: 30px;
    margin: 0;
    padding: 0px 10px;
    border: none;
    color: #fff;
    min-height: 30px;
}

.modal-share .modal-footer .button {
  float: left;
  margin: 15px 0px 0px 90px;
  border: 1px solid #fff;
}

.modal-share .modal-body .desc .contain .button:hover,
.modal-share .modal-footer .button:hover {
    background-color: #fff;
    color: #333;
    border:1px solid #333;
}


.modal-import .modal-footer,
.modal-share .modal-footer
{
  text-align: left;
  border: none;

  white-space: normal;
  word-wrap:  normal;
}

.modal-import .modal-footer .button
{
  width: 150px;
  border-radius: 0;
  font-size: 22px;
  text-align: center;
  text-overflow: ellipsis;
  cursor: pointer;
}

.modal-import .modal-footer .import,
.modal-share .modal-footer .share
{
  margin-left: 15px;

  /*color: #e0e0e0;*/
  background-color: #fff;
  border: 2px solid #26c6da;
 }

.modal-import .modal-footer .import:hover,
.modal-import .modal-footer .import:active,
.modal-share .modal-footer .share:hover,
.modal-share .modal-footer .share:active
{
  /*color: #e0e0e0;*/
  border: 2px solid #ef5350;
 }

.modal-import .modal-footer .cancel
.modal-share .modal-footer .cancel
{
  /*color: #58585b;*/
  background-color: #fff;
  border: 2px solid #58585b;
}

.modal-import .modal-footer .cancel:hover,
.modal-import .modal-footer .cancel:active,
.modal-share .modal-footer .cancel:hover,
.modal-share .modal-footer .cancel:active
{
  /*color: #58585b;*/
  border: 2px solid #ef5350;
}

@media (max-width: 350px){
  .modal-import .modal-header .button
  {
    margin: 0px;
  }

  .modal-import .modal-header .modal-title
  {
    margin-right: 30px;
  }

  .modal-import .modal-body .list
  {
    margin: 0px;
  }

  .modal-import .modal-footer
  {

  }

  .modal-import .modal-footer .button
  {
    width: 100%;
    min-width: 0px;
    display: block;
    margin:0px;
    margin-top: 10px;

    overflow: hidden;
    text-overflow:ellipsis;
  }
}

.modal-login .modal-body
{
  padding:0px 30px;
  padding-bottom: 40px;
}

.modal-login .modal-body .row
{
  margin-right: 15px;
  margin-left: 15px;
}

.modal-login .modal-body .row img.thumbnail
{
  padding:5px;
  margin-left: auto;
  margin-right: auto;
  background-color: #fff;
  border:1px solid #ccc;
}

.modal-login .modal-body .row.padded-row
{
  margin-top: 10px;
  margin-bottom: 10px;
}

.modal-login .modal-body .row.padded-bottom
{
  margin-bottom: 10px;
}

.modal-login .modal-body .row .item-padded
{
  padding-right: 5px;
  padding-left: 5px;
}

.modal-login .modal-body .row .subtitle
{
  color: #000;
}

.modal-login .modal-body .row input[type=checkbox].purple-checkbox
{
  position:absolute; z-index:-1000;
  left:-1000px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  height:1px;
  width:1px;
  margin:-1px;
  padding:0;
  border:0;
}

.modal-login .modal-body .row.item-input
{
  margin-bottom: 15px;
}

.modal-login .modal-body .row.item-input input
{
  height: 34px;
}

.modal-login .modal-body .row .form-control
{
  display: block;
  width: 100%;
  height: 34px;
  padding: 6px 12px;
  font-size: 14px;
  line-height: 1.42857143;
  color: #555;
  background-color: #fff;
  background-image: none;
  border: 1px solid #ccc;
  border-radius: 4px;
  -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
  box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
  -webkit-transition: border-color ease-in-out .15s,-webkit-box-shadow ease-in-out .15s;
  -o-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
  transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
}

.modal-login .modal-body .message,
.modal-login .modal-body .row .message
{
  font-size: 13px;
}

.modal-login .modal-body .message .required,
.modal-login .modal-body .row .message .required
{
  color: red;
  padding: 3px 5px;
}

.modal-login .modal-body .row input[type=checkbox].purple-checkbox + label.purple-label
{
  padding-left:23px;
  height:18px;
  display:inline-block;
  line-height:18px;
  background-repeat:no-repeat;
  background-position: 0 0;
  font-size:18px;
  vertical-align:middle;
  cursor:pointer;
}

.modal-login .modal-body .row input[type=checkbox].purple-checkbox:checked + label.purple-label
{
  background-position: 0 -18px;
}

.modal-login .modal-body .row label.purple-label
{
  background-image:url("https://web-static.onemap.sg/images/main/misc/purple-checkbox.png");
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.modal-login .modal-body .row a,
.modal-login .modal-body .row button
{
  cursor: pointer;
}

.modal-login .modal-body .row button:disabled
{
  color: #000;
  cursor: not-allowed;
}

.modal-login .modal-body .row a.btn,
.modal-login .modal-body .row button[type="submit"].btn
{
  display:block;
  padding: 7px;
  margin-top: 10px;
  margin-bottom: 20px;
  border-radius:0px;
  border: none;

  color:#fff;
  outline: none !important;
  box-shadow: none;
}

.modal-login .modal-body .row button[type="submit"].btn
{
  width: 100%;
}

.modal-login .modal-body .row .gray,
.modal-login .modal-body .row .gray:hover,
.modal-login .modal-body .row .gray:active
{
  background: rgba(209,210,212,1);
  background: -moz-linear-gradient(top, rgba(209,210,212,1) 0%, rgba(167,169,171,1) 100%);
  background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(209,210,212,1)), color-stop(100%, rgba(167,169,171,1)));
  background: -webkit-linear-gradient(top, rgba(209,210,212,1) 0%, rgba(167,169,171,1) 100%);
  background: -o-linear-gradient(top, rgba(209,210,212,1) 0%, rgba(167,169,171,1) 100%);
  background: -ms-linear-gradient(top, rgba(209,210,212,1) 0%, rgba(167,169,171,1) 100%);
  background: linear-gradient(to bottom, rgba(209,210,212,1) 0%, rgba(167,169,171,1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d1d2d4', endColorstr='#a7a9ab', GradientType=0 );
}

.modal-login .modal-body .row a.facebook,
.modal-login .modal-body .row a.facebook:hover,
.modal-login .modal-body .row a.facebook:active
{
  background-color: #3c59fd;
}

.modal-login .modal-body .row a.google,
.modal-login .modal-body .row a.google:hover,
.modal-login .modal-body .row a.google:active
{
  background-color: #ee2321;
}

.terms-intro{color: #000;font-size: 13px;margin-top:10px;margin-left: 9px;}
