@font-face {
    font-family: 'ChakraPetchLight';
    src: url('fonts/ChakraPetch-Light.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'ChakraPetchSemiBold';
    src: url('fonts/ChakraPetch-SemiBold.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'ChakraPetchRegular';
    src: url('fonts/ChakraPetch-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'ChakraPetchBold';
    src: url('fonts/ChakraPetch-Bold.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

:root {

    --fontFaimly_default: 'ChakraPetchRegular', sans-serif;
    --fontFaimly_text: 'ChakraPetchRegular', sans-serif;
    --fontFaimly_header: 'ChakraPetchLight', sans-serif;
    --fontFaimly_button: 'ChakraPetchBold', sans-serif;
    --fontFaimly_semi: 'ChakraPetchSemiBold', sans-serif;
    
    --hud_backgroundcolor: rgba(0,0,0,0.95);
    --hud_backgroundcolor_industry_box: rgba(0,0,0,0.95);

    --hud_valuecolor: rgb(166,240,255);
    --hud_buttonlabelcolor: rgb(166,240,255);
    --hud_bookmarkcolor: rgba(255,255,255,1);
    --hud_bookmarkbackgroundcolor: rgba(255,255,255,0.1);
    --hud_tablecolor: rgba(255,255,255,1);
    --hud_tablebackgroundcolor: rgba(0,0,0,0);
    --hud_tablevaluecolor: rgb(255,255,255);
    --hud_barvaluecolor: rgb(166,240,255);

    --hud_health_text_color: rgb(255,255,255);
    --hud_health_bar_color: rgba(255,255,255,1);
    --hud_health_barbckg_color: rgba(155,155,155,.5);

    --hud_healthcanheal_bar_color: rgb(180,130,0);

    --hud_storage_bar_color: rgb(130, 194, 224);
    --hud_storage_text_color: rgb(130, 194, 224);
    --hud_storage_barbckg_color: rgba(130, 194, 224,.5);

    --hud_exp_bar_color: rgb(152,100,17);
    --hud_exp_text_color: rgb(220,146,28);
    --hud_exp_barbckg_color: rgba(152,100,17,.5);

    --hud_sexp_bar_color: rgb(152,100,17);
    --hud_sexp_text_color: rgb(220,146,28);
    --hud_sexp_barbckg_color: rgba(152,100,17,.5);

    --hud_quarters_bar_color: rgb(0,0,0);
    --hud_quarters_text_color: rgb(255,255,255);
    --hud_quarters_barbckg_color: rgba(255,255,255,.5);

    --hud_quarters_bar_color_light: rgb(255,255,255);
    --hud_quarters_text_color_light: rgb(255,255,255);
    --hud_quarters_barbckg_color_light: rgba(255,255,255,.5);

    --hud_energy_bar_color: rgb(255,255,255);
    --hud_energy_text_color: rgb(255,255,255);
    --hud_energy_barbckg_color: rgba(255,255,255,.5);

    --hud_invalid_color: #b92b00;
    --hud_invalid_background: #b92b00;
    --hud_invalid_text: black;

    --hud_valid_color: white;
    --hud_valid_background: white;
    --hud_valid_text: black;

    --hud_construction_bar_color: rgb(180,130,0);
    --hud_construction_text_color: rgb(180,130,0);
    --hud_construction_barbckg_color: rgba(180,130,0,.5);

    --shadow_textfull:  -1px -1px 0px #000, 0px -1px 0px #000, 1px -1px 0px #000, -1px  0px 0px #000, 1px  0px 0px #000, -1px  1px 0px #000, 0px  1px 0px #000, 1px  1px 0px #000, -2px -2px 0px #000, -1px -2px 0px #000, 0px -2px 0px #000, 1px -2px 0px #000, 2px -2px 0px #000, 2px -1px 0px #000, 2px  0px 0px #000, 2px  1px 0px #000, 2px  2px 0px #000, 1px  2px 0px #000, 0px  2px 0px #000, -1px  2px 0px #000, -2px  2px 0px #000, -2px  1px 0px #000, -2px  0px 0px #000, -2px -1px 0px #000;
    --shadow_boxfull:  -2px -2px 0px #000, -1px -2px 0px #000, 0px -2px 0px #000, 1px -2px 0px #000, 2px -2px 0px #000, 2px -1px 0px #000, 2px 0px 0px #000, 2px 1px 0px #000, 2px 2px 0px #000, 1px 2px 0px #000, 0px 2px 0px #000, -1px 2px 0px #000, -2px 2px 0px #000, -2px 1px 0px #000, -2px 0px 0px #000, -2px -1px 0px #000;

    --border-color: rgba(255,255,255,0.05);
    --border-effect-color: rgba(255,255,255,0.3);
    --box-background: rgba(0,0,0,0.95);
    --box-background-unavailable: rgba(0,0,0,0.95);
    --box-backdrop-filter: none;/*blur(8px)*/
    --barbox-background: rgba(255,255,255,0.3);

    --box-topbackground: rgba(20,20,20,1);
    --border-topeffect-color: rgba(255,255,255,0.5);


    --gitem-background: rgba(20,20,20,0.95);
    --gitem-border: rgba(255,255,255,0.4);
    --gitem-corner: rgba(255,255,255,0.6);
    --gitem-site: rgba(255,255,255,0.2);

    --line-background: rgba(0,0,0,0.95);


    --hud-window-max-width: 1300px;

    --clip_t: polygon(10px 0,calc(100%) 0,100% 10px,100% calc(100% + -3px), calc(100%) calc(100% + -3px), calc(100% + -6px) calc(100% + -3px),calc(100% + -6px) calc(100%) ,0px calc(100%),0px 10px  );
    --clip_e: polygon(0 0, calc(100% - 2px) 0, calc(100% - 2px) calc(100% - 6px), 100% calc(100% - 6px), 100% 100%, 2px 100%, 2px calc(100% - 11px), 0 calc(100% - 11px));
    --clip_s: polygon(0 0, calc(100%) 0, 100% calc(100% - 6px), calc(100% - 6px) 100%, 2px 100%, 2px calc(100% - 11px), 0 calc(100% - 11px));



    --clip_btn_1: polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, 15px 100%, 11px calc(100% + -3px), 0px calc(100% - 3px));
    --clip_btn_2: polygon(0 5px, 20px 5px, 20px 0%, 100% 0, 100% 100%, calc(100% - 19px) 100%, calc(100% - 19px) calc(100% - 10px), calc(100% - 76px) calc(100% - 10px), calc(100% - 76px) 100%, calc(20px) 100%, 0 calc(100% - 20px));
    --clip_play_btn: polygon(0 0, calc(100%) 0, 100% calc(100% - 6px), calc(100% - 6px) 100%, 2px 100%, 2px calc(100% - 11px), 0 calc(100% - 11px));

    --clip_btn_ship: polygon(0 5px, 20px 5px, 20px 0%, 100% 0, 100% 100%, calc(100% - 19px) 100%, calc(100% - 19px) calc(100% - 10px), calc(100% - 76px) calc(100% - 10px), calc(100% - 76px) 100%, calc(20px) 100%, 0 calc(100% - 20px));
    --clip_btn_ship_select: polygon(0 0, calc(100%) 0, 100% calc(100% - 6px), calc(100% - 6px) 100%, 2px 100%, 2px calc(100% - 11px), 0 calc(100% - 11px));


    --clip_waitbox: polygon(0 5px, 20px 5px, 20px 0%, 100% 0, 100% 100%, calc(100% - 15px) 100%, calc(100% - 15px) calc(100% - 8px), calc(100% - 70px) calc(100% - 8px), calc(100% - 70px) 100%, calc(20px) 100%, 0 calc(100% - 20px));

    --clip_dock_waitbox: polygon(0 5px, 20px 5px, 20px 0%, 100% 0, 100% 100%,   calc(20px) 100%, 0 calc(100% - 20px));


    --clip_win_destroyed: polygon(0 0, calc(100% - 10px) 0, 100% 10px, calc(100%) calc(100% - 180px), calc(100% - 5px) calc(100% - 180px + 5px), calc(100% - 5px) calc(100% - 60px), calc(100%) calc(100% - 60px + 5px), calc(100%) calc(100% - 20px), calc(100% - 20px) calc(100%),  calc(5px + 10px) 100%, calc(5px) calc(100% - 10px), 5px calc(46% + 5px), 0 46%);
    --clip_win_new: polygon(0 0, calc(100% - 20px) 0, 100% 20px, 100% 100%, 35% 100%, calc(35% - 8px) calc(100% - 8px), 0 calc(100% - 8px));

    --clip_win_new_link: polygon(0 0, calc(100% - 5px) 0, 100% 5px, 100% 100%, 75% 100%, calc(75% - 3px) calc(100% - 3px), 0 calc(100% - 3px));


    --clip_zalozka: polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, calc(100% - 10px) 100%, calc(100% - 10px) calc(100% - 5px), 0 calc(100% - 5px));
    --clip_refineryservice: polygon(0 0, calc(100% - 20px) 0, 100% 20px, 100% 100%, calc(100% - 25px) 100%, calc(100% - 25px) calc(100% - 10px),calc(100% - 85px) calc(100% - 10px),calc(100% - 85px) calc(100%),10px 100%, 10px calc(66% + 10px), 0 66%);

    --clip_refinery_embarkwindow: polygon(0 0, calc(100% - 20px) 0, 100% 20px, 100% 100%, calc(100% - 25px) 100%, calc(100% - 25px) calc(100% - 10px),calc(100% - 85px) calc(100% - 10px),calc(100% - 85px) calc(100%),10px 100%, 10px calc(66% + 10px), 0 66%);

    --clip_refinery_refinebox: polygon(0 0, calc(100% - 20px) 0, 100% 20px, 100% 100%, calc(100% - 25px) 100%, calc(100% - 25px) calc(100% - 10px),calc(100% - 85px) calc(100% - 10px),calc(100% - 85px) calc(100%),10px 100%, 10px calc(66% + 10px), 0 66%);

    --clip_cstation_buybox: polygon(0 0, calc(100% - 20px) 0, 100% 20px, 100% calc(100% - 10px) , calc(100% - 10px) 100% , 10px 100%, 10px calc(66% + 10px), 0 66%);
    --clip_itembox: polygon(0 0, calc(100% - 20px) 0, 100% 20px, 100% calc(100% - 10px) , calc(100% - 10px) 100% , 10px 100%, 10px calc(66% + 10px), 0 66%);

    --clip_underline: polygon(0 0, 100% 0, 100% 1px, calc(50px) 1px, calc(50px - 4px) 4px, 0 4px);
    --clip_underline_right: polygon(0 0, 100% 0, 100% 4px, calc(100% - 50px) 4px, calc(100% - 50px - 4px) 1px, 0 1px);

    --clip_attribute: polygon(0 0, calc(100%) 0, 100% calc(100% - 6px), calc(100% - 6px) 100%, 2px 100%, 2px calc(100% - 11px), 0 calc(100% - 11px));

    --clip_button: polygon(0 0, calc(100%) 0, 100% calc(100% - 6px), calc(100% - 6px) 100%, 2px 100%, 2px calc(100% - 11px), 0 calc(100% - 11px));
    --clip_title: polygon(0 0, calc(100%) 0, 100% calc(100% - 6px), calc(100% - 6px) 100%, 2px 100%, 2px calc(100% - 11px), 0 calc(100% - 11px));


    --clip_controller: polygon(0 0, calc(100%) 0, 100% calc(100% - 6px), calc(100% - 6px) 100%, 2px 100%, 2px calc(100% - 11px), 0 calc(100% - 11px));


    --clip_subzalozka: polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, calc(100% - 15px) 100%, calc(100% - 15px) calc(100% - 5px), calc(100% - 40px) calc(100% - 5px), calc(100% - 40px) 100%, 80px 100%, 80px calc(100% - 5px), 0 calc(100% - 5px));
    --clip_subzalozka_nocount: polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, 80px 100%, 80px calc(100% - 5px), 0 calc(100% - 5px));

    --clip_market_catalog_item: polygon(0 0, calc(100%) 0, 100% calc(100% - 6px), calc(100% - 6px) 100%, 2px 100%, 2px calc(100% - 71px), 0 calc(100% - 71px));

    --clip_astronaut:  polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, calc(100% - 15px) 100%, calc(100% - 15px) calc(100% - 10px),calc(100% - 65px) calc(100% - 10px),calc(100% - 65px) calc(100%),5px 100%, 5px calc(150px + 5px), 0 150px);

    --clip_zonemeber:  polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, calc(100% - 15px) 100%, calc(100% - 15px) calc(100% - 10px),calc(100% - 95px) calc(100% - 10px),calc(100% - 95px) calc(100%),5px 100%, 5px calc(80px + 5px), 0 80px);

    --clip_button_right: polygon(0 0, calc(100%) 0, 100% calc(100% - 6px), calc(100% - 6px) 100%, 2px 100%, 2px calc(100% - 11px), 0 calc(100% - 11px));
    --clip_button_left: polygon(0 0, calc(100% - 2px) 0, calc(100% - 2px) 11px, calc(100% ) 11px, 100% 100%, 6px 100%, 0 calc(100% - 6px));

    --clip_button_astronaut: polygon(0 0, calc(100%) 0, 100% calc(100% - 6px), calc(100% - 6px) 100%, 2px 100%, 2px calc(100% - 11px), 0 calc(100% - 11px));

    --clip_window_construction:  polygon(0 0, calc(100% - 12px) 0, 100% 12px, 100% calc(100% - 10px), calc(100% - 245px) calc(100% - 10px), calc(100% - 245px - 10px) calc(100%),10px calc(100%), 10px calc(350px + 10px), 0 350px);

    --clip_personel: polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, calc(100% - 25px) 100%, 5px 100%, 5px calc(46% + 5px), 0 46%);
    --clip_personel_occupation: polygon(0 0, calc(100% - 2px) 0, calc(100% - 2px) calc(100% - 6px), 100% calc(100% - 6px), 100% 100%, 2px 100%, 2px calc(100% - 11px), 0 calc(100% - 11px));

    --clip_unsupported:  polygon(0 0, calc(100% - 10px) 0, 100% 10px, calc(100%) calc(100% - 180px), calc(100% - 5px) calc(100% - 180px + 5px), calc(100% - 5px) calc(100% - 60px), calc(100%) calc(100% - 60px + 5px), calc(100%) calc(100% - 20px), calc(100% - 20px) calc(100%),  5px 100%, 5px calc(46% + 5px), 0 46%);
    --clip_cstationbox:  polygon(0 0, calc(100% - 10px) 0, 100% 10px, calc(100%) calc(100% - 180px), calc(100% - 5px) calc(100% - 180px + 5px), calc(100% - 5px) calc(100% - 60px), calc(100%) calc(100% - 60px + 5px), calc(100%) calc(100% - 10px), calc(100% - 10px) calc(100%),  calc(5px + 10px) 100%,  calc(5px) calc(100% - 10px), 5px calc(46% + 5px), 0 46%);

    --clip_starlink:  polygon(0 0, calc(100% - 10px) 0, 100% 10px, calc(100%) calc(100% - 180px), calc(100% - 5px) calc(100% - 180px + 5px), calc(100% - 5px) calc(100% - 60px), calc(100%) calc(100% - 60px + 5px), calc(100%) calc(100% - 10px), calc(100% - 10px) calc(100%),  calc(5px + 10px) 100%,  calc(5px) calc(100% - 10px), 5px calc(46% + 5px), 0 46%);
    --clip_starlink_adbox:  polygon(0 0, calc(100%) 0, 100% calc(100% - 10px),  calc(100% - 10px) calc(100%),   calc(5px + 10px) 100%,  calc(5px) calc(100% - 10px), 5px calc(46% + 5px), 0 46%);

    --clip_button_dailyreward: polygon(0 0, calc(100%) 0, 100% calc(100% - 6px), calc(100% - 6px) 100%, 2px 100%, 2px calc(100% - 11px), 0 calc(100% - 11px));

    --clip_csbox_sp_quarters: polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, calc(100% - 15px) 100%, calc(100% - 15px) calc(100% - 5px),calc(100% - 85px) calc(100% - 5px),calc(100% - 85px) calc(100%),8px 100%, 8px calc(66% + 8px), 0 66%);
    --clip_csbox_st_quarters: polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, calc(100% - 15px) 100%, calc(100% - 15px) calc(100% - 5px),calc(100% - 85px) calc(100% - 5px),calc(100% - 85px) calc(100%),8px 100%, 8px calc(66% + 8px), 0 66%);
    --clip_csbox_sp_cargo: polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, calc(100% - 15px) 100%, calc(100% - 15px) calc(100% - 5px),calc(100% - 85px) calc(100% - 5px),calc(100% - 85px) calc(100%),8px 100%, 8px calc(66% + 8px), 0 66%);
    --clip_csbox_st_cargo: polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, calc(100% - 15px) 100%, calc(100% - 15px) calc(100% - 5px),calc(100% - 85px) calc(100% - 5px),calc(100% - 85px) calc(100%),8px 100%, 8px calc(66% + 8px), 0 66%);
    --clip_pricehistory: polygon(0 0, calc(100%) 0, 100% calc(100% - 6px), calc(100% - 6px) 100%, 2px 100%, 2px calc(100% - 71px), 0 calc(100% - 71px));

    --clip_user_corplogo: polygon(0 0, calc(100%) 0, 100% calc(100% - 6px), calc(100% - 6px) 100%, 2px 100%, 2px calc(100% - 21px), 0 calc(100% - 21px));


    --clip_csbox_engineering_capacity: polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, calc(100% - 15px) 100%, calc(100% - 15px) calc(100% - 5px),calc(100% - 85px) calc(100% - 5px),calc(100% - 85px) calc(100%),8px 100%, 8px calc(66% + 8px), 0 66%);
    --clip_csbox_st_energy: polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, calc(100% - 15px) 100%, calc(100% - 15px) calc(100% - 5px),calc(100% - 85px) calc(100% - 5px),calc(100% - 85px) calc(100%),8px 100%, 8px calc(66% + 8px), 0 66%);

    --clip_csbox_hangar_ship: polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, calc(100% - 15px) 100%, calc(100% - 15px) calc(100% - 8px),calc(100% - 120px - 15px) calc(100% - 8px),calc(100% - 120px - 15px) calc(100%),8px 100%, 8px calc(66% + 8px), 0 66%);

    --clip_csbox_hangar_assembly_hoverbox: polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, calc(100% - 15px) 100%, calc(100% - 15px) calc(100% - 5px),calc(100% - 85px) calc(100% - 5px),calc(100% - 85px) calc(100%),8px 100%, 8px calc(66% + 8px), 0 66%);
    --clip_csbox_hangar_assembly_hoverbox_button: polygon(0 0, calc(100%) 0, 100% calc(100% - 6px), calc(100% - 6px) 100%, 2px 100%, 2px calc(100% - 11px), 0 calc(100% - 11px));

    --clip_growbase_databox: polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, calc(100% - 15px) 100%, calc(100% - 15px) calc(100% - 5px),calc(100% - 85px) calc(100% - 5px),calc(100% - 85px) calc(100%),8px 100%, 8px calc(66% + 8px), 0 66%);

    --clip_right_context:  polygon(10px 0, calc(100%) 0, 100% 100%,   calc(100%) calc(100% ),  calc(5px + 10px) 100%,  calc(5px) calc(100% - 10px), 5px calc(46% + 5px), 0 46%,0 80px, 10px 70px);

    --clip_production_slot: polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, calc(100% - 25px) 100%, 5px 100%, 5px calc(46% + 5px), 0 46%);
    --clip_pvp_session_spacecraft: polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, calc(100% - 25px) 100%, 5px 100%, 5px calc(46% + 5px), 0 46%);

    --clip_selecttutorial_titem:  polygon(0 0, calc(100% - 10px) 0, 100% 10px, calc(100%) calc(100% - 180px), calc(100% - 5px) calc(100% - 180px + 5px), calc(100% - 5px) calc(100% - 60px), calc(100%) calc(100% - 60px + 5px), calc(100%) calc(100% - 10px), calc(100% - 10px) calc(100%),  calc(5px + 10px) 100%,  calc(5px) calc(100% - 10px), 5px calc(46% + 5px), 0 46%);
    --clip_standardbox:  polygon(0 0, calc(100% - 10px) 0, 100% 10px, calc(100%) calc(100% - 180px), calc(100% - 5px) calc(100% - 180px + 5px), calc(100% - 5px) calc(100% - 10px),  calc(100% - 15px) calc(100%),  calc(5px + 10px) 100%,  calc(5px) calc(100% - 10px), 5px calc(46% + 5px), 0 46%);
    --clip_standardstatus: polygon(0 0, calc(100% - 2px) 0, calc(100% - 2px) calc(100% - 6px), 100% calc(100% - 6px), 100% 100%, 2px 100%, 2px 6px, 0 6px);
    --clip_standarminiature: polygon(0 0, calc(100% - 3px - 10px) 0, calc(100% - 3px) 10px, calc(100% - 3px) calc(100% - 6px), 100% calc(100% - 6px), 100% 100%, 3px 100%, 3px calc(11px), 0 calc(11px));

    --clip_whitelink: polygon(0 0, calc(100% - 2px) 0, calc(100% - 2px) calc(100% - 6px), 100% calc(100% - 6px), 100% 100%, 2px 100%, 2px 6px, 0 6px);
    --clip_controllink: polygon(0 0, calc(100% - 2px) 0, calc(100% - 2px) calc(100% - 6px), 100% calc(100% - 6px), 100% 100%, 2px 100%, 2px 6px, 0 6px);
    --clip_rcbutton: polygon(0 0, calc(100% - 2px) 0, calc(100% - 2px) 2px, 100%  2px, 100% 100%,0 100%,0 0);
    --clip_checkbox: polygon(0 0, calc(100% - 2px) 0, calc(100% - 2px) calc(100% - 6px), 100% calc(100% - 6px), 100% 100%, 2px 100%, 2px 6px, 0 6px);
    --clip_flashback_icon: polygon(0 0, calc(100% - 3px ) 0, calc(100% - 3px) 0px, calc(100% - 3px) calc(100% - 6px), 100% calc(100% - 6px), 100% calc(100%) ,  calc(3px + 30px) calc(100%), calc(3px + 30px) calc(100% - 3px), calc(3px) calc(100% - 30px), 3px calc(11px), 0 calc(11px));

    --clip_qquestbox:  polygon(0 0, calc(100% - 10px) 0, calc(100% - 5px) 5px,  calc(100% - 5px) calc(100% - 60px), calc(100%) calc(100% - 60px + 5px), calc(100%) calc(100% - 10px), calc(100% - 10px) calc(100%),  calc(5px + 10px) 100%,  calc(5px) calc(100% - 10px), 5px calc(46% + 5px), 0 46%);
    --clip_destroyed_win:  polygon(0 0, calc(100% - 10px) 0, calc(100% - 5px) 5px,  calc(100% - 5px) calc(100% - 60px), calc(100%) calc(100% - 60px + 5px), calc(100%) calc(100% - 10px), calc(100% - 10px) calc(100%),  calc(5px + 10px) 100%,  calc(5px) calc(100% - 10px), 5px calc(46% + 5px), 0 46%);
    --clip_dailyreward:  polygon(0 0, calc(100% - 10px) 0, 100% 10px, calc(100%) calc(100% - 180px), calc(100% - 5px) calc(100% - 180px + 5px), calc(100% - 5px) calc(100% - 10px),  calc(100% - 15px) calc(100%),  calc(5px + 10px) 100%,  calc(5px) calc(100% - 10px), 5px calc(46% + 5px), 0 46%);
    --clip_dailyreward_day:  polygon(0 0, calc(100% - 10px) 0, 100% 10px, calc(100%) calc(100% - 180px), calc(100% - 5px) calc(100% - 180px + 5px), calc(100% - 5px) calc(100% - 10px),  calc(100% - 15px) calc(100%),  calc(5px + 10px) 100%,  calc(5px) calc(100% - 10px), 5px calc(46% + 5px), 0 46%);


    --clip_menu_standardbox:  polygon(0 0, calc(100% - 10px) 0, 100% 10px, calc(100%) calc(100% - 180px), calc(100% - 5px) calc(100% - 180px + 5px), calc(100% - 5px) calc(100% - 10px),  calc(100% - 15px) calc(100%),  calc(5px + 10px) 100%,  calc(5px) calc(100% - 10px), 5px calc(46% + 5px), 0 46%);
    --clip_menu_funding_parms: polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, calc(100% - 25px) 100%, 5px 100%, 5px calc(46% + 5px), 0 46%);
    --clip_zones_zone: polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, calc(100% - 25px) 100%, 5px 100%, 5px calc(46% + 5px), 0 46%);
    --clip_menu_selectship_astronaut: polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, calc(100% - 25px) 100%, 5px 100%, 5px calc(46% + 5px), 0 46%);

    --clip_menu_newship_location:  polygon(0 0, calc(100% - 10px) 0, 100% 10px,  calc(100%) calc(100% - 60px + 5px), calc(100%) calc(100% - 10px), calc(100% - 10px) calc(100%),  calc(5px + 10px) 100%,  calc(5px) calc(100% - 10px), 5px calc(46% + 5px), 0 46%);

    --clip_desktop_basemodule:  polygon(0 0, calc(100% - 10px) 0, 100% 10px, calc(100%) calc(100% - 180px), calc(100% - 5px) calc(100% - 180px + 5px), calc(100% - 5px) calc(100% - 10px),  calc(100% - 15px) calc(100%),  calc(5px + 10px) 100%,  calc(5px) calc(100% - 10px), 5px calc(46% + 5px), 0 46%);
    --clip_desktop_basemodule_astronaut:  polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, calc(100% - 25px) 100%, 5px 100%, 5px calc(46% + 5px), 0 46%);
    --clip_desktop_basemodule_astronaut_namelink: polygon(0 0, calc(100% - 2px) 0, calc(100% - 2px) calc(100% - 6px), 100% calc(100% - 6px), 100% 100%, 2px 100%, 2px 6px, 0 6px);
    --clip_desktop_basemodule_weapon:  polygon(0 0, calc(100% - 10px) 0, 100% 10px, calc(100%) calc(100% - 10px),  calc(100% - 10px) calc(100%),  calc(5px + 10px) 100%,  calc(5px) calc(100% - 10px), 5px calc(46% + 5px), 0 46%);
    --clip_desktop_basemodule_attributes: polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, calc(100% - 25px) 100%, 5px 100%, 5px calc(46% + 5px), 0 46%);

    --clip_desktopaction:  polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, calc(100% - 25px) 100%, 5px 100%, 5px calc(46% + 5px), 0 46%);

    --clip_antenna_bdfl:  polygon(0 0, calc(100% - 10px) 0, 100% 10px, calc(100%) calc(100% - 10px),  calc(100% - 10px) calc(100%),  calc(5px + 10px) 100%,  calc(5px) calc(100% - 10px), 5px calc(46% + 5px), 0 46%);
    --clip_desktop_new_satellite_borehole:  polygon(0 0, calc(100% - 10px) 0, 100% 10px, calc(100%) calc(100% - 180px), calc(100% - 5px) calc(100% - 180px + 5px), calc(100% - 5px) calc(100% - 10px),  calc(100% - 15px) calc(100%),  calc(5px + 10px) 100%,  calc(5px) calc(100% - 10px), 5px calc(46% + 5px), 0 46%);
    --clip_desktop_new_satellite_borehole_item:  polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, calc(100% - 25px) 100%, 5px 100%, 5px calc(46% + 5px), 0 46%);
    --clip_desktop_adtronaut_dismisshire:  polygon(0 0, calc(100% - 10px) 0, 100% 10px, calc(100%) calc(100% - 180px), calc(100% - 5px) calc(100% - 180px + 5px), calc(100% - 5px) calc(100% - 10px),  calc(100% - 15px) calc(100%),  calc(5px + 10px) 100%,  calc(5px) calc(100% - 10px), 5px calc(46% + 5px), 0 46%);

    --clip_desktop_boreholescene:  polygon(0 0, calc(100% - 10px) 0, 100% 10px, calc(100%) calc(100% - 180px), calc(100% - 5px) calc(100% - 180px + 5px), calc(100% - 5px) calc(100% - 10px),  calc(100% - 15px) calc(100%),  calc(5px + 10px) 100%,  calc(5px) calc(100% - 10px), 5px calc(46% + 5px), 0 46%);

    --clip_csbox_cstationrotbox: polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, calc(100% - 15px) 100%, calc(100% - 15px) calc(100% - 5px),calc(100% - 85px) calc(100% - 5px),calc(100% - 85px) calc(100%),8px 100%, 8px calc(66% + 8px), 0 66%);
    --clip_desktop_weponfitting_weapon:  polygon(0 0, calc(100% - 10px) 0, 100% 10px, calc(100%) calc(100% - 10px),  calc(100% - 10px) calc(100%),  calc(5px + 10px) 100%,  calc(5px) calc(100% - 10px), 5px calc(46% + 5px), 0 46%);

    --border-button-color: #8c98b9;
    --border-button-color2: #bbbdc3;
    --border-button-color-unactive: #797979;

}

@keyframes deblur {
    0.000% {
        filter:  blur(6px);
    }
    99.9% {
        filter:  blur(0px);
    }
    100.000% {
        filter:  unset;
    }
}

::-webkit-scrollbar {
    width: 5px;
}

/* Track */
::-webkit-scrollbar-track {
    background: rgba(200,200,200,0.1);
}

/* Handle */
::-webkit-scrollbar-thumb {
    background: rgba(50,50,50,1);
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
    background: white;
}

@-webkit-keyframes highlited{
    0%{
        opacity:0.2;
    }
    70%{
        opacity:1;
    }
    100%{
        opacity:0.2;
    }
}
@-moz-keyframes highlited{
    0%{
        opacity:0.2;
    }
    70%{
        opacity:1;
    }
    100%{
        opacity:0.2;
    }
}
@-ms-keyframes highlited{
    0%{
        opacity:0.2;
    }
    70%{
        opacity:1;
    }
    100%{
        opacity:0.2;
    }
}
@-o-keyframes highlited{
    0%{
        opacity:0.2;
    }
    70%{
        opacity:1;
    }
    100%{
        opacity:0.2;
    }
}
@keyframes highlited{
    0%{
        opacity:0.2;
    }
    70%{
        opacity:1;
    }
    100%{
        opacity:0.2;
    }
}





@-webkit-keyframes blink{
    0%{
        opacity:1;
    }
    33%{
        opacity:0.4;
    }
    66%{
        opacity:1;
    }
    100%{
        opacity:0.3;
    }
}
@-moz-keyframes blink{
    0%{
        opacity:1;
    }
    33%{
        opacity:0.4;
    }
    66%{
        opacity:1;
    }
    100%{
        opacity:0.3;
    }
}
@-ms-keyframes blink{
    0%{
        opacity:1;
    }
    33%{
        opacity:0.4;
    }
    66%{
        opacity:1;
    }
    100%{
        opacity:0.3;
    }
}
@-o-keyframes blink{
    0%{
        opacity:1;
    }
    33%{
        opacity:0.4;
    }
    66%{
        opacity:1;
    }
    100%{
        opacity:0.3;
    }
}
@keyframes blink{
    0%{
        opacity:1;
    }
    33%{
        opacity:0.4;
    }
    66%{
        opacity:1;
    }
    100%{
        opacity:0.3;
    }
}


@keyframes crt{
    0%{
        opacity:1;
    }
    27.2%{
        opacity:1;
    }
    27.5%{
        opacity:0.95;
    }
    27.7%{
        opacity:1;
    }
    28.2%{
        opacity:1;
    }
    28.5%{
        opacity:0.95;
    }
    28.7%{
        opacity:1;
    }
    29.2%{
        opacity:1;
    }
    29.5%{
        opacity:0.95;
    }
    29.7%{
        opacity:1;
    }
    77.2%{
        opacity:1;
    }
    77.5%{
        opacity:0.4;
    }
    77.9%{
        opacity:1;
    }
    78.0%{
        opacity:0.6;
    }
    78.3%{
        opacity:1;
    }
    97%{
        opacity:1;
    }
    97.2%{
        opacity:0.3;
    }
    97.5%{
        opacity:1;
        transform: scale(1.1) skewY(0deg) skewX(0deg);
    }
    98%{
        opacity:0;
        transform: scale(1.05) skewY(-1deg) skewX(0deg);
    }
    98.2%{
        opacity:0;
        transform: scale(1) skewY(0deg) skewX(-1deg);
    }
    100%{
        opacity:1;
        transform: scale(1) skewY(0deg) skewX(0deg);
    }
}

@keyframes shadowing{
    0% {
        text-shadow: -3px 0px 0 rgba(255,131,64,.3), 3px 0px 0 rgba(126, 250, 255, .2);
    }
    15% {
        text-shadow:  0px 0px 0 rgba(255,131,64,.3), 0px 0px 0 rgba(126, 250, 255, .2);
    }
    85% {
        text-shadow:  0px 0px 0 rgba(255,131,64,.3), 0px 0px 0 rgba(126, 250, 255, .2);
    }
    100% {
        text-shadow: -3px 0px 0 rgba(255,131,64,.3), 3px 0px 0 rgba(126, 250, 255, .2);
    }
}

@keyframes showBox{
    0%{
        opacity:0;
        transform: perspective( 500px ) rotateY( 55deg );
        transform-origin: 0% 0%;
    }
    100%{
        opacity:1;
        transform: perspective( 500px ) rotateY( 0deg );
    }
}


@keyframes hash{
    0.000% {
        bottom: -100%
    }

    2.000% {
        bottom: -100%
    }
    2.001% {
        bottom: -98%
    }

    4.000% {
        bottom: -98%
    }
    4.001% {
        bottom: -96%
    }

    6.000% {
        bottom: -96%
    }
    6.001% {
        bottom: -94%
    }

    8.000% {
        bottom: -94%
    }
    8.001% {
        bottom: -92%
    }

    10.000% {
        bottom: -92%
    }
    10.001% {
        bottom: -90%
    }



    12.000% {
        bottom: -90%
    }
    12.001% {
        bottom: -88%
    }

    14.000% {
        bottom: -88%
    }
    14.001% {
        bottom: -84%
    }

    16.000% {
        bottom: -84%
    }
    16.001% {
        bottom: -84%
    }

    18.000% {
        bottom: -84%
    }
    18.001% {
        bottom: -82%
    }

    20.000% {
        bottom: -82%
    }
    20.001% {
        bottom: -80%
    }



    22.000% {
        bottom: -80%
    }
    22.001% {
        bottom: -78%
    }

    24.000% {
        bottom: -78%
    }
    24.001% {
        bottom: -76%
    }

    26.000% {
        bottom: -76%
    }
    26.001% {
        bottom: -74%
    }

    28.000% {
        bottom: -74%
    }
    28.001% {
        bottom: -72%
    }

    30.000% {
        bottom: -72%
    }
    30.001% {
        bottom: -70%
    }



    32.000% {
        bottom: -70%
    }
    32.001% {
        bottom: -68%
    }

    34.000% {
        bottom: -68%
    }
    34.001% {
        bottom: -66%
    }

    36.000% {
        bottom: -66%
    }
    36.001% {
        bottom: -64%
    }

    38.000% {
        bottom: -64%
    }
    38.001% {
        bottom: -62%
    }

    40.000% {
        bottom: -62%
    }
    40.001% {
        bottom: -60%
    }



    42.000% {
        bottom: -60%
    }
    42.001% {
        bottom: -58%
    }

    44.000% {
        bottom: -58%
    }
    44.001% {
        bottom: -56%
    }

    46.000% {
        bottom: -56%
    }
    46.001% {
        bottom: -54%
    }

    48.000% {
        bottom: -54%
    }
    48.001% {
        bottom: -52%
    }

    50.000% {
        bottom: -52%
    }
    50.001% {
        bottom: -50%
    }



    52.000% {
        bottom: -50%
    }
    52.001% {
        bottom: -48%
    }

    54.000% {
        bottom: -48%
    }
    54.001% {
        bottom: -44%
    }

    56.000% {
        bottom: -44%
    }
    56.001% {
        bottom: -44%
    }

    58.000% {
        bottom: -44%
    }
    58.001% {
        bottom: -42%
    }

    60.000% {
        bottom: -42%
    }
    60.001% {
        bottom: -40%
    }


    62.000% {
        bottom: -40%
    }
    62.001% {
        bottom: -38%
    }

    64.000% {
        bottom: -38%
    }
    64.001% {
        bottom: -36%
    }

    66.000% {
        bottom: -36%
    }
    66.001% {
        bottom: -34%
    }

    68.000% {
        bottom: -34%
    }
    68.001% {
        bottom: -32%
    }

    70.000% {
        bottom: -32%
    }
    70.001% {
        bottom: -30%
    }


    72.000% {
        bottom: -30%
    }
    72.001% {
        bottom: -28%
    }

    74.000% {
        bottom: -28%
    }
    74.001% {
        bottom: -26%
    }

    76.000% {
        bottom: -26%
    }
    76.001% {
        bottom: -22%
    }

    78.000% {
        bottom: -22%
    }
    78.001% {
        bottom: -22%
    }

    80.000% {
        bottom: -22%
    }
    80.001% {
        bottom: -20%
    }


    82.000% {
        bottom: -20%
    }
    82.001% {
        bottom: -18%
    }

    84.000% {
        bottom: -18%
    }
    84.001% {
        bottom: -16%
    }

    86.000% {
        bottom: -16%
    }
    86.001% {
        bottom: -14%
    }

    88.000% {
        bottom: -14%
    }
    88.001% {
        bottom: -12%
    }

    90.000% {
        bottom: -12%
    }
    90.001% {
        bottom: -10%
    }




    92.000% {
        bottom: -10%
    }
    92.001% {
        bottom:  -8%
    }

    94.000% {
        bottom:  -8%
    }
    94.001% {
        bottom:  -6%
    }

    96.000% {
        bottom:  -6%
    }
    96.001% {
        bottom:  -4%
    }

    98.000% {
        bottom:  -4%
    }
    98.001% {
        bottom:  -2%
    }

    99.001% {
        bottom:  -2%
    }
    100.000% {
        bottom:  -0%
    }

}



@keyframes hash10 {
    0.000% {
        bottom:  0px
    }

    10.000% {
        bottom: 0px
    }
    10.001% {
        bottom: -40px
    }

    20.000% {
        bottom: -40px
    }
    20.001% {
        bottom: -80px
    }

    30.000% {
        bottom: -80px
    }
    30.001% {
        bottom: -100px
    }

    50.000% {
        bottom: -100px
    }
    50.001% {
        bottom: -130px
    }

    70.000% {
        bottom: -130px
    }
    70.001% {
        bottom: -150px
    }

    90.000% {
        bottom: -150px
    }
    90.001% {
        bottom: -180px
    }

    99.001% {
        bottom:  -180px
    }
    100.000% {
        bottom:  -200px
    }
}


@keyframes slowMovingRightZoomin {
    0.000% {
        background-position:  left;
        background-size: 130%;
    }

    100.000% {
        background-position:  right;
        background-size: 150%;
    }
}

@keyframes slowMovingLeftZoomin {
    0% {
        background-position:  right;
        background-size: 130%;
    }

    100% {
        background-position:  left;
        background-size: 150%;
    }
}

@keyframes slowMovingRightZoomout {
    0% {
        background-position:  left;
        background-size: 150%;
    }

    100% {
        background-position:  right;
        background-size: 130%;
    }
}

@keyframes slowMovingLeftZoomout {
    0% {
        background-position:  right;
        background-size: 150%;
    }

    100% {
        background-position:  left;
        background-size: 130%;
    }
}
@keyframes blink {
    0% {
        opacity: 1;
    }
    33% {
        opacity: 0.4;
    }
    66% {
        opacity: 1;
    }
    100% {
        opacity: 0.3;
    }
}
@keyframes glitch{
    0%{
        opacity:1;
    }
    80%{
        opacity:0.5;
    }
    100%{
        opacity:0;
        height: 0%;
    }
}

.crt {
    animation: crt 10000ms linear infinite;
}

._glitch_effect {
    
    background-color:rgba(0,0,0,0)  !important;
    /*background-image:url(./effects/glitch1.gif) !important;*/
    background-image:url(./effects/RnWB.gif)  !important;
    background-position:center left  !important;
    background-repeat:no-repeat !important;
    background-size: cover !important;
    animation:glitch 50ms linear 1 !important;
    animation-fill-mode: forwards !important;

}
._glitch_effect:before,
._glitch_effect:after {
    display:none !important;
}

#warning-message {
    display: none;
}
@media only screen and (orientation:portrait){
    #wrapper {
        display:none;
    }
    #warning-message {
        display:block;
    }
}
@media only screen and (orientation:landscape){
    #warning-message {
        display:none;
    }
}


html {



    margin: 0px;
    padding: 0px;
    background-size: cover;
    background-position: top right;
    height: 100%;
    background-repeat: no-repeat;
}

body {

    font-family:var(--fontFaimly_default);
    padding: 0px;
    margin: 0px;
    background-size: cover;
    background-position: top right;
    background-color: black;
    background-repeat: no-repeat;
    min-height: 100vh;
}




.hashbox {
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    height: 200px;
    overflow: hidden;
}

.hashbox .hash {
    position: absolute;


    text-transform: uppercase;
    color: rgba(255,255,255,0.05);
    letter-spacing: 2px;


    font-size: 16px;
    animation: hash10 5000ms cubic-bezier(0.05, 1.03, 0.65, 0.61) infinite;

    line-height: 16px;
    z-index: -10000;
}

#wrapper {

    padding: 0px;
    margin: 0px;
    height: 100%;
}

#warning-message {
    position: absolute;
    top: calc(50% - 85px);
    left: 10%;
    color: black;
    text-align: center;
    height: 100px;
    right: 10%;
    background-color: white;
    box-sizing: border-box;
    padding: 15px 15px 120px;

    font-size: 20px;
    background-size: 50px;
    background-image: url('turn.png');
    background-position: center 65px;
    background-repeat: no-repeat;
    line-height: 15px;
}

h1{
    font-weight:normal;
    font-size:37px;
    letter-spacing:-1px;
    color:white;
    margin:15px 0px;
}
h2{
    font-weight:normal;
    font-size:22px;
    color:white;
    margin:10px 0px;
}


a {
    text-decoration: none;
}

a img {
    border: 0px;
}
/*
#telo{
position: absolute;
top: 0px;
left: 0px;
bottom: 0px;
right: 0px;
}
*/
#telo_gl{
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
    overflow: hidden;
}

#telo_gl canvas{
    background-color: black;
    position: absolute;
    top: 0px;
    left: 0px;
}



.header {
    position: absolute;
    background: linear-gradient(to top,rgba(0,0,0,0.0) 0%,rgba(0,0,0,1.0) 100%);
    z-index: 9999999;
    min-width: 375px;
    top: 0px;
    left: 0px;
    right: 0px;
    height: 50px;
}



.container {

}

.container.media {
    position: absolute;
    top: 70px;
    bottom: 0px;
    right: 0px;
    left: 0px;
}

.header .hcontainer .logo {

    position: absolute;
    left: 10px;
    top: 20px;
    animation: crt 10000ms linear infinite;
}

@media (max-width: 520px) {
    .header .hcontainer .logo {
        display: none;
    }
}


.header .hcontainer .logo a img {
    width: 170px;
}








@media (max-width: 520px) {
    .header .hcontainer  .menu ul li ul {
        top: 40px;
        padding: 0px 0px;
    }
}

.dottedbckg {
    background-color: white;
   
}







.menu_header {
    padding: 25px 125px;
}

.menu_header ul {
    display: block;
    float: left;
    padding: 0px;
    margin: 0px;
    list-style-type: none;
    width: 33%;
}

.menu_header ul li {
    display: block;
    padding: 0px;
    margin: 0px;
    list-style-type: none;
}

.menu_header a {
    color: white;
    text-decoration: underline;
}

.menu_header a:hover {
    color: white;
    text-decoration: none;
}









.cleaner {
    clear: both;
    font-size: 1px;
    line-height: 0px;
    margin: 0px;
    padding: 0px;
    border: 0px;
}


.footer {
    position: fixed;
    bottom: 0px;
    right: 0px;
    left: 0px;
}

.footer .footerlinks {
    position: absolute;
    left: 40px;
    text-align: left;
    font-size: 10px;
    line-height: 13px;
    color: rgba(255,255,255,0.1);
    bottom: 5px;
    text-transform: uppercase;
}

.footer .footerlogo {
    position: absolute;
    left: 9px;
    bottom: 9px;
    width: 21px;
    height: 33px;
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    opacity: .2;
    transition: opacity 1s;
}

.footer .footerage {
    position: absolute;
    right: 26px;
    bottom: 11px;
    width: 41px;
    height: 23px;
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    opacity: .5;
    transition: opacity 1s;
    background-image: url('18.png');
}

.footer .footerlogo:hover {
    opacity: 1;
}

.subscriptor {
    font-size: 21px;
    margin: 0px auto;
    font-weight: normal;
    text-align: center;

}


.field {
    font-size: 16px;
    display: block;
    position: relative;
    max-width: 400px;
    padding: 20px 20px 20px 20px;
    background-color: rgba(0,0,0,0.65);
    box-sizing: border-box;
    width: 90%;
    text-align: center;
    margin: 0px auto 100px;

}

.field.centered {
    margin-top: calc(30% - 30px);

}

.field.infospan {
    margin-top: 200px;
}

.field:before {
    content:'';
    display: block;
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    height: 10px;
    border-top: 1px solid white;
    border-left: 1px solid white;
    border-right: 1px solid white;
}
.field:after {
    content:'';
    display: block;
    position: absolute;
    bottom: 0px;
    left: 0px;
    right: 0px;
    height: 10px;
    border-bottom: 1px solid white;
    border-left: 1px solid white;
    border-right: 1px solid white;
}



.field .text {
    font-size: 27px;

    margin: 0px;
    padding:  0px;
    font-weight: normal;
    color: rgba(255,255,255,0.9);


}
.field .text .lighted {
    color: rgba(255,255,255,0.9);

    text-shadow: -3px 0px 0 rgba(255,131,64,.3), 3px 0px 0 rgba(126, 250, 255, .2);
    animation: shadowing 10000ms linear infinite;

}
.field .text .myfleet {
    font-size: 24px;
    position: relative;
    margin: 0px;
    padding: 5px 0px;
    font-weight: normal;
    color: rgb(0,255,255);
    text-shadow: 0px 0px 40px rgb(0,255,255);
    text-decoration: none;
}



.field .text small {
    font-size: 20px;
    text-transform: uppercase;
    color: rgb(232,250,17);
    display: block;
    padding-top: 8px;
}

.field .text small a {
    color: white;
}

.field  .text small a:hover {
    text-decoration: none;
}

.field .text small a {
    display: inline-block;
    color: black;
    text-decoration: none;
    cursor: pointer;
    background-color: white;
    padding: 5px 14px;
    font-size: 20px;

    font-weight: normal;
    margin: 15px auto 5px;
}


.field .text small a::first-letter {
    color: rgb(4,193,193);
}

.field  .text small a:hover {
    color: black;
    background-color: rgb(232,250,17);
    animation: blink 100ms linear 2;
}




.field .text small.pos {
    color: white;

}


.field .small_info {
    color: rgba(255,255,255,.3);
    line-height: 15px;
    display: block;
    font-size: 12px;
}

.field .rightinputstable {
    margin: 5px auto;
}



.field .newslerr {
    font-size: 16px;
    font-weight: bold;
    color: rgb(200,0,0);
}

.field .newslgreen {
    font-size: 16px;
    font-weight: bold;
    color: rgb(0,200,0);
}




.subscriptor .avatar {
    display: block;
    text-decoration: none;
    background-size: cover;
    background-repeat: no-repeat;
    height: 200px;
    width: 200px;
    margin: 20px auto 0px auto;
    position: relative;
}

.subscriptor .avatar:before {
    content: "";
    position: absolute;
    top: 0px;
    right: 0px;
    bottom: 0px;
    left: 0px;
    border: 1px solid rgba(255,255,255,0.1);
}



.subscriptor .avatar span {
    display: block;
    position: absolute;
    top: 85px;
    left: 0px;
    right: 0px;
    box-sizing: border-box;
    opacity: 0;
    cursor: pointer;
    background-color: rgb(232,250,17);
    padding: 0px 10px;
    transition: opacity 0.2s linear;
    color: black;

    text-transform: uppercase;
    font-size: 20px;
    height: 30px;
    text-align: center;
    line-height: 30px;
    font-weight: normal;
    text-decoration: none;
    text-align: center;

}




.members .add {
    display: block;
    float: left;
    margin: 7px;
    cursor: pointer;
    padding: 0px;
    width: 120px;
    height: 190px;
    text-align: center;
    box-sizing: border-box;
    text-transform: uppercase;
    transition: opacity 0.2s linear;
    color: black;
    font-weight: normal;

    text-decoration: none;
    font-size: 32px;
    line-height: 190px;
    position: relative;
    background-color: white;
    

}





.members .add:hover {

    background: white;

}

.members .user {
    background: rgba(0,0,0,0.4) url('stations_plus.png') center no-repeat;
    padding: 10px;
    width: 84px;
    height: 84px;
    text-align: center;
    color: rgba(255,255,255,0.4);
    padding: 0px;
    font-size: 13px;
    background-size: cover;
    position: relative;

}

.members .user:after {
    content: "";
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
    border: 3px solid rgba(0,255,255,1);
    filter: blur(3px);

}



.members .addtable .user .namebox {
    position: absolute;
    bottom: -33px;
    color: gold;
    font-size: 12px;
    height: 27px;
    line-height: 12px;
    padding: 0px;
    width: 100%;
    text-transform: uppercase;
    opacity: 0.8;
    font-weight: normal;
    text-align: center;
}

.members .addtable .user .namebox span.mail {

    color: white;
    font-size: 8px;

}

.members .addtable .user:hover .namebox {
    opacity: 1;
}

.members h5 {
    position: relative;
    color: yellow;
    padding: 15px 5px;
    box-sizing: border-box;
    text-transform: uppercase;

    text-decoration: none;
    text-transform: none;
    font-size: 34px;
    font-weight: normal;
    text-align: center;
    clear: both;
    margin: 0px;
    text-transform: uppercase;
}

.subscriptor .title .small {
    font-size: 14px;
    color: silver;
}

.reward {
    height: 400px;
    margin: 0px auto;
    width: 322px;
}

.loginbox {
    position: absolute;
    top: 60px;
    right: 110px;
    width: 322px;
    padding: 20px 10px 20px 10px !important;
    background-color: rgba(0,0,0,0.65);
}

.loginbox .title {

    opacity: 0.9;
    color: white;
    padding: 5px 0px;
}

.loginbox input {
    color: black;
    height: 27px;
}

.loginbox input[type="text"], .loginbox input[type="password"] {
    width: 113px;
}

.loginbox input[type="submit"] {
    cursor: pointer;
}

input {
    font-size: 16px;
    padding: 0px 5px;
    height: 30px;
    font-weight: bold;
    color: rgba(255,255,255,.8);
    text-align: center;
    background-color: rgba(255,255,255,.5);
    
    border: none;
    box-sizing: border-box;
    text-shadow: -3px 0px 0 rgba(255,131,64,.4), 3px 0px 0 rgba(126, 250, 255, .4);
    animation: shadowing 5000ms linear infinite;
}


::-webkit-input-placeholder { /* Edge */
    font-size: 12px;
}

:-ms-input-placeholder { /* Internet Explorer 10-11 */
    font-size: 12px;
}

::placeholder {
    font-size: 12px;
}

select {
    font-size: 16px;
    padding: 0px 5px;
    font-weight: normal;
    color: rgb(0,255,200);
    text-align: center;
    background-color: rgba(0,50,50,1);

    text-decoration: none;
    text-transform: uppercase;
    font-size: 17px;
    padding: 7px;
}

input.file {
    padding: 0px;
    height: initial;
    text-align: left;
    border: 0px;
    border-radius: 0px;
    background-color: transparent;
    width: 252px;

    font-size: 15px;
    font-weight: normal;
    color: rgba(255,255,255,0.9);
    text-shadow: 0px 0px 40px rgba(255,255,255,1);
}

.imageedit {
    display: block;
    position: absolute;
    top: 83px;
    left: 0px;
    margin: 0px auto;
    width: 400px;
    padding: 20px 20px 20px 20px;
    border-top: 1px solid rgba(255, 255, 255, 0.2);
    border-bottom: 1px solid rgba(255, 255, 255, 0.2);
    background: rgba(0, 50, 75, 0.95);
    color: white;
    text-align: left;
    z-index: 100;
    box-sizing: border-box;
}

input[type="text"],input[type="password"],input[type="email"] {

}

textarea {
    text-decoration: none;
    width: 100%;
    min-height: 120px;
    padding: 5px;
    max-width: 100%;
    font-size: 16px;

    font-weight: bold;
    color: black;
    text-align: center;
    background-color: white;
    
    border: none;
    box-sizing: border-box;

}

input[type="submit"],button {
    position: relative;
    text-align: center;
    border: none;
    cursor: pointer;
    text-decoration: none;
    color: black;
    padding: 0px 15px;
    font-size: 14px;
    font-family: var(--fontFaimly_button);
    box-sizing: border-box;
    text-transform: uppercase;
    line-height: 28px;
    height: 30px;
    background-color: transparent;
    z-index: 1;


}

button:after {
    display: block;
    position: absolute;
    content: "";
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
    background-color: #ffbc00;
    color: black;
    clip-path: var(--clip_button);
    cursor: pointer;
    z-index: -1;
}

button:hover{
    animation:blink 100ms linear 2 alternate;
}






.highlited {
    animation:highlited 500ms linear infinite;
}


input[type="submit"]:hover, button:hover {
    animation: blink 100ms linear 2 alternate;
}

input[type="submit"].gray,button.gray {
    color:  rgb(200,200,200);
    background-color: rgba(55,55,55,1);
}


.navline {
    padding: 10px;
    min-width: 380px;
    margin: 0px auto;
    position: relative;
    color: white;
}

.navline a {
    color: rgba(255,255,255,0.8);
    text-decoration: none;
    font-size: 16px;
    font-weight: bold;

    border-radius: 5px;
    padding: 5px 10px;
    padding-left: 25px;
    background: url(arrow-88-16.png) 5px center no-repeat;
    transition: background 0.2s linear;
    cursor: pointer;




    text-shadow: 0px 0px 10px rgb(255,255,255);
    text-transform: uppercase;
}

.navline a:hover {
    background: rgba(0,0,0,0.2) url(arrow-88-16.png) left center no-repeat;
    color: rgba(255,255,255,1);
}



.email input[type="email"] {
    width: 250px;
}

.sendinv {
    margin-top: 15px;
}


.loginer {
    position: absolute;
    top: calc(50% - 90px);
    width: 100%;
}



.images .mainimage {
    position: relative;
    text-align: center;
    height: 350px;
    overflow: hidden;
    background-color: black;
}

.images .mainimage #imgloader {
    position: absolute;
    top: 132px;
    height: 30px;
    left: calc(50% - 15px);
    width: 30px;
    display: none;
    opacity: 0.5;
}

.images .mainimage a {
    display: block;
    position: relative;
    overflow: hidden;
    height: 100%;
}

.images .mainimage a img {
    position: absolute;
    bottom: 0px;
    left: calc(50% - 600px);
}


.images .mainimage a img {
    position: absolute;
    bottom: 0px;
    left: 0px;
    width: 100%;
    min-width: 1200px;
}


.images .gallery {
    display: block;
    position: absolute;
    bottom: 60px;
    margin: 0px;
    padding: 0px;
    text-align: center;
    width: 100%;
    height: 20px;
}

.images .gallery li {
    display: inline-block;
    position: relative;
    width: 16px;
    height: 16px;
    margin: 0px;
    padding: 0px 3px;
    transition: transform 0.1s linear, opacity 0.3s linear;
    opacity: 0.7;
    cursor: pointer;
    background: url(circle-dashed-4-16.png) center no-repeat;
}

.images .gallery li:hover {
    transform: rotate(60deg);
    opacity: 1;
}

.images .gallery li.clicked{
    background: url(circle-outline-16.png) center no-repeat;
}




.images .name {
    display: block;
    position: absolute;
    bottom: 0px;
    left: 0px;
    height: 55px;
    margin: 0px;
    padding: 0px;
    text-align: center;
    width: 100%;

}

.images .name .textboxa {
    display: block;
    position: relative;
    margin-top: 7px;
    height: 40px;
    padding: 0px 10px;
    text-align: left;

}

.images .name .textboxa h1 {
    display: inline-block;
    margin: 0px;
    padding: 0px;
    font-size: 40px;
    letter-spacing: -1px;
    line-height: 40px;
    color: rgb(0,255,255);
    text-shadow: 0px 0px 40px rgb(0,255,255);
    font-weight: normal;

}

.images .name .textboxa h2 {
    display: inline-block;
    margin: 0px 0px 0px 25px;
    padding: 0px;
    text-transform: uppercase;


    line-height: 40px;


    text-shadow: 0px 0px 15px rgba(0,255,255,1);
    font-size: 14px;
    color: rgba(0,255,255,0.5);
    font-weight: normal;

}

.see3d {
    display: block;
    position: absolute;
    top: 5px;
    right: 5px;
    text-align: center;
    height: 35px;
    width: 65px;
    font-weight: bold;
    color: rgb(0,255,255);
    transition: text-shadow 0.3s linear,opacity 0.3s linear;
    cursor: pointer;

    text-transform: uppercase;
    opacity: 0.7;
}

.see3d:hover {
    text-shadow: 0px 0px 20px rgb(0,255,255);
    opacity: 1;
}

.links {
    display: block;
    position: relative;
    margin: 0px;
    padding: 0px;
    text-align: left;
    height: 35px;
    border-top: 3px solid rgb(0,255,255);
}

.links li {
    display: inline-block;
    position: relative;
    height: 35px;
    line-height: 35px;
    margin: 0px;
    padding: 0px 15px;
    color: rgb(0,255,255);
    transition: text-shadow 0.3s linear, color 0.3s linear, background 0.3s linear;
    font-size: 14px;
    cursor: pointer;
    background-color: rgba(0,255,255,0.2);
    text-transform: uppercase;
}

.links li:hover {
    color: rgb(0,255,255);
    text-shadow: 0px 0px 20px rgb(0,255,255);
    background-color: rgba(0,255,255,0.5);
}


.note {
    color: rgba(255,255,255,0.3);
    font-size: 12px;
}




.empty_msg {
    display: block;
    position: relative;
    color: rgb(0,255,255);
    text-transform: uppercase;
    text-align: center;
    padding: 20px 0px;
    margin-top: 40px;
    background: linear-gradient(to left, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 0.9) 0%, rgba(0, 50, 75, 0.5) 100%);
}

.empty_msg:after {
    content: "";
    position: absolute;
    height: 100%;
    width: 100%;
    top: 0px;
    left: 0px;
    border-top: 1px solid rgba(0,255,255,1);
    border-bottom: 1px solid rgba(0,255,255,1);

    filter: blur(3px);
    transition: filter 0.2s linear;
}




#mesage {
    display: none;
    position:absolute;
    top: 240px;
    height: 80px;
    width: 100%;
    z-index: 1000000000;
    position: absolute;
    text-transform: uppercase;
    text-align: center;
    background: linear-gradient(to left, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 0.9) 0%, rgba(0, 50, 75, 0.5) 100%);

}


#mesage:after {
    content: "";
    position: absolute;
    top: 0px;
    left: 0px;
    bottom: 0px;
    right: 0px;
    border-top: 1px solid rgba(0,255,255,1);
    border-bottom: 1px solid rgba(0,255,255,1);

    filter: blur(3px);
    transition: filter 0.2s linear;
}

#mesage .textmesg {
    position: relative;
    text-align: center;
    width: 100%;
    margin: 0px auto;
    min-width: 380px;
    padding: 30px;
    color: rgb(0,255,255);
    font-weight: normal;
}

button.getreward {
    width: 190px;
}



.loginhint {
    display: block;
    position: absolute;
    top: 39px;
    left: calc(50% + 150px);
    outline: none;
    text-decoration: none;
    text-align: left;
    font-size: 18px;
    vertical-align: baseline;
    line-height: 14px;
    z-index: 1000;
    padding: 10px;
    width: 95px;
    color: black;

    background-color: rgb(232,250,17);
    text-transform: uppercase;
    text-shadow: none;
    font-weight: normal;

}

@media (max-width: 520px) {
    .loginhint {
        left: calc(100% - 110px);
    }
}

.addhint {
    display: block;
    position: absolute;
    top: 12px;
    left: calc(100% - 70px);
    outline: none;
    text-decoration: none;
    text-align: left;
    font-size: 18px;
    vertical-align: baseline;
    line-height: 14px;
    z-index: 1000;
    padding: 10px;
    width: 95px;
    color: black;

    background-color: rgb(232,250,17);
    text-transform: uppercase;
    text-shadow: none;
    font-weight: normal;

}


.loginhint:before,
.addhint:before {
    content: "";
    border-bottom: 10px solid transparent;
    border-top: 10px solid transparent;
    border-right: 10px solid rgb(232,250,17);
    position: absolute;
    top: 0px;
    left: -10px;
}

.newpost {
    background-color: silver;
    
}

.imageblockx {
    position: relative;
    left: calc(50% - 100px);
    width: 200px;
    height: 200px;
    top: 0px;
}

.imageblockx .deluserimage {
    display: block;
    width: 200px;
    position: absolute;
    top: 90px;
    left: 0px;
    right: 0px;
    opacity: 0;
    cursor: pointer;
    background-color: rgb(232,250,17);
    padding: 0px 10px;
    transition: opacity 0.2s linear;
    color: black;

    text-transform: uppercase;
    font-size: 20px;
    font-weight: normal;
    height: 30px;
    border: 0px;
    text-align: center;
    line-height: 30px;
}


.imageblockx .deluserimage:hover {
    opacity: 1;
}

.rewardstatus {
    font-size: 14px;
    margin: 0px auto 10px auto;

    font-weight: normal;
    color: rgba(255,215,0,1);
    text-align: center;
}

.rewardstatus a {
    color: rgba(255,215,255,1);
    text-decoration: underline;
}

.member {
    font-size: 14px;
    color: rgba(255,215,0,1);
    text-align: center;
    font-weight: normal;
}







.note {
    position: relative;
    height: 20px;
    font-size: 15px;
    color: rgba(164,0,0,1);
    text-align: center;

    text-transform: uppercase;
    overflow: hidden;
    letter-spacing: -1px;
}

.note:before {
    content: "";
    position: absolute;
    top: 0px;
    right: 0px;
    bottom: 0px;
    left: 0px;
    background: radial-gradient(ellipse at center, rgba(0, 255, 255, 0.1) 0%, rgba(0, 0, 0, 0) 70%, rgba(0, 0, 0, 0) 100%);

    filter: blur(2px);
}

.note:after {
    content: "";
    position: absolute;
    top: 0px;
    right: 0px;
    bottom: 0px;
    left: 0px;


}

.pagingplayers {
    text-align: right;
    padding: 3px 10px;
}

.totalplayers {
    text-align: left;
    padding: 3px 10px;
    font-size: 12px;
    font-weight: normal;
    color: rgb(0,255,255);
    text-shadow: 0px 0px 40px rgb(0,255,255);

}

.fleets .fleet {
    position: relative;
    padding-left: 8px;
}

.fleets .fleet .flagdiv {
    position: absolute;
    background-repeat: no-repeat;
    background-size: contain;
    top: 0px;
    right: 0px;
    bottom: 0px;
    left: 0px;
    opacity: 0.3;

}


.reswindow {
    position: absolute;
    top: 80px;
    bottom: 0px;
    right: 0px;
    left: 0px;
}

.title{
    position: absolute;
    height: 45px;
    width: 100%;
    top: 0px;
    left: 0px;
    color: white;
    box-sizing: border-box;
    overflow: hidden;
    line-height: 50px;
    text-transform: uppercase;
    text-decoration: none;
    text-align: center;
    font-size: 15px;
    text-align: center;

    font-weight: normal;
    text-shadow: -3px 0px 0 rgba(255,131,64,.3), 3px 0px 0 rgba(126, 250, 255, .2);
}
.title small {
    font-size: 17px;
}

.close{
    display: block;
    position: absolute;
    width: 16px;
    height: 16px;
    cursor: pointer;
    top: 14px;
    right: 14px;
    opacity: 0.5;
    z-index: 99;
    background:url('ico/close-window-16.png') center no-repeat;
}

.close:hover{
    opacity:1;
}
.scroll {
    overflow-y: scroll;
    overflow-x: hidden;
    position: absolute;
    top: 0px;
    bottom: 0px;
    right: 0px;
    left: 0px;
}





.switch{
    position:absolute;
    top: 41px;
    left: 7px;
    height:35px;
    color:white;
    text-align:left;
}
.switch .switcher{
    display: inline-block;
    position: relative;
    text-align: center;
    padding: 0px 0px;
    margin: 5px;
    background-color: rgba(0,0,0,0);
    cursor: pointer;
    height: 28px;
    min-width: 28px;
    opacity: 0.6;
    background-size: 24px;
    background-repeat: no-repeat;
    background-position: 0px center;
    line-height: 28px;
    padding-left: 29px;
    padding-right: 5px;
    font-size: 10px;
    text-transform: uppercase;
}
.switch .switcher:hover{
    opacity: 1;
}

.switch .switcher.table {
    background-image: url('/img/ico/ico_list_128.png');

}

.switch .switcher.graph {
    background-image: url('/img/ico/ico_graph_128.png');

}

.switch .switcher.catalog {
    background-image: url('/img/ico/ico_boxes_128.png');

}

@media (max-width: 520px) {
    .switch .switcher.catalog {
        display: none;

    }
    .switch .switcher.table {

    }
}

.switch .switcher.neworg {
    background-image: url('/img/ico/add-128.png');

}

.switch .switcher.myorg {
    background-image: url('/img/ico/corp-128.png');

}







.orgsbuttons{
    position: absolute;
    top: 50px;
    left: 10px;
    color: white;
    text-align: left;
}



.page{
    position: absolute;
    top: 2px;
    right: 10px;
    height: 26px;
    color: white;
    text-align: left;
}
.page .pager{
    display: inline-block;
    position: relative;
    text-align: center;
    padding: 0px 0px;
    margin: 5px 0px;
    background-color: rgba(0,0,0,0);
    cursor: pointer;
    height: 15px;
    width: 15px;
    opacity: 0.6;
    background-size: 15px;
    background-position: center;
    background-repeat: no-repeat;

}
.page .pager:hover{
    opacity: 1;
}

.page .pager.prev {
    background-image: url('/img/ico/arrow-88-32.png');

}

.page .pager.next {
    background-image: url('/img/ico/arrow-24-32.png');

}

#fleetsscreen .page {
    top: 50px;
}
.corporationslist{
    position:absolute;
    top:70px;
    left:20px;
    right:20px;
    bottom: 45px;
    background-color: rgba(0,0,0,0.65);
}
.corporationslist:before {
    content:'';
    display: block;
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    height: 10px;
    border-top: 1px solid white;
    border-left: 1px solid white;
    border-right: 1px solid white;
}
.corporationslist:after {
    content:'';
    display: block;
    position: absolute;
    bottom: 0px;
    left: 0px;
    right: 0px;
    height: 10px;
    border-bottom: 1px solid white;
    border-left: 1px solid white;
    border-right: 1px solid white;
}




.corporationslist .reswindow table{
    width: 100%;
    border-spacing: 0px;
    border-collapse: separate;
    box-sizing: border-box;
}
.corporationslist .reswindow tr:hover {
    background-color: white;
    
    color: black;
}
.corporationslist .reswindow td{
    color:rgb(255,255,255);
    padding:0px 10px;
    font-size:13px;
    font-weight:normal;
    text-align:left;
    overflow:hidden;
    height:17px;
    cursor:pointer;
    border-bottom:1px solid rgba(255,255,255,0.05);
}
.corporationslist .reswindow th{
    padding-left: 5px;
    text-align: left;
    font-weight: normal;
    background-color: white;
    font-weight: bold;
    color: black;
}
.corporationslist .stocksign{
    display:inline-block;
    height:100%;
    width:10px;
}
.corporationslist .stocksign.up{
    background:url('ico/ico_stock_up-24.png') center 7px no-repeat;
    background-size:8px;
}
.corporationslist .stocksign.down{
    background:url('ico/ico_stock_down-24.png') center bottom no-repeat;
    background-size:8px;
}
.corporationslist .stocksign.updown{
}
.corporationslist .reswindow .graph{
    position: absolute;
    top: 0px;
    right: 0px;
    left: 0px;
    bottom: 0px;
    color: white;
    text-align: left;
    border-spacing: 0px;
    background: linear-gradient(to right,rgba(255,255,255,0.1) 0%,rgba(0,0,0,0) 100%);
}
.corporationslist .reswindow .graph .graphinside{
    position: absolute;
    top: 23px;
    right: 10px;
    left: 10px;
    bottom: 0px;
    background-image: url(1x80_op.png);
    background-position: left bottom;
}
.corporationslist .reswindow .graph .graphinside .columnbox{
    position:relative;
    float:left;
    width:5px;
    height:100%;
    overflow:hidden;
}
.corporationslist .reswindow .graph .graphinside .columnbox .column{
    position:absolute;
    height:100%;
    left:1px;
    right:1px;
    cursor:pointer;
}
.corporationslist .reswindow .graph .graphinside .columnbox .column .liner{
    position: absolute;
    bottom: 0px;
    left: 25%;
    right: 25%;
    top: 0px;
    background: rgb(255,255,255);
    background-color: white;


}
.corporationslist .reswindow .graph .graphinside .columnbox .column:hover .liner{
    opacity:0.9;
}
.corporationslist .reswindow .graph .graphinside .columnbox .column .number{
    position: absolute;
    left: 0px;
    right: 0px;
    top: -38px;
    height: auto;
    font-size: 9px;
    color: rgba(255,255,255,0.2);
    transform: rotate(-90deg);
    white-space: nowrap;
}
.corporationslist .reswindow .graph .graphinside .columnbox .column:hover .number{
    color:rgba(255,255,255,0.9);
}
.corporationslist .reswindow .graph .graphinside .columnbox .column .name{
    color:rgba(255,255,255,0.9);
}
.corporationslist .reswindow .graph .graphinside .columnbox .column:hover .name{
    color:rgba(255,255,255,0.9);
}
.corporationslist .reswindow .graph .graphinside .columnbox .column .bigname{
    color:rgba(255,255,255,0.5);
}
.corporationslist .reswindow .graph .graphinside .columnbox .column:hover .bigname{
    color:rgba(255,255,255,0.9);
}


.stock{
    position:absolute;
    top:80px;
    left:20px;
    right:20px;
    bottom: 70px;
    background-color: rgba(0,0,0,0.65);
}
.stock:before {
    content:'';
    display: block;
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    height: 10px;
    border-top: 1px solid white;
    border-left: 1px solid white;
    border-right: 1px solid white;
}
.stock:after {
    content:'';
    display: block;
    position: absolute;
    bottom: 0px;
    left: 0px;
    right: 0px;
    height: 10px;
    border-bottom: 1px solid white;
    border-left: 1px solid white;
    border-right: 1px solid white;
}


.stock .corpname{
    position:absolute;
    top:60px;
    left:15px;
    text-transform:uppercase;
    line-height:30px;
    font-size: 55px;
    color: rgba(255,255,255,.9);
    text-shadow: rgb(163,188,255) 0px 0px 6px;
}
.stock .corpid{
    font-size:70px;
    position:absolute;
    top:65px;
    right:15px;
    text-shadow: rgb(255,213,182) 0px 0px 6px;
    color: rgba(255,255,255,0.60);
    text-transform:uppercase;

}
.stock .description{
    font-size: 17px;
    position: absolute;
    top: 113px;
    left: 15px;
    right: 320px;
    height: 115px;
    color: white;

}
.stock .stockvalues{
    font-size: 45px;
    position: absolute;
    top: 120px;
    width: 300px;
    right: 15px;
    height: 37px;
    color: white;

    text-align: right;
    letter-spacing: -2px;
    font-weight: normal;
}
.stock .stockvalues .stocksign{
    display:inline-block;
    height:100%;
    width:24px;
}
.stock .stockvalues .stocksign.up{
    background:url('ico/ico_stock_up-24.png') center 5px no-repeat;
}
.stock .stockvalues .stocksign.down{
    background:url('ico/ico_stock_down-24.png') center bottom no-repeat;
}
.stock .stockvalues .stocksign.updown{
}
.stock .graph{
    position:absolute;
    top:240px;
    right:5px;
    left:5px;
    bottom:5px;
    color:white;
    text-align:left;
    border-spacing:0px;
    background: rgba(0,0,0,0.9);
}
.stock .graph .graphinside{
    position:absolute;
    top:23px;
    right:10px;
    left:10px;
    bottom:20px;
    background-image:url('1x80_op.png');
    background-position:left bottom;
}
.stock .graph .graphinside .columnbox{
    position:relative;
    float:left;
    width:5px;
    height:100%;
    overflow:hidden;
}
.stock .graph .graphinside .columnbox .column{
    position:absolute;
    height:100%;
    left:1px;
    right:1px;
}
.stock .graph .graphinside .columnbox .column .liner{
    position:absolute;
    bottom:0px;
    left:0px;
    right:0px;
    top:0px;
    background:url('1x1_white.png') center repeat-y;
    opacity:0.2;
}
.stock .graph .graphinside .columnbox .column .topper{
    position:absolute;
    top:0px;
    left:2px;
    right:2px;
    height:3px;
    z-index:1000;
}
.stock .graph .graphinside .columnbox .column .topper.positive{
    background-color:rgba(255,255,255,1);
}
.stock .graph .graphinside .columnbox .column .topper.negative{
    background-color:rgba(255,255,255,0);
    border:1px solid rgba(255,255,255,1);
}
.stock .graph .graphinside .columnbox .column:hover .liner{
    opacity:0.9;
}
.stock .graph .graphinside .columnbox .column .number{
    position:absolute;
    left:0px;
    right:8px;
    top:-25px;
    height:10px;
    font-size:9px;
    opacity:0.9;
    transform:rotate(-90deg);
}
.stock .graph .graphinside .columnbox .column:hover .number{
    opacity:0.9;
}





.fleets{
    position:absolute;
    top:70px;
    left:20px;
    right:20px;
    bottom: 45px;
    background-color: rgba(0,0,0,0.65);
}
@media (max-width: 520px) {
    .fleets {
        position:absolute;
        left:5%;
        right:5%;
    }
}


.fleets:before {
    content:'';
    display: block;
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    height: 10px;
    border-top: 1px solid white;
    border-left: 1px solid white;
    border-right: 1px solid white;
}
.fleets:after {
    content:'';
    display: block;
    position: absolute;
    bottom: 0px;
    left: 0px;
    right: 0px;
    height: 10px;
    border-bottom: 1px solid white;
    border-left: 1px solid white;
    border-right: 1px solid white;
}


.fleets .fleetstab{
    position:relative;
    width: 100%;
    color:white;
    box-sizing:border-box;
    border-spacing: 0px;
    border-collapse: separate;
}
.fleets .fleetstab tr td {
    cursor: pointer
}

.fleets .fleetstab tr:hover {
    background-color: white;
    
    color: black;

}

.fleets .fleetstab th {
    padding-left: 5px;
    text-align: left;
    font-weight: normal;
    background-color: white;
    font-weight: bold;
    color: black;
    line-height: 17px;
}
.fleets .fleetstab td {
    text-align: left;
    font-size: 13px;
    font-weight: normal;
    padding: 5px;
}
.fleets .fleetstab td.number {
    font-size: 12px;
    font-weight: normal;
    color: rgba(255,215,0,1);
    width: 20px;
    text-align: center;
}
.fleets .fleetstab td.imgtd {
    width: 50px;
}
.fleets .fleetstab .lisname {
    font-size: 15px;
    position: relative;
    margin: 0px;
    padding: 0px;
    font-weight: normal;
    color: rgb(0,255,255);
    text-shadow: 0px 0px 40px rgb(0,255,255);
}
.fleets .fleetstab .lismail {
    display: block;
    font-size: 11px;
    color: rgba(255,255,255,0.5);
    text-transform: uppercase;
}
.fleets .fleetstab .fleet_name {
    font-weight: normal;
    color: rgba(0,255,255,0.4);
}
.fleets .fleetstab .fleet_name.glow {
    color: rgb(0,255,255);
    text-shadow: 0px 0px 40px rgb(0,255,255);
}
.fleets .fleetstab .fleet_nationality {
    color: rgba(255,255,255,0.5);
    text-transform: uppercase;
}
.fleets .fleetstab .tooltip .lisname {
    font-size: 11px;
    position: relative;
    margin: 0px;
    padding: 5px 0px;
    font-weight: normal;
    color: rgb(0,255,255);
    text-shadow: 0px 0px 40px rgb(0,255,255);
}
.fleets .fleetstab .tooltip .lismail {
    display: block;
    font-size: 11px;
    color: rgba(255,255,255,0.5);
    text-transform: uppercase;
}
.fleets .fleetstab .face {
    display: block;
    width: 40px;
    height: 40px;
    background-size: cover;
    position: relative;
    margin: 5px;
    text-decoration: none;
}

.fleets .fleetstab .memberface {
    width: 30px;
    height: 30px;
    background-size: cover;
    position: relative;
    float: left;
    margin: 5px;
}
.fleets .fleetstab .memberface:before {
    content: "";
    position: absolute;
    top: 0px;
    right: 0px;
    bottom: 0px;
    left: 0px;
    border: 3px solid rgba(0,255,255,1);
    filter: blur(2px);
}
.fleets .fleetstab .la {
    color: rgba(255,255,255,0.5);
    font-size: 10px;
}
.fleets .fleet_cat {
    display: block;
    position: relative;
    float: left;
    width: 150px;
    /* border: 1px solid rgb(255,255,255); */
    height: 220px;
    margin: 3px;
    box-sizing: border-box;
    cursor: pointer;
    background: black;
}
.fleets .fleet_cat:hover {
    background-color: rgba(255,255,255,0.1);
}

.fleets .fleet_cat .face {
    display: block;
    position: absolute;
    height: 110px;
    top: 11px;
    z-index: 2;
    left: calc(50% - 55px);
    width: 110px;
    background-repeat: no-repeat;
    background-position: center;
    border: 1px solid rgba(255,255,255,0.5);
    box-sizing: border-box;
    background-size: contain;
    overflow: hidden;
}



.fleets .fleet_cat .name {
    position: absolute;
    display: block;
    font-size: 13px;
    color: rgb(255,255,255);
    text-align: center;
    top: 120px;
    left: 5px;
    right: 5px;
    overflow: hidden;
    line-height: 16px;
    height: 45px;
}

.fleets .fleet_cat .name span {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 0px;
    right: 0px;
}

.fleets .fleet_cat .last_update {
    position: absolute;
    display: block;
    font-size: 10px;
    overflow: hidden;
    text-align: center;
    top: 170px;
    left: 5px;
    right: 5px;
    text-transform: uppercase;
    color: rgba(255,255,255,0.5);
    overflow: hidden;

}



.fleets .fleet_cat .crew {
    position: absolute;
    display: block;
    font-size: 10px;
    text-align: center;
    top: 183px;
    left: 0px;
    right: 0px;
    text-transform: uppercase;
    color: rgba(0,255,255,0.5);
    height: 30px;
    text-align: center;
}

.fleets .fleet_cat .crew .member,
.fleets .fleet_cat .crew .envoy {
    position: absolute;
    display: block;
    font-size: 12px;
    text-align: center;
    width: 30%;
    padding-left: 20px;
    box-sizing: border-box;
    color: rgba(0,255,255,0.5);
    height: 30px;
    text-align: left;
    background-position: center left;
    background-repeat: no-repeat;
    background-size: 14px;
    line-height: 30px;
    color: white;
}

.fleets .fleet_cat .crew .envoy {
    left: 22%;
    background-image: url('ico/star-7-16.png');
}

.fleets .fleet_cat .crew .member {
    right: 18%;
    background-image: url('ico/user-5-16.png');
}



.fleetstab td.oid,
.fleetstab th.oid {
    text-align: right;
    padding-right: 15px;
}

.fleetstab td.oid {
    color: rgba(255,255,255,0.5);
    font-size: 10px;
}

.fleetstab td.crew,
.fleetstab th.crew {
    text-align: center;
    padding-left: 5px;
    padding-right: 5px;
    padding-top: 5px;
    width: 30px;
}
.fleetstab th.crew img {
    filter: invert(100%);
}

#all_servers {
    position: absolute;
    top: 60px;

    right: 10px;
    z-index: 1;
    /*background-color: rgba(0,0,0,0.65); */
    box-sizing: border-box;
    padding: 0px;
    display: none;
    width: 350px;
    animation:showBox 150ms linear 1 alternate;
}


@media (max-width: 520px) {
    #all_servers {
        right: 10px;
        left: 10px;
        width: unset;

    }
}
/*
#all_servers:before { content:''; display: block;  position: absolute; top: 0px; left: 0px; right: 0px; height: 10px; border-top: 1px solid white; border-left: 1px solid white; border-right: 1px solid white;   }  
#all_servers:after { content:''; display: block;  position: absolute; bottom: 0px; left: 0px; right: 0px; height: 10px; border-bottom: 1px solid white; border-left: 1px solid white; border-right: 1px solid white;   }  
*/

#all_servers.visible {
    display: block;
}

#all_servers h1{
    height: 31px;
    color: white;
    box-sizing: border-box;
    line-height: 32px;

    text-decoration: none;
    font-size: 31px;
    font-weight: normal;
    text-align: center;
    margin: 0px;
    text-transform: uppercase;
}


#all_servers .content {
    position: absolute;
    top: 80px;
    bottom: 0px;
    right: 0px;
    left: 0px;

}

#all_servers .content .servers .active,
#all_servers .content .servers .unactive
{
    position: relative;
    padding-top: 18px;
    padding-bottom: 30px;
}



#all_servers .content .servers .active:before{
    content: 'AVAILABLE SERVERS';
    display: block;
    position: relative;
    top: 0px;
    left: 11px;
    color: rgba(255,255,255,0.2);
    font-size: 14px;

}

#all_servers .content .servers .unactive:before{
    content: 'UNACTIVE SERVERS';
    display: block;
    position: relative;
    top: 0px;
    left: 11px;
    color: rgba(255,255,255,0.2);
    font-size: 14px;

}


.sectors .sector{
    position: relative;
    text-align: left;
    margin: 0px 0px 0px 0px;
}

.sectors .sector .sname{
    display: inline-block;
    position: absolute;
    color: white;
    text-decoration: none;
    text-align: left;
    font-size: 13px;
    font-weight: normal;

    cursor: pointer;
    text-transform: uppercase;
    padding: 3px 5px;
    z-index: 1;
    top: -75px;
    left: 4px;
}

.sectors .sector .sname:hover{
    background-color: white;
    color: black;
    animation: blink 100ms linear 2;
}


.sectors .sector .stars{
    display: block;
    position: absolute;
    top: -100px;
    left: 0px;
    right: 0px;
    text-shadow: none;
    text-align: right;

}



.sectors .sector .stars .star{
    position: relative;
    text-align: center;
    height: 100px;
    width: 100px;
    display: inline-block;
}

.sectors .sector .stars .star .sicon{
    position: absolute;
    top: 15px;
    bottom: 15px;
    left: 15px;
    right: 15px;
}

.sectors .sector .stars .star .sicon span{
    position: absolute;
    display: block;
    border-radius: 2000px;
    background-image: url('stars/star_bckg_b.png');
    background-position: center;
    background-size: 102%;
    background-repeat: no-repeat;


}


.sectors .sector .stars .star .sicon span:after{
    content: '';
    display: block;
    position: absolute;
    top: -20%;
    left: -20%;
    right: -20%;
    bottom: -20%;
    background-image: url(stars/corona.png);
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    z-index: -1;
    opacity: 0.6;
}







.server{
    position: relative;
    text-align: left;
    height: 110px;
    margin: 20px 0px 0px 0px;
    text-shadow: var(--shadow_textfull);
    filter: drop-shadow(0px 0px 15px rgba(0, 0, 0, 0.6));
}

.server:before {
    content: "";
    position: absolute;
    display: block;
    top: -1px;
    left: -1px;
    right: -1px;
    bottom: -1px;
    background-color: rgba(154 223 255 / 43%);
    -webkit-clip-path: var(--clip_win_new);
    clip-path: var(--clip_win_new);
}

.server:not(.playable):before {
    content: "";
    position: absolute;
    display: block;
    top: -1px;
    left: -1px;
    right: -1px;
    bottom: -1px;
    background-color: rgb(0 0 0 / 43%);
    -webkit-clip-path: var(--clip_win_new);
    clip-path: var(--clip_win_new);
}

.server .img{
    display: block;
    position: absolute;
    top: 0px;
    bottom: 0px;
    left: 0px;
    right: 0px;
    -webkit-clip-path: var(--clip_win_new);
    clip-path: var(--clip_win_new);
}

.server .img:after {
    box-shadow: inset 0 0 40px rgb(0 102 204 / 30%), inset 0 0 160px rgb(0 102 204 / 20%);
    bottom: 0;
    content: "";
    display: block;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
}



/*
.server .img:before { content:''; display: block;  position: absolute; top: 0px; left: 0px; bottom: 0px; width: 10px; border-top: 1px solid rgba(255,255,255,1); border-left: 1px solid rgba(255,255,255,1); border-bottom: 1px solid rgba(255,255,255,1); z-index: 1;  }  
.server .img:after { content:''; display: block;  position: absolute; bottom: 0px; right: 0px; top: 0px; width: 10px; border-bottom: 1px solid rgba(255,255,255,1); border-right: 1px solid rgba(255,255,255,1); border-top: 1px solid rgba(255,255,255,1);  z-index: 1;  }  
*/
.server.disabled .img {
    filter:grayscale(1);
}
.server:not(.playable) .img:after {
    box-shadow: inset 0 0 40px rgb(0 0 0 / 30%), inset 0 0 160px rgb(0 0 0 / 20%);
    bottom: 0;
    content: "";
    display: block;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
}


.server .img .icontent {
    display: block;
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
    background-size: cover;
    background-position: top right;
    opacity: 0.8;
}

.server.playable .img .icontent {
    display: block;
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
    background-size: cover;
    background-position: top right;
    opacity: 1;
}

.server .img .icontent:after {
    content: '';
    display: block;
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
    background-image: linear-gradient(10deg, rgba(0,0,0,.8) 0%, rgba(0,0,0,0) 60%),linear-gradient(160deg, rgba(0,0,0,0) 60%, rgba(0,0,0,.8) 100%);
    background-size: cover;
    background-position: bottom left;
}

.server .img .bicontent {
    display: none;
    position: absolute;
    top: -5px;
    left: -5px;
    right: -5px;
    bottom: -5px;
    background-size: cover;
    background-position: top right;
    z-index: -1;
    filter:grayscale(0.8) brightness(1.5);
    opacity: 0.3;
}




.server .img .icontent{
    /*animation: crt 3000ms linear infinite;*/
}


.server .name{
    display: block;
    position: absolute;
    top: 10px;
    left: 10px;
    color: white;
    right: 10px;
    text-decoration: none;
    text-align: left;
    font-size: 19px;
    font-weight: normal;

   
}

.server .subname{
    display: block;
    position: absolute;
    top: 36px;
    left: 10px;
    color: white;
    right: 10px;
    text-decoration: none;
    text-align: left;
    font-size: 11px;
    font-weight: normal;

    text-transform: uppercase;
}



.server .players{
    display: block;
    position: absolute;
    bottom: 30px;
    left: 10px;
    color: white;
    text-transform: uppercase;
    text-decoration: none;
    font-size: 11px;
    font-weight: normal;

    text-align: left;
}

.server .running{
    display: block;
    position: absolute;
    bottom: 15px;
    left: 10px;
    color: gray;
   
    text-decoration: none;
    font-size: 11px;
    font-weight: normal;

    text-align: left;
    text-shadow: none;
}

.server .status{
    display: block;
    position: absolute;
    bottom: 0px;
    right: 10px;
    top: 0px;
}

.server .status .version{
    display: block;
    position: absolute;
    bottom: 6px;
    right: 0px;
    
    color: gray;
    text-transform: uppercase;
    text-decoration: none;
    font-size: 11px;
    font-weight: normal;

    text-align: right;
    text-shadow: none;
    white-space: nowrap;
}



.server .status .sutton{
    position: relative;
    text-align: center;
    border: none;
    cursor: pointer;
    text-decoration: none;
    color: #b9dbff;
    padding: 0px 20px;
    font-size: 13px;
    font-family: var(--fontFaimly_button);
    box-sizing: border-box;
    text-transform: uppercase;
    white-space: nowrap;
    line-height: 35px;
    height: 35px; 
    background-color: transparent;
    z-index: 1;
}

.server .status .sutton {
    display: inline-block;
}


.server .status .sutton:before{
    content: '';
    position: absolute;
    left: 3px;
    right: 3px;
    top: 3px;
    bottom: 3px;
    background-color: transparent;

    
    z-index: -1;
}

.server .status .sutton:after{
    content: '';
    display: block;
    position: absolute;
    left: 0px;
    right: 0px;
    top: 0px;
    bottom: 0px;
    background-image: linear-gradient(0deg, var(--border-button-color) 0%, var(--border-button-color) 100%), linear-gradient(0deg, var(--border-button-color) 0%, var(--border-button-color) 100%), linear-gradient(0deg, var(--border-button-color2) 0%, var(--border-button-color2) 100%), linear-gradient(0deg, var(--border-button-color) 0%, var(--border-button-color) 100%), linear-gradient(0deg, var(--border-button-color) 0%, var(--border-button-color) 100%), linear-gradient(0deg, var(--border-button-color2) 0%, var(--border-button-color2) 100%), linear-gradient(0deg, var(--border-button-color) 0%, var(--border-button-color) 100%), linear-gradient(0deg, var(--border-button-color) 0%, var(--border-button-color) 100%), linear-gradient(0deg, var(--border-button-color) 0%, var(--border-button-color) 100%);
    background-repeat: no-repeat;
    background-size: calc(100% - 4px) 1px, 1px calc(20% - 2px), 1px calc(60% - 4px), 1px calc(20% - 2px), 1px calc(20% - 2px), 1px calc(60% - 4px), 1px calc(20% - 2px), 36% 3px, calc(100% - 4px) 1px;
    background-position: top 1px center, top 2px left 1px, center left 1px, bottom 2px left 1px, top 2px right 1px, center right 1px, bottom 2px right 1px, bottom center, bottom 1px center;
}



.server .status .sutton.highlited {
    animation:highlited 1000ms linear infinite;
}

.server .status .sutton{
    display: block;
    position: absolute;
    bottom: 25px;
    right: 0px;
    text-shadow: none;
}


.server .status .sutton:not(.unactive):hover:before {
    box-shadow: 0px 0px 15px #3b466f inset;
    animation: blink 100ms linear 2 alternate;
}

.server .status .sutton.banned{
    color: #B8B8B8;
    border: 1px solid #B8B8B8;
    text-shadow: none;
    cursor: not-allowed;
    font-size: 10px;
}

.server .status .sutton.banned:hover {
    animation: none;
}


.server .status .sutton.register{

    /*background-color: #ffbc00;*/




}


.server .status .sutton.banned:hover {
    animation: none;
    box-shadow: none;
}




#star_infos {
    position: absolute;
    top: 60px;

    right: 10px;
    z-index: 1;
    /*background-color: rgba(0,0,0,0.65); */
    box-sizing: border-box;
    padding: 0px;
    display: none;
    width: 350px;
    animation:showBox 150ms linear 1 alternate;
}




/*
#star_infos:before { content:''; display: block;  position: absolute; top: 0px; left: 0px; right: 0px; height: 10px; border-top: 1px solid white; border-left: 1px solid white; border-right: 1px solid white;   }  
#star_infos:after { content:''; display: block;  position: absolute; bottom: 0px; left: 0px; right: 0px; height: 10px; border-bottom: 1px solid white; border-left: 1px solid white; border-right: 1px solid white;   }  
*/

#star_infos.visible {
    display: block;
}

#star_infos h1{
    height: 31px;
    color: white;
    box-sizing: border-box;
    line-height: 32px;

    text-decoration: none;
    font-size: 31px;
    font-weight: normal;
    text-align: center;
    margin: 0px;
    text-transform: uppercase;
}

#star_infos h2{
    text-transform: uppercase;
    font-size: 16px;
    height: 22px;
    line-height: 22px;

    font-weight: normal;
    text-align: center;
    margin: 0px;

}
#star_infos table{
    position: absolute;
    top: 80px;
    color: white;
    font-size: 11px;
    text-transform: uppercase;
    width: calc(100% - 30px);
    border-spacing: 0px;
    border-collapse: separate;
    box-sizing: border-box;
    margin: 0px;
    padding: 0px;
    display: none;
}

#star_infos table th{
    width: 50%;
    padding: 0px;
    padding-right: 5px;
    text-align: right;
    font-weight: normal;
    color: rgba(255,255,255,0.4);
    line-height: 14px;
}

#star_infos table td{
    padding: 3px;
    padding-left: 5px;
    font-weight: bold;
    text-align: left;
    line-height: 14px;
    background-color: white;
    color: black;
}

#star_infos .content {
    position: absolute;
    top: 80px;
    bottom: 0px;
    right: 0px;
    left: 0px;

}



#star_infos .content .stars{
    position: relative;
    padding-top: 18px;
    padding-bottom: 30px;
}

#star_infos .content .stars:before{
    content: 'STARS';
    display: block;
    position: absolute;
    top: 0px;
    left: 11px;
    color: rgba(255,255,255,0.2);
    font-size: 14px;

}

#star_infos .content .stars .star{
    position: relative;
    text-align: left;
    height: 130px;

}

#star_infos .content .stars .star .sicon{
    position: absolute;
    height: 90px;
    width: 90px;
    left: 20px;
    top: 20px;
}

#star_infos .content .stars .star .sicon span{
    position: absolute;
    display: block;
    border-radius: 2000px;
    background-image: url('stars/star_bckg_b.png');
    background-position: center;
    background-size: 102%;
    background-repeat: no-repeat;


}


#star_infos .content .stars .star .sicon span:after{
    content: '';
    display: block;
    position: absolute;
    top: -20%;
    left: -20%;
    right: -20%;
    bottom: -20%;
    background-image: url(stars/corona.png);
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    z-index: -1;
    opacity: 0.6;
}

#star_infos .content .stars .star .sdata {
    display: block;
    position: absolute;
    left: 140px;
    top: 37px;
    background-color: white;
    padding: 4px 8px;
    right: 0px;
}

#star_infos .content .stars .star .sdata .name,
#star_infos .content .stars .star .sdata .type,
#star_infos .content .stars .star .sdata .radius {

    display: block;
    color: black;
    font-weight: bold;
    font-size: 11px;
    text-transform: uppercase;

    line-height: 15px;
}

#star_infos .content .stars .star .sdata .name {


}





#star_infos .content .planets{
    position: relative;
    padding-top: 18px;
    padding-bottom: 30px;
}

#star_infos .content .planets:before{
    content: 'PLANETS AND MOONS';
    display: block;
    position: absolute;
    top: 0px;
    left: 11px;
    color: rgba(255,255,255,0.2);
    font-size: 20px;

}

#star_infos .content .planets .planet{
    position: absolute;
    text-align: left;
    height: 100px;
    width: 100%;
    cursor: pointer;
}

.sinfo{
    color: white;
    text-align: center;
    padding: 3px 0px;
    display: block;
    /* position: absolute; */
    top: 0px;
    left: 11px;
    color: rgba(255,255,255,1);
    font-size: 18px;

    text-transform: uppercase;
    background-color: white;
    
    color: black;
    margin: 8px 3px;
}

#star_infos .content .planets .planet:hover{
    background-color: white;
    
    color: black;
    z-index: 1000;
}

#star_infos .content .planets .planet:hover{
    background-color: white;
    
    color: black;
    z-index: 1000;
}


#star_infos .content .planets .planet .distline{
    position: absolute;
    top: 38px;
    left: 40px;
    width: 58px;
    bottom: 50%;
    border-bottom: 1px solid rgba(255,255,255,0.3);
    color: rgba(255,255,255,0.3);
    font-size: 8px;
    line-height: 10px;
    padding-left: 3px;
    transition: opacity 0.2s;
    opacity: 1;
    box-sizing: border-box;
    z-index: 100;
}

#star_infos .content .planets .planet:hover .distline{
    transition: opacity 0.6s;
    opacity: 0;
}

#star_infos .content .planets .planet .picon{
    position: absolute;
    height: 100px;
    width: 100px;
    left: 50px;
    top: 0px;
    transition: left 0.2s;
}

#star_infos .content .planets .planet:hover .picon{
    left: 20px;
}

#star_infos .content .planets .planet .picon span{
    position: absolute;
    display: block;
    border-radius: 2000px;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    transition: 0.6s;
    filter: grayscale(100%);
}

#star_infos .content .planets .planet:hover .picon span{
    margin: 0%  !important;

    width: 100%  !important;
    height: 100%  !important;
}

#star_infos .content .planets .planet .picon span:before{
    content: '';
    display: block;
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
    background: radial-gradient(ellipse at center,rgba(0,0,0,0) 0%,rgba(255,255,255,0) 20%,rgba(0,0,0,0.2) 100%);
    z-index: 10;
    border-radius: 100px;
}



#star_infos .content .planets .planet .type,
#star_infos .content .planets .planet .radius,
#star_infos .content .planets .planet .distance {
    display: block;
    position: absolute;
    width: 100px;
    left: 130px;
    font-size: 11px;
    text-transform: uppercase;
    color: rgba(255,255,255,0.5);
    opacity: 0;
    font-weight: bold;
}

#star_infos .content .planets .planet .name {
    display: block;
    position: absolute;
    width: 300px;
    top: 40px;
    left: 165px;
    color: rgba(255,255,255,0.6);
    font-size: 11px;
    text-transform: uppercase;
    transition: top 0.3s;

}

#star_infos .content .planets .planet:hover .name {
    top: 8px;
    left: 130px;
    font-size: 12px;
    color: rgba(0,0,0,1);
    font-weight: bold;
}







#star_infos .content .planets .planet .type {
    opacity: 0;
    top: 22px;

}

#star_infos .content .planets .planet:hover .type {
    transition: opacity 1s;
    opacity: 1;
    color: rgba(0,0,0,1);
}

#star_infos .content .planets .planet .radius {
    opacity: 0;
    top: 34px;

}

#star_infos .content .planets .planet:hover .radius {
    transition: opacity 1s;
    opacity: 1;
    color: rgba(0,0,0,1);
}

#star_infos .content .planets .planet .distance {
    opacity: 0;
    top: 47px;

}

#star_infos .content .planets .planet:hover .distance {
    transition: opacity 1s;
    opacity: 1;
    color: rgba(0,0,0,1);
}


#star_infos .content .planets .planet .moons{
    position: absolute;
    top: 0px;
    bottom: 0px;
    left: 210px;
    right: 0px;
    overflow: hidden;
    display: none;
}

#star_infos .content .planets .planet .moons .moon{
    position: relative;
    width: 25px;
    height: 100%;
    float: left;
}

#star_infos .content .planets .planet .moons .moon .micon{
    position: absolute;
    height: 90px;
    width: 90px;
    left: -33px;
    top: -15px;
}

#star_infos .content .planets .planet .moons .moon .micon span {
    position: absolute;
    display: block;
    border-radius: 2000px;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;

}

#star_infos .content .planets .planet .moons .moon .name,
#star_infos .content .planets .planet .moons .moon .type,
#star_infos .content .planets .planet .moons .moon .radius {
    position: absolute;
    left: 0px;
    right: 0px;
    top: 75px;
    height: 12px;
    font-size: 9px;
    color: rgba(255,255,255,0.5);
    transform: rotate(-90deg);
    white-space: nowrap;
    text-align: right;
    line-height: 12px;
    text-transform: uppercase;
    width: 85px;
    color: black;
    font-weight: bold;
}

#star_infos .content .planets .planet .moons .moon .name {
    left: -36px;

}

#star_infos .content .planets .planet .moons .moon .type {
    left: -25px;
}



#star_infos .content .planets .planet:hover .moons{
    display: block;
}




#star_infos .content .planets .info,
#star_infos .content .stars .info {
    padding: 10px;
    text-transform: uppercase;
    color: rgba(255,255,255,0.6);
    font-size: 11px;
    text-align: center;
}


#star_infos .content .planets .ruler{
    position: absolute;
    top: 70px;
    bottom: 0px;
    left: 15px;
    width: 25px;
    background-image: url('planets/ruler.png');
    background-position: left top;
    background-repeat: repeat-y;
    opacity: 0.4;
    overflow: hidden;
}

#star_infos .content .planets .ruler span{
    position: relative;
    display: block;
    height: 100px;
    width: 25px;
    color: white;
    text-align: left;
    font-size: 9px;
}

#star_infos .content .planets .chz{
    position: absolute;
    left: 0px;
    right: 0px;
    background-color: rgba(255,255,255,0.4);
    opacity: 0.4;
    font-size: 10px;
    text-align: right;
    padding: 0px 4px;
    box-sizing: border-box;
    color: black;
    overflow: hidden;
}

#star_infos .content .planets .ohz{
    position: absolute;
    left: 0px;
    right: 0px;
    background-color: rgba(255,255,255,0.4);

    opacity: 0.4;
    font-size: 10px;
    text-align: right;
    padding: 0px 4px;
    box-sizing: border-box;
    color: black;
    overflow: hidden;
}

#moresectorsdiv {
    position: absolute;
    width: 280px;
    z-index: 10000;
    padding: 0px 0px 0px;
    box-sizing: border-box;
    background-color: rgba(20, 20, 20, 0.95);
}

#moresectorsdiv:before{
    content: '';
    border-top: 10px solid transparent;
    border-bottom: 10px solid transparent;
    border-right: 10px solid rgba(20, 20, 20, 0.95);
    position: absolute;
    top: 0px;
    left: -10px;
}

#moresectorsdiv .sector{
    position: relative;
    font-size: 12px;
    color: white;
    text-transform: uppercase;
    padding: 5px 10px;
    cursor: pointer;
}
#moresectorsdiv .sector:hover {
    background-color: white;
    
    color: black;
}


#moresectorsdiv .sector:hover .name,
#moresectorsdiv .sector:hover .cat,
#moresectorsdiv .sector:hover .type{
    color: black;
    font-weight: bold;
}


#moresectorsdiv .sector .name,
#moresectorsdiv .sector .cat,
#moresectorsdiv .sector .type{
    display: block;
    
}

#moresectorsdiv .sector .name{
    color: rgba(255,255,255,1);
}

#moresectorsdiv .sector .cat,
#moresectorsdiv .sector .type{
    color: rgba(255,255,255,0.5);
}



#star_list{
    position:absolute;
    top: 60px;
    right: -40%;
    z-index: 1;
    bottom: 15px;
    background-color: rgba(0,0,0,0.65);
    padding: 15px;
    display: none;
    width: 350px;
    animation:showBox 150ms linear 1 alternate;

}
#star_list:before {
    content:'';
    display: block;
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    height: 10px;
    border-top: 1px solid white;
    border-left: 1px solid white;
    border-right: 1px solid white;
}
#star_list:after {
    content:'';
    display: block;
    position: absolute;
    bottom: 0px;
    left: 0px;
    right: 0px;
    height: 10px;
    border-bottom: 1px solid white;
    border-left: 1px solid white;
    border-right: 1px solid white;
}






#star_list.visible {
    right: 10px;
    display: block;
}







#star_list h1{

    height: 37px;
    color: rgba(255,255,255,0.9);
    text-shadow: rgb(255,213,182) 0px 0px 4px;
    text-transform: uppercase;
    letter-spacing: 3px;
    box-sizing: border-box;

    line-height: 37px;


    text-decoration: none;
    font-size: 17px;
    font-weight: normal;

    text-align: center;
    margin: 0px;

}



#star_list .content {
    position: absolute;
    top: 70px;
    bottom: 0px;
    right: 0px;
    left: 0px;

}

#star_list .content .stars{
    width: calc(100% - 10px);
    margin-left: 10px;
    font-size: 13px;
    color: white;
    box-sizing: border-box;
    border-spacing: 0px;
    border-collapse: separate;
}


#star_list .content .stars th{
    background-color: white;
    font-weight: bold;
    color: black;
    text-align: left;
    padding-left: 5px;
}

#star_list .content .stars td{
    color: white;
    text-align: left;
    padding-left: 5px;
    cursor: pointer;

}

#star_list .content .stars tr:hover {
    background-color: white;
    
    color: black;
}

#star_list .content .stars tr:hover td {
    color: black;
    font-weight: bold;
}








.mainbanner {
    display: block;
    margin: 5% 50px 0px 50px;


}

.mainbanner h1 {
    font-size: 70px;
    font-weight: normal;
    line-height: 50px;
    text-align: center;

    text-shadow: -3px 0px 0 rgba(255,131,64,.3), 3px 0px 0 rgba(126, 250, 255, .2);
    color: rgba(255,255,255,0.60);
    text-transform: uppercase;
    letter-spacing: 20px;
    padding: 0px;
    margin: 0px;
}


@media (max-width: 520px) {
    .mainbanner {
        display: none;
    }
}







.create_organisation {
    display: block;
    position: relative;
    top: 60px;
    margin: 0px auto 70px;
    max-width: 500px;
    width: 90%;
    padding: 20px 20px 20px 20px;
    background: rgba(0,0,0,0.65);
    color: white;
    text-align: center;
    box-sizing: border-box;
}

.create_organisation:before {
    content:'';
    display: block;
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    height: 10px;
    border-top: 1px solid white;
    border-left: 1px solid white;
    border-right: 1px solid white;
}
.create_organisation:after {
    content:'';
    display: block;
    position: absolute;
    bottom: 0px;
    left: 0px;
    right: 0px;
    height: 10px;
    border-bottom: 1px solid white;
    border-left: 1px solid white;
    border-right: 1px solid white;
}


.create_organisation input,
.create_organisation textarea  {
    width: 100%;
    text-align: left;

}
.create_organisation .text {
    font-size: 15px;
    margin: 0px;
    padding: 10px 0px;
    font-weight: normal;
    color: rgba(255,255,255,0.9);
    background-color: transparent;

}

.create_organisation .text small {
    font-size: 15px;
    color: rgba(255,255,255,0.5);
}

.create_organisation table  {
    width: 100%;
}

.create_organisation table th {
    text-align: right;
    padding-right: 10px;
    color: white;
}

.create_organisation table td {
    width:75%;
}

.create_organisation table th.button,
.create_organisation table td.button {
    padding-top: 20px;
    text-align: right;
}

.create_organisation table td textarea {
    margin: 5px 0px;
}

.create_organisation .notice {
    display: block;
    margin: 5px 0px;
    text-align: justify;
    font-size: 13px;
}

.subbanner {
    position: absolute;
    top: 300px;
    left: 20px;
    right: 20px;
    bottom: 45px;
    box-sizing: border-box;
}

@media (max-width: 520px) {
    .subbanner {
        position: relative;
        width: 90%;
        margin: 10px auto 100px;
        top: auto;
        left: auto;
        right: auto;
        bottom: auto;
    }
}

.orglist {
    display: block;
    position: absolute;
    width: 32%;


    box-sizing: border-box;
    padding: 0px 0px 0px 0px;
    background-color: rgba(0,0,0,0.65);
    box-sizing: border-box;
    bottom: 0px;

}




.orglist .oglist_in {
    position: absolute;
    top: 50px;
    bottom: 0px;
    left: 0px;
    right: 0px;
    overflow-y: hidden;
}

@media (max-width: 520px) {
    .orglist .oglist_in {
        height: auto;
        position: relative;
        top: auto;
        bottom: auto;
        left: auto;
        right: auto;
        overflow-y: auto;
    }
}

.orglist.new_orgs {
    top: 0px;
    left: 0px;
}

.orglist.notices {
    top: 0px;
    right: 0px;
    overflow-y: hidden;
}

.orglist.notices .oglist_in {
    overflow-y: visible;
}

.orglist.top_orgs {
    top: 0px;
    left: calc(50% - 16%);
}

.orglist .page {
    top: -30px;
}


.orglist .plist_in {
    position: absolute;
    min-height: 400px;
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
}


@media (max-width: 520px) {
    .orglist {
        position: relative;
        width: auto;
        margin: 10px auto;
        float: none;
        top: auto;
        left: auto;
        right: auto;
        bottom: auto;
    }
    .orglist.new_orgs {
        top: auto;
        left: auto;
        right: auto;
        bottom: auto;
    }

    .orglist.notices {
        top: auto;
        left: auto;
        right: auto;
        bottom: auto;
    }

    .orglist.top_orgs {
        top: auto;
        left: auto;
        right: auto;
        bottom: auto;
    }


}

.orglist_header {
    display: block;
    left: 0px;
    right: 0px;
    font-size: 30px;
    color: white;
    padding: 20px 0px;
    box-sizing: border-box;
    text-transform: uppercase;

    text-decoration: none;
    text-transform: uppercase;
    font-weight: normal;
    text-align: center;
}


.orglist table {
    position: relative;
    width: 100%;
    color: white;
    box-sizing: border-box;
    border-spacing: 0px;
    border-collapse: separate;
    font-size: 12px;
}

.orglist table th {
    border-bottom: 1px solid rgba(255,255,255,0.5);
    padding-left: 5px;
    text-align: left;
    font-size: 13px;
    font-weight: normal;

}

.orglist table td {
    border-bottom: 1px solid rgba(255, 255, 255, 0.2);
    text-align: left;
    font-size: 12px;
    font-weight: normal;
    padding: 5px;
    cursor: pointer;
}

.orglist table tr:hover td {
    background-color: rgba(255,255,255,0.1);
}

.orglist table tr td.oid {
    color: rgba(255,255,255,0.5);
    font-size: 10px;
    text-align: right;
}
.orglist table tr td.odate {
    color: rgba(255,255,255,0.5);
    font-size: 10px;
    text-align: left;
}





.orglist .plist_in .post .close {
    position: absolute;
    top: 10px;
    right: 10px;
    cursor: pointer;
    opacity: 0.1;
}

.orglist .plist_in .post .close:hover {
    opacity: 0.9;
}


.orglist .plist_in .post .porg:hover {

    text-decoration: underline;
}







.org_plist_in {
    width: 48%;
    box-sizing: border-box;
    float: right;
    position: relative;
}

.org_plist_in .org_news_list {
    position: relative;
}



.org_plist_in .org_news_list .orglist_header {
    top: 0px;
}

.org_news_list .plist_in {
    padding-top: 30px;
}
.org_news_list .plist_in .post,
.orglist .plist_in .post {
    position: relative;
    padding: 0px 0px 10px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.2);
    margin-bottom: 8px;


}


.org_news_list .plist_in .scroll {
    position: relative;
    overflow: visible;
}



.org_plist_in .org_news_list .post {
    border-bottom: 1px solid rgba(0, 150, 175, 0.2);
    text-align: left;
    font-size: 12px;
    font-weight: normal;
    padding: 15px 20px 15px;
    color: white;
    position: relative;
}

.org_plist_in .org_news_list .post .pdate,
.orglist .plist_in .post .pdate {
    display: block;
    position: absolute;
    top: 0px;
    left: 10px;
    font-size: 15px;
    color: rgba(255,255,255,0.5);

}

.org_plist_in .org_news_list .post .porg,
.orglist .plist_in .post .porg {
    font-size: 20px;

    color: rgba(255,255,255,0.4);
    text-shadow: initial;
}

.org_plist_in .org_news_list .post .pauthor,
.orglist .plist_in .post .pauthor {
    font-size: 15px;
    color: rgba(255,255,255,0.4);
    text-shadow: initial;
    cursor: pointer;
}

.org_plist_in .org_news_list .post .porg:hover,
.orglist .plist_in .post .pauthor:hover {

    text-decoration: underline;
}



.org_plist_in .org_news_list .post .ptitle,
.orglist .plist_in .post .ptitle {
    display: block;
    font-size: 24px;
    color: white;
    padding: 20px 0px 0px 10px;

    text-transform: uppercase;
}

.org_plist_in .org_news_list .post .ptext,
.orglist .plist_in .post .ptext {
    display: block;
    font-size: 14px;
    color: white;
    padding: 5px 40px 0px 30px;

}


@media (max-width: 520px) {
    .org_plist_in {
        width: auto;
        box-sizing: border-box;
        float: none;
        position: relative;
    }
}

.newpost table {
    margin: 5px auto;
    width: 90%;
}

.newpost table td {
    padding: 5px;
}

.newpost input{
    text-align: left;
    text-shadow: initial;
    width: 100%;
}

.newpost textarea{
    text-align: left;
    text-shadow: initial;
}
.newpostbutton {
    padding: 0px 10px 10px;
    text-align: right;
}

.org_plist_in .org_news_list .post .close {
    position: absolute;
    top: 0px;
    right: 0px;
    cursor: pointer;
    opacity: 0.1;
}

.org_plist_in .org_news_list .post .close:hover {
    opacity: 0.9;
}

.vision {
    color: white;
    width: 80%;
    max-width: 1100px;
    margin: 50px auto 150px;
    box-sizing: border-box;


}

.vision.left {

}

.vision.right {

}

.vision .hit {
    min-height: 269px;
    background-size: cover;
    background-position: top;
    margin: 15px 0px;
    box-sizing: border-box;
}

.vision .hit h1 {
    color: rgba(255,255,255,.9);
    text-align: center;
    font-size: 39px;

    font-weight: normal;
    line-height: 41px;
    text-shadow: rgb(163,188,255) 0px 0px 6px;
    padding: 0px;
    width: 70%;
    margin: 0px auto;
    min-height: 125px;
    position: relative;
    display: block;
}

.vision .hit h1 span {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 0px;
    right: 0px;
    text-transform: uppercase;
}
.vision .hit .subtitle {
    font-size: 21px;

    text-transform: uppercase;
    text-align: center;
    display: block;
    letter-spacing: 0px;
    padding: 3px 0px;
    line-height: 23px;
    min-height: 70px;
    font-weight: normal;
    color: rgba(255,255,255,.8);
    text-shadow: rgba(163,188,255,.95) 0px 0px 3px;
}

.vision .hit .more {
    position: relative;
    display: block;

    transition: 0.2s linear;
    overflow: hidden;

    box-sizing: border-box;
    text-align: center;
}

.about {
    color: white;
    width: 80%;
    max-width: 1100px;
    margin: 15px auto 0px;
    box-sizing: border-box;
    position: relative;
    min-height: 220px;
    padding: 20px;
    background-color: rgba(0,0,0,0.65);
}

.about:before {
    content: '';
    display: block;
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    height: 10px;
    border-top: 1px solid white;
    border-left: 1px solid white;
    border-right: 1px solid white;
    z-index: 1000;
}

.about:after {
    content: '';
    display: block;
    position: absolute;
    bottom: 0px;
    left: 0px;
    right: 0px;
    height: 10px;
    border-bottom: 1px solid white;
    border-left: 1px solid white;
    border-right: 1px solid white;
}



.about .image {
    width: 400px;
    position: absolute;
    box-sizing: border-box;
    background-image: url(/img/img_about_spacestation.jpg);
    background-size: cover;
    background-position: center;
    top: 0px;
    left: 0px;
    bottom: 0px;
}

.about .text {
    color: white;
    width: calc(100% - 400px - 30px);
    box-sizing: border-box;
    margin-left: 430px;
}

.about .text h1 {
    display: block;
    color: white;
    text-transform: uppercase;
    color: white;
    box-sizing: border-box;
    text-transform: uppercase;
    text-shadow: 0px 0px 3px rgba(255,255,255,0.7);
    text-decoration: none;
    text-align: left;
    font-size: 35px;

    font-weight: normal;
}

.about .text p {
    display: block;
    color: white;
    padding: 10px 0px;
    font-size: 14px;

}

.vision .box {
    position: relative;
    display: block;
    width: calc(33.3% - 10px);
    float: left;
    box-sizing: border-box;
    height: 200px;
    overflow: hidden;
    cursor: pointer;
    margin: 5px;
}

.vision .box:before {
    content: '';
    display: block;
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    height: 10px;
    border-top: 1px solid white;
    border-left: 1px solid white;
    border-right: 1px solid white;
    z-index: 1000;
}

.vision .box:after {
    content: '';
    display: block;
    position: absolute;
    bottom: 0px;
    left: 0px;
    right: 0px;
    height: 10px;
    border-bottom: 1px solid white;
    border-left: 1px solid white;
    border-right: 1px solid white;
}

.vision .box .img {
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
    background-size: cover;
    background-position: center;
}

.vision .box .upslider {
    position: absolute;
    top: 100%;
    left: 0px;
    width: 100%;
    height: 100%;
    transition: 0.1s linear;
    background-color: rgba(0,0,0,0.8);
}



.vision .box:hover .img {
    right: 0px;
    left: 0px;
    bottom: 0px;
    top: 0px;
    position: absolute;
    background-size: cover;
    background-position: center;
    animation: crt 5000ms linear infinite;
    z-index: -1;
    filter:blur(2px) grayscale(40%) brightness(50%) contrast(110%);
}




.vision .box:hover .upslider {
    top: 0px;
}

.vision .box h2 {
    padding: 0px;
    margin: 0px;
    text-transform: uppercase;
    position: absolute;
    top: 20px;
    left: 20px;
    right: 20px;
    text-align: left;
    color: rgba(255,255,255,.9);
    font-size: 30px;

    font-weight: normal;
    line-height: 24px;
}



.vision .box p {
    padding: 0px;
    margin: 0px;

    position: absolute;
    top: 75px;
    left: 20px;
    right: 20px;
    text-align: left;

    font-size: 14px;
}


@media (max-width: 950px) {
    .about {
        width: 90%;
    }
    .about .image {
        width: auto;
        position: relative;
        box-sizing: border-box;
        background-image: url(/img/img_about_spacestation.jpg);
        background-size: cover;
        background-position: center;
        top: auto;
        left: auto;
        right: auto;
        bottom: auto;
        height: 300px;
    }

    .about .text {
        width: auto;
        position: relative;
        box-sizing: border-box;
        margin-left: auto;
        margin-right: auto;
        top: auto;
        left: auto;
        bottom: auto;

    }
    .vision {
        width: 90%;
        margin: 10px auto;
    }
    .vision .box {

        display: block;
        width: auto;
        float: none;
        box-sizing: border-box;
        height: 200px;
        overflow: hidden;
        margin: 10px auto;
    }
}








.story {
    color: white;

    font-size: 13px;
    margin: 0px auto;

}

.story.left {
    float: left;
    margin: 0px 1%  0px 9%;
}

.story.right {
    float: right;
    margin: 0px 9% 0px 1%;
}

.story .hit {

    background-size: cover;
    background-position: top;
    margin: 0px;
    box-sizing: border-box;
    background-attachment: fixed;
}

.story .hit,
.story .hit .md-box {
    min-height: 450px;
}
.story .hit.last,
.story .hit.last .md-box {
    min-height: 950px;

}

.story .hit .md-box {
    padding: 0px;
    background: rgba(0, 0, 0, 0.5);
    position: relative;
    height: 100%;
    text-align: center;
    padding-bottom: 40px;
    box-sizing: border-box;
}

.story .hit .md-box.first {
    background: rgba(0, 0, 0, 0);
}



.story .hit h1 {
    display: block;
    width: 50%;
    min-width: 400px;
    text-align: center;
    font-size: 39px;

    font-weight: normal;
    line-height: 41px;
    text-shadow: 0px 0px 10px rgb(0,255,255);
    padding: 0px;
    margin: 0px auto;
    min-height: 125px;
    position: relative;
}

.story .hit h1 span {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 0px;
    right: 0px;
    letter-spacing: 5px;
}
.story .hit .subtitle,
.story .hit .subtitle2,
.story .hit .subtitle3 {
    display: block;
    width: 50%;
    min-width: 400px;
    margin: 0px auto;
    padding: 8px 0px;

    text-align: justify;
    text-shadow: 0px 0px 10px rgb(0,255,255)
}


.story .hit .subtitle {
    font-size: 16px;
    letter-spacing: 1px;
    line-height: 23px;
}

.story .hit .subtitle2 {
    font-size: 14px;
    line-height: 23px;
}

.story .hit .subtitle3 {
    font-size: 12px;
    line-height: 23px;
}

.story .hit .more {
    position: relative;
    display: block;
    height: 30px;
    transition: 0.2s linear;
    overflow: hidden;
    padding: 30px 10px 0px;
    box-sizing: border-box;
    text-align: center;
}

.story .hit .more:before {
    content: "";
    display: block;
    position: absolute;
    top: 0px;
    right: 0px;
    left: 0px;
    height: 30px;
    background: radial-gradient(ellipse at center, rgba(0, 255, 255, 0.1) 0%, rgba(0, 0, 0, 0) 70%, rgba(0, 0, 0, 0) 100%);

    filter: blur(2px);
    cursor: pointer;
}
.story .hit .more:after {
    content: "VIEW DETAILS";
    display: block;
    position: absolute;
    top: 0px;
    right: 0px;
    left: 0px;
    height: 30px;
    font-size: 10px;
    color: rgba(0,255,255,0.4);
    text-align: center;
    text-shadow: 0px 0px 3px rgba(0,255,255,0.5);
    cursor: pointer;
    line-height: 30px;
    /* font-weight: bold; */
    letter-spacing: 3px;
}


.story .hit .more:hover {
    height: 330px;
    background: linear-gradient(to bottom,rgba(0,0,0,0) 0%,rgba(0, 50, 75, 0.9) 50%,rgba(0, 50, 75, 0) 100%);
}

.story .hit .more.noimg:hover {
    height: 200px;
    background: linear-gradient(to bottom,rgba(0,0,0,0) 0%,rgba(0, 50, 75, 0.9) 50%,rgba(0, 50, 75, 0) 100%);
}

.story .hit .more > * {

}

.story .hit .more:hover > * {


}

.story .hit .more:hover:before,
.story .hit .more:hover:after {
    display: none;
}


.block-parallax-1,
.block-parallax-2,
.block-parallax-3 {
    overflow: hidden;
    position: relative;
}
.parallax-bg {
    background-attachment: fixed;
    background-position: 0px 0px;
    background-repeat: repeat;
    height: 100%;
    position: absolute;
    width: 100%;
    min-width: 1170px;
    background-size: cover;
}


.block-parallax-1 .parallax-bg {
    background-image: url('/img/aa_uni.jpg');
}

.block-parallax-2 .parallax-bg {
    background-image: url('/img/stratospheric_colony_by_phade01-d7uvz6m.jpg');
}

.block-parallax-3 .parallax-bg {
    background-image: url('/img/aa_ind.png');
}

.invite_dom_form {
    display: block;
    position: fixed;
    top: 50px;
    width: 400px;
    left: calc(50% - 200px);
    padding: 55px 0px 25px 0px;
    border: 1px solid rgba(255, 255, 255, 0.2);
    background: rgba(0, 50, 75, 1);
    box-sizing: border-box;
    z-index: 1000;
}

.invite_dom_form .input_div {
    display: block;
    position: relative;
    padding: 10px 20px;
}

.invite_dom_form .input_div input {
    width: 100%;
}

.invite_dom_form .input_div_submit {
    display: block;
    position: relative;
    padding: 10px 20px;
    text-align: right;
}

.invite_dom_form .input_div_text {
    display: block;
    position: relative;
    padding: 10px 20px;
    font-size: 17px;
    color: white;
    text-transform: uppercase;

    text-decoration: none;
    font-weight: normal;
    text-align: left;
}

.invite_dom_form .subtitle {
    position: relative;
    padding: 10px 20px 0px;
    text-align: center;
    font-weight: normal;
    text-transform: uppercase;
    color: rgb(232,250,17);
    display: block;
    padding-top: 8px;
    text-shadow: none;
    letter-spacing: 0px;
    font-size: 20px;
}

.galleryslider {
    position: absolute;
    top: 45px;
    bottom: 0px;
    left: 0px;
    right: 0px;
}
.galleryslider .view {
    position: absolute;
    bottom: 195px;
    width: 80%;
    top: 0px;
    left: 10%;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;


}

.galleryslider .reel {
    position: absolute;
    bottom: 0px;
    left: 0px;
    right: 0px;
    height: 140px;
    bottom: 30px;

}

.galleryslider .reel .ireel {
    width: 80%;
    margin: 5px auto;


}

.galleryslider .reel .ireel .owl-next{
    position: absolute;
    top: calc(50% - 25px);
    right: -55px;
    height: 50px;
    width: 50px;
    background:url('ico/arrow-24-32.png') center no-repeat;

}

.galleryslider .reel .ireel .owl-prev{
    position: absolute;
    top: calc(50% - 25px);
    left: -55px;
    height: 50px;
    width: 50px;
    background:url('ico/arrow-88-32.png') center no-repeat;
}

.galleryslider .reel .ireel .owl-prev.disabled,
.galleryslider .reel .ireel .owl-next.disabled
{
    opacity: .1;
}

.galleryslider .reel .ireel .item {
    display:block;
    position: relative;
    height: 80px;
    width: 107px;
    border: 1px solid white;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    cursor: pointer;
    margin: 0px 10px 0px 0px;
}

.galleryslider .reel .ireel .item:hover{
    animation: blink 100ms linear 2;
}



.line_buttons
{
    position: absolute;
    top: 0px;
    right: 10%;
    left: 10%;
    text-align: left;
    border-spacing: 0px;
    box-sizing: border-box;
    padding: 0px;
    height: 35px;

}

.line_buttons a{
    position: relative;
    display: block;
    float: left;
    height: 27px;
    color: rgba(255,255,255,0.5);
    text-align: center;
    border-spacing: 0px;
    box-sizing: border-box;
    padding: 0px 10px;
    line-height: 27px;
    text-transform: uppercase;
    font-size: 12px;
    font-weight: normal;
    cursor: pointer;
    border: 1px solid rgba(255,255,255,0);
}

.line_buttons a:hover{
    border:1px solid white;
    color: rgba(255,255,255,1);

    animation:blink 100ms linear 2 alternate;
}

.line_buttons a.active:hover{
    border:1px solid rgba(255,255,255,0);
    color: white;

    animation:none;
}

.line_buttons a.active{

    color: white;

    animation:highlited 500ms linear infinite;
}



.org_help {
    display: block;
    position: absolute;
    left: calc(50% - 16%);
    top: 220px;
    width: 32%;
    padding: 15px 20px;
    background: rgba(0,0,0,0.65);
    color: white;
    text-align: center;
    box-sizing: border-box;
}

.org_help a {
    color: rgb(238,233,119);

    text-decoration: none;
    text-transform: uppercase;
    font-size: 25px;
    animation: highlited 500ms linear infinite;
    text-shadow: rgb(255,213,182) 0px 0px 4px;
}

.org_help:before {
    content:'';
    display: block;
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    height: 10px;
    border-top: 1px solid white;
    border-left: 1px solid white;
    border-right: 1px solid white;
}
.org_help:after {
    content:'';
    display: block;
    position: absolute;
    bottom: 0px;
    left: 0px;
    right: 0px;
    height: 10px;
    border-bottom: 1px solid white;
    border-left: 1px solid white;
    border-right: 1px solid white;
}




.owl-controls {
    text-align: center;

}
.owl-controls .owl-nav [class*=owl-] {
    color: #fff;
    font-size: 14px;
    margin: 5px;
    padding: 4px 7px;
    background: rgba(255,255,255,0.3);
    display: inline-block;
    cursor: pointer;

}
.owl-controls .owl-nav [class*=owl-]:hover {
    background: #869791;
    color: #fff;
    text-decoration: none
}
.owl-controls .owl-nav .disabled {
    opacity: .5;
    cursor: default
}
.owl-dots .owl-dot {
    display: inline-block;
}
.owl-dots .owl-dot span {
    width: 5px;
    height: 20px;
    margin: 5px 4px;
    background: rgba(255,255,255,0.3);
    display: block;
}
.owl-dots .owl-dot.active span {
    background: rgba(255,255,255,1);
    box-shadow: inset 0px 0px 25px rgba(255,255,255,1), 0px 0px 25px rgba(255,255,255,1);
    animation:highlited 500ms linear infinite;
}

.owl-dots .owl-dot:hover span {
    background: rgba(255,255,255,1);
    animation:blink 100ms linear 2 alternate;

}


.newpost {
    display: block;
    position: absolute;
    top: 50px;
    width: 400px;
    left: calc(50% - 200px);
    padding: 55px 0px 25px 0px;
    border: 1px solid rgba(255, 255, 255, 0.2);
    background: rgba(0, 50, 75, 1);
    box-sizing: border-box;
    z-index: 1000;
}

.newpost .input_div {
    display: block;
    position: relative;
    padding: 10px 20px;
}

.newpost .input_div input {
    width: 100%;
}

.newpost .input_div_submit {
    display: block;
    position: relative;
    padding: 10px 20px;
    text-align: right;
}

.newpost .input_div_text {
    display: block;
    position: relative;
    padding: 10px 20px;
    text-align: left;
    color: white;
}

.newpost .subtitle {
    display: block;
    position: relative;
    padding: 10px 20px 0px;
    text-align: left;
    color: gold;
    font-weight: bold;
}



.rewardsbox {

}


.rewardsbox .rl_name {
    display: block;
    font-size: 50px;
    color: rgb(4,193,193);
    padding: 10px 0px 10px;
    box-sizing: border-box;
    text-transform: uppercase;

    text-decoration: none;
    font-weight: normal;
    text-align: center;
    padding: 30px 0px;
}

.rewardsbox .rl_title {
    position: relative;

    padding: 20px 5px 3px;
    box-sizing: border-box;
    text-decoration: none;
    text-align: left;
    font-size: 17px;
    color: rgba(255,255,255,0.9);
    text-shadow: rgb(255,213,182) 0px 0px 4px;
    text-transform: uppercase;
    letter-spacing: 3px;
}



.rewardsbox .rl_rank {
    position: relative;
    display: block;
    margin: 0px auto 0px;
    background-size: 80px;
    background-repeat: no-repeat;
    background-position: bottom;

    text-align: center;
    padding: 0px 0px 80px;
    font-size: 20px;
    color: rgb(238,233,119);
    text-transform: uppercase;
}

.rewardsbox .rl_rewards{
    line-height: 21px;
    font-weight: normal;
    text-align: center;
    font-size: 14px;
    color: white;
    padding: 5px 0px;
}

.rewardsbox .rl_rewards .rl_reward{
    position: relative;
    display: inline-block;
    width: 80px;
    height: 80px;
    margin: 0px 5px;
    background-size: 50px;
    background-repeat: no-repeat;
    background-position: center;
    cursor: pointer;
}

.rewardsbox .rl_rewards.next .rl_reward{
    position: relative;
    display: inline-block;
    width: 60px;
    height: 60px;
    margin: 0px 5px;
    background-size: 50px;
    background-repeat: no-repeat;
    background-position: center;
    cursor: pointer;
}


.rewardsbox .rl_rewards .rl_reward:before{
    content: "";
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
    z-index: -1;
}

.rewardsbox .lu_title.next {
    position: relative;
    display: block;
    font-size: 30px;
    color: rgb(252,254,84);
    text-transform: uppercase;

    text-align: center;
}

.rewardsbox .lu_name.next {
    position: relative;
    display: block;
    margin: 0px auto 0px;
    background-size: 90px;
    background-repeat: no-repeat;
    background-position: bottom;

    text-align: center;
    padding: 0px 0px 90px;
    font-size: 20px;
    color: rgb(238,233,119);
    text-transform: uppercase;
}


.quest {
    display: block;
    position: relative;
    margin: 10px auto;
    max-width: 600px;
    width: 90%;
    padding: 20px 20px 20px 20px;
    background: rgba(0,0,0,0.65);
    text-align: center;
    box-sizing: border-box;
    padding: 20px 20px 20px 20px;
    color: rgb(232,250,17);

    text-decoration: none;
    text-transform: uppercase;
    font-size: 20px;

    z-index: 999;
}

.quest:before {
    content: '';
    display: block;
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    height: 10px;
    border-top: 1px solid white;
    border-left: 1px solid white;
    border-right: 1px solid white;
}

.quest:after {
    content: '';
    display: block;
    position: absolute;
    bottom: 0px;
    left: 0px;
    right: 0px;
    height: 10px;
    border-bottom: 1px solid white;
    border-left: 1px solid white;
    border-right: 1px solid white;
}

.quest a {
    color: rgb(238,233,119);
    text-decoration: underline;
}




.rewardsbox .lu_rewards{
    line-height: 21px;
    font-weight: normal;
    text-align: center;
    font-size: 14px;
    color: white;
    padding: 5px 0px;
    margin: 10px auto 0px;
}

.rewardsbox .lu_rewards .lu_reward{
    position: relative;
    display: inline-block;
    width: 80px;
    height: 70px;
    margin: 0px 5px;
    background-size: 60px;
    background-repeat: no-repeat;
    background-position: center;
    cursor: pointer;
}

.rewardsbox .lu_rewards.next .lu_reward{
    position: relative;
    display: inline-block;
    width: 45px;
    height: 45px;
    margin: 0px 5px 10px;
    background-size: 35px;
    background-repeat: no-repeat;
    background-position: center;
    cursor: pointer;
}


.rewardsbox .lu_rewards .lu_reward:before{
    content: "";
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
    z-index: -1;
}









#registerscreen {
    position: absolute;
    top: 88px;
    left: calc(50% - 187.5px);
    height: 690px;
    min-height: 600px;
    background-color: rgba(0,0,0,0.65);
    width: 375px;

}
#registerscreen:before {
    content:'';
    display: block;
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    height: 10px;
    border-top: 1px solid white;
    border-left: 1px solid white;
    border-right: 1px solid white;
}
#registerscreen:after {
    content:'';
    display: block;
    position: absolute;
    bottom: 0px;
    left: 0px;
    right: 0px;
    height: 10px;
    border-bottom: 1px solid white;
    border-left: 1px solid white;
    border-right: 1px solid white;
}



#registerscreen #hero_locker {
    position: relative;
    margin-top: 302px;
    line-height: 23px;
    background: linear-gradient(to right,rgba(103,223,237,0.0) 0%,rgba(103,223,237,0.4) 40%,rgba(103,223,237,0.4) 60%,rgba(103,223,237,0.0) 100%);
    height: 56px;
    font-weight: normal;
    text-align: center;
    font-size: 45px;
    color: white;
    padding: 0px;
    text-transform: none;
    text-shadow: 0px 0px 10px rgb(0,255,255);

    z-index: 1000000;
    padding: 12px 0px;
    text-transform: uppercase;
    animation: crt 10000ms linear infinite;
}


#registerscreen .race_title {
    position: relative;
    margin-top: 385px;
    line-height: 16px;
    height: 40px;
    font-weight: normal;
    text-align: center;
    font-size: 40px;
    color: white;
    padding: 0px;
    text-transform: none;

    z-index: 1000000;
    padding: 12px 0px;
    text-transform: uppercase;
    white-space: nowrap;
    /* background-image: linear-gradient(45deg, rgba(255,255,255,0.5) 25%, transparent 25%, transparent 75%, rgba(255,255,255,0.5) 75%, rgba(255,255,255,0.5)), linear-gradient(45deg, rgba(255,255,255,0.5) 25%, transparent 25%, transparent 75%, rgba(255,255,255,0.5) 75%, rgba(255,255,255,0.5)); */
    /* background-size: 2px 2px; */
    /* background-position: 0 0, 0px 0px; */
    color: black;
    background: white;
    overflow: hidden;
}

#registerscreen.locked .race_title {
    animation: blink 100ms linear 2;
}


#registerscreen .race_title span{
    display: block;
    font-size: 20px;
    padding-top: 10px;
}

#registerscreen .races{
    position: absolute;
    top: 65px;
    text-align: center;
}



#registerscreen .races .race{
    position: relative;
    width: 314px;
    height: 320px;
    margin: 0px auto 0px;
    background-position: center bottom;
    background-repeat: no-repeat;
    background-size: cover;
    cursor: pointer;
    background-blend-mode: overlay;
    background-color: rgb(92, 83, 100);
    animation: crt 10000ms linear infinite;
    filter: grayscale(100%) brightness(130%) contrast(110%);


}
/*
#registerscreen .races .race:before{
   content: '';
   position: absolute;
   top: 0px;
   left: 0px;
   right: 0px;
   bottom: 0px;
   background-image: linear-gradient(to top, rgba(255,255,255,0.01) 25%, transparent 25%, transparent 75%, rgba(255,255,255,0.015) 75%, rgba(1,255,255,0.5)), linear-gradient(to top, rgba(255,255,255,0.5) 25%, transparent 25%, transparent 75%, rgba(255,255,255,0.5) 75%, rgba(255,255,255,0.5)); 
   background-size: 10px 10px;
   background-position: 0 0, 0px 0px;

}        */
#registerscreen.locked .races .race{
    filter: grayscale(100%) brightness(160%);
    background-blend-mode: hard-light;
}

#registerscreen .owl-next{
    position: absolute;
    top:328px;
    right: 15px;
    height: 50px;
    width: 50px;
    background:url('ico/arrow-24-32.png') center no-repeat;

}

#registerscreen .owl-prev{
    position: absolute;
    top: 328px;
    left: 15px;
    height: 50px;
    width: 50px;
    background:url('ico/arrow-88-32.png') center no-repeat;
}

#registerscreen .owl-prev.disabled,
#registerscreen .owl-next.disabled
{
    opacity: .1;
}


#registerscreen #perks{
    margin: 18px 0px 15px;
    line-height: 21px;
    font-weight: normal;
    text-align: center;
    font-size: 14px;
    color: white;
    padding: 0px;
    z-index: 1000000;
}



.perk{
    position: relative;
    display: inline-block;
    width: 44px;
    height: 44px;
    margin: 0px 5px;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    cursor: pointer;
    background-color: black;
    border: 2px solid black;
    box-sizing: border-box;
}

.perk:before{
    content: "";
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
    z-index: -1;
}


.perk.selected{
    animation: highlited 500ms linear infinite;
    filter: grayscale(100%);
    border: 2px solid rgb(230,220,47);
}

div.descr_perk{
    display:inline;
    outline:none;
    position: relative;
}

div.descr_perk span.upper{
    z-index: 10000;
    visibility: hidden;
    padding: 10px 10px 18px;
    position: absolute;
    background-color: rgba(50,50,50,1);
    width: 200px;
    min-height: 90px;
    top: 30px;
    left: calc(50% - 100px);
    box-sizing: border-box;
    cursor: pointer;


}
div.descr_perk:hover span.upper{
    visibility:visible;
    animation:blink 100ms linear 2 alternate;
}
div.descr_perk span.upper .perk_icon{
    height: 80px;
    width: 80px;
    position: absolute;
    top: -65px;
    left: calc(50% - 40px);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    background-color: rgba(50,50,50,1);
    border: 10px solid rgba(50,50,50,1);
    box-sizing: border-box;
}

div.descr_perk span.upper .perk_title{
    display: block;
    margin-top: 5px;
    color: rgb(4,193,193);
    padding: 5px 0px 0px;
    display: block;
    text-transform: uppercase;
    font-size: 25px;

}

div.descr_perk span.upper .perk_numbers{
    color: rgb(238,233,119);
    display: block;
    text-transform: uppercase;
    font-size: 11px;
    line-height: 13px;
    padding: 7px 0px 11px;
}


div.descr_perk span.upper .perk_more{
    position: relative;
    text-align: center;
    border: 0px;
    background-color: white;
    cursor: pointer;
    text-decoration: none;
    color: black;
    padding: 6px 20px;
    font-size: 20px;

    font-weight: normal;
    line-height: 30px;
    text-transform: none;
    height: 30px;
    box-sizing: border-box;
}


div.descr_perk span.upper .perk_more::first-letter {
    color: rgb(4,193,193);
}

div.descr_perk span.upper .perk_desc {
    color: rgba(255,255,255,0.9);
    display: block;
    font-size: 11px;
    text-transform: uppercase;
    line-height: 15px;
}

div.descrtooltip{
    display:inline;
    outline:none;
    position: relative;
}
div.descrtooltip strong{
    line-height:16px;
}
div.descrtooltip:hover{
    text-decoration:none;
}
div.descrtooltip span.upper{
    z-index: 10000;
    visibility: hidden;
    padding: 10px 10px 18px;
    position: absolute;
    background-color: rgba(50,50,50,1);
    width: 220px;
    min-height: 90px;
    top: 10px;
    left: calc(50% - 110px);
    box-sizing: border-box;
    text-align: center;
}

div.descrtooltip span.upper:after{
    content: '';
    position: absolute;
    display: block;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-bottom: 10px solid rgba(50,50,50,1);
    border-top: none;
    width: 0px;
    top: -22px;
    left: calc(50% - 10px);
    height: 12px;
}
div.descrtooltip:hover span.upper{
    visibility:visible;
    animation:blink 100ms linear 2 alternate;
}
div.descrtooltip span.upper a{
    color:rgb(238,233,119);
    text-decoration:underline;
    max-width: 250px;
}
div.descrtooltip span.upper span.ab_title   {
    color: rgb(4,193,193);
    padding: 5px 0px 0px;
    display: block;
    text-transform: uppercase;
    font-size: 25px;

}
div.descrtooltip span.upper span.ab_numbers {
    color: rgb(238,233,119);
    display: block;
    text-transform: uppercase;
    font-size: 11px;
    line-height: 13px;
    padding: 7px 0px 11px;

}
div.descrtooltip span.upper span.ab_desc    {
    color: rgba(255,255,255,0.9);
    display: block;
    font-size: 11px;
    text-transform: uppercase;
    line-height: 15px;
}
#registerscreen #description{
    text-align: center;
    font-size: 16px;
    color: white;
    width: 600px;
    margin: 15px auto;
    z-index: 9999999;
}

#registerscreen #submit{
    width: 300px;
    text-align: center;
    margin: 15px auto;
    z-index: 9999999;
}

#registerscreen #submit .inf_race{
    animation: highlited 500ms linear infinite;
    font-weight: normal;
    text-align: center;
    color: rgb(0,255,255);
    display: block;
    font-size: 20px;

    font-size: 17px;
    color: rgba(255,255,255,0.9);
    text-shadow: rgb(255,213,182) 0px 0px 4px;
    text-transform: uppercase;
    letter-spacing: 3px;
}

#registerscreen #submit .submit_race{
    animation:highlited 500ms linear infinite;
    position: relative;
    text-align: center;
    border: 0px;
    background-color: white;
    cursor: pointer;
    text-decoration: none;
    color: black;
    padding: 0px 10px;
    font-size: 20px;

    font-weight: normal;
    line-height: 30px;
    text-transform: none;
    height: 30px;
    box-sizing: border-box;
}

#registerscreen #submit .submit_race::first-letter {
    color: rgb(4,193,193);
}

#registerscreen #submit .submit_race:hover{
    color: black;
    background-color: rgb(232,250,17);
    animation:none;
}

.heroesblock {
    overflow:hidden;
}



.field.heroesf .heroes .owl-stage-outer {
    overflow:visible !important;
}

.heroes .hero_block {
    height: 238px;
    position: relative;
    width: 200px;
    margin: 10px;
}

.heroes .hero_block.empty {
    background: url(stations_plus.png) center no-repeat;
    cursor: pointer;



}

.heroes .hero_block.empty .inf {
    top: 111px;
    display: block;
    position: absolute;
    left: 0px;
    right: 0px;
    color: white;
    opacity: .5;
    text-transform: uppercase;
    text-align: center;
    font-weight: normal;

    text-decoration: none;
    font-size: 32px;
    line-height: 25px;
}

.heroes .hero_block.empty:hover .inf {

    opacity: 1;

}





.heroes .hero_block .havatar {
    position: absolute;
    top: 40px;
    left: calc(50% - 75px);
    width: 150px;
    height: 150px;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: bottom;
    background-blend-mode: overlay;
    background-color: rgb(70, 70, 75);
    filter: grayscale(100%) brightness(110%) contrast(135%);
    border: 0px solid white;
    box-sizing: border-box;
}

.heroes .hero_block .hperks {
    position: absolute;
    top: 0px;
    left: calc(50% - 21.5px);
}

.heroes .hero_block .hperks .perk{
    display: inline-block;
    width: 43px;
    height: 43px;
    margin: 0px auto;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    cursor: pointer;
    background-color: white;
    position: relative;
    box-sizing: border-box;
    border: 2px solid white;
}


.heroes .hero_block .hperks .perk:hover{
    animation: blink 100ms linear 2;
}



.heroes .hero_block .hperks .perk:after{
    content: '';
    position: absolute;
    display: block;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-top: 10px solid white;
    border-bottom: none;
    width: 0px;
    bottom: -22px;
    left: calc(50% - 10px);
    height: 12px;
}

.heroes .hero_block .hname {
    position: absolute;
    bottom: 0px;
    left: calc(50% - 100px);
    width: 200px;
    height: 45px;
    line-height: 10px;
    text-align: center;
    font-size: 25px;

    text-transform: uppercase;
    padding: 10px 0px;
    color: black;
    background-color: rgb(232,250,17);
    box-sizing: border-box;

}

.heroes .hero_block .hname:after {
    content: '';
    position: absolute;
    display: block;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-bottom: 10px solid rgb(232,250,17);
    border-top: none;
    width: 0px;
    top: -22px;
    left: calc(50% - 10px);
    height: 12px;
}

.heroes .hero_block .hname span {
    display: block;
    font-size: 20px;
    line-height: 26px;
    height: 26px;
    font-weight: normal;
}


.heroes .owl-dots .owl-dot.active span {
    animation: none !important;
}



.switcher {
    display: inline-block;
    position: relative;
    text-align: center;
    background-color: rgba(0,0,0,0);
    cursor: pointer;
    height: 28px;
    min-width: 28px;
    opacity: 0.6;
    background-size: 24px;
    background-repeat: no-repeat;
    background-position: 0px center;
    line-height: 28px;
    padding-left: 29px;
    font-size: 10px;
    text-transform: uppercase;
    background-image: url(/img/ico/add-128.png);
    color: white;
    margin: 10px 5px;
}

.switcher:hover {
    opacity: 1;
}

.switcher.neworg {
    animation:highlited 500ms linear infinite;
    background-image: url(/img/ico/add-128.png);
}

.switcher.myorg {
    background-image: url(/img/ico/corp-128.png);
}


.subtitle {
    color: white;
    position: relative;
    padding: 15px 5px 0px;

    font-size: 20px;
    padding: 3px 5px 3px 0px;
    box-sizing: border-box;
    text-decoration: none;
    text-align: left;
    font-size: 17px;
    color: rgba(255,255,255,0.9);
    text-shadow: rgb(255,213,182) 0px 0px 4px;
    text-transform: uppercase;
    letter-spacing: 3px;
}

.subtitle button {
    position: absolute;
    top: 0px;
    right: 0px;
    animation:highlited 500ms linear infinite;
}


.levelup {
    display: block;
    position: relative;
    margin: 30px auto 0px;
    width: 500px;
    padding: 20px 20px 20px 20px;
    background: rgba(0,0,0,0.65);
    color: white;
    text-align: center;
    box-sizing: border-box;
}

.levelup:before {
    content:'';
    display: block;
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    height: 10px;
    border-top: 1px solid white;
    border-left: 1px solid white;
    border-right: 1px solid white;
}
.levelup:after {
    content:'';
    display: block;
    position: absolute;
    bottom: 0px;
    left: 0px;
    right: 0px;
    height: 10px;
    border-bottom: 1px solid white;
    border-left: 1px solid white;
    border-right: 1px solid white;
}



.levelup .lu_title {
    display: block;
    left: 0px;
    right: 0px;
    font-size: 30px;
    color: rgb(252,254,84);
    padding: 10px 0px;
    box-sizing: border-box;
    text-transform: uppercase;

    text-decoration: none;
    text-transform: uppercase;
    font-weight: normal;
    text-align: center;

}

.levelup .lu_title.next {

    font-size: 20px;

}


.levelup .lu_name {
    font-size: 20px;
    color: rgba(255,255,255,1);
    text-transform: uppercase;

}



.levelup .lu_ico {
    position: relative;
    display: inline-block;
    width: 80px;
    height: 80px;
    margin: 12px auto 0px;
    background-size: 80px;
    background-repeat: no-repeat;
    background-position: center;
}

.levelup .lu_rewards{
    margin: 18px 0px 15px;
    line-height: 21px;
    font-weight: normal;
    text-align: center;
    font-size: 14px;
    color: white;
    padding: 0px;
    z-index: 1000000;
}

.levelup .lu_rewards .lu_reward{
    position: relative;
    display: inline-block;
    width: 80px;
    height: 70px;
    margin: 0px 5px;
    background-size: 60px;
    background-repeat: no-repeat;
    background-position: center;
    cursor: pointer;
}

.levelup .lu_rewards.next .lu_reward{
    position: relative;
    display: inline-block;
    width: 60px;
    height: 60px;
    margin: 0px 5px;
    background-size: 50px;
    background-repeat: no-repeat;
    background-position: center;
    cursor: pointer;
}


.levelup .lu_rewards .lu_reward:before{
    content: "";
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
    z-index: -1;
}

.levelup .confirm_level {

    padding: 20px 0px;
}

.levelup .confirm_level button {
    animation:highlited 500ms linear infinite;
}

#window_perk {
    font-size: 15px;
    display: block;
    position: fixed;
    top: 20px;
    height: 550px;
    right: calc(50% - 187px);
    max-width: 500px;
    width: 100%;
    background-color: black;
    box-sizing: border-box;
    z-index: 10000000;
    text-align: left;
}

#window_perk .close {
    z-index: 100;
}

#window_perk:before {
    content: '';
    display: block;
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    height: 10px;
    border-top: 1px solid white;
    border-left: 1px solid white;
    border-right: 1px solid white;
}

#window_perk:after {
    content: '';
    display: block;
    position: absolute;
    bottom: 0px;
    left: 0px;
    right: 0px;
    height: 10px;
    border-bottom: 1px solid white;
    border-left: 1px solid white;
    border-right: 1px solid white;
}

#window_perk .image {
    position: absolute;
    top: 10px;
    left: 10px;
    width: 200px;
    bottom: 10px;
    background-size: cover;
}


#window_perk .textf {
    position: absolute;
    top: 13px;
    left: 220px;
    right: 15px;
    color: white;
    text-align: left;
}

#window_perk .textf .name {
    color: white;
    text-transform: uppercase;
    text-shadow: 0px 0px 3px rgba(255,255,255,0.7);
    text-decoration: none;
    font-size: 41px;
    text-align: left;

    font-weight: normal;
}

#window_perk .textf .titl {
    color: white;
    text-align: left;
    font-size: 24px;
    color: rgb(238,233,119);
    text-transform: uppercase;

    padding: 15px 0px;
}

#window_perk .textf .desc {

    color: white;
    padding: 15px 0px;

}

#window_perk #pvals {
    position: absolute;
    top: 300px;
    left: 220px;
    right: 15px;
    color: white;
    text-align: left;
}

#window_perk #pvals .pval {
    display: block;
    height: 50px;
    padding-left: 65px;
    margin: 10px 0px;
    line-height: 50px;
    background-size: 40px;
    background-repeat: no-repeat;
    background-position: 10px center;
    color: rgb(238,233,119);
}

#window_perk #pvals .pval span {
    display: inline-block;
    vertical-align: middle;
    line-height: normal;
}




.profile_orgs{
    position:relative;
    width: 100%;
    color:white;
    box-sizing:border-box;
    border-spacing: 0px;
    border-collapse: separate;
    font-size: 14px;
}
.profile_orgs tr td {
    cursor: pointer
}

.profile_orgs tr:hover {
    background-color: rgba(255,255,255,.1);


}




.profile_orgs th {
    padding-left: 5px;
    text-align: left;
    font-weight: normal;
    background-color: white;
    font-weight: bold;
    color: black;
}
.profile_orgs td.crew, .profile_orgs th.crew {
    text-align: center;
    padding-left: 5px;
    padding-right: 5px;
    padding-top: 5px;
    width: 30px;
}



.profile_orgs th.crew img {
    filter: invert(100%);
}

.profile_orgs th.org_name {
    width: 220px;
}



.profile_orgs td {
    text-align: left;
    font-size: 13px;
    font-weight: normal;
    padding: 5px;
}
.profile_orgs td.number {
    font-size: 12px;
    font-weight: normal;
    color: rgba(255,215,0,1);
    width: 20px;
    text-align: center;
}
.profile_orgs td.image{
    width: 50px;
    height: 50px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}
.profile_orgs td.name {
    padding: 0px 0px 0px 20px;
    text-transform: uppercase;
}


.profile_orgs td.crew, .profile_orgs th.crew {
    text-align: center;
    padding-left: 5px;
    padding-right: 5px;
    padding-top: 5px;
}



.profile_orgs th.crew img {
    filter: invert(100%);
}



.profile_orgs .la {
    color: rgba(255,255,255,0.5);
    font-size: 10px;
}

.ogsblock {
    margin: 10px 0px 30px;
}

.ogsblock .buttons {
    text-align: left;
}


#invalidmail.blink,
#onlylogin.blink,
#resetconfirmation.blink{
    animation: blink 300ms linear 1;
}

.yellow {
    background-color: rgb(232,250,17);
}


#profilebox {
    display: block;
    position: relative;
    width: calc(100% - 40px);
    margin: 0px auto 100px;

}

#profilebox .submenu {
    font-size: 16px;
    display: block;
    float: left;
    position: relative;
    width: 300px;
    padding: 20px 20px 20px 20px;
    background-color: rgba(0,0,0,0.65);
    box-sizing: border-box;
    animation: crt 10000ms linear infinite;
    text-align: center;
    margin: 0px;

}
#profilebox .submenu:before {
    content:'';
    display: block;
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    height: 10px;
    border-top: 1px solid white;
    border-left: 1px solid white;
    border-right: 1px solid white;
}
#profilebox .submenu:after {
    content:'';
    display: block;
    position: absolute;
    bottom: 0px;
    left: 0px;
    right: 0px;
    height: 10px;
    border-bottom: 1px solid white;
    border-left: 1px solid white;
    border-right: 1px solid white;
}

#profilebox .profilecard {
    font-size: 16px;
    display: block;
    float: right;
    position: relative;
    width: calc(100% - 310px);
    padding: 20px 20px 20px 20px;
    background-color: rgba(0,0,0,0.65);
    box-sizing: border-box;
    animation: crt 10000ms linear infinite;
    text-align: center;
    margin: 0px;

}

#profilebox .profilecard:before {
    content:'';
    display: block;
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    height: 10px;
    border-top: 1px solid white;
    border-left: 1px solid white;
    border-right: 1px solid white;
}
#profilebox .profilecard:after {
    content:'';
    display: block;
    position: absolute;
    bottom: 0px;
    left: 0px;
    right: 0px;
    height: 10px;
    border-bottom: 1px solid white;
    border-left: 1px solid white;
    border-right: 1px solid white;
}

#profilebox .profilecard .infoblock {

}

#profilebox .profilecard .infoblock .name {
    position: relative;
    margin:5px auto 0px;
    line-height: 40px;
    display: block;
    font-size: 55px;
    color: rgba(255,255,255,.9);
    text-shadow: rgb(163,188,255) 0px 0px 6px;
    box-sizing: border-box;
    text-transform: uppercase;

    text-decoration: none;
    font-weight: normal;
    text-align: center;
    padding: 30px 0px 5px;
    letter-spacing: -1px;
}

#profilebox .profilecard .infoblock .name:before {
    content: 'NAME';
    position: absolute;
    top: 0px;
    left: 0px;
    font-size: 17px;

    color: rgba(255,255,255,0.9);
    text-shadow: rgb(255,213,182) 0px 0px 4px;
    text-transform: uppercase;
    letter-spacing: 3px;
}

#profilebox .profilecard .infoblock .email {
    position: relative;
    font-size: 20px;
    color: rgba(255,255,255,0.5);
    text-transform: uppercase;
    padding: 20px 0px 5px;

}

#profilebox .profilecard .infoblock .email:before {
    content: 'EMAIL';
    position: absolute;
    top: 0px;
    left: 0px;
    font-size: 17px;
    color: rgba(255,255,255,0.9);

    text-shadow: rgb(255,213,182) 0px 0px 4px;
    text-transform: uppercase;
    letter-spacing: 3px;
}

#profilebox .profilecard .infoblock .rank {
    position: relative;
    font-size: 20px;
    color: rgb(238,233,119);
    text-transform: uppercase;
    padding: 20px 0px 0px;

}

#profilebox .profilecard .infoblock .rank:before {
    content: 'RANK';
    position: absolute;
    top: 0px;
    left: 0px;

    font-size: 17px;
    color: rgba(255,255,255,0.9);
    text-shadow: rgb(255,213,182) 0px 0px 4px;
    text-transform: uppercase;
    letter-spacing: 3px;
}

#profilebox .profilecard .infoblock .rankwindow {
    position: relative;
    width: 200px;
    margin: 0px auto;
}


#profilebox .profilecard .infoblock .simg {
    position: relative;
    display: inline-block;
    width: 200px;
    height: 200px;
    margin: 5px auto;

}

#profilebox .profilecard .infoblock .simg .sface {
    position: absolute;
    width: 200px;
    height: 200px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}

#profilebox .profilecard .infoblock .srank {
    width: 150px;
    height: 80px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    margin: 0px auto;
}


@media (max-width: 700px) {
    #profilebox {
        display: block;
        position: relative;
        width: 90%;
        margin: 10px auto 70px;
    }

    #profilebox .submenu {
        float: none;
        width: auto;
    }

    #profilebox .profilecard {
        width: auto;
        float: none;
        margin: 10px auto;
    }
}

.loggedbox {
    padding: 0px;
    box-sizing: border-box;
    position: relative;
    width: 250px;
    min-height: 300px;
    background-color: black;
}




.loggedbox .name {
    font-size: 30px;
    color: rgba(255,255,255,0.9);
    text-shadow: rgb(163,188,255) 0px 0px 6px;
    text-transform: uppercase;

    padding: 6px 0px;
}

.loggedbox .email {
    font-size: 16px;
    color: rgba(255,255,255,0.9);
    text-shadow: rgb(255,213,182) 0px 0px 4px;
    text-transform: uppercase;

    padding: 6px 0px;
}

.loggedbox .sface {
    font-size: 20px;
    color: rgb(238,233,119);
    text-transform: uppercase;
    padding: 180px 0px 0px;

    position: relative;
    background-size: 125px;
    background-position: center top;
    text-align: center;
    background-repeat: no-repeat;
}



.loggedbox .sface .savatar {
    position: absolute;
    top: 0px;
    left: 64px;
    width: 127px;
    height: 178px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
}

.loggedbox .sface .srank {
    position: absolute;
    top: 0px;
    left: 64px;
    width: 127px;
    height: 178px;
    background-position: 64px 137px;
    background-repeat: no-repeat;
    background-size: 60px;
}

.loggedbox .sface .actions .sub_button {
    position: relative;
    text-align: center;
    border: 0px;
    background-color: white;
    cursor: pointer;
    text-decoration: none;
    color: black;
    padding: 0px 10px;
    font-size: 20px;

    font-weight: normal;
    line-height: 30px;
    text-transform: uppercase;
    height: 30px;
    box-sizing: border-box;
    text-decoration: none;

    display: inline-block;
    height: auto;
    text-align: center;
    width: auto;
    margin: 15px 5px;

    letter-spacing: 0px;
    text-shadow: none;
    opacity: 1;

}

.loggedbox  .sface .actions .sub_button.profile:hover::first-letter {
    color: rgb(4,193,193);
}

.loggedbox .sface .actions .sub_button.logout {
    color: white;
    background-color: rgb(168,0,0);


}

.loggedbox  .sface .actions .sub_button.logout::first-letter {
    color: rgb(4,193,193);
}

.loggedbox .sface .actions .sub_button:before {
    content: '';
    border: 0px;
}
.loggedbox .sface .actions .sub_button:hover {
    animation: blink 100ms linear 2 alternate;
    color: black;
    background-color: rgb(232,250,17);
    text-decoration: none;
}

.loggedbox  .sface .actions .sub_button::first-letter {
    color: rgb(4,193,193);
}

#profilebox .submenu .profile_menu_items {
    list-style: none;
    list-style-image: none;
    margin: 0;
    padding: 0;
}

#profilebox .submenu .profile_menu_items li {
    display: block;
    text-transform: uppercase;
    padding: 0px;
    margin: 0px;
    position: relative;
    color: rgba(255,255,255,0.5);
}

#profilebox .submenu .profile_menu_items li a {
    display: block;
    text-decoration: none;
    color: rgba(255,255,255,.9);
    font-size: 20px;
    letter-spacing: 4px;
    height: 30px;
    padding: 0px 5px 0px 20px;
    line-height: 30px;
    margin: 0px;
    text-align: left;

    opacity: 0.9;
    cursor: pointer;
    text-shadow: rgb(255,213,182) 0px 0px 4px;
}


#profilebox .submenu .profile_menu_items li a:hover {
    background-color: white;
    
    color: black;
    animation: blink 100ms linear 2;
}

#profilebox .submenu .profile_menu_items li a.selected {
    color: rgba(0,0,0,1);
    background-color:  rgba(255,255,255,1);
}


#profilebox .submenu .profile_menu_items li a.selected:hover {
    background:  rgba(255,255,255,1);
    animation: none;
    color: black;
}

.rewardsbox .wallpapers {

}

.rewardsbox .wallpapers .wp {
    display: block;
    position: relative;
    height: 135px;
    width: 240px;
    border: 1px solid white;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    margin: 0px 10px 0px 0px;
    color: white;
    line-height: 135px;

    font-size: 20px;
}

.rewardsbox .wallpapers .wp.disabled {
    filter: grayscale(100%);
}

.rewardsbox .wallpapers .wp.available .upslider {
    position: absolute;
    top: 101%;
    left: 0px;
    width: 100%;
    height: 100%;
    transition: 0.1s linear;
    background-color: rgba(0,0,0,0.8);
}

.rewardsbox .wallpapers .wp.available .upslider select {
    margin: 50px auto;
    width: calc(100% - 50px);
}

.rewardsbox .wallpapers .wp.available:hover .upslider {
    top: 0px;
}

.rewardsbox .wallpapers .wp.available .upslider.opened {
    top: 0px;
}



.rewardsbox .wallpapers .wp.available .upslider .dowload_button {
    position: relative;
    border: 0px;
    background-color: white;
    cursor: pointer;
    color: black;
    padding: 0px 10px;
    font-size: 20px;

    font-weight: normal;
    line-height: 30px;
    text-transform: uppercase;
    box-sizing: border-box;
    text-decoration: none;
    display: inline-block;
    height: auto;
    text-align: center;
    width: auto;
    margin: 50px auto;
    letter-spacing: 0px;
    text-shadow: none;
    opacity: 1;
}

.rewardsbox .wallpapers .wp.available .upslider .dowload_button::first-letter {
    color: rgb(4,193,193);
}

.credit {



    font-size: 55px;

    text-shadow: rgb(163,188,255) 0px 0px 6px;

    color: rgb(238,233,119);
    text-transform: uppercase;
    text-decoration: none;
}


.cookiesblock {
    position: fixed;
    bottom: 0px;
    left: 0px;
    right: 0px;
    background-color: rgba(0,0,0,.75);
    min-height: 30px;
    padding: 13px 0px;
    transition: all 3s;
    z-index: 999999999;
}

.cookiesblock.closed {
    position: fixed;
    bottom: -500px;
}

.cookiesblock p {
    color: white;
    font-size: 11px;
    text-transform: uppercase;
    width: calc(100% - 80px);
    float: left;
    padding: 0px 30px 0px 0px;
    margin: 0px;
    text-align: right;
    box-sizing: border-box;
    line-height: 16px;
}

.cookiesblock button {
    float: left;
}




#avatarbox {
    position: absolute;
    top: 88px;
    left: calc(50% - 187.5px);
    height: 565px;

    background-color: rgba(0,0,0,0.65);
    width: 375px;

}
#avatarbox:before {
    content:'';
    display: block;
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    height: 10px;
    border-top: 1px solid white;
    border-left: 1px solid white;
    border-right: 1px solid white;
}
#avatarbox:after {
    content:'';
    display: block;
    position: absolute;
    bottom: 0px;
    left: 0px;
    right: 0px;
    height: 10px;
    border-bottom: 1px solid white;
    border-left: 1px solid white;
    border-right: 1px solid white;
}



#avatarbox #hero_locker {
    position: relative;
    margin-top: 302px;
    line-height: 23px;
    background: linear-gradient(to right,rgba(103,223,237,0.0) 0%,rgba(103,223,237,0.4) 40%,rgba(103,223,237,0.4) 60%,rgba(103,223,237,0.0) 100%);
    height: 56px;
    font-weight: normal;
    text-align: center;
    font-size: 45px;
    color: white;
    padding: 0px;
    text-transform: none;
    text-shadow: 0px 0px 10px rgb(0,255,255);

    z-index: 1000000;
    padding: 12px 0px;
    text-transform: uppercase;
    animation: crt 10000ms linear infinite;
}


#avatarbox .race_title {
    position: relative;
    margin-top: 477px;
    margin-left: auto;
    margin-right: auto;
    width: 350px;
    line-height: 16px;
    height: 40px;
    font-weight: normal;
    text-align: center;
    font-size: 40px;
    color: white;
    padding: 0px;
    text-transform: none;

    z-index: 1000000;
    padding: 12px 0px;
    text-transform: uppercase;
    white-space: nowrap;
    /* background-image: linear-gradient(45deg, rgba(255,255,255,0.5) 25%, transparent 25%, transparent 75%, rgba(255,255,255,0.5) 75%, rgba(255,255,255,0.5)), linear-gradient(45deg, rgba(255,255,255,0.5) 25%, transparent 25%, transparent 75%, rgba(255,255,255,0.5) 75%, rgba(255,255,255,0.5)); */
    /* background-size: 2px 2px; */
    /* background-position: 0 0, 0px 0px; */
    color: black;
    background: white;
    overflow: hidden;
}

#avatarbox.locked .race_title {
    animation: blink 100ms linear 2;
}


#avatarbox .race_title span{
    display: block;
    font-size: 20px;
    padding-top: 10px;
}

#avatarbox .races{
    position: absolute;
    top: 65px;
    text-align: center;
}

#avatarbox .avatar{
    height: 420px;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
}



#avatarbox .races .race{
    position: relative;
    width: 320px;
    height: 320px;
    margin: 92px auto 0px;
    background-position: center bottom;
    background-repeat: no-repeat;
    background-size: cover;
    cursor: pointer;
    background-blend-mode: overlay;
    background-color: rgb(80, 80, 85);
    animation: crt 10000ms linear infinite;
    filter: grayscale(100%) brightness(130%) contrast(110%);


}


#avatarbox .owl-next{
    position: absolute;
    top: 200px;
    right: 0px;
    height: 50px;
    width: 35px;
    background: url('ico/arrow-24-32.png') -5px center no-repeat;

}

#avatarbox .owl-prev{
    position: absolute;
    top: 200px;
    left: 0px;
    height: 50px;
    width: 35px;
    background:url('ico/arrow-88-32.png') 5px center no-repeat;
}

#avatarbox .owl-prev.disabled,
#avatarbox .owl-next.disabled
{
    opacity: .1;
}


#avatarbox #submit{
    width: 300px;
    text-align: center;
    margin: 25px auto;
    z-index: 9999999;
    position: absolute;
    bottom: 1px;
    left: 0px;
    right: 0px;
}

#avatarbox #submit .inf_race{
    animation: highlited 500ms linear infinite;
    font-weight: normal;
    text-align: center;
    color: rgb(0,255,255);
    display: block;
    font-size: 20px;

    font-size: 17px;
    color: rgba(255,255,255,0.9);
    text-shadow: rgb(255,213,182) 0px 0px 4px;
    text-transform: uppercase;
    letter-spacing: 3px;
}

#avatarbox #submit .submit_race{
    animation:highlited 500ms linear infinite;
    position: relative;
    text-align: center;
    border: 0px;
    background-color: white;
    cursor: pointer;
    text-decoration: none;
    color: black;
    padding: 0px 10px;
    font-size: 20px;

    font-weight: normal;
    line-height: 30px;
    text-transform: none;
    height: 30px;
    box-sizing: border-box;
}

#avatarbox #submit .submit_race::first-letter {
    color: rgb(4,193,193);
}

#avatarbox #submit .submit_race:hover{
    color: black;
    background-color: rgb(232,250,17);
    animation:none;
}

.userbox {
    position: relative;
    margin: 40px auto 70px;
    width: 90%;
    background-color: rgba(0,0,0,0.65);
    padding: 10px 10px;
    min-height: 400px;
    max-width: 900px;
}



.userbox:before {
    content:'';
    display: block;
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    height: 10px;
    border-top: 1px solid rgba(255,255,255,.5);
    border-left: 1px solid rgba(255,255,255,.5);
    border-right: 1px solid rgba(255,255,255,.5);
}
.userbox:after {
    content:'';
    display: block;
    position: absolute;
    bottom: 0px;
    left: 0px;
    right: 0px;
    height: 10px;
    border-bottom: 1px solid rgba(255,255,255,.5);
    border-left: 1px solid rgba(255,255,255,.5);
    border-right: 1px solid rgba(255,255,255,.5);
}

.userbox .user_head {
    position: relative;
    height: 280px;

}

@media (max-width: 520px) {
    .userbox {
        margin: 0px auto 70px;

    }

    .userbox .user_head {
        height: auto;

    }
}

.userbox .user_relations .his_org,
.userbox .user_relations .membering_org,
.userbox .user_membering .owned_orgs,
.userbox .user_membering .memberof_orgs {
    padding: 20px 0px;
}
.userbox .rl_title {
    position: relative;

    padding: 20px 5px 3px;
    box-sizing: border-box;
    text-decoration: none;
    text-align: left;
    font-size: 17px;
    color: rgba(255,255,255,0.9);
    text-shadow: rgb(255,213,182) 0px 0px 4px;
    text-transform: uppercase;
    letter-spacing: 3px;
}


.userbox .simg {
    position: absolute;
    width: 200px;
    height: 200px;
    left: 20px;
    top: 30px;
}

@media (max-width: 520px) {
    .userbox .simg {
        position: relative;
        width: 100%;
        left: auto;
        top: auto;
    }
}

.userbox .simg .sface {
    position: absolute;
    width: 200px;
    height: 200px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}

@media (max-width: 520px) {
    .userbox .simg .sface {
        position: relative;
        width: 100%;
        left: auto;
        top: auto;
        height: 220px;
    }
}

.userbox .user_name {
    position: absolute;
    left: 220px;
    top: 0px;
    line-height: 40px;
    font-size: 55px;
    color: rgba(255,255,255,.9);
    text-transform: uppercase;

    text-decoration: none;
    font-weight: normal;
    text-align: left;
    padding: 30px 0px 5px;
    letter-spacing: -1px;
}

@media (max-width: 520px) {
    .userbox .user_name {
        position: relative;
        width: 100%;
        left: auto;
        top: auto;
        text-align: center;
        font-size: 40px;
    }
}

.userbox .user_name .user_email {
    font-size: 15px;
    color: rgba(255,255,255,.3);
    text-transform: uppercase;

    text-decoration: none;
    font-weight: normal;
    text-align: left;
    letter-spacing: 0px;
    line-height: 15px;
}

@media (max-width: 520px) {
    .userbox .user_name .user_email {

        text-align: center;

    }
}

.userbox .user_rank {
    position: absolute;
    top: 23px;
    width: 150px;
    right: 0px;
    text-align: center;
}

@media (max-width: 520px) {
    .userbox .user_rank {
        position: relative;
        width: 100%;
        left: auto;
        top: auto;

    }
}

.userbox .user_rank .rank {
    position: relative;
    font-size: 20px;
    color: rgb(238,233,119);
    text-transform: uppercase;
    padding: 20px 0px 0px;

    text-align: center;
}


.userbox .user_rank .srank {
    width: 80px;
    height: 80px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    margin: 0px auto;
}


@media (max-width: 520px) {
    .userbox .user_membering {
        position: relative;
        width: 100%;
        left: auto;
        top: auto;

    }
}

#telo {
    position: absolute;
    top:0px;
    left:0px;
    right: 0px;
    bottom: 0px;

}

.header .acontainer{
    position: absolute;
    right: 8px;
    top: 0px;
    height: 40px;
}

.header .acontainer ul{
    list-style:none;
    list-style-image:none;
    margin:0;
    padding:0;
}
.header .acontainer ul li{
    display:block;
    float:left;
    text-transform:uppercase;
    padding:0px;
    margin:0px;
    position:relative;
    color:rgba(255,255,255,0.5);
}
.header .acontainer ul li a{
    display: block;
    height: 40px;
    width: 26px;
    background-position: center;
    background-repeat: no-repeat !important;
    cursor: pointer;
    box-sizing: border-box;
    margin: 0px 2px;
    background-size: 16px;
}

.header .acontainer ul li a.logout{
    padding-left: 30px;
    background-image: url(ico/os_logout_40.png);
    
    background-size: 16px;
}

.header .acontainer ul li a.logout:hover{
    animation: blink 100ms linear 2 alternate;
}





.header .hcontainer{
    position: absolute;
    left: 10px;
    top: 0px;
    height: 50px;
    right: 10px;
    text-shadow: var(--shadow_textfull);
}


.header .hcontainer ul{
    list-style:none;
    list-style-image:none;
    margin:0;
    padding:0;
}
.header .hcontainer ul li{
    display:block;
    float:left;
    
    padding:0px;
    margin:0px;
    position:relative;
    color:rgba(255,255,255,0.5);
}
.header .hcontainer ul li a{
    display: block;
    text-decoration: none;
    color: white;
    font-size: 18px;
    transition: color 0.2s linear;
    height: 50px;
    padding: 0px 20px;
    line-height: 50px;
    margin: 0px;
    text-align: center;

    opacity: 0.8;
    cursor: pointer;
}

.header .hcontainer ul li a.account{
    padding-left: 40px;
    background: url(https://account.outspacegame.com/img/ico/menu_icon_account.png) 12px center no-repeat;
    background-size: 16px;
}




.header .hcontainer  ul li a.active{
    background-color: rgb(6,6,6);
}

.header .hcontainer   ul li:hover a{
    background-color: rgb(6,6,6);
}



.header .hcontainer  ul.subcategory li{
    display:block;
    float:none;
    text-transform:uppercase;
    padding:0px;
    margin:0px;
    position:relative;
    color:rgba(255,255,255,0.5);
}
.header .hcontainer  ul li ul{
    display: none;
    position: absolute;
    top: 50px;
    left: 0px;
    border-top: 1px solid rgb(255,255,255);
    background: rgb(32,34,37);
    width: 190px;
}

.header .hcontainer  ul li a:hover{
    animation: blink 100ms linear 2 alternate;

}
.header .hcontainer   ul li:hover ul{
    display:block;
}
.header .hcontainer  ul li ul li{
    display:block;
    position: relative;
    width: 100%;
}
.header .hcontainer ul li ul li a:before{
    content:"";
    position:absolute;
    right:11px;
    top:10px;
}
.header .hcontainer   ul li ul li a{
    position: relative;
    display: block;
    height: 36px;
    text-align: left;
    line-height: 36px;
    font-weight: normal;
    color: rgb(255,255,255);
    text-transform: none;
    padding: 0px 15px 0px 15px;
    overflow: hidden;
    font-size: 14px;
}
.header .hcontainer  ul li ul li a:hover:before{
    border-left:5px solid rgba(255,255,255,1);
}





.header .hcontainer .logo{
    height: 70px;
    width: 250px;
    padding-top: 0px;
    background-image: url(main-logo.png);
    background-size: 250px;
    background-position: center;
    background-repeat: no-repeat;
    position: absolute;
    left: calc(50% - 100px);
    top: 0px;
}

.header .user-dom {
    position: absolute;
    left: 20px;
    top: 0px;
    height: 40px;
    width: 180px;
}

.header .user-dom:before {
    content: '';
    display: block;
    position: absolute;
    top: 0px;
    left: 0px;
    bottom: 0px;
    width: 180px;
    color: rgba(255,255,255,0.2);
    text-decoration: none;

    vertical-align: middle;
    font-size: 12px;
    font-weight: bold;
    line-height: 40px;
    text-align: right;
    background-image: url(https://account.outspacegame.com/img/main-logo.png);
    background-size: 171px;
    background-position: center left;
    background-repeat: no-repeat;
    opacity: 0.8;
}

.header .user-dom .user-name{
    display: block;
    position: absolute;
    top: 0px;
    left: 180px;
    width: 95px;
    white-space: nowrap;
    height: 40px;
    color: rgba(255,255,255,0.8);
    text-decoration: none;

    vertical-align: middle;
    font-size: 12px;
    font-weight: bold;
    line-height: 40px;
    overflow: hidden;
}



.bigscreen {
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
}

.bigscreen .centerbox {
    position: absolute;
    bottom: 300px;
    left: calc(50% - 200px);
    width: 400px;
}



.bigscreen .centerbox:before {
    content: '';
    display: block;
    position: absolute;
    top: -225px;
    left: -80px;
    right: -80px;
    height: 130px;
    background-image: url(https://account.outspacegame.com/img/osg_logo_350_noMS3.png);
    background-size: 90%;
    background-position: top center;
    background-repeat: no-repeat;
    animation: crt 5000ms linear infinite;
}

@media (max-width: 520px) {
    .bigscreen .centerbox {
        right: 10px;
        left: 10px;
        width: unset;
        bottom: unset;
        top: 150px;
    }

    .bigscreen .centerbox:before {
        top: -50px;
        left: 0px;
        right: 0px;
    }


}

.bigscreen .logininfo {
    position: relative;
    background: rgba(0,0,0,.4);
    color: white;
    text-align: center;
    font-size: 12px;
    margin: 0px 0px 15px;
}

.bigscreen .logininfo h1 {
    font-family: var(--fontFaimly_header);
    font-size: 25px;
    padding: 8px 0px 0px 0px;
    margin: 0px;
    text-transform: uppercase;
}

.bigscreen .logininfo p {
    font-size: 13px;
    padding: 0px 15px 13px;
    margin: 0px;
}


.bigscreen .loginform {
    position: relative;
    height: 200px;
}


.bigscreen .loginform table  {
    position: absolute;
    width: 260px;
    top: 35px;
    left: calc( 50% - 130px );
}
.bigscreen .loginform .label  {
    color: rgba(255,255,255,0.3);
    text-align: center;
    white-space: nowrap;
    font-size: 10px;
    text-transform: uppercase;
}
.bigscreen .loginform .input  {
    height: 30px
}
.bigscreen .loginform .input input  {
    margin: 0px;
}
.bigscreen .loginform .loginsubmit  {
    text-align: center;
}

.bigscreen .loginform .directloginmail  {
    text-align: center;
}

.bigscreen .loginform .directloginmail a  {
    font-size: 11px;
    text-transform: uppercase;
    background-color: white;
    color: black;
    padding: 2px 6px;
    font-family: var(--fontFaimly_button);
    cursor: pointer;
}

.bigscreen .loginform .directloginmail a:hover {
    animation:blink 100ms linear 2 alternate;
}

.bigscreen .cookies  {
    display: block;
    position: absolute;
    left: 10px;
    right: 10px;
    bottom: 90px;
}
.bigscreen .subcookies  {
    display: block;
    position: relative;
    margin: 0px auto;
    max-width: 800px;
}




@media (max-width: 520px) {
    .bigscreen .centerbox {
        right: 10px;
        left: 10px;
        width: unset;
        bottom: 10px;
    }
}

.bigscreen .cookies h2  {
    display: block;
    color: rgba(255,255,255,0.3);
    font-size: 13px;
    text-align: center;
    padding: 0px 0px 5px;
    margin: 0px;
    font-weight: normal;
}
.bigscreen .cookies p  {
    display: block;
    color:  rgba(255,255,255,0.3);
    font-size: 11px;
    text-align: center;
    padding: 0px 10px 0px;
    margin: 0px;
}
.bigscreen .loginlogo {
    position: absolute;
    left: calc(50% - 400px);
    top: calc(50% - 400px);
    width: 800px;
}
.bigscreen .loginform .input input[type="text"],
.loginform .input input[type="password"]  {
    box-shadow: none;
    text-decoration: none;
    text-transform: none;
    font-size: 13px;
    border: 1px solid rgba(255,255,255,0.8);
    color: white;
    background-color: rgba(0,0,0,0.8);
    padding: 0px 10px;
    box-sizing: border-box;
    width: 100%;
    height: 30px;
    line-height: 30px;
    text-align: center;
    text-shadow: -3px 0px 0 rgb(255 131 64 / 40%), 3px 0px 0 rgb(126 250 255 / 40%);
    animation: shadowing 5000ms linear infinite;
    font-family: var(--fontFaimly_text);


}
.bigscreen .loginform .loginsubmit button{
    position: relative;
    display: inline-block;
    height: 30px;
  
    color: black;
    text-align: center;
    box-sizing: border-box;
    line-height: 30px;
    text-transform: uppercase;
    font-size: 14px;
    font-weight: normal;
    cursor: pointer;

    font-weight: normal;
    line-height: 30px;
    text-transform: none;
    width: 100px;
    margin: 5px 0px 0px;

}
.bigscreen .loginform .loginsubmit  button::first-letter {
    color: inherit;
}

#advocationUsers {
    display:block;
    position:absolute;
    top:80px;
    left:5%;
    width:90%;
    bottom:30px;
    z-index: 1;
}

#advocationUsers:before {
    content: '';
    position: absolute;
    left: 0px;
    right: 0px;
    top: 0px;
    bottom: 0px;
    background-color: rgb(10,10,10);
    -webkit-clip-path: var(--clip_standardbox);
    clip-path: var(--clip_standardbox);
    z-index: -1;
}

@media (max-width: 1020px) {
    #advocationUsers {
        right: 10px;
        left: 10px;
        width: unset;

    }
}



#advocationUsers .inside{
    position: absolute;

    top: 55px;
    left: 15px;
    right: 15px;
    bottom: 20px;
    overflow-y: scroll;
    padding-bottom: 150px;
}

#advocationUsers .inside .userslist table{
    width: 100%;
    border-spacing: 0px;
    border-collapse: separate;
    margin: 0px auto;
}


#advocationUsers .inside .userslist table th {
    background-color: white;
    font-weight: bold;
    font-size: 11px;
    color: black;
    padding: 5px 10px;
    text-transform: uppercase;
    line-height: 15px;
    text-align: left;
}



#advocationUsers .inside .userslist table td{
    color: white;
    font-size: 12px;
    padding: 14px 10px;
    border-bottom: 1px solid rgba(255,255,255,0.05);
}


#advocationUsers .inside .userslist table td.ttorders .ordersinfotab{
    display: inline-block;
    position: relative;
    width: 20px;
    height: 5px;
    cursor: pointer;
}

#advocationUsers .inside .userslist table td.ttorders .ordersinfotab .ordersinfotabqty {
    
    position: absolute;
    left: 3px;
    width: 20px;
    top: 50%;
    transform: translateY(-50%);
    height: 20px;
    line-height: 20px;
    background-repeat: no-repeat;
    background-size: 10px;
    background-position: center;
    text-align: center;
    border: 1px solid #ffbc00;
    border-radius: 20px;
    color: #ffbc00;
    font-size: 11px;
    text-shadow: none;
}

#advocationUsers .inside .userslist table td.ttorders .ordersinfotab:hover .html{
    display: block;
   
}

#advocationUsers .inside .userslist table td.ttorders .ordersinfotab .html {
   display: none;
    position: absolute;
    right: -4px;
    width: 320px;
    top: 31px;
    background-color: rgba(0,0,0,1);
    padding: 10px 14px;
    box-sizing: border-box;
    z-index: 100;
    line-height: initial;
    text-align: right;
    
  
}

#advocationUsers .inside .userslist table td.ttorders .ordersinfotab .html:before {
    content: "";
    display: block;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    position: absolute;
    top: -10px;
    right: 0px;
    border-bottom: 10px solid rgba(0,0,0,1);
}

#advocationUsers .inside .userslist table td.ttorders .ordersinfotab .html table.tttorders {
    
    width: 100%;
    
}

#advocationUsers .inside .userslist table td.ttorders .ordersinfotab .html table.tttorders .tto td {
    text-align: left;
    padding: 3px 6px;
}





#advocationLinks {
    display:block;
    position:absolute;
    top:80px;
    left:5%;
    width:90%;
    bottom:30px;
    z-index: 1;
}

#advocationLinks:before {
    content: '';
    position: absolute;
    left: 0px;
    right: 0px;
    top: 0px;
    bottom: 0px;
    background-color: rgb(10,10,10);
    -webkit-clip-path: var(--clip_standardbox);
    clip-path: var(--clip_standardbox);
    z-index: -1;
}




@media (max-width: 1020px) {
    #advocationLinks {
        right: 10px;
        left: 10px;
        width: unset;

    }
}


#advocationLinks .inside{
    position: absolute;

    top: 55px;
    left: 15px;
    right: 15px;
    bottom: 20px;
    overflow-y: scroll;
    padding-bottom: 150px;
}

#advocationLinks .inside .linkgenerator{
    width: 100%;
    
    margin: 0px auto 20px;
}

#advocationLinks .inside .linkgenerator table{
    
    margin: 0px auto 0px;
}


#advocationLinks .inside .linkslist table{
    width: 100%;
    border-spacing: 0px;
    border-collapse: separate;
    margin: 0px auto;
}


#advocationLinks .inside .linkslist table th {
    background-color: white;
    font-weight: bold;
    font-size: 11px;
    color: black;
    padding: 5px 10px;
    text-transform: uppercase;
    line-height: 15px;
    text-align: left;
}

#advocationLinks .inside .linkslist table th.used,
#advocationLinks .inside .linkslist table th.fees,
#advocationLinks .inside .linkslist table th.orders,
#advocationLinks .inside .linkslist table th.buyers,
#advocationLinks .inside .linkslist table th.buyer_ratio,
#advocationLinks .inside .linkslist table th.user_ratio,
#advocationLinks .inside .linkslist table th.totals{
    text-align: right;
}

#advocationLinks .inside .linkslist table td.used,
#advocationLinks .inside .linkslist table td.orders,
#advocationLinks .inside .linkslist table td.buyers,
#advocationLinks .inside .linkslist table td.buyer_ratio,
#advocationLinks .inside .linkslist table td.user_ratio
{
    text-align: right;
}

#advocationLinks .inside .linkslist table td{
    color: white;
    font-size: 12px;
    padding: 14px 10px;
    border-bottom: 1px solid rgba(255,255,255,0.05);
}

#advocationLinks .inside .linkslist table td.url{
    user-select: all;
}
#advocationLinks .inside .linkslist table td .usedqty,
#advocationLinks .inside .linkslist table td .ordesredqty{
    cursor: pointer;
    color: black;
    background-color: white;
    display: inline-block;
    padding: 1px 5px;
    border-radius: 4px;
    font-size: 14px;
    font-family: var(--fontFaimly_button);
    
}

#advocationLinks .inside .linkslist table td.maxcapfee .active{
    color: #ffbc00;
}

#advocationLinks .inside .linkslist table td.maxcapfee .unactive{
    color: gray;
}



#advocationLinks .inside .linkslist table td .usedqty:hover,
#advocationLinks .inside .linkslist table td .ordesredqty:hover{
    animation: blink 100ms linear 2 alternate;
}





#advocationLinks .inside .linkslist table td.fees span{
    padding: 1px 5px;
    display: block;
    text-align: right;
    white-space: nowrap;
}

#advocationLinks .inside .linkslist table td.totals span{
    padding: 1px 5px;
    display: block;
    text-align: right;
    white-space: nowrap;
}


#advocationLinks .inside .linkslist table td.budget{
    
    
    text-align: right;
    white-space: nowrap;
    color: gray;
}


#advocationSales {
    display:block;
    position:absolute;
    top:80px;
    left:5%;
    width:90%;
    bottom:30px;
    z-index: 1;
}

#advocationSales:before {
    content: '';
    position: absolute;
    left: 0px;
    right: 0px;
    top: 0px;
    bottom: 0px;
    background-color: rgb(10,10,10);
    -webkit-clip-path: var(--clip_standardbox);
    clip-path: var(--clip_standardbox);
    z-index: -1;
}

@media (max-width: 1020px) {
    #advocationSales {
        right: 10px;
        left: 10px;
        width: unset;

    }
}

#advocationSales .totals{
    position: absolute;

    top: 55px;
    left: 15px;
    right: 15px;
    height: 120px;
    
    
}

#advocationSales .totals table{
    width: calc(50% - 2px);
    border-spacing: 0px;
    border-collapse: separate;
    margin: 0px;
    position: absolute;
}

#advocationSales .totals table.paid{
    position: absolute;
    right: 0px;
}

#advocationSales .totals table.topay{
    
    left: 0px;
}

#advocationSales .totals table th {
    background-color: white;
    
    font-size: 11px;
    color: black;
    padding: 5px 0px;
    text-transform: uppercase;
    line-height: 15px;
    text-align: center;
}

#advocationSales .totals table th.cur {
    width: 16.66%;
}

#advocationSales .totals table td.cur {
    width: 16.66%;
}

#advocationSales .totals table td{
    color: white;
    font-size: 18px;
    padding: 10px 0px;
    text-align: center;
    
}

#advocationSales .totals table td .est{
    display: block;
    color: gray;
    font-size: 11px;
}

#advocationSales .inside{
    position: absolute;

    top: 185px;
    left: 15px;
    right: 15px;
    bottom: 20px;
    overflow-y: scroll;
    padding-bottom: 150px;
}


#advocationSales .inside .salestable table{
    width: 100%;
    border-spacing: 0px;
    border-collapse: separate;
    margin: 0px auto;
}


#advocationSales .inside .salestable table th {
    background-color: white;
    font-weight: bold;
    font-size: 11px;
    color: black;
    padding: 5px 10px;
    text-transform: uppercase;
    line-height: 15px;
    text-align: left;
}



#advocationSales .inside .salestable table tr.orderrow td{
    color: white;
    font-size: 12px;
    padding: 10px 10px;
    border-bottom: 1px solid rgba(255,255,255,0.05);
}

#advocationSales .inside .salestable table tr.orderrow.paid td{
    color: white;
    font-size: 12px;
    padding: 10px 10px;
    border-bottom: 1px solid rgba(255,255,255,0.05);
}

#advocationSales .inside .salestable table tr.orderrow.notcompleted td{
    color: white;
    
}

#advocationSales .inside .salestable table tr.orderrow td.tpaid,
#advocationSales .inside .salestable table tr.orderrow td.tperc,
#advocationSales .inside .salestable table tr.orderrow td.tfee,
#advocationSales .inside .salestable table tr.orderrow td.tprice,
#advocationSales .inside .salestable table tr.orderrow td.ttopay,
#advocationSales .inside .salestable table tr th.tpaid,
#advocationSales .inside .salestable table tr th.tperc,
#advocationSales .inside .salestable table tr th.tfee,
#advocationSales .inside .salestable table tr th.tprice,
#advocationSales .inside .salestable table tr th.ttopay{
    text-align: right;
    
}

#advocationSales .inside .salestable table tr.orderrow td .delayrest{
    color: black;
    background-color: white;
    display: inline-block;
    padding: 1px 5px;
    border-radius: 4px;
    font-size: 11px;
    font-family: var(--fontFaimly_button);
    cursor: default;
}

#advocationSales .inside .salestable table tr.orderrow td .refunded{
    color: black;
    background-color: white;
    display: inline-block;
    padding: 1px 5px;
    border-radius: 4px;
    font-size: 11px;
    font-family: var(--fontFaimly_button);
    cursor: default;
}

#advocationSales .inside .salestable table tr.orderrow td .refunded{
    color: black;
    background-color: white;
    display: inline-block;
    padding: 1px 5px;
    border-radius: 4px;
    font-size: 11px;
    font-family: var(--fontFaimly_button);
    cursor: default;
}

#advocationSales .inside .salestable table tr.orderrow.completed td .refunded{
  
    background-color: gray;
    
}



#advocationSales .inside .salestable table tr.orderrow td .remark {
    display: inline-block;
    position: relative;
    width: 12px;
    height: 12px;
    
}

#advocationSales .inside .salestable table tr.orderrow td .remark:before {
    content: 'i';
    position: absolute;
    left: 3px;
    width: 10px;
    top: 2px;
    height: 10px;
    line-height: 10px;
    background-repeat: no-repeat;
    background-size: 10px;
    background-position: center;
    text-align: center;
    border: 1px solid gray;
    border-radius: 20px;
    color: gray;
    font-size: 9px;


    text-shadow: none;

}

#advocationSales .inside .salestable table tr.orderrow td .remark:hover .html {
    display: block;
    animation: blink 100ms linear 2 alternate;
    cursor: pointer;
}

#advocationSales .inside .salestable table tr.orderrow td .remark .html {
  display: none;
    position: absolute;
    right: -7px;
    
   width: 220px;
    top: 28px;
    background-color: rgba(0,0,0,1);
    padding: 6px 12px;
    box-sizing: border-box;
    z-index: 100;
    line-height: initial;
    text-align: right;
    
}

#advocationSales .inside .salestable table tr.orderrow td .remark .html:before {
    content: "";
    display: block;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    position: absolute;
    top: -10px;
    right: 0px;
    border-bottom: 10px solid rgba(0,0,0,1);
}


#advocationSales .inside .salestable table tr.orderrow.notcompleted td{
    color: white;
}

#advocationSales .inside .salestable table tr.orderrow.completed td{
    color: gray;
}

#advocationSales .inside .salestable table tr.orderrow td.tuser .uname,
#advocationSales .inside .salestable table tr.orderrow td.tuser .language,
#advocationSales .inside .salestable table tr.orderrow td.tuser .created{
    display: block;
}

#advocationLinks .referral-generator .linkgenerator input[type="submit"] {
    
    background: rgb(255,255,255);
    padding: 0px 15px;
    height: 30px;
    line-height: 30px;
    text-decoration: none;
    text-transform: uppercase;
    font-size: 14px;
    font-weight: normal;
    text-align: center;
    cursor: pointer;
    color: black;
    font-family: var(--fontFaimly_button);
    clip-path: var(--clip_button);
}



#orderhistory {
    display:block;
    position:absolute;
    top:80px;
    left:calc(50% - 500px);
    width:1200px;
    bottom:30px;
    z-index: 1;
}

#orderhistory:before {
    content: '';
    position: absolute;
    left: 0px;
    right: 0px;
    top: 0px;
    bottom: 0px;
    background-color: rgb(10,10,10);
    -webkit-clip-path: var(--clip_standardbox);
    clip-path: var(--clip_standardbox);
    z-index: -1;
}

@media (max-width: 1020px) {
    #orderhistory {
        right: 10px;
        left: 10px;
        width: unset;

    }
}





#orderhistory .inside{
    position: absolute;

    top: 55px;
    left: 15px;
    right: 15px;
    bottom: 20px;
    overflow-y: scroll;
}
#orderhistory .inside .title{
    position: relative;
    height: auto;
    background: white;
    line-height: 37px;
    font-weight: normal;
    text-align: left;
    font-size: 50px;
    color: black;
    padding: 0px 15px;
    text-transform: none;

    height: 60px;
    line-height: 60px;
    text-transform: uppercase;
    text-shadow: none;
    box-sizing: border-box;
}


#orderhistory .inside table{
    width: 100%;
    border-spacing: 0px;
    border-collapse: separate;
    margin: 0px auto;
}


#orderhistory .inside table th {
    background-color: white;
    font-weight: bold;
    font-size: 11px;
    color: black;
    padding: 5px 10px;
    text-transform: uppercase;
    line-height: 15px;
    text-align: left;
}

#orderhistory .inside table th.transaction_id {
    text-align: left;
}

#orderhistory .inside table th.date {
    text-align: right;
}

#orderhistory .inside table th.payserv {
    text-align: center;
}

#orderhistory .inside table th.item {
    text-align: left;
}

#orderhistory .inside table th.trprice {
    text-align: center;
}

#orderhistory .inside table th.status {
    text-align: center;
}


#orderhistory .inside table td{
    color: white;
    font-size: 13px;
    padding: 14px 10px;
    border-bottom: 1px solid rgba(255,255,255,0.05);
}

#orderhistory .inside table td.transaction_id{
    color: gray;
    text-align: left
}

#orderhistory .inside table td.tserver{
    color: gray;
    text-align: left
}

#orderhistory .inside table td.tserver span{
    display: block;
}

#orderhistory .inside table td.tserver span.sectorname{
    font-size: 10px;
}

#orderhistory .inside table td.date{
    text-align: right;
}

#orderhistory .inside table td.item{
    text-align: left;
}

#orderhistory .inside table td.ordercontent .occards{
    display: block;
    position: relative;
    padding: 3px 60px;
}

#orderhistory .inside table td.ordercontent .occards .card{
    display: inline-block;
    position: relative;
    width: 30px;
    height: 42px;
    margin: 4px;
    cursor: pointer;
}

#orderhistory .inside table td.ordercontent .occards .card canvas{ 
    width: 30px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translateX(-50%) translateY(-50%);
    transition: width 0.2s;
}

#orderhistory .inside table td.ordercontent .occards .card:hover canvas{ 
    width: 40px;
    z-index: 100000;
}

#orderhistory .inside table td.ordercontent .occards .card.maximized canvas{ 
    width: 180px;
    z-index: 100000;
}

#orderhistory .inside table td.payserv{
    text-align: center;
    overflow: hidden;
    padding: 0px;
}

#orderhistory .inside table td.payserv .payservicon{
    display: inline-block;
    height: 64px;
    width: 64px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;

}

#orderhistory .inside table td.paystatus{
    text-align: center;
    overflow: hidden;

}

#orderhistory .inside table td.paystatus .paystatusicon{
    display: inline-block;
    height: 22px;
    width: 30px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 14px;

}

#orderhistory .inside table td.trprice{
    text-align: right;
}
#orderhistory .inside table td.currency{
    text-align: left;
}


#settings {
    display:block;
    position:absolute;
    top:calc(50% - 250px);
    left:calc(50% - 200px);
    width:400px;
    height:500px;
    z-index: 1;



}

#settings:before {
    content: '';
    position: absolute;
    left: 0px;
    right: 0px;
    top: 0px;
    bottom: 0px;
    background-color: rgb(30,30,30);
    -webkit-clip-path: var(--clip_menu_standardbox);
    clip-path: var(--clip_menu_standardbox);
    z-index: -1;
}

@media (max-width: 520px) {
    #settings {
        right: 10px;
        left: 10px;
        width: unset;

    }
}



#settings .inside{
    position: absolute;
    height: 155px;
    top: 15px;
    left: 15px;
    right: 225px;
    border-right: 2px solid white;
}






#wait_box{
    position: absolute;
    top: calc(50% - 100px);
    left: calc(50% - 200px);
    width: 400px;
    height: 100px;
    cursor: wait;
    z-index: 9999999999999999;
    background-color: rgba(255,255,255,1);
    animation: windowshow 50ms linear 2 alternate;
}
#wait_box .inner{
    position: absolute;
    top: 15px;
    height: 70px;
    width: 350px;
    left: 25px;
}
#wait_box .msg{
    position: absolute;
    top: 0px;
    left: 5px;
    height: 35px;
    right: 5px;
    line-height: 12px;
    color: black;
    font-size: 32px;
    text-align: center;
    text-transform: uppercase;
}
#wait_box .msg2{
    position: absolute;
    top: 23px;
    left: 5px;
    right: 5px;
    color: black;
    font-size: 11px;
    text-align: center;
    text-transform: uppercase;
}
#wait_box .msg3{
    position: absolute;
    top: 43px;
    left: 5px;
    right: 5px;
    color: gray;
    font-size: 9px;
    text-align: center;
    text-transform: uppercase;
}
#wait_box .bar{
    position: absolute;
    top: 40px;
    left: 0px;
    height: 8px;
    right: 0px;
    line-height: 40px;
    color: black;
    font-size: 11px;
    text-align: center;
    text-transform: uppercase;
}
#wait_box .bar .perc{
    position: absolute;
    top: 0px;
    left: 0px;
    bottom: 0px;
    width: 0%;
    background-color: rgba(0,0,0,1);
}
#wait_box .info {
    position: absolute;
    top: 70px;
    left: 5px;
    right: 5px;
    color: black;
    font-size: 8px;
    text-transform: none;
    opacity: .6;
    margin: 0px;
    padding: 0px;
    width: auto;
}
#wait_box .info .ver{
    display: block;
    position: absolute;
    right: -20px;
    width: 50%;
    text-align: right;
    letter-spacing: 0px;
}
#wait_box .info .copy{
    display: block;
    position: absolute;
    left: -20px;
    text-align: left;
    letter-spacing: 0px;
}

#settings .inside .label{
    height:37px;
    color:white;
    padding-left:10px;
    line-height:50px;
    text-decoration:none;
    font-size:12px;
    font-weight:normal;
    text-shadow:0px 0px 10px rgb(0,255,255);
    text-align:center;
}
#settings .inside2{
    position: absolute;
    bottom: 0px;
    top: 55px;
    left: 20px;
    right: 20px;

}



#settings .inside2 #contentbox{
    position: absolute;
    bottom: 0px;
    top: 0px;
    left: 0px;
    right: 0px;
}


#settings .inside2 #contentbox table{
    padding:0px;
    margin:0px;
    width:100%;
    border-spacing:0px;
    border-collapse:separate;
}
#settings .inside2 #contentbox td{
    font-size: 16px;
    color: white;
    padding: 5px 10px;
    
    line-height: 11px;
    border-bottom: 1px solid rgba(255,255,255,0.05);

}






#settings .inside2 #contentbox th{
    background-color: white;
    font-weight: bold;
    font-size: 13px;
    color: black;
    padding: 5px 10px;
    text-transform: uppercase;
    line-height: 15px;
    text-align: left;
}



#settings .inside2 #contentbox .params th{
    
    font-weight: normal;
    color:rgba(255,255,255,0.5);
    padding:5px 10px;
    background-color:transparent;
    overflow:hidden;
    text-align:right;
    width: 120px;
}
#settings .inside2 #contentbox .params td{
    color: rgb(255,255,255);
    padding: 0px 10px;
    
    text-align: left;
    overflow: hidden;
    white-space: nowrap;

}

#settings .inside2 #contentbox .params th,
#settings .inside2 #contentbox .params td{
    border-bottom: 1px solid rgba(255,255,255,0.05);
    height:35px;

}


#settings .inside2 #contentbox .params tr:hover td{
    background: none;
    color: white;
    font-weight: normal;
}
#settings .inside2 #contentbox .params td.img{
    position: relative;
    padding: 0px;
    text-align: center;
}


#settings .inside2 #contentbox .params td .avatar {
    position: relative;
    display: block;
    width: 150px;
    height: 150px;
    margin: 0px auto;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
}


#settings .inside2 #contentbox .params td .avatar .avatar_img {
    height: 150px;
    width: 150px;
    position: absolute;
    top: 0px;
    left: 0px;
    box-sizing: border-box;
    background-repeat: no-repeat;

    background-size: contain;
    background-position: center;

}

#settings .inside2 #contentbox .params td .sex .sex_male,
#settings .inside2 #contentbox .params td .sex .sex_female,
#settings .inside2 #contentbox .params td .sex .sex_notset {
    display: inline-block;
    height: 30px;
    width: 30px;
    margin: 5px;
    background-color: black;
    background-repeat: no-repeat;
    background-size: 14px;
    background-position: center;
    cursor: pointer;
}

#settings .inside2 #contentbox .params td .sex .sex_male:not(.active):hover,
#settings .inside2 #contentbox .params td .sex .sex_female:not(.active):hover,
#settings .inside2 #contentbox .params td .sex .sex_notset:not(.active):hover {
    animation: blink 100ms linear 2 alternate;
    filter: invert(1);
}


#settings .inside2 #contentbox .params td .sex .sex_male.active,
#settings .inside2 #contentbox .params td .sex .sex_female.active,
#settings .inside2 #contentbox .params td .sex .sex_notset.active {
    filter: invert(1);
}

#settings .inside2 #contentbox .params td .sex .sex_male {
    background-image: url(ico/male-2-24.png);
}
#settings .inside2 #contentbox .params td .sex .sex_female {
    background-image: url(ico/female-2-24.png);
}
#settings .inside2 #contentbox .params td .sex .sex_notset {
    background-image: url(ico/notset-2-24.png);
    background-size: 20px;
}

#settings .inside2 #contentbox .params td .email {
    position: relative;
    height: 30px;
    width: 100%;
    line-height: 30px;
}

#settings .inside2 #contentbox .params td .psw {
    position: relative;
    height: 30px;
    width: 100%;
    line-height: 30px;
}

#settings .inside2 #contentbox .params td .name {
    position: relative;
    height: 30px;
    width: 100%;
    line-height: 30px;
}

#settings .avatar .editimage,
#settings .inside2 #contentbox .params td .email .edit,
#settings .inside2 #contentbox .params td .name .edit,
#settings .inside2 #contentbox .params td .psw .edit {
    position: absolute;
    display: none;
    right: 10px;
    top: calc(50% - 15px);
    background: rgb(255,255,255);
    padding: 0px 15px;
    height: 30px;
    line-height: 30px;
    text-decoration: none;
    text-transform: uppercase;
    font-size: 14px;
    font-weight: normal;
    text-align: center;
    cursor: pointer;
    color: black;
    font-family: var(--fontFaimly_button);
    clip-path: var(--clip_button);

}

#settings .avatar .editimage {
    left: calc(50% - 50px);
    right: unset;
}

#settings .avatar:hover .editimage,
#settings .inside2 #contentbox .params td .email:hover .edit,
#settings .inside2 #contentbox .params td .name:hover .edit,
#settings .inside2 #contentbox .params td .psw:hover .edit {
    display: block;
    animation:blink 100ms linear 2 alternate;
}




#userni{
    z-index: 999000;
    position:absolute;
    width:500px;
    min-height:140px;
}

#userni:before {
    content: '';
    position: absolute;
    left: 0px;
    right: 0px;
    top: 0px;
    bottom: 0px;
    background-color: rgb(10,10,10);
    -webkit-clip-path: var(--clip_standardbox);
    clip-path: var(--clip_standardbox);
    z-index: -1;
}



#userni table.imageselect {
    color: white;
    width: calc(100% - 60px);
    margin: 80px 30px 50px 30px;
    border-spacing: 0px;
    border-collapse: separate;
}
#userni table.imageselect .setuserimageleft {
    text-align: left;
}
#userni table.imageselect .setuserimageright {
    text-align: right;
}


#userni .text {
    content:'';
    display: block;
    position: absolute;
    top: 60px;
    left: 10px;
    right: 10px;
    color: white;
    text-align: center;
}
#userni .ali-confirm {
    position: absolute;
    top: 115px;
    left: calc(50% - 80px);
}
#userni .ali-cancel {
    position: absolute;
    top: 115px;
    right: calc(50% - 80px);
}
#userni .info{
    display: block;
    font-size: 11px;
    color: rgba(255,255,255,.5);
    text-align: center;
    padding: 20px 10px;
    letter-spacing: 0px;
    text-transform: none;
}

#usernn{
    z-index: 999000;
    position:absolute;
    width:500px;
    min-height:140px;
}

#usernn:before {
    content: '';
    position: absolute;
    left: 0px;
    right: 0px;
    top: 0px;
    bottom: 0px;
    background-color: rgb(10,10,10);
    -webkit-clip-path: var(--clip_standardbox);
    clip-path: var(--clip_standardbox);
    z-index: -1;
}


#usernn table.newname {
    color: white;
    width: calc(100% - 60px);
    margin: 80px 30px 30px 30px;
    border-spacing: 0px;
    border-collapse: separate;

}
#usernn table.newname input#nameinput {
    text-transform: none;
    font-size: 16px;
    font-weight: normal;
    text-align: center;

    height: 30px;
    line-height: 30px;
    text-shadow: -2px 0px 0 rgba(255,131,64,.3), 2px 0px 0 rgba(126, 250, 255, .2);
    animation: font_color_glitch 5300ms linear infinite;
    width: 200px;
    box-sizing: border-box;
}

#usernn table td.setusernameleft {
    text-align: left;
}
#usernn table td.setusernameright {
    text-align: right;
}


#usernn .text {
    content:'';
    display: block;
    position: absolute;
    top: 60px;
    left: 10px;
    right: 10px;
    color: white;
    text-align: center;
}
#usernn .ali-confirm {
    position: absolute;
    top: 115px;
    left: calc(50% - 80px);
}
#usernn .ali-cancel {
    position: absolute;
    top: 115px;
    right: calc(50% - 80px);
}
#usernn .info{
    display: block;
    font-size: 12px;
    color: rgba(255,255,255,.5);
    text-align: center;

    padding: 20px 10px;
    letter-spacing: 0px;
    text-transform: none;
    text-transform: uppercase;
}
#usernn .error {
    display: block;
    font-size: 12px;
    text-align: center;
    padding: 5px 10px;
    text-transform: uppercase;
    color: rgb(164,2,4);
    font-weight: bold;
    animation: highlited 500ms linear infinite;
}
#usernn .normal {
    display: block;
    font-size: 12px;
    text-align: center;
    padding: 5px 10px;
    text-transform: uppercase;
    color: rgba(255,255,255,.8);
    font-weight: bold;
}

#userne{
    z-index: 999000;
    position:absolute;
    width:500px;
    min-height:140px;

    backdrop-filter: var(--box-backdrop-filter);
    border: 1px solid var(--border-color);
    background-image: linear-gradient(0deg, var(--border-effect-color) 0%, var(--border-effect-color) 100%), linear-gradient(0deg, var(--border-effect-color) 0%, var(--border-effect-color) 100%), linear-gradient(0deg, var(--border-effect-color) 0%, var(--border-effect-color) 100%), linear-gradient(0deg, var(--border-effect-color) 0%, var(--border-effect-color) 100%);
    background-origin: border-box;
    background-repeat: no-repeat;
    background-size: 2px 3px, 2px 3px,2px 3px, 2px 3px;
    background-position: top left, top right,bottom left, bottom right;
    background-color: var(--box-background);
    overflow: hidden;
    animation: deblur 1000ms ease-out forwards;

}


#userne table.newmail {
    color: white;
    width: 100%;
    margin-top: 50px;
    border-spacing: 20px;
    border-collapse: separate;
}


#userne table td.setusernameleft {
    text-align: left;
}
#userne table td.setusernameright {
    text-align: right;
}

#userne table.newmail input#emailinput {
    text-transform: none;
    font-size: 16px;
    font-weight: normal;
    text-align: center;

    height: 30px;
    line-height: 30px;
    text-shadow: -2px 0px 0 rgba(255,131,64,.3), 2px 0px 0 rgba(126, 250, 255, .2);
    animation: font_color_glitch 5300ms linear infinite;
    width: 200px;
    box-sizing: border-box;
    ;
}
#userne .text {
    content:'';
    display: block;
    position: absolute;
    top: 60px;
    left: 10px;
    right: 10px;
    color: white;
    text-align: center;
}
#userne .ali-confirm {
    position: absolute;
    top: 115px;
    left: calc(50% - 80px);
}
#userne .ali-cancel {
    position: absolute;
    top: 115px;
    right: calc(50% - 80px);
}
#userne .info{
    display: block;
    font-size: 10px;
    color: rgba(255,255,255,.5);
    text-align: center;

    padding: 20px 10px;
    letter-spacing: 0px;
    text-transform: none;
    text-transform: uppercase;
}
#userne .error {
    display: block;
    font-size: 12px;
    text-align: center;
    padding: 5px 10px;
    text-transform: uppercase;
    color: rgb(164,2,4);
    font-weight: bold;
    animation: highlited 500ms linear infinite;
}
#userne .normal {
    display: block;
    font-size: 12px;
    text-align: center;
    padding: 5px 10px;
    text-transform: uppercase;
    color: rgba(255,255,255,.8);
    font-weight: bold;
}




#corporation .inside2 #contentbox .params td .psw {
    position: relative;
    height: 30px;
    width: 100%;
    line-height: 30px;


}
#corporation .inside2 #contentbox .params td .psw .edit {
    position: absolute;
    display: none;
    left: calc(50% - 50px);
    top: calc(50% - 15px);
    background: rgb(232,250,17);
    width: 100px;
    height: 30px;
    line-height: 30px;

    text-decoration: none;
    text-transform: uppercase;
    font-size: 20px;
    font-weight: normal;
    text-align: center;
    cursor: pointer;
    color: black;
    font-weight: normal;
}
#corporation .inside2 #contentbox .params td .psw:hover .edit  {
    display: block;
    animation:blink 100ms linear 2 alternate;
}

#usernp{
    z-index: 999000;
    position:absolute;
    width:500px;
    min-height:140px;
}

#usernp:before {
    content: '';
    position: absolute;
    left: 0px;
    right: 0px;
    top: 0px;
    bottom: 0px;
    background-color: rgb(10,10,10);
    -webkit-clip-path: var(--clip_standardbox);
    clip-path: var(--clip_standardbox);
    z-index: -1;
}

#usernp table.newpsw {
    color: white;
    width: calc(100% - 60px);
    margin: 80px 30px 30px 30px;
    border-spacing: 0px;
    border-collapse: separate;

}
#usernp table.newpsw input {
    text-transform: none;
    font-size: 16px;
    font-weight: normal;
    text-align: center;

    height: 30px;
    line-height: 30px;
    text-shadow: -2px 0px 0 rgba(255,131,64,.3), 2px 0px 0 rgba(126, 250, 255, .2);
    animation: font_color_glitch 5300ms linear infinite;
    width: 200px;
    box-sizing: border-box;
    margin: 3px 0px 0px 10px;
    display: block;
}

#usernp table.newpsw th {
    text-align: right;
    font-size: 10px;
    font-weight: normal;
    color: gray;
}

#usernp table.newpsw td {
    text-align: left;
}



#usernp table.newpsw button {

    margin: 3px auto;
    display: block;
}
#usernp .text {
    content:'';
    display: block;
    position: absolute;
    top: 60px;
    left: 10px;
    right: 10px;
    color: white;
    text-align: center;
}
#usernp .ali-confirm {
    position: absolute;
    top: 115px;
    left: calc(50% - 80px);
}
#usernp .ali-cancel {
    position: absolute;
    top: 115px;
    right: calc(50% - 80px);
}
#usernp .info{
    display: block;
    font-size: 10px;
    color: rgba(255,255,255,.5);
    text-align: center;

    padding: 20px 10px;
    letter-spacing: 0px;
    text-transform: none;
    text-transform: uppercase;
}
#usernp .error {
    display: block;
    font-size: 12px;
    text-align: center;
    padding: 5px 10px;
    text-transform: uppercase;
    color: rgb(164,2,4);
    font-weight: bold;
    animation: highlited 500ms linear infinite;
}
#usernp .normal {
    display: block;
    font-size: 12px;
    text-align: center;
    padding: 5px 10px;
    text-transform: uppercase;
    color: rgba(255,255,255,.8);
    font-weight: bold;
}


#gameservers {
    top: 200px;
    left: 50px;
    right: 50px;
    ;
    position:absolute;
}


#gameservers .gameserverlist{
    display: block;
    position: relative;
}


#gameservers .title {
    top: -80px;
    text-align: left;
}

#gameservers .gameserverlist .gameserver{
    display: block;
    position: relative;
    height: 480px;
    width: 250px;
    text-shadow: /* first layer at 1px */ -1px -1px 0px #000, 0px -1px 0px #000, 1px -1px 0px #000, -1px 0px 0px #000, 1px 0px 0px #000, -1px 1px 0px #000, 0px 1px 0px #000, 1px 1px 0px #000, /* second layer at 2px */ -2px -2px 0px #000, -1px -2px 0px #000, 0px -2px 0px #000, 1px -2px 0px #000, 2px -2px 0px #000, 2px -1px 0px #000, 2px 0px 0px #000, 2px 1px 0px #000, 2px 2px 0px #000, 1px 2px 0px #000, 0px 2px 0px #000, -1px 2px 0px #000, -2px 2px 0px #000, -2px 1px 0px #000, -2px 0px 0px #000, -2px -1px 0px #000;
    overflow: hidden;
    margin: 10px 30px;
}



#gameservers .gameserverlist .gameserver .stars{
    display: block;
    position: absolute;
    top: 10px;
    left: 0px;
    right: 0px;
    text-shadow: none;
    text-align: center;

}



#gameservers .gameserverlist .gameserver .stars .star{
    position: relative;
    text-align: center;
    height: 80px;
    width: 80px;
    display: inline-block;
}

#gameservers .gameserverlist .gameserver .stars .star .sicon{
    position: absolute;
    top: 15px;
    bottom: 15px;
    left: 15px;
    right: 15px;
}

#gameservers .gameserverlist .gameserver .stars .star .sicon span{
    position: absolute;
    display: block;
    border-radius: 2000px;
    background-image: url('stars/star_bckg_b.png');
    background-position: center;
    background-size: 102%;
    background-repeat: no-repeat;


}


#gameservers .gameserverlist .gameserver .stars .star .sicon span:after{
    content: '';
    display: block;
    position: absolute;
    top: -20%;
    left: -20%;
    right: -20%;
    bottom: -20%;
    background-image: url(stars/corona.png);
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    z-index: -1;
    opacity: 0.6;
}






#gameservers .gameserverlist .gameserver .planets{
    display: block;
    position: absolute;
    top: 80px;
    left: 0px;
    right: 0px;
    text-shadow: none;
    text-align: center;

}



#gameservers .gameserverlist .gameserver .planets .planet{
    position: relative;
    text-align: center;

    display: block;
    margin: 4px auto;
}

#gameservers .gameserverlist .gameserver .planets .planet .picon{


    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    border-radius: 2000px;
    display: block;
    padding-bottom: 100%;
}









#gameservers .gameserverlist .gameserver .img{
    display: block;
    position: absolute;
    top: 151px;
    bottom: 50px;
    left: 0px;
    right: 0px;
    background-size: cover;
    overflow: hidden;
    background-position: top right;
}

#gameservers .gameserverlist .gameserver .img:before {
    content:'';
    display: block;
    position: absolute;
    top: 0px;
    left: 0px;
    bottom: 0px;
    width: 10px;
    border-top: 1px solid rgba(255,255,255,1);
    border-left: 1px solid rgba(255,255,255,1);
    border-bottom: 1px solid rgba(255,255,255,1);
    z-index: 1;
}
#gameservers .gameserverlist .gameserver .img:after {
    content:'';
    display: block;
    position: absolute;
    bottom: 0px;
    right: 0px;
    top: 0px;
    width: 10px;
    border-bottom: 1px solid rgba(255,255,255,1);
    border-right: 1px solid rgba(255,255,255,1);
    border-top: 1px solid rgba(255,255,255,1);
    z-index: 1;
}


#gameservers .gameserverlist .gameserver.disabled .img {
    filter:grayscale(1);
}
#gameservers .gameserverlist .gameserver .img .content {
    display: block;
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
    background-size: cover;
    background-position: top right;
}

#gameservers .gameserverlist .gameserver .img .content:after {
    content: '';
    display: block;
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
    background-image: linear-gradient(-45deg, rgba(0,0,0,.8) 0%, rgba(0,0,0,0) 50%),linear-gradient(160deg, rgba(0,0,0,0) 60%, rgba(0,0,0,.8) 100%);
    background-size: cover;
    background-position: bottom left;
}



#gameservers .gameserverlist .gameserver:hover .img .content{
    animation: crt 5000ms linear infinite;
}




#gameservers .gameserverlist .gameserver .name{
    display: block;
    position: absolute;
    top: 161px;
    left: 20px;
    color: white;
    /* text-transform: uppercase; */
    right: 5px;
    text-decoration: none;
    text-align: left;
    font-size: 29px;
    font-weight: normal;

}

#gameservers .gameserverlist .gameserver .version{
    display: block;
    position: absolute;
    top: 200px;
    left: 20px;
    right: 20px;
    color: gray;
    text-transform: uppercase;
    text-decoration: none;
    font-size: 10px;
    font-weight: normal;

    text-align: left;
}

#gameservers .gameserverlist .gameserver .running{
    display: block;
    position: absolute;
    top: 400px;
    left: 20px;
    right: 20px;
    color: gray;
    text-transform: uppercase;
    text-decoration: none;
    font-size: 10px;
    font-weight: normal;

    text-align: left;
}

#gameservers .gameserverlist .gameserver .players{
    display: block;
    position: absolute;
    top: 125px;
    left: 20px;
    right: 20px;
    color: gray;
    text-transform: uppercase;
    text-decoration: none;
    font-size: 11px;
    font-weight: normal;

    text-align: center;
}

#gameservers .gameserverlist .gameserver .subname{
    display: block;
    position: absolute;
    top: 87px;
    left: 20px;
    color: white;
    /* text-transform: uppercase; */
    text-decoration: none;
    text-align: center;
    font-size: 25px;
    font-weight: normal;
    right: 20px;

}

#gameservers .gameserverlist .gameserver .txt{
    display: block;
    position: absolute;
    top: 230px;
    left: 20px;
    right: 20px;
    color: white;
    text-transform: uppercase;
    text-decoration: none;
    text-align: left;
    font-size: 10px;
    font-weight: normal;
    line-height: 15px;
}

#gameservers .gameserverlist .gameserver .status{
    display: block;
    position: absolute;
    bottom: 0px;
    right: 0px;
    left: 0px;

}


#gameservers .gameserverlist .gameserver .status .sutton{
    display: block;
    position: relative;
    margin: 0px auto;
    height: 34px;
    color: white;
    line-height: 34px;
    background-color: #14ad14;
    width: 130px;
    font-size: 16px;

    font-weight: bold;
    text-align: center;
    text-shadow: 2px 2px 0 #000;
    cursor: pointer;
    text-transform: uppercase;
    padding: 0px 5px;
    box-shadow: -3px 0px 0 rgba(255,131,64,.3), 3px 0px 0 rgba(126, 250, 255, .2);
    box-sizing: border-box;
}


#gameservers .gameserverlist .gameserver .status .sutton:hover {
    animation: blink 100ms linear 2;
    box-shadow: none;
}

#gameservers .gameserverlist .gameserver .status .sutton.banned{
    color: #B8B8B8;
    background-color: #808080;
    text-shadow: none;
    cursor: not-allowed;
    box-shadow: none;

}







.whitelink {
    background-color: white;
    color: black;
    padding: 0px 5px;
    cursor: pointer;
    text-shadow: none;
    font-weight: bold;
}

.whitelink.external {
    padding: 0px 16px 0px 5px;
    background-image: url(ico/external-link-2-16.png);
    background-size: 9px;
    background-position: right 2px top 2px;
    background-repeat: no-repeat;
}

.whitelink:hover {
    animation: blink 100ms linear 2;

}


#telo .designby {
    position: absolute;
    right: 20px;
    bottom: 14px;
    width: 200px;
    height: 50px;
    background-image: url(https://account.outspacegame.com/img/graphics_by.png);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: right bottom;
    z-index: 1000;
}