/*------------------------------------*\ JANRAIN CAPTURE WIDGET JANRAIN.CSS \*------------------------------------*/ /* * Janrain.css acts as a base stylesheet for the capture widget which you can * extend/modify with your own theme stylesheet. * * Janrain.css aims to set a baseline of styling and standard coloring to elements * that could appear in your capture widget. * * This stylesheet containts a lot of comments, please take care to read and refer to them as you build. * * This file is purely a dev document and is not to be used for production. For production, * please only use a minified version that does not contain comments. * * The table of contents below maps to section titles of the same name, to jump * to any section simply find $[SECTION-TITLE]. * */ /** * * MODAL SCREENS........................Styles for screens that are in a modal * MODAL CLOSE CONFIRMATION.............Styles for screen that shows if there is a confirmation of closing a modal * GENERAL..............................Basic styles for all screens * FORM ELEMENTS........................Input, select, radio, checkbox, textarea, etc. * BUTTONS..............................Button sytling/coloring. * DATA DISPLAYS........................Styling for public profile data * * PUBLIC/PRIVATE PROFILE TOGGLES.......Public/private profile toggle styling for edit profile screen * ADDRESS, NAME, DATE BLOCKS...........Formatting for built in address, name and date blocks * LINKED ACCOUNT LIST..................Linked account list styles * PHOTO MANAGER........................Styles for displaying, uploading, cropping and removing profile photos * SCREEN SPECIFIC......................Screen specific styling * MERGE ACCOUNTS.......................Merge account screen styling * */ /*------------------------------------*\ $MODAL SCREENS \*------------------------------------*/ /* * Set z-index of modal and overlay */ #janrainModalOverlay { z-index: 5999918 !important; opacity: 0.75 !important; } #janrainModal { z-index: 5999920 !important; line-height: normal; } #janrainModal p { font-size: 13px; font-family: "BentonSans-Regular", Arial, Helvetica, sans-serif; line-height: 1.6; } /* * Defines styles for modal images */ #janrainModal .logo_image { width: auto; max-width: 400px; margin: 0 auto 20px; height: 81px; background: url('http://www.vancouversun.com/g00/2_d3d3LnZhbmNvdXZlcnN1bi5jb20%3D_/TU9SRVBIRVVTMTMkaHR0cDovL3d3dy52YW5jb3V2ZXJzdW4uY29tL2phbnJhaW4vaW1hZ2VzL21vZGFsX2xvZ28ucG5nP2kxMGMubWFyay5ub3RIVE1MLnR5cGU%3D_$/$/$/$') center center no-repeat; background-size: auto 81px; } /* * Defines background color of all screens that appear in a modal */ #janrainModal .janrain-capture-ui.capture-ui-content { padding: 15px; width: 600px; box-sizing: border-box; background-color: #fff; } #janrainModal .janrain_modal_closebutton { top: 15px; right: 15px; width: 20px; height: 20px; background: url('http://www.vancouversun.com/g00/2_d3d3LnZhbmNvdXZlcnN1bi5jb20%3D_/TU9SRVBIRVVTMTMkaHR0cDovL3d3dy52YW5jb3V2ZXJzdW4uY29tL2phbnJhaW4vaW1hZ2VzL21vZGFsX2Nsb3NlLnBuZz9pMTBjLm1hcmsubm90SFRNTC50eXBl_$/$/$/$') no-repeat; } /* * Heading styles for Capture Widget screens inside of modals. You can remove * these styles if you want to use the heading sytles already on your site. */ #janrainModal .janrain-capture-ui.capture-ui-content h1 { font-family: helvetica, arial; color: #333; font-size: 18px; font-weight: bold; line-height: inherit; letter-spacing: normal; } #janrainModal .janrain-capture-ui.capture-ui-content h2 { font-family: helvetica, arial; color: #333; font-size: 16px; font-weight: normal; line-height: 40px; text-align: center; letter-spacing: normal; } #janrainModal .janrain-capture-ui.capture-ui-content h3 { font-size: 15px; letter-spacing: normal; } #janrainModal .janrain-capture-ui.capture-ui-content h4 { font-size: 1.385em; } #janrainModal .janrain-capture-ui.capture-ui-content h5 { font-size: 1.077em; } /* * Header styles for Capture Widget screens inside of modals. * Provides vertically centered heading and underline. */ #janrainModal .capture_header { text-align:center; } #janrainModal .capture_header h1 { margin: 0; padding: 0; } /* * Form styles for Capture Widget screens inside of modals. * */ #janrainModal .modal_content { padding: 0px 35px; box-sizing: border-box; color: #333; } #janrainModal .modal_content p { color: #333; clear: both; } #janrainModal .capture_registrationForm .capture_form_item, #janrainModal .capture_socialRegistrationForm .capture_form_item { width: 50%; float: left; clear: none; } #janrainModal .capture_registrationForm .capture_form_item_emailAddress, #janrainModal .capture_registrationForm .capture_form_item_newPassword, #janrainModal .capture_socialRegistrationForm .capture_form_item_emailAddress { clear: both; } #janrainModal .capture_registrationForm .capture_form_item.capture_form_item_addressPostalCode, #janrainModal .capture_socialRegistrationForm .capture_form_item.capture_form_item_addressPostalCode { clear: none; } #janrainModal .capture_registrationForm .capture_form_item input, #janrainModal .capture_socialRegistrationForm .capture_form_item input { width: 95%; } /* * Footer styles for Capture Widget screens inside of modals. * Pins footer to bottom of modal, provides background color. */ #janrainModal .capture_footer { width: 100%; margin-top: 30px; padding: 0px; z-index: 5; zoom: 1; } #janrainModal .capture_footer:after { clear: both; content: ""; display: table; } #janrainModal .modal_footer { clear: both; text-align: center; margin-top: 30px; border-top: 1px solid #ccc; padding: 15px 15px 0px; } #janrainModal .mice-type { margin-bottom: 5px; } #janrainModal .footer_menu a, #janrainModal .mice-type { color: #959595; padding: 0px 5px; font-family: 'helvetica', 'arial', 'sans-serif'; font-size: 13px; } #janrainModal .footer_menu a:hover { text-decoration: underline; } #janrainModal .footer_menu a:first-child { border-right: 1px solid #959595; } /* * Miscellaneous user/error messages to display in a modal */ #janrainModal .janrain-capture-ui.capture-ui-content .capture_fatal_error { margin-bottom: 15px; } /* * Adjustments to fatal error messages for screens that don't require padding. */ #janrainModal .janrain-capture-ui.capture-ui-content#signIn .capture_fatal_error, #janrainModal .janrain-capture-ui.capture-ui-content#returnSocial .capture_fatal_error, #janrainModal .janrain-capture-ui.capture-ui-content#returnTraditional .capture_fatal_error { margin-left: 20px; margin-right: 20px; } #janrainModal .janrain-capture-ui.capture-ui-content .capture_access, #janrainModal .janrain-capture-ui.capture-ui-content .capture_retrieving { box-shadow: none; margin: 0 0 0 -150px; moz-box-shadow: none; o-box-shadow: none; padding: 0 0 0 40px; webkit-box-shadow: none; } /*------------------------------------*\ $MODAL CLOSE CONFIRMATION \*------------------------------------*/ .janrain_close_confirm_container { border-radius: 10px; font-family: helvetica,sans-serif; font-size: 13px; khtml-border-radius: 10px; line-height: 17px; moz-border-radius: 10px; ms-border-radius: 10px; o-border-radius: 10px; webkit-border-radius: 10px; } .janrain_close_confirm_container .janrain_close_confirm { color: white; } .janrain_close_confirm_container .janrain_close_confirm h3 { color: #fff; font-size: 1.077em; font-weight: normal; margin: 0; padding: 0 0 5px; text-shadow: none; } .janrain_close_confirm_container .janrain_close_confirm .janrain_modal_confirm { background: linear-gradient(top, #34c5ff,#0092cd); background: -moz-linear-gradient(top, #34c5ff,#0092cd); background: -ms-linear-gradient(top, #34c5ff,#0092cd); background: -o-linear-gradient(top, #34c5ff,#0092cd); background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #34c5ff), color-stop(100%, #0092cd)); background: -webkit-linear-gradient(top, #34c5ff,#0092cd); background-color: #009ddc; box-shadow: 0 1px 0px 0px rgba(255,255,255,0.35) inset,0 -26px 13px -13px rgba(0,0,0,0.2) inset; color: #fff; moz-box-shadow: 0 1px 0px 0px rgba(255,255,255,0.35) inset,0 -26px 13px -13px rgba(0,0,0,0.2) inset; o-box-shadow: 0 1px 0px 0px rgba(255,255,255,0.35) inset,0 -26px 13px -13px rgba(0,0,0,0.2) inset; text-shadow: 0 1px 1px rgba(0,0,0,0.45); webkit-box-shadow: 0 1px 0px 0px rgba(255,255,255,0.35) inset,0 -26px 13px -13px rgba(0,0,0,0.2) inset; } .janrain_close_confirm_container .janrain_close_confirm .janrain_modal_cancel { background-color: #f6f6f6; box-shadow: 0 1px 0px 0px rgba(255,255,255,0.35) inset,0 -26px 13px -13px rgba(0,0,0,0.2) inset; color: #333; moz-box-shadow: 0 1px 0px 0px rgba(255,255,255,0.35) inset,0 -26px 13px -13px rgba(0,0,0,0.2) inset; o-box-shadow: 0 1px 0px 0px rgba(255,255,255,0.35) inset,0 -26px 13px -13px rgba(0,0,0,0.2) inset; webkit-box-shadow: 0 1px 0px 0px rgba(255,255,255,0.35) inset,0 -26px 13px -13px rgba(0,0,0,0.2) inset; } /*------------------------------------*\ $GENERAL \*------------------------------------*/ /* * Basic screen styling. Defines font size for all content in screens */ .janrain-capture-ui { background-color: transparent; color: #666; font-family: helvetica,sans-serif; font-size: 13px; line-height: inherit; } /* * Default width of an embedded screen */ .janrain-capture-ui.capture-ui-content { width: 600px; } /* * Link colors. Can be removed if you want to use the link colors from your site CSS. */ .janrain-capture-ui a, .janrain-capture-ui a:visited, .janrain-capture-ui a:link { color: #009ddc; font-size: 13px; text-decoration: none; } .janrain-capture-ui a:hover { color: #006690; } /* * Errors that appear at the top of the screen if a fatal error has occured */ .janrain-capture-ui .capture_fatal_error { background-image: none; border: 1px solid #ccc; color: #cf0808; padding: 10px; font-size: 12px; font-weight: bold; margin-bottom: 30px; } .janrain-capture-ui .capture_fatal_error:first-letter { text-transform: capitalize; } /* * Errors that appear at the top of a form if a form error has occured server-side */ .janrain-capture-ui .capture_form_error, .capture_photo_chooser_errors { background-image: none; color: #f58002; } /* * Save message that appears when a profile is successfully saved. */ .janrain-capture-ui .capture_save_success { color: #2b9202; font-weight: bold; display: inline-block; display: -moz-inline-box; margin-left: 10px; moz-box-orient: vertical; vertical-align: auto; vertical-align: middle; } .janrain-capture-ui .capture_save_success { *display: inline; } /* * Hide sections that don't apply to social accounts. * These will get displayed through js if traditional acct. */ .janrain-capture-ui .janrain_traditional_account_only { display: none; } /* * Misc. general styling */ .janrain-capture-ui .capture_dashed { border: 1px #ccc dashed; } .janrain-capture-ui .capture_border { border: 1px solid #ccc; } /* * Secondary brand background color and how certain elements should look when placed within. * Used on signin and traditional return experience to divide content area */ .janrain-capture-ui .capture_backgroundColor { background-color: #fff; color: #666; } .janrain-capture-ui .capture_backgroundColor .capture_text_input, .janrain-capture-ui .capture_backgroundColor .capture_checkbox, .janrain-capture-ui .capture_backgroundColor .capture_radio, .janrain-capture-ui .capture_backgroundColor .capture_inputPlaceholder, .janrain-capture-ui .capture_backgroundColor .capture_select, .janrain-capture-ui .capture_backgroundColor .capture_textarea, .janrain-capture-ui .capture_backgroundColor .capture_checkbox, .janrain-capture-ui .capture_backgroundColor .capture_radio { background-color: #fff; } .janrain-capture-ui .capture_backgroundColor .capture_text_input:focus, .janrain-capture-ui .capture_backgroundColor .capture_checkbox:focus, .janrain-capture-ui .capture_backgroundColor .capture_radio:focus, .janrain-capture-ui .capture_backgroundColor .capture_inputPlaceholder:focus, .janrain-capture-ui .capture_backgroundColor .capture_select:focus, .janrain-capture-ui .capture_backgroundColor .capture_textarea:focus, .janrain-capture-ui .capture_backgroundColor .capture_checkbox:focus, .janrain-capture-ui .capture_backgroundColor .capture_radio:focus { background-color: #fff; } /*------------------------------------*\ $FORM ELEMENTS \*------------------------------------*/ /* * Wrapping, parent container for form items */ .janrain-capture-ui .capture_form_item { min-height: 0; } /* * Labels for form items. Hidden by default but still accessible by screen readers. */ .janrain-capture-ui .capture_form_item>label { color: #333; overflow: visible; display: inline-block; margin: 0px 0px 10px; display: none; } /* * Input, select, radio, checkbox, textarea styling */ .janrain-capture-ui .capture_text_input, .janrain-capture-ui .capture_checkbox, .janrain-capture-ui .capture_radio, .janrain-capture-ui .capture_inputPlaceholder, .janrain-capture-ui .capture_select, .janrain-capture-ui .capture_textarea { background-color: #ffffff; border: 1px solid #aaa; border-radius: 3px; box-shadow: 0 1px 2px 0 rgba(0,0,0,0.15) inset; color: #b3b3b3; font-family: helvetica,sans-serif; font-size: 14px; khtml-border-radius: 3px; margin-left: 0; margin-right: 0; moz-border-radius: 3px; moz-box-shadow: 0 1px 2px 0 rgba(0,0,0,0.15) inset; ms-border-radius: 3px; o-border-radius: 3px; o-box-shadow: 0 1px 2px 0 rgba(0,0,0,0.15) inset; webkit-border-radius: 3px; webkit-box-shadow: 0 1px 2px 0 rgba(0,0,0,0.15) inset; } /* * Input, select, radio, checkbox, textarea focused styling */ .janrain-capture-ui .capture_text_input:focus, .janrain-capture-ui .capture_checkbox:focus, .janrain-capture-ui .capture_radio:focus, .janrain-capture-ui .capture_inputPlaceholder:focus, .janrain-capture-ui .capture_select:focus, .janrain-capture-ui .capture_textarea:focus { border: 1px solid #009ddc; color: #333; } /* * Input, select, radio, checkbox, textarea box sizing */ .janrain-capture-ui .capture_text_input, .janrain-capture-ui .capture_checkbox, .janrain-capture-ui .capture_radio, .janrain-capture-ui .capture_inputPlaceholder, .janrain-capture-ui .capture_textarea, .janrain-capture-ui .capture_inputPlaceholder { box-sizing: border-box; color: #333; display: inline-block; display: -moz-inline-box; moz-box-orient: vertical; moz-box-sizing: border-box; ms-box-sizing: border-box; vertical-align: auto; vertical-align: middle; webkit-box-sizing: border-box; width: 100%; } /* * Old IE inline-block fix */ .janrain-capture-ui .capture_text_input, .janrain-capture-ui .capture_checkbox, .janrain-capture-ui .capture_radio, .janrain-capture-ui .capture_inputPlaceholder, .janrain-capture-ui .capture_textarea, .janrain-capture-ui .capture_inputPlaceholder { *display: inline; } /* * Input, select, radio, checkbox, textarea placeholder colors */ .janrain-capture-ui .capture_text_input::-webkit-input-placeholder, .janrain-capture-ui .capture_checkbox::-webkit-input-placeholder, .janrain-capture-ui .capture_textarea::-webkit-input-placeholder, .janrain-capture-ui .capture_inputPlaceholder::-webkit-input-placeholder, .janrain-capture-ui .capture_radio::-webkit-input-placeholder { color: #b3b3b3; } .janrain-capture-ui .capture_inputPlaceholder::-webkit-input-placeholder, .janrain-capture-ui .capture_text_input:-ms-input-placeholder, .janrain-capture-ui .capture_checkbox:-ms-input-placeholder, .janrain-capture-ui .capture_radio:-ms-input-placeholder, .janrain-capture-ui .capture_inputPlaceholder:-ms-input-placeholder, .janrain-capture-ui .capture_textarea:-ms-input-placeholder { color: #b3b3b3; } .janrain-capture-ui .capture_text_input:-moz-placeholder, .janrain-capture-ui .capture_checkbox:-moz-placeholder, .janrain-capture-ui .capture_textarea:-moz-placeholder, .janrain-capture-ui .capture_radio:-moz-placeholder, .janrain-capture-ui .capture_inputPlaceholder:-moz-placeholder { color:#b3b3b3 } /* * Select specific styling/placeholder colors */ .janrain-capture-ui .capture_select { box-sizing: border-box; color: #333; moz-box-sizing: border-box; ms-box-sizing: border-box; webkit-box-sizing: border-box; width: 100%; } .janrain-capture-ui .capture_select.capture_disabled { color: #b3b3b3; } .janrain-capture-ui .capture_select.capture_disabled:focus { color: #333; } /* * Checkbox/radio specific styling */ .janrain-capture-ui .capture_checkbox, .janrain-capture-ui .capture_radio { border: 0; box-shadow: none; moz-box-shadow: none; o-box-shadow: none; webkit-box-shadow: none; } .janrain-capture-ui .capture_checkbox label, .janrain-capture-ui .capture_radio label { font-size: 13px; } /* * Vertically center checkbox/radio input within label wrapper */ .janrain-capture-ui .capture_checkbox .capture_input_radio, .janrain-capture-ui .capture_form_collection .capture_input_radio, .janrain-capture-ui .capture_checkbox .capture_input_checkbox, .janrain-capture-ui .capture_form_collection .capture_input_checkbox, .janrain-capture-ui .capture_radio .capture_input_radio, .janrain-capture-ui .capture_radio .capture_input_checkbox { margin-top: -8px; top: 50%; } /* * Coloring of input tips based on state of wrapping container */ .janrain-capture-ui .capture_form_item .capture_tip { color: #aaa; } .janrain-capture-ui .capture_form_item.capture_focused .capture_tip { color: #333; } .janrain-capture-ui .capture_form_item .capture_tip_validating { color: #aaa; } .janrain-capture-ui .capture_form_item .capture_tip_validated { color: #aaa; } .janrain-capture-ui .capture_form_item .capture_tip_error { color: #f58002; } .janrain-capture-ui .capture_form_item .capture_btn { margin: 0; } /* * Styling of form elements when the wrapping container has error class */ .janrain-capture-ui .capture_error .capture_radio, .janrain-capture-ui .capture_error .capture_checkbox, .janrain-capture-ui .capture_error .capture_text_input, .janrain-capture-ui .capture_error .capture_checkbox, .janrain-capture-ui .capture_error .capture_radio, .janrain-capture-ui .capture_error .capture_inputPlaceholder { border: 1px solid #f58002; box-shadow: 0 0 3px rgba(245,148,2,0.3) inset; moz-box-shadow: 0 0 3px rgba(245,148,2,0.3) inset; o-box-shadow: 0 0 3px rgba(245,148,2,0.3) inset; webkit-box-shadow: 0 0 3px rgba(245,148,2,0.3) inset; } /* * Dummy input styling if a blank input looking container is needed. */ .janrain-capture-ui .capture_inputPlaceholder { border: 0; box-shadow: none; moz-box-shadow: none; o-box-shadow: none; webkit-box-shadow: none; } /*------------------------------------*\ $DATA DISPLAYS \*------------------------------------*/ .janrain-capture-ui .capture_data_item { clear: both; margin-bottom: 15px; zoom: 1; } .janrain-capture-ui .capture_data_item:after { clear: both; content: ""; display: table; } .janrain-capture-ui .capture_data_item label { float: left; margin-right: 1%; text-align: right; width: 39%; } .janrain-capture-ui .capture_data_item .capture_data { float: left; width: 60%; } /*------------------------------------*\ $BUTTONS \*------------------------------------*/ .janrain-capture-ui .capture_btn, .janrain-capture-ui a.capture_btn, .janrain-capture-ui button.capture_btn, .janrain-capture-ui input.capture_btn, .janrain-capture-ui .capture_backButton { width: 48%; height: 35px; text-decoration: none; border-radius: initial; font-family: helvetica, arial, sans-serif; font-size: 14px; line-height: 35px; text-align: center; padding: 0px; margin: 20px 5px 0px 0px; -webkit-appearance: none; } .janrain-capture-ui .capture_btn, .janrain-capture-ui a.capture_btn, .janrain-capture-ui button.capture_btn, .janrain-capture-ui input.capture_btn { background-color: #1479bf; color: #ffffff; font-weight: bold; } .janrain-capture-ui .capture_btn:hover, .janrain-capture-ui a.capture_btn:hover, .janrain-capture-ui button.capture_btn:hover, .janrain-capture-ui input.capture_btn:hover { background-color: #0768ab; } .janrain-capture-ui button.capture_btn.capture_backButton { background-color: #e1e1e1; color: #4b4b4b; } .janrain-capture-ui button.capture_btn.capture_backButton:hover { background-color: #d0d0d0; } /* * Styles for primary buttons */ .janrain-capture-ui a.capture_btn.capture_primary { line-height: 36px; } /* * Colors for secondary buttons */ .janrain-capture-ui .capture_secondary, .janrain-capture-ui a.capture_secondary, .janrain-capture-ui button.capture_secondary, .janrain-capture-ui input.capture_secondary { background: linear-gradient(top, #f6f6f6,#dddddd); background: -moz-linear-gradient(top, #f6f6f6,#dddddd); background: -ms-linear-gradient(top, #f6f6f6,#dddddd); background: -o-linear-gradient(top, #f6f6f6,#dddddd); background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #f6f6f6), color-stop(100%, #dddddd)); background: -webkit-linear-gradient(top, #f6f6f6,#dddddd); background-color: #f6f6f6; box-shadow: 0 1px 0 0 rgba(255,255,255,0.35) inset; color: #009ddc; moz-box-shadow: 0 1px 0 0 rgba(255,255,255,0.35) inset; o-box-shadow: 0 1px 0 0 rgba(255,255,255,0.35) inset; text-decoration: none; text-shadow: none; webkit-box-shadow: 0 1px 0 0 rgba(255,255,255,0.35) inset; } .janrain-capture-ui a.capture_secondary:visited, .janrain-capture-ui a.capture_secondary:link, .janrain-capture-ui a.capture_secondary:hover { color: #333; } /* * Class for a button to take up half of it's parent container */ .janrain-capture-ui .capture_btn_half, .janrain-capture-ui a.capture_btn_half, .janrain-capture-ui button.capture_btn_half, .janrain-capture-ui input.capture_btn_half { box-sizing: border-box; margin: 0 1%; moz-box-sizing: border-box; ms-box-sizing: border-box; padding-left: 5px; padding-right: 5px; webkit-box-sizing: border-box; width: 48%; line-height: 43px; } /* * Class for a button to take up 100% of it's parent container */ .janrain-capture-ui .capture_btn_full, .janrain-capture-ui a.capture_btn_full, .janrain-capture-ui button.capture_btn_full, .janrain-capture-ui input.capture_btn_full { box-sizing: border-box; margin: 0; moz-box-sizing: border-box; ms-box-sizing: border-box; webkit-box-sizing: border-box; width: 100%; } /* * Buttons that have been clicked get replaced with a div with this class */ .janrain-capture-ui .capture_processing { background-color: none; border: none !important; box-shadow: none; moz-box-shadow: none; o-box-shadow: none; webkit-box-shadow: none; } .janrain-capture-ui .capture_backButton { background-image: none; } .janrain-capture-ui .capture_backButton span { background-image: none; line-height: inherit; } .janrain-capture-ui .capture_backgroundColor .capture_secondary { border: 1px solid #ddd; border-width: 1px 1px 0 1px; } /*------------------------------------*\ $PUBLIC/PRIVATE PROFILE TOGGLES \*------------------------------------*/ .janrain-capture-ui .capture_display_toggle_wrap { border-radius: 4px; font-size: 12px; khtml-border-radius: 4px; left: 100%; line-height: 16px; moz-border-radius: 4px; ms-border-radius: 4px; o-border-radius: 4px; top: 20px; webkit-border-radius: 4px; } .janrain-capture-ui .capture_display_toggle:hover { background-color: #f6f6f6; } .janrain-capture-ui .capture_display_toggle_disabled { color: #ccc; } .janrain-capture-ui .capture_display_toggle_disabled:hover { background-color: transparent; cursor: none; } /*------------------------------------*\ $ADDRESS, NAME, DATE BLOCKS \*------------------------------------*/ .janrain-capture-ui .capture_form_item.capture_addressBlock .capture_form_item_addressDrop_city_, .janrain-capture-ui .capture_form_item.capture_addressBlock .capture_form_item_addressDrop_stateprovince_, .janrain-capture-ui .capture_form_item.capture_addressBlock .capture_form_item_addressDrop_zippostalcode_, .janrain-capture-ui .capture_form_item.capture_addressBlock .capture_form_item_editProfile_addressDrop_city_, .janrain-capture-ui .capture_form_item.capture_addressBlock .capture_form_item_editProfile_addressDrop_stateprovince_, .janrain-capture-ui .capture_form_item.capture_addressBlock .capture_form_item_editProfile_addressDrop_zippostalcode_ { display: inline-block; display: -moz-inline-box; margin-left: 1%; moz-box-orient: vertical; vertical-align: auto; vertical-align: middle; } .janrain-capture-ui .capture_form_item.capture_addressBlock .capture_tip_validating, .janrain-capture-ui .capture_form_item.capture_addressBlock .capture_tip_error, .janrain-capture-ui .capture_form_item.capture_addressBlock .capture_tip_validated { left: 290px; position: absolute; top: 10px; } .janrain-capture-ui .capture_form_item.capture_addressBlock .capture_form_item_addressDrop_city_ { margin-left: 0; width: 43%; } .janrain-capture-ui .capture_form_item.capture_addressBlock .capture_form_item_addressDrop_stateprovince_ { width: 25%; } .janrain-capture-ui .capture_form_item.capture_addressBlock .capture_form_item_addressDrop_zippostalcode_ { width: 30%; } .janrain-capture-ui .capture_dateselect_day, .janrain-capture-ui .capture_dateselect_month, .janrain-capture-ui .capture_dateselect_year { display: inline-block; display: -moz-inline-box; margin-left: 1%; moz-box-orient: vertical; vertical-align: auto; vertical-align: middle; } .janrain-capture-ui .capture_dateselect_day, .janrain-capture-ui .capture_dateselect_month, .janrain-capture-ui .capture_dateselect_year { *display: inline; } .janrain-capture-ui .capture_dateselect_month { margin-left: 0; width: 40%; } .janrain-capture-ui .capture_dateselect_day { width: 18%; } .janrain-capture-ui .capture_dateselect_year { width: 40%; } .janrain-capture-ui .capture_nameBlock .capture_form_item, .janrain-capture-ui .capture_addressBlock .capture_form_item { margin-bottom: 0; min-height: 0; } /*------------------------------------*\ $LINKED ACCOUNT LIST \*------------------------------------*/ .janrain-capture-ui .capture_provider { margin: 0; } .janrain-capture-ui .capture_provider li { background-color: #f6f6f6; border-radius: 5px; khtml-border-radius: 5px; moz-border-radius: 5px; ms-border-radius: 5px; o-border-radius: 5px; webkit-border-radius: 5px; } /* * Styles the add new link differently */ .janrain-capture-ui .capture_provider li.capture_linkAccount { background-color: transparent; margin: 0; padding: 0; } /* * positions the 'x' button */ .janrain-capture-ui .capture_provider li .capture_remove { cursor: pointer; position: absolute; right: 0; } /*------------------------------------*\ $PHOTO MANAGER \*------------------------------------*/ /* * Displays profile photo at a specified size. All items widths and heights below should match. */ .janrain-capture-ui #profile_pic { height: 150px; overflow: hidden; } .janrain-capture-ui .capture_profile_pic { height: 150px; margin: 0 auto 20px auto; width: 150px; } .janrain-capture-ui #profile_pic img { width: 150px; } /* * Displays smaller profile photo for upload screen */ .janrain-capture-ui#capture_editProfile_photoManager_uploadphotoscreen .capture_profile_pic{ width: 100px; height: 100px; } /* *