
.login-container {
  max-width: none !important;
  width: 350px;
  position: relative;
      margin-right: auto;
    margin-left: auto;
    padding-left: 15px;
    padding-right: 15px;
}
.heading {
  text-align: center;
  margin: 50px -50px 0 -50px;
}
.heading h1 {
  text-align: center;
  font-size: 64px;
  color: #23377c;
  font-weight:  300;
}
.heading h2 {
  font-size: 14px;
  padding: 0;
  margin: 0;
  margin-bottom: 30px;
  color: #888;
  font-weight:  200;
  opacity: .8;
}
.heading h2 b {
  color: #444;
  font-weight: normal;
}

.article-content p {
    margin: 0 0 15px 0;
}
blockquote{
  font-size: 12px;
}
.login-box .nav{
border-bottom: 2px solid #23377c;
}
.login-box .tab {
  display: block;
  line-height: 25px;
  text-align: center;
  border-bottom: 0;
  cursor: pointer;
  color: #23377c;
  background: #fff;
  font-size: 14px;
  text-decoration: none;
}

.login-box .tab:hover {
  background: #5FB0E4;
  color: #fff;
}
.login-box .tab:nth-child(1) {
  border-right: 1px solid #ccc;
}
.login-box .tab.active {
  cursor: default;
  color: #fff;
  background-color: #23377c;
  border-bottom: 0px;
  text-decoration: none;
}
.login-box{
  width: 318px;
}

form.step {
  width: 318px;
  margin: 0;
  margin-bottom: 20px;
  background: white;
  padding: 25px;
  padding-bottom: 10px;
  box-shadow: 0 0 7px #ccc;
}


form.step .form-group {
  position: relative;
}
form.step .input-group input,
form.step .input-group-btn .btn,
form.step button {
  border-radius: 3px;
}
form.step input.form-control {
  border-radius: 3px;
}
form.step .help-block {
  font-size: 12px;
  color: #aaa;
  padding-left: 3px;
}
form.step .errors {
  color: #C6371D;
  float: right;
  display: none;
}
form.step .errors:after {
  font-family: 'Glyphicons Halflings';
  content: "\e101";
  font-size: 14px;
}
form.step .errors span {
  font-size: 12px;
  float: left;
  margin: 2px 3px 0;
}
form.step .has-error > .errors {
  display: block;
}
form.step .has-error > .errors .error {
  display: none;
}
form.step .has-error > .errors .error:first-child {
  display: block;
}
form.step .form-control-feedback {
  display: none;
  float: right;
  margin: -26px 12px 0 0;
  pointer-events: none;
}
form.step .form-control-feedback {
  margin-top: 26px;
}
form.step .has-success i.glyphicon-ok {
  display: block;
}
form.step .is-loading .loading {
  display: block;
}
form.step .is-loading .glyphicon-ok {
  display: none!important;
}
form.step label {
  /*
  font-weight: 200;
  */
}


form.step button.btn-block {
  margin-top: 20px;
  margin-bottom: 20px;
  letter-spacing: 2px;
  border-bottom-width: 5px;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3);
  border-radius: 3px;
}
form.step button.btn-block.register {
  margin-top: 0px;
}
form.step .btn img {
  height: 21px;
}
form.step hr {
  margin: 25px 0;
}
form.step .hr-text {
  text-align: center;
  height: 0px;
  padding: 0px;
  margin: 0px;
  margin-bottom: -12px;
}
form.step .hr-text span {
  display: inline-block;
  background: white;
  padding: 5px 10px;
  font-size: 12px;
  color: #888;
}

.red_dashed_border{
    border-width: 1px;
    border-style: dashed;
    border-color: red;
}

.alert {
  font-size: 13px;
  border-radius: 0px;
}
.alert.alert-warning {
  border-color: #F5CE7C;
}
.alert.alert-success {
  border-color: #90CB5D;
}

.login_checkbox_wrapper {
    left: 0px;
    top: -9px;
}
.login_checkbox_wrapper label {
    height: 16px;
    line-height: 16px;
    cursor: pointer;
    margin-left: 5px;
    position: relative;
    top: -3px;    

}

/*  email verification */

.modal-body .btn {
    zoom: 1;
    height: 36px;
    line-height: 36px;
    padding: 0 20px;
    color: #FFF;
    background: #00C1DE;
    border: none;
    outline: 0;
    cursor: pointer;
}
.modal-body .btn:hover {
    color: #FFF;
    background: #26CAE3;
}
.modal-body .form-item .mobile {
    height: 42px;
    line-height: 42px;
    width: 237px;
    text-align: left;
    background-color: #f5f5f6;
    border-color: #D7D8D9;
    color: #C3C5C6;
    border: 1px solid #ccc;
}

.fn-clear {
    zoom: 1;
}
.fn-clear:after {
    display: block;
    font-size: 0;
    content: " ";
}
.fn-clear:after, .form-item:after {
    clear: both;
    height: 0;
    visibility: hidden;
}
.modal-body .form-item .mobile .email-val {
    padding: 0 12px;
}
.modal-body .mobile-forgettip {
    text-align: left;
    width: 100%;
}
.fn-left {
    float: left;
}
.fn-right {
    float: right;
}

.modal-body .send-btn .btn {
    line-height: 42px;
    height: 42px;
    font-size: 14px;
    padding: 0;
    color: #FFF;
    background: #00C1DE;
    border: none;
    outline: 0;
    cursor: pointer;
    width: 140px;
}

.modal-body .send-btn .btn:hover {
    color: #FFF;
    background: #26CAE3;
}

.modal-body .send-btn {
    width: 140px;
}

.modal-body .mobile-code-item {
    float: none;
    margin-top: 8px;
}
.modal-body .form-item .checkcode {
    width: 100%;
    line-height: 42px;
    height: 42px;
    margin-right: 20px;
    border: 1px solid #D7D8D9;
    padding-left: 12px;
    font-size: 14px;
    outline: 0;
}
.modal-body .item-verify {
    text-align: left;
    margin-top: 20px;
    float: none;
}
.modal-body .fn-hide {
    display: none;
}
.modal-body .auth-msg {
    margin-top: 5px;
    padding: 5px 0;
    font-size: 12px;
    line-height: 13px;
    color: #333;
}
.modal-body .auth-error {
    margin-left: 0;
    color: #f15533;
}

.modal-body button.btn-submit {
    height: 36px;
    line-height: 36px;
    margin-left: 0;
        color: #FFF;
    line-height: 21px;
    width: 160px;
}
.modal-body .btn-disabled, .modal-body .btn-disabled:hover {
    background: #EBECEC !important;  
    color: #C3C5C6 !important;
    cursor: not-allowed;
    pointer-events: auto;
}


.initializing * {
  display: none; }
.initializing #loader, .initializing #loader * {
  display: block; }
.initializing #loader {

  top: 125px;
  left: 0;
  width: 100%;
  text-align: center;
  padding: 0;
  display: inline-block;
  vertical-align: top; }
  .initializing #loader #loader-text {
    -webkit-font-smoothing: antialiased;
    width: 100%;
    color: #fff;
    text-align: center;
    margin-top: 15px;
    font-size: 15px; }
  .initializing #loader #retry-initialization {
    display: none; }
  .initializing #loader svg, .initializing #loader img {
    margin-left: 122px;
    height: 34px;
    
  }
  .initializing #loader svg path,
  .initializing #loader svg rect {
    fill: #FFF; }

   #loader {
    display: none; 
    width: 138px;
    height: 138px;
    top: 50px;
    left: 65px;
    position: relative;
    border: 0;
}
    #loader.is-loading{
        display: block;
    }
   #loader img{
    top: 32px;
    left: 32px;
    position: relative;
    width:72px;
    height:72px;
   }

   #loader #loader-text{
    position: absolute;
    bottom: 10px;
    left:16px;
    color:#FFF;
   }
   #status {
    position: absolute;
    top: 199px;
    text-align: center; 
  }

#signup-host{
  display: none
}
#signup-host.show{
  display: block
}


 #connect {

    background: url("../img/connect.png") no-repeat;
    width: 138px;
    height: 138px;
    top: 50px;
    position: relative;

    left: 65px;
    cursor: pointer;
    border: 0;
    transition: all 0.2s; }

    #connect.is-loading{
        display: none;
    }

     #connect:hover {
      background: url("../img/connect_hover.png") no-repeat;
      width: 138px;
      height: 138px; }

  #host-input-wrapper {
    display: none;
    top: 200px;
    left: 50px;
    position: absolute;
  }
  #host-input-wrapper input.input-lg{
    height: 36px;
    padding: 8px 12px;
    font-size: 12px;
    line-height: 1.33;
    width: 220px;
  }

    
  #host-input-wrapper.show{
      display: block; 
  }

  #map-world {
    background: url("../img/world_map_.png");
    position: absolute;
    width: 218px;
    height: 109px;
    bottom: 40px;
    left: 50px;
    z-index: 0; }


     #map-world .location {
      background: url("../img/world_map_pin.png");
      position: absolute;
      width: 16px;
      height: 22px;
 
      transition: 0.3s; }
/*
@media only screen and (-webkit-min-device-pixel-ratio: 2), not all, not all, not all {
    #map-world {
      background-image: url("../img/world_map@2x_.png");
    position: absolute;
    width: 218px;
    height: 109px;
    bottom: 80px;
    left: 80px;
    z-index: 0; }
      #map-world .location {
        background-image: url("../img/map_pin@2x_.png");
        background-size: 16px 22px; } 
}
*/

#preferences {
  position: absolute;
  top: 11px;
  right: 10px;
  background: url("../img/settings.png");
  width: 23px;
  height: 23px;
  transition: 300ms ease all; }
  #preferences:hover {
    transform: rotate(90deg);
    cursor: pointer; }

  #map-world .location.US_LA {
        display: block;
        top: 28px;
        left: 150px;
  }
  #map-world .location.US_SF {
        display: block;
    top: 22px;
    left: 147px;
  }
  #map-world .location.US_Fremont {
    display: block;
    top: 24px;
    left: 148px;
  }
  #map-world .location.US_SanJose {
    display: block;
    top: 25px;
    left: 147px;
  }
  #map-world .location.US_Seattle {
    display: block;
top: 20px;
    left: 147px;
  }
  #map-world .location.US_Dallas {
    display: block;
    top: 26px;
    left: 164px;
  }
  #map-world .location.US_NYC {
    display: block;
    top: 18px;
    left: 181px;
  }
  #map-world .location.US_Newark {
    display: block;
    top: 19px;
    left: 180px;
  }
  #map-world .location.JP_Tokyo {
        display: block;
        top: 27px;
        left: 89px;
  }
       #map-world .location.JP_Osaka {
        display: block;
        top: 28px;
        left: 90px;
         }
        /*
       #map-world .location.JP_Kyodo {
        display: block;
        top: 27px;
        left: 90px;}
      */
       #map-world .location.HK_HK {
        display: block;
        top: 35px;
        left: 77px;
       }
       #map-world .location.SG_SG {
        display: block;
        top: 53px;
        left: 68px; }
       #map-world .location.Korea_Seoul {
        display: block;
      top: 28px;
      left: 83px;
      }
       #map-world .location.France_Paris {
        display: block;
            top: 19px;
    left: 7px;
      }



       #map-world .location.UK_London {
        display: block;
        top: 13px;
        left: 3px;
      }

       #map-world .location.Netherlands_Amsterdam {
        display: block;
        top: 14px;
        left: 9px;

      }
       #map-world .location.Germany_Frankfurt {
        display: block;
        top: 19px;
        left: 12px;
      }
       #map-world .location.Austria_Vienna {
        display: block;
        top: 19px;
        left: 15px;
      }
       #map-world .location.Hungary_Budapest {
        display: block;
        top: 18px;
        left: 16px;
      }
       #map-world .location.Russia_Moscow {
        display: block;
    top: 12px;
    left: 32px;
      }
       #map-world .location.Russia_Vladivostok {
        display: block;
    top: 22px;
    left: 87px;
      }
       #map-world .location.Russia_Novosibirsk {
        display: block;
    top: 12px;
    left: 57px;
      }
       #map-world .location.Australia_Sydney {
        display: block;
top: 72px;
    left: 97px;
      }

.logged_in
{
width: 518px;
    margin: 0;
    margin-bottom: 20px;
    background: white;
    padding: 25px;
    padding-bottom: 40px;
    box-shadow: 0 0 7px #ccc;

}

  