/* FAST.css 10-06-25 */ @import url(https://fonts.googleapis.com/css?family=Roboto:400,700); img { max-width: 100%; border: 0; -ms-interpolation-mode: bicubic; vertical-align: bottom; } /* Suppress the space beneath the baseline */ video { max-width: 100%; height: auto; } a { scroll-margin-top: 800px; } /* (Marcelo 15-03-22) Added to cater to stick menu covering anchor destinations */ /* Embed Container (iFrame, Object, Embed) */ .hs-responsive-embed { position: relative; height: auto; overflow: hidden; padding-top: 0; padding-left: 0; padding-right: 0; } .hs-responsive-embed iframe, .hs-responsive-embed object, .hs-responsive-embed embed { width: 100%; height: 100%; border: 0; } .hs-responsive-embed, .hs-responsive-embed.hs-responsive-embed-youtube, .hs-responsive-embed.hs-responsive-embed-vimeo { padding-bottom: 2%; } iframe[src^="http://www.slideshare.net/slideshow/embed_code/"] { width: 100%; max-width: 100%; } @media (max-width: 568px) { iframe { max-width: 100%; } } /* Forms */ textarea, input[type="text"], input[type="password"], input[type="datetime"], input[type="datetime-local"], input[type="date"], input[type="month"],input[type="time"], input[type="week"], input[type="number"], input[type="email"], input[type="url"], input[type="search"], input[type="tel"], input[type="color"], select { padding: 6px; display: inline-block; width: 100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } /* Menus */ .hs-menu-wrapper ul { padding: 0; } .hs-menu-wrapper.hs-menu-flow-horizontal ul { list-style: none; margin: 0; } .hs-menu-wrapper.hs-menu-flow-horizontal > ul { display: inline-block; margin-bottom: 20px; } .hs-menu-wrapper.hs-menu-flow-horizontal > ul:before { content: " "; display: table; } .hs-menu-wrapper.hs-menu-flow-horizontal > ul:after { content: " "; display: table; clear: both; } .hs-menu-wrapper.hs-menu-flow-horizontal > ul li.hs-menu-depth-1 { float: left; } .hs-menu-wrapper.hs-menu-flow-horizontal > ul li a { display: inline-block; padding: 10px 20px; white-space: nowrap; max-width: 140px; overflow: hidden; text-overflow: ellipsis; text-decoration: none; } .hs-menu-wrapper.hs-menu-flow-horizontal > ul li.hs-item-has-children { position: relative; } .hs-menu-wrapper.hs-menu-flow-horizontal > ul li.hs-menu-depth-2.hs-item-has-children { padding-right:20px !important; } /* (Marcelo 18-08-23) padding-right added to add row for the > char*/ .hs-menu-wrapper.hs-menu-flow-horizontal > ul li.hs-item-has-children ul.hs-menu-children-wrapper { visibility: hidden; opacity: 0; -webkit-transition: opacity 0.4s; position: absolute; z-index: 10; left: 0; } .hs-menu-wrapper.hs-menu-flow-horizontal > ul li.hs-item-has-children ul.hs-menu-children-wrapper li a { display: block; white-space: nowrap; width: 140px; overflow: hidden; text-overflow: ellipsis; } .hs-menu-wrapper.hs-menu-flow-horizontal > ul li.hs-item-has-children ul.hs-menu-children-wrapper li.hs-item-has-children ul.hs-menu-children-wrapper { left: 180px; top: 0; } .hs-menu-wrapper.hs-menu-flow-horizontal > ul li.hs-item-has-children:hover > ul.hs-menu-children-wrapper { opacity: 1; visibility: visible; } .hs-menu-wrapper.hs-menu-flow-horizontal > ul li.hs-item-has-children:is(.hs-menu-depth-2,.hs-menu-depth-3):hover { background: #E0E0E0;} .row-fluid-wrapper:last-child .hs-menu-wrapper.hs-menu-flow-horizontal > ul { margin-bottom: 0; } .hs-menu-wrapper.hs-menu-flow-horizontal.hs-menu-show-active-branch { position: relative; margin-bottom: 20px; min-height: 7em; } .hs-menu-wrapper.hs-menu-flow-horizontal.hs-menu-show-active-branch > ul { margin-bottom: 0; } .hs-menu-wrapper.hs-menu-flow-horizontal.hs-menu-show-active-branch > ul li.hs-item-has-children { position: static; } .hs-menu-wrapper.hs-menu-flow-horizontal.hs-menu-show-active-branch > ul li.hs-item-has-children ul.hs-menu-children-wrapper { display: none; } .hs-menu-wrapper.hs-menu-flow-horizontal.hs-menu-show-active-branch > ul li.hs-item-has-children.active-branch > ul.hs-menu-children-wrapper { display: block; visibility: visible; opacity: 1; } .hs-menu-wrapper.hs-menu-flow-horizontal.hs-menu-show-active-branch > ul li.hs-item-has-children.active-branch > ul.hs-menu-children-wrapper:before { content: " "; display: table; } .hs-menu-wrapper.hs-menu-flow-horizontal.hs-menu-show-active-branch > ul li.hs-item-has-children.active-branch > ul.hs-menu-children-wrapper:after { content: " "; display: table; clear: both; } .hs-menu-wrapper.hs-menu-flow-horizontal.hs-menu-show-active-branch > ul li.hs-item-has-children.active-branch > ul.hs-menu-children-wrapper > li { float: left; } .hs-menu-wrapper.hs-menu-flow-horizontal.hs-menu-show-active-branch > ul li.hs-item-has-children.active-branch > ul.hs-menu-children-wrapper > li a { display: inline-block; padding: 10px 20px; white-space: nowrap; max-width: 140px; width: auto; overflow: hidden; text-overflow: ellipsis; text-decoration: none; } .hs-menu-wrapper.hs-menu-flow-vertical { width: 100%; } .hs-menu-wrapper.hs-menu-flow-vertical ul { list-style: none; margin: 0; } .hs-menu-wrapper.hs-menu-flow-vertical li a { display: block; white-space: nowrap; width: 140px; overflow: hidden; text-overflow: ellipsis; } .hs-menu-wrapper.hs-menu-flow-vertical > ul { margin-bottom: 20px; } .hs-menu-wrapper.hs-menu-flow-vertical > ul li.hs-menu-depth-1 > a { width: auto; } .hs-menu-wrapper.hs-menu-flow-vertical > ul li a { padding: 10px 20px; text-decoration: none; } .hs-menu-wrapper.hs-menu-flow-vertical > ul li.hs-item-has-children { position: relative; } .hs-menu-wrapper.hs-menu-flow-vertical > ul li.hs-item-has-children ul.hs-menu-children-wrapper { visibility: hidden; opacity: 0; -webkit-transition: opacity 0.4s; position: absolute; z-index: 10; top: 0; left: 180px; } .hs-menu-wrapper.hs-menu-flow-vertical > ul li.hs-item-has-children:hover > ul.hs-menu-children-wrapper { opacity: 1; visibility: visible; } .hs-menu-wrapper.hs-menu-flow-vertical.hs-menu-show-active-branch li a { min-width: 140px; width: auto; } .hs-menu-wrapper.hs-menu-flow-vertical.hs-menu-show-active-branch > ul { max-width: 100%; overflow: hidden; } .hs-menu-wrapper.hs-menu-flow-vertical.hs-menu-show-active-branch > ul li.hs-item-has-children ul.hs-menu-children-wrapper { display: none; } .hs-menu-wrapper.hs-menu-flow-vertical.hs-menu-show-active-branch > ul li.hs-item-has-children.active-branch > ul.hs-menu-children-wrapper, .hs-menu-wrapper.hs-menu-flow-vertical.hs-menu-show-active-branch > ul li.hs-item-has-children.active-branch > ul.hs-menu-children-wrapper > li.hs-item-has-children > ul.hs-menu-children-wrapper { display: block; visibility: visible; opacity: 1; position: static; } .hs-menu-wrapper.hs-menu-flow-vertical.hs-menu-show-active-branch li.hs-menu-depth-2 > a { padding-left: 4em; } .hs-menu-wrapper.hs-menu-flow-vertical.hs-menu-show-active-branch li.hs-menu-depth-3 > a { padding-left: 6em; } .hs-menu-wrapper.hs-menu-flow-vertical.hs-menu-show-active-branch li.hs-menu-depth-4 > a { padding-left: 8em; } .hs-menu-wrapper.hs-menu-flow-vertical.hs-menu-show-active-branch li.hs-menu-depth-5 > a { padding-left: 140px; } .hs-menu-wrapper.hs-menu-not-show-active-branch li.hs-menu-depth-1 ul { box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.18); -webkit-box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.18); -moz-box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.18); } @media (max-width: 568px) { .hs-menu-wrapper, .hs-menu-wrapper * { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; display: block; width: 100%; } .hs-menu-wrapper.hs-menu-flow-horizontal ul { list-style: none; margin: 0; display: block; } .hs-menu-wrapper.hs-menu-flow-horizontal > ul { display: block; } .hs-menu-wrapper.hs-menu-flow-horizontal > ul li.hs-menu-depth-1 { float: none; } .hs-menu-wrapper.hs-menu-flow-horizontal > ul li a, .hs-menu-wrapper.hs-menu-flow-horizontal > ul li.hs-item-has-children ul.hs-menu-children-wrapper li a, .hs-menu-wrapper.hs-menu-flow-horizontal.hs-menu-show-active-branch > ul li.hs-item-has-children.active-branch > ul.hs-menu-children-wrapper > li a { display: block; max-width: 100%; width: 100%; } .footer-menu .hs-menu-wrapper, .footer-menu .hs-menu-wrapper * { display: inline-block; width: fit-content; } /* (Marcelo 10-11-22) Added so that footer menu items are not displayed on separate lines */ } .hs-menu-wrapper.hs-menu-flow-vertical.no-flyouts > ul li.hs-item-has-children ul.hs-menu-children-wrapper, .hs-menu-wrapper.hs-menu-flow-horizontal.no-flyouts > ul li.hs-item-has-children ul.hs-menu-children-wrapper { visibility: visible; opacity: 1; } .widget-type-space { visibility: hidden; } /* Space Module */ /* Blog Author Section */ .hs-author-listing-header { margin: 0 0 .75em 0; } .hs-author-social-links { display: inline-block; } .hs-author-social-links a.hs-author-social-link { width: 24px; height: 24px; border-width: 0px; border: 0px; line-height: 24px; background-size: 24px 24px; background-repeat: no-repeat; display: inline-block; text-indent: -99999px; } .hs-author-social-links a.hs-author-social-link.hs-social-facebook { background-image: url("//static.hubspot.com/final/img/common/icons/social/facebook-24x24.png"); } .hs-author-social-links a.hs-author-social-link.hs-social-linkedin { background-image: url("//static.hubspot.com/final/img/common/icons/social/linkedin-24x24.png"); } .hs-author-social-links a.hs-author-social-link.hs-social-twitter { background-image: url("//static.hubspot.com/final/img/common/icons/social/twitter-24x24.png"); } .hs-author-social-links a.hs-author-social-link.hs-social-google-plus { background-image: url("//static.hubspot.com/final/img/common/icons/social/googleplus-24x24.png"); } pre { overflow-x: auto; } /* responsive pre elements */ table pre { white-space: pre-wrap; } /* responsive pre tables */ /* make sure lines with no whitespace don't interefere with layout */ .hs_cos_wrapper_type_rich_text, .hs_cos_wrapper_type_text, .hs_cos_wrapper_type_header, .hs_cos_wrapper_type_section_header, .hs_cos_wrapper_type_raw_html, .hs_cos_wrapper_type_raw_jinja, .hs_cos_wrapper_type_page_footer { word-wrap: break-word; } /* HTML 5 Reset */ article, aside, details, figcaption, figure, footer, header, hgroup, nav, section { display: block; } audio, canvas, video { display: inline-block; *display: inline; *zoom: 1; } audio:not([controls]) { display: none; } /* 1. BASE STYLES */ /* CUSTOM FONTS - update the fonts as per theme's requirements* [added-a] */ @font-face { font-family: 'fujisans'; src: url('https://2585850.fs1.hubspotusercontent-na1.net/hubfs/2585850/_Global/Fonts/FujitsuSansRegular.eot'); src: url('https://2585850.fs1.hubspotusercontent-na1.net/hubfs/2585850/_Global/Fonts/FujitsuSansRegular.eot') format('embedded-opentype'), url('https://2585850.fs1.hubspotusercontent-na1.net/hubfs/2585850/_Global/Fonts/FujitsuSansRegular.woff') format('woff'), url('https://2585850.fs1.hubspotusercontent-na1.net/hubfs/2585850/_Global/Fonts/FujitsuSansRegular.ttf') format('truetype'), url('https://2585850.fs1.hubspotusercontent-na1.net/hubfs/2585850/_Global/Fonts/FujitsuSansRegular.svg#fujisansc') format('svg'); } @font-face { font-family: FujitsuInfinityPro; font-display:block; src: url('https://www.postgresql.fastware.com/hubfs/_Global/Fonts/FujitsuInfinityPro-Regular.woff2') format("woff2"), url('https://www.postgresql.fastware.com/hubfs/_Global/Fonts/FujitsuInfinityPro-Regular.woff') format("woff"); font-weight:400 } @font-face { font-family: FujitsuInfinityProBold; font-display:block; src: url('https://2585850.fs1.hubspotusercontent-na1.net/hubfs/2585850/_Global/Fonts/FujitsuInfinityPro-Bold.eot') format('embedded-opentype'), url('https://2585850.fs1.hubspotusercontent-na1.net/hubfs/2585850/_Global/Fonts/FujitsuInfinityPro-Bold.woff2') format('woff2'), url('https://2585850.fs1.hubspotusercontent-na1.net/hubfs/2585850/_Global/Fonts/FujitsuInfinityPro-Bold.woff') format('woff'), url('https://2585850.fs1.hubspotusercontent-na1.net/hubfs/2585850/_Global/Fonts/FujitsuInfinityPro-Bold.ttf') format('truetype'); } @font-face { font-family: FujitsuInfinityProExtraBold; font-display:block; src: url('https://www.postgresql.fastware.com/hubfs/_Global/Fonts/FujitsuInfinityPro-ExtraBold.woff') format('woff'), url('https://www.postgresql.fastware.com/hubfs/_Global/Fonts/FujitsuInfinityPro-ExtraBold.ttf') format('truetype'); } @font-face { font-family: FujitsuInfinityProItalic; font-display:block; src: url('https://2585850.fs1.hubspotusercontent-na1.net/hubfs/2585850/_Global/Manuals/Anch/FujitsuInfinityPro-RegularItalic.woff') format('woff'); } @font-face { font-family: FujitsuInfinityProBoldItalic; font-display:block; src: url('https://2585850.fs1.hubspotusercontent-na1.net/hubfs/2585850/_Global/Manuals/Anch/FujitsuInfinityPro-BoldItalic.woff') format('woff'); } @font-face { font-family: FujitsuSansBold; src: url("//www.fujitsu.com/incv4/common/fonts/FujitsuSansMedium.eot"); src: url("//www.fujitsu.com/incv4/common/fonts/FujitsuSansMedium.eot") format("embedded-opentype"), url("//www.fujitsu.com/incv4/common/fonts/FujitsuSansMedium.woff") format("woff"), url("//www.fujitsu.com/incv4/common/fonts/FujitsuSansMedium.ttf") format("truetype"); } @font-face { font-family: FujitsuSansLight; src: url("//www.fujitsu.com/incv4/common/fonts/FujitsuSansLight.eot"); src: url("//www.fujitsu.com/incv4/common/fonts/FujitsuSansLight.eot") format("embedded-opentype"), url("//www.fujitsu.com/incv4/common/fonts/FujitsuSansLight.woff") format("woff"), url("https://2585850.fs1.hubspotusercontent-na1.net/hubfs/2585850/_Global/Fonts/FujitsuSansLight.ttf") format("truetype"); } /*Box Sizing - Applies a natural box layout model to all elements so that width and padding are essentially combined, making responsive styles easier to manage. */ *, *:before, *:after { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; } html, body { min-height: 100%; margin: 0; padding: 0; } /* Website background color and default font styles */ body { background: #fff; color: #000000; font-family: 'FujitsuInfinityPro', Roboto, Arial, Sans-Serif; font-size: 20px; line-height: 1.35; } /* Page Center - Apply .page-center to full-width modules. */ .container-fluid .row-fluid .page-center { float: none; max-width: 1600px; margin: 0 auto; padding: 0px 40px;} /* (Marcelo 24-10-24) Added padding */ a { color: #EA0000; text-decoration:none; } .uvance a { color: #EA0000; text-decoration:none; } /* (Marcelo 18-01-22) Initially addded for webpage "FEP Documentation" */ .uvance-blue a { color: #2400B0; text-decoration:none; } /* (Marcelo 25-01-22) Initially added for webpage 'Trial download' */ .uvance-red .uvance-emerald a, .uvance-emerald a { color: #008224; text-decoration:none; } /* (Marcelo 03-01-24) 'uvance-red' class added for page 'Resources > Videos' */ /* (Marcelo 28-01-22) Initially added for webpage 'Support' */ .uvance-orange a { color: #F75100; text-decoration:none; } /* (Marcelo 25-01-22) Initially added for webpage 'Trial download' */ .uvance-red a { color: #EA0000; text-decoration:none; } /* (Marcelo 25-01-22) Initially added for webpage 'Trial download' */ .uvance-yellow a { color: #000000; text-decoration:none; } /* (Marcelo 12-05-23) Initially added for webpage 'Knowledge Portal' */ .container-framed-orange a { color: #F75100; } /* (Marcelo 26-12-22) Added for webpage 'Enhanced security for enteprises' */ .uvance-blue .add-icon::after { content: ' ' url('https://2585850.fs1.hubspotusercontent-na1.net/hubfs/2585850/Images/Icons/icon-external-link-blue.png') !important;; } /* (Marcelo 25-01-22) Initially added for webpage 'Trial download' */ .uvance-red .uvance-emerald .add-icon::after, .uvance-emerald .add-icon::after { content: ' ' url('https://www.postgresql.fastware.com/hubfs/Images/Icons/icon-arrow-right-inside-circle-02-emerald.png') !important; } /* (Marcelo 03-01-24) 'uvance-red' class added for page 'Resources > Videos' */ /* (Marcelo 28-01-22) Initially added for webpage 'Support' */ .uvance-red .add-icon::after { content: ' ' url('https://2585850.fs1.hubspotusercontent-na1.net/hubfs/2585850/Images/Icons/icon-external-link-red.png') !important; } /* (Marcelo 25-01-22) Initially added for webpage 'Trial download' */ .uvance-blue .add-icon-white::after { content: ' ' url('https://www.postgresql.fastware.com/hubfs/Images/Icons/icon-external-link-white.png') !important; } /* (Marcelo 05-06-24) Initially added for webpage 'CoE video' */ a.add-icon { color: #FF6900 } .uvance-blue a.add-icon { color: #2400B0; } .uvance-emerald a.add-icon { color: #008224; } .res-vid-mod a.add-icon { color: #000000; font-family: FujitsuInfinityProBold } .uvance-red a.add-icon { color: #EA0000; } a.add-icon::after { content: ' ' url('https://www.postgresql.fastware.com/hubfs/Images/Icons/icon-arrow-right-inside-circle-01-orange-01.png') !important; } .trunk-content a.add-icon::after { content: ' ' url('https://www.postgresql.fastware.com/hubfs/Images/Icons/icon-arrow-right-inside-circle-01-blue-02.png') !important; } .trunk-content a.add-icon2::after { content: ' ' url('https://www.postgresql.fastware.com/hubfs/Images/Icons/icon-arrow-right-blue-01.png') !important; } .pzone-content a.add-icon::after { content: ' ' url('https://www.postgresql.fastware.com/hubfs/Images/Icons/icon-arrow-right-inside-circle-01-blue-02.png') !important; } .pzone-content a.add-icon2::after { content: ' ' url('https://www.postgresql.fastware.com/hubfs/Images/Icons/icon-arrow-right-blue-01.png') !important; } a.add-icon-white { color: #FFFFFF; } .em-high a.add-icon::after { content: ' ' url('https://www.postgresql.fastware.com/hubfs/Images/Icons/icon-arrow-right-inside-circle-01-orange-01.png') !important; } .training-card-module-div-inner a.add-icon::after { content: ' ' url('https://www.postgresql.fastware.com/hubfs/Images/Icons/icon-arrow-right-inside-circle-01-orange-01.png') !important; } .blog-section .add-icon::after { content: url('https://www.postgresql.fastware.com/hubfs/Images/Icons/icon-arrow-right-inside-circle-01-orange-01.png'); margin-left: 2px; display: inline-block; } /* (Marcelo 09-08-22) Do not add !important here, so that we can have a particular blog post using a different theme (Marcelo 01-02-22) Initially added for blog post 'How to use the pg_stat_replication_slots view' */ .trunk-content .add-icon::after { content: url('https://www.postgresql.fastware.com/hubfs/Images/Icons/icon-arrow-right-inside-circle-01-blue-02.png'); margin-left: 2px; display: inline-block; } /* (Marcelo 09-08-22) Do not add !important here, so that we can have a particular blog post using a different theme (Marcelo 01-02-22) Initially added for blog post 'How to use the pg_stat_replication_slots view' */ .trunk-content a.add-icon::after { content: ' ' url('https://www.postgresql.fastware.com/hubfs/Images/Icons/icon-arrow-right-inside-circle-01-blue-02.png') !important; } .trunk-content .em-high a.add-icon::after { content: ' ' url('https://www.postgresql.fastware.com/hubfs/Images/Icons/icon-arrow-right-white-01.png') !important; } .pzone-content .add-icon::after { content: url('https://www.postgresql.fastware.com/hubfs/Images/Icons/icon-arrow-right-inside-circle-01-blue-02.png'); margin-left: 2px; display: inline-block; } /* (Marcelo 09-08-22) Do not add !important here, so that we can have a particular blog post using a different theme (Marcelo 01-02-22) Initially added for blog post 'How to use the pg_stat_replication_slots view' */ .pzone-content a.add-icon::after { content: ' ' url('https://www.postgresql.fastware.com/hubfs/Images/Icons/icon-arrow-right-inside-circle-01-blue-02.png') !important; } .pzone-content .em-high a.add-icon::after { content: ' ' url('https://www.postgresql.fastware.com/hubfs/Images/Icons/icon-arrow-right-white-01.png') !important; } .blog-section .add-icon:hover::after { filter: hue-rotate(15deg) saturate(2); } .blog-section .em-high .add-icon:hover::after { filter: invert(20%); } a:hover { color: #BF0404; } a:focus { color: #BF0404; } .uvance-blue a:hover { color: #00E7EF; } .uvance-blue a:focus { color: #00E7EF; } .uvance-emerald a:hover { color: #61D600; } .uvance-emerald a:focus { color: #61D600; } .uvance-orange a:hover { color: #EA0000; } .uvance-orange a:focus { color: #EA0000; } .uvance-red a:hover { color: #D80084; } .uvance-red a:focus { color: #D80084; } .add-shadow { box-shadow: 10px 10px 20px #808080; } hr.uvance-orange { border-color: #F75100 !important; } .do-not-color-hlinks a { color: unset;} /* (Marcelo 14-06-22) Initiall added for right-side module in Services webpages */ hr { height: 1px; border-bottom: 1px solid #ccc; border-width: 0 0 1px 0; color: #ccc; display:block; } .uvance hr { border: 1px solid #606060; } .uvance-blue hr { border: 1px solid #00E7Ef; } .uvance-emerald hr { border: 1px solid #61D600; } .uvance-orange hr { border: 1px solid #606060; } .uvance-red hr { border: 1px solid #D80084; } /* Highlighted Text */ ::-moz-selection { color: #fff; background: #EA0000; text-shadow: none; } ::selection { color: #fff; background: #EA0000; text-shadow: none; } /* Corrects width issues in table elements created via the wysiwyg editor */ table { max-width: 99.99%; background-color: transparent; border-collapse: collapse; border-spacing: 0; } table tr td img { max-width: initial; } /* hubspot slider */ li.hs_cos_flex-slide-main:first-child { display:block; } li.hs_cos_flex-slide-main { display:none; } /* Basic text */ p { font-family:'FujitsuInfinityPro'; } sup, sub { position: relative; font-size: 75%; line-height: 0; vertical-align: baseline; } sup { top: -0.5em; } sub { bottom: -0.25em; } h1, h2, h3, h4, h5, h6 { font-family:'FujitsuInfinityPro';} /* Headings */ ul, ol { font-family:'FujitsuInfinityPro'; } ul.unstyled, ol.unstyled { list-style: none; margin: 0; padding: 0; } ol.procedure { color: #000000; } ol.procedure li { margin-top: 10px; } ol.procedure li img { margin-top: 10px; } /* Uvance */ .uvance * { font-family: FujitsuInfinityPro; } /* (17-11-21 Marcelo) */ .fa { font-family: FontAwesome !important; } /* (14-03-22) Added for webpage 'Compare versions' */ /* Custom */ .fuji-header { position:fixed; z-index:99999; } .fuji-header a { color: #000000 } .home-icon { margin-top: 12px; margin-left: 10px !important; margin-right: 5px !important; } .fuji-logo { margin-top: 0.8em; } .fuji-logo img { width: 83px !important; height: 40px; max-width:none !important; } .fuji-header p, .fuji-header a, .fuji-header span { line-height:1.2em; font-size:14px;} .fuji-header-mob { display:none !important;} .fuji-menu * { font-family: FujitsuInfinityPro !important; } .fuji-menu .hs-menu-wrapper.hs-menu-flow-horizontal > ul { padding-top:10px; padding-left:10px } .fuji-menu li { display:block !important;} .fuji-menu li:hover > a { color:#404040; } .fuji-menu .hs-menu-wrapper.hs-menu-flow-horizontal > ul li.hs-menu-depth-1 { padding: 0.8em 8px 0.2em 8px; } .hs-menu-item.hs-menu-depth-1.hs-item-has-children:after { font-family: FontAwesome; content: '\f078'; color:#A0A0A0; top: -5px !important; font-size: 12px; position:relative;} ul li.hs-menu-depth-1 a { font-family: FujitsuInfinityProBold !important; } ul li.hs-menu-depth-2 a { font-family: FujitsuInfinityPro !important; } .fuji-menu ul.hs-menu-children-wrapper li { padding: 2px !important; } .fuji-header .hs-menu-wrapper.hs-menu-flow-horizontal > ul li.hs-item-has-children:hover > ul li.hs-item-has-children:hover > ul.hs-menu-children-wrapper:before { content: '\f0d9' !important; top: 15px; left: -12px; display:none !important; } .fuji-menu li.hs-menu-item.hs-menu-depth-2.hs-item-has-children:after { position: absolute; content: '\f105'; top: 4px; right: 12px; font-family: FontAwesome; color: #A0A0A0; font-size: 130%;} .fuji-menu li.hs-menu-item.hs-menu-depth-2.hs-item-has-children .hs-menu-children-wrapper { left: 140px !important; top: -15px !important; background: #FAFAFA !important; border: 1px solid #A0A0A0 !important; } .fuji-menu li.hs-menu-item.hs-menu-depth-3.hs-item-has-children:after { position: absolute; content: '\f105'; top: 4px; right: 12px; font-family: FontAwesome; color: #D80084; font-size: 130%;} .fuji-menu li.hs-menu-item.hs-menu-depth-3.hs-item-has-children .hs-menu-children-wrapper { left: 150px !important; top: -15px !important; background: #FAFAFA !important; border: 1px solid #D80084 !important; } .fast-top-menu-left-modules { min-width: 80px; } .fast-top-menu-nav-menu { max-width: fit-content; /* background-color: coral; */} .fast-top-menu-right-modules { min-width: 190px !important; position: absolute; right:10px; /* background-color: brown; */} .fast-top-menu-right-modules.fast-top-menu-no-trial-div { min-width: 80px !important; } /* (02-01-23) Special case for navmenu that only have 'Search' button, but no 'Trial' input (only the webpage 'Trial' currently */ .fast-top-menu-trial-div { width: 60px !important; margin-top: 16px; /* background-color: green; */ } .fast-top-menu-search-div { min-width: 120px; margin-top: 20px; float: right !important; /* background-color: yellow; */ } .fast-top-menu-nav-menu-fuji-logo { max-width: 105px; } @media only screen and (max-width: 1040px) { .home-icon { max-width: 80px !important; margin-left: 6px !important;} } @media only screen and (max-width: 976px) { .fast-top-menu-right-modules { min-width: unset ; position: unset; right: unset; display: inline-block !important; } .fast-top-menu-trial-div { position: absolute !important; top:25px !important; right: 150px; margin-top: 0px !important; margin-left: 0px !important; } .fast-top-menu-trial-div.fast-top-menu-no-search-div { right: 0px; } /* (02-01-23) Special case for navmenu that only have 'Trial' button, but no 'Search' input (only the webpage 'Search result' currently */ .fast-top-menu-search-div { position: absolute !important; top:25px !important; right: 18px; margin-top: 0px !important; margin-left: 0px !important; min-width: 130px; float: none; } .search-module { } /* (Marcelo 08-01-20) Addded for search box in mobile viewports */ .logo-mob { max-width: 80px !important; padding-left: 10px !important; vertical-align: middle !important; } .logo-mob img { margin-top: 6px; } .cta-phone { width: calc(100% - 80px) !important; margin-left: 0px !important; } .cta-phone .cta_button { margin-top: 5px; } .mobile-logomenu-wrap div { width: 100%; text-align: right !important;} } @media only screen and (max-width: 767px) { .mobile-logomenu-wrap div { text-align: left !important } .logo-mob { display: inline-block !important; max-width: 80px !important; } .cta-phone {display: inline-block !important;width: calc(100% - 340px) !important;padding-left: calc(100vw - 80px - 280px) !important;margin-left: 0px !important;} } .fast-font-light { font-family: FujitsuInfinityPro; } /* (Marcelo 30-08-21) Added when creating landing page 'FEP installers - full version (with file links) ' */ .phone-wrap { margin-top: 1.2em;} .phone-wrap img { margin-top: 16px; margin-right: 14px; width: 26px; height: 44px; vertical-align: top;} .phone-menu-wrap { max-width: 100%; background: white; } .fuji-header .page-center { overflow: visible !important; } /*.fuji-header .hs-menu-wrapper.hs-menu-flow-horizontal>ul li.hs-item-has-children:hover>ul.hs-menu-children-wrapper:before { position: absolute; content: '\f0d8'; top: -20px; left: 30px; font-family: font-awesome; font-family: FontAwesome; font-style: normal; font-weight: 100; font-size: 38px; color: #EA0000; }*/ .fuji-header .hs-menu-wrapper.hs-menu-flow-horizontal>ul li.hs-item-has-children:hover>ul.hs-menu-children-wrapper { box-shadow: 4px 4px 4px 0px #00000020,-4px 4px 4px 0px #00000020,4px -4px 4px 0px #00000020,-4px -4px 4px 0px #00000020; border: 0px solid #EA0000; background: #FFFFFF; margin-top: 0px; padding:10px; } .simple-menu a { color:#444; } .simple-menu ul li { width: 100%; display: inline-block; padding: 1em 1em .6em; cursor: pointer; font-size: 1em; position: relative; z-index: 1; border-bottom: 1px solid #e3e3e3; border-left: 2px solid transparent; } .simple-menu ul li:hover { background:#000;} .simple-menu ul li:hover a { color:#fff; } .simple-menu ul li.active { border-left: 2px solid #EA0000;} .mobile-menu .hs-menu-wrapper, .mobile-menu .hs-menu-wrapper * { width:auto !important;} .mobile-menu .hs-menu-wrapper.hs-menu-flow-vertical>ul li.hs-item-has-children, .mobile-menu .hs-menu-wrapper.hs-menu-flow-vertical>ul li.hs-item-has-children:hover { height: auto !important; } .mobile-menu .hs-menu-wrapper.hs-menu-flow-vertical>ul li.hs-item-has-children { position: relative; } span.subMenu { font-size: 20px; font-weight: 700; top: 0px; position: absolute; right: 11px; cursor:pointer; padding: 0 10px; } .mobile-menu .hs-menu-wrapper.hs-menu-flow-vertical>ul li.hs-item-has-children ul.hs-menu-children-wrapper { visibility: visible; opacity: 1; } .head-telno { display:inline-block; padding-top:4px;} /* Homepage */ .fuji-slider { position:relative; overflow:hidden;} .fuji-slider .caption.vertical-center { left: 18.5em; max-width: 780px; } .red-callout { position: absolute; display: inline-block !important; z-index: 3; margin-left: 5.2em !important; min-width: 340px; width: auto !important; background-size: 100%; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%);transform: translateY(-50%);left: -17.5em; } .blog-post .red-callout { position: absolute; display: inline-block !important; z-index: 3; margin-left: 5.2em !important; min-width: 340px; width: auto !important; background-size: 100%; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%);transform: translateY(-50%);left: -17.5em;background: url(https://2585850.fs1.hubspotusercontent-na1.net/hubfs/2585850/Images/Callouts/img-callout-orange-to-yellow-with-infinity-super-graphic.png) no-repeat;} /* (Marcelo 09-08-22) Vincent's blog post 'Greener technology' */ .trunk-post .red-callout { position: absolute; display: inline-block !important; z-index: 3; margin-left: 5.2em !important; min-width: 340px; width: auto !important; background-size: 100%; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%);transform: translateY(-50%);left: -17.5em;background: url(https://www.postgresql.fastware.com/hubfs/Images/Callouts/img-callout-fujitsu-trunkline-blue-cyan-02.png) no-repeat;} .pzone-post .red-callout { position: absolute; display: inline-block !important; z-index: 3; margin-left: 5.2em !important; min-width: 340px; width: auto !important; background-size: 100%; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%);transform: translateY(-50%);left: -17.5em;background: url(https://www.postgresql.fastware.com/hubfs/Images/Callouts/img-callout-fujitsu-pzone-blue-cyan-03.png) no-repeat;} .enabl-grad-red-to-orange .red-callout { position: absolute; display: inline-block !important; z-index: 3; margin-left: 5.2em !important; min-width: 340px; width: auto !important; background-size: 100%; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%);transform: translateY(-50%);left: -17.5em;background: url(https://2585850.fs1.hubspotusercontent-na1.net/hubfs/2585850/Images/Callouts/img-callout-red-to-orange.png) no-repeat;} /* (Marcelo 11-11-21) Bulk registration of FEP enablement sessions Nov-2021 */ .grd-callout .red-callout { position: absolute; display: inline-block !important; z-index: 3; margin-left: 5.2em !important; min-width: 340px; width: auto !important; background-size: 100%; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%);transform: translateY(-50%);left: -17.5em;background: url(https://2585850.fs1.hubspotusercontent-na1.net/hubfs/2585850/Images/Callouts/img-callout-red-to-orange-with-infinity-super-graphic.png) no-repeat;} /* (Marcelo 17-11-21) 'FEP on IBM - Modernization' webpage banner */ .grd-callout-blue .red-callout { position: absolute; display: inline-block !important; z-index: 3; margin-left: 5.2em !important; min-width: 340px; width: auto !important; background-size: 100%; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%);transform: translateY(-50%);left: -17.5em;background: url(https://2585850.fs1.hubspotusercontent-na1.net/hubfs/2585850/Images/Callouts/img-callout-blue-to-cyan-with-infinity-super-graphic.png) no-repeat;} /* (Marcelo 24-01-22) 'Resource Center' webpage banner */ .grd-callout-cyan-lime .red-callout { position: absolute; display: inline-block !important; z-index: 3; margin-left: 5.2em !important; min-width: 340px; width: auto !important; background-size: 100%; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%);transform: translateY(-50%);left: -17.5em;background: url(https://2585850.fs1.hubspotusercontent-na1.net/hubfs/2585850/Images/Callouts/img-callout-cyan-to-lime-with-infinity-super-graphic.png) no-repeat;} /* (Marcelo 21-04-23) 'Migration Portal'' */ .grd-callout-emerald .red-callout { position: absolute; display: inline-block !important; z-index: 3; margin-left: 5.2em !important; min-width: 340px; width: auto !important; background-size: 100%; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%);transform: translateY(-50%);left: -17.5em;background: url(https://2585850.fs1.hubspotusercontent-na1.net/hubfs/2585850/Images/Callouts/img-callout-emerald-to-lime-with-infinity-super-graphic.png) no-repeat;} /* (Marcelo 19-01-22) 'PRIMEWEB' webpage banner */ .grd-callout-orange-yellow .red-callout { position: absolute; display: inline-block !important; z-index: 3; margin-left: 5.2em !important; min-width: 340px; width: auto !important; background-size: 100%; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%);transform: translateY(-50%);left: -17.5em;background: url(https://2585850.fs1.hubspotusercontent-na1.net/hubfs/2585850/Images/Callouts/img-callout-orange-to-yellow-with-infinity-super-graphic.png) no-repeat;} /* (Marcelo 25-01-22) 'Trial download' webpage banners */ /* (Marcelo 09-02-22) Used in 'How to - Setting up Grafana on IBM LinuxONE' */ .grd-callout-imageless .red-callout { position: absolute; display: inline-block !important; z-index: 3; margin-left: 5.2em !important; min-width: 1px; width: 1px !important; background-size: 100%; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%);transform: translateY(-50%);left: -17.5em; } /* (Marcelo 25-01-22) 'Trial download' webpage banners */ /* (Marcelo 19-10-24) Used in 'HTML Manual set' */ .grd-callout-red .red-callout { position: absolute; display: inline-block !important; z-index: 3; margin-left: 5.2em !important; min-width: 340px; width: auto !important; background-size: 100%; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%);transform: translateY(-50%);left: -17.5em;background: url(https://2585850.fs1.hubspotusercontent-na1.net/hubfs/2585850/Images/Callouts/img-callout-red-to-magenta-with-infinity-super-graphic.png) no-repeat;} /* (Marcelo 24-01-22) 'Trial download' webpage banner */ .grd-callout-red-magenta .red-callout { position: absolute; display: inline-block !important; z-index: 3; margin-left: 5.2em !important; min-width: 340px; width: auto !important; background-size: 100%; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%);transform: translateY(-50%);left: -17.5em;background: url(https://2585850.fs1.hubspotusercontent-na1.net/hubfs/2585850/Images/Callouts/img-callout-red-to-magenta-with-infinity-super-graphic.png) no-repeat;} /* (Marcelo 22-03-22)) 'Download trail version' webpage banner */ .grd-callout-red-orange .red-callout { position: absolute; display: inline-block !important; z-index: 3; margin-left: 5.2em !important; min-width: 340px; width: auto !important; background-size: 100%; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%);transform: translateY(-50%);left: -17.5em;background: url(https://2585850.fs1.hubspotusercontent-na1.net/hubfs/2585850/Images/Callouts/img-callout-red-to-orange-with-infinity-super-graphic.png) no-repeat;} /* (Marcelo 18-02-22)) all 'Services' webpage banners */ .grd-callout-red-yellow .red-callout { position: absolute; display: inline-block !important; z-index: 3; margin-left: 5.2em !important; min-width: 340px; width: auto !important; background-size: 100%; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%);transform: translateY(-50%);left: -17.5em;background: url(https://2585850.fs1.hubspotusercontent-na1.net/hubfs/2585850/Images/Callouts/img-callout-red-to-yellow-with-infinity-super-graphic.png) no-repeat;} /* (Marcelo 14-03-22)) all 'Compare versions' webpage banner */ .kb-article .red-callout { position: absolute; display: inline-block !important; z-index: 3; margin-left: 5.2em !important; min-width: 340px; width: auto !important; background-size: 100%; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%);transform: translateY(-50%);left: -17.5em;background: url(https://2585850.fs1.hubspotusercontent-na1.net/hubfs/2585850/Images/Callouts/img-callout-circle-orange.svg) no-repeat;} .primeweb .red-callout { position: absolute; display: inline-block !important; z-index: 3; margin-left: 5.2em !important; min-width: 340px; width: auto !important; background-size: 100%; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%);transform: translateY(-50%);left: -17.5em;background: url(https://2585850.fs1.hubspotusercontent-na1.net/hubfs/2585850/Images/Callouts/img-callout-puzzle-pieces.svg) no-repeat;} .supp-patch .red-callout { position: absolute; display: inline-block !important; z-index: 3; margin-left: 5.2em !important; min-width: 340px; width: auto !important; background-size: 100%; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%);transform: translateY(-50%);left: -17.5em;background: url(https://2585850.fs1.hubspotusercontent-na1.net/hubfs/2585850/Images/Callouts/img-callout-red-to-orange-with-infinity-super-graphic.png) no-repeat;} .tech .red-callout { position: absolute; display: inline-block !important; z-index: 3; margin-left: 5.2em !important; min-width: 340px; width: auto !important; background-size: 100%; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%);transform: translateY(-50%);left: -17.5em;background: url(https://2585850.fs1.hubspotusercontent-na1.net/hubfs/2585850/Images/Callouts/img-callout-computer-circuitry.png) no-repeat;} /* (Marcelo 17-09-21) 'Technical feedback' wepbage */ .red-callout h2 { width: 220px; font-size: 28px; color: #FFFFFF; line-height: 1.2; height: 220px; padding-left: 16px; padding-top:15px; padding-right: 30px; } /* (Marcelo 18-01-23) Changed height (Marcelo 06-03-21) Added padding-right because h2 text overflows response module. Changed to fit new callout text in blog 'Stay ahead of the curve with Fujitsu' */ .blog-post .red-callout h2 { width: 450px; font-size: 36px; color: #000000; line-height: 1.6; padding-top: 0px; padding-right: 10px; margin-top: 10px; } .trunk-post .red-callout h2 { width: 450px; font-size: 36px; color: #000000; line-height: 1.6; height: 250px; padding-top: 0px; padding-right: 10px; margin-top: 10px; } .pzone-post .red-callout h2 { width: 450px; font-size: 36px; color: #000000; line-height: 1.6; height: 250px; padding-top: 0px; padding-right: 10px; margin-top: 10px; } .enabl-grad-red-to-orange .red-callout h2 { width: 235px; font-size: 28px; line-height: 1.4; padding-right: 10px; margin-top: 10px; } .grd-callout .red-callout h2 { width: 235px; font-size: 30px; line-height: 1.4; padding-top: 10px; padding-right: 10px; margin-top: 10px; } .grd-callout-blue .red-callout h2 { width: 235px; font-size: 30px; line-height: 1.4; padding-top: 10px; padding-right: 10px; margin-top: 10px; } .grd-callout-cyan-lime .red-callout h2 { width: 235px; font-size: 30px; color: #000000; line-height: 1.4; padding-top: 10px; padding-right: 10px; margin-top: 10px; } .grd-callout-emerald .red-callout h2 { width: 235px; font-size: 30px; line-height: 1.4; padding-top: 10px; padding-right: 10px; margin-top: 10px; } .grd-callout-orange-yellow .red-callout h2 { width: 235px; font-size: 30px; color: #000000; line-height: 1.4; padding-top: 10px; padding-right: 10px; margin-top: 10px; } .grd-callout-imageless .red-callout h2 { width: 5px; font-size: 30px; color: #000000; line-height: 1.4; } .grd-callout-red .red-callout h2 { width: 235px; font-size: 30px; line-height: 1.4; padding-top: 10px; padding-right: 10px; margin-top: 10px; } .grd-callout-red-magenta .red-callout h2 { width: 235px; font-size: 30px; line-height: 1.4; padding-top: 10px; padding-right: 10px; margin-top: 10px; } .grd-callout-red-orange .red-callout h2 { width: 235px; font-size: 30px; line-height: 1.4; padding-top: 10px; padding-right: 10px; margin-top: 10px; } .grd-callout-red-yellow .red-callout h2 { width: 235px; font-size: 30px; line-height: 1.4; padding-top: 10px; padding-right: 10px; margin-top: 10px; } .kb-article .red-callout h2 { width: 235px; font-size: 34px; color: #FFFFFF; line-height: 1.3; height: 220px; padding-left: 0px; padding-right: 45px; text-shadow: -1px -1px #606060, 1px -1px #606060, -1px 1px #606060, 1px 1px #606060; text-align: center; } .primeweb .red-callout h2 { text-shadow: -1px -1px #000000, 1px -1px #000000, -1px 1px #000000, 1px 1px #000000; } .supp-patch .red-callout h2 { width: 450px; font-size: 34px; line-height: 1.3; padding-top:10px; padding-right: 10px; } .tech .red-callout h2 { width: 230px; font-size: 32px; color: #FFFFFF; line-height: 1.3; height: 220px; padding-left: 26px; padding-top:28px; padding-right: 30px; text-shadow: -2px -2px #000, 2px -2px #000, -2px 2px #000, 2px 2px #000; } /* (Marcelo 17-09-21) Initilally created for 'Technical feedback' wepbage */ h2 span.callout-inner-text { display: inline-block;max-width: 200px; } /* (Marcelo 13-12-21) Add response module text in h2 inside */ .trunk-post h2 span.callout-inner-text { display: none; } .pzone-post h2 span.callout-inner-text { display: none; } .primeweb h1 { color: #B14239; text-shadow: -2px -2px #DAD7C5, 2px -2px #DAD7C5, -2px 2px #DAD7C5, 2px 2px #DAD7C5; } .grd-callout-imageless .span2 { width: 0px !important; } .grd-callout-imageless .span10 { width: 100% !important; } .fuji-slider h2 { font-size:35px;} .fuji-slider p { font-size:22px;} .fuji-template .text-carousel .hs_cos_flex-slides a:hover { border-bottom: 1px solid #9b9b9b; color:#fff; } .span4.course-thumb { border-top: 3px solid #EA0000; padding-top: 5px; width: 30%; margin-right: 10px; } .course-wrap { margin:1em 0 2em; } .course-thumb p { font-size: 16px; margin-top:10px; min-height: 135px; } .course-thumb h3 { margin: 10px 0; min-height: 54px; font-size: 20px; } .course-wrap { margin:1em 0 2em; } .course-wrap .card-wrap a { display: none; color: #fff; text-decoration: underline; font-size: 17px;} .course-wrap .card-wrap:hover a { display:block;} .course-wrap .card-wrap p { font-size: 17px; } .course-wrap .bg-img-wrap.card-wrap { display:inline-block; height: 310px; width: 31%; max-width: 260px; padding-left: 0; margin-bottom:15px; margin-left: 6px; } .no-privacylink { display:none; } .hs_message { padding-left:1em;} .fujitsu-form .hs_message label { text-transform: initial; } .fujitsu-form .hs_message textarea { border: 1px solid #c7c7c7; margin-top: 5px; } .survey-form .inputs-list.multi-container { margin-top: 4px !important; padding-bottom: 6px !important; } .survey-form .inputs-list.multi-container li { display: inline-block; padding-right: 2em; } .survey-form .inputs-list.multi-container li span { padding-left: 7px; } .survey-form .hs_cos_wrapper_type_form .hs-form-field > label > span { font-weight: 600 !important; font-family: FujitsuInfinityPro, Arial, Sans-Serif !important; font-size: 17px; letter-spacing: 0.3px; } .fujitsu-form .survey-form form textarea { border: 1px solid #717171; background: rgba(132, 132, 132, 0.09); margin-top: 10px; min-height: 100px; } .bg-img-wrap.card-wrap { height: 48vh; position: relative; overflow: hidden; } .card-content { position: absolute; width: 100% !important; bottom: 0; background: rgba(234, 0, 0, .8); padding: 5px; transition: bottom .3s, background .3s, height .3s; height: 60px; left: 0; } .bg-right { background-position:right !important} .bg-img-wrap.card-wrap:hover .card-content { background: rgba(234,0,0,.7); height:100%;} .course-wrap .card-content h3 { margin-top:0; font-size: 90%; } .card-content h3 { text-align: Center; color: #fff; } .card-content p { height: 0 !important; opacity: 0; visibility: hidden; display: none; color:#fff; font-size:18px; } .bg-img-wrap.card-wrap:hover .card-content p { height: auto !important; display: block; opacity: 1; visibility: visible; } .bg-img-wrap.card-wrap.thumb-card { height:25vh; } .thumb-card { overflow:hidden;} .thumb-card a { color:#000;} .thumb-card a:hover img { opacity:0.85;} .bg-img-wrap.card-wrap.thumb-card .card-content p { text-align:left} .ease-fx * { box-sizing: inherit; transition-property: all; transition-duration: .6s; transition-timing-function: ease; } .area-icon { text-align: center; margin: 0 auto; height: 140px; width: 140px; font-size: 4em; border-radius: 50%; } .btn { cursor: default; display: block; font-size:16px; font-weight: 400; line-height: 45px; margin: 0 auto 1em; max-width: 160px; position: relative; text-decoration: none; text-transform: uppercase; vertical-align: middle; width: 140px } .btn-1 { background: transparent; font-weight: 100; } .btn-1 svg { height: 140px; left: 0; position: absolute; top: 0; width: 200px; } .btn-1 circle { fill: none; stroke: #4a4a4a; stroke-width: 4; stroke-dasharray: 422, 0; } .btn-1:hover { background: rgba(0,0,0, 0); font-weight: 900; letter-spacing: 1px; } .btn-1:hover circle { stroke-width: 8; stroke-dasharray:40, 200; stroke-dashoffset: 5; transition: all 1.35s cubic-bezier(0.19, 1, 0.22, 1); stroke: #EA0000 } .vidImg { position:relative;} .vidImg img { border: 2px solid #585858 !important; } .vidImg a:focus { outline:0;} .vidImg a:not(.no-youtube-overlay):before { position: absolute; content: ""; top: 0; width: 100%; z-index: 4; text-align: center; height: 100%; background-size: 90px; left:0; right:0; background: url(https://2585850.fs1.hubspotusercontent-na1.net/hubfs/2585850/Images/Logos/logo-youtube.png) no-repeat center center; } .fuji-template.fuj-hometemplate h3, .fuji-template.fuj-hometemplate h3 span { color:#4A4A4A; font-weight:400;} .card-content h3 { color:#fff !important; font-weight:400 !important; margin-top:6px;} .dg-wrap { position:relative;} .dg-img { position:absolute; bottom:0;} .dg-fwrap { position:relative; float:right !important;} .fujitsu-form.whitepaper-dl { background: #333333; border: 0; border-radius: 0; text-align: left; margin-bottom:30px; } .fujitsu-form.whitepaper-dl form label { text-transform: inherit; font-size: 20px !important; color: #fff !important; margin-bottom: 10px; } .fujitsu-form.whitepaper-dl .hs_submit { text-align: left; } .fujitsu-form.whitepaper-dl input[type="submit"] { background-color: #EA0000; color: #fff; font-size: 18px; border: 0; margin-top:1.5em; } .fujitsu-form.whitepaper-dl .privacyLink { font-size: 14px; text-align: right; margin-top: 0.6em; color: #fff; text-decoration: none; display: inline-block; float: right; position: relative; top: -35px; } .denotes { position: absolute; bottom: 75px; right: 150px; color: black; text-align: left; display: inline-block !important; float: left !important; z-index: 0; width: 160px !important; } .denotes p { margin-bottom: 0; color: #fff; font-size: 14px; } /* Services */ .hero-banner { height:500px; padding-top:110px; } /* (Marcelo 13-11-20) Removed background-color:#555; */ .fuji-template .tab-content h2 { border-left: 2px solid #EA0000; padding-left: 20px; margin-left: -24px } /* Contact Us */ .basic-form form { width:90%;} .basic-form form .hs-form-field { margin-bottom: 10px; margin-top: 25px; } .basic-form form label { display:inline-block; margin-bottom: 6px; font-weight: bold } .basic-form form input, .basic-form form textarea { display: block; width: 100%; height: 50px; padding: 6px 12px; font-size: 14px !important; line-height: 1.42857143; color: #555555; background-color: #ffffff; background-image: none; border: 1px solid #e4e4e4; border-radius: 4px; -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); -webkit-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s; transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s; }:after .basic-form form textarea { height:215px; } .basic-form form input[type="submit"] { padding: 8px 20px !important; color: #322f31; width:auto; background-color: #fff; border: 2px solid #322f31; margin-top:20px; } .contact-aside { max-width: 480px; background-color: #EDEDED; float: right !important; } .cmap-wrap { overflow:hidden;} .fujitsu-form { background: #fff; padding: 2em; padding-top: 0.7em; border-radius: 4px; border:2px solid #000; margin-top:10px; } .fujitsu .contact-form { position: absolute; max-width: 540px !important; background: #fff; left: 0; right: 0; padding: 2em; padding-top: 0.7em; border-radius: 4px; } .fujitsu-form form input:focus, .fujitsu-form form textarea:focus { border-bottom: 3px solid #EA0000; font-size:18px; } .fujitsu-form form input, .fujitsu-form form select, .fujitsu-form form textarea, .fujitsu-form form select:focus { border: 0; border-bottom: 3px solid #000; font-size: 12px; padding-bottom:4px; font-weight:normal; } /*.fujitsu-form form select { height:38px;} (Marcelo 25-05-23) Commented because form in '5 key enterprise capabilities' */ .fujitsu-form form *:focus { outline: 0; border: 0; } .fujitsu-form form label, .fujitsu-form label { font-size: 16px !important; color: #000000 !important; margin-top: 16px; margin-bottom: 10px; display: block; } .fujitsu-form ul.hs-error-msgs.inputs-list { color: #FF0000 !important; background-color: #FFFF99; font-size: 16px; margin-top: -5px !important; margin-bottom: 15px !important; } /* (Marcelo 20-03-20) Changed font and background colors, top and bottom margins */ .fujitsu-form ul.hs-error-msgs.inputs-list * { text-align: right; text-transform: none !important; color: #FF0000 !important; background-color: #FFFF99; font-size: 16px !important; margin-top: -5px !important; margin-bottom: 15px !important; } .fujitsu-form .hs_error_rollup { margin-top: 20px; } .fujitsu-form .hs_submit { text-align: center; } .fujitsu-form input[type="submit"] { background-color: #000; color: #fff; font-size: 12px; text-transform: uppercase; padding: 8px 30px; margin-top: 15px;} .fujitsu-form input[type="submit"]:hover { background-color:#EA0000; } .fujitsu-form select option { color: #404040; line-height: 26px !important;} .fujitsu-form select option:checked { background: #EA0000; box-shadow: 0 0 10px 100px #1882A8 inset; color: #fff; } .fujitsu-form.clean-form { padding: 0; margin-top: 0; border: none; } .fujitsu-form.clean-form input[type="submit"], .fujitsu-form.clean-form input[type="submit"]:focus { width: auto; margin-bottom: 10px; font-size: 20px; padding: 8px 30px !important; border-bottom: 0; } .fujitsu-form.clean-form form input, .fujitsu-form.clean-form form select, .fujitsu-form.clean-form form textarea, .fujitsu-form.clean-form form select:focus { font-weight:normal;} .hs_what_type_of_training_interests_you_ span, .hs_dba_skill_level span, .hs_developer_skill_level span, .hs_ha_skill_level span { font-weight: bold; font-size: 15px; } .hs_what_type_of_training_interests_you_ .input span, .hs_dba_skill_level .input span, .hs_developer_skill_level .input span, .hs_ha_skill_level .input span { font-weight: normal; font-size: 14px; } .hs_dba_skill_level ul li, .hs_developer_skill_level ul li, .hs_ha_skill_level ul li { display: inline-block; } .privacyLink { display:none;} .fujitsu-form .privacyLink { display: block; font-size: 0px; text-align: center; margin-top: 0.6em; color: #000; text-decoration: underline; } .fujitsu-form .form-notes, .fujitsu-form .privacyLink { display:none; } .fujitsu-form.form-reply .form-notes, .fujitsu-form.form-reply .privacyLink { display:none; } /* Form */ .contact-simple-form form .hs-form-checkbox { font-size: 14px; margin: 5px 0px; } /* (Marcelo 21-02-22) Changed when working in forn 'Interest in services */ /* (Marcelo 10-01-20) Added font-size while working in Support pages' form 'Interested in upgrading?' */ .contact-simple-form form .hs-form-checkbox label { display: inline-block !important; width: fit-content !important;} /* (Marcelo 05-12-22) Added to make sure that fields with check box show the check box and text in the same line (initally added for form FEP EAP - Provide feedback) */ /* New Contact Us Page */ .contact-simple { padding-right:2.5em;} .contact-simple p { font-size:16px; } .contact-simple-form::placeholder, .contact-simple-form input, .contact-simple-form textarea { color:#696969; } .contact-simple-form select, .contact-simple-form input, .contact-simple-form textarea { color:#000000; } .contact-simple-form select:invalid { color: #696969 !important; } /* (Marcelo 05-08-21) Shows 'Please select' in dropdown boxes in a color different from selected value */ .contact-simple-form { padding-left: 1em; padding-right: 1em;} .contact-simple-form .hs-form-required { color: #EA0000;} /* (Marcelo 28-05-21) This class is for the asterisk in the label of required fields; added for form 'Register for FEP Solution Update session - FEP, FEP for Kubernetes, Professional Services capabilities (IBM TSS version)' */ .uvance-blue .contact-simple-form .hs-form-required { color: #2400B0;} /* (Marcelo 25-01-22) Initially added for webpage 'Trial download' */ .uvance-emerald .contact-simple-form .hs-form-required { color: #008224;} .uvance-orange .contact-simple-form .hs-form-required { color: #F75100;} .uvance-orange-dark .contact-simple-form .hs-form-required { color: #F75100;} .uvance-red .contact-simple-form .hs-form-required { color: #EA0000;} /* (Marcelo 25-01-22) Initially added for webpage 'Trial download' */ .form-blue.contact-simple-form .hs-form-required { color: #2400B0;} .form-cyan.contact-simple-form .hs-form-required { color: #07c6bf;} .form-emerald.contact-simple-form .hs-form-required { color: #008224;} .form-orange.contact-simple-form .hs-form-required { color: #F75100;} .form-red.contact-simple-form .hs-form-required { color: #EA0000;} .ibm-tss .contact-simple-form .hs-form-required { color: #008224;} .form-enabl .contact-simple-form .hs-form-required { color: #2400B0;} .form-enabl .contact-simple-form label:has(span.hs-form-required) { color:#220593 !important; } .contact-simple-form form .hs-form-field input, .contact-simple-form form .hs-form-field select, .contact-simple-form form .hs-form-field textarea { border: 1px solid #CCCCCC; background-color: #FAFAFA; font-size: 14px !important; padding: 1em; margin-left: 0.8em; margin-bottom:1em; } .contact-simple-form form .hs-form-field label, .contact-simple-form form .hs-form-field label p { font-size: 14px !important; } /* (Marcelo 06-06-24) Added to form 'Enablement survery */ /* (Marcelo 03-06-22) Added to format labels in form used in webpage 'Download FEP installers (FGC / Fujitsu Germany)' */ .form-font-large form .hs-form-field label { font-size: 16px !important; } /* (Marcelo 06-04-23) Added to format labels in form Migration Portal' */ .form-blue form .hs-form-field input, .form-blue form .hs-form-field select, .form-blue form .hs-form-field textarea { padding: 0.4em; } /* (Marcelo 25-01-22) Initially added for form in webpage 'Trial download' */ .form-cyan form .hs-form-field input, .form-cyan form .hs-form-field select, .form-cyan form .hs-form-field textarea { padding: 0.4em; } /* (Marcelo 25-04-23) Initially added for form in webpage 'Migration Portal' */ .form-emerald form .hs-form-field input, .form-emerald form .hs-form-field select, .form-emerald form .hs-form-field textarea { padding: 0.8em; } /* (Marcelo 27-11-21) Initially added for form in webpage 'FEP for Kubernetes' */ .form-orange form .hs-form-field input, .form-orange form .hs-form-field select, .form-orange form .hs-form-field textarea { padding: 0.8em; } /* (Marcelo 02-12-21) Initially added for form in blog posts */ .form-red form .hs-form-field input, .form-red form .hs-form-field select, .form-red form .hs-form-field textarea { padding: 0.4em; } /* (Marcelo 25-01-22) Initially added for form in webpage 'Trial download' */ .form-yellow form .hs-form-field input, .form-yellow form .hs-form-field select, .form-yellow form .hs-form-field textarea { padding: 0.8em; } /* (Marcelo 02-12-21) Initially added for form in blog posts */ .fast-form-label-disabled { color: #404040 !important; font-weight: normal; font-family: 'FujitsuInfinityPro' !important; } /* (Marcelo 20-09-21) Added for formm in webpage 'IBM order form' */ .fast-form-label-hidden { display: none !important; } /* (Marcelo 21-09-21) Added for formm in webpage 'IBM order form' */ .fast-form-field-disabled { border: 0px !important; background-color: unset !important; color: #505050 !important; } /* (Marcelo 14-09-21) Added for formm in webpage 'IBM order form' */ .fast-form-field-disabled ~ span { border: 0px !important;; } /* (Marcelo 14-09-21) Added for formm in webpage 'IBM order form' */ .fast-form-field-hidden { display: none !important; } /* (Marcelo 21-09-21) Added for formm in webpage 'IBM order form' */ .fast-form-field-hidden ~ span { display: none !important; } /* (Marcelo 21-09-21) Added for formm in webpage 'IBM order form' */ .fast-form-field-disabled label { color: #606060 !important;} /* (Marcelo 21-10-21) Added for formm in webpage 'Customer Meeting - Technical Pre-sales Attendance Request' */ .fast-form-field-disabled input { color: #606060 !important; border: 0px !important; } /* (Marcelo 21-10-21) Added for formm in webpage 'Customer Meeting - Technical Pre-sales Attendance Request' */ .fast-form-button-disabled { background-color: #A0A0A0 !important; } /* (Marcelo 20-09-21) Added for formm in webpage 'IBM order' */ .contact-simple-form form .hs-form-field textarea { text-transform: none !important; margin-top:0 } .contact-simple-form form .hs-form-field > label { display:none; } /* Marcelo (28-05-21) The 'display' setting can be overriden if also has class 'contact-simple-form-show-labels' */ .contact-simple-form form .hs-form-field > label { color: #202020; font-family: FujitsuInfinityProBold; } /* (Marcelo 17-09-21) Added for 'Technical feedback' page */ /*.form-blue form .hs-form-field > label { color: #2400B0; font-family: FujitsuInfinityPro; } */ /* (Marcelo 03-06-22) Added for form in webpage 'Download FEP installers (FGC / Fujitsu Germany) */ .form-field-label-muted form .hs-form-field > label { color: #3a3356; font-family: FujitsuInfinityPro; } /* (Marcelo 06-06-22) Initially added for form ''Register for training (SoftwareMaster, June-2022) */ .ibm-tss form .hs-form-field > label { color: #008224; font-family: FujitsuInfinityPro; } .fast-form-label-font-light > label { font-family: FujitsuInfinityPro !important; } /* (Marcelo 14-10-21) Added for form in webpage 'IBM Delvery' page */ .contact-simple-form form .hs-form-field legend { color: #202020; font-family: FujitsuInfinityPro; font-size:80%; margin-bottom: 10px; } /* (Marcelo 01-09-21) Added attrs for 'IBM Order' webpage */ /* (Marcelo 17-12-20) Added 'margin' for form 'AuthConductor Technical Evaluation' and 'Technical Services Customer Satisfaction Survey' */ .ibm-tss form .hs-form-field legend { color: #505050; font-family: FujitsuInfinityPro; font-size:80%; margin-bottom: 10px; font-style: italic; } /* (Marcelo 21-09-21) Added for 'IBM Order' webpage */ .contact-simple-form form .hs-form-field.hs-fieldtype-radio label { display:inline-block; width: fit-content;} /* (Marcelo 05-12-22) Added to make sure that fields with check box show the check box and text in the same line (initally added for form FEP EAP - Provide feedback) */ .contact-simple-form form .hs-form-field.hs-fieldtype-radio * { text-transform:none} .contact-simple-form form.hs-form .hs-form-field ul.inputs-list { font-size: 16px; } /* (Marcelo 10-01-20) Added font-size while working on FEP trial version downlod page's form */ .contact-simple-form form.hs-form .hs-form-field ul.inputs-list li::before { content: '' !important;} /* (Marcelo 26-09-23) Added to remove bullet point from checkboxes in forms */) .ibm-tss form.hs-form .hs-form-field ul.inputs-list { font-size: 90%; } .contact-simple-form form.hs-form .hs-form-field ul.inputs-list li input { width: auto; margin-right: 5px; padding: 0 !important; vertical-align: top; margin-left: 0px; margin-bottom:0 } .contact-simple-form form .hs_message { padding-left: 0; } .contact-simple-form form .hs-button { display: block; margin: 0 auto; background: #EA0000; border: none; font-size: 14px !important; color: #fff; padding: 0.6em 1.5em; letter-spacing: 0.8px; } .form-blue form .hs-button { display: block; margin: 0 auto; background: #2400B0; border: none; font-size: 14px !important; color: #fff; padding: 0.6em 1.5em; letter-spacing: 0.8px; border: 1px solid #2400B0; } /* (Marcelo 25-01-22) Initially added for form in webpage 'Trial download' */ .form-blue form .hs-button:hover { background-color: #00E7EF; text-shadow: 1px 1px 1px #2400B0, 1px -1px 1px #2400B0, -1px 1px 1px #2400B0, -1px -1px 1px #2400B0; } .form-blue a { color: #2400B0; } .form-cyan form .hs-button { display: block; margin: 0 auto; background: #00E7EF; border: none; font-size: 14px !important; color: #000; padding: 0.6em 1.5em; letter-spacing: 0.8px; border: 1px solid #2400B0; } /* (Marcelo 25-01-22) Initially added for form in webpage 'Trial download' */ .form-cyan form .hs-button:hover { background-color: #2400B0; text-shadow: 1px 1px 1px #2400B0, 1px -1px 1px #2400B0, -1px 1px 1px #2400B0, -1px -1px 1px #2400B0; color:#fff } .form-cyan a { color: #07c6bf; } .form-emerald form .hs-button { display: block; margin: 0 auto; background: #008224; border: none; font-size: 14px !important; color: #fff; padding: 0.6em 1.5em; letter-spacing: 0.8px; border: 1px solid #008224; } /* (Marcelo 27-11-21) Initially added for form in webpage 'FEP for Kubernetes' */ .form-emerald form .hs-button:hover { background-color: #61D600; text-shadow: 1px 1px 1px #008224, 1px -1px 1px #008224, -1px 1px 1px #008224, -1px -1px 1px #008224; } .form-emerald a { color: #008224; } .form-orange form .hs-button { display: block; margin: 0 auto; background: #F75100; border: none; font-size: 14px !important; color: #fff; padding: 0.6em 1.5em; letter-spacing: 0.8px; border: 1px solid #F75100; } /* (Marcelo 02-12-21) Initially added for form in blog posts*/ .form-orange form .hs-button:hover { background-color: #FFE700; text-shadow: 1px 1px 1px #F75100, 1px -1px 1px #F75100, -1px 1px 1px #F75100, -1px -1px 1px #F75100; } .form-orange a { color: #F75100; } .form-orange-dark form .hs-button { display: block; margin: 0 auto; background: #F75100; border: none; font-size: 14px !important; color: #fff; padding: 0.6em 1.5em; letter-spacing: 0.8px; border: 1px solid #F75100; } /* (Marcelo 02-12-21) Initially added for form in blog posts*/ .form-orange-dark form .hs-button:hover { background-color: #FFE700; text-shadow: 1px 1px 1px #F75100, 1px -1px 1px #F75100, -1px 1px 1px #F75100, -1px -1px 1px #F75100; } .form-orange-dark a { color: #F75100; } .form-red form .hs-button { display: block; margin: 0 auto; background: #EA0000; border: none; font-size: 14px !important; color: #fff; padding: 0.6em 1.5em; letter-spacing: 0.8px; border: 1px solid #EA0000; } /* (Marcelo 25-01-22) Initially added for form in webpage 'Trial download' */ .form-red form .hs-button:hover { background-color: #D80084; text-shadow: 1px 1px 1px #EA0000, 1px -1px 1px #EA0000, -1px 1px 1px #EA0000, -1px -1px 1px #EA0000; } .form-red a { color: #EA0000; } .form-yellow form .hs-button { display: block; margin: 0 auto; background: #F75100; border: none; font-size: 14px !important; color: #fff; padding: 0.6em 1.5em; letter-spacing: 0.8px; border: 1px solid #F75100; } /* (Marcelo 02-12-21) Initially added for form in blog posts*/ .form-yellow form .hs-button:hover { background-color: #FFE700; text-shadow: 1px 1px 1px #F75100, 1px -1px 1px #F75100, -1px 1px 1px #F75100, -1px -1px 1px #F75100; } .form-yellow a { color: #F75100; } .contact-simple-form ul.hs-error-msgs.inputs-list { color: #FF0000 !important; background-color: #FFFF99; font-size: 16px !important; padding: 3px 6px !important; list-style-type: none !important; margin-left: 15px !important; margin-top: -5px !important; margin-bottom: 15px !important; } /* (Marcelo 23-03-20) Added this line */ .form-blue ul.hs-error-msgs.inputs-list { color: #2400B0 !important; background-color: #00E7EF; font-size: 14px !important; padding: 3px 6px !important; list-style-type: none !important; margin-left: 15px !important; margin-top: -5px !important; margin-bottom: 15px !important; } /* (Marcelo 27-11-21) Initially added for form in webpage 'FEP for Kubernetes' */ .form-cyan ul.hs-error-msgs.inputs-list { color: #2400B0 !important; background-color: #00E7EF; font-size: 14px !important; padding: 3px 6px !important; list-style-type: none !important; margin-left: 15px !important; margin-top: -5px !important; margin-bottom: 15px !important; } /* (Marcelo 27-11-21) Initially added for form in webpage 'FEP for Kubernetes' */ .form-emerald ul.hs-error-msgs.inputs-list { color: #008224 !important; background-color: #61D600; font-size: 14px !important; padding: 3px 6px !important; list-style-type: none !important; margin-left: 15px !important; margin-top: -5px !important; margin-bottom: 15px !important; } /* (Marcelo 27-11-21) Initially added for form in webpage 'FEP for Kubernetes' */ .form-orange ul.hs-error-msgs.inputs-list { color: #F75100 !important; background-color: #FFE700; font-size: 14px !important; padding: 3px 6px !important; list-style-type: none !important; margin-left: 15px !important; margin-top: -5px !important; margin-bottom: 15px !important; } /* (Marcelo 02-12-21) Initially added for form in blog posts*/ .form-red ul.hs-error-msgs.inputs-list { color: #EA0000 !important; background-color: #ffcceb; font-size: 14px !important; padding: 3px 6px !important; list-style-type: none !important; margin-left: 15px !important; margin-top: -5px !important; margin-bottom: 15px !important; } /* (Marcelo 27-11-21) Initially added for form in webpage 'FEP for Kubernetes' */ .form-yellow ul.hs-error-msgs.inputs-list { color: #F75100 !important; background-color: #FFE700; font-size: 14px !important; padding: 3px 6px !important; list-style-type: none !important; margin-left: 15px !important; margin-top: -5px !important; margin-bottom: 15px !important; } /* (Marcelo 02-12-21) Initially added for form in blog posts*/ .contact-simple-form .hs_error_rollup { margin-top: 20px; } .contact-simple-form-show-options-in-single-line form.hs-form .hs-form-field ul.inputs-list li { display: inline; } /* (Marcelo 05-08-21) Added to show options in radio buttons and check box in a single line. Added while creating form in page 'Register for enablement session (Fujitsu ID, Aug-2021)' */ div[class^="hs_services_of_interest__for_quote"] ul li { display: inline-block !important; text-indent: -20px; padding-left: 40px; width: 50%; vertical-align: top; } /* (Marcelo 25-04-24) Added to show Services check boxes in form 'FEP Services quote request */ div[class^="hs_services_of_interest__for_quote___custom_service"] { margin-left: 30px; padding-top: 0px !important; max-width: 500px; } .hs_training___on_demand___courses_of_interest ul li { text-indent: -20px; padding-left: 20px; } /* (Marcelo 25-04-24) Added to show Services check boxes in form 'FEP Services quote request */ .contact-simple-form-show-options-in-single-line form.hs-form .hs-form-field ul.inputs-list li * { display: inline; margin-right: 6px; } /* (Marcelo 05-08-21) Added to show options in radio buttons and check box in a single line. Added while creating form in page 'Register for enablement session (Fujitsu ID, Aug-2021)' */ .ibm-tss .contact-simple-form-show-options-in-single-line form.hs-form .hs-form-field ul.inputs-list li * { font-family: 'FujitsuInfinityPro'; } form.hs-form .hs-form-field .form-show-options-side-by-side-50pct ul.inputs-list li { display: inline-block; width: 50%; vertical-align: top; } /* (Marcelo 21-10-22) Added to show options in radio buttons side by side. Added while creating form in page 'FEP EAP - Register for interest' */ .hs_hc_application_peak_business_hours_transaction_types li { display: block !important;} /* (22-08-23) Added for field 'What are the peak business hours?' in form 'Services Questionnaire - Health Check' */ .hs_name_of_the_primary_contact, .hs_email_address_of_the_primary_contact, .hs_end_customer_country, .hs_end_customer_s_company_address, .hs_end_customer_s_website_url, .hs_end_use { display: inline-block; width: 50%; vertical-align: top; } form[id^="hsForm_21cee15a-029f-48a1-842b-5d4e0f9ee85d"] .hs_firstname, form[id^="hsForm_21cee15a-029f-48a1-842b-5d4e0f9ee85d"] .hs_lastname { width: 25% !important; } form[id^="hsForm_21cee15a-029f-48a1-842b-5d4e0f9ee85d"] .hs_email { width: 50% !important; } form[id^="hsForm_21cee15a-029f-48a1-842b-5d4e0f9ee85d"] .hs_firstname input, form[id^="hsForm_21cee15a-029f-48a1-842b-5d4e0f9ee85d"] .hs_lastname input, form[id^="hsForm_21cee15a-029f-48a1-842b-5d4e0f9ee85d"] .hs_fujitsu_sales_personnel_name input, form[id^="hsForm_21cee15a-029f-48a1-842b-5d4e0f9ee85d"] .hs_end_customer_name input { text-transform: capitalize; } form[id^="hsForm_21cee15a-029f-48a1-842b-5d4e0f9ee85d"] .hs_target_system_name textarea { height: 38px; } input[id^="services_of_interest__for_quote_11"] + span { color:#2400B0; } /* (Marcelo 25-04-24) Added to show Services check boxes in form 'FEP Services quote request */ input[id^="services_of_interest__for_quote_12"] + span { color:#2400B0; } form[id^="hsForm_78226912-adb6-400c-99b6-d7379a8b3cf7"] [id^="how_many_people_will_be_participating_the_training"] { max-width: 70px !important; } /* (Marcelo 08-05-24) Used in for 'Interest in Instructor-led training' */ /* Additional settings for simple contact forms */ .contact-simple-form-show-labels form .hs-form-field > label { display:block; font-size: 16px;} /* (Marcelo 11-11-22) Added font-size for form 'Contact our PostgreSQL experts' */ /* (Marcelo 28-05-21) In Design Manager, add classes 'contact-simple-form' and 'contact-simple-form show-labels' */ .ibm-tss .hs-form-field > label { color: #374F3A; font-family: FujitsuInfinityProBold; } .contact-simple-form-show-labels form .hs-form-field input, .contact-simple-form-show-labels form .hs-form-field textarea { padding: 0.5em; font-size: 16px; margin-left: 0em; margin-bottom:1em; } /* (Marcelo 11-11-22) Added font-size for form 'Contact our PostgreSQL experts' */ .ibm-tss form .hs-form-field input, .ibm-tss form .hs-form-field textarea { padding: 0.4em; margin-left: 0em; margin-bottom:1em; } .contact-simple-form-show-labels form .hs-form-field select { padding: 0.6em; margin-left: 0em; margin-bottom: 1em; height: 40px; font-size: 16px; } /* (Marcelo 22-10-21) Added font-size when checking webpage 'IBM-TSS - Order (step 3 of 5)' */ .ibm-tss form .hs-form-field select { padding: 0.4em; margin-left: 0em; margin-bottom: 1em; height: 34px !important; } /* (Marcelo 22-10-21) Added font-size when checking webpage 'IBM-TSS - Order (step 3 of 5)' */ .ibm-tss form .hs-form-field input[type="number"] { padding: 0.2em 0.4em;} /* (Marcelo 21-12-21 ) Created for webpage 'IBM order (3 of 5), changing top and bottom padding to cater for spin arrows */ /* (Marcelo 06-07-21) Classes added for 'form' that is just a check box for user to ack EULA - added for webpage 'FUJITSU Enterprise Postgres Operator client - download' */ .fast-form-agree-with-eula { padding-left: 10px; } .fast-form-agree-with-eula ul.inputs-list { font-size: 18px !important; color: #303030; text-indent: -15px; } .fast-form-agree-with-eula .hs-button { margin: 10px !important; } /* "Contact us" form small */ /* (Marcelo 10-07-19) Added by Marcelo */.contact-form-small::placeholder, .contact-form-small select, .contact-form-small input, .contact-form-small textarea { color:#696969 } .contact-form-small h3 { font-size: 18px; } .contact-form-small { padding-left: 0.5em; padding-right: 1.0em; } .contact-form-small form .hs-form-field input, .contact-form-small form .hs-form-field textarea { border: 1px solid rgba(180, 180, 180, 1); background-color: rgba(242, 242, 242, 1); font-size: 13px !important; padding: 1.0em; margin-bottom:1.0em; } .contact-form-small form .hs-form-field textarea { text-transform: none !important; margin-top:0 } .contact-form-small form .hs-form-field select { position: relative; padding-left: 1.0em; border: 1px solid rgba(180, 180, 180, 1); background-color: rgba(242, 242, 242, 1); font-size: 13px !important; margin-bottom: 1.0em; display: block; height: 40px; border-radius: 0px; -webkit-border-radius: 0px; moz-border-radius: 0px; -webkit-appearance: none; -moz-appearance: none; -ms-appearance: none; -o-appearance: none; appearance: none; } .contact-form-small form .hs-form-field > label { display:none } .contact-form-small form .hs-form-field.hs-fieldtype-radio label { display:block } .contact-form-small form .hs-form-field.hs-fieldtype-radio * { text-transform:none} .contact-form-small form.hs-form .hs-form-field ul.inputs-list li input { width: auto; margin-right: 5px; padding: 0 !important; vertical-align: top; margin-bottom:0 } .contact-form-small form .hs_message { padding-left: 0; } .contact-form-small form .hs-button {display: block; margin: 0 auto; background: #EA0000; border: none; font-size: 14px !important; color: #fff; text-transform: uppercase; padding: 0.5em 0.5em; letter-spacing: 0.8px; border-radius: 3px; } .contact-form-small ul.hs-error-msgs.inputs-list { color: #FF0000 !important; background-color: #FFFF99; font-size: 12px; margin-top: -5px !important; margin-bottom: 15px !important; } /* (Marcelo 23-03-20) Added this line */ .contact-form-small .hs_error_rollup { margin-top: 20px; } .contact-form-small .hs_error_rollup .no-list { padding-left: 15px; } .contact-form-small .inputs-list {font-size: 16px; } /* (Marcelo 13-04-19) Added to reduce check blox vertical spacing in form 'Register for Upcoming sessions' of training off-site form */ /* (Marcelo 06-12-23 )Classes for poll forms [Initially created for blog post 'Setting the bar high: The role of security benchmarks in database protection'] */ .in-blog-form-module .contact-simple-form { padding: 20px;} .poll-heading { font-size: 1.1em !important; text-align: center; line-height: 1.2em; color: #404040; margin: 0px; } .hs-richtext p.poll-heading-subheader { font-size: .8em !important; text-align: center; line-height: 1.1em; color: #404040; margin: 0px; } .fujitsublog-template.fblogv2.fuji-template h2 div.poll-heading { font-family:'FujitsuInfinityProBold' !important; } .fujitsublog-template.fblogv2.fuji-template h2 p.poll-heading-subheader { font-family:'FujitsuInfinityPro' !important; } .poll-q-heading { color: #202020; font-size: 1m; padding-top: 15px; } .poll-heading img { height: 80px; padding-left:10px; float: right; } .poll-q-heading img { height: 45px; float: right; padding-left:0px; padding-bottom: 0px;} .poll-q-heading + hr { margin: 0px;border: 0px; border-bottom: 1px solid #FF8000;} .poll-q-note { font-size: .8em; padding-top: 10px;} .poll-q-details { font-size: .8em; padding-top: 20px; padding-bottom: 10px;} label[id^="label-blog_poll_01___cis_postgresql_benchmark"],label[id^="label-blog_poll_01___external_consultant"], label[id^="label-blog_poll_01___product_documentation"] ,label[id^="label-blog_poll_01___blogs_and_online_articles"], label[id^="label-blog_poll_01___organization_s_adopted_cybersecurity_framework"],label[id^="label-blog_poll_01___additional_comments"] { display: none !important;} div[class^="hs_blog_poll_01"] { padding-top: 0px; } .table-comparison th { font-size: 16px; padding: 8px 5px; } .table-comparison-hdr-col-1 { background-color: #FC7409; color: #FFFFFF; } .table-comparison-hdr-col-2 { background-color: #EA0000; color: #FFFFFF;} .table-comparison td { font-size: 16px;padding: 5px; border-bottom: 1px solid #EF9D5D; text-align:center;} .table-comparison tr > td:first-child { text-align:left; } .table-comparison-prefer-nowrap { white-space: nowrap; } .table-comparison-font-smaller { font-size: 90%; } .table-check { display: inline-block; width: 24px; background: url(https://www.postgresql.fastware.com/hubfs/Images/Pictograms/picto-check-mark-04-red-to-orange.svg) no-repeat center center; } @media only screen and (max-width: 650px) { .table-comparison-prefer-nowrap { white-space: normal; } .table-comparison-font-smaller { font-size: 80%; } .table-comparison th { font-size: 14px; font-weight: normal; padding: 5px 5px ; } .table-comparison td { font-size: 15px; padding: 1px; }} /* Resources */ .table-resources { border-collapse: separate; border:1px solid rgb(209,209,209); border-right:2px solid rgb(209,209,209); } .table-resources a { color:#000;} .table-resources * { text-align:left; } .table-resources th { background-color: rgb(209,209,209); padding:4px 5px ;} .table-resources td { padding:4px 5px ; border-left:1px solid rgb(209,209,209); border-bottom:1px solid rgb(209,209,209)} .table-resources img { height: 24px; margin-top: -3px; vertical-align: middle; margin-left: 6px; margin-right: 6px; } /* Hero banner */ .hero-banner.banner-callout { padding-top:2rem; padding-bottom:2rem; overflow:hidden;} /* (Marcelo 18-01-23) Changed value of padding top and bottom */ /* (Marcelo 31-01-22) Added 'padding-bottom' */ .hero-banner.trunk-post { padding-top:1rem; } .hero-banner.pzone-post { padding-top:1rem; } .callout-inner .red-callout { position:relative; left: 0; margin-left: 0 !important; background-size: 184px; transform:none; } .blog-post .callout-inner .red-callout { background-size: 340px; } .enabl-grad-red-to-orange .callout-inner .red-callout { background-size: 240px; } .grd-callout .callout-inner .red-callout { background-size: 340px; } .grd-callout-blue .callout-inner .red-callout { background-size: 340px; } .grd-callout-cyan-lime .callout-inner .red-callout { background-size: 340px; } .grd-callout-emerald .callout-inner .red-callout { background-size: 340px; } .grd-callout-orange-yellow .callout-inner .red-callout { background-size: 340px; } .grd-callout-red .callout-inner .red-callout { background-size: 340px; } .grd-callout-red-magenta .callout-inner .red-callout { background-size: 340px; } .grd-callout-red-orange .callout-inner .red-callout { background-size: 340px; } .grd-callout-red-yellow .callout-inner .red-callout { background-size: 340px; } .ibm-tss .callout-inner .red-callout { background-size: 340px; } .supp-patch .callout-inner .red-callout { background-size: 340px; } .vertical-center.callout-headline { left: 240px; top:0px; height: 90%; text-shadow: -1px -1px 0px #000, 1px -1px 0px #000, -1px 1px 0px #000, 1px 1px 0px #000;} /* (Marcelo 26-09-20) Added text-shadow to make text visible in bright portions of hero image. Atm we add text-shadow to the HTML in each page */ .blog-post .vertical-center.callout-headline { left: 360px; display: flex; align-items: center; width: fit-content; } /* (Marcelo 13-01-23) Removed 'height: 100%' here and in the classed below; added 'width' */ .grd-callout .vertical-center.callout-headline { left: 360px; display: flex; align-items: center; width: fit-content;} /* (Marcelo 17-11-21) Initially added for 'FEP on IBM - Modernization' webpage banner */ .grd-callout-blue .vertical-center.callout-headline { left: 360px; display: flex; align-items: center; width: fit-content;} /* (Marcelo 24-01-22) Initially added for 'Resource Center' webpage banner */ .grd-callout-cyan-lime .vertical-center.callout-headline { left: 360px; display: flex; align-items: center; width: fit-content;} /* (Marcelo 24-01-22) Initially added for 'Resource Center' webpage banner */ .grd-callout-emerald .vertical-center.callout-headline { left: 360px; display: flex; align-items: center; width: fit-content;} /* (Marcelo 19-01-22) Initially added for 'PRIMEWEB' webpage banner */ .grd-callout-orange-yellow .vertical-center.callout-headline { left: 360px; display: flex; align-items: center; width: fit-content;} /* (Marcelo 25-01-22) Initially added for 'Trial download' webpage banner */ .grd-callout-red .vertical-center.callout-headline { left: 360px; display: flex; align-items: center; width: fit-content;} /* (Marcelo 24-01-22) Initially added for 'Trial download' webpage banner */ .grd-callout-red-magenta .vertical-center.callout-headline { left: 360px; display: flex; align-items: center; width: fit-content;} .grd-callout-red-orange .vertical-center.callout-headline { left: 360px; display: flex; align-items: center; width: fit-content;} /* (Marcelo 18-02-22) Initally added for 'Services' webpages banners */ .grd-callout-red-yellow .vertical-center.callout-headline { left: 360px; display: flex; align-items: center; width: fit-content;} .ibm-tss .vertical-center.callout-headline { left: 360px; display: flex; align-items: center; width: fit-content;} .supp-patch .vertical-center.callout-headline { left: 360px; display: flex; align-items: center; width: fit-content;} .ibm-tss .vertical-center.callout-headline h1 { color: #FFFFFF; } /* (Marcelo 28-08-21) */ .ibm-tss .vertical-center.callout-headline h1 span { color: #FFFFFF; } /* (Marcelo 13-09-21) Added for banner in webpage 'Fujistu order - pre-approval status' */ .supp-patch .vertical-center.callout-headline h1 { color: #FFFFFF; } /* (Marcelo 28-08-21) */ .kb-article .vertical-center.callout-headline h1 { color: #505050; text-shadow: -1px -1px 0px #fff, 1px -1px 0px #fff, -1px 1px 0px #fff, 1px 1px 0px #fff; background-color: rgba(255,255,255,.4); padding: 0px 10px; max-width: fit-content; } /* Tables */ .table-simple { margin-left: 20px; } .table-simple-header { background: #E8E8E8; } .table-simple-col-header { background: #E8E8E8; text-align: center; vertical-align:middle !important; } .table-simple-row-header { background: #E8E8E8; } .table-simple-header-small { background: #E8E8E8; font-size: 60% !important; } .table-simple-col-header-small { background: #E8E8E8; font-size: 60% !important; text-align: center; vertical-align: middle !important; } .table-simple-row-header-small { background: #E8E8E8; font-size: 60% !important; } .table-simple-header-w-emphasis { background: #E8E8E8; font-size: 90% !important; color:#EA0000; text-align: center; } .table-simple-col-header-w-emphasis { background: #E8E8E8; font-size: 90% !important; color:#EA0000; text-align: center; vertical-align: middle !important; } .table-simple-row-header-w-emphasis { background: #E8E8E8; font-size: 90% !important; color:#EA0000; text-align: center; } .table-simple-header-empty-top-left { background: #FFFFFF; border-top: 1px solid #FFFFFF !important; border-left: 1px solid #FFFFFF !important; } .table-simple-cell-regular { background: #FFFFFF; } .table-simple td { font-size: 90%; vertical-align: top; padding: 3px 4px; border: 1px solid #C3C3C3; color: #000000; } .table-simple td ul { margin: 0px; padding-left: 20px; } .table-simple td ul li:before { width: 10px; } /* Used in 'Support - Compare Plans' page (as of 11-05-19) */ .table-fujitsu-header { background: #A43; color: #FFFFFF !important; } .table-fujitsu-col-header { background: #EA0000; color: #FFFFFF !important; padding: 3px 4px !important; text-align: center; vertical-align:middle !important; } .table-fujitsu-col-separator { background: #FFFFFF; color: #FFFFFF !important; padding: 0px 1px !important; border-top: 1px solid #FFFFFF !important; border-bottom: 1px solid #FFFFFF !important; font-size: 1px !important; } .table-fujitsu-row-header { background: #EA0000; color: #FFFFFF !important; padding: 3px 4px !important; border-bottom: 1px solid #FFFFFF !important; } .table-fujitsu-header-small { background: #EA0000; color: #FFFFFF !important; padding: 3px 4px !important; font-size: 60% !important; } .table-fujitsu-col-header-small { background: #EA0000; color: #FFFFFF !important; padding: 3px 4px !important; font-size: 60% !important; text-align: center; vertical-align: middle !important; } .table-fujitsu-row-header-small { background: #EA0000; color: #FFFFFF !important; padding: 3px 4px !important; font-size: 60% !important; border-bottom: 1px solid #FFFFFF !important; } .table-fujitsu-header-w-emphasis { background: #EA0000; color: #FFFFFF !important; padding: 3px 4px !important; font-size: 90% !important; color:#EA0000; text-align: center; } .table-fujitsu-col-header-w-emphasis { background: #EA0000; color: #FFFFFF !important; padding: 3px 4px !important; font-size: 90% !important; color:#EA0000; text-align: center; vertical-align: middle !important; } .table-fujitsu-row-header-w-emphasis { background: #EA0000; color: #FFFFFF !important; padding: 3px 4px !important; font-size: 90% !important; color:#EA0000; text-align: center; vertical-align: middle !important; border-bottom: 1px solid #FFFFFF !important; } .table-fujitsu-header-empty { background: #FFFFFF; padding: 3px 4px !important; border: 1px solid #FFFFFF !important; border-bottom: 1px solid #EA0000 !important; } .table-fujitsu-header-empty-top-left { background: #FFFFFF; padding: 0px 0px !important; border-top: 1px solid #FFFFFF !important; border-left: 1px solid #FFFFFF !important; } .table-fujitsu-header-empty-col-separator { background: #FFFFFF; color: #FFFFFF; padding: 0px 2px !important; border: 1px solid #FFFFFF !important; } .table-fujitsu td { font-size: 80%; vertical-align: top; border: 1px solid #EA0000; color: #000000; } .table-fujitsu-regular-cell { padding: 3px 4px !important; } .table-fujitsu td ul { margin: 0px; padding-left: 20px; } .table-fujitsu td ul li:before { width: 10px; } /* Table FAQ */ .table-faq-row-header-w-emphasis { background: #00812F; color: #FFFFFF !important; vertical-align: middle !important; text-align: center !important; } .table-faq-col-header-w-emphasis { background: #00812F; color: #FFFFFF !important; vertical-align: top !important; text-align: left !important; } .table-faq { margin-left: 50px; table-layout: fixed; display: block; overflow-x: auto; max-width: fit-content;} .table-faq td { font-size: 0.8em; color: #000000; vertical-align: middle; border-bottom: 1px solid #61D600 !important; padding: 3px 4px !important; } .table-faq tr:first-child td { border-bottom: 0px !important; } .table-faq td ul { list-style: square; } /* 'Scroll-then-fix' top navigation buttons */ /* (Marcelo 24-10-22) Copied these classes for page 'Resource Center' */ .res-center .scroll-then-fix-fixable-div { background-color: #FFFFFF; } .res-center.scroll-then-fix-top-nav { display: inline-block; padding: 4px; font-size: 12px; } .nav-button-large { background: #FFFFFF;} .nav-button-large .res-center.scroll-then-fix-top-nav { font-size: 0.9em; padding: 4px 12px; } .res-center.scroll-then-fix-top-nav:hover { box-shadow: 2px 2px 2px 0px #404040; } .res-center.scroll-then-fix-top-nav-current { color: #FFFFFF !important; box-shadow: 0px 0px 2px 2px #61D600; } .uvance-blue .res-center.scroll-then-fix-top-nav-current { color: #FFFFFF !important; box-shadow: 0px 0px 2px 2px #00E7EF; } .res-center.scroll-then-fix-top-nav-group-1 { background-color: #008224; color: #FFFFFF; } .uvance-blue .res-center.scroll-then-fix-top-nav-group-1 { background-color: #2400B0; color: #FFFFFF; } .res-center.scroll-then-fix-top-nav-group-2 { background-color: #FEBD00; color: #FFFFFF; } .res-center.scroll-then-fix-top-nav-group-3 { background-color: #307470; color: #FFFFFF; } .res-center.scroll-then-fix-top-nav-group-4 { background-color: #6bba62; color: #FFFFFF; } .scroll-then-fix-fixable-div-fixed .scroll-then-fix-fixable-div { position: fixed !important; top: 65px !important; z-index:99998;} @media only screen and (max-width: 1120px) { .scroll-then-fix-fixable-div-fixed .scroll-then-fix-fixable-div { top: 50px !important; } } @media only screen and (max-width: 61em) { /* (Marcelo 13-02-21) (61em=975px) At this viewport-width, CSS changes .fuji-header to 'display: none;", so we need to move the 'scroll-then-fix' navigation menu 61em */ .scroll-then-fix-fixable-div-fixed .scroll-then-fix-fixable-div { top: 0px !important; } } @media only screen and (max-width: 630px) { .scroll-then-fix-fixable-div-fixed .scroll-then-fix-fixable-div { top: 0px !important; } } /* FEP installer table styles */ /* (Marcelo 26-08-21) Used in 'Download the latest FUJITSU Enterprise Postgres installers */ .fep-install-tbl { margin-left: 20px; margin-bottom: 50px; font-family: FujitsuInfinityPro !important; } .fep-install-tbl-row-header { } .fep-install-tbl-col-header { vertical-align: middle !important; background-color: #2400B0; color: #FFFFFF !important; font-size: 80% !important; border-right: 1px solid #d0d0d0 !important; } .fep-install-tbl-vers { text-align: center; } .fep-install-tbl-arch { text-align: center; } .fep-install-tbl-os { text-align: center; } .fep-install-tbl-format { text-align: center; } .fep-install-tbl-comp { text-align: center; } .fep-install-tbl-file { font-size: 80% !important; word-break: break-word; padding-right: 0px !important; } .fep-install-tbl td { color: #000000; font-size: 80%; vertical-align: top; border-bottom: 1px solid #2400B0; padding: 5px 8px; } .fep-install-tbl tr:hover > td { background: #00E7Ef; color: #444444; cursor: default;} .fep-install-tbl-row-header:hover >td { background-color: #2400B0 !important; color: #FFFFFF !important; } /* (Marcelo 26-03-21) This setting is to avoid hover changing the color of table heading. Note that !important is required to override and stop the setting 'primeweb-table tr:hover > td ' taking effect */ /* Resource table styles */ /* Used in 'FUJITSU Technical Support - Support resources' and 'FUJITSU Enterprise Postgres Operator client - download (with resources) */ /* (Marcelo 06-07-21) Added 'Operator client' classes */ .fast-sharefile { background-color: #DDDDDD; } .fast-res-filter { margin-left: 5px; margin-right: 5px; font-size: 80%} .fast-res-filter .filter-title { color: #000000; font-family: FujitsuInfinityProBold; } .uvance-blue .fast-res-filter .filter-title { color: #2400B0; } .fast-res-type { font-size: 28px !important; border: 0px !important; padding: 5px 0px !important; } .fast-res-table { margin-left: 20px; margin-bottom: 50px; } .fast-res-table-row-header { } .fast-res-table-col-header { vertical-align: middle !important; background-color: #FF8000; color: #000000 !important; font-size: 80% !important; border-right: 1px solid #d0d0d0 !important; } .uvance-blue .fast-res-table-col-header { vertical-align: middle !important; background-color: #2400B0; color: #FFFFFF !important; font-size: 80% !important; border-right: 1px solid #d0d0d0 !important; } .fast-res-table-desc:not(.fast-res-table-col-header) { font-size: 70% !important; max-width: 500px; line-height: 1em; } .fast-res-table-file:not(.fast-res-table-col-header) { font-size: 70% !important; } .fast-res-table-file { white-space: pre; padding-right: 0px !important; } .fast-res-table-cta { text-align: center; padding: 0px 6px 0px 0px !important; margin-bottom: 4px !important; } .fast-res-table-cta img { height: 14px !important; width: 14px !important; margin-left: 8px; } .fast-res-table-date { text-align: center; white-space: pre; } .fast-res-table-date:not(.fast-res-table-col-header) { font-size: 70% !important; } .fast-res-table-fep-core { text-align: center; } .fast-res-table-fep-core i { color: #F75100; } .uvance-blue .fast-res-table-fep-core i { color: #2400B0; } .fast-res-table-on-prem { text-align: center; } .fast-res-table-container { text-align: center; } .fast-res-table-fep-cg { text-align: center; } .fast-res-table-fep-cg i { color: #303030; } .fast-res-table-fep-on-z { text-align: center; } .fast-res-table-fep-on-z i { color: #F75100; } .uvance-blue .fast-res-table-fep-on-z i { color: #2400B0; } .fast-res-table-fep-on-pwr { text-align: center; } .fast-res-table-fep-on-pwr i { color: #F75100; } .uvance-blue .fast-res-table-fep-on-pwr i { color: #2400B0; } .fast-res-table-fep-for-k8s { text-align: center; } .fast-res-table-fep-for-k8s i { color: #F75100; } .fast-res-table-version { text-align: center; } .fast-res-table-version:not(.fast-res-table-col-header) { font-size: 70% !important; } .fast-res-table-os { text-align: center; } .uvance-blue .fast-res-table-fep-for-k8s i { color: #2400B0; } .fast-res-table-catalog { text-align: center; display: none; } .fast-res-table-rhm { text-align: center; display: none; } .fast-res-table-size { text-align: right; } .fast-res-table-size:not(.fast-res-table-col-header) { font-size: 70% !important; } .fast-res-table-os:not(.fast-res-table-col-header) { font-size: 70% !important; } .fast-res-table td { color: #444444; font-size: 80%; vertical-align: top; border-bottom: 1px solid #C0C0C0; padding: 5px 6px; } .fast-res-table tr:hover > td { color: #444444; background-color: #F1DCC9; cursor: default;} .fast-res-table-row-header:hover >td { color: #000000 !important; background-color: #FF8000 !important; } /* (Marcelo 26-03-21) This setting is to avoid hover changing the color of table heading. Note that !important is required to override and stop the setting 'primeweb-table tr:hover > td ' taking effect */ .uvance-blue .fast-res-table-row-header:hover >td { color: #FFFFFF !important; background-color: #2400B0 !important; } .fast-res-table .cta_button { padding: 0px !important; } .fast-res-table-os-selected { display: table-row; } .fast-res-table-os-not-selected { display: none; } td.fast-res-td-border-clear-bottom { border-bottom: 1px solid #FFFFFF; } .fast-res-table-col-header.fast-res-table-fep-core, .fast-res-table-col-header.fast-res-table-fep-cg, .fast-res-table-col-header.fast-res-table-fep-on-z, .fast-res-table-col-header.fast-res-table-fep-on-pwr, .fast-res-table-col-header.fast-res-table-fep-for-k8s { font-size: 70% !important; line-height: 1em; } #fast-res-date-btn-uncheck-all { margin-left: 100px; margin-top: 8px;} /* Medium table styles */ .table-medium-wrapX { overflow-x: scroll; } .table-medium { margin-left: 20px; } .table-medium-col-header { background: #e8e8e8 !important; text-align: center; vertical-align:middle !important; } .table-medium-row-header { background: #e8e8e8 !important; } .table-medium-col-header-small { background: #e8e8e8 !important; font-size: 90% !important; text-align: center; vertical-align:middle !important; } .table-medium-row-header-small { background: #e8e8e8 !important; font-size: 90% !important; } .table-medium-col-header-w-emphasis { background: #e8e8e8 !important; font-size: 90% !important; color:#EA0000; text-align: center; vertical-align:middle !important; } .table-medium-row-header-w-emphasis { background: #e8e8e8 !important; font-size: 90% !important; color:#EA0000; text-align: center; } .table-medium-header-empty-top-left { background:#ffffff !important; border-top: 1px solid #ffffff !important; border-left: 1px solid #ffffff !important; } .table-medium td { font-size: 90%; vertical-align:top; padding: 5px 10px; border-left: 1px solid #ffffff; border-right: 1px solid #ffffff; border-top: 1px solid #c3c3c3; border-bottom: 1px solid #c3c3c3; } .table-medium td ul { margin: 0px; padding-left: 20px; } .table-medium td ul li:before { width:10px; } /* Knowledge Base styles */ .table-kb { margin-left: 30px; margin-bottom: 10px; border: 1px solid #FFFFFF; line-height: 1.5; } .kb-question-row-header { background-color: #A40000; color: #FFFFFF !important; height: 30px; width: 30px; text-align: center; vertical-align: middle; padding: 0px 6px; margin-right: 0.5em; } .uvance-emerald .kb-question-row-header { background-color: #008224; } /* (Marcelo 03-02-22) Initially added for webpage 'FEP OPerator - FAQ' */ .kb-answer-row-header { background-color: #61D600; color: #FFFFFF !important; height: 30px; width: 30px; text-align: center; vertical-align: middle; padding: 0px 6px; margin-right: 0.5em; } .kb-question-row-detail { color: #000000 !important; margin-left: 2.2em; text-indent: -2.2em; margin-top: 20px !important; margin-bottom: 0px !important; padding-top: 5px !important;padding-bottom: 5px !important; font-weight: bold;} .kb-answer-row-detail { color: #000000 !important; margin-left: 2.2em; text-indent: -2.2em; margin-top: 5px !important; margin-bottom: 5px !important; padding-top: 5px !important;padding-bottom: 5px !important;} .kb-answer-row-detail-indent-lvl-1 { color: #000000 !important; margin-left: 3.0em !important; margin-top: 0px !important; margin-bottom: 10px !important; } .kb-answer-row-detail-indent-lvl-2 { color: #000000 !important; margin-left: 4.0em !important; margin-top: 0px !important; margin-bottom: 10px !important; } .kb-answer-row-detail-cmd-output-lvl-1 { color: #000000 !important; margin-left: 4.0em ; margin-top: 0px !important; margin-bottom: 10px !important; font-family: monospace !important; font-size: 70% !important; background-color: #F2F2F2; color:#101010; border: 1px solid #AAAAAA; padding: 8px; white-space: pre !important; overflow-x: auto !important; max-width: fit-content; border-radius: 3px; } .kb-answer-row-detail-cmd-output-lvl-2 { color: #000000 !important; margin-left: 5.0em ; margin-top: 0px !important; margin-bottom: 10px !important; font-family: monospace !important; font-size: 70% !important; background-color: #F2F2F2; color:#101010; border: 1px solid #AAAAAA; padding: 8px; white-space: pre !important; overflow-x: auto !important; max-width: fit-content; border-radius: 3px; } .kb-toc-row { font-size: 16px !important; color: #444444 !important; margin-top: 10px; margin-bottom: 15px; } .table-kb td { margin-left: 30px; border: 1px solid #FFFFFF; vertical-align: top; padding: 3px 5px; color: #000000; } .table-kb td p { margin-top: 5px; margin-bottom: 5px;; font-size: 18px !important; } .table-kb td .code-script { margin: 5px !important; font-size: 15px !important; } .table-kb td ul { list-style: square; } @media only screen and (max-width:767px) { .kb-toc-row { display: none;} .bkg-color-gray-medium { display: none !important;} .border-dotted { display: none !important;} } /* Table align top */ .align-top td { vertical-align: top !important; } .align-middle td { vertical-align: middle !important; } /* View the brochure */ .brochure-wrap { padding: 10px; border: 2px dotted #cacaca; background: #e6e6e6; } .sec-body .brochure-wrap p { font-size: 14px; line-height: 1.4em; } .sec-body .brochure-wrap a.cta_button { padding: 10px 12px !important; line-height: 1.4em !important; font-size: 13px !important; } @media only screen and (max-width: 40em) { .remove-responsive p, .remove-responsive * { font-size: inherit; } } @media only screen and (max-width:767px) { .remove-responsive .row-fluid [class*="span"] { display: inline-block !important; float: left !important; width:none !important; } .remove-responsive .span2mob { width: 940px !important;} .remove-responsive .span2mob2 { width: 910px !important;} .remove-responsive .span8mob { width: 1280px !important; } .remove-responsive .span4mob { width: 640px !important; background-position: center center !important; } .remove-responsive .span3mob, .remove-responsive .span3.widget-span.span3mob { width: 630px !important; } .remove-responsive p, .remove-responsive * { font-size: inherit; } .remove-responsive table td { display: inline-block; } } /* Footer */ .footer-container-wrapper { } .footer-container { } .footer-menu { padding-top: 20px; padding-left: 20px;} .fuji-footer * { font-size: 16px; } .fuji-footer a { margin-right:1.5em;} .uvance-blue * { font-family: 'FujitsuInfinityPro';} /* (Marcelo 24-01-22) Initially added for Resource Center footer */ .uvance-cyan * { font-family: 'FujitsuInfinityPro';} /* (Marcelo 21-04-23) Initially added for Migration Portal footer */ .uvance-emerald * { font-family: 'FujitsuInfinityPro';} /* (Marcelo 21-01-22) Initially added for PRIMEWEB footer */ .uvance-orange * { font-family: 'FujitsuInfinityPro';} /* (Marcelo 25-01-22) Initially added for webage 'Trial download' */ .uvance-red * { font-family: 'FujitsuInfinityPro';} .uvance-blue.footer-menu { background-color: #EBE6FF; margin-top: 30px; line-height: 1em; } .uvance-cyan.footer-menu { background-color: #D9F1F4; margin-top: 30px; line-height: 1em; } .uvance-emerald.footer-menu { background-color: #D1FFCC; margin-top: 30px; line-height: 1em; } .uvance-orange.footer-menu { background-color: #FFE700; margin-top: 30px; line-height: 1em; } .uvance-red.footer-menu { background-color: #FFE6F5; margin-top: 30px; line-height: 1em; } .uvance-yellow.footer-menu { background-color: #FFE700; margin-top: 30px; line-height: 1em; } .uvance-blue.fuji-footer a { color: #2400B0; } .uvance-cyan.fuji-footer a { color: #04666a; } .uvance-emerald.fuji-footer a { color: #008224; } .uvance-orange.fuji-footer a { color: #F75100; } .uvance-red.fuji-footer a { color: #EA0000; } .uvance-blue.footer-copyright-info { background-color: #2400B0; } .uvance-cyan.footer-copyright-info { background-color: #00E7Ef; } .uvance-emerald.footer-copyright-info { background-color: #008224; } .uvance-orange.footer-copyright-info { background-color: #F75100; } .uvance-red.footer-copyright-info { background-color: #EA0000; } .uvance-yellow.footer-copyright-info { background-color: #FF8000; } .footer-copyright-info img { vertical-align: middle;} .footer-copyright-info .copyright-text { color: #000000; font-size: 12px;} .footer-copyright-info .cta_button { } /* (Marcelo 10-02-22) Added to lift the button 'Contact us' from the bottom of footer */ /* Menu */ .hs-menu-wrapper.hs-menu-flow-horizontal > ul li.hs-item-has-children ul.hs-menu-children-wrapper li a, .hs-menu-wrapper.hs-menu-flow-vertical>ul li.hs-item-has-children ul.hs-menu-children-wrapper li a { width: 250px; white-space: normal; text-overflow: inherit; line-height:1.5em; } .hs-menu-wrapper.hs-menu-flow-vertical>ul li.hs-item-has-children { height: 33px; } .hs-menu-wrapper.hs-menu-flow-vertical>ul li.hs-item-has-children:hover { height: auto; } .hs-menu-wrapper.hs-menu-flow-vertical>ul li.hs-item-has-children ul.hs-menu-children-wrapper { position:relative; left:0px;} .hs-menu-wrapper.hs-menu-flow-horizontal>ul li.hs-item-has-children ul.hs-menu-children-wrapper li a { font-size:14px; width:max-content;} /* Menu Reset - Remove styling from desktop version of custom-menu-primary - Place any additional CSS you want removed from the mobile menu in this reset */ .custom-menu-primary, .custom-menu-primary * { display: block; float: none; position: static; top: auto; right: auto; left: auto; bottom: auto; padding: 0px; margin: 0px; background-image: none; background-color: transparent; border: 0px; -webkit-border-radius: 0px; -moz-border-radius: 0px; border-radius: 0px; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; max-width: none; width: 100%; height: auto; line-height: 1; font-weight: normal; text-decoration: none; text-indent: 0px; text-align: center; color: #ffffff; } .custom-menu-primary, .custom-menu-primary a { color:#fff !important;} /* Toggle button */ a.mobile-trigger { display: inline-block !important; cursor: pointer; position: absolute; top:1.5em; right: 15%; width: auto; height: auto; padding: 17px 12px; background: #5a5c61; z-index: 99999999999; -webkit-transition: background-color 0.2s linear; font-size: 16px; font-weight: normal; text-align: left; text-transform: uppercase; -moz-border-radius-bottomleft: 6px; -webkit-transition:color .2s ease-in; -moz-transition:color .2s ease-in; transition:color .2s ease-in; -webkit-border-radius: 0px; -moz-border-radius: 0px; border-radius: 0px; border:none; } a.mobile-trigger:hover { text-decoration: none; color: #ffffff; } a.mobile-trigger span{ display: inline; } a.mobile-trigger span:before{ position: absolute; content: ''; font-family:"LatoBlack"; } a.mobile-trigger span:after{ position: relative; right: 2px; content: '';background-color: #000000; opacity: 0; transition: opacity .4s ease-in-out; -moz-transition: opacity .4s ease-in-out; -webkit-transition: opacity .4s ease-in-out; } .mobile-open a.mobile-trigger{ -webkit-transition:background-color 0.2s linear; -moz-transition:background-color 0.2s linear; transition:background-color 0.2s linear;background: transparent; } .mobile-open a.mobile-trigger span:after{ opacity: 1; } a.mobile-trigger i { display: inline; position: relative; top: -5px; -webkit-transition-duration: 0s; -webkit-transition-delay: .2s; -moz-transition-duration: 0s; -moz-transition-delay: .2s; transition-duration: 0s; transition-delay: .2s; } a.mobile-trigger i:before, a.mobile-trigger i:after { position: absolute; content: ''; } a.mobile-trigger i, a.mobile-trigger i:before, a.mobile-trigger i:after { width: 24px; height: 2px; background-color: #ffffff; display: inline-block; } a.mobile-trigger i:before { margin-top: -6px; -webkit-transition-property: margin, -webkit-transform; -webkit-transition-duration: .2s; -webkit-transition-delay: .2s, 0; left:0; } a.mobile-trigger i:after { margin-top: 6px; -webkit-transition-property: margin, -webkit-transform; -webkit-transition-duration: .2s; -webkit-transition-delay: .2s, 0; left:0; } .mobile-open a.mobile-trigger i { background-color: rgba(0,0,0,0.0); -webkit-transition-delay: .2s; -webkit-box-shadow: 0px 1px 1px rgba(0, 0, 0, 0); -moz-box-shadow: 0px 1px 1px rgba(0, 0, 0, 0); box-shadow: 0px 1px 1px rgba(0, 0, 0, 0); } .mobile-open a.mobile-trigger i:before { margin-top: 0; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); -webkit-transition-delay: 0, .2s; -webkit-box-shadow: 0px 1px 1px rgba(0, 0, 0, 0); -moz-box-shadow: 0px 1px 1px rgba(0, 0, 0, 0); box-shadow: 0px 1px 1px rgba(0, 0, 0, 0); left:0; } .mobile-open a.mobile-trigger i:after { margin-top: 0; -webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg); -webkit-transition-delay: 0, .2s; -webkit-box-shadow: 0px 1px 1px rgba(0, 0, 0, 0); -moz-box-shadow: 0px 1px 1px rgba(0, 0, 0, 0); box-shadow: 0px 1px 1px rgba(0, 0, 0, 0); left:0; } /* Child Toggle Button */ a.child-trigger { display: block !important; cursor: pointer; position: absolute; top: 0px; right: 0px; width: 55px !important; min-width: 55px !important; height: 45px !important; padding: 0 !important; border-left: 1px dotted rgba(255, 255, 255, .20); } a.child-trigger:hover { text-decoration: none; } /* Child Toggle Button Icon & Animations */ a.child-trigger span { position: relative; top: 50%; margin: 0 auto !important; -webkit-transition-duration: .2s; -moz-transition-duration: .2s; transition-duration: .2s; } a.child-trigger span:after { position: absolute; content: ''; } a.child-trigger span, a.child-trigger span:after { width: 10px; height: 1px; background-color: #ffffff; display: block; } a.child-trigger span:after { -webkit-transform: rotate(-90deg); -ms-transform: rotate(-90deg); transform: rotate(-90deg); -webkit-transition-duration: .2s; -moz-transition-duration: .2s; transition-duration: .2s; } a.child-trigger.child-open span:after { -webkit-transform: rotate(-180deg); -ms-transform: rotate(-180deg); transform: rotate(-180deg); -webkit-transition-duration: .2s; -moz-transition-duration: .2s; transition-duration: .2s; } a.child-trigger.child-open span { -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); -webkit-transition-duration: .2s; -moz-transition-duration: .2s; transition-duration: .2s; } /* Menu Styles on Mobile Devices */ /* Hide menu on mobile */ .custom-menu-primary.js-enabled .hs-menu-flow-horizontal, .custom-menu-primary.js-enabled .hs-menu-children-wrapper{ display: none; } /* Make child lists appear below parent items */ .custom-menu-primary ul.hs-menu-children-wrapper { visibility: visible !important; opacity: 1 !important; position: static !important; display: none; } /* Mobile Menu Styles */ .custom-menu-primary.js-enabled .hs-menu-flow-horizontal{ position: absolute; top: 0; left: 0px; width: 100%; height:100%; background: rgba(67, 67, 67, 0.93); position:fixed; -webkit-box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, 0.65); -moz-box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, 0.65); box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, 0.65); } .custom-menu-primary .hs-menu-flow-horizontal{ padding: 40px 0 0 0; background-color: #000000; width: 100%; z-index: 8888; } .custom-menu-primary .hs-menu-flow-horizontal > ul > li{ position: relative; } .custom-menu-primary .hs-menu-flow-horizontal > ul > li a{ font-size:96px; overflow: visible; line-height: 1.5em; color: #fff !important; text-transform: uppercase; font-family: "LatoHeavy" } .custom-menu-primary .hs-menu-flow-horizontal > ul > li a:hover { color:#ffc915 !important } .hs-menu-wrapper.hs-menu-flow-horizontal>ul li a { max-width:none !important; padding:0; white-space: inherit !important;} .custom-menu-primary .hs-menu-flow-horizontal ul li a{ padding: 0 10px; } .custom-menu-primary .hs-menu-flow-horizontal ul li a:hover{ color: #ffffff; } .custom-menu-primary .hs-menu-flow-horizontal > ul ul li{ background-color: rgba(255, 255, 255, .08); } .custom-menu-primary .hs-menu-flow-horizontal > ul ul li a{ text-indent: 10px; font-size: 16px; } .custom-menu-primary .hs-menu-flow-horizontal > ul ul ul li a{ text-indent: 30px; } .custom-menu-primary .hs-menu-flow-horizontal > ul ul ul ul li a{ text-indent: 50px; } .widget-type-header, .widget-type-rich_text { min-height:0px !important;} /* Helper classes*/ /* Display and Alignment */ .fl { float: left} .fr { float: right} .clearfix { margin-bottom: 5px; &:before, &:after { content: ""; display: table; } &:after { clear: both; } } .pos-relative { position:relative;} .pos-absolute { position:absolute;} .hidden { display: none !important; } .visible { display: block !important; } .min-height0 { min-height:0 !important} .align-left { text-align: left; } .align-center { text-align: center; } .align-right { text-align: right; } .align-just { text-align: justify; } .valign-bot { vertical-align:bottom;} .vertical-center {position: absolute;/* top: 40%; */left:0;right:0;/* -webkit-transform: translateY(-50%); *//*-ms-transform: translateY(-50%);*//* transform: translateY(-50%); */} /* (Marcelo 02-10-20) Changed 'top: 50%' to 'top: 40%' so that page title in banners are displayed higher. Note that for IOBM banner in home page I had to change 'Inline stytling' in template, because text is to long and 1st sentence was partly cut off */ .hero-banner-imageless .vertical-center { position: initial; display: block; margin: 10px auto; text-align: center; } .vertical-bot-center { position: absolute; top: 50%; left:0; right:0; -webkit-transform: translateY(-40%); -ms-transform: translateY(-40%); transform: translateY(-40%); } .visible-hidden { visibility:hidden;} .pad-mar-0 { padding: 0; margin: 0 } .pad-0 { padding: 0; } .pad-5px { padding: 5px; } .pad-top-0 { padding-top: 0; } .pad-bot-0 { padding-bottom: 0; } .pad-bot-10px { padding-bottom: 10px; } .pad-bot-3 { padding-bottom: 3em } .pad-top-1 { padding-top: 1em; } .pad-top-2 { padding-top: 2em; } .pad-top-3 { padding-top: 3em; } .pad-topbot-2 { padding-top: 2em; padding-bottom: 2em; } .pad-left-1 { padding-left: 1.2em; } .pad-lr-1 { padding: 0 1.5em; } .pad-r-1 { padding-right: 1.5em; } .mar-0 { margin: 0 !important; } .mar-top-0 { margin-top: 0px; } .mar-top-1 { margin-top: 1em; } .mar-top-2 { margin-top: 2em; } .mar-top-50px { margin-top: 50px; } .mar-r-1 { margin-right: 1em; } .mar-r-2 { margin-right: 2em; } .mar-l-1 { margin-left: 1em; } .mar-bot-1 { margin-bottom: 1em; } .mar-bot-2 { margin-bottom: 2em; } .fit { max-width: 100%; } .width-25 { width: 25% } .width-50, .row-fluid .span6.width-50 { width: 50% } .width-40 { width: 40% } .width-60 { width: 60% } .width-100 { width: 100%; } .full-height { height: 100%; } .max-width-80px { max-width: 80px; } ul.unstyled, ol.unstyled, .unstyled ul, .unstyled ol { list-style: none; padding: 0; margin:0;} .list-inline li { display:inline-block;} .fade * { animation: fadein 0.6s; -moz-animation: fadein 0.6s; -webkit-animation: fadein 0.6s; -o-animation: fadein 0.6s; } @keyframes fadein { from { opacity:0; } to { opacity:1; } } /* Img to background image */ .bg-img-wrap, .hs-rss-item { background-size:cover; background-repeat:no-repeat; background-position:top center; } .bg-img, .bg-img img, .hs-rss-featured-image, .slider-bg li img, .slider-img li img { display:none !important;} /* (Marcelo 16-11-20) Created slider-img copied from slider-bg for home page slider */ /* Customzed hubspot default slider */ .slider-bg { position: relative; overflow:hidden;} .slider-bg ul { margin:0; padding:0;} .slider-bg ul.hs_cos_flex-slides li { height:70vh; background-size:cover; background-repeat:no-repeat; background-position:right center; overflow:hidden;} .slider-bg .hs_cos_flex-control-paging { position: absolute; z-index: 2; bottom: 2.5em; left: 0; right: 0; max-width: 200px; margin: 0 auto; } .slider-bg .hs_cos_flex-control-paging > li { list-style: none; display: inline-block; height: 13px; overflow: hidden; } .slider-bg .hs_cos_flex-control-paging > li a { color: transparent; background: #fff; margin: 0 4px; width: 10px; cursor:pointer; font-size:20px; } .slider-bg .hs_cos_flex-control-paging > li a.hs_cos_flex-active, .slider-bg .hs_cos_flex-control-paging > li a:hover { background-color:#EA0000} .slider-bg ul.hs_cos_flex-direction-nav { display:none ;} .slider-img { position: relative; overflow:hidden;} /* (Marcelo 16-11-20) Created slider-img copied from slider-bg for home page slider */ .slider-img ul { margin:0; padding:0;} .slider-img ul.hs_cos_flex-slides li { height: 420px; background-size:cover; background-repeat:no-repeat; background-position:right center; overflow:hidden;} .slider-img .callout-inner { padding-top: 40px; padding-left: 40px; } .slider-img p { font-size: 24px; } .text-carousel { position:relative; overflow:hidden} .text-carousel ul { margin:0; padding:0;} .text-carousel ul.hs_cos_flex-direction-nav { position: absolute; right: 2em; list-style: none; z-index:2; } .text-carousel ul.hs_cos_flex-direction-nav li { display: inline; margin: 0 8px; } .text-carousel .hs_cos_flex-slider .hs_cos_flex-slides img { width:50px; height:30px; display:inline-block; float:left; margin-right:30px;} .text-carousel .hs_cos_flex-direction-nav li a, .text-carousel .hs_cos_flex-direction-nav li a:hover { color: transparent; } .text-carousel .hs_cos_flex-direction-nav a { background: url(https://2585850.fs1.hubspotusercontent-na1.net/hubfs/2585850/Images/Icons/icon-carousel-navigation.png) no-repeat 0 0; background-size: 28px; width: 14px; height: 30px; display: inline-block; } .text-carousel .hs_cos_flex-control-paging { display:none;} .text-carousel a.hs_cos_flex-prev { background-position: 0px 4px; } .text-carousel a.hs_cos_flex-next { background-position: -13px 4px; } .text-carousel .caption { padding-right:3em;} /* Circled image */ .img-circle img { border-radius:50%;} @media (max-width: 768px) { .hide-br-mob br { display:none; } .mar-0-mob { margin:0 !important;} .pad-right-4 { padding-right:0 !important;} } /* Custom global helper classes */ html { font-size: 16px; } @media (max-width: 900px) { html { font-size: 15px; } } @media (max-width: 400px) { html { font-size: 13px; } } h1, h2, h4, h5, h6, .h1, .h2, .h4, .h5, .h6 { font-family: 'FujitsuInfinityPro' , Arial, Verdana, sans-serif !important; color: #4A4A4A; padding:0; font-weight:normal; margin: 20px 0px; } h1, .h1 { font-size: 2.4rem; font-weight: 600 !important; line-height:1.4em;} .uvance h1 { font-size: 2.3rem; font-weight: 400 !important; line-height:1.4em;} .uvance .h1-minor{ font-size: 2.1rem !important; } h2, .h2 { font-size: 2.0rem; } .uvance h2 { font-size: 1.8rem; } .uvance-blue h2 { color: #2400B0; } .uvance-emerald h2 { color: #008224; } .uvance-orange h2 { color: #F75100; } /* (Marcelo 25-01-22) Initially added for webpage 'Select OS' of Trial Download pages */ .uvance-red h2 { color: #EA0000; } .uvance-yellow h2 { color: #F75100; } /* (Marcelo 27-12-22) Initially added for webpage 'Data Masking white paper */ .res-vid-mod h2 { color: #000000; } h3, .h3, h3 a { color: #EA0000; font-size: inherit; line-height:1.45em; padding:0; font-weight:normal; } .uvance h3 { font-size: 1.5rem; } .uvance form h3 { font-size: 1.1rem; } /* (Marcelo 27-12-22) Initially added for form in webpage 'Data Masking white paper' */ h3 span { color: inherit; } .uvance-blue h3 { color: #404040; } /* #471AFF */ .uvance-emerald h3 { color: #404040; } /* #00CC3A */ .uvance-orange h3 { color: #404040; } /* #FFA64D */ /* (Marcelo 25-01-22) Initially added for webpage 'Select OS' of Trial Download pages */ .uvance-red h3 { color: #404040; } /* #FF4D4D */ .uvance-yellow h3 { color: #404040; } /* (Marcelo 22-09-22 Initiall added for webpage 'FEP Training Service' gate page) */ .res-vid-mod h3 { color: #008224; background: linear-gradient(to right, #008224 75%, #61D600 85%);-webkit-background-clip: text;-webkit-text-fill-color: transparent; max-width: fit-content; font-family:FujitsuInfinityProBold } .res-vid-mod hr { border: 1px solid #404040; } .container-framed-orange h3 { color: #000000; } /* (Marcelo 26-12-22) Initially added for webpage 'Enhanced security for enterprises' */ [class*='container-framed'] h3 { margin-top: 0px !important;} /* (Marcelo 30-09-22) Initially added for webpage 'Fujitsu Enterprise Postgres Operator FAQ' */ h4, .h4 { font-size: 1.2em; } .uvance h4 { font-size: 1.2rem; } h5, .h5 { font-size: 1.2em; color: #505050 !important; } .uvance p, .uvance ul { font-size: 20px; } .blog-post h1 { color: #000000;} p { margin:0; margin-bottom:20px; } img { max-width:100%; height:auto;} .img-right { position:relative; z-index:9;} /* Fonts */ .calist * { font-family: 'calist', sans-serif; font-weight:normal; } .centurygothic * { font-family: 'centurygothic', sans-serif; font-weight:normal; } .sm-font *, .sm-font { font-size:12px;} .underline { text-decoration:underline !important;} .allcaps { text-transform:uppercase;} /* Padding */ .pad-0-2 { padding:0.2em;} .pad-0-5 { padding:0.5em;} .pad-1 { padding:1em;} .pad-2 { padding:2em;} .pad-4 { padding:2em;} .pad-left-1 { padding-left:1em;} .pad-right-1 { padding-right:1em;} .pad-right-4 { padding-right:4em;} .pad-leftright-1 { padding:0 1.5em;} .pad-topbot-0-5 { padding:0.5em 0;} .pad-topbot-1 { padding:1em 0;} .pad-topbot-2 { padding:2em 0;} .pad-topbot-3 { padding:3em 0;} .pad-topbot-5 { padding:5em 0;} .pad-top-3 { padding-top:3em;} .pad-bot-3 { padding-bottom:3em;} .pad-bot-1 { padding-bottom:1em;} .mar-left-1 { margin-left:1.4em !important;} .mar-left-0 { margin-left:0 !important;} .mar-left-5px { margin-left: 5px !important;} .mar-left-10px { margin-left:10px !important;} /* Section header and section body */ .sec-head h1 { } .sec-head h2 { display: inline-block; margin: 8px 0; border-left: 2px solid #EA0000; padding-left: 0.6em; } .sec-head h2 { } .sec-head h3 { } .sec-head h4 { } .sec-head p { font-family: 'calistb',sans-serif; font-size: 2.2em; margin-top: 0;} .sec-body { min-height:0px;} .sec-body p { font-size: 22px;} .uvance .sec-body p { font-size: 1.1rem; } .container-framed-orange p { color: #202020; font-size: 18px;} /* (Marcelo 26-12-22) Added for webpage 'Enhanced security for enteprises' */ .uvance .sec-body ul { font-size: 1.1rem; margin-top: 0px; margin-left: 20px; } /* (Marcelo 09-01-20) Added 'font-size' and 'margin-top' while tweakning page 'Services Overview' > box 'You may also be interested in the following services' */ .uvance .sec-body ol { font-size: 1.1rem; margin-top: 0px; margin-left: 20px; } .pos-rel { position: relative; } .hs-richtext p { font-size: 16px !important; margin-bottom: 10px !important } .inputs-list p { font-size: 16px !important; margin-bottom: 10px !important } /* Color: Font and Background */ .white, .white * { color: #fff; } .gray { color: #4A4A4A; } .red { color: #EA0000;} .dark-gray { color: #eee; } .black, .black * { color:#444444;} .bg-white { background-color: #fff } .bg-red { background-color: #EA0000;} .bg-gray { background-color: #595959; } .bg-lightgray { background-color: #f7f9f8 } .bg-lightgray2 { background-color: #f5f5f5; } .bg-medgray { background-color: #dad9d6 } .bg-medgray2 { background-color:#d1d1d1 } /* Overlay */ .white-overlay:before { position: absolute; width: 100%; height: 100%; content: ''; background: rgba(213, 222, 229,0.8); top: 0; z-index: 0; } .white-mid-overlay:before { position: absolute; width: 100%; height: 54%; content: ''; bottom: 0; z-index: 0; background: -moz-linear-gradient(top,rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%); /* FF3.6-15 */ /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,ffffff+100&1+0,0+100;White+to+Transparent */ background: -webkit-linear-gradient(top,rgba(255,255,255,1) 0%,rgba(255,255,255,0) 100%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(to bottom,rgba(255,255,255,1) 0%,rgba(255,255,255,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#00ffffff',GradientType=0 ); } /* IE6-9 */ .smooth-transition * { -webkit-transition: all 0.2s; -moz-transition: all 0.2s; -ms-transition: all 0.2s; -o-transition: all 0.2s; transition: all 0.2s; -webkit-transition-timing-function: cubic-bezier(0.25,0.1,0.25,1); transition-timing-function: cubic-bezier(0.25,0.1,0.25,1); } .border-yellow { border:2px solid #FFE700; } .border-gray-r { border-right: 1px solid rgba(204, 204, 204, 1); } .border-r-3pxred { border-right: 3px solid #EA0000; padding-right: 15px; } /* Width */ .maxwidth-1000{ max-width: 1000px !important; } .maxwidth-90{ max-width: 900px; } .maxwidth-600 { max-width: 600px !important; } /* Custom form */ .simple-form form input, .simple-form form textarea { padding: 4px 10px; } .page-content h1 { color:#EA0000;} .page-content ul { list-style-type: disc; margin-left:0; padding-left:18px; } /* (Marcelo 31-01-22) For Uvance ul and ol definitions, see bottom of file */ /*.page-content ul li { position:relative;}*/ /* (Marcelo 02-01-20: Commented out this portion because it messes up multi-line list items - if list item spans more than 1 line, 2nd line also includes bullet, and floating image screws up (e.g., in 'eBook (form) page') .page-content ul li:before { content: "\25a0";font-family: "Arial Black";color: #A40000;padding-right: 0.3em;position: absolute;left: -18px;top: -4px;width: 12px;float: left;display: inline-block; size: 50%;} */ .page-content ul li span { padding-left:0; display:inline-block; } /* Post Featured Image on Listings Page */ .hs-featured-image-wrapper .hs-featured-image-link img.hs-featured-image { border-width: 0; max-height: 300px !important; height: auto; width: auto; display: inline-block !important; float: right; margin: 20px 0 20px 20px; } /* Blog Social Sharing icons - * Overrides defaults to better align icons and prevent overlapping */ .hs-blog-social-share { padding: 10px 0 0 0; border-top: 1px solid #cccccc; border-bottom: 1px solid #cccccc; height: auto; } /* Blog Commments - Custom styles are listed below, as the COS does not provide default styles. */ #comments-listing { border-bottom: 1px solid #ccc; margin-bottom: 30px; margin-top: 30px; } .comment { margin: 10px 0; border-top: 1px solid #ccc; padding: 15px 0; } .comment-date { font-size: 13px; text-align: right; } .comment-from { font-weight: bold; } .comment-body { padding: 10px 0; } /* Pagination */ .blog-pagination a.previous-posts-link::before { content: '< ';} .blog-pagination a.all-posts-link { margin-left: 1em; margin-right: 1em;} .blog-pagination a.next-posts-link::after { content: ' >';} /* Classes used on header of blog posts */ /* (Marcelo 11-01-23) Initially added for Vince's blog post 'The race for carbon neutrality' */ .blog-header-right-side-image {float: right; width: 150px; margin-left: 30px;} @media only screen and (max-width: 700px) { .blog-header-right-side-image {width: 130px; margin-left: 10px;} } @media only screen and (max-width: 400px) { .blog-header-right-side-image {width: 110px; margin-left: 10px;} } .more-link-wrap { display: block; width: 100%; text-align: center; margin-bottom: 0.8em; } .blog-pagination { margin-left: 1em; margin-top: 1em; margin-bottom: 1em; } a.all-posts-link { font-size: 16px; text-transform: uppercase; } .span12.widget-span.widget-type-blog_subscribe { margin-left: 0; } .fuj-subscribe h3 p { font-size: 18px !important; color: #000; line-height: 24px; } .fuj-subscribe form { background: #333; color: #fff; padding: 1em; } .fuj-subscribe label { margin: 6px 0; display: block; } .fuj-subscribe input[type="submit"] { font-size: 20px; text-decoration: none !important; background: #EA0000; border: 0; padding: 6px 20px; font-size: 18px; text-transform: uppercase; color: #fff; font-weight: 500; letter-spacing: 0.4px; } .fuj-subscribe input[type="email"] { margin-bottom:0.6em;} .fujblog-sidebar { padding-left: 10px; } /* .fujblog-sidebar h2 { border-bottom: 1px dotted #000; } */ /* (Marcelo 05-01-23) Commented as it is replaced by selector '#anchor-receive-our-blog + h2 '*/ #anchor-receive-our-blog + h2 { font-size: 1em !important; text-align: center; background-color: #FF8000; color: #000000;} /* (Marcelo 05-01-23) */ .trunk-content #anchor-receive-our-blog + h2 { background-color: #2400B0; color: #FFFFFF;} .pzone-content #anchor-receive-our-blog + h2 { background-color: #2400B0; color: #FFFFFF;} .fuj-subscribe form .hs_submit input { margin: 10px 0; } .fast-bold, .fast-bold * { font-family:FujitsuInfinityProBold !important; } /* (Marcelo 22-03-22) Initially added for webpage 'Download trial version' */ span.fast-bold, span.fast-bold * { font-family:FujitsuInfinityProBold !important; } /* (Marcelo 22-03-22) Initially added for webpage 'Download trial version' */ .fast-italic, .fast-italic * { font-family:FujitsuInfinityProItalic !important; } /* (Marcelo 31-07-23) Initially added for blog post 'PostgreSQL 16 and beyond' */ span.fast-italic, span.fast-italic * { font-family:FujitsuInfinityProItalic !important; } /* (Marcelo 31-07-23) Initially added for blog post 'PostgreSQL 16 and beyond' */ .fast-extra-bold, .fast-extra-bold * { font-family:FujitsuInfinityProExtraBold !important; } /* (Marcelo 09-01-23) Initially added for CTA banner in Vince's blog post 'The race for carbon neutraility' */ .uvance-emerald .fast-emphasis { color: #00812F; } /* Initially added for webpage 'Support lifecycle */ .fast-orange { color: #FF8000; } /* (Marcelo 05-10-23) Initially added for PartnerWeb */ .fast-gray-dark { color: #606060; } /* (Marcelo 22-12-23) Initially added for PartnerWeb */ .font-smaller { font-size: 90% !important; } /* (Marcelo 22-09-23) Added for PostgreSQL Insider bottom banner */ .font-smaller-yet { font-size: 80% !important; } /* (Marcelo 05-10-23) Added for 'Installation instructions' webpage */ .font-larger { font-size: 120% !important; } /* ( 1 row (e.g., im article 01) */ .fast-table thead td:last-child { border-right: 1px solid #EA0000; } .fast-table td { background: #FFFFFF; color: #303030 !important; padding: 5px 8px !important; border-bottom: 1px solid #EA0000; font-size: 90%; vertical-align: top; } .fast-table td:first-child { border-top: 1px solid #EA0000; } /* (Marcelo 16-05-20) The border-top setting is for tables with headers that span > 1 row (e.g., im article 01) */ .fast-table table ~ .legend { margin-left: 40px; margin-bottom: 30px; margin-top: -20px !important; font-size: 85%; color: #666666; } .fast-table table ~ .legend + .legend { margin-top: -30px !important; } /* (Marcelo 04-07-20: This settingh is for tables with more than 1 .legend - see PI article 08 (code str-re-ope) */ .fast-table table ul { padding-left: 0px;} .fast-table table p + ul { margin-top: -10px; } .fast-table table p + p { margin-top: -10px; } .uvance-emerald .fast-table thead td { background: #008224; border-right: 1px solid #FFFFFF; border-bottom: 1px solid #FFFFFF; } .uvance-emerald .fast-table thead td:last-child { border-right: 1px solid #008224; } .uvance-emerald .fast-table td { border-top: 1px solid #008224; border-bottom: 1px solid #008224; } .uvance-emerald .fast-table td:first-child { border-top: 1px solid #008224; } /* The border-top setting is for tables with headers that span > 1 row (e.g., im article 01) */ .fast-table-black.fast-table thead td { background: #202020; border-right: 1px solid #202020; border-bottom: 1px solid #FFFFFF; } .fast-table-black.fast-table thead td:last-child { border-right: 1px solid #202020; } .fast-table-black.fast-table td { border-top: 1px solid #202020; border-bottom: 1px solid #202020; } .fast-table-black.fast-table td:first-child { border-top: 1px solid #202020; } /* The border-top setting is for tables with headers that span > 1 row (e.g., im article 01) */ .uvance-emerald .fast-em td { font-weight: bold; font-size: 95%; color: #008224 !important; } /* (Marcelo 03-12-24) Created for 'Fujitsu Enterprise Postgres support lifecycle' */ @media only screen and (max-width: 1200px) { .fast-table table { margin-left: 0px !important; } /* (Marcelo 10-08-20) Added !important to margin-left, otherwise .table-gray setting for this attr remain */ } @media only screen and (max-width: 800px) { .fast-table table { font-size: 85%; } .fast-table td { padding: 3px 5px !important; } } .fast-table-compact { font-size: 80%; } /* (Marcelo 27-05-21) Added for table in webpage 'FEP Specifcations' */ .fast-table-borderless td { border: 0px !important; } /* (Marcelo 24-01-25) Updated for 'Understanding the PostgreSQL Background Writer' */ /* (Marcelo 27-05-21) Added for table in webpage 'FEP Specifcations' */ #table-fep-key-specs .key-spec-col-1 { max-width: 130px; } #table-fep-key-specs .key-spec-col-2 { max-width: 100px; } #table-fep-key-specs .key-spec-col-3 { max-width: 140px; } #table-fep-key-specs .key-spec-col-4 { max-width: 180px; } #table-fep-key-specs .key-spec-col-5 { max-width: 90px; } #table-fep-key-specs .key-spec-col-6 { max-width: 180px; } .three-col .hs-rss-item.hs-with-featured-image { width: 32.33%; float: left; display: inline-block; margin: .50%; position: relative; -webkit-transform-style: preserve-3d; -moz-transform-style: preserve-3d; transform-style: preserve-3d; height: 300px; background-size: cover; background-repeat: no-repeat; background-position: 0 0; } .four-col .hs-rss-item.hs-with-featured-image { width: 24%; float: left; display: inline-block; margin: .50%; position: relative; -webkit-transform-style: preserve-3d; -moz-transform-style: preserve-3d; transform-style: preserve-3d; height: 300px; background-size: cover; background-repeat: no-repeat; background-position: 0 0; } .hs-rss-item.hs-with-featured-image .hs-rss-item-text { width:100%; } .hs-rss-description a { color:#fff; text-decoration:underline; } .hs-rss-description { opacity: 0; visibility: hidden; display: none; margin-top: 10px; } .hs-rss-description * { font-size: 0.9em !important; font-family:'FujitsuInfinityPro'; } .hs-rss-author { opacity: 1; font-size: 1.1em !important; } .hs-rss-item.hs-with-featured-image .hs-rss-item-text { position: absolute; width: 100% !important; bottom: 0; background: rgba(0,0,0,.7); font-size: 18px; padding: 1em; transition: bottom .3s,background .3s,height .3s; height: 120px; left: 0; padding-top:10px; } .hs-rss-item.hs-with-featured-image:hover .hs-rss-item-text { background: rgba(255,128,0,.9); height: 100%; color:#000000; } .hs-rss-item.hs-with-featured-image:hover .hs-rss-item-text .hs-rss-description { opacity: 1; visibility: visible; display: block; } .hs-rss-item.hs-with-featured-image .hs-rss-item-text a { color:#FFFFFF;} .hs-rss-item.hs-with-featured-image .hs-rss-byline {color:#FFFFFF;opacity: 1; font-style: italic; } .hs-rss-title { font-size: 0.9em; } .hs-rss-item.hs-with-featured-image:hover .hs-rss-item-text .hs-rss-title { margin-bottom:10px; display:block;} .hs-rss-item.hs-with-featured-image .hs-rss-item-text:hover a { color: #000000;} .hs-rss-item.hs-with-featured-image .hs-rss-item-text:hover .hs-rss-byline { color: #000000;} .section.post-body table td:before { display:none; } .section.post-body table td { padding: 8px 10px; overflow: hidden; } .table-style table td:before { display: none !important; } .table-style table td { display: table-cell !important; } .table-style table td { padding: 10px 15px; overflow: hidden; } .table-style table td:first-child { width: 20%; } .section.post-body table td p { margin-bottom: 0; } .section.post-body table td p + p { margin-top: 5px; } /* (Marcelo 11-01-23) Initially added for Tim's blog post 'Making Postgres management easier with Dbeaver' */ .section.post-body table tr:nth-child(even), .table-style table tr:nth-child(even) {background: #f1f2f2} .section.post-body table tr:nth-child(odd), .table-style table tr:nth-child(odd) {background: #e6e7e8} /* .blog-main-details { background: #e6e7e8; padding: 10px; } .blog-subhead { padding: 1.5em 1em; } .blog-subhead h2 { font-size: 26px; color: #333132 !important; } */ .trunk-content .blog-main-details { display: none; } .bckimg { background-repeat: no-repeat!important; background-position: right top!important; background-size: 800px auto!important; } .bckimageurl img { display: none; } /* Blog Post Theme 2017 */ span.icon-infinity { background: url(https://2585850.fs1.hubspotusercontent-na1.net/hubfs/2585850/Images/Logos/logo-infinity-symbol-on-transparent.png) no-repeat center center; display: inline-block; background-size: 100%; width: 38px; margin-right: 10px; } ul.red-list { list-style: none; margin: 0; padding: 0; margin-bottom: 1em; } ul.red-list li { margin-bottom: 6px; } ul.red-list li:before { content: "\25a0"; color: #EA0000; font-size: 20px; padding-right:4px; } span.big-no { display: inline-block; font-size: 40px; width: 35px; vertical-align: top; } span.no-details { display: inline-block; width: 82%; } .img-shadow-curve { -webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.5); -moz-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.5); box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.5); border-radius:9px; margin-bottom: 8px !important; } span.photo-desc { background: #f5f5f5; text-align: center; display: block; padding: 10px; border-radius: 6px; } .section.post-body .auto-width td { width: auto; } .code-script h6 { font-size: 18px; margin-top: 20px; } span.tab1 { width: 10px; display: inline-block; } span.tab2 { width: 30px; display: inline-block; } span.monospace, span.monospace * { font-family: monospace !important; font-size: 95%; } span.mono, span.mono * { font-family: monospace !important; font-size: 95%; } span.placeholder { font-style: oblique; color: #F75100; } .trunk-content span.placeholder { color: #2400B0; } .pzone-content span.placeholder { color: #2400B0; } span.placeholder-non-coloured { font-style: oblique; } span.continuous { white-space: pre; } .show-syntax { background-color: #f0f0f0; border: 1px dotted #909090; padding: 1px 4px 2px 4px; margin: 0px 5px; } .show-syntax-hlight-red-lighter { background-color: #FFCCCC; border: 1px dotted #909090; padding-left: 2px; padding-right: 2px; } .show-syntax-hlight-yellow { background-color: #FFFF00; border: 1px dotted #909090; padding-left: 2px; padding-right: 2px; } .fujitsublog-template.fblogv2.fuji-template .show-syntax { border: 1px dashed #808080; font-size: 85%; display: inline-block;} .section.post-body table.simple-table tr { background: transparent; } a .section.post-body table.simple-table tr td { padding: 0; } .simple-table th { text-align: left; font-weight: normal; } .colspan-full { width: 100% !important } @media(max-width:1300px){ .slider-bg ul.hs_cos_flex-slides li { height: 450px !important; } } @media(max-width:1200px){ .slider-bg ul.hs_cos_flex-slides li { height: 450px !important; } body .bg-img-wrap.card-wrap { height:400px; } } @media(max-width:991px) { body .slider-bg ul.hs_cos_flex-slides li { height: 450px !important; } body .bg-img-wrap.card-wrap { height:340px; } } @media(max-width:767px) { body .slider-bg ul.hs_cos_flex-slides li { height: 430px !important; } body .bg-img-wrap.card-wrap { height:400px; } body .span3.widget-span.widget-type-cell.card-wrap.bg-img-wrap.thumb-card { height:200px; } } @media(max-width:480px) { body .slider-bg ul.hs_cos_flex-slides li { height: 500px !important; } } @media only screen and (max-width: 1850px) { .bckimg { background-size: 750px auto !important; } } @media only screen and (max-width: 1730px) { .bckimg { background-size: 700px auto !important; } } @media only screen and (max-width: 1630px) { .bckimg { background-size: 550px auto !important; } } @media only screen and (max-width: 1429px) { .bckimg { background-image: 500px auto !important; } .bckimageurl img { padding-top: 60px; display: none; } } @media only screen and (max-width: 1160px) { .bckimg { background-image: none !important; } .bckimageurl img { padding-top: 60px; display: block; } } @media only screen and (max-width:1024px) { .fujitsublog-template.fblogv2 .hs-blog-header { width:100% !important; padding-top:1em; left:0 } .back-homeblog { position:relative !important; top:0em !important; margin-bottom:0px} .fujitsublog-template.fblogv2.fuji-template .hero-banner { height: auto; min-height: 300px; padding-bottom: 20px; } } /*@media(max-width:1390px) { .fujitsublog-template.fblogv2.fuji-template .callout-headline { padding-left: 4em; } } @media(max-width:1110px) { .fujitsublog-template.fblogv2.fuji-template .callout-headline { padding-left: 7em; } } */ @media only screen and (max-width:768px) { .three-col .hs-rss-item.hs-with-featured-image { width: 100%; float: none; display: inline-block; height:auto; min-height: 260px; } } @media only screen and (max-width:768px) { .four-col .hs-rss-item.hs-with-featured-image { width: 100%; float: none; display: inline-block; height:auto; min-height: 260px; } } @media only screen and (max-width:767px) { .pad-mob { padding: 40px 0px 10px 0px !important;} .pad-top0-mob { padding-top:0;} .span4.author-details * { font-size: inherit !important; } .span4.author-details { text-align: left; padding-top: 10px; } /* .fujitsublog-template.fblogv2 .hero-banner { height: auto; padding-top: 2em; } */ .fujitsublog-template.fblogv2 .hs-blog-header { position: relative; display:inline-block; bottom:-2em } .post-body.fastblog-innerbody span div :not(.imgslider-img.prevnext,.prevnext-button, .imgslider-txt, .em-link-icon,.em-example-icon, .em-note-icon, .keep-float, .blog-curtain-author-img img, .card-collateral-bkg-video, .card-collateral-blurb-img, .card-collateral-blurb-cta, list-ind-lvl-1, list-ind-lvl-1, p.blog-toc-inner-heading, p.blog-toc-inner-lvl-1, p.blog-toc-inner-lvl-2, .responsive-img-and-code-right-side, .responsive-code-and-img-right-side) { width: auto; float: none !important; } .post-body.fastblog-innerbody img :not(.card-collateral-blurb-img) { width: auto; float: none !important; margin-left: auto !important; margin-right: auto !important; } /* (Marcelo 13-07-21) Added 'margin' setting to center images on narrow viewports (changed during creation of blog 'FUJITSU Enterprise Postgres with SUSE on IBM LinuxONE') */ /* .post-body.fastblog-innerbody img { margin: 0 !important; width: auto !important; float: none !important; } (Marcelo 11-12-19: Commented out) */ .post-body.fastblog-innerbody span div.code-script { margin-bottom: 20px !important; } span.photo-desc { margin-bottom:16px;} .dg-img { position:relative} .dg-fwrap { float:none !important} .callout-headline { padding-left: 1em !important; } /* (Marcelo 17-01-23 */ .fujitsublog-template.fblogv2.fuji-template.hs-blog-listing .callout-headline { padding-top:0.9em;} .blog-img-float { max-width: 100% !important; margin-top: 20px !important; } } @media(max-width:640px) { .fujitsublog-template.fblogv2.fuji-template .callout-headline { margin-top: 2em; } } /* (Marcelo 23-11-21) margin-top will be set again in media query for mobile portrait */ /* One Line Inputs */ body input[type="text"], body input[type="password"], body input[type="datetime"], body input[type="datetime-local"], body input[type="date"], body input[type="month"], body input[type="time"], body input[type="week"], body input[type="number"], body input[type="email"], body input[type="url"], body input[type="search"], body input[type="tel"], body input[type="color"],body input[type="file"],body textarea, body select { width: 95%; font-family: Fujitsu Infinity Pro; font-size: 20px; } /* (Marcelo 17-09-21) Added FujitsuInfinityPro 'Technical feedback' page */ /* (Marcelo 17-12-20) Changed widht from '* 100%" to '90%', because I added margin-left for form 'AuthConductor Technical Evaluation' and 'Technical Services - Customer Satisfaction Survey', and as a result form such as the one in 'Services Overview' were overflowing right border */ /* Multiple Selection Inputs */ body form.hs-form .hs-form-field ul.inputs-list { list-style: none !important; padding: 0; margin: 10px; } body form.hs-form .hs-form-field ul.inputs-list li { list-style: none !important} /* (Marcelo 31-01-22) Added otherwise check boxes in forms inside class .uvance* show list-style disc */ /* Blog Subscription Form */ #hs_form_target_blog_subscription input[type="radio"], #hs_form_target_blog_subscription input[type="checkbox"] { width: auto; margin-right: 10px; } /* Multi Column Form */ body .hs-form { font-family: 'FujitsuInfinityPro'; } /* (Marcelo 30-08-21) Added this line */ body .hs-form h3 { margin-top: 0px; } /* ()M'; } .cta-red-orange-border:hover { background: #f0f0f0; } .cta-red-orange-border:hover a { color: #F75100; } .cta-blue-border { border: 3px solid #2400B0 !important; padding:5px !important; max-width: fit-content; } .cta-blue-border a { color: #000000; } .cta-blue-border a:after { content: ' >'; } .cta-blue-border:hover { background: #f0f0f0; } .cta-blue-border:hover a { color: #2400B0; } .cta-blue { background-color: #2400B0 !important; color: #FFFFFF !important; border: 1px solid #FFFFFF !important; font-size:14px !important; padding:5px !important; } .cta-blue:hover { background-color: #00E7EF !important; color: #2400B0 !important;} .cta-cyan { background-color: #00E7EF !important; color: #000000 !important; border: 1px solid #FFFFFF !important; font-size:14px !important; padding:5px !important; } .cta-cyan:hover { background-color: #2400B0 !important; color: #FFFFFF !important;} .cta-emerald { background-color: #008224 !important; color: #FFFFFF !important; border: 1px solid #FFFFFF !important; font-size:14px !important; padding:5px !important; } .cta-emerald:hover { background-color: #BAFFB3 !important; color: #008224 !important;} .cta-emerald-border { background-color: #FFFFFF !important; color: #008224 !important; border: 1px solid #008224 !important; font-size:14px !important; padding:5px !important; } .cta-emerald-border:hover { background-color: #008224 !important; color: #FFFFFF !important; } .cta-magenta { background-color: #D80084 !important; color: #FFFFFF !important; border: 1px solid #FFFFFF !important; font-size:14px !important; padding:5px !important; } /* (Marcelo 25-03-22) Initially created for webpage 'Trial download' */ .cta-magenta:hover { background-color: #FFFFFF !important; color: #D80084 !important; border: 1px solid #D80084 !important; } .cta-orange { background-color: #F75100 !important; color: #FFFFFF !important; border: 1px solid #FFFFFF !important; font-size:14px !important; padding:5px !important; } .cta-orange:hover { background-color: #FFE700 !important; color: #F75100 !important;} .cta-orange-border { background-color: #FFFFFF !important; color: #000000 !important; border: 1px solid #FF8000 !important; font-size:14px !important; padding:5px !important; } .cta-orange-border:hover { background-color: #FF8000 !important; color: #FFFFFF !important; } .cta-red { background-color: #EA0000 !important; color: #FFFFFF !important; border: 1px solid #FFFFFF !important; font-size:14px !important; padding:5px !important; } .cta-red:hover { background-color: #D80084 !important; color: #FFFFFF !important;} button { font-family: FujitsuInfinityProBold; } /* (Marcelo 24-05-24) Initially created for webpage 'Blog subscription - Thank you page */ .cta-centered { display:block; margin: 50px auto !important; } /* (Marcelo 24-05-24) Initially created for webpage 'Blog subscription - Thank you page */ .cta-large { font-size: 1em !important; padding: 15px 30px !important; } .cta-inline-blue { background-color: #2400B0; color: #FFFFFF; margin-left: 10px; padding: 3px 5px; white-space: pre;} /* (Marcelo 01-06-23) Initially created for homepage refresh */ .cta-inline-cyan-02 { background-color: #04A49E; color: #FFFFFF; margin-left: 10px; padding: 3px 5px; white-space: pre;} /* (Marcelo 20-01-23) Initially created for homepage refresh */ .cta-inline-black { background-color: #000000; color: #FFFFFF; margin-left: 10px; padding: 3px 5px; white-space: pre;} /* (Marcelo 20-01-23) Initially created for homepage refresh */ /* 7. MISCELLANEOUS *//* Styles that do not fit into available sections above can go here. For example, one would place 3rd party plugin overriding styles here. */ /* This section is NOT for 'Custom' styles. All custom styles must go in the proper sections above. For instance, custom header and footer styles must go in the HEADER and FOOTER sections. Custom styles for anything in-between the header and footer (such as, styles that are unique to the HOMEPAGE only), must go in the CONTENT section.*/ /* 'Fujitsu Technical Support' webpage - Tabs and filter box */ /* Scroll -then-fix filter box - used in 'Fujitsu Technical Support' webpage - copied from PRIMEWEB */ .scroll-then-fix-res-patches-main-div { position: relative !important; overflow: auto !important; align-items: center; font-family: FujitsuInfinityPro !important; } .scroll-then-fix-res-patches-fixable-div { z-index: 100000; background-color: #FFFFFF; width: 100% !important; } .scroll-then-fix-res-patches-fixable-div-fixed { position: fixed !important; top: 55px !important; z-index: 100000; width: 100% !important; background: #FFFFFF; } .scroll-then-fix-res-patches-top-nav {margin: 0px auto;display: inline-block;border-radius: 3px;padding: 4px;border: 1px solid #FFFFFF;font-size: 18px;box-shadow: 3px 3px 3px 0px #C0C0C0;background-color: #F3F3F3;border: 1px solid #a0a0a0;} .scroll-then-fix-res-patches-top-nav:hover { box-shadow: 3px 3px 3px 0px #404040; } ul.tabs-res-patches { margin: 0px !important;;padding: 0px;list-style: none;position:relative;width: 100%;background-color: #FFFFFF;border-bottom: 4px solid #FF8000;} /* We specify width and background to oclude list scrolling behind the tabs */ ul.tabs-res-patches li { display: inline-block; position: relative; z-index: 1; color: #FFFFFF; font-size: 16px !important; padding: 10px 10px 10px 5px ; cursor: default; font-size: 18px; } ul.tabs-res-patches.vertical li { width:100%;} ul.tabs-res-patches li:hover { border-top-style: solid; border-top-width: 0px; border-top-left-radius: 6px; border-top-right-radius: 6px; transform: translateY(0px); border-top-color: #FFa120; background-color: #FFa120; color: #000000; } ul.tabs-res-patches li.current { border-top-style: solid; border-top-width: 0px; border-top-left-radius: 6px; border-top-right-radius: 6px; transform: translateY(0px); border-top-color: #FF8000; } .tab-res-patches-content { display: none; padding: 2em; padding-top: 0.25em; } .tab-res-patches-content { display: none; padding: 0px; padding-top: 10px; } .tab-res-patches-content h3, .tab-res-patches-content p, .tab-res-patches-content table { font-size:19px; } /* We need to set table font-size, otherwise it inherits size the in .tab-res-patches-content */ .tab-res-patches-content a { text-decoration:underline;} .tab-res-patches-content.current { display: block; } .tab-res-patches-link { background-color: #4E4E56; border-top-color: #FF8000; transform: translateY(-1px); margin-top: 5px; } .tab-res-patches-link.current { background-color: #FF8000 !important; color: #000000; font-family: FujitsuInfinityProBold; } .tab-res-patches-content-wrap { background-color: #FAFCFB; } .tabs-res-patches-ul-fixed {position: fixed !important;top: 0px !important;z-index: 100000;} /* (Marcelo 12-10-21) margintop is overridden in the Settings tab for 'Client download' */ @media(max-width:1108px) { .scroll-then-fix-res-patches-fixable-div-fixed { top: 95px !important; left: 10px; } .fast-res-filter { font-size: 75%; } } @media(max-width: 571px) { .scroll-then-fix-res-patches-fixable-div-fixed { top: 145px !important; } } /* 'Fujitsu Enterprise Postgres client - download' webpage - Tabs and filter box */ .scroll-then-fix-res-client-main-div { position: relative !important; overflow: auto !important; align-items: center; font-family: FujitsuInfinityPro !important; } .scroll-then-fix-res-client-fixable-div { position: absolute !important; top: 10px !important; padding: 10px 0px; z-index: 100000; background-color: #FFFFFF; width: 100% !important;} .scroll-then-fix-res-client-fixable-div-fixed { position: fixed !important; top: 0px !important; z-index: 100000; width: 100% !important; background: #FFFFFF; } .scroll-then-fix-res-client-top-nav { margin: 0px auto; display: inline-block; border-radius: 3px; padding: 4px; border: 1px solid #FFFFFF; font-size: 18px; box-shadow: 3px 3px 3px 0px #C0C0C0; background-color: #F3F3F3; border: 1px solid #a0a0a0;} .scroll-then-fix-res-client-top-nav:hover { box-shadow: 3px 3px 3px 0px #404040; } ul.tabs-res-client { margin: 0px; padding: 0px; list-style: none; position:relative; width: 100%; background-color: #FFFFFF; border-bottom: 4px solid #FF8000;} /* We specify width and background to oclude list scrolling behind the tabs */ .uvance-blue ul.tabs-res-client { margin: 0px; padding: 0px; list-style: none; position:relative; width: 100%; background-color: #FFFFFF; border-bottom: 4px solid #2400B0;} ul.tabs-res-client li { display: inline-block; position: relative; z-index: 1; color: #FFFFFF; padding: 10px 10px 10px 5px ; cursor: default; font-size: 18px; font-family: FujitsuInfinityPro !important; } ul.tabs-res-client.vertical li { width:100%;} ul.tabs-res-client li:hover { text-shadow: 3px 4px 5px #000000; border-top-style: solid; border-top-width: 0px; border-top-left-radius: 6px; border-top-right-radius: 6px; transform: translateY(0px); border-top-color: #DA635D; background-color: #DA635D; } .uvance-blue ul.tabs-res-client li:hover { text-shadow: 3px 4px 5px #000000; border-top-style: solid; border-top-width: 0px; border-top-left-radius: 6px; border-top-right-radius: 6px; transform: translateY(0px); border-top-color: #00E7EF; background-color: #00E7EF; } ul.tabs-res-client li.current { text-shadow: 3px 4px 5px #000000; border-top-style: solid; border-top-width: 0px; border-top-left-radius: 6px; border-top-right-radius: 6px; transform: translateY(0px); border-top-color: #A5312D; } .tab-res-client-content { display: none; padding: 2em; padding-top: 0.25em; } .tab-res-client-content { display: none; padding: 0px; padding-top: 30px; } .tab-res-client-content h3, .tab-res-client-content p, .tab-res-client-content table { font-size:20px; } /* We need to set table font-size, otherwise it inherits size the in .tab-res-client-content */ .tab-res-client-content a { text-decoration:underline;} .tab-res-client-content.current { display: block; } .tab-res-client-link { background-color: #4E4E56; border-top-color: #FF8000; transform: translateY(-1px); margin-top: 5px; } .uvance-blue .tab-res-client-link { background-color: #7D5DFF; border-top-color: #2400B0; transform: translateY(-1px); margin-top: 5px; } .tab-res-client-link.current { background-color: #FF8000 !important; } .uvance-blue .tab-res-client-link.current { background-color: #2400B0 !important; } .tab-res-client-content-wrap { background-color: #FAFCFB; } .tabs-res-client-ul-fixed { position: fixed !important; top: 105px !important; z-index: 100000; } /* (Marcelo 12-10-21) margintop is overridden in the Settings tab for 'Client download' */ @media(max-width:990px) { ul.tabs-res-client li { font-size: 16px; } } @media(max-width:600px) { .tabs-res-client-ul-fixed { top: 103px !important; } } @media(max-width:504px) { .tabs-res-client-ul-fixed { top: 124px !important; } } /* (Marcelo 29-12-20) ul.tabs, tab-content, etc. are being used by webpage 'Compare versions' */ .tabs-compare li { background-color: #4E4E56; border-top-color: #4E4E56; transform: translateY(-1px); } .tabs-compare li.current { background-color: #F75100; border-top-color: #F75100; transform: translateY(-1px); } .tab-compare-content-wrap { background-color: #F75100; } ul.tabs-compare { margin: 0px !important; padding: 0px; list-style: none; position:relative; } ul.tabs-compare li { display: inline-block; color: #FFFFFF; margin-top: 10px; padding: 10px 10px 10px 5px; cursor: default; font-size: 16px; } ul.tabs-compare.vertical li { width:100%;} ul.tabs-compare li:hover { text-shadow: 3px 4px 5px #000000; border-top-style: solid; border-top-width: 3px; border-top-left-radius: 8px; border-top-right-radius: 8px; transform: translateY(0px);} ul.tabs-compare li.current { text-shadow: 3px 4px 5px #000000; border-top-style: solid; border-top-width: 3px; border-top-left-radius: 8px; border-top-right-radius: 8px; transform: translateY(0px);} .tab-compare-content { display: none; padding: 0px; padding-top: 30px; } .tab-compare-content h3, .tab-compare-content p { font-size:20px; } .tab-compare-content a { text-decoration:underline;} .tab-compare-content.current { display: block; } .tab-compare-content ul, .tab-compare-content ul li, .tab-compare-content ul li:before, .tabs-compare img { max-width: 25px; margin-right: 5px; vertical-align: middle; } .tab-compare-content { border-top-right-radius: 6px; } .table-compare-versions { margin: 0px 10px; border-radius: 6px; border-top-right-radius: 16px; } .table-compare-versions td { border-color: white !important; border-bottom: 1px solid #a0a0a0 !important; } .table-compare-versions .tb-head { height: 33px; } .table-compare-versions .tb-head td { font-size:15px !important; text-align:center;background-color: #F75100;color: #FFFFFF;} .table-compare-versions .fa-question-circle { color: #B1B1B1; } .table-compare-versions .fa-times-circle, .table-compare-versions .fa-check-circle { font-size: 20px !important; } .table-compare-versions td { border: 1px solid #C3C3C3; padding: 10px 12px; font-size: 15px; background-color: #FFFFFF; } .table-compare-versions .col-feature { border-right: 1px solid #FFFFFF; text-align: left !important;} .table-compare-versions .col-icons { padding-left: 0px; padding-right: 5px; white-space: nowrap; } .table-compare-versions .col-icons img { height: 20px; } .table-compare-versions img { vertical-align: middle; } .feature-link-icon { height: 12px; margin-left: 3px; margin-bottom: 5px; content: url('https://www.postgresql.fastware.com/hubfs/Images/Pictograms/picto-chevron-01-orange.svg'); } .table-compare-versions .tb-head .feature-link-icon { height: 12px; margin-left: 3px; margin-bottom: 5px; content: url('https://www.postgresql.fastware.com/hubfs/Images/Pictograms/picto-chevron-01-white.svg'); } /*-Old version of 'Compare versions classes - DELETE AFTER 01-APR-2022 -*/ ul.tabs { margin: 0px; padding: 0px; list-style: none; position:relative; } ul.tabs li { display: inline-block; position: relative; z-index: 1; color: #FFFFFF; padding: 10px 10px 10px 5px ; cursor: default; font-size: 16px; } ul.tabs.vertical li { width:100%;} ul.tabs li:hover { text-shadow: 3px 4px 5px #000000; border-top-style: solid; border-top-width: 3px; border-top-left-radius: 6px; border-top-right-radius: 6px; transform: translateY(0px);} ul.tabs li.current { text-shadow: 3px 4px 5px #000000; border-top-style: solid; border-top-width: 3px; border-top-left-radius: 6px; border-top-right-radius: 6px; transform: translateY(0px);} .tab-content { display: none; padding: 2em; padding-top: 0.25em; font-size: 1.1em; } .tab-content { display: none; padding: 0px; padding-top: 30px; } .tab-content h3, .tab-content p { font-size:20px; } .tab-content a { text-decoration:underline;} .tab-content.current { display: block; } .tab-content ul, ul.red-bullet { padding-left:0;} .tab-content ul li, ul.red-bullet li { position:relative; padding-left: 1.5em; } .tab-content ul li:before, ul.red-bullet li:before { content: "\25a0"; font-family:"Arial Black"; color: #EA0000; padding-right: 1em; position:absolute; left:0; top:-4px; } .tabs img { vertical-align: middle; } .tab-content { border-top-right-radius: 6px; } .tabs .tab-all { background-color: #44546A; border-top-color: #44546A; transform: translateY(-1px); } .tabs .tab-security { background-color: #FF4C4A; border-top-color: #FF4C4A; transform: translateY(-1px); } .tabs .tab-performance { background-color: #1D9B8C; border-top-color: #1D9B8C; transform: translateY(-1px); } .tabs .tab-ha { background-color: #FB8734; border-top-color: #FB8734; transform: translateY(-1px); } .tabs .tab-devops { background-color: #0087B1; border-top-color: #0087B1; transform: translateY(-1px); } .tabs .tab-ease { background-color: #7A3B69; border-top-color: #7A3B69; transform: translateY(-1px); } .tab-content-wrap .tab-all { background-color: #44546A; } .tab-content-wrap .tab-security { background-color: #FF4C4A; } .tab-content-wrap .tab-performance { background-color: #1D9B8C; } .tab-content-wrap .tab-ha { background-color: #FB8734; } .tab-content-wrap .tab-devops { background-color: #0087B1; } .tab-content-wrap .tab-ease { background-color: #7A3B69; } @media(max-width:1500px) { ul.tabs li { font-size: 16px; } } @media(max-width:1320px) { ul.tabs li img { width: 20px !important; } } /* (Marcelo 29-05-21) These classes (.multi-options-*) were add for page 'Register for FEP Solution Update session', but their names and functionality were kept generate to allow reuse */ .multi-options-list-div { display: inline-block; width: 100%; font-family: FujitsuInfinityPro !important; font-size: 90% } .multi-options-show-selected { display: inline-block; } .multi-options-list-options { display: inline-block; float: right; } .multi-options-option:hover { border: 1px solid #404040; box-shadow: 3px 5px 4px #808080; } .multi-options-content { display: none; } .multi-options-option.is-selected { border: 1px solid #404040; box-shadow: 3px 5px 4px #808080; } .multi-options-content.is-selected { display: block; } /* Classes for 'Compare versions' table */ .table-compare-versions { margin: 0px 10px; border-radius: 6px; border-top-right-radius: 16px; } .table-compare-versions td { border-color: white !important; border-bottom: 1px solid #a0a0a0 !important; } .table-compare-versions .tb-head { height: 33px; } .table-compare-versions .tb-head td { font-size:15px !important; text-align:center;background-color: rgba(255, 255, 255, .15);color: #FFFFFF;} .table-compare-versions .fa-times-circle { color: #C30606; } .table-compare-versions .fa-check-circle { color: #0DAD0D; } .table-compare-versions .fa-question-circle { color: #B1B1B1; } .table-compare-versions .fa-times-circle, .table-compare-versions .fa-check-circle { font-size: 20px !important; } .table-compare-versions td { border: 1px solid #C3C3C3; padding: 10px 12px; font-size: 15px; background-color: #FFFFFF; } .feature-desc { font-size: 90% !important; margin-left: 1em; } /* (Marcelo 30-09-20) Added to be used in the 'Compare versions' webpage */ .table-compare-versions .col-feature { border-right: 1px solid #FFFFFF; text-align: left !important;} .table-compare-versions .col-icons { padding-left: 0px; padding-right: 5px; white-space: nowrap; } .table-compare-versions .col-icons img { height: 23px;} .table-compare-versions img { vertical-align: middle; } .feature-link-icon { height: 12px; margin-left: 3px; margin-bottom: 5px; content: url('https://www.postgresql.fastware.com/hubfs/Images/Pictograms/picto-chevron-01-orange.svg'); } .table-compare-versions .tb-head .feature-link-icon { height: 12px; margin-left: 3px; margin-bottom: 5px; content: url('https://www.postgresql.fastware.com/hubfs/Images/Pictograms/picto-chevron-01-white.svg'); } @media(max-width:976px) { .table-compare-versions .col-icons .tooltipfast { display: block; margin-bottom: 5px;} } @media(max-width:640px) { .table-compare-versions .col-icons img { max-width: unset !important;} } .feature-table { margin: 0px 10px; border-radius: 6px; border-top-right-radius: 16px; } .feature-table td { border-color: white !important; border-bottom: 1px solid #a0a0a0 !important; } .feature-table .tb-head { height: 33px; } .feature-table .tb-head td { font-size:15px !important; text-align:center;background-color: rgba(255, 255, 255, .15);color: #FFFFFF;} .feature-table .fa-times-circle { color: #C30606; } .feature-table .fa-check-circle { color: #0DAD0D; } .feature-table .fa-question-circle { color: #B1B1B1; } .feature-table .fa-times-circle, .feature-table .fa-check-circle { font-size: 20px !important; } .feature-table td { border: 1px solid #C3C3C3; padding: 10px 12px; font-size: 15px; background-color: #FFFFFF; } .feature-desc { font-size: 90% !important; margin-left: 1em; } /* (Marcelo 30-09-20) Added to be used in the 'Compare versions' webpage */ .feature-table .col-feature { border-right: 1px solid #FFFFFF; text-align: left !important;} .feature-table .col-icons { padding-left: 0px; padding-right: 5px; white-space: nowrap; } .feature-table img { vertical-align: middle; } @media(max-width:1330px) { .feature-table .fa-question-circle { font-size: 14px !important; } .feature-table td, .feature-table .tb-head td { font-size:14px !important; padding:10px} .feature-table .col-icons img { width: 20px; } } @media(max-width:1175px) { .feature-table .tb-head td { white-space: normal !important; } .feature-table .tb-head td img { display: none; } .feature-table .col-icons { white-space: normal;} } @media(max-width:1000px) { .feature-table { margin: 4px; } } @media(max-width:800px) { .feature-table { width: 720px; } } a#cta_button_2585850_5d5638dd-641e-4cf9-b534-57756b517fe0 { display:inline-block} .hs-search-results__next-page { float: unset; } /* MOBILE MEDIA QUERIES */ @media only screen and (max-width: 1350px ) { .denotes { position: relative; bottom: 9px; right: 0; } .denotes p { margin-top: 30px; } } /* RESPONSIVE - mobile first - */ @media only screen and (max-width:480px ) { .section.post-body table { min-width:100% !important; } .section.post-body table .blank-td { display:none; } .course-wrap .row-number-2 { text-align: center; } } @media only screen and (max-width:500px ) { .product-menu ul { margin-bottom:10px; } .product-menu ul li { display:block; width:100%; border-bottom:1px solid #c1bdb1 } .product-menu ul li:last-child { border:0} .product-menu ul li:hover a { background:transparent} .product-menu ul li a { padding:0; width:100%; display:inline-block} .red-callout h2 { padding:0.3em;} .slider-bg ul.hs_cos_flex-slides li { height:600px !important;} .fuji-slider h2 { font-size:24px;} .fuji-slider p { font-size:20px; line-height:1.3em;} } @media only screen and (max-width:375px ) { body img.showOnMobile { height: 200px !important; width: 100% !important; display: block !important; position: absolute; top: 0px; left: 0px; } } @media only screen and (max-width: 640px) { /* Mobile portrait media query */ /* 40em ~= 640px */ img:not(ul.keep-float img, .card-info-sections-icon, .responsive-manual-version-badge, .html-manual-set-title img, #fuj_submit img,.sliding-banner-02-logo img ,.announc-badge, .announc-part-1 img, .homepage-contact-us img,.responsive-manual-card-image,.form-field-heading-icon, .responsive-resource-card-image,.div-resource-wrapper-img,.in-page-style-dgm-swap-src-on-narrow-viewport,.tab-link img,.fast-eula-badge,.doc-page img, .keep-float, .mod-cheat-sheet-text img, .picto-calendar, .announc-col2 img, .announc-col3 img) { float: none !important;margin-left:auto !important;margin-right: auto!important;max-width: 100% !important;} .trunk-content,.trunk-post { font-size: 0.9em; } .pzone-content,.pzone-post { font-size: 0.9em; } .homepage-contact-us img {max-width: 50% !important;} .width-50 { width:100% !important;} .hs-rss-item { width: 100%; float:none;} .pad-r-1, .mar-r-1 , .mar-l-1 { padding-right:0; margin-right:0; margin-left:0} .pad-t1-mob { padding-top:1em;} h1, h1 * {font-size:2rem;} /* h2, h2 * { font-size: 1.8rem !important; } (Marcelo 13-04-20) Commented - it was overriding other !important setting in portion in blog announcing FEP om IBMz LinuxONE */ /* p, * { font-size:1.2rem; } */ /* (Marcelo 29-08-19) Commented - it was overriding other !important setting in code-script */ .sec-body p, .fuji-footer * { font-size:inherit;} .sec-padding-lg { padding:2.5em 0;} .fuji-footer * { font-size: 16px; } .list-inline.black.pad-bot-1-mob { padding-bottom: 5px !important;} .footer-menu .hs-menu-wrapper, .footer-menu .hs-menu-wrapper * { width: 100%; text-align: left !important; } .fuji-footer li { float: none !important; text-align: left; border-bottom: 1px solid #808080;} .footer-copyright-info .pad-bot-1-mob { padding-bottom: 5px !important;} .footer-copyright-info .pad-bot-1-mob p { padding-bottom: 0px !important; margin-bottom: 0px; } .footer-menu { padding: 10px; } .align-center-mob, .align-center-mob * { text-align: left !important;} .fuji-footer .list-inline li { display: block; } .align-right, .align-left { text-align:center;} /*a#cta_button_2585850_5d5638dd-641e-4cf9-b534-57756b517fe0 {float: left;margin-top: 0 !important;margin-left:1em;} */ /* (Marcelo 02-01-23 Commented line) */ .span6.logo-mob { text-align:center; margin-bottom:10px; } .hidden-mob { display:none !important;} .span3.widget-span { width:98% !important; margin-left:0 !important; } .pad-1 { padding:10px;} .pad-topbot-5 { padding:2em 0;} c.red-callout { top:1em; background:none; margin-right: 0em; left: 0 !important; margin-left: 1em !important; background-color:#EA0000; } .ibm-tss .red-callout { top:1em; background:none; margin-right: 0em; left: 0 !important; margin-left: 1em !important; } /* (Marcelo 05-09-21 */) .kb-article .red-callout { top:1em; background:none; margin-right: 0em; left: 0 !important; margin-left: 1em !important; } /* (Marcelo 24-09-21 */) .supp-patch .red-callout { top:1em; background:none; margin-right: 0em; left: 0 !important; margin-left: 1em !important; } /* (Marcelo 05-09-21 */) .red-callout.hide-when-viewport-narrow {display: none !important;} /* (Marcelo 09-10-20) Added to hide callout 'Fastest...' in banner with IBM quote */ .red-callout h2 { width: 100% !important; height: auto; display: inline-block; padding: 0.5em; margin-bottom: 0; } /* (Marcelo 08-06-22) Added '!important' to 'width' setting here and in lines below, because otherwise it remains 450px on narrow viewports and text does not flow comfortably */ .ibm-tss .red-callout h2 { width: 100% !important; height: auto; display: inline-block; padding: 0.5em; margin-bottom: 0; color: #FFFFFF; text-shadow: -1px -1px 0px #000, 1px -1px 0px #000, -1px 1px 0px #000, 1px 1px 0px #000; background-color: rgba(0,129,47,0.7); } /* (Marcelo 05-09-21) */ .kb-article .red-callout h2 { width: 100% !important; height: auto; display: inline-block; padding: 0.5em; margin-bottom: 0; color: #000000; text-shadow: -1px -1px 1px #FFF, 1px -1px 1px #FFF, -1px 1px 1px #FFF, 1px 1px 1px #FFF; } /* (Marcelo 05-09-21) */ .primeweb .red-callout h2 { width: 100% !important; height: auto; display: inline-block; padding: 0.5em; margin-bottom: 0; color: #B14239; text-shadow: -1px -1px 1px #FFF, 1px -1px 1px #FFF, -1px 1px 1px #FFF, 1px 1px 1px #FFF; } /* (Marcelo 26-09-21) */ .supp-patch .red-callout h2 { width: 100% !important; height: auto; display: inline-block; padding: 0.5em; margin-bottom: 0; color: #FFFFFF; text-shadow: -1px -1px 0px #000, 1px -1px 0px #000, -1px 1px 0px #000, 1px 1px 0px #000; background-color: rgba(0,129,47,0.7); } /* (Marcelo 05-09-21) */ .blog-post .red-callout h2 { width: 100% !important; height: auto; display: inline-block; padding: 0.5em; margin-bottom: 0; color: #FFFFFF; text-shadow: -1px -1px 1px #000, 1px -1px 1px #000, -1px 1px 1px #000, 1px 1px 1px #000;} /* (Marcelo 23-11-21) */ .blog-inner-title * { font-size: 2.0rem; } /* (Marcelo 13-01-23) */ /* .red-callout h2 br { display:none;} */ /* (Marcelo 08-06-22) Commented this line, now instead of not displaying
we replace it with space, in case use did not add space between words in
*/ .red-callout h2 br { content:' ';} /* (Marcelo 08-06-22) To replace
with spaces BOTH settings must be specified ('.red-callout h2 br' and '.red-callout h2 br:after' */ .red-callout h2 br:after { content:' ';} /* (Marcelo 08-06-22) To replace
with spaces BOTH settings must be specified ('.red-callout h2 br' and '.red-callout h2 br:after' */ .callout-inner-text { max-width: 100% !important; } /*.fujitsublog-template .red-callout { display: none !important; } */ /* (Marcelo 08-09-20) Added to hide callout 'Stay Ahead of the Curve' in blog posts wit narrow viewport, so it does not cover the woman's face (banner image: bnr-woman-holding-tablet-with-overlaid-icons.png */ .blog-content { width: 100% !important; } .fujitsublog-template .pad-topbot-2 { padding:1em 0px;} .fujitsublog-template .vertical-center.callout-headline { width: 100%; padding-top: 20px; } .fujitsublog-template .back-homeblog { display: none !important; } .fujitsublog-template.fblogv2.fuji-template .callout-headline { margin-top: 0em; } .fujitsublog-template.fblogv2.fuji-template h2 { margin: 0px;} .fujitsublog-template .callout-inner { display:flex !important; justify-content:center; } .handle-narrow-viewports.banner-callout { padding-top:1em; padding-bottom: 0.5rem; } /* (Marcelo 01-10-20) Added to distribute vertically text in hero banner in mobiles */ .uvance.banner-callout { padding-top:1em; padding-bottom: 0.5rem; } .red-callout { min-width: unset; } .handle-narrow-viewports .red-callout { background: #F3F3F388 !important; min-width: unset; text-shadow: -1px -1px 2px #000, 1px -1px 2px #000, -1px 1px 2px #000, 1px 1px 2px #000; } /* (Marcelo 26-09-20) Added to not hide banner background image in mobile phones (first used in 'FEP on IBM' main page) */ .uvance .red-callout { background: #F3F3F388 !important; min-width: unset; text-shadow: -1px -1px 2px #000, 1px -1px 2px #000, -1px 1px 2px #000, 1px 1px 2px #000; } .blog-post .red-callout { background: #F7510099 !important; min-width: unset; text-shadow: -1px -1px 2px #000, 1px -1px 2px #000, -1px 1px 2px #000, 1px 1px 2px #000; } .trunk-post .red-callout { background: unset !important; } .pzone-post .red-callout { background: unset !important; } .grd-callout .red-callout { background: #EA000099 !important; min-width: unset; text-shadow: -1px -1px 2px #000, 1px -1px 2px #000, -1px 1px 2px #000, 1px 1px 2px #000; } .grd-callout-blue .red-callout { background: #2400B099 !important; min-width: unset; text-shadow: -1px -1px 2px #000, 1px -1px 2px #000, -1px 1px 2px #000, 1px 1px 2px #000; } .grd-callout-cyan-lime .red-callout { background: #00E7EF99 !important; min-width: unset; text-shadow: -1px -1px 2px #000, 1px -1px 2px #000, -1px 1px 2px #000, 1px 1px 2px #000; } .grd-callout-emerald .red-callout { background: #00812F50 !important; min-width: unset; text-shadow: -1px -1px 2px #000, 1px -1px 2px #000, -1px 1px 2px #000, 1px 1px 2px #000; } .grd-callout-red-orange .red-callout { background: #F7510099 !important; min-width: unset; text-shadow: -1px -1px 2px #000, 1px -1px 2px #000, -1px 1px 2px #000, 1px 1px 2px #000; } .grd-callout-orange-yellow .red-callout { background: #FFE70050 !important; text-shadow: -1px -1px 2px #000, 1px -1px 2px #000, -1px 1px 2px #000, 1px 1px 2px #000; } .grd-callout-orange-yellow .red-callout h2 { color: #FFFFFF;} /* (Marcelo 28-12-22) Initially added for page 'Enhanced security for enterprises' */ .grd-callout-cyan-lime .red-callout h2 { color: #FFFFFF;} .handle-narrow-viewports .callout-headline h2 {font-size: 35px; } /* (Marcelo 26-09-20) Added to h2 resize font in mobile phones (first used in 'FEP on IBM' main page) */ .uvance .callout-headline h2 {font-size: 35px; } .fuji-slider .caption.vertical-center { left:0 !important; padding-left: 1em !important; padding-bottom: 2em; padding-right:2em; } .fuji-slider .caption { padding-top:7.5em !important;} .slider-bg ul.hs_cos_flex-slides li { height:85vh;} .fullwidth-mob { width:100% !important;} .fullwidth-mob .pad-right-4 { padding-right:0em;} .fujitsublog-template .post-item { width: 99% !important; } .fujitsublog-template .post-body { margin-bottom: 1.2em; } .fujitsublog-template .post-body, .fujitsublog-template .post-header, .fujitsublog-template .post-item-cont { min-height: 0; } .slider-bg ul.hs_cos_flex-slides li:before { position: absolute; content: ''; width: 100%; height: 100%; top: 0; left: 0; background-color: rgba(0,0,0, 0.4); } .fuji-template .cta_button { padding: 4px 6px; text-align: center; } .fuji-template #hs_cos_wrapper_module_14785645704851012 { padding-right: 0px !important; } .fujitsu-form { padding:1.2em;} .hs_recaptcha.field.hs-form-field * { min-width: 256px !important; width: 256px !important; } .fujitsu-form input[type="submit"] { padding:8px 10px;} .fujitsu-form .hs_submit { width:100%;} .fuji-template .rc-anchor-normal .rc-anchor-content { width:164px;} .fuji-template .rc-anchor-normal .rc-anchor-checkbox-label { width: 112px !important; } .fuji-template .rc-anchor-normal { width:250px !important} .vertical-center.callout-headline { left: 0em; position: relative; transform: none; padding-top: 0em; } .blog-post .vertical-center.callout-headline { left: 0em; position: relative; transform: none; padding-top: 0em; } /* (Marcelo 13-12-21) */ .ibm-tss .vertical-center.callout-headline { left: 0em; position: relative; transform: none; padding-top: 0em; } /* (Marcelo 28-08-21) */ .grd-callout .vertical-center.callout-headline { left: 0em; position: relative; transform: none; padding-top: 0em; } /* (Marcelo 17-11-21) */ .grd-callout-blue .vertical-center.callout-headline { left: 0em; position: relative; transform: none; padding-top: 0em; } /* (Marcelo 24-01-22) */ .grd-callout-cyan-lime .vertical-center.callout-headline { left: 0em; position: relative; transform: none; padding-top: 0em; } /* (Marcelo 21-04-23) */ .grd-callout-emerald .vertical-center.callout-headline { left: 0em; position: relative; transform: none; padding-top: 0em; } /* (Marcelo 19-01-22) */ .grd-callout-orange-yellow .vertical-center.callout-headline { left: 0em; position: relative; transform: none; padding-top: 0em; } /* (Marcelo 25-01-22) */ .grd-callout-red .vertical-center.callout-headline { left: 0em; position: relative; transform: none; padding-top: 0em; } /* (Marcelo 24-01-22) */ .grd-callout-red-magenta .vertical-center.callout-headline { left: 0em; position: relative; transform: none; padding-top: 0em; } .grd-callout-red-orange .vertical-center.callout-headline { left: 0em; position: relative; transform: none; padding-top: 0em; } .grd-callout-red-yellow .vertical-center.callout-headline { left: 0em; position: relative; transform: none; padding-top: 0em; } .kb-article .vertical-center.callout-headline { left: 0em; position: relative; transform: none; padding-top: 0em; text-shadow: 0px 0px; } .supp-patch .vertical-center.callout-headline { left: 0em; position: relative; transform: none; padding-top: 0em; } .kb-article .vertical-center.callout-headline h1 { color: #000000; text-shadow: -1px -1px 1px #FFF, 1px -1px 1px #FFF, -1px 1px 1px #FFF, 1px 1px 1px #FFF; background-color: rgba(255,255,255,.5); max-width: fit-content; padding: 0px 10px; } /* (Marcelo 28-08-21) */ .callout-inner .red-callout { top:0rem; } .slider-img .red-callout h2 { font-size: 24px; } .slider-img .vertical-center.callout-headline {left: 10px; position: relative; transform: none; padding-top: 2em; } .slider-img .callout-inner { padding-top: 5px; padding-left: 20px; } .code-script table.simple-table * { font-size: 12px !important; } .section.post-body .simple-table th { text-align: left; font-weight: normal; display: inline-block !important; width: 120px !important } .section.post-body table.simple-table td { display: inline-block; width: 120px !important } .simple-table-wrap { overflow-x: scroll; } .simple-table { width: 600px; overflow-x: scroll; max-width: 600px; } } @media only screen and (min-width: 640px) and (max-width: 1140px) { .slider-bg ul.hs_cos_flex-slides li { height: 36vh; } .fuji-slider .caption.vertical-center { left: 13.5em; } .red-callout { background-size: 95% !important; } /* (Marcelo 17-01-23 */ .fujitsublog-template .red-callout { background-size: 65% !important; } /* (Marcelo 17-01-23 */ .red-callout h2 { padding-right:1em; font-size: 1.3em !important;} .vertical-center.callout-headline { left: 330px !important; } /* (Marcelo 13-01-23) */ .fuji-slider h2 { font-size: 25px; } .fuji-slider p { font-size: 20px !important; line-height: 26px; width: 300px; } .slider-bg .hs_cos_flex-control-paging { bottom:0.2em;} .fullwidth-mob { width:100% !important;} a#cta_button_2585850_5d5638dd-641e-4cf9-b534-57756b517fe0 { display:inline-block} } @media only screen and (max-width: 767px) { .fujitsublog-template .vertical-center.callout-headline { left: 270px !important; } } /* (Marcelo 17-01-23) */ @media only screen and (max-width: 640px) { .fujitsublog-template .vertical-center.callout-headline { left: 0px !important; } } /* (Marcelo 17-01-23) */ @media only screen and (max-width:1140px) { .hide-if-viewport-1140px-or-less { display: none !important; } } /* (Marcelo 09-08-23) Shows/hides sidebar in blogs - initially added for Amit's blog post 'PostgreSQL 16 and beyond' */ @media only screen and (min-width:1141px) { .hide-if-viewport-more-than-1140px { display: none !important; } } /* (Marcelo 09-08-23) Shows/hides sidebar in blogs - initially added for Amit's blog post 'PostgreSQL 16 and beyond' */ @media only screen and (max-width:420px) { .fuji-slider.fwt-slider .hs_cos_flex-slides li:first-child { background-image: url(https://2585850.fs1.hubspotusercontent-na1.net/hubfs/2585850/Images/Splash/img-splash-human-centric-innovation-digital-co-creation.jpg) !important; background-position:center center !important;} } @media only screen and (min-width: 42.063em) { a#cta_button_2585850_5d5638dd-641e-4cf9-b534-57756b517fe0 { padding: 5px 5px !important; font-size: 15px; } .fuji-logo { margin-right: 20px; } } @media only screen and (max-width: 54em) { .span3.widget-span { width:98% !important; margin-left:0 !important; } .fuji-slider .caption { padding-right:1em;} .align-center-mob, .align-center-mob * { text-align:center !important;} .pad-left-0-mob { padding-left:0 !important;} .pad-bot-1-mob { padding-bottom: 1em;} .contact-aside { float:left !important; margin-top:2em;} .slider-bg ul.hs_cos_flex-slides li { background-position: 86% 0; } table.table-faq { width: inherit !important;} } @media only screen and (max-width: 500px) { /* (Marcelo 07-01-20) Definition for search results in mobile portrait mode */ .hs-search-results__featured-image img { visibility: hidden; width: 1px !important; } } @media only screen and (max-width: 976px) { /* (Marcelo 06-01-20) Original max-width value was 64.063em, since font-size is 16px, 64.063em = 1025.008px [61em ~= 976px)*/ .hs-menu-item.hs-menu-depth-1.hs-item-has-children:after { content: ''; } .fuji-slider .caption br { display:none;} .fuji-header-mob { display:block !important; } .fuji-header { display:none !important;} /*.hs-search-field__suggestions { visibility: hidden; } */ /* (Marcelo 03-01-23) This is the only place where search suggestion is actually hidden in narrow/mobile viewports */ .fuji-template .body-container-wrapper { margin-top:0px !important;} .menu-button { display: inline-block; vertical-align: top; margin-top: 0px; font-size: 25px; margin-left: 15px; color: #000; cursor:pointer } /* (Marcelo 03-01-23) */ .fuji-template .body-container-wrapper { margin-top:0;} .mobile-menu ul li { padding: 1px 1em; border-top: 1px solid #fdfdfd; font-size: 14px; } .mobile-menu ul li:hover { } .mobile-menu ul { background: #e2e2e2; } .mobile-menu ul li a { color: #000; padding: 3px 0 !important; display: block; } .mobile-menu ul li a:hover { color: #EA0000; } .mobile-logomenu-wrap .span6 {width:48%;display: inline;} .mobile-logomenu-wrap .align-right { text-align:right;} .mobile-logomenu-wrap .pad-right-1 { padding-right:0;} .span3.widget-span { width: 48%; margin-left: 0; margin: 6px; padding: 10px; } .thumb-card { text-align:center; margin-left: 0 !important; } .locations-icon * { display:none;} .contact-template .hero-banner { height:auto !important; padding-bottom:2em;} .contact-template .contact-form { position: relative; } .mar-top0-mob { margin-top:0 !important; } .contact-simple { padding-right: 0; border-right: none !important; } .contact-simple-form { padding-left: 0; } } @media only screen and (max-width: 80em) { /* 80em ~= 1280px */ .fuji-header .page-center { max-width:100%; padding:0 10px;} .fuji-header * { font-size: 10px; } .fuji-header .cta_button * { font-size: 15px; } .container-fluid .row-fluid .page-center { padding: 0px 20px; } /* (Marcelo 24-10-24) Added padding; overflow:hidden; */ .img-right { float:none !important; } .page-center {padding:0 1em;} .fuji-menu ul { margin-left:8px;} .fuji-menu li { padding: 0 10px; } .slider-bg ul.hs_cos_flex-slides li { padding-bottom:1.5em } .red-callout { } .fuji-slider .caption.vertical-center { left:13.5em; padding-bottom: 2em; } a#cta_button_2585850_5d5638dd-641e-4cf9-b534-57756b517fe0 { text-align:center; padding: 5px 5px !important; font-size: 15px; } .fujitsublog-template .post-item { width: 48%; } .span3.widget-span.widget-type-cell.card-wrap.bg-img-wrap.thumb-card { height: 30vh; margin-bottom: 1em; float: left; display: inline-block; margin-left: 0 !important; margin: 1%; } .mar-top-1-mob { margin-top:1em !important;} .mar-left-0-mob { margin-left:0px !important;} .pad-0-mob { padding:0px !important;} .fujitsu-form { padding:1em;} .fujitsu-form input[type="submit"] { max-width: 100%; width: 100%; word-wrap: initial !important; white-space: inherit; } .rc-anchor-normal { width: 250px !important; } .rc-anchor-normal .rc-anchor-content { width: 145px !important; } .rc-anchor-normal .rc-anchor-checkbox-label { width: 70px !important; } .hs_recaptcha.hs-form-field { width: 240px; overflow-x: scroll; overflow-y: hidden; } .pad-left-0-mob { padding-left:0 !important;} } @media only screen and (max-width: 50em) { .container-fluid .row-fluid .page-center { padding: 0px 5px; } /* (Marcelo 24-10-24) Added padding */ } @media only screen and (min-width: 64.063em) and (max-width: 96em) { .page-center { padding:0 2em;} /* a#cta_button_2585850_5d5638dd-641e-4cf9-b534-57756b517fe0 { padding: 5px 8px !important; font-size: 17px; } */ .mar-left-0-mob { margin-left:0px !important;} .mar-top-1-mob { margin-top:1em !important;} .pad-left-0-mob { padding-left:0 !important;} .contact-template .contact-form { position: relative; } .contact-template .hero-banner { height:auto !important; padding-bottom:2rem;} .location-pointer { display:none;} } @media only screen and (min-width: 90.063em) { } /* min-width 1441px, xlarge screens */ @media only screen and (min-width: 90.063em) and (max-width: 120em) { } /* min-width 1441px and max-width 1920px, use when QAing xlarge screen-only issues */ @media only screen and (min-width: 120.063em) { } /* min-width 1921px, xxlarge screens */ /* Hero Banner */ .hero-banner-simple { background-size: cover; background-repeat: no-repeat; background-position: center; } .hero-banner-small-image { background-size: cover; background-repeat: no-repeat; background-position: center; } .hero-banner-large.hero-banner-bg-image { position: relative; background-size: cover; background-repeat: no-repeat; background-position: center; } .hero-banner-large.hero-banner-bg-image.with-overlay:after { content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.6); } .hero-banner-large.hero-banner-bg-image.with-overlay .page-center { position: relative; z-index: 3; } @media (min-width:770px) { .hero-banner-large.hero-banner-bg-image.simple-parallax { background-attachment: fixed; } } .slick-prev, .slick-next { z-index: 10; } .hero-slider.slick-slider { position: relative; margin-bottom: 0; } .hero-slider .hero-slider-bg { position: relative; background-size: cover; background-position: center; background-repeat: no-repeat; } .hero-slider .hero-slider-bg.with-overlay:after { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: ; opacity: ; } .hero-slider .hero-slider-bg.with-overlay > * { position: relative; z-index: 2; } .hero-slider button.slick-next { right: 20px; } .hero-slider button.slick-prev { left: 20px; } .hero-slider .slick-dots { bottom: 20px; } .hero-slider .slick-dots li { width: 10px; height: 10px; padding: 0px; } .hero-slider .slick-dots li button { width: 10px; height: 10px; margin: 0px 2px; padding: 0px; } .hero-slider .slick-dots li button:before { content: ""; width: 10px; height: 10px; background: #fff; font-size: 20px; color: #fff; -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; -ms-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; } @media (min-width: 767px) and (max-width:1250px) { .container-fluid .row-fluid .hero-slider .page-center { padding-left: 45px; padding-right: 45px; } } @media( max-width:1200px) { .pad-topbot-2 { padding:2em 15px;} } @media (max-width: 767px) { .slick-prev, .slick-next { display: none!important; } } @media (max-width: 480px) { .hero-slider h1 { font-size: 40px; } } .hero-banner-video.with-overlay { position: relative; } .hero-banner-video.with-overlay:after { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: ; opacity: ; } .hero-banner-video.with-overlay > * { position: relative; z-index: 3; } .hero-banner-video video { max-width: none!important; } .hero-banner { height: auto;font-size: 20px;background-size: cover;background-position: right center;position: relative; } .hero-banner-imageless { height: 260px; } .hero-banner:before { content: ""; background: ; height: 100%; width: 100%; position: absolute; top: 0; left: 0; opacity: ; } .hero-banner .hero-image { display: none; } .hero-banner .page-center { position: relative; } .hero-content { color: #fff; } .hero-content h1 { color: #fff; text-transform: uppercase; font-size: 78px; font-weight: bold; } .hero-content a:not(.btn) {color: #fff;text-decoration: underline; } @media (min-width:768px) and (max-width:950px) { .hero-content h1 { font-size: 60px; } } @media (max-width:769px) { .hero-banner { background-attachment: initial; } .hero-content h1 { font-size: 40px; margin: 0px 0px 5px; } } /* Vertical Alignment */ .equal-heights .row-fluid-wrapper .row-fluid { display: flex; flex-wrap: wrap; } @media (min-width:768px) { .vertical-align-center > .row-fluid-wrapper > .row-fluid { -ms-flex-pack: justify; -webkit-justify-content: space-between; justify-content: space-between; -ms-flex-align: center; -webkit-align-items: center; align-items: center; display: -ms-flexbox; display: -webkit-flex; display: flex; } .vertical-align-center-2col-reverse > .row-fluid-wrapper > .row-fluid { -ms-flex-direction:row-reverse; -webkit-flex-direction:row-reverse; flex-direction:row-reverse } .vertical-align-center-2col-reverse > .row-fluid-wrapper > .row-fluid > .widget-span:first-child { margin-left: 2.564102564%; } .vertical-align-center-2col-reverse > .row-fluid-wrapper > .row-fluid > .widget-span:nth-child(2) { margin-left: 0; } } .row-fluid .contact-simple-form input[type="email"]{ text-transform:initial !important; } .row-fluid .fullwidth { width:100%; float:left; } /* (Aya 26-02-20): Copied from FAST-2018.css */ .row-fluid .get-bg img { display: none; } .row-fluid .tab-right-content h3 { font-weight: 500;font-style: normal; font-size: 28px; color: #EA0000; line-height: 28px; } .row-fluid .tab-right-content { padding:34px 71px 0 34px; display:none; } .row-fluid .tab-right-content:first-child { display:block; } .row-fluid .tabright-text ul { padding:0; margin:20px 0 37px; } .row-fluid .tabright-text ul li { position:relative; padding-left:20px; font-size:22px; font-weight:bold; line-height:28px; list-style:none; } .row-fluid .tabright-text ul li:before { content:''; position:absolute; left:0; top:11px; width:8px; height:8px; background:#EA0000; } .row-fluid .my-tab.tab-active a { box-shadow: 0px 1px 10px 1px rgba(0,0,0,0.5); } .row-fluid .tabright-text { font-size: 22px; line-height: 20px; font-weight: 400; font-style: normal; } .row-fluid .grey-bg-sec { padding:75px 0; color:#333; font-size: 22px; line-height: 28px; font-family: 'FujitsuInfinityPro' , 'ArialMT', 'Arial'; font-weight: 400;} .row-fluid .red-brochure-sec { color: #FFFFFF; padding: 0 2em; } .row-fluid .red-brochure-sec .page-center { background: #EA0000; padding: 0 2em; border-radius: 5px; } .row-fluid .red-brochure-sec img { margin-top: 50px; } .row-fluid .brochure-left h3 { font-size: 28px; line-height: 36px; color: #FFFFFF; font-weight: 500; } .row-fluid .brochure-left { padding-top: 52px; font-size:22px; font-weight: 400; } .row-fluid .brochure-left a { margin: 10px 0 0; border-radius: 5px !important; } .row-fluid .text-large-sec { font-size: 40px; color: #333; padding-right: 20px; } .row-fluid .text-img-main { padding: 3em; background: rgba(243, 243, 243, 1); color:#333; } .row-fluid .text-img-main .page-center { padding: 0; } .row-fluid .textimg-inner { padding: 60px 2em; margin-bottom:3em; } .row-fluid .textimg-inner:nth-child(3n) .lefttext { float: right; } .row-fluid .textimg-inner:last-child { margin-bottom: 0; } .row-fluid .lefttext h2 { margin: 0 0 30px; color: #333; font-size: 32px; line-height: 36px; } .row-fluid .lefttext ul { padding-left: 20px; margin: 0 0 22px; } .row-fluid .lefttext ul li a { font-weight: bold; font-size: 18px; } .row-fluid .lefttext { font-size: 18px; line-height: 28px; } .row-fluid .cta-btn a { position:relative; margin-top: 18px; color: #FFFFFF; background: #EA0000; border: 1px solid #EA0000; display: inline-block; padding: 6px 35px 6px 15px; font-size:18px; font-weight: 400; -webkit-border-radius:6px; -moz-border-radius:6px; border-radius:6px; -webkit-box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.3); -moz-box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.3);box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.3); } /* cta-btn is for customised module: FAST module - text with bkg image */ .row-fluid .cta-btn a:before { content:"\f101"; position: absolute; right: 10px; top: 6px; font-family: "fontawesome"; font-weight: 400; font-size: 22px; } /* Non-mobile */ .pad-20-but-10-on-mob { padding: 20px !important; } .mar-20-but-10-on-mob { margin: 20px !important; } .mar-0-20-but-0-10-on-mob { margin: 0px 20px !important; } .mar-0-10-10-10-but-0-5-5-5-on-mob { margin: 0px 10px 10px 10px !important; } .mar-left-10-but-5-on-mob { margin-left: 10px !important; } @media only screen and (max-width: 600px) { /* Mobile phone values */ .pad-20-but-10-on-mob { padding: 10px !important; } .mar-20-but-10-on-mob { margin: 10px !important; } .mar-0-20-but-0-10-on-mob { margin: 0px 10px !important; } .mar-0-10-10-10-but-0-5-5-5-on-mob { margin: 0px 5px 5px 5px !important; } .mar-left-10-but-5-on-mob { margin-left: 5px !important; } } /* (Aya 27-02-20) End of portion added from FAST-2018.css */ /* Content */ .fuji-template .body-container-wrapper { margin-top: 40px;} .body-container-wrapper {} .fuji-template .body-container { min-height:84vh;} /* FAST DEFINITIONS - BEGIN */ .tooltip * { font-family: FontAwesome !important; } /* (Marcelo 21-01-22) Initially added for PRIMWEB - we have to set it otherwise enclosed question mark is not displayed since FujitsuInfinityPro does not define it */ .tooltip.fontnormal * { font-family: FujitsuInfinityPro !important; } /* (Marcelo 16-06-22) Inittially added for webpage 'Compare versions */ .tooltiptext { font-family: FujitsuInfinityPro !important; } .tooltip { position: relative; display: inline-block; font-family: 'FujitsuInfinityPro' !important;} .tooltip i:hover { color: #EA0000; } .tooltip .tooltiptext { visibility: hidden; opacity: 0; transition-property: opacity; transition-duration: 0.6s !important; transition-delay: 0.2s; width: max-content; background-color: #FFFFFF; color: #404040; border-radius: 6px; padding: 5px; font-size:12px; margin-left:10px; margin-top:2px; position: absolute; z-index: 1; border: 1px solid #404040;} .pzone-content .tooltip .tooltiptext { background-color: #D9F1F4; font-size:0.6em; text-shadow: initial !important; box-shadow: 3px 3px #FFFFFF, -3px 3px #FFFFFF; } /* (Marcelo 25-04-25) Created for 'Logical replication of generated columns' */ .tooltip:hover .tooltiptext { visibility: visible; opacity: 1; } .tooltiptight { position: relative; display: inline-block; font-family: 'Fujitsu Sans';} /* (Marcelo 03-11-21) .tooltiptight added for breadcrumb images in FEP order webpages */ .tooltiptight i:hover { color: #EA0000; } .tooltiptight .tooltiptext { visibility: hidden; opacity: 0; transition-property: opacity; transition-duration: 1s !important; transition-delay: 0.6s; width: max-content; background-color: #FFFFFF; color: #404040; border-radius: 6px; padding: 5px; font-size:12px; margin-left:-20px; margin-top:2px; position: absolute; z-index: 1; border: 1px solid #404040; text-align: center;} .tooltiptight:hover .tooltiptext { visibility: visible; opacity: 1; } .tooltiptight img:hover { filter: brightness(50%); } .tooltipfast { display: inline-block;} /* (Marcelo 13-04-22) Removed 'position: relative;', as it clips the tooltip box to the max width of the parent container. Initiall changed for KB article ''How to - Installing the Prometheus adapter */ .trunk-content .tooltipfast { background-color: #E8F8F9; cursor: default; } .trunk-content .tooltipfast:after { content: ' 'url('https://www.postgresql.fastware.com/hubfs/Images/Pictograms/picto-information-01.png');} .pzone-content .tooltipfast { background-color: #E8F8F9; cursor: default; } .pzone-content .tooltipfast:after { content: ' 'url('https://www.postgresql.fastware.com/hubfs/Images/Pictograms/picto-information-01.png');} .tooltipfast .tooltiptext { visibility: hidden; opacity: 0; transition-property: opacity; transition-duration: 0.4s !important; transition-delay: 0.2s; background-color: #FFE700; color: #404040; border-radius: 3px; padding: 5px; font-size:14px !important; margin-left:10px; margin-top:2px; position: absolute; z-index: 1; border: 1px solid #404040; max-width: 450px;} .imgslider-settings .tooltipfast .tooltiptext { margin-top: 80px; background-color: #FFA54B;} .trunk-content .tooltipfast .tooltiptext { background-color: #D9F1F4; } .pzone-content .tooltipfast .tooltiptext { background-color: #D9F1F4; } .cta_scrollup .tooltipfast .tooltiptext { top: -10px; left: 110px;} /* (Marcelo 11-05-22) Initially added for 'Cheat sheet' webpage. This class works in conjunction with Design Manager's module 'FAST - fixed position module' */ .tooltipfast:hover .tooltiptext { visibility: visible; opacity: 1; } .tooltip .tooltip-thumb-content { visibility: hidden; opacity: 0; transition-property: opacity; transition-duration: 0.1s !important; transition-delay: 0.1s; width: max-content; margin-left:10px; margin-top:2px; position: absolute; z-index: 1; border: 1px solid #C0C0C0;} /* (Marcelo 25-02-21) .tooltip-thumb-icon and .tooltip-thumb-content setting were introduced in PRIMEWEB page */ .tooltip:hover .tooltip-thumb-content { visibility: visible; opacity: 1; } .tooltip:hover .tooltip-thumb-icon:before { content:url('https://2585850.fs1.hubspotusercontent-na1.net/hubfs/2585850/Images/Icons/icon-eye-04.png'); } .tooltip .tooltip-thumb-content-landscape { visibility: hidden; opacity: 0; transition-property: opacity; transition-duration: 0.1s !important; transition-delay: 0.1s; width: max-content; margin-left:10px; margin-top:2px; position: absolute; z-index: 1; border: 1px solid #C0C0C0;} /* (Marcelo 25-02-21) .tooltip-thumb-icon and .tooltip-thumb-content setting were introduced in PRIMEWEB page */ .tooltip:hover .tooltip-thumb-content-landscape { visibility: visible; opacity: 1; } .tooltip:hover .tooltip-thumb-icon-landscape:before { content:url('https://2585850.fs1.hubspotusercontent-na1.net/hubfs/2585850/Images/Icons/icon-eye-04.png'); } .fa-question-circle { font-size: 90% !important; color: #808080 !important; } .tooltip.white .fa-question-circle { color: #FFFFFF !important; } .smaller { font-size: 80% !important; } .tooltip-thumb-icon:before { content:url('https://2585850.fs1.hubspotusercontent-na1.net/hubfs/2585850/Images/Icons/icon-eye-03.png');} /* (Marcelo 25-02-21) Used in PRIMEWEB to show collateral thumbnails */ .tooltip-thumb-content img { height: 400px; box-shadow: 8px 8px 6px #C0C0C0; } .tooltip-thumb-content-landscape img { height: 300px; box-shadow: 8px 8px 6px #C0C0C0; } /* Tooltip indented to the right */ .indented-tooltip { position: relative; display: inline-block; } .indented-tooltip .indented-tooltiptext { visibility: hidden; width: 160px; background-color: #EA0000; color: #000000; border-radius: 6px; padding: 10px; font-size:13px; margin-left:10px; margin-top:2px; position: absolute; z-index: 1; } .indented-tooltip:hover .indented-tooltiptext { visibility: visible; } .indented-tooltiptext::after { content: ""; position: absolute; left: 10px; margin-left: 10px; } /* Code script, command output, legends,captions */ /* (Marcelo 25-05-21) Note that some settings, such as margin-left, are redefined below if class inside .fast-procedure class */ .legend, .legend p { font-size: 90% !important; margin-top: 10px !important; padding-left: 20px; text-indent:-20px; } /* (Marcelo 01-06-20) We need padding-left and text-indent to align text in 2nd line of paragraphs */ .legend +.legend { margin-top: 0px !important; } /* (Marcelo 01-06-20) We need this adjacent sibling selector (with !important) for legend captions that contain more than 1 line */ .code-script { font-family: monospace !important; font-size: 0.8em !important; background-color: #F2F2F2; color:#101010 !important; border: 1px solid #AAAAAA; padding: 10px 15px; white-space: pre !important; overflow-x: auto !important; margin-left:20px; margin-right:30px; margin-bottom:20px !important; max-width: fit-content; } /* (Narcelo 10-08-20) Use this class in 
 tags instead of 
 tags, to make it easier to handle consecutive spaces */
span.code-script                    { margin-left: 0px;  margin-right: 0px; }
.code-script *                      { font-family: monospace !important; color:#101010 !important; }
li span.code-script + p             {  margin-top: 20px !important; }
.trunk-content       .code-script   { color: #FFFFFF !important;font-size: 0.75em !important; margin-right: 0px; }
.trunk-content       .code-script * { color: #FFFFFF !important;} /* (Marcelo 02-12-24) Font-size in * on separate line otherwise percentages compound */
.pzone-content       .code-script   { color: #FFFFFF !important;font-size: 0.75em !important; margin-right: 0px; }
.pzone-content       .code-script * { color: #FFFFFF !important;} /* (Marcelo 02-12-24) Font-size in * on separate line otherwise percentages compound */
.code-script-smaller .code-script   { font-size: 12px !important; } /* (Marcelo 02-01-25) Initially created for Trunk-line post 'Ensuring business continuity: The critical role of Mirroring Controller in high-availability systems' */
.code-script-caption     { margin-top:-15px !important; font-size: 90% !important; color: #505050 !important; font-style: oblique; margin-bottom: 20px !important; padding-left: 20px;  } /* (Marcelo 01-06-20) We need padding-left and text-indent to align text in 2nd line of paragraphs */
.code-script-caption +
.code-script-caption     { margin-top: -20px !important; }                     /* (Marcelo 01-06-20) We need this adjacent sibling selector (with !important) for code captions that contain more than 1 line */
.code-script-new-portion { display: block; border-top: 1px dotted #AAAAAA; }  /* (Marcelo 10-08-20) Use this class with  tag instead of 
; 'display' attribute is necessary to make sure that the border goes through the entire line, not only the text */
.code-script-img         { margin-left:20px; margin-bottom:20px !important; box-shadow: 6px 6px 3px 0px #C0C0C0; }
.code-script-less        { font-size:89% }
.code-script-heading     { margin-left:20px; font-size: 90%;  margin-bottom: 5px; } /* (Marcelo 06-03-21) Added'margin-left'  for Osumi blog on CREATE OR REPLACE TRIGGER */ /* (Marcelo 14-05-21 'font-size' and 'margin-bottom' for  Kuroda blog on DECLARE STATEMENT on ECPG */
.code-script-prompt      { color: #606060; } /* (Marcelo 18-10-21) Created to be initially used in blog ' What is the new LZ4 TOAST compression in PostgreSQL 14, and how fast is it?' */
.fast-ol  .code-script { margin-left: 100px !important;} 
ul li .code-script { margin-top: 10px; } /* Initially added for Gary's blog post 'Data portability' */
.fujitsublog-template                 .code-script  { border-radius: 0px; background: #FAFAFA; border: 3px solid transparent; border-image: linear-gradient(110deg, #F75100, 95%, #FFE700) 1;} /* (Marcelo 25-01-23) Inittially added for Amit's blog post 'PostgreSQL 125 and beyond' */
.fujitsublog-template .uvance-emerald .code-script  { border-radius: 0px; background: #FAFAFA; border: 3px solid transparent; border-image: linear-gradient(110deg, #008224, 95%, #61D600) 1;} /* (Marcelo 25-01-23) Inittially added for Amit's blog post 'PostgreSQL 125 and beyond' */
.trunk-content                        .code-script  { border-radius: 0px; background: #1f0366; border: unset; border-image: unset;  } 
.trunk-content table                  .code-script  { margin-left: 0px !important;} /* (Marcelo 24-01-25) Added for 'Understanding the PostgreSQL Background Writer' */
.trunk-content                        .code-keyword { font-family: monospace; }
.pzone-content                        .code-script  { border-radius: 0px; background: #1f0366; border: unset; border-image: unset;  } 
.fujitsublog-template                 .code-script.smaller { padding: 5px; border: 1px solid transparent; border-image: linear-gradient(110deg, #F75100, 95%, #FFE700) 1; } /* (Marcelo 30-05-25) Inittially added for 'Proactive PostgreSQL security' */
.fujitsublog-template                 .code-script.muted { border-image: linear-gradient(110deg, #FFA54B, 95%, #FFE700) 1; } /* (Marcelo 30-05-25) Inittially added for 'Proactive PostgreSQL security' */
.fujitsublog-template                 .code-script .obscured { color: #b0b0b0 !important;} /* (Marcelo 25-01-23) Inittially added for Amit's blog post 'PostgreSQL 125 and beyond' */
.code-script.faded                                  { background: #deeaef;  } /* (Marcelo 24-04-24) * Created to article 'Logical replication of generated columns' */
.code-script.faded, code-script.faded span {  color: #202020 !important; } /* (Marcelo 24-04-24) * Created to article 'Logical replication of generated columns' */
.font-color-neutral1, .code-script.faded .font-color-neutral1 { color: #1077A1 !important; }
.font-color-neutral2, .code-script.faded .font-color-neutral2 { color:#c3243d  !important; }

.pzone-content      td.code-script,
.pzone-content      td.code-script span { background: #deeaef; color: #202020 !important; } /* (Marcelo 24-04-24) * Created to article 'Logical replication of generated columns' */
.pzone-content table  .code-script { margin-left: 0px !important;} /* (Marcelo 24-01-25) Added for 'Understanding the PostgreSQL Background Writer' */
.pzone-content        .code-keyword { font-family: monospace; }
.code-script-muted    .code-script { border-radius: 0px; background: #F0F0F0; border: 1px solid transparent; border-image: linear-gradient(110deg, #303030, 95%, #A0A0A0) 1;} 
.code-script .keyword-emphasis { text-shadow: -.2px 0,  0 .2px,  .2px 0,  0 -.2px; color: #F75100; } /* (Marcelo 25-01-23) Inittially added for Amit's blog post 'PostgreSQL 125 and beyond' */

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { /* (Marcelo 08-08-20) This portion makes monospaced font in IE smaller, because IE renders it bigger than Chrome, Edge, Android and iOS, and as a result the max-width does not comport the line and it breaks incorrectly only in IE */
  .code-script           { font-size: 13px !important;}
}
@media screen and (max-width: 1000px) {
  .code-script         :not(.list-ind-lvl-,.list-ind-lvl-1)  { margin-top: 10px !important; margin-bottom: 10px !important;  margin-left:  0px !important; margin-right: 0px !important; }
  .code-script-caption :not(.list-ind-lvl-,.list-ind-lvl-1)  { margin-top: 10px !important;                                  margin-left:  0px !important; margin-right: 0px !important; }
  .code-script-img     :not(.list-ind-lvl-,.list-ind-lvl-1)  {                              margin-bottom: 10px !important;  margin-left: 10px !important;                               }
  .code-script-heading :not(.list-ind-lvl-,.list-ind-lvl-1)  { margin-left: 0px;                                                                                                         }
}

.trunk-content .code-script.h-file {background: #fafafa; color: #000000 !important; }
.trunk-content .code-script.h-file .pragma { color: #d75934 !important;  }
.trunk-content .code-script.h-file .id     { color: #2350ab !important; }
.trunk-content .code-script.h-file .cmt    { color: #5a636e !important; }
.pzone-content .code-script.h-file {background: #fafafa; color: #000000 !important; }
.pzone-content .code-script.h-file .pragma { color: #d75934 !important;  }
.pzone-content .code-script.h-file .id     { color: #2350ab !important; }
.pzone-content .code-script.h-file .cmt    { color: #5a636e !important; }

/* Classes for 
 */ /* (Marcelo 06-04-22) Initially added for webpage 'How-to - Setting up Grafana on IBM LinuxONE' */
pre                  { font-family: monospace !important; font-size: 1rem; background-color: #303030; color: #FFFFFF !important; border: 1px solid #a0a0a0; padding: 4px 8px 4px 8px; white-space: pre; max-width:fit-content; margin-left: 10px; line-height: 1.4em; } /* (Narcelo 10-08-20) Use this class in 
 tags instead of 
 tags, to make it easier to handle consecutive spaces */
pre *                { font-family: monospace !important;                                                  color: #FFFFFF !important; }
pre .placeholder     { font-family: monospace !important;                                                  color: #EEEE8C !important; }
pre .syntax-neutral , 
pre .syntax-neutral2, 
pre .syntax-neutral3, 
pre .syntax-neutral4, 
pre .syntax-neutral5, 
pre .syntax-neutral6 { font-family: monospace !important; color: #404040 !important; }
pre.compact          { font-size: 0.8rem; line-height: 1rem; } /* (Marcelo 13-04-22) Also used in KB article 'How to - Installing the Prometheus adapter' */
ul pre               { margin-left: 0px; }  /* Remove left margin from pre inside lists */

/* Code script additional classes */    /* (Marcelo 30-05-20) Added to cater for PostgreSQL Insider articles */
               .syntax-emphasis  { color: #F75100 !important;      }
               .syntax-correct   { background: #99FF99; outline: 2px solid #99FF99; }
               .syntax-incorrect { background: #FFCCCC; outline: 2px solid #FFCCCC; }
               .syntax-highlight { background: #FFFF99; outline: 2px solid #FFFF99; }
               .syntax-highlight2{ background: #C8F26D; outline: 2px solid #C8F26D; }
               .syntax-neutral   { background: #EFE68D; outline: 2px solid #EFE68D; } /* (Marcelo 14-05-21) Initially added for Kuroda blog on DECLARE STATEMENT on ECPG */
.trunk-content .syntax-neutral   { background: #A40000; outline: 2px solid #A40000; } 
.pzone-content .syntax-neutral   { background: #A40000; outline: 2px solid #A40000; } 
               .syntax-neutral2  { background: #EAAA54; outline: 2px solid #EAAA54; } /* (Marcelo 14-05-21) Initially added for Kuroda blog on DECLARE STATEMENT on ECPG */
.trunk-content .syntax-neutral2  { background: #783D02; outline: 2px solid #783D02; } 
.pzone-content .syntax-neutral2  { background: #783D02; outline: 2px solid #783D02; } 
               .syntax-neutral3  { background: #90c5cc; outline: 2px solid #90c5cc; } /* (Marcelo 14-05-21) Initially added for Kuroda blog on DECLARE STATEMENT on ECPG */
               .syntax-neutral4  { background: #B7BEEB; outline: 2px solid #B7BEEB; } /* (Marcelo 08-02-22) Initially added for Vignesh blog on Logical replication of all table in schema */
               .syntax-neutral5  { background: #B198C0; outline: 2px solid #B198C0; } /* (Marcelo 08-02-22) Initially added for webpage 'How to - Setting up Grafana on IBM LinuxONE' */
               .syntax-neutral6  { background: #9BDFE6; outline: 2px solid #9BDFE6; } /* (Marcelo 08-02-22) Initially added for webpage 'How to - How to - Installing the Prometheus adapter' */
               .syntax-comment   { background: #CCD7E5; font-family: FujitsuInfinityPro !important; }
               .syntax-omitted   { font-style: oblique; color: #808080; }
               .syntax-neutral-font  { color: #cd6907; } /* (Marcelo 20-05-22) Initially added for Osumi'san's blog 'How to handle logical replication conflicts in PostgreSQL' */
               .syntax-neutral-font2 { color: #4C26E0; }

/* Highglight (neutral, positive, negative */   /* (Marcelo 29-08-20) Initally copied from .syntax-... classes. Created these classes because A. we may want to call attention to something that is not necessarily syntax, B. The -correct and -incorrect names may be inappropriate, we may just want to highlight negative/positive outcomes, or before/after, etc. Created when working on PI article 10 (prf-prt-mec) */
               .highlight-positive         { background: #99FF99; outline: 2px solid #99FF99; }
               .highlight-negative         { background: #FFCCCC; outline: 2px solid #FFCCCC; }
               .highlight-attention        { background: #FFFF99; outline: 2px solid #FFFF99; }
               .highlight-neutral          { background: #CCD7E5; outline: 2px solid #CCD7E5; }
.trunk-content .highlight-negative         { background: #DF5A5A; outline: 2px solid #DF5A5A; }
.trunk-content .highlight-positive         { background: #40d740; outline: 2px solid #40d740; }
.trunk-content .highlight-neutral          { background: #CCD7E5; outline: 2px solid #CCD7E5; }
.trunk-content .highlight-neutral2         { background: #A8CDFD; outline: 2px solid #A8CDFD; }
.trunk-content .highlight-neutral3         { background: #8BEDF0; outline: 2px solid #8BEDF0; animation: anim-scale-x-grow ease-in-out; animation-timeline: view();  animation-range: entry 0% cover 50%;  }
.trunk-content .highlight-neutral4         { background: #07C6BF; outline: 2px solid #07C6BF; }
.trunk-content .highlight-neutral3.fade-in { animation: anim-fade-in-neutral3 ease-in-out; animation-timeline: view();  animation-range: entry 0% cover 70%;  }
.trunk-content .code-script .highlight-positive { background: #1f981f; outline: 2px solid #1f981f; }
.trunk-content .code-script .highlight-negative { background: #B60000; outline: 2px solid #B60000; }
.trunk-content .code-script .highlight-neutral  { color: #000000 !important; } /* (Marcelo 17-01-25) Created for 'Integrating pgBackRest in Fujitsu Enterprise Postgres' */
.trunk-content .code-script .highlight-neutral2 { color: #000000 !important; } /* (Marcelo 17-01-25) Created for 'Integrating pgBackRest in Fujitsu Enterprise Postgres' */
.trunk-content .code-script .highlight-neutral3 { color: #000000 !important; } /* (Marcelo 17-01-25) Created for 'Integrating pgBackRest in Fujitsu Enterprise Postgres' */
.trunk-content .code-script .highlight-neutral4 { color: #000000 !important; } /* (Marcelo 20-01-25) Created for 'Integrating pgBackRest in Fujitsu Enterprise Postgres' */
.pzone-content .highlight-negative         { background: #DF5A5A; outline: 2px solid #DF5A5A; }
.pzone-content .highlight-positive         { background: #40d740; outline: 2px solid #40d740; }
.pzone-content .highlight-neutral          { background: #CCD7E5; outline: 2px solid #CCD7E5; }
.pzone-content .highlight-neutral2         { background: #A8CDFD; outline: 2px solid #A8CDFD; }
.pzone-content .highlight-neutral3         { background: #8BEDF0; outline: 2px solid #8BEDF0; animation: anim-scale-x-grow ease-in-out; animation-timeline: view();  animation-range: entry 0% cover 50%;  }
.pzone-content .highlight-neutral4         { background: #07C6BF; outline: 2px solid #07C6BF; }
.pzone-content .highlight-neutral3.fade-in { animation: anim-fade-in-neutral3 ease-in-out; animation-timeline: view();  animation-range: entry 0% cover 70%;  }
.pzone-content .code-script .highlight-positive { background: #1f981f; outline: 2px solid #1f981f; }
.pzone-content .code-script .highlight-negative { background: #B60000; outline: 2px solid #B60000; }
.pzone-content .code-script .highlight-neutral  { color: #000000 !important; } /* (Marcelo 17-01-25) Created for 'Integrating pgBackRest in Fujitsu Enterprise Postgres' */
.pzone-content .code-script .highlight-neutral2 { color: #000000 !important; } /* (Marcelo 17-01-25) Created for 'Integrating pgBackRest in Fujitsu Enterprise Postgres' */
.pzone-content .code-script .highlight-neutral3 { color: #000000 !important; } /* (Marcelo 17-01-25) Created for 'Integrating pgBackRest in Fujitsu Enterprise Postgres' */
.pzone-content .code-script .highlight-neutral4 { color: #000000 !important; } /* (Marcelo 20-01-25) Created for 'Integrating pgBackRest in Fujitsu Enterprise Postgres' */

@keyframes anim-fade-in-neutral3 { from { background: #FFFFFF; outline: 2px solid #FFFFFF; } to { background: #8BEDF0; outline: 2px solid #8BEDF0; }}

/* Flex boxes */
.div_flex_main { display: -webkit-flex !important; display: flex !important; -webkit-flex-wrap: wrap; flex-wrap: wrap; margin-bottom: 20px; }
.div_flex_sub  { flex: 1; -webkit-flex: 1; -ms-flex: 1;  }

/* Oft-occurring text */
.benefits-at-glance p    { color: #000000 !important; font-size: 28px !important; }
.you-may-also p          { color: #000000 !important; font-size: 24px !important; }
.interested-in p         { color: #000000 !important; font-size: 26px !important; }
.support-plan-features p { color: #000000 !important; font-size: 15px !important; margin: 8px 4px; }

/* Indented text */
.indented-level-1 { margin-left: 20px !important; }
.indented-level-2 { margin-left: 40px !important; }
.indented-level-3 { margin-left: 60px !important; }
.indented-level-1-img-legend { padding-left: 3em; text-indent:-1.7em; } /* (Marcelo 07-02-22) Initially added for blog 'Logical replication of all tables in schema in PostgreSQL 15' */ /* (Marcelo 13-04-22) Also used in KB article 'How to - Installing the Prometheus adapter' */

/* Paragraph styling */
.margin-bottom-none   { margin-bottom: 0px !important;  }
.margin-bottom-small  { margin-bottom: 5px !important;  }
.margin-bottom-medium { margin-bottom: 10px !important; }
.margin-left-none     { margin-left: 0px !important;    }
.margin-left-tiny     { margin-left: 5px !important;    }
.margin-left-small    { margin-left: 10px !important;   }
.margin-left-medium   { margin-left: 15px !important;   }
.margin-left-large    { margin-left: 20px !important;   }

/* Lists */
.bullet-list-gray-dark   li:before { content: "\25a0" !important; font-family: "Arial Black" !important; font-size: 80%; color: #E0E0E0 !important; padding-right: 0.3em !important; position: absolute !important; left: -18px !important; top: 0px !important; width: 10px !important; float: left !important; display: inline-block !important; }
.bullet-list-slate-light li:before { content: "\25a0" !important; font-family: "Arial Black" !important; font-size: 80%; color: #6D6D64 !important; padding-right: 0.3em !important; position: absolute !important; left: -18px !important; top: 0px !important; width: 10px !important; float: left !important; display: inline-block !important; }
.list-big-lead            { list-style: none; counter-reset:class-counter; }
.list-big-lead li         { counter-increment: class-counter; display: flex; margin-bottom: 0.5rem; font-size: 22px;  padding: 10px; margin-bottom: 0px; }
.list-big-lead li::before { content: counter(class-counter); font-weight: bold; font-size: 36px; margin-right: 20px; line-height:1;  color: #A40000; }

/* Zebras */
.list-zebra-gray-medium-gray-lighter li:nth-child(odd)  { background: #E6E6E6; }
.list-zebra-gray-medium-gray-lighter li:nth-child(even) { background: #F5F5F0;  }

/* Online training classes */
.training-online-table-header                { background: #454545; color: #FFFFFF !important; padding: 20px 0px; text-align: center; vertical-align: middle !important; border-bottom: 1px solid #595959 !important; font-size: 110%;                         }
.training-online-table-header-col-separator  { background: #FFFFFF; color: #FFFFFF; border-top: 1px solid #FFFFFF !important; border-bottom: 1px solid #FFFFFF !important;                          }
.training-online-table-title-cell            { background: #EDEDED;                                        padding: 5px 10px 2px !important;                                                             }
.training-online-table-title-separator       { background: #FFFFFF; color: #FFFFFF !important; border-top: 1px solid #FFFFFF !important; border-bottom: 1px solid #FFFFFF !important;               }
.training-online-table-regular-cell          { background: #fafafa; padding: 2px 5px !important;                                                                                                                         }
.training-online-table-col-separator         { background: #FFFFFF; color: #FFFFFF !important; border-top: 1px solid #FFFFFF !important; border-bottom: 1px solid #FFFFFF !important;               }
.training-online-table td                    { vertical-align: top; }
.training-online-table td ul                 { margin: 10px 5px;    }
.training-online-table td li                 { margin-bottom: 10px; }
.training-online-table li:before             { content: "\25a0"; color: #5c5c5c !important; padding-right: 0.3em !important; position: absolute !important; left: -18px !important; top: -4px !important; width: 12px !important; float: left !important; display: inline-block !important; }
.training-online-columns                       { float: left; width: 33.3%; padding: 8px; font-size: 90%;}
.training-online-price                         { border: 1px solid #eee; margin: 0; padding: 0;}
.training-online-price:hover                   { box-shadow: 0 8px 12px 0 rgba(0,0,0,0.2)}
.training-online-price .training-online-header { background-color: #111; color: white; }
.training-online-price li                      { padding: 3px; text-align: left;}
.training-online-price .training-online-grey   { list-style-type: none; background-color: #eee; font-size: 20px;}
.trainig-button                                { background-color: #4CAF50; border: none; color: white; padding: 10px 25px; text-align: center; text-decoration: none;}
.training-online-test-td {border-spacing: 0px 8px; border: 1px solid black; padding: 5px;}
.training-online-test-table { border-spacing: 0px 8px !important;}

/* Boxes - background, borders, shadow, alignment, hover zoom */
.container-framed-dotted              { margin-top: 10px; padding: 10px; border: 1px dotted #7F7F7F; margin-right: 10px; }
.container-framed-solid               { margin-top: 10px; padding: 10px; border: 1px solid  #7F7F7F;                     }
.container-framed-solid-gray-light    { margin-top: 10px; padding: 10px; border: 1px solid  #F2F2F2;                     }
.container-framed-solid-gray-dark     { margin-top: 10px; padding: 10px; border: 1px solid  #C0C0C0;                     }
.container-framed-thin-red-dark       { margin-top: 10px; padding: 10px; border: 1px solid  #A40000;                     }
.container-framed-thin-red-muted      { margin-top: 10px; padding: 10px; border: 1px solid  #EA0000;                     }
.container-framed-thin-white-inner    { margin-top: 0px;  padding: 10px; border: 1px solid  #FFFFFF;                     }
.container-framed-thin-slate          { margin-top: 10px; padding: 10px; border: 1px solid  #363431;                     }
.container-framed-thin-slate-light    { margin-top: 10px; padding: 10px; border: 1px solid  #6D6D64;                     }
.container-framed-red-thick           { margin-top: 10px; padding: 10px; border: 2px solid  #EA0000; border-radius: 3px; }
.container-framed-red-3               { margin-top: 20px; padding: 20px; border: 4px solid  #FF4040;                     } /* (Marcelo 09-05-20) Added for the page 'FEP on IBM LinuxONE' */
.container-framed-blue                { margin-top: 10px; padding: 10px; border: 1px solid  #2400B0;                     } 
.container-framed-blue-ibm            { margin-top: 20px; padding: 20px; border: 4px solid  #1F70C1;                     } /* (Marcelo 09-05-20) Added for the page 'FEP on IBM LinuxONE' */
.container-framed-emerald             { margin-top: 10px; padding: 10px; border: 1px solid  #00821F;                     } /* (Marcelo 27-11-21) Initially added for webpage 'FEP for Kubernetes */
.container-framed-emerald-dotted      { margin-top: 10px; padding: 10px; border: 1px dotted #00821F;                     }
.container-framed-orange              { margin-top: 10px; padding: 10px; border: 1px solid  #F75100;                     }
.container-framed-orange-dotted       { margin-top: 10px; padding: 10px; border: 1px dotted #F75100;                     }
.container-framed-red                 { margin-top: 10px; padding: 10px; border: 1px solid  #EA0000;                     } 
.container-framed-red-dotted          { margin-top: 10px; padding: 10px; border: 1px dotted #EA0000;                     }

.container-not-framed                 { margin-top: 20px; padding: 20px; border: 0px;                 }
.border-dotted                        {                                  border: 1px dotted #7F7F7F;  }
.border-solid                         {                                  border: 1px solid #7F7F7F;   }
.border-solid-cyan                    {                                  border: 1px solid #00E7EF;   }
.border-solid-gray-light              {                                  border: 1px solid #F2F2F2;   }
.border-solid-gray-dark               {                                  border: 1px solid #C0C0C0;   }
.border-solid-gray-darker             {                                  border: 1px solid #AAAAAA;   }
.border-solid-orange                  {                                  border: 1px solid #FF8000;   }
.border-solid-slate                   {                                  border: 1px solid #363431;   }
.border-solid-slate-light             {                                  border: 1px solid #6D6D64;   }
.border-thin-red-dark                 {                                  border: 1px solid #A40000;   }
.border-thin-uvance-blue              {                                  border: 1px solid #2400B0;   }
.bkg-color-white                      { background: #FFFFFF;                                          }
.bkg-color-black                      { background: #000000;  color: #FFFFFF;                         }
.bkg-color-gray-lighter               { background: #F5F5F0;                                          }
.bkg-color-gray-light                 { background: #F2F2F2;                                          }
.bkg-color-gray-medium                { background: #E6E6E6;                                          } 
.bkg-color-gray-dark                  { background: #E0E0E0;                                          }
.bkg-color-gray-darker                { background: #C0C0C0;                                          }
.bkg-color-green-muted                { background: #99FF99;                                          }
.bkg-color-red-pure                   { background: #FF0000;                                          }
.bkg-color-red-lighter                { background: #FFCCCC;                                          }
.bkg-color-red-600                    { background: #C90C1F; color: #FFFFFF;                          }
.bkg-color-red-dark                   { background: #A40000; color: #FFFFFF;                          }
.bkg-color-red-muted                  { background: #EA0000; color: #FFFFFF;                          }
.bkg-color-red-muted-2                { background: #c92c1e; color: #FFFFFF;                          }
.bkg-color-red-muted-3                { background: #FF4C4A; color: #FFFFFF;                          }
.bkg-color-red-gradient-1             { background: #EA0000; color: #FFFFFF; background: -webkit-linear-gradient(top left, #EA0000, #A40000); background: -moz-linear-gradient(top left, #EA0000, #A40000); background: linear-gradient(to bottom right, #EA0000, #A40000); }
.bkg-color-slate                      { background: #363431; color: #FFFFFF;                          }
.bkg-color-slate-light                { background: #6D6D64; color: #FFFFFF;                          }
.bkg-color-yellow-light               { background: #FFFF99;                                          }
.bkg-color-yellow-muted               { background: #FFFFE6;                                          }
.bkg-color-yellow-pure                { background: #FFFF00;                                          }
.bkg-color-blue-muted                 { background: #CCEEFF;                                          }
.bkg-color-brown-muted                { background: #ECD9C6;                                          }
.bkg-color-linen                      { background: #EAE6E4;                                          } /* (Marcelo 08-01-20) Added definition, used in PRIMEQUEST page */
.bkg-color-linen-light                { background: #F4F1EF;                                          } /* (Marcelo 08-01-20) Added definition, not used yet */
.bkg-color-linen-dark                 { background: #DEDAD7;                                          } /* (Marcelo 08-01-20) Added definition, not used yet */
.font-black                           {                       color: #000000;                         }
.font-white                           {                       color: #FFFFFF;                         }
.font-gray-darker                     {                       color: #333333;                         }
.font-red-dark                        {                       color: #EA0000;                         } 
.font-red-darker                      {                       color: #EA0000;                         }
.font-red-light                       {                       color: #EA0000;                         } /* (Marcelo 09-05-20) Added for the page 'FEP on IBM LinuxONE' */
.font-red-muted-3                     {                       color: #FF4C4A;                         }
.font-blue-ibm                        {                       color: #1F70c1 !important;              }
.font-green-ibm-tss                   {                       color: #304633 !important;              }
.font-blue                            {                       color: #2400B0 !important;              }
.font-cyan                            {                       color: #00E7EF !important;              } /* (Marcelo 26-11-21) Uvance color - Initially addded for webpage 'FUJITSU Enterprise Postgres for Kubernetes' */
.font-emerald                         {                       color: #008224 !important;              }
.font-lime                            {                       color: #61D600 !important;              }
.font-magenta                         {                       color: #D80084 !important;              }
.font-orange, .font-orange *          {                       color: #F75100 !important;              }
.font-teal                            {                       color: #00B2C1 !important;              }
.font-red                             {                       color: #EA0000 !important;              }
.font-gradient-emerald-lime           { background: linear-gradient(90deg,#008224 50%,#61D600 75%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; }
.shadow-medium-short                  { box-shadow: 4px 4px  2px 0px #C0C0C0;                         }
.shadow-medium-long                   { box-shadow: 6px 6px  3px 0px #C0C0C0;                         }
.shadow-dark-short                    { box-shadow: 4px 4px  2px 0px #AAAAAA;                         }
.shadow-dark-long                     { box-shadow: 6px 6px  3px 0px #AAAAAA;                         }
.align-text-center-middle             { text-align: center; vertical-align: middle;                   }
.hover-pointer:hover                  { cursor: pointer;                                              }
.hover-default:hover                  { cursor: default;                                              }
.hover-resize:hover                   { -ms-transform: scale(1.1);  -webkit-transform: scale(1.1);  transform: scale(1.1);  }
.hover-bkg-color-blue-light-font-blue:hover   { background-color: #CCD7E5;                            } /* (Marcelo 06-12-21) Inittial added for webpage 'FEP on Z Modernization' webpage */
.hover-bkg-color-blue-light-font-blue:hover a { color: #2400B0 !important;                            }
.hover-bkg-color-red-light-font-red:hover     { background-color: #FFCCCC;                            } /* (Marcelo 06-12-21) Inittial added for webpage 'FEP on Z Modernization' webpage */
.hover-bkg-color-red-light-font-red:hover a   { color: #EA0000 !important;                            }
.hover-bkg-color-red:hover            { background-color: #EA0000;                                    }
.hover-bkg-color-red:hover a          { color: #FFFFFF !important;                                    }
.hover-bkg-color-black:hover          { background-color: #000000;                                    }
.hover-bkg-color-black:hover a        { color: #FFFFFF !important;                                    }
.hover-bkg-color-white:hover          { background-color: #FFFFFF;                                    }
.hover-bkg-color-white:hover a        { color: #EA0000 !important;                                    }
.hover-recolor-gray-medium:hover      { background-color: #E6E6E6;                                    }
.hover-recolor-gray-dark:hover        { background-color: #C0C0C0;                                    }
.hover-shadow-dark-long:hover         { box-shadow: 6px 6px 3px 0px #AAAAAA;                          }
.hover-img-saturate-medium:hover      { filter: saturate(var(--value, 1.5));                          }  /* (Marcelo 30-06-21) Added for blog 'FUJITSU Enterprise Postgres for Kubernetes is now available on Red Hat Marketplace' */
.hover-bkg-color-blue-light-font-blue-dark:hover   { background-color: #CCD7E5;                            }
.hover-bkg-color-blue-light-font-blue-dark:hover a { color: #2400B0 !important;                            }
.border-gray-with-shadow-on-hover                  { border: 1px solid #A0A0A0; box-shadow: 4px 4px 4px #EAEAEA, -4px -4px 4px #EAEAEA, 4px -4px 4px #EAEAEA, -4px 4px 4px #EAEAEA;  }
.border-gray-with-shadow-on-hover:hover            {                            box-shadow: 6px 6px 6px #C0C0C0, -6px -6px 6px #C0C0C0, 6px -6px 6px #C0C0C0, -6px 6px 6px #C0C0C0; } 
/* hyperlink style */
.hyperlink-simple                     { color: #A40000; text-decoration: none;                        }
/* Photos and caption */
p.img-photo                            { margin-top: 40px !important;  margin-bottom: 0px !important;}
  .img-photo img                       { margin-bottom: 0px !important;}
  .img-photo-border-white              { border: 20px solid #FFFFFF;                                   }
  .img-photo-shadow                    { box-shadow: 0px 0px 0px 1px #C0C0C0, 0px 0px 0px 2px #D0D0D0, 0px 0px 0px 3px #E0E0E0, 0px 0px 0px 4px #F0F0F0; }
  .img-photo-caption                   { margin-top: 10px; font-size: 90% !important; }
  .img-photo-caption-small             { color: #505050; margin-bottom: 30px !important; font-size: 80% !important; } /* (Marcelo 04-10-22) Initially added for blog post 'Fujitsu attends the Open Source Summit Europe 2022 in Dublin' */
/* Positioning selectors */
.pos-fixed                           { position: fixed; left: 20px;  }    

/* Button style */
.uvance-emerald .container-button                       { background: #008224; color: #FFFFFF; font-size: 16px; padding: 3px 0px; border: 1px solid #C0C0C0; margin-top: 10px; text-align: center; box-shadow: 4px 4px 3px #C0C0C0; border-radius: 4px; }  /* (Marcelo 05-02-22) Initially added for webpage 'FEP Operator FAQ' */
.uvance-emerald .container-button a                     {                      color: #FFFFFF;                                                                                                                                                          }
.uvance-emerald .container-button:hover                 { background: #61D600;                                                    border: 1px solid #C0C0C0; margin-top: 10px; text-align: center; box-shadow: 4px 4px 3px #C0C0C0; border-radius: 4px; }  /* (Marcelo 06-12-21) Initially added to button in 'FEP on IBM - Modernization webpage */
.uvance-emerald .container-button:hover a               {                      color: #000000;                                                                                                                                                          }
.container-button-blue                                  { background: #2400B0; color: #FFFFFF; font-size: 16px; padding: 3px 0px; border: 1px solid #C0C0C0; margin-top: 10px; text-align: center; box-shadow: 4px 4px 3px #C0C0C0; border-radius: 4px; }  /* (Marcelo 06-12-21) Initially added to button in 'FEP on IBM - Modernization webpage */
.container-button-blue a                                {                      color: #FFFFFF;                                                                                                                                                          }
.container-button-blue:hover                            { background: #00E7EF;                                                                                                                                                                          }
.container-button-blue:hover a                          {                      color: #000000;                                                                                                                                                          }
.container-button-orange                                { background: #F75100; color: #FFFFFF; font-size: 16px; padding: 3px 0px; border: 1px solid #A0A0A0; margin-top: 10px; text-align: center; box-shadow: 4px 4px 3px #C0C0C0; border-radius: 4px; } /* (Marcelo 17-11-21) Initially added to button in 'FEP on IBM - Modernization webpage */
.container-button-orange a                              {                      color: #FFFFFF;                                                                                                                                                          }
.container-button-orange:hover                          { background: #FFE700;                                                                                                                                                                          }
.container-button-orange:hover a                        {                      color: #000000;                                                                                                                                                          }
.container-button-red                                   { background: #EA0000; color: #FFFFFF; font-size: 16px; padding: 3px 0px; border: 1px solid #A0A0A0; margin-top: 10px; text-align: center; box-shadow: 4px 4px 3px #C0C0C0; border-radius: 4px; }
.container-button-red a                                 {                      color: #FFFFFF;                                                                                                                                                          }
.container-button-red:hover                             { background: #D80084;                                                                                                                                                                          }
.container-button-red:hover a                           {                      color: #FFFFFF;                                                                                                                                                          }
.container-button-white                                 { background: #FFFFFF; color: #A40000; font-size: 16px; padding: 3px 0px; border: 1px solid #A0A0A0; margin-top: 10px; text-align: center; box-shadow: 4px 4px 3px #C0C0C0; border-radius: 4px; }
.container-button-white a                               {                      color: #A40000;                                                                                                                                                          }
.container-button-thick-orange-border                   {                      color: #000000; font-size: 16px; padding: 3px 0px; border: 3px solid #F75100; margin-top: 10px; text-align: center;  } /* (Marcelo 26-12-22) Initially added to button in webpage 'Enhanced security for enterprises' */
.container-button-thick-orange-border a                 {                      color: #000000; }

.container-button-gray-dark                             { color: #A40000; font-size: 16px; padding: 3px 0px; background: #FFFFFF; border: 1px solid #C0C0C0; margin-top: 10px; text-align: center; box-shadow: 4px 4px 3px #C0C0C0; border-radius: 4px; }
.container-button-white-medium                          { color: #A40000; font-size: 18px; padding: 7px 7px; background: #FFFFFF; border: 1px solid #A0A0A0; margin: 10px 0px; text-align: center;  box-shadow: 4px 4px 2px 0px #C0C0C0;                }
.container-button-blue-dark                             { color: #FFFFFF; font-size: 16px; padding: 3px 0px; background: #2C3E50; border: 1px solid #C0C0C0; margin-top: 10px; text-align: center; box-shadow: 4px 4px 3px #C0C0C0; border-radius: 4px; }
.container-button-blue-dark a                           { color: #FFFFFF;                                                                                                                                                                               }
.container-button-white-medium:hover                    {                                                    background: #FBEAEB;                                                                                                                       }
.container-button-white-font-black-medium               { color: #000000; font-size: 18px; padding: 7px 7px; background: #FFFFFF; border: 1px solid #000000; margin-top: 10px; text-align: center;                                                      }
.container-button-white-font-black-medium a             { color: #000000;                                                                                                                                                                               }
.container-button-white-font-black-medium               { color: #000000; font-size: 18px; padding: 7px 7px; background: #FFFFFF; border: 1px solid #000000; margin-top: 10px; text-align: center;                                                      }
.container-button-white-font-black-medium a             { color: #000000;                                                                                                                                                                               }
.container-button-white-85pc-transp-font-white-medium   { color: #FFFFFF; font-size: 18px; padding: 7px 7px; background:rgba(255,255,255,0.15);  border: 1px solid #FFFFFF;  margin-top: 10px; text-align: center;                                      }
.container-button-white-85pc-transp-font-white-medium a { color: #FFFFFF;                                                                                                                                                                               }

/* Manuals styles */
.manuals-version-text                 { font-size: 16px !important; color: #444444 !important;                                                             }
.manuals-version-link                 { font-size: 16px !important; color: #444444 !important;                                                             }
.manuals-task-version                 { font-size: 16px !important; color: #A40000 !important; margin: 0px 0px 5px 0px; font-weight: bold;                 }
.manuals-task-header                  { font-size: 16px !important; color: #444444 !important; margin: 5px 0px 3px 0px; font-weight: bold;                 }
.manuals-task-link                    { font-size: 16px !important; color: #444444 !important; margin: 2px 0px 2px 10px;                                   }
.manuals-heading-version-curr-version { font-size: 36px !important; color: #A40000 !important;                                                             }
.manuals-heading-task-curr-version    { font-size: 36px !important; color: #444444 !important; margin-bottom:  0px !important; margin-top: 0px !important; } 
.manuals-name-curr-version            { font-size: 22px !important; color: #A40000 !important; margin-bottom: 10px !important;                             } 
.manuals-desc-curr-version            { font-size: 18px !important; color: #444444 !important; margin-bottom:  0px !important;                             } 
.manuals-open-curr-version            { font-size: 18px !important; color: #A40000 !important; margin-bottom:  0px !important; margin-top: 0px !important; } 
.manuals-heading-version-old-version  { font-size: 28px !important; color: #A40000 !important;                                                             }
.manuals-heading-task-old-version     { font-size: 28px !important; color: #444444 !important; margin-bottom:  0px !important; margin-top: 0px !important; } 
.manuals-name-old-version             { font-size: 20px !important; color: #A40000 !important; margin-bottom: 10px !important;                             } 
.manuals-desc-old-version             { font-size: 16px !important; color: #444444 !important; margin-bottom:  0px !important;                             } 
.manuals-open-old-version             { font-size: 16px !important; color: #A40000 !important; margin-bottom:  0px !important; margin-top: 0px !important; } 

/* Quotation styles */
.quote-text   {  font-family: FujitsuInfinityPro !important; font-style: italic; } /* (Marcelo 10-10-20) Added for IBM Marcel quote in IBM main page */
.quote-author {  font-family: FujitsuInfinityPro !important; margin-bottom: 0px; } /* (Marcelo 10-10-20) Added for IBM Marcel quote in IBM main page */

/* Classes for images in 'Download collateral' pages */
.img-mockup-gated-resource { height: 320px; float: right; margin: 20px 0px 10px 20px; }
@media only screen and (max-width: 1400px) { .img-mockup-gated-resource { height: 350px; } }
@media only screen and (max-width: 1200px) { .img-mockup-gated-resource { height: 300px; } }
@media only screen and (max-width: 1200px) { .img-mockup-gated-resource { float: unset; display: block; margin: 0px auto;} }

/* Classes for 'Download trial version' webpage */
@media only screen and (max-width: 900px) { .fast-grid-download-trial-version .span4.widget-span { width: 100%; margin: 20px auto !important; }; }
.responsive-img-trial-box      { max-width: 35%; }
.responsive-img-trial-elephant { max-width: 40%; }
.responsive-trial-version-card-singleton         { margin-top: 50px; } /* (Marcelo 11-08-22) This is the main container div used in the individual trial pages */
.responsive-trial-version-card-singleton hr      { border: 1px solid #F75100; } 
.responsive-trial-version-card-singleton hr ~ ul { margin-top: 30px !important; }
.responsive-trial-version-card-wrapper      { display: grid; grid-template-columns: minmax(auto,400px) minmax(auto,400px) minmax(auto,400px) minmax(auto,400px); margin-top: 30px; justify-content:center;  padding: 20px; } /* (Marcelo 11-08-22) This is the main container div used in the collective page showing the 4 editions (core, K8s, Z, Power) */
.responsive-trial-version-card-wrapper hr   { max-width: 90%; margin-bottom: 20px; border: 1px solid #F75100; }
.responsive-trial-version-card-head         { margin: 0px 10px;           border: 1px solid #C0C0C0;font-size: 18px; background-color: #F2F2F2; padding: 10px 20px 0px 20px; border-bottom: 0px;                  text-align: center; display: flex;  align-items: center; }
.responsive-trial-version-card-blurb        { margin: 0px 10px;           border: 1px solid #C0C0C0;font-size: 18px; background-color: #F2F2F2; padding: 10px 20px ;         border-bottom: 0px; border-top: 0px;                     } /* (Marcelo 10-08-22: Make sure that blurb has padding-top otherwise a gap shows in pages with EULA and form) */
.responsive-trial-version-card-body         { margin: 0px 10px;           border: 1px solid #C0C0C0;font-size: 18px; background-color: #F2F2F2; padding:  5px 20px;          border-bottom: 0px; border-top: 0px;                     } /* (Marcelo 10-08-22: Make sure that -body has padding-top otherwise a gap shows in pages with EULA and form) */
.responsive-trial-version-card-body *       { font-size: 18px; }
.responsive-trial-version-card-cta          { margin: 0px 10px 20px 10px; border: 1px solid #C0C0C0; background-color: #F2F2F2; padding:  0px 20px 10px 20px;                    border-top: 0px; text-align: center; }
.responsive-trial-version-card-cta a        { background: #F75100; color: #FFFFFF; padding: 10px 20px; }
.responsive-trial-version-card-cta a:hover  { background: #FC7409; color: #000000; }
.responsive-trial-version-card-head-1       { grid-column: 1; grid-row: 1; }
.responsive-trial-version-card-blurb-1      { grid-column: 1; grid-row: 2; }
.responsive-trial-version-card-body-1       { grid-column: 1; grid-row: 3; }
.responsive-trial-version-card-head-2       { grid-column: 2; grid-row: 1; }
.responsive-trial-version-card-blurb-2      { grid-column: 2; grid-row: 2; }
.responsive-trial-version-card-body-2       { grid-column: 2; grid-row: 3; }
.responsive-trial-version-card-head-3       { grid-column: 3; grid-row: 1; }
.responsive-trial-version-card-blurb-3      { grid-column: 3; grid-row: 2; }
.responsive-trial-version-card-body-3       { grid-column: 3; grid-row: 3; }
.responsive-trial-version-card-head-4       { grid-column: 4; grid-row: 1; }
.responsive-trial-version-card-blurb-4      { grid-column: 4; grid-row: 2; }
.responsive-trial-version-card-body-4       { grid-column: 4; grid-row: 3; }
.responsive-trial-version-card-head h3      { color:#000000;  margin: 0px auto; }
.responsive-trial-version-card-blurb br     { content: ""; display: block; margin-bottom: 10px;}
.responsive-trial-version-card-body  ul     { margin-left: 0px !important; margin-bottom: 10px !important; }
.responsive-trial-version-card-cta   hr     { margin-bottom: 30px;  }
.responsive-trial-version-card-singleton .responsive-trial-version-card-body  { border-bottom: 1px solid #C0C0C0; margin-bottom: 30px;}
.responsive-trial-version-card-cta.uvance-red     a       { background: #EA0000; color: #FFFFFF; padding: 10px 20px; }
.responsive-trial-version-card-cta.uvance-emerald a       { background: #008224; color: #FFFFFF; padding: 10px 20px; }
.responsive-trial-version-card-cta.uvance-blue    a       { background: #2400B0; color: #FFFFFF; padding: 10px 20px; }
.responsive-trial-version-card-cta.uvance-orange  a       { background: #F75100; color: #FFFFFF; padding: 10px 20px; }
.responsive-trial-version-card-cta.uvance-red     a:hover { background: #D80084; color: #FFFFFF; padding: 10px 20px; box-shadow: 5px 5px 5px 0px #A0A0A0;  }
.responsive-trial-version-card-cta.uvance-emerald a:hover { background: #61D600; color: #000000; padding: 10px 20px; box-shadow: 5px 5px 5px 0px #A0A0A0;  }
.responsive-trial-version-card-cta.uvance-blue    a:hover { background: #00E7Ef; color: #000000; padding: 10px 20px; box-shadow: 5px 5px 5px 0px #A0A0A0;  }
.responsive-trial-version-card-cta.uvance-orange  a:hover { background: #FFE700; color: #000000; padding: 10px 20px; box-shadow: 5px 5px 5px 0px #A0A0A0;  }

@media only screen and (max-width: 1140px) { .responsive-trial-version-card-wrapper { grid-template-columns: 1fr 1fr; } .responsive-trial-version-card-head-3  { grid-column: 1; grid-row: 5; } .responsive-trial-version-card-blurb-3 { grid-column: 1; grid-row: 6; } .responsive-trial-version-card-body-3  { grid-column: 1; grid-row: 7; } .responsive-trial-version-card-cta-3   { grid-column: 1; grid-row: 8; }.responsive-trial-version-card-head-4  { grid-column: 2; grid-row: 5; } .responsive-trial-version-card-blurb-4 { grid-column: 2; grid-row: 6; } .responsive-trial-version-card-body-4  { grid-column: 2; grid-row: 7; } .responsive-trial-version-card-cta-4  { grid-column: 2; grid-row: 8; } .responsive-trial-version-card-head br { content: ''  !important; } .responsive-trial-version-card-head br:after{content:' ';} }
@media only screen and (max-width: 740px ) { .responsive-trial-version-card-wrapper { grid-template-columns: 1fr;     } .responsive-trial-version-card-head-2  { grid-column: 1; grid-row: 5; } .responsive-trial-version-card-blurb-2 { grid-column: 1; grid-row: 6; } .responsive-trial-version-card-body-2  { grid-column: 1; grid-row: 7; } .responsive-trial-version-card-cta-2  { grid-column: 1; grid-row: 8; } .responsive-trial-version-card-head-3  { grid-column: 1; grid-row: 9; } .responsive-trial-version-card-blurb-3 { grid-column: 1; grid-row: 10; } .responsive-trial-version-card-body-3  { grid-column: 1; grid-row: 11; } .responsive-trial-version-card-cta-3  { grid-column: 1; grid-row: 12; }  .responsive-trial-version-card-head-4  { grid-column: 1; grid-row: 13; } .responsive-trial-version-card-blurb-4 { grid-column: 1; grid-row: 14; } .responsive-trial-version-card-body-4  { grid-column: 1; grid-row: 15; } .responsive-trial-version-card-cta-4  { grid-column: 1; grid-row: 16; }    }

/* (Marcelo 19-04-21) Classes for 'Key Features' webpage */
.feat-heading                     { color: #000000; font-size: 2.0rem; text-align: center; margin-top: 20px; margin-bottom: 20px;  font-family: 'FujitsuInfinityProBold'; }
.feat-heading-text                { color: #000000; margin: 0px auto; padding:10px;  }
.responsive-feat-card-wrapper     { display: grid; display: -ms-grid; grid-template-columns: 1fr 1fr 1fr; -ms-grid-columns: 1fr 1fr 1fr;  margin: 15px auto 40px auto; line-height: 1.4; max-width: 1500px; } /* (Marcelo 20-02-20) IE does not support grid-gap, so we need to use 'margin' where necessary for that purpose */
.responsive-feat-card-image       {                                    text-align: center; margin: 0px 10px; padding: 0px 10px;           }
.responsive-feat-card-title       { color: #000000; font-size: 26px; text-align: center; margin: 0px 10px; padding: 20px 5px; font-family: 'FujitsuInfinityProBold';  }
.responsive-feat-card-desc        { color: #202020; font-size: 16px;                     margin: 0px 10px; padding: 0px 10px 30px 10px; }
.responsive-feat-card-cta         { max-width: fit-content;                   font-size: 14px; background-color: #FFFFFF; padding: 3px 14px; border: 1px solid #303030; margin-top: 15px; margin-left: 10px; }
.responsive-feat-card-cta + .responsive-feat-card-cta { margin-top: 5px; }
.responsive-feat-card-cta a       {                   color: #303030;                                                    }
.responsive-feat-card-cta:hover   { cursor: pointer;  color: #FFFFFF;                         background-color: #303030; }
.responsive-feat-card-cta:hover a {                   color: #FFFFFF;                                                    }
/*.key-features-hr-divider          { margin: 20px; } */
/*.key-features-hr-divider::before  { content: ""; display: block; width: 100%; height: 5px; background: linear-gradient(to right, #00E7Ef 60%, #2400B0 80%); } } */
.key-features-row-odd             { background-color: #e0e0e0; }
.key-features-row-even            { background-color: #ffffff; }
.responsive-feat-card-image-1 { grid-column: 1; grid-row: 1; }
.responsive-feat-card-title-1 { grid-column: 1; grid-row: 2; }
.responsive-feat-card-desc-1  { grid-column: 1; grid-row: 3; }
.responsive-feat-card-image-2 { grid-column: 2; grid-row: 1; }
.responsive-feat-card-title-2 { grid-column: 2; grid-row: 2; }
.responsive-feat-card-desc-2  { grid-column: 2; grid-row: 3; }
.responsive-feat-card-image-3 { grid-column: 3; grid-row: 1; }
.responsive-feat-card-title-3 { grid-column: 3; grid-row: 2; }
.responsive-feat-card-desc-3  { grid-column: 3; grid-row: 3; }
.responsive-feat-card-image-4 { grid-column: 1; grid-row: 4; }
.responsive-feat-card-title-4 { grid-column: 1; grid-row: 5; }
.responsive-feat-card-desc-4  { grid-column: 1; grid-row: 6; }
.responsive-feat-card-image-5 { grid-column: 2; grid-row: 4; }
.responsive-feat-card-title-5 { grid-column: 2; grid-row: 5; }
.responsive-feat-card-desc-5  { grid-column: 2; grid-row: 6; }
.responsive-feat-card-image-6 { grid-column: 3; grid-row: 4; }
.responsive-feat-card-title-6 { grid-column: 3; grid-row: 5; }
.responsive-feat-card-desc-6  { grid-column: 3; grid-row: 6; }
.responsive-feat-card-image-7 { grid-column: 1; grid-row: 7; }
.responsive-feat-card-title-7 { grid-column: 1; grid-row: 8; }
.responsive-feat-card-desc-7  { grid-column: 1; grid-row: 9; }
.responsive-feat-card-image-8 { grid-column: 2; grid-row: 7; }
.responsive-feat-card-title-8 { grid-column: 2; grid-row: 8; }
.responsive-feat-card-desc-8  { grid-column: 2; grid-row: 9; }
.responsive-feat-card-image-9 { grid-column: 3; grid-row: 7; }
.responsive-feat-card-title-9 { grid-column: 3; grid-row: 8; }
.responsive-feat-card-desc-9  { grid-column: 3; grid-row: 9; }

@media (max-width: 830px) { 
.responsive-feat-card-wrapper { grid-template-columns: 1fr; max-width: 600px;  }
.responsive-feat-card-image { border: 1px solid #808080; border-bottom: 0px; padding-top: 20px;}
.responsive-feat-card-title { border: 1px solid #808080; border-bottom: 0px; border-top: 0px; }
.responsive-feat-card-desc  { border: 1px solid #808080;                      border-top: 0px; padding-bottom: 20px; margin-bottom: 20px;}
.responsive-feat-card-image-1 { grid-column: 1; grid-row: 1; }
.responsive-feat-card-title-1 { grid-column: 1; grid-row: 2; }
.responsive-feat-card-desc-1  { grid-column: 1; grid-row: 3; }
.responsive-feat-card-image-2 { grid-column: 1; grid-row: 4; }
.responsive-feat-card-title-2 { grid-column: 1; grid-row: 5; }
.responsive-feat-card-desc-2  { grid-column: 1; grid-row: 6; }
.responsive-feat-card-image-3 { grid-column: 1; grid-row: 7; }
.responsive-feat-card-title-3 { grid-column: 1; grid-row: 8; }
.responsive-feat-card-desc-3  { grid-column: 1; grid-row: 9; }
.responsive-feat-card-image-4 { grid-column: 1; grid-row:10; }
.responsive-feat-card-title-4 { grid-column: 1; grid-row:11; }
.responsive-feat-card-desc-4  { grid-column: 1; grid-row:12; }
.responsive-feat-card-image-5 { grid-column: 1; grid-row:13; }
.responsive-feat-card-title-5 { grid-column: 1; grid-row:14; }
.responsive-feat-card-desc-5  { grid-column: 1; grid-row:15; }
.responsive-feat-card-image-6 { grid-column: 1; grid-row:16; }
.responsive-feat-card-title-6 { grid-column: 1; grid-row:17; }
.responsive-feat-card-desc-6  { grid-column: 1; grid-row:18; }
.responsive-feat-card-image-7 { grid-column: 1; grid-row:19; }
.responsive-feat-card-title-7 { grid-column: 1; grid-row:20; }
.responsive-feat-card-desc-7  { grid-column: 1; grid-row:21; }
.responsive-feat-card-image-8 { grid-column: 1; grid-row:22; }
.responsive-feat-card-title-8 { grid-column: 1; grid-row:23; }
.responsive-feat-card-desc-8  { grid-column: 1; grid-row:24; }
.responsive-feat-card-image-9 { grid-column: 1; grid-row:25; }
.responsive-feat-card-title-9 { grid-column: 1; grid-row:26; }
.responsive-feat-card-desc-9  { grid-column: 1; grid-row:27; }
.responsive-feat-card-cta     { margin-left: 0px;}}

/* Responsive block for 'Key features' page */ /* (Marcelo 20-02-21) */ /* (Marcelo 14-04-21) These variables are also used in reveal-modal classes, for table inside pop-up windows */
 .features-heading                   { height:1px; font-size: 2.0rem; text-align: center; margin-top: 3rem; text-align: center; margin-bottom: 50px; padding: 0px 30px; }
.features-heading-text              { position:relative; top:-2rem; margin: 0px auto; background: #FFFFFF; padding:10px;  display: inline-block; max-width: fit-content; }
.responsive-features-card-wrapper   { display: grid; display: -ms-grid; grid-template-columns: 1fr 1fr 1fr; -ms-grid-columns: 1fr 1fr 1fr; margin-top: 15px; margin-bottom: 15px;                        } /* (Marcelo 20-02-20) IE does not support grid-gap, so we need to use 'margin' where necessary for that purpose */
.responsive-features-card-title     { font-size: 26px;   text-align: center; color: #FFFFFF; padding: 10px;               border-bottom: 0px; border-top-left-radius: 10px; border-top-right-radius: 10px; }
.responsive-features-card-icon      {                    text-align: center;                 padding: 0px 10px;                                                                                            }
.responsive-features-card-icon img  { height: 100px; }
.responsive-features-card-desc      { font-size: 20px;                     color: #000000; padding: 10px 10px 30px 10px; position: relative;                                                              }
.responsive-features-card-cta       { font-size: 18px;                     color: #FFFFFF;  padding: 5px; margin-top: 15px; max-width: fit-content; box-shadow: 5px 5px 3px #A0A0A0;}
.responsive-features-card-cta a     {                                      color: #FFFFFF;                                                                                          }
.responsive-features-card-cta:hover { cursor: pointer;                                                                                              box-shadow: 5px 5px 3px #808080;}
.responsive-features-card-title-1   { grid-column: 1; grid-row: 1; margin: 0px 10px; }
.responsive-features-card-icon-1    { grid-column: 1; grid-row: 2; margin: 0px 10px; }
.responsive-features-card-desc-1    { grid-column: 1; grid-row: 3; margin: 0px 10px; }
.responsive-features-card-title-2   { grid-column: 2; grid-row: 1; margin: 0px 10px; }
.responsive-features-card-icon-2    { grid-column: 2; grid-row: 2; margin: 0px 10px; }
.responsive-features-card-desc-2    { grid-column: 2; grid-row: 3; margin: 0px 10px; }
.responsive-features-card-title-3   { grid-column: 3; grid-row: 1; margin: 0px 10px; }
.responsive-features-card-icon-3    { grid-column: 3; grid-row: 2; margin: 0px 10px; }
.responsive-features-card-desc-3    { grid-column: 3; grid-row: 3; margin: 0px 10px; }
								    
.features-heading-ha                { color: #00293C         ; background: #00293C         ; }
.features-heading-security          { color: #6C2D2C   ; background: #6C2D2C   ; }
.features-heading-performance       { color: #16253D; background: #16253D; }
.features-heading-interop           { color: #9F4636    ; background: #9F4636    ; }
.features-heading-fujitsu           { color: #1B4B5A    ; background: #1B4B5A    ; }

.responsive-features-card-wrapper-ha          .responsive-features-card-title { border: 1px solid  #00293C         ; background-color: #00293C         ;   }
.responsive-features-card-wrapper-security    .responsive-features-card-title { border: 1px solid  #6C2D2C   ; background-color: #6C2D2C   ;   }
.responsive-features-card-wrapper-performance .responsive-features-card-title { border: 1px solid  #16253D; background-color: #16253D;   }
.responsive-features-card-wrapper-interop     .responsive-features-card-title { border: 1px solid  #9F4636    ; background-color: #9F4636    ;   }
.responsive-features-card-wrapper-fujitsu     .responsive-features-card-title { border: 1px solid  #1B4B5A    ; background-color: #1B4B5A    ;   }
.responsive-features-card-wrapper-ha          .responsive-features-card-icon   { border-left: 1px solid #00293C         ; border-right: 1px solid #00293C         ; background: linear-gradient(180deg, #00293C          0%, #00293C          49%, #FFFFFF 50%, #FFFFFF 100%);  }
.responsive-features-card-wrapper-security    .responsive-features-card-icon   { border-left: 1px solid #6C2D2C   ; border-right: 1px solid #6C2D2C   ; background: linear-gradient(180deg, #6C2D2C    0%, #6C2D2C    49%, #FFFFFF 50%, #FFFFFF 100%);  }
.responsive-features-card-wrapper-performance .responsive-features-card-icon   { border-left: 1px solid #16253D; border-right: 1px solid #16253D; background: linear-gradient(180deg, #16253D 0%, #16253D 49%, #FFFFFF 50%, #FFFFFF 100%);  }
.responsive-features-card-wrapper-interop     .responsive-features-card-icon   { border-left: 1px solid #9F4636    ; border-right: 1px solid #9F4636    ; background: linear-gradient(180deg, #9F4636     0%, #9F4636     49%, #FFFFFF 50%, #FFFFFF 100%);  }
.responsive-features-card-wrapper-fujitsu     .responsive-features-card-icon   { border-left: 1px solid #1B4B5A    ; border-right: 1px solid #1B4B5A    ; background: linear-gradient(180deg, #1B4B5A     0%, #1B4B5A     49%, #FFFFFF 50%, #FFFFFF 100%);  }
.responsive-features-card-wrapper-ha          .responsive-features-card-desc   { border: 1px solid  #00293C         ; border-top: 0px; }
.responsive-features-card-wrapper-security    .responsive-features-card-desc   { border: 1px solid  #6C2D2C   ; border-top: 0px; }
.responsive-features-card-wrapper-performance .responsive-features-card-desc   { border: 1px solid  #16253D; border-top: 0px; }
.responsive-features-card-wrapper-interop     .responsive-features-card-desc   { border: 1px solid  #9F4636    ; border-top: 0px; }
.responsive-features-card-wrapper-fujitsu     .responsive-features-card-desc   { border: 1px solid  #1B4B5A    ; border-top: 0px; }
.responsive-features-card-wrapper-ha          .responsive-features-card-cta    { background-color: #00293C         ;   }
.responsive-features-card-wrapper-security    .responsive-features-card-cta    { background-color: #6C2D2C   ;   }
.responsive-features-card-wrapper-performance .responsive-features-card-cta    { background-color: #16253D;   }
.responsive-features-card-wrapper-interop     .responsive-features-card-cta    { background-color: #9F4636    ;   }
.responsive-features-card-wrapper-fujitsu     .responsive-features-card-cta    { background-color: #1B4B5A    ;   }

@media (max-width: 1110px) {
.responsive-features-card-wrapper  {  grid-template-columns: 1fr; -ms-grid-columns: 1fr; width: 80%; margin: 15px auto;}
.responsive-features-card-title-1   { grid-column: 1; grid-row: 1; }
.responsive-features-card-icon-1    { grid-column: 1; grid-row: 2; }
.responsive-features-card-desc-1    { grid-column: 1; grid-row: 3; }
.responsive-features-card-title-2   { grid-column: 1; grid-row: 4; margin-top: 30px; }
.responsive-features-card-icon-2    { grid-column: 1; grid-row: 5; }
.responsive-features-card-desc-2    { grid-column: 1; grid-row: 6; }
.responsive-features-card-title-3   { grid-column: 1; grid-row: 7; margin-top: 30px; }
.responsive-features-card-icon-3    { grid-column: 1; grid-row: 8; }
.responsive-features-card-desc-3    { grid-column: 1; grid-row: 9; }
}

@media (max-width: 900px) { .responsive-features-card-wrapper { width: 90%; margin: 0px auto; } }
@media (max-width: 650px) { .responsive-features-card-wrapper { width: 95%; margin: 0px auto; } }

/* (Marcelo 03-05-22) Classes for 'FEP on Power' webpage */
.feat-fep-on-power-module-band-odd  { background-color: #CE1A41; float: left !important; } /* (Marcelo 03-05-22) We need to set float:left because otherwise it is change to 'none' by layout.min.css when viewport is 767px*/
.feat-fep-on-power-module-band-even { background-color: #B9052C; float: left !important; }
.feat-fep-on-power-section *        { color: #FFFFFF; }
.feat-fep-on-power-heading          { font-size: 2.2rem; text-align: center; margin-top: 20px; margin-bottom: 20px; padding-top: 10px; padding-bottom: 10px;}
.feat-fep-on-power-card-wrapper     { display: grid; grid-template-columns: 1fr 1fr 1fr;  max-width: 1500px; margin: 15px auto 40px auto; padding: 0px 50px; line-height: 1.4;  justify-items: center; text-align: center; } /* (Marcelo 20-02-20) IE does not support grid-gap, so we need to use 'margin' where necessary for that purpose */
.feat-fep-on-power-card-image       {                    width: 90%;                      max-width:  400px; margin: 0px 10px; padding: 15px  0px 10px  0px; border-left: 1px solid #FFFFFF; border-right: 1px solid #FFFFFF; border-top:    1px solid #FFFFFF; }
.feat-fep-on-power-card-title       { font-size: 1.6rem; width: 90%;                      max-width:  400px; margin: 0px 10px; padding: 5px;                 border-left: 1px solid #FFFFFF; border-right: 1px solid #FFFFFF;                                      }
.feat-fep-on-power-card-desc        { font-size: 1.0rem; width: 90%; line-height: 1.6rem; max-width:  400px; margin: 0px 10px; padding: 10px 20px 30px 20px; border-left: 1px solid #FFFFFF; border-right: 1px solid #FFFFFF; border-bottom: 1px solid #FFFFFF;}
.feat-fep-on-power-card-image-1     { grid-column: 1; grid-row: 1; } .feat-fep-on-power-card-title-1 { grid-column: 1; grid-row: 2; } .feat-fep-on-power-card-desc-1 { grid-column: 1; grid-row: 3; }
.feat-fep-on-power-card-image-2     { grid-column: 2; grid-row: 1; } .feat-fep-on-power-card-title-2 { grid-column: 2; grid-row: 2; } .feat-fep-on-power-card-desc-2 { grid-column: 2; grid-row: 3; }
.feat-fep-on-power-card-image-3     { grid-column: 3; grid-row: 1; } .feat-fep-on-power-card-title-3 { grid-column: 3; grid-row: 2; } .feat-fep-on-power-card-desc-3 { grid-column: 3; grid-row: 3; }
@media (max-width: 1400px) { .feat-fep-on-power-card-wrapper { padding: 0px 10px; } }
@media (max-width:  930px) { .feat-fep-on-power-card-title   { font-size: 1.3rem; } }
@media (max-width:  730px) {
.feat-fep-on-power-card-wrapper { display: grid; grid-template-columns: 220px auto; }
.feat-fep-on-power-card-image   {                   width: 100%; padding:  10px 10px 0px 10px; margin-right: 0px; border-right: 0px; }
.feat-fep-on-power-card-title   {                   width: 100%; padding:  10px; margin-right: 0px; border-right: 0px; border-bottom: 1px solid #FFFFFF; margin-bottom: 20px;}
.feat-fep-on-power-card-desc    { max-width: unset; width: 100%; padding: 10px; margin-left:  0px;  border-left: 0px; border-top:    1px solid #FFFFFF; margin-bottom: 20px; text-align: left;}
.feat-fep-on-power-card-image-1 { grid-column: 1; grid-row: 1; } .feat-fep-on-power-card-title-1 { grid-column: 1; grid-row: 2; } .feat-fep-on-power-card-desc-1 { grid-column: 2; grid-row: 1 / span 2; }
.feat-fep-on-power-card-image-2 { grid-column: 1; grid-row: 3; } .feat-fep-on-power-card-title-2 { grid-column: 1; grid-row: 4; } .feat-fep-on-power-card-desc-2 { grid-column: 2; grid-row: 3 / span 2; }
.feat-fep-on-power-card-image-3 { grid-column: 1; grid-row: 5; } .feat-fep-on-power-card-title-3 { grid-column: 1; grid-row: 6; } .feat-fep-on-power-card-desc-3 { grid-column: 2; grid-row: 5 / span 2; }
}
/* Miscellaneous 'FEP on Power' roundels on bottom of page */
.feat-fep-on-power-card-misc-wrapper     { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;      max-width: 1500px; margin: 50px auto 40px auto; padding: 0px 50px; line-height: 1.4;  justify-items: center; text-align: center; } /* (Marcelo 20-02-20) IE does not support grid-gap, so we need to use 'margin' where necessary for that purpose */
.feat-fep-on-power-card-misc-image       {                    width: 90%;                                      max-width:  400px; margin:  0px 10px; padding: 15px  0px 10px  0px; border-left: 1px solid #FFFFFF; border-right: 1px solid #FFFFFF; border-top:    1px solid #FFFFFF; }
.feat-fep-on-power-card-misc-title       { font-size: 1.6rem; color: #B9052C; width: 90%; align-self: center;  max-width:  400px; margin:  0px 10px; padding: 5px;                 border-left: 1px solid #FFFFFF; border-right: 1px solid #FFFFFF;                                      }
.feat-fep-on-power-card-misc-hr          { max-height: 5px; margin-top: 10px; width: 70%;                                         border-top: 3px transparent solid; border-image: linear-gradient(90deg, #EF1D4A 0%, #EF1D4A 40%, #FA5206 60%, #FA5206 100%); border-image-slice: 1; }
.feat-fep-on-power-card-misc-desc        { font-size: 1.0rem; color: #505050; width: 90%; line-height: 1.6rem; max-width:  400px; margin: 0px 10px; padding: 10px 20px 30px 20px; border-left: 1px solid #FFFFFF; border-right: 1px solid #FFFFFF; border-bottom: 1px solid #FFFFFF;}
.feat-fep-on-power-card-misc-image-1     { grid-column: 1; grid-row: 1; } .feat-fep-on-power-card-misc-title-1 { grid-column: 1; grid-row: 2; } .feat-fep-on-power-card-misc-hr-1 { grid-column: 1; grid-row: 3; } .feat-fep-on-power-card-misc-desc-1 { grid-column: 1; grid-row: 4; }
.feat-fep-on-power-card-misc-image-2     { grid-column: 2; grid-row: 1; } .feat-fep-on-power-card-misc-title-2 { grid-column: 2; grid-row: 2; } .feat-fep-on-power-card-misc-hr-2 { grid-column: 2; grid-row: 3; } .feat-fep-on-power-card-misc-desc-2 { grid-column: 2; grid-row: 4; }
.feat-fep-on-power-card-misc-image-3     { grid-column: 3; grid-row: 1; } .feat-fep-on-power-card-misc-title-3 { grid-column: 3; grid-row: 2; } .feat-fep-on-power-card-misc-hr-3 { grid-column: 3; grid-row: 3; } .feat-fep-on-power-card-misc-desc-3 { grid-column: 3; grid-row: 4; }
.feat-fep-on-power-card-misc-image-4     { grid-column: 4; grid-row: 1; } .feat-fep-on-power-card-misc-title-4 { grid-column: 4; grid-row: 2; } .feat-fep-on-power-card-misc-hr-4 { grid-column: 4; grid-row: 3; } .feat-fep-on-power-card-misc-desc-4 { grid-column: 4; grid-row: 4; }
.feat-fep-on-power-card-misc-image-5     { grid-column: 5; grid-row: 1; } .feat-fep-on-power-card-misc-title-5 { grid-column: 5; grid-row: 2; } .feat-fep-on-power-card-misc-hr-5 { grid-column: 5; grid-row: 3; } .feat-fep-on-power-card-misc-desc-5 { grid-column: 5; grid-row: 4; }
.feat-fep-on-power-card-misc-image-6     { grid-column: 6; grid-row: 1; } .feat-fep-on-power-card-misc-title-6 { grid-column: 6; grid-row: 2; } .feat-fep-on-power-card-misc-hr-6 { grid-column: 6; grid-row: 3; } .feat-fep-on-power-card-misc-desc-6 { grid-column: 6; grid-row: 4; }
@media (max-width: 1200px) { .feat-fep-on-power-card-misc-desc { padding: 10px 0px 30px 0px;  } }
@media (max-width: 1300px) { .feat-fep-on-power-card-misc-title { font-size: 1.4rem;  } .feat-fep-on-power-card-misc-wrapper { padding: 0px;} }
@media (max-width:  900px) { .feat-fep-on-power-card-misc-wrapper { grid-template-columns: 1fr 1fr 1fr; }
  .feat-fep-on-power-card-misc-image-1 { grid-column: 1; grid-row: 1; } .feat-fep-on-power-card-misc-title-1 { grid-column: 1; grid-row: 2; } .feat-fep-on-power-card-misc-hr-1 { grid-column: 1; grid-row: 3; } .feat-fep-on-power-card-misc-desc-1 { grid-column: 1; grid-row: 4; }
  .feat-fep-on-power-card-misc-image-2 { grid-column: 2; grid-row: 1; } .feat-fep-on-power-card-misc-title-2 { grid-column: 2; grid-row: 2; } .feat-fep-on-power-card-misc-hr-2 { grid-column: 2; grid-row: 3; } .feat-fep-on-power-card-misc-desc-2 { grid-column: 2; grid-row: 4; }
  .feat-fep-on-power-card-misc-image-3 { grid-column: 3; grid-row: 1; } .feat-fep-on-power-card-misc-title-3 { grid-column: 3; grid-row: 2; } .feat-fep-on-power-card-misc-hr-3 { grid-column: 3; grid-row: 3; } .feat-fep-on-power-card-misc-desc-3 { grid-column: 3; grid-row: 4; }
  .feat-fep-on-power-card-misc-image-4 { grid-column: 1; grid-row: 5; } .feat-fep-on-power-card-misc-title-4 { grid-column: 1; grid-row: 6; } .feat-fep-on-power-card-misc-hr-4 { grid-column: 1; grid-row: 7; } .feat-fep-on-power-card-misc-desc-4 { grid-column: 1; grid-row: 8; }
  .feat-fep-on-power-card-misc-image-5 { grid-column: 2; grid-row: 5; } .feat-fep-on-power-card-misc-title-5 { grid-column: 2; grid-row: 6; } .feat-fep-on-power-card-misc-hr-5 { grid-column: 2; grid-row: 7; } .feat-fep-on-power-card-misc-desc-5 { grid-column: 2; grid-row: 8; }
  .feat-fep-on-power-card-misc-image-6 { grid-column: 3; grid-row: 5; } .feat-fep-on-power-card-misc-title-6 { grid-column: 3; grid-row: 6; } .feat-fep-on-power-card-misc-hr-6 { grid-column: 3; grid-row: 7; } .feat-fep-on-power-card-misc-desc-6 { grid-column: 3; grid-row: 8; }
}

/* (Aya 22-08-23) Classes for 'FEP for Kubernetes' webpage */
.feat-fep-for-k8s-section *        { color: #FFFFFF; }
.feat-fep-for-k8s-heading          { font-size: 2.2rem; text-align: center; margin-top: 20px; margin-bottom: 20px; padding-top: 10px; padding-bottom: 10px;}
.feat-fep-for-k8s-card-wrapper     { display: grid; grid-template-columns: 1fr 1fr 1fr;  max-width: 1500px; margin: 15px auto 20px auto; padding: 0px 50px; line-height: 1.4;  justify-items: center; text-align: center; } /* (Marcelo 20-02-20) IE does not support grid-gap, so we need to use 'margin' where necessary for that purpose */
.feat-fep-for-k8s-card-image       {                    width: 90%;                      max-width:  400px; margin: 0px 10px; padding: 15px  0px 10px  0px; border-left: 1px solid #FFFFFF; border-right: 1px solid #FFFFFF; border-top:    1px solid #FFFFFF; }
.feat-fep-for-k8s-card-title       { font-size: 1.6rem; width: 90%;                      max-width:  400px; margin: 0px 10px; padding: 5px;                 border-left: 1px solid #FFFFFF; border-right: 1px solid #FFFFFF; border-bottom: 1px solid #FFFFFF; }
.feat-fep-for-k8s-card-image-1     { grid-column: 1; grid-row: 1; } .feat-fep-for-k8s-card-title-1 { grid-column: 1; grid-row: 2; } .feat-fep-for-k8s-card-desc-1 { grid-column: 1; grid-row: 3; }
.feat-fep-for-k8s-card-image-2     { grid-column: 2; grid-row: 1; } .feat-fep-for-k8s-card-title-2 { grid-column: 2; grid-row: 2; } .feat-fep-for-k8s-card-desc-2 { grid-column: 2; grid-row: 3; }
.feat-fep-for-k8s-card-image-3     { grid-column: 3; grid-row: 1; } .feat-fep-for-k8s-card-title-3 { grid-column: 3; grid-row: 2; } .feat-fep-for-k8s-card-desc-3 { grid-column: 3; grid-row: 3; }
@media (max-width: 1400px) { .feat-fep-on-power-card-wrapper { padding: 0px 10px; } }
@media (max-width:  930px) { .feat-fep-on-power-card-title   { font-size: 1.3rem; } }
@media (max-width:  730px) {
.feat-fep-for-k8s-card-wrapper { display: grid; grid-template-columns: 1fr 1fr; }
.feat-fep-for-k8s-card-image   {                   width: 100%; padding:  15px; margin-right: 0px; border-right: 0px;border-bottom: 1px solid #FFFFFF; margin-bottom: 20px; display: flex; align-items: center; }
.feat-fep-for-k8s-card-title   {                   width: 100%; padding: 15px; margin-left:  0px;  border-left: 0px; border-top:    1px solid #FFFFFF; margin-bottom: 20px; text-align: left;}
.feat-fep-for-k8s-card-image-1 { grid-column: 1; grid-row: 1; } .feat-fep-for-k8s-card-title-1 { grid-column: 2 / span 2; grid-row: 1; } 
.feat-fep-for-k8s-card-image-2 { grid-column: 1; grid-row: 2; } .feat-fep-for-k8s-card-title-2 { grid-column: 2 / span 2; grid-row: 2; } 
.feat-fep-for-k8s-card-image-3 { grid-column: 1; grid-row: 3; } .feat-fep-for-k8s-card-title-3 { grid-column: 2 / span 2; grid-row: 3; } 
}

/* (Marcelo 29-05-21) Classes for Instructors div in page 'Register for FEP Solution Update session (*IBM TSS)' */
.responsive-instructors-card-wrapper         {  display: grid; grid-template-columns: 1fr 1fr 1fr 1fr 1fr; max-width: 1000px; font-family: FujitsuInfinityPro !important; margin-top: 30px; margin-bottom: 30px;  }
.responsive-instructors-card-wrapper-2-cards {  display: grid; grid-template-columns: 1fr 1fr;             max-width:  500px; font-family: FujitsuInfinityPro !important; margin-top: 30px; margin-bottom: 30px;  }
.responsive-instructors-card-image   {  text-align: center;}
.responsive-instructors-card-name    { font-size: 22px; color: #F75100; text-align: center; padding: 0px 0px; }
.responsive-instructors-card-title   { font-size: 90%;  color: #404040; text-align: center; padding: 0px 0px; }
.responsive-instructors-card-image-1 { grid-column: 1; grid-row: 1; margin: 0px 10px; }
.responsive-instructors-card-name-1  { grid-column: 1; grid-row: 2; margin: 0px 10px; }
.responsive-instructors-card-title-1 { grid-column: 1; grid-row: 3; margin: 0px 10px; }
.responsive-instructors-card-image-2 { grid-column: 2; grid-row: 1; margin: 0px 10px; }
.responsive-instructors-card-name-2  { grid-column: 2; grid-row: 2; margin: 0px 10px; }
.responsive-instructors-card-title-2 { grid-column: 2; grid-row: 3; margin: 0px 10px; }
.responsive-instructors-card-image-3 { grid-column: 3; grid-row: 1; margin: 0px 10px; }
.responsive-instructors-card-name-3  { grid-column: 3; grid-row: 2; margin: 0px 10px; }
.responsive-instructors-card-title-3 { grid-column: 3; grid-row: 3; margin: 0px 10px; }
.responsive-instructors-card-image-4 { grid-column: 4; grid-row: 1; margin: 0px 10px; }
.responsive-instructors-card-name-4  { grid-column: 4; grid-row: 2; margin: 0px 10px; }
.responsive-instructors-card-title-4 { grid-column: 4; grid-row: 3; margin: 0px 10px; }
.responsive-instructors-card-image-5 { grid-column: 5; grid-row: 1; margin: 0px 10px; }
.responsive-instructors-card-name-5  { grid-column: 5; grid-row: 2; margin: 0px 10px; }
.responsive-instructors-card-title-5 { grid-column: 5; grid-row: 3; margin: 0px 10px; }

.responsive-instructors-gallery-only-show-if-viewport-768-or-greater { display: block !important; }
.responsive-instructors-gallery-only-show-if-viewport-less-than-768  { display: none  !important; }

@media (max-width: 768px) { 
  .responsive-instructors-gallery-only-show-if-viewport-768-or-greater { display: none !important;  }
  .responsive-instructors-gallery-only-show-if-viewport-less-than-768  { display: block !important; }
}

/* Responsive block text+button+image and image+text+button */  /* (Marcelo 24-03-20) Added to rearrange elements in the TDE, DM and DAL blocks in the 'Enhanced Data Security' page */
.responsive-text-btn-img-wrapper { display: grid;  display: -ms-grid;                                                            } 
.responsive-text-btn-img-text    { grid-column: 1; grid-row: 1;     margin-top: 10px;   -ms-grid-column: 1; -ms-grid-row: 1;     }
.responsive-text-btn-img-button  { grid-column: 1; grid-row: 2;                         -ms-grid-column: 1; -ms-grid-row: 2;     }
.responsive-text-btn-img-image   { grid-column: 2; grid-row: 1 / 3; margin-left: 30px;  -ms-grid-column: 2; -ms-grid-row: 1 / 3; } /* (Marcelo 25-03-20) IE does not support grid-gap, so we need to use 'margin' where necessary for that purpose */
.responsive-img-text-btn-wrapper { display: grid;  display: -ms-grid;                                                            } 

/* Resources pages */
.resource-card                        { margin-top: 10px; padding: 10px; border: 1px solid #C0C0C0;  background: #F2F2F2; min-height: 380px; }

/* Responsive block text+button+image and image+text+button */  /* (Marcelo 24-03-20) Added to rearrange elements in the TDE, DM and DAL blocks in the 'Enhanced Data Security' page */
.responsive-text-btn-img-wrapper { display: grid;  display: -ms-grid;                                                            } 
.responsive-text-btn-img-text    { grid-column: 1; grid-row: 1;     margin-top: 10px;   -ms-grid-column: 1; -ms-grid-row: 1;     }
.responsive-text-btn-img-button  { grid-column: 1; grid-row: 2;                         -ms-grid-column: 1; -ms-grid-row: 2;     }
.responsive-text-btn-img-image   { grid-column: 2; grid-row: 1 / 3; margin-left: 30px;  -ms-grid-column: 2; -ms-grid-row: 1 / 3; } /* (Marcelo 25-03-20) IE does not support grid-gap, so we need to use 'margin' where necessary for that purpose */
.responsive-img-text-btn-wrapper { display: grid;  display: -ms-grid;                                                            } 
.responsive-img-text-btn-image   { grid-column: 1; grid-row: 1 / 3; margin-right: 30px; -ms-grid-column: 1; -ms-grid-row: 1 / 3; } /* (Marcelo 25-03-20) IE does not support grid-gap, so we need to use 'margin' where necessary for that purpose */
.responsive-img-text-btn-text    { grid-column: 2 ;grid-row: 1;     margin-top: 10px;   -ms-grid-column: 2 ;-ms-grid-row: 1;     }
.responsive-img-text-btn-button  { grid-column: 2; grid-row: 2;                          -ms-grid-column: 2; -ms-grid-row: 2;    }
@media only screen and (max-width: 1200px) {                                                          /* (Marcelo 24-03-20) Added to rearrange elements in the TDE, DM and DAL blocks in the 'Enhanced Data Security' page */
  .responsive-text-btn-img-wrapper { grid-gap: 0px;                                                                         }
  .responsive-text-btn-img-text    { grid-column: 1; grid-row: 1;                      -ms-grid-column: 1; -ms-grid-row: 1; }
  .responsive-text-btn-img-image   { grid-column: 1; grid-row: 2; margin-left: 0px;    -ms-grid-column: 1; -ms-grid-row: 2; }
  .responsive-text-btn-img-button  { grid-column: 1; grid-row: 3; text-align: center;  -ms-grid-column: 1; -ms-grid-row: 3; }
  .responsive-img-text-btn-wrapper { grid-gap: 0px;                                                                         }
  .responsive-img-text-btn-text    { grid-column: 1; grid-row: 1;                      -ms-grid-column: 1; -ms-grid-row: 1; }
  .responsive-img-text-btn-image   { grid-column: 1; grid-row: 2; margin-right: 0px;   -ms-grid-column: 1; -ms-grid-row: 2; }
  .responsive-img-text-btn-button  { grid-column: 1; grid-row: 3; text-align: center;  -ms-grid-column: 1; -ms-grid-row: 3; }
}

/* Resource cards */                                                                                           /* (Marcelo 25-03-20) Added to rearrange elements in cards in 'Resource Centre' page */
                .responsive-resource-card-section-gray     { background-color: #E8E8E8; padding-top: 30px; padding-bottom: 20px;} /* (Marcelo 28-03-20) Left and right padding are set by .page-center, which is also applied to sections using this class */
                .responsive-resource-card-section-white    { background-color: #FFFFFF; padding-top: 30px; padding-bottom: 20px;} /* (Marcelo 28-03-20) Left and right padding are set by .page-center, which is also applied to sections using this class */
                .responsive-resource-card-section-gray  h2 { padding-left: 10px; } /* (Marcelo 18-01-23) */
                .responsive-resource-card-section-white h2 { padding-left: 10px; } 
                .responsive-resource-card-wrapper        { display: grid; grid-template-columns: 1fr 1fr 1fr; -ms-grid-columns: 1fr 1fr 1fr; margin-top: 15px; margin-bottom: 15px; } /* (Marcelo 25-03-20) IE does not support grid-gap, so we need to use 'margin' where necessary for that purpose */
                .responsive-resource-card-title          { font-size: 22px; color: #EA0000; background-color: #F8F8F8; padding: 10px 10px  5px 10px; border-top: 10px solid #EA0000; border-bottom: 0px; }
.uvance         .responsive-resource-card-title          {                  color: #F75100; background-color: #F8F8F8; padding: 10px 10px  5px 10px; border-top: 10px solid #FF8000; border-bottom: 0px; }
.uvance-blue    .responsive-resource-card-title          {                  color: #2400B0; background-color: #F8F8F8; padding: 10px 10px  5px 10px; border-top: 10px solid #2400B0; border-bottom: 0px; } 
.uvance-emerald .responsive-resource-card-title          {                  color: #008224; background-color: #F8F8F8; padding: 10px 10px  5px 10px; border-top: 10px solid #008224; border-bottom: 0px; } /* (Marcelo 05-02-22) Initially added for webpage 'FEP Operator FAQ' */
.uvance-red     .responsive-resource-card-title          {                  color: #EA0000; background-color: #F8F8F8; padding: 10px 10px  5px 10px; border-top: 10px solid #EA0000; border-bottom: 0px; } /* (Marcelo 05-02-22) Initially added for webpage 'FEP Operator FAQ' */
                .responsive-resource-card-title-blue     { font-size: 22px; color: #2400B0; background-color: #F8F8F8; padding: 10px 10px  5px 10px; border-top: 10px solid #2400B0; border-bottom: 0px; } /* (Marcelo 05-04-21) Added for card 'Fujitsu Support Engineering' page on bottom of 'FEP on IBM' page */
                .responsive-resource-card-title-red      { font-size: 22px; color: #EA0000; background-color: #F8F8F8; padding: 10px 10px  5px 10px; border-top: 10px solid #EA0000; border-bottom: 0px; } /* (Marcelo 06-12-21) Initially added for webpage 'FEP on Z - Modinierxation' */
                .responsive-resource-card-text           { font-size: 18px; color: #444444; background-color: #F8F8F8; padding: 10px 10px 30px 10px; border-top: 0px; position: relative; border-bottom-left-radius: 4px; border-bottom-right-radius: 4px; }
                .responsive-resource-card-cta            { font-size: 16px;                    padding:  3px 10px;                            position: absolute; bottom: 10px;                                 }
                .responsive-resource-card-cta-inactive   { font-size: 16px;                   border: 1px solid #D0D0D0; padding:  3px 10px;                            position: absolute; bottom: 10px;                                 }
                .responsive-resource-card-cta-hs         { font-size: 16px;                   border: 0px;                  padding:  3px  0px;                           position: absolute; bottom: 10px;                                                    } /* (Marcelo 23-04-20) Added for page 'Off-site Training - resources', where the div will contain an actual HubSpot CTA */
                .responsive-resource-card-image          { border: 1px solid #A0A0A0; box-shadow: 4px 4px 4px #EAEAEA, -4px -4px 4px #EAEAEA, 4px -4px 4px #EAEAEA, -4px 4px 4px #EAEAEA; }
                .responsive-resource-card-image-thumb-ppt{ margin-left: 20px; }  /* (Marcelo 23-06-21) Added for IBM TSS Enablement materials page */
                .responsive-resource-card-title-1        { grid-column: 1; grid-row: 1; margin: 0px 10px;   -ms-grid-column: 1; -ms-grid-row: 1; }
                .responsive-resource-card-text-1         { grid-column: 1; grid-row: 2; margin: 0px 10px;   -ms-grid-column: 1; -ms-grid-row: 2; }
                .responsive-resource-card-title-2        { grid-column: 2; grid-row: 1; margin: 0px 10px;   -ms-grid-column: 2; -ms-grid-row: 1; }
                .responsive-resource-card-text-2         { grid-column: 2; grid-row: 2; margin: 0px 10px;   -ms-grid-column: 2; -ms-grid-row: 2; }
                .responsive-resource-card-title-3        { grid-column: 3; grid-row: 1; margin: 0px 10px;   -ms-grid-column: 3; -ms-grid-row: 1; }
                .responsive-resource-card-text-3         { grid-column: 3; grid-row: 2; margin: 0px 10px;   -ms-grid-column: 3; -ms-grid-row: 2; }
                .responsive-resource-card-section-gray  .responsive-resource-card-title { background: #FFFFFF; background: -webkit-linear-gradient(to right, #FFFFFF, #F3F3F3); background: linear-gradient(to right, #FFFFFF, #F3F3F3); }
                .responsive-resource-card-section-gray  .responsive-resource-card-text  { background: #FFFFFF; background: -webkit-linear-gradient(to right, #FFFFFF, #F3F3F3); background: linear-gradient(to right, #FFFFFF, #F3F3F3); }
                .responsive-resource-card-section-white .responsive-resource-card-title { background-color: #F3F3F3; }
                .responsive-resource-card-section-white .responsive-resource-card-text  { background-color: #F3F3F3; }
                .responsive-resource-card-cta          { background-color: #EA0000 !important; color: #FFFFFF !important;  } /* (Marcelo 01-09-20) I added !important to background-color and color to cater for CTAs added using this class(see 'Resource Center' page */
                .responsive-resource-card-cta a        { background-color: #EA0000 !important; color: #FFFFFF !important;  letter-spacing: unset;          } /* (Marcelo 01-09-20) I added !important to background-color and color to cater for CTAs added using this class(see 'Resource Center' page */
.uvance-blue    .responsive-resource-card-cta          { background-color: #2400B0 !important; color: #FFFFFF !important;  } /* (Marcelo 01-09-20) I added !important to background-color and color to cater for CTAs added using this class(see 'Resource Center' page */
.uvance-blue    .responsive-resource-card-cta a        { background-color: #2400B0 !important; color: #FFFFFF !important;  letter-spacing: unset;          } /* (Marcelo 01-09-20) I added !important to background-color and color to cater for CTAs added using this class(see 'Resource Center' page */
.uvance-emerald .responsive-resource-card-cta          { background-color: #008224 !important; color: #FFFFFF !important; } /* (Marcelo 01-09-20) I added !important to background-color and color to cater for CTAs added using this class(see 'Resource Center' page */
.uvance-emerald .responsive-resource-card-cta a        { background-color: #008224 !important; color: #FFFFFF !important;  letter-spacing: unset;          } /* (Marcelo 01-09-20) I added !important to background-color and color to cater for CTAs added using this class(see 'Resource Center' page */
                .responsive-resource-card-cta-hs       { box-shadow: 4px 4px 3px #E0E0E0; } /* (Marcelo 23-04-20) Added for page 'Off-site Training - resources', where the div will contain an actual HubSpot CTA */
                .responsive-resource-card-cta:hover    { background-color: #A00712 !important; color: #FFFFFF !important; cursor: pointer;  } /* (Marcelo 01-09-20) I added !important to background-color and color to cater for CTAs added using this class(see 'Resource Center' page */
                .responsive-resource-card-cta:hover  a { background-color: #A00712 !important; color: #FFFFFF !important;                   }
.uvance-blue    .responsive-resource-card-cta:hover    { background-color: #2400B0 !important; color: #FFFFFF !important; cursor: pointer;  }
.uvance-blue    .responsive-resource-card-cta:hover  a { background-color: #2400B0 !important; color: #FFFFFF !important;               
   }
.uvance-emerald .responsive-resource-card-cta:hover    { background-color: #008224 !important; color: #FFFFFF !important; cursor: pointer;  }
.uvance-emerald .responsive-resource-card-cta:hover  a { background-color: #008224 !important; color: #FFFFFF !important;        }
                .responsive-resource-card-cta-inactive      { background-color: #E0E0E0 !important; color: #404040 !important; box-shadow: 4px 4px 3px #E0E0E0; }
                .responsive-resource-card-cta-inactive a    {                                       color: #404040 !important;                                  }
.responsive-resource-card-wrapper .hs-video-widget ~ p { margin-top: 10px; margin-bottom: -10px !important;}

.responsive-resource-card-image:hover           { box-shadow: 4px 4px 4px #C0C0C0, -4px -4px 4px #C0C0C0, 4px -4px 4px #C0C0C0, -4px 4px 4px #C0C0C0; } 
.responsive-resource-card-image-thumb-ppt:hover,
.responsive-resource-card-image-thumb-doc:hover { filter: saturate(var(--value, 1.5)); }  /* (Marcelo 23-06-21) Added for IBM TSS Enablement materials page */

@media only screen and (max-width: 1500px) {
  .responsive-resource-card-image-thumb-ppt { width: 280px !important; }
}

@media only screen and (max-width: 1400px) {
  .responsive-resource-card-image   { width: 120px !important; }
  .responsive-resource-card-image-thumb-ppt { width: 200px !important; }
}
 @media only screen and (max-width: 1100px) {
  .responsive-resource-card-image   { display: none; }
    .responsive-resource-card-image-thumb-ppt { display: block !important; float: none !important; margin: 10px auto; width: 95% !important; }
    .responsive-resource-card-image-thumb-doc { display: block !important; float: none !important; margin: 10px auto;  }

}
@media only screen and (max-width: 750px) {
  .responsive-resource-card-wrapper { grid-template-columns: 1fr; -ms-grid-columns: 1fr;                                  }
  .responsive-resource-card-title-1 { grid-column: 1; grid-row: 1; margin: 0px; -ms-grid-column: 1; -ms-grid-row: 1; }
  .responsive-resource-card-text-1  { grid-column: 1; grid-row: 2; margin: 0px; -ms-grid-column: 1; -ms-grid-row: 2; }
  .responsive-resource-card-title-2 { grid-column: 1; grid-row: 3; margin: 0px; -ms-grid-column: 1; -ms-grid-row: 3; margin-top: 10px; }
  .responsive-resource-card-text-2  { grid-column: 1; grid-row: 4; margin: 0px; -ms-grid-column: 1; -ms-grid-row: 4; }
  .responsive-resource-card-title-3 { grid-column: 1; grid-row: 5; margin: 0px; -ms-grid-column: 1; -ms-grid-row: 5; margin-top: 10px; }
  .responsive-resource-card-text-3  { grid-column: 1; grid-row: 6; margin: 0px; -ms-grid-column: 1; -ms-grid-row: 6; }
  .responsive-resource-card-image   { display: inline; width: 120px !important; margin: 0px 10px !important; }
  .responsive-resource-card-section-white { padding-top: 0px; }
  .responsive-resource-card-section-gray { padding-top: 0px; }
  .responsive-resource-card-image-thumb-ppt { width: 300px !important; }
 
}

/* Card color variations  */ /* ('; }
.simple-faq-wrapper .legend-text                       { color: #606060; margin-left: 20px !important ; }
.simple-faq-wrapper .sub-heading1                      { font-family:FujitsuInfinityProBold !important; border-bottom: 1px solid #A0A0A0; }
.simple-faq-wrapper .sub-heading2                      { font-family:FujitsuInfinityProBold !important; border-bottom: 1px solid #C0C0C0; color: #606060; }
.simple-faq-wrapper .indent1                           { margin-left: 10px !important; }
.simple-faq-wrapper  pre.normal-flow                    { white-space: pre-wrap !important; }
.simple-faq-wrapper .mono            , .how-to .mono            { font-size: 100%; }
.simple-faq-wrapper .show-syntax     , .how-to .show-syntax     { font-family: monospace !important; font-size: 14px; background-color: #F0F0F0;                 border: 1px solid #b0b0b0; padding: 4px 8px 4px 8px;                   max-width:fit-content; }
.simple-faq-wrapper .show-syntax *   , .how-to .show-syntax *   { font-family: monospace !important; font-size: 14px; }
.simple-faq-wrapper .show-syntax-pre , .how-to .show-syntax-pre { font-family: monospace !important; font-size: 14px; background-color: #F0F0F0;                 border: 1px solid #a0a0a0; padding: 4px 8px 4px 8px; white-space: pre; max-width:fit-content; }
.simple-faq-wrapper .faq-answer pre  , .how-to pre              { font-family: Courier New !important; font-size: 14px; background-color: #303030; color: #FFFFFF !important; border: 1px solid #a0a0a0; padding: 6px 8px 6px 8px; white-space: pre; max-width:fit-content; margin-left: 10px; line-height: 1.4em; }
.simple-faq-wrapper .faq-answer pre *, .how-to pre *            { font-family: Courier New !important; font-size: inherit;                           color: #FFFFFF !important; }
.simple-faq-wrapper  pre .placeholder, .how-to pre .placeholder {                                                                                    color: #FFFFFF !important; }
.simple-faq-wrapper  li pre          , .how-to li pre           { margin-left: 0px; }
.simple-faq-wrapper .screenshot      , .how-to .screenshot      { display: block; margin: 20px auto; border: 1px solid #AAAAAA; }
.simple-faq-wrapper :is(.faq-refer-to,.faq-answer-note)   { display:block; color: #202020; font-size: 16px; line-height: 1.4;  background: #FFE7002E; margin: 20px 0px !important; padding: 8px; border: 1px solid #d0d0d0; max-width: fit-content; }
.simple-faq-wrapper :is(.faq-refer-to,.faq-answer-note) * {                color: #202020; font-size: 16px;; }
.simple-faq-wrapper :is(.faq-refer-to,.faq-answer-note) a {  font-style: italic; }
.simple-faq-wrapper :is(.faq-refer-to,.faq-answer-note) li::marker { color: #808080; font-size: 12px;  }
.simple-faq-wrapper .faq-card:hover .open .faq-title { font-weight: normal !important; }
.simple-faq-wrapper .faq-card:hover       .faq-id    { font-weight: normal;            }
.simple-faq-wrapper .faq-title-row      .faq-title-icon    { height: 28px; margin-right: 10px; }
.simple-faq-wrapper .faq-title-row      .faq-title-icon    { content: url('https://www.postgresql.fastware.com/hubfs/Images/Pictograms/picto-speech-bubble-01-with-question-mark-01-variation-01.svg'); margin-right: 10px !important; }
.simple-faq-wrapper .faq-title-row.open .faq-title-icon    { content: url('https://www.postgresql.fastware.com/hubfs/Images/Pictograms/picto-speech-bubble-01-with-exclamation-point-01-variation-01.svg')}
.simple-faq-wrapper .faq-title-row      .faq-open-collapse { content: url('https://2585850.fs1.hubspotusercontent-na1.net/hubfs/2585850/Images/Icons/icon-faq-open-close-01-variation-01.png'); height: 16px; -webkit-transition: .3s; -o-transition: .3s; transition: .3s; }
.simple-faq-wrapper .faq-title-row.open                    { background:#FFEFD0; border-bottom: 1px solid #c0c0c0;}
.simple-faq-wrapper .faq-title-row.open .faq-open-collapse { -webkit-transform: rotate(90deg); -ms-transform: rotate(90deg); transform: rotate(90deg); }
.simple-faq-wrapper .faq-answer-prod-info            { margin-top: 30px !important; }
.simple-faq-wrapper .faq-answer-prod-info,
.simple-faq-wrapper  h2.faq-answer-prod-info~p       { font-size: 85%; color: #404040; margin: 5px 0px;  }
.simple-faq-wrapper  pre .syntax-neutral , .how-to pre .syntax-neutral  { color: #404040 !important; }
.simple-faq-wrapper  pre .syntax-neutral2, .how-to pre .syntax-neutral2 { color: #404040 !important; }
.simple-faq-wrapper  pre .syntax-neutral3, .how-to pre .syntax-neutral3 { color: #404040 !important; }
.simple-faq-wrapper  pre .syntax-neutral4, .how-to pre .syntax-neutral4 { color: #404040 !important; }
.simple-faq-wrapper  pre .syntax-neutral5, .how-to pre .syntax-neutral5 { color: #404040 !important; }
.simple-faq-wrapper .faq-answer-section-applic       { background: #c7c4ab3b;  margin-top: 0px !important; padding: 5px 10px; max-width: fit-content; }
.simple-faq-wrapper .faq-answer-section-applic h2    { color: #202020; margin: 0px 0px 5px 0px;  }
.simple-faq-wrapper .faq-answer-section-applic p     { margin: 0px; }
.simple-faq-wrapper .faq-answer-section-applic td    { padding-right: 10px; }
.simple-faq-wrapper .faq-answer-section-applic table { max-width: fit-content; }
.simple-faq-wrapper .faq-answer-section-applic *     { font-size: 14px !important;}
.simple-faq-wrapper .faq-answer-reference   { background: #FFE7002E; border: 3px solid #FFE7002E }
.simple-faq-answer                          { counter-reset:counter-faq-h1; }
.simple-faq-wrapper  h1                     { counter-reset:counter-faq-h2; }
.simple-faq-wrapper .faq-answer-h1::before  { content: counter(counter-faq-h1)'. '; }
.simple-faq-wrapper .faq-answer-h2::before  { content: counter(counter-faq-h1)'.'counter(counter-faq-h2)'. '; }
.simple-faq-wrapper .faq-lvl1.closed        { overflow: hidden; display: none; }
.simple-faq-wrapper .faq-lvl2.closed        { overflow: hidden; display: none; }
.simple-faq-wrapper p.faq-answer-subheading { font-family: 'FujitsuInfinityProExtraBold' !important; font-size:  90%; }
.simple-faq-wrapper p.faq-answer-h1         { font-family: 'FujitsuInfinityProExtraBold' !important; font-size:  90%; counter-increment: counter-faq-h1; margin-left: 1.1em; text-indent: -1.1em;  }
.simple-faq-wrapper p.faq-answer-h2         { font-family: 'FujitsuInfinityProBold'      !important; font-size: 100%; counter-increment: counter-faq-h2; margin-left: 1.6em; text-indent: -1.6em;   }
.simple-faq-wrapper .faq-answer-h1 img      { content: url('https://2585850.fs1.hubspotusercontent-na1.net/hubfs/2585850/Images/Icons/icon-cheat-sheet-heading-open-close-01.svg'); height: 16px; -webkit-transition: .3s; -o-transition: .3s; transition: .3s; margin-left: 5px; margin-bottom: 5px; }
.simple-faq-wrapper .faq-answer-h1.closed img.heading-open-collapse { -webkit-transform: rotate(-90deg); -ms-transform: rotate(-90deg); transform: rotate(-90deg);  }
.simple-faq-wrapper .faq-answer-h2 img     { content: url('https://2585850.fs1.hubspotusercontent-na1.net/hubfs/2585850/Images/Icons/icon-cheat-sheet-heading-open-close-01.svg'); height: 16px; -webkit-transition: .3s; -o-transition: .3s; transition: .3s; margin-left: 5px; margin-bottom: 5px; }
.simple-faq-wrapper .faq-answer-h2.closed img.heading-open-collapse { -webkit-transform: rotate(-90deg); -ms-transform: rotate(-90deg); transform: rotate(-90deg);  }

.faq-lvl1 { margin-left: 1em;}
.faq-lvl2 { margin-left: 1.5em; }
.faq-answer .table-list                   { margin-left: 30px;}
.faq-answer .table-list td                { padding: 0px }
.faq-answer .table-list td:first-of-type  { display: list-item; list-style-type: disc; }
.faq-answer .table-list td::marker        { color: #F75100 !important; font-size: 110% ; } 
.faq-answer .table-list td:nth-of-type(2) { padding-top: 0.0em; padding-left: 1em; }
.faq-filter.faq-ver-14, .faq-filter.faq-ver-13, .faq-filter.faq-plat-z, .faq-filter.faq-plat-pwr, .faq-filter.faq-os-suse, .faq-filter.faq-os-win  { display: none; } /* (Marcelo 26-05-23) Used in webpage 'Cheat sheets' */
.faq-editing        .faq-answer { display: block; }  /* (Marcelo 28-07-21) Only used during editing, to add formatting and hyperliks */
.faq-warning                    { color: #000000; font-size: 120% ;  }
.gui-item              { font-family:FujitsuInfinityProBold       !important; color: #505050; }
.gui-value             { font-family:FujitsuInfinityProBoldItalic !important; color: #505050; }
.kb-article .gui-value { color: #344e99; } /* (Marcelo 13-04-22) Initially added for KB article 'How to - Installing the Prometheus adapter' */

/* 'curric' classes are used for 'Training - Curriculum'  webpage and 'Advisory consulting service' webpage */
#curric-course-01  .curric-answer { background-image: url('https://www.postgresql.fastware.com/hubfs/Images/Badges/img-badge-database-orange-01.svg'); }
#curric-course-02  .curric-answer { background-image: url('https://www.postgresql.fastware.com/hubfs/Images/Badges/img-badge-star-orange-01.svg'); }
#curric-course-03  .curric-answer { background-image: url('https://www.postgresql.fastware.com/hubfs/Images/Badges/img-badge-gear-orange-01.svg'); }
#curric-course-04  .curric-answer { background-image: url('https://www.postgresql.fastware.com/hubfs/Images/Badges/img-badge-laptop-showing-sql-orange-01.svg'); }
#adv-svc-01        .curric-answer { background-image: url('https://www.postgresql.fastware.com/hubfs/Images/Badges/img-badge-arrow-with-road-lines-01.svg'); }
#adv-svc-02        .curric-answer { background-image: url('https://www.postgresql.fastware.com/hubfs/Images/Badges/img-badge-file-with-security-lock-02.svg'); }
#adv-svc-03        .curric-answer { background-image: url('https://www.postgresql.fastware.com/hubfs/Images/Badges/img-badge-diverging-arrows-04.svg'); }
#adv-svc-04        .curric-answer { background-image: url('https://www.postgresql.fastware.com/hubfs/Images/Badges/img-badge-paper-clip-02.svg'); }
#adv-svc-05        .curric-answer { background-image: url('https://www.postgresql.fastware.com/hubfs/Images/Badges/img-badge-clipboard-with-check-mark-02.svg'); }
#adv-svc-06        .curric-answer { background-image: url('https://www.postgresql.fastware.com/hubfs/Images/Badges/img-badge-eye-02.svg'); }
#adv-svc-07        .curric-answer { background-image: url('https://www.postgresql.fastware.com/hubfs/Images/Badges/img-badge-cloud-with-layers-01.svg'); }
#adv-svc-08        .curric-answer { background-image: url('https://www.postgresql.fastware.com/hubfs/Images/Badges/img-badge-cube-with-arrow-03.svg'); }
#curric-course-01  .curric-title  { background: #FEDC01;  }
#curric-course-02  .curric-title  { background: #FFB301;  }
#curric-course-03  .curric-title  { background: #FF9F01;  }
#curric-course-04  .curric-title  { background: #FB7301;  }
.adv-svc-list                     { background: #EFEFEF; }
.adv-svc-wrapper   .curric-title  { background: #FFB301; font-family: 'FujitsuInfinityProBold';  }
.adv-svc-wrapper   .adv-svc-tagl  { font-family: 'FujitsuInfinityProBold'; font-size: 110% !important; max-width: calc(100% - 120px);  }
.adv-svc-wrapper   .adv-svc-desc  { max-width: calc(100% - 120px); }

.curric-course-title        .curric-open-collapse { content: url('https://www.postgresql.fastware.com/hubfs/Images/Icons/icon-curric-open-close-01.png'); height: 16px; margin-left: 10px; margin-bottom: 5px; -webkit-transition: .3s; -o-transition: .3s; transition: .3s; }
.curric-course-title.closed                       { background:#FFEFD0; border-bottom: 1px solid #c0c0c0;}
.curric-course-title.closed .curric-open-collapse { -webkit-transform: rotate(-90deg); -ms-transform: rotate(-90deg); transform: rotate(-90deg); }

/* Classes used in webpage 'Training - On-demand - Curriculum' */
                 .curric-wrapper                              { margin-top: 40px; }
.adv-svc-wrapper .curric-wrapper                              { max-width: 500px; grid-template-columns: 1fr 1fr; margin: 20px ; } 
                 .curric-wrapper.adv-svc-wrapper              { margin-top: 0px; }
                 .curric-open-collapse                        { text-align: right !important ; }
                 .curric-card                                 { background: #f8f8f8; height: 100%;}
.adv-svc-wrapper .curric-card                                 { background: #FFFFFF; height: 100%;}
                 .curric-answer                               { background-repeat: no-repeat; background-size: 120px; background-position: right 0px top 0px;  }
.adv-svc-wrapper .curric-answer                               { background-size: 110px; background-position: right 10px top 0px;   }
                 .curric-section-wrapper                      { max-width: 1200px; margin: 0px auto ; padding: 10px 0.3em 60px 0.3em;}
.adv-svc-wrapper .curric-section-wrapper                      { display: grid; grid-template-columns: 1fr 1fr; }
                 .curric-wrapper .curric-title-row            { background: #FFFFFF; padding: 1em 0.5em; cursor: pointer; display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;-webkit-box-pack: justify;-ms-flex-pack: justify;justify-content: space-between;}
                 .curric-wrapper .curric-title                { font-size: 18px; color: #000000; width: 100%;  margin-top: 20px; padding: 10px; user-select: none;  }
                 .curric-wrapper .curric-answer               { padding: 0em 0.8em 1em 0.8em; margin-top: 10px; display: block; }
                 .curric-wrapper .curric-answer *             { color: #000000;font-size: 16px;}
                 .curric-wrapper .curric-answer ul            { margin: 0px 10px; padding-left: 20px; line-height: 1.6em; }
                 .curric-wrapper .curric-answer ul li::marker { color: #F75100; font-size: 130%; }
                 .curric-wrapper .curric-answer .list-compact { line-height: 1.1em; }
                 .curric-wrapper .curric-answer ul li         { list-style: disc; }
                 .curric-wrapper .curric-answer p             { margin: 15px 0px; }
                 .curric-wrapper .curric-title-row      .curric-title-icon    { height: 28px; margin-right: 10px; }
                 .curric-wrapper .curric-title-row      .curric-title-icon    { content: url('https://www.postgresql.fastware.com/hubfs/Images/Pictograms/picto-speech-bubble-01-with-question-mark-01-variation-01.svg'); margin-right: 10px !important; }
                 .curric-wrapper .curric-title-row.open .curric-title-icon    { content: url('https://www.postgresql.fastware.com/hubfs/Images/Pictograms/picto-speech-bubble-01-with-exclamation-point-01-variation-01.svg')}
                 .curric-wrapper .curric-title-row      .curric-open-collapse { content: url('https://2585850.fs1.hubspotusercontent-na1.net/hubfs/2585850/Images/Icons/icon-curric-open-close-01-variation-01.png'); height: 16px; -webkit-transition: .3s; -o-transition: .3s; transition: .3s; }
                 .curric-wrapper .curric-title-row.open                    { background:#FFEFD0; border-bottom: 1px solid #c0c0c0;}
                 .curric-wrapper .curric-title-row.open .curric-open-collapse { -webkit-transform: rotate(90deg); -ms-transform: rotate(90deg); transform: rotate(90deg); }
                 .curric-wrapper .curric-lvl1.closed        { overflow: hidden; display: none; }
                 .curric-wrapper .curric-lvl2.closed        { overflow: hidden; display: none; }
                 .curric-wrapper p.curric-answer-subheading { font-family: 'FujitsuInfinityProExtraBold' !important; font-size:  90%; }
                 .curric-wrapper p.curric-answer-h1         { font-family: 'FujitsuInfinityProExtraBold' !important; font-size:  90%; counter-increment: counter-curric-h1; margin-left: 1.1em; text-indent: -1.1em;  }
                 .curric-wrapper p.curric-answer-h2         { font-family: 'FujitsuInfinityProBold'      !important; font-size: 100%; counter-increment: counter-curric-h2; margin-left: 1.6em; text-indent: -1.6em;   }
                 .curric-wrapper .curric-answer-h1 img      { content: url('https://2585850.fs1.hubspotusercontent-na1.net/hubfs/2585850/Images/Icons/icon-cheat-sheet-heading-open-close-01.svg'); height: 16px; -webkit-transition: .3s; -o-transition: .3s; transition: .3s; margin-left: 5px; margin-bottom: 5px; }
                 .curric-wrapper .curric-answer-h1.closed img.heading-open-collapse { -webkit-transform: rotate(-90deg); -ms-transform: rotate(-90deg); transform: rotate(-90deg);  }
                 .curric-wrapper .curric-answer-h2 img     { content: url('https://2585850.fs1.hubspotusercontent-na1.net/hubfs/2585850/Images/Icons/icon-cheat-sheet-heading-open-close-01.svg'); height: 16px; -webkit-transition: .3s; -o-transition: .3s; transition: .3s; margin-left: 5px; margin-bottom: 5px; }
                 .curric-wrapper .curric-answer-h2.closed img.heading-open-collapse { -webkit-transform: rotate(-90deg); -ms-transform: rotate(-90deg); transform: rotate(-90deg);  }
                 .curric-wrapper table       { max-width: calc(100% - 100px); } 
                 .curric-wrapper table td    { padding: 5px; vertical-align: top;  }
                 .curric-wrapper table td+td { width: 100%;}
.adv-svc-wrapper .adv-svc-cta                { background: #f3d343; max-width: fit-content; padding: 8px; }
.adv-svc-wrapper .adv-svc-cta *              { font-family: FujitsuInfinityProBold; }
.adv-svc-wrapper .adv-svc-cta:hover          { background: #FFB301; cursor: default; user-select: none; }
@media only screen and (max-width: 800px) { .adv-svc-wrapper .curric-section-wrapper { grid-template-columns: 1fr; } .adv-svc-wrapper .curric-wrapper { margin: 10px auto;}  }

/* CTA classes */
.div-cta-white            { background-color: #FFFFFF; color: #000000; font-size: 20px; border: 1px solid #606060; padding: 0px 10px; margin: 20px 0px;  max-width: fit-content; } /* (Marcelo 02-03-21) Introduct for PI article ha-pgpool, but is generic enough for any page/section */
.div-cta-white a          {                              color: #000000;                                  }
.div-cta-white:hover      { background-color: #D8DAD4; color: #000000; cursor: pointer; border: 1px solid #000; box-shadow: 3px 3px  #606060;  }
.div-cta-white:hover  a   {                              color: #000000 !important;                       }

/* PostgreSQL Insider splash */ /* (Marcelo 25-08-20)  Class for PI splash in home page */
.responsive-pi-splash-div            { background: right url(https://2585850.fs1.hubspotusercontent-na1.net/hubfs/2585850/Images/Backgrounds/bkg-blur-bokeh-01-06.jpg); background-size: cover; background-repeat: no-repeat; min-height: 500px !important; }  /* (Marcelo 25-08-20) IMPORTANT: background-size must be specified AFTER background, otherwise it is not taken into consideration */
.responsive-pi-splash-wrapper        { display: grid; display: -ms-grid; grid-template-columns: minmax(50%, 560px) 1fr; -ms-grid-columns: minmax(500px, 560px) 1fr; margin: auto; padding-left: 60px; }
.responsive-pi-splash-blurb          { grid-column: 1; grid-row: 1; -ms-grid-column: 1; -ms-grid-row: 1; padding: 10px; margin: 20px; background: rgba(255,255,255,1); border: 1px solid #FFFFFF; }
.responsive-pi-splash-blurb h2       { color: #000000 }
.responsive-pi-splash-blurb p        { color: #202020; }
@media only screen and (max-width: 800px) {
  .responsive-pi-splash-wrapper      { display: grid; display: -ms-grid; grid-template-columns: 1fr; -ms-grid-columns: 1fr; padding-left: 0px; }
}

/* 'Key features' webpage */ /* (Marcelo 09-02-21) Classes added for the 'Key features' webpage */
.key-features h2                        { color: #EA0000; }
.key-features h3                        { color: #C0C0C0; }

/* Responsive classes - toggle visibility and/or resize according to viewport width */
@media only screen and (max-width: 1500px) { .resize-to-350px-if-viewport-less-than-1500px { width: 350px !important; } } /* (Marcelo 10-11-20: Added to resize Mockup software box in FEP of Z Installation Instructions webpage  */
@media only screen and (max-width: 1200px) { .resize-to-300px-if-viewport-less-than-1200px { width: 300px !important; } } /* (Marcelo 06-04-20: Added to resize the image in 'Custom HTAP - Download' page */ /* (Marcelo 20-05-21) Also used in Video FEP on Z - Muylti Cloud webpage */
@media only screen and (max-width: 1100px) { .resize-to-200px-if-viewport-less-than-1100px { width: 200px !important; } } /* (Marcelo 18-11-20: Added to resize Mokcup stacked brochures in eBook webpages with form  */
@media only screen and (max-width:  900px) { .resize-to-250px-if-viewport-less-than-900px  { width: 250px !important; } } /* (Marcelo 10-11-20: Added to resize Mockup software box in FEP of Z Installation Instructions webpage */ /* (Marcelo 20-05-21) Also used in Video FEP on Z - Muylti Cloud webpage */
@media only screen and (max-width:  600px) { .resize-to-300px-if-viewport-less-than-600px  { width: 300px !important; } } /* (Marcelo 04-12-20: Added to resize diagrams in Pankaj blog about 'table access methods'  */
@media only screen and (max-width:  600px) { .resize-to-150px-if-viewport-less-than-600px  { width: 150px !important; } } /* (Marcelo 13-04-20: Added to resize Niki and Terry photos in blog announcing FEP of IBMz LinuxONE  */
@media only screen and (max-width:  600px) { .resize-to-100px-if-viewport-less-than-700px  { width: 100px !important; } } /* (Marcelo 24-09-20: Added to resize IBM LinuxONE server  in blog announcing FEP of IBMz LinuxONE is available  */
@media only screen and (max-width: 1500px) { .hide-if-viewport-less-than-1500px            { display: none;           } } /* (Marcelo 23-03-20) Added to hide the 3rd collateral thumbnail at bottom of 'Enhanced Data Security' page */
@media only screen and (max-width: 1100px) { .hide-if-viewport-less-than-1100px            { display: none;           } } /* (Marcelo 23-03-20) Added to hide the 2nd collateral thumbnail at bottom of 'Enhanced Data Security' page */
@media only screen and (max-width:  700px) { .hide-if-viewport-less-than-700px             { display: none;           } } /* (Marcelo 10-11-20: Added to resize Mockup software box in FEP of Z Installation Instructions webpage  */
@media only screen and (max-width:  600px) { .hide-if-viewport-less-than-600px             { display: none;           } } /* (Marcelo 06-04-20) Added to hide the image in 'Custom HTAP - Download' page */


/* Table definitions */
.uvance-blue   .fast-table                      { margin-left: 40px; margin-bottom: 30px; max-width: 1000px; table-layout: fixed; display: block; overflow-x: auto; max-width: fit-content; } /* (MH 22-03-22) Added for table in 'FEP on Z Installation Instructions' page */
.uvance-blue   .fast-table thead td             { background: #2400B0; color: #FFFFFF !important;                              border-right: 1px solid #FFFFFF; border-bottom: 1px solid #FFFFFF; vertical-align: middle; }
.uvance-blue   .fast-table thead td:last-child  {                                                                              border-right: 1px solid #2400B0;                                   }
.uvance-blue   .fast-table       td             { background: #F5F5F5; color: #303030 !important; padding: 5px 8px !important; border-bottom: 1px solid #2400B0;  font-size: 90%; vertical-align: top;   }
.uvance-blue   .fast-table ~ .legend            { margin-left: 40px; margin-bottom: 30px; margin-top: -20px !important; font-size: 85%; color: #666666;  }
.uvance-blue   .fast-table ~ .legend + .legend  { margin-top: -30px !important; } 
.uvance-orange .fast-table                      { margin-left: 40px; margin-bottom: 30px; max-width: 1000px; table-layout: fixed; display: block; overflow-x: auto; max-width: fit-content; }
.uvance-orange .fast-table thead td             { background: #FF8000; color: #000000 !important;                              border-right: 1px solid #FFFFFF; border-bottom: 1px solid #FFFFFF; vertical-align: middle; } 
.uvance-orange .fast-table thead td:last-child  {                                                                              border-right: 1px solid #FF8000;                                   }
.uvance-orange .fast-table       td             { background: #F5F5F5; color: #303030 !important; padding: 5px 8px !important; border-bottom: 1px solid #FF8000;  font-size: 90%; vertical-align: top;   }
.uvance-orange .fast-table ~ .legend            { margin-left: 40px; margin-bottom: 30px; margin-top: -20px !important; font-size: 85%; color: #666666;  }
.uvance-orange .fast-table ~ .legend + .legend  { margin-top: -30px !important; } 
.uvance-red    .fast-table                      { margin-left: 40px;margin-bottom: 30px;/* max-width: 1000px; */table-layout: fixed;display: block;overflow-x: auto;/* max-width: fit-content; */}  /* (MH 22-03-22) Added for table in 'FEP on Power Installation Instructions' page */
.uvance-red    .fast-table thead td             { background: #EA0000; color: #FFFFFF !important;                              border-right: 1px solid #FFFFFF; border-bottom: 1px solid #FFFFFF; vertical-align: middle; }
.uvance-red    .fast-table thead td:last-child  {                                                                              border-right: 1px solid #EA0000;                                   }
.uvance-red    .fast-table       td             { background: #F5F5F5; color: #303030 !important; padding: 5px 8px !important; border-bottom: 1px solid #EA0000;  font-size: 90%; vertical-align: top;   }
.uvance-red    .fast-table ~ .legend            { margin-left: 40px; margin-bottom: 30px; margin-top: -20px !important; font-size: 85%; color: #666666;  }
.uvance-red    .fast-table ~ .legend + .legend  { margin-top: -30px !important; } 

.table-blue                      { margin-left: 40px; margin-bottom: 30px; max-width: 1000px; table-layout: fixed; display: block; overflow-x: auto; max-width: fit-content; } 
.table-blue thead td             { background: #2400B0; color: #FFFFFF !important;                              border-right: 1px solid #FFFFFF; border-bottom: 1px solid #FFFFFF; vertical-align: middle; }
.table-blue thead td:last-child  {                                                                              border-right: 1px solid #2400B0;                                   }
.table-blue       td             { background: #F5F5F5; color: #303030 !important; padding: 5px 8px !important; border: 1px solid #2400B0;  font-size: 90%; vertical-align: top;   }
.table-blue       td:first-child { border-top: 1px solid #2400B0;                                                                                                                 }
.table-blue ~ .legend            { margin-left: 40px; margin-bottom: 30px; margin-top: -20px !important; font-size: 85%; color: #666666;  }
.table-blue ~ .legend + .legend  { margin-top: -30px !important; } 
.table-red                       { margin-left: 40px; margin-bottom: 30px; max-width: 1000px; table-layout: fixed; display: block; overflow-x: auto; max-width: fit-content; } /* (Marcelo 10-08-20) For the table to scroll horizontally, we need both 'display: block;' and 'overflow-x'. *BUT*, that causes the box shadow to extend to table's max width. So, for smaller tables, we will need to define max-width in the HTML */
.table-red thead td              { background: #EA0000; color: #FFFFFF !important;                              border-right: 1px solid #FFFFFF; border-bottom: 1px solid #FFFFFF; vertical-align: middle; } /* (Marcelo 16-05-20) The border-bottom 'white' setting is for tables with headers that span > 1 row (e.g., im article 01) */
.table-red thead td:last-child   {                                                                              border-right: 1px solid #EA0000;                                   }
.table-red       td              { background: #F5F5F5; color: #303030 !important; padding: 5px 8px !important; border: 1px solid #EA0000;  font-size: 90%; vertical-align: top;   }
.table-red       td:first-child  { border-top: 1px solid #EA0000;                                                                                                                 } /* (Marcelo 16-05-20) The border-top  setting is for tables with headers that span > 1 row (e.g., im article 01) */
.table-red ~ .legend             { margin-left: 40px; margin-bottom: 30px; margin-top: -20px !important; font-size: 85%; color: #666666;  }
.table-red ~ .legend + .legend   { margin-top: -30px !important; } /* (Marcelo 04-07-20: This settingh is for tables with more than 1 .legend - see PI article 08 (code str-re-ope) */
.table-gray                      { margin-left: 40px; margin-bottom: 30px; box-shadow: 9px 9px 16px #A0A0A0; max-width: 1000px; table-layout: fixed; }
.table-gray thead td             { background: #403B35; color: #FFFFFF !important;                              border-right: 1px solid #FFFFFF; border-bottom: 1px solid #FFFFFF; vertical-align: middle; } /* (Marcelo 16-05-20) The border-bottom 'white' setting is for tables with headers that span > 1 row (e.g., im article 01) */
.table-gray thead td:last-child  {                                                                   border-right: 1px solid #403B35;                                   }
.table-gray       td             { background: #F5F5F5; color: #303030 !important; padding: 5px 8px !important; border: 1px solid #555550;  font-size: 85%; vertical-align: top;   }
.table-gray       td:first-child { border-top: 1px solid #403B35;                                                                                                                 } /* (Marcelo 16-05-20) The border-top  setting is for tables with headers that span > 1 row (e.g., im article 01) */
.table-gray + .legend            { margin-left: 40px; margin-bottom: 30px; margin-top: -20px !important; font-size: 85%; color: #666666;  }
@media only screen and  (max-width: 1200px) {
  .table-red  table               { margin-left: 0px !important; } /* (Marcelo 10-08-20) Added !important to margin-left, otherwise .table-gray setting for this attr remain */
  .table-gray table               { margin-left: 0px !important; } /* (Marcelo 10-08-20) Added !important to margin-left, otherwise .table-gray setting for this attr remain */
}
@media only screen and  (max-width: 800px) {
  .table-red  table               { font-size: 85%;              }
  .table-red  td                  { padding: 3px 5px !important; }
  .table-gray table               { font-size: 85%;              }
  .table-gray td                  { padding: 3px 5px !important; }
}

.widget-type-blog_subscribe h3                 { margin-top: 10px !important;} /* (Marcelo 02-12-21) Title in 'Receive our blog' form */
.widget-type-blog_subscribe .hs-submit         { margin-top: 20px; }           /* (Marcelo 02-12-21) 'Submit' buttone in 'Receive our blog' form */

/* Forms */ /* (Marcelo 27-11-21) Similar to definition in .container-framed-..., but with padding-top  set to 0 */
.form-framed-blue           { margin-top: 10px; padding: 0px 10px 10px 10px; border: 1px solid #2400B0; } /* (Marcelo 25-01-22) Initially added for form in webpage 'Trial downaload' */
.form-framed-emerald        { margin-top: 10px; padding: 0px 10px 10px 10px; border: 1px solid #008224; } /* (Marcelo 27-11-21) Initially added for form in webpage 'FEP onfor Kubernetes' */
.form-framed-orange         { margin-top: 10px; padding: 0px 10px 10px 10px; border: 1px solid #F75100; }
.form-framed-orange-to-cyan { margin-top: 10px; padding: 0px 10px 10px 10px;  border: 2px solid transparent; border-image: linear-gradient(to right, #F75100 60%, #00E7EF 80%); border-image-slice: 1; }
.form-framed-red            { margin-top: 10px; border: 1px solid #EA0000; padding: 0px 10px 10px 10px; }
.form-framed-yellow         { margin-top: 10px; border: 1px solid #F75100; padding: 0px 10px 10px 10px; }
.form-framed-gray-dark      { border: 2px solid #D0D0D0; border-radius: 3px; padding: 0px 10px 10px 10px; }
.form-background-beige      { background-color: #F4F1EF; }
.form-background-gray      { background-color: #FAFAFA; }
.form-background-gradient-red-to-blue { background: linear-gradient(290deg, #D3E6F8, #D3E6F8 45%, #FAEAEA 55%, #FAEAEA); background-size: 200% 200%; animation: BackgroundGradient 10s ease infinite; }
.form-background-magenta-light        { background-color: #ffe6f5; } /* (Marcelo 21-02-22) Initially added for form in 'Service' webpages */
@keyframes BackgroundGradient { 0% {background-position: 0% 50%;} 50% {background-position: 100% 50%;} 100% {background-position: 0% 50%;} }
              p.form-heading       { color: #EA0000; font-size: 20px !important; padding: 0px  5px 0px  5px; text-align: center; } /* (Marcelo 07-01-20) The padding definition is important for when viewport < 400px */
.uvance-blue  p.form-heading       { color: #2400B0; }
              p.form-heading-black { color: #000000; font-size: 20px !important; padding: 10px  5px 0px  5px; text-align: center; } /* (Marcelo 07-01-20) The padding definition is important for when viewport < 400px */
.form-emerald p.form-field-heading { color: #008224;  } /* (Marcelo 27-10-23) Initially added for form in webpage 'Tokyo technical workshop - HSBC */
.form-orange  p.form-field-heading { color: #F75100;  } /* (Marcelo 20-10-22) Initially added for form 'Registere interest in FEP EAP' */
.form-red     p.form-field-heading { color: #EA0000;  } /* (Marcelo 27-10-23) Initially added for form in webpage 'Tokyo technical workshop - Citigroup */
              p.form-field-heading { color: #404040; font-size: 16px !important; } /* (Marcelo 06-06-22) Initially added for form ''Register for training (SoftwareMaster, June-2022) */
              p.form-heading-2     { color: #444444; font-size: 14px !important; padding: 0px  5px 0px  5px; text-align: center; } /* (Marcelo 07-01-20) The padding definition is important for when viewport < 400px */
              p.form-note          { color: #707070; font-size: 14px !important; padding: 0px 10px 0px 10px; } /* (Marcelo 07-01-20) The padding definition is important for when viewport < 400px */
.font-red-darker           { color: #EA0000;      }
.form-field-heading-icon                            { width: 50px; height: auto; float: right; max-width: 50px; } /* (Marcelo 08-12-22) Initially added for form 'FEP EAP - Provide feedback' */
.form-field-headings-with-icon p.form-field-heading { padding-top: 10px;  } /* (Marcelo 06-12-22) Initially added for form 'FEP EAP - Provide feedback' */
              .form-heading   { line-height: 1.2em; } /* (Marcelo 05-01-23) Initially added for forms on blog posts */
.form-blue    .form-heading   { color: #2400B0; }
.form-blue    .form-heading-2 { color: #404040; }
.form-emerald .form-heading   { color: #008224; } /* (Marcelo 28-01-22) Used in IBM form and webpage 'Support' */
.form-emerald .form-heading-2 { color: #404040; }
.form-orange  .form-heading   { color: #F75100; } /* (Marcelo 28-01-22) Used in IBM form and webpage 'Support' */
.form-orange  .form-heading-2 { color: #404040; }
.form-red     .form-heading   { color: #EA0000; } /* (Marcelo 10-02-22) Used in form 'Contact us' */
.form-red     .form-heading-2 { color: #404040; }
.form-yellow  .form-heading   { color: #F75100; } /* (Marcelo 28-01-22) Used in IBM form and webpage 'Support' */
.form-yellow  .form-heading-2 { color: #404040; }
.form-enabl .form-heading     { color: #2400B0; font-family:FujitsuInfinityProBold  } /* (Marcelo 05-05-24) Used in form 'Fujitsu Enterprise Postgres service quote request' */

p.form-heading-big-black-bold { font-family:FujitsuInfinityProBold !important; font-size: 30px !important; color: #444444;  }
.form-blue    .form-field-heading { color: #2400B0; } /* (Marcelo 06-06-22) Initially added for form 'Register for training (SoftwareMaster, June-2022)  */
.form-enabl   .form-field-heading { color: #000000;font-family:FujitsuInfinityProBold  } /* (Marcelo 05-05-24) Initially added for form 'Fujitsu Enterprise Postgres service quote request'  */

.form-blue    .form-heading       + hr { border-bottom: 1px solid #2400B0; margin-bottom: 20px; } /* (Marcelo 06-06-22) Initially added for form 'Register for training (SoftwareMaster, June-2022)'  */
.form-enabl   .form-heading       + hr { border-bottom: 2px solid #2400B0; margin-bottom: 20px; max-width: 80%; } /* (Marcelo 06-06-22) Initially added for form 'Register for training (SoftwareMaster, June-2022)'  */
              .form-field-heading + hr { border-bottom: 1px solid #808080; margin-bottom: 10px; margin-top: -5px; } /* (Marcelo 06-06-22) Initially added for form 'Register for training (SoftwareMaster, June-2022)' */
.form-blue    .form-field-heading + hr { background: linear-gradient(to right, #2400B0 60%, #808080 80%); height: 1px; border: 0px; } /* (Marcelo 27-10-23) Initially added for form in webpage 'Tokyo technical workshop - UBS */
.form-emerald .form-field-heading + hr { background: linear-gradient(to right, #008224 60%, #808080 80%); height: 1px; border: 0px; } /* (Marcelo 27-10-23) Initially added for form in webpage 'Tokyo technical workshop - HSBC */
.form-orange  .form-field-heading + hr { background: linear-gradient(to right, #F75100 60%, #00E7EF 80%); height: 2px; border: 0px; } /* (Marcelo 20-10-22) Initially added for form ''Register interest for FEP EAP' and 'FEP EAP - Provide feedback  */
.form-red     .form-field-heading + hr { background: linear-gradient(to right, #EA0000 60%, #808080 80%); height: 1px; border: 0px; } /* (Marcelo 27-10-23) Initially added for form in webpage 'Tokyo technical workshop - Citigroup */
.form-enabl   .form-field-heading + hr { border-bottom: 1px solid #404040; margin-bottom: 10px; margin-top: -5px;  } /* (Marcelo 06-06-22) Initially added for form 'Register for training (SoftwareMaster, June-2022)' */

.form-blue .icon-svg { background: #2400B0 !important; } /* (Marcelo 06-06-22) Initially added for form ''Register for training (SoftwareMaster, June-2022)  */

.legal-consent-container                    { padding: 0 10px; font-size: 14px !important; } /* (Marcelo 07-01-20) The padding definition is important for when viewport < 400px */ /* (Marcelo 10-01-20: Added font-size while working on support page form */
.legal-consent-container > .hs-richtext > p { font-size: 14px !important; margin-bottom: 5px !important; }
.legal-consent-container span               { font-size: 14px !important; display: inline-block !important; width: calc( 100% - 20px ); } 
.legal-consent-container ul                 { margin: 0px !important; }
.legal-consent-container .hs-form-booleancheckbox-display>span { margin-left: 0px !important;}

/* Bulleted lists and numbered lists */
.uvance ul                             {list-style: disc;padding-left: 30px;margin-left: 10px;margin-top: 10px;margin-bottom: 20px;}
             .fast-ul                  { list-style: disc; padding-left: 10px !important;  }
             .fast-ul li::marker       { color: #EA0000; font-size: 130%; }
.uvance-blue .fast-ul li::marker       { color: #2400B0 } /* (Marcelo 25-01-22) Initially added for webpage 'Trial download' */
.uvance-red  .fast-ul li::marker       { color: #EA0000 }
             .fast-ul ul               { list-style: disc; padding-left: 20px !important; font-size: 90%; }
             .fast-ul ul li::marker    { color: #505050 }
             .fast-ul ul ul            { list-style: square; padding-left: 20px !important; font-size: 90%; }
             .fast-ul ul ul li::marker { color: #505050 }
             .fast-ul li    {list-style-position: outside;margin-left: 20px;margin-bottom: 10px;}  /* (Marcelo 15-05-20) We need to use list-style-postion to ensure identation of 
 inside 
  •  in IE */
             .fast-ul li li { margin-left: 0px;  margin-bottom: 0px;}                                                    /* (Marcelo 16-06-20) Added for article 02 fdw-ora-base to aligh list inside list [Check section 'Notes about using oracle_fdw] */
             .fast-ul li p  { margin-top: 10px; }
             .fast-ol       { list-style: none; counter-reset: li }
             .fast-ul li::before { counter-increment: none !important; content: "" !important; } /* (Marcelo 04-07-20: IMPORTANT-  We need to set 'counter-increment: none' here so that