body { background-color: #EEECE5 !important; overflow-x: hidden !important; font-family: Satoshi-Variable,Arial,Helvetica,sans-serif !important; } h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 { color: #003078 !important; } /* Make ONLY the dialog close (X) icon white */ .ui-dialog .ui-dialog-titlebar-close { /* replace theme's black close.svg */ /* background-color: var(--bell-dark-blue);*/ background-image: url("../images/icons/Close Button.png") !important; background-repeat: no-repeat !important; background-position: center center !important; background-size: 36px 36px !important; /* keep the button�s size/positioning consistent */ width: 20px; height: 20px; border: none; background-color: #ffffff !important; } .route-ibm-apimnoperms .main-container.container { background-image: url("../images/icons/warning.png") !important; background-repeat: no-repeat !important; background-position: center 96px !important; background-size: 36px 36px !important; background-color: #ffffff !important; } .route-ibm-apimsubscription-wizardstep .apicMainContent .subscription-wizard-choose-plan .button.apicTertiary { margin: 0 0 1rem 85% !important; } .ibmapimNoPermissions .mainContent { font-family: var(--bell-font-bellslimrevheavy); font-size: 40px !important; text-align: center !important; margin: 0 !important; } .ibmapimNoPermissions .contactLink { padding: 18px; text-align: center; } .route-ibm-apimnoperms .main-container.container .noPermsContentWrapper { padding: 100px 2rem 2rem 0px !important; } .cds--tag--magenta { background-color: var(--cds-tag-background-magenta, #ffd6e8) !important; color: var(--cds-tag-color-magenta, #9f1853) !important; } .applicationWrapper header.titleSection .breadcrumb a, .apiWrapper header.titleSection .breadcrumb a, .ibmapimGetStarted header .homepageLink.breadcrumb a, .apicProduct .breadcrumb a, .productApiWrapper .breadcrumb a, .breadcrumb a { color: #111111 !important; } /*Login page logo fix*/ .apic-user-form-header { display: inline-block; width: 150px; /* match image width */ height: 40px; background-image: url('../images/Login.png'); text-indent: -9999px; overflow: hidden; white-space: nowrap; background-repeat: no-repeat; background-size: contain; background-position: left; margin-left: 44px !important; } .page-header-logo { display: inline-block; width: 150px; /* match image width */ height: 40px; background-image: url('../images/icons/warning.png'); background-repeat: no-repeat; background-size: contain; background-position: center; } nav.block-login ul.nav > li > a, nav.block-login ul.nav > li > a:visited { text-decoration: none !important; margin-top: -4px !important; } svg.ext { width: 19px !important; height: 16px !important; stroke: var(--bell-dark-link-blue) !important; stroke-width: 4px !important; } .route-system404 .main-container.container, .route-system403 .main-container.container, .route-system401 .main-container.container { background-image: none !important; background-color: #ffffff !important; text-align: center !important; } #user-register-form .apic-user-form-subheader { display: none !important; } .apic-user-form-registries a.registry-button { width: 100%; justify-content: center; } .route-ibm-apimactivity .extraMenu.apicMyOrgActions, .route-ibm-apimanalytics .extraMenu.apicMyOrgActions { display: none !important; } /*.apicMyOrg .apicMyOrgActions{ display:none !important; }*/ .route-system404 .main-container.container .row .col-sm-12, .route-system403 .main-container.container .row .col-sm-12, .route-system401 .main-container.container .row .col-sm-12 { width: 100% !important; } .route-system404 .main-container.container .row .col-sm-12 h1.page-header-error, .route-system403 .main-container.container .row .col-sm-12 h1.page-header-error, .route-system401 .main-container.container .row .col-sm-12 h1.page-header-error { font-family: Satoshi-Variable, Arial, Helvetica, sans-serif !important; font-size: 14px !important; line-height: 18px !important; color: #555 !important; } h1.productName { font-family: Satoshi-Medium,Arial,Helvetica,sans-serif !important; font-weight: 400 !important; } .bx--global-light-ui .button.apicTertiary, .bx--global-light-ui button.apicTertiary, .bx--global-light-ui button.bx--btn--tertiary { border: 1px solid #E1E1E1 !important; } .apicSubscribeAppForm a.add-app.bx--card { background: #003078 !important; color: var(--bell-white) !important; } .apicWizardMain .apicNewAppButton .tile-button:hover { background: var(--bell-dark-blue) !important; color: var(--bell-white) !important; text-decoration: none !important; } .bx--global-light-ui a.button { border-radius: 21px; } .bx--global-light-ui a.button#edit-cancel { color: #003078 !important; background: #ffffff !important; border-color: #E1E1E1 !important; } .bx--global-light-ui button#edit-cancel { color: #003078 !important; background: #ffffff !important; border-color: #E1E1E1 !important; } .route-apic-appcreate .main-container .row .form-item input, .route-apic-appcreate .main-container .row .form-item textarea, .route-apic-appcreate .main-container .row .form-item select, .route-apic-appcreate-step-two .main-container .row .form-item input, .route-apic-appcreate-step-two .main-container .row .form-item textarea, .route-apic-appcreate-step-two .main-container .row .form-item select, .route-applicationcreate .main-container .row .form-item input, .route-applicationcreate .main-container .row .form-item textarea, .route-applicationcreate .main-container .row .form-item select, .route-applicationcreate-step-two .main-container .row .form-item input, .route-applicationcreate-step-two .main-container .row .form-item textarea, .route-applicationcreate-step-two .main-container .row .form-item select, .route-apic-appverify-clientsecret .main-container .row .form-item input, .route-apic-appverify-clientsecret .main-container .row .form-item textarea, .route-apic-appverify-clientsecret .main-container .row .form-item select, .route-apic-appcredentials-create .main-container .row .form-item input, .route-apic-appcredentials-create .main-container .row .form-item textarea, .route-apic-appcredentials-create .main-container .row .form-item select, .route-apic-appreset-clientid .main-container .row .form-item input, .route-apic-appreset-clientid .main-container .row .form-item textarea, .route-apic-appreset-clientid .main-container .row .form-item select, .route-apic-appreset-clientsecret .main-container .row .form-item input, .route-apic-appreset-clientsecret .main-container .row .form-item textarea, .route-apic-appreset-clientsecret .main-container .row .form-item select, .route-apic-appcredentials-update .main-container .row .form-item input, .route-apic-appcredentials-update .main-container .row .form-item textarea, .route-apic-appcredentials-update .main-container .row .form-item select, .route-apic-appcredentials-delete .main-container .row .form-item input, .route-apic-appcredentials-delete .main-container .row .form-item textarea, .route-apic-appcredentials-delete .main-container .row .form-item select, .route-apic-appupdate .main-container .row .form-item input, .route-apic-appupdate .main-container .row .form-item textarea, .route-apic-appupdate .main-container .row .form-item select, .route-apic-appdelete .main-container .row .form-item input, .route-apic-appdelete .main-container .row .form-item textarea, .route-apic-appdelete .main-container .row .form-item select, .route-apic-apppromote .main-container .row .form-item input, .route-apic-apppromote .main-container .row .form-item textarea, .route-apic-apppromote .main-container .row .form-item select, .route-apic-appimage-upload .main-container .row .form-item input, .route-apic-appimage-upload .main-container .row .form-item textarea, .route-apic-appimage-upload .main-container .row .form-item select, .route-apic-appimage-delete .main-container .row .form-item input, .route-apic-appimage-delete .main-container .row .form-item textarea, .route-apic-appimage-delete .main-container .row .form-item select, .route-auth-apicdeleteuser .main-container .row .form-item input, .route-auth-apicdeleteuser .main-container .row .form-item textarea, .route-auth-apicdeleteuser .main-container .row .form-item select, .route-consumerorgchange-member-role .main-container .row .form-item input, .route-consumerorgchange-member-role .main-container .row .form-item textarea, .route-consumerorgchange-member-role .main-container .row .form-item select, .route-consumerorgcreate .main-container .row .form-item input, .route-consumerorgcreate .main-container .row .form-item textarea, .route-consumerorgcreate .main-container .row .form-item select, .route-consumerorgupdate .main-container .row .form-item input, .route-consumerorgupdate .main-container .row .form-item textarea, .route-consumerorgupdate .main-container .row .form-item select, .route-consumerorgdelete .main-container .row .form-item input, .route-consumerorgdelete .main-container .row .form-item textarea, .route-consumerorgdelete .main-container .row .form-item select, .route-consumerorgchangeowner .main-container .row .form-item input, .route-consumerorgchangeowner .main-container .row .form-item textarea, .route-consumerorgchangeowner .main-container .row .form-item select, .route-consumerorginvite .main-container .row .form-item input, .route-consumerorginvite .main-container .row .form-item textarea, .route-consumerorginvite .main-container .row .form-item select, .route-consumerorgremove-user .main-container .row .form-item input, .route-consumerorgremove-user .main-container .row .form-item textarea, .route-consumerorgremove-user .main-container .row .form-item select, .route-consumerorgresend-invite .main-container .row .form-item input, .route-consumerorgresend-invite .main-container .row .form-item textarea, .route-consumerorgresend-invite .main-container .row .form-item select, .route-change-pwd-pagechange-password-form .main-container .row .apic-change-pwd-form .form-item input, .route-change-pwd-pagechange-password-form .main-container .row .apic-change-pwd-form .form-item textarea, .route-change-pwd-pagechange-password-form .main-container .row .apic-change-pwd-form .form-item select, .route-entityuseredit-form .main-container .row .user-form .form-item input, .route-entityuseredit-form .main-container .row .user-form .form-item textarea, .route-entityuseredit-form .main-container .row .user-form .form-item select, .route-ibm-apimsubscription-wizardnoplan .modal-dialog .form-item input .form-item input, .route-ibm-apimsubscription-wizardnoplan .modal-dialog .form-item input .form-item textarea, .route-ibm-apimsubscription-wizardnoplan .modal-dialog .form-item input .form-item select, .route-consumerorgbilling-add-payment .main-container .row .form-item input, .route-consumerorgbilling-add-payment .main-container .row .form-item textarea, .route-consumerorgbilling-add-payment .main-container .row .form-item select, .route-consumerorgbilling-delete-payment .main-container .row .form-item input, .route-consumerorgbilling-delete-payment .main-container .row .form-item textarea, .route-consumerorgbilling-delete-payment .main-container .row .form-item select, .route-change-pwd-pagechange-password-form.pass-reset .main-container .row .form-item input, .route-change-pwd-pagechange-password-form.pass-reset .main-container .row .form-item textarea, .route-change-pwd-pagechange-password-form.pass-reset .main-container .row .form-item select, .route-apic-appdisplay-creds .main-container .row .form-item input, .route-apic-appdisplay-creds .main-container .row .form-item textarea, .route-apic-appdisplay-creds .main-container .row .form-item select, form.user-pass-reset .form-item textarea, form.user-pass-reset .form-item select, .apic-user-form .form-item textarea, .apic-user-form .form-item select { border-bottom: 1px solid rgba(17, 17, 17, 0.16) !important; } .route-apic-appcreate .main-container .row .form-item input:hover, .route-apic-appcreate-step-two .main-container .row .form-item input:hover, .route-applicationcreate .main-container .row .form-item input:hover, .route-applicationcreate-step-two .main-container .row .form-item input:hover, .route-apic-appverify-clientsecret .main-container .row .form-item input:hover, .route-apic-appcredentials-create .main-container .row .form-item input:hover, .route-apic-appreset-clientid .main-container .row .form-item input:hover, .route-apic-appreset-clientsecret .main-container .row .form-item input:hover, .route-apic-appcredentials-update .main-container .row .form-item input:hover, .route-apic-appcredentials-delete .main-container .row .form-item input:hover, .route-apic-appupdate .main-container .row .form-item input:hover, .route-apic-appdelete .main-container .row .form-item input:hover, .route-apic-apppromote .main-container .row .form-item input:hover, .route-apic-appimage-upload .main-container .row .form-item input:hover, .route-apic-appimage-delete .main-container .row .form-item input:hover, .route-auth-apicdeleteuser .main-container .row .form-item input:hover, .route-consumerorgchange-member-role .main-container .row .form-item input:hover, .route-consumerorgcreate .main-container .row .form-item input:hover, .route-consumerorgupdate .main-container .row .form-item input:hover, .route-consumerorgdelete .main-container .row .form-item input:hover, .route-consumerorgchangeowner .main-container .row .form-item input:hover, .route-consumerorginvite .main-container .row .form-item input:hover, .route-consumerorgremove-user .main-container .row .form-item input:hover, .route-consumerorgresend-invite .main-container .row .form-item input:hover, .route-change-pwd-pagechange-password-form .main-container .row .apic-change-pwd-form .form-item input:hover, .route-entityuseredit-form .main-container .row .user-form .form-item input:hover, .route-ibm-apimsubscription-wizardnoplan .modal-dialog .form-item input .form-item input:hover, .route-consumerorgbilling-add-payment .main-container .row .form-item input:hover, .route-consumerorgbilling-delete-payment .main-container .row .form-item input:hover, .route-change-pwd-pagechange-password-form.pass-reset .main-container .row .form-item input:hover, .route-apic-appdisplay-creds .main-container .row .form-item input:hover, form.user-pass-reset .form-item input, form.user-pass-reset .form-item input:hover, .apic-user-form .form-item input, .apic-user-form .form-item input:hover { border-bottom: 1px solid rgba(17, 17, 17, 1) !important; } .form-actions a.button.apicSecondary#edit-cancel:hover { background: rgba(0, 84, 153, 0.08) !important; color: #003078 !important; } .txtblack { color: var(--bell-black) !important; } .get_help .column { border: 1px solid rgba(17, 17, 17, 0.12); border-radius: 16px; background: #FFFFFF; } .apic-user-forgot-password { font-weight: 550; } .apic-user-form-registries { display: none; } .apic-user-form-or-container { display: none; } div#onetrust-banner-sdk button { background-color: unset !important; color: white !important; } div#onetrust-banner-sdk button:hover { background-color: unset !important; color: white !important; } .supportContentWrapper .views-element-container { width: 100%; } .route-entityusercanonical .region-content, .route-entityuseredit-form .region-content, .route-change-pwd-pagechange-password-form:not(.pass-reset) .region-content { grid-template-columns: auto auto !important; } .route-apic-appcreate .main-container .row, .route-apic-appcreate-step-two .main-container .row, .route-applicationcreate .main-container .row, .route-applicationcreate-step-two .main-container .row, .route-apic-appverify-clientsecret .main-container .row, .route-apic-appcredentials-create .main-container .row, .route-apic-appreset-clientid .main-container .row, .route-apic-appreset-clientsecret .main-container .row, .route-apic-appcredentials-update .main-container .row, .route-apic-appcredentials-delete .main-container .row, .route-apic-appupdate .main-container .row, .route-apic-appdelete .main-container .row, .route-apic-apppromote .main-container .row, .route-apic-appimage-upload .main-container .row, .route-apic-appimage-delete .main-container .row, .route-auth-apicdeleteuser .main-container .row, .route-consumerorgchange-member-role .main-container .row, .route-consumerorgcreate .main-container .row, .route-consumerorgupdate .main-container .row, .route-consumerorgdelete .main-container .row, .route-consumerorgchangeowner .main-container .row, .route-consumerorginvite .main-container .row, .route-consumerorgremove-user .main-container .row, .route-consumerorgresend-invite .main-container .row, .route-consumerorgdelete-invite .main-container .row, .route-consumerorgbilling-add-payment .main-container .row, .route-consumerorgbilling-delete-payment .main-container .row, .route-apic-appdisplay-creds .main-container .row, .route-change-pwd-pagechange-password-form.pass-reset .main-container .row { border: 1.5px solid #EEECE5 !important; } .nav.block-login ul.nav > li > a:focus, nav.block-login ul.nav > li > a:hover { font-weight: 500 !important; background: rgba(17, 17, 17, 0.2); } .navbar .nav.navbar-nav > li > a:focus, .navbar .dropitmenu ul.dropit-submenu a:focus { outline: 2px solid #fff !important; outline-offset: 4px; border-radius: 2px; } .cds--tag--purple { background-color: var(--cds-tag-background-purple, #e8daff) !important; color: var(--cds-tag-color-purple, #6929c4) !important; } .cds--tag--red { background-color: var(--cds-tag-background-red, #ffd7d9) !important; color: var(--cds-tag-color-red, #a2191f) !important; } .navbar .dropitmenu ul.dropit-submenu li a:hover, .navbar .dropitmenu ul.dropit-submenu li a:active { text-decoration: none !important; } .overflow-menu ul.dropit-submenu a:hover, .overflow-menu ul.dropit-submenu a:visited:hover { background: #DAE0EB !important; color: #111111 !important; text-decoration: none !important; } .navbar .dropitmenu ul.dropit-submenu li:hover > a { background: rgba(255, 255, 255, 0.75) !important; color: #111111 !important; } .bx--global-light-ui .btn.btn-xs:hover { background-color: #003078 !important; } .btn:hover, .btn:focus, .btn.focus { text-decoration: none !important; } nav.block-login ul.nav > li.last a:hover { font-weight: 500 !important; background-color: rgba(255,255,255,0.8) !important; } .select-wrapper select.form-select { font-family: Satoshi-Medium,Arial,Helvetica,sans-serif !important; font-weight: 500 !important; } select#edit-sub-filter option:checked { background-color: rgba(255, 255, 255, 0.75) !important; color: #111111 !important; } header .region-navigation h2 { font-family: var(--bell-font-bellslimrevheavy) !important; font-size: 2.5rem !important; line-height: 1.2 !important; } /*breadcrumb issue fix */ .breadcrumb > .active { color: #111 !important; font-family: var(--bell-font-bellslimrevheavy) !important; } .startguide-row { margin: 45px auto -22px auto !important; width: 335px !important; text-align: center; } .startguide-row h2 { font-family: var(--bell-font-bellslimrevheavy) !important; font-size: 32px !important; } @media (max-width: 768px) { .startguide { justify-content: center; text-align: center; } } section .region-content .local-actions:empty { display: none; } a.btn.btn-sm.btn-primary, a.btn.btn-sm.btn-primary:hover, a.btn.btn-sm.btn-primary:focus, a.btn.btn-sm.btn-primary:active { text-decoration: none !important; } a.btn.btn-sm.btn-primary:hover { background: #003078 !important; } .btn-primary, .btn-primary:active, .btn-primary:focus { border: 0 !important; } .btn-primary:hover, .btn-primary:active:focus { border-color: none !important; } .button.apicSecondary { /* background-color: #fff !important;*/ /*border-color: #fff !important; */ border-radius: 20px !important; } .form-actions a.button.apicSecondary#edit-cancel { background-color: #ffffff !important; } .form-actions .button.dialog-cancel#edit-cancel { background-color: #ffffff !important; } .form-actions .button#edit-cancel { background-color: #ffffff !important; } .form-actions a#edit-cancel { background-color: #ffffff !important; } #edits button[data-drupal-selector="edit-cancel"] { background-color: #ffffff !important; } nav.block-login ul.nav > li.last a { background-color: #ffffff !important; color: #003078 !important; } .form-required:before { display: none !important; } /* Default: labels are visible (safe) */ .bx--form-item label.bx--label { position: static; width: auto; height: auto; margin: 0; overflow: visible; clip: auto; white-space: normal; } /* Hide label ONLY when input exists and is empty */ .bx--form-item.input-empty label.bx--label { position: absolute !important; width: 1px !important; height: 1px !important; margin: -1px !important; overflow: hidden !important; clip: rect(0 0 0 0) !important; white-space: nowrap !important; } /*login page footer align center*/ /* Hide ONLY on login form */ .apic-user-form-container .js-form-item-pass { display: none; } /* Hide Sign in actions ONLY */ #edit-actions:has(button[value="Sign in"]) { display: none; } /* Hide French Sign in actions ONLY */ #edit-actions:has(button[value="Se connecter"]) { display: none; } .consumerorgSelectBlock .orgHeading .currentOrg { font-weight: 500 !important; } nav.block-account { margin-left: 8px !important; } .bx--global-light-ui .button, .bx--global-light-ui .mainProductContent button:not(.ck), .bx--global-light-ui .bx--btn, .bx--global-light-ui .btn { border: 1px solid transparent !important; } .cds--accordion__heading { background-color: #DAE0EB !important; } .cds--accordion__heading:hover { background-color: #DAE0EB !important; } .cds--chart-holder .cds--cc--toolbar .cds--overflow-menu .cds--overflow-menu__icon, .cds--chart-holder .cds--cc--toolbar .cds--overflow-menu__trigger .cds--overflow-menu__icon { fill: #003078 !important; } .ck.ck-button.ck-on:not(.ck-disabled):hover { background: #DAE0EB !important; } .form-actions .button#edit-cancel:hover { background-color: #DAE0EB !important; } .messages__wrapper { display: none; } .ui-dialog .ui-dialog-title { padding: 0 0 6px 0 !important; } .path-user.route-entityusercanonical .region-content nav.tabs ul.tabs--primary, .path-user.route-entityuseredit-form .region-content nav.tabs ul.tabs--primary, .path-user.route-change-pwd-pagechange-password-form:not(.pass-reset) .region-content nav.tabs ul.tabs--primary { display: block !important; } .forumWrapper .forumSidebar p a { font-weight: 600 !important; text-decoration: underline !important; } .route-forumindex tbody tr td a { text-decoration: underline !important; font-weight: 600; } .route-ibm-apimmyorg header.apicMyOrgHeader, .route-ibm-apimbilling header.apicMyOrgHeader, .route-ibm-apimactivity header.apicMyOrgHeader, .route-ibm-apimanalytics header.apicMyOrgHeader { padding: 1rem 0rem 0 !important; } .forumContent td[headers="forumNameHeader"] a { text-decoration: underline !important; } .supportContentWrapper h2 { font-size: 1.3rem !important; } /* a:focus { outline: none !important; }*/ .apiconnect-explorer .cds--snippet-btn--expand:hover { background: #DAE0EB !important; } .apicProduct .apicProductSummary .field--item, .apicProduct .apicProductDesc .field--item, .apicProduct .termsOfService .field--item { color: #555555; } .apicProduct .apicProductSummary .field--label { font-family: var(--bell-font-bellslimrevheavy) !important; font-size: 32px !important; } .comments h2 { font-family: var(--bell-font-bellslimrevheavy) !important; font-size: 32px !important; } .bx--global-light-ui .label { color: #111111 !important; } .field-multiple-table thead h4 { font-size: 22px !important; font-weight: 500 !important; } .bx--global-light-ui .form-item label, .field--name-application-redirect-endpoints .field-multiple-table th.field-label { font-size: 14px !important; font-weight: 400 !important; } .clientIDContainer .field__label, .clientSecretContainer .field__label, .applicationCredentials .credentialsTable .credentialsContent .credentialsData .field__label { font-size: 14px !important; font-weight: 400 !important; } .views-element-container .view.view-faqs .ui-state-active, .views-element-container .view.view-faqs .ui-widget-content .ui-state-active, .views-element-container .view.view-faqs .ui-widget-header .ui-state-active { font-family: Satoshi-Regular,Arial,Helvetica,sans-serif !important; } .views-element-container .view.view-faqs .ui-state-default, .views-element-container .view.view-faqs .ui-widget-content .ui-state-default, .views-element-container .view.view-faqs .ui-widget-header .ui-state-default { font-family: Satoshi-Regular,Arial,Helvetica,sans-serif !important; } .supportContentWrapper .faqDiv h2.viewTitle, .supportContentWrapper .forumDiv h2 { font-size: 24px !important; } .bx--global-light-ui .apicMainContent .ui-accordion .ui-accordion-content p { color: #555555; } .applicationCredentials .credentialsTable .credentialsHeader .credentialsTitle, .applicationSubscriptions .subscriptionsTable .subscriptionsHeader .subscriptionsTitle { font-size: 22px !important; } .applicationWrapper .titleSection .applicationTabs li, .applicationCredentials .credentialsTable .credentialsContent .credentialsTabs li { font-size: 14px !important; } .pagination > li > a, .pagination > li > span { margin-left: 3px !important; } .pagination > li:first-child > a, .pagination > li:first-child > span, .pagination > li:last-child > a, .pagination > li:last-child > span { border-radius: 30px !important; } #navbar-collapse .navbar-nav > li.nolink:nth-of-type(3) > span { display: inline-block; max-width: 120px; white-space: normal; text-align: left; font-family: var(--bell-font-bellslimrevheavy); font-size: 19px; color: #ffffff; } /*---------------------------dropit-submenu-------------------------*/ .consumerorgSelectBlock:hover, .consumerorgSelectBlock:active { background-color: rgba(255, 255, 255, 0.2) !important; /* Shaded white */ color: #FFFFFF; border-radius: 30px; } .navbar .dropitmenu ul.dropit-submenu { border-radius: 12px !important; } .dropitmenu-submenu a { background: #FFFFFF !important; color: #111111 !important; } .navbar .dropitmenu ul.dropit-submenu .selectorg { background: #FFFFFF !important; color: #111111 !important; font-size: 18px !important; font-weight: 500; } .dropitmenu ul.dropit-submenu li:not(:last-child) { border-bottom: 1px; } .navbar .dropitmenu ul.dropit-submenu { border-radius: 12px !important; } .navbar .dropitmenu ul.dropit-submenu li a:not(.trigger) { padding: 4px 0.75rem !important; font-weight: 500; } .navbar .dropitmenu ul.dropit-submenu a.trigger { padding: 0; border: none } .gsstep a { text-decoration: underline !important; } /* .get_help { width: 135% !important; }*/ .gsstep p { font-weight: 450 !important; font-size: 14px !important; color: #555555 !important; } .gsstep h3 { letter-spacing: 0; margin-bottom: 25px !important; font-family: Satoshi-Medium,Arial,Helvetica,sans-serif !important; font-weight: 550 !important; font-size: 22px !important; color: #003078 !important; } /* Custom Notification Popup Styles */ .custom-popup-overlay { position: fixed; inset: 0; background: rgba(0,0,0,0.6); display: flex; justify-content: center; align-items: center; z-index: 9999; } .custom-popup-box { background: #ffffff; width: 400px; max-width: 90%; border-radius: 8px; overflow: hidden; animation: popupFade 0.3s ease; box-shadow: 0 10px 30px rgba(0,0,0,0.3); } .custom-popup-header { background: #fff; color: #111111; padding: 12px 16px; display: flex; justify-content: space-between; align-items: center; font-weight: 500; font-size: 16px; } .custom-popup-body { padding: 24px 9px 60px 26px; font-size: 14px; color: #333; line-height: 18px; } .custom-popup-close { background-image: url("../images/icons/Close Button.png") !important; background-repeat: no-repeat !important; background-position: center center !important; background-size: 36px 36px !important; /* keep the button�s size/positioning consistent */ width: 40px; height: 40px; border: none; cursor: pointer; } .custom-popup-message { padding: 12px 0 0 15%; } .custom-popup-message:not(:last-child) { border-bottom: 1px solid #ddd; margin-bottom: 12px; } @keyframes popupFade { from { transform: scale(0.9); opacity: 0; } to { transform: scale(1); opacity: 1; } } .get_help div { font-weight: 450 !important; font-size: 14px !important; color: #555555 !important; line-height: 1.5rem !important; } .block-get-help a { color: #003078 !important; font-size: 14px !important; } .get_help a, .get_help a:hover { font-size: 14px !important; font-weight: 400 !important; color: #003078 !important; } /*---------------------------------------------login page-------*/ .apicMainContent { background: #F7F5F2; padding-bottom: 50px; } .apic-user-form.apic-user-form-login, .apic-user-form.apic-user-form-register, .apic-user-form.apic-user-form-reset-pwd { margin-left: 20% !important; margin-right: 0 !important; border-radius: 20px; box-shadow: 0 2px 8px rgba(17, 17, 17, 0.16); } .ibmapimGetStarted .gomepagelink.breadcrumb a { color: var(--bell-dark-blue) !important; } /*---------------------------------------------Get started page-------*/ .ibmapimGetStarted { background: none; } .ibmapimGetStarted header { padding-left: calc((100% - 1139px) / 2); margin-left: -1.9rem; } .startguide .gsstep.signup div.placeholder, .startguide .gsstep.explore div.placeholder, .startguide .gsstep.subscribe div.placeholder { background: none !important; } /*--All Desktop View*/ @media (min-width: 1025px) { /* .apic-user-form-or{ display:none; }*/ .apic-user-form-text { padding: 1.5rem 3rem !important; line-height: 18px; } .bx--global-light-ui .view-filters.form-group .form-inline { flex-wrap: nowrap !important; } h1.page-header { padding: 1rem 0 1rem calc((100% - 1147px) / 2 ) !important; } .Pane.vertical.Pane1 { width: 300px !important; } .breadcrumb { margin-left: auto !important; margin-right: auto !important; width: 1190px !important; } .route-entityusercanonical .region-content nav.tabs, .route-entityuseredit-form .region-content nav.tabs, .route-change-pwd-pagechange-password-form:not(.pass-reset) .region-content nav.tabs { margin-left: auto !important; width: 300px !important; } .route-entityusercanonical .region-content article, .route-entityuseredit-form .region-content form.user-form, .route-change-pwd-pagechange-password-form:not(.pass-reset) form.apic-change-pwd-form { margin-right: auto !important; width: 747px !important; line-height: 20px; } .route-entityusercanonical .region-content article h4 { font-size: 14px !important; } .route-contactsite-page form.contact-message-feedback-form { margin-left: auto !important; margin-right: auto !important; width: 1210px !important; } .route-apic-appunsubscribe form.confirmation { margin-left: auto !important; margin-right: auto !important; width: 1210px !important; } .socialblock.container { margin-left: auto !important; margin-right: auto !important; width: 1190px !important; } .supportContentWrapper { margin-left: auto !important; margin-right: auto !important; width: 1200px !important; } .startguide { margin-left: auto !important; margin-right: auto !important; width: 1200px !important; } .apicForm { margin-left: auto !important; margin-right: auto !important; width: 1262px !important; } .gsstep { margin-left: auto !important; margin-right: auto !important; width: 1200px !important; } .get_help { margin-left: auto !important; margin-right: auto !important; width: 1190px !important; } .featuredcontent.featuredcontentBlockWrapper { margin-left: auto !important; margin-right: auto !important; width: 1190px !important; } .productApiWrapper .titleInnerWrapper { margin-left: auto !important; margin-right: auto !important; width: 1210px !important; } .ibmapimAnalytics.ibmapimOrgAnalytics { margin-left: auto !important; margin-right: auto !important; width: 1190px !important; } .route-forumindex ul.forum-actions-wrapper, .route-forumpage ul.forum-actions-wrapper { margin-left: auto !important; margin-right: auto !important; width: 1190px !important; } .apicProduct .apicProductHeader .breadcrumb, .productApiWrapper header.titleSection .breadcrumb { margin-left: auto !important; margin-right: auto !important; width: 1190px !important; } .apicProductTitle { margin-left: auto !important; margin-right: auto !important; width: 1190px !important; } .route-apic-appcreate .main-container .row section, .route-apic-appcreate-step-two .main-container .row section, .route-applicationcreate .main-container .row section, .route-applicationcreate-step-two .main-container .row section, .route-apic-appverify-clientsecret .main-container .row section, .route-apic-appcredentials-create .main-container .row section, .route-apic-appreset-clientid .main-container .row section, .route-apic-appreset-clientsecret .main-container .row section, .route-apic-appcredentials-update .main-container .row section, .route-apic-appcredentials-delete .main-container .row section, .route-apic-appupdate .main-container .row section, .route-apic-appdelete .main-container .row section, .route-apic-apppromote .main-container .row section, .route-apic-appimage-upload .main-container .row section, .route-apic-appimage-delete .main-container .row section, .route-auth-apicdeleteuser .main-container .row section, .route-consumerorgchange-member-role .main-container .row section, .route-consumerorgcreate .main-container .row section, .route-consumerorgupdate .main-container .row section, .route-consumerorgdelete .main-container .row section, .route-consumerorgchangeowner .main-container .row section, .route-consumerorginvite .main-container .row section, .route-consumerorgremove-user .main-container .row section, .route-consumerorgresend-invite .main-container .row section, .route-consumerorgdelete-invite .main-container .row section, .route-consumerorgbilling-add-payment .main-container .row section, .route-consumerorgbilling-delete-payment .main-container .row section, .route-apic-appdisplay-creds .main-container .row section, .route-change-pwd-pagechange-password-form.pass-reset .main-container .row section { margin-left: auto !important; margin-right: auto !important; width: 520px; float: none; } .route-ibm-apimsubscription-wizard .apicMainContent .wizard-trail .bx--progress, .route-ibm-apimsubscription-wizardstep .apicMainContent .wizard-trail .bx--progress, .route-ibm-apimsubscription-wizardnoplan .apicMainContent .wizard-trail .bx--progress, .route-ibm-apimsubscription-wizardnoplanstep .apicMainContent .wizard-trail .bx--progress, .route-mail-subscribersproduct-wizard .apicMainContent .wizard-trail .bx--progress, .route-mail-subscribersproduct-wizardstep .apicMainContent .wizard-trail .bx--progress, .route-mail-subscribersplan-wizard .apicMainContent .wizard-trail .bx--progress, .route-mail-subscribersplan-wizardstep .apicMainContent .wizard-trail .bx--progress, .route-mail-subscribersapi-wizard .apicMainContent .wizard-trail .bx--progress, .route-mail-subscribersapi-wizardstep .apicMainContent .wizard-trail .bx--progress, .route-mail-subscribersall-wizard .apicMainContent .wizard-trail .bx--progress, .route-mail-subscribersall-wizardstep .apicMainContent .wizard-trail .bx--progress { margin-left: auto !important; margin-right: auto !important; width: 1190px !important; } .route-ibm-apimsubscription-wizard .apicMainContent .subscriptionWizardTitle h3, .route-ibm-apimsubscription-wizardstep .apicMainContent .subscriptionWizardTitle h3, .route-ibm-apimsubscription-wizardnoplan .apicMainContent .subscriptionWizardTitle h3, .route-ibm-apimsubscription-wizardnoplanstep .apicMainContent .subscriptionWizardTitle h3, .route-mail-subscribersproduct-wizard .apicMainContent .subscriptionWizardTitle h3, .route-mail-subscribersproduct-wizardstep .apicMainContent .subscriptionWizardTitle h3, .route-mail-subscribersplan-wizard .apicMainContent .subscriptionWizardTitle h3, .route-mail-subscribersplan-wizardstep .apicMainContent .subscriptionWizardTitle h3, .route-mail-subscribersapi-wizard .apicMainContent .subscriptionWizardTitle h3, .route-mail-subscribersapi-wizardstep .apicMainContent .subscriptionWizardTitle h3, .route-mail-subscribersall-wizard .apicMainContent .subscriptionWizardTitle h3, .route-mail-subscribersall-wizardstep .apicMainContent .subscriptionWizardTitle h3 { margin-left: auto !important; margin-right: auto !important; width: 1190px !important; } .route-ibm-apimsubscription-wizardnoplan .apicMainContent .apicSubscribeAppForm, .route-ibm-apimsubscription-wizardnoplanstep .apicMainContent .apicSubscribeAppForm, .route-ibm-apimsubscription-wizardstep .apicMainContent .apicSubscribeAppForm { flex-direction: row !important; } .route-ibm-apimsubscription-wizardnoplan .apicMainContent .apic-wizard-navigation, .route-ibm-apimsubscription-wizardnoplanstep .apicMainContent .apic-wizard-navigation, .route-ibm-apimsubscription-wizardstep .apicMainContent .apic-wizard-navigation { justify-content: end !important; } .route-ibm-apimsubscription-wizardnoplan .apicMainContent .apicWizardMain.apicSubscribeChooseApp, .route-ibm-apimsubscription-wizardnoplanstep .apicMainContent .apicWizardMain.apicSubscribeChooseApp, .route-ibm-apimsubscription-wizardstep .apicMainContent .apicWizardMain.apicSubscribeChooseApp { margin-left: auto !important; margin-right: auto !important; width: 1190px !important; padding: 0 !important; } .page-node-type-application .container .contentInnerWrapper, .page-node-type-application .container .titleInnerWrapper { width: 1190px !important; } .views-element-container { margin-left: auto !important; margin-right: auto !important; width: 1200px; } .forumWrapper { margin-left: auto !important; margin-right: auto !important; width: 1157px !important; } .productApiWrapper #innerWrapper > article:not(.apiprotocol-graphql) { margin-left: auto !important; margin-right: auto !important; width: 1190px !important; } .path-node .content, .path-node .node-form, .route-entitynodedelete-form .node-page-delete-form, .route-entitynodebook-outline-form .node-page-book-outline-form, .route-entitynodecontent-translation-overview .table-responsive, .route-entitynodeversion-history .table-responsive { margin-left: auto !important; margin-right: auto !important; width: 1190px !important; } .apicMyOrg .titleInnerWrapper { margin-left: auto !important; margin-right: auto !important; width: 1190px !important; } .apicMyOrg .field.organizationMembers { margin-left: auto !important; margin-right: auto !important; width: 1190px !important; } .apicProduct .apicProductBody { margin-left: auto !important; margin-right: auto !important; width: 1262px !important; } footer.footer .region-footer { width: 1185px !important; margin-left: auto !important; margin-right: auto !important; } .menu--login.nav a { border-radius: 30px !important; height: 40px !important; font-family: Satoshi-Variable,Arial,Helvetica,sans-serif !important; } .dropit .dropit-submenu { min-width: 180px !important; } li.elipsis-names[selected="true"] a::after { content: ""; position: absolute; right: 14px; width: 16px; height: 33px; background: url('../images/icons/select.png') no-repeat center; background-size: contain; } a[data-drupal-link-system-path="user"]::before { content: url("../images/icons/account.png"); margin-right: 6px; font-size: 14px; vertical-align: sub; } a[data-drupal-link-system-path="user/logout"]::before { content: url("../images/icons/logout.png"); vertical-align: sub; margin-right: 6px; font-size: 14px; } a[data-drupal-link-system-path="user/change-password"]::before { content: url("../images/icons/account.png"); margin-right: 6px; font-size: 14px; vertical-align: sub; } /* backtotop button design override*/ #backtotop { background-image: url("../images/Group_4_cce2fca097.svg"); background-repeat: no-repeat; background-position: left; background-size: 55px 15px; background-color: #f7f7f7 !important; border: 1px solid; border-radius: 24px; bottom: 14x; color: #003078 !important; cursor: pointer; display: none; width: max-content; padding: 10px 44px; position: absolute; right: 20px; text-align: center; font-family: Arial; font-size: 16px; font-weight: 500; z-index: 10; } #backtotop:hover { color: #003078 !important; border-color: #003078 !important; border: 1px solid !important; background-color: #ccd7e4 !important; background-image: url("../images/Group_4_cce2fca097.svg") !important; background-repeat: no-repeat !important; background-position: left !important; background-size: 55px 15px !important; } /*footer brand design fix */ footer.footer.container { height: 140px !important; } footer.footer { /*padding: 20px 5% 84px 24px !important;*/ background-color: #FFFFFF !important; margin-top: 0 !important; padding: 1rem 0 1rem calc((0vw) / 2 ) !important; } .navbar-default .navbar-nav .dropdown-menu { min-width: 214px !important; min-height: 151px !important; position: absolute !important; background-color: #f0f0f0 !important; margin-top: 16px !important; transform: translateX(-12%) !important; box-shadow: 0 8px 16px 0 rgba(0, 0, 0, .2) !important; z-index: 1 !important; padding-top: 15px !important; } .navbar-default .navbar-nav .dropdown-menu > li > a:hover, .navbar-default .navbar-nav .dropdown-menu > li > a:focus { background-color: #fff !important; border-left: 4px solid #003078; /* padding: 12px 7px 12px 16px;*/ box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2); font-weight: 700; } .navbar-default .navbar-nav .dropdown-menu a { display: block !important; background-color: inherit !important; } .dropdown-menu:after { content: "" !important; position: absolute !important; bottom: 100% !important; left: 50% !important; margin-left: -25px !important; width: 0 !important; height: 0 !important; border-left: 15px solid transparent !important; border-right: 15px solid transparent !important; border-bottom: 15px solid #f0f0f0 !important; } .navbar-default .navbar-nav .dropdown-toggle .caret { display: none !important; } .navbar-default .navbar-nav > .open > a, .navbar-default .navbar-nav > .open > a:hover, .navbar-default .navbar-nav > .open > a:focus { background-color: inherit !important; } #navbar-collapse .navbar-nav > li.nolink:nth-of-type(2) > span { width: 1.06px; height: 37px; background-color: #FFFFFF; margin: auto 19px; color: transparent; content: ""; opacity: 0.6; display: inline-block; vertical-align: middle; line-height: normal; margin-right: 20px; border: 1px solid; border-radius: 1px; } ul.action-links > li:first-child { list-style: none; } footer.footer ul.nav li + li:before { margin: 0 !important; } .footer .menu--footer .navbar-text { color: #E1DDD1; } footer.footer ul.nav > li > a, footer.footer ul.nav > li > a:visited { font-family: Satoshi-Regular,Arial,Helvetica,sans-serif !important; margin: 0 8px 0px -8px !important; color: #111111 !important; } section.block.block-consumer-organization-selection { border: 1px solid #EEECE5; border-radius: 30px; height: 42px; } /*---------------------------------------------login page-------*/ .apicMainContent { background: #F7F5F2; padding-bottom: 50px; } .apic-user-form.apic-user-form-login, .apic-user-form.apic-user-form-register, .apic-user-form.apic-user-form-reset-pwd { margin-left: 20% !important; margin-right: 0 !important; border-radius: 20px; box-shadow: 0 2px 8px rgba(17, 17, 17, 0.16); } /*apply button in API product aligment fix*/ #views-exposed-form-products-page-1 .form-actions { display: flex !important; } .apic-user-form { max-width: 30rem !important; } .apic-user-form.apic-user-form-login, .apic-user-form.apic-user-form-register, .apic-user-form.apic-user-form-reset-pwd { margin-left: 30% !important; margin-bottom: 1%; } /*Login Page Mobile View*/ @media (max-width: 768px) { .apic-user-form-login .apic-portal-title, .apic-user-form-login .apic-user-form-header { padding-left: 0.9rem; margin-left: unset; } .apic-user-form-container { display: block; } .apic-user-form.apic-user-form-login, .apic-user-form.apic-user-form-register, .apic-user-form.apic-user-form-reset-pwd { margin-left: none; margin-top: 0; } .apic-user-form-inner-wrapper, .apic-user-form-or-container { max-width: unset; margin-left: 0; margin-right: 0; } .apic-user-form-live { width: 100%; height: 1px; } } .apic-portal-title { display: none !important; } /*refresh button height fix*/ button.refresh-button { min-height: 40.3px !important; margin-top: 0.5px; } .testToolOauth .getTokenButton { height: 40px; margin: 0; padding: 11px 0 0 18px; } .apicNewAppButton { text-align: end; margin: -64px 63px 70px 0; } .apicWizardMain .apicNewAppButton .tile-button { display: inline-flex !important; height: 3rem !important; border-radius: 40px !important; min-width: 12rem !important; max-width: 12px !important; background: #003078 !important; color: var(--bell-white) !important; } .cds--btn--secondary { background-color: #BD2025 !important; width: 110px !important; height: 2.5rem !important; border: 1px solid #E1E1E1 !important; justify-content: center !important; border-radius: 43px; display: block; padding-left: 30px; color: var(--bell-white) !important; } .cds--btn--secondary:hover { background-color: rgba(151, 26, 30, 1) !important; color: var(--bell-white) !important; } .cds--btn--tertiary { background-color: #ffffff !important; width: 110px !important; height: 2.5rem !important; border: 1px solid #E1E1E1 !important; justify-content: center !important; border-radius: 43px; display: block; padding-left: 30px; } .cds--btn--primary { width: 110px; border: 1px solid #E1E1E1 !important; border-radius: 30px !important; /* width: 9% !important;*/ padding-left: 35px; } /*hide thead save button within form content create new app*/ .form-actions[data-drupal-selector="edit-actions"] button.use-ajax.button--primary { display: none !important; } .apicWizardMain .apicNewAppButton .tile-button:before { content: none !important; } .route-consumerorginvite .main-container .row #edit-actions button, .route-consumerorginvite .main-container .row #edit-actions .button, .route-consumerorginvite .main-container .row .form-actions button, .route-consumerorginvite .main-container .row .form-actions .button { width: 110px !important; height: 2.5rem !important; border: 1px solid #E1E1E1 !important; justify-content: center !important; margin: 10px 15px 27px 6px !important; } .route-consumerorgcreate .main-container .row #edit-actions button, .route-consumerorgcreate .main-container .row #edit-actions .button, .route-consumerorgcreate .main-container .row .form-actions button, .route-consumerorgcreate .main-container .row .form-actions .button { width: 110px !important; height: 2.5rem !important; border: 1px solid #E1E1E1 !important; justify-content: center !important; margin: 10px 15px 27px 6px !important; } .route-apic-appcreate .main-container .row .form-actions .button { width: 110px !important; height: 2.5rem !important; border: 1px solid #E1E1E1 !important; justify-content: center !important; } .bx--global-light-ui .btn.btn-xs { height: 2.5rem !important; margin-top: 30px !important; } .route-apic-appcreate .main-container .row #edit-actions, .route-apic-appcreate .main-container .row .form-actions { margin-bottom: 20px !important; gap: 12px; } .welcomebannertext a.button { font-weight: 500 !important; } .welcomebannertext p { font-size: 16px !important; font-family: Satoshi-Regular,Arial,Helvetica,sans-serif !important; } .welcomebanner .bannerButtonRow a.cta-btns--white__btn { background-color: #FFFFFF !important; color: #003078 !important; border: unset !important; text-decoration: none !important; } .welcomebanner .bannerButtonRow a.cta-btns--white__btn:hover { background: rgba(255, 255, 255, 0.75) !important; color: #003078 !important; } .route-apic-appcreate .main-container .row #edit-actions button, .route-apic-appcreate .main-container .row #edit-actions .button, .route-apic-appcreate .main-container .row .form-actions button, .route-apic-appcreate .main-container .row .form-actions .button, .route-apic-appcreate-step-two .main-container .row #edit-actions button, .route-apic-appcreate-step-two .main-container .row #edit-actions .button, .route-apic-appcreate-step-two .main-container .row .form-actions button, .route-apic-appcreate-step-two .main-container .row .form-actions .button, .route-applicationcreate .main-container .row #edit-actions button, .route-applicationcreate .main-container .row #edit-actions .button, .route-applicationcreate .main-container .row .form-actions button, .route-applicationcreate .main-container .row .form-actions .button, .route-applicationcreate-step-two .main-container .row #edit-actions button, .route-applicationcreate-step-two .main-container .row #edit-actions .button, .route-applicationcreate-step-two .main-container .row .form-actions button, .route-applicationcreate-step-two .main-container .row .form-actions .button, .route-apic-appverify-clientsecret .main-container .row #edit-actions button, .route-apic-appverify-clientsecret .main-container .row #edit-actions .button, .route-apic-appverify-clientsecret .main-container .row .form-actions button, .route-apic-appverify-clientsecret .main-container .row .form-actions .button, .route-apic-appcredentials-create .main-container .row #edit-actions button, .route-apic-appcredentials-create .main-container .row #edit-actions .button, .route-apic-appcredentials-create .main-container .row .form-actions button, .route-apic-appcredentials-create .main-container .row .form-actions .button, .route-apic-appreset-clientid .main-container .row #edit-actions button, .route-apic-appreset-clientid .main-container .row #edit-actions .button, .route-apic-appreset-clientid .main-container .row .form-actions button, .route-apic-appreset-clientid .main-container .row .form-actions .button, .route-apic-appreset-clientsecret .main-container .row #edit-actions button, .route-apic-appreset-clientsecret .main-container .row #edit-actions .button, .route-apic-appreset-clientsecret .main-container .row .form-actions button, .route-apic-appreset-clientsecret .main-container .row .form-actions .button, .route-apic-appcredentials-update .main-container .row #edit-actions button, .route-apic-appcredentials-update .main-container .row #edit-actions .button, .route-apic-appcredentials-update .main-container .row .form-actions button, .route-apic-appcredentials-update .main-container .row .form-actions .button, .route-apic-appcredentials-delete .main-container .row #edit-actions button, .route-apic-appcredentials-delete .main-container .row #edit-actions .button, .route-apic-appcredentials-delete .main-container .row .form-actions button, .route-apic-appcredentials-delete .main-container .row .form-actions .button, .route-apic-appupdate .main-container .row #edit-actions button, .route-apic-appupdate .main-container .row #edit-actions .button, .route-apic-appupdate .main-container .row .form-actions button, .route-apic-appupdate .main-container .row .form-actions .button, .route-apic-appdelete .main-container .row #edit-actions button, .route-apic-appdelete .main-container .row #edit-actions .button, .route-apic-appdelete .main-container .row .form-actions button, .route-apic-appdelete .main-container .row .form-actions .button, .route-apic-apppromote .main-container .row #edit-actions button, .route-apic-apppromote .main-container .row #edit-actions .button, .route-apic-apppromote .main-container .row .form-actions button, .route-apic-apppromote .main-container .row .form-actions .button, .route-apic-appimage-upload .main-container .row #edit-actions button, .route-apic-appimage-upload .main-container .row #edit-actions .button, .route-apic-appimage-upload .main-container .row .form-actions button, .route-apic-appimage-upload .main-container .row .form-actions .button, .route-apic-appimage-delete .main-container .row #edit-actions button, .route-apic-appimage-delete .main-container .row #edit-actions .button, .route-apic-appimage-delete .main-container .row .form-actions button, .route-apic-appimage-delete .main-container .row .form-actions .button, .route-auth-apicdeleteuser .main-container .row #edit-actions button, .route-auth-apicdeleteuser .main-container .row #edit-actions .button, .route-auth-apicdeleteuser .main-container .row .form-actions button, .route-auth-apicdeleteuser .main-container .row .form-actions .button, .route-consumerorgchange-member-role .main-container .row #edit-actions button, .route-consumerorgchange-member-role .main-container .row #edit-actions .button, .route-consumerorgchange-member-role .main-container .row .form-actions button, .route-consumerorgchange-member-role .main-container .row .form-actions .button, .route-consumerorgcreate .main-container .row #edit-actions button, .route-consumerorgcreate .main-container .row #edit-actions .button, .route-consumerorgcreate .main-container .row .form-actions button, .route-consumerorgcreate .main-container .row .form-actions .button, .route-consumerorgupdate .main-container .row #edit-actions button, .route-consumerorgupdate .main-container .row #edit-actions .button, .route-consumerorgupdate .main-container .row .form-actions button, .route-consumerorgupdate .main-container .row .form-actions .button, .route-consumerorgdelete .main-container .row #edit-actions button, .route-consumerorgdelete .main-container .row #edit-actions .button, .route-consumerorgdelete .main-container .row .form-actions button, .route-consumerorgdelete .main-container .row .form-actions .button, .route-consumerorgchangeowner .main-container .row #edit-actions button, .route-consumerorgchangeowner .main-container .row #edit-actions .button, .route-consumerorgchangeowner .main-container .row .form-actions button, .route-consumerorgchangeowner .main-container .row .form-actions .button, .route-consumerorginvite .main-container .row #edit-actions button, .route-consumerorginvite .main-container .row #edit-actions .button, .route-consumerorginvite .main-container .row .form-actions button, .route-consumerorginvite .main-container .row .form-actions .button, .route-consumerorgremove-user .main-container .row #edit-actions button, .route-consumerorgremove-user .main-container .row #edit-actions .button, .route-consumerorgremove-user .main-container .row .form-actions button, .route-consumerorgremove-user .main-container .row .form-actions .button, .route-consumerorgresend-invite .main-container .row #edit-actions button, .route-consumerorgresend-invite .main-container .row #edit-actions .button, .route-consumerorgresend-invite .main-container .row .form-actions button, .route-consumerorgresend-invite .main-container .row .form-actions .button, .route-consumerorgdelete-invite .main-container .row #edit-actions button, .route-consumerorgdelete-invite .main-container .row #edit-actions .button, .route-consumerorgdelete-invite .main-container .row .form-actions button, .route-consumerorgdelete-invite .main-container .row .form-actions .button, .route-consumerorgbilling-add-payment .main-container .row #edit-actions button, .route-consumerorgbilling-add-payment .main-container .row #edit-actions .button, .route-consumerorgbilling-add-payment .main-container .row .form-actions button, .route-consumerorgbilling-add-payment .main-container .row .form-actions .button, .route-consumerorgbilling-delete-payment .main-container .row #edit-actions button, .route-consumerorgbilling-delete-payment .main-container .row #edit-actions .button, .route-consumerorgbilling-delete-payment .main-container .row .form-actions button, .route-consumerorgbilling-delete-payment .main-container .row .form-actions .button, .route-apic-appdisplay-creds .main-container .row #edit-actions button, .route-apic-appdisplay-creds .main-container .row #edit-actions .button, .route-apic-appdisplay-creds .main-container .row .form-actions button, .route-apic-appdisplay-creds .main-container .row .form-actions .button, .route-change-pwd-pagechange-password-form.pass-reset .main-container .row #edit-actions button, .route-change-pwd-pagechange-password-form.pass-reset .main-container .row #edit-actions .button, .route-change-pwd-pagechange-password-form.pass-reset .main-container .row .form-actions button, .route-change-pwd-pagechange-password-form.pass-reset .main-container .row .form-actions .button { width: 110px !important; height: 2.5rem !important; border: 1px solid #E1E1E1 !important; justify-content: center !important; margin: 10px 15px 27px 6px !important; } /*.route-apic-appcredentials-create .main-container .row #edit-actions button, .route-apic-appcredentials-create .main-container .row #edit-actions .button, .route-apic-appcredentials-create .main-container .row .form-actions button, .route-apic-appcredentials-create .main-container .row .form-actions .button, .route-apic-appcredentials-update .main-container .row #edit-actions button, .route-apic-appcredentials-update .main-container .row #edit-actions .button, .route-apic-appcredentials-update .main-container .row .form-actions button, .route-apic-appcredentials-update .main-container .row .form-actions .button, .route-apic-appreset-clientsecret .main-container .row #edit-actions button, .route-apic-appreset-clientsecret .main-container .row #edit-actions .button, .route-apic-appreset-clientsecret .main-container .row .form-actions button, .route-apic-appreset-clientsecret .main-container .row .form-actions .button, .route-apic-appdelete .main-container .row #edit-actions button, .route-apic-appdelete .main-container .row #edit-actions .button, .route-apic-appdelete .main-container .row .form-actions button, .route-apic-appdelete .main-container .row .form-actions .button, .route-apic-appreset-clientid .main-container .row #edit-actions button, .route-apic-appreset-clientid .main-container .row #edit-actions .button, .route-apic-appreset-clientid .main-container .row .form-actions button, .route-apic-appreset-clientid .main-container .row .form-actions .button, .route-apic-appverify-clientsecret .main-container .row #edit-actions button, .route-apic-appverify-clientsecret .main-container .row #edit-actions .button, .route-apic-appverify-clientsecret .main-container .row .form-actions button, .route-apic-appverify-clientsecret .main-container .row .form-actions .button, .route-apic-appimage-upload .main-container .row #edit-actions button, .route-apic-appimage-upload .main-container .row #edit-actions .button, .route-apic-appimage-upload .main-container .row .form-actions button, .route-apic-appimage-upload .main-container .row .form-actions .button, .route-apic-appupdate .main-container .row #edit-actions button, .route-apic-appupdate .main-container .row #edit-actions .button, .route-apic-appupdate .main-container .row .form-actions button, .route-apic-appupdate .main-container .row .form-actions .button { width: 28% !important; height: 2.5rem !important; border: 1px solid #E1E1E1 !important; justify-content: center !important; margin: 10px 15px 27px 6px !important; } */ .user-login-form .apic-user-form-subheader { margin-left: 13px !important; font-size: 22px; line-height: 32px; } .apic-user-form .form-item input { border-bottom: 2px solid #E1E1E1 !important; } .route-auth-apicdeleteuser .main-container .row #edit-actions button, .route-auth-apicdeleteuser .main-container .row #edit-actions .button, .route-auth-apicdeleteuser .main-container .row .form-actions button, .route-auth-apicdeleteuser .main-container .row .form-actions .button { width: 110px !important; height: 2.5rem !important; border: 1px solid #E1E1E1 !important; justify-content: center !important; } /*icon*/ .apicCardIcon img { content: none !important; display: none !important; } .apicCardIcon::before { content: ""; display: block; width: 2rem; height: 2rem; background: url("../images/bundle.png") no-repeat center / contain !important; margin-left: 10px; } .featuredcontentNodeImage img { content: none !important; display: none !important; } .featuredcontentNodeImage { content: ""; display: block; width: 64px; height: 64px; background: url("../images/bundle.png") no-repeat center / contain !important; margin: 9px 0 21px 0; } .icon-error { content: "" !important; display: block; width: 46px; height: 86px; background: url("../images/icons/error.png") no-repeat center / contain !important; margin-bottom: -69px !important; } .icon-status { content: "" !important; display: block; width: 46px; height: 86px; background: url("../images/icons/success.png") no-repeat center / contain !important; margin-bottom: -69px !important; } .icon-danger { content: "" !important; display: block; width: 46px; height: 86px; background: url("../images/icons/error.png") no-repeat center / contain !important; margin-bottom: -69px !important; } .alert.alert-info .icon:before { content: "" !important; display: block; width: 23px; height: 23px; background: url("../images/icons/info.png") no-repeat center / contain !important; right: 8px; top: 0.3em !important; } .startguide .gsstep.signup div.placeholder, .startguide .gsstep.explore div.placeholder, .startguide .gsstep.subscribe div.placeholder { background: none !important; } .gsstep.subscribe h5::before { content: ""; display: block; width: 40px; height: 37px; background: url("../images/icons/global.png") no-repeat center / contain !important; margin: 6px 0px 14px 2px; } .gsstep.signup h5::before { content: ""; display: block; width: 40px; height: 37px; background: url("../images/icons/heart.png") no-repeat center / contain !important; margin: 6px 0px 14px 2px; } .gsstep.explore h5::before { content: ""; display: block; width: 40px; height: 37px; background: url("../images/icons/shield.png") no-repeat center / contain !important; margin: 6px 0px 14px 2px; } /*.alert .close { background: url("../images/icons/close.png") no-repeat center / contain !important; }*/ .apicProductIcon img { content: none !important; display: none !important; } .apicProductIcon::before { content: ""; display: block; width: 64px; height: 64px; background: url("../images/bundle.png") no-repeat center / contain !important; } .apicFormHeader { font-size: 16px !important; font-weight: 500 !important; } .apicFormContent .product img { content: none !important; display: none !important; } .apicFormContent table tbody tr .product::before { content: ""; display: block; width: 64px; height: 64px; background: url("../images/bundle.png") no-repeat center / contain !important; } .bx--global-light-ui .button { height: 40px !important; padding: calc(0.875rem - 3px) 27px calc(0.875rem - 3px) 26px !important; } .bx--card { border-radius: 10px !important; } .masonry-layout-search-content { margin-left: -16px; /* compensate left padding */ } .masonry-layout-search-content .masonry-item { padding-left: 16px; padding-bottom: 16px; /* vertical gap */ box-sizing: border-box; } .route-consumerorgdelete-invite .main-container .row { background: #ffffff !important; } /*font changes as per figma*/ .gsstep { width: calc(100% / 3 - 38px) !important; margin: 0 1.75rem !important; } .featuredcontent h3 { font-size: 32px !important; } /*Home page exporer products*/ .featuredcontent a { margin-top: 43px; } .featuredcontentNodeTitle a { font-family: Satoshi-Medium,Arial,Helvetica,sans-serif !important; font-size: 18px !important; font-weight: 500 !important; color: #111111 !important; } .featuredcontentNodeInfo .featuredcontentNodeSummary, .featuredcontentNodeInfo .featuredcontentNodeDescription { font-size: 14px !important; font-weight: 400 !important; color: #555555 !important; } /* .featuredcontent.featuredcontentBlockWrapper { margin: 3.5rem 2rem !important; }*/ .featuredcontentBlockHeader { display: flex !important; width: calc(100% / 5 - 8px) !important; min-width: 100% !important; gap: 70%; } .featuredcontentContentContainer { width: 100% !important; } .featuredcontentNode { width: calc(25% - 30px) !important; padding: 2rem !important; max-height: 18.75rem !important; } /*online icon change*/ .apicApiState { background: #E7FED5; border-radius: 10px; padding: 5px; } .apicApiState .icon { margin-bottom: -3px !important; } .apiconnect-explorer .operationInformation .valueText, .apiconnect-explorer .operationInformation .operationParameters, .apiconnect-explorer .operationInformation .codeSnippetsDisplay, .apiconnect-explorer .operationInformation .values, .apiconnect-explorer .operationDisplay .testToolSection .valueText, .apiconnect-explorer .apiconnect-explorer.graphql-display .testToolSection .valueText { padding-top: 30px; } .apiconnect-explorer .keyValueDisplay { grid-template-columns: 35% 65% !important; } .apiconnect-explorer .apic-explorer--docpage { padding: 20px; margin: 2rem; } .apiconnect-explorer .operationInformation, .apiconnect-explorer .operationDisplay .testToolSection { grid-template-columns: 23% 77% !important; } .apiconnect-explorer .labelText { font-family: Satoshi-Medium,Arial,Helvetica,sans-serif !important; } .apiconnect-explorer .operationInformation .apiEndpointUrl, .apiconnect-explorer .endpointDisplay .apiEndpointUrl { color: #555555; } .apiconnect-explorer .markdown p { font-size: 14px !important; color: #555555; } .apiconnect-explorer .operationInformation .labelText, .apiconnect-explorer .operationDisplay .testToolSection .labelText, .apiconnect-explorer .apiconnect-explorer.graphql-display .testToolSection .labelText { font-size: 16px !important; } .apiconnect-explorer .operation-section .operationHeader, .apiconnect-explorer .overview-section .overviewHeader, .apiconnect-explorer .overview-section .overviewBody, .apiconnect-explorer .definitions-section .definitionsHeader, .apiconnect-explorer .definitions-section .definitionsBody { font-family: Satoshi-Medium,Arial,Helvetica,sans-serif; } .apiconnect-explorer .apiconnect-explorer-menu .explorer-toc ul { font-family: Satoshi-Medium,Arial,Helvetica,sans-serif; } .apiconnect-explorer-menu .explorer-toc ul .tocItem a span { font-size: 16px !important; } a.cds--side-nav__link > .cds--side-nav__link-text, .cds--side-nav a.cds--header__menu-item .cds--text-truncate-end { font-size: 16px !important; color: #003078 !important; } .apiconnect-explorer .generateButton, .apiconnect-explorer .copyClientIdButton { border-radius: 14px; width: 25%; } .apiconnect-explorer .apiconnect-explorer.operation-section .operationDisplay { font-family: Satoshi-Medium,Arial,Helvetica,sans-serif !important; } .apiconnect-explorer .operation-section .operationTitle h2 { font-size: 32px !important; } .apiconnect-explorer .cds--tabs__nav-item { background-color: rgba(255, 255, 255, 0.75) !important; color: #555555 !important; } .cds--tabs .cds--tabs__nav-item--selected { background-color: rgba(17, 17, 17, 0.08) !important; border-bottom: 2px solid #111111; } .cds--snippet-btn--expand { margin-right: 38%; border-radius: 30px; font-family: Satoshi-Regular,Arial,Helvetica,sans-serif !important; } .cds--snippet--multi .cds--copy-btn { width: 100% !important; background: inherit !important; content: url("../images/Copy.png"); border: 0 !important; } .cds--snippet--multi { padding: 3rem 1rem 1rem 1rem !important; } .applicationWrapper .titleSection .applicationTabs li.selected a, .applicationCredentials .credentialsTable .credentialsContent .credentialsTabs li.selected a, .nav.nav-tabs.filter-formats li.selected a, .apicMyOrg .titleSection .organizationTabs li.selected a { color: #111111 !important; font-size: 14px !important; width: 10rem; text-decoration: none !important; background: rgba(17, 17, 17, 0.16) !important; border-bottom: 2px solid #111111 !important; } .route-forumindex tbody tr td { color: #555555; } .route-forumindex th, .route-forumpage th { font-size: 18px !important; } .node--type-product.bx--card:hover, .node--type-application.bx--card:hover, .featuredcontentNode:hover, .node--type-api.node--view-mode-embedded.bx--card:hover { background: #ffffff !important; } .node--type-application.bx--card a .apicAppName { font-size: 18px !important; } .bx--card .apicApiCardMain { padding-left: 10px; } .bx--card .apicApiCardMain .bx--about__title--name a { font-size: 18px !important; text-decoration: none !important; color: var(--bell-black) !important; } .bx--card .apicProductDesc { top: 186px !important; font-family: Satoshi-Regular,Arial,Helvetica,sans-serif !important; } /*-----form padding fix-----*/ .route-apic-appcreate .main-container .row, .route-apic-appcreate-step-two .main-container .row, .route-applicationcreate .main-container .row, .route-applicationcreate-step-two .main-container .row, .route-apic-appverify-clientsecret .main-container .row, .route-apic-appcredentials-create .main-container .row, .route-apic-appreset-clientid .main-container .row, .route-apic-appreset-clientsecret .main-container .row, .route-apic-appcredentials-update .main-container .row, .route-apic-appcredentials-delete .main-container .row, .route-apic-appupdate .main-container .row, .route-apic-appdelete .main-container .row, .route-apic-apppromote .main-container .row, .route-apic-appimage-upload .main-container .row, .route-apic-appimage-delete .main-container .row, .route-auth-apicdeleteuser .main-container .row, .route-consumerorgchange-member-role .main-container .row, .route-consumerorgcreate .main-container .row, .route-consumerorgupdate .main-container .row, .route-consumerorgdelete .main-container .row, .route-consumerorgchangeowner .main-container .row, .route-consumerorginvite .main-container .row, .route-consumerorgremove-user .main-container .row, .route-consumerorgresend-invite .main-container .row, .route-consumerorgdelete-invite .main-container .row, .route-consumerorgbilling-add-payment .main-container .row, .route-consumerorgbilling-delete-payment .main-container .row, .route-apic-appdisplay-creds .main-container .row, .route-change-pwd-pagechange-password-form.pass-reset .main-container .row { width: 50% !important; border-radius: 16px !important; padding: 2rem 3rem 0 !important; } .password-confirm-message { font-size: 12px !important; } .navbar .region-navigation-right { gap: 10px; } .route-apic-appcreate .main-container .row .page-header, .route-apic-appcreate-step-two .main-container .row .page-header, .route-applicationcreate .main-container .row .page-header, .route-applicationcreate-step-two .main-container .row .page-header, .route-apic-appverify-clientsecret .main-container .row .page-header, .route-apic-appcredentials-create .main-container .row .page-header, .route-apic-appreset-clientid .main-container .row .page-header, .route-apic-appreset-clientsecret .main-container .row .page-header, .route-apic-appcredentials-update .main-container .row .page-header, .route-apic-appcredentials-delete .main-container .row .page-header, .route-apic-appupdate .main-container .row .page-header, .route-apic-appdelete .main-container .row .page-header, .route-apic-apppromote .main-container .row .page-header, .route-apic-appimage-upload .main-container .row .page-header, .route-apic-appimage-delete .main-container .row .page-header, .route-auth-apicdeleteuser .main-container .row .page-header, .route-consumerorgchange-member-role .main-container .row .page-header, .route-consumerorgcreate .main-container .row .page-header, .route-consumerorgupdate .main-container .row .page-header, .route-consumerorgdelete .main-container .row .page-header, .route-consumerorgchangeowner .main-container .row .page-header, .route-consumerorginvite .main-container .row .page-header, .route-consumerorgremove-user .main-container .row .page-header, .route-consumerorgresend-invite .main-container .row .page-header, .route-consumerorgdelete-invite .main-container .row .page-header, .route-consumerorgbilling-add-payment .main-container .row .page-header, .route-consumerorgbilling-delete-payment .main-container .row .page-header, .route-apic-appdisplay-creds .main-container .row .page-header, .route-change-pwd-pagechange-password-form.pass-reset .main-container .row .page-header { margin-bottom: 3rem !important; padding: 0 !important; } .bx--global-light-ui button.field-add-more-submit.apicTertiary { background-image: url("../images/icons/add url.png") !important; background-repeat: no-repeat !important; background-position: 12px center !important; background-size: 76px !important; padding-left: 65px !important; border: 0 !important; text-indent: -9999px; overflow: hidden; } .applicationSubscriptions .subscriptionsTable .subscriptionsContent th { font-size: 14px !important; } .navbar .dropitmenu ul.dropit-submenu a.elipsis-names { width: 100% !important; } .cds--text-area__wrapper--cols { padding-top: 10px; } .apic-user-forgot-password { padding: 0 0 10px 10rem !important } .bx--global-light-ui .apic-user-form-wrapper .form-group { margin-top: 10px; } /*.apicProductRating .form-item{ display:none; } .apicProduct .apicProductHeader .vote-form .form-item { display: none; } .productApiWrapper header.titleSection .vote-form .form-item { display: none; }*/ .navbar .dropitmenu { padding: 0px !important; margin: 0px !important; } #apic-tooltip { display: none !important; } .consumerorgSelectBlock { padding: 11px 25px !important; } .apiconnect-explorer .generateButton, .apiconnect-explorer .copyClientIdButton { border-radius: 30px; width: 25%; border: 1px solid; height: 35px; } .alert-text-wrapper { padding: 1px 0 27px 0px !important; margin: 0 0 0 77px !important; line-height: 29px; } .route-ibm-apimsubscription-wizard .apicMainContent .subscription-wizard-choose-plan .button.apicTertiary { margin: 1rem 0 1rem calc((100vw - 1251px) / 2 ) !important; } /*.bx--global-light-ui .button:not(.multiple-fields-remove-button), .bx--global-light-ui .btn:not(.multiple-fields-remove-button){ background-image: url(../images/icons/close.png) !important; background-repeat: no-repeat !important; border: 0 !important; text-indent: -9999px; overflow: hidden; }*/ } /*-- ALL Tablet View*/ @media (min-width: 768px) and (max-width: 1024px) { #navbar-collapse .navbar-nav > li.nolink:nth-of-type(2) > span { padding-right: 3px; } #navbar-collapse .navbar-nav > li.nolink:nth-of-type(3) > span { display: inline-block; max-width: 90px; white-space: normal; text-align: left; font-family: var(--bell-font-bellslimrevheavy); font-size: 19px; color: #ffffff; } .apicWizardMain .apicNewAppButton .tile-button { display: inline-flex !important; height: 3rem !important; border-radius: 40px !important; min-width: 12rem !important; } .cds--btn--secondary { background-color: #BD2025 !important; width: 110px !important; height: 2.5rem !important; border: 1px solid #E1E1E1 !important; justify-content: center !important; border-radius: 43px; display: block; padding-left: 30px; color: var(--bell-white) !important; } .cds--btn--secondary:hover { background-color: rgba(151, 26, 30, 1) !important; color: var(--bell-white) !important; } .cds--btn--tertiary { background-color: #ffffff !important; width: 110px !important; height: 2.5rem !important; border: 1px solid #E1E1E1 !important; justify-content: center !important; border-radius: 43px; display: block; padding-left: 30px; } .cds--btn--primary { width: 110px; border: 1px solid #E1E1E1 !important; border-radius: 30px !important; /* width: 9% !important;*/ padding-left: 35px; } /*hide thead save button within form content create new app*/ .form-actions[data-drupal-selector="edit-actions"] button.use-ajax.button--primary { display: none !important; } .apicWizardMain .apicNewAppButton .tile-button:before { content: none !important; } .route-consumerorginvite .main-container .row #edit-actions button, .route-consumerorginvite .main-container .row #edit-actions .button, .route-consumerorginvite .main-container .row .form-actions button, .route-consumerorginvite .main-container .row .form-actions .button { width: 110px !important; height: 2.5rem !important; border: 1px solid #E1E1E1 !important; justify-content: center !important; margin: 10px 15px 27px 6px !important; } .route-consumerorgcreate .main-container .row #edit-actions button, .route-consumerorgcreate .main-container .row #edit-actions .button, .route-consumerorgcreate .main-container .row .form-actions button, .route-consumerorgcreate .main-container .row .form-actions .button { width: 110px !important; height: 2.5rem !important; border: 1px solid #E1E1E1 !important; justify-content: center !important; margin: 10px 15px 27px 6px !important; } .route-apic-appcreate .main-container .row .form-actions .button { width: 110px !important; height: 2.5rem !important; border: 1px solid #E1E1E1 !important; justify-content: center !important; } .bx--global-light-ui .btn.btn-xs { height: 2.5rem !important; margin-top: 30px !important; } .route-apic-appcreate .main-container .row #edit-actions, .route-apic-appcreate .main-container .row .form-actions { margin-bottom: 20px !important; gap: 12px; } .welcomebannertext a.button { font-weight: 500 !important; } .welcomebannertext p { font-size: 16px !important; font-family: Satoshi-Regular,Arial,Helvetica,sans-serif !important; } .welcomebanner .bannerButtonRow a.cta-btns--white__btn { background-color: #FFFFFF !important; color: #003078 !important; border: unset !important; text-decoration: none !important; } .welcomebanner .bannerButtonRow a.cta-btns--white__btn:hover { background: rgba(255, 255, 255, 0.75) !important; color: #003078 !important; } .route-apic-appcreate .main-container .row #edit-actions button, .route-apic-appcreate .main-container .row #edit-actions .button, .route-apic-appcreate .main-container .row .form-actions button, .route-apic-appcreate .main-container .row .form-actions .button, .route-apic-appcreate-step-two .main-container .row #edit-actions button, .route-apic-appcreate-step-two .main-container .row #edit-actions .button, .route-apic-appcreate-step-two .main-container .row .form-actions button, .route-apic-appcreate-step-two .main-container .row .form-actions .button, .route-applicationcreate .main-container .row #edit-actions button, .route-applicationcreate .main-container .row #edit-actions .button, .route-applicationcreate .main-container .row .form-actions button, .route-applicationcreate .main-container .row .form-actions .button, .route-applicationcreate-step-two .main-container .row #edit-actions button, .route-applicationcreate-step-two .main-container .row #edit-actions .button, .route-applicationcreate-step-two .main-container .row .form-actions button, .route-applicationcreate-step-two .main-container .row .form-actions .button, .route-apic-appverify-clientsecret .main-container .row #edit-actions button, .route-apic-appverify-clientsecret .main-container .row #edit-actions .button, .route-apic-appverify-clientsecret .main-container .row .form-actions button, .route-apic-appverify-clientsecret .main-container .row .form-actions .button, .route-apic-appcredentials-create .main-container .row #edit-actions button, .route-apic-appcredentials-create .main-container .row #edit-actions .button, .route-apic-appcredentials-create .main-container .row .form-actions button, .route-apic-appcredentials-create .main-container .row .form-actions .button, .route-apic-appreset-clientid .main-container .row #edit-actions button, .route-apic-appreset-clientid .main-container .row #edit-actions .button, .route-apic-appreset-clientid .main-container .row .form-actions button, .route-apic-appreset-clientid .main-container .row .form-actions .button, .route-apic-appreset-clientsecret .main-container .row #edit-actions button, .route-apic-appreset-clientsecret .main-container .row #edit-actions .button, .route-apic-appreset-clientsecret .main-container .row .form-actions button, .route-apic-appreset-clientsecret .main-container .row .form-actions .button, .route-apic-appcredentials-update .main-container .row #edit-actions button, .route-apic-appcredentials-update .main-container .row #edit-actions .button, .route-apic-appcredentials-update .main-container .row .form-actions button, .route-apic-appcredentials-update .main-container .row .form-actions .button, .route-apic-appcredentials-delete .main-container .row #edit-actions button, .route-apic-appcredentials-delete .main-container .row #edit-actions .button, .route-apic-appcredentials-delete .main-container .row .form-actions button, .route-apic-appcredentials-delete .main-container .row .form-actions .button, .route-apic-appupdate .main-container .row #edit-actions button, .route-apic-appupdate .main-container .row #edit-actions .button, .route-apic-appupdate .main-container .row .form-actions button, .route-apic-appupdate .main-container .row .form-actions .button, .route-apic-appdelete .main-container .row #edit-actions button, .route-apic-appdelete .main-container .row #edit-actions .button, .route-apic-appdelete .main-container .row .form-actions button, .route-apic-appdelete .main-container .row .form-actions .button, .route-apic-apppromote .main-container .row #edit-actions button, .route-apic-apppromote .main-container .row #edit-actions .button, .route-apic-apppromote .main-container .row .form-actions button, .route-apic-apppromote .main-container .row .form-actions .button, .route-apic-appimage-upload .main-container .row #edit-actions button, .route-apic-appimage-upload .main-container .row #edit-actions .button, .route-apic-appimage-upload .main-container .row .form-actions button, .route-apic-appimage-upload .main-container .row .form-actions .button, .route-apic-appimage-delete .main-container .row #edit-actions button, .route-apic-appimage-delete .main-container .row #edit-actions .button, .route-apic-appimage-delete .main-container .row .form-actions button, .route-apic-appimage-delete .main-container .row .form-actions .button, .route-auth-apicdeleteuser .main-container .row #edit-actions button, .route-auth-apicdeleteuser .main-container .row #edit-actions .button, .route-auth-apicdeleteuser .main-container .row .form-actions button, .route-auth-apicdeleteuser .main-container .row .form-actions .button, .route-consumerorgchange-member-role .main-container .row #edit-actions button, .route-consumerorgchange-member-role .main-container .row #edit-actions .button, .route-consumerorgchange-member-role .main-container .row .form-actions button, .route-consumerorgchange-member-role .main-container .row .form-actions .button, .route-consumerorgcreate .main-container .row #edit-actions button, .route-consumerorgcreate .main-container .row #edit-actions .button, .route-consumerorgcreate .main-container .row .form-actions button, .route-consumerorgcreate .main-container .row .form-actions .button, .route-consumerorgupdate .main-container .row #edit-actions button, .route-consumerorgupdate .main-container .row #edit-actions .button, .route-consumerorgupdate .main-container .row .form-actions button, .route-consumerorgupdate .main-container .row .form-actions .button, .route-consumerorgdelete .main-container .row #edit-actions button, .route-consumerorgdelete .main-container .row #edit-actions .button, .route-consumerorgdelete .main-container .row .form-actions button, .route-consumerorgdelete .main-container .row .form-actions .button, .route-consumerorgchangeowner .main-container .row #edit-actions button, .route-consumerorgchangeowner .main-container .row #edit-actions .button, .route-consumerorgchangeowner .main-container .row .form-actions button, .route-consumerorgchangeowner .main-container .row .form-actions .button, .route-consumerorginvite .main-container .row #edit-actions button, .route-consumerorginvite .main-container .row #edit-actions .button, .route-consumerorginvite .main-container .row .form-actions button, .route-consumerorginvite .main-container .row .form-actions .button, .route-consumerorgremove-user .main-container .row #edit-actions button, .route-consumerorgremove-user .main-container .row #edit-actions .button, .route-consumerorgremove-user .main-container .row .form-actions button, .route-consumerorgremove-user .main-container .row .form-actions .button, .route-consumerorgresend-invite .main-container .row #edit-actions button, .route-consumerorgresend-invite .main-container .row #edit-actions .button, .route-consumerorgresend-invite .main-container .row .form-actions button, .route-consumerorgresend-invite .main-container .row .form-actions .button, .route-consumerorgdelete-invite .main-container .row #edit-actions button, .route-consumerorgdelete-invite .main-container .row #edit-actions .button, .route-consumerorgdelete-invite .main-container .row .form-actions button, .route-consumerorgdelete-invite .main-container .row .form-actions .button, .route-consumerorgbilling-add-payment .main-container .row #edit-actions button, .route-consumerorgbilling-add-payment .main-container .row #edit-actions .button, .route-consumerorgbilling-add-payment .main-container .row .form-actions button, .route-consumerorgbilling-add-payment .main-container .row .form-actions .button, .route-consumerorgbilling-delete-payment .main-container .row #edit-actions button, .route-consumerorgbilling-delete-payment .main-container .row #edit-actions .button, .route-consumerorgbilling-delete-payment .main-container .row .form-actions button, .route-consumerorgbilling-delete-payment .main-container .row .form-actions .button, .route-apic-appdisplay-creds .main-container .row #edit-actions button, .route-apic-appdisplay-creds .main-container .row #edit-actions .button, .route-apic-appdisplay-creds .main-container .row .form-actions button, .route-apic-appdisplay-creds .main-container .row .form-actions .button, .route-change-pwd-pagechange-password-form.pass-reset .main-container .row #edit-actions button, .route-change-pwd-pagechange-password-form.pass-reset .main-container .row #edit-actions .button, .route-change-pwd-pagechange-password-form.pass-reset .main-container .row .form-actions button, .route-change-pwd-pagechange-password-form.pass-reset .main-container .row .form-actions .button { width: 110px !important; height: 2.5rem !important; border: 1px solid #E1E1E1 !important; justify-content: center !important; margin: 10px 15px 27px 6px !important; } .bx--global-light-ui .view-filters.form-group .form-inline { flex-wrap: wrap !important; } .bx--global-light-ui .view-filters.form-group .form-actions { display: inline-flex !important; } .startguide { flex-flow: inherit; } .welcomebannertext { padding: 2rem 0px 2rem 24px !important; min-width: 650px; } .featuredcontentBlockHeader { display: ruby !important; } .route-ibm-apimsubscription-wizardnoplan .apicMainContent .apic-wizard-navigation { justify-content: end !important; } .route-ibm-apimsubscription-wizard .apicMainContent .wizard-trail .bx--progress { width: 100% !important; } .navbar-default .navbar-nav .dropdown-menu a { display: block !important; background-color: #FFFFFF !important; } .navbar .region-navigation-right { gap: 8px; } .navbar .dropitmenu { padding: 0px !important; margin: 0px 8px 0px 14px !important; } .consumerorgSelectBlock { padding-top: 16px; padding-right: 1.825rem !important; } section.block.block-consumer-organization-selection { border: 1px solid #EEECE5; border-radius: 30px; height: 55px; } .dropitmenu ul.dropit-submenu li:not(:last-child) { border-bottom: 1px; } .dropitmenu-submenu a { background: #FFFFFF !important; color: #111111 !important; } .apicMainContent { background: #F7F5F2; padding-bottom: 50px; } .navbar-default .navbar-nav .dropdown-menu > li > a:hover, .navbar-default .navbar-nav .dropdown-menu > li > a:focus { background-color: #fff !important; border-left: 4px solid #003078; /* padding: 12px 7px 12px 16px; */ box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2); font-weight: 700; } .apic-user-form.apic-user-form-login, .apic-user-form.apic-user-form-register, .apic-user-form.apic-user-form-reset-pwd { margin-left: 19% !important; margin-bottom: 8%; margin-right: 18% !important; border-radius: 20px; box-shadow: 0 2px 8px rgba(17, 17, 17, 0.16); } .route-entityusercanonical .region-content, .route-entityuseredit-form .region-content, .route-change-pwd-pagechange-password-form:not(.pass-reset) .region-content { grid-template-columns: 294px auto !important; } .navbar .logo { padding-left: 7px !important; } .apiconnect-explorer button.expMenuCollapseButton { background-color: #003078 !important; } } /*Mobile View */ @media (max-width: 767px) { .navbar .logo { display: block !important; position: absolute; left: 38px; top: 9px; } footer.footer ul { flex-direction: column; } footer.footer .navbar-text { display: none; } footer.footer.container { height: 200px !important; justify-content: center !important; text-align: center; padding-bottom: 30px; padding-left: 0 !important; } footer.footer ul.nav > li > a { margin-right: unset !important; } .bx--global-light-ui .apicMainContent .ui-accordion .ui-accordion-header { height: 4rem !important; } nav.block-account { margin-left: 0px !important; } .featuredcontentBlockHeader, .featuredcontentContentContainer { width: 100%; } .featuredcontentBlockHeader { text-align: center; } .block-get-help .get_help .column { width: 100%; } .route-entityusercanonical .region-content, .route-entityuseredit-form .region-content, .route-change-pwd-pagechange-password-form:not(.pass-reset) .region-content { display: block } .path-user.route-entityusercanonical .region-content nav.tabs ul.tabs--primary, .path-user.route-entityuseredit-form .region-content nav.tabs ul.tabs--primary, .path-user.route-change-pwd-pagechange-password-form:not(.pass-reset) .region-content nav.tabs ul.tabs--primary { display: inline-flex !important; flex-direction: column; padding-left: 0; } .route-entityusercanonical .page-header, .route-entityuseredit-form .page-header, .route-change-pwd-pagechange-password-form:not(.pass-reset) .page-header { font-size: 1.5rem !important; } .apicMyOrg .titleSection .organizationTabs ul, .applicationWrapper .titleSection .applicationTabs ul { flex-direction: column; overflow: hidden; z-index: 10; max-height: 40px; transition: max-height 0.25s ease-in-out; } .apicMyOrg .titleSection .organizationTabs ul li, .applicationWrapper .titleSection .applicationTabs ul li { order: 2; } .apicMyOrg .titleSection .organizationTabs ul li.selected, .applicationWrapper .titleSection .applicationTabs ul li.selected { order: 1; } .apicMyOrg .titleSection .organizationTabs ul:hover, .apicMyOrg .titleSection .organizationTabs ul:focus-within, .apicMyOrg .titleSection .organizationTabs ul:active, .applicationWrapper .titleSection .applicationTabs ul:hover, .applicationWrapper .titleSection .applicationTabs ul:focus-within, .applicationWrapper .titleSection .applicationTabs ul:active { max-height: none; overflow-y: visible; } .apicMyOrg .field.organizationMembers { padding-left: 0; padding-right: 0; } table.apic-my-org-members-mobile-table { display: block; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: thin; } table.apic-my-org-members-mobile-table thead { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); border: 0; } table.apic-my-org-members-mobile-table tbody { display: flex; gap: 1rem; padding-bottom: 0.5rem; } table.apic-my-org-members-mobile-table tr { display: grid; grid-template-columns: minmax(6rem, 28%) minmax(16rem, 1fr); flex: 0 0 clamp(28rem, 125vw, 38rem); scroll-snap-align: start; border: 1px solid var(--bell-border-gray); border-radius: 8px; background-color: var(--bell-white); overflow: visible; } table.apic-my-org-members-mobile-table td { display: grid; grid-template-columns: minmax(6rem, 28%) minmax(16rem, 1fr); grid-column: 1 / -1; align-items: start; padding: 0.75rem; border-bottom: 1px solid var(--bell-border-gray); overflow: hidden; word-break: break-word; } table.apic-my-org-members-mobile-table td:last-child { border-bottom: 0; overflow: visible; } .apicMyOrg .apicMyOrgMembers tbody td:first-child { text-align: center; padding-left: 0.5rem; } table.apic-my-org-members-mobile-table td::before { content: attr(data-label); color: var(--bell-medium-gray-text); font-weight: 700; padding-right: 0.375rem; } table.apic-my-org-members-mobile-table .apic-member-cell-value { grid-column: 2; display: flex; flex-wrap: wrap; gap: 0.25rem 0.5rem; min-width: 0; max-width: 100%; overflow-wrap: anywhere; } table.apic-my-org-members-mobile-table td:first-child .apic-member-cell-value { display: block; min-height: 5.5rem; align-items: flex-start; } table.apic-my-org-members-mobile-table td:first-child .apiMyOrgMemberDetails { display: block; gap: 0.25rem; align-items: flex-start; max-width: 100%; min-width: 0; } table.apic-my-org-members-mobile-table td:first-child .memberIcon { display: block; width: 1.75rem; min-width: 1.75rem; margin-bottom: 0.25rem; } table.apic-my-org-members-mobile-table td:first-child .memberIcon span { display: block; } table.apic-my-org-members-mobile-table td:first-child .memberIcon img { display: block; width: 1.75rem; max-width: 1.75rem; height: auto; } table.apic-my-org-members-mobile-table td:first-child .orgApicUser { display: flex; flex-direction: column; gap: 0.125rem; min-width: 0; max-width: 100%; } table.apic-my-org-members-mobile-table td:first-child .apicUserFirstLastName { font-size: 1rem !important; line-height: 1.2; min-width: 0; margin: 0; overflow-wrap: anywhere; } table.apic-my-org-members-mobile-table td:first-child .apicUserMail { min-width: 0; overflow-wrap: anywhere; } table.apic-my-org-members-mobile-table .apic-member-cell-value img { max-width: 3rem; height: auto; flex: 0 0 auto; } table.apic-my-org-members-mobile-table .apic-member-cell-value a, table.apic-my-org-members-mobile-table .apic-member-cell-value span, table.apic-my-org-members-mobile-table .apic-member-cell-value div { max-width: 100%; } table.apic-my-org-members-mobile-table .dropit-trigger { position: relative; } table.apic-my-org-members-mobile-table .dropit-trigger.dropit-open > .dropit-submenu { position: absolute; left: 0; bottom: 100%; z-index: 20; display: block; min-width: 10rem; margin-bottom: 0.5rem; } table.apic-my-org-members-mobile-table .dropit-trigger.dropit-open > .dropit-submenu a { white-space: nowrap; } .apicMyOrg .apicMyOrgMembers .apicMyOrgNoMembers { flex-direction: column; padding: 0; } .apicMyOrg .apicMyOrgMembers .dropit .dropit-submenu { bottom: 100%; top: unset; right: -3rem; } .page-node-type-application .container .contentInnerWrapper, .page-node-type-application .container .titleInnerWrapper { width: calc(100% - 1rem) !important; } .flowGrid { flex-direction: column; } .eventLog { padding: 1rem; } .apicMyOrg .apicMyOrgMembers .apicNewUser { padding-left: 36px; padding-right: 36px; } .modal .modal-dialog { margin: auto; } .SplitPane.vertical { flex-direction: column !important; overflow-y: scroll !important; } .apiconnect-explorer .stretch { position: relative; } pre code { white-space: unset; } .apiconnect-explorer button.expMenuCollapseButton { background-color: var(--bell-dark-blue) !important; } } @media (min-width: 2560px) { .apicMainContent { min-height: calc(110vh - 0px) !important; } .apic-user-form.apic-user-form-login, .apic-user-form.apic-user-form-register, .apic-user-form.apic-user-form-reset-pwd { margin-left: 40% !important; } } .apic-user-form-inner-wrapper { line-height: 18px; } /* .apic-user-form-footer { padding-left: 22% !important; } */ .apic-user-form-subheader { margin-left: 8% !important; } .captcha-type-challenge--image { padding: 12px !important; } .bx--global-light-ui form.confirmation { line-height: 18px; } .apicProductCardMain .apicProductCategory { border: 1px solid; width: auto; border-radius: 10px; padding: 5px 0px 21px 5px; background-color: var(--bell-darker-blue); color: #ffffff; margin: -49px 0 10px 212px; } .apicProductCardMain .apicProductCategory .field--label { display: none; } .apicProductCardMain .apicProductCategory .field--label { display: none; } .apicProductCardMain .apicProductCategory .field--item a { color: white !important; } /* .apic-user-form-footer .business-login-links { padding: 10px; } .apic-user-form-footer .business-login-links div div { padding:10px; } */ /* Center the main container block onto the middle of the viewport */ .apic-user-form-footer .business-login-links { display: flex; flex-direction: column; justify-content: center; align-items: center; text-align: center; /* min-height: 100vh; Takes full height of the viewport to allow vertical centering */ width: 100%; /* Takes full width to allow horizontal centering */ box-sizing: border-box; } /* Ensure the inner direct wrapper behaves as a centered flex container */ .apic-user-form-footer .business-login-links > div { display: flex; flex-direction: column; align-items: center; gap: 15px; /* Safely adds spacing between your rows without breaking margins */ } /* Ensure links align text beautifully to the absolute center */ .apic-user-form-footer .business-login-links a { text-align: center; display: inline-block; text-decoration: none; /* Optional: cleans up the default link look */ } .block-language .dropdown-menu a:focus { outline: none; } /* Container layout to center everything on the screen */ .error-container { display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; font-family: "Segoe UI", Roboto, Helvetica, Arial, sans-serif; padding: 60px 20px; background-color: #ffffff; } /* Yellow circle icon style */ .error-icon { display: flex; align-items: center; justify-content: center; width: 80px; height: 80px; border: 4px solid #f0ad4e; border-radius: 50%; color: #f0ad4e; font-size: 48px; font-weight: 300; margin-bottom: 24px; } /* "Oops" header style */ .error-title { font-size: 56px; font-weight: 600; color: #000000; margin: 0 0 20px 0; } /* Description body text */ .error-message p { font-size: 16px; color: #333333; margin: 4px 0; } /* 403 / Access Denied status sub-text */ .error-footer { margin-top: 24px; } .error-code { font-size: 14px; color: #555555; letter-spacing: 0.5px; display: block; margin-bottom: 12px; } /* Login hyperlink styling */ .login-link { color: #0056b3; text-decoration: none; font-weight: 500; } .login-link:hover { text-decoration: underline; }