/********************************      Basic Structure      ********************************/

html {
    font-size: 100%;
    height: 100%;
    margin-bottom: 1px; /* Always show a scrollbar to avoid jumping when the scrollbar appears  */
}

body {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    overflow-x: hidden;
}

#wrap { margin: 0 auto; text-align: left; }
#head, #main-content, #footer, #main-content-private { width: 975px; margin: 0 auto; text-align: left; }
#footer-content { margin:10px auto 20px; }

#main { padding: 30px 0; }

/* top login panel */
#head .component-login td { padding: 2px; }

/* menus */
#head .navigation ul li, #footer ul li { float: left; padding: 0 15px; border-right: 2px solid #ccc; }
#head .navigation ul li.last, #footer ul li.last { border: none; }

#footer { font-size: 90%; padding-bottom: 20px; }
#footer ul li img.keycollect-img { float: left; margin-top: -10px; margin-right: 5px; }

/* more-menu box */
.more_menu { border: 2px solid black; padding: 3px; background-color: #FFFFFF;}
.more_menu.visible { position: absolute; display: block;}
.more_menu.not-visible { display: none;}
.menu-more { height: auto!important; }
.menu-more li { display: block!important; border: none!important; float: none!important; text-align: center; }

/********************************      Elements styling      ********************************/

h1, h2, h3, h4, h5, h6 {
    font-family: Helvetica, Arial, sans-serif;
    color: #222;
    font-weight: bold;
}

h1 { font-family: Calibri, Helvetica, Arial, sans-serif; font-size: 26px; font-weight: bold; }
h2 { font-size: 22px; padding: 0 0 10px 0; }
h3 { font-size: 18px; padding: 0 0 10px 0; }
h4 { font-size: 16px; padding: 0 0 10px 0; }
h5 { font-size: 14px; padding: 0 0 10px 0; }
h6 { font-size: 13px; padding: 0 0 10px 0; }

a { color: #57a000; text-decoration: none; }
a:hover { color: #000; }
a:active { color: #777; }
a:focus { outline: 1px; }
strong { font-weight: bold; color: #333; }
small { font-size: 0.85em; }
pre { font-family: monospace; }
p { padding: 5px 0 10px 0; }
label { font-weight: bold !important; }
fieldset { padding: 15px; border: 1px solid; }
legend { font-weight: bold; }

ul, ol, p { line-height: 1.6em; }

/********************************      General Classes      ********************************/

.clear { clear: both; }
.clearfix { display: inline-block; }
.clearfix:after { clear: both; content: '.'; display: block; visibility: hidden; line-height: 0; height: 0; }
.center {text-align: center; }
.img-center { display: block; margin: 0 auto;}
.align-left { float: left; }
.align-right { float: right; }
.align-next { display: inline; }
.show-details { display: block; }
.hide-details { display: none; }

.column-left { width: 48%; float: left; }
.column-right { width: 48%; float: right; }
.text-left { text-align: left; }
.text-right { text-align: right; line-height: 1em; }
.text-center { text-align: center; }
.text-top { vertical-align: top; }
.text-bottom { vertical-align: bottom; }
.half { width: 50%; }

/* form elements */
.button { padding: 4px 7px; border: 1px solid; cursor: pointer; }
.button-submit {}
.button-big { padding: 6px 12px; }
.text-input, .text-area { padding: 5px; border: 1px solid; }
.selectbox { padding: 4px 5px; border: 1px solid; }

.text-input.disabled { border-color: #ccc !important; }
.disabled { color: #ccc !important; }
.link { cursor: pointer; }

/* lists */
ul.numbered-list, ol.numbered-list { list-style: decimal outside none; margin-left: 20px; }
ul.bulleted-list, ol.bulleted-list { list-style-type: disc;  margin-left: 40px; }
ul.indented { padding-left: 30px; }

.definition-list {}
.definition-list dt { float: left; width: 35%; font-weight: bold; }
.definition-list dd { float: left; width: 55%; margin: 0 0 2em 0; }

/* ui classes */
.ui-green-button, .ui-green-button-small { cursor: pointer; height: 25px; border: 1px solid; font-weight: bold; padding-bottom: 3px; font-size: 14px; }
.ui-green-button { background: transparent url('/resource/images/myaccount/ui_green_button_bg.gif') left top repeat-x; }
.ui-green-button-small { height: 21px; font-size: 12px; padding: 0px 1px 4px; background: transparent url('/resource/images/myaccount/ui_green_button_small_bg.gif') left top repeat-x; }
.ui-pdf-button { width: 17px; height: 17px; cursor: pointer; border: none; background: transparent url('/resource/icons/logo_pdf.gif') left top no-repeat; vertical-align: middle;}
.ui-icon-info { width: 17px; height: 17px; cursor: pointer; border: none; background: transparent url('/resource/icons/information.png') left top no-repeat; }
.ui-red-text { color: red !important;}

/*************** Notifications ***************/

.notification {
    position: relative;
    padding: 5px 0px 5px 25px;
    border: 1px solid;
    background-position: 5px 11px !important;
    background-repeat: no-repeat !important;
    font-size: 13px;
    width: 99.8%;
    margin-bottom: 20px;
}

.attention {
    background: #fffbcc url('/resource/icons/exclamation.png') 10px 11px no-repeat;
    border-color: #e6db55;
    color: #666452;
}

.information {
    background: #dbe3ff url('/resource/icons/information.png');
    border-color: #a2b4ee;
    color: #585b66;
}

.success {
    background: #d5ffce url('/resource/icons/tick_circle.png');
    border-color: #9adf8f;
    color: #556652;
}

.error, .row_error_message {
    background: #ffcece url('/resource/icons/cross_circle.png');
    background-position:left 2px;
    background-repeat:no-repeat;
    border-color: #df8f8f;
    color: #665252;
}

.notification div {
    display:block;
    font-style:normal;
    padding: 10px 10px 10px 36px;
    line-height: 1.5em;
}

.notification .close {
    color:#990000;
    font-size:9px;
    position:absolute;
    right:5px;
    top:5px;
}

.input-notification, .row_error_message, p.error {
    display: inline-block;
    background-color:transparent;
    background-position:left 2px;
    background-repeat:no-repeat;
    margin:0 0 0 5px;
    padding:2px 0 2px 22px;
}

.notification div h5 {
    margin-top: 0;
}

.blink {color: red; }

div.date-navigator { padding: 10px 0; }

.print_this_page {background: transparent url('/resource/images/icons/print.gif') left center no-repeat; padding-left: 20px;}

/********************************      content-box      ********************************/
.block-box { border: 1px solid; margin: 0 0 10px 0; padding: 10px; }
.content-box { margin: 0 0 20px 0; }
.content-box-header { margin-bottom: 20px; }

.form-detail table,
.detail table {
    width: 100%;
    border-collapse: collapse;
}

.form-detail table thead th,
.detail table thead th {
    font-weight: bold;
    border-bottom: 1px solid #ddd;
    padding: 5px;
}

.form-detail tbody tr,
.detail tbody tr {
}

.form-detail tbody tr.alt-row,
.detail tbody tr.alt-row {
    background-color: #f2f2f2;
}

.form-detail tbody tr.conflicted,
.detail tbody tr.conflicted {
}

.form-detail table td,
.detail table td {
    padding: 5px;
}
.form-detail table tr.no-padding td,
.detail table tr.no-padding td {
    padding: 0;
}

.form-detail .filter-actions select,
.form-detail table tfoot td .bulk-actions select {
    padding: 4px;
    border: 1px solid #ccc;
}

.form-detail table tfoot td {
    border-top: 1px solid #ddd;
}

table.highlight-enabled tbody tr:hover,
table.highlight-enabled tbody tr:hover {
    background-color: #EFFFD8;
}

table.highlight-enabled tbody tr.freezed:hover,
table.highlight-enabled tbody tr.freezed:hover {
    background-color: transparent;
}

table th.numeric,
table td.numeric { text-align: right !important; }

/*------------------------ START - CLX LAYOUT ------------------------*/

/* tab menu */
#component-menu-tab_menu .tabs-holder { width: 757px; }

/* main content */
#main-interface { width: 985px; margin-left: -5px; }

#main-interface .interface-top { width: 975px; float: left; background: transparent url('/resource/images/myaccount/interface_topleft_img.png') left bottom no-repeat; }
#main-interface .interface-topbg { width: 975px; margin-left: 10px; padding-top: 18px; float: left; background: transparent url('/resource/images/myaccount/interface_topright_img.png') right bottom no-repeat; }

#main-interface #interface-body { width: 975px; float: left; background: #f8f8f8 url('/resource/images/myaccount/interface_body_left.png') left top repeat-y; }
#main-interface .interface-bodybg { width: 975px; margin-left: 10px; padding-top: 18px; float: left; background: #f8f8f8 url('/resource/images/myaccount/interface_body_right.png') right top repeat-y; }

#main-interface .interface-bottombg { width: 963px; height: 17px; float: left; background: transparent url('/resource/images/myaccount/interface_bottom_bg.png') left top repeat-x; }
#main-interface .interface-bottomleft { width: 11px; height: 17px; float: left; background: transparent url('/resource/images/myaccount/interface_bottomleft_img.png') left top no-repeat; }
#main-interface .interface-bottomright { width: 11px; height: 17px; float: left; background: transparent url('/resource/images/myaccount/interface_bottomright_img.png') left top no-repeat; }

#main-interface #interface-content { float: left; width: 722px; padding: 0 20px 0 15px; }
#main-interface #interface-extra-panel { float: left; }

#main-interface .interface-divider { float: left; width: 5px; min-height: 367px; background: transparent url('/resource/images/myaccount/interface_divider.png') left top no-repeat; }
#main-interface .interface-sidebar { float: left; width: 180px; padding: 0 19px 0 14px; margin-top: -15px; }

/*------------------------ END - CLX LAYOUT ------------------------*/

/*------------------------ START - PAGINATION ------------------------*/

.advancedPagination { width: 100%; display: block; overflow: hidden; margin: 20px 0 0 0; }
.advancedPagination .column-right { text-align: right; }
.advancedPagination .pagination { padding: 20px 0 5px 0; text-align: center }
.pagination a,
.pagination span { margin: 0 5px 0 0; padding: 3px 6px; }
.pagination span { color: #cccccc; }
.pagination .current { background-color: #469400; border-color: #459300 !important; color: #fff !important; font-weight: bold; }
.pagination a.current:hover { text-decoration: underline; }

/*------------------------ END - PAGINATION ------------------------*/

#component-autocharge-status { font-family: Arial; height: 53px; padding-left: 125px; color: #464646; position: relative;}
#component-autocharge-status { font-size: 13px; line-height: 20px; }

#breadcrumbs { margin-bottom: 8px; font-family: Arial; font-size: 11px; }
#breadcrumbs ul { display: block; height: 11px; }
#breadcrumbs li { float: left; margin-right: 2px; }
#breadcrumbs a { font-weight: bold; color: #464646; margin-right: 2px; }


/*------------------------ MYACCOUNT 2.1 ---------------------------*/

#main-ui { margin-left: -3px; }
#main-ui a { font-weight: bold; text-decoration: underline; }
#main-ui, #main-ui h1, #main-ui h2, #main-ui h3, #main-ui h4, #main-ui h5, #main-ui h6 { font-family: Arial; }
#main-ui .content-box-header { margin-bottom: 15px; -moz-border-radius: 0; -webkit-border-radius: 0; border-radius: 0; }
#main-ui .content-box-header h3 { border-bottom: 1px solid #C7C7C7; padding: 12px 0 16px; }

#main-ui .text-input, #main-ui select { border: 1px solid #a9a9a9; padding: 4px 5px; color: #464646; }
#main-ui .text-input, #main-ui select, #main-ui .button, .btn-friend-recharge { -moz-border-radius: 0; -webkit-border-radius: 0; border-radius: 0; }
#main-ui span.crit { font-weight: bold; color: red; }
#main-ui .button, .btn-friend-recharge { background-color: #2E3192; border: none; color: #fff; font-weight: bold; font-family: Arial; padding: 4px 5px; font-size: 12px; height: 24px; }
#main-ui .button.submit { padding: 4px 15px; }
#main-ui .button.disabled { background-color: #BDBDBD !important; color: #fff !important; }

.balance-autocharge-info div { float: left; margin-right: 15px; padding: 0 !important; }
.balance-autocharge-info .balance-text { font-size: 13px !important; }
.balance-autocharge-info .balance { font-size: 24px; }
#component-user-header-links { line-height: 1em; }
#component-user-header-links a { display: block; text-decoration: underline !important;}
#component-user-header-links .notification-link { display: inline-block; margin-top: 12px; }
#component-user-header-links #user_notifications_link { display: inline-block; background: transparent url('/resource/icons/icon_notification.png') no-repeat scroll 90px 0; padding-right: 30px; }
#component-user-header-links #user_notifications_link.unread { background: transparent url('/resource/icons/icon_notification_unread.png') no-repeat scroll 140px 0; height: 17px; padding-right: 32px; }
#component-user-header-links #user_notifications_link.inline { background-image: none; display: inline; padding-right: 10px; }
#component-user-header-links .count { display: inline-block; height: 16px; width: 14px; background: url('/public/assets/images/message_read_big.png') no-repeat; text-decoration: none; }
#component-user-header-links .count.important { background-image: url('/resource/icons/message_imp_read_big.png'); }
#component-user-header-links .count.unread { background-image: url('/public/assets/images/message_unread_big.png'); }
#component-user-header-links .count.unread.important { background-image: url('/resource/icons/message_imp_unread_big.png'); }
#component-user-header-links .spacer { display: block; width: 1px; height: 12px; }

/* local agents */
#main-ui #page-local_agents-overview .content-box-header { border: none; margin-bottom: 0 !important; }
#main-ui #page-local_agents-overview h3 {
    font-size: 18px;
    font-weight: bold;
}
#main-ui #page-local_agents-overview .sub-block ul { margin: auto; }
#main-ui #page-local_agents-overview .sub-block ul li a { font-weight: bold; }
#main-ui #page-local_agents-overview .sub-block {
    background-color: #F9F8FD;
    border: 1px solid #CCCCCC;
    padding: 15px;
    margin-bottom: 20px;
    width: 520px;
}

/* create multiple accounts */
#main-ui #page-create-multiple-accounts .content-box-header {display: none; }
#main-ui #component-local-agents-create fieldset { border-radius: 0 !important; margin-bottom: 25px; padding: 20px; border: 1px solid #ccc; width: 550px; background-color:#F9F8FD; }
#main-ui #component-local-agents-create label { font-weight: normal; }
#main-ui #component-local-agents-create p { padding: 0px 0px 10px; }
#main-ui #component-local-agents-create .create-info-text { padding: 0px 30px 0px 0px;}
#main-ui #component-local-agents-create .disabled { background-color: #ccc; color: #fff !important; }
#main-ui #component-local-agents-create .form-create-account  {width: 50%;}
#main-ui #component-local-agents-create .form-create-account-captcha  {float: right; width: 60%; }
#main-ui #component-local-agents-create .form-create-account  input,
#main-ui #component-local-agents-create .form-create-account-captcha  input {margin: 5px 0; width: 250px; }

/*reseller list text*/
#main-ui #reseller-description fieldset { border-radius: 0 !important; margin-bottom: 25px; padding: 20px; border: 1px solid #ccc; width: 550px; }
#main-ui #reseller-description textarea { border: 1px solid #ccc;}
#main-ui p#for-country, #component-local-agent-resellers p { margin-bottom:0px !important; margin-top:0px !important; padding-bottom: 0px !important; }
#component-local-agent-resellers p.title { margin-bottom: 5px !important; }

/*money transfer*/
#main-ui #page-local-agents-money-transfer .content-box-header {display: none;}
#main-ui #page-local-agents-money-transfer #component-calls-money-transfer button { margin: 10px 0 20px 0; }
/*recent transfer*/
#main-ui #page-local-agents-recent-transfer .content-box-header {display: none;}

/*generate vouchers*/
#main-ui #page-local-agents-generate-vouchers .content-box-header {display: none;}

/*view vouchers*/
#main-ui #page-local_agents-view_vouchers .content-box-header {display: none;}

/*list description*/
#main-ui #page-local-agents-list-description .content-box-header {display: none;}

/*agent information*/
#main-ui #page-local-agents-agent-information .content-box-header {display: none;}

/* verification */
#main-ui #component-sms-verify input,
#main-ui #component-sms-verify .button,
#main-ui #component-phone-verify input,
#main-ui #component-phone-verify .button,
#main-ui #component-phonevoice-verify input,
#main-ui #component-phonevoice-verify .button {
    margin: 5px 5px 5px 0;
}

#main-ui #component-sms-verify input.disabled,
#main-ui #component-sms-verify .button .disabled,
#main-ui #component-phone-verify input.disabled,
#main-ui #component-phone-verify .button .disabled,
#main-ui #component-phonevoice-verify input.disabled,
#main-ui #component-phonevoice-verify .button .disabled {
    background-color: #bdbdbd !important;
    color: white !important;
}

#main-ui #component-sms-verify .helptip img,
#main-ui #component-phone-verify .helptip img,
#main-ui #component-phonevoice-verify .helptip img {
    display: none;
}

#main-ui #component-sms-verify .helptip,
#main-ui #component-phone-verify .helptip,
#main-ui #component-phonevoice-verify .helptip {
    display: inline-block;
    background: url("/resource/images/myaccount2/helptip_logo.gif") no-repeat scroll 0 0 transparent;
    height: 16px;
    width: 16px;
    vertical-align: middle;
}

/** purchases **/
#main-ui .content #page-purchases-main .notification.error { width: 600px; float: left; margin-right: 10px; }
#main-ui .content #page-purchases-main #button_back { float: left; height: 40px; margin-right: 5px; width: 23px; }
#main-ui .content #component-purchases-main table td {height: 17px; vertical-align: middle; }
#main-ui .content #component-purchases-main table td.invoice {padding: 0px; text-align: center;}
#main-ui .content #page-purchases-main .pagination { text-align: center; margin: 10px 0;}

/* reseller status */
#component-user-welcome_info_status { margin-top: 5px; line-height: 27px; text-align: right; }
#component-user-welcome_info_status img { vertical-align: middle; }
#component-user-welcome_info_status #welcome-status-type { font-weight: bold; }

/* language switcher */
#flags_locale_switcher li { float: left; margin-right: 10px; }
#flags_locale_switcher li span { vertical-align: middle; }
#flags_locale_switcher li .flag { height: 11px; width: 16px; display: inline-block; margin-right: 2px; }

/* sharebutton */
#share-buttons { display: block; }
#share-buttons #fb-root div { left: 0; }
#share-buttons .item { float: left; }
.pluginButton button { *width: 35px!important;}
.fb_iframe_widget span, .fb_iframe_widget iframe { *width: 90px!important;}
#share-buttons .item.tweet { margin-left: -6px; }
#share-buttons:after { clear: both; content: '.'; display: block; visibility: hidden; }

/* start use */
#city_geo_container { display: inline; }
#component-dashboard-start-use-info .buttons .button { margin: 0 5px 0 0;}

/*friend recharge banner*/
#tab-other-buttons-container { width: 95%; color: #555555; display: block; margin: 0px 0px 25px}
#tab-other-buttons-container .btn-container { margin-bottom: 25px; display: block; max-width: 190px; }
#tab-other-buttons-container a { font-weight: 900!important;}
#tab-other-buttons-container .btn-container:nth-child(n+2) { margin: 0 25px; }
.button.tab-other-buttons { width: 170px!important; height: 30px!important; display: block;}
.button.btn-friend-recharge {background: url('/resource/buttons/friend_recharge_icon.png') 10px 50% no-repeat; padding-left: 30px !important; margin-bottom: 13px;}
.button.btn-goods-and-services {background: url('/resource/buttons/GoodsAndServices/good-service-icon-desktop.png') 10px 50% no-repeat; padding-left: 30px !important; margin-bottom: 13px;}


/*moreinfo_on*/
#page-moreinfo-on a { text-decoration: none;}
#page-moreinfo-on ul a { text-decoration: underline;}

/*reset password*/
#component-user-reset-password .text-input { margin: 7px 5px 0 0; }

/*webcall*/
#browser-webcall { width: 100%; height: 385px;}

/*retrieve_username*/
#form-retrieve-username .hide { display: none;}
#form-retrieve-username label { width: 100px;}
#form-retrieve-username .phonenumber { width: 121px;}
#form-retrieve-username #username, #prefix { display:inline; }

/*local agents-supported voip providers*/
#page-local-agents-supported-providers ul.site-list {
    margin-right: 50px;
}

.myloginform { display: none; }

#page-cheapcalls-india h3 { font-weight: 700; }
#page-cheapcalls-india .rates-item-container table { border-collapse: collapse; width: 90%; background-color: #f2f2f2; padding: 5px 15px; margin: 0 auto;}
#page-cheapcalls-india .rates-item-container table thead td { font-weight: bold; }
#page-cheapcalls-india .rates-item-container table td { padding: 5px 10px; }
#page-cheapcalls-india ul.testimonials { color: #999999; font-style: italic; }
#page-cheapcalls-india ul.testimonials li { margin-bottom: 10px; }
#page-cheapcalls-india ul.testimonials .customername { color: #000000; }

/*login*/
#page-login-main #component-login .text-input { border: 1px #969696 solid!important; border-radius: 5px!important;}
#page-login-main #component-login .failed-input { border: 2px #FF9696 solid!important;}
#page-login-main #component-login .captcha_img .refresh_captcha { background: url('/resource/icons/btn_refresh.png') no-repeat; display: block; width: 19px; height: 19px; float: left; margin-top: 15px; margin-left: 10px;}
#page-login-main #component-login #captcha_img { float: left;}
#page-login-main #component-login td.captcha_img { min-width: 235px;}
#page-login-main #component-login .button { border: 3px #FFFFFF solid; color: #FFFFFF; min-height: 30px;
    -webkit-box-shadow: 1px 1px 1px #666;
    -moz-box-shadow: 1px 1px 1px #666;
    box-shadow: 1px 1px 1px #666;
}
#page-login-main #component-login { min-width: 350px!important;}
#page-login-main #component-login .security_code { margin-bottom: 14px; padding: 0px!important;}
#page-login-main #component-login .security_code label { white-space: nowrap;}
.auth-form-block {
    background-color: #f9f9fc;
    border: 1px solid #ccc;
    padding: 20px;
    margin: 0px 0px 20px;
}
.auth-form-block label {
    display:block;
}
.auth-form-block .text-input { border: 1px #969696 solid!important; margin: 5px 0px 0px; width: 50px;}
.auth-header {
    padding: 10px 20px;
    border-radius: 3px;
    color: #ffffff;
}
.auth-header h3 {
    color: #ffffff;
    font-size: 14px;
    padding: 0px !important;
    margin: 0px !important;
}
#component-two-factor-auth .auth-form-block label {
    font-size: 14px;
    padding-bottom: 10px;
}
#component-two-factor-auth .auth-form-block b {
    font-size: 14px;
}

/*buy_credit login*/
.buycredits-login-panel #component-login .text-input { border: 1px #969696 solid!important; border-radius: 5px!important;}
.buycredits-login-panel #component-login .failed-input { border: 2px #FF9696 solid!important;}
#page-buycredits .refresh_captcha,
.buycredits-login-panel #component-login .captcha_img .refresh_captcha { background: url('/resource/icons/btn_refresh.png') no-repeat; display: block; width: 19px; height: 19px; float: left; margin-top: 15px; margin-left: 10px;}
#page-buycredits #captcha_img, .buycredits-login-panel #component-login #captcha_img { float: left;}
.buycredits-login-panel #component-login td.captcha_img { min-width: 235px;}
.buycredits-login-panel #component-login .button { border: 3px #FFFFFF solid; color: #FFFFFF; min-height: 30px;
    -webkit-box-shadow: 1px 1px 1px #666;
    -moz-box-shadow: 1px 1px 1px #666;
    box-shadow: 1px 1px 1px #666;
}
.buycredits-login-panel #component-login { min-width: 350px!important;}
.buycredits-login-panel #component-login .security_code { margin-bottom: 14px; padding: 0px!important;}
.buycredits-login-panel #component-login .security_code label { white-space: nowrap;}

/*panel login*/
.login-panel #component-login, .login-panel form.form-detail, .login-panel span.login-link { display: inline; }


/*customerservice login*/
#customerservice-login-form .text-input { border: 1px #969696 solid!important; border-radius: 5px!important;}
#customerservice-login-form .failed-input { border: 2px #FF9696 solid!important;}
#customerservice-login-form .captcha_img .refresh_captcha { background: url('/resource/icons/btn_refresh.png') no-repeat; display: block; width: 19px; height: 19px; float: left; margin-top: 15px; margin-left: 10px;}
#customerservice-login-form #captcha_img { float: left;}
#customerservice-login-form td.captcha_img { min-width: 235px;}
#customerservice-login-form .button { border: 3px #FFFFFF solid; color: #FFFFFF; min-height: 30px;
    -webkit-box-shadow: 1px 1px 1px #666;
    -moz-box-shadow: 1px 1px 1px #666;
    box-shadow: 1px 1px 1px #666;
}
#customerservice-login-form { min-width: 350px!important;}
#customerservice-login-form .security_code { margin-bottom: 14px; padding: 0px!important;}
#customerservice-login-form .security_code label { white-space: nowrap;}

/** mobile topup **/
#page-friend-recharge-info .download-container {
    display: block;
    text-align: center;
    width: 125px;
}
#page-friend-recharge-info .download-container a { margin-top: 5px; text-decoration: none; font-weight: 700; }


/*unsafe pass*/
.unsafe-pass-container { background-color: #F1F1F8; padding: 15px 20px; margin-bottom: 10px;}
.unsafe-pass-container h3{ color: red !important; font-size: 18px !important; }
.bordered-btn {
    border: 3px #FFFFFF solid !important;
    color: #FFFFFF;
    min-height: 30px;
    -webkit-box-shadow: 1px 1px 1px #666;
    -moz-box-shadow: 1px 1px 1px #666;
    box-shadow: 1px 1px 1px #666;
    margin-left: 10px;
}

#devices_wrapper{
    display:block;
    width:100%;
    margin: 30px 0px 0px;
}

#devices_wrapper .devices{
    display:inline-block;
    position:relative;
    width: 17%;
    margin: 0 1%;
    border: 1px solid #d0d0d0;
    background-color: #ffffff;
    border-radius: 7px;
    text-align:center;

}
#devices_wrapper .devices img{
    margin:16px auto 0 auto;
}
#devices_wrapper .devices h4{
    display:inline-block;
    margin-top: 20px;
    margin-bottom: 5px;
}
#devices_wrapper .device_active{
    background-color:#fff5f2;
    border: 1px solid #ff4000;
}
#devices_wrapper .device_active .device_active_tail{
    background-image: url("/resource/images/ways_to_call/img_downloads_tail_selected.png");
    display:block;
    position:absolute;
    width:24px;
    height:11px;
    bottom:-11px;
    margin:0 auto;
    left: 43%;
}

.check-list{
    list-style-image: url('/resource/images/ways_to_call/icon_check.png');
    text-align: left;
    margin-left: 35px;
    margin-bottom: 60px;
}

.check-list li{
    padding: 5px 0px;
    vertical-align: middle;
    font-size: 16px;
    letter-spacing: 2px;
}

.other-download-option h4{
    font-size: 20px;
}

.other-download-option a {
    color: #666 !important;
}

.other-download-option{
    color: #666;
    border: 1px solid #d0d0d0;
    min-height: 155px;
    background-color: #FFFFFF;
    height: 190px;
    font-family: Arial Narrow;
    font-size: 16px;
    padding: 10px 0 !important;
    width: 105% !important;
}
.other-download-option > div {
    float:none;
    display:inline-block;
    vertical-align:middle;
    margin-right:-4px;
}

.other-download-option .col-xs-3 {
    margin-right: -20px;
}

.other-download-option img {
    margin: 0 auto;
}

.other-download-option .col-xs-9 {
    height: 100%;
    padding-right: 2px;
}

.other-download-option .col-xs-9 a{
    position: absolute;
    bottom: 0;
}

.other-download-option a {
    color: #000000;
}
.sip-configuration { margin-bottom: 20px;}
#page-download_sip #download-content h4 { font-weight: bold;}
.sip-configuration h4 { margin-top: 30px;}
.sip-configuration table { width: 100%; border-radius: 10px; background-color: #FFFFFF; border-collapse: separate; border: 1px solid #D3D3D3;}
.sip-configuration td { padding: 3px 10px; line-height: 20px; font-size: 12px; font-weight: bold;}
.sip-configuration .software-configuration td:last-child { width: 270px;}

/*rates*/
.rates-currency-selection {
    width: 100%;
    height: 20px;
    clear: both;
}
.rates-currency-selection label, .rates-currency-selection select {
    float: left;
}
.rates-currency-selection label {
    margin-right: 10px;
    margin-top: 7px;
}
#select-rates-country {
    margin-left: 4px;
}
#component-user-revoke_email .text-input { width: 30px}

/* Cashu Directpay Message */
.cashu-directpay-message { border: 1px solid #ccc; background-color: #f9f9fc; width: 520px; padding: 20px;}
.cashu-directpay-message-box {
    width: 71px!important;
    overflow: hidden;
    height: 47px;
    display: block;
    background-color: #f1f1f1;
    padding: 3px 0;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
}
.cashu-directpay-message-box .logo { display: block; margin: 0 auto; }

/*cookies warning*/
#cookies-warning-msg,
.cookies .no-cookies-only,
.no-cookies .cookies-only,
.no-cookies #form-signup,
.no-cookies #webclient-form-login,
.no-cookies #component-login,
.no-cookies #component-login input.button.cookies-only {
    display: none;
}

.no-cookies #cookies-warning-msg,
.no-cookies #component-login.component-login-panel {
    display: block;
}

.no-cookies .text-inline.no-cookies-only {
    display: inline;
}

#securecode-modal .modal-info .images { transform: scale(0.7); }
#securecode-modal .modal-info { display: flex; height: inherit; align-items: center; }
#securecode-modal .modal-info h3 { color: #000;}
#securecode-modal .modal-info p { color: #888; line-height: 1.7 !important;}
#facebox .footer .close { display: none !important;}
#facebox .body {
    padding: 30px !important;
    border-radius: 4px !important;
    border: 0 !important;
    filter: drop-shadow(10px 10px 50px rgba(0, 0, 0, 0.3)) !important;
    min-height: 50px !important;
    min-width: 40em !important;
}
#facebox .body .content,
#facebox .body .content {
    max-height: 35em;
    max-width: 40em;

    h3 { color: #000;}
    p, span { color: #888; line-height: 1.7 !important;}
}

#facebox .notch {
    display: none;
    content: '';
    position: absolute;
    left: -10px; 
    bottom: 10px; 
    transform: rotate(90deg); 
    
    border-top: 10px solid #cfcfcf;
    border-bottom: 10px solid transparent;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent; 
}