/* default-2.0 */ /* default-2.0 / utils / vars */ @font-face { font-family: "brandonTextRegular"; src: url("//www.qub.ac.uk/menu_items/fonts/0030004896-28092017/Fonts/d1df2cf1-87b2-4e28-8ece-7f7060fbe410.eot?#iefix"); src: url("//www.qub.ac.uk/menu_items/fonts/0030004896-28092017/Fonts/d1df2cf1-87b2-4e28-8ece-7f7060fbe410.eot?#iefix") format("eot"), url("//www.qub.ac.uk/menu_items/fonts/0030004896-28092017/Fonts/52f9cda1-296e-424d-8b50-4fd5a5ecebe8.woff2") format("woff2"), url("//www.qub.ac.uk/menu_items/fonts/0030004896-28092017/Fonts/7338e521-1a74-46b5-8e9b-2c6f677d6bb1.woff") format("woff"), url("//www.qub.ac.uk/menu_items/fonts/0030004896-28092017/Fonts/dc16c1a8-c8e7-43ad-8fb7-45ac2279aca4.ttf") format("truetype"), url("//www.qub.ac.uk/menu_items/fonts/0030004896-28092017/Fonts/78ef5d18-240e-4368-b29e-f943782516d3.svg#78ef5d18-240e-4368-b29e-f943782516d3") format("svg"); } @font-face { font-family: "brandonTextRegularItalic"; src: url("Fonts/bfd9fddc-1ca1-495a-beca-3674be202b6b.eot?#iefix"); src: url("Fonts/bfd9fddc-1ca1-495a-beca-3674be202b6b.eot?#iefix") format("eot"), url("Fonts/fe511ebd-6da6-4cfd-bf57-b43974ecfde2.woff2") format("woff2"), url("Fonts/012d00b6-a05a-482b-b800-afc6de5d0cec.woff") format("woff"), url("Fonts/c55640c4-6252-4012-97e4-196c9c4654e6.ttf") format("truetype"), url("Fonts/1e6c5ce5-b727-43a9-acd3-5cd6f7358d88.svg#1e6c5ce5-b727-43a9-acd3-5cd6f7358d88") format("svg"); } @font-face { font-family: "brandonTextMedium"; src: url("//www.qub.ac.uk/menu_items/fonts/0030004896-28092017/Fonts/74e435f6-2a87-43c8-ad0b-105704c67c98.eot?#iefix"); src: url("//www.qub.ac.uk/menu_items/fonts/0030004896-28092017/Fonts/74e435f6-2a87-43c8-ad0b-105704c67c98.eot?#iefix") format("eot"), url("//www.qub.ac.uk/menu_items/fonts/0030004896-28092017/Fonts/c83295f4-0f05-4b57-8e1f-c82730f85771.woff2") format("woff2"), url("//www.qub.ac.uk/menu_items/fonts/0030004896-28092017/Fonts/db135693-9da3-41c1-95f0-99b148f189ae.woff") format("woff"), url("//www.qub.ac.uk/menu_items/fonts/0030004896-28092017/Fonts/8ccd39a5-46cd-4215-83e6-5c6a8fe1e41e.ttf") format("truetype"), url("//www.qub.ac.uk/menu_items/fonts/0030004896-28092017/Fonts/80246578-df7c-491f-a192-41b4d8c5d0e7.svg#80246578-df7c-491f-a192-41b4d8c5d0e7") format("svg"); } @font-face { font-family: "brandonTextMediumItalic"; src: url("//www.qub.ac.uk/menu_items/fonts/0030004896-28092017/Fonts/d9520111-2869-4a1d-8b19-5f3b0d151341.eot?#iefix"); src: url("//www.qub.ac.uk/menu_items/fonts/0030004896-28092017/Fonts/d9520111-2869-4a1d-8b19-5f3b0d151341.eot?#iefix") format("eot"), url("//www.qub.ac.uk/menu_items/fonts/0030004896-28092017/Fonts/af082bcb-a1d0-41b5-88b1-63aab9f7b377.woff2") format("woff2"), url("//www.qub.ac.uk/menu_items/fonts/0030004896-28092017/Fonts/9d023a4b-2015-44b3-bc93-a64924f91d47.woff") format("woff"), url("//www.qub.ac.uk/menu_items/fonts/0030004896-28092017/Fonts/af2c4c8a-d3cb-41a6-bfae-b6d735acafea.ttf") format("truetype"), url("//www.qub.ac.uk/menu_items/fonts/0030004896-28092017/Fonts/f0360d7d-6f40-4d99-ba79-7e8a1bd319e0.svg#f0360d7d-6f40-4d99-ba79-7e8a1bd319e0") format("svg"); } @font-face { font-family: "brandonTextBold"; src: url("//www.qub.ac.uk/menu_items/fonts/0030004896-28092017/Fonts/3db34e07-d054-4aed-9c27-6b5708b1e00a.eot?#iefix"); src: url("//www.qub.ac.uk/menu_items/fonts/0030004896-28092017/Fonts/3db34e07-d054-4aed-9c27-6b5708b1e00a.eot?#iefix") format("eot"), url("//www.qub.ac.uk/menu_items/fonts/0030004896-28092017/Fonts/72a6de55-a3d4-4d11-ab4b-ce55f84e4797.woff2") format("woff2"), url("//www.qub.ac.uk/menu_items/fonts/0030004896-28092017/Fonts/8c446c6c-0479-4073-afca-e6ea56bba75e.woff") format("woff"), url("//www.qub.ac.uk/menu_items/fonts/0030004896-28092017/Fonts/64541b6d-cf83-4105-8e76-b45369ee2eda.ttf") format("truetype"), url("//www.qub.ac.uk/menu_items/fonts/0030004896-28092017/Fonts/c40070ec-9baa-4873-9970-f6f715c09ce5.svg#c40070ec-9baa-4873-9970-f6f715c09ce5") format("svg"); } @font-face { font-family: "brandonTextBoldItalic"; src: url("//www.qub.ac.uk/menu_items/fonts/0030004896-28092017/Fonts/0e8a729c-8823-46ed-ab01-0d5b597b9126.eot?#iefix"); src: url("//www.qub.ac.uk/menu_items/fonts/0030004896-28092017/Fonts/0e8a729c-8823-46ed-ab01-0d5b597b9126.eot?#iefix") format("eot"), url("//www.qub.ac.uk/menu_items/fonts/0030004896-28092017/Fonts/728adb4a-2533-4e0f-863e-7b29d60acc14.woff2") format("woff2"), url("//www.qub.ac.uk/menu_items/fonts/0030004896-28092017/Fonts/e955a229-afd1-4bf0-89b8-96cf8c8d9b27.woff") format("woff"), url("//www.qub.ac.uk/menu_items/fonts/0030004896-28092017/Fonts/7b378600-8986-4404-8b35-575704a3a6a0.ttf") format("truetype"), url("//www.qub.ac.uk/menu_items/fonts/0030004896-28092017/Fonts/ee859bde-6eb5-4fe2-a865-e9baae4fdcd7.svg#ee859bde-6eb5-4fe2-a865-e9baae4fdcd7") format("svg"); } @font-face { font-family: "brandonTextBlack"; src: url("//www.qub.ac.uk/menu_items/fonts/0030004896-28092017/Fonts/8435c3ba-c928-4f79-a6be-9bad2262156a.eot?#iefix"); src: url("//www.qub.ac.uk/menu_items/fonts/0030004896-28092017/Fonts/8435c3ba-c928-4f79-a6be-9bad2262156a.eot?#iefix") format("eot"), url("//www.qub.ac.uk/menu_items/fonts/0030004896-28092017/Fonts/508bac1e-5a02-4297-8faf-c614b4109f09.woff2") format("woff2"), url("//www.qub.ac.uk/menu_items/fonts/0030004896-28092017/Fonts/dff3dd56-be73-4743-9ea9-de21b8003a72.woff") format("woff"), url("//www.qub.ac.uk/menu_items/fonts/0030004896-28092017/Fonts/746b7bfc-4ce5-41f0-b893-9cf91d8cae1c.ttf") format("truetype"), url("//www.qub.ac.uk/menu_items/fonts/0030004896-28092017/Fonts/ce20c398-47a8-470a-8687-50d04dcb481b.svg#ce20c398-47a8-470a-8687-50d04dcb481b") format("svg"); } @font-face { font-family: "brandonTextBlackItalic"; src: url("//www.qub.ac.uk/menu_items/fonts/0030004896-28092017/Fonts/8cb15d1a-b2d5-46fe-b0fa-3ba9b4d22a5a.eot?#iefix"); src: url("//www.qub.ac.uk/menu_items/fonts/0030004896-28092017/Fonts/8cb15d1a-b2d5-46fe-b0fa-3ba9b4d22a5a.eot?#iefix") format("eot"), url("//www.qub.ac.uk/menu_items/fonts/0030004896-28092017/Fonts/8ee1533d-bc3f-4e28-8241-e6f2e5272b7e.woff2") format("woff2"), url("//www.qub.ac.uk/menu_items/fonts/0030004896-28092017/Fonts/4348a423-c329-40e2-8468-4f6869c5a898.woff") format("woff"), url("//www.qub.ac.uk/menu_items/fonts/0030004896-28092017/Fonts/09811673-99cb-4f43-ae8a-caa5439bd787.ttf") format("truetype"), url("//www.qub.ac.uk/menu_items/fonts/0030004896-28092017/Fonts/c238d29e-05ea-472e-abcf-5cf062b9ac89.svg#c238d29e-05ea-472e-abcf-5cf062b9ac89") format("svg"); } @font-face { font-family: "brandonTextThin"; src: url("//www.qub.ac.uk/menu_items/fonts/0030004896-28092017/Fonts/02c852f7-8453-4470-994c-065cef46a246.eot?#iefix"); src: url("//www.qub.ac.uk/menu_items/fonts/0030004896-28092017/Fonts/02c852f7-8453-4470-994c-065cef46a246.eot?#iefix") format("eot"), url("//www.qub.ac.uk/menu_items/fonts/0030004896-28092017/Fonts/d0d46a57-5b03-4cc8-8a47-79bc0d7527f6.woff2") format("woff2"), url("//www.qub.ac.uk/menu_items/fonts/0030004896-28092017/Fonts/b22d1c16-2ff0-41f5-95b8-27f50ae9567f.woff") format("woff"), url("//www.qub.ac.uk/menu_items/fonts/0030004896-28092017/Fonts/3ffe7b4c-0f28-42f9-a9cf-7e17517d5a5d.ttf") format("truetype"), url("//www.qub.ac.uk/menu_items/fonts/0030004896-28092017/Fonts/6584ab44-0c14-4323-9d4a-29e1d50be527.svg#6584ab44-0c14-4323-9d4a-29e1d50be527") format("svg"); } @font-face { font-family: "brandonTextThinItalic"; src: url("//www.qub.ac.uk/menu_items/fonts/0030004896-28092017/Fonts/86c4bb48-8127-4bf6-a94f-bc87c520975a.eot?#iefix"); src: url("//www.qub.ac.uk/menu_items/fonts/0030004896-28092017/Fonts/86c4bb48-8127-4bf6-a94f-bc87c520975a.eot?#iefix") format("eot"), url("//www.qub.ac.uk/menu_items/fonts/0030004896-28092017/Fonts/42be4eca-99eb-4fbf-ab60-09f3dc2c16a7.woff2") format("woff2"), url("//www.qub.ac.uk/menu_items/fonts/0030004896-28092017/Fonts/01061aa7-8d50-4149-a169-36352778ba49.woff") format("woff"), url("//www.qub.ac.uk/menu_items/fonts/0030004896-28092017/Fonts/9c2a6c24-c649-4433-a71a-83e23f927605.ttf") format("truetype"), url("//www.qub.ac.uk/menu_items/fonts/0030004896-28092017/Fonts/e297a0a7-ea18-4e66-b16d-d5e4281bcada.svg#e297a0a7-ea18-4e66-b16d-d5e4281bcada") format("svg"); } @font-face { font-family: "brandonTextLight"; src: url("//www.qub.ac.uk/menu_items/fonts/0030004896-28092017/Fonts/1607313e-b194-46c9-acc8-298f4644f922.eot?#iefix"); src: url("//www.qub.ac.uk/menu_items/fonts/0030004896-28092017/Fonts/1607313e-b194-46c9-acc8-298f4644f922.eot?#iefix") format("eot"), url("//www.qub.ac.uk/menu_items/fonts/0030004896-28092017/Fonts/81a7ceda-3683-480e-b5e8-3c09cbefecb7.woff2") format("woff2"), url("//www.qub.ac.uk/menu_items/fonts/0030004896-28092017/Fonts/dccde4d0-f70b-4dcb-80cf-8eb01f28986c.woff") format("woff"), url("//www.qub.ac.uk/menu_items/fonts/0030004896-28092017/Fonts/be82c73a-881f-4a3a-83fe-89022c35f214.ttf") format("truetype"), url("//www.qub.ac.uk/menu_items/fonts/0030004896-28092017/Fonts/cc95902a-5181-4b7d-83bc-586f7babf9e7.svg#cc95902a-5181-4b7d-83bc-586f7babf9e7") format("svg"); } @font-face { font-family: "brandonTextLightItalic"; src: url("//www.qub.ac.uk/menu_items/fonts/0030004896-28092017/Fonts/4cda4a14-d25f-42b7-acd6-15c2b8e636fe.eot?#iefix"); src: url("//www.qub.ac.uk/menu_items/fonts/0030004896-28092017/Fonts/4cda4a14-d25f-42b7-acd6-15c2b8e636fe.eot?#iefix") format("eot"), url("//www.qub.ac.uk/menu_items/fonts/0030004896-28092017/Fonts/574484c9-4f2f-4f5f-982a-8de3edc90b1a.woff2") format("woff2"), url("//www.qub.ac.uk/menu_items/fonts/0030004896-28092017/Fonts/57c2cca3-8c47-4c52-b763-901f6fd8905f.woff") format("woff"), url("//www.qub.ac.uk/menu_items/fonts/0030004896-28092017/Fonts/c492a3e1-1229-4d86-83b4-4ed50feaaff7.ttf") format("truetype"), url("//www.qub.ac.uk/menu_items/fonts/0030004896-28092017/Fonts/7322ebec-6a14-4aeb-95d0-8a5b91274b6e.svg#7322ebec-6a14-4aeb-95d0-8a5b91274b6e") format("svg"); } /* default-2.0 / utils / mixins */ /*! normalize.css v3.0.2 | MIT License | git.io/normalize */ /** * 1. Set default font family to sans-serif. * 2. Prevent iOS text size adjust after orientation change, without disabling * user zoom. */ html { font-family: sans-serif; /* 1 */ -ms-text-size-adjust: 100%; /* 2 */ -webkit-text-size-adjust: 100%; /* 2 */ } /** * Remove default margin. */ body { margin: 0; } /* HTML5 display definitions ========================================================================== */ /** * Correct `block` display not defined for any HTML5 element in IE 8/9. * Correct `block` display not defined for `details` or `summary` in IE 10/11 * and Firefox. * Correct `block` display not defined for `main` in IE 11. */ article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary { display: block; } /** * 1. Correct `inline-block` display not defined in IE 8/9. * 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera. */ audio, canvas, progress, video { display: inline-block; /* 1 */ vertical-align: baseline; /* 2 */ } /** * Prevent modern browsers from displaying `audio` without controls. * Remove excess height in iOS 5 devices. */ audio:not([controls]) { display: none; height: 0; } /** * Address `[hidden]` styling not present in IE 8/9/10. * Hide the `template` element in IE 8/9/11, Safari, and Firefox < 22. */ [hidden], template { display: none; } /* Links ========================================================================== */ /** * Remove the gray background color from active links in IE 10. */ a { background-color: transparent; } /** * Improve readability when focused and also mouse hovered in all browsers. */ a:active, a:hover { outline: 0; } /* Text-level semantics ========================================================================== */ /** * Address styling not present in IE 8/9/10/11, Safari, and Chrome. */ abbr[title] { border-bottom: 1px dotted; } /** * Address style set to `bolder` in Firefox 4+, Safari, and Chrome. */ b, strong { font-weight: 100; font-family: 'brandonTextMedium', arial, sans-serif; } /** * Address styling not present in Safari and Chrome. */ dfn { font-style: italic; } /** * Address variable `h1` font-size and margin within `section` and `article` * contexts in Firefox 4+, Safari, and Chrome. */ h1 { font-size: 2em; margin: 0.67em 0; } /** * Address styling not present in IE 8/9. */ mark { background: #ff0; color: #000; } /** * Address inconsistent and variable font size in all browsers. */ small { font-size: 80%; } /** * Prevent `sub` and `sup` affecting `line-height` in all browsers. */ sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; } sup { top: -0.5em; } sub { bottom: -0.25em; } /* Embedded content ========================================================================== */ /** * Remove border when inside `a` element in IE 8/9/10. */ img { border: 0; } /** * Correct overflow not hidden in IE 9/10/11. */ svg:not(:root) { overflow: hidden; } /* Grouping content ========================================================================== */ /** * Address margin not present in IE 8/9 and Safari. */ figure { margin: 1em 40px; } /** * Address differences between Firefox and other browsers. */ hr { -moz-box-sizing: content-box; box-sizing: content-box; height: 0; } /** * Contain overflow in all browsers. */ pre { overflow: auto; } /** * Address odd `em`-unit font size rendering in all browsers. */ code, kbd, pre, samp { font-family: monospace, monospace; font-size: 1em; } /* Forms ========================================================================== */ /** * Known limitation: by default, Chrome and Safari on OS X allow very limited * styling of `select`, unless a `border` property is set. */ /** * 1. Correct color not being inherited. * Known issue: affects color of disabled elements. * 2. Correct font properties not being inherited. * 3. Address margins set differently in Firefox 4+, Safari, and Chrome. */ button, input, optgroup, select, textarea { color: inherit; /* 1 */ font: inherit; /* 2 */ margin: 0; /* 3 */ } /** * Address `overflow` set to `hidden` in IE 8/9/10/11. */ button { overflow: visible; } /** * Address inconsistent `text-transform` inheritance for `button` and `select`. * All other form control elements do not inherit `text-transform` values. * Correct `button` style inheritance in Firefox, IE 8/9/10/11, and Opera. * Correct `select` style inheritance in Firefox. */ button, select { text-transform: none; } /** * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio` * and `video` controls. * 2. Correct inability to style clickable `input` types in iOS. * 3. Improve usability and consistency of cursor style between image-type * `input` and others. */ button, html input[type="button"], input[type="reset"], input[type="submit"] { -webkit-appearance: button; /* 2 */ cursor: pointer; /* 3 */ } /** * Re-set default cursor for disabled elements. */ button[disabled], html input[disabled] { cursor: default; } /** * Remove inner padding and border in Firefox 4+. */ button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; } /** * Address Firefox 4+ setting `line-height` on `input` using `!important` in * the UA stylesheet. */ input { line-height: normal; } /** * It's recommended that you don't attempt to style these elements. * Firefox's implementation doesn't respect box-sizing, padding, or width. * * 1. Address box sizing set to `content-box` in IE 8/9/10. * 2. Remove excess padding in IE 8/9/10. */ input[type="checkbox"], input[type="radio"] { box-sizing: border-box; /* 1 */ padding: 0; /* 2 */ } /** * Fix the cursor style for Chrome's increment/decrement buttons. For certain * `font-size` values of the `input`, it causes the cursor style of the * decrement button to change from `default` to `text`. */ input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button { height: auto; } /** * 1. Address `appearance` set to `searchfield` in Safari and Chrome. * 2. Address `box-sizing` set to `border-box` in Safari and Chrome * (include `-moz` to future-proof). */ input[type="search"] { -webkit-appearance: textfield; /* 1 */ -moz-box-sizing: content-box; -webkit-box-sizing: content-box; /* 2 */ box-sizing: content-box; } /** * Remove inner padding and search cancel button in Safari and Chrome on OS X. * Safari (but not Chrome) clips the cancel button when the search input has * padding (and `textfield` appearance). */ input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; } /** * Define consistent border, margin, and padding. */ fieldset { border: 1px solid #c0c0c0; margin: 0 2px; padding: 0.35em 0.625em 0.75em; } /** * 1. Correct `color` not being inherited in IE 8/9/10/11. * 2. Remove padding so people aren't caught out if they zero out fieldsets. */ legend { border: 0; /* 1 */ padding: 0; /* 2 */ } /** * Remove default vertical scrollbar in IE 8/9/10/11. */ textarea { overflow: auto; } /** * Don't inherit the `font-weight` (applied by a rule above). * NOTE: the default cannot safely be changed in Chrome and Safari on OS X. */ optgroup { font-weight: bold; } /* Tables ========================================================================== */ /** * Remove most spacing between table cells. */ table { border-collapse: collapse; border-spacing: 0; } td, th { padding: 0; } /*------------------------------------* RESET *------------------------------------*/ /** * A more considered reset; more of a restart... * As per: csswizardry.com/2011/10/reset-restarted */ /** * Let's make the box model all nice, shall we...? */ *, *:before, *:after { -moz-box-sizing: border-box; box-sizing: border-box; } /** * The usual... */ h1, h2, h3, h4, h5, h6, p, blockquote, pre, dl, dd, ol, ul, form, fieldset, legend, table, th, td, caption, hr { margin: 0; padding: 0; } /** * Give a help cursor to elements that give extra info on :hover. */ abbr[title], dfn[title] { cursor: help; } /** * Remove underlines from potentially troublesome elements. */ u, ins { text-decoration: none; } /** * Apply faux underline via border-bottom. */ ins { border-bottom: 1px solid; } /** * So that alt text is visually offset if images don't load. */ img { font-style: italic; } /** * Give form elements some cursor interactions... */ label, input, textarea, button, select, option { cursor: pointer; } .text-input:active, .text-input:focus, textarea:active, textarea:focus { cursor: text; outline: none; } /* default-2.0 / base / elements */ body { background: #fff; margin: 0; } img { display: inline-block; margin: 0 auto; } figure { margin: 0 auto 1rem; text-align: center; } figure:last-child { margin-bottom: 0; } figure img { margin-bottom: 1rem; } button { border-radius: 0.25em; border: 0; } button:focus { outline: none; } video { display: block; width: auto; height: auto; } /* default-2.0 / base / typography */ body { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; color: #000; font-family: "brandonTextRegular", Helvetica, Arial, sans-serif; font-weight: 400; } h1, h2, h3, h4, h5, h6 { margin-bottom: 1rem; font-style: normal; font-weight: 700; line-height: 1em; } h1 a, h2 a, h3 a, h4 a, h5 a, h6 a { color: inherit; } h1 { font-size: 3em; } h2 { font-size: 2em; } h3 { font-size: 1.625em; } h4 { font-size: 1.25em; } h5 { font-size: 1em; } h6 { font-size: 1em; } ul, ol { padding-left: 1.3125em; margin-bottom: 1rem; } ul:last-child, ol:last-child { margin-bottom: 0; } p, li, th, td { font-size: 1em; font-weight: 400; line-height: 1.5em; } p { margin-bottom: 1rem; } p:last-child { margin-bottom: 0; } p img { max-width: 100%; height: auto; } p + h2, p + h3, p + h4, ul + h2, ul + h3, ul + h4, ol + h2, ol + h3, ol + h4 { margin-top: 2rem; } p + * > h2:first-child, p + * > h3:first-child, p + * > h4:first-child, ul + * > h2:first-child, ul + * > h3:first-child, ul + * > h4:first-child, ol + * > h2:first-child, ol + * > h3:first-child, ol + * > h4:first-child { margin-top: 1rem; } a { color: #d6000d; text-decoration: none; -webkit-transition: all 0.2s; transition: all 0.2s; } a:hover { color: inherit; } a:focus { outline: 0; } em { font-style: italic; } small { font-size: 0.9375em; } blockquote { font-size: 1em; } cite { font-size: 1em; } ::selection { background-color: #f05422; color: #fff; } ::-moz-selection { background-color: #f05422; color: #fff; } /* default-2.0 / base / datasets */ form { overflow: auto; } .form__field { margin-bottom: 1rem; } .form__field:last-child { margin-bottom: 0; } .filter form, .course-finder-module form { overflow: inherit; } fieldset { padding: 0; margin: 0; border: 0; } input:not([type="radio"]):not([type="checkbox"]):not([type="submit"]), select, textarea { width: 100%; padding: 0.75rem; margin-bottom: 0; border: none; border-radius: 0; outline: none; -webkit-appearance: none; -moz-appearance: none; appearance: none; } input:not([type="radio"]):not([type="checkbox"]):not([type="submit"]):hover, input:not([type="radio"]):not([type="checkbox"]):not([type="submit"]):focus, input:not([type="radio"]):not([type="checkbox"]):not([type="submit"]):active, select:hover, select:focus, select:active, textarea:hover, textarea:focus, textarea:active { outline: none; } input:not([type="radio"]):not([type="checkbox"]):not([type="submit"]), select, textarea { background: #fff; color: #000; font-size: 1rem; line-height: normal; } textarea { max-width: 100%; } input[type="radio"], input[type="checkbox"] { margin: 0 0.25em 0 0; } input[type="radio"]:last-child, input[type="checkbox"]:last-child { margin-bottom: 0 0.25em 0.5em 0; } input[type="submit"] { background: #f05422; color: #fff; font-size: 1rem; } ::-webkit-input-placeholder { color: #000; } :-moz-placeholder { color: #000; } ::-moz-placeholder { color: #000; } :-ms-input-placeholder { color: #000; } /* default-2.0 / layout / framework */ .inner { position: relative; overflow: auto; margin-right: auto; margin-left: auto; } /* default-2.0 / layout / content */ .content { position: relative; width: 100%; } article img { max-width: 100%; height: auto; } /* default-2.0 / layout / footer */ body > footer { position: relative; width: 100%; overflow: auto; } /*--take rem of last list item in footer--*/ footer ul.list-inline li:last-child { margin-right: 0; } /* default-2.0 / layout / navigation */ nav h1 { margin-bottom: 0; font-size: inherit; font-weight: inherit; line-height: 1em; } /* default-2.0 / layout / module */ .modules { position: relative; width: 100%; overflow: auto; z-index: 1; } .modgroup { float: left; width: 100%; } .modgroup .mg__inner { max-width: 100rem; margin: 0 auto; overflow: auto; } .mod { position: relative; float: left; width: 100%; min-width: 8.75rem; height: auto; } .mod span { display: block; } .mod > span img, .mod > img { display: block; width: 100%; max-height: 100%; margin: 0; } .float--right { float: right; } .mod__inner { width: 100%; padding: 1rem; overflow: hidden; } .mod__inner img { width: auto; height: auto; max-width: 100%; max-height: 100%; } /* default-2.0 / component / column */ .columns { width: 100%; overflow: auto; } .column { margin-bottom: 1rem; } @media (min-width: 768px) { .columns { margin-bottom: 1rem; } .columns:last-child { margin-bottom: 0; } .column { float: left; width: 50%; padding: 0 0.5rem; margin-bottom: 0; vertical-align: top; } .column:first-child { padding-left: 0; } .column:last-child { padding-right: 0; } .column.r-align { text-align: right; } .column + *:not(.column) { clear: left; } .column:nth-last-child(2):first-child, .column:nth-last-child(2):first-child ~ *, .column:nth-last-child(4):first-child ~ .column:nth-last-child(2), .column:nth-last-child(4):first-child ~ .column:nth-last-child(2) ~ *, .column:nth-last-child(6):first-child ~ .column:nth-last-child(2), .column:nth-last-child(6):first-child ~ .column:nth-last-child(2) ~ * { margin-bottom: 0; } } /* quantity queries */ @media (min-width: 1280px) { .column:nth-last-child(3):first-child, .column:nth-last-child(3):first-child ~ * { width: 33.3333%; margin-bottom: 0; } } @media (min-width: 1366px) { .column:nth-last-child(4):first-child, .column:nth-last-child(4):first-child ~ * { width: 25%; margin-bottom: 0; } } @media (min-width: 1536px) { .column:nth-last-child(5):first-child, .column:nth-last-child(5):first-child ~ * { width: 20%; margin-bottom: 0; } } @media (min-width: 1792px) { .column:nth-last-child(6):first-child, .column:nth-last-child(6):first-child ~ * { width: 16.6666%; margin-bottom: 0; } } /* max limits */ @media (min-width: 768px) { .columns.max-2 .column { width: 50%; } .columns.max-2 .column:nth-last-child(2), .columns.max-2 .column:nth-last-child(2) ~ * { margin-bottom: 0; } } @media (min-width: 1280px) { .columns.max-3 .column { width: 33.3333%; } .columns.max-3 .column:nth-last-child(3), .columns.max-3 .column:nth-last-child(3) ~ * { margin-bottom: 0; } } @media (min-width: 1366px) { .columns.max-4 .column { width: 25%; } .columns.max-4 .column:nth-last-child(4), .columns.max-4 .column:nth-last-child(4) ~ * { margin-bottom: 0; } } /* spanning and offsets */ @media (min-width: 1024px) { .columns .column.colspan-1 { width: 8.3333%; } .columns .column.colspan-2 { width: 16.6666%; } .columns .column.colspan-3 { width: 25%; } .columns .column.colspan-4 { width: 33.3333%; } .columns .column.colspan-5 { width: 41.6666%; } .columns .column.colspan-6 { width: 50%; } .columns .column.colspan-7 { width: 58.3333%; } .columns .column.colspan-8 { width: 66.6666%; } .columns .column.colspan-9 { width: 75%; } .columns .column.colspan-10 { width: 83.3333%; } .columns .column.colspan-11 { width: 91.6666%; } .columns .column.colspan-12 { width: 100%; } .column.offset-1 { margin-left: 8.3333%; } .column.offset-2 { margin-left: 16.6666%; } .column.offset-3 { margin-left: 25%; } .column.offset-4 { margin-left: 33.3333%; } .column.offset-5 { margin-left: 41.6666%; } .column.offset-6 { margin-left: 50%; } .column.offset-7 { margin-left: 58.3333%; } .column.offset-8 { margin-left: 66.6666%; } .column.offset-9 { margin-left: 75%; } .column.offset-10 { margin-left: 83.3333%; } .column.offset-11 { margin-left: 91.6666%; } .column.offset-12 { margin-left: 100%; } } /* default-2.0 / components / cta */ .cta { position: relative; display: inline-block; padding: 0.5rem; background: #f05422; border: 2px solid #f05422; color: #fff; text-align: center; text-decoration: none; -webkit-transition: all 0.3s ease; transition: all 0.3s ease; } .cta:hover, .cta:active { background: transparent; } /* default-2.0 / components / banner */ main > .banner { position: absolute; top: 0; z-index: 50; } .banner { position: relative; width: 100%; overflow: hidden; } .banner span { display: block; } .banner > span img, .banner > img { display: block; width: 100%; } @media (min-width: 768px) { .banner__caption { position: absolute; top: 50%; left: 0; width: 100%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } } /* QUB Home Style 2017 */ /* qub / utils / vars */ /* qub / utils / visibility */ .max-cols-1 { display: none; } .min-cols-2 { display: none; } .max-cols-2 { display: none; } .min-cols-3 { display: none; } .max-cols-3 { display: none; } .min-cols-4 { display: none; } .max-cols-4 { display: none; } .min-cols-5 { display: none; } .max-cols-5 { display: none; } .min-cols-6 { display: none; } .min-colspan { display: none; } @media (max-width: 767px) { .max-cols-1 { display: block; } } @media (min-width: 768px) { .min-cols-2 { display: block; } } @media (max-width: 1279px) { .max-cols-2 { display: block; } } @media (min-width: 1280px) { .min-cols-3 { display: block; } } @media (max-width: 1365px) { .max-cols-3 { display: block; } } @media (min-width: 1366px) { .min-cols-4 { display: block; } } @media (max-width: 1535px) { .max-cols-4 { display: block; } } @media (min-width: 1536px) { .min-cols-5 { display: block; } } @media (max-width: 1791px) { .max-cols-5 { display: block; } } @media (min-width: 1792px) { .min-cols-6 { display: block; } } @media (min-width: 1024px) { .min-colspan { display: block; } } /* qub 2.0 / base / typography */ body { background: #eeeeee; color: #58595b; font-family: "brandonTextRegular", Helvetica, Arial, sans-serif; } h1, h2, h3, h4, h5, h6 { margin-bottom: 1rem; font-size: 1em; font-weight: 400; line-height: 1.25em; } h1:last-child, h2:last-child, h3:last-child, h4:last-child, h5:last-child, h6:last-child { margin-bottom: 0; } h1, h2, h3 { text-transform: uppercase; } h4, h5, h6 { font-weight: 500; } h1 { font-size: 2.25em; } h2 { font-size: 2em; } h3 { font-size: 1.75em; } h4 { font-size: 1.25em; } h5 { font-size: 1.125em; } h6 { font-size: 1em; } p, li, th, td { font-weight: 400; line-height: 1.5em; } .intro { font-size: 1.25em; } a { color: #d6000d; font-weight: 500; } a:hover { color: #d6000d; text-decoration: underline; } strong { font-weight: 100; font-family: 'brandonTextMedium', arial, sans-serif; } small { font-size: 0.875em; font-weight: 500; } blockquote { background: #eeeeee; padding: 1rem; margin-bottom: 1rem; color: inherit; font-size: 1.25em; } cite { display: block; font-style: italic; } hr { margin: 1.5rem 0; border: 1px solid #dedede; } ::selection { background-color: #d6000d; color: #ffffff; } ::-moz-selection { background-color: #d6000d; color: #ffffff; } /* qub / base / datasets */ input:not([type="radio"]):not([type="checkbox"]):not([type="submit"]), select, textarea { padding: 0.75rem 1.25rem; background: #ffffff; border: 1px solid; border-radius: 3px; color: #767678; font-size: 1rem; line-height: normal; } input:not([type="radio"]):not([type="checkbox"]):not([type="submit"]):focus, select:focus, textarea:focus { color: #9b9b9d; } input:not([type="radio"]):not([type="checkbox"]):not([type="submit"])[required], select[required], textarea[required] { color: #58595b; font-weight: 500; } input:not([type="radio"]):not([type="checkbox"]):not([type="submit"])[disabled], select[disabled], textarea[disabled] { color: #eeeeee; } select { background-image: url('/home/media/Media,512564,en.png'); /* images/icons/dropdown.png */ background-position: right 1.25rem center; background-repeat: no-repeat; } input[type="radio"], input[type="checkbox"] { margin: 0 1em 0 0; } ::-webkit-input-placeholder { color: #767678; } :-moz-placeholder { color: #767678; } ::-moz-placeholder { color: #767678; } :-ms-input-placeholder { color: #767678; } /* qub / base / elements */ iframe, video { max-width: 100%; max-height: 100%; } /* qub - 2.0 / layout / bootstrap-grid */ /*! * Bootstrap v3.3.7 (http://getbootstrap.com) * Copyright 2011-2017 Twitter, Inc. * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE) */ /*! * Generated using the Bootstrap Customizer (http://getbootstrap.com/customize/?id=a9e2478ba6b7f5cc15b1a34190dab5a7) * Config saved to config.json and https://gist.github.com/a9e2478ba6b7f5cc15b1a34190dab5a7 */ /*! * Bootstrap v3.3.7 (http://getbootstrap.com) * Copyright 2011-2016 Twitter, Inc. * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE) */ /*! normalize.css v3.0.3 | MIT License | github.com/necolas/normalize.css --NOT INCLUDED*/ .container { margin-right: auto; margin-left: auto; padding-left: 15px; padding-right: 15px; } @media (min-width: 768px) { .container { width: 750px; } } @media (min-width: 992px) { .container { width: 970px; } } @media (min-width: 1200px) { .container { width: 1170px; } } .container-fluid { margin-right: auto; margin-left: auto; padding-left: 15px; padding-right: 15px; } .row { margin-left: -15px; margin-right: -15px; } .col-xs-1, .col-sm-1, .col-md-1, .col-lg-1, .col-xs-2, .col-sm-2, .col-md-2, .col-lg-2, .col-xs-3, .col-sm-3, .col-md-3, .col-lg-3, .col-xs-4, .col-sm-4, .col-md-4, .col-lg-4, .col-xs-5, .col-sm-5, .col-md-5, .col-lg-5, .col-xs-6, .col-sm-6, .col-md-6, .col-lg-6, .col-xs-7, .col-sm-7, .col-md-7, .col-lg-7, .col-xs-8, .col-sm-8, .col-md-8, .col-lg-8, .col-xs-9, .col-sm-9, .col-md-9, .col-lg-9, .col-xs-10, .col-sm-10, .col-md-10, .col-lg-10, .col-xs-11, .col-sm-11, .col-md-11, .col-lg-11, .col-xs-12, .col-sm-12, .col-md-12, .col-lg-12 { position: relative; min-height: 1px; padding-left: 15px; padding-right: 15px; } .col-xs-1, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9, .col-xs-10, .col-xs-11, .col-xs-12 { float: left; } .col-xs-12 { width: 100%; } .col-xs-11 { width: 91.66666667%; } .col-xs-10 { width: 83.33333333%; } .col-xs-9 { width: 75%; } .col-xs-8 { width: 66.66666667%; } .col-xs-7 { width: 58.33333333%; } .col-xs-6 { width: 50%; } .col-xs-5 { width: 41.66666667%; } .col-xs-4 { width: 33.33333333%; } .col-xs-3 { width: 25%; } .col-xs-2 { width: 16.66666667%; } .col-xs-1 { width: 8.33333333%; } @media (min-width: 768px) { .col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12 { float: left; } .col-sm-12 { width: 100%; } .col-sm-11 { width: 91.66666667%; } .col-sm-10 { width: 83.33333333%; } .col-sm-9 { width: 75%; } .col-sm-8 { width: 66.66666667%; } .col-sm-7 { width: 58.33333333%; } .col-sm-6 { width: 50%; } .col-sm-5 { width: 41.66666667%; } .col-sm-4 { width: 33.33333333%; } .col-sm-3 { width: 25%; } .col-sm-2 { width: 16.66666667%; } .col-sm-1 { width: 8.33333333%; } } @media (min-width: 992px) { .col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12 { float: left; } .col-md-12 { width: 100%; } .col-md-11 { width: 91.66666667%; } .col-md-10 { width: 83.33333333%; } .col-md-9 { width: 75%; } .col-md-8 { width: 66.66666667%; } .col-md-7 { width: 58.33333333%; } .col-md-6 { width: 50%; } .col-md-5 { width: 41.66666667%; } .col-md-4 { width: 33.33333333%; } .col-md-3 { width: 25%; } .col-md-2 { width: 16.66666667%; } .col-md-1 { width: 8.33333333%; } } @media (min-width: 1200px) { .col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12 { float: left; } .col-lg-12 { width: 100%; } .col-lg-11 { width: 91.66666667%; } .col-lg-10 { width: 83.33333333%; } .col-lg-9 { width: 75%; } .col-lg-8 { width: 66.66666667%; } .col-lg-7 { width: 58.33333333%; } .col-lg-6 { width: 50%; } .col-lg-5 { width: 41.66666667%; } .col-lg-4 { width: 33.33333333%; } .col-lg-3 { width: 25%; } .col-lg-2 { width: 16.66666667%; } .col-lg-1 { width: 8.33333333%; } } .form-control { display: block; width: 100%; height: 34px; padding: 6px 12px; font-size: 14px; line-height: 1.42857143; color: #555555; background-color: #ffffff; background-image: none; border: 1px solid #cccccc; 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-transition: border-color ease-in-out 0.15s, -webkit-box-shadow ease-in-out 0.15s; -o-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s; transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s; } .dropup, .dropdown { position: relative; } .dropdown-toggle:focus { outline: 0; } .dropdown-menu { position: absolute; top: 100%; left: 0; z-index: 1000; display: none; float: left; min-width: 160px; padding: 5px 0; margin: 2px 0 0; list-style: none; font-size: 14px; text-align: left; background-color: #ffffff; border: 1px solid #cccccc; border: 1px solid rgba(0, 0, 0, 0.15); border-radius: 4px; -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175); box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175); -webkit-background-clip: padding-box; background-clip: padding-box; } .dropdown-menu.pull-right { right: 0; left: auto; } .dropdown-menu .divider { height: 1px; margin: 9px 0; overflow: hidden; background-color: #e5e5e5; } .dropdown-menu > li > a { display: block; padding: 3px 20px; clear: both; font-weight: normal; line-height: 1.42857143; color: #333333; white-space: nowrap; } .open > .dropdown-menu { display: block; } .open > a { outline: 0; } .dropdown-menu-right { left: auto; right: 0; } .dropdown-menu-left { left: 0; right: auto; } .dropdown-header { display: block; padding: 3px 20px; font-size: 12px; line-height: 1.42857143; color: #777777; white-space: nowrap; } .dropdown-backdrop { position: fixed; left: 0; right: 0; bottom: 0; top: 0; z-index: 990; } .pull-right > .dropdown-menu { right: 0; left: auto; } .dropup .caret, .navbar-fixed-bottom .dropdown .caret { border-top: 0; border-bottom: 4px dashed; border-bottom: 4px solid \9; content: ""; } .dropup .dropdown-menu, .navbar-fixed-bottom .dropdown .dropdown-menu { top: auto; bottom: 100%; margin-bottom: 2px; } @media (min-width: 768px) { .navbar-right .dropdown-menu { left: auto; right: 0; } .navbar-right .dropdown-menu-left { left: 0; right: auto; } } .nav { margin-bottom: 0; padding-left: 0; list-style: none; } .nav > li { position: relative; display: block; } .nav > li > a { position: relative; display: block; padding: 10px 15px; } .nav > li > a:hover, .nav > li > a:focus { text-decoration: none; } .nav .open > a, .nav .open > a:hover, .nav .open > a:focus { background-color: #eeeeee; border-color: #337ab7; } .navbar { position: relative; min-height: 50px; margin-bottom: 20px; border: 1px solid transparent; } @media (min-width: 768px) { .navbar { border-radius: 4px; } } @media (min-width: 768px) { .navbar-header { float: left; } } @media (min-width: 768px) { .navbar-collapse { width: auto; border-top: 0; -webkit-box-shadow: none; box-shadow: none; } .navbar-fixed-top .navbar-collapse, .navbar-static-top .navbar-collapse, .navbar-fixed-bottom .navbar-collapse { padding-left: 0; padding-right: 0; } } .navbar-fixed-top .navbar-collapse, .navbar-fixed-bottom .navbar-collapse { max-height: 340px; } @media (max-device-width: 480px) and (orientation: landscape) { .navbar-fixed-top .navbar-collapse, .navbar-fixed-bottom .navbar-collapse { max-height: 200px; } } .container > .navbar-header, .container-fluid > .navbar-header, .container > .navbar-collapse, .container-fluid > .navbar-collapse { margin-right: -15px; margin-left: -15px; } @media (min-width: 768px) { .container > .navbar-header, .container-fluid > .navbar-header, .container > .navbar-collapse, .container-fluid > .navbar-collapse { margin-right: 0; margin-left: 0; } } .navbar-static-top { z-index: 1000; border-width: 0 0 1px; } @media (min-width: 768px) { .navbar-static-top { border-radius: 0; } } .navbar-fixed-top, .navbar-fixed-bottom { position: fixed; right: 0; left: 0; z-index: 1030; } @media (min-width: 768px) { .navbar-fixed-top, .navbar-fixed-bottom { border-radius: 0; } } .navbar-fixed-top { border-width: 0 0 1px; } .navbar-fixed-bottom { bottom: 0; margin-bottom: 0; border-width: 1px 0 0; } .navbar-brand { float: left; padding: 15px 15px; font-size: 18px; line-height: 20px; height: 50px; } .navbar-brand:hover, .navbar-brand:focus { text-decoration: none; } .navbar-brand > img { display: block; } @media (min-width: 768px) { .navbar > .container .navbar-brand, .navbar > .container-fluid .navbar-brand { margin-left: -15px; } } .navbar-toggle { position: relative; float: right; margin-right: 15px; padding: 9px 10px; margin-top: 8px; margin-bottom: 8px; background-color: transparent; background-image: none; border: 1px solid transparent; border-radius: 4px; } .navbar-toggle:focus { outline: 0; } .navbar-toggle .icon-bar { display: block; width: 22px; height: 2px; border-radius: 1px; } .navbar-toggle .icon-bar + .icon-bar { margin-top: 4px; } @media (min-width: 768px) { .navbar-toggle { display: none; } } .navbar-nav { margin: 7.5px -15px; } .navbar-nav > li > a { padding-top: 10px; padding-bottom: 10px; line-height: 20px; } /*--(min-width changed for tablet)--*/ @media (min-width: 740px) { .navbar-nav { float: left; margin: 0; } .navbar-nav > li { float: left; } .navbar-nav > li > a { padding-top: 15px; padding-bottom: 15px; } } .navbar-nav > li > .dropdown-menu { margin-top: 0; border-top-right-radius: 0; border-top-left-radius: 0; } .navbar-fixed-bottom .navbar-nav > li > .dropdown-menu { margin-bottom: 0; border-top-right-radius: 4px; border-top-left-radius: 4px; border-bottom-right-radius: 0; border-bottom-left-radius: 0; } .navbar-btn { margin-top: 8px; margin-bottom: 8px; } .navbar-btn.btn-sm { margin-top: 10px; margin-bottom: 10px; } .navbar-btn.btn-xs { margin-top: 14px; margin-bottom: 14px; } .navbar-text { margin-top: 15px; margin-bottom: 15px; } @media (min-width: 768px) { .navbar-text { float: left; margin-left: 15px; margin-right: 15px; } } @media (min-width: 768px) { .navbar-left { float: left !important; } .navbar-right { float: right !important; margin-right: -15px; } .navbar-right ~ .navbar-right { margin-right: 0; } } .clearfix:before, .clearfix:after, .container:before, .container:after, .container-fluid:before, .container-fluid:after, .row:before, .row:after, .form-horizontal .form-group:before, .form-horizontal .form-group:after, .nav:before, .nav:after, .navbar:before, .navbar:after, .navbar-header:before, .navbar-header:after, .navbar-collapse:before, .navbar-collapse:after { content: " "; display: table; } .clearfix:after, .container:after, .container-fluid:after, .row:after, .form-horizontal .form-group:after, .nav:after, .navbar:after, .navbar-header:after, .navbar-collapse:after { clear: both; } .center-block { display: block; margin-left: auto; margin-right: auto; } .pull-right { float: right !important; } .pull-left { float: left !important; } .hide { display: none !important; } .show { display: block !important; } .invisible { visibility: hidden; } .text-hide { font: 0/0 a; color: transparent; text-shadow: none; background-color: transparent; border: 0; } .hidden { display: none !important; } .affix { position: fixed; } @-ms-viewport { width: device-width; } .visible-print { display: none !important; } @media print { .visible-print { display: block !important; } table.visible-print { display: table !important; } tr.visible-print { display: table-row !important; } th.visible-print, td.visible-print { display: table-cell !important; } } .visible-print-block { display: none !important; } @media print { .visible-print-block { display: block !important; } } .visible-print-inline { display: none !important; } @media print { .visible-print-inline { display: inline !important; } } .visible-print-inline-block { display: none !important; } @media print { .visible-print-inline-block { display: inline-block !important; } } @media print { .hidden-print { display: none !important; } } /* qub / layout / framework */ body { overflow-x: hidden; } .inner { max-width: 90rem; padding-right: 1.75rem; padding-left: 1.75rem; overflow: visible; } /* qub / layout / content */ .content__header { padding-bottom: 1.75rem; border-bottom: 1px solid #dedede; margin-bottom: 1.75rem; } /* qub - 2.0 / layout / header-shield */ body > header { width: auto; background: #d6000d; color: #ffffff; } body > header .inner { padding: 0; width: auto; max-width: 90rem; } .fixed-levels { display: block; } .fixed-levels.active { background: #d6000d; display: block; position: fixed; top: 0; right: 0; Left: 0; z-index: 10000; } .fixed-levels.active .breadcrumbs { z-index: 100000; background-color: #d6000d; color: #ffffff; padding: 0.5rem 0.5rem 0rem 1.2rem; } .fixed-levels.active .breadcrumbs a:hover { color: #ffffff; } @media (max-width: 740px) { .fixed-levels.active .breadcrumbs { display: none; } } @media (max-width: 739px) { article { margin-top: 80px; } } /* bootstrap-carousel width change */ .inner-bs-carousel { max-width: 90rem; margin-left: auto; margin-right: auto; } /* below 1440px */ @media (max-width: 1440px) { .site-header .inner { margin: 0 15px; } } /*-- //end of site wide changes// --*/ /*-- //tablet-size// --*/ @media only screen and (min-width: 780px) and (max-width: 1000px) { li.dropdown.yamm-fw.pull-right { display: none; } img.logo { width: 177px; } /*-- // Utility Bar // --*/ .utility-bar ul li a, .utility-bar ul li a:hover, .utility-bar ul li a:focus { min-height: 37px; color: #ffffff; line-height: 1; background-color: transparent; border-radius: 0; } .utility-bar ul li:last-child a { border-right: none; } .utility-bar .navbar-nav { float: right; margin: 0 !important; padding: 0; } } /*-- //Search Styling// --*/ .inline li { display: inline-block; color: #ffffff; padding: 15px 17px; text-transform: uppercase; } .btn { -moz-user-select: none; -ms-user-select: none; user-select: none; border: 1px solid transparent; padding: 0.25rem 0.5rem; font-size: 1rem; border-radius: .25rem; -webkit-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; font-weight: 400; line-height: 1.25; text-align: center; white-space: nowrap; vertical-align: middle; display: inline-block; } .inline .btn-red, .btn-red:hover { color: #ffffff; background-color: #d6000d; border-color: #d6000d; } .font-style { font-size: 1.5rem; color: #ffffff; } input[type=text].form-control.search { height: 50px; } .dropdown-menu .yamm-content input.form-control { display: inline-block; border-bottom-right-radius: 0; border-top-right-radius: 0; border-right: 0; } button.search { background-color: #676767; color: #ffffff; border: none; height: 50px; padding: 0.8rem 1.6rem 0.8rem 1.8rem; text-transform: uppercase; border-top-left-radius: 0; border-bottom-left-radius: 0; text-align: left; } button.search .arrow { transform: rotate(90deg); -webkit-transform: rotate(90deg); vertical-align: middle; float: right; margin: 5px 0 0 0; } button.search:hover { background-color: #1d1d1d; } button.search:focus { background-color: #d1000d; } /*-- search mobile --*/ @media (max-width: 991px) { .search-terms { display: none; } } @media (max-width: 739px) { button#search-mobile { position: absolute; right: 50px; height: 80px; padding: 0 15px; border: none; border-radius: 0; background: transparent; } button#search-mobile:focus { background-color: #2f2f2f; } button#search-mobile:hover { background: #2f2f2f; } button#search-mobile img { height: 20px; padding: 0; margin: 0 0 5px 0; } li.dropdown.yamm-fw { display: none; } } @media (min-width: 740px) { button#search-mobile { display: none; } } /*-- //Header Styling// --*/ /*-- //levels page styling// --*/ article.levels { margin-top: 0; } .site-header-levels { background-color: #ffffff; position: relative; } /*-- //END of levels page styling// --*/ .utility-bar { position: relative; height: 20px; margin: 10px 0 0 0; } .utility-bar .navbar { min-height: 34px; margin-bottom: 0; } .utility-bar .navbar-nav > li > a, .utility-bar .navbar-nav > li > a:hover { color: #ffffff; } .utility-bar ul li:after { content: ''; position: absolute; right: 0; top: 0; left: auto; display: block; background: #841225; width: 1px; height: 20px; transform: rotate(-22deg); } .utility-bar ul li:last-child:after { content: none; } .utility-bar ul li a, .utility-bar ul li a:hover, .utility-bar ul li a:focus { min-height: 20px; color: #ffffff; line-height: 1.2rem; padding: 0 12px; background-color: transparent; font-size: 0.75rem; text-transform: none; font-family: 'brandonTextRegular', arial, sans-serif; } .utility-bar .navbar-nav { float: right; margin: 0; padding: 0; } .utility-bar .navbar-nav > li > .dropdown-menu { margin-top: 37px; } .utility-bar .m-styling ul li { padding: 0; } .utility-bar .navbar-nav > li:last-child a { border: none; } .primary-nav > .dropdown > a { font-weight: normal; font-family: 'brandonTextMedium', arial, sans-serif; } /**Bootstrap Overwrites**/ .navbar-header { width: 100%; } .navbar-brand { float: left; padding: 9px 0 0 15px; height: 105px; position: absolute; top: 0; left: 0; z-index: 99999; width: 228px; } a.navbar-brand:before { content: ''; height: 42px; width: 85px; background-color: #8f0e20; position: absolute; z-index: -1; top: 64.5%; left: 6.6%; border-bottom-left-radius: 90px; border-bottom-right-radius: 90px; } a.navbar-brand:after { content: ''; height: 41px; width: 88px; background-color: #d6000d; position: absolute; z-index: -1; top: 52%; left: 6%; } @media (min-width: 810px) and (max-width: 921px) { a.navbar-brand:before { content: ''; height: 42px; width: 84px; background-color: #8f0e20; position: absolute; z-index: -1; top: 54%; left: 4.8%; border-bottom-left-radius: 90px; border-bottom-right-radius: 90px; } a.navbar-brand:after { content: ''; height: 41px; width: 88px; background-color: #d6000d; position: absolute; z-index: -1; top: 41%; left: 5%; } } @media (max-width: 809px) { a.navbar-brand:before { content: none; } a.navbar-brand:after { content: none; } } .navbar-brand > img { display: block; width: 260px; } .navbar-default { background-color: #d6000d; border: none; min-height: 89px; margin: 0; } /*.navbar-default .navbar-nav > li > a { color: #c41030; } */ .navbar-default .navbar-nav > .open > a { color: #ffffff; } .navbar-default .navbar-nav > .open > a, .navbar-default .navbar-nav > .open > a:focus { background-color: #2f2f2f; color: #ffffff; border-top-left-radius: 4px; border-top-right-radius: 4px; } .navbar-nav > li > .dropdown-menu { margin-top: 0; border-top-right-radius: 0; border-top-left-radius: 0; } .dropdown-menu { background-color: #2f2f2f; box-shadow: 0 3px 5px rgba(0, 0, 0, 0.175); border: none; font-size: 1rem; border-radius: 0; } li:last-child.dropdown.yamm-fw > a > span { border: 1px solid #777777; padding: 5px 20px 5px 35px; border-radius: 4px; } li:last-child.dropdown.yamm-fw.open > a > span { border: 1px solid #e7e7e7; } li:last-child.dropdown.yamm-fw > a > img { height: 19px; vertical-align: top; } .navbar-default .navbar-nav > li > a.dropdown-toggle:hover { background-color: #8f0e20; border-top-left-radius: 4px; border-top-right-radius: 4px; } li.dropdown.open a.dropdown-toggle:hover { background-color: #2f2f2f; } a.dropdown-toggle:hover { background: #8f0e20; } a.dropdown-toggle:after { content: ''; width: auto; height: 2px; background: transparent; display: block; } a.dropdown-toggle:hover:after { background: #ffffff; } .dropdown.open a.dropdown-toggle:after { background: #ffffff; } .navbar-nav > li:last-child > a.dropdown-toggle:hover:after { background: none; } .navbar-nav > li > a { line-height: 24px; } li.dropdown:last-child > a.dropdown-toggle:after { background: none; } /*-- li:last-child > a.dropdown-toggle:after { background: none; } --*/ @media (min-width: 922px) { header.qub-primary { border-bottom: 5px solid #8f0e20; height: 101px; } } @media (max-width: 921px) { .navbar-default { border-bottom: 5px solid #8f0e20; } } .primary-nav { margin-top: 10px; display: none; } p.pm-heading-six-col { padding: 0; border-bottom: 1px solid #525252; margin: 0 1rem 0 1rem; } p.pm-heading-six-col a { font-family: 'brandonTextMedium', arial, sans-serif; color: #ffffff; text-transform: uppercase; text-decoration: none; display: block; padding: 5px 0 5px 10px; } /*--mega menu arrow--*/ .arrow { display: inline-block; vertical-align: middle; border-right: 5px solid transparent; border-left: 5px solid transparent; border-top: 6px solid; margin: 0 0 2px 6px; } li.dropdown.open .arrow { border-bottom: 6px solid; border-top: none; } .menu-heading .arrow { transform: rotate(90deg); -webkit-transform: rotate(90deg); vertical-align: middle; position: absolute; right: 26px; top: 5%; } .pm-heading-six-col .arrow { transform: rotate(90deg); -webkit-transform: rotate(90deg); vertical-align: middle; display: inline-block; float: right; margin: 10px; } .button-promo .arrow { transform: rotate(90deg); -webkit-transform: rotate(90deg); vertical-align: middle; position: absolute; top: 45%; right: 9px; } .cf-mega .arrow { transform: rotate(90deg); -webkit-transform: rotate(90deg); vertical-align: middle; float: right; margin: 5px 0 0 0; } /*--Course Finder Mega Menu form--*/ .cf-mega-bar { margin: 10px 0 0 0; } .cf-mega-label { padding: 0 0 5px 10px; } button.cf-mega { margin: 20px 0 0 0; width: 100%; border: none; text-align: left; background-color: #676767; text-transform: uppercase; color: #ffffff; padding: 0.9375rem 2rem; } #cf_search_form .cf-search-field { color: #1d1d1d; line-height: 1.4rem; } #cf_search_form > .select-wrapper > .form__field { color: #1d1d1d; line-height: 1.4rem; margin-bottom: 0; } .cf-search-field::-webkit-input-placeholder { color: #9b9b9b; } .cf-search-field::-moz-input-placeholder { color: #9b9b9b; } .cf-search-field::-ms-input-input-placeholder { color: #9b9b9b; } .cf-search-field:-moz-input-placeholder { color: #9b9b9b; } .select-wrapper { margin: 5px 0 5px 0; } .select-wrapper:after { content: ''; } .select-wrapper select { background-image: none; } li.dropdown ul.dropdown-menu .select-wrapper .arrow { position: absolute; top: 36.5%; right: 48px; color: #2f2f2f; border-bottom: 6px solid; border-top: none; transform: rotate(180deg); -webkit-transform: rotate(180deg); } /*--hides dropdown image in IE10 and above--*/ select::-ms-expand { display: none; } @media (max-width: 921px) and (min-width: 740px) { li.dropdown ul.dropdown-menu .select-wrapper .arrow { right: 30px; top: 32%; } } /*-- //Thumbnails - promoted content// --*/ .promo-box .thumbnail { width: 95%; display: block; margin-left: 10px; } .thumbnail .caption > a.menu-heading { background: aqua; width: 100%; } .thumbnail .caption { width: 95%; position: absolute; bottom: 0; background: rgba(0, 0, 0, 0.7); left: 0; margin-left: 10px; } .thumbnail .caption > p > a.menu-heading { color: #ffffff; padding: 0; font-weight: normal; font-size: 1rem; font-family: 'brandonTextMedium', arial, sans-serif; } .thumbnail .caption > p:first-child { padding: 4px 18px 0 18px; background: transparent; margin: 0; text-transform: uppercase; } .thumbnail .caption > p { padding: 4px 18px; margin: 0 0 0.2rem 0; position: relative; font-size: 0.875rem; } .thumbnail .caption > p > a.p-box { color: #ffffff; text-transform: uppercase; font-family: 'brandonTextRegular', arial, sans-serif; font-weight: normal; } a.p-box .arrow { transform: rotate(90deg); -webkit-transform: rotate(90deg); margin: 0 0 3px 10px; } .thumbnail .button { display: inline-block; padding: 4px 8px; margin: 0 0 0.4rem 0; font-size: 0.875em; font-weight: 400; line-height: 1.42857143; text-align: center; white-space: nowrap; vertical-align: middle; -ms-touch-action: manipulation; touch-action: manipulation; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; background-image: none; border: 1px solid transparent; border-radius: 4px; } .thumbnail .primary { color: #fff; background-color: #676666; } .promo-box { padding-top: 5px; padding-left: 0; padding-right: 0; padding-bottom: 0; } .promo-box .thumbnail img { border-top-left-radius: 4px; border-top-right-radius: 4px; } .primary:hover { background-color: #c41030; } /*-- //Primary Nav Promoted Buttons// --*/ .yamm-content .button-promo { position: relative; display: inline-block; padding: 1rem 0 1rem 2rem; margin: 0.6rem 0 0.8rem 0; font-size: 0.875em; line-height: 1.6rem; text-align: left; vertical-align: middle; -ms-touch-action: manipulation; touch-action: manipulation; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; border: 1px solid #ffffff; border-radius: 4px; width: 100%; white-space: normal; text-transform: uppercase; } .yamm-content .button-promo:hover { background-color: #676767; border: 1px solid #fff; } ul li button.button-promo a { padding: 12px 20px 12px 30px; display: block; } ul li button.button-promo a:hover { background-color: #676767; text-decoration: none; border-radius: 4px; } @media (min-width: 740px) and (max-width: 921px) { ul li button.button-promo a { padding: 10px 20px 10px 20px; font-size: 0.75rem; line-height: 1.2rem; } .button-promo .arrow { position: absolute; top: 46%; right: 9px; padding: 0; margin: 0; } } /*-- //Primary & Utility List Styling// --*/ .navbar-default .navbar-nav > li > a { color: #ffffff; } .m-styling ul li:first-child { padding: 0 20px 0 0; text-transform: none; } .m-styling ul li p { padding: 0; border-bottom: 1px solid #525252; } .m-styling ul li a { color: #ffffff; display: block; border-bottom: 1px solid #2f2f2f; } .m-styling ul li a:hover { border-bottom: 1px solid #ffffff; text-decoration: none; } .m-styling ul li a.menu-heading { font-family: 'brandonTextMedium', arial, sans-serif; color: #ffffff; text-transform: uppercase; text-decoration: none; display: block; padding: 5px 0 5px 10px; } .m-styling ul li a.menu-heading:hover { background-color: transparent; } .m-styling .link-style { min-height: 240px; } ul.link-style li a { color: #ffffff; display: block; padding: 10px 10px; border: none; } ul.link-style li a:hover { border: none; background-color: #1d1d1d; } ul.link-style li a:focus { background-color: #d1000d; } ul.link-style li:first-child { padding: 0; } .list-unstyled { list-style: none; } @media (min-width: 768px) { .navbar > .container .navbar-brand, .navbar > .container-fluid .navbar-brand { margin-left: 0; } .navbar-nav { float: none; } .navbar-nav > li > a { font-family: 'brandonTextMedium', arial, sans-serif; padding-top: 12px; padding-bottom: 23px; padding-left: 20px; padding-right: 20px; font-size: 0.938rem; text-transform: uppercase; margin-bottom: -6px; } } /*! * Yamm!3 - Yet another megamenu for Bootstrap 3 * http://geedmo.github.com/yamm3 * * @geedmo - Licensed under the MIT license */ .yamm .nav, .yamm .collapse, .yamm .dropup, .yamm .dropdown { position: static; } .yamm .container { position: relative; } .yamm .dropdown-menu { left: auto; } .yamm .yamm-content { padding: 20px 30px 10px; } .yamm .dropdown.yamm-fw .dropdown-menu { left: 0; right: 0; top: 101px; } /*-- //Animated sticky header CSS// --*/ .navbar-default.shrink { min-height: 80px; border-bottom: 5px solid #8f0e20; } .shrink .navbar-brand { padding: 9px 15px 10px 15px; height: 77px; } .shrink .navbar-brand:before, .shrink .navbar-brand:after { content: none; } .shrink.yamm .dropdown.yamm-fw .dropdown-menu { top: 80px; } .shrink .navbar > .container > .navbar-nav { margin: 0 0 0 24px; } .shrink .primary-nav { margin-top: 13px; } .shrink .primary-nav > li > a { padding-bottom: 29px; padding-right: 20px; padding-left: 20px; } .shrink .primary-nav > li:last-child > a { padding-top: 14px; padding-bottom: 27px; } .shrink li:last-child.dropdown.yamm-fw > a > img { height: 17px; } .shrink img.logo { width: 160px; } .shrink .utility-bar { display: none; } .shrink .dropdown.yamm-fw .dropdown-menu { top: 80px; } @media (min-width: 740px) and (max-width: 921px) { .navbar-default.shrink { min-height: 80px; } .shrink .navbar-brand { padding: 10px 15px; height: 77px; } .shrink .navbar-brand:before, .shrink .navbar-brand:after { content: none; } .shrink .navbar > .container > .navbar-nav { margin: 0 0 0 24px; } .shrink .primary-nav { margin-top: 15px; } .shrink .primary-nav > li > a { font-size: 0.75rem; padding-right: 10px; padding-left: 10px; } .shrink .primary-nav > li:last-child > a { padding-top: 14px; padding-bottom: 25px; } .shrink img.logo { width: 160px; } } @media (max-width: 1199px) { .yamm-content ul.promo-box { display: none; } ul.col-sm-6.promo-box { display: none; } } /*--media queries--*/ @media (min-width: 922px) and (max-width: 1099px) { .navbar-nav > li > a { font-size: 0.875rem; padding-left: 15px; padding-right: 15px; } } @media (min-width: 769px) and (max-width: 1456px) { .container > .navbar-header { padding-right: 15px; } } /*--column changes--*/ @media (max-width: 991px) { .primary-nav .col-sm-3 { width: 25%; } .primary-nav .col-sm-4 { width: 33.33333333%; float: left; } .primary-nav .col-sm-6 { width: 50%; float: left; } .primary-nav .col-sm-8 { width: 66.66666667%; float: left; } .primary-nav .col-md-4 { width: 33%; float: left; } } @media (max-width: 512px) { .search .col-sm-12 { width: 100%; } } @media (min-width: 513px) and (max-width: 767px) { .search .col-sm-12:first-child { width: 75%; float: left; } .search .col-sm-12 { width: 25%; float: left; padding: 0; } .yamm .yamm-content.search { padding: 10px 30px 10px; } button.search { width: 100%; padding: 0.8rem 1rem 0.8rem 1.8rem; } } @media (min-width: 768px) and (max-width: 991px) { .search .col-sm-12:first-child { width: 75%; } .search .col-sm-12 { width: 25%; padding: 0; } button.search { width: 100%; } .yamm .yamm-content.search { padding: 20px 50px 20px 50px; } } @media (min-width: 992px) and (max-width: 1199px) { .yamm .yamm-content.search { padding: 30px 110px 10px 110px; } .search .col-md-9 { padding-right: 0; } .search .col-md-3 { padding-left: 0; } button.search { width: 100%; } .m-styling .search ul li:nth-child(-n+7) { display: inline-block; } .m-styling .search ul li:nth-child(n+8) { display: none; } .m-styling .search ul li a { font-size: 0.875rem; color: #eeeeee; } .m-styling .search ul li:first-child { font-size: 0.875rem; color: #eeeeee; padding: 0; } } @media (min-width: 1200px) { .yamm .yamm-content.search { padding: 30px 110px 10px 110px; } .search .col-lg-10 { padding-right: 0; } .search .col-lg-2 { padding-left: 0; } button.search { width: 100%; } .m-styling .search ul li a { font-size: 0.875rem; } } /*--QUB Logo media queries--*/ @media (min-width: 810px) and (max-width: 921px) { .navbar-brand > img { width: 230px; margin: 0 0 0 15px; } } @media (min-width: 740px) and (max-width: 809px) { .navbar-brand > img { width: 185px; margin: 0 0 0 15px; } } /*-- Primary Nav Link styling- font size--*/ @media (min-width: 740px) and (max-width: 800px) { .nav > li > a { font-size: 0.750em; padding: 10px 12px 13px 10px; text-transform: uppercase; margin-bottom: -5px; } } @media (min-width: 801px) and (max-width: 921px) { .nav > li > a { font-size: 0.813em; padding: 10px 12px 13px 10px; text-transform: uppercase; margin-bottom: -5px; } } /*-- //Mega Menu integration from 740px// --*/ @media (min-width: 740px) and (max-width: 921px) { header.qub-primary { min-height: 89px; } .container > .navbar-header { margin-right: 0px; margin-left: -5px; } .navbar-brand { padding: 9px 0 0 0; } .navbar-nav > li > a { padding-top: 10px; padding-bottom: 10px; } .utility-bar ul li a, .utility-bar ul li a:hover, .utility-bar ul li a:focus { padding: 0 13px; font-size: 0.75rem; text-transform: none; } .nav > li > a { padding: 10px 12px 13px 10px; text-transform: uppercase; margin-bottom: -5px; } li:last-child.dropdown.yamm-fw > a > img { height: 18px; } .arrow { border-right: 4px solid transparent; border-left: 4px solid transparent; border-top: 5px solid; margin: 0 0 3px 6px; } li.dropdown.open .arrow { border-bottom: 5px solid; border-top: none; } .yamm .dropdown.yamm-fw .dropdown-menu { top: 89px; } .yamm-content ul.promo-box { display: none; } .yamm-content > .row > .list-unstyled { padding: 0 0.5rem 0 0.5rem; } .m-styling ul li a.menu-heading { font-size: 0.875rem; padding: 0 0 0 5px; } .menu-heading .arrow { right: 16px; top: 3.5%; } ul.link-style li a { font-size: 0.875rem; padding: 6px 6px; } .cf-mega-bar { margin: 5px 0 0 0; } .cf-mega-label { padding: 0 0 0 5px; font-size: 0.875rem; } #cf_search_form > .select-wrapper > .form__field { line-height: 1rem; font-size: 0.875rem; margin-bottom: 0; } #cf_search_form .cf-search-field { line-height: 0.875rem; font-size: 0.875rem; padding: 0.6rem 1.25rem; } button.cf-mega { margin: 15px 0 0 0; padding: 0.7rem 1.2rem; font-size: 0.875rem; } p.pm-heading-six-col a { font-size: 0.875rem; padding: 0 0 0 5px; } } @media (max-width: 739px) { .hamburger { right: 0; width: 54px; } .hamburger-inner, .hamburger-inner::before, .hamburger-inner::after { width: 20px; } .hamburger-inner { left: 11px; } span.label { width: 99px; font-size: 0.875rem; } .site-header { min-height: 80px; } .navbar-default { min-height: 80px; } .navbar-brand { height: 76px; width: 160px; } .navbar-brand > img { width: 160px; } .navbar-fixed-top { top: 0; } button#menu-fire:hover, button#menu-fire:active { background-color: transparent; height: 80px; } .shrink .navbar-brand { padding: 9px 0 0 15px; } /*--search-mobile--*/ li.dropdown.open a.dropdown-toggle:hover { background-color: transparent; } .navbar-default .navbar-nav > .open > a, .navbar-default .navbar-nav > .open > a:focus { background-color: transparent; } .navbar-nav .open .dropdown-menu { position: absolute; top: 80px !important; width: auto; margin-top: 0; background-color: #2f2f2f; border: 0; } .navbar-nav .open .dropdown-menu > li > a, .navbar-nav .open .dropdown-menu .dropdown-header { padding: 5px 15px 5px 25px; } .navbar-nav .open .dropdown-menu > li > a { line-height: 20px; } .navbar-nav .open .dropdown-menu > li > a:hover, .navbar-nav .open .dropdown-menu > li > a:focus { background-image: none; } /*--hide desktop search icon from mobile--*/ li:last-child.dropdown.yamm-fw > a > img { display: none; } } @media (max-width: 512px) { /*search-mobile*/ .yamm .yamm-content { padding-top: 10px; } .dropdown-menu .yamm-content input.form-control { width: 100%; margin: 0 0 15px 0; border-radius: 3px; } button.search { width: 100%; border-radius: 3px; } } @media (max-width: 339px) { .navbar-brand > img, .shrink img.logo { width: 130px; } .navbar-brand, .shrink .navbar-brand { padding: 13px 0 0 0; width: 148px; } } /* - contextual navigation - */ .contextual-nav.fixed { position: fixed; top: 22px; right: 0; left: 0; padding: 0; z-index: 100000; } .contextual-nav.fixed.open { height: 100%; background-color: #1d1d1d; overflow: scroll; } @media (max-width: 767px) { .contextual-nav.fixed { top: 0; margin-top: 0; } } @media (max-width: 740px) and (min-height: 771px) { .hamburger { right: 0; width: 50px; } .hamburger-box { right: 24px; top: 30px; } } /* qub / layout / footer-st */ body > footer ul { padding: 0; list-style-type: none; } body > footer .panel .inner { padding-top: 1.75rem; padding-bottom: 1.75rem; } footer li { list-style-type: none; } footer ul { padding: 0; } footer .panel h4 { font-size: 1.125em; font-family: 'brandonTextMedium', arial, sans-serif; } footer .panel .toggle header.footer { padding: 1rem 4.375rem 1rem 5rem; } footer .panel .toggle header.footer:after { right: 5.75rem; } footer .panel .toggle { border-bottom: 1px solid #ffffff; } footer .panel .toggle .toggle__inner { background-color: #4a4a4a; margin: 0; } footer .panel .toggle.open .toggle__inner .toggle__content { margin: 1.75rem; } footer .panel .toggle.open .footer.open { background: #636262; } footer .panel .toggle + .toggle { margin: 0; } footer .panel img.location-map { margin: 5px 0 0 20px; } footer .panel .inner.charity { padding-top: 0; } footer .panel .inner.charity p { font-size: 0.875rem; color: #363636; } footer .column img { width: auto !important; height: auto !important; } .logos li { list-style-type: none; } @media (min-width: 900px) { footer .panel ul.list-inline li:first-child { width: 100%; } footer .panel.social-media { display: none; } } @media (max-width: 900px) { footer .panel .columns.sm-row { padding: 1rem 0; background-color: #4c4c4c; color: #ffffff; } footer .panel .columns.sm-row .column:first-child { margin-left: 3%; } } @media (min-width: 765px) and (max-width: 900px) { footer .panel img.location-map { margin: 0px; } footer .panel .columns.links { margin-bottom: 0; } footer .panel .columns.links .column:first-child { display: none; } footer .panel .columns.links .column:nth-child(2) { width: 33%; margin-left: 3%; } footer .panel .columns.links .column:nth-child(3), footer .panel .columns.links .column:nth-child(4) { width: 32%; } footer .panel .columns.logos .column { padding: 0; } } @media (min-width: 765px) { footer .panel ul.list-inline li:first-child { margin: 0; padding: 0 0 0.2rem 0; } footer .panel ul.list-inline li { margin-right: 0.3rem; } footer ul.list-inline li:last-child { margin-right: 0; } footer .panel.max-cols-1 { display: none; } footer .panel.min-cols-2 { display: block; } footer .panel .columns.links .column { float: left; width: 25%; vertical-align: top; } footer .panel .columns.logos .column { float: left; width: 24%; vertical-align: top; } } @media (max-width: 764px) { footer .panel ul.list-inline li:first-child { display: none; } footer .panel.social-media { text-align: center; } } @media (min-width: 731px) and (max-width: 775px) { footer .panel .columns.logos .column:last-child img { width: 95% !important; } footer .panel .columns.logos .column:last-child { padding: 0; } } @media (min-width: 442px) and (max-width: 764px) { footer .panel .columns.logos .column { float: left; width: 25%; vertical-align: top; } } @media (max-width: 600px) { footer .panel.max-cols-1 { display: block; } footer .panel.min-cols-2 { display: none; } } @media (max-width: 460px) { footer .column:last-child img { width: 100% !important; } } @media (min-width: 441px) and (max-width: 730px) { footer .panel .columns.logos .column { float: left; width: 50%; vertical-align: top; } } @media (min-width: 300px) and (max-width: 440px) { footer .panel .columns.logos .column { float: left; width: 50%; vertical-align: top; } footer .panel .columns.logos .column:last-child img { width: 100%; } } /* qub / layout / panel */ .panel { position: relative; } .panel .inner { padding: 3.0625rem 1.75rem; } /* backgroundless panel only */ .panel:not([class*="bg--"]) > .inner { background-color: #ffffff; } .centered { text-align: center; } .no-padding .inner { padding-top: 0; padding-bottom: 0; } .no-padding .column { padding-top: 1.75rem; padding-bottom: 1.75rem; margin-bottom: 0; border-bottom: 1px solid #dedede; } .no-padding .column img { display: block; max-width: calc(100% + 3.5rem); margin: -1.75rem; } .no-padding section { padding-bottom: 6.25rem; } .no-padding section > img { display: block; max-width: calc(100% + 3.5rem); margin: 0 -1.75rem 1.75rem; } .no-padding section > img:first-child { margin-top: 0; } .half-padding .inner { padding-top: 0.875rem; padding-bottom: 0.875rem; border-bottom: 1px solid #dedede; } .half-padding .column { margin: 0 0 1.75rem; padding: 0 0.875rem !important; } .half-padding .column img { display: block; } .double-padding .inner { padding-bottom: 6.125rem; } .double-padding .column { margin-top: 3.0625rem; margin-bottom: 3.0625rem; } /*--Panels: Additonal CSS to make list font color change with panel selection--*/ .bg--red ul.list-style li { color: #ffffff; } .bg--red ul.list-style li span { color: #ffffff; font-weight: 300; } .bg--grey-d ul.list-style li { color: #ffffff; } .bg--grey-d ul.list-style li span { color: #ffffff; font-weight: 300; } .bg--grey ul.list-style li { color: #ffffff; } .bg--grey ul.list-style li span { color: #ffffff; font-weight: 300; } .bg--grey-md ul.list-style li span { color: #ffffff; font-weight: 300; } .bg--grey-ml ul.list-style li span { font-weight: 300; } /*allow panel content to be right aligned*/ @media (min-width: 768px) { .panel.r-align { text-align: right; } } /* qub / layout / Migration */ /*jqueryui reset*/ .ui-widget { font-family: inherit; font-size: inherit; } .ui-widget-header { border-color: #dedede; background: #dedede; } .ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default { color: #d6000d; } .ui-state-active a, .ui-state-active a:link, .ui-state-active a:visited { color: #d6000d; } .ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active { border: 1px solid #ccc; } /* accordion styling */ #accordion .ui-widget-content a { color: #d6000d; /*Link Color update for accordion*/ } .no-padding-top-bottom { /*accordion - content merges together */ padding-top: 0 !important; padding-bottom: 0 !important; } .accordion-instruction { display: none; } .ui-accordion .ui-accordion-header { margin: 0; } .toggler { background: #d6000d !important; color: #ffffff !important; padding: 1.75rem 4.375rem 1.75rem 1.75rem !important; font-weight: normal !important; } .toggler .ui-accordion-header-icon { display: none; } .toggler:after { content: ''; display: block; position: absolute; top: 50%; right: 1.75rem; width: 0.9375rem; height: 0.5625rem; margin-top: -0.3125rem; background: url("/home/media/Media,512563,en.png"); background-position: center center; background-repeat: no-repeat; } .toggler.ui-state-active:after { -webkit-transform: rotateZ(-180deg); transform: rotateZ(-180deg); } /*old images fill columns*/ article .columns.img-fill { width: 100% !important; height: auto !important; } /* tabbed content box */ #tabs-nav { background: #58595b; margin: -5px; border-radius: 0; border: none; } #tabs-nav .tab { background: none; border: none; } #tabs-nav .tab a { color: #ffffff; } #tabs-nav .tab.ui-state-active a { color: #58595b; background: #eeeeee; } /* qub - 2.0 / layout / navigation-desktop-ct */ .greedy-container.fixed { display: block; } .fixed .inner.greedy { margin-top: 0; } .greedy-menu a.active { background-color: #4a4a4a; } .greedy-menu ul.list-style, .greedy-menu ul.list-style li { list-style: none; padding: 0; margin: 0; } .greedy-menu ul.hidden-links { max-height: 500px; overflow: scroll; overflow-x: hidden; overflow-y: visible; height: auto; } @media (min-width: 741px) and (max-width: 922px) { .greedy-menu .toggle-links { height: 40px; } .greedy-menu ul { height: 40px; } .greedy-menu a { height: 40px; padding: 8px 24px; } .greedy-menu .hidden-links { top: 40px; } } /*-- //Greedy Nav Styling// --*/ @media (max-width: 740px) { .inner.greedy { display: none; } } .greedy-container { background-color: #2f2f2f; } .inner.greedy { margin-top: 10px; } .greedy-menu .list-style li { float: left; } /* The main container */ .greedy-menu { width: 100%; position: relative; display: block; min-width: 240px; background-color: #2f2f2f; /* Style resets */ /* The links */ /* The hidden links list */ /* The button which hides/shows links */ } .greedy-menu * { box-sizing: border-box; } .greedy-menu ul { margin: 0; padding: 0; list-style: none; /* The visible links list */ } .greedy-menu ul:first-of-type { position: relative; /* Displaying the menu items on the same line */ } .greedy-menu ul { height: 50px; } .greedy-menu li:first-child a { border-left: 1px solid #676767; } .greedy-menu a { display: block; padding: 13px 24px; color: #ffffff; text-decoration: none; white-space: nowrap; border-right: 1px solid #676767; height: 50px; background-color: #2f2f2f; font-size: 0.875rem; } .greedy-menu a:hover { background-color: #4a4a4a; } .greedy-menu a:active { background-color: #2f2f2f; } .greedy-menu .visible-links > li:not(:last-child) > a { border-right: 1px solid #78b1eb; } .greedy-menu .hidden-links { position: absolute; top: 50px; right: 0; background-color: #2f2f2f; transform: none; transform-origin: 0 0; transition: transform 0.3s cubic-bezier(0.77, 0, 0.175, 1); z-index: 100; } .greedy-menu .hidden-links.links-invisible { transform: scaleY(0); } .greedy-menu .hidden-links.links-invisible li { opacity: 0; } .greedy-menu .hidden-links.links-invisible li a { color: #fff; } .greedy-menu .hidden-links li { display: block; opacity: 1; transition: opacity 0.25s ease 0.15s, color 0.15s; min-width: 185px; } .greedy-menu .hidden-links li:not(:last-child) > a { border-bottom: 1px solid #78b1eb; } .greedy-menu ul.hidden-links a { color: #ffffff; border: none; background-color: #4a4a4a; border-bottom: 1px solid #676767; } .greedy-menu ul.hidden-links li:last-child a { border-bottom: none; } .greedy-menu .toggle-links { float: right; position: relative; visibility: hidden; border: none; width: 165px; height: 50px; background-color: #4a4a4a; color: #ffffff; border-radius: 0; padding: 0 0 0 10px; line-height: 1; cursor: pointer; z-index: 1; font-size: 0.875rem; /* Firefox specific style reset */ /* The hamburger icon */ /* The circle icon */ } .greedy-menu .toggle-links::before { content: ''; background: url('/home/media/Media,767918,en.svg'); background-repeat: no-repeat; width: 16px; height: 14px; position: absolute; top: 36%; left: 17px; } .greedy-menu .toggle-links:hover { background-color: #4a4a4a; } .greed-menu .toggle-links:active { background-color: #2f2f2f; } .greedy-menu .toggle-links.counter.visible.links-displayed { background-color: #4a4a4a; } .greedy-menu .toggle-links:focus { outline: none; } .greedy-menu .toggle-links.visible { visibility: visible; } .greedy-menu .toggle-links::-moz-focus-inner { padding: 0; border: 0; } .greedy-menu .toggle-links::after { content: ''; vertical-align: middle; border-right: 3px solid transparent; border-left: 3px solid transparent; border-top: 5px solid; margin: 0; position: absolute; top: 48%; right: 18px; } .greedy-menu .toggle-links.links-displayed::after { transform: rotate(180deg); -webkit-transform: rotate(180deg); } @media (min-width: 741px) and (max-width: 922px) { .greedy-menu .toggle-links { height: 40px; } .greedy-menu ul { height: 40px; } .greedy-menu a { height: 40px; padding: 8px 24px; } .greedy-menu .hidden-links { top: 40px; } } /* qub - 2.0 / layout / navigation mobile ct */ /*---Change to title CSS for Menu Button---*/ .cd-accordion-menu.header > li > input[type=checkbox]:checked + label::before { transform: none; } .mla-top-level { display: table; padding: 10px 10px 10px 0; font-size: 1rem; font-weight: normal; } .mla-top-level img { margin: 0; height: auto; vertical-align: middle; top: 37%; position: absolute; } .mla-top-level span { padding-left: 22px; } .cd-accordion-menu.header > li > label { padding: 0px 65px 0px 17px; } .cd-accordion-menu.header > li > label::before { display: block; content: ""; border: none; } .cd-accordion-menu.header > li > label::after { display: block; position: absolute; top: 50%; right: 23px; left: auto; width: 65px; background: #1d1d1d; font-size: 1rem; text-align: center; color: #fff; width: 0; height: 0; border-left: 6px solid transparent; border-right: 6px solid transparent; border-top: 8px solid #ffffff; } .open .cd-accordion-menu.header > li > label::after { transform: rotate(180deg); -webkit-transform: rotate(180deg); top: 40%; } ul.cd-accordion-menu.animated.header { min-height: 44px; } .cd-accordion-menu .mm-selected, .cd-accordion-menu ul li.mm-selected, .cd-accordion-menu ul .mm-selected label { background: #797979; } /* -------------------------------- Main Components -------------------------------- */ /*hide contextual nav at 741px*/ @media screen and (min-width: 741px) { .contextual-nav { display: none; } } .contextual-nav { background-color: #1d1d1d; margin-top: 10px; } .cd-accordion-menu { background: #1d1d1d; list-style: none; padding: 0; } .cd-accordion-menu ul { /* by default hide all sub menus */ display: none; padding: 0; } .cd-accordion-menu li { -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .cd-accordion-menu input[type=checkbox] { /* hide native checkbox */ position: absolute; opacity: 0; } .cd-accordion-menu label, .cd-accordion-menu a { position: relative; display: block; padding: 18px 18px 18px 64px; color: #ffffff; font-size: 1.6rem; margin-bottom: 0; } .no-touch .cd-accordion-menu label:hover, .no-touch .cd-accordion-menu a:hover { background: #52565d; } .cd-accordion-menu label::before, .cd-accordion-menu label::after, .cd-accordion-menu a::after { content: ''; display: inline-block; width: 16px; height: 16px; position: absolute; top: 50%; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); } .cd-accordion-menu label { cursor: pointer; } .cd-accordion-menu ul.list-style, .cd-accordion-menu ul.list-style li { list-style: none; padding: 0; margin: 0; } li.has-children { margin: 0; display: none; } .cd-accordion-menu input[type=checkbox]:checked + label + ul, .cd-accordion-menu input[type=checkbox]:checked + label:nth-of-type(n) + ul { /* use label:nth-of-type(n) to fix a bug on safari (<= 8.0.8) with multiple adjacent-sibling selectors*/ /* show children when item is checked */ display: block; list-style: none; padding: 0; } .cd-accordion-menu ul label { background: #dcdcdc; box-shadow: inset 0 -1px #929396; padding-left: 82px; } .cd-accordion-menu ul li { background: #1d1d1d; } .no-touch .cd-accordion-menu ul label:hover, .no-touch .cd-accordion-menu ul a:hover { background: #3c3f45; } .cd-accordion-menu > li:last-of-type > label, .cd-accordion-menu > li:last-of-type > a, .cd-accordion-menu > li > ul > li:last-of-type label { box-shadow: inset 0 -1px #2f2f2f; } .cd-accordion-menu label { padding: 0px 5px 1px 44px; font-size: 1.2rem; } .cd-accordion-menu a { padding: 10px 9px 10px 0; font-size: 1rem; } .cd-accordion-menu ul a.active { background-color: #4f4f4f; } .cd-accordion-menu ul label a { padding-left: 0; box-shadow: none; } .cd-accordion-menu ul a { padding-left: 44px; box-shadow: inset 0 -1px #2f2f2f; } @media (max-width: 512px) { .mla-top-level span { margin-left: 0px; padding-left: 22px; display: table-cell; font-size: 0.875rem; line-height: 1rem; } ul.cd-accordion-menu.animated.header { display: block; min-height: 36px; } .cd-accordion-menu a { padding: 8px 9px 8px 0; font-size: 0.875rem; } .mla-top-level img { top: 31%; } } /* qub - 2.0 / layout / navigation mobile primary */ /*MOBILE*/ /*Additional*/ /*Site wide Page Changes*/ @media screen and (max-width: 741px) { /*Page Title header changes*/ .main-title { padding: 1rem 0; background: #ffffff; } .main-title .inner { padding-left: 1rem; padding-right: 1rem; } .main-title .inner h1 { text-transform: capitalize; } /*breadcrumbs changes*/ .breadcrumbs .inner { padding: 0; } .breadcrumbs { padding: 0.5em 0; } .breadcrumbs li { font-size: 0.75em; } .breadcrumbs li:after { margin-left: 0.5em; } /*--end of site wide page changes--*/ } /*fix for open header scroll on levels page when mobile menu is open*/ html.levels.mm-opened header.levels { position: fixed; top: 0; left: 0; right: 0; z-index: 10000; } html.levels.mm-opened .content { margin-top: 80px; } /*display Desktop menu above 740px*/ @media screen and (min-width: 740px) { button#menu-fire { display: none; } .desktop-only { display: table-cell; vertical-align: middle; } } /*Desktop menu styling*/ nav.desktop-only ul { margin: 0; list-style-type: none; } nav.desktop-only ul li { float: left; margin: 0; } nav.desktop-only ul li a { float: left; margin: 0; color: #ffffff; padding: 22px 20px 25px 22px; font-size: 1.25rem; text-decoration: none; } nav.desktop-only ul li a:hover { background: #ffffff; color: #d6000d; } /*Desktop menu styling 820px to 940px*/ @media screen and (min-width: 820px) and (max-width: 940px) { nav.desktop-only ul li a { padding: 20px 12px 20px 12px; } } /*Desktop menu styling to 819px*/ @media screen and (max-width: 819px) { nav.desktop-only ul li a { font-size: 1rem; padding: 20px 12px 20px 12px; } .header__links { width: 0; } } /*Prevent MMenu FOUC*/ body > #menu:not(.mm-menu) { display: none; } /*Hide Hamburger above 740px*/ @media screen and (max-width: 739px) { button#menu-fire { display: block; } .desktop-only { display: none; } .utility-bar { display: none; } } /*hamburger*/ button#menu-fire.is-active, button#menu-fire:hover.is-active { background-color: #2f2f2f; } .hamburger { height: 80px; padding: 0; display: inline-block; cursor: pointer; transition-property: opacity, filter; transition-duration: 0.15s; transition-timing-function: linear; font: inherit; color: inherit; text-transform: none; background-color: transparent; border: 0; overflow: hidden; position: absolute; right: -15px; width: 100px; border-radius: 0; } .hamburger-box { width: 22px; height: 20px; display: block; position: absolute; right: 24px; top: 30px; } .hamburger-inner { display: block; top: 50%; margin-top: -2px; left: 12px; } .hamburger-inner, .hamburger-inner::before, .hamburger-inner::after { width: 22px; height: 1px; background-color: #ffffff; border-radius: 0; position: absolute; transition-property: transform; transition-duration: 0.15s; transition-timing-function: ease; } .hamburger-inner::before, .hamburger-inner::after { content: ""; display: block; } .hamburger-inner::before { top: -7px; } .hamburger-inner::after { bottom: -7px; } span.label { width: 100px; float: left; font-size: 0.875rem; line-height: 20px; padding-left: 20px; } @media screen and (max-width: 512px) { .hamburger { height: 80px; } } .hamburger--spin .hamburger-inner { transition-duration: 0.3s; transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); } .hamburger--spin .hamburger-inner::before { transition: top 0.1s 0.34s ease-in, opacity 0.1s ease-in; } .hamburger--spin .hamburger-inner::after { transition: bottom 0.1s 0.34s ease-in, transform 0.3s cubic-bezier(0.55, 0.055, 0.675, 0.19); } .hamburger--spin.is-active .hamburger-inner { transform: rotate(225deg); transition-delay: 0.14s; transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); } .hamburger--spin.is-active .hamburger-inner::before { top: 0; opacity: 0; transition: top 0.1s ease-out, opacity 0.1s 0.14s ease-out; } .hamburger--spin.is-active .hamburger-inner::after { bottom: 0; transform: rotate(-90deg); transition: bottom 0.1s ease-out, transform 0.3s 0.14s cubic-bezier(0.215, 0.61, 0.355, 1); } @media (max-width: 739px) { .hamburger { right: 0; width: 50px; } .hamburger-inner, .hamburger-inner::before, .hamburger-inner::after { width: 20px; } .hamburger-inner { left: 11px; } span.label { width: 99px; font-size: 0.875rem; } } a:focus, label:focus, input:focus { outline: none; } #mm-0 .mm-navbar { display: none; } #menu li.mm-opened a.mm-next[data-target="#mm-1"] { background-color: #d6000d; } #menu li.mm-opened a.mm-next[data-target="#mm-2"] { background-color: #008B8B; } #menu li.mm-opened a.mm-next[data-target="#mm-3"] { background-color: #4682B4; } #menu li.mm-opened a.mm-next[data-target="#mm-4"] { background-color: #2E8B57; } #mm-1 ul.mm-listview li.mm-selected a { background-color: #d6000d; } #mm-2 ul.mm-listview li.mm-selected a { background-color: #007373; } #mm-3 ul.mm-listview li.mm-selected a { background-color: #396b94; } #mm-4 ul.mm-listview li.mm-selected a { background-color: #256d45; } #mm-1 .mm-listview > li > a { background-color: #363636; color: #ffffff; } .utility-nav-mob { margin-top: 40px; } .utility-nav-mob li:first-child a { border-top: 1px solid #484747; } .utility-nav-mob li a { font-family: 'brandonTextRegular', arial, sans-serif; } .utility-nav-mob .mm-listview .mm-next { background: #000000; border-bottom: 1px solid #484747; } .utility-nav-mob ul li a { text-transform: none; font-family: 'brandonTextRegular',arial,sans-serif; } .mm-menu.mm-vertical .utility-nav-mob .mm-listview > li.mm-opened > a.mm-next:hover { background-color: #000000; } #mm-1 .mm-listview > li:not(.mm-divider):after, #mm-2 .mm-listview > li:not(.mm-divider):after, #mm-3 .mm-listview > li:not(.mm-divider):after, #mm-4 .mm-listview > li:not(.mm-divider):after { border-bottom-width: 0; border-bottom-style: none; } .mm-opened ul.mm-listview.mm-vertical { margin-top: -1px; } .mm-menu .mm-listview > li a:hover:not(.mm-next) { background-color: #2f2f2f; } .mm-menu.mm-vertical .mm-listview > li.mm-opened > a.mm-next:hover { background-color: #d6000d; } #mm-1 .mm-listview > li > a, #mm-2 .mm-listview > li > a, #mm-3 .mm-listview > li > a, #mm-4 .mm-listview > li > a, #mm-5 .mm-listview > li > a { padding: 15px 20px 15px 35px; background-color: #2f2f2f; } li.mm-vertical:first-child { border-top: 1px solid white; } /*social media*/ .ms-slidebar-block { padding: 20px 20px; min-height: 160px; margin-bottom: 40px; margin-top: 20px; } h4.ms-slidebar-block-title { font-weight: 400; margin-bottom: 20px; color: #ffffff; } .ms-slidebar-block .ms-slidebar-social { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-evenly; margin-bottom: 20px; margin-top: 20px; } .ms-slidebar-social img { vertical-align: middle; margin-top: 1px; } .btn-circle.btn-circle-raised { box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12); color: #fff; } .btn-circle { height: 35px; width: 35px; color: #616161; display: inline-block; border-radius: 200rem; text-align: center; line-height: 31px; position: relative; z-index: 1; -webkit-transition: color ease 0.5s; transition: color ease 0.5s; -webkit-transition: box-shadow ease-in-out 0s; transition: box-shadow ease-in-out 0s; border: 0; background-color: transparent; } .btn-circle.btn-circle-raised.btn-facebook { background-color: #3b5998; } .btn-circle.btn-circle-raised.btn-twitter { background-color: #00aced; } .btn-twitter img { width: 20px; } .btn-instagram img { width: 16px; padding: 0px 1px 0 0; } .btn-circle.btn-circle-raised.btn-instagram { background: radial-gradient(circle farthest-corner at 35% 90%, #fec564, transparent 50%), radial-gradient(circle farthest-corner at 0 140%, #fec564, transparent 50%), radial-gradient(ellipse farthest-corner at 0 -25%, #5258cf, transparent 50%), radial-gradient(ellipse farthest-corner at 20% -50%, #5258cf, transparent 50%), radial-gradient(ellipse farthest-corner at 100% 0, #893dc2, transparent 50%), radial-gradient(ellipse farthest-corner at 60% -20%, #893dc2, transparent 50%), radial-gradient(ellipse farthest-corner at 100% 100%, #d9317a, transparent), linear-gradient(#6559ca, #bc318f 30%, #e33f5f 50%, #f77638 70%, #fec66d 100%); } .btn-circle.btn-circle-raised.btn-youtube { background-color: #b31217; } .btn-youtube img { width: 18px; } /* additionals end*/ .mm-menu, .mm-panels, .mm-panels > .mm-panel { margin: 0; left: 0; right: 0; top: 0; z-index: 0; box-sizing: border-box; } .mm-panel { padding-bottom: 100px; } .mm-panel:first-child { padding-bottom: 0; } .mm-btn, .mm-menu { box-sizing: border-box; } .mm-listview a, .mm-listview a:hover, .mm-navbar a, .mm-navbar a:hover { text-decoration: none; } .mm-listview .mm-next:before, .mm-listview > li:not(.mm-divider):after, .mm-next:after, .mm-prev:before { content: ''; bottom: 0; } .mm-hidden { display: none !important; } .mm-menu, .mm-panels > .mm-panel:not(.mm-hidden) { display: block; } .mm-panels li { line-height: 1.3em; } .mm-wrapper { overflow-x: hidden; position: relative; } .mm-menu { padding: 0; position: absolute; bottom: inherit; top: 80px; transform: translateZ(0); height: 100%; } .mm-panels, .mm-panels > .mm-panel { background: inherit; border-color: inherit; position: absolute; bottom: 0; } .mm-btn, .mm-panel.mm-highest { z-index: 1; } .mm-panels { overflow: hidden; background-color: #2f2f2f; } .mm-panel { -webkit-transition: -webkit-transform 0.4s ease; transition: -webkit-transform 0.4s ease; transition: transform 0.4s ease; transition: transform 0.4s ease, -webkit-transform 0.4s ease; -webkit-transform: translate(100%, 0); -ms-transform: translate(100%, 0); transform: translate(100%, 0); -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); } .mm-panel.mm-opened { -webkit-transform: translate(0, 0); -ms-transform: translate(0, 0); transform: translate(0, 0); -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } .mm-panel.mm-subopened { -webkit-transform: translate(0, 0); -ms-transform: translate(0, 0); transform: translate(0, 0); -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } .mm-panels > .mm-panel { -webkit-overflow-scrolling: touch; overflow: scroll; overflow-x: hidden; overflow-y: auto; } .mm-listview .mm-divider, .mm-listview > li > a, .mm-listview > li > span, .mm-navbar .mm-title { text-overflow: ellipsis; white-space: nowrap; overflow: hidden; } /* .mm-panels>.mm-panel:after, .mm-panels>.mm-panel:before { content: ''; display: block; height: 20px } */ .mm-vertical .mm-panel { -webkit-transform: none !important; -ms-transform: none !important; transform: none !important; } .mm-listview .mm-vertical .mm-panel, .mm-vertical .mm-listview .mm-panel { display: none; padding: 0; } .mm-listview .mm-vertical .mm-panel .mm-listview > li:last-child:after, .mm-vertical .mm-listview .mm-panel .mm-listview > li:last-child:after { border-color: transparent; } .mm-vertical li.mm-opened > .mm-panel, li.mm-vertical.mm-opened > .mm-panel { display: block; } .mm-listview > li.mm-vertical > .mm-next, .mm-vertical .mm-listview > li > .mm-next { height: 50px; bottom: auto; border: none; } .mm-listview > li.mm-vertical > .mm-next:after, .mm-vertical .mm-listview > li > .mm-next:after { top: 21px; bottom: auto; } .mm-listview > li.mm-vertical.mm-opened > .mm-next:after, .mm-vertical .mm-listview > li.mm-opened > .mm-next:after { -webkit-transform: rotate(225deg); -ms-transform: rotate(225deg); transform: rotate(225deg); right: 20px; } .mm-btn { width: 40px; height: 40px; position: absolute; top: 0; } .mm-clear:after, .mm-clear:before, .mm-close:after, .mm-close:before { content: ''; border: 2px solid transparent; display: block; width: 5px; height: 5px; margin: auto; position: absolute; top: 0; bottom: 0; -webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg); } .mm-clear:before, .mm-close:before { border-right: none; border-bottom: none; right: 18px; } .mm-clear:after, .mm-close:after { border-left: none; border-top: none; right: 25px; } .mm-next:after, .mm-prev:before { content: ''; display: inline-block; position: absolute; top: 20px; left: 21px; background: transparent; width: 0; height: 0; border-left: 9px solid #ffffff; border-right: 0px solid transparent; border-top: 5px solid transparent; border-bottom: 5px solid transparent; border-radius: 0; } .mm-prev:before { -webkit-transform: rotate(-180deg); -ms-transform: rotate(-180deg); transform: rotate(-180deg); left: 20px; top: 15px; } .mm-navbar { border-bottom: 1px solid; border-color: inherit; text-align: center; line-height: 20px; height: 40px; padding: 0 40px; margin: 0; } .mm-navbar > * { display: block; padding: 10px 0; } .mm-navbar .mm-btn:first-child { left: 0; } .mm-navbar .mm-btn:last-child { text-align: right; right: 0; } .mm-panel .mm-navbar { display: none; } .mm-panel.mm-hasnavbar .mm-navbar { display: block; background: #000; } .mm-listview, .mm-listview > li { list-style: none; display: block; padding: 0; margin: 0; } .mm-listview { font: inherit; font-size: 1rem; line-height: 20px; } .mm-listview > li { position: relative; } .mm-listview > li, .mm-listview > li .mm-next, .mm-listview > li .mm-next:before, .mm-listview > li:after { border-color: inherit; } .mm-listview > li > a, .mm-listview > li > span { font-family: 'brandonTextMedium', arial, sans-serif; font-size: 0.875rem; color: #ffffff; display: block; padding: 15px 10px 15px 20px; margin: 0; background-color: #2f2f2f; border-bottom: 1px solid #484747; text-transform: uppercase; white-space: normal; } .mm-listview > li:not(.mm-divider):after { display: block; position: absolute; right: 0; left: 20px; } .mm-listview > li > a:hover { background-color: #000000; color: #ffffff; } .mm-listview .mm-next { background: #000000; width: 50px; padding: 0; position: absolute; right: 0; top: 0; bottom: 0; z-index: 2; } .mm-listview .mm-next:before { display: block; position: absolute; top: 0; left: 0; } .mm-listview .mm-next + a, .mm-listview .mm-next + span { margin-right: 50px; } .mm-listview .mm-next.mm-fullsubopen { width: 20%; } .mm-listview .mm-next.mm-fullsubopen:before { border-left: none; } .mm-listview .mm-next.mm-fullsubopen + a, .mm-listview .mm-next.mm-fullsubopen + span { padding-right: 50px; margin-right: 0; } /* .mm-panels>.mm-panel>.mm-listview { margin: 20px -20px } .mm-panels>.mm-panel>.mm-listview:first-child, .mm-panels>.mm-panel>.mm-navbar+.mm-listview { margin-top: -20px } */ .mm-listview .mm-inset { list-style: disc inside; padding: 0 10px 15px 40px; margin: 0; } .mm-listview .mm-inset > li { padding: 5px 0; } .mm-listview .mm-divider { font-size: 10px; text-transform: uppercase; text-indent: 20px; line-height: 25px; } .mm-listview .mm-spacer { padding-top: 40px; } .mm-listview .mm-spacer > .mm-next { top: 40px; } .mm-listview .mm-spacer.mm-divider { padding-top: 25px; } .mm-menu { background: #ffffff; border-color: rgba(0, 0, 0, 0.1); color: rgba(0, 0, 0, 0.75); } .mm-menu .mm-navbar a, .mm-menu .mm-navbar > * { font-family: 'brandonTextMedium', arial, sans-serif; color: #ffffff; text-transform: uppercase; font-size: 0.875em; text-align: left; line-height: 21px; } .mm-menu .mm-listview { border-color: rgba(0, 0, 0, 0.1); } .mm-menu .mm-listview > li a:not(.mm-next) { -webkit-tap-highlight-color: rgba(255, 255, 255, 0.5); tap-highlight-color: rgba(255, 255, 255, 0.5); } .mm-menu .mm-listview > li.mm-selected > a:not(.mm-next), .mm-menu .mm-listview > li.mm-selected > span { background-color: #91979a; color: #ffffff; } .mm-menu .mm-divider, .mm-menu .mm-listview > li.mm-opened.mm-vertical > .mm-panel, .mm-menu .mm-listview > li.mm-opened.mm-vertical > a.mm-next, .mm-menu.mm-vertical .mm-listview > li.mm-opened > .mm-panel, .mm-menu.mm-vertical .mm-listview > li.mm-opened > a.mm-next { background: #d6000d; } .mm-page { box-sizing: border-box; position: relative; } .mm-slideout { -webkit-transition: -webkit-transform 0.4s ease; transition: -webkit-transform 0.4s ease; transition: transform 0.4s ease; transition: transform 0.4s ease, -webkit-transform 0.4s ease; z-index: 1; } html.mm-opened { overflow-x: hidden; position: relative; } html.mm-blocking, html.mm-blocking body { overflow: hidden; } html.mm-background .mm-page { background: inherit; } #mm-blocker { background: rgba(3, 2, 1, 0); display: none; width: 100%; height: 100%; position: fixed; top: 0; left: 0; z-index: 2; } html.mm-blocking #mm-blocker { display: block; } .mm-menu.mm-offcanvas { z-index: 0; display: none; position: fixed; width: 100%; min-width: 140px; max-width: 300px; } .mm-menu.mm-offcanvas.mm-current { display: block; } .mm-menu.mm-offcanvas.mm-no-csstransforms.mm-current.mm-opened { z-index: 10; } html.mm-opening .mm-slideout { -webkit-transform: translate(80%, 0); -ms-transform: translate(80%, 0); transform: translate(80%, 0); -webkit-transform: translate3d(80%, 0, 0); transform: translate3d(80%, 0, 0); } @media all and (max-width: 175px) { html.mm-opening .mm-slideout { -webkit-transform: translate(140px, 0); -ms-transform: translate(140px, 0); transform: translate(140px, 0); -webkit-transform: translate3d(140px, 0, 0); transform: translate3d(140px, 0, 0); } } @media (max-width: 380px) { .mm-menu.mm-offcanvas { max-width: 100% !important; width: 100%; } html.mm-right.mm-opening .mm-slideout { -webkit-transform: translate(-100%, 0); -ms-transform: translate(-100%, 0); transform: translate(-100%, 0); -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); } } @media all and (min-width: 550px) { html.mm-opening .mm-slideout { -webkit-transform: translate(440px, 0); -ms-transform: translate(440px, 0); transform: translate(440px, 0); -webkit-transform: translate3d(440px, 0, 0); transform: translate3d(440px, 0, 0); } } .mm-menu.mm-hoverselected .mm-listview > li > a.mm-fullsubopen + a, .mm-menu.mm-hoverselected .mm-listview > li > a.mm-fullsubopen + span, .mm-menu.mm-hoverselected .mm-listview > li > a:not(.mm-fullsubopen), .mm-menu.mm-parentselected .mm-listview > li > a.mm-fullsubopen + a, .mm-menu.mm-parentselected .mm-listview > li > a.mm-fullsubopen + span, .mm-menu.mm-parentselected .mm-listview > li > a:not(.mm-fullsubopen) { -webkit-transition: background 0.4s ease; transition: background 0.4s ease; border-bottom: 1px solid #484747; } .mm-menu.mm-hoverselected .mm-listview > li > a.mm-fullsubopen:hover + span, .mm-menu.mm-hoverselected .mm-listview > li > a:not(.mm-fullsubopen):hover, .mm-menu.mm-parentselected .mm-listview > li > a.mm-selected.mm-fullsubopen + a, .mm-menu.mm-parentselected .mm-listview > li > a.mm-selected.mm-fullsubopen + span, .mm-menu.mm-parentselected .mm-listview > li > a.mm-selected:not(.mm-fullsubopen) { background: #d6000d; } .mm-listview.mm-border-none > li:after, .mm-menu.mm-border-none .mm-listview > li:after { content: none; } .mm-listview.mm-border-full > li:after, .mm-menu.mm-border-full .mm-listview > li:after { left: 0 !important; } .mm-listview.mm-border-offset > li:after, .mm-menu.mm-border-offset .mm-listview > li:after { right: 20px; } .mm-menu.mm-offcanvas.mm-right { left: auto; } html.mm-right.mm-opening .mm-slideout { -webkit-transform: translate(-100%, 0); -ms-transform: translate(-100%, 0); transform: translate(-100%, 0); -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); } @media all and (min-width: 381px) { html.mm-right.mm-opening .mm-slideout { -webkit-transform: translate(-300px, 0); -ms-transform: translate(-300px, 0); transform: translate(-300px, 0); -webkit-transform: translate3d(-300px, 0, 0); transform: translate3d(-300px, 0, 0); } } html.mm-front .mm-slideout { -webkit-transform: none !important; -ms-transform: none !important; transform: none !important; z-index: 0; } html.mm-front #mm-blocker { z-index: 1; } html.mm-front .mm-menu.mm-offcanvas { z-index: 2; } .mm-menu.mm-offcanvas.mm-front, .mm-menu.mm-offcanvas.mm-next { -webkit-transition: -webkit-transform 0.4s ease; transition: -webkit-transform 0.4s ease; transition: transform 0.4s ease; transition: transform 0.4s ease, -webkit-transform 0.4s ease; -webkit-transform: translate(-100%, 0); -ms-transform: translate(-100%, 0); transform: translate(-100%, 0); -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); } .mm-menu.mm-offcanvas.mm-front.mm-right, .mm-menu.mm-offcanvas.mm-next.mm-right { -webkit-transform: translate(100%, 0); -ms-transform: translate(100%, 0); transform: translate(100%, 0); -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); } .mm-menu.mm-offcanvas.mm-top { -webkit-transform: translate(0, -100%); -ms-transform: translate(0, -100%); transform: translate(0, -100%); -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); } .mm-menu.mm-offcanvas.mm-bottom { -webkit-transform: translate(0, 100%); -ms-transform: translate(0, 100%); transform: translate(0, 100%); -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); top: auto; } .mm-menu.mm-offcanvas.mm-bottom, .mm-menu.mm-offcanvas.mm-top { width: 100%; min-width: 100%; max-width: 100%; height: 80%; min-height: 140px; max-height: 880px; } html.mm-opening .mm-menu.mm-offcanvas.mm-front, html.mm-opening .mm-menu.mm-offcanvas.mm-next { -webkit-transform: translate(0, 0); -ms-transform: translate(0, 0); transform: translate(0, 0); -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } .mm-menu.mm-shadow-page:after { content: ""; display: block; width: 20px; height: 120%; position: absolute; left: 100%; top: -10%; z-index: 99; } .mm-menu.mm-shadow-page.mm-right:after { left: auto; right: 100%; } .mm-menu.mm-shadow-page.mm-front:after, .mm-menu.mm-shadow-page.mm-next:after { content: none; display: none; } .mm-menu.mm-shadow-page:after, .mm-menu.mm-shadow-panels .mm-panel.mm-opened:nth-child(n+2) { box-shadow: 0 0 10px rgba(0, 0, 0, 0.3); } /* qub / layout / resp-tables */ .table-container-one { position: relative; } .table-container-one .inner { background-color: #ffffff; padding: 3.0625rem 1.75rem 1.75rem 1.75rem; } .table-container-combined { position: relative; } .table-container-combined .inner { background-color: #ffffff; padding: 0 1.75rem 28px 1.75rem; margin-top: -29px; } .responsive tr { border: 1px solid #8b8b8b; } .responsive td { border: 1px solid #8b8b8b; padding: 1.625rem 1rem; word-break: break-word; width: 10%; } .responsive thead { background-color: #dedede; } @media only screen and (max-width: 930px) { /* Force table to not be like tables anymore */ .responsive table, .responsive thead, .responsive tbody, .responsive th, .responsive td, .responsive tr { display: block; } /* Hide table headers (but not display: none;, for accessibility) */ .responsive thead tr { position: absolute; top: -9999px; left: -9999px; } .responsive tr { border: 1px solid #8b8b8b; margin-top: 5px; } .responsive td { /* Behave like a "row" */ border: none; border: 1px solid #8b8b8b; position: relative; white-space: normal; text-align: left; padding: 5% 5% 5% 45%; font-size: 0.9rem; width: auto; } .responsive td.full-width { /* Behave like a "row" */ border: none; border: 1px solid #8b8b8b; position: relative; white-space: normal; text-align: left; padding: 5% 5% 5% 5%; font-size: 0.9rem; width: auto; } .responsive td:before { /* Now like a table header */ position: absolute; /* Top/left values mimic padding */ left: 8%; width: 39%; padding-right: 20px; white-space: normal; text-align: left; font-weight: bold; } /* Label the data */ .responsive td:before { content: attr(data-title); } } @media (max-width: 511px) { .responsive td { padding: 10% 5% 10% 45%; } } @media (min-width: 512px) and (max-width: 930px) { .responsive td { padding: 5% 5% 5% 45%; } } /* qub / components / table */ table { width: 100%; margin-bottom: 1rem; background: #f9f9f9; } table:last-child { margin-bottom: 0; } caption { padding: 1.75rem; margin: 0; background: #d6000d; color: #ffffff; text-align: left; } th, td { padding: 1.625em 1.75rem; text-align: left; } th { font-weight: 500; } thead th { background: #dedede; } tbody th, tbody td { border-top: 1px solid #dedede; } /*table helper class for wide tables (reduces padding)*/ .small-padding th, .small-padding td { padding: 1rem; } /* qub / components / list-inline */ .list-inline { padding: 0; list-style-type: none; } .list-inline li { display: inline-block; margin-right: 1em; margin-bottom: 0; } .list-inline li:last-child { margin-right: 0; } .list-inline li img { margin: 0; vertical-align: middle; } /* qub / components / list-style */ .list-style li { margin: 1em 0; color: #d6000d; font-weight: 500; } .list-style span { color: #58595b; font-weight: 400; display: inline-table; } .bg--primary .list-style ul li { color: #ffffff; } .bg--primary .list-style ul span { color: #ffffff; } .bg--primary .list-style li { color: #fff; } .bg--primary .list-style li span { color: #fff; } /* qub / components / wayfinding */ .wayfinding { padding: 1rem 0; } .wayfinding .bordered .column { padding-top: 0; padding-bottom: 0; } .wayfinding .column:first-child a, .wayfinding .column:last-child a { position: relative; display: block; } .wayfinding .column:first-child a:before, .wayfinding .column:first-child a:after, .wayfinding .column:last-child a:before, .wayfinding .column:last-child a:after { display: inline-block; position: absolute; top: 50%; width: 0.9375rem; height: 0.5625rem; margin-top: -0.3125rem; background-image: url('/home/media/Media,512563,en.png'); /* images/icons/dropdown-white.png */ background-position: center center; background-repeat: no-repeat; } .wayfinding .column:first-child a.disabled, .wayfinding .column:last-child a.disabled { opacity: 0.3; } .wayfinding .column:first-child a.disabled:hover, .wayfinding .column:last-child a.disabled:hover { cursor: default; text-decoration: none; } .wayfinding .column:first-child { text-align: right; } .wayfinding .column:first-child a { padding-left: 1.125rem; } .wayfinding .column:first-child a:before { content: ''; left: 0; -webkit-transform: rotateZ(90deg); transform: rotateZ(90deg); } .wayfinding .column:last-child:not(:first-child) a { padding-right: 1.125rem; } .wayfinding .column:last-child:not(:first-child) a:after { content: ''; right: 0; -webkit-transform: rotateZ(-90deg); transform: rotateZ(-90deg); } @media (max-width: 767px) { .wayfinding .bordered .column { float: left; width: 50%; padding: 0 1.75rem; margin: 0; } .wayfinding .bordered .column:first-child, .wayfinding .bordered .column:first-child:last-child { padding-bottom: 0; border-width: 0 1px 0 0; } .wayfinding .bordered .column:first-child ~ .column { border-width: 0; } } /* qub / components / backgrounds */ [class*="bg--"] a:not(.button) { color: inherit; } [class*="bg--"] .button { color: inherit; border-color: inherit; } [class*="bg--"] .button:hover { border-color: #ffffff; } .bg--primary { background: #d6000d; color: #ffffff; } .bg--primary .alt, .bg--primary blockquote { color: #ffffff; } .bg--primary .button:hover { background-color: #ffffff; color: #d6000d; } .bg--grey { background: #58595b; color: #ffffff; } .bg--grey .alt { color: #ffffff; font-family: 'brandonTextMedium', arial, sans-serif; font-weight: normal; } .bg--grey .button:hover { background-color: #ffffff; color: #58595b; } .bg--grey-d { background: #9b9b9d; color: #ffffff; } .bg--grey-d .alt { color: #ffffff; } .bg--grey-d .button:hover { background-color: #ffffff; color: #9b9b9d; } .bg--grey-md { background: #bdbdbe; color: #ffffff; } .bg--grey-md .alt { color: #ffffff; } .bg--grey-md .button:hover { background-color: #ffffff; color: #9b9b9d; } .bg--grey-ml { background: #dedede; } .bg--grey-ml .button { color: #d6000d; border-color: #d6000d; } .bg--grey-ml .button:hover { background-color: #d6000d; border-color: #d6000d; color: #ffffff; } .bg--grey-l { background: #eeeeee; } .bg--grey-l .button { color: #d6000d; border-color: #d6000d; } .bg--grey-l .button:hover { background-color: #d6000d; border-color: #d6000d; color: #ffffff; } .bg--grey-dark { background: #767678; color: #ffffff; } .bg--grey-dark .button { color: inherit; border-color: inherit; } .bg--grey-dark .button:hover { border-color: #ffffff; } .bg--footer-dark { background: #363636; color: #ffffff; } .bg--footer-dark .button { color: inherit; border-color: inherit; } .bg--footer-dark .button:hover { border-color: #ffffff; } .bg--footer-light { background: #d7d7d7; color: #363636; } .bg--footer-light .button { color: inherit; border-color: inherit; } .bg--footer-light .button:hover { border-color: #ffffff; } /* unistats specific case */ .bg--unistats { background: #dc302c; text-align: center; } .bg--unistats iframe { border: 1px solid #e45955 !important; } /*change arrow backgrounds to match selected bg colour*/ .bg--grey-ml .img-arrow:before, .bg--grey-ml .img-arrow:after { background: #DEDEDE; } .bg--grey-md .img-arrow:before, .bg--grey-md .img-arrow:after { background: #bdbdbe; } .bg--grey .img-arrow:before, .bg--grey .img-arrow:after { background: #58595b; } .bg--grey-d .img-arrow:before, .bg--grey-d .img-arrow:after { background: #9b9b9d; } .bg--grey-md.img-block p:last-child a:first-child:last-child:after, .bg--grey-d.img-block p:last-child a:first-child:last-child:after, .bg--grey.img-block p:last-child a:first-child:last-child:after { background: url("/home/media/Media,596846,en.png") right center no-repeat; } /**new**/ /*change arrow colours to match normal and hover button states*/ .bg--grey-d.img-block p:last-child a.button:first-child:last-child:after { content: ''; position: relative; vertical-align: middle; display: inline-block; width: 0.375rem; height: 0.6875rem; margin-left: 1rem; background: url('/home/media/Media,596846,en.png') right center no-repeat; } .bg--grey-d.img-block p:last-child a.button:first-child:last-child:hover::after { content: ''; position: relative; vertical-align: middle; display: inline-block; width: 0.375rem; height: 0.6875rem; margin-left: 1rem; background: url('/home/media/Media,721201,en.png') right center no-repeat; } .bg--grey.img-block p:last-child a.button:first-child:last-child:after { content: ''; position: relative; vertical-align: middle; display: inline-block; width: 0.375rem; height: 0.6875rem; margin-left: 1rem; background: url('/home/media/Media,596846,en.png') right center no-repeat; } .bg--grey.img-block p:last-child a.button:first-child:last-child:hover::after { content: ''; position: relative; vertical-align: middle; display: inline-block; width: 0.375rem; height: 0.6875rem; margin-left: 1rem; background: url('/home/media/Media,721200,en.png') right center no-repeat; } .bg--grey-l.img-block p:last-child a.button:first-child:last-child:after { content: ''; position: relative; vertical-align: middle; display: inline-block; width: 0.375rem; height: 0.6875rem; margin-left: 1rem; background: url('/home/media/Media,517689,en.png') right center no-repeat; } .bg--grey-l.img-block p:last-child a.button:first-child:last-child:hover::after { content: ''; position: relative; vertical-align: middle; display: inline-block; width: 0.375rem; height: 0.6875rem; margin-left: 1rem; background: url('/home/media/Media,596846,en.png') right center no-repeat; } .bg--grey-md.img-block p:last-child a.button:first-child:last-child:after { content: ''; position: relative; vertical-align: middle; display: inline-block; width: 0.375rem; height: 0.6875rem; margin-left: 1rem; background: url('/home/media/Media,596846,en.png') right center no-repeat; } .bg--grey-md.img-block p:last-child a.button:first-child:last-child:hover::after { content: ''; position: relative; vertical-align: middle; display: inline-block; width: 0.375rem; height: 0.6875rem; margin-left: 1rem; background: url('/home/media/Media,721202,en.png') right center no-repeat; } .bg--grey-ml.img-block p:last-child a.button:first-child:last-child:after { content: ''; position: relative; vertical-align: middle; display: inline-block; width: 0.375rem; height: 0.6875rem; margin-left: 1rem; background: url('/home/media/Media,517689,en.png') right center no-repeat; } .bg--grey-ml.img-block p:last-child a.button:first-child:last-child:hover::after { content: ''; position: relative; vertical-align: middle; display: inline-block; width: 0.375rem; height: 0.6875rem; margin-left: 1rem; background: url('/home/media/Media,596846,en.png') right center no-repeat; } .content .bg--primary p:last-child a.button:first-child:last-child:after { content: ''; position: relative; vertical-align: middle; display: inline-block; width: 0.375rem; height: 0.6875rem; margin-left: 1rem; background: url('/home/media/Media,596846,en.png') right center no-repeat; } .content .bg--primary p:last-child a.button:first-child:last-child:hover::after { content: ''; position: relative; vertical-align: middle; display: inline-block; width: 0.375rem; height: 0.6875rem; margin-left: 1rem; background: url('/home/media/Media,517689,en.png') right center no-repeat; } /* qub / components / banner */ .banner { padding: 0; } .banner .inner > img { display: block; max-width: calc(100% + 3.5rem); margin: 0 -1.75rem; } .banner__caption { padding: 1.75rem 0; } .banner__caption img { margin: 3.0625rem 0 0; } @media (max-width: 767px) { .banner__caption h1 + h2 { margin-bottom: 0; } .banner__caption img { display: none; } } @media (min-width: 768px) { .banner[class*="bg--"], .banner[class*="bg--"] .banner__caption .inner { background: transparent; } .banner__caption { width: 50%; padding: 1.75rem; color: #ffffff; } .banner__caption .inner { padding-right: 50%; } .banner__caption .button { color: inherit; border-color: inherit; } .banner__caption .button:hover { background-color: #ffffff; border-color: #ffffff; color: #58595b; } .banner--light .banner__caption { color: #58595b; } } @media (min-width: 1024px) { article .banner:first-child h1:not(.alt), article .banner:first-child h2:not(.alt), article .banner:first-child h3:not(.alt), article .banner:first-child h4:not(.alt), article .banner:first-child h5:not(.alt), article .banner:first-child h6:not(.alt) { font-size: 2.625em; } } @media (min-width: 1280px) { article .banner:first-child h1:not(.alt), article .banner:first-child h2:not(.alt), article .banner:first-child h3:not(.alt), article .banner:first-child h4:not(.alt), article .banner:first-child h5:not(.alt), article .banner:first-child h6:not(.alt) { font-size: 3.5em; } } @media (min-width: 1536px) { article .banner:first-child h1:not(.alt), article .banner:first-child h2:not(.alt), article .banner:first-child h3:not(.alt), article .banner:first-child h4:not(.alt), article .banner:first-child h5:not(.alt), article .banner:first-child h6:not(.alt) { font-size: 4.375em; } } /*--DTP Banner: options for full width or bound Template--*/ .inner-banner { max-width: 90rem; } .inner-banner-full { overflow: visible; position: relative; margin-right: auto; margin-left: auto; } .inner-banner-full img { display: block; width: 100%; } @media (min-width: 1024px) and (max-width: 1279px) { .inner-banner-full h3 { font-size: 2.625em; } } @media (min-width: 1280px) { .inner-banner-full h3 { font-size: 3.5em; } } @media (min-width: 1280px) and (max-width: 1365px) { .inner-banner-full .banner__caption-banner { margin-left: 4rem; } } @media (min-width: 1366px) and (max-width: 1460px) { .inner-banner-full .banner__caption-banner { margin-left: 4rem; } } @media (min-width: 1461px) and (max-width: 1530px) { .inner-banner-full .banner__caption-banner { margin-left: 4rem; } } @media (min-width: 1531px) and (max-width: 1620px) { .inner-banner-full .banner__caption-banner { margin-left: 5rem; } } @media (min-width: 1621px) and (max-width: 1660px) { .inner-banner-full .banner__caption-banner { margin-left: 8rem; } } @media (min-width: 1661px) and (max-width: 1760px) { .inner-banner-full .banner__caption-banner { margin-left: 10rem; } } @media (min-width: 1761px) and (max-width: 1800px) { .inner-banner-full .banner__caption-banner { margin-left: 12rem; } } @media (min-width: 1801px) and (max-width: 1890px) { .inner-banner-full .banner__caption-banner { margin-left: 14rem; } } @media (min-width: 1891px) and (max-width: 1930px) { .inner-banner-full .banner__caption-banner { margin-left: 16rem; } } @media (min-width: 1931px) and (max-width: 1990px) { .inner-banner-full .banner__caption-banner { margin-left: 18rem; } } @media (min-width: 1991px) { .inner-banner-full .banner__caption-banner { margin-left: 22rem; } } .banner__caption-banner { padding: 1.75rem; } .banner__caption-banner a.button { background-color: transparent; border: 2px solid #ffffff; color: #fff; } .banner__caption-banner a.button:hover { background-color: #fff; color: #d6000d; } .inner-banner { overflow: visible; position: relative; margin-right: auto; margin-left: auto; padding-left: 1.75rem; padding-right: 1.75rem; } .inner-banner img { display: block; max-width: calc(100% + 3.5rem); margin: 0 -1.75rem; } @media (max-width: 767px) { .banner__caption-banner a.button { background-color: transparent; border: 2px solid #d6000d; color: #d6000d; } .banner__caption-banner a.button:hover { background-color: #d6000d; color: #fff; } .inner-banner { padding-left: 0; padding-right: 0; } } @media (min-width: 768px) { .banner__caption-banner { background: none; width: 50%; padding: 1.75rem; color: #fff; position: absolute; top: 50%; left: 0; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } } @media (min-width: 1024px) { .inner-banner h3 { font-size: 2.625em; } } @media (min-width: 1280px) { .inner-banner h3 { font-size: 3.5em; } } @media (min-width: 1280px) { .inner-banner h3 { font-size: 3.5em; } } /* qub / components / breadcrumbs */ .breadcrumbs { padding: 0 0.5rem 0.5rem 1.2rem; background: #ffffff; line-height: 1rem; } .breadcrumbs li { font-size: 0.75rem; line-height: 1em; text-transform: uppercase; } .breadcrumbs a { color: inherit; } .breadcrumbs a:hover { color: #d6000d; } .breadcrumbs .active { color: #d6000d; font-weight: 500; } .breadcrumbs li:after { content: ''; display: inline-block; vertical-align: middle; border-right: 4px solid transparent; border-left: 4px solid transparent; border-top: 6px solid; margin: 0 0 4px 1em; transform: rotate(-90deg); -webkit-transform: rotate(-90deg); } .breadcrumbs li:last-child:after { content: initial; } .breadcrumbs.fixed { z-index: 100000; background-color: #d1000d; color: #ffffff; padding: 0.5rem 0.5rem 0.5rem 1.2rem; } .breadcrumbs.fixed a:hover { color: #ffffff; text-decoration: none; } @media (max-width: 512px) { .breadcrumbs li { font-size: 0.688rem; } } @media (max-width: 740px) { .breadcrumbs.fixed { display: none; } } /* qub / components / button */ .button { display: inline-block; padding: 0.9375rem 2.8125rem; margin: 0 0.25rem 0.75rem; background-color: transparent; border: 2px solid #d6000d; border-radius: 3px; color: #d6000d; font-size: 1rem; font-weight: 500; line-height: 1em; text-align: center; text-transform: initial; -webkit-transition: all 0.2s; transition: all 0.2s; } .button:hover { background-color: #d6000d; color: #ffffff; text-decoration: none; } .button:active { border-color: #dedede !important; } .button:last-child { margin-bottom: 0; margin-right: 0; } .button[disabled] { opacity: 0.3; } .button--grey { border-color: #58595b; color: #58595b; } .button--grey:hover { background-color: #58595b; } button, input[type="submit"] { display: inline-block; padding: 0.9375rem 2.8125rem; background-color: transparent; border: 2px solid #d6000d; border-radius: 3px; color: #d6000d; font-size: 1rem; font-weight: 500; line-height: 1em; text-align: center; text-transform: initial; -webkit-transition: all 0.2s; transition: all 0.2s; } button:hover, input[type="submit"]:hover { background-color: #d6000d; color: #ffffff; text-decoration: none; } button:active, input[type="submit"]:active { border-color: #dedede !important; } button:last-child, input[type="submit"]:last-child { margin-bottom: 0; margin-right: 0; } button[disabled], input[type="submit"][disabled] { opacity: 0.3; } /* qub / components / card */ .card { padding: 5rem; border: 0.375rem solid #d6000d; font-size: 1.25em; text-align: center; } .card h1, .card h2, .card h3, .card h4, .card h5, .card h6 { margin-bottom: 3.125rem; } .card p, .card li, .card th, .card td { font-weight: 500; } /* qub / components / column */ .inner .columns { width: auto; margin-left: -1.75rem; margin-right: -1.75rem; overflow: visible; } .columns { margin-top: 1.75rem; margin-bottom: 1.75rem; } .columns:first-child { margin-top: 0; } .columns:last-child { margin-bottom: 0; } .columns:after { content: ''; display: block; clear: both; } .column { padding: 0 1.75rem; margin-bottom: 1.75rem; } .column:last-child { margin-bottom: 0; } .aligned { font-size: 0; } .aligned .column { float: none; display: inline-block; font-size: 1rem; vertical-align: middle; } .bordered .column { padding-top: 1rem; padding-bottom: 1rem; } .bordered .column:not(:last-child), .bordered .column:first-child:last-child { border: 1px solid #dedede; border-width: 0 1px 0 0; } .bordered [class*="offset"] { border: 1px solid #dedede; border-width: 0 0 0 1px; } .bordered .column:nth-last-child(2):first-child, .bordered .column:nth-last-child(2):first-child ~ * { height: auto !important; vertical-align: middle; } @media (max-width: 767px) { .equal .column { height: auto !important; } .bordered .column { height: auto !important; padding: 1rem 0; margin-right: 1.75rem; margin-left: 1.75rem; } .bordered .column:not(:last-child), .bordered .column:first-child:last-child { padding-bottom: 3.0625rem; border-width: 0 0 1px; } .bordered [class*="offset"] { border-width: 1px 0 0; } } @media (min-width: 768px) { .columns { margin-top: 3.0625rem; margin-bottom: 3.0625rem; } .column:first-child { padding-left: 1.75rem; } .column:last-child { padding-right: 1.75rem; } } /* qub / components / cookie-control */ #cookie-container { color: #ffffff; font-size: 14px; background-color: #101111; padding: 15px 10px 15px 10px; border-top: 4px solid #AEB7B3; position: fixed; bottom: 0; top: auto; z-index: 10000; width: 100%; } #cookie-container a { color: #ffffff; font-weight: 600; } .show-cookie { display: block; } .hide-cookie { display: none; } .columns .info { padding: 0 0 0 3rem; margin: 0; } .columns .info-text { padding: 0; } #cookie-container .inner span { padding: 0 10px 0 0; float: left; } span.cookie-info { line-height: 1.6rem; } #cookie-container .close span { text-transform: lowercase; font-size: 2.5em; line-height: 1; padding: 0 0 0 10px; float: left; position: relative; bottom: 2px; } #cookie-container a.button.close { border: 2px solid #AEB7B3; color: #AEB7B3; padding: 0.7rem 2.2rem; margin: 0.5rem; cursor: pointer; } #cookie-container a.button.close:hover { background-color: #AEB7B3; color: #101111; } @media all and (max-width: 767px) { #cookie-container { padding: 0 10px 15px 10px; } #cookie-container a.button.close { margin: 0.5rem 0rem; } } @media all and (min-width: 768px) and (max-width: 1023px) { .column.colspan-10.cookie-col-10 { width: 75%; } .column.colspan-2.cookie-col-2 { width: 25%; } } /* qub / components / cta */ .cta { position: relative; display: block; padding: 1.75rem 4.375rem 1.75rem 1.75rem; margin: 1px 0; background: #d6000d; border: 0; color: #ffffff; font-size: 1.25em; font-weight: 500; line-height: 1.25em; text-align: left; } .cta:after { content: ''; display: block; position: absolute; top: 50%; right: 1.75rem; width: 0.9375rem; height: 0.5625rem; margin-top: -0.3125rem; background-image: url('/home/media/Media,512563,en.png'); /* images/icons/dropdown-white.png */ background-position: center center; background-repeat: no-repeat; -webkit-transform: rotateZ(-90deg); transform: rotateZ(-90deg); } .cta:hover, .cta:active { background: #d6000d; color: #ffffff; text-decoration: none; } /* qub / components / feature */ .feature .inner { max-width: 45rem; padding-top: 6.125rem; padding-bottom: 6.125rem; } /* qub / components / filter */ .filter.toggle > .inner > header { padding-top: 3.0625rem; padding-bottom: 3.0625rem; } .filter.toggle .toggle { padding: 0 1.75rem; background-color: #ffffff; border: 1px solid #bdbdbe; border-radius: 3px; } .filter.toggle .toggle header { padding: 0.875rem 0; } .filter.toggle .toggle header:after { right: 0; } .filter.toggle .toggle.open header { border-bottom: 1px solid #bdbdbe; } .filter.toggle .toggle.open .toggle__inner { margin-top: 0.875rem; margin-bottom: 0.875rem; } .filter.toggle .toggle.open .toggle__content { padding-top: 0; padding-bottom: 0; } .filter.toggle .toggle.open .toggle__content { max-height: 15.625rem; } .filter.toggle.open { padding-bottom: 3.0625rem; } @media (min-width: 768px) and (max-width: 1023px) { .filter .colspan-6 { width: 100%; margin-bottom: 0; } } /* qub / components / graphics */ .graphic { background-position: center center; background-repeat: no-repeat; background-size: auto 100%; } .graphic .inner { max-width: 45rem; padding-top: 6.125rem; padding-bottom: 6.125rem; } .testimonial { background-image: url('/home/media/Media,517691,en.png'); /* images/icons/testimonial.png */ background-position: left center; } .testimonial blockquote { font-size: 1.5em; line-height: 1.25em; text-transform: uppercase; } .testimonial cite { font-size: 1.125em; } @media (min-width: 640px) { .testimonial blockquote { font-size: 1.75em; } .testimonial cite { font-size: 1.25em; } } @media (min-width: 1024px) { .testimonial blockquote { font-size: 2em; } } @media (min-width: 1280px) { .testimonial blockquote { font-size: 2.25em; } } .top-universities { background-image: url('/home/media/Media,517692,en.png'); /* images/icons/top-universities.png */ background-image: url("http://www.qub.ac.uk/home/media/Media,517692,en.png"); background-position: 30% center; /* typographic */ } .top-universities h2 { display: inline-block; margin-bottom: 0; } .top-universities span { display: inline-block; line-height: 1em; } .top-universities span:nth-of-type(1) { padding-bottom: 1rem; margin-bottom: 1rem; border-bottom: 6px solid; } .top-universities span:nth-of-type(2) { float: left; margin-right: 0.125em; font-size: 4em; font-weight: 500; letter-spacing: -6px; line-height: 1em; } .top-universities span:nth-of-type(3), .top-universities span:nth-of-type(4) { font-weight: 900; } .top-universities span:nth-of-type(3) { font-size: 1.75em; } .top-universities span:nth-of-type(4) { font-size: 1.96875em; } .top-universities h2 + p { margin-bottom: 3.5rem; } @media (max-width: 767px) { .top-universities h2 { font-size: 1.5em; } } @media (max-width: 639px) { .top-universities h2 { font-size: 1.25em; } } @media (max-width: 511px) { .top-universities h2 { font-size: 1em; } } @media (max-width: 399px) { .top-universities span:nth-of-type(2) { float: none; display: block; margin: 0; } } /* qub / components / header-dropdown */ .header__dropdown { max-height: 0; position: relative; } .header__dropdown.open { max-height: none; } .header__dropdown.expanded + main { display: none; } .header__dropdown .inner:before { content: ''; position: absolute; top: 0; right: 0; z-index: 10; display: block; width: 1.25rem; height: 1.25rem; margin: 1.75rem; background: url('/home/media/Media,517693,en.png') center center no-repeat; /* images/icons/close.png */ color: #d6000d; cursor: pointer; } .header__dropdown .panel { border-bottom: 6px solid #d6000d; } .header__dropdown .img-arrow { z-index: 10; transform: translateY(100%); } .header__dropdown .img-arrow:before { content: none; } .header__dropdown .img-arrow:after { content: ''; } .header__dropdown table, .header__dropdown caption { background: #ffffff; color: #58595b; } .header__dropdown table { margin: 3.0625rem 0; } .header__dropdown table:first-child { margin-bottom: 0; } .header__dropdown table:last-child { margin-bottom: 0; } .header__dropdown caption { border-bottom: 3px solid #d6000d; } .header__dropdown thead th { background: #ffffff; } /* qub / components / heading-alt */ .alt { margin-bottom: 0.25rem; color: #d6000d; font-size: 1em; } h1.alt, h2.alt, h3.alt { font-family: 'brandonTextMedium', arial, sans-serif; } h1.alt { font-size: 1.5em; } h2.alt { font-size: 1.125em; } h4.alt { font-size: 1.25em; } .alt + p, .alt + li, .alt + th, .alt + td { margin-top: 0.75rem; } /* qub / components / img-arrow */ .img-arrow { position: absolute; bottom: 0; z-index: 10; display: block; width: 100%; height: 1.375rem; color: #d6000d; overflow: hidden; } .img-arrow:before, .img-arrow:after { position: relative; display: block; width: 2rem; height: 2rem; margin: 0 auto; background: #ffffff; border: 0.375rem solid; -webkit-transform: rotate(45deg); transform: rotate(45deg); } .img-arrow:before { content: ''; top: 0.375rem; } .img-arrow:after { top: -1rem; } .bg--primary .img-arrow:before, .bg--primary .img-arrow:after { background: #d6000d; } .bg--grey-l .img-arrow:before, .bg--grey-l .img-arrow:after { background: #eeeeee; } /* qub / components / img-block */ .img-block .inner { padding-top: 0; padding-bottom: 0; } .img-block div { position: relative; } .img-block img { display: block; width: 100%; max-width: initial; margin: 0; } .img-block p:last-child a:first-child:last-child:after { content: ''; position: relative; vertical-align: middle; display: inline-block; width: 0.375rem; height: 0.6875rem; margin-left: 1rem; background: url('/home/media/Media,517689,en.png') right center no-repeat; } .img-block p:last-child a.button:first-child:last-child:after { content: ''; position: relative; vertical-align: middle; display: inline-block; width: 0.375rem; height: 0.6875rem; margin-left: 1rem; background: url('/home/media/Media,517689,en.png') right center no-repeat; } .img-block p:last-child a.button:first-child:last-child:hover::after { content: ''; position: relative; vertical-align: middle; display: inline-block; width: 0.375rem; height: 0.6875rem; margin-left: 1rem; background: url('/home/media/Media,596846,en.png') right center no-repeat; } .img-block .column { padding-top: 1.75rem; padding-bottom: 1.75rem; margin-bottom: 0; } .img-block .column > div:first-child { margin: -1.75rem -1.75rem 1.75rem; } .img-block .column > div:first-child:before { content: ''; position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 5; border: 6px solid #d6000d; border-width: 0 0 6px; } .img-block .column > :last-child { margin-bottom: 6.25rem; } .img-block.horz .column > div:first-child { margin-bottom: 0; } @media (max-width: 767px) { .img-block .column { height: auto !important; padding-top: 0; } .img-block .column > div:first-child { margin-top: 0; } } @media (min-width: 768px) { .img-block.vert .column:nth-child(odd) > div:first-child { position: absolute; right: 0; bottom: 0; left: 0; margin: 1.75rem 0 0; } .img-block.vert .column:nth-child(odd) > div:first-child:before { border-width: 6px 0 0; } .img-block.vert .column:nth-child(odd) .img-arrow { top: 0; bottom: auto; } .img-block.vert .column:nth-child(odd) .img-arrow:before { content: none; } .img-block.vert .column:nth-child(odd) .img-arrow:after { content: ''; } } @media (max-width: 1023px) { .img-block.horz .column { width: 100%; height: auto !important; } .img-block.horz .column > img:first-child:last-child, .img-block.horz .column > div:first-child:last-child img { position: static; height: auto; width: 100%; min-height: 0; } } @media (min-width: 768px) and (max-width: 1023px) { .img-block.horz .column:nth-child(odd) { padding-bottom: 0; } } @media (min-width: 1024px) { .img-block.horz .column > :last-child { margin-bottom: 0; } .img-block.horz .column:nth-child(odd) { padding-bottom: 0; } .img-block.horz .column:nth-child(odd) > div:first-child:before { border-width: 0 6px 0 0; } .img-block.horz .column:nth-child(odd) .img-arrow { right: 0; width: 1.375rem; height: 100%; } .img-block.horz .column:nth-child(odd) .img-arrow:before, .img-block.horz .column:nth-child(odd) .img-arrow:after { top: 50%; } .img-block.horz .column:nth-child(odd) .img-arrow:before { left: 0.375rem; } .img-block.horz .column:nth-child(odd) .img-arrow:after { left: -1rem; } .img-block.horz .column:nth-child(4n + 1) { float: right; left: -3px; padding-right: 1.5625rem; overflow: visible; } .img-block.horz .column:nth-child(4n + 1) > div:first-child:before { border-width: 0 0 0 6px; } .img-block.horz .column:nth-child(4n + 1) .img-arrow { right: auto; left: 0; } .img-block.horz .column:nth-child(4n + 1) .img-arrow:before { content: none; } .img-block.horz .column:nth-child(4n + 1) .img-arrow:after { content: ''; } .img-block.horz .column:nth-child(4n + 3) { right: -3px; padding-left: 1.5625rem; overflow: visible; } } @media (min-width: 768px) and (max-width: 1279px) { .img-block.vert .column:nth-child(odd):last-child { width: 100%; height: auto !important; } .img-block.vert .column:nth-child(odd):last-child > div:first-child { position: relative; float: right; width: calc(50% + 1.75rem); margin: -1.75rem -1.75rem -1.75rem 0; } .img-block.vert .column:nth-child(odd):last-child > div:first-child ~ * { width: 50%; padding-right: 1.75rem; } .img-block.vert .column:nth-child(odd):last-child > div:first-child:before { border-width: 0 0 0 6px; } .img-block.vert .column:nth-child(odd):last-child .img-arrow { left: 0; width: 1.375rem; height: 100%; } .img-block.vert .column:nth-child(odd):last-child .img-arrow:before, .img-block.vert .column:nth-child(odd):last-child .img-arrow:after { top: 50%; } .img-block.vert .column:nth-child(odd):last-child .img-arrow:before { content: none; } .img-block.vert .column:nth-child(odd):last-child .img-arrow:after { content: ''; left: -1rem; } .img-block.vert .column:nth-child(odd):last-child :last-child { margin-bottom: 0; } } /* qub / components / img-mask */ @media (min-width: 768px) { .height-set .column { position: relative; overflow: hidden; } .height-set .column > div:first-child:last-child { position: relative; height: calc(100% + 28px); overflow: hidden; } .height-set .column > img:first-child:last-child, .height-set .column > div:first-child:last-child img { position: absolute; right: -100%; left: -100%; width: 101%; max-width: initial; height: 100%; min-width: 100%; min-height: 100%; margin-right: auto; margin-left: auto; } } /* qub / components / stretch */ .stretch-h { margin-left: -1.75rem; margin-right: -1.75rem; } .stretch-v { margin-top: -3.0625rem !important; margin-bottom: -3.0625rem !important; } /* qub / components / map */ .map { position: relative; display: inline-block; padding: 0 !important; } .map:before { content: ''; display: block; margin-top: 83.3333%; } .map iframe { position: absolute; top: 0; right: 0; bottom: 0; left: 0; } @media (max-width: 767px) { .map { display: block; width: 100%; margin-top: 3.0625rem !important; } } /* qub / components / main-title */ .main-title { padding: 1rem 0 0 0; background: #ffffff; } .main-title .inner { padding: 0; } .main-title h1 { font-size: 2.375rem; padding: 0 0 4px 18px; margin: 0 0 5px 0; text-transform: capitalize; color: #1d1d1d; } @media screen and (max-width: 512px) { .main-title h1 { font-size: 2rem; padding: 0 0 4px 18px; margin: 0 0 5px 0; } } /* qub / components / share-widget */ /*"share" widget*/ .hideshare-wrap { position: relative; float: right; } .hideshare-list { position: absolute; top: 0; left: 0; right: 0; margin: 0; padding: 0; list-style: none; text-align: center; } .hideshare-list li { display: inline-block; zoom: 1; *display: inline; margin: 0.2em; } .hideshare-wrap span { display: none; } /* qub / components / social-wall */ .social-wall { padding-right: 0.875rem; padding-left: 0.875rem; } .social-wall .inner { padding-top: 0; } .social-wall .column { padding-right: 0.875rem; padding-left: 0.875rem; } .social-wall .twitter, .social-wall .instagram { margin-bottom: 1.75rem; background: #ffffff; color: #58595b; } .social-wall .twitter img, .social-wall .instagram img { margin-bottom: 0; } .social-wall .twitter .inner, .social-wall .instagram .inner { padding: 1rem; } .social-wall .twitter p:last-child small, .social-wall .instagram p:last-child small { float: right; } /* qub / components / sidebar toggle */ .sidebar__toggle { z-index: 100; display: block; width: 5rem; height: 6.25rem; padding: 2.375rem 1.8rem; background: #ffffff; } .sidebar__toggle:before, .sidebar__toggle:after { content: ''; box-sizing: content-box; display: block; width: 1.8rem; height: 6px; border: 4px solid #ffffff; -webkit-transform-origin: center center; -ms-transform-origin: center center; transform-origin: center center; -webkit-transition: transform 0.3s, border 0.2s 0.3s; transition: transform 0.3s, border 0.2s 0.3s; } .sidebar__toggle:before { border-width: 2px 0 1px; } .sidebar__toggle:after { border-width: 1px 0 2px; } .sidebar__toggle:hover:before, .sidebar__toggle:hover:after { border-color: #ffffff; } .sidebar__toggle.open:before, .sidebar__toggle.open:after { height: 0; -webkit-transition: border 0.2s, transform 0.3s 0.2s, height 0.3s 0.2s; transition: border 0.2s, transform 0.3s 0.2s, height 0.3s 0.2s; } .sidebar__toggle.open:before { border-width: 0 0 2px; -webkit-transform: translateY(0.4px) rotate(45deg); -ms-transform: translateY(0.4px) rotate(45deg); transform: translateY(0.4px) rotate(45deg); } .sidebar__toggle.open:after { border-width: 2px 0 0; -webkit-transform: translateY(-2px) rotate(-45deg); -ms-transform: translateY(-2px) rotate(-45deg); transform: translateY(-2px) rotate(-45deg); } /* reduced height header */ @media (max-width: 512px) { .sidebar__toggle { height: 5rem; padding: 1.75rem 1.8rem; } } @media (min-width: 513px) { .sidebar__toggle { padding: 2.1rem 1.8rem 3rem 1.8rem; } } /* Dark Menu Implementation */ @media (min-width: 1025px) { .sidebar__toggle { padding: 2.1rem 1.8rem 3rem 1.8rem; } } /* qub / components / slideshow */ .slideshow:not(.mod__inner) img { z-index: 1; } .slideshow .slide__caption { position: absolute; top: 50%; -webkit-transform: translate(0, -50%); transform: translate(0, -50%); width: 100%; max-width: 90rem; height: auto; padding: 1.75rem; background: none !important; z-index: 2; } .slideshow .slideshow__slide { position: relative; width: 100%; } .slideshow .slideshow__slide > span img { display: block; width: 100%; } /* qub / components / toggle */ .toggle header, .toggle .toggle__content, .toggle .toggle__inner { -webkit-transition: all 0.3s; transition: all 0.3s; } .toggle header { position: relative; cursor: pointer; padding: 1.75rem 4.375rem 1.75rem 1.75rem; } .toggle header h1, .toggle header h2, .toggle header h3, .toggle header h4, .toggle header h5, .toggle header h6 { margin: 0; font-size: 1.25em; font-weight: 500; text-transform: initial; } .toggle header:after { content: ''; display: block; position: absolute; top: 50%; right: 1.75rem; width: 0.9375rem; height: 0.5625rem; margin-top: -0.3125rem; background: url('/home/media/Media,512563,en.png') center center no-repeat; /* images/icons/dropdown-white.png */ background-position: center center; background-repeat: no-repeat; } .toggle .inner > header { margin: 0 -1.75rem; } .toggle .toggle__inner { overflow: auto; padding: 0 0.4375rem; margin: 0 -1.75rem; } .toggle .toggle__content { max-height: 0; overflow: hidden; -webkit-transition: all 0.3s; transition: all 0.3s; } .toggle .toggle header { padding-top: 1rem; padding-bottom: 1rem; } .toggle .toggle header h1, .toggle .toggle header h2, .toggle .toggle header h3, .toggle .toggle header h4, .toggle .toggle header h5 h6 { font-size: 1rem; } .toggle .toggle .toggle__content { padding: 0 1.75rem; background: #ffffff; } .toggle .toggle.open .toggle__content { padding-top: 1.75rem; padding-bottom: 1.75rem; } .toggle .toggle__inner .toggle__content { padding: 0 1.3125rem; } .toggle + .toggle { margin-top: 1px; } .toggle.open > header:after, .toggle.open > .inner > header:after { -webkit-transform: rotateZ(-180deg); transform: rotateZ(-180deg); } .toggle.open > .toggle__inner, .toggle.open > .inner > .toggle__inner { margin: 1.75rem -1.75rem; } .toggle.open > .toggle__content, .toggle.open > .inner > .toggle__content, .toggle.open > .toggle__inner > .toggle__content, .toggle.open > .inner > .toggle__inner > .toggle__content { max-height: none; } .toggle header:not([class*="bg--"]):after, .toggle header.bg--grey-l:after, .toggle header.bg--grey-ml:after { background: url('/home/media/Media,512564,en.png') center center no-repeat; /* images/icons/dropdown.png */ } /* qub / components / course finder */ .course-finder-module { text-align: center; } .course-finder-module p { margin-top: 0; font-weight: 500; text-transform: uppercase; } .course-finder-module input:not([type="radio"]):not([type="checkbox"]):not([type="submit"]), .course-finder-module select, .course-finder-module textarea { max-width: 32.8125rem; } .course-finder-module input:not([type="radio"]):not([type="checkbox"]):not([type="submit"]), .course-finder-module select, .course-finder-module textarea, .course-finder-module .button { margin: 0.875rem 0; } .course-finder-module input:not([type="radio"]):not([type="checkbox"]):not([type="submit"]):last-child, .course-finder-module select:last-child, .course-finder-module textarea:last-child, .course-finder-module .button:last-child { margin-bottom: 0; } .course-finder-module + .bg--grey { border-top: 2px solid; } .course-finder-module .button { padding: 0.83rem 2.8125rem; background-color: transparent; border: 2px solid #ffffff; } .course-finder-module .button:after { content: ''; position: relative; vertical-align: middle; display: inline-block; width: 0.375rem; height: 0.6875rem; margin-left: 1rem; background: url(/home/media/Media,596846,en.png) right center no-repeat; } .course-finder-module .button:hover::after { content: ''; position: relative; vertical-align: middle; display: inline-block; width: 0.375rem; height: 0.6875rem; margin-left: 1rem; background: url('/home/media/Media,721200,en.png') right center no-repeat; } @media (max-width: 767px) { .course-finder-module .button { width: 70%; } } @media (min-width: 768px) { .course-finder-module input:not([type="radio"]):not([type="checkbox"]):not([type="submit"]), .course-finder-module select, .course-finder-module textarea, .course-finder-module .button { margin-right: 0.875rem; /*margin-left: 0.875rem;*/ } .course-finder-module .button { width: 50%; } } @media (max-width: 1279px) { .course-finder-module .column:last-child { display: block; text-align: center; width: 100%; } } @media (min-width: 1280px) { .course-finder-module .button { width: 100%; } } /* qub / components / share block */ .share-block { display: table; width: 100%; padding: 0.875rem 1.75rem; margin: 1.75rem 0; border: 1px solid #dedede; border-width: 1px 0; } .share-block > * { display: table-cell; vertical-align: middle; margin: 0; } .share-block button, .share-block .button { float: right; margin-left: 1.75rem; white-space: nowrap; } /* qub / components / tabs */ .tabs { color: #58595b; } .tabs .columns { margin-top: 0; margin-bottom: 0; } .tabs .column { padding: 0; margin: 0; } .tabs ul { padding: 0; list-style-type: none; } .tab { display: block; padding: 1.75rem; color: #ffffff; font-size: 1.25em; font-weight: 500; text-align: center; -webkit-transition: all 0.3s; transition: all 0.3s; } .tab.active { background: #eeeeee; color: #58595b; } .tab:hover, .tab.open { background: #ffffff; color: #58595b; text-decoration: none; } .tabs__main { background: #9b9b9d; border-top: 5px solid #9b9b9d; } .tabs__main .tab.active:after { content: ''; display: inline-block; width: 0.9375rem; height: 0.5625rem; margin-left: 1.75rem; background: url('/home/media/Media,512564,en.png') center center no-repeat; /* images/icons/dropdown.png */ background-position: center center; background-repeat: no-repeat; } .tabs__sub { background: #eeeeee; } .tabs__sub ul { padding: 1.75rem 0; } .tabs__sub .tab { padding: 0.875rem; color: #58595b; } .tabs__sub .tab:hover, .tabs__sub .tab.active { background: #dedede; color: #d6000d; } /*Tabbed content - list formatting for content panels*/ .ui-tabs-panel ul { padding: 1rem; } .ui-tabs-panel li { list-style-type: disc; } /*show all tabs on print*/ @media print { .tab-container { display: block !important; } } /* qub / components / video */ .video, .video .inner { padding-top: 0; padding-bottom: 0; } .video .inner div:first-child { position: relative; } .video .inner .column h1:first-child, .video .inner .column h2:first-child, .video .inner .column h3:first-child, .video .inner .column h4:first-child, .video .inner .column h5:first-child, .video .inner .column h6:first-child { margin-top: 1.75rem; } .video video { display: block; max-width: calc(100% + 3.5rem); margin: 0 -1.75rem; } .video__controls { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); text-align: center; -webkit-transition: all 0.3s; transition: all 0.3s; } .play { padding: 1.75rem 1.75rem 1.4rem; border: 3px solid #ffffff; border-radius: 0; color: #ffffff; font-size: 2.5rem; } .video.playing .video__controls, .video.playing .video__caption { opacity: 0; } .video.playing video { cursor: pointer; } .video.paused video { opacity: 0.5; } .video__caption { padding: 1.75rem 0; } @media (min-width: 768px) { .video__caption { position: absolute; bottom: 0; left: 0; width: 100%; padding: 1.75rem; color: #ffffff; -webkit-transition: all 0.3s; transition: all 0.3s; } } /*Video wrapper for video embed*/ .videoWrapper { position: relative; padding-bottom: 56%; /* 16:9 */ padding-top: 0; height: 0; } .videoWrapper iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } /* Inner Video Bounding Class */ .panel .inner-video { padding: 0rem 0rem; max-width: 90rem; position: relative; margin-left: auto; margin-right: auto; background: #ffffff; } /* QUB / components / carousel */ @media (min-width: 768px) { .banner__caption-carousel.light h2.alt { color: #ffffff; } } .banner__caption-carousel.dark h2.alt { color: #d6000d; } .banner__caption-carousel.dark h3 { color: #58595b; } @media (min-width: 768px) { .banner__caption-banner.light h2.alt { color: #ffffff; } } .banner__caption-banner.dark h2.alt { color: #d6000d; } .banner__caption-banner.dark h3 { color: #58595b; } .banner__caption-banner a.button.dark { color: #d6000d; border: 2px solid #d6000d; } .banner__caption-banner a.button.dark:hover { background-color: #d6000d; color: #ffffff; border: 2px solid #d6000d; } .banner__caption-banner.dark p { color: #58595b; } /*--*/ div#myCarousel { margin: 0 -1.75rem; } .img-responsive, .thumbnail > img, .thumbnail a > img, .carousel-inner > .item > img, .carousel-inner > .item > a > img { display: block; width: 100%; margin: 0 auto; } .carousel { position: relative; } .carousel-inner { position: relative; width: 100%; overflow: hidden; } .carousel-inner > .item { position: relative; display: none; -webkit-transition: .6s ease-in-out left; -o-transition: .6s ease-in-out left; transition: .6s ease-in-out left; } .carousel-inner > .item > img, .carousel-inner > .item > a > img { line-height: 1; } .carousel-inner .item a:hover { text-decoration: none; } .sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); border: 0; } .sr-only-focusable:active, .sr-only-focusable:focus { position: static; width: auto; height: auto; margin: 0; overflow: visible; clip: auto; } @media all and (transform-3d), (-webkit-transform-3d) { .carousel-inner > .item { -webkit-transition: -webkit-transform 0.6s ease-in-out; -o-transition: -o-transform 0.6s ease-in-out; transition: transform 0.6s ease-in-out; -webkit-backface-visibility: hidden; backface-visibility: hidden; -webkit-perspective: 1000px; perspective: 1000px; } .carousel-inner > .item.next, .carousel-inner > .item.active.right { left: 0; -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); } .carousel-inner > .item.prev, .carousel-inner > .item.active.left { left: 0; -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); } .carousel-inner > .item.next.left, .carousel-inner > .item.prev.right, .carousel-inner > .item.active { left: 0; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } .carousel-inner > .active, .carousel-inner > .next, .carousel-inner > .prev { display: block; } .carousel-inner > .active { left: 0; } .carousel-inner > .next, .carousel-inner > .prev { position: absolute; top: 0; width: 100%; } .carousel-inner > .next { left: 100%; } .carousel-inner > .prev { left: -100%; } .carousel-inner > .next.left, .carousel-inner > .prev.right { left: 0; } .carousel-inner > .active.left { left: -100%; } .carousel-inner > .active.right { left: 100%; } .carousel-control { position: absolute; top: 0; bottom: 0; left: 0; width: 15%; font-size: 20px; color: #ffffff; text-align: center; text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6); filter: alpha(opacity=50); opacity: .5; } .carousel-control.right { right: 0; left: auto; } .carousel-control:hover, .carousel-control:focus { color: #ffffff; text-decoration: none; filter: alpha(opacity=90); outline: 0; opacity: .9; } .carousel-control .icon-prev, .carousel-control .icon-next, .carousel-control .glyphicon-chevron-left, .carousel-control .glyphicon-chevron-right { position: absolute; top: 50%; z-index: 5; display: inline-block; margin-top: -10px; } .carousel-control .icon-prev, .carousel-control .glyphicon-chevron-left { left: 50%; margin-left: -10px; } .carousel-control .icon-next, .carousel-control .glyphicon-chevron-right { right: 50%; margin-right: -10px; } .carousel-control .icon-prev, .carousel-control .icon-next { width: 20px; height: 20px; font-family: serif; line-height: 1; } .carousel-control .icon-prev:before { content: '\2039'; } .carousel-control .icon-next:before { content: '\203a'; } .carousel-indicators { position: absolute; bottom: 10px; left: 50%; z-index: 15; width: 60%; padding-left: 0; margin-left: -30%; text-align: center; list-style: none; } .carousel-indicators li { display: inline-block; width: 10px; height: 10px; margin: 1px; text-indent: -999px; cursor: pointer; background-color: #000 \9; background-color: transparent; border: 1px solid #ffffff; border-radius: 10px; } .carousel-indicators .active { width: 12px; height: 12px; margin: 0; background-color: #ffffff; } .carousel-caption { position: absolute; right: 15%; bottom: 20px; left: 15%; z-index: 10; padding-top: 20px; padding-bottom: 20px; color: #ffffff; text-align: center; text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6); } .carousel-caption .btn { text-shadow: none; } @media screen and (min-width: 768px) { .carousel-control .glyphicon-chevron-left, .carousel-control .glyphicon-chevron-right, .carousel-control .icon-prev, .carousel-control .icon-next { width: 30px; height: 30px; margin-top: -15px; font-size: 30px; } .carousel-control .glyphicon-chevron-left, .carousel-control .icon-prev { margin-left: -15px; } .carousel-control .glyphicon-chevron-right, .carousel-control .icon-next { margin-right: -15px; } .carousel-caption { right: 20%; left: 20%; padding-bottom: 30px; } .carousel-indicators { bottom: 20px; } } @media (min-width: 1280px) { .banner__caption-carousel h3 { font-size: 3.5em; } } @media (min-width: 640px) and (max-width: 767px) { .carousel-indicators { top: 260px; left: 50%; } .carousel-inner { height: 530px; } } @media (max-width: 767px) { .banner__caption-carousel { padding: 3.5rem 1.75rem 1.75rem 1.75rem; background: none; } .banner__caption-carousel h3 span { background: none; color: #58595b; } } @media (min-width: 1280px) { .banner__caption-carousel { background: none; width: 50%; padding: 1.75rem; color: #ffffff; position: absolute; top: 50%; left: 0; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } } @media (min-width: 768px) and (max-width: 1279px) { .banner__caption-carousel { background: none; width: 50%; padding: 1.75rem; color: #ffffff; position: absolute; top: 50%; left: 0; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } } @media (min-width: 1024px) and (max-width: 1279px) { .banner__caption-carousel h3 { font-size: 2.625em; } } @media (max-width: 639px) { .carousel-indicators { display: none; } .carousel-inner { height: 440px; } } /* Amendments to Bootstrap Carousel CSS to include background on text 12.01.16 */ .banner__caption h3 span { display: inline-block; } h2.alt span { line-height: 1.6; padding: 2px 5px 2px 2px; } @media (max-width: 767px) { .banner__caption h3 span { background: none; color: #58595b; } h2.alt span { background: none; } } /*--Full Width CSS for Carousel Option--*/ .inner-bs-carousel-full { max-width: 100%; margin-left: auto; margin-right: auto; } @media (min-width: 1280px) and (max-width: 1365px) { .inner-bs-carousel-full .banner__caption-carousel { margin-left: 6rem; } } @media (min-width: 1366px) and (max-width: 1460px) { .inner-bs-carousel-full .banner__caption-carousel { margin-left: 10rem; } } @media (min-width: 1461px) and (max-width: 1530px) { .inner-bs-carousel-full .banner__caption-carousel { margin-left: 12rem; } } @media (min-width: 1531px) and (max-width: 1620px) { .inner-bs-carousel-full .banner__caption-carousel { margin-left: 14rem; } } @media (min-width: 1621px) and (max-width: 1660px) { .inner-bs-carousel-full .banner__caption-carousel { margin-left: 17rem; } } @media (min-width: 1661px) and (max-width: 1760px) { .inner-bs-carousel-full .banner__caption-carousel { margin-left: 20rem; } } @media (min-width: 1761px) and (max-width: 1800px) { .inner-bs-carousel-full .banner__caption-carousel { margin-left: 22rem; } } @media (min-width: 1801px) and (max-width: 1890px) { .inner-bs-carousel-full .banner__caption-carousel { margin-left: 24rem; } } @media (min-width: 1891px) and (max-width: 1930px) { .inner-bs-carousel-full .banner__caption-carousel { margin-left: 26rem; } } @media (min-width: 1931px) and (max-width: 1990px) { .inner-bs-carousel-full .banner__caption-carousel { margin-left: 28rem; } } @media (min-width: 1991px) { .inner-bs-carousel-full .banner__caption-carousel { margin-left: 30rem; } } /*--Bounded CSS for Carousel Option--*/ .inner-bs-carousel { max-width: 90rem; margin-left: auto; margin-right: auto; } /* qub / content-types / general-content */ /*DTP - General Content Padding Update*/ .panel .inner-gc { padding: 2rem 1.75rem 1rem 1.75rem; background-color: #ffffff; max-width: 90rem; margin-left: auto; margin-right: auto; } .inner-gc hr { margin: 2rem 0 0 0; border: 1px solid #dedede; } /**all new**/ .slick-dots { position: absolute; bottom: 3rem; right: 3rem; } .slick-dots li { display: inline; } .slick-dots button { background: #fff; padding: 8px; margin-left: 5px; color: #fff; border: none; border-radius: 3px; font-size: 0; } .slick-active button { background: #d6000d; } .carousel-news-item .img-block p:last-child a.button:first-child:last-child:after { content: ''; position: relative; vertical-align: middle; display: inline-block; width: 0.375rem; height: 0.6875rem; margin-left: 1rem; background: url('/home/media/Media,517689,en.png') right center no-repeat; } .carousel-news-item .img-block p:last-child a.button:first-child:last-child:hover::after { content: ''; position: relative; vertical-align: middle; display: inline-block; width: 0.375rem; height: 0.6875rem; margin-left: 1rem; background: url('/home/media/Media,596846,en.png') right center no-repeat; } /* qub / content-types / news-story */ /* DTP - News Story (html)*/ .news-listing .colspan-8 { padding: 1rem 1.75rem; } .news-listing h3 { font-size: 1.5rem; } /* DTP - News Story (fulltext)*/ article .news-author img { float: left; width: 100px !important; height: 100px !important; margin-right: 1rem; } .news-story-text { margin-bottom: 1rem; } .news-story-text blockquote { background: #eeeeee; padding: 1rem; color: inherit; } /* DTP - News Story (carousel)*/ .carousel-news h3 { font-size: 1.5rem; } /*article (news images) images not resizing vertically from media library*/ article img { height: auto !important; } /* qub / content-types / one-horz-flip */ /*allow ability to "flip" one horz template*/ @media (min-width: 1024px) { .img-block.horz.flip .column:nth-child(4n + 1) { float: left; left: 0; } .img-block.horz.flip .column:nth-child(odd) > div:first-child:before { border-width: 0 6px 0 0; } .img-block.horz.flip .column:nth-child(4n + 1) .img-arrow { right: 0; left: auto; } .img-block.horz.flip .column:nth-child(odd) .img-arrow:after { left: 0.375rem; } } /* qub / content-types / student-quote */ /* Student Quote Template */ .student-quote blockquote { margin: 50px 0 20px 0; } .student-quote cite { margin-bottom: 20px; } /* qub / pages / course finder */ body.course-finder .cta-compare, body.course-finder .cta-course { position: relative; display: block; text-align: right; white-space: nowrap; } body.course-finder .cta-compare:after, body.course-finder .cta-course:after { content: ''; display: inline-block; vertical-align: middle; width: 0.9375em; height: 0.9375em; margin-left: 1.25em; background-position: right center; background-repeat: no-repeat; -webkit-transition: all 0.3s; transition: all 0.3s; } body.course-finder .cta-compare { color: #58595b; } body.course-finder .cta-compare:after { background-image: url('/home/media/Media,512561,en.png'); /* images/icons/cta-compare.png */ } body.course-finder .cta-course:after { background-image: url('/home/media/Media,512562,en.png'); /* images/icons/cta-course.png */ } body.course-finder tr.active .cta-compare:after { -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); } body.course-finder .results .toggle .toggle__content { padding: 0; margin: 0 -1.75rem; } body.course-finder .compare .inner { padding-top: 0; padding-bottom: 0; } body.course-finder .compare .column { height: auto !important; } body.course-finder .compare .bordered .column { padding-top: 0; padding-bottom: 0; } body.course-finder .compare table, body.course-finder .compare thead th { background: transparent; } body.course-finder .compare th, body.course-finder .compare td { padding-right: 0; padding-left: 0; } body.course-finder .compare .toggle header { background: #9b9b9d; margin: 0 -1.75rem; } body.course-finder .compare .toggle.open header { background: #58595b; } body.course-finder .compare .toggle.open .toggle__content { max-height: 23rem; } body.course-finder .compare .compare__course { position: relative; padding-right: 2rem; text-transform: none; } body.course-finder .compare .compare__course .cta-remove { position: absolute; top: 50%; right: 0; display: block; width: 1.5rem; height: 1.5rem; margin-top: -0.75rem; background-image: url('/home/media/Media,513657,en.png'); /* images/icons/cta-remove.png */ } @media (max-width: 1023px) { .results th, .results td { padding-left: 0.875rem; padding-right: 0.875rem; } } @media (max-width: 767px) { .results table, .results tbody, .results tr { display: block; } .results thead { display: none; } .results tr { padding: 1.75rem; overflow: auto; border-bottom: 1px solid #dedede; } .results th, .results td { display: inline-block; padding: 0; border: 0; } .results th { display: block; padding-bottom: 0; } .results td { float: left; display: block; padding: 0; } .results td:nth-of-type(1):after, .results td:nth-of-type(2):after { content: '/'; margin: 0 0.5em; } .results td:nth-last-child(2) { clear: left; } .results td:nth-last-child(2), .results td:last-child { width: 50%; margin-top: 1rem; } .results td .cta-compare { text-align: left; } .results td .cta-course { padding-right: 0; } .lt-ie10 th, .lt-ie10 td { padding: 1.625em 0.875rem; } }