@charset "utf-8";


input, textarea, p, div, ol, ul, li, span {
  box-sizing: border-box;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  outline: none;
}

.main2 {
  margin: 0;
  background: url(Images/bgg2.png) repeat-x 0 -345px !important;
}

.bazalogo2 {
  position: absolute;
  top: 25px;
  left: 35px;
  width: 300px;
  height: 35px;
  margin: 0px 0 34px 10px;
}

.companyName {
  margin: 10px 0 25px;
  padding-left: 8px;
  font-size: 17px;
  border-left: 4px solid #0B347D;
  color: #0B347D;
  line-height: 20px;
}

.disnon {
  display: none;
}


/*----------------------------- validationError ----*/

.error_div {
  margin-top: 2px;
}

.field-validation-error, .validation-summary-errors ul li, .login_wrapper .field-validation-error {
  display: inline-block;
  list-style: none;
  background: url(Images/error.png) no-repeat left 1px;
  margin-top: 2px;
  padding-left: 17px;
  font-size: 12px;
  color: Red;
}

.login_wrapper .validation-summary-errors {
  margin: 0;
}

.validation-summary-errors ul {
  display: inline-block;
  margin: 10px 0 0;
  font-weight: bold;
}

.validation-summary-errors span {
  display: block;
}


/*----------------------------- googleapps_div ----*/

.googleapps_div {
  clear: both;
  margin: 10px 0 0 10px;
  padding-top: 10px;
  font-size: 13px;
}

.googleapps_div div {
  height: 22px;
  padding-left: 115px;
}

.googleapps_div .apps {
  background: url(Images/googleapps.png) no-repeat;
}

.googleapps_div .accounts {
  margin-top: 7px;
  background: url(Images/googleaccounts.png) no-repeat;
}

.forgotpw {
  margin: 10px 0 0px;
  display: inline-block;
  text-align: left;
  font-size: 12px;
  white-space: nowrap;
}

/*----------------------------- checksitename ----*/

.checksitename {
  display: block;
  width: 200px;
  margin: 5px 0 5px;
  line-height: 30px;
  border-radius: 4px;
  border: 1px solid #ccc;
  font-size: 12px;
  background: #ffffff; /* Old browsers */
  background: -moz-linear-gradient(top,  #ffffff 5%, #eeeeee 87%); /* FF3.6+ */
  background: -webkit-gradient(linear, left top, left bottom, color-stop(5%,#ffffff), color-stop(87%,#eeeeee)); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(top,  #ffffff 5%,#eeeeee 87%); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(top,  #ffffff 5%,#eeeeee 87%); /* Opera 11.10+ */
  background: -ms-linear-gradient(top,  #ffffff 5%,#eeeeee 87%); /* IE10+ */
  background: linear-gradient(top,  #ffffff 5%,#eeeeee 87%); /* W3C */
  font-family: inherit;
}
.checksitename:hover {
  cursor: pointer;
  background: #fff;
}

#check_result, .check_ok {
  display: block;
  list-style: none;
  background: url(Images/error.png) no-repeat left 3px;
  margin-left: -5px;
  padding-left: 17px;
  color: Red;
  font-size: 13px;
}

#check_result {
  margin-left: 0 !important;
}

.check_ok {
  background: url(Images/check_ok.png) no-repeat left 3px !important;
  color: Green !important;
}

a img {
  border: 0;
}

/*----------------------------- na_box ----*/

.na_box {
  border-top: 1px solid #ccc;
  margin: 10px 0 0;
  padding: 20px 0 0;
  font-size: 13px;
}

/*----------------------------- input style ----*/

input.loginBtn {
  float: right;
  width: auto;
  display: inline-block;
  margin: 25px 4px 3px 0;
  padding: 12px 2em;
  color: #fff;
  font-weight: bold;
  border-radius: 4px;
  -moz-border-radius: 4px;
  -webkit-border-radius: 4px;
  font-size: 14px;
  text-decoration: none;
  line-height: 20px;
  background: #3dbbe5;
  background: -moz-linear-gradient(top, #3dbbe5 0%, #25a6d1 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#3dbbe5), color-stop(100%,#25a6d1));
  background: -webkit-linear-gradient(top, #3dbbe5 0%,#25a6d1 100%);
  background: -o-linear-gradient(top, #3dbbe5 0%,#25a6d1 100%);
  background: -ms-linear-gradient(top, #3dbbe5 0%,#25a6d1 100%);
  background: linear-gradient(to bottom, #3dbbe5 0%,#25a6d1 100%);
  box-shadow: none;
  border-color: #27a4cf #27a4cf #1e99c3;
  color: #fff!important;
  border: 1px solid #25a6d1;
  cursor: pointer;
}

input.loginBtn:hover {
  opacity: .7;
}

input[type="text"]:hover,
input[type="password"]:hover {
    border-color: #009ee2;
    box-shadow: 0 0 0 3px #d9f3fc;
}

input[disabled] {
  opacity: 0.5;
  -moz-opacity: .5;
  filter: alpha(opacity=80);
  color: #fff !important;
}


/*----------------------------- loginbox ----*/

.formbox, .loginbox, .loginbox dl {
  overflow: hidden;
}

.loginbox {
    position: relative;
    margin: 0 auto;
    padding: 35px 50px 35px;
    background: #fff;
    border-radius: 5px;
    border: 1px solid #ddd;
    box-shadow: 0 2px 16px rgba(0,0,0,.1);
}

.box1 {
  width: 850px;
  padding: 40px 50px 50px;
}

.box1_left {
  width: 540px;
  float: left;
  padding-right: 38px;
  border-right: 1px solid #eaeaea;
}

.box2 {
  width: 612px;
}

.box2 .account_box {
  padding: 30px;
  border: 1px solid #eee;
  border-radius: 3px;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  overflow: hidden;
  background: #f4f6f8;
}

.loginbox .title span {
  display: block;
  margin: 0;
  font-size: 14px;
  line-height: 30px;
  font-weight: bold;
  color: #555;
}


/*----------------------------- loginbox DL ----*/

.loginbox dl {
  clear: both;
  margin-top: 10px;
}

.loginbox dt,
.loginbox dd{
  float: left;
}

.loginbox dt {
  float: left;
  width: 85px;
  text-align: left;
  padding-top: 10px;
}

.loginbox dd {
  width: 329px;
}

.googleaccount dt {
  width: 90px;
}

.loginbox dd {
float: right;
    padding: 3px;
}

.regist dd {
  width: 368px;
}

.formbox {
  margin: 5px 0 0;
}

.logintitle {
  display: block;
  margin: -5px 0 15px;
  text-align: center;
  font-size: 28px;
  font-weight: normal;
  color: #7a9bac;
  overflow: hidden;
}

.logintitle .logoimg {
  float: left;
  display: inline-block;
  width: 180px;
}

.logintitle img {
  width: 100%;
  height: auto;
}

.customer_logo {
  width: 98px;
  position: absolute;
  top: 15px;
  right: 20px;
}
.customer_logo img {
  width: 100%;
  height: auto;
}

.box1_left h3 {
  margin: 10px 0;
  text-align: left;
}

.login_wrapper2_div {
  padding: 0;
}

.regist_subbox {
  float: right;
  width: 290px;
}


/*----------------------------- googleAcc_box ----*/

.googleAcc_box {
  float: right;
  width: 225px;
  margin: 0;
  padding: 5px 10px;
  text-align: left;
}

.googleAcc_title {
  margin: 0 0 8px;
  padding: 5px 0px;
  font-size: 13px;
  font-weight: normal;
  color: #aaa;
  border-bottom: 1px solid #eee;
}

.googleAcc_box .username {
  display: block;
  margin: 0;
  font-weight: bold;
  font-size: 18px;
  background: url(images/googleAcc-user.png) no-repeat right 6px;
}

.googleAcc_box .emailadd {
  display: block;
  margin: 0 0 10px;
  font-size: 15px;
  padding: 0 0 8px;
  border-bottom: 1px solid #eee;
}


/*----------------------------- vip ----*/
#TermsContents {
  padding: 20px;
  line-height: 1.5;
  border-color: #d0d4d5;
}

.vip_formbox {
  margin: 10px 0 0;
  overflow: hidden;
  text-align: center;
}
.vip_formbox > p {
  margin: 10px auto 20px;
  text-align: center;
}
.vip_formbox input {
  float: none;
  display: inline-block;
  margin: 0 auto !important;
}

.vip_logos {
  clear: both;
  /*width: 180px;*/
  margin: 30px 0 0;
  overflow: hidden;
  float: left;
}
.vip_logos img {
  margin-right: 14px;
}

.back_login{
  display: inline-block;
  margin: 20px 0 0;
}


/*----------------------------- tab_div ----*/

.tab_div {
  margin: 20px 0 0;
  font-size: 12px;
}

.tab_div a {
  padding: 3px 18px 3px 0;
  background: url(images/arr3.png) no-repeat right 0;
  cursor: pointer;
}

.tab_div .select {
  display: none;
}


/*----------------------------- Setup ----*/

.setup-container {
  position: relative;
  width: 810px;
  margin: 0 auto;
  padding-top: 30px;
  text-align: left;
}

.setup-box {
  position: relative;
  margin: 0px auto 15px;
  padding: 34px 37px 21px;
  background: #fff url(images/setup_bg.png) repeat-x 0 2px;
  border-radius: 6px;
  border: 1px solid #ddd;
  box-shadow: 0 2px 10px rgba(0, 0, 0, .1), 0 0 1px rgba(0,0,0,.3);
}

.setup-title {
  margin: 70px 8px 6px;
  padding: 0;
  color: #494949;
  text-align: left;
  font-size: 21px;
  border-top-right-radius: 4px;
  border-top-left-radius: 4px;
}

.loginp {
  margin: 0 8px;
}

.storage-wrapper {
  margin: 24px 3px 18px;
  padding: 17px 16px 10px;
  background: #dfe5eb;
  border-radius: 4px;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  box-shadow: inset 0 0 8px rgba(0,0,0,.1);
}

.storage-box {
  margin: 0 0 12px;
  padding: 15px;
  overflow: hidden;
  border-radius: 4px;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  box-shadow: 0 1px 2px rgba(0, 0, 0, .1);
  border: 1px solid #bec9d3;
}

.storage-box h2 {
  font-size: 19px;
  margin: 0 0 2px;
}

.storage-box .title {
  width: 364px;
  float: left;
  margin-left: 37px;
  padding: 0px 10px 5px 20px;
  border-left: 0px solid #eaeaea;
}

.setup-box h3 {
  margin: 0 0 .5em;
  font-size: 15px;
  color: #6c7479;
  text-shadow: 0 1px 0 rgba(255,255,255,.6);
}

.sb-baza {
  background: #fff url(Images/storage-baza.png) no-repeat 18px 14px;
}

.sb-dropb {
  background: #fff url(Images/storage-dropb.png) no-repeat 18px 20px;
}

.sb-pogo {
  background: #fff url(Images/storage-pogo.png) no-repeat 18px 19px;
}

.sb-skyd {
  background: #fff url(Images/storage-skyd.png) no-repeat 18px 20px;
}

.sb-google {
  background: #fff url(Images/storage-google.png) no-repeat 20px 19px;
}

.sb-baza input, .sb-dropb input, .sb-skyd input, .sb-google input {
  width: 210px;
  margin: 8px 0 0 0;
}

.storage-box input[type="submit"] {
  margin-right: 4px;
}


/*--------- pogo-box ----*/
.pogo-box {
  width: 310px;
  float: right;
  padding: 10px 16px;
  background: #f9f9f9;
  border-radius: 5px;
  border: 2px solid #eee;
}

.pogo-box .error {
  clear: both;
  display: block;
}

.pogo-box .formbox1 {
  width: 290px;
}

.formbox1 input[type="text"], .formbox1 input[type="password"] {
  width: 290px;
  margin-top: 10px;
}

input[type="text"], input[type="password"] {
  width: 100%;
}


/*----------------------------- account_box ----*/

.account_box {
  padding: 0px;
}

.account_box h3 {
  font-size: 15px;
  margin: 0 0 7px;
}

.pogo_info_data {
  margin-bottom: 20px;
}

.pogo_info_data dt {
  padding-left: 10px;
  background: url(Images/arr2.png) no-repeat left center;
}
.pogo_info_data dd {
  font-weight: bold;
}

.services {
  margin: 0 0 14px;
}

.services span {
  display: block;
  text-align: center;
  padding: 30px 0;
  color: #aaa;
  background: #f0f0f0;
}

.services select {
  width: 310px;
  -webkit-appearance: none;
  border: 1px solid #ccc;
}

.pogo-submit {
  position: absolute;
  right: 0;
  bottom: 0;
  line-height: 23px !important;
  margin: 0px 0 0 5px !important;
}

.setup_copy {
  display: block;
  margin: 0 auto;
  text-align: center;
  color: #888;
  text-shadow: 0 1px 0 white;
  font-size: 11px;
}

/*----------------------------- OTP ----*/

.main_c.otp {
    padding-left: 30px;
    padding-right: 30px;
}
.box_otp {
    max-width: 600px;
}
    .box_otp #Password {
        max-width: 160px;
        margin-bottom: 10px !important;
    }


/*----------------------------- collaborator_login ----*/

.cllb_login .loginbox {
    text-align: center;
    max-width: 505px;
    min-width :300px;
}

.layout2 .logintitle {
    margin: 5px auto 20px;
    width: 45%;
}

@media screen and (max-width:480px) { 
    .customer_logo {
      top: 15px;
      right: 20px;
      width:80px;
  }
    .layout2 .logintitle {
      margin: 5px auto 10px;
  }
}


.cllb_login .formwrapper {
    background: #f5f7f9;
}

.cllb_login .logintitle + p {
    font-size: 135%;
    font-weight: bold;
}
    .cllb_login .loginbox dt,
    .cllb_login .loginbox dd {
        float: none;
        width: 100%;
        text-align: left;
    }
        .cllb_login .loginbox dd.email {
            padding-top: 8px;
            font-size: 120%;
            letter-spacing: 1.2px;
        }
    .cllb_login .account_box {
    padding: 20px 0 0;
    border: none;
    background: #fff;
}

.cllb_login .otp_msg {
    text-align: left;
}
    .cllb_login .otp_msg p {
        margin: 0 0 1em;
    }

    .cllb_login .otp_msg .note {
        font-size: 110%;
        color: #f50505;
    }

.cllb_login input.loginBtn {
    float: none;
    width: 100%;
    margin: 15px 4px 15px 0;
    padding: .8em;
    border-radius: 25px;
    line-height: 18px;
    background: #1db2da;
    outline: none;
}
    .cllb_login input.loginBtn.second {
        float: none;
        width: 85%;
        margin: 10px auto 25px;
        padding: .7em;
        border-radius: 25px;
        line-height: 18px;
        background: #fff;
        border: 2px solid #1db2da;
        color: #1db2da !important;
        outline: none;
        box-sizing: border-box;
    }

.cllb_login .forgot_pw {
    margin: 30px 0 0;
    border: 1px solid #d3dce4;
    border-radius: 10px;
}
    .cllb_login .forgot_pw > p {
        display: block;
        text-align: left;

    }
        .cllb_login .forgot_pw > p > span {
            display: inline-block;
            background: #fff;
            margin: -14px 10px 5px;
            padding: 5px 10px;
        }

.cllb_login .sub {
    font-size: 13px;
    text-align: left;
    line-height: 1.4;
    padding-bottom: 10px;
}



        /* /////////////// Desktop  /////////////// */
        @media screen and (min-width: 800px) {
            .cllb_login .loginbox {
                padding: 35px 40px 35px;
                width: 505px;
            }

            .cllb_login .formwrapper {
                padding: 0 30px 10px;
                border-radius: 10px;
            }
        }
        /* /////////////// Mobile  /////////////// */
        @media screen and (max-width: 800px) {
            .cllb_login .loginbox {
                width: 90%;
                padding: 35px 20px 20px;
            }

            body .footer_cllb_login {
                position: absolute;
                bottom: 0;
            }

            .main .cllb_login {
                padding: 30px 0 0;
            }

            .cllb_login .formwrapper {
                padding: 0 10px 10px;
                border-radius: 10px;
            }
        }



/* --------------------------------- Input Checkbox  */

p.checkbox {
    width: 100%;
    height: 20px;
    position: relative;
    margin: 8px 0;
    padding: 0 !important;
}

    p.checkbox input[type="checkbox"]:checked + input + label span,
    input[type="checkbox"]:checked + label span, .unselectAll span {
        background: #2ab0d7 url(Images/check_white.png) no-repeat center center;
        border: 1px solid #109dc6;
    }

    p.checkbox input {
        display: none;
        position: absolute;
        left: 0px;
        top: 0px;
        margin: 0 !important;
        opacity: 0;
        font-size: 14px;
        color: #777;
        z-index: 100000;
    }

.checkbox_img {
    position: absolute;
    left: 0px;
    top: 1px;
    float: none;
    width: 17px;
    height: 17px;
    background: #fff;
    border-radius: 3px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -o-border-radius: 3px;
    -ms-border-radius: 3px;
    border: 1px solid #bcbcbc;
    box-shadow: inset 1px 1px rgba(0, 0, 0, .1);
}
    .checkbox_img:hover {
        cursor: pointer;
    }

p.checkbox label {
    position: absolute;
    width: 850px;
    height: 20px;
    margin: -1px 0 0;
    padding: 0 0 0 25px;
    cursor: pointer;
    line-height: 21px;
}