/*** * Including file: fonts */ /* vietnamese */ @font-face { font-family: 'Questrial'; font-style: normal; font-weight: 400; font-display: swap; src: url(https://m-booksystems.co.uk/app/Apps_font/v/8160903bd2fa777dc679a56dd49cf180/font/questrial) format('woff2'); unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB; } /* latin-ext */ @font-face { font-family: 'Questrial'; font-style: normal; font-weight: 400; font-display: swap; src: url(https://m-booksystems.co.uk/app/Apps_font/v/e52b6e33fa73675f0c4439a70af9d8c6/font/questrial2) format('woff2'); unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF; } /* latin */ @font-face { font-family: 'Questrial'; font-style: normal; font-weight: 400; font-display: swap; src: url(https://m-booksystems.co.uk/app/Apps_font/v/ec8f98c1584130fc0ef922a640e36345/font/questrial3) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } /* Nunito font */ /* cyrillic-ext */ @font-face { font-family: 'Nunito'; font-style: italic; font-weight: 400; font-display: swap; src: url(https://m-booksystems.co.uk/app/Apps_font/v/4ffcfd8e3af877d69161d8e09bc39252/font/nunito) format('woff2'); unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F; } /* cyrillic */ @font-face { font-family: 'Nunito'; font-style: italic; font-weight: 400; font-display: swap; src: url(https://m-booksystems.co.uk/app/Apps_font/v/4ffcfd8e3af877d69161d8e09bc39252/font/nunito) format('woff2'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; } /* vietnamese */ @font-face { font-family: 'Nunito'; font-style: italic; font-weight: 400; font-display: swap; src: url(https://m-booksystems.co.uk/app/Apps_font/v/4ffcfd8e3af877d69161d8e09bc39252/font/nunito) format('woff2'); unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB; } /* latin-ext */ @font-face { font-family: 'Nunito'; font-style: italic; font-weight: 400; font-display: swap; src: url(https://m-booksystems.co.uk/app/Apps_font/v/4ffcfd8e3af877d69161d8e09bc39252/font/nunito) format('woff2'); unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; } /* latin */ @font-face { font-family: 'Nunito'; font-style: italic; font-weight: 400; font-display: swap; src: url(https://m-booksystems.co.uk/app/Apps_font/v/4ffcfd8e3af877d69161d8e09bc39252/font/nunito) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } /* cyrillic-ext */ @font-face { font-family: 'Nunito'; font-style: normal; font-weight: 400; font-display: swap; src: url(https://m-booksystems.co.uk/app/Apps_font/v/4ffcfd8e3af877d69161d8e09bc39252/font/nunito) format('woff2'); unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F; } /* cyrillic */ @font-face { font-family: 'Nunito'; font-style: normal; font-weight: 400; font-display: swap; src: url(https://m-booksystems.co.uk/app/Apps_font/v/4ffcfd8e3af877d69161d8e09bc39252/font/nunito) format('woff2'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; } /* vietnamese */ @font-face { font-family: 'Nunito'; font-style: normal; font-weight: 400; font-display: swap; src: url(https://m-booksystems.co.uk/app/Apps_font/v/4ffcfd8e3af877d69161d8e09bc39252/font/nunito) format('woff2'); unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB; } /* latin-ext */ @font-face { font-family: 'Nunito'; font-style: normal; font-weight: 400; font-display: swap; src: url(https://m-booksystems.co.uk/app/Apps_font/v/4ffcfd8e3af877d69161d8e09bc39252/font/nunito) format('woff2'); unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; } /* latin */ @font-face { font-family: 'Nunito'; font-style: normal; font-weight: 400; font-display: swap; src: url(https://m-booksystems.co.uk/app/Apps_font/v/4ffcfd8e3af877d69161d8e09bc39252/font/nunito) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } /* JOST */ /* cyrillic */ @font-face { font-family: 'Jost'; font-style: italic; font-weight: 100 900; font-display: swap; src: url(https://m-booksystems.co.uk/app/Apps_font/v/8422dda90069534e16cf74000a8f815a/font/jost) format('woff2'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; } /* latin-ext */ @font-face { font-family: 'Jost'; font-style: italic; font-weight: 100 900; font-display: swap; src: url(https://m-booksystems.co.uk/app/Apps_font/v/8422dda90069534e16cf74000a8f815a/font/jost) format('woff2'); unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; } /* latin */ @font-face { font-family: 'Jost'; font-style: italic; font-weight: 100 900; font-display: swap; src: url(https://m-booksystems.co.uk/app/Apps_font/v/8422dda90069534e16cf74000a8f815a/font/jost) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } /* cyrillic */ @font-face { font-family: 'Jost'; font-style: normal; font-weight: 100 900; font-display: swap; src: url(https://m-booksystems.co.uk/app/Apps_font/v/8422dda90069534e16cf74000a8f815a/font/jost) format('woff2'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; } /* latin-ext */ @font-face { font-family: 'Jost'; font-style: normal; font-weight: 100 900; font-display: swap; src: url(https://m-booksystems.co.uk/app/Apps_font/v/8422dda90069534e16cf74000a8f815a/font/jost) format('woff2'); unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; } /* latin */ @font-face { font-family: 'Jost'; font-style: normal; font-weight: 100 900; font-display: swap; src: url(https://m-booksystems.co.uk/app/Apps_font/v/8422dda90069534e16cf74000a8f815a/font/jost) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } /****** Montserrat */ /* cyrillic-ext */ @font-face { font-family: 'Montserrat'; font-style: italic; font-weight: 100 900; font-display: swap; src: url(https://m-booksystems.co.uk/app/Apps_font/v/f164580c6b43b272a0e3ddbf361db886/font/montserrat) format('woff2'); unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F; } /* cyrillic */ @font-face { font-family: 'Montserrat'; font-style: italic; font-weight: 100 900; font-display: swap; src: url(https://m-booksystems.co.uk/app/Apps_font/v/f164580c6b43b272a0e3ddbf361db886/font/montserrat) format('woff2'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; } /* vietnamese */ @font-face { font-family: 'Montserrat'; font-style: italic; font-weight: 100 900; font-display: swap; src: url(https://m-booksystems.co.uk/app/Apps_font/v/f164580c6b43b272a0e3ddbf361db886/font/montserrat) format('woff2'); unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB; } /* latin-ext */ @font-face { font-family: 'Montserrat'; font-style: italic; font-weight: 100 900; font-display: swap; src: url(https://m-booksystems.co.uk/app/Apps_font/v/f164580c6b43b272a0e3ddbf361db886/font/montserrat) format('woff2'); unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; } /* latin */ @font-face { font-family: 'Montserrat'; font-style: italic; font-weight: 100 900; font-display: swap; src: url(https://m-booksystems.co.uk/app/Apps_font/v/f164580c6b43b272a0e3ddbf361db886/font/montserrat) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } /* cyrillic-ext */ @font-face { font-family: 'Montserrat'; font-style: normal; font-weight: 100 900; font-display: swap; src: url(https://m-booksystems.co.uk/app/Apps_font/v/f164580c6b43b272a0e3ddbf361db886/font/montserrat) format('woff2'); unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F; } /* cyrillic */ @font-face { font-family: 'Montserrat'; font-style: normal; font-weight: 100 900; font-display: swap; src: url(https://m-booksystems.co.uk/app/Apps_font/v/f164580c6b43b272a0e3ddbf361db886/font/montserrat) format('woff2'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; } /* vietnamese */ @font-face { font-family: 'Montserrat'; font-style: normal; font-weight: 100 900; font-display: swap; src: url(https://m-booksystems.co.uk/app/Apps_font/v/f164580c6b43b272a0e3ddbf361db886/font/montserrat) format('woff2'); unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB; } /* latin-ext */ @font-face { font-family: 'Montserrat'; font-style: normal; font-weight: 100 900; font-display: swap; src: url(https://m-booksystems.co.uk/app/Apps_font/v/f164580c6b43b272a0e3ddbf361db886/font/montserrat) format('woff2'); unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; } /* latin */ @font-face { font-family: 'Montserrat'; font-style: normal; font-weight: 100 900; font-display: swap; src: url(https://m-booksystems.co.uk/app/Apps_font/v/f164580c6b43b272a0e3ddbf361db886/font/montserrat) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } /* End of include: fonts */ /*** * Including file: jqueryui */ /*! jQuery UI - v1.13.2 - 2023-03-07 * http://jqueryui.com * Includes: draggable.css, core.css, resizable.css, selectable.css, sortable.css, accordion.css, autocomplete.css, menu.css, button.css, controlgroup.css, checkboxradio.css, datepicker.css, dialog.css, progressbar.css, selectmenu.css, slider.css, spinner.css, tabs.css, tooltip.css, theme.css * To view and modify this theme, visit http://jqueryui.com/themeroller/?scope=&folderName=custom-theme&bgImgOpacityError=&bgImgOpacityHighlight=&bgImgOpacityActive=&bgImgOpacityHover=&bgImgOpacityDefault=&bgImgOpacityContent=&bgImgOpacityHeader=&cornerRadiusShadow=8px&offsetLeftShadow=0px&offsetTopShadow=0px&thicknessShadow=5px&opacityShadow=30&bgImgOpacityShadow=0&bgTextureShadow=flat&bgColorShadow=%23123481&opacityOverlay=30&bgImgOpacityOverlay=0&bgTextureOverlay=flat&bgColorOverlay=%23123480&iconColorError=%23123479&fcError=%23123478&borderColorError=%23123477&bgTextureError=flat&bgColorError=%23123476&iconColorHighlight=%23123475&fcHighlight=%23123474&borderColorHighlight=%23123473&bgTextureHighlight=flat&bgColorHighlight=%23123472&iconColorActive=%23123471&fcActive=%23123470&borderColorActive=%23123469&bgTextureActive=flat&bgColorActive=%23123468&iconColorHover=%23123467&fcHover=%23123466&borderColorHover=%23123465&bgTextureHover=flat&bgColorHover=%23123464&iconColorDefault=%23123463&fcDefault=%23123462&borderColorDefault=%23123461&bgTextureDefault=flat&bgColorDefault=%23123460&iconColorContent=%23123459&fcContent=%23123458&borderColorContent=%23123456&bgTextureContent=flat&bgColorContent=%23123455&iconColorHeader=%23123454&fcHeader=%23123453&borderColorHeader=%23123452&bgTextureHeader=flat&bgColorHeader=%23123451&cornerRadius=0&fwDefault=normal&fsDefault=1em&ffDefault=Arial%2CHelvetica%2Csans-serif * Copyright jQuery Foundation and other contributors; Licensed MIT */ .ui-draggable-handle { -ms-touch-action: none; touch-action: none; } /* Layout helpers ----------------------------------*/ .ui-helper-hidden { display: none; } .ui-helper-hidden-accessible { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; } .ui-helper-reset { margin: 0; padding: 0; border: 0; outline: 0; line-height: 1.3; text-decoration: none; font-size: 100%; list-style: none; } .ui-helper-clearfix:before, .ui-helper-clearfix:after { content: ""; display: table; border-collapse: collapse; } .ui-helper-clearfix:after { clear: both; } .ui-helper-zfix { width: 100%; height: 100%; top: 0; left: 0; position: absolute; opacity: 0; -ms-filter: "alpha(opacity=0)"; /* support: IE8 */ } .ui-front { z-index: 100; } /* Interaction Cues ----------------------------------*/ .ui-state-disabled { cursor: default !important; pointer-events: none; } /* Icons ----------------------------------*/ .ui-icon { display: inline-block; vertical-align: middle; margin-top: -.25em; position: relative; text-indent: -99999px; overflow: hidden; background-repeat: no-repeat; } .ui-widget-icon-block { left: 50%; margin-left: -8px; display: block; } /* Misc visuals ----------------------------------*/ /* Overlays */ .ui-widget-overlay { position: fixed; top: 0; left: 0; width: 100%; height: 100%; } .ui-resizable { position: relative; } .ui-resizable-handle { position: absolute; font-size: 0.1px; display: block; -ms-touch-action: none; touch-action: none; } .ui-resizable-disabled .ui-resizable-handle, .ui-resizable-autohide .ui-resizable-handle { display: none; } .ui-resizable-n { cursor: n-resize; height: 7px; width: 100%; top: -5px; left: 0; } .ui-resizable-s { cursor: s-resize; height: 7px; width: 100%; bottom: -5px; left: 0; } .ui-resizable-e { cursor: e-resize; width: 7px; right: -5px; top: 0; height: 100%; } .ui-resizable-w { cursor: w-resize; width: 7px; left: -5px; top: 0; height: 100%; } .ui-resizable-se { cursor: se-resize; width: 12px; height: 12px; right: 1px; bottom: 1px; } .ui-resizable-sw { cursor: sw-resize; width: 9px; height: 9px; left: -5px; bottom: -5px; } .ui-resizable-nw { cursor: nw-resize; width: 9px; height: 9px; left: -5px; top: -5px; } .ui-resizable-ne { cursor: ne-resize; width: 9px; height: 9px; right: -5px; top: -5px; } .ui-selectable { -ms-touch-action: none; touch-action: none; } .ui-selectable-helper { position: absolute; z-index: 100; border: 1px dotted black; } .ui-sortable-handle { -ms-touch-action: none; touch-action: none; } .ui-accordion .ui-accordion-header { display: block; cursor: pointer; position: relative; margin: 2px 0 0 0; padding: .5em .5em .5em .7em; font-size: 100%; } .ui-accordion .ui-accordion-content { padding: 1em 2.2em; border-top: 0; overflow: auto; } .ui-autocomplete { position: absolute; top: 0; left: 0; cursor: default; } .ui-menu { list-style: none; padding: 0; margin: 0; display: block; outline: 0; } .ui-menu .ui-menu { position: absolute; } .ui-menu .ui-menu-item { margin: 0; cursor: pointer; /* support: IE10, see #8844 */ list-style-image: url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7"); } .ui-menu .ui-menu-item-wrapper { position: relative; padding: 3px 1em 3px .4em; } .ui-menu .ui-menu-divider { margin: 5px 0; height: 0; font-size: 0; line-height: 0; border-width: 1px 0 0 0; } .ui-menu .ui-state-focus, .ui-menu .ui-state-active { margin: -1px; } /* icon support */ .ui-menu-icons { position: relative; } .ui-menu-icons .ui-menu-item-wrapper { padding-left: 2em; } /* left-aligned */ .ui-menu .ui-icon { position: absolute; top: 0; bottom: 0; left: .2em; margin: auto 0; } /* right-aligned */ .ui-menu .ui-menu-icon { left: auto; right: 0; } .ui-button { padding: .4em 1em; display: inline-block; position: relative; line-height: normal; margin-right: .1em; cursor: pointer; vertical-align: middle; text-align: center; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; /* Support: IE <= 11 */ overflow: visible; } .ui-button, .ui-button:link, .ui-button:visited, .ui-button:hover, .ui-button:active { text-decoration: none; } /* to make room for the icon, a width needs to be set here */ .ui-button-icon-only { width: 2em; box-sizing: border-box; text-indent: -9999px; white-space: nowrap; } /* no icon support for input elements */ input.ui-button.ui-button-icon-only { text-indent: 0; } /* button icon element(s) */ .ui-button-icon-only .ui-icon { position: absolute; top: 50%; left: 50%; margin-top: -8px; margin-left: -8px; } .ui-button.ui-icon-notext .ui-icon { padding: 0; width: 2.1em; height: 2.1em; text-indent: -9999px; white-space: nowrap; } input.ui-button.ui-icon-notext .ui-icon { width: auto; height: auto; text-indent: 0; white-space: normal; padding: .4em 1em; } /* workarounds */ /* Support: Firefox 5 - 40 */ input.ui-button::-moz-focus-inner, button.ui-button::-moz-focus-inner { border: 0; padding: 0; } .ui-controlgroup { vertical-align: middle; display: inline-block; } .ui-controlgroup > .ui-controlgroup-item { float: left; margin-left: 0; margin-right: 0; } .ui-controlgroup > .ui-controlgroup-item:focus, .ui-controlgroup > .ui-controlgroup-item.ui-visual-focus { z-index: 9999; } .ui-controlgroup-vertical > .ui-controlgroup-item { display: block; float: none; width: 100%; margin-top: 0; margin-bottom: 0; text-align: left; } .ui-controlgroup-vertical .ui-controlgroup-item { box-sizing: border-box; } .ui-controlgroup .ui-controlgroup-label { padding: .4em 1em; } .ui-controlgroup .ui-controlgroup-label span { font-size: 80%; } .ui-controlgroup-horizontal .ui-controlgroup-label + .ui-controlgroup-item { border-left: none; } .ui-controlgroup-vertical .ui-controlgroup-label + .ui-controlgroup-item { border-top: none; } .ui-controlgroup-horizontal .ui-controlgroup-label.ui-widget-content { border-right: none; } .ui-controlgroup-vertical .ui-controlgroup-label.ui-widget-content { border-bottom: none; } /* Spinner specific style fixes */ .ui-controlgroup-vertical .ui-spinner-input { /* Support: IE8 only, Android < 4.4 only */ width: 75%; width: calc( 100% - 2.4em ); } .ui-controlgroup-vertical .ui-spinner .ui-spinner-up { border-top-style: solid; } .ui-checkboxradio-label .ui-icon-background { box-shadow: inset 1px 1px 1px #ccc; border-radius: .12em; border: none; } .ui-checkboxradio-radio-label .ui-icon-background { width: 16px; height: 16px; border-radius: 1em; overflow: visible; border: none; } .ui-checkboxradio-radio-label.ui-checkboxradio-checked .ui-icon, .ui-checkboxradio-radio-label.ui-checkboxradio-checked:hover .ui-icon { background-image: none; width: 8px; height: 8px; border-width: 4px; border-style: solid; } .ui-checkboxradio-disabled { pointer-events: none; } .ui-datepicker { width: 17em; padding: .2em .2em 0; display: none; } .ui-datepicker .ui-datepicker-header { position: relative; padding: .2em 0; } .ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-next { position: absolute; top: 2px; width: 1.8em; height: 1.8em; } .ui-datepicker .ui-datepicker-prev-hover, .ui-datepicker .ui-datepicker-next-hover { top: 1px; } .ui-datepicker .ui-datepicker-prev { left: 2px; } .ui-datepicker .ui-datepicker-next { right: 2px; } .ui-datepicker .ui-datepicker-prev-hover { left: 1px; } .ui-datepicker .ui-datepicker-next-hover { right: 1px; } .ui-datepicker .ui-datepicker-prev span, .ui-datepicker .ui-datepicker-next span { display: block; position: absolute; left: 50%; margin-left: -8px; top: 50%; margin-top: -8px; } .ui-datepicker .ui-datepicker-title { margin: 0 2.3em; line-height: 1.8em; text-align: center; } .ui-datepicker .ui-datepicker-title select { font-size: 1em; margin: 1px 0; } .ui-datepicker select.ui-datepicker-month, .ui-datepicker select.ui-datepicker-year { width: 45%; } .ui-datepicker table { width: 100%; font-size: .9em; border-collapse: collapse; margin: 0 0 .4em; } .ui-datepicker th { padding: .7em .3em; text-align: center; font-weight: bold; border: 0; } .ui-datepicker td { border: 0; padding: 1px; } .ui-datepicker td span, .ui-datepicker td a { display: block; padding: .2em; text-align: right; text-decoration: none; } .ui-datepicker .ui-datepicker-buttonpane { background-image: none; margin: .7em 0 0 0; padding: 0 .2em; border-left: 0; border-right: 0; border-bottom: 0; } .ui-datepicker .ui-datepicker-buttonpane button { float: right; margin: .5em .2em .4em; cursor: pointer; padding: .2em .6em .3em .6em; width: auto; overflow: visible; } .ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current { float: left; } /* with multiple calendars */ .ui-datepicker.ui-datepicker-multi { width: auto; } .ui-datepicker-multi .ui-datepicker-group { float: left; } .ui-datepicker-multi .ui-datepicker-group table { width: 95%; margin: 0 auto .4em; } .ui-datepicker-multi-2 .ui-datepicker-group { width: 50%; } .ui-datepicker-multi-3 .ui-datepicker-group { width: 33.3%; } .ui-datepicker-multi-4 .ui-datepicker-group { width: 25%; } .ui-datepicker-multi .ui-datepicker-group-last .ui-datepicker-header, .ui-datepicker-multi .ui-datepicker-group-middle .ui-datepicker-header { border-left-width: 0; } .ui-datepicker-multi .ui-datepicker-buttonpane { clear: left; } .ui-datepicker-row-break { clear: both; width: 100%; font-size: 0; } /* RTL support */ .ui-datepicker-rtl { direction: rtl; } .ui-datepicker-rtl .ui-datepicker-prev { right: 2px; left: auto; } .ui-datepicker-rtl .ui-datepicker-next { left: 2px; right: auto; } .ui-datepicker-rtl .ui-datepicker-prev:hover { right: 1px; left: auto; } .ui-datepicker-rtl .ui-datepicker-next:hover { left: 1px; right: auto; } .ui-datepicker-rtl .ui-datepicker-buttonpane { clear: right; } .ui-datepicker-rtl .ui-datepicker-buttonpane button { float: left; } .ui-datepicker-rtl .ui-datepicker-buttonpane button.ui-datepicker-current, .ui-datepicker-rtl .ui-datepicker-group { float: right; } .ui-datepicker-rtl .ui-datepicker-group-last .ui-datepicker-header, .ui-datepicker-rtl .ui-datepicker-group-middle .ui-datepicker-header { border-right-width: 0; border-left-width: 1px; } /* Icons */ .ui-datepicker .ui-icon { display: block; text-indent: -99999px; overflow: hidden; background-repeat: no-repeat; left: .5em; top: .3em; } .ui-dialog { position: absolute; top: 0; left: 0; padding: .2em; outline: 0; } .ui-dialog .ui-dialog-titlebar { padding: .4em 1em; position: relative; } .ui-dialog .ui-dialog-title { float: left; margin: .1em 0; white-space: nowrap; width: 90%; overflow: hidden; text-overflow: ellipsis; } .ui-dialog .ui-dialog-titlebar-close { position: absolute; right: .3em; top: 50%; width: 20px; margin: -10px 0 0 0; padding: 1px; height: 20px; } .ui-dialog .ui-dialog-content { position: relative; border: 0; padding: .5em 1em; background: none; overflow: auto; } .ui-dialog .ui-dialog-buttonpane { text-align: left; border-width: 1px 0 0 0; background-image: none; margin-top: .5em; padding: .3em 1em .5em .4em; } .ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset { float: right; } .ui-dialog .ui-dialog-buttonpane button { margin: .5em .4em .5em 0; cursor: pointer; } .ui-dialog .ui-resizable-n { height: 2px; top: 0; } .ui-dialog .ui-resizable-e { width: 2px; right: 0; } .ui-dialog .ui-resizable-s { height: 2px; bottom: 0; } .ui-dialog .ui-resizable-w { width: 2px; left: 0; } .ui-dialog .ui-resizable-se, .ui-dialog .ui-resizable-sw, .ui-dialog .ui-resizable-ne, .ui-dialog .ui-resizable-nw { width: 7px; height: 7px; } .ui-dialog .ui-resizable-se { right: 0; bottom: 0; } .ui-dialog .ui-resizable-sw { left: 0; bottom: 0; } .ui-dialog .ui-resizable-ne { right: 0; top: 0; } .ui-dialog .ui-resizable-nw { left: 0; top: 0; } .ui-draggable .ui-dialog-titlebar { cursor: move; } .ui-progressbar { height: 2em; text-align: left; overflow: hidden; } .ui-progressbar .ui-progressbar-value { margin: -1px; height: 100%; } .ui-progressbar .ui-progressbar-overlay { background: url("data:image/gif;base64,R0lGODlhKAAoAIABAAAAAP///yH/C05FVFNDQVBFMi4wAwEAAAAh+QQJAQABACwAAAAAKAAoAAACkYwNqXrdC52DS06a7MFZI+4FHBCKoDeWKXqymPqGqxvJrXZbMx7Ttc+w9XgU2FB3lOyQRWET2IFGiU9m1frDVpxZZc6bfHwv4c1YXP6k1Vdy292Fb6UkuvFtXpvWSzA+HycXJHUXiGYIiMg2R6W459gnWGfHNdjIqDWVqemH2ekpObkpOlppWUqZiqr6edqqWQAAIfkECQEAAQAsAAAAACgAKAAAApSMgZnGfaqcg1E2uuzDmmHUBR8Qil95hiPKqWn3aqtLsS18y7G1SzNeowWBENtQd+T1JktP05nzPTdJZlR6vUxNWWjV+vUWhWNkWFwxl9VpZRedYcflIOLafaa28XdsH/ynlcc1uPVDZxQIR0K25+cICCmoqCe5mGhZOfeYSUh5yJcJyrkZWWpaR8doJ2o4NYq62lAAACH5BAkBAAEALAAAAAAoACgAAAKVDI4Yy22ZnINRNqosw0Bv7i1gyHUkFj7oSaWlu3ovC8GxNso5fluz3qLVhBVeT/Lz7ZTHyxL5dDalQWPVOsQWtRnuwXaFTj9jVVh8pma9JjZ4zYSj5ZOyma7uuolffh+IR5aW97cHuBUXKGKXlKjn+DiHWMcYJah4N0lYCMlJOXipGRr5qdgoSTrqWSq6WFl2ypoaUAAAIfkECQEAAQAsAAAAACgAKAAAApaEb6HLgd/iO7FNWtcFWe+ufODGjRfoiJ2akShbueb0wtI50zm02pbvwfWEMWBQ1zKGlLIhskiEPm9R6vRXxV4ZzWT2yHOGpWMyorblKlNp8HmHEb/lCXjcW7bmtXP8Xt229OVWR1fod2eWqNfHuMjXCPkIGNileOiImVmCOEmoSfn3yXlJWmoHGhqp6ilYuWYpmTqKUgAAIfkECQEAAQAsAAAAACgAKAAAApiEH6kb58biQ3FNWtMFWW3eNVcojuFGfqnZqSebuS06w5V80/X02pKe8zFwP6EFWOT1lDFk8rGERh1TTNOocQ61Hm4Xm2VexUHpzjymViHrFbiELsefVrn6XKfnt2Q9G/+Xdie499XHd2g4h7ioOGhXGJboGAnXSBnoBwKYyfioubZJ2Hn0RuRZaflZOil56Zp6iioKSXpUAAAh+QQJAQABACwAAAAAKAAoAAACkoQRqRvnxuI7kU1a1UU5bd5tnSeOZXhmn5lWK3qNTWvRdQxP8qvaC+/yaYQzXO7BMvaUEmJRd3TsiMAgswmNYrSgZdYrTX6tSHGZO73ezuAw2uxuQ+BbeZfMxsexY35+/Qe4J1inV0g4x3WHuMhIl2jXOKT2Q+VU5fgoSUI52VfZyfkJGkha6jmY+aaYdirq+lQAACH5BAkBAAEALAAAAAAoACgAAAKWBIKpYe0L3YNKToqswUlvznigd4wiR4KhZrKt9Upqip61i9E3vMvxRdHlbEFiEXfk9YARYxOZZD6VQ2pUunBmtRXo1Lf8hMVVcNl8JafV38aM2/Fu5V16Bn63r6xt97j09+MXSFi4BniGFae3hzbH9+hYBzkpuUh5aZmHuanZOZgIuvbGiNeomCnaxxap2upaCZsq+1kAACH5BAkBAAEALAAAAAAoACgAAAKXjI8By5zf4kOxTVrXNVlv1X0d8IGZGKLnNpYtm8Lr9cqVeuOSvfOW79D9aDHizNhDJidFZhNydEahOaDH6nomtJjp1tutKoNWkvA6JqfRVLHU/QUfau9l2x7G54d1fl995xcIGAdXqMfBNadoYrhH+Mg2KBlpVpbluCiXmMnZ2Sh4GBqJ+ckIOqqJ6LmKSllZmsoq6wpQAAAh+QQJAQABACwAAAAAKAAoAAAClYx/oLvoxuJDkU1a1YUZbJ59nSd2ZXhWqbRa2/gF8Gu2DY3iqs7yrq+xBYEkYvFSM8aSSObE+ZgRl1BHFZNr7pRCavZ5BW2142hY3AN/zWtsmf12p9XxxFl2lpLn1rseztfXZjdIWIf2s5dItwjYKBgo9yg5pHgzJXTEeGlZuenpyPmpGQoKOWkYmSpaSnqKileI2FAAACH5BAkBAAEALAAAAAAoACgAAAKVjB+gu+jG4kORTVrVhRlsnn2dJ3ZleFaptFrb+CXmO9OozeL5VfP99HvAWhpiUdcwkpBH3825AwYdU8xTqlLGhtCosArKMpvfa1mMRae9VvWZfeB2XfPkeLmm18lUcBj+p5dnN8jXZ3YIGEhYuOUn45aoCDkp16hl5IjYJvjWKcnoGQpqyPlpOhr3aElaqrq56Bq7VAAAOw=="); height: 100%; -ms-filter: "alpha(opacity=25)"; /* support: IE8 */ opacity: 0.25; } .ui-progressbar-indeterminate .ui-progressbar-value { background-image: none; } .ui-selectmenu-menu { padding: 0; margin: 0; position: absolute; top: 0; left: 0; display: none; } .ui-selectmenu-menu .ui-menu { overflow: auto; overflow-x: hidden; padding-bottom: 1px; } .ui-selectmenu-menu .ui-menu .ui-selectmenu-optgroup { font-size: 1em; font-weight: bold; line-height: 1.5; padding: 2px 0.4em; margin: 0.5em 0 0 0; height: auto; border: 0; } .ui-selectmenu-open { display: block; } .ui-selectmenu-text { display: block; margin-right: 20px; overflow: hidden; text-overflow: ellipsis; } .ui-selectmenu-button.ui-button { text-align: left; white-space: nowrap; width: 14em; } .ui-selectmenu-icon.ui-icon { float: right; margin-top: 0; } .ui-slider { position: relative; text-align: left; } .ui-slider .ui-slider-handle { position: absolute; z-index: 2; width: 1.2em; height: 1.2em; cursor: pointer; -ms-touch-action: none; touch-action: none; } .ui-slider .ui-slider-range { position: absolute; z-index: 1; font-size: .7em; display: block; border: 0; background-position: 0 0; } /* support: IE8 - See #6727 */ .ui-slider.ui-state-disabled .ui-slider-handle, .ui-slider.ui-state-disabled .ui-slider-range { filter: inherit; } .ui-slider-horizontal { height: .8em; } .ui-slider-horizontal .ui-slider-handle { top: -.3em; margin-left: -.6em; } .ui-slider-horizontal .ui-slider-range { top: 0; height: 100%; } .ui-slider-horizontal .ui-slider-range-min { left: 0; } .ui-slider-horizontal .ui-slider-range-max { right: 0; } .ui-slider-vertical { width: .8em; height: 100px; } .ui-slider-vertical .ui-slider-handle { left: -.3em; margin-left: 0; margin-bottom: -.6em; } .ui-slider-vertical .ui-slider-range { left: 0; width: 100%; } .ui-slider-vertical .ui-slider-range-min { bottom: 0; } .ui-slider-vertical .ui-slider-range-max { top: 0; } .ui-spinner { position: relative; display: inline-block; overflow: hidden; padding: 0; vertical-align: middle; } .ui-spinner-input { border: none; background: none; color: inherit; padding: .222em 0; margin: .2em 0; vertical-align: middle; margin-left: .4em; margin-right: 2em; } .ui-spinner-button { width: 1.6em; height: 50%; font-size: .5em; padding: 0; margin: 0; text-align: center; position: absolute; cursor: default; display: block; overflow: hidden; right: 0; } /* more specificity required here to override default borders */ .ui-spinner a.ui-spinner-button { border-top-style: none; border-bottom-style: none; border-right-style: none; } .ui-spinner-up { top: 0; } .ui-spinner-down { bottom: 0; } .ui-tabs { position: relative;/* position: relative prevents IE scroll bug (element with position: relative inside container with overflow: auto appear as "fixed") */ padding: .2em; } .ui-tabs .ui-tabs-nav { margin: 0; padding: .2em .2em 0; } .ui-tabs .ui-tabs-nav li { list-style: none; float: left; position: relative; top: 0; margin: 1px .2em 0 0; border-bottom-width: 0; padding: 0; white-space: nowrap; } .ui-tabs .ui-tabs-nav .ui-tabs-anchor { float: left; padding: .5em 1em; text-decoration: none; } .ui-tabs .ui-tabs-nav li.ui-tabs-active { margin-bottom: -1px; padding-bottom: 1px; } .ui-tabs .ui-tabs-nav li.ui-tabs-active .ui-tabs-anchor, .ui-tabs .ui-tabs-nav li.ui-state-disabled .ui-tabs-anchor, .ui-tabs .ui-tabs-nav li.ui-tabs-loading .ui-tabs-anchor { cursor: text; } .ui-tabs-collapsible .ui-tabs-nav li.ui-tabs-active .ui-tabs-anchor { cursor: pointer; } .ui-tabs .ui-tabs-panel { display: block; border-width: 0; padding: 1em 1.4em; background: none; } .ui-tooltip { padding: 8px; position: absolute; z-index: 9999; max-width: 300px; } body .ui-tooltip { border-width: 2px; } /* Component containers ----------------------------------*/ .ui-widget { font-family: Arial,Helvetica,sans-serif; font-size: 1em; } .ui-widget .ui-widget { font-size: 1em; } .ui-widget input, .ui-widget select, .ui-widget textarea, .ui-widget button { font-family: Arial,Helvetica,sans-serif; font-size: 1em; } .ui-widget.ui-widget-content { border: 1px solid #5D4C91; } .ui-widget-content { border: 1px solid #5D4C91; background: white; color: #110533; } .ui-widget-content a { color: #110533; } .ui-widget-header { border: 1px solid none; background: white; color: #110533; font-weight: bold; } .ui-widget-header a { color: #110533; } /* Interaction states ----------------------------------*/ .ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default, .ui-button, /* We use html here because we need a greater specificity to make sure disabled works properly when clicked or hovered */ html .ui-button.ui-state-disabled:hover, html .ui-button.ui-state-disabled:active { border: 1px solid #5D4C91; background: #FFFAE3; font-weight: normal; color: #110533; } .ui-state-default a, .ui-state-default a:link, .ui-state-default a:visited, a.ui-button, a:link.ui-button, a:visited.ui-button, .ui-button { color: #110533; text-decoration: none; } .ui-state-hover, .ui-widget-content .ui-state-hover, .ui-widget-header .ui-state-hover, .ui-state-focus, .ui-widget-content .ui-state-focus, .ui-widget-header .ui-state-focus, .ui-button:hover, .ui-button:focus { border: 1px solid #332267; background: #FFFAE3; font-weight: normal; color: #110533; } .ui-state-hover a, .ui-state-hover a:hover, .ui-state-hover a:link, .ui-state-hover a:visited, .ui-state-focus a, .ui-state-focus a:hover, .ui-state-focus a:link, .ui-state-focus a:visited, a.ui-button:hover, a.ui-button:focus { color: #110533; text-decoration: none; } .ui-visual-focus { box-shadow: 0 0 3px 1px rgb(94, 158, 214); } .ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active, a.ui-button:active, .ui-button:active, .ui-button.ui-state-active:hover { border: 1px solid #332267; background: #110533; font-weight: normal; color: #DBD5EC; } .ui-icon-background, .ui-state-active .ui-icon-background { border: #332267; background-color: #DBD5EC; } .ui-state-active a, .ui-state-active a:link, .ui-state-active a:visited { color: #DBD5EC; text-decoration: none; } /* Interaction Cues ----------------------------------*/ .ui-state-highlight, .ui-widget-content .ui-state-highlight, .ui-widget-header .ui-state-highlight { border: 1px solid #9588BD; background: #D3C062; color: #110533; } .ui-state-checked { border: 1px solid #9588BD; background: #D3C062; } .ui-state-highlight a, .ui-widget-content .ui-state-highlight a, .ui-widget-header .ui-state-highlight a { color: #110533; } .ui-state-error, .ui-widget-content .ui-state-error, .ui-widget-header .ui-state-error { border: 1px solid #123477; background: #123476; color: #123478; } .ui-state-error a, .ui-widget-content .ui-state-error a, .ui-widget-header .ui-state-error a { color: #123478; } .ui-state-error-text, .ui-widget-content .ui-state-error-text, .ui-widget-header .ui-state-error-text { color: #123478; } .ui-priority-primary, .ui-widget-content .ui-priority-primary, .ui-widget-header .ui-priority-primary { font-weight: bold; } .ui-priority-secondary, .ui-widget-content .ui-priority-secondary, .ui-widget-header .ui-priority-secondary { opacity: .7; -ms-filter: "alpha(opacity=70)"; /* support: IE8 */ font-weight: normal; } .ui-state-disabled, .ui-widget-content .ui-state-disabled, .ui-widget-header .ui-state-disabled { opacity: .35; -ms-filter: "alpha(opacity=35)"; /* support: IE8 */ background-image: none; } .ui-state-disabled .ui-icon { -ms-filter: "alpha(opacity=35)"; /* support: IE8 - See #6059 */ } /* Icons ----------------------------------*/ /* states and images */ .ui-icon { width: 16px; height: 16px; } .ui-icon, .ui-widget-content .ui-icon { background-image: url("https://m-booksystems.co.uk/app/Apps_img/v/0cc744aa801d0bad1d881a11f8b1c7d2/img/jqueryui%253Aui-icons_123459_256x240.png/repl/NONE"); } .ui-widget-header .ui-icon { background-image: url("https://m-booksystems.co.uk/app/Apps_img/v/0b1d9138ef9e599ce9edd15a49c39e92/img/jqueryui%253Aui-icons_123454_256x240.png/repl/NONE"); } .ui-state-hover .ui-icon, .ui-state-focus .ui-icon, .ui-button:hover .ui-icon, .ui-button:focus .ui-icon { background-image: url("https://m-booksystems.co.uk/app/Apps_img/v/0bf73f7fc2194980c7ffcc42d2eb1f2e/img/jqueryui%253Aui-icons_123467_256x240.png/repl/NONE"); } .ui-state-active .ui-icon, .ui-button:active .ui-icon { background-image: url("https://m-booksystems.co.uk/app/Apps_img/v/9e5a40e7cdbee8078d12ac4f878c6730/img/jqueryui%253Aui-icons_123471_256x240.png/repl/NONE"); } .ui-state-highlight .ui-icon, .ui-button .ui-state-highlight.ui-icon { background-image: url("https://m-booksystems.co.uk/app/Apps_img/v/77207a24a4d42c3e92096f536690123e/img/jqueryui%253Aui-icons_123475_256x240.png/repl/NONE"); } .ui-state-error .ui-icon, .ui-state-error-text .ui-icon { background-image: url("https://m-booksystems.co.uk/app/Apps_img/v/2fc61845fe77425e98efa9885c8d02b4/img/jqueryui%253Aui-icons_123479_256x240.png/repl/NONE"); } .ui-button .ui-icon { background-image: url("https://m-booksystems.co.uk/app/Apps_img/v/1b44e7e0ce31943489b2fdd3cd08cdf5/img/jqueryui%253Aui-icons_123463_256x240.png/repl/NONE"); } /* positioning */ /* Three classes needed to override `.ui-button:hover .ui-icon` */ .ui-icon-blank.ui-icon-blank.ui-icon-blank { background-image: none; } .ui-icon-caret-1-n { background-position: 0 0; } .ui-icon-caret-1-ne { background-position: -16px 0; } .ui-icon-caret-1-e { background-position: -32px 0; } .ui-icon-caret-1-se { background-position: -48px 0; } .ui-icon-caret-1-s { background-position: -65px 0; } .ui-icon-caret-1-sw { background-position: -80px 0; } .ui-icon-caret-1-w { background-position: -96px 0; } .ui-icon-caret-1-nw { background-position: -112px 0; } .ui-icon-caret-2-n-s { background-position: -128px 0; } .ui-icon-caret-2-e-w { background-position: -144px 0; } .ui-icon-triangle-1-n { background-position: 0 -16px; } .ui-icon-triangle-1-ne { background-position: -16px -16px; } .ui-icon-triangle-1-e { background-position: -32px -16px; } .ui-icon-triangle-1-se { background-position: -48px -16px; } .ui-icon-triangle-1-s { background-position: -65px -16px; } .ui-icon-triangle-1-sw { background-position: -80px -16px; } .ui-icon-triangle-1-w { background-position: -96px -16px; } .ui-icon-triangle-1-nw { background-position: -112px -16px; } .ui-icon-triangle-2-n-s { background-position: -128px -16px; } .ui-icon-triangle-2-e-w { background-position: -144px -16px; } .ui-icon-arrow-1-n { background-position: 0 -32px; } .ui-icon-arrow-1-ne { background-position: -16px -32px; } .ui-icon-arrow-1-e { background-position: -32px -32px; } .ui-icon-arrow-1-se { background-position: -48px -32px; } .ui-icon-arrow-1-s { background-position: -65px -32px; } .ui-icon-arrow-1-sw { background-position: -80px -32px; } .ui-icon-arrow-1-w { background-position: -96px -32px; } .ui-icon-arrow-1-nw { background-position: -112px -32px; } .ui-icon-arrow-2-n-s { background-position: -128px -32px; } .ui-icon-arrow-2-ne-sw { background-position: -144px -32px; } .ui-icon-arrow-2-e-w { background-position: -160px -32px; } .ui-icon-arrow-2-se-nw { background-position: -176px -32px; } .ui-icon-arrowstop-1-n { background-position: -192px -32px; } .ui-icon-arrowstop-1-e { background-position: -208px -32px; } .ui-icon-arrowstop-1-s { background-position: -224px -32px; } .ui-icon-arrowstop-1-w { background-position: -240px -32px; } .ui-icon-arrowthick-1-n { background-position: 1px -48px; } .ui-icon-arrowthick-1-ne { background-position: -16px -48px; } .ui-icon-arrowthick-1-e { background-position: -32px -48px; } .ui-icon-arrowthick-1-se { background-position: -48px -48px; } .ui-icon-arrowthick-1-s { background-position: -64px -48px; } .ui-icon-arrowthick-1-sw { background-position: -80px -48px; } .ui-icon-arrowthick-1-w { background-position: -96px -48px; } .ui-icon-arrowthick-1-nw { background-position: -112px -48px; } .ui-icon-arrowthick-2-n-s { background-position: -128px -48px; } .ui-icon-arrowthick-2-ne-sw { background-position: -144px -48px; } .ui-icon-arrowthick-2-e-w { background-position: -160px -48px; } .ui-icon-arrowthick-2-se-nw { background-position: -176px -48px; } .ui-icon-arrowthickstop-1-n { background-position: -192px -48px; } .ui-icon-arrowthickstop-1-e { background-position: -208px -48px; } .ui-icon-arrowthickstop-1-s { background-position: -224px -48px; } .ui-icon-arrowthickstop-1-w { background-position: -240px -48px; } .ui-icon-arrowreturnthick-1-w { background-position: 0 -64px; } .ui-icon-arrowreturnthick-1-n { background-position: -16px -64px; } .ui-icon-arrowreturnthick-1-e { background-position: -32px -64px; } .ui-icon-arrowreturnthick-1-s { background-position: -48px -64px; } .ui-icon-arrowreturn-1-w { background-position: -64px -64px; } .ui-icon-arrowreturn-1-n { background-position: -80px -64px; } .ui-icon-arrowreturn-1-e { background-position: -96px -64px; } .ui-icon-arrowreturn-1-s { background-position: -112px -64px; } .ui-icon-arrowrefresh-1-w { background-position: -128px -64px; } .ui-icon-arrowrefresh-1-n { background-position: -144px -64px; } .ui-icon-arrowrefresh-1-e { background-position: -160px -64px; } .ui-icon-arrowrefresh-1-s { background-position: -176px -64px; } .ui-icon-arrow-4 { background-position: 0 -80px; } .ui-icon-arrow-4-diag { background-position: -16px -80px; } .ui-icon-extlink { background-position: -32px -80px; } .ui-icon-newwin { background-position: -48px -80px; } .ui-icon-refresh { background-position: -64px -80px; } .ui-icon-shuffle { background-position: -80px -80px; } .ui-icon-transfer-e-w { background-position: -96px -80px; } .ui-icon-transferthick-e-w { background-position: -112px -80px; } .ui-icon-folder-collapsed { background-position: 0 -96px; } .ui-icon-folder-open { background-position: -16px -96px; } .ui-icon-document { background-position: -32px -96px; } .ui-icon-document-b { background-position: -48px -96px; } .ui-icon-note { background-position: -64px -96px; } .ui-icon-mail-closed { background-position: -80px -96px; } .ui-icon-mail-open { background-position: -96px -96px; } .ui-icon-suitcase { background-position: -112px -96px; } .ui-icon-comment { background-position: -128px -96px; } .ui-icon-person { background-position: -144px -96px; } .ui-icon-print { background-position: -160px -96px; } .ui-icon-trash { background-position: -176px -96px; } .ui-icon-locked { background-position: -192px -96px; } .ui-icon-unlocked { background-position: -208px -96px; } .ui-icon-bookmark { background-position: -224px -96px; } .ui-icon-tag { background-position: -240px -96px; } .ui-icon-home { background-position: 0 -112px; } .ui-icon-flag { background-position: -16px -112px; } .ui-icon-calendar { background-position: -32px -112px; } .ui-icon-cart { background-position: -48px -112px; } .ui-icon-pencil { background-position: -64px -112px; } .ui-icon-clock { background-position: -80px -112px; } .ui-icon-disk { background-position: -96px -112px; } .ui-icon-calculator { background-position: -112px -112px; } .ui-icon-zoomin { background-position: -128px -112px; } .ui-icon-zoomout { background-position: -144px -112px; } .ui-icon-search { background-position: -160px -112px; } .ui-icon-wrench { background-position: -176px -112px; } .ui-icon-gear { background-position: -192px -112px; } .ui-icon-heart { background-position: -208px -112px; } .ui-icon-star { background-position: -224px -112px; } .ui-icon-link { background-position: -240px -112px; } .ui-icon-cancel { background-position: 0 -128px; } .ui-icon-plus { background-position: -16px -128px; } .ui-icon-plusthick { background-position: -32px -128px; } .ui-icon-minus { background-position: -48px -128px; } .ui-icon-minusthick { background-position: -64px -128px; } .ui-icon-close { background-position: -80px -128px; } .ui-icon-closethick { background-position: -96px -128px; } .ui-icon-key { background-position: -112px -128px; } .ui-icon-lightbulb { background-position: -128px -128px; } .ui-icon-scissors { background-position: -144px -128px; } .ui-icon-clipboard { background-position: -160px -128px; } .ui-icon-copy { background-position: -176px -128px; } .ui-icon-contact { background-position: -192px -128px; } .ui-icon-image { background-position: -208px -128px; } .ui-icon-video { background-position: -224px -128px; } .ui-icon-script { background-position: -240px -128px; } .ui-icon-alert { background-position: 0 -144px; } .ui-icon-info { background-position: -16px -144px; } .ui-icon-notice { background-position: -32px -144px; } .ui-icon-help { background-position: -48px -144px; } .ui-icon-check { background-position: -64px -144px; } .ui-icon-bullet { background-position: -80px -144px; } .ui-icon-radio-on { background-position: -96px -144px; } .ui-icon-radio-off { background-position: -112px -144px; } .ui-icon-pin-w { background-position: -128px -144px; } .ui-icon-pin-s { background-position: -144px -144px; } .ui-icon-play { background-position: 0 -160px; } .ui-icon-pause { background-position: -16px -160px; } .ui-icon-seek-next { background-position: -32px -160px; } .ui-icon-seek-prev { background-position: -48px -160px; } .ui-icon-seek-end { background-position: -64px -160px; } .ui-icon-seek-start { background-position: -80px -160px; } /* ui-icon-seek-first is deprecated, use ui-icon-seek-start instead */ .ui-icon-seek-first { background-position: -80px -160px; } .ui-icon-stop { background-position: -96px -160px; } .ui-icon-eject { background-position: -112px -160px; } .ui-icon-volume-off { background-position: -128px -160px; } .ui-icon-volume-on { background-position: -144px -160px; } .ui-icon-power { background-position: 0 -176px; } .ui-icon-signal-diag { background-position: -16px -176px; } .ui-icon-signal { background-position: -32px -176px; } .ui-icon-battery-0 { background-position: -48px -176px; } .ui-icon-battery-1 { background-position: -64px -176px; } .ui-icon-battery-2 { background-position: -80px -176px; } .ui-icon-battery-3 { background-position: -96px -176px; } .ui-icon-circle-plus { background-position: 0 -192px; } .ui-icon-circle-minus { background-position: -16px -192px; } .ui-icon-circle-close { background-position: -32px -192px; } .ui-icon-circle-triangle-e { background-position: -48px -192px; } .ui-icon-circle-triangle-s { background-position: -64px -192px; } .ui-icon-circle-triangle-w { background-position: -80px -192px; } .ui-icon-circle-triangle-n { background-position: -96px -192px; } .ui-icon-circle-arrow-e { background-position: -112px -192px; } .ui-icon-circle-arrow-s { background-position: -128px -192px; } .ui-icon-circle-arrow-w { background-position: -144px -192px; } .ui-icon-circle-arrow-n { background-position: -160px -192px; } .ui-icon-circle-zoomin { background-position: -176px -192px; } .ui-icon-circle-zoomout { background-position: -192px -192px; } .ui-icon-circle-check { background-position: -208px -192px; } .ui-icon-circlesmall-plus { background-position: 0 -208px; } .ui-icon-circlesmall-minus { background-position: -16px -208px; } .ui-icon-circlesmall-close { background-position: -32px -208px; } .ui-icon-squaresmall-plus { background-position: -48px -208px; } .ui-icon-squaresmall-minus { background-position: -64px -208px; } .ui-icon-squaresmall-close { background-position: -80px -208px; } .ui-icon-grip-dotted-vertical { background-position: 0 -224px; } .ui-icon-grip-dotted-horizontal { background-position: -16px -224px; } .ui-icon-grip-solid-vertical { background-position: -32px -224px; } .ui-icon-grip-solid-horizontal { background-position: -48px -224px; } .ui-icon-gripsmall-diagonal-se { background-position: -64px -224px; } .ui-icon-grip-diagonal-se { background-position: -80px -224px; } /* Misc visuals ----------------------------------*/ /* Corner radius */ .ui-corner-all, .ui-corner-top, .ui-corner-left, .ui-corner-tl { border-top-left-radius: 0; } .ui-corner-all, .ui-corner-top, .ui-corner-right, .ui-corner-tr { border-top-right-radius: 0; } .ui-corner-all, .ui-corner-bottom, .ui-corner-left, .ui-corner-bl { border-bottom-left-radius: 0; } .ui-corner-all, .ui-corner-bottom, .ui-corner-right, .ui-corner-br { border-bottom-right-radius: 0; } /* Overlays */ .ui-widget-overlay { background: #123480; opacity: .3; -ms-filter: Alpha(Opacity=30); /* support: IE8 */ } .ui-widget-shadow { -webkit-box-shadow: 0px 0px 5px #123481; box-shadow: 0px 0px 5px #123481; } /* End of include: jqueryui */ /*** * Including file: colours */ /* Some of the colours will go in here to allow * easy experimentation. * Only a few for now which I'm experimenting with * but maybe more later. */ /* Set up the palette */ :root { --colour-Background: white; --colour-Primary1: #DBD5EC; --colour-Primary2: #9588BD; --colour-Primary3: #5D4C91; --colour-Primary4: #332267; --colour-Primary5: #110533; --colour-Secondary1: #FFFAE3; --colour-Secondary2: #FFF2AF; --colour-Secondary3: #D3C062; --colour-Secondary4: #968324; --colour-Secondary5: #4B3E00; --colour-MainFontColour: #110533; --colour-MenuFontColour: white; --colour-Error1: red; --colour-Error2: #d73e02; --colour-WebsiteBackground: #f4f0ff; --colour-WebsiteBackgroundTwo: #fffced; } /* Main colours of panes */ body { background-color: var(--colour-Background); } html.page_bookings_home body, html.page_mobile_bookings_home body { background-color: var(--colour-Background); } .MainView.TwoPane { background-color: var(--colour-Background); } .MainView>.Pane1 { background: var(--colour-Primary5); border-right: 0.1rem solid var(--colour-Primary5); } .MainView>.Pane2 { background: var(--colour-Background); } /* Sidemenu - menuitems */ .MainView>.SideMenuPane .Tree li, .MainView>.SideMenuPane ul.ActiveList li { background: none; } .MainView>.SideMenuPane .Tree>ul>li a, .MainView>.SideMenuPane ul.ActiveList li span { background: none; } .MainView>.SideMenuPane .Tree>ul>li>ul>li, .MainView>.SideMenuPane ul.ActiveList li { background: var(--colour-Primary5); } /* Sidemenu - menu items 3rd level */ .MainView>.SideMenuPane .Tree>ul ul ul li { background: var(--colour-Primary5); } /* Sidemenu - menu items 4th level (Is there a 4th level?) */ .MainView>.SideMenuPane .Tree>ul ul ul ul li { background: var(--colour-Primary5); } /* Datepicker background */ .ui-datepicker, .ui-datepicker div.ui-datepicker-header, .ui-datepicker div.ui-datepicker-buttonpane { background: var(--colour-Primary5); } .Dialog .ui-datepicker, .Dialog .ui-datepicker div.ui-datepicker-header, .Dialog .ui-datepicker div.ui-datepicker-buttonpane { background: var(--colour-Primary4); } /* Sidemenu "active" item on mobile */ html.Mobile div.BookingsSideMenu, html.Mobile div.BookingsSideMenu p.Selected, html.Mobile div.BookingsSideMenu p.Selected:active, html.Mobile div.BookingsSideMenu p.Selected:hover { background-color: var(--colour-Primary5) !important; } html.Mobile div.BookingsCalendar.ButtonContainer { background-color: var(--colour-Primary5); } .TimeGrid .TimeGrads { background-color: var(--colour-Background); } /* Font colours, which are different in different contexts */ form.Login td, form.Login th, form.Login h1 { color: var(--colour-Secondary1); } /* Assuming all "main" twopanes will be the same colourscheme... */ .Wrap>.TwoPane .Pane2 p, .Wrap>.TwoPane .Pane2 h1, select, option, button span, a { color: var(--colour-MainFontColour); } /* SideMenu colours */ .MainView>.Pane1, .MainView>.Pane1 a { color: var(--colour-MenuFontColour); } .MainView>.SideMenuPane .Tree li, .MainView>.SideMenuPane ul.ActiveList li { color: var(--colour-MenuFontColour); } /* Active Item highlighting for sidemenu */ .MainView>.SideMenuPane .Tree a.jstree-clicked, .MainView>.SideMenuPane ul.ActiveList li.Active span { color: var(--colour-Secondary2) !important; } /* Buttons */ /* Standard buttons */ .PopupForm.Button, .RemotePrintButton, .Button, .ui-button, .ui-button:hover, .ui-button:focus, ul.ActiveList li.AddNew, .ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current, .ui-datepicker .ui-datepicker-buttonpane button, input[type='submit'], button, form input[type='submit'] { background-color: var(--colour-Secondary2); color: var(--colour-Primary5) !important; } .PopupForm.Button:hover, .RemotePrintButton:hover, .RemotePrintButton:hover span, .Button:hover, input[type='submit']:hover, form input[type='submit']:hover, .ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current:hover, .ui-datepicker .ui-datepicker-buttonpane button:hover { background-color: var(--colour-Secondary3) !important; } /* Action Buttons */ /* Some ActionButtons can be set as "Active" in a data-sensitive way. * This style of ActionButton is used for "Flag" style values where the * button has a "toggle" effect. */ .ActionButton.Active { background-color: var(--colour-Secondary3); } .ActionButton.DeletePayment { /* Fix for payments, where actionbutton is in a table with alt colours */ background-color: transparent !important; } /* Specific ActionButton under Contracts */ .MyAccountTabs #Contract .Contract .Product .ActionButton { background-color: transparent; } .MyAccountTabs #Contract .Contract .Product .ActionButton:hover { background-color: transparent !important; } /* "Jump to Today" button in Datepicker */ .ui-datepicker .ui-icon { background-color: var(--colour-Primary1); } /* Time/date pickers */ .TimePicker .ui-widget-header { background-color: var(--colour-Primary4); } /* jQueryUI tweaks */ .ui-autocomplete { background-color: white !important; } .ui-menu-item a { color: black !important; } .ui-menu-item a:hover { background-color: var(--colour-Primary3) !important; } .ui-menu-item:hover { background-color: var(--colour-Primary3) !important; } .ui-menu-item:hover a { background-color: var(--colour-Primary3) !important; } /* DivTable colours */ div.Table>p.Odd { background-color: var(--colour-Secondary2); } div.Table>p.Even { background-color: var(--colour-Primary1); } .dataTable a { color: var(--colour-Primary5); } .NoteCount { color: var(--colour-Secondary4); } .NoteCount.HasNotes { color: var(--colour-Secondary4); } /* DataTable colours */ /* Row colours */ .EditTable tr.odd, .WITDataTable tr.odd { background-color: var(--colour-Secondary2); } .EditTable tr.even, .WITDataTable tr.even { background-color: var(--colour-Primary1); } /* Not sure what this one is */ table.EditTable tr.Active td { background-color: #D3C062; } /* Dropdown and filter input */ .dataTables_wrapper .dataTables_filter input, table.dataTable tbody tr, .dataTables_wrapper .dataTables_length select { background-color: var(--colour-Secondary2); } /* Pagination */ .dataTables_wrapper .dataTables_paginate .paginate_button.current, .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover { background-color: var(--colour-Secondary2); } /* Misc */ h1.StatusBanner { background-color: white; } /* Activity */ .Activity.FullScreen { background-color: rgba(0,0,0,0.6); } .Activity.FullScreen .Wrap { background-color: rgba(255,255,255,0.8); } /* jQuery tabs */ .ui-tabs .ui-tabs-nav li { background-color: var(--colour-Primary1); } .ui-tabs .ui-tabs-nav li.ui-tabs-active { background-color: var(--colour-Primary4); } /* Mobile sidemenu */ html.Mobile div.ButtonBar.BookingsCalendar { background-color: var(--colour-Primary5); } html.Mobile div.ButtonBar.BookingsCalendar .Button { background-color: var(--colour-Primary3); } html.Mobile div.ButtonBar.BookingsCalendar .Button:hover { background-color: var(--colour-Primary5) !important; } html.Mobile div.ButtonBar.BookingsCalendar div.Menu .Button:hover { background-color: var(--colour-Primary3) !important; color: var(--colour-Secondary3) !important; } html.Mobile div.ButtonBar.BookingsCalendar .Button { background-color: var(--colour-Primary5); color: var(--colour-Primary1) !important; } /* Timegrid main widget */ .TimeGrid .ScrollWrap { background-color: white; } .TimeGrid .TimeIndicator.Time1, .TimeGrid .TimeIndicator.Time2 { background-color: var(--colour-Primary5); color: var(--colour-Primary1); } .TimeGrid h1.ColHeader { background: var(--colour-Background); color: var(--colour-Primary5) !important; } /* Highlight the column when hovered */ .TimeGrid h1.ColHeader.ColHighlight { background: var(--colour-Secondary2); } /* Timegrid Objects */ .TimeGrid .CalObject.AdHocBooking .StartBlock, .TimeGrid .CalObject.AdHocBooking .EndBlock { background: repeating-linear-gradient( 45deg, var(--colour-Secondary3), var(--colour-Secondary3) 0.3rem, var(--colour-Secondary4) 0.3rem, var(--colour-Secondary4) 0.6rem ); } .TimeGrid .CalObject.Event .StartBlock, .TimeGrid .CalObject.Event .EndBlock { background: repeating-linear-gradient( 45deg, var(--colour-Primary3), var(--colour-Primary3) 0.3rem, var(--colour-Primary4) 0.3rem, var(--colour-Primary4) 0.6rem ); } .TimeGrid .CalObject.AdHocBooking, .TimeGrid .CalObject.BookingPlaceholder, .TimeGrid .CalObject.EventBooking { background-color: var(--colour-Secondary2); } .TimeGrid .CalObject.PrivateReservation, .TimeGrid .CalObject.PrivateEvent, .TimeGrid .CalObject.PrivateBooking { background-color: var(--colour-Primary1); } .TimeGrid .CalObject.AdHocBooking:hover, .TimeGrid .CalObject.BookingPlaceholder:hover, .TimeGrid .CalObject.EventBooking:hover { background: var(--colour-Secondary3); } /* Reservations: */ .TimeGrid .CalObject.Reservation { background: var(--colour-Primary4); } .TimeGrid .CalObject.Reservation .Legend h1 { color: var(--colour-Secondary1); } .TimeGrid .CalObject.Reservation:hover { background: var(--colour-Primary5); } .TimeGrid .CalObject.Reservation .Legend p { color: var(--colour-Secondary1); } /* Events */ .TimeGrid .CalObject.Event { background: var(--colour-Primary1); } .TimeGrid .CalObject.Event:hover { background: var(--colour-Primary2); } .TimeGrid .CalObject.GridNote { background-color: #92ff97; } .TimeGrid .CalObject.Gap { background: none; } .TimeGrid .CalObject.CalOff { background-color: rgba(200, 200, 200, 0.7); } .AdminCalendar.TimeGrid .CalObject.CalOff { background-color: var(--colour-Secondary2); } .AdminCalendar.TimeGrid .CalObject.CalOff.CalParentOff { background-color: rgba(200, 200, 200, 0.7); } .TimeGrid .CalObject.CalOn { background-color: rgba(255, 255, 255, 0.9); } @-webkit-keyframes pulse { 0% {background-color: #c7ffc4;} 50% {background-color: #9ab5e7;} 100% {background-color: #c7ffc4;} } .TimeGrid .CalObject.PrivateThing { background: rgba(180, 180, 180, 0.7); color: white; } .TimeGrid .CalObject.OnlineBookingSlot { background-color: rgb(75, 62, 0, 0.5); } .TimeGrid .CalObject.OnlineBookingSlot p { color: var(--colour-Primary5); } /* Provisional Bookings */ @keyframes color { 0% { background-color: var(--colour-Primary1); } 50% { background-color: var(--colour-Primary2); } 100 { background-color: var(--colour-Primary1); } } .TimeGrid .CalObject.ProvisionalBooking { background-color: var(--colour-Primary1); animation-name: color; animation-duration: 2s; animation-iteration-count: infinite; } .TimeGrid .RangeGap { background-color: black; } .TimeGrid .CalObject[paidinfull='1'] { background: #00f2af; } .TimeGrid .CalObject[paidinfull='1'] .StartBlock, .TimeGrid .CalObject[paidinfull='1'] .EndBlock { background: repeating-linear-gradient( 45deg, #2dc062, #2dc062 0.3rem, #2d8324 0.3rem, #2d8324 0.6rem ); } /* "Website" products page. */ html.page_products body { background: var(--colour-Background); color: var(--colour-Primary5); } /* Not needed, leaving for reference... html.page_products div.TopInfo { background: var(--colour-Background); color: var(--colour-Primary5); } html.page_products ul.Features { background: var(--colour-Background); } html.page_products li.FeatureBlock { color: var(--colour-Primary5); } html.page_products li.FeatureBlock h1 { color: var(--colour-Secondary5); } html.page_products div.ProductsBlock { background: var(--colour-Background); color: var(--colour-Primary5); } html.page_products li.ProductBlock { color: var(--colour-Primary5); } html.page_products li.ProductBlock div.Content { color: var(--colour-Primary5); } */ /* "Checkout" */ .Checkout { color: var(--colour-Primary5); } form.Checkout.PaymentDetails input[type='submit'].Disabled, form.Checkout.PaymentDetails input[type='submit'].Disabled:hover { background: var(--colour-Tertiary1) !important; color: var(--colour-Tertiary3) !important; } .Checkout .MobileWarning { color: var(--colour-Secondary3); } .Checkout .TermsLink { color: var(--colour-Secondary5); } .Checkout div.Error { color: var(--colour-Error1); } form.Checkout.PaymentDetails div.ErrorMessages, form.AddNewCard div.ErrorMessages { color: var(--colour-Error1); } /* Tooltips / popovers */ .webui-popover .webui-popover-title, .webui-popover-content .Info { ## background: var(--colour-Background); } .webui-popover-content .PopoverButtons { ## background: var(--colour-Primary3) } .webui-popover-content .PopoverButtons>* { color: var(--colour-Primary5); } .webui-popover-content .PopoverButtons>*:hover { color: var(--colour-Primary4); } .webui-popover a { color: var(--colour-Primary4); } /* UserMenu (Top-right) */ div.UserMenu>h1.Active { background: var(--colour-Primary5); } div.UserMenu ul.UserMenu { background: var(--colour-Primary5); color: var(--colour-Primary1); } div.UserMenu ul.UserMenu li a { color: #DBD5EC; } div.UserMenu>h1 span.Label { color: var(--colour-MenuFontColour); } /* Topmenu */ ul.TopMenu>li>a { color: var(--colour-MenuFontColour); } /* Top Submenu (Help etc) */ ul.TopMenu ul.SubMenu { background: var(--colour-Primary5); } body.Mobile ul.SubMenu { background: var(--colour-Primary5); } html.NotLoggedIn ul.TopMenu ul.SubMenu { background: var(--colour-Primary4); } ul.TopMenu li span, ul.SubMenu li a { color: var(--colour-MenuFontColour); } /* MOBILE SideMenu * These colours are kept in mobile/sideMenu.css */ /* Forms and validation */ select, input, textarea { color: var(--colour-Primary5); background-color: var(--colour-MenuFontColour); } .wit-combobox .ACButton { // background: var(--colour-Secondary1) !important; } b.ValErr { color: var(--colour-Error1) !important; } /* On various dropdowns, custom data written as attributes may put in * 'active'. If the item isn't active, it gets grey'd. * This is used for, eg, rooms which do not support a particular Service * but which are still selectable (to give flexibility in the case of, say, * a temporary massage table being used) */ select option[active='0'] { color: #aaaaaa !important; } div.ErrorsArea li { color: var(--colour-Secondary3) !important; } /* FIXME: Not sure if this should be global or just login */ form.LoginForm div.ErrorsArea li { color: var(--colour-Error1) !important; } html.page_demologin .Wrap.demologin { // color: var(--colour-Primary1); } .LoginRegister { color: var(--colour-Primary5); } .LoginRegisterBox { color: var(--colour-Primary5); } /* FIXME: Remove. .LoginRegisterBox form div.ErrorsArea li { color: red !important; } */ .LoginRegisterBox a { color: var(--colour-Primary5); } a.ForgotPasswordLink { color: var(--colour-Primary5); } /* Online Bookings / Customer Bookings */ div.NewOnlineAdHocBooking, div.NewOnlineAdHocBooking, div.NewOnlineAdHocBooking p, div.NewOnlineAdHocBooking .Content, div.NewOnlineAdHocBooking .Content p, div.NewOnlineAdHocBooking .Content a { } div.NewOnlineAdHocBooking .OBSearchResults p { color: var(--colour-Primary5); } div.YourBooking { background: var(--colour-Primary1); } div.YourBooking a { color: var(--colour-Primary5); } div.NewOnlineAdHocBooking .TabSet, div.NewOnlineAdHocBooking .TabSet .Tabs { } /* Online Bookings search results */ .OnlineBookingSearchResults ul.TimeSlots li { background: var(--colour-Primary1); } .OnlineBookingSearchResults ul.TimeSlots li:hover { background: var(--colour-Primary2); } .OnlineBookingSearchResults ul.TimeSlots li.Active { background: var(--colour-Primary3); color: var(--colour-Secondary1); } .OnlineBookingSearchResults div.TabSet>div.ui-tabs-panel, .OnlineBookingSearchResults div.TabSet>ul.Tabs li.ui-tabs-active { background: var(--colour-Secondary1); } .OnlineBookingSearchResults div.TabSet>ul.Tabs li.ui-tabs-active a { color: var(--colour-Primary5); } /* Help/Quickstart */ div.ParsedownHelp { background: var(--colour-Background); } div.ParsedownHelp .ParsedownHelpTOC { background: var(--colour-Background); } div.ParsedownHelp .ParsedownHelpBody { background: var(--colour-Background); } div.ParsedownHelp .ParsedownHelpTOC ul li a { color: var(--colour-Primary4); } div.ParsedownHelp .ParsedownHelpTOC ul li a:hover { color: var(--colour-Primary5); } div.ParsedownHelp .ParsedownHelpBody h1, div.ParsedownHelp .ParsedownHelpBody h2, div.ParsedownHelp .ParsedownHelpBody h3, div.ParsedownHelp .ParsedownHelpBody h4 { color: var(--colour-Primary5); } div.ParsedownHelp .ParsedownHelpBody p { color: var(--colour-Primary5); } div.ParsedownHelp .ParsedownHelpBody li { color: var(--colour-Primary5); } div.ParsedownHelpTOC a.IsInViewport { color: var(--colour-Error1) !important; } /* Mobile: Error when access Admin pages */ div.AdminNotAvailable { color: var(--colour-Primary5); } div.AdminNotAvailable p a { color: var(--colour-Primary5); } /* End of include: colours */ /*** * Including file: icons */ /* Icons for various buttons. * Note the selector for the EditTables, .Wrap increases specificity * Comments for each explain where to find one example, for maintenance. */ /* Fixme: Where is OK button used? */ .Button.Yes, .Button.OK { background-image: url("https://m-booksystems.co.uk/app/Apps_img/v/b45c46c3831271bd091d047ff62bb584/img/iconset%253Aok.svg/repl/NONE"); } /* Usage: Edit Details on any admin popup */ .Button.Save, .Wrap .EditTable a.button1[title='Save'] { background-image: url("https://m-booksystems.co.uk/app/Apps_img/v/68c16328ed5221923d7e4141fc9b7838/img/iconset%253Asave.svg/repl/NONE"); } /* Usage: Create Booking popup */ .Button.Cancel, .Button.Close, .Wrap .EditTable a.button2[title='Cancel'] { background-image: url("https://m-booksystems.co.uk/app/Apps_img/v/98db24eca4bb29fe49a48d0fc07ee4c1/img/iconset%253Acancel.svg/repl/NONE"); } /* Usage: Admin buttons, "Add Premises" */ .Button.Add { background-image: url("https://m-booksystems.co.uk/app/Apps_img/v/08f8803ca85fd6da4bbff1a3f4e50216/img/iconset%253Aadd.svg/repl/NONE"); } /* Usage: Create Booking button */ .Button.Create { background-image: url("https://m-booksystems.co.uk/app/Apps_img/v/40027bf0614c6a91fae44796fa0fae24/img/iconset%253Acreate.svg/repl/NONE"); } /* Usage: Create Booking on Mobile */ html.Mobile .ButtonBar.BookingsCalendar .Button.Create { background-image: url("https://m-booksystems.co.uk/app/Apps_img/v/40027bf0614c6a91fae44796fa0fae24/img/iconset%253Acreate.svg/repl/Secondary2"); } /* Usage: Edit Business on Admin */ .Button.Edit, .Wrap .EditTable a.button1[title='Edit'] { background-image: url("https://m-booksystems.co.uk/app/Apps_img/v/3f1a5e1ddfae2495f02de778ad51865b/img/iconset%253Aedit.svg/repl/NONE"); } /* Usage: Remove Service on Admin */ .Button.Remove, .Button.Delete, .Wrap .EditTable a.button2[title='Delete'] { background-image: url("https://m-booksystems.co.uk/app/Apps_img/v/4dc0542f3a77e49e52f52b7156f312ae/img/iconset%253Adelete.svg/repl/NONE"); } /* Usage: Print Receipt on Booking Details after payment-in-full */ .Button.RemotePrintButton, .Button.PrintButton { background-image: url("https://m-booksystems.co.uk/app/Apps_img/v/d657c8248a0852253a306fdf8aa8c359/img/iconset%253Aprint.svg/repl/NONE"); background-size: 1.3rem; } /* Usage: Cancel Booking dialog */ .Button.No { background-image: url("https://m-booksystems.co.uk/app/Apps_img/v/03e28bd6172df6cb3f294dfdff9e2915/img/iconset%253Ano.svg/repl/NONE"); } /* Usage: BookingDetails buttonbar */ .Button.ViewInCalendar { background-image: url("https://m-booksystems.co.uk/app/Apps_img/v/09d363d9c22bcce8d15e5fa3c07b8c2b/img/iconset%253AviewInCalendar.svg/repl/NONE"); } /* Placeholder icon for "copy" button in "Edit Cal Item" */ .Button.CopytoallmyotherClinics { background-image: url("https://m-booksystems.co.uk/app/Apps_img/v/09d363d9c22bcce8d15e5fa3c07b8c2b/img/iconset%253AviewInCalendar.svg/repl/NONE"); } /* Usage: BookingDetails Buttonbar: NoShow */ .Button.Error { background-image: url("https://m-booksystems.co.uk/app/Apps_img/v/8500eb883eee679d4698e1f952cf5884/img/iconset%253Aerror.svg/repl/NONE"); background-size: 1.3rem; } /* Usage: BookingDetails buttonbar */ /* Reusing Create Booking icon */ .Button.Rebook { background-image: url("https://m-booksystems.co.uk/app/Apps_img/v/ddb20d812516e953f9ce72d5d89d7917/img/iconset%253Arebook.svg/repl/NONE"); background-image: url("https://m-booksystems.co.uk/app/Apps_img/v/40027bf0614c6a91fae44796fa0fae24/img/iconset%253Acreate.svg/repl/NONE"); } /* Usage: BookingsCalendar buttonbar: Search And Book */ .Button.SlotSearch, .Button.Search { background-image: url("https://m-booksystems.co.uk/app/Apps_img/v/047806c919c71ce39b53afeb85d9c6de/img/iconset%253Asearch.svg/repl/NONE"); } html.Mobile .ButtonBar.BookingsCalendar .Button.SlotSearch { background-image: url("https://m-booksystems.co.uk/app/Apps_img/v/047806c919c71ce39b53afeb85d9c6de/img/iconset%253Asearch.svg/repl/Secondary2"); } /* Usage: BookingsCalendar buttonbar: Find Bookings and Clients */ .Button.SearchForThingsForm { background-image: url("https://m-booksystems.co.uk/app/Apps_img/v/5dfec4c3204d1334e4ec80eeb599e8a0/img/iconset%253Afind.svg/repl/NONE"); } html.Mobile .ButtonBar.BookingsCalendar .Button.SearchForThingsForm { background-image: url("https://m-booksystems.co.uk/app/Apps_img/v/5dfec4c3204d1334e4ec80eeb599e8a0/img/iconset%253Afind.svg/repl/Secondary2"); } /* Usage: BookingsCalendar buttonbar */ .Button.PractitionerAvailability { background-image: url("https://m-booksystems.co.uk/app/Apps_img/v/c027a137c5116c9873820ce427abab5c/img/iconset%253Aavailability.svg/repl/NONE"); background-size: 1.3rem; } html.Mobile .Button.PractitionerAvailability { background-image: url("https://m-booksystems.co.uk/app/Apps_img/v/c027a137c5116c9873820ce427abab5c/img/iconset%253Aavailability.svg/repl/Secondary2"); } /* Usage: Bookings Calendar datepicker "Jump to Today" */ .ui-datepicker .ui-datepicker-buttonpane button[type='button'].ui-datepicker-current { background-image: url("https://m-booksystems.co.uk/app/Apps_img/v/6f01beafa96640f6c75e038a0b247913/img/iconset%253AjumpToToday.svg/repl/NONE"); background-position: 0.3rem 60% !important; } /* Usage: BookingDetails buttonbar */ .Button.HasArrived { background-image: url("https://m-booksystems.co.uk/app/Apps_img/v/3d2363fddcd633d6452aa1499508d536/img/iconset%253AclientHasArrived.svg/repl/NONE"); } /* Usage: Calendars WorkingWeekWizard */ .Button.Next { background-image: url("https://m-booksystems.co.uk/app/Apps_img/v/efff94025084419ed5244319110019af/img/iconset%253Anext.svg/repl/NONE"); } /* Usage: Calendars WorkingWeekWizard */ Button.AddAvailability { background-image: url("https://m-booksystems.co.uk/app/Apps_img/v/da902e0f5ea13c214cfa329aed05b3f5/img/iconset%253AaddAvailability.svg/repl/NONE"); } /* Usage: Calendars WorkingWeekWizard: "Done" */ .ui-datepicker-buttonpane .ui-datepicker-close { background-image: url("https://m-booksystems.co.uk/app/Apps_img/v/b45c46c3831271bd091d047ff62bb584/img/iconset%253Aok.svg/repl/NONE"); } /* Usage: BookingForm: Clear Form */ .Button.Reset, .Button.DowngradeContract, .Button.DowngradeNow { background-image: url("https://m-booksystems.co.uk/app/Apps_img/v/861eab5374704735ad9e94748d7e3769/img/iconset%253Areset.svg/repl/NONE"); } /* Usage: BookingForm: AddToWaitingList */ .Button.AddtoWaitingList { background-image: url("https://m-booksystems.co.uk/app/Apps_img/v/1cdc202a9bb2c4afe6b5d8456d07a6f0/img/iconset%253AaddToWaitingList.svg/repl/NONE"); } /* Usage: BookingCalendar Bookings popover: Details button */ .Button.Details { background-image: url("https://m-booksystems.co.uk/app/Apps_img/v/d269fe447aa8bd0b91352e54f1439e5b/img/iconset%253Adetails.svg/repl/NONE"); } /* Usage: Login page */ .Button.Login { background-image: url("https://m-booksystems.co.uk/app/Apps_img/v/7bfed7bd21e295eeff5a48e03273c4e7/img/iconset%253Alogin.svg/repl/NONE"); } /* Usage: Demo, login/register page, register button */ .Button.Register, .Button.CustomerRegister, .Button.CreateDemoClinic { /* "Register For Demo Clinic" */ background-image: url("https://m-booksystems.co.uk/app/Apps_img/v/227aff1eb010b0ca70de11163f0ca81a/img/iconset%253AdemoRegister.svg/repl/NONE"); } /* Usage: Main site, add product to cart (pre-checkout) */ .Button.Buy { background-image: url("https://m-booksystems.co.uk/app/Apps_img/v/3f2050b627bfdca6ce56b75429017d0c/img/iconset%253AaddToCart.svg/repl/NONE"); } /* Usage: Main site, checkout "Complete Purchase" */ .Button.Checkout { background-image: url("https://m-booksystems.co.uk/app/Apps_img/v/97779b7e14b1dbc412630578270e57e4/img/iconset%253Acheckout.svg/repl/NONE"); } .Button.Calendar { /* Not sure where this button is, removing to make it obvious */ /* background-image: url("https://m-booksystems.co.uk/app/Apps_img/v/d93a1e2588a4f682dc71c2403de5d76c/img/silk%253Acalendar.png/repl/NONE"); * background-image: url("https://m-booksystems.co.uk/app/Apps_img/v/f489ad41495df7aa34fc8f260ba22c31/img/icons8mb4%253Aicons8-calendar-16.png/repl/NONE"); */ } .PopupForm.EditDetails { background-image: url("https://m-booksystems.co.uk/app/Apps_img/v/3f1a5e1ddfae2495f02de778ad51865b/img/iconset%253Aedit.svg/repl/NONE"); } /* End of include: icons */ /*** * Including file: commonForms */ /* Styles which are common to all forms. Should avoid * any kind of "generic position" styling as there is rarely such * a thing. */ form { margin-left: 1rem; // max-width: 65rem; } label { display: block; text-align: left; margin-bottom: 1rem; } label>span.Legend:first-of-type { display: block; padding-bottom: 0.2rem; } label.TickBox.TickLeft span.Legend { display: inline-block; } label>span, label>input, label>select { vertical-align: middle; } label.TickBox>span.Legend { margin: 0; padding: 0 0 0 0.5rem; } label>* { vertical-align: middle; } label>input[type='checkbox'] { margin-left: 0; margin: 0; } label.Submit { text-align: center; } input[type='text'], input[type='number'], input[type='password'], textarea, select.WITSelect, label.WITWidget.PasswordStrengthIndicator .Widget, span.wit-combobox, div.Radio div.Items { width: 20rem; min-width: auto; display: inline-block; text-align: left; } input[type='text'], input[type='number'], input[type='password'], textarea, select.WITSelect, label.WITWidget.PasswordStrengthIndicator .Widget, span.wit-combobox input, span.wit-combobox .ACButton, span.wit-combobox .ACButtonText, div.Radio div.Items { padding: 0.4rem 0.3rem 0.3rem 0.3rem; } span.wit-combobox input { font-size: 1rem; } body.Mobile input[type='text'], body.Mobile input[type='number'], body.Mobile input[type='password'], body.Mobile textarea, body.Mobile select.WITSelect, body.Mobile label.WITWidget.PasswordStrengthIndicator .Widget, html.Mobile span.wit-combobox, body.Mobile div.Radio div.Items { } .wit-combobox>input.wit-combobox-input, .wit-combobox>a.ACButton { height: 2rem; } /* Any label with the class "RequiredField" needs a "required" highlight. * RequiredField was added by Model_HTML */ label.RequiredField, div.RequiredField { vertical-align: bottom; position: relative; } /* For non-required fields, do similar, because the font-size * of the 'after' affects the padding */ label span.Legend:after, div span.Legend:after { content: " "; color: red; vertical-align: middle; font-size: 1.6rem; line-height: 1.6rem; padding: 0 0 0 0.3rem; position: absolute; } /* Required Field has a star in the After */ label.RequiredField span.Legend:after, div.RequiredField span.Legend:after { content: "*"; } /* Fixup for radio answers which (incorrectly) reuse .Legend */ label.RequiredField label.Item span.Legend:after, div.RequiredField label.Item span.Legend:after { content: ""; } /* Fixup for Show/Hide Password */ label.RequiredField span.Legend.ShowHideText:after { content: ""; } textarea { min-height: 3.1rem; } div.Radio div.Items { position: relative; height: auto; width: auto; } div.Radio label.Main { display: block; text-align: left; } div.Radio label.Main>span { vertical-align: middle; text-align: left; } div.Radio label.Item { display: inline-block; margin: 0 1rem 0 0; vertical-align: middle; } div.Radio label.Item:first-of-type { margin-left: 2rem; } html.Mobile div.Radio label.Item:first-of-type { margin-left: 0; } div.Radio label.Item>* { vertical-align: middle; } div.Radio label.Item>input[type='radio'] { display: inline-block; margin: 0 0.3rem 0 0; } div.Radio label.Item span.Extra { margin: 0; vertical-align: middle; display: inline-block; } div.Radio label.Item span.Legend { display: inline-block; } select { padding: 0.1rem; } /* Error messages are written in to the form - style these nicely */ b.ValErr { display: block; font-size: 1rem !important; margin: 0.3rem 0.6rem 0.6rem 0; } /* Form errors */ div.ErrorsArea.FormErrs { display: block; } div.ErrorsArea.FormErrs ul { list-style: none; margin: 0.3rem 0 0.3rem 0.3rem; padding: 0; } div.ErrorsArea li { text-align: center; font-weight: bold; } b.ValErr { display: inline-block; text-align: center; width: 100% !important; max-width: 100% !important; min-width: 100% !important; margin: 0.3rem 0; } fieldset.UnresolvedRange { opacity: 0.4; } fieldset.UnresolvedRange.Active { opacity: 1; } span.HoursMinsPicker { ## width: 10.9rem; display: inline-block; } span.HoursMinsPicker span.HoursLegend { padding-right: 0.9rem; padding-left: 0.1rem; } span.HoursMinsPicker span.MinsLegend { padding-left: 0.1rem; } span.HoursMinsPicker select { width: 3rem !important; appearance: auto; background: var(--colour-MenuFontColour); } select.ui-timepicker-select { padding: 0.1rem 0.3rem; appearance: auto; } /* End of include: commonForms */ /*** * Including file: skin */ /* Basic things to do with layout, fonts and colours on all pages. * Widgets style internally only; if widgets always have a certain * external margin, say, that should go here. If tweaks are needed * for certain pages, they should go in page-specific css files. * If tweaks are needed to lay out a widget generically, put here or in a * layout file. Try to keep CSS /short/. */ .Clearfix:after { content: ""; display: block; clear: both; } html.LoggedIn { font-size: 10pt; } html.Mobile.LoggedIn { font-size: 12pt; } body { padding: 0; margin: 0; position: relative; } html.page_mobile_bookings_home body { font-size: 1.2rem; } *, .jstree a { font-family: 'Montserrat', sans-serif !important; // font-family: 'Jost', sans-serif !important; box-sizing: border-box; } h1 { font-size: 1.5rem; margin: 0 0 1.5rem 0; } h2 { font-size: 1.2rem; } p.Important { font-weight: bold; } .hidden { display: none; } .Header { } .Wrap { padding: 0; margin: 0; position: relative; } .InfoBox { margin: 0 5rem 5rem 0; } .InfoBox h1 { font-size: 1.2rem; } .StrongItem { margin: 0 0 0 !important; } .StrongItem>.Legend { margin-right: 0.5rem; display: inline-block; line-height: 1.6rem; } /* Activity spinner location */ .Activity { position: fixed; right: 0; bottom: 0; display: none; margin: 0 0.6rem 0.6rem 0; } .Activity .Wrap { overflow: hidden; padding: 0 0 0 1.3rem; } .Activity.FullScreen { position: absolute; z-index: 999999; top: 0; left: 0; margin: 0; width: 100%; height: 100vh; text-align: center; } .Activity.FullScreen .Wrap { display: block; position: fixed; top: 0; width: 100%; margin: 0; padding: 0; border-bottom: 0.1rem solid var(--colour-Primary5); border-top: 0.1rem solid var(--colour-Primary5); box-shadow: 0 0 0.3rem 0.1rem var(--colour-Primary5); padding: 0 0 0.8rem 0; margin: 2.5rem 0 0 0; } .Activity.FullScreen .Wrap span { color: var(--colour-Primary5); } /* .MainView tweaks */ .MainView.TwoPane { overflow: hidden; height: 100%; } .MainView>.Pane1 { font-size: 1.1rem; ## padding-top: 1rem; ## min-width: 19rem; } .bookings_home .MainView>.Pane1 { ## min-width: 19rem; } /* Tweaks to the jqueryui styles */ .ui-menu { width: 13.8rem !important; } html.Mobile .ui-menu { width: 48vw !important; } .ui-menu-item { font-size: 1.1rem; } .ui-menu-item a:hover { border: none; } .ui-menu-item:hover a { border: none; } .ui-menu .ui-menu-divider { border: none; display: none; } .ui-widget-header { font-weight: normal; } .dataTable b.Bool { font-size: 0; } .dataTable .Bool.False { /* Show the default "cross" for "Off". * Have experimented with cross or nothing * and cross works better background: none !important; */ } .dataTables_info { padding-left: 0.6rem; font-size: 1rem; } ul.ActiveList li.AddNew { margin-left: 0.3rem; } /* In a .Pane2, add a little left-margin to h1/ps */ .Pane2>h1, .Pane2>p { margin-left: 0.3rem; } div.Centre { text-align: center; } .AdminMainPane>h1 { margin: 0.3rem 0.6rem; } .AdminMainPane>p { margin-left: 0.6rem; } /* Items which have popup help built in to them will be .HasHelp. * Make them appear clickable. */ .HasHelp { } .HasHelp>span.Legend>* { vertical-align: middle; } .HasHelp>span.Legend>.HelpIcon { background: url("https://m-booksystems.co.uk/app/Apps_img/v/44abdcfdc0ebddbf2014ac8cbc222a8a/img/iconset%253Ahelp.svg/repl/NONE") 0 0 no-repeat; display: inline-block; width: 1.6rem; height: 1.57rem; background-size: 1.4rem; cursor: help; } .Dialog .HasHelp>span.Legend>.HelpIcon { background-image: url("https://m-booksystems.co.uk/app/Apps_img/v/44abdcfdc0ebddbf2014ac8cbc222a8a/img/iconset%253Ahelp.svg/repl/Secondary2"); } /* Items which should stick to the top of the page on scroll */ .Sticky { margin-top: 0 !important; position: fixed !important; top: 0; z-index: 100; } div.PageBreak { page-break-after: always; } h1.StatusBanner { text-align: center; margin: 0; padding: 0; padding: 0.3rem 0; } ul.Tabs.ui-tabs-nav { border-bottom: 0.1rem solid var(--colour-Primary3); margin-left: 0.2rem; } ul.Tabs.ui-tabs-nav li.ui-state-default a { padding: 0.6em 1em 0.5em 1em; } .ui-dialog { z-index: 9999; } .BoxHighlight { border: 0.1rem solid var(--colour-Primary1); padding-left: 0.6rem; padding-right: 0.6rem; } span.spanSet.EventTemplates_ServiceServiceType, span.spanSet.RoomFullName { display: block; padding: 0.2rem 0; } .JQSortable li { font-size: 1.2rem !important; } .ui-datepicker th { font-weight: normal; } .page_checkout .Wrap>p { color: var(--colour-Primary5); margin: 0.6rem; } html.Mobile .InfoBox { display: block; width: 100%; margin-bottom: 4rem; } html.Mobile .InfoBox h1 { border-bottom: 0.1rem solid var(--colour-Primary1); } p.Error { padding: 1rem; } /* Desktop, > 10inches */ @media (width > 960px) { } /* Tablets/screens, less than 10inches */ @media (width < 960px) { html.IsLoggedIn ul.TopMenu>li { margin-right: 0.5em !important; margin-left: 0.5em !important; } ul.TopMenu ul.SubMenu { margin-left: -4.2rem !important; } } /* Phones */ @media (width < 576px) { html { font-size: 14px !important; } body, main header, main section, html body header, div.CheckoutBlock, html.Site div.CheckoutSuccess, div { max-height: 999999px; } div.Header div.UserMenu { top: 0; } } /* End of include: skin */ /*** * Including file: businessSwitcher */ div.BusinessSwitcher { color: var(--colour-Primary1); list-style: none; clear: both; text-align: left; margin: 0; margin: 0.6rem 0 0 0; } html.Mobile div.BusinessSwitcher { } div.BusinessSwitcher label.BusinessSwitcher { margin: 0.2rem 0; display: inline-block; ## width: 18rem; padding-bottom: 1.4rem; } html.Mobile div.BusinessSwitcher label.BusinessSwitcher { width: 100%; padding-left: 0.2rem; overflow: hidden; text-align: right; padding-bottom: 0; } div.BusinessSwitcher label.BusinessSwitcher select { color: var(--colour-Primary5); padding: 0.2rem 0.6rem 0.2rem 0; font-size: 1.2rem; vertical-align: middle; width: 18.3rem; background: var(--colour-MenuFontColour); appearance: auto; } html.Mobile div.BusinessSwitcher label.BusinessSwitcher select { width: 70%; } div.BusinessSwitcher label.BusinessSwitcher span { margin-right: 0.7rem; font-size: 1.2rem; } html.Mobile div.BusinessSwitcher label.BusinessSwitcher span { margin-right: 1rem; display: inline-block; width: 20%; text-align: left; float: left; position: relative; top: 0.3rem; } div.BusinessSwitcher label.BusinessSwitcher select option { color: var(--colour-Primary5); width: 100%; } /* End of include: businessSwitcher */ /*** * Including file: buttons */ .PopupForm.Button, .RemotePrintButton, .Button, .ui-button, .ui-button:hover, .ui-button:focus, ul.ActiveList li.AddNew, .ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current, .ui-datepicker .ui-datepicker-buttonpane button, input[type='submit'], button, form input[type='submit'] { display: inline-block; padding: 0.3em 0.4em 0.3em 2.5em; background-position: 0.4em 50%; background-repeat: no-repeat; background-size: 1.5em auto; border: max(1px, 0.1em) solid #4B3E00; font-weight: normal; box-shadow: inset 0 0 0.1em var(--colour-Primary1), 0 0 0.1em var(--colour-Primary1); box-shadow: none; font-size: 1em; border-radius: 0.3em; float: none; opacity: 1; } .Button:focus-visible { outline: none; } html.Mobile .PopupForm.Button, html.Mobile .RemotePrintButton, html.Mobile .Button, html.Mobile .ui-button:hover, html.Mobile .ui-button:focus, html.Mobile ul.ActiveList li.AddNew, html.Mobile input[type='submit'], html.Mobile form input[type='submit'] { background-position: 0.3rem 55%; padding-left: 2.3em !important; } .Button.SmallButton { padding: 0.4em 0.5em 0.4em 2.5em; background-position: 0.5em 0.3em; margin: 0; box-sizing: border-box; border-radius: 0.3em; font-size: 1em; font-weight: normal; } html.Mobile .Button.SmallButton { padding: 0.4em 0.5em 0.3em 2em !important; } /* These are for the Bookings Tooltips buttonbar */ /* Weird override needed to vertically center icons in Bookings ButtonBar */ .PopoverButtons.ButtonBar .PopupForm.Button, .PopoverButtons.ButtonBar .RemotePrintButton, .PopoverButtons.ButtonBar .Button, .PopoverButtons.ButtonBar ul.ActiveList li.AddNew, .PopoverButtons.ButtonBar input[type='submit'], .PopoverButtons.ButtonBar form input[type='submit'] { -- background-position: 0.3rem 52%; } .ui-dialog .ui-dialog-buttonpane button:last-of-type { margin-right: 0; } .ui-dialog .ui-dialog-buttonpane button { font-size: 1em; } html.NotLoggedIn .ui-dialog .ui-dialog-buttonpane button { } html.Mobile .ui-dialog .ui-dialog-buttonpane button { font-size: 1rem; padding: 0.6rem 1rem 0.4rem 1rem; } .Button.SmallButton.ResetAdHocForm { # padding-bottom: 0.3em !important; } a.Button { text-decoration: none; } /* EditTable add button */ .Button.AddRow { margin-right: 0.1rem; margin-top: 0.5rem; float: right; } /* Desktop version doesn't have a legend */ html.Desktop .ActionButton.DeletePayment { border: none; width: 1.5rem; height: 1.5rem; background-size: 1.5rem auto; background-position: 0rem; } /* The pencil icon used all over Admin to conjour the popup edit form */ .PopupForm.EditDetails { height: 1.5rem; background-size: 1.5rem auto; background-repeat: no-repeat; background-position: 0 0; display: inline-block; position: relative; vertical-align: bottom; margin: 0 0.3rem 0 0; border: none; background-color: transparent; } .PopupForm.EditDetails:focus-visible { outline: none; } /* This is "Remove Bolton" in Contracts tab. Image comes from .Delete */ .MyAccountTabs #Contract .Contract .Product .ActionButton { display: inline-block; height: 0.6rem; background-position: center; width: 1.8rem; height: 1.8rem; background-size: 1.8rem auto; padding: 0 0.5rem 0 0 !important; margin: 0 0.5rem 0 0; display: inline-block; position: relative; top: 0.4rem; border: none; } /* Specific styling for the ad-hoc booking controls */ .Pane2 div.AdHocBook label.ClearButton>span { display: none; } button.Disabled span, button.Disabled:hover span, .PopupForm.Disabled, .PopupForm.Disabled:hover { background: #EEEEEE !important; color: #AAAAAA !important; } /* Minor adjustments for dialog buttons */ .ui-dialog .ui-dialog-buttonpane button { margin-right: 0.6rem; } button[disabled='disabled'] span { color: var(--colour-Primary3); } button[disabled='disabled']:hover { background-color: var(--colour-Secondary2) !important; } /* End of include: buttons */ /*** * Including file: header */ div.Header { margin:0; padding: 0; background: var(--colour-Primary5); box-sizing: border-box; width: 100%; padding: 0.5rem 0.5rem 0.5rem 0.5rem; position: relative; } html.NotLoggedIn div.Header { padding: 0.5rem 0.5rem 0.5rem 0.5rem; background: var(--colour-Primary4); } html.Mobile.NotLoggedIn div.Header { top: 0; z-index: 100; } div.HeaderWrap { margin: 0; position: relative; } div.Header div.Logo, div.Header div.TopMenu, div.Header div.UserMenu { vertical-align: top; box-sizing: border-box; } div.Header div.Logo, div.Header div.BusinessSwitcher { background: var(--colour-Primary5); } html.NotLoggedIn div.Header div.Logo { background: var(--colour-Primary4); position: relative; top: 0.2rem; } html.LoggedIn div.Header div.Logo { display: inline-block; padding-right: 2rem; } div.Header div.Logo { display: inline-block; box-sizing: border-box; text-align: left; margin-right: 5em; } div.Header div.Logo a.Logo { text-decoration: none; color: #FFFAE3; font-size: 3em; padding: 0; } div.Header div.UserMenu { display: inline-block; margin: 0; padding: 0; position: absolute; right: 0; top: 0.3rem; margin-right: 0.1rem; } div.UserMenu h1 { font-size: 1rem; font-weight: normal; } html.LoggedIn.Mobile div.Header div.UserMenu { top: 1.3rem; } /* End of include: header */ /*** * Including file: help/quickstart */ div.ParsedownHelp { margin: 0; padding: 0; box-sizing: border-box; overflow: none; width: 100%; } html.Mobile div.ParsedownHelp { padding-top: 0.2rem; } div.ParsedownHelp .ParsedownHelpTOC li.TOCH1 { margin-top: 0.8rem; margin-bottom: 0; padding-bottom: 1.3rem; border-bottom: 0.1rem solid var(--colour-Primary3); } html.Mobile div.ParsedownHelp .ParsedownHelpTOC li.TOCH1:first-of-type { margin-top: 0; } div.ParsedownHelp .ParsedownHelpTOC li.TOCH1:last-of-type { border-bottom: none; } div.ParsedownHelp .ParsedownHelpTOC, div.ParsedownHelp .ParsedownHelpBody { box-sizing: border-box; height: calc(200vh - 3.1rem); overflow-y: scroll; } html.Mobile div.ParsedownHelp .ParsedownHelpTOC, html.Mobile div.ParsedownHelp .ParsedownHelpBody { height: auto; overflow-y: auto; } div.ParsedownHelp .ParsedownHelpTOC { float: left; padding-right: 0.6rem; max-width: 30%; box-sizing: border-box; # font-size: 1.4rem; line-height: 1.8rem; padding-bottom: 1.9rem; background-color: var(--colour-Secondary1); font-weight: 500; } html.Mobile div.ParsedownHelp .ParsedownHelpTOC { float: none; height: auto; padding: 0; max-width: 100%; text-align: center; } html.Mobile div.ParsedownHelp .ParsedownHelpTOC div.HelpTOC { text-align: left; } html.Mobile p.HelpTOC.Button.Selected { margin: 0.3rem 0.3rem 0rem 0; display: inline-block; font-weight: normal; background-position: 1rem 50% !important; background-repeat: no-repeat; background-size: 1.5rem auto; position: relative; top: 0.1rem; font-size: 1.5rem; color: var(--colour-Primary5) !important; background-color: var(--colour-Primary1); background-image: url("https://m-booksystems.co.uk/app/Apps_img/v/ff9106af5ff342a37bdfa347c2da0e4f/img/iconset%253Amenu.svg/repl/Primary5"); border: none; padding: 1rem 1rem 1rem 3.5rem !important; margin: 1rem 0 1rem 0; } html.Mobile p.HelpTOC.Button.Selected:hover { background-color: var(--colour-Primary1) !important; } div.ParsedownHelp .ParsedownHelpBody { padding: 1rem 0.6rem 5rem 1rem; margin: 0; box-sizing: border-box; margin-left: 20%; # font-size: 1.4rem; line-height: 1.8rem; } html.Mobile div.ParsedownHelp .ParsedownHelpBody { margin-left: 0; } div.ParsedownHelp .ParsedownHelpTOC ul { list-style: none; margin: 0; padding: 0; } html.Mobile div.ParsedownHelp .ParsedownHelpTOC div.HelpTOC { margin-top: 0.5rem; } div.ParsedownHelp .ParsedownHelpTOC li ul { margin-left: 0.6rem; } div.ParsedownHelp .ParsedownHelpTOC ul li { margin: 0.6rem; } html.Mobile div.ParsedownHelp .ParsedownHelpTOC ul li { margin-left: 1rem; } div.ParsedownHelp .ParsedownHelpTOC ul li a { text-decoration: none; width: 100%; display: inline-block; } /* Some extra padding between top-level LIs */ div.ParsedownHelp .ParsedownHelpBody h1, div.ParsedownHelp .ParsedownHelpBody h2, div.ParsedownHelp .ParsedownHelpBody h3, div.ParsedownHelp .ParsedownHelpBody h4 { } div.ParsedownHelp .ParsedownHelpBody h1 { margin-top: 3.1rem; padding-top: 3.1rem; border-top: 0.1rem solid var(--colour-Primary5); } div.ParsedownHelp .ParsedownHelpBody div.h1:first-of-type h1 { margin: 0; padding-top: 0; padding-bottom: 0; border:none; } div.ParsedownHelp .ParsedownHelpBody div.h1 p:last-of-type { padding-bottom: 1.6rem; } div.ParsedownHelp .ParsedownHelpBody div.h2 { padding-left: 0rem; padding-bottom: 0rem; } div.ParsedownHelp .ParsedownHelpBody h1 { font-size: 2rem; } div.ParsedownHelp .ParsedownHelpBody h2 { font-size: 1.8rem; } div.ParsedownHelp .ParsedownHelpBody h3 { font-size: 1.6rem; } div.ParsedownHelp .ParsedownHelpBody h4 { font-size: 1.4rem; } div.ParsedownHelp .ParsedownHelpBody p { padding-left: 0.9rem; } div.ParsedownHelpBody img { padding: 0.2rem 0.3rem; border: 0.1rem solid var(--colour-Primary4); display: block; margin-left: 1.3rem; } div.ParsedownHelp .ParsedownHelpBody li { margin: 0.3rem 0; } div.ParsedownHelp .ParsedownHelpBody ol li { margin: 0.5rem 0; } /* End of include: help/quickstart */ /*** * Including file: loginRegister */ html.page_demologin .TopInfo { font-size: 1.4em; } html.page_demologin .TopInfo h1 { font-size: 1.6em; } html.page_demologin .ButtonBar .Button { } html.Mobile.page_demologin .ButtonBar .Button { } html.page_login .Wrap.login { padding: 1rem; } html.page_mobile_login div.LoginBox.Login h1, html.page_login div.LoginBox.Login h1 { } html.page_mobile_login div.LoginBox.Login, html.page_login div.LoginBox.Login { } html.page_demologin .Wrap.demologin { padding: 1rem; } .LoginRegister { margin: 1rem; } .LoginRegister h1 { font-weight: normal; } .LoginBox a.ForgotPasswordLink { margin: 1rem 0 0 0; } html.page_demologin .LoginRegister { margin-left: 0; } html.page_customerloginregister .LoginRegisterBox { margin-top: 2rem; } html.Mobile .LoginRegister { margin-top: 2rem; margin-left: 1rem; } html.Mobile .LoginRegister.ButtonBar { text-align: center; } html.Mobile .LoginRegister.ButtonBar .Button:first-of-type { margin-right: 2em; } .LoginRegisterBox { display: inline-block; margin: 0; vertical-align: top; } .LoginRegisterBox h1 { font-weight: normal; margin: 0 0 0.9rem 0; } .LoginRegisterBox form { margin-left: 1rem; } /* FIXME: Move these to commonforms */ .LoginRegisterBox form div.ErrorsArea { display: none; margin: 0; padding: 0; } .LoginRegisterBox form div.ErrorsArea.FormErrs { display: inline-block; } .LoginRegisterBox form div.ErrorsArea ul { margin: 0; padding: 0; display: inline-block; margin: 0 0 1rem 0; } .LoginRegisterBox form div.ErrorsArea li { text-align: left; margin: 0; padding: 0; font-weight: normal; } .LoginRegisterBox.Register form label.CheckboxItem > *{ vertical-align: middle; } .LoginRegisterBox.Register form label.CheckboxItem span.Checkbox { width: 9.4rem; text-align: right; margin-right: 1.3rem; } .LoginRegisterBox.Register form label.CheckboxItem span.Text { width: 11.3rem; text-align: left; } .LoginRegisterBox.Register form label.CheckboxItem input { width: auto; } .LoginRegisterBox.Register label.SelectClinic { margin: 1rem 0; } .LoginRegisterBox.Register label.Submit { width: 20rem; margin: 2rem 0 0 0; } .LoginRegisterBox p.MBookDisclaimer { width: 20rem; text-align: left; padding: 0; margin: 0; } .LoginRegisterBox p.MBookDisclaimer strong { font-weight: normal; } .LoginRegisterBox label.RegEmailMarketingContact { padding: 1.3rem 0; } .LoginRegisterBox label.RegEmailMarketingContact span { display: inline-block; max-width: 20rem; } .LoginRegisterBox label.RegEmailMarketingContact input { width: auto; } a.ForgotPasswordLink { display: block; text-decoration: none; } .LoginRegisterBox.Hidden { display: none; } div.Dialog div.RegisterBox fieldset { width: 22rem; margin-bottom: 2rem; display: inline-block; vertical-align: top; min-height: 32rem; margin-top: 1rem; margin-right: 1rem; } div.Dialog div.RegisterBox fieldset:last-of-type { margin-bottom: none; margin-right: 0; } /* End of include: loginRegister */ /*** * Including file: pointAndHover */ /* Colours and transitions of things as they * become active, focussed, pointed at. * * Copied from WIT and adapted for this skin. */ /* #.IsPointable:hover, #a:hover, #select:hover, #label:hover { # color: #968324 !important; # transition: color .5s ease; # } */ .IsPointable:hover { cursor: pointer; } input, select, span.StripeElement { color: #4B3E00; border: 1px solid #4B3E00; } span.StripeElement { width: 10.7rem; background: white; display: inline-block; } input:hover, select:hover { /* border: 0.1rem solid #FFFAE3;*/ /* transition: border .5s ease;*/ } input:focus, select:focus { outline: none; /* transition: background-color 1s ease;*/ } /* End of include: pointAndHover */ /*** * Including file: topMenu */ html.NotLoggedIn ul.TopMenu { line-height: 2.5rem; margin-bottom: 1rem; margin-left: 0em; } ul.TopMenu { display: inline-block; margin: 0.3rem 0 0rem 0rem; padding: 0; list-style: none; border-bottom: none; position: relative; } html.NotLoggedIn ul.TopMenu { margin-top: 1rem; } html.Desktop.LoggedIn ul.TopMenu { ## bottom: 0.5rem; } html.Mobile ul.TopMenu { margin-left: 0.2rem; } ul.TopMenu>li { display: inline-block; position: relative; margin: 0 1em 0 1em; font-size: 1.1em; padding: 0.2rem 0.5rem; } ul.TopMenu>li:first-of-type { margin-left: 0; padding-left: 0; } html.Mobile ul.TopMenu>li { margin: 0 0.5em 0 0.6em; } html.NotLoggedIn ul.TopMenu>li { padding: 0; } ul.TopMenu>li.Active { border: 0.15rem solid var(--colour-Primary3); } ul.TopMenu>li>a { display: inline-block; height: 100%; width: 100%; } ul.TopMenu>li img { margin: 0 0.4rem 0 0; vertical-align: middle; display: inline-block; padding-left: 0rem; width: 2rem; } ul.TopMenu>li img.Hidden { margin: 0; padding: 0; display: none; } ul.TopMenu>li span { vertical-align: middle; display: inline-block; } /* End of include: topMenu */ /*** * Including file: topSubMenu */ ul.TopMenu ul.SubMenu { list-style: none; width: 17rem; margin: 0; padding: 0; margin-top: 0.1rem; z-index: 100; margin-left: -0.6rem; margin-left: -0.2rem; padding: 0.5rem 0rem 0rem 0rem; position: absolute; } ul.TopMenu ul.SubMenu>li { padding: 0.5rem 0.3rem 0.7rem 1rem; } ul.TopMenu ul.SubMenu>li a { text-decoration: none; } ul.TopMenu li.HasSubMenu { position: relative; overflow: visible; cursor: pointer; } ul.SubMenu.Visible { display: block !important; } ul.SubMenu { position: relative; margin: 0; padding: 0; list-style: none; } ul.SubMenu li { margin: 0; Padding: 0; } body.Mobile ul.SubMenu { margin: 0; padding-bottom: 1rem; } body.Mobile ul.SubMenu li:last-of-type { padding-bottom: 0; } /* End of include: topSubMenu */ /*** * Including file: userMenu */ div.UserMenu>h1 { margin: 0; padding: 0; display: inline-block; box-sizing: border-box; height: 100%; padding-top: 0.5rem; text-align: right; font-weight: normal; font-size: 1.2rem; } html.Mobile div.UserMenu>h1 { padding-top: 0.1rem; font-size: 1.5rem; } div.UserMenu>h1 span.Label { display: inline-block; margin: 0 0 0 0.2rem; text-align: right; position: relative; vertical-align: middle; } html.Mobile div.UserMenu>h1 span.Label { vertical-align: middle; } div.UserMenu>h1:hover { cursor: pointer; } div.UserMenu>h1.Active { cursor: pointer; } div.UserMenu>h1 span.Icon { display: inline-block; width: 1.5rem; height: 1.5rem; background-position: 0 0; background-repeat: no-repeat; background-image: url("https://m-booksystems.co.uk/app/Apps_img/v/ff9106af5ff342a37bdfa347c2da0e4f/img/iconset%253Amenu.svg/repl/Secondary2"); background-size: 1.5rem auto; margin-right: 0.4rem; position: relative; vertical-align: middle; } html.Mobile div.UserMenu ul.SubMenu { padding-left: 2rem; width: 100%; } div.UserMenu ul.UserMenu { display: none; margin: 0; padding: 0 0 0 0.3rem; box-sizing: border-box; /* Fixed, otherwise it has to respect its parent's Overflow:hidden */ position: fixed; right: 0; z-index: 10; list-style: none; text-align: left; padding-top: 0.6rem; } div.UserMenu ul.UserMenu li { white-space: nowrap; vertical-align: middle; overflow: hidden; } div.UserMenu ul.UserMenu li img { display: inline-block; vertical-align: middle; margin-right: 0.5rem; width: 1.5rem; height: 1.5rem; } div.UserMenu ul.UserMenu li span { display: inline-block; vertical-align: middle; } div.UserMenu ul.UserMenu li a { padding: 0.5rem 0.3rem 0.7rem 0.6rem; text-decoration: none; display: block; width: 100%; height: 100%; font-size: 1rem; } body.Mobile div.UserMenu ul.UserMenu { border: none; } /* End of include: userMenu */ /*** * Including file: customers/regSuccess */ div.registrationsuccessful { display: inline-block; margin: 0.6rem; vertical-align: top; } div.registrationsuccessful h1 { font-weight: normal; } div.registrationsuccessful strong { font-size: 1.2rem; padding-left: 0.6rem; } /* End of include: customers/regSuccess */ /*** * Including file: termsandconditions */ html.page_termsandconditions div.ParsedownHelpTOC, html.page_cookiepolicy div.ParsedownHelpTOC { display: none; } html.page_termsandconditions div.ParsedownHelpBody, html.page_cookiepolicy div.ParsedownHelpBody { margin: 0; padding: 1.5rem 1rem; } /* End of include: termsandconditions */ /*** * Including file: contactUs */ form.ContactUsForm input[type='text'] { height: 2em; width: 600px; } form.ContactUsForm input[name='ContactUsSubject'] { } form.ContactUsForm textarea[name='ContactUsMessage'] { height: 15rem; width: 600px; } html.Mobile form.ContactUsForm input[name='ContactUsSubject'], html.Mobile form.ContactUsForm textarea[name='ContactUsMessage'] { margin-top: 0.3rem; } html.Mobile form.ContactUsForm .WITWidget { margin-top: 1.3rem; } @media (width < 576px) { form.ContactUsForm textarea[name='ContactUsMessage'], form.ContactUsForm input[type='text'] { width: 280px; } form.ContactUsForm input[type='submit'] { width: 280px; } } /* End of include: contactUs */ /*** * Including file: site/forms */ form label { display: block; margin: 0.3rem 0 0.6rem 0; } form label>* { vertical-align: middle; } form b.ValErr { display: block; font-weight: bold; color: red; text-align: center; margin: 0.3rem; } form label>span { display: inline-block; } /* End of include: site/forms */ /*** * Including file: site/products */ html.Site main ul.ProductsList { list-style: none; padding: 0; } html.Site main ul.ProductsList li.ProductBlock { padding: 0 0 4rem 0; display: block; ## padding-right: 4rem; } html.Site main li.ProductBlock ul.ProductFeatures { margin: 0; list-style: none; padding: 0rem 0 1rem 2rem; } html.Site main li.ProductBlock ul.ProductFeatures li { padding: 0 0 0.5rem 1rem; list-style-position: outside; list-style-type: "\2713"; } html.Site main li.ProductBlock ul.ProductFeatures li.No { list-style-type: "\2715"; } html.Site main li.ProductBlock form.BuyProduct { margin: 0; } html.Site main ul.ProductsList li.ProductBlock p.ProductInfo span.Spacer { display: block; height: 1rem; } html.Site main ul.ProductsList li.ProductBlock form.BuyProduct input.Button.Buy { width: 20rem; height: 3rem; padding-left: 0; } /* End of include: site/products */ /*** * Including file: site/features */ html.Site.page_product-features main header { padding: 0; } html.Site.page_product-features main header h2 { font-size: 2rem; padding: 0rem 0; } html.Site main ul.Features { margin: 0; padding: 0; list-style: none; } html.Site main ul.Features li.FeatureBlock { margin: 0; padding: 4rem; } html.Site main ul.Features li.FeatureBlock h2 { padding-bottom: 0.8rem; } html.Site main ul.Features li:nth-child(even) { background: var(--colour-WebsiteBackground); margin: 0; } html.Site main ul.Features li.FeatureBlock { overflow: hidden; } html.Site main ul.Features li.FeatureBlock img.Marker { float: left; } html.Site main ul.Features li.FeatureBlock div.FeatureContents { padding-left: 14rem; vertical-align: middle; } /* End of include: site/features */ /*** * Including file: site/checkout */ html.Site .Checkout h1 { font-weight: normal; font-weight: 600; } html.Site .CheckoutBlock { background: var(--colour-WebsiteBackgroundTwo); padding: 1rem; } html.Site .CheckoutBlock:nth-child(even) { background: var(--colour-WebsiteBackground); } html.Site .Checkout form.EditCheckoutProduct fieldset { display: inline-block; padding: 1rem 2rem; vertical-align: top; margin-right: 4rem; min-height: 31rem; } html.Site .Checkout form.EditCheckoutProduct fieldset:first-of-type { margin-bottom: 2rem; } html.Site .Checkout form.EditCheckoutProduct input.Save.Button { display: block; margin: 2rem 0; width: 52.6rem; } html.Site .Checkout div.CheckoutBlock.Basket p.StrongItem strong.Legend { width: 18rem; } html.Site .Checkout div.CheckoutBlock.Basket p.StrongItem.Total { margin-top: 0.8rem !important; } html.Site .Checkout div.CheckoutBlock label.PasswordStrengthIndicator span.Widget { border: 1px solid #110533; padding: 0; } html.Site .Checkout .ProductConfigSummary .ContentBlock { display: inline-block; width: 30rem; vertical-align: top; } html.Site .Checkout .ProductConfigSummary p.StrongItem span.Legend { display: inline-block; width: 16rem; } html.Site .Checkout form.PaymentDetails input[type='text'], html.Site .Checkout span.StripeElement { width: 20rem; height: 2rem; padding: 0.5rem; font-size: 1rem; } html.Site .Checkout span.StripeElement .InputElement { color: black; } html.Site .Checkout form.PaymentDetails p.Terms { width: 20rem; text-align: center; } html.Site .Checkout form.PaymentDetails label.Terms { text-align: left; } html.Site .Checkout form.PaymentDetails label.Terms input { width: 1rem; height: 1rem; display: inline-block; margin-right: 1rem; } html.Site .Checkout form.PaymentDetails label.Submit { display: block; text-align: left; margin: 2rem 0; } html.Site .Checkout form.PaymentDetails label.Submit input.Submit.Button { width: 20rem; } @media (width < 960px) { html.Site .Checkout form.EditCheckoutProduct fieldset { min-height: auto; } html.Site .Checkout form.EditCheckoutProduct input.Save.Button { width: 24.3rem; } } @media (width < 576px) { html.Site .Checkout form.EditCheckoutProduct { margin-left: 0; } html.Site .Checkout form.EditCheckoutProduct fieldset { margin-right: 0; } html.Site .Checkout form.EditCheckoutProduct fieldset select, html.Site .Checkout form.EditCheckoutProduct fieldset .PasswordStrengthIndicator, html.Site .Checkout form.EditCheckoutProduct fieldset .PasswordStrengthIndicator .Widget, html.Site .Checkout form.EditCheckoutProduct fieldset input[type='text'], html.Site .Checkout form.EditCheckoutProduct fieldset input[type='password'] { width: 17rem; } html.Site .Checkout form.EditCheckoutProduct input.Save.Button { width: 21.3rem; } html.Site .Checkout .ProductConfigSummary .ContentBlock { width: auto; } html.Site .Checkout .ProductConfigSummary .ContentBlock p.StrongItem { margin: 1rem 0 0 1rem !important; } html.Site .Checkout .ProductConfigSummary .ContentBlock p.StrongItem>strong { display: block; margin-left: 2rem; } html.Site .Checkout form.PaymentDetails label.Terms>span { width: 17rem; line-height: 1.5rem; } } /* End of include: site/checkout */ /*** * Including file: site/skin */ html.Site .Strong { font-weight: bold; } html.Site main { margin:0; padding:0; } html.Site main p { line-height: 2rem; } html.Site main * { color: var(--colour-Primary5); } html.Site main header, html.Site main section { background: var(--colour-WebsiteBackgroundTwo); padding: 0rem 2rem 2rem 1.6rem; margin: 0; } html.Site main section { padding-top: 1rem; } /* Section Colours */ html.Site section:nth-child(even) { background: var(--colour-WebsiteBackground); } /* /Section Colours */ html.Site main header h2, html.Site main section h2 { margin: 0; padding: 1rem 0; } html.Site main header p.TopStrap, html.Site main header h2, html.Site main section h2 { font-size: 1.8rem; text-align: left; margin: 0; padding: 1.8rem 0; font-weight: normal; } html.Site main header p.TopStrap { font-size: 1.8rem; line-height: 2.4rem; } html.Site main header h1.MainHeading { line-height: 1.8rem; font-weight: 600; padding: 1rem 0; } html.Site main header span.HeaderBlurb { display: block; } html.Site main header span.HeaderBlurb h1, html.Site p, html.Site main, html.Site main p, html.Site main section p, html.Site main header span.HeaderBlurb p { font-size: 1rem; } /* Footer */ html.Site footer { font-size: 1rem; padding: 2rem; background: var(--colour-Primary5); background: var(--colour-Primary4); color: var(--colour-Primary1); overflow: hidden; } html.Site footer * { color: var(--colour-Primary1); } html.Site footer div.Logo, html.Site footer div.FooterLinks { display: inline-block; vertical-align: top; } html.Site footer div.Logo { max-width: 40%; } html.Site footer div.Logo a.Logo { text-decoration: none; font-size: 1.5rem; color: white; } html.Site footer div.Logo p { line-height: 1.5rem; } html.Site footer div.FooterLinks { float: right; } html.Site footer div.FooterLinks .LinkList { display: inline-block; vertical-align: top; padding: 0 0 0 3rem; margin: 0; list-style: none; } html.Site footer div.FooterLinks .LinkList:first-of-type { padding-left: 0; } html.Site footer div.FooterLinks .LinkList a { text-decoration: none; } html.Site section.TopSpeedTour video { width: 60rem; } html.Site footer div.FooterLinks .LinkList li { line-height: 1.8rem; } html.Site footer div.FooterLinks .LinkList li.ColTitle { padding-bottom: 1rem; font-size: 1.1rem; color: white; } html.Site ul.MyList { margin: 0 0 0 2rem; padding: 0; } html.Site ul.MyList li { list-style-position: outside; list-style-type: "\21D2"; padding-left: 0.5rem; } html.Site.page_login main input.Login { margin-top: 2rem; } html.Mobile.page_login main input.Login { width: 100%; } html.Mobile.page_login main a.ForgotPasswordLink { text-align: center; } html.Mobile.mobile_forgotpassword input.Submit { width: 100%; } html.Site div.ForgotPassword div.LoginRegisterBox { max-width: 430px; } html.Site main p.Error { padding: 1rem; } html.Site main div.ContactUs { padding: 1rem; } html.Site form.ContactUsForm .ValErr { text-align: left; margin-bottom: 2rem; } /* Desktop, > 10inches */ @media (width > 960px) { html { font-size: 18px; } // div.Header div.Logo { // display: inline-block; // box-sizing: border-box; // text-align: left; // margin-right: 5em; // } } /* Tablets/screens, less than 10inches */ @media (width < 960px) { html { font-size: 16px; } html.NotLoggedIn ul.TopMenu { text-align: center; font-size: 1rem; width: 100%; } html.NotLoggedIn ul.TopMenu li { text-align: center; margin: 0 1.2rem 0 1.2rem; } html div.Header div.Logo { display: block; text-align: center; margin:0; padding: 0; } html.NotLoggedIn ul.TopMenu ul.SubMenu { width: 130vw; left: 0; margin-left: -1.25em; } html.NotLoggedIn ul.TopMenu>li { position: unset; } html.Site main ul.ProductsList li.ProductBlock form.BuyProduct input.Button.Buy { width: 100%; } } /* Phones */ @media (width < 576px) { html { font-size: 14px; } /* Fix to stop browsers from auto-adjusting from small font-size. * I'm not using that small a font size, but this "feature" was * somehow making font-size different between areas of the screen! */ body, main header, main section, html.NotLoggedIn body header, div.CheckoutBlock, html.Site div.CheckoutSuccess { max-height: 999999px; } html.NotLoggedIn ul.TopMenu li { margin: 0 0.5em 0 0.5em; } html.Site main ul.Features li.FeatureBlock img.Marker { width: 4rem; padding-top: 0.3rem; } html.Site main ul.Features li.FeatureBlock div.FeatureContents { padding-left: 5rem; } html.Site main ul.Features li.FeatureBlock { padding: 1rem; } html.Site main ul.Features li.FeatureBlock h2 { font-size: 1.5rem; padding-top: 1.2rem; } html.Site footer div.Logo { max-width: 100%; } html.Site footer div.FooterLinks { float: none; display: block; } html.Site footer div.FooterLinks .LinkList { padding-left: 0; display: block; } } /* End of include: site/skin */ /*** * Including file: loginRegister */ html.page_demologin .TopInfo { font-size: 1.4em; } html.page_demologin .TopInfo h1 { font-size: 1.6em; } html.page_demologin .ButtonBar .Button { } html.Mobile.page_demologin .ButtonBar .Button { } html.page_login .Wrap.login { padding: 1rem; } html.page_mobile_login div.LoginBox.Login h1, html.page_login div.LoginBox.Login h1 { } html.page_mobile_login div.LoginBox.Login, html.page_login div.LoginBox.Login { } html.page_demologin .Wrap.demologin { padding: 1rem; } .LoginRegister { margin: 1rem; } .LoginRegister h1 { font-weight: normal; } .LoginBox a.ForgotPasswordLink { margin: 1rem 0 0 0; } html.page_demologin .LoginRegister { margin-left: 0; } html.page_customerloginregister .LoginRegisterBox { margin-top: 2rem; } html.Mobile .LoginRegister { margin-top: 2rem; margin-left: 1rem; } html.Mobile .LoginRegister.ButtonBar { text-align: center; } html.Mobile .LoginRegister.ButtonBar .Button:first-of-type { margin-right: 2em; } .LoginRegisterBox { display: inline-block; margin: 0; vertical-align: top; } .LoginRegisterBox h1 { font-weight: normal; margin: 0 0 0.9rem 0; } .LoginRegisterBox form { margin-left: 1rem; } /* FIXME: Move these to commonforms */ .LoginRegisterBox form div.ErrorsArea { display: none; margin: 0; padding: 0; } .LoginRegisterBox form div.ErrorsArea.FormErrs { display: inline-block; } .LoginRegisterBox form div.ErrorsArea ul { margin: 0; padding: 0; display: inline-block; margin: 0 0 1rem 0; } .LoginRegisterBox form div.ErrorsArea li { text-align: left; margin: 0; padding: 0; font-weight: normal; } .LoginRegisterBox.Register form label.CheckboxItem > *{ vertical-align: middle; } .LoginRegisterBox.Register form label.CheckboxItem span.Checkbox { width: 9.4rem; text-align: right; margin-right: 1.3rem; } .LoginRegisterBox.Register form label.CheckboxItem span.Text { width: 11.3rem; text-align: left; } .LoginRegisterBox.Register form label.CheckboxItem input { width: auto; } .LoginRegisterBox.Register label.SelectClinic { margin: 1rem 0; } .LoginRegisterBox.Register label.Submit { width: 20rem; margin: 2rem 0 0 0; } .LoginRegisterBox p.MBookDisclaimer { width: 20rem; text-align: left; padding: 0; margin: 0; } .LoginRegisterBox p.MBookDisclaimer strong { font-weight: normal; } .LoginRegisterBox label.RegEmailMarketingContact { padding: 1.3rem 0; } .LoginRegisterBox label.RegEmailMarketingContact span { display: inline-block; max-width: 20rem; } .LoginRegisterBox label.RegEmailMarketingContact input { width: auto; } a.ForgotPasswordLink { display: block; text-decoration: none; } .LoginRegisterBox.Hidden { display: none; } div.Dialog div.RegisterBox fieldset { width: 22rem; margin-bottom: 2rem; display: inline-block; vertical-align: top; min-height: 32rem; margin-top: 1rem; margin-right: 1rem; } div.Dialog div.RegisterBox fieldset:last-of-type { margin-bottom: none; margin-right: 0; } /* End of include: loginRegister */ /*** * Including file: site/loginRegister */ .Wrap.demologin { margin: 1rem; } .demologin label.Submit { width: 100%; text-align: center; margin: 0; padding: 0; } .demologin span.Submit { padding: 0; } .demologin form.EditCheckoutProduct input[type='submit'], .demologin form[name='LoginForm'] span.Submit, .demologin form[name='LoginForm'] input[type='submit'] { width: 100% !important; display: inline-block; position: relative; } .LoginRegister { text-align: left; } .LoginRegisterBox { display: inline-block; margin: 0.6rem; padding: 0.6rem; border: 0.1rem solid var(--colour-Primary3); border-radius: 0.3rem; vertical-align: top; background: var(--colour-Primary1); } .ForgotPassword { margin-bottom: 4rem; } .LoginRegisterBox div.ErrorsArea.FormErrs li { color: red !important; padding-top: 0.6rem; } .LoginRegisterBox.Login { margin-right: 2.5rem; } .LoginRegisterBox form label { margin: 0.3rem; } .LoginRegisterBox form label span { display: inline-block; } .LoginRegisterBox form div.ErrorsArea { width: 18.8rem; margin-left: auto; margin-right: auto; } .LoginRegisterBox form div.ErrorsArea li { text-align: center; } .LoginRegisterBox.Register form label span { } .LoginRegisterBox.Register form label.CheckboxItem > *{ vertical-align: middle; } .LoginRegisterBox.Register form label.CheckboxItem span.Checkbox { width: 9.4rem; text-align: right; margin-right: 1.3rem; } .LoginRegisterBox.Register form label.CheckboxItem span.Text { width: 11.3rem; text-align: left; } .LoginRegisterBox.Register form label.CheckboxItem input { width: auto; } .LoginRegisterBox form input.Submit, .LoginRegisterBox form span.Submit { width: 20rem; margin-left: auto; margin-right: auto; font-weight: bold; } html.Mobile .LoginRegisterBox form input, html.Mobile .LoginRegisterBox form span.Submit { width: 17rem; } .LoginRegisterBox form input, .LoginRegisterBox form select { display: inline-block; } .LoginRegisterBox form input[type='submit'] { margin-top: 0.6rem; } .LoginRegisterBox p.MBookDisclaimer { width: 18.8rem; text-align: center; margin-left: auto; margin-right: auto; } .LoginRegisterBox a { color: var(--colour-Primary5); } .LoginRegisterBox b.ValErr { max-width: 12.5rem !important; } /* End of include: site/loginRegister */ /*** * Including file: mobile/help/quickstart */ /* End of include: mobile/help/quickstart */ /*** * Including file: site/demosystem */ html.Site div.DemoInfo { } html.Site div.DemoInfo button { margin: 0 1rem 1rem 0; } /* End of include: site/demosystem */ /*** * Including file: site/videos */ html.page_products video { width: 70vw; height: auto; } html.page_demologin div.DemoVideos { padding-bottom: 5rem; text-align: center; } html.page_demologin div.DemoVideos>h1 { text-align: center; margin: 2rem 0 0 0; padding: 2rem 0 2rem 0; border-top: 1px solid #aaaaaa; } html.page_demologin div.VideoContainer { display: inline-block; text-align: center; padding: 1rem; } html.page_demologin div.VideoContainer h1 { font-size: 1.2rem; margin: 1rem 0 0 0; padding: 0; } html.page_demologin div.VideoContainer p { font-size: 1rem; } html.page_demologin div.VideoContainer video { width: 30rem; height: auto; } /* End of include: site/videos */