/***********************/ /* */ /* © Apricore 2020 */ /* */ /***********************/ /* ---------------- */ /* CSS Reset: START */ /* ---------------- */ html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, img, ins, kbd, q, s, samp, small, strike, sub, sup, tt, var, b, u, i, center, fieldset, form, label, legend, *:not(.tiny_mce_html) > table:not(.tablesorter):not(.info_symbol_explanation):not(.default_modern):not(.default):not(.rowdots), *:not(.tiny_mce_html) > table:not(.tablesorter):not(.info_symbol_explanation):not(.default_modern):not(.default):not(.rowdots) > caption, *:not(.tiny_mce_html) > table:not(.tablesorter):not(.info_symbol_explanation):not(.default_modern):not(.default):not(.rowdots) > tbody, *:not(.tiny_mce_html) > table:not(.tablesorter):not(.info_symbol_explanation):not(.default_modern):not(.default):not(.rowdots) > tfoot, *:not(.tiny_mce_html) > table:not(.tablesorter):not(.info_symbol_explanation):not(.default_modern):not(.default):not(.rowdots) > thead, *:not(.tiny_mce_html) > table:not(.tablesorter):not(.info_symbol_explanation):not(.default_modern):not(.default):not(.rowdots) > tbody > tr, *:not(.tiny_mce_html) > table:not(.tablesorter):not(.info_symbol_explanation):not(.default_modern):not(.default):not(.rowdots) > tbody > tr > td:not(.tablesorter-header), *:not(.tiny_mce_html) > table:not(.tablesorter):not(.info_symbol_explanation):not(.default_modern):not(.default):not(.rowdots) > thead > tr, *:not(.tiny_mce_html) > table:not(.tablesorter):not(.info_symbol_explanation):not(.default_modern):not(.default):not(.rowdots) > thead > tr > th:not(.tablesorter-header), article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font-weight: normal; /*font: inherit;*/ } video:focus { outline: none; } /* HTML5 display-role reset for older browsers */ article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; } html { scroll-behavior: smooth; } body { /* line-height: 1; */ } ol, ul { /* list-style: none; */ margin-bottom: 0; /* To avoid transparent line in content area when sites have background color/image/video */ } hr { margin-top: 0; } /* blockquote, q { quotes: none; } blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; } */ /* THIS BLOCK IS COMMENTED OUT BECAUSE IT BREAKS DESIGNS AND WE DO NOT FULLY KNOW WHAT IT IS INTENDED FOR. *:not(.tiny_mce_html) > table { border-collapse: collapse; border-spacing: 0; } *:not(.tiny_mce_html) > table > tbody > tr > td { padding: 4px; }*/ .tiny_mce_html blockquote { border-left: 2px solid #ccc; margin-left: 1.5rem; padding-left: 1rem; } input, textarea, select, iframe { box-sizing: border-box; } /* IF CHANGED REMEMBER TO ALSO CHANGE IN WEB/UPDATE/APRICORE.CSS.PHP */ .invalid_input { background-color: #ffff00; transition: background-color 2s; } iframe { /* This is a fix to remove whitespace after iframes. By default iframe is an inline element. Inline elements are notorious for layout bugs, such as unpredicted whitespace in the bottom of the tag. We simply fix it by switching the display type to block. */ display: block; } /* Properly align inputs and their labels */ label > input, label > span { vertical-align: middle; } label > span { position: relative; top: -1px; left: 0; } /* Prevent Superscripts and Subscripts from Affecting Line-Height Source: https://css-tricks.com/snippets/css/prevent-superscripts-and-subscripts-from-affecting-line-height/ This fixes some layout issues we had with superscripts. */ sup, sub { vertical-align: baseline; position: relative; top: -0.4em; } sub { top: 0.4em; } /* -------------- */ /* CSS Reset: END */ /* -------------- */ /*! * EmojiSymbols Font (c)blockworks - Kenichi Kaneko * http://emojisymbols.com/ * * * Defines a font for emojis */ @font-face { font-family:"EmojiSymbols"; src:url("/update/images/EmojiSymbols-Regular.woff") format("woff"); text-decoration:none; font-style:normal } /*********************************/ /* Grundlayout og grundtypografi */ /*********************************/ html { height : 100%; margin : 0; padding: 0; } body { height : 100%; margin : 0; padding: 0; } a { overflow-wrap: break-word; } /* START: Makes tabbing between a-tags visible for user - Keyboard navigation */ a, button, input[type=button], .for_focus, .js_focus, div[tabindex="0"] { outline: none; } a:focus > img.comp_slideshow_media { outline: solid 2px !important; outline-color: currentcolor; outline-offset: 5px; outline-style: inset; transition: outline-offset .2s; } a:focus, button:focus, a:focus > img:not(.ignore_focus) { outline: solid 2px currentcolor; outline-offset: 5px; outline-style: inset; transition: outline-offset .2s; } span.js_focus:focus { outline: solid 2px !important; outline-color: currentcolor; outline-offset: 5px; outline-style: inset; transition: outline-offset .2s; } /* This is a class that allows an element to be shown as focussed if it also has the tabindex */ .for_focus:focus { outline: solid 2px !important; outline-color: currentcolor; outline-offset: 5px; outline-style: inset; transition: outline-offset .2s; } /* This adds focus border on the next label rather than itself when itself gets focus */ .for_focus:focus + label { outline: solid 2px !important; outline-color: currentcolor; outline-offset: 5px; outline-style: inset; transition: outline-offset .2s; } .aprGUIToggleText div:focus { outline: solid 2px !important; outline-color: currentcolor; outline-offset: 5px; outline-style: inset; transition: outline-offset .2s; } div[tabindex="0"]:focus { outline: solid 2px !important; outline-color: currentcolor; outline-offset: 5px; outline-style: inset; transition: outline-offset .2s; } /* END: Makes tabbing between a-tags visible for user - Keyboard navigation */ img { border: none; display: block; } /* Forms */ form { margin-top: 0; margin-bottom: 0; } input[type="radio"], input[type="checkbox"], input[type="button"], input[type="submit"] { outline: none; } input:not([type="image"]), select, textarea { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; border: 1px solid #727a7e; } input:not([type="radio"]):not([type="checkbox"]):not([type="range"]), textarea { -webkit-appearance: none; /* Remove Safari styling */ } input[type="text"], input[type="password"] { height: 21px; padding: 1px; } input[type="button"], input[type=submit], a.knap, .knap, .knap_tab_selected, .knap_tab_deselected { outline: none; } input[disabled], button[disabled], textarea[disabled], select[disabled] { opacity: 0.5; } .knap, a.knap, .knap:focus, .knap:active:focus, .knap:active, .knap[disabled]:hover, .knap_tab_selected, .knap_tab_deselected { height: 24px; background-color: #FFFFFF; font-family: Verdana, Geneva, Arial, Helvetica, sans-serif; color: #000000; font-weight: normal; font-size: 9px; line-height: 15px; /* Is needed for button label to valign correct in Internet Explorer */ text-transform: uppercase; padding: 4px 8px 4px 9px; text-align: center; box-sizing: border-box; border: 1px solid #000000; border-radius: 12px; cursor: pointer; -webkit-appearance: none; /* Remove Safari styling */ } .knap_tab_selected, .knap_tab_deselected { border-bottom-left-radius: 0 !important; border-bottom-right-radius: 0 !important; } .knap_tab_selected { border-bottom: none; } .knap:focus, .knap_tab_selected:focus, .knap_tab_deselected:focus { /* Used inste.knap_tabad of dotted border on focus */ box-shadow: 0 0 0 1px #000000; } .knap[disabled]:hover, .knap_tab_selected[disabled]:hover, .knap_tab_deselected[disabled]:hover { cursor: default; } a.knap { line-height: 24px; padding: 5px 8px 5px 9px; cursor: pointer; } .knap:hover, .knap_tab_deselected:hover { color: #000000; border: 1px solid #000000; background-color: #FFFFFF; } a:link.knap, a:visited.knap, a:active.knap { text-decoration: none; } a:hover.knap { text-decoration: none; color: #000000; border: 1px solid #000000; background-color: #FFFFFF; } .knap_tab_deselected { background: #d8d8d8; } /* Properly align inputs and their labels */ label > input, label > span { vertical-align: middle; } label > span { position: relative; top: -1px; left: 0; } /* Prevent Superscripts and Subscripts from Affecting Line-Height Source: https://css-tricks.com/snippets/css/prevent-superscripts-and-subscripts-from-affecting-line-height/ This fixes some layout issues we had with superscripts. */ sup, sub { vertical-align: baseline; position: relative; top: -0.4em; } sub { top: 0.4em; } /* Slut på definering af de klassiske typografi-elementer */ /* Start på tekst-container egenskaber */ /* Textfit klassen tilpasser tekstlængden så den passer i en container m. en fast bredde eller dynamisk sizede tabelceller m. max-width: 0. (overskydende tekst klippes af og erstattes m. ellipsis '...') */ td.textfit, th.textfit, td.aprTextfitAnimated, th.aprTextfitAnimated { max-width: 0; } .textfit, .textfit p, .textfit div, .textfit span, .textfit td, .textfit th, .aprTextfitAnimated, .aprTextfitAnimated p, .aprTextfitAnimated div, .aprTextfitAnimated span, .aprTextfitAnimated td, .aprTextfitAnimated th { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .textfit_hover, .textfit_hover p, .textfit_hover div, .textfit_hover span, .textfit_hover td, .textfit_hover th, .aprTextfitAnimated.expanded, .aprTextfitAnimated.expanded p, .aprTextfitAnimated.expanded div, .aprTextfitAnimated.expanded span, .aprTextfitAnimated.expanded td, .aprTextfitAnimated.expanded th { word-wrap: break-word; word-break: keep-all; white-space: normal; } /* Ellipsis klassen korter teksten af, så den altid kun står på én linje, og kun fylder så meget den nu kan i bredden. Der er ingen mouseover effekt, så dette er en statisk effekt (den kan dog toggles med JS) */ .ellipsis, .ellipsis p, .ellipsis div, .ellipsis span, .ellipsis td, .ellipsis th { overflow: hidden; } /* Textwrap klassen gør så teksten i en container passer indenfor den fastsatte bredde, og i stedet udvider sig i højden i takt med at den wrapper indenfor området. */ .textwrap { overflow-wrap: break-word; word-wrap: break-word; word-break: break-word; } /* Den tabel-kolonne-specifikke 'shrinkToFit' er meget selvindlysende: den ændrer en tabelcelles opførsel, til at trækker sig sammen så meget den kan, uden at bryde indholdet op i flere linjer. */ th.shrinkToFit, td.shrinkToFit { width: 1px; white-space: nowrap; } /* Slut på tekst-container egenskaber */ /* Start på effekter. */ .apr_css_effect_hover_scale_element_1_1_fast { transition: transform 0.4s ease-in-out; backface-visibility: hidden;↻ will-change: transform; transform: scale(1); } .apr_css_effect_hover_scale_element_1_1_fast:hover { transform: scale(1.1); z-index: 1; } .apr_css_effect_hover_scale_element_1_1_slow { transition: transform 1.5s ease-in-out; backface-visibility: hidden; will-change: transform; transform: scale(1); } .apr_css_effect_hover_scale_element_1_1_slow:hover { transform: scale(1.1); z-index: 1; } .apr_css_effect_hover_color_to_black_and_white { transition: filter 0.4s ease-in-out; will-change: filter; } .apr_css_effect_hover_color_to_black_and_white:hover { filter: url("data:image/svg+xml,%3Csvg version='1.1' baseProfile='full' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='grayscale'%3E%3CfeColorMatrix type='matrix' values='0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0'/%3E%3C/filter%3E%3C/svg%3E"#grayscale); /* Firefox 3.5+ */ filter: gray; /* IE5+ */ -webkit-filter: grayscale(1); /* Webkit Nightlies & Chrome Canary */ } .apr_css_effect_hover_black_and_white_to_color { filter: url("data:image/svg+xml,%3Csvg version='1.1' baseProfile='full' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='grayscale'%3E%3CfeColorMatrix type='matrix' values='0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0'/%3E%3C/filter%3E%3C/svg%3E"#grayscale); /* Firefox 3.5+ */ filter: gray; /* IE5+ */ -webkit-filter: grayscale(1); /* Webkit Nightlies & Chrome Canary */ transition: filter 0.4s ease-in-out; will-change: filter; } .apr_css_effect_hover_black_and_white_to_color:hover { filter: none; -webkit-filter: none; } .apr_css_effect_hover_rotate_5deg_clockwise { transition: transform 0.4s ease-in-out; } .apr_css_effect_hover_rotate_5deg_clockwise:hover { transform: rotate(5deg); } .apr_css_effect_hover_rotate_10deg_clockwise { transition: transform 0.4s ease-in-out; } .apr_css_effect_hover_rotate_10deg_clockwise:hover { transform: rotate(10deg); } .apr_css_effect_hover_rotate_15deg_clockwise { transition: transform 0.4s ease-in-out; } .apr_css_effect_hover_rotate_15deg_clockwise:hover { transform: rotate(15deg); } .apr_css_effect_hover_pulsing_fast { scale: 1; } .apr_css_effect_hover_pulsing_fast:hover { animation-name: pulse; animation-duration: 2s; animation-iteration-count: infinite; } @keyframes pulse { 0% {scale: 1;} 50% {scale: 0.95;} 100% {scale: 1;} } .apr_css_effect_hover_pulsing_slow { scale: 1; } .apr_css_effect_hover_pulsing_slow:hover { animation-name: pulse_slow; animation-duration: 4s; animation-iteration-count: infinite; } @keyframes pulse_slow { 0% {scale: 1;} 50% {scale: 0.95;} 100% {scale: 1;} } .apr_css_effect_load_pulsing_fast { scale: 1; animation-name: pulse; animation-duration: 2s; animation-iteration-count: infinite; } @keyframes pulse { 0% {scale: 1;} 50% {scale: 0.95;} 100% {scale: 1;} } .apr_css_effect_load_pulsing_slow { scale: 1; animation-name: pulse_slow; animation-duration: 4s; animation-iteration-count: infinite; } @keyframes pulse_slow { 0% {scale: 1;} 50% {scale: 0.95;} 100% {scale: 1;} } .apr_css_effect_load_grow_slow { scale: 1; animation-name: grow_slow; animation-duration: 4s; animation-iteration-count: 1; } @keyframes grow_slow { 0% {scale: .2;} 100% {scale: 1;} } .apr_css_effect_load_round_small_corner_top_left { border-top-left-radius: 75px; } .apr_css_effect_load_round_small_corner_top_right { border-top-right-radius: 75px; } .apr_css_effect_load_round_small_corner_bottom_right { border-bottom-right-radius: 75px; } .apr_css_effect_load_round_small_corner_bottom_left { border-bottom-left-radius: 75px; } .apr_css_effect_load_round_large_corner_top_left { border-top-left-radius: 100px; } .apr_css_effect_load_round_large_corner_top_right { border-top-right-radius: 100px; } .apr_css_effect_load_round_large_corner_bottom_right { border-bottom-right-radius: 100px; } .apr_css_effect_load_round_large_corner_bottom_left { border-bottom-left-radius: 100px; } .apr_css_effect_load_crop_as_circle:not(.mediaEngineOutput) { clip-path: circle(37.4% at center); } .apr_css_effect_load_crop_as_circle.mediaEngineOutput > div:first-child { clip-path: circle(49.6% at center); padding-top: 100% !important; } .apr_css_effect_load_crop_as_circle.mediaEngineOutput div.aprMedia, .apr_css_effect_load_crop_as_circle.mediaEngineOutput.aprVideo > div:first-child > div { padding-top: 100% !important; margin-top: -100% !important; } .apr_css_effect_load_round_corners_small { border-radius: 5px; } .apr_css_effect_load_round_corners_medium { border-radius: 15px; } .apr_css_effect_load_round_corners_large { border-radius: 25px; } @keyframes load_fade_in_fast { 0% { opacity: 0; } 100% { opacity: 1; } } .apr_css_effect_load_fade_in_fast { will-change: transform; animation: 0.4s ease-in-out 0s 1 load_fade_in_fast; } @keyframes load_fade_in_slow { 0% { opacity: 0; } 100% { opacity: 1; } } .apr_css_effect_load_fade_in_slow { will-change: transform; animation: 1.5s ease-in-out 0s 1 load_fade_in_slow; } @keyframes load_fade_in_down_fast { 0% { transform: translateY(-100%); opacity: 0; z-index: 5; } 99.99% { z-index: 5; } 100% { transform: translateY(0); opacity: 1; z-index: 1; } } .apr_css_effect_load_fade_in_down_fast { will-change: transform; animation: 0.4s ease-in-out 0s 1 load_fade_in_down_fast; } @keyframes load_fade_in_down_slow { 0% { transform: translateY(-100%); opacity: 0; z-index: 5; } 99.99% { z-index: 5; } 100% { transform: translateY(0); opacity: 1; z-index: 1; } } .apr_css_effect_load_fade_in_down_slow { will-change: transform; animation: 1.5s ease-in-out 0s 1 load_fade_in_down_slow; } @keyframes load_fade_in_left_fast { 0% { transform: translateX(100%); opacity: 0; z-index: 5; } 99.99% { z-index: 5; } 100% { transform: translateX(0); opacity: 1; z-index: 1; } } .apr_css_effect_load_fade_in_left_fast { will-change: transform; animation: 0.4s ease-in-out 0s 1 load_fade_in_left_fast; } @keyframes load_fade_in_left_slow { 0% { transform: translateX(100%); opacity: 0; z-index: 5; } 99.99% { z-index: 5; } 100% { transform: translateX(0); opacity: 1; z-index: 1; } } .apr_css_effect_load_fade_in_left_slow { will-change: transform; animation: 1.5s ease-in-out 0s 1 load_fade_in_left_slow; } @keyframes load_fade_in_up_fast { 0% { transform: translateY(100%); opacity: 0; z-index: 5; } 99.99% { z-index: 5; } 100% { transform: translateY(0); opacity: 1; z-index: 1; } } .apr_css_effect_load_fade_in_up_fast { will-change: transform; animation: 0.4s ease-in-out 0s 1 load_fade_in_up_fast; } @keyframes load_fade_in_up_slow { 0% { transform: translateY(100%); opacity: 0; z-index: 5; } 99.99% { z-index: 5; } 100% { transform: translateY(0); opacity: 1; z-index: 1; } } .apr_css_effect_load_fade_in_up_slow { will-change: transform; animation: 1.5s ease-in-out 0s 1 load_fade_in_up_slow; } @keyframes load_fade_in_right_fast { 0% { transform: translateX(-100%); opacity: 0; z-index: 5; } 99.99% { z-index: 5; } 100% { transform: translateX(0); opacity: 1; z-index: 1; } } .apr_css_effect_load_fade_in_right_fast { will-change: transform; animation: 0.4s ease-in-out 0s 1 load_fade_in_right_fast; } @keyframes load_fade_in_right_slow { 0% { transform: translateX(-100%); opacity: 0; z-index: 5; } 99.99% { z-index: 5; } 100% { transform: translateX(0); opacity: 1; z-index: 1; } } .apr_css_effect_load_fade_in_right_slow { will-change: transform; animation: 1.5s ease-in-out 0s 1 load_fade_in_right_slow; } .apr_css_effect_load_color_to_black_and_white { filter: url("data:image/svg+xml,%3Csvg version='1.1' baseProfile='full' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='grayscale'%3E%3CfeColorMatrix type='matrix' values='0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0'/%3E%3C/filter%3E%3C/svg%3E"#grayscale); /* Firefox 3.5+ */ filter: gray; /* IE5+ */ -webkit-filter: grayscale(1); /* Webkit Nightlies & Chrome Canary */ } .apr_css_effect_load_rotate_90deg_clockwise:not(.mediaEngineOutput), .apr_css_effect_load_rotate_90deg_clockwise.mediaEngineOutput.aprVideo > div > div, .apr_css_effect_load_rotate_90deg_clockwise.mediaEngineOutput .aprMedia { transform: rotate(90deg); } .apr_css_effect_load_rotate_180deg_clockwise:not(.mediaEngineOutput), .apr_css_effect_load_rotate_180deg_clockwise.mediaEngineOutput.aprVideo > div > div, .apr_css_effect_load_rotate_180deg_clockwise.mediaEngineOutput .aprMedia { transform: rotate(180deg); } .apr_css_effect_load_rotate_270deg_clockwise:not(.mediaEngineOutput), .apr_css_effect_load_rotate_270deg_clockwise.mediaEngineOutput.aprVideo > div > div, .apr_css_effect_load_rotate_270deg_clockwise.mediaEngineOutput .aprMedia { transform: rotate(270deg); } .apr_text_effect_load_typewriter { visibility: hidden; } .apr_text_effect_load_typewriter.animating, .apr_text_effect_load_typewriter.animated { visibility: visible; } .apr_text_effect_load_drop_shadow { visibility: hidden; } .apr_text_effect_load_drop_shadow.animating, .apr_text_effect_load_drop_shadow.animated { visibility: visible; } .apr_text_effect_colorflood_blue_to_green { background: linear-gradient(to right,#095FAB 10%, #25ABE8 50%, #57D75B 60%); background-size: auto auto; background-clip: border-box; background-size: 200% auto; background-clip: text; text-fill-color: transparent; -webkit-background-clip: text; -webkit-text-fill-color: transparent; animation: textclip 3s linear infinite; display: inline-block; } @keyframes textclip { to { background-position: 200% center; } } .apr_text_effect_colorflood_pink_to_yellow { background: linear-gradient(to right,#FFC3C3 10%, #E5FF99 50%, #FFE699 60%); background-size: auto auto; background-clip: border-box; background-size: 200% auto; background-clip: text; text-fill-color: transparent; -webkit-background-clip: text; -webkit-text-fill-color: transparent; animation: textclip 3s linear infinite; display: inline-block; } @keyframes textclip { to { background-position: 200% center; } } .apr_text_effect_colorflood_marine_to_purple { background: linear-gradient(to right,#1D2D50 10%, #3E3564 50%, #5E3C77 60%); background-size: auto auto; background-clip: border-box; background-size: 200% auto; background-clip: text; text-fill-color: transparent; -webkit-background-clip: text; -webkit-text-fill-color: transparent; animation: textclip 3s linear infinite; display: inline-block; } @keyframes textclip { to { background-position: 200% center; } } .apr_text_effect_colorflood_mint_to_turquoise { background: linear-gradient(to right,#CEE5D0 10%, #C3E2D4 50%, #B8DFD8 60%); background-size: auto auto; background-clip: border-box; background-size: 200% auto; background-clip: text; text-fill-color: transparent; -webkit-background-clip: text; -webkit-text-fill-color: transparent; animation: textclip 3s linear infinite; display: inline-block; } @keyframes textclip { to { background-position: 200% center; } } .apr_text_effect_load_broken_glass { position: absolute; color: black; opacity: 0; /* mix-blend-mode: screen; */ } .apr_text_effect_load_broken_glass.animated { opacity: 1; } /* Slut på effekter. */ /* Start af layout justering */ .float-right { float: right; } .float-left { float: left; } .clearfix::after { content: ''; display: table; clear: both; } /* Slut på layout justering */ /* Formularer */ /********************************************************************************************************************************************************************************** NOTE FROM SEBASTIAN: This is the new CSS-hotmouse (mouseover effect) class. It acts just like the old one, only much easier as you simply bind the class name to a DOM element and you're ready to go. In the future it will replace the old .hotmouse classes and similar JavaScript/jQuery implementations. */ table.hotmouse > tbody > tr:not(.noHotMouse) > td, table.hotmouse > tr:not(.noHotMouse) > td { transition: background-color 0.18s ease-in-out; } .hotmouse:not(table) { transition: background-color 0.18s ease-in-out; } table.hotmouse > tbody > tr:not(.noHotMouse):hover > td { background-color: #c6a32b !important; } .hotmouse:not(table):hover { background-color: #c6a32b !important; } /**********************************************************************************************************************************************************************************/ .hover_underline:hover { text-decoration: underline; cursor: pointer; } .hover_cursor, .hover_cursor:hover, .hover_cursor input, .hover_cursor:hover input { cursor: pointer; } table.hotmouse > tbody > tr:hover > td { transition: background-color 0.18s ease-in-out; background-color: #c6a32b !important; } .hotmouse:not(table):hover { transition: background-color 0.18s ease-in-out; background-color: #c6a32b !important; } /* Classes */ .error { font-family: Verdana, Geneva, Arial, Helvetica, sans-serif; color: #ff0000; background: #ffffff; padding: 2px; font-size: 12px; font-weight: normal; line-height: 15px; } .nobr { /* NoBreak - Make as a replacement of the deprecated HTML container */ white-space: nowrap; } .all_shadow { -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.5); -moz-box-shadow: 0 0 10px rgba(0, 0, 0, 0.5); box-shadow: 0 0 10px rgba(0, 0, 0, 0.5); } .dropshadow { -webkit-box-shadow: 6px 6px 6px rgba(0, 0, 0, 0.5); -moz-box-shadow: 6px 6px 6px rgba(0, 0, 0, 0.5); box-shadow: 6px 6px 6px rgba(0, 0, 0, 0.5); } span.lys, div.lys, table.lys, tr.lys, th.lys, td.lys, ul.lys, li.lys, label.lys { background: rgba(0, 0, 0, 0.04); } span.mork, div.mork, table.mork, tr.mork, th.mork, td.mork, ul.mork, li.mork, label.mork { background: rgba(0, 0, 0, 0.10); } div.hot, .hot, tr.hot, td.hot { transition: background-color 0.18s ease-in-out; background-color: #c6a32b; } table.zebra > thead > tr:not(.noBgColor):nth-child(even), table.zebra > tbody > tr:not(.noBgColor):nth-child(even), .zebra .row:nth-child(even) { background: rgba(0, 0, 0, 0.04); } table.zebra > thead > tr:not(.noBgColor):nth-child(odd), table.zebra > tbody > tr:not(.noBgColor):nth-child(odd), .zebra .row:nth-child(odd) { background: rgba(0, 0, 0, 0.10); } div.rowdots > *:first-child:not(.noRowDots) { border-top: 1px dotted #727a7e; } div.rowdots > *:not(.noRowDots) { border-bottom: 1px dotted #727a7e; } /* Table border styles */ table.rowdots > tbody > tr:first-child > td:not(.noRowDots), table.rowdots > tr:first-child > td:not(.noRowDots) { border-top: 1px dotted #727a7e; } table.rowdots > tbody > tr > td:not(.noRowDots), table.rowdots > tr > td:not(.noRowDots) { border-bottom: 1px dotted #727a7e; } /* BEGIN jQuery Table sorter */ table.tablesorter { font-family: Verdana, Geneva, Arial, Helvetica, sans-serif; color: #333333; font-size: 11px; font-weight: normal; border-collapse: collapse; } table.tablesorter thead tr th, table.tablesorter tfoot tr th { background-color: #e3e3e3; font-size: 11px; text-align: left; padding: 3px 20px 3px 3px; /*border: 1px solid transparent;*/ } table.tablesorter thead tr .header { background-image: url(images/tablesorter.bg.gif); background-repeat: no-repeat; background-position: center right; cursor: pointer; } table.tablesorter tbody > tr td { padding: 3px 3px 3px 3px; font-size: 11px; color: #333333; /* vertical-align: top;*/ /*border: 1px solid transparent;*/ } table.tablesorter tbody > tr:not(.noBgColor) td { background-color: #eeeeee; } table.tablesorter tbody tr.odd:not(.noBgColor) td { background-color: #e3e3e3; } table.tablesorter tbody tr.even:not(.noBgColor) td { background-color: #eeeeee; } table.tablesorter tbody tr.hot td { transition: background-color 0.18s ease-in-out; background-color: #ffff99; } table.tablesorter thead tr .headerSortUp { background-image: url(images/tablesorter.desc.gif); } table.tablesorter thead tr .headerSortDown { background-image: url(images/tablesorter.asc.gif); } table.tablesorter thead tr .headerSortDown, table.tablesorter thead tr .headerSortUp { color: #000000; } /* END jQuery Table sorter */ /****************************************/ /* Responsive for paragraphs/components */ /****************************************/ @media screen and (max-width: 1024px) { table.responsive:not([style*='display: none;']), td.responsive:not([style*='display: none;']), div.responsive:not([style*='display: none;']), img.responsive:not([style*='display: none;']), label.responsive:not([style*='display: none;']) { float: none !important; display: block !important; } table.responsive:not([style*='display: none;']), td.responsive:not([style*='display: none;']), div.responsive:not([style*='display: none;']):not(.apr_paragraph), img.responsive:not([style*='display: none;']), label.responsive:not([style*='display: none;']) { max-width: none !important; width: 100% !important; margin-left: 0 !important; margin-right: 0 !important; } div.responsive.apr_paragraph_child { width: 100% !important; margin-left: 0 !important; margin-right: 0 !important; } div.responsive.apr_paragraph_child:not(:first-child) { margin-top: 28px; } } /*******************/ /* Developer tools */ /*******************/ /* Used when designing tables, so borders are visible */ table.borders { border-collapse: collapse; border: 1px solid #ff0000 !important; box-sizing: border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; } table.borders > tr > td, table.borders > tr > th, table.borders > tbody > tr > td, table.borders > tbody > tr > th, table.borders > thead > tr > td, table.borders > thead > tr > th, table.borders > tfoot > tr > td, table.borders > tfoot > tr > th { border: 1px solid #ff0000 !important; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; } /* Used when tables are used for design in frontend */ table.stripped { border-collapse: collapse; border-spacing: 0; border-spacing: 0; box-sizing: border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; } table.stripped td, table.stripped th { margin: 0; padding: 0; border: 0; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; } /* Apricore Show Archive Image */ .apr_show_archive_image{ position: absolute; z-index: 999; left: -9999px; top: -9999px; background-color: #dedede; padding: 5px; border: 1px solid #ffffff; /* width: 320px;*/ } .apr_show_archive_image div { font-family: Verdana, Geneva, Arial, Helvetica, sans-serif; font-size: 11px; font-weight: normal; margin: 0; color: #ffffff; background-color: #222222; padding: 7px; } .apr_show_archive_image li, .tooltip td { font-family: Verdana, Geneva, Arial, Helvetica, sans-serif; font-size: 11px; font-weight: normal; color: #ffffff; } /*************************/ /* FontAwesome overrides */ /*************************/ .fa.icon_16 { font-size: 18px; /* pixel size is supposed to be 2px larger, to accomodate for the slight font-awesome font size difference */ } .fa.icon_32 { font-size: 34px; /* pixel size is supposed to be 2px larger, to accomodate for the slight font-awesome font size difference */ } @media screen and (max-width: 1024px) { #overlayConfirmQuestionCircle { font-size: 6vw; margin-top: 0.5vw; } } /***********************/ /* Toggleable content */ /***********************/ .toggleable_content { opacity: 0; overflow: hidden; visibility: hidden; height: 0; } .apr_system div.btnToggleContent:not(.arrow):not(.stripped), .apr_system div.toggleable > div.btnToggleContent:not(.arrow):not(.stripped), div.btnToggleContent:not(.arrow):not(.stripped) { cursor: pointer; background-image: url('update/images/icons/plus.ico.gif'); background-repeat: no-repeat; background-position: 2px -1px; background-size: 16px; padding-left: 16px; display: flex; align-items: center; } .apr_system div.btnToggleContent:not(.arrow):not(.stripped).expand, .apr_system div.toggleable > div.btnToggleContent:not(.arrow):not(.stripped).expand, div.btnToggleContent:not(.arrow):not(.stripped).expand { background-image: url('update/images/icons/minus.ico.gif'); } .apr_system div.btnToggleContent.arrow, .apr_system div.toggleable > div.btnToggleContent.arrow, div.btnToggleContent.arrow { cursor: pointer; padding-right: 16px; position: relative; } .apr_system div.btnToggleContent.arrow:not(.expand):not(.loading)::after, .apr_system div.toggleable > div.btnToggleContent.arrow:not(.expand):not(.loading)::after, div.btnToggleContent.arrow:not(.expand):not(.loading)::after { content: '◣'; display: block; position: absolute; right: 0; top: 53%; transform: rotate(-45deg) translateY(-75%); } div.btnToggleContent.arrow.expand:not(.loading):not(.loading)::after { content: '◣'; display: block; position: absolute; right: 0; top: 53%; transform: rotate(135deg) translate(4px, 57%); } div.btnToggleContent.loading { background-image: url('update/images/icons/spinner.ico.gif'); background-repeat: no-repeat; background-position: right 2px top -1px; background-size: 16px; padding-right: 16px; } /******************************/ /* Apricore animation effects */ /******************************/ /* This class is tightly coupled with the rippleFadeIn animation effect and is required for the animation to work properly */ .rippleFadeIn { opacity: 0; } /**************/ /* Components */ /**************/ .comp_feliks_course_databox_frontend.lilletekst, .comp_feliks_course_databox_frontend .lilletekst { font-size: 11px; color: inherit; font-family: Arial, Helvetica, sans-serif; } .comp_feliks_course_databox_frontend.broedtekst, .comp_feliks_course_databox_frontend .broedtekst { font-size: 12px; color: inherit; font-family: Arial, Helvetica, sans-serif; } .comp_text_and_photo p, .comp_fact_box p { margin: 0; padding: 0; border: 0; line-height: auto; } /* ------------------------------------------------------------- */ /* System style - used in areas where user is logged in */ /* ------------------------------------------------------------- */ .apr_system html, .apr_system body, .apr_system span, .apr_system applet, .apr_system object, .apr_system iframe, .apr_system h1, .apr_system h2, .apr_system h3, .apr_system h4, .apr_system h5, .apr_system h6, .apr_system p, .apr_system blockquote, .apr_system pre, .apr_system a, .apr_system abbr, .apr_system acronym, .apr_system address, .apr_system big, .apr_system cite, .apr_system code, .apr_system del, .apr_system dfn, .apr_system em, .apr_system img, .apr_system ins, .apr_system kbd, .apr_system q, .apr_system s, .apr_system samp, .apr_system small, .apr_system strike, .apr_system sub, .apr_system sup, .apr_system tt, .apr_system var, .apr_system b, .apr_system u, .apr_system i:not(.fa), .apr_system center, .apr_system dl, .apr_system dt, .apr_system dd, .apr_system ol, .apr_system ul, .apr_system li, .apr_system fieldset, .apr_system form, .apr_system label, .apr_system legend, .apr_system table, .apr_system caption, .apr_system tbody, .apr_system tfoot, .apr_system thead, .apr_system tr, .apr_system th, .apr_system td, .apr_system article, .apr_system aside, .apr_system canvas, .apr_system details, .apr_system embed, .apr_system figure, .apr_system figcaption, .apr_system footer, .apr_system header, .apr_system hgroup, .apr_system menu, .apr_system nav, .apr_system output, .apr_system ruby, .apr_system section, .apr_system summary, .apr_system time, .apr_system mark, .apr_system audio, .apr_system video { margin: 0; padding: 0; border: 0; font-size: 100%; /*font: inherit;*/ font-family: Verdana, Geneva, Arial, Helvetica, sans-serif; } /* HTML5 display-role reset for older browsers */ .apr_system article, .apr_system aside, .apr_system details, .apr_system figcaption, .apr_system figure, .apr_system footer, .apr_system header, .apr_system hgroup, .apr_system menu, .apr_system nav, .apr_system section { display: block; } .apr_system body { /* line-height: 1; */ } .apr_system ol, .apr_system ul { list-style: none; } .apr_system blockquote, .apr_system q { quotes: none; } .apr_system blockquote:before, .apr_system blockquote:after, .apr_system q:before, .apr_system q:after { content: ''; content: none; } .apr_system table { border-collapse: collapse; border-spacing: 0; } .apr_system input, .apr_system textarea, .apr_system select, .apr_system iframe { box-sizing: border-box; } /* Properly align inputs and their labels */ .apr_system label > input, .apr_system label > span { vertical-align: middle; } .apr_system label > span { position: relative; top: -1px; left: 0; } /* Prevent Superscripts and Subscripts from Affecting Line-Height Source: https://css-tricks.com/snippets/css/prevent-superscripts-and-subscripts-from-affecting-line-height/ This fixes some layout issues we had with superscripts. */ .apr_system sup, .apr_system sub { vertical-align: baseline; position: relative; top: -0.4em; } .apr_system sub { top: 0.4em; } .apr_system .dropshadow { -webkit-box-shadow: 6px 6px 6px rgba(0, 0, 0, 0.5); -moz-box-shadow: 6px 6px 6px rgba(0, 0, 0, 0.5); box-shadow: 6px 6px 6px rgba(0, 0, 0, 0.5); } .apr_system html { height : 100%; margin : 0; padding: 0; } .apr_system body { height : 100%; margin : 0; padding: 0; background: #333333 url(images/apr_symbol_tile_bg.png); } .apr_system .rubrik, .apr_system div.rubrik, .apr_system span.rubrik, .apr_system td.rubrik, .apr_system th.rubrik, .apr_system a.rubrik, .apr_system h1.rubrik { font-family: Verdana, Geneva, Arial, Helvetica, sans-serif; color: #333333; font-size: 18px; font-weight: bold; padding-bottom: 9px; text-transform: none; } .apr_system .underrubrik, .apr_system div.underrubrik, .apr_system span.underrubrik, .apr_system td.underrubrik, .apr_system th.underrubrik, .apr_system h2.underrubrik { font-family: Verdana, Geneva, Arial, Helvetica, sans-serif; color: #333333; font-size: 13px; padding-bottom: 12px; text-transform: none; } /* Here we make sure to exclude styling of font-awesome elements (resembled by the 'fa' class) */ .apr_system .broedtekst:not(.fa), .apr_system div.broedtekst:not(.fa), .apr_system span.broedtekst:not(.fa), .apr_system td.broedtekst:not(.fa), .apr_system th.broedtekst:not(.fa), .apr_system a.broedtekst:not(.fa), .apr_system label.broedtekst:not(.fa), .apr_system legend, .apr_system li { font-family: Verdana, Geneva, Arial, Helvetica, sans-serif; color: #333333; font-size: 12px; font-weight: normal; text-align: left; line-height: 1.3em; text-transform: none; } .apr_system .broedtekst em, .apr_system .broedtekst strong { font-size: 12px } .apr_system a:link.broedtekst, .apr_system a:visited.broedtekst { color: #333333; } .apr_system a:hover.broedtekst { color: #333333; background-color: transparent; } .apr_system a:active.broedtekst { color: #333333; text-decoration: none; } .apr_system .mellemrubrik, .apr_system div.mellemrubrik, .apr_system span.mellemrubrik, .apr_system td.mellemrubrik, .apr_system th.mellemrubrik, .apr_system h1.mellemrubrik, .apr_system h2.mellemrubrik, .apr_system h3.mellemrubrik { font-family: Verdana, Geneva, Arial, Helvetica, sans-serif; color: #333333; font-size: 12px; font-weight: bold; line-height: 17px; padding-bottom: 4px; text-transform: none; } .apr_system .mellemrubrik em, .apr_system .mellemrubrik strong { font-size: 12px; } .apr_system .lilletekst, .apr_system div.lilletekst, .apr_system td.lilletekst, .apr_system th.lilletekst, .apr_system span.lilletekst, .apr_system label.lilletekst, .apr_system a.lilletekst { font-family: Verdana, Geneva, Arial, Helvetica, sans-serif; color: #333333; font-size: 11px; font-weight: normal; text-transform: none; } .apr_system a:link.lilletekst, .apr_system a:visited.lilletekst { color: #333333; font-weight: bold; text-decoration: none; } .apr_system a:active.lilletekst, .apr_system a:hover.lilletekst { color: #333333; text-decoration: underline; background-color: transparent; } .apr_system .mikrotekst, .apr_system div.mikrotekst, .apr_system span.mikrotekst, .apr_system td.mikrotekst, .apr_system th.mikrotekst, .apr_system label.mikrotekst, .apr_system a.mikrotekst { font-family: Verdana, Geneva, Arial, Helvetica, sans-serif; color: #333333; font-size: 8px; font-weight: normal; text-transform: none; } .apr_system .rubrik, .apr_system .underrubrik { padding-left: 0px !important; /* !important is required here since some designs have media queries that use !important */ } .apr_system form { margin-top: 0; margin-bottom: 0; } .apr_system input[type="text"], .apr_system input[type="password"], .apr_system textarea, .apr_system select { box-sizing: border-box; } .apr_system select.same_height_as_input_text { height: 21px; } .apr_system input[type="radio"], .apr_system input[type="checkbox"], .apr_system input[type="button"], .apr_system input[type=submit] { outline: none; } input[disabled], button[disabled], textarea[disabled], select[disabled] { opacity: 0.5; } .apr_system input.knap, .apr_system button.knap, .apr_system a.knap_tab_selected, .apr_system div.knap_tab_selected, .apr_system label.knap_tab_selected, .apr_system a.knap_tab_deselected, .apr_system div.knap_tab_deselected, .apr_system label.knap_tab_deselected { height: 24px; background-color: #FFFFFF; font-family: Verdana, Geneva, Arial, Helvetica, sans-serif; color: #000000; font-size: 9px; padding: 4px 8px 4px 9px; text-align: center; box-sizing: border-box; border: 1px solid #000000; border-radius: 12px; cursor: pointer; } .apr_system .knap_tab_selected, .apr_system .knap_tab_deselected { border-bottom-left-radius: 0 !important; border-bottom-right-radius: 0 !important; } .apr_system .knap_tab_selected { border-bottom: none; } .apr_system div.uni_login_button { font-family: Arial, Helvetica, sans-serif; font-weight: bold; font-size: 16px; color: #707578; border: #44494d 3px solid; padding: 12px; background-color: #dfe1e2; display: inline-block; box-sizing: border-box; text-align: center; } .apr_system div.uni_login_button:hover { background-color: #ffffff; border-color: red; border-width: 4px; padding: 11px; color: red; cursor: pointer; } .apr_system .datepicker { width: 72px; cursor: pointer; } .apr_system a:link.knap, .apr_system a:visited.knap, .apr_system a:active.knap { text-decoration: none; border: 2px outset; } .apr_system a:hover.knap { text-decoration: none; color: #<= APR_FRAMEWORK_CSS_TEXT_COLOR; ?>; border: 1px solid #333333; color: #ffffff; } .apr_system select { font-family: Verdana, Geneva, Arial, Helvetica, sans-serif; color: #333333; font-size: 12px; font-weight: normal; } .apr_system fieldset { border: 1px #727a7e solid; padding-left: 12px; padding-right: 13px; } /* Strip tables */ .apr_system table { border-collapse: collapse; border-spacing: 0; box-sizing: border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; } .apr_system table strong, .apr_system table em { font-size: 11px; } .apr_system table:not(.tablesorter):not(.info_symbol_explanation):not(.default_modern):not(.default) > tbody > tr > td, .apr_system table:not(.tablesorter):not(.info_symbol_explanation):not(.default_modern):not(.default) > thead > tr > th:not(.tablesorter-header) { margin: 0; padding: 0; border: 0; box-sizing: border-box; } /* Zebra coloring */ .apr_system span.lys, .apr_system div.lys, .apr_system table.lys, .apr_system tr.lys, .apr_system th.lys, .apr_system td.lys, .apr_system ul.lys, .apr_system li.lys, .apr_system label.lys { background-color: #eeeeee; } .apr_system span.mork, .apr_system div.mork, .apr_system table.mork, .apr_system tr.mork, .apr_system th.mork, .apr_system td.mork, .apr_system ul.mork, .apr_system li.mork, .apr_system label.mork { background-color: #d8d8d8; } .apr_system span.progress_bar_bg, .apr_system div.progress_bar_bg, .apr_system td.progress_bar_bg, .apr_system tr.progress_bar_bg { background-color: eeeeee; } .apr_system span.hot, .apr_system div.hot, .apr_system .hot, .apr_system tr.hot, .apr_system td.hot { transition: background-color 0.18s ease-in-out; background-color: #ffff99 !important; } .apr_system span.selected, .apr_system div.selected, .apr_system .selected, .apr_system tr.selected, .selected { background-color: #33ff33; } .apr_system table.hotmouse > tbody > tr:not(.noHotMouse):hover > td { background-color: #ffff99 !important; } .apr_system .hotmouse:not(table):hover { background-color: #ffff99 !important; } .apr_system table.hotmouse > tbody > tr:hover > td { transition: background-color 0.18s ease-in-out; background-color: #ffff99 !important; } .apr_system .hotmouse:not(table):hover { transition: background-color 0.18s ease-in-out; background-color: #ffff99 !important; } /* Zebra */ .apr_system table.zebra thead tr th { font-weight: bold; } .apr_system table.zebra > thead > tr:not(.noBgColor) { background: #eeeeee; } .apr_system table.zebra > tbody > tr:not(.noBgColor):nth-child(odd), .apr_system .zebra > .row:nth-child(odd) { background: #e3e3e3; } .apr_system table.zebra > tbody > tr:not(.noBgColor):nth-child(even), .apr_system .zebra > .row:nth-child(even) { background: #eeeeee; } /* Used for table layout that follow the old browser default setting, except without border */ .apr_system table.default > tbody > tr > td, .apr_system table.default > tfoot > tr > td, .apr_system table.default > thead > tr > th { padding: 2px; } .apr_system table.default_modern > tbody > tr > td, .apr_system table.default_modern > tfoot > tr > td, .apr_system table.default_modern > thead > tr > th, .apr_system div.default_modern, .apr_system label.default_modern { padding: 4px; } .apr_system table.zebraSwap > thead > tr:not(.noBgColor) > th { background: #e3e3e3; } .apr_system table.zebraSwap > tbody > tr:nth-child(odd):not(.noBgColor) > td, .apr_system .zebraSwap > .row:nth-child(odd) { background: #eeeeee; } .apr_system table.zebraSwap > tbody > tr:nth-child(even):not(.noBgColor) > td, .apr_system .zebraSwap > .row:nth-child(even) { background: #e3e3e3; } /* Lister */ .apr_system .bullet_list { list-style-type: disc; padding-top: 6px; padding-bottom: 16px; } .apr_system .bullet_list li { margin-left: 22px; } .apr_system .decimal_list { list-style-type: decimal; padding-top: 8px; padding-bottom: 16px; } .apr_system .decimal_list li { margin-left: 28px; } .apr_system .info_click { cursor: pointer; } .apr_system .tabel { border: #B3B3B3 1px solid; } .apr_system div.tab_selected { font-family: Verdana, Geneva, Arial, Helvetica, sans-serif; color: #333333; font-size: 11px; font-weight: normal; text-decoration: none !important; float: left; padding: 4px; background: #eeeeee url(update/images/tab_selected_bg.png); background-repeat: repeat-x; border-left: #eeeeee 2px solid; border-top: #eeeeee 2px solid; border-right: #eeeeee 2px solid; } .apr_system div.tab_deselected { font-family: Verdana, Geneva, Arial, Helvetica, sans-serif; color: #333333; font-size: 11px; font-weight: normal; text-decoration: none !important; float: left; padding: 4px; margin-left: 1px; margin-top: 1px; margin-right: 1px; background: #d8d8d8 url(update/images/tab_deselected_bg.png) top left; background-repeat: repeat-x; border-left: #d8d8d8 1px solid; border-top: #d8d8d8 1px solid; border-right: #d8d8d8 1px solid; } .apr_system div.tab_selected a, .apr_system div.tab_selected a:link, .apr_system div.tab_selected a:visited, .apr_system div.tab_selected a:active, .apr_system div.tab_selected a:hover { font-family: Verdana, Geneva, Arial, Helvetica, sans-serif; color: #333333; font-size: 11px; font-weight: normal; text-decoration: none !important; background-color: transparent; } .apr_system div.tab_deselected a, .apr_system div.tab_deselected a:link, .apr_system div.tab_deselected a:visited, .apr_system div.tab_deselected a:active, .apr_system div.tab_deselected a:hover { font-family: Verdana, Geneva, Arial, Helvetica, sans-serif; color: #333333; font-size: 11px; font-weight: normal; text-decoration: none !important; background-color: transparent; } .apr_system div.section_divider_text, div.section_divider_text { line-height: 0.5; text-align: center; box-sizing: border-box; margin: 125px 0; width: 100%; } .apr_system div.section_divider_text span, div.section_divider_text span { display: inline-block; position: relative; box-sizing: border-box; font-weight: bold; } .apr_system div.section_divider_text span:before, div.section_divider_text span:before, .apr_system div.section_divider_text span:after, div.section_divider_text span:after { content: ""; position: absolute; height: 1px; border-bottom: 1px solid #727a7e; top: 4px; width: 400%; } @media screen and (max-width: 1024px) { .apr_system div.section_divider_text span:before, div.section_divider_text span:before, .apr_system div.section_divider_text span:after, div.section_divider_text span:after { width: 25vw; } } .apr_system div.section_divider_text span:before, div.section_divider_text span:before { right: 100%; margin-right: 15px; box-sizing: border-box; } .apr_system div.section_divider_text span:after, div.section_divider_text span:after { left: 100%; margin-left: 15px; box-sizing: border-box; } .apr_system div.vtab_selector, div.vtab_selector { position: relative; width: 18px ; padding-top: 7px; padding-left: 4px; box-sizing: border-box; } .apr_system div.vtab_label, div.vtab_label { width: 9px; margin: 0; } .apr_system div.vtab_selector_corner, div.vtab_selector_corner { border-color: transparent transparent #FFFFFF #FFFFFF; border-style: solid; border-width: 3px 11px; width: 0; height: 0; position: absolute; bottom: 0; left: 0; } /******************************/ /* Simple Tooltip (jQuery UI) */ /******************************/ .apr_system div.ui-tooltip, div.ui-tooltip { position: absolute; z-index: 999; left: -9999px; top: -9999px; background: rgba(0, 0, 0, 0.20); padding: 5px; border: 1px solid #FFFFFF; width: 200px; } .apr_system div.ui-tooltip > div.ui-tooltip-content, div.ui-tooltip > div.ui-tooltip-content { font-family: Arial, Verdana, Helvetica, sans-serif; font-size: 11px; font-weight: normal; margin: 0; color: #FFFFFF; background-color: #000000; padding: 7px; box-sizing: border-box; } .apr_system div.ui-tooltip li, div.ui-tooltip li, .apr_system div.ui-tooltip td, div.ui-tooltip td { font-family: Arial, Verdana, Helvetica, sans-serif; font-size: 11px; font-weight: normal; color: #FFFFFF; box-sizing: border-box; } .apr_system div.ui-tooltip.wide, div.ui-tooltip.wide { width: 100%; max-width: 760px } .apr_system div.ui-tooltip.shallow, div.ui-tooltip.shallow { width: 100%; max-width: 320px } .apr_system div.ui-tooltip-content, div.ui-tooltip-content { color: #ffffff !important; } /* ****************** */ /* Symbol Explanation */ /* ****************** */ .apr_system table.info_symbol_explanation, table.info_symbol_explanation { width: 100%; border-collapse: collapse; background: #FFFFFF; padding: 0; margin: 0; } .apr_system table.info_symbol_explanation > caption, table.info_symbol_explanation > caption { font-weight: bold; color: #FFFFFF; text-align: left; margin: 0 0 10px 0; padding: 0; } .apr_system table.info_symbol_explanation tr, table.info_symbol_explanation tr { border-bottom: 1px #000000 dotted; } .apr_system table.info_symbol_explanation tr:last-child, table.info_symbol_explanation tr:last-child { border-bottom: none; } .apr_system table.info_symbol_explanation tr td, table.info_symbol_explanation tr td { font-size: 9px; color: #000000; padding: 4px; } .apr_system table.info_symbol_explanation tr td:first-child, table.info_symbol_explanation tr td:first-child { padding: 4px; vertical-align: top; width: 1px; white-space: nowrap; } .apr_system table.info.symbol_explanation_table td, table.info.symbol_explanation_table td { padding: 1px; font-family: Arial, Verdana, Helvetica, sans-serif; font-size: 9px; font-weight: normal; color: #000000; box-sizing: border-box; } /************************************/ /* WCAG | Web Content Accessibility */ /************************************/ /* For a SkipNavigation/SkipToContent link */ .skipnav { text-align: left; } .skipnav a { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; } .skipnav a:focus, .skipnav a:active { position: static; left: 0; width: auto; height: auto; overflow: visible; text-decoration: underline; } /*********/ /* Print */ /*********/ @media print { .noprint, .noprint *, .no_print, .no_print *, .no-print, .no-print * { display: none !important; } .tab_container { padding: 0 !important; } * { color: #000000 !important; background: #FFFFFF !important; } }