/*
 * /drug_drug_interaction_checker/ ONLY. Generated by tools/port-legacy-page.mjs — do not hand-tune
 * towards the design system. If this page is ever redesigned it should be
 * rebuilt from components and this file deleted whole.
 *
 * 349 of 7960 rules from the live site, re-scoped under .db-legacy.
 * That wrapper is what lets legacy CSS and Tailwind share a page: the legacy
 * reboot rules become `.db-legacy h1`, which outranks preflight inside the
 * wrapper and is inert everywhere else.
 */
.db-legacy {
  --db-mark: #d00993;         /* pink-500 — the mark on a light ground */
  --db-mark-bright: #ff00b4;  /* pink-bright — the mark on a dark ground */
  --db-mark-hover: #970669;   /* pink-700 — its hover/active darkening */
  --db-mark-tint: rgba(208, 9, 147, 0.1);
  --blue: #007bff;
  --indigo: #6610f2;
  --purple: #6f42c1;
  --pink: #e83e8c;
  --red: #dc3545;
  --orange: #fd7e14;
  --yellow: #ffc107;
  --green: #28a745;
  --teal: #20c997;
  --cyan: #17a2b8;
  --white: #fff;
  --gray: #6c757d;
  --gray-dark: #343a40;
  --primary: #007bff;
  --secondary: #6c757d;
  --success: #28a745;
  --info: #17a2b8;
  --warning: #ffc107;
  --danger: #dc3545;
  --light: #f8f9fa;
  --dark: #343a40;
  --breakpoint-xs: 0;
  --breakpoint-sm: 576px;
  --breakpoint-md: 768px;
  --breakpoint-lg: 992px;
  --breakpoint-xl: 1200px;
  --font-family-sans-serif: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  --font-family-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  --db-white: #FDFDFE;
  --db-zebra-stripe-grey: #FCFCFC;
  --db-pink-50: #FAE6F4;
  --db-pink-100: #F0B3DE;
  --db-pink-200: #E98ECD;
  --db-pink-300: #E05AB7;
  --db-pink-400: #D93AA9;
  --db-pink-500: #D00993;
  --db-pink-600: #BD0886;
  --db-pink-700: #940668;
  --db-pink-800: #720551;
  --db-pink-900: #57043E;
  --db-blue-10: #F7F8FF;
  --db-blue-50: #EBECF9;
  --db-blue-100: #C2C5ED;
  --db-blue-200: #A4A9E5;
  --db-blue-300: #7A82D9;
  --db-blue-400: #616AD1;
  --db-blue-500: #3945C6;
  --db-blue-600: #343FB4;
  --db-blue-700: #28318D;
  --db-blue-800: #1F266D;
  --db-blue-900: #181D53;
  --db-dk-blue-10: #F3F5F6;
  --db-dk-blue-50: #D1D5DB;
  --db-dk-blue-100: #B2B8C4;
  --db-dk-blue-200: #8B95A6;
  --db-dk-blue-300: #647288;
  --db-dk-blue-400: #3E4E6B;
  --db-dk-blue-500: #172B4D;
  --db-dk-blue-600: #132440;
  --db-dk-blue-700: #0F1D33;
  --db-dk-blue-800: #0C1627;
  --db-dk-blue-900: #080E1A;
  --db-orange-50: #FAF0E8;
  --db-orange-100: #EED2B8;
  --db-orange-200: #E6BC96;
  --db-orange-300: #DB9D66;
  --db-orange-400: #D48A49;
  --db-orange-500: #C96D1B;
  --db-orange-600: #B76319;
  --db-orange-700: #8F4D13;
  --db-orange-800: #6F3C0F;
  --db-orange-900: #542E0B;
  --db-green-50: #F3F5E6;
  --db-green-100: #D9DFB1;
  --db-green-200: #C6D08C;
  --db-green-300: #ACBA57;
  --db-green-400: #9CAD36;
  --db-green-500: #839804;
  --db-green-600: #778A04;
  --db-green-700: #5D6C03;
  --db-green-800: #485402;
  --db-green-900: #374002;
  --db-violet-50: #F2EEF6;
  --db-violet-100: #D5C9E4;
  --db-violet-200: #C1AFD7;
  --db-violet-300: #A58AC5;
  --db-violet-400: #9374B9;
  --db-violet-500: #7851A8;
  --db-violet-600: #6D4A99;
  --db-violet-700: #553A77;
  --db-violet-800: #422D5C;
  --db-violet-900: #322247;
  --db-teal-50: #E7F2F2;
  --db-teal-100: #B6D5D7;
  --db-teal-200: #92C1C4;
  --db-teal-300: #61A5A9;
  --db-teal-400: #429499;
  --db-teal-500: #13797F;
  --db-teal-600: #116E74;
  --db-teal-700: #0D565A;
  --db-teal-800: #0A4346;
  --db-teal-900: #083335;
  --db-success-50: #E6F3EA;
  --db-success-100: #B0DBBE;
  --db-success-200: #8AC99F;
  --db-success-300: #54B173;
  --db-success-400: #33A158;
  --db-success-500: #008A2E;
  --db-success-600: #007E2A;
  --db-success-700: #006221;
  --db-success-800: #004C19;
  --db-success-900: #003A13;
  --db-warning-50: #FDE6E8;
  --db-warning-100: #F8B0B8;
  --db-warning-200: #F48A96;
  --db-warning-300: #F05466;
  --db-warning-400: #ED3348;
  --db-warning-500: #E8001A;
  --db-warning-600: #D30018;
  --db-warning-700: #A50012;
  --db-warning-800: #80000E;
  --db-warning-900: #61000B;
  --swiper-theme-color: #007aff;
  --swiper-navigation-size: 44px;
}

/* Legacy CSS stacks freely (z-index 100, 150…). The site header is
   position:static and creates no stacking context, so without this the page
   paints over the navbar and its mega-menu opens behind the content. */
.db-legacy { position: relative; z-index: 0; }

/* Preflight sets `img,svg,video,canvas,audio,iframe,embed,object
   { display:block; vertical-align:middle }` and `img,video
   { max-width:100%; height:auto }`. Legacy markup predates all of it and lays
   these out as the inline boxes the browser default makes them: images carry
   explicit heights and are meant to overflow their column, and the plugin
   video sits in a line box whose descender is part of the panel's height.
   Both halves matter. `display:block` on the video shortened
   /clinical/drug_search/'s plugin panel by 6px against the live page, and
   `vertical-align:middle` shortened it by the same 6px again: an inline
   replaced element sits ON the baseline, and the descender space below it is
   part of the line box and therefore part of the panel. Neither is
   load-bearing for anything, which is exactly why both survive a screenshot
   comparison. `baseline` is the browser default these pages were written
   against. */
.db-legacy img, .db-legacy video, .db-legacy canvas,
.db-legacy audio, .db-legacy iframe, .db-legacy embed, .db-legacy object {
  display: inline;
  vertical-align: baseline;
}
.db-legacy img, .db-legacy video { max-width: none; }

/* Preflight also sets `ol,ul,menu { list-style: none }`, and legacy markup
   expects the browser default — a bare `<ul>` in this markup is a bulleted
   list, because nothing in the legacy sheet ever had to say so. Losing the
   discs turns "Access the module for:" followed by three bullets into three
   stray indented lines. `revert` rather than `disc` so nested lists still
   step through circle and square the way the UA sheet does, and so an `<ol>`
   keeps its numbers. Every legacy list that is deliberately unmarked —
   `.nav`, `.check-list`, `.workflow-list` — carries its own
   `list-style: none` at a higher specificity and still wins. */
.db-legacy ul, .db-legacy ol, .db-legacy menu { list-style: revert; }

/* Centre button labels rather than trusting font metrics to do it. */
.db-legacy .commercial-page .button,
.db-legacy .commercial-page a.button { display: inline-flex; align-items: center; justify-content: center; }

.db-legacy {position:relative}
.db-legacy .commercial-page {background-color:white}
.db-legacy .commercial-page, .db-legacy .commercial-page li, .db-legacy .commercial-page p, .db-legacy .commercial-page a, .db-legacy .commercial-page h1, .db-legacy .commercial-page h2, .db-legacy .commercial-page h4, .db-legacy .commercial-page h5 {font-family:Gemeli, "Helvetica Neue", Helvetica, Arial, sans-serif;text-rendering:optimizelegibility;font-feature-settings:"kern";color:rgb(38, 48, 99)}
.db-legacy .commercial-page, .db-legacy .commercial-page li, .db-legacy .commercial-page p, .db-legacy .commercial-page a {font-weight:400}
.db-legacy .commercial-page a:hover, .db-legacy .commercial-page a:active, .db-legacy .commercial-page a:focus {color:inherit;text-decoration:none}
.db-legacy .commercial-page h1, .db-legacy .commercial-page h2, .db-legacy .commercial-page h4, .db-legacy .commercial-page h5 {font-weight:700}
.db-legacy .commercial-page .db-container {padding:0px;margin:0px 20px;width:auto}
@media (max-width:479px){.db-legacy .commercial-page .panel {padding-top:35px!important;padding-bottom:35px!important}}
@media (max-width:479px){.db-legacy .commercial-page .header-panel {padding-top:35px!important}}
@media (min-width:480px){.db-legacy .commercial-page .db-container {min-width:calc(100% - 100px);margin:0px 50px;max-width:412px}}
@media (min-width:768px){.db-legacy .commercial-page .db-container {max-width:668px}}
@media (min-width:992px){.db-legacy .commercial-page .db-container {max-width:772px;margin:0px 100px;min-width:calc(100% - 200px)}}
@media (min-width:1200px){.db-legacy .commercial-page .db-container {max-width:1000px;min-width:0px;margin:0px auto}}
.db-legacy .commercial-page .panel {padding-top:75px;padding-bottom:75px;margin-bottom:0px;border-width:medium;border-style:none;border-color:currentcolor;border-image:none;border-radius:0px;overflow-x:hidden;box-shadow:none}
.db-legacy .commercial-page .panel .overflow-panel {overflow:hidden}
.db-legacy .commercial-page .panel .db-container {display:flex;flex-direction:column;padding:0px}
.db-legacy .commercial-page .panel h1, .db-legacy .commercial-page .panel h2, .db-legacy .commercial-page .panel h4, .db-legacy .commercial-page .panel h5 {margin-top:0px;margin-bottom:15px}
.db-legacy .commercial-page .panel h1 {font-size:50px;font-weight:normal;line-height:64px}
.db-legacy .commercial-page .panel h2 {font-size:40px;font-weight:normal;line-height:48px}
.db-legacy .commercial-page .panel h4 {font-size:20px;font-weight:normal;line-height:30px}
.db-legacy .commercial-page .panel h5 {font-size:18px;font-weight:normal;line-height:24px;text-transform:uppercase}
.db-legacy .commercial-page .panel p {font-size:18px;line-height:25px;margin-top:15px;margin-bottom:15px}
.db-legacy .commercial-page .panel ul {margin-top:15px;margin-bottom:15px}
.db-legacy .commercial-page .panel li {font-size:18px;line-height:30px}
.db-legacy .commercial-page .panel .action-buttons {margin-top:20px;margin-left:-15px;margin-right:-15px}
.db-legacy .commercial-page .panel .action-buttons .button {vertical-align:top}
.db-legacy .commercial-page .panel .action-buttons .button.db-outline {padding:0px}
.db-legacy .commercial-page .header-panel {position:relative;padding-top:40px;padding-bottom:0px;transition:padding-top 0.5s}
.db-legacy .commercial-page .header-panel h1 {margin-bottom:20px}
.db-legacy .commercial-page .header-panel .page-title {text-transform:uppercase;font-size:20px;line-height:30px;margin-top:0px;margin-bottom:10px}
.db-legacy .commercial-page .header-panel .db-container {padding:60px 0px 30px!important}
.db-legacy .commercial-page .centered-panel .db-container {align-items:center;justify-content:center}
.db-legacy .commercial-page .centered-panel .db-container p {text-align:center}
.db-legacy .commercial-page .centered-panel h2, .db-legacy .commercial-page .centered-panel h5, .db-legacy .commercial-page .centered-panel p {text-align:center;max-width:750px}
.db-legacy .commercial-page .centered-panel h2 {margin-bottom:30px}
.db-legacy .commercial-page .centered-panel .action-buttons {margin-top:0px}
.db-legacy .commercial-page .centered-panel a {font-size:18px;line-height:28px;color:rgb(114, 125, 212);font-weight:bold;text-align:center;transition:opacity 0.25s}
.db-legacy .commercial-page .centered-panel a:hover, .db-legacy .commercial-page .centered-panel a:active {opacity:0.75}
.db-legacy .commercial-page .centered-panel a .drugbank-icon {margin-left:5px;position:relative;top:1px}
.db-legacy .commercial-page .centered-panel a .drugbank-icon svg {height:14px;width:14px}
@media (max-width:767px){.db-legacy .commercial-page .centered-panel h2 {font-size:34px;line-height:44px}}
@media (max-width:479px){.db-legacy .commercial-page .centered-panel h2 {font-size:26px;line-height:36px}}
.db-legacy .commercial-page .info-panel {padding-top:150px;padding-bottom:150px}
.db-legacy .commercial-page .info-panel .db-container {flex-direction:row;align-items:center;justify-content:space-between}
.db-legacy .commercial-page .info-panel .db-container>:first-child {padding-right:4%}
.db-legacy .commercial-page .info-panel .db-container>:last-child {padding-left:4%}
.db-legacy .commercial-page .info-panel .db-container .text-box, .db-legacy .commercial-page .info-panel .db-container .image-box {width:50%}
.db-legacy .commercial-page .info-panel .db-container .image-box {text-align:center}
.db-legacy .commercial-page .info-panel p {font-size:20px;line-height:30px;font-weight:normal}
@media (max-width:767px){.db-legacy .commercial-page .info-panel {padding-top:75px;padding-bottom:75px;overflow:hidden}}
@media (max-width:767px){.db-legacy .commercial-page .info-panel.left-panel .db-container {flex-direction:column-reverse}}
@media (max-width:767px){.db-legacy .commercial-page .info-panel.left-panel .db-container .text-box, .db-legacy .commercial-page .info-panel.left-panel .db-container .image-box {padding:0px}}
@media (max-width:767px){.db-legacy .commercial-page .info-panel.left-panel .db-container .image-box:not(:first-child) {padding:0px 0px 20px}}
@media (max-width:767px){.db-legacy .commercial-page .info-panel .db-container .text-box, .db-legacy .commercial-page .info-panel .db-container .image-box {width:100%!important}}
@media (max-width:767px){.db-legacy .commercial-page .info-panel h2 {font-size:28px;line-height:38px}}
.db-legacy .commercial-page .white-panel {background:white}
.db-legacy .commercial-page .light-blue-panel {background:rgba(225, 226, 246, 0.4)}
.db-legacy .commercial-page .swoosh-panel {background-image:url("/static/img/commercial/company/Banner_Background.svg");background-position:70px -40px;background-size:auto;background-repeat:no-repeat;padding-bottom:100px}
.db-legacy .commercial-page .product-header-panel .db-container {flex-direction:row;justify-content:space-between}
.db-legacy .commercial-page .product-header-panel h1 {font-size:20px;line-height:30px;text-transform:uppercase}
.db-legacy .commercial-page .product-header-panel p {font-size:20px;line-height:30px}
.db-legacy .commercial-page .product-header-panel .header-text {display:flex;flex-direction:column;z-index:110;min-width:480px}
.db-legacy .commercial-page .product-header-panel .header-images {position:relative;z-index:100}
.db-legacy .commercial-page .product-header-panel .header-images img {position:relative}
@media (max-width:991px){.db-legacy .commercial-page .product-header-panel .db-container {flex-direction:column!important;align-items:stretch}}
@media (max-width:991px){.db-legacy .commercial-page .product-header-panel .header-text {min-width:auto}}
@media (max-width:767px){.db-legacy .commercial-page .product-header-panel .header-text {max-width:100%}}
.db-legacy .commercial-page .large-bottom-margin-panel {padding-top:75px;padding-bottom:150px}
@media (max-width:767px){.db-legacy .commercial-page .large-bottom-margin-panel {padding-top:0px;padding-bottom:75px}}
@media (max-width:479px){.db-legacy .commercial-page .large-bottom-margin-panel {padding-top:0px!important;padding-bottom:50px!important}}
.db-legacy .commercial-page #contact-panel h2.db-default {margin-bottom:25px}
@media (max-width:767px){.db-legacy .commercial-page #contact-panel h2.db-default {margin-bottom:20px}}
@media (max-width:479px){.db-legacy .commercial-page #contact-panel h2.db-default {margin-bottom:15px}}
.db-legacy .commercial-page #contact-panel p.db-large {margin-top:0px;text-align:center;margin-bottom:40px}
@media (max-width:767px){.db-legacy .commercial-page #contact-panel p.db-large {margin-bottom:35px}}
@media (max-width:479px){.db-legacy .commercial-page #contact-panel p.db-large {margin-bottom:30px}}
.db-legacy .commercial-page .drugbank-icon svg {width:20px;height:20px}
.db-legacy .commercial-page .drugbank-icon {display:inline-block}
.db-legacy .commercial-page .drugbank-icon svg {display:block;background-color:transparent;fill:currentcolor;vertical-align:middle}
.db-legacy .commercial-page .drugbank-icon.icon-dark-blue {color:rgb(38, 48, 99);fill:rgb(38, 48, 99);stroke:rgb(38, 48, 99)}
.db-legacy .commercial-page .drugbank-icon.icon-pink {color:var(--db-mark);fill:var(--db-mark);stroke:var(--db-mark)}
.db-legacy .commercial-page .drugbank-icon.no-stroke {stroke:none!important}
.db-legacy .commercial-page .db-carousel {background:white;box-shadow:rgba(34, 55, 121, 0.2) 0px 0px 6px 0px;z-index:150}
.db-legacy .commercial-page .db-carousel .carousel-inner .item {background-color:white;height:100%;overflow:hidden}
.db-legacy .commercial-page .db-carousel .carousel-control {background-image:none;opacity:1;color:rgb(114, 125, 212);text-shadow:none;background-color:white;height:60px;width:60px;border-radius:30px;top:calc(50% - 30px);box-shadow:rgba(34, 55, 121, 0.2) 0px 0px 6px 0px}
.db-legacy .commercial-page .db-carousel .carousel-control.left {left:-30px;padding:20px 22px 20px 18px}
.db-legacy .commercial-page .db-carousel .carousel-control.right {right:-30px;padding:20px 18px 20px 22px}
.db-legacy .commercial-page .db-carousel .carousel-control:hover {opacity:1}
.db-legacy .commercial-page .db-carousel .carousel-control .drugbank-icon {margin:0px;top:0px}
@media (max-width:479px){.db-legacy .commercial-page .db-carousel .carousel-control {height:46px;width:46px;border-radius:23px;top:calc(50% - 23px);box-shadow:rgba(34, 55, 121, 0.2) 0px 0px 6px 0px}}
@media (max-width:479px){.db-legacy .commercial-page .db-carousel .carousel-control.left {left:-23px;padding:13px 14px 13px 10px}}
@media (max-width:479px){.db-legacy .commercial-page .db-carousel .carousel-control.right {right:-23px;padding:13px 10px 13px 14px}}
@media (min-width:768px){.db-legacy .commercial-page .db-carousel.mobile-carousel {box-shadow:none;background:transparent}}
@media (min-width:768px){.db-legacy .commercial-page .db-carousel.mobile-carousel .carousel-inner {height:auto;display:flex;flex-direction:row}}
@media (min-width:768px){.db-legacy .commercial-page .db-carousel.mobile-carousel .carousel-inner .item {height:auto;display:inherit;transform:none;transition:none}}
@media (min-width:768px){.db-legacy .commercial-page .db-carousel.mobile-carousel .carousel-control {display:none}}
.db-legacy .commercial-page #customer-carousel {border-radius:10px}
.db-legacy .commercial-page #customer-carousel .carousel-inner {border-radius:10px;height:auto}
@media (min-width:768px){.db-legacy .commercial-page #customer-carousel .carousel-item {width:50%;margin-right:auto;justify-content:center}}
@media (max-width:767px){.db-legacy .commercial-page #customer-carousel {width:calc(100% - 52px)}}
@media (max-width:767px){.db-legacy .commercial-page #customer-carousel .carousel-inner {justify-content:flex-start}}
.db-legacy .commercial-page .customer-logos {display:flex;flex-flow:wrap;justify-content:space-between}
.db-legacy .commercial-page .customer-logos .customer-box {display:flex;flex-direction:column;justify-content:center;align-items:center;height:160px;width:222px;max-width:100%}
.db-legacy .commercial-page .customer-logos .customer-box a {text-align:center}
.db-legacy .commercial-page .customer-logos .customer-box img {max-width:125px;height:auto;max-height:120px;margin:0px auto}
@media (max-width:1199px){.db-legacy .commercial-page .customer-logos .customer-box {width:250px}}
@media (max-width:767px){.db-legacy .commercial-page .customer-logos .customer-box {width:300px;height:180px}}
@media (max-width:479px){.db-legacy .commercial-page .customer-logos .customer-box {width:250px}}
.db-legacy .commercial-page ul.check-list {list-style-type:none;padding:0px;margin:0px}
.db-legacy .commercial-page ul.check-list li {margin-left:25px}
.db-legacy .commercial-page ul.check-list li::before {content:"";display:inline-block;background-image:url("/static/img/commercial/icons/Icon_NavyCheck.svg");background-size:contain;background-repeat:no-repeat;width:10px;height:8px;margin-left:-25px;margin-right:15px;vertical-align:top;margin-top:9px}
.db-legacy .commercial-page .top-padding-0 {padding-top:0px}
.db-legacy .commercial-page .text-very-dark-blue, .db-legacy .commercial-page .text-very-dark-blue>*, .db-legacy .commercial-page .text-very-dark-blue>ul li {color:rgb(22, 31, 68)}
.db-legacy .commercial-page h1 {color:rgb(22, 31, 68)}
.db-legacy .commercial-page h1.db-default {font-size:50px;line-height:62px;font-weight:bold;text-transform:none}
@media (max-width:479px){.db-legacy .commercial-page h1.db-default {font-size:38px;line-height:50px}}
.db-legacy .commercial-page h2 {color:rgb(22, 31, 68)}
.db-legacy .commercial-page h2.db-default {font-size:40px;line-height:48px;font-weight:bold;text-transform:none}
@media (max-width:767px){.db-legacy .commercial-page h2.db-default {font-size:34px;line-height:42px}}
@media (max-width:479px){.db-legacy .commercial-page h2.db-default {font-size:30px;line-height:38px}}
.db-legacy .commercial-page p.db-large, .db-legacy .commercial-page ul.db-large, .db-legacy .commercial-page ul.db-large>li {font-size:24px;line-height:34px}
@media (max-width:767px){.db-legacy .commercial-page p.db-large, .db-legacy .commercial-page ul.db-large, .db-legacy .commercial-page ul.db-large>li {font-size:20px;line-height:30px}}
@media (max-width:479px){.db-legacy .commercial-page p.db-large, .db-legacy .commercial-page ul.db-large, .db-legacy .commercial-page ul.db-large>li {font-size:18px;line-height:28px}}
.db-legacy .commercial-page p.db-default {font-size:16px;line-height:24px}
.db-legacy .commercial-page ul.check-list.db-large li::before {width:20px;height:15px}
@media (max-width:767px){.db-legacy .commercial-page ul.check-list.db-large li::before {width:15px;height:12px;margin-right:10px}}
@media (max-width:479px){.db-legacy .commercial-page ul.check-list.db-large li::before {width:15px;height:10px;margin-right:10px}}
.db-legacy .commercial-page .button, .db-legacy .commercial-page a.button, .db-legacy .commercial-page a.button:visited {position:relative;display:inline-block;margin-left:15px;margin-right:15px;margin-top:15px;text-transform:uppercase;font-size:16px;font-weight:normal}
.db-legacy .commercial-page .button.db-outline .button-body, .db-legacy .commercial-page a.button.db-outline .button-body, .db-legacy .commercial-page a.button.db-outline:visited .button-body {position:relative;font-size:16px;font-weight:normal;line-height:1.2;padding:9.5px 19px;border-radius:22px;color:var(--db-mark);border:2px solid var(--db-mark);background-color:transparent;transition:0.25s}
.db-legacy .commercial-page .button.db-outline:hover, .db-legacy .commercial-page .button.db-outline:active, .db-legacy .commercial-page .button.db-outline:focus, .db-legacy .commercial-page a.button.db-outline:hover, .db-legacy .commercial-page a.button.db-outline:active, .db-legacy .commercial-page a.button.db-outline:focus, .db-legacy .commercial-page a.button.db-outline:visited:hover, .db-legacy .commercial-page a.button.db-outline:visited:active, .db-legacy .commercial-page a.button.db-outline:visited:focus {opacity:1;outline:none!important}
.db-legacy .commercial-page .button.db-outline:hover .button-body, .db-legacy .commercial-page .button.db-outline:active .button-body, .db-legacy .commercial-page .button.db-outline:focus .button-body, .db-legacy .commercial-page a.button.db-outline:hover .button-body, .db-legacy .commercial-page a.button.db-outline:active .button-body, .db-legacy .commercial-page a.button.db-outline:focus .button-body, .db-legacy .commercial-page a.button.db-outline:visited:hover .button-body, .db-legacy .commercial-page a.button.db-outline:visited:active .button-body, .db-legacy .commercial-page a.button.db-outline:visited:focus .button-body {background-color:var(--db-mark-hover);border:2px solid var(--db-mark-hover);color:white}
.db-legacy .commercial-page .button.db-outline:hover .button-body, .db-legacy .commercial-page a.button.db-outline:hover .button-body, .db-legacy .commercial-page a.button.db-outline:visited:hover .button-body {transform:translateY(-2px)}
.db-legacy .commercial-page .button.db-outline:active .button-body, .db-legacy .commercial-page .button.db-outline:focus .button-body, .db-legacy .commercial-page a.button.db-outline:active .button-body, .db-legacy .commercial-page a.button.db-outline:focus .button-body, .db-legacy .commercial-page a.button.db-outline:visited:active .button-body, .db-legacy .commercial-page a.button.db-outline:visited:focus .button-body {box-shadow:none;transform:translateY(0px)}
.db-legacy .commercial-page .button.dark, .db-legacy .commercial-page a.button.dark, .db-legacy .commercial-page a.button.dark:visited {font-size:16px;font-weight:normal;line-height:1.2;padding:10.5px 20px;border-radius:22px;color:white;background-color:var(--db-mark);transition:0.25s}
.db-legacy .commercial-page .button.dark:hover, .db-legacy .commercial-page .button.dark:active, .db-legacy .commercial-page .button.dark:focus, .db-legacy .commercial-page a.button.dark:hover, .db-legacy .commercial-page a.button.dark:active, .db-legacy .commercial-page a.button.dark:focus, .db-legacy .commercial-page a.button.dark:visited:hover, .db-legacy .commercial-page a.button.dark:visited:active, .db-legacy .commercial-page a.button.dark:visited:focus {background-color:var(--db-mark-hover);color:white;opacity:1;outline:none!important}
.db-legacy .commercial-page .button.dark:hover, .db-legacy .commercial-page a.button.dark:hover, .db-legacy .commercial-page a.button.dark:visited:hover {transform:translateY(-2px)}
.db-legacy .commercial-page .button.dark:active, .db-legacy .commercial-page .button.dark:focus, .db-legacy .commercial-page a.button.dark:active, .db-legacy .commercial-page a.button.dark:focus, .db-legacy .commercial-page a.button.dark:visited:active, .db-legacy .commercial-page a.button.dark:visited:focus {transform:translateY(0px)}
.db-legacy.db-legacy.db-legacy .commercial-page #ddi-checker-header {padding-bottom:75px}
.db-legacy.db-legacy.db-legacy .commercial-page #ddi-checker-header .db-container {padding:120px 0px 0px!important}
@media (max-width:767px){.db-legacy.db-legacy.db-legacy .commercial-page #ddi-checker-header .db-container {padding:82px 0px 0px!important}}
.db-legacy.db-legacy.db-legacy .commercial-page #ddi-checker-header p.db-large {margin-top:0px;margin-bottom:0px}
.db-legacy.db-legacy.db-legacy .commercial-page #ddi-checker-header h1, .db-legacy.db-legacy.db-legacy .commercial-page #ddi-checker-header p {max-width:590px}
.db-legacy.db-legacy.db-legacy .commercial-page #ddi-checker-header .title-box .header-text {width:50%;max-width:590px}
.db-legacy.db-legacy.db-legacy .commercial-page #ddi-checker-header .title-box .header-images {display:flex;flex-direction:row;width:50%}
.db-legacy.db-legacy.db-legacy .commercial-page #ddi-checker-header .ddi-header-img {height:550px;margin-top:-100px}
.db-legacy.db-legacy.db-legacy .commercial-page .ddi-checker-panel {padding-bottom:0px!important;padding-top:0px}
.db-legacy.db-legacy.db-legacy .commercial-page .ddi-checker-panel p {text-align:center}
.db-legacy.db-legacy.db-legacy .commercial-page .ddi-checker-panel .ddi-search-img {width:750px;height:auto}
@media (max-width:991px){.db-legacy.db-legacy.db-legacy .commercial-page .developer-container .ddi-checker-example .example-header>div {justify-content:center}}
@media (max-width:991px){.db-legacy.db-legacy.db-legacy .commercial-page .developer-container .ddi-checker-example .example-header img {display:none}}
@media (max-width:991px){.db-legacy.db-legacy.db-legacy .commercial-page .centered-panel .ddi-search-img {width:100%}}
@media (max-width:767px){.db-legacy.db-legacy.db-legacy .commercial-page .developer-container .example-col, .db-legacy.db-legacy.db-legacy .commercial-page .developer-container .info-col {padding:0px;margin:0px -5px}}
@media (max-width:767px){.db-legacy.db-legacy.db-legacy .commercial-page .developer-container .ddi-checker-example .example-header {padding:20px}}
@media (max-width:767px){.db-legacy.db-legacy.db-legacy .commercial-page .developer-container .ddi-checker-example .example-header h5 {font-size:18px;line-height:22px}}
@media (max-width:767px){.db-legacy.db-legacy.db-legacy .commercial-page .developer-container .ddi-checker-example .input-row {padding:20px}}
@media (max-width:767px){.db-legacy.db-legacy.db-legacy .commercial-page .developer-container .ddi-checker-example .input-row>div {font-size:20px}}
@media (max-width:767px){.db-legacy.db-legacy.db-legacy .commercial-page .developer-container .ddi-checker-example .data-row {padding:10px 20px}}
@media (max-width:767px){.db-legacy.db-legacy.db-legacy .commercial-page .developer-container .ddi-checker-example .data-row:first-child {margin-top:10px}}
@media (max-width:767px){.db-legacy.db-legacy.db-legacy .commercial-page .developer-container .ddi-checker-example .data-row:last-child {margin-bottom:10px}}
@media (max-width:767px){.db-legacy.db-legacy.db-legacy .commercial-page .developer-container .ddi-checker-example .small-row {width:50%;display:inline-block}}
@media (max-width:767px){.db-legacy.db-legacy.db-legacy .commercial-page .developer-container .ddi-checker-example .highlight-row.active {background:var(--db-mark-tint)!important}}
@media (max-width:479px){.db-legacy.db-legacy.db-legacy .commercial-page .developer-container .ddi-checker-example .example-header h5 {font-size:16px;line-height:18px}}
@media (max-width:479px){.db-legacy.db-legacy.db-legacy .commercial-page .developer-container .ddi-checker-example .input-row>div {font-size:18px}}
@media (max-width:479px){.db-legacy.db-legacy.db-legacy .commercial-page .developer-container .ddi-checker-example .data-row>div:first-child {font-size:14px;line-height:18px}}
@media (max-width:479px){.db-legacy.db-legacy.db-legacy .commercial-page .developer-container .ddi-checker-example .data-row>div:last-child {font-size:14px;line-height:18px}}
.db-legacy.db-legacy .commercial-page .clinical-header-panel .title-box {display:flex;flex-direction:row;position:relative;width:100%}
.db-legacy.db-legacy .commercial-page .clinical-header-panel .title-box .header-text {flex-shrink:0;min-width:auto}
.db-legacy.db-legacy .commercial-page .clinical-header-panel .title-box .header-text :last-child {margin-bottom:0px!important}
.db-legacy.db-legacy .commercial-page .clinical-header-panel .title-box .header-images {flex-shrink:1}
@media (max-width:767px){.db-legacy.db-legacy .commercial-page .clinical-header-panel .title-box .header-text {width:100%!important;max-width:100%!important}}
@media (max-width:767px){.db-legacy.db-legacy .commercial-page .clinical-header-panel .title-box .header-images {display:none!important}}
.db-legacy.db-legacy .commercial-page #ddi-checker-example-panel.developer-panel {padding-bottom:0px!important;padding-top:120px}
.db-legacy.db-legacy .commercial-page .developer-panel .db-container {flex-direction:column}
.db-legacy.db-legacy .commercial-page .developer-panel .header-text {margin-bottom:40px}
.db-legacy.db-legacy .commercial-page .developer-panel .info-col {margin-top:83px}
.db-legacy.db-legacy .commercial-page .developer-panel h2 {max-width:815px;margin-left:-3px}
.db-legacy.db-legacy .commercial-page .developer-panel h4, .db-legacy.db-legacy .commercial-page .developer-panel h5, .db-legacy.db-legacy .commercial-page .developer-panel p {max-width:630px;font-weight:100}
.db-legacy.db-legacy .commercial-page .developer-panel h2 {margin-bottom:30px}
.db-legacy.db-legacy .commercial-page .developer-panel ul li {margin-bottom:15px}
.db-legacy.db-legacy .commercial-page .developer-container .info-col, .db-legacy.db-legacy .commercial-page .developer-container .example-col {display:inline-block;height:100%;vertical-align:top;float:none}
.db-legacy.db-legacy .commercial-page .developer-container .flip-card {perspective:1000px}
.db-legacy.db-legacy .commercial-page .developer-container .flip-card .flip-card-inner {width:100%;height:100%;text-align:center;transition:transform 0.8s;transform-style:preserve-3d}
.db-legacy.db-legacy .commercial-page .developer-container .example-item, .db-legacy.db-legacy .commercial-page .developer-container .example-item :not(img) {backface-visibility:hidden}
.db-legacy.db-legacy .commercial-page .developer-container .back-end {position:absolute;width:100%;height:100%;transform:rotateY(180deg);top:0px;padding:5% 6%;text-align:left;display:flex;flex-direction:column}
.db-legacy.db-legacy .commercial-page .developer-container .back-end h5 {font-size:14px;line-height:22px;font-weight:bold;margin-bottom:10px}
.db-legacy.db-legacy .commercial-page .developer-container .back-end pre {padding:20px;overflow:scroll;border-radius:10px}
.db-legacy.db-legacy .commercial-page .developer-container .back-end pre code {white-space:pre-wrap}
.db-legacy.db-legacy .commercial-page .developer-container .back-end .query-box {margin-bottom:20px;flex-shrink:0}
.db-legacy.db-legacy .commercial-page .developer-container .back-end .response-box {margin-bottom:0px;flex-shrink:1}
.db-legacy.db-legacy .commercial-page .developer-container .ddi-checker-example {background-color:white;box-shadow:rgba(34, 55, 121, 0.2) 0px 0px 6px 0px;padding-bottom:25px;position:relative}
.db-legacy.db-legacy .commercial-page .developer-container .ddi-checker-example .example-header {padding:27px 40px;background-color:rgb(22, 31, 68)}
.db-legacy.db-legacy .commercial-page .developer-container .ddi-checker-example .example-header>div {display:flex;flex-direction:row;justify-content:space-between}
.db-legacy.db-legacy .commercial-page .developer-container .ddi-checker-example .example-header h5 {font-size:20px;line-height:24px;font-weight:normal;color:white;margin-bottom:0px}
.db-legacy.db-legacy .commercial-page .developer-container .ddi-checker-example .example-header img {height:14px;width:auto;margin-top:4px}
.db-legacy.db-legacy .commercial-page .developer-container .ddi-checker-example .row {margin-left:0px;margin-right:0px;border:2px solid transparent}
.db-legacy.db-legacy .commercial-page .developer-container .ddi-checker-example .row>div {padding:0px}
.db-legacy.db-legacy .commercial-page .developer-container .ddi-checker-example .input-row {padding:30px 40px;background-color:rgba(225, 226, 246, 0.2)}
.db-legacy.db-legacy .commercial-page .developer-container .ddi-checker-example .input-row>div {display:flex;flex-direction:row;justify-content:space-around;font-size:25px;line-height:30px;color:rgb(22, 31, 68)}
.db-legacy.db-legacy .commercial-page .developer-container .ddi-checker-example .input-row .drugbank-icon svg {width:35px}
.db-legacy.db-legacy .commercial-page .developer-container .ddi-checker-example .data-row {text-align:left;padding:10px 40px}
.db-legacy.db-legacy .commercial-page .developer-container .ddi-checker-example .data-row:first-child {margin-top:30px}
.db-legacy.db-legacy .commercial-page .developer-container .ddi-checker-example .data-row:last-child {margin-bottom:30px}
.db-legacy.db-legacy .commercial-page .developer-container .ddi-checker-example .data-row>div:first-child {font-size:14px;line-height:18px;text-transform:uppercase;font-weight:bold}
.db-legacy.db-legacy .commercial-page .developer-container .ddi-checker-example .data-row>div:last-child {font-size:16px;line-height:22px}
.db-legacy.db-legacy .commercial-page .developer-container .ddi-checker-example .severity-label {background-color:rgb(178, 183, 234);color:white;text-transform:uppercase;font-size:15px;line-height:20px;font-weight:bold;padding:2px 18px;border-radius:12px;display:inline-block}
.db-legacy.db-legacy .commercial-page .developer-container .ddi-checker-example .highlight-row {transition:border 0.25s ease-in-out}
.db-legacy.db-legacy .commercial-page .developer-container .ddi-checker-example .highlight-row.active {border:2px solid var(--db-mark)}
.db-legacy.db-legacy .commercial-page .developer-container .ddi-checker-code {background-color:white;box-shadow:rgba(34, 55, 121, 0.2) 0px 0px 6px 0px;padding:40px 40px 75px;transition:0.5s}
.db-legacy.db-legacy .commercial-page .developer-container .info-col h4 {text-transform:none;font-weight:normal}
.db-legacy.db-legacy .commercial-page .developer-container .info-col .info-box {background-color:white;box-shadow:rgba(34, 55, 121, 0.2) 0px 0px 6px 0px;border-radius:15px;padding:20px;margin-left:20px;margin-right:15px;position:absolute;opacity:0;left:15px;border:2px solid transparent;z-index:100;transition:opacity 0.25s ease-in-out}
.db-legacy.db-legacy .commercial-page .developer-container .info-col .info-box .info-box-content {display:none}
.db-legacy.db-legacy .commercial-page .developer-container .info-col .info-box .info-box-content h4 {margin-bottom:10px}
.db-legacy.db-legacy .commercial-page .developer-container .info-col .info-box .info-box-content p {font-size:16px;font-weight:100;margin:0px}
.db-legacy.db-legacy .commercial-page .developer-container .info-col .info-box .info-box-content.active {display:block}
.db-legacy.db-legacy .commercial-page .developer-container .info-col .info-box::before {content:"";border-top:2px solid var(--db-mark);width:50px;position:absolute;top:50%;left:-52px}
.db-legacy.db-legacy .commercial-page .developer-container .info-col .info-box.active {opacity:1;z-index:150}
@media (max-width:991px){.db-legacy.db-legacy .commercial-page h1 {font-size:40px;line-height:50px}}
@media (max-width:991px){.db-legacy.db-legacy .commercial-page h2 {font-size:30px;line-height:38px}}
@media (max-width:767px){.db-legacy.db-legacy .commercial-page .developer-container .toggle-container {display:none}}
@media (max-width:767px){.db-legacy.db-legacy .commercial-page .developer-container .back-end {display:none}}
@media (max-width:767px){.db-legacy.db-legacy .commercial-page .developer-container .info-col {padding-top:0px}}
@media (max-width:767px){.db-legacy.db-legacy .commercial-page .developer-container .info-col .info-box {position:fixed;width:100%;margin:0px;left:0px;opacity:0;pointer-events:none;border-radius:0px;bottom:0px!important}}
@media (max-width:767px){.db-legacy.db-legacy .commercial-page .developer-container .info-col .info-box .info-box-content {text-align:center}}
@media (max-width:767px){.db-legacy.db-legacy .commercial-page .developer-container .info-col .info-box .info-box-content h4 {color:var(--db-mark)}}
@media (max-width:767px){.db-legacy.db-legacy .commercial-page .developer-container .info-col .info-box::before {display:none}}
.db-legacy.db-legacy .commercial-page .toggle-container {width:100%;display:flex;flex-direction:column;align-items:center;margin-bottom:30px}
.db-legacy.db-legacy .commercial-page .toggle-container .developer-toggle {display:flex;flex-direction:column;align-items:center;margin-bottom:0px}
.db-legacy.db-legacy .commercial-page .toggle-container .developer-toggle input {opacity:0;width:0px;height:0px}
.db-legacy.db-legacy .commercial-page .toggle-container .developer-toggle .slider {position:relative;width:47px;height:22px;cursor:pointer;background-color:rgb(38, 48, 122);transition:0.4s;border-radius:10.5px;opacity:0.5}
.db-legacy.db-legacy .commercial-page .toggle-container .developer-toggle .toggle-label {opacity:0.5;font-size:14px;line-height:22px;text-transform:uppercase;font-weight:bold;margin-top:5px}
.db-legacy.db-legacy .commercial-page .toggle-container .developer-toggle .slider::before {position:absolute;content:"";height:16px;width:16px;left:3px;bottom:3px;background-color:rgb(243, 243, 251);transition:0.4s;border-radius:50%}
.db-legacy.db-legacy .commercial-page .toggle-container .developer-toggle input:checked+.slider {opacity:1}
.db-legacy.db-legacy .commercial-page .toggle-container .developer-toggle input:checked~.toggle-label {opacity:1}
.db-legacy.db-legacy .commercial-page .toggle-container .developer-toggle input:focus+.slider {box-shadow:rgb(33, 150, 243) 0px 0px 1px}
.db-legacy.db-legacy .commercial-page .toggle-container .developer-toggle input:checked+.slider::before {transform:translateX(25px)}
.db-legacy.db-legacy .commercial-page .clinical-customer-carousel {padding:60px 80px;background-color:white;box-shadow:rgba(34, 55, 121, 0.2) 0px 0px 6px 0px!important;border-radius:0px!important}
.db-legacy.db-legacy .commercial-page .clinical-customer-carousel .header {text-align:center}
.db-legacy.db-legacy .commercial-page .clinical-customer-carousel .header h5 {display:inline-block;border-bottom:2px solid var(--db-mark);padding-bottom:10px}
.db-legacy.db-legacy .commercial-page .clinical-customer-carousel .customer-logos .customer-box {width:210px}
@media (min-width:768px) and (max-width:1199px){.db-legacy.db-legacy .commercial-page .clinical-customer-carousel .item {width:50%;display:flex;justify-content:center}}
@media (max-width:767px){.db-legacy.db-legacy .commercial-page .clinical-customer-carousel {padding:40px}}
@media (max-width:767px){.db-legacy.db-legacy .commercial-page .clinical-customer-carousel .item {width:100%}}
@media (max-width:767px){.db-legacy.db-legacy .commercial-page .clinical-customer-carousel .item .customer-box {margin:0px auto}}
@media (max-width:479px){.db-legacy.db-legacy .commercial-page .clinical-customer-carousel {padding:20px;margin-top:35px;margin-bottom:15px;max-width:calc(100% - 20px)}}
@media (max-width:479px){.db-legacy.db-legacy .commercial-page .clinical-customer-carousel .customer-box {width:210px}}
.db-legacy.db-legacy .commercial-page .plugin-panel {background-color:rgb(22, 31, 68);padding-top:100px;padding-bottom:100px}
.db-legacy.db-legacy .commercial-page .plugin-panel .text-box h2, .db-legacy.db-legacy .commercial-page .plugin-panel .text-box p {color:white}
.db-legacy.db-legacy .commercial-page .plugin-panel .text-box h2 {font-weight:bold;margin-bottom:25px}
@media (max-width:767px){.db-legacy.db-legacy .commercial-page .plugin-panel .text-box h2 {margin-bottom:20px;font-size:30px!important;line-height:38px!important}}
.db-legacy.db-legacy .commercial-page .plugin-panel .text-box p {font-size:16px;line-height:24px;font-weight:normal}
.db-legacy.db-legacy .commercial-page .plugin-panel .text-box p:nth-of-type(1) {font-weight:bold;font-size:24px;line-height:34px;margin-bottom:25px}
@media (max-width:767px){.db-legacy.db-legacy .commercial-page .plugin-panel .text-box p {margin-bottom:15px;font-size:14px;line-height:22px}}
@media (max-width:767px){.db-legacy.db-legacy .commercial-page .plugin-panel .text-box p:nth-of-type(1) {font-size:18px;line-height:28px;margin-bottom:15px}}
.db-legacy.db-legacy .commercial-page .plugin-panel .text-box .plugin-label {color:var(--db-mark);font-weight:bold;text-transform:uppercase;font-size:24px;line-height:34px;margin-bottom:8px;display:block}
.db-legacy.db-legacy .commercial-page .plugin-panel .text-box .plugin-label .icon-plugin {margin-right:10px}
.db-legacy.db-legacy .commercial-page .plugin-panel .text-box .plugin-label .icon-plugin svg {display:inline-block;width:25px;height:25px;vertical-align:sub}
@media (max-width:767px){.db-legacy.db-legacy .commercial-page .plugin-panel .text-box .plugin-label {font-size:20px;line-height:30px}}
@media (max-width:767px){.db-legacy.db-legacy .commercial-page .plugin-panel .text-box .plugin-label .icon-plugin svg {width:22px;height:22px}}
@media (max-width:479px){.db-legacy.db-legacy .commercial-page .plugin-panel .text-box .plugin-label {font-size:18px;line-height:28px}}
@media (max-width:479px){.db-legacy.db-legacy .commercial-page .plugin-panel .text-box .plugin-label .icon-plugin {margin-right:8px}}
@media (max-width:479px){.db-legacy.db-legacy .commercial-page .plugin-panel .text-box .plugin-label .icon-plugin svg {width:20px;height:20px}}
.db-legacy.db-legacy .commercial-page .plugin-panel .image-box video.plugin-demo {width:100%;max-width:500px;height:auto;border-radius:10px}
.db-legacy code[class*="language-"], .db-legacy pre[class*="language-"] {color:rgb(255, 255, 255);background:none;text-shadow:rgba(0, 0, 0, 0.3) 0px 1px;font-family:Consolas, Monaco, "Andale Mono", "Ubuntu Mono", monospace;font-size:1em;text-align:left;white-space:pre;word-spacing:normal;word-break:normal;overflow-wrap:normal;line-height:1.5;tab-size:4;hyphens:none}
.db-legacy pre[class*="language-"] {padding:1em;margin:0.5em 0px;overflow:auto;border-radius:0.3em}
.db-legacy pre[class*="language-"] {background:rgb(22, 31, 68)}
.db-legacy .token.punctuation {color:rgb(255, 255, 255)}
.db-legacy .token.property {color:rgb(114, 125, 212)}
.db-legacy .token.number {color:rgb(178, 183, 234)}
.db-legacy .token.string {color:var(--db-mark)}
.db-legacy .token.operator {color:white}
.db-legacy .token.keyword {color:rgb(178, 183, 234)}
.db-legacy h1, .db-legacy h2, .db-legacy h4, .db-legacy h5 {margin-top:0px;margin-bottom:0.5rem}
.db-legacy p {margin-top:0px;margin-bottom:1rem}
.db-legacy ul {margin-top:0px;margin-bottom:1rem}
.db-legacy strong {font-weight:bolder}
.db-legacy a {color:rgb(0, 176, 242);text-decoration:none;background-color:transparent}
.db-legacy a:hover {color:rgb(0, 120, 166);text-decoration:underline}
.db-legacy pre, .db-legacy code {font-family:SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;font-size:1em}
.db-legacy pre {margin-top:0px;margin-bottom:1rem;overflow:auto}
.db-legacy img {vertical-align:middle;border-style:none}
.db-legacy svg {overflow:hidden;vertical-align:middle}
.db-legacy label {display:inline-block;margin-bottom:0.5rem}
.db-legacy input {margin:0px;font-family:inherit;font-size:inherit;line-height:inherit}
.db-legacy input {overflow:visible}
.db-legacy [role="button"] {cursor:pointer}
.db-legacy input[type="checkbox"] {box-sizing:border-box;padding:0px}
.db-legacy h1, .db-legacy h2, .db-legacy h4, .db-legacy h5 {margin-bottom:0.5rem;font-weight:500;line-height:1.2}
.db-legacy h1 {font-size:2.5rem}
.db-legacy h2 {font-size:2rem}
.db-legacy h4 {font-size:1.5rem}
.db-legacy h5 {font-size:1.25rem}
.db-legacy code {font-size:87.5%;color:rgb(232, 62, 140);overflow-wrap:break-word}
.db-legacy pre {display:block;font-size:87.5%;color:rgb(33, 37, 41)}
.db-legacy pre code {font-size:inherit;color:inherit;word-break:normal}
.db-legacy .db-container {width:100%;padding-right:15px;padding-left:15px;margin-right:auto;margin-left:auto}
@media (min-width:576px){.db-legacy .db-container {max-width:540px}}
@media (min-width:768px){.db-legacy .db-container {max-width:720px}}
@media (min-width:992px){.db-legacy .db-container {max-width:960px}}
@media (min-width:1200px){.db-legacy .db-container {max-width:1140px}}
.db-legacy .row {display:flex;flex-wrap:wrap;margin-right:-15px;margin-left:-15px}
.db-legacy .col-md-8, .db-legacy .col-md-4, .db-legacy .col-sm-12, .db-legacy .col-sm-9, .db-legacy .col-sm-3 {position:relative;width:100%;padding-right:15px;padding-left:15px}
@media (min-width:576px){.db-legacy .col-sm-3 {flex:0 0 25%;max-width:25%}}
@media (min-width:576px){.db-legacy .col-sm-9 {flex:0 0 75%;max-width:75%}}
@media (min-width:576px){.db-legacy .col-sm-12 {flex:0 0 100%;max-width:100%}}
@media (min-width:768px){.db-legacy .col-md-4 {flex:0 0 33.3333%;max-width:33.3333%}}
@media (min-width:768px){.db-legacy .col-md-8 {flex:0 0 66.6667%;max-width:66.6667%}}
.db-legacy .db-btn {display:inline-block;font-weight:400;color:rgb(33, 37, 41);text-align:center;vertical-align:middle;user-select:none;background-color:transparent;border:1px solid transparent;padding:0.375rem 0.75rem;font-size:1rem;line-height:1.5;border-radius:0.25rem;transition:color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out}
@media (prefers-reduced-motion:reduce){.db-legacy .db-btn {transition:none}}
.db-legacy .db-btn:hover {color:rgb(33, 37, 41);text-decoration:none}
.db-legacy .db-btn:focus {outline:0px;box-shadow:rgba(0, 123, 255, 0.25) 0px 0px 0px 0.2rem}
.db-legacy .db-btn:disabled {opacity:0.65}
.db-legacy .db-carousel {position:relative}
.db-legacy .carousel-inner {position:relative;width:100%;overflow:hidden}
.db-legacy .carousel-inner::after {display:block;clear:both;content:""}
.db-legacy .carousel-item {position:relative;display:none;float:left;width:100%;margin-right:-100%;backface-visibility:hidden;transition:transform 0.6s ease-in-out}
@media (prefers-reduced-motion:reduce){.db-legacy .carousel-item {transition:none}}
.db-legacy .carousel-item.active {display:block}
.db-legacy .carousel-control-prev, .db-legacy .carousel-control-next {position:absolute;top:0px;bottom:0px;z-index:1;display:flex;align-items:center;justify-content:center;width:15%;padding:0px;color:rgb(255, 255, 255);text-align:center;background:none;border:0px;opacity:0.5;transition:opacity 0.15s}
@media (prefers-reduced-motion:reduce){.db-legacy .carousel-control-prev, .db-legacy .carousel-control-next {transition:none}}
.db-legacy .carousel-control-prev:hover, .db-legacy .carousel-control-prev:focus, .db-legacy .carousel-control-next:hover, .db-legacy .carousel-control-next:focus {color:rgb(255, 255, 255);text-decoration:none;outline:0px;opacity:0.9}
.db-legacy .carousel-control-prev {left:0px}
.db-legacy .carousel-control-next {right:0px}
.db-legacy .db-sr-only {position:absolute;width:1px;height:1px;padding:0px;margin:-1px;overflow:hidden;clip:rect(0px, 0px, 0px, 0px);white-space:nowrap;border:0px}
@media print{.db-legacy a:not(.db-btn) {text-decoration:underline}}
@media print{.db-legacy pre {white-space:pre-wrap!important}}
@media print{.db-legacy pre {border:1px solid rgb(173, 181, 189);break-inside:avoid}}
@media print{.db-legacy img {break-inside:avoid}}
@media print{.db-legacy p, .db-legacy h2 {orphans:3;widows:3}}
@media print{.db-legacy h2 {break-after:avoid}}
@media print{.db-legacy .db-container {min-width:992px!important}}
.db-legacy p.db-large, .db-legacy ul.db-large, .db-legacy ul.db-large>li {font-size:24px;line-height:34px}
@media (max-width:767px){.db-legacy p.db-large, .db-legacy ul.db-large, .db-legacy ul.db-large>li {font-size:20px;line-height:30px}}
@media (max-width:479px){.db-legacy p.db-large, .db-legacy ul.db-large, .db-legacy ul.db-large>li {font-size:18px;line-height:28px}}
.db-legacy p.db-default {font-size:16px;line-height:24px}
.db-legacy .drugbank-icon {display:inline-block;line-height:0}
.db-legacy .drugbank-icon svg {background-color:transparent;fill:currentcolor;width:1.5rem;height:1.5rem;vertical-align:middle}
.db-legacy h1 {color:rgb(170, 179, 193);font-weight:lighter}
.db-legacy h2 {color:rgb(0, 22, 30);font-weight:lighter;font-size:1.7rem;margin-top:1.5rem}
.db-legacy p {font-weight:lighter}
.db-legacy .db-btn {cursor:pointer;transition:background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out, color 0.15s ease-in-out;display:inline-flex;align-items:center;justify-content:center}
@media (max-width:767.98px){.db-legacy .db-btn:not(.dbp-button,.dbp-btn--not-mobile,.hs-button) {padding:0.25rem 0.5rem;font-size:0.875rem;line-height:1.5;border-radius:999px}}

/* --------------------------------------------------------------------------
 * RE-ADDED BY HAND — the state-class rules the probe drops silently.
 *
 * A. `.flip-card.flipped`, and the two rules that repaint the card's faces
 *    once it is over. `flipped` is applied at runtime, so it is on nothing in
 *    a static export. It is the whole Developer View animation: without it the
 *    checkbox toggles a class that paints nothing.
 *
 * B. Bootstrap's slide transition for the customer logo strip, which below
 *    768px is a real carousel. Same story: `carousel-item-next`/`-prev`/
 *    `-left`/`-right` only ever exist mid-transition.
 *
 * The `.highlight-row.active` and `.info-box-content.active` rules are NOT
 * here — the export ships with "Management" already selected, so those classes
 * WERE in the markup and the probe kept them.
 *
 * All copied verbatim from the live stylesheet.
 * ------------------------------------------------------------------------ */
.db-legacy .commercial-page .developer-container .flip-card.flipped .flip-card-inner { transform: rotateY(180deg); }
.db-legacy .commercial-page .developer-container .flip-card.flipped .flip-card-inner .ddi-checker-code { background: rgb(244, 244, 252); box-shadow: none; }
.db-legacy .commercial-page .developer-container .flip-card.flipped .flip-card-inner .ddi-checker-example .example-header { margin: 1px; }

/*
 * `.force-hide-xs` is the class the live page's script puts on the info box
 * below 768px, so that the box can be selected — row highlighted, panel
 * chosen — while staying invisible until the reader taps. Runtime class, so
 * the probe never saw it.
 */
@media (max-width: 767px) {
  .db-legacy .commercial-page .developer-container .info-col .info-box.force-hide-xs { opacity: 0 !important; }
}

.db-legacy .carousel-item-next,
.db-legacy .carousel-item-prev { display: block; }
.db-legacy .carousel-item-next:not(.carousel-item-left),
.db-legacy .active.carousel-item-right { transform: translateX(100%); }
.db-legacy .carousel-item-prev:not(.carousel-item-right),
.db-legacy .active.carousel-item-left { transform: translateX(-100%); }
.db-legacy .carousel-item.active.carousel-item-left,
.db-legacy .carousel-item.active.carousel-item-right { position: absolute; top: 0; left: 0; }

/* Respect a reduced-motion preference. Bootstrap ships this guard for the
   carousel; the flip and the info box are given the same treatment. */
@media (prefers-reduced-motion: reduce) {
  .db-legacy .carousel-item { transition: none; }
  .db-legacy .commercial-page .developer-container .flip-card .flip-card-inner { transition: none; }
  .db-legacy .commercial-page .developer-container .info-col .info-box { transition: none; }
}

/*
 * NO COUNTERPART ON THE LIVE SITE. The interaction rows are reachable by
 * keyboard here (see the script) and the toggle's real `<input>` is
 * `opacity: 0; width: 0`, so both need a ring the legacy sheet never drew.
 */
.db-legacy .commercial-page .developer-toggle input:focus-visible + .slider,
.db-legacy .commercial-page .highlight-row:focus-visible,
.db-legacy .commercial-page .carousel-control:focus-visible,
.db-legacy .commercial-page .customer-box a:focus-visible {
  outline: 2px solid var(--db-mark) !important;
  outline-offset: 2px;
  border-radius: 4px;
}

/* --------------------------------------------------------------------------
 * THE TWO PINKS ON A DARK GROUND. Measured in the browser: the plugin label
 * and its icon sit on the navy plugin panel (#161F44), and the JSON strings
 * sit on the navy code box. On that ground #d00993 measures 3.15:1 and
 * #ff00b4 measures 4.5:1 — so these, and only these, take pink-bright.
 *
 * Scoped to the panel rather than applied to `.icon-pink` wholesale: if a
 * later port puts that class on a light ground, the base rule is still right.
 * ------------------------------------------------------------------------ */
.db-legacy.db-legacy .commercial-page .plugin-panel .text-box .plugin-label { color: var(--db-mark-bright); }
.db-legacy.db-legacy .commercial-page .plugin-panel .drugbank-icon.icon-pink {
  color: var(--db-mark-bright);
  fill: var(--db-mark-bright);
  stroke: var(--db-mark-bright);
}
.db-legacy .token.string { color: var(--db-mark-bright); }
