/******************************** * START Base Table Snippet Styles ********************************/ /*Editable region*/ .ou-justedit-region { padding: 15px; width: 98%; } /* Fix issue with bootstrap buttons in WYSIWYG */ .ou-justedit-region .btn { -webkit-user-select: text; -moz-user-select: text; -ms-user-select: text; user-select: text; } /*All tables*/ .ou-justedit-region table { width: 100%; table-layout: fixed; } /* Non-snippet WYSIWYG tables */ .ou-justedit-region .mce-item-table, .ou-justedit-region .mce-item-table td, .ou-justedit-region .mce-item-table th, .ou-justedit-region .mce-item-table caption { border-collapse: separate; border-spacing: 0px; border: 1px solid #d2d2d2; box-sizing: border-box; } /*Snippet tables*/ .ou-justedit-region table:is([data-snippet^="ou-"], [class^="ou-"], [class*=" ou-"]) { cursor: default; margin: 32px 0 !important; } /*Snippet Images*/ .ou-justedit-region table:is([data-snippet^="ou-"], [class^="ou-"], [class*=" ou-"]) img:not(.mce-object-iframe) { max-width: 100%; max-height: 100%; } /*Snippet Images - Uncomment this and comment-out the one above if rules should not be applied to 'wysiwyg' td cells.*/ /* .ou-justedit-region table:is([data-snippet^="ou-"], [class^="ou-"], [class*=" ou-"]) td:not([data-type="wysiwyg"]) img:not(.mce-object-iframe) { max-width: 100%; max-height: 100%; width: auto; height: auto; }*/ /*Table and caption shadow and borders*/ .ou-justedit-region table:is([data-snippet^="ou-"], [class^="ou-"], [class*=" ou-"]), .ou-justedit-region table:is([data-snippet^="ou-"], [class^="ou-"], [class*=" ou-"]) caption { box-shadow: 0 4px 10px rgba(0, 37, 84, 0.15), 0 1px 3px rgba(0, 37, 84, 0.08); border: none; } /*Snippet table and all cells*/ .ou-justedit-region table:is([data-snippet^="ou-"], [class^="ou-"], [class*=" ou-"]), .ou-justedit-region table:is([data-snippet^="ou-"], [class^="ou-"], [class*=" ou-"]) td, .ou-justedit-region table:is([data-snippet^="ou-"], [class^="ou-"], [class*=" ou-"]) th, .ou-justedit-region table:is([data-snippet^="ou-"], [class^="ou-"], [class*=" ou-"]) caption { border-spacing: 0px; box-sizing: border-box; } /*Borders for table cells*/ .ou-justedit-region table:is([data-snippet^="ou-"], [class^="ou-"], [class*=" ou-"]) td, .ou-justedit-region table:is([data-snippet^="ou-"], [class^="ou-"], [class*=" ou-"]) th { border: 1px solid #b5b5b5; border-collapse: collapse; padding: 15px; } /*Snippet td content cells*/ .ou-justedit-region table:is([data-snippet^="ou-"], [class^="ou-"], [class*=" ou-"]) td { position: relative !important; font-size: 18px; vertical-align: top; } /*Heading cell styles*/ .ou-justedit-region table:is([data-snippet^="ou-"], [class^="ou-"], [class*=" ou-"]) th, .ou-justedit-region table:is([data-snippet^="ou-"], [class^="ou-"], [class*=" ou-"]) td[class='mceNonEditable'] { background-color: #ededed; color: #404040; font-weight: 600; font-size: 20px; } /*Updated caption styles*/ .ou-justedit-region table:is([data-snippet^="ou-"], [class^="ou-"], [class*=" ou-"]) caption { font-size: 20px; font-weight: 600; text-transform: uppercase; letter-spacing: 1.25px; color: #ffffff; background-color: #002554; padding: 22px 18px; border-top-left-radius: 8px; border-top-right-radius: 8px; caption-side: top; text-align: center; } /*New Font*/ .ou-justedit-region table:is([data-snippet^="ou-"], [class^="ou-"], [class*=" ou-"]) th, .ou-justedit-region table:is([data-snippet^="ou-"], [class^="ou-"], [class*=" ou-"]) td[class='mceNonEditable'], .ou-justedit-region table:is([data-snippet^="ou-"], [class^="ou-"], [class*=" ou-"]) caption, .ou-justedit-region table:is([data-snippet^="ou-"], [class^="ou-"], [class*=" ou-"]) th:before, .ou-justedit-region table:is([data-snippet^="ou-"], [class^="ou-"], [class*=" ou-"]) td:before, .ou-justedit-region table:is([data-snippet^="ou-"], [class^="ou-"], [class*=" ou-"]) caption:before, .ou-justedit-region table:is([data-snippet^="ou-"], [class^="ou-"], [class*=" ou-"]):before, .ou-justedit-region table:is([data-snippet^="ou-"], [class^="ou-"], [class*=" ou-"]) tr[data-name="row"] > td:first-of-type::after, .ou-justedit-region table:is([data-snippet^="ou-"], [class^="ou-"], [class*=" ou-"]) tr[data-name="item"] > td:first-of-type::after { font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; } .ou-justedit-region table:is([data-snippet^="ou-"], [class^="ou-"], [class*=" ou-"])[data-gallery-type="slick"] tr[data-gallery-type="fancybox"], .ou-justedit-region table:is([data-snippet^="ou-"], [class^="ou-"], [class*=" ou-"])[data-gallery-type="fancybox"] tr[data-gallery-type="slick"] { display: none; } /*Hover color over clickable data select list cells*/ .ou-justedit-region table:is([data-snippet^="ou-"], [class^="ou-"], [class*=" ou-"]) td[data-select-list]:hover { background-color: #FFFBF0; } /******************************** * END Base Table Snippet Styles ********************************/ /*************************************** * START COMPONENT PREVIEW HELPER STYLES ***************************************/ div.ou-je-component [data-ouc-test=""] { display: none; } div.ou-je-component [data-ouc-not]:not([data-ouc-not=""]) { display: none; } .ou-je-component [data-ouc-test-and-1=""], .ou-je-component [data-ouc-test-and-2=""], .ou-je-component [data-ouc-test-and-3=""], .ou-je-component [data-ouc-test-and-4=""], .ou-je-component [data-ouc-test-and-5=""], .ou-je-component [data-ouc-test-and-6=""] { display: none; } div.ou-je-component [data-ouc-test-element], div.ou-je-component [data-ouc-not-test-element], div.ou-je-component [data-ouc-test-element]:empty + *, div.ou-je-component [data-ouc-not-test-element]:not(:empty) + * { display: none; } div.ou-je-component [data-ouc-justedit]::before { display: block; width: 100%; font-weight: bold; padding: 5px 15px; margin-bottom: 10px; border: 1px solid #bce8f1; color: #31708f; background-color: #d9edf7; content: "The content you see in the editor is a sample render intended for WYSIWYG preview only. Once you save the page, you will see the actual rendered element."; } /*************************************** * END COMPONENT PREVIEW HELPER STYLES ***************************************/ /******************************** * START Table Input Hint Styling ********************************/ /* Generic table "tool-tip/alert" info styling */ .ou-justedit-region table:is([data-snippet^="ou-"], [class^="ou-"], [class*=" ou-"]) th:before, .ou-justedit-region table:is([data-snippet^="ou-"], [class^="ou-"], [class*=" ou-"]) td:before, .ou-justedit-region table:is([data-snippet^="ou-"], [class^="ou-"], [class*=" ou-"]) caption:before, .ou-justedit-region table:is([data-snippet^="ou-"], [class^="ou-"], [class*=" ou-"]):before { display: block; font-size: 16px; font-weight: 500; line-height: 1.5; color: #325176; background-color: #F1F6FA; width: fit-content; padding: 10px; margin-bottom: 25px; border-radius: 6px; box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 4px 8px rgba(0, 0, 0, 0.10); } /******************************** * END Table Input Hint Styling ********************************/ /* example of helper text */ table.ou-table-class > tbody > tr > td:nth-child(1):before { content: 'Add your content and style via WYSIWYG editor toolbar'; } /* Standard Inner Snippets */ table.ou-snippet-highlight > tbody > tr > td:nth-child(1):before { content: 'Add Content'; } table.ou-snippet-media-box > tbody > tr:nth-child(1) > td:before { content: 'Add Image'; } table.ou-snippet-media-box > tbody > tr:nth-child(2) > td:before { content: 'Add Title (Apply "Media Heading" using Styles dropdown)'; } table.ou-snippet-media-box > tbody > tr:nth-child(3) > td:before { content: 'Add Content'; } table.ou-snippet-media-box-top > tbody > tr:nth-child(1) > td:before { content: 'Add Image'; } table.ou-snippet-media-box-top > tbody > tr:nth-child(2) > td:before { content: 'Add Title (Apply "Media Heading" using Styles dropdown)'; } table.ou-snippet-media-box-top > tbody > tr:nth-child(3) > td:before { content: 'Add Content'; } table.ou-snippet-testimonial > tbody > tr:nth-child(1) > td:before { content: 'Add Quote'; } table.ou-snippet-testimonial > tbody > tr:nth-child(2) > td:before { content: 'Add Person'; } table.ou-snippet-testimonial > tbody > tr:nth-child(3) > td:before { content: 'Add Position'; } table.ou-snippet-testimonial > tbody > tr:nth-child(4) > td:before { content: 'Add Department'; } table.ou-snippet-kaltura-player > tbody > tr:nth-child(1) > td:before { content: 'Add Entry ID'; } table.ou-snippet-kaltura-player > tbody > tr:nth-child(2) > td:before { content: 'Add Style'; } table.ou-snippet-dropdown > tbody > tr:nth-child(1) > td:before { content: 'Add Name'; } table.ou-snippet-dropdown > tbody > tr:nth-child(2) > td:before { content: 'Add Drop Down Values (Unordered List with links)'; } /* Standard Inner Sidebar Snippets */ table.ou-snippet-img-box-cta > tbody > tr:nth-child(1) > td:before { content: 'Add Image'; } table.ou-snippet-img-box-cta > tbody > tr:nth-child(2) > td:before { content: 'Add Title'; } table.ou-snippet-img-box-cta > tbody > tr:nth-child(3) > td:before { content: 'Add Subheaing (optional)'; } table.ou-snippet-img-box-cta > tbody > tr:nth-child(4) > td:before { content: 'Add View more Link)'; } table.ou-snippet-related-links > tbody > tr:nth-child(1) > td:before { content: 'Add Content (Unordered List with links)'; } table.ou-snippet-contact > tbody > tr:nth-child(1) > td:before { content: 'Add Heading'; } table.ou-snippet-contact > tbody > tr:nth-child(2) > td:before { content: 'Add Content'; } table.ou-snippet-two-column > tbody > tr:nth-child(1) > td:before { content: 'Column 1 content'; } table.ou-snippet-two-column > tbody > tr:nth-child(2) > td:before { content: 'Column 2 content'; } table.ou-snippet-three-column > tbody > tr:nth-child(1) > td:before { content: 'Column 1 content'; } table.ou-snippet-three-column > tbody > tr:nth-child(2) > td:before { content: 'Column 2 content'; } table.ou-snippet-three-column > tbody > tr:nth-child(3) > td:before { content: 'Column 3 content'; } table.ou-snippet-four-column > tbody > tr:nth-child(1) > td:before { content: 'Column 1 content'; } table.ou-snippet-four-column > tbody > tr:nth-child(2) > td:before { content: 'Column 2 content'; } table.ou-snippet-four-column > tbody > tr:nth-child(3) > td:before { content: 'Column 3 content'; } table.ou-snippet-four-column > tbody > tr:nth-child(4) > td:before { content: 'Column 4 content'; } table.ou-snippet-spotlight > tbody > tr:nth-child(1) > td:before { content: 'Add Content'; } table.ou-snippet-tabs > tbody > tr > td:nth-child(1):before { content: 'Add Heading'; } table.ou-snippet-tabs > tbody > tr > td:nth-child(2):before { content: 'Add Content'; } table.ou-snippet-accordion > tbody > tr > td:nth-child(1):before { content: 'Add Heading'; } table.ou-snippet-accordion > tbody > tr > td:nth-child(2):before { content: 'Add Content'; } /* Landing Snippets */ table.ou-snippet-school-of-health-professions > tbody > tr:nth-child(1) > td:before { content: 'Add Content'; } table.ou-snippet-facts-section > tbody > tr:nth-child(1) > td:before { content: 'Add Image'; } table.ou-snippet-facts-section > tbody > tr:nth-child(2) > td:before { content: 'Add Number'; } table.ou-snippet-facts-section > tbody > tr:nth-child(3) > td:before { content: 'Add Content'; } table.ou-snippet-feat-program > tbody > tr:nth-child(1) > td:before { content: 'Add Image'; } table.ou-snippet-feat-program > tbody > tr:nth-child(2) > td:before { content: 'Add Content'; } table.ou-snippet-programs-at-a-glance > thead > tr:nth-child(1) > td:before { content: 'Add Heading'; } table.ou-snippet-programs-at-a-glance > tbody > tr > td:nth-child(2):before { content: 'Add Title'; } table.ou-snippet-programs-at-a-glance > tbody > tr > td:nth-child(3):before { content: 'Add Content (Unordered List)'; } table.ou-snippet-program-info > tbody > tr > td:nth-child(1):before { content: 'Add Image'; } table.ou-snippet-program-info > tbody > tr > td:nth-child(2):before { content: 'Add Content'; } table.ou-snippet-meet-our-people > thead > tr:nth-child(2) > td:nth-child(2):before { content: 'Select Ouote or Image Styling'; } table.ou-snippet-meet-our-people > thead > tr:nth-child(2) > td:nth-child(3):before { content: 'Add Heading'; } table.ou-snippet-meet-our-people > tbody > tr > td:nth-child(1):before { content: 'Add Image'; } table.ou-snippet-meet-our-people > tbody > tr > td:nth-child(2):before { content: 'Add Quote'; } table.ou-snippet-meet-our-people > tbody > tr > td:nth-child(3):before { content: 'Add Link'; } table.ou-snippet-meet-our-people > tbody > tr > td:nth-child(4):before { content: 'Add Author'; } table.ou-snippet-meet-our-people > tbody > tr > td:nth-child(5):before { content: 'Add Title'; } table.ou-snippet-meet-our-people > tbody > tr > td:nth-child(6):before { content: 'Add Department'; } table.ou-snippet-feat-learning > tbody > tr > td:nth-child(1):before { content: 'Add Content'; } table.ou-snippet-feat-learning > tbody > tr > td:nth-child(2):before { content: 'Add Image'; } table.ou-snippet-img-section > tbody > tr > td:nth-child(1):before { content: 'Select Content Box Left/Right'; } table.ou-snippet-img-section > tbody > tr > td:nth-child(2):before { content: 'Add Image'; } table.ou-snippet-img-section > tbody > tr > td:nth-child(3):before { content: 'Add Heading'; } table.ou-snippet-img-section > tbody > tr > td:nth-child(4):before { content: 'Add Description'; } table.ou-snippet-img-section > tbody > tr > td:nth-child(5):before { content: 'Add More Link'; } table.ou-snippet-browse-programs > tbody > tr > td:nth-child(1):before { content: 'Add Title'; } table.ou-snippet-browse-programs > tbody > tr > td:nth-child(2):before { content: 'Add Content/Description'; } table.ou-snippet-browse-programs > tbody > tr > td:nth-child(3):before { content: 'Add Program List (unordered List)'; } table.ou-snippet-home-page-factoid-slant > tbody > tr > td:nth-child(1):before { content: 'Add Image with Link'; } table.ou-snippet-home-page-factoid-slant > tbody > tr > td:nth-child(2):before { content: 'Add Number/Stat'; } table.ou-snippet-home-page-factoid-slant > tbody > tr > td:nth-child(3):before { content: 'Add Content/Description'; } table.ou-snippet-home-page-factoid-slant > tbody > tr > td:nth-child(1):before { content: 'Add Image with Link'; } table.ou-snippet-home-page-factoid-slant > tbody > tr > td:nth-child(2):before { content: 'Add Number/Stat'; } table.ou-snippet-home-page-patient-row > tbody > tr > td:nth-child(1):before { content: 'Add Title'; } table.ou-snippet-home-page-patient-row > tbody > tr > td:nth-child(2):before { content: 'Add Content/Description with Link'; } table.ou-snippet-home-page-connect-row > tbody > tr > td:nth-child(1):before { content: 'Add Title'; } table.ou-snippet-home-page-connect-row > tbody > tr > td:nth-child(2):before { content: 'Add Content/Description'; } table.ou-snippet-home-page-connect-row > tbody > tr > td:nth-child(3):before { content: 'Add Pintrest Link'; } table.ou-snippet-home-page-connect-row > tbody > tr > td:nth-child(4):before { content: 'Add Facebook Link'; } table.ou-snippet-home-page-connect-row > tbody > tr > td:nth-child(5):before { content: 'Add Instagram Link'; } table.ou-snippet-home-page-connect-row > tbody > tr > td:nth-child(6):before { content: 'Add Twitter Link'; } table.ou-snippet-home-page-connect-row > tbody > tr > td:nth-child(7):before { content: 'Add YouTube Link'; } table.ou-snippet-home-page-instagram-row > tbody > tr > td:nth-child(1):before { content: 'Add Image with Link'; } table.ou-json-output > tbody > tr > td:nth-child(1):before { content: 'Add Name/Title'; } table.ou-json-output > tbody > tr > td:nth-child(2):before { content: 'Add Department Name'; } table.ou-json-output > tbody > tr > td:nth-child(3):before { content: 'Add Link'; } table.ou-json-output > tbody > tr > td:nth-child(4):before { content: 'Add Keywords (comma separated)'; } /* Landing Snippets */ table:is([data-snippet^='ou-'], [class^='ou-'], [class*=' ou-']) { caption-side: top; } table:is([data-snippet^='ou-'], [class^='ou-'], [class*=' ou-']) > tbody > tr > td::before { content: "Enter text. All styling will be stripped."; } table:is([data-snippet^='ou-'], [class^='ou-'], [class*=' ou-']) td[data-type='wysiwyg']::before { content: "Enter content freely using the WYSIWYG toolbar."; } table:is([data-snippet^='ou-'], [class^='ou-'], [class*=' ou-']) td[data-type='feature-heading']::before { content: "Enter feature heading text."; } table:is([data-snippet^='ou-'], [class^='ou-'], [class*=' ou-']) td[data-type='item-heading']::before { content: "Enter item heading text."; } table:is([data-snippet^='ou-'], [class^='ou-'], [class*=' ou-']) td[data-type='text-link']::before { content: "Enter text. Optionally, make it a link."; } table:is([data-snippet^='ou-'], [class^='ou-'], [class*=' ou-']) td[data-type='link']::before { content: "Insert a link using the WYSIWYG toolbar. The system only reads the first link inside this cell."; } table:is([data-snippet^='ou-'], [class^='ou-'], [class*=' ou-']) td[data-type='links']::before { content: "Insert multiple links using the WYSIWYG toolbar. The system only reads links inside this cell."; } table:is([data-snippet^='ou-'], [class^='ou-'], [class*=' ou-']) td[data-type='list']::before { content: "Insert multiple links using the WYSIWYG toolbar. The system only reads links inside this cell."; } table:is([data-snippet^='ou-'], [class^='ou-'], [class*=' ou-']) td[data-type='image-link']::before { content: "Insert an image using the WYSIWYG toolbar. Optionally, make it a link. The system only reads the first image inside this cell."; } table:is([data-snippet^='ou-'], [class^='ou-'], [class*=' ou-']) td[data-type='image']::before { content: "Insert an image using the WYSIWYG toolbar. The system only reads the first image inside this cell."; } table:is([data-snippet^='ou-'], [class^='ou-'], [class*=' ou-']) td[data-type='image-black-white']::before { content: "Insert an image using the WYSIWYG toolbar (black and white image recommended). The system only reads the first image inside this cell."; } table:is([data-snippet^='ou-'], [class^='ou-'], [class*=' ou-']) td[data-type='images']::before { content: "Insert multiple images using the WYSIWYG toolbar. The system only reads images inside this cell."; } table:is([data-snippet^='ou-'], [class^='ou-'], [class*=' ou-']) td[data-type='number']::before { content: "Enter a number. This field must be a number."; } table:is([data-snippet^='ou-'], [class^='ou-'], [class*=' ou-']) td[data-type='list']::before { content: "Enter a list using the WYSIWYG. The system only reads list items inside this cell."; } table:is([data-snippet^='ou-'], [class^='ou-'], [class*=' ou-']) td[data-type='text-list']::before { content: "Enter text or a list using the WYSIWYG. All other styling will be stripped"; } table:is([data-snippet^='ou-'], [class^='ou-'], [class*=' ou-']) td[data-type='snippet']::before { content: "Insert a specific snippet. Please refer to the documentation to see which snippets are supported."; } table:is([data-snippet^='ou-'], [class^='ou-'], [class*=' ou-']) td[data-type='snippets']::before { content: "Insert one or more snippets. Please refer to the documentation to see which snippets are supported."; } table:is([data-snippet^='ou-'], [class^='ou-'], [class*=' ou-']) td[data-type='iframe']::before { content: "Insert a video using the WYSIWYG. The system only reads the first video inside this cell."; } table:is([data-snippet^='ou-'], [class^='ou-'], [class*=' ou-']) td[data-type='asset']::before { content: "Insert an asset. This cell only reads the first asset."; } table:is([data-snippet^='ou-'], [class^='ou-'], [class*=' ou-']) td[data-type='media']::before { content: "Insert a component or image."; } table:is([data-snippet^='ou-'], [class^='ou-'], [class*=' ou-']) td[data-type='asset'][data-asset='gallery']::before { content: "Insert a gallery asset. This cell only reads the first gallery asset."; } table:is([data-snippet^='ou-'], [class^='ou-'], [class*=' ou-']) td[data-select-list]::before { content: "This is a multiple-choice cell. Click the space below to view your list of options."; } table:is([data-snippet='ou-icon-cards'], .ou-icon-links) td[data-name='icon'] img { height: 100px; width: auto; } table[class^='ou-snippet-accordion'] > thead > tr > th:first-child { width: 30%; } table[class^='ou-snippet-tabs'] > thead > tr > th:first-child { width: 30%; } table:is( .ou-snippet-two-column, .ou-snippet-three-column, .ou-snippet-four-column, .ou-snippet-five-column, .ou-snippet-highlight, .ou-snippet-media-box, .ou-snippet-contact, .ou-snippet-spotlight, .ou-snippet-testimonial, .ou-snippet-related-links ) > tbody > tr > th { width: 20%; }