@CHARSET "UTF-8";

.clearbox:after { content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; }
.clearbox { display: inline-block; }
html[xmlns] .clearbox { display: block; }
* html .clearbox { height: 1%; }

#userbar { font-family: Arial, Tahoma; font-size: 11px; width: 550px; height: 470px; padding: 20px 25px; background: url('./../images/lightbox_600x510.png') 0 0 no-repeat; }
#userbar.small { width: 380px; height: 240px; padding: 20px 30px 30px 20px; background: url('./../images/lightbox_430x290.png') 0 0 no-repeat; }

#userbar { line-height: normal; }
#userbar p { color: #6f8292; }

/*** Header ***/
#userbar .hd { position: relative; margin-bottom: 20px;}

    #userbar .hd h2 { margin: 0 0 5px 0; padding: 0; color: #fe7a00; font-size: 20px; font-weight: bold; text-transform: uppercase; }
    #userbar .hd h3 { margin: 0; padding: 0; color: #6f8292; font-size: 12px; font-weight: bold; text-transform: uppercase; }
 
    #userbar .hd ul { list-style: none; margin: 10px 0; padding: 0; }
        #userbar .hd ul li { float: left; width: 51px; height: 29px; margin-right: 5px; line-height: 29px; text-align: center; font-size: 11px; color: #c2c1c1; background: url('./../images/step.png') 0 0 no-repeat; }
        #userbar .hd ul li.active { color: #fff; font-weight: bold; background-image: url('./../images/step_active.png'); }
        #userbar .hd ul li.separator { width: 23px; background: url('./../images/steps_arrow.png') top right no-repeat; }
        #userbar .hd ul li.separator.active { background-position: top left; }

    #userbar .hd .close { position: absolute; top: 0; right: 0; _right: 25px; width: 25px; height: 25px; background: url('./../images/btn_close.gif') 0 0 no-repeat; cursor: pointer; }

/*** Body ***/
#userbar .bd { margin: 0 0 10px 0; }

    #userbar .bd .save-info { margin: 0 0 10px 0; padding: 10px 5px; font-weight: bold; color: #403E2C; }
    #userbar .bd .save-info.saved { background-color: #FFF9B5; }
    #userbar .bd .save-info.notsaved { background-color: #FCD9DD; }
    #userbar .bd .ubox { padding: 5px 15px; color: #6f8292; }
    
        #userbar .bd .ubox p { margin: 0; }
        #userbar .bd .ubox p.header { margin-bottom: 10px; }
        
        #userbar .bd .ubox p.tip { margin: 5px 0 0 30px; }
            #userbar .bd .ubox p.tip span { display: block; margin-bottom: 5px; }
            
        #userbar .bd .radio { float: left; margin: 3px 5px 0 0; }            
        #userbar .bd .ubox .input-wrapper { float: left; display: block; width: 205px; height: 23px; background: url('./../images/userbar_input_bg.png') 0 0 no-repeat; }
        #userbar .bd .ubox .input-wrapper.error { background-image: url('./../images/userbar_input_error_bg.png'); }
            #userbar .bd .ubox .input-wrapper input { border: 0; width: 191px; margin: 3px 7px; padding: 2px 0; color: #6f8292; font-size: 11px; }
            
        #userbar .bd .ubox label { line-height: 23px; }
            #userbar .bd .ubox label span { color: #1eb1d0; }
            
        #userbar .bd .ubox .select-wrapper { display: block; padding: 0; width: 206px; height: 22px; background: url('./../images/userbar_select_bg.png') 0 0 no-repeat; }
        #userbar .bd .ubox .select-wrapper.error { background-image: url('./../images/userbar_select_error_bg.png'); }
            #userbar .bd .ubox .select-wrapper select { border: 0; width: 192px; margin: 2px 7px; }            
        #userbar .bd .ubox .select-wrapper.long { margin: 0; }
        
        #userbar .bd .ubox a { color: #6f8292; }
        
    #userbar .bd .top-bg { position: relative; height: 5px; overflow: hidden; }
        #userbar .bd .top-bg span { position: absolute; left: 0; top: 0; width: 100px; height: 5px; }
    #userbar .bd .btm-bg { position: relative; height: 5px; overflow: hidden; }
        #userbar .bd .btm-bg span { position: absolute; left: 0; top: 0; width: 100px; height: 5px; }
    #userbar .bd .top-bg span,
    #userbar .bd .btm-bg span { background-position: 0 0; }

    #userbar .bd .col-left { float: left; width: 272px; margin-right: 5px; }    
        #userbar .bd .col-left .box-1 { margin-bottom: 5px; background:#EAECEE url('./../images/userbar_box_bg_light.png') 0 0 repeat-x; }
            #userbar .bd .col-left .box-1 .top-bg { background: url('./../images/userbar_box_top_bg_light.png') top right no-repeat; }
            #userbar .bd .col-left .box-1 .btm-bg { background: url('./../images/userbar_box_btm_bg_light.png') top right no-repeat; }
                 
        #userbar .bd .col-left .box-2 { background-color: #dce0e4; }
        #userbar .bd .col-left .box-2 .ubox { height: 84px; }
            #userbar .bd .col-left .box-2 .top-bg { background: url('./../images/userbar_box_top_bg_dark.png') top right no-repeat; }
            #userbar .bd .col-left .box-2 .btm-bg { background: url('./../images/userbar_box_btm_bg_dark.png') top right no-repeat; }
    
    #userbar .bd .col-right { float: right; width: 273px; }    
        #userbar .bd .col-right .ubox { padding: 5px 10px; }
        #userbar .bd .col-right .box-3 { background-color: #e0e4e7; }
            #userbar .bd .col-right .box-3 .top-bg { background: url('./../images/userbar_box_top_bg_mdark.png') top right no-repeat; }
            #userbar .bd .col-right .box-3 .btm-bg { background: url('./../images/userbar_box_btm_bg_mdark.png') top right no-repeat; }
    
    #userbar .bd .gg_number { color: #fe7a00; font-size: 20px; font-weight: bold; }
    #userbar .bd .gg_number span.grey { color: #6F8292; }
    
    #userbar .bd .col-wide { width: 530px; }
        #userbar .bd .col-wide .header { font-size: 12px; }
        
        #userbar .bd .sms-box { width: 280px; float: left; }        
        #userbar .bd .sms-box .main { height: 70px; padding: 14px 18px; border: 1px solid #b7c0c9; border-width: 0 1px; }
            #userbar .bd .col-wide .sms-box .main .header { font-size: 16px; margin-bottom: 10px; font-weight: bold; }
            
            #userbar .bd .col-wide .main .header { font-size: 16px; margin-bottom: 40px; }
                #userbar .bd .col-wide .main .header span { color: #fe7a00; }
                
    #userbar .bd .sms-box .top-bg { background: url('./../images/userbar_border_top.png') top right no-repeat; }
        #userbar .bd .sms-box .top-bg span { background-image: url('./../images/userbar_border_top.png'); }
    #userbar .bd .sms-box .btm-bg { _margin-left: 2px; background: url('./../images/userbar_border_btm.png') top right no-repeat; }
        #userbar .bd .sms-box .btm-bg span { background-image: url('./../images/userbar_border_btm.png'); _background-position: 2px 0px; background-position: 0 0; }

    /* Success info (step 4) */
    #userbar .bd .success-info-box { width: 530px; float: left; }
    #userbar .bd .success-info-box .main { padding: 14px 19px; border: 1px solid #c3dec1; border-width: 0 1px; background: #fff url('./../images/success_box_bg.gif') 0 0 repeat-x; }
    
        #userbar .bd .success-info-box .top-bg { background: url('./../images/success_box_top_bg.gif') top right no-repeat; }
        #userbar .bd .success-info-box .top-bg span { width: 200px; background-image: url('./../images/success_box_top_bg.gif'); }
    #userbar .bd .success-info-box .btm-bg { _margin-left: 2px; _width: 500px; background: url('./../images/success_box_btm_bg.gif') top right no-repeat; }
        #userbar .bd .success-info-box .btm-bg span { width: 200px; background-image: url('./../images/success_box_btm_bg.gif'); _background-position: 2px 0px; background-position: 0 0; }    

    #userbar .bd .success-info-box h3 { margin-bottom: 5px; text-align: center; color: #349F3E; font-size: 16px; font-weight: bold; text-transform: uppercase; }
    #userbar .bd .success-info-box .main .header { margin-bottom: 20px; }
    #userbar .bd .success-info-box .info-message { display: block; margin-top: 3px; padding: 0; }    

    #userbar .bd .gg-account-box { width: 250px; }
    #userbar .bd .gg-account-box .main { position: relative; height: 70px; }
    #userbar .bd .gg-account-box .main .cost-label { position: absolute; left: 19px; bottom: 7px; }
    #userbar .bd .gg-account-box .main .pay-button { position: absolute; right: 18px; bottom: 7px; font-size: 12px; color: #006EB9; }
    
    #userbar.confirm .bd { width: 384px; height: 155px; margin: 20px 0 10px 0; background: url('./../images/userbar_confirm_bg.png') 0 0 no-repeat; }
        #userbar.confirm .bd .header { margin: 10px 0; color: #349f3e; font-size: 16px; text-align: center; text-transform: uppercase; }
        #userbar.confirm .bd .info { font-size: 12px; }
            #userbar.confirm .bd .info span { font-weight: bold; }

/*** Extend userbar ***/
#userbar.background-none { background: none; }

#userbar-step-extend .hd h2 { text-transform: none; }

#userbar-step-extend .bd .extend-info { margin: 10px 0; text-align: center; font-size: 14px; font-weight: bold; }
    #userbar-step-extend .bd .extend-info span { color: #FE7A00; }
    
#userbar-step-extend .bd .sms-box { width: 260px; }    
#userbar-step-extend .bd .gg-account-box { width: 270px; }    
#userbar-step-extend .bd .sms-box .ubox .main { height: 100px; background: #F4F5F6 url('../images/przedluzanie-sms.png') 0 0 no-repeat; }    
#userbar-step-extend .bd .sms-box .ubox .main p { margin-left: 40px; }    
#userbar-step-extend .bd .sms-box .ubox .main p.header {  }    
#userbar-step-extend .bd .gg-account-box .ubox .main { width: ; background-image: url('../images/przedluzanie-kontogg.png'); }    
#userbar-step-extend .bd .gg-account-box .ubox .main p { margin-left: 60px; }    

/*** Payment types ***/
#userbar #userbar-step-2 .bd .payments-wrapper { cursor: pointer; padding: 10px 0 10px 5px; background: url('./../images/userbar_payments_bg.gif') 0 0 no-repeat; }

#userbar .payment { height: 70px; margin-bottom: 10px; }
    #userbar .payment .payment-type-radio { margin-top: 22px; }
    #userbar .payment p { float: left; position: relative; margin-left: 10px; width: 229px; height: 61px; }
        #userbar .payment p .duration { position: absolute; left: 10px; top: 5px; font-size: 24px; color: #fff; font-weight: bold; }
        #userbar .payment p .price { position: absolute; right: 20px; bottom: 10px; font-size: 16px; color: #fff; font-weight: bold; }
        #userbar .payment p .new { position: absolute; right: -10px; top: -10px; width: 40px; height: 40px; background: url('./../images/new/icons/star-new.png') 0 0 no-repeat; }

#userbar .payment .payment-1 { background: url('./../images/payment_bg_red.gif') 0 0 no-repeat; }
    #userbar .payment .payment-1 .new { display: none;  }
#userbar .payment .payment-2 { background: url('./../images/payment_bg_blue.gif') 0 0 no-repeat; }
#userbar .payment .payment-3 { background: url('./../images/payment_bg_green.gif') 0 0 no-repeat; }

/* Check gadu-gadu version */
#userbar #check-version .bd { font-size: 12px; }

#userbar #check-version .bd { margin-top: 50px; }
#userbar #check-version .ft { text-align: left; }
    #userbar #check-version #goto-step1 { text-decoration: underline; cursor: pointer; }
    #userbar #check-version #check-again { cursor: pointer; }

#userbar #check-version .box-border { margin-top: 5px; width: 510px; padding: 15px; border: 1px solid #b7c0c9; line-height: 1.5em; }
#userbar #check-version .box-1 { background: #ffe6e7; }
#userbar #check-version .box-3 { background: #ececec; margin-top: 25px; }
    #userbar #check-version .box-border .highlight { color: #555; }
#userbar #check-version .button { margin-top: 10px; position: relative; }

/* Userbar preview */
#userbar .preview { position: relative; }
    #userbar .custom-background { position: relative; width: 231px; height: 51px; padding: 0; margin: 0; background-repeat: no-repeat}            
            #userbar .box-3 .custom-background { position: absolute; left: 13px; top: 90px; background-repeat: no-repeat;}
    #userbar .custom-description { position: absolute; left: 10px; top: 32px; color: #000; font-weight: bold; }            
    
/* Errors */
#userbar #gg-number-input-error { display: none; color: #dd0000; }
#userbar #friend-gg-number-input-error { display: none; color: #dd0000; }
#userbar #gg-number-select-error { display: none; color: #dd0000; }

#userbar .error-tip { display: none; color: #dd0000; }
    
/*** Footer ***/ 
#userbar .ft { text-align: center; }
   
    #userbar .ft button { cursor: pointer; background: none; border: 0; }
        #userbar .ft button span { display: none; }    
    
    #userbar .ft button.cancel { margin-right: 10px; width: 90px; height: 27px; background: url('./../images/userbar_btn_cancel.png') 0 0 no-repeat; }
    #userbar .ft button.back { margin-right: 10px; width: 90px; height: 27px; background: url('./../images/userbar_btn_back.png') 0 0 no-repeat; }
    #userbar .ft button.next { width: 90px; height: 27px; background: url('./../images/userbar_btn_next.png') 0 0 no-repeat; }
    #userbar .ft button.next_pr { width: 90px; height: 27px; background: url('./../images/userbar_btn_next.png') 0 0 no-repeat; }
    #userbar .ft button.finish { width: 90px; height: 27px; background: url('./../images/userbar_btn_finish.png') 0 0 no-repeat; }
    
    #userbar button.go-to-step-2 { cursor: pointer; background: none; border: 0; margin: 0 0 0 10px; width: 90px; height: 27px; background: url('./../images/userbar_btn_next.png') 0 0 no-repeat; }
    #userbar button.go-to-step-2 span { display: none; }
    
/*** Steps ***/
#userbar #check-version { display: none; }    
#userbar-step-1 {  }    
#userbar-step-2 { display: none; }
    #userbar-step-2 .bd .ubox .select-wrapper { background: url('./../images/userbar_select_light_bg.png') 0 0 no-repeat; }
#userbar-step-3 { display: none; }
#userbar-loginform { display: none; }
    #userbar-loginform #login-form-wrapper  { margin: 0 auto; }

/*** Selectbox ***/
#userbar .box-2 .s-box { padding: 5px 0 0 20px; .padding-left: 25px; }
#userbar .selectbox { width: 192px; margin: 0; padding: 3px 7px; font-size: 11px; color: #6f8292; border: 0; }
#userbar .selectbox-wrapper { float: left; z-index: 999; margin: 0px 0 0 0; /*height: auto;*/  }
        #userbar .selectbox-wrapper li { margin: 0; padding: 3px 7px; font-size: 11px; }
        #userbar .selectbox-wrapper li.selected { background-color: #ebeeef; }
        #userbar .selectbox-wrapper li.current { background-color: #dce0e4; }

/*** Loader ***/
#userbar #loader {  
    position: absolute; 
    left: 0px; 
    top: 0px;
    width: 100%; 
    height: 100%; 
    opacity: .7;
    z-index: 9999;
    background: #999 url('./../images/ajax-loading.gif') 49% 49% no-repeat;
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=40)";
    filter: alpha(opacity=40);
}

/*** Messages/Info ***/
#userbar .terms-info { padding: 10px 0 0 20px; }
    #userbar .terms-info a { color: inherit; }
#userbar .info-message { padding: 10px 0 0 20px; color: #FE7A00; }


.appDesc.customUserbarGenerator {
    background: url('/images/custom_userbar_generator_bg.jpg') no-repeat;
    height: 500px;
    padding: 0px;
    position: relative;
    top: -5px;
    left: -10px;
/*    margin: -5px 0 0 -10px;*/
}

.appDesc.customUserbarGenerator .generateButton {
    margin: 340px 0 0 90px;
    _margin: 340px 0 0 45px;
    float: left;
}

.appDesc.customUserbarGenerator .price-list {
    float: left;
    margin: 370px 0 0 87px;
}
