From 74db30a88760a3d201c71fae52d0d89ae0f7603d Mon Sep 17 00:00:00 2001 From: Anonymous Contributor Date: Fri, 15 Sep 2023 14:39:21 +0200 Subject: [PATCH] Optimize CSS structure and readability --- css/cookiebanner.css | 210 ++++++++++ css/footer.css | 213 +++++++++++ css/header.css | 0 css/load-animation.css | 27 ++ css/page.css | 846 +++++++++++++++++++++++++++++++++++++++++ css/print.css | 5 +- css/text.css | 839 ++++++++++++++++++++++++++++++---------- css/tip.css | 19 + 8 files changed, 1955 insertions(+), 204 deletions(-) create mode 100644 css/cookiebanner.css create mode 100644 css/footer.css create mode 100644 css/header.css create mode 100644 css/load-animation.css create mode 100644 css/page.css create mode 100644 css/tip.css diff --git a/css/cookiebanner.css b/css/cookiebanner.css new file mode 100644 index 0000000..9b182be --- /dev/null +++ b/css/cookiebanner.css @@ -0,0 +1,210 @@ +#cookie-law-message { + background-color: rgba(40, 40, 40, 1); + color: rgba(255, 255, 255, 1); + font: normal normal normal 11pt; + font-family: 'Unica One', sans-serif; + padding: 3px 4px; +} + +#cookie-law-message .splashContent { + padding: 20px; +} + +#cookie-law-message .imClose { + display: inline-block; + position: relative; + top: 0; + right: 0; + margin: 5px 0 5px 20px; +} + +#cookie-law-message .imCloseInn { + display: inline-block; + padding: 8px 10px; + text-align: center; + border-radius: 4px; + cursor: pointer; + background-color: rgba(204, 204, 204, 1); + color: rgba(106, 168, 79, 1); +} + +#cookie-law-message .imCloseInn:hover { + opacity: 0.8; +} + +#cookie-law-message .message-container .wrapper-content>div { + display: inline-block; +} + +#cookie-law-message div { + line-height: 28px; +} + +#cookie-law-message .imHeading1 { + line-height: 28px; +} + +#cookie-law-message .imHeading2 { + line-height: 28px; +} + +#cookie-law-message .imHeading3 { + line-height: 28px; +} + +#cookie-law-message .imHeading4 { + line-height: 28px; +} + +#cookie-law-message .imHeading5 { + line-height: 28px; +} + +#cookie-law-message .imHeading6 { + line-height: 28px; +} + +#cookie-law-message ul { + list-style: disc; + margin: 0; + padding: 0; + overflow: hidden; +} + +#cookie-law-message ul ul { + list-style: square; + padding: 0 0 0 20px; +} + +#cookie-law-message ul ul ul { + list-style: circle; +} + +#cookie-law-message ul li { + margin: 0 0 0 40px; + padding: 0px; +} + +#cookie-law-message ol { + list-style: decimal; + margin: 0; + padding: 0; +} + +#cookie-law-message ol ol { + list-style: lower-alpha; + padding: 0 0 0 20px; +} + +#cookie-law-message ol li { + margin: 0 0 0 40px; + padding: 0px; +} + +#cookie-law-message blockquote { + margin: 0 0 0 15px; + padding: 0; + border: none; +} + +#cookie-law-message table { + border: none; + padding: 0; + border-collapse: collapse; +} + +#cookie-law-message table td { + border: 1px solid black; + word-wrap: break-word; + padding: 4px 3px 4px 3px; + margin: 0; + vertical-align: middle; +} + +#cookie-law-message p { + margin: 0; + padding: 0; +} + +#cookie-law-message .inline-block { + display: inline-block; +} + +#cookie-law-message sup { + vertical-align: super; + font-size: smaller; +} + +#cookie-law-message sub { + vertical-align: sub; + font-size: smaller; +} + +#cookie-law-message img { + border: none; + margin: 0; + vertical-align: text-bottom; +} + +#cookie-law-message .fleft { + float: left; + vertical-align: baseline; +} + +#cookie-law-message .fright { + float: right; + vertical-align: baseline; +} + +#cookie-law-message img.fleft { + margin-right: 15px; +} + +#cookie-law-message img.fright { + margin-left: 15px; +} + +#cookie-law-message .imTALeft { + text-align: left; +} + +#cookie-law-message .imTARight { + text-align: right; +} + +#cookie-law-message .imTACenter { + text-align: center; +} + +#cookie-law-message .imTAJustify { + text-align: justify; +} + +#cookie-law-message .imUl { + text-decoration: underline; +} + +#cookie-law-message .imStrike { + text-decoration: line-through; +} + +#cookie-law-message .imUlStrike { + text-decoration: underline line-through; +} + +#cookie-law-message .imVt { + vertical-align: top; +} + +#cookie-law-message .imVc { + vertical-align: middle; +} + +#cookie-law-message .imVb { + vertical-align: bottom; +} + +#cookie-law-message hr { + border-width: 1px 0 0 0; + border-style: solid; +} \ No newline at end of file diff --git a/css/footer.css b/css/footer.css new file mode 100644 index 0000000..671df10 --- /dev/null +++ b/css/footer.css @@ -0,0 +1,213 @@ +#imFooter_imTextObject_02 { + position: relative; + -ms-grid-row-align: start; + align-self: start; + -ms-grid-column-align: center; + justify-self: center; + max-width: 100%; + box-sizing: border-box; + z-index: 3; + padding-top: 0px; + padding-bottom: 0px; + padding-left: 0px; + padding-right: 0px; +} + +#imFooter_imObjectImage_04 { + position: relative; + -ms-grid-row-align: start; + align-self: start; + -ms-grid-column-align: center; + justify-self: center; + max-width: 100%; + box-sizing: border-box; + z-index: 3; + vertical-align: top; + font-size: 0; + margin: 0 auto; + padding-top: 0px; + padding-bottom: 0px; + padding-left: 0px; + padding-right: 0px; +} + +#imFooter_imObjectImage_04 #imFooter_imObjectImage_04_container img { + width: 100%; + height: auto; + vertical-align: top; +} + +#imFooter_imTextObject_02 .text-container { + border-width: 0 1px 1px 1px; + box-sizing: border-box; + width: 100%; +} + +#imFooter_imObjectImage_04_wrapper img { + -webkit-clip-path: inset(0 0 0% 0); + clip-path: inset(0 0 0% 0); + width: 100%; + height: 100%; +} + +#imFooterBg { + position: absolute; + left: 0; + bottom: 0; + width: 100%; + background-image: none; + background-color: rgba(67, 67, 67, 1); +} + +#imFooter { + background-image: none; + background-color: transparent; + display: block; + -ms-grid-column: 1; + -ms-grid-column-span: 3; + grid-column: 1 / 4; + -ms-grid-row: 3; + -ms-grid-row-span: 1; + grid-row: 3 / 4; +} + +#imFooterObjects .text-inner { + color: rgb(243, 243, 243); + text-align: right; +} + +.under-720 { + display: none; +} + +.over-720 { + display: block; +} + +@media (max-width: 719.9px) { + .under-720 { + display: block; + } + + .over-720 { + display: none; + } + + #imFooterObjects .under-720 { + height: 40px; + } + + #imFooter_imObjectImage_04_wrapper { + width: 40px; + height: 40px; + } +} + +#imFooter_imTextObject_02_wrapper { + margin-left: auto; + text-align: center; + z-index: 1002; + overflow: hidden; + margin-right: 6px; +} + +#imFooter_imObjectImage_04_wrapper { + z-index: 1002; + overflow: hidden; +} + +@media (min-width: 1150.0px) { + #imFooter_imObjectImage_04_wrapper { + width: 60px; + height: 60px; + } + + #imFooterBg { + height: 70px; + } + + #imFooterObjects { + margin-left: auto; + margin-right: auto; + position: relative; + height: 70px; + width: 1150px; + } +} + +@media (max-width: 1149.9px) and (min-width: 720.0px) { + #imFooter_imObjectImage_04_wrapper { + width: 55px; + height: 55px; + } + + #imFooterBg { + height: 60px; + } + + #imFooterObjects { + margin-left: auto; + margin-right: auto; + position: relative; + height: 60px; + width: 720px; + } + + #imFooter { + display: block; + -ms-grid-column: 1; + -ms-grid-column-span: 3; + grid-column: 1 / 4; + -ms-grid-row: 3; + -ms-grid-row-span: 1; + grid-row: 3 / 4; + } +} + +@media (max-width: 719.9px) and (min-width: 480.0px) { + #imFooterBg { + height: 50px; + } + + #imFooterObjects { + margin-left: auto; + margin-right: auto; + position: relative; + height: 50px; + width: 480px; + } + + #imFooter { + display: block; + -ms-grid-column: 1; + -ms-grid-column-span: 3; + grid-column: 1 / 4; + -ms-grid-row: 3; + -ms-grid-row-span: 1; + grid-row: 3 / 4; + } +} + +@media (max-width: 479.9px) { + #imFooterBg { + height: 50px; + } + + #imFooterObjects { + margin-left: auto; + margin-right: auto; + position: relative; + height: 50px; + width: 320px; + } + + #imFooter { + display: block; + -ms-grid-column: 1; + -ms-grid-column-span: 3; + grid-column: 1 / 4; + -ms-grid-row: 3; + -ms-grid-row-span: 1; + grid-row: 3 / 4; + } +} \ No newline at end of file diff --git a/css/header.css b/css/header.css new file mode 100644 index 0000000..e69de29 diff --git a/css/load-animation.css b/css/load-animation.css new file mode 100644 index 0000000..342d812 --- /dev/null +++ b/css/load-animation.css @@ -0,0 +1,27 @@ +.imLoadAnim { width: 32px; height: 32px; position: absolute; margin: auto; top: 0; bottom: 0; left: 0; right: 0;} +.imLoadAnim .imLoadCircle { width: 100%; height: 100%; position: absolute; left: 0; top: 0;} +.imLoadAnim .imLoadCircle:before { content: ''; display: block; margin: 0 auto; width: 15%; height: 15%; background-color: #333; border-radius: 100%; -webkit-animation: imLoadCircleFadeDelay 1.2s infinite ease-in-out both; animation: imLoadCircleFadeDelay 1.2s infinite ease-in-out both;} +.imLoadAnim .imLoadCircle2 { -webkit-transform: rotate(30deg); -ms-transform: rotate(30deg); transform: rotate(30deg);} +.imLoadAnim .imLoadCircle3 { -webkit-transform: rotate(60deg); -ms-transform: rotate(60deg); transform: rotate(60deg);} +.imLoadAnim .imLoadCircle4 { -webkit-transform: rotate(90deg); -ms-transform: rotate(90deg); transform: rotate(90deg);} +.imLoadAnim .imLoadCircle5 { -webkit-transform: rotate(120deg); -ms-transform: rotate(120deg); transform: rotate(120deg);} +.imLoadAnim .imLoadCircle6 { -webkit-transform: rotate(150deg); -ms-transform: rotate(150deg); transform: rotate(150deg);} +.imLoadAnim .imLoadCircle7 { -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg);} +.imLoadAnim .imLoadCircle8 { -webkit-transform: rotate(210deg); -ms-transform: rotate(210deg); transform: rotate(210deg);} +.imLoadAnim .imLoadCircle9 { -webkit-transform: rotate(240deg); -ms-transform: rotate(240deg); transform: rotate(240deg);} +.imLoadAnim .imLoadCircle10 { -webkit-transform: rotate(270deg); -ms-transform: rotate(270deg); transform: rotate(270deg);} +.imLoadAnim .imLoadCircle11 { -webkit-transform: rotate(300deg); -ms-transform: rotate(300deg); transform: rotate(300deg); } +.imLoadAnim .imLoadCircle12 { -webkit-transform: rotate(330deg); -ms-transform: rotate(330deg); transform: rotate(330deg); } +.imLoadAnim .imLoadCircle2:before { -webkit-animation-delay: -1.1s; animation-delay: -1.1s; } +.imLoadAnim .imLoadCircle3:before { -webkit-animation-delay: -1s; animation-delay: -1s; } +.imLoadAnim .imLoadCircle4:before { -webkit-animation-delay: -0.9s; animation-delay: -0.9s; } +.imLoadAnim .imLoadCircle5:before { -webkit-animation-delay: -0.8s; animation-delay: -0.8s; } +.imLoadAnim .imLoadCircle6:before { -webkit-animation-delay: -0.7s; animation-delay: -0.7s; } +.imLoadAnim .imLoadCircle7:before { -webkit-animation-delay: -0.6s; animation-delay: -0.6s; } +.imLoadAnim .imLoadCircle8:before { -webkit-animation-delay: -0.5s; animation-delay: -0.5s; } +.imLoadAnim .imLoadCircle9:before { -webkit-animation-delay: -0.4s; animation-delay: -0.4s;} +.imLoadAnim .imLoadCircle10:before { -webkit-animation-delay: -0.3s; animation-delay: -0.3s;} +.imLoadAnim .imLoadCircle11:before { -webkit-animation-delay: -0.2s; animation-delay: -0.2s;} +.imLoadAnim .imLoadCircle12:before { -webkit-animation-delay: -0.1s; animation-delay: -0.1s;} +@-webkit-keyframes imLoadCircleFadeDelay { 0%, 39%, 100% { opacity: 0; } 40% { opacity: 1; }} +@keyframes imLoadCircleFadeDelay { 0%, 39%, 100% { opacity: 0; } 40% { opacity: 1; } } \ No newline at end of file diff --git a/css/page.css b/css/page.css new file mode 100644 index 0000000..505ff3b --- /dev/null +++ b/css/page.css @@ -0,0 +1,846 @@ +html { + position: relative; + margin: 0; + padding: 0; + height: 100%; +} + +body { + margin: 0; + padding: 0; + text-align: left; + height: 100%; +} + +/* General purpose WSX5's required classes */ +.imClear { visibility: hidden; clear: both; border: 0; margin: 0; padding: 0; } +.imHidden { display: none; } +.imCaptFrame { vertical-align: middle; } +.imAlertMsg { padding: 10px; font: 10pt "Trebuchet MS"; text-align: center; color: #000; background-color: #fff; border: 1px solid; } +.alert { padding: 5px 7px; margin: 5px 0 10px 0; border-radius: 5px; border: 1px solid; font: inherit; } +.alert-red { color: #ff6565; border-color: #ff6565; background-color: #fcc; } +.alert-green { color: #46543b; border-color: #8da876; background-color: #d5ffb3; } +.object-generic-error { display: flex; flex-direction: row; flex-wrap: wrap; justify-content: center; align-items: center; background-color: black; color: white; font-family: 'Unica One'; } +.object-generic-error div { padding: 5px 20px; } +.text-right { text-align: right; } +.text-center { text-align: center; } +.vertical-middle, tr.vertical-middle td { vertical-align: middle; } + +/* Page default */ +#imPage { font: normal normal normal 14pt 'Unica One'; color: rgba(0, 0, 0, 1); background-color: transparent; text-decoration: none; text-align: left; } +.text-tab-content { text-align: left; } +.text-tab-content hr { border-color: rgba(0, 0, 0, 1); } +.dynamic-object-text p { line-height: 28px; } + +/* Page Title */ +#imPgTitle, #imPgTitle a, .imPgTitle, .imPgTitle a { padding-top: 2px; padding-bottom: 2px; margin: 5px 0; font: normal normal bold 12pt 'Marcellus SC'; color: rgba(255, 255, 255, 1); background-color: transparent; text-decoration: none; text-align: left; } +#imPgTitle, .imPgTitle { border-width: 0 0 0 0; border-style: solid; border-color: transparent transparent transparent transparent; } +#imPgTitle.imTitleMargin, .imPgTitle.imTitleMargin { margin-left: 2px; margin-right: 2px; } + +/* Breadcrumb */ +.imBreadcrumb, #imBreadcrumb { display: none; } +.imBreadcrumb, .imBreadcrumb a, #imBreadcrumb, #imBreadcrumb a { padding-top: 2px; padding-bottom: 2px; font: normal normal normal 7pt 'Unica One'; color: rgba(159, 171, 176, 1); background-color: transparent; text-decoration: none; text-align: left; } +.imBreadcrumb, #imBreadcrumb { border-width: 0 0 0 0; border-style: solid; border-color: transparent transparent transparent transparent} +.imBreadcrumb a, .imBreadcrumb a:link, .imBreadcrumb a:hover, .imBreadcrumb a:visited, .imBreadcrumb a:active { color: rgba(159, 171, 176, 1); display: inline-block; } + +/* Links */ +.imAbbr:link { background-color: transparent; color: rgba(255, 0, 0, 1); text-decoration: none; } +.imAbbr:visited { background-color: transparent; color: rgba(61, 40, 17, 1); text-decoration: none; } +.imAbbr:hover, .imAbbr:active { background-color: transparent; color: rgba(193, 203, 206, 1); border-bottom: 1px dotted rgba(193, 203, 206, 1); text-decoration: none; } +#imPage input[type=text], #imPage input[type=password], #imPage input[type=email], #imPage input[type=tel], textarea, span.textarea, #cart-container .user-form select { font: inherit; border-style: solid; border-width: 1px 1px 1px 1px; border-color: rgba(159, 171, 176, 1) rgba(159, 171, 176, 1) rgba(159, 171, 176, 1) rgba(159, 171, 176, 1); background-color: rgba(255, 255, 255, 1); color: rgba(0, 0, 0, 1); border-top-left-radius: 10px; border-top-right-radius: 10px; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px;padding: 5px 5px 5px 5px; box-shadow: none; box-sizing: border-box; } +#imPage input[type=text].captchaInvalid, #imPage input[type=text].mandatoryInvalid, #imPage input[type=password].mandatoryInvalid, #imPage input[type=email].mandatoryInvalid, #imPage input[type=tel].mandatoryInvalid, textarea.mandatoryInvalid, span.textarea.mandatoryInvalid { border-color: red; } +textarea { resize: none; } +#imPage input[type=button], #imPage input[type=submit], #imPage input[type=reset], #imPage button.imButton {padding: 5px 5px 5px 5px; cursor: pointer; font: inherit; background-color: rgba(54, 71, 79, 1); color: rgba(255, 255, 255, 1); border-style: solid; border-width: 0px 0px 0px 0px; border-color: rgba(55, 71, 79, 1) rgba(55, 71, 79, 1) rgba(55, 71, 79, 1) rgba(55, 71, 79, 1); border-top-left-radius: 0px; border-top-right-radius: 0px; border-bottom-left-radius: 0px; border-bottom-right-radius: 0px;box-sizing: content-box; -webkit-appearance: none; } +.search_form input { border-radius: 0; } +input[type=button], input[type=submit], input[type=reset], button { -webkit-appearance: none; } +.pagination-container { text-align: center; margin: 10px 0; box-sizing: border-box; } +.pagination-container .dots-page { margin: 0 3px; padding: 0; } +.pagination-container .page { margin: 0 1px; padding: 5px 8px; border-radius: 3px; background-color: transparent; color: rgba(0, 0, 0, 1); text-decoration: none; transition: color 0.2s linear, background-color 0.2s linear; cursor: pointer;} +.pagination-container .page:hover { background-color: transparent; color: rgba(193, 203, 206, 1); } +.pagination-container .page.current { background-color: transparent; color: rgba(255, 0, 0, 1); } +.imNoScript { position: absolute; top: 5px; left: 5%; width: 90%; font: normal normal normal 14pt 'Unica One'; text-decoration: none; text-align: left; } + +/* Popup */ +#imGuiPopUp { padding: 20px; position: fixed; background-color: rgba(67, 67, 67, 1); border-style: solid; border-width: 0px 0px 0px 0px; border-color: rgba(55, 71, 79, 1) rgba(55, 71, 79, 1) rgba(55, 71, 79, 1) rgba(55, 71, 79, 1); border-top-left-radius: 3px; border-top-right-radius: 3px; border-bottom-left-radius: 3px; border-bottom-right-radius: 3px;font: normal normal normal 13pt 'Open Sans'; color: rgba(243, 243, 243, 1); background-color: transparent; text-decoration: none; text-align: center; } +.imGuiButton { margin-top: 20px; margin-left: auto; margin-right: auto; text-align: center; width: 80px; cursor: pointer; background-color: #444; color: white; padding: 5px; font-size: 14px; font-family: Arial; } +#imGuiPopUpBg { position: fixed; top: 0; left: 0; right: 0; bottom: 0; background-color: rgba(67, 67, 67, 1); } +.alertbox { cursor: default; text-align: center; padding: 0; } +.alertbox .close-button { cursor: pointer; position: absolute; top: 2px; right: 2px; font-weight: bold; cursor: pointer; font-family: Tahoma; } +.alertbox .target-image { cursor: pointer; margin: 0px auto; } + +h1 { + font-family: "Marcellus SC", sans-serif; + vertical-align: baseline; + font-size: 36pt; + line-height: 72px; + text-align: center; + font-style: normal; + font-weight: normal; + width: 100%; +} + +#imPageExtContainer { + min-height: 100%; + background-image: none; +} + +#imPageIntContainer { + position: relative; +} + +#imPage { + position: relative; + width: 100%; + padding-top: 0px; + padding-bottom: 0px; + + display: -ms-grid; + display: grid; + -ms-grid-columns: minmax(0, 1fr) 1150px minmax(0, 1fr); + grid-template-columns: minmax(0, 1fr) 1150px minmax(0, 1fr); + -ms-grid-rows: 184px auto 70px; + grid-template-rows: 184px auto 70px; +} + +#imPage.without-id_animation-in-progress { + overflow: hidden; +} + +#imHeaderBg { + position: absolute; + left: 0; + top: 0; + width: 100%; +} + +#imContent { + position: relative; + align-self: start; + padding: 5px 0 0px 0; + grid-row-start: 2; + grid-row-end: 3; + grid-column-start: 1; + grid-column-end: 4; + display: grid; + grid-template-columns: minmax(0px, 1fr) 1150px minmax(0px, 1fr); +} + +.page-cell { + grid-column: 2; + padding: 5px 10px; + z-index: 10; +} + +.page-cell-fullwidth { + padding: 0; + grid-column-start: 1; + grid-column-end: 4; +} + +#imFooterObjects, #imStickyBarObjects { + display: flex; + align-items: center; +} + +#imStickyBarContainer { + visibility: hidden; + position: fixed; +} + +#to-top { + position: fixed; + bottom: 30px; + right: 30px; + z-index: 10500; + display: none; + opacity: 0.75 +} + +#to-top:hover { + opacity: 1; + cursor: pointer; +} + +#imStickyBar { + position: relative; + top: 0; + left: 0; + margin: auto; + width: 100%; + max-width: 1150px; +} + +#imHeader { + display: block; + -ms-grid-column: 1; + -ms-grid-column-span: 3; + grid-column: 1 / 4; + -ms-grid-row: 1; + -ms-grid-row-span: 1; + grid-row: 1 / 2; + background-image: none; + background-color: transparent; +} + +#imContentGraphics { + display: block; + -ms-grid-column: 2; + -ms-grid-column-span: 1; + grid-column: 2 / 3; + -ms-grid-row: 2; + -ms-grid-row-span: 1; + grid-row: 2 / 3; +} + +main { + justify-self: stretch; +} + +#imHeader_imObjectImage_02_wrapper { + position: relative; + -ms-grid-row-align: start; + align-self: start; + -ms-grid-column-align: center; + justify-self: center; + max-width: 100%; + box-sizing: border-box; + z-index: 3; + vertical-align: top; + font-size: 0; + margin: 0 auto; +} + +#imHeader_imObjectImage_02_wrapper img { + width: 100%; + height: auto; + vertical-align: top; +} + +#imHeader_imObjectTitle_05 { + position: relative; + -ms-grid-row-align: start; + align-self: start; + -ms-grid-column-align: center; + justify-self: center; + max-width: 100%; + box-sizing: border-box; + z-index: 3; + margin: 0; + text-align: center; +} + +#imHeader_imObjectTitle_05_text { + font: normal normal bold 40pt 'Marcellus SC'; + padding: 0px 6px 5px 0px; + background-color: transparent; + position: relative; + display: inline-block; +} + +#imHeader_imObjectTitle_05_text, +#imHeader_imObjectTitle_05_text a { + color: rgba(255, 0, 0, 1); + overflow-wrap: break-word; + max-width: 100%; + white-space: pre-wrap; +} + +#imHeader_imObjectTitle_05_text a { + text-decoration: none; +} + +#imCell_1 { position: relative; box-sizing: border-box; } + + +@media (min-width: 1150.0px) { + #imPage { + min-width: 1150px; + } + + #imHeaderBg { + height: 185px; + background-position: left top; + background-repeat: no-repeat; + background-attachment: scroll; + background-color: rgba(255, 255, 255, 1); + } + + #imHeaderObjects { + margin-left: auto; + margin-right: auto; + position: relative; + height: 184px; + width: 1150px; + } + + #imContent { + padding: 0px 0 0px 0; + } + + #imContentGraphics { + min-height: 501px; + background-image: none; + background-color: transparent; + } + + #imStickyBarContainer { + top: 0; + left: 0; + right: 0; + margin: auto; + width: 100%; + height: 70px; + box-sizing: border-box; + z-index: 10301; + } + + #imStickyBarGraphics { + top: 0; + left: 0; + right: 0; + margin: auto; + width: 100%; + height: 70px; + box-sizing: border-box; + background-image: none; + background-color: rgba(67, 67, 67, 1); + position: absolute; + opacity: 0.75 + } + + #imHeader_imObjectImage_02_wrapper { + position: absolute; + top: 4px; + left: 6px; + width: 180px; + height: 180px; + text-align: center; + z-index: 1002; + overflow: hidden; + padding-top: 0px; + padding-bottom: 0px; + padding-left: 0px; + padding-right: 0px; + } + + #imHeader_imObjectImage_02_wrapper img { + -webkit-clip-path: inset(0 0 0% 0); + clip-path: inset(0 0 0% 0); + } + + #imHeader_imObjectTitle_05_wrapper { + position: absolute; + top: 44px; + left: 200px; + width: 940px; + height: 60px; + text-align: center; + z-index: 1004; + } + + #imHeader_imObjectTitle_05 { + padding-top: 0px; + padding-bottom: 0px; + padding-left: 0px; + padding-right: 0px; + text-shadow: 0px 0px 0px rgba(128, 128, 128, 1.000), 1px 1px 0px rgba(128, 128, 128, 0.694), 2px 2px 0px rgba(128, 128, 128, 0.444), 3px 2px 0px rgba(128, 128, 128, 0.250), 4px 3px 0px rgba(128, 128, 128, 0.111), 5px 4px 0px rgba(128, 128, 128, 0.028); + width: 100%; + } + + #imHeader_imObjectTitle_05_text { + margin-left: 0px; + margin-right: 0px; + margin-top: 0px; + margin-bottom: 0px; + } + + #imCell_1 { padding-top: 10px; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; } +} + +@media (max-width: 1149.9px) and (min-width: 720.0px) { + #imHeaderBg { + height: 201px; + background-position: left top; + background-repeat: no-repeat; + background-attachment: scroll; + background-color: transparent; + } + + #imHeaderObjects { + margin-left: auto; + margin-right: auto; + position: relative; + height: 201px; + width: 720px; + } + + #imContentGraphics { + min-height: 600px; + background-image: none; + background-color: transparent; + } + + #imStickyBarContainer { + top: 0; + left: 0; + right: 0; + margin: auto; + width: 100%; + box-sizing: border-box; + z-index: 10301; + } + + #imStickyBarGraphics { + top: 0; + left: 0; + right: 0; + margin: auto; + width: 100%; + box-sizing: border-box; + background-image: none; + background-color: rgba(67, 67, 67, 1); + position: absolute; + opacity: 0.75 + } + + #imPage { + min-width: 720px; + -ms-grid-columns: minmax(0, 1fr) 720px minmax(0, 1fr); + grid-template-columns: minmax(0, 1fr) 720px minmax(0, 1fr); + -ms-grid-rows: 201px auto 60px; + grid-template-rows: 201px auto 60px; + } + + #imHeader { + display: block; + -ms-grid-column: 2; + -ms-grid-column-span: 1; + grid-column: 2 / 3; + -ms-grid-row: 1; + -ms-grid-row-span: 1; + grid-row: 1 / 2; + } + + #imContent { + display: block; + -ms-grid-column: 1; + -ms-grid-column-span: 3; + grid-column: 1 / 4; + -ms-grid-row: 2; + -ms-grid-row-span: 1; + grid-row: 2 / 3; + } + + #imContentGraphics { + display: block; + -ms-grid-column: 2; + -ms-grid-column-span: 1; + grid-column: 2 / 3; + -ms-grid-row: 2; + -ms-grid-row-span: 1; + grid-row: 2 / 3; + } + + #imHeader_imObjectImage_02_wrapper { + position: absolute; + top: 14px; + left: 11px; + width: 175px; + height: 182px; + text-align: center; + z-index: 1002; + overflow: hidden; + padding-top: 0px; + padding-bottom: 0px; + padding-left: 0px; + padding-right: 0px; + } + + #imHeader_imObjectImage_02_wrapper img { + -webkit-clip-path: inset(0 0 -4% 0); + clip-path: inset(0 0 -4% 0); + } + + #imHeader_imObjectTitle_05_wrapper { + position: absolute; + top: 34px; + left: 190px; + width: 540px; + height: 150px; + text-align: center; + z-index: 1003; + } + + #imHeader_imObjectTitle_05 { + padding-top: 0px; + padding-bottom: 0px; + padding-left: 0px; + padding-right: 0px; + text-shadow: 0px 0px 0px rgba(128, 128, 128, 1.000), 1px 1px 0px rgba(128, 128, 128, 0.694), 2px 2px 0px rgba(128, 128, 128, 0.444), 3px 2px 0px rgba(128, 128, 128, 0.250), 4px 3px 0px rgba(128, 128, 128, 0.111), 5px 4px 0px rgba(128, 128, 128, 0.028); + width: 100%; + } + + #imHeader_imObjectTitle_05_text { + margin-left: 0px; + margin-right: 0px; + margin-top: 0px; + margin-bottom: 0px; + } + + #imCell_1 { padding-top: 10px; padding-bottom: 10px; padding-left: 6px; padding-right: 6px; } +} + +@media (max-width: 719.9px) and (min-width: 480.0px) { + #imPage { + min-width: 480px; + } + + #imHeaderBg { + height: 201px; + background-position: left top; + background-repeat: no-repeat; + background-attachment: scroll; + background-color: transparent; + } + + #imHeaderObjects { + margin-left: auto; + margin-right: auto; + position: relative; + height: 201px; + width: 480px; + } + + #imContentGraphics { + min-height: 600px; + background-image: none; + background-color: transparent; + } + + #imStickyBarContainer { + top: 0; + left: 0; + right: 0; + margin: auto; + width: 100%; + height: 50px; + box-sizing: border-box; + z-index: 10301; + } + + #imStickyBarGraphics { + top: 0; + left: 0; + right: 0; + margin: auto; + width: 100%; + height: 50px; + box-sizing: border-box; + background-image: none; + background-color: rgba(67, 67, 67, 1); + position: absolute; + opacity: 0.75 + } + + #imPageExtContainer:after { + position: fixed; + top: 0; + right: 0; + width: 0; + height: 0; + content: ''; + opacity: 0; + transition: opacity 1000ms; + z-index: 10401; + } + + #imPage { + display: -ms-grid; + display: grid; + -ms-grid-columns: minmax(0, 1fr) 480px minmax(0, 1fr); + grid-template-columns: minmax(0, 1fr) 480px minmax(0, 1fr); + -ms-grid-rows: 201px auto 50px; + grid-template-rows: 201px auto 50px; + } + + #imHeader { + display: block; + -ms-grid-column: 1; + -ms-grid-column-span: 3; + grid-column: 1 / 4; + -ms-grid-row: 1; + -ms-grid-row-span: 1; + grid-row: 1 / 2; + } + + #imContent { + display: block; + -ms-grid-column: 1; + -ms-grid-column-span: 3; + grid-column: 1 / 4; + -ms-grid-row: 2; + -ms-grid-row-span: 1; + grid-row: 2 / 3; + } + + #imContentGraphics { + display: block; + -ms-grid-column: 2; + -ms-grid-column-span: 1; + grid-column: 2 / 3; + -ms-grid-row: 2; + -ms-grid-row-span: 1; + grid-row: 2 / 3; + } + + #imHeader_imObjectImage_02_wrapper { + position: absolute; + top: 70px; + left: 12px; + width: 130px; + height: 130px; + text-align: center; + z-index: 1002; + overflow: hidden; + } + + #imHeader_imObjectImage_02_wrapper img { + -webkit-clip-path: inset(0 0 0% 0); + clip-path: inset(0 0 0% 0); + } + + #imHeader_imObjectImage_02_wrapper { + padding-top: 0px; + padding-bottom: 0px; + padding-left: 0px; + padding-right: 0px; + } + + #imHeader_imObjectTitle_05 { + padding-top: 0px; + padding-bottom: 0px; + padding-left: 0px; + padding-right: 0px; + } + + #imHeader_imObjectTitle_05 { + text-shadow: 0px 0px 0px rgba(128, 128, 128, 1.000), 1px 1px 0px rgba(128, 128, 128, 0.694), 2px 2px 0px rgba(128, 128, 128, 0.444), 3px 2px 0px rgba(128, 128, 128, 0.250), 4px 3px 0px rgba(128, 128, 128, 0.111), 5px 4px 0px rgba(128, 128, 128, 0.028); + } + + #imHeader_imObjectTitle_05 { + width: 100%; + } + + #imHeader_imObjectTitle_05_text { + margin-left: 0px; + margin-right: 0px; + margin-top: 0px; + margin-bottom: 0px; + } + + #imHeader_imObjectTitle_05_wrapper { + position: absolute; + top: 80px; + left: 150px; + width: 320px; + height: 120px; + text-align: center; + z-index: 1004; + } + + #imHeader_imObjectTitle_05 { + width: 100%; + position: relative; + place-self: start center; + max-width: 100%; + box-sizing: border-box; + z-index: 3; + } + + #imHeader_imObjectTitle_05_text, + #imHeader_imObjectTitle_05_text a { + color: rgb(255, 0, 0); + overflow-wrap: break-word; + max-width: 100%; + white-space: pre-wrap; + } + + #imHeader_imObjectTitle_05_text { + font: bold 30pt "Marcellus SC"; + padding: 0px 6px 5px 0px; + background-color: transparent; + position: relative; + display: inline-block; + } + + #imCell_1 { padding-top: 10px; padding-bottom: 10px; padding-left: 4px; padding-right: 4px; } +} + +@media (max-width: 479.9px) { + #imHeaderBg { + height: 200px; + background-position: left top; + background-repeat: no-repeat; + background-attachment: scroll; + background-color: transparent; + } + + #imHeaderObjects { + margin-left: auto; + margin-right: auto; + position: relative; + height: 201px; + width: 320px; + } + + #imContentGraphics { + min-height: 600px; + background-image: none; + background-color: transparent; + } + + #imStickyBarContainer { + top: 0; + left: 0; + right: 0; + margin: auto; + width: 100%; + height: 40px; + box-sizing: border-box; + z-index: 10301; + } + + #imStickyBarGraphics { + top: 0; + left: 0; + right: 0; + margin: auto; + width: 100%; + height: 40px; + box-sizing: border-box; + background-image: none; + background-color: rgba(67, 67, 67, 1); + position: absolute; + opacity: 0.75 + } + + #imPageExtContainer:after { + position: fixed; + top: 0; + right: 0; + width: 0; + height: 0; + content: ''; + opacity: 0; + transition: opacity 1000ms; + z-index: 10401; + } + + #imPage { + display: -ms-grid; + display: grid; + -ms-grid-columns: 0 minmax(0, 1fr) 0; + grid-template-columns: 0 minmax(0, 1fr) 0; + -ms-grid-rows: 201px auto 50px; + grid-template-rows: 201px auto 50px; + } + + #imHeader { + display: block; + -ms-grid-column: 2; + -ms-grid-column-span: 1; + grid-column: 2 / 3; + -ms-grid-row: 1; + -ms-grid-row-span: 1; + grid-row: 1 / 2; + } + + #imContent { + display: block; + -ms-grid-column: 2; + grid-column: 2; + -ms-grid-row: 2; + -ms-grid-row-span: 1; + grid-row: 2 / 3; + } + + #imContentGraphics { + display: block; + -ms-grid-column: 2; + -ms-grid-column-span: 1; + grid-column: 2 / 3; + -ms-grid-row: 2; + -ms-grid-row-span: 1; + grid-row: 2 / 3; + } + + #imHeader_imObjectImage_02_wrapper { + position: absolute; + top: 88px; + left: 2px; + width: 110px; + height: 110px; + text-align: center; + z-index: 1003; + overflow: hidden; + } + + #imHeader_imObjectImage_02_wrapper img { + -webkit-clip-path: inset(0 0 0% 0); + clip-path: inset(0 0 0% 0); + } + + #imHeader_imObjectImage_02_wrapper { + padding-top: 0px; + padding-bottom: 0px; + padding-left: 0px; + padding-right: 0px; + } + + #imHeader_imObjectTitle_05 { + padding-top: 0px; + padding-bottom: 0px; + padding-left: 0px; + padding-right: 0px; + } + + #imHeader_imObjectTitle_05 { + text-shadow: 0px 0px 0px rgba(128, 128, 128, 1.000), 1px 1px 0px rgba(128, 128, 128, 0.694), 2px 2px 0px rgba(128, 128, 128, 0.444), 3px 2px 0px rgba(128, 128, 128, 0.250), 4px 3px 0px rgba(128, 128, 128, 0.111), 5px 4px 0px rgba(128, 128, 128, 0.028); + } + + #imHeader_imObjectTitle_05 { + width: 100%; + } + + #imHeader_imObjectTitle_05_text { + margin-left: 0px; + margin-right: 0px; + margin-top: 0px; + margin-bottom: 0px; + } + + #imHeader_imObjectTitle_05_wrapper { + position: absolute; + top: 90px; + left: 120px; + width: 210px; + height: 110px; + text-align: center; + z-index: 1002; + } + + #imHeader_imObjectTitle_05 { + width: 100%; + } + + #imHeader_imObjectTitle_05_text, + #imHeader_imObjectTitle_05_text a { + color: rgb(255, 0, 0); + font-size: 22pt; + overflow-wrap: break-word; + max-width: 100%; + white-space: pre-wrap; + } + + #imCell_1 { padding-top: 10px; padding-bottom: 10px; padding-left: 5px; padding-right: 5px; } +} \ No newline at end of file diff --git a/css/print.css b/css/print.css index dccc7b8..7772419 100644 --- a/css/print.css +++ b/css/print.css @@ -3,14 +3,13 @@ .imTip { display: none !important; } .text-tabs { display: none !important; } .text-tab-print-title { display: block !important; font-weight: bold; } -.text-container, .text-container > div, .text-inner, .text-inner div, .text-tab-content { padding: 0 0 10px 0 !important; height: auto !important; left: auto !important; top: auto !important; position: static !important; display: block !important; clear: both !important; } +.text-container, .text-container > div, .text-inner, .text-tab-content { padding: 0 0 10px 0 !important; height: auto !important; left: auto !important; top: auto !important; position: static !important; display: block !important; clear: both !important; } #imPage {display: block !important;} #imHeader {display: none !important;} #imHeaderBg {display : none !important;} #imFooter {display : none !important;} #imFooterBg {display: none !important;} #imContent {height: auto !important;} -#imSideBar {display: none !important;} #imStickyBarContainer {display: none !important;} -#imPageToTop {display: none !important;} +#to-top {display: none !important;} img {position: static !important;} diff --git a/css/text.css b/css/text.css index 6748532..ed3b259 100644 --- a/css/text.css +++ b/css/text.css @@ -1,217 +1,654 @@ -#imContent { display: -ms-grid; display: grid; -ms-grid-columns: minmax(0, 1fr) 47.5px 47.5px 47.5px 47.5px 47.5px 47.5px 47.5px 47.5px 47.5px 47.5px 47.5px 47.5px 47.5px 47.5px 47.5px 47.5px 47.5px 47.5px 47.5px 47.5px 47.5px 47.5px 47.5px 47.5px minmax(0, 1fr); grid-template-columns: minmax(0, 1fr) 47.5px 47.5px 47.5px 47.5px 47.5px 47.5px 47.5px 47.5px 47.5px 47.5px 47.5px 47.5px 47.5px 47.5px 47.5px 47.5px 47.5px 47.5px 47.5px 47.5px 47.5px 47.5px 47.5px 47.5px minmax(0, 1fr); -ms-grid-rows: auto auto auto auto auto auto auto; grid-template-rows: auto auto auto auto auto auto auto; } -#imContent > header { display: block; -ms-grid-column: 2; -ms-grid-column-span: 24; grid-column: 2 / 26; -ms-grid-row: 1; -ms-grid-row-span: 1; grid-row: 1 / 2; } -#imGoToCont { display: block; -ms-grid-column: 2; -ms-grid-column-span: 1; grid-column: 2 / 3; -ms-grid-row: 1; -ms-grid-row-span: 1; grid-row: 1 / 2; } -#imCell_1 { display: -ms-grid; display: grid; -ms-grid-column: 2; -ms-grid-column-span: 24; grid-column: 2 / 26; -ms-grid-row: 2; -ms-grid-row-span: 1; grid-row: 2 / 3; } -#imCell_2 { display: -ms-grid; display: grid; -ms-grid-column: 2; -ms-grid-column-span: 24; grid-column: 2 / 26; -ms-grid-row: 3; -ms-grid-row-span: 5; grid-row: 3 / 8; } -#imPageRow_1 { display: block; -ms-grid-column: 2; -ms-grid-column-span: 24; grid-column: 2 / 26; -ms-grid-row: 2; -ms-grid-row-span: 1; grid-row: 2 / 3; } -#imPageRow_2 { display: block; -ms-grid-column: 2; -ms-grid-column-span: 24; grid-column: 2 / 26; -ms-grid-row: 3; -ms-grid-row-span: 5; grid-row: 3 / 8; } -@media (max-width: 1149.9px) and (min-width: 720.0px) { - #imContent { display: -ms-grid; display: grid; -ms-grid-columns: minmax(0, 1fr) 29.583px 29.583px 29.583px 29.583px 29.583px 29.583px 29.583px 29.583px 29.583px 29.583px 29.583px 29.583px 29.583px 29.583px 29.583px 29.583px 29.583px 29.583px 29.583px 29.583px 29.583px 29.583px 29.583px 29.583px minmax(0, 1fr); grid-template-columns: minmax(0, 1fr) 29.583px 29.583px 29.583px 29.583px 29.583px 29.583px 29.583px 29.583px 29.583px 29.583px 29.583px 29.583px 29.583px 29.583px 29.583px 29.583px 29.583px 29.583px 29.583px 29.583px 29.583px 29.583px 29.583px 29.583px minmax(0, 1fr); -ms-grid-rows: auto auto auto auto auto auto auto; grid-template-rows: auto auto auto auto auto auto auto; } - #imContent > header { display: block; -ms-grid-column: 2; -ms-grid-column-span: 24; grid-column: 2 / 26; -ms-grid-row: 1; -ms-grid-row-span: 1; grid-row: 1 / 2; } - #imGoToCont { display: block; -ms-grid-column: 2; -ms-grid-column-span: 1; grid-column: 2 / 3; -ms-grid-row: 1; -ms-grid-row-span: 1; grid-row: 1 / 2; } - #imCell_1 { display: -ms-grid; display: grid; -ms-grid-column: 2; -ms-grid-column-span: 24; grid-column: 2 / 26; -ms-grid-row: 2; -ms-grid-row-span: 1; grid-row: 2 / 3; } - #imCell_2 { display: -ms-grid; display: grid; -ms-grid-column: 2; -ms-grid-column-span: 24; grid-column: 2 / 26; -ms-grid-row: 3; -ms-grid-row-span: 5; grid-row: 3 / 8; } - #imPageRow_1 { display: block; -ms-grid-column: 2; -ms-grid-column-span: 24; grid-column: 2 / 26; -ms-grid-row: 2; -ms-grid-row-span: 1; grid-row: 2 / 3; } - #imPageRow_2 { display: block; -ms-grid-column: 2; -ms-grid-column-span: 24; grid-column: 2 / 26; -ms-grid-row: 3; -ms-grid-row-span: 5; grid-row: 3 / 8; } -} -@media (max-width: 719.9px) and (min-width: 480.0px) { - #imContent { display: -ms-grid; display: grid; -ms-grid-columns: minmax(0, 1fr) 19.583px 19.583px 19.583px 19.583px 19.583px 19.583px 19.583px 19.583px 19.583px 19.583px 19.583px 19.583px 19.583px 19.583px 19.583px 19.583px 19.583px 19.583px 19.583px 19.583px 19.583px 19.583px 19.583px 19.583px minmax(0, 1fr); grid-template-columns: minmax(0, 1fr) 19.583px 19.583px 19.583px 19.583px 19.583px 19.583px 19.583px 19.583px 19.583px 19.583px 19.583px 19.583px 19.583px 19.583px 19.583px 19.583px 19.583px 19.583px 19.583px 19.583px 19.583px 19.583px 19.583px 19.583px minmax(0, 1fr); -ms-grid-rows: auto auto auto auto auto auto auto; grid-template-rows: auto auto auto auto auto auto auto; } - #imContent > header { display: block; -ms-grid-column: 2; -ms-grid-column-span: 24; grid-column: 2 / 26; -ms-grid-row: 1; -ms-grid-row-span: 1; grid-row: 1 / 2; } - #imGoToCont { display: block; -ms-grid-column: 2; -ms-grid-column-span: 1; grid-column: 2 / 3; -ms-grid-row: 1; -ms-grid-row-span: 1; grid-row: 1 / 2; } - #imCell_1 { display: -ms-grid; display: grid; -ms-grid-column: 2; -ms-grid-column-span: 24; grid-column: 2 / 26; -ms-grid-row: 2; -ms-grid-row-span: 1; grid-row: 2 / 3; } - #imCell_2 { display: -ms-grid; display: grid; -ms-grid-column: 2; -ms-grid-column-span: 24; grid-column: 2 / 26; -ms-grid-row: 3; -ms-grid-row-span: 5; grid-row: 3 / 8; } - #imPageRow_1 { display: block; -ms-grid-column: 2; -ms-grid-column-span: 24; grid-column: 2 / 26; -ms-grid-row: 2; -ms-grid-row-span: 1; grid-row: 2 / 3; } - #imPageRow_2 { display: block; -ms-grid-column: 2; -ms-grid-column-span: 24; grid-column: 2 / 26; -ms-grid-row: 3; -ms-grid-row-span: 5; grid-row: 3 / 8; } -} -@media (max-width: 479.9px) { - #imContent { display: -ms-grid; display: grid; -ms-grid-columns: 0 minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) 0; grid-template-columns: 0 minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) 0; -ms-grid-rows: auto auto auto; grid-template-rows: auto auto auto; } - #imContent > header { display: block; -ms-grid-column: 2; -ms-grid-column-span: 24; grid-column: 2 / 26; -ms-grid-row: 1; -ms-grid-row-span: 1; grid-row: 1 / 2; } - #imGoToCont { display: block; -ms-grid-column: 2; -ms-grid-column-span: 1; grid-column: 2 / 3; -ms-grid-row: 1; -ms-grid-row-span: 1; grid-row: 1 / 2; } - #imCell_1 { display: -ms-grid; display: grid; -ms-grid-column: 2; -ms-grid-column-span: 24; grid-column: 2 / 26; -ms-grid-row: 2; -ms-grid-row-span: 1; grid-row: 2 / 3; } - #imCell_2 { display: -ms-grid; display: grid; -ms-grid-column: 2; -ms-grid-column-span: 24; grid-column: 2 / 26; -ms-grid-row: 3; -ms-grid-row-span: 1; grid-row: 3 / 4; } - #imPageRow_1 { display: block; -ms-grid-column: 2; -ms-grid-column-span: 24; grid-column: 2 / 26; -ms-grid-row: 2; -ms-grid-row-span: 1; grid-row: 2 / 3; } - #imPageRow_2 { display: block; -ms-grid-column: 2; -ms-grid-column-span: 24; grid-column: 2 / 26; -ms-grid-row: 3; -ms-grid-row-span: 1; grid-row: 3 / 4; } -} -h2#imPgTitle { position: relative; float: left; } -#imCell_1 { -ms-grid-columns: 100%; grid-template-columns: 100%; position: relative; box-sizing: border-box; } -#imTextObject_39_01 { position: relative; -ms-grid-row-align: start; align-self: start; -ms-grid-column-align: center; justify-self: center; max-width: 100%; box-sizing: border-box; z-index: 3; } -#imCellStyleGraphics_1 { position: absolute; top: 10px; bottom: 10px; background-color: transparent; } -#imCellStyleBorders_1 { position: absolute; top: 10px; bottom: 10px; } -#imTextObject_39_01 { width: 100%; } -#imTextObject_39_01 { font-style: normal; font-weight: normal; line-height: 28px; } -#imTextObject_39_01_tab0 div { line-height: 28px; } -#imTextObject_39_01_tab0 .imHeading1 { line-height: 28px; } -#imTextObject_39_01_tab0 .imHeading2 { line-height: 28px; } -#imTextObject_39_01_tab0 .imHeading3 { line-height: 28px; } -#imTextObject_39_01_tab0 .imHeading4 { line-height: 28px; } -#imTextObject_39_01_tab0 .imHeading5 { line-height: 28px; } -#imTextObject_39_01_tab0 .imHeading6 { line-height: 28px; } -#imTextObject_39_01_tab0 ul { list-style: disc; margin: 0; padding: 0; overflow: hidden; } -#imTextObject_39_01_tab0 ul ul { list-style: square; padding: 0 0 0 20px; } -#imTextObject_39_01_tab0 ul ul ul { list-style: circle; } -#imTextObject_39_01_tab0 ul li { margin: 0 0 0 40px; padding: 0px; } -#imTextObject_39_01_tab0 ol { list-style: decimal; margin: 0; padding: 0; } -#imTextObject_39_01_tab0 ol ol { list-style: lower-alpha; padding: 0 0 0 20px; } -#imTextObject_39_01_tab0 ol li { margin: 0 0 0 40px; padding: 0px; } -#imTextObject_39_01_tab0 blockquote { margin: 0 0 0 15px; padding: 0; border: none; } -#imTextObject_39_01_tab0 table { border: none; padding: 0; border-collapse: collapse; } -#imTextObject_39_01_tab0 table td { border: 1px solid black; word-wrap: break-word; padding: 4px 3px 4px 3px; margin: 0; vertical-align: middle; } -#imTextObject_39_01_tab0 p { margin: 0; padding: 0; } -#imTextObject_39_01_tab0 .inline-block { display: inline-block; } -#imTextObject_39_01_tab0 sup { vertical-align: super; font-size: smaller; } -#imTextObject_39_01_tab0 sub { vertical-align: sub; font-size: smaller; } -#imTextObject_39_01_tab0 img { border: none; margin: 0; vertical-align: text-bottom;} -#imTextObject_39_01_tab0 .fleft { float: left; vertical-align: baseline;} -#imTextObject_39_01_tab0 .fright { float: right; vertical-align: baseline;} -#imTextObject_39_01_tab0 img.fleft { margin-right: 15px; } -#imTextObject_39_01_tab0 img.fright { margin-left: 15px; } -#imTextObject_39_01_tab0 .imTALeft { text-align: left; } -#imTextObject_39_01_tab0 .imTARight { text-align: right; } -#imTextObject_39_01_tab0 .imTACenter { text-align: center; } -#imTextObject_39_01_tab0 .imTAJustify { text-align: justify; } -#imTextObject_39_01_tab0 .imUl { text-decoration: underline; } -#imTextObject_39_01_tab0 .imStrike { text-decoration: line-through; } -#imTextObject_39_01_tab0 .imUlStrike { text-decoration: underline line-through; } -#imTextObject_39_01_tab0 .imVt { vertical-align: top; } -#imTextObject_39_01_tab0 .imVc { vertical-align: middle; } -#imTextObject_39_01_tab0 .imVb { vertical-align: bottom; } -#imTextObject_39_01_tab0 hr { border-width: 1px 0 0 0; border-style: solid; } -#imTextObject_39_01_tab0 .fs36lh1-5 { vertical-align: baseline; font-size: 36pt; line-height: 72px; } -#imTextObject_39_01_tab0 .ff1 { font-family: 'Marcellus SC'; } -#imTextObject_39_01 .text-container {width: 100%;}#imTextObject_39_01 .text-container {margin: 0 auto; position: relative;overflow: hidden; display: -ms-grid; display: grid; -ms-grid-template-rows: 1fr; grid-template-rows: 1fr; -ms-grid-template-columns: 1fr; grid-template-columns: 1fr; background-color: rgba(255, 255, 255, 1); border-style: solid;border-color: rgba(169, 169, 169, 1); } -#imTextObject_39_01 .text-container .grid-prop.current-tab {z-index: 1; opacity: 1; } -#imTextObject_39_01 .text-container .grid-prop {-ms-grid-column: 1; -ms-grid-row: 1; grid-area: 1 / 1 / 2 / 2; opacity: 0; box-sizing: border-box; position: relative; } -#imTextObject_39_01 .text-container .text-tab-content.detach {position: absolute; top: 0; left: 0; width: 100%; display: none; } -#imCell_2 { -ms-grid-columns: 100%; grid-template-columns: 100%; position: relative; box-sizing: border-box; } -#imTextObject_39_02 { position: relative; -ms-grid-row-align: start; align-self: start; -ms-grid-column-align: center; justify-self: center; max-width: 100%; box-sizing: border-box; z-index: 3; } -#imCellStyleGraphics_2 { position: absolute; top: 10px; bottom: 10px; background-color: transparent; } -#imCellStyleBorders_2 { position: absolute; top: 10px; bottom: 10px; } -#imTextObject_39_02 { width: 100%; } -#imTextObject_39_02 { font-style: normal; font-weight: normal; line-height: 28px; } -#imTextObject_39_02_tab0 div { line-height: 28px; } -#imTextObject_39_02_tab0 .imHeading1 { line-height: 28px; } -#imTextObject_39_02_tab0 .imHeading2 { line-height: 28px; } -#imTextObject_39_02_tab0 .imHeading3 { line-height: 28px; } -#imTextObject_39_02_tab0 .imHeading4 { line-height: 28px; } -#imTextObject_39_02_tab0 .imHeading5 { line-height: 28px; } -#imTextObject_39_02_tab0 .imHeading6 { line-height: 28px; } -#imTextObject_39_02_tab0 ul { list-style: disc; margin: 0; padding: 0; overflow: hidden; } -#imTextObject_39_02_tab0 ul ul { list-style: square; padding: 0 0 0 20px; } -#imTextObject_39_02_tab0 ul ul ul { list-style: circle; } -#imTextObject_39_02_tab0 ul li { margin: 0 0 0 40px; padding: 0px; } -#imTextObject_39_02_tab0 ol { list-style: decimal; margin: 0; padding: 0; } -#imTextObject_39_02_tab0 ol ol { list-style: lower-alpha; padding: 0 0 0 20px; } -#imTextObject_39_02_tab0 ol li { margin: 0 0 0 40px; padding: 0px; } -#imTextObject_39_02_tab0 blockquote { margin: 0 0 0 15px; padding: 0; border: none; } -#imTextObject_39_02_tab0 table { border: none; padding: 0; border-collapse: collapse; } -#imTextObject_39_02_tab0 table td { border: 1px solid black; word-wrap: break-word; padding: 4px 3px 4px 3px; margin: 0; vertical-align: middle; } -#imTextObject_39_02_tab0 p { margin: 0; padding: 0; } -#imTextObject_39_02_tab0 .inline-block { display: inline-block; } -#imTextObject_39_02_tab0 sup { vertical-align: super; font-size: smaller; } -#imTextObject_39_02_tab0 sub { vertical-align: sub; font-size: smaller; } -#imTextObject_39_02_tab0 img { border: none; margin: 0; vertical-align: text-bottom;} -#imTextObject_39_02_tab0 .fleft { float: left; vertical-align: baseline;} -#imTextObject_39_02_tab0 .fright { float: right; vertical-align: baseline;} -#imTextObject_39_02_tab0 img.fleft { margin-right: 15px; } -#imTextObject_39_02_tab0 img.fright { margin-left: 15px; } -#imTextObject_39_02_tab0 .imTALeft { text-align: left; } -#imTextObject_39_02_tab0 .imTARight { text-align: right; } -#imTextObject_39_02_tab0 .imTACenter { text-align: center; } -#imTextObject_39_02_tab0 .imTAJustify { text-align: justify; } -#imTextObject_39_02_tab0 .imUl { text-decoration: underline; } -#imTextObject_39_02_tab0 .imStrike { text-decoration: line-through; } -#imTextObject_39_02_tab0 .imUlStrike { text-decoration: underline line-through; } -#imTextObject_39_02_tab0 .imVt { vertical-align: top; } -#imTextObject_39_02_tab0 .imVc { vertical-align: middle; } -#imTextObject_39_02_tab0 .imVb { vertical-align: bottom; } -#imTextObject_39_02_tab0 hr { border-width: 1px 0 0 0; border-style: solid; } -#imTextObject_39_02_tab0 .fs14lh1-5 { vertical-align: baseline; font-size: 14pt; line-height: 28px; } -#imTextObject_39_02_tab0 .ff1 { font-family: 'Open Sans'; } -#imTextObject_39_02_tab0 .fs12lh1-5 { vertical-align: baseline; font-size: 12pt; line-height: 24px; } -#imTextObject_39_02_tab0 .cf1 { color: rgb(67, 67, 67); } -#imTextObject_39_02 .text-container {width: 100%;}#imTextObject_39_02 .text-container {margin: 0 auto; position: relative;overflow: hidden; display: -ms-grid; display: grid; -ms-grid-template-rows: 1fr; grid-template-rows: 1fr; -ms-grid-template-columns: 1fr; grid-template-columns: 1fr; background-color: rgba(255, 255, 255, 1); border-style: solid;border-color: rgba(169, 169, 169, 1); } -#imTextObject_39_02 .text-container .grid-prop.current-tab {z-index: 1; opacity: 1; } -#imTextObject_39_02 .text-container .grid-prop {-ms-grid-column: 1; -ms-grid-row: 1; grid-area: 1 / 1 / 2 / 2; opacity: 0; box-sizing: border-box; position: relative; } -#imTextObject_39_02 .text-container .text-tab-content.detach {position: absolute; top: 0; left: 0; width: 100%; display: none; } -@media (min-width: 1150.0px) { - #imContent { padding-left: 5px; padding-right:5px; } - .imPageRow { margin-left: -5px; margin-right: -5px; } - #imPgTitle { width: 1134px; margin-left: 2px; margin-right: 2px; } - #imCell_1 { padding-top: 10px; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; } - #imCell_1 { -ms-grid-rows: 100%; grid-template-rows: 100%; } - #imTextObject_39_01 { padding-top: 10px; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; } - #imCellStyleGraphics_1 { left: 10px; right: 10px; } - #imCellStyleBorders_1 { left: 10px; right: 10px; border-top: 0; border-bottom: 0; border-left: 0; border-right: 0; } - #imTextObject_39_01 .text-container {border-width: 0 1px 1px 1px;box-sizing: border-box;width: 100%;} - #imCell_2 { padding-top: 10px; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; } - #imCell_2 { -ms-grid-rows: 100%; grid-template-rows: 100%; } - #imTextObject_39_02 { padding-top: 10px; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; } - #imCellStyleGraphics_2 { left: 10px; right: 10px; } - #imCellStyleBorders_2 { left: 10px; right: 10px; border-top: 0; border-bottom: 0; border-left: 0; border-right: 0; } - #imTextObject_39_02 .text-container {border-width: 0 1px 1px 1px;box-sizing: border-box;width: 100%;} -} -@media (max-width: 1149.9px) and (min-width: 720.0px) { - #imContent { padding-left: 5px; padding-right:5px; } - .imPageRow { margin-left: -5px; margin-right: -5px; } - #imPgTitle { width: 704px; margin-left: 2px; margin-right: 2px; } - #imCell_1 { padding-top: 10px; padding-bottom: 10px; padding-left: 6px; padding-right: 6px; } - #imCell_1 { -ms-grid-rows: 100%; grid-template-rows: 100%; } - #imTextObject_39_01 { padding-top: 10px; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; } - #imCellStyleGraphics_1 { left: 6px; right: 6px; } - #imCellStyleBorders_1 { left: 6px; right: 6px; border-top: 0; border-bottom: 0; border-left: 0; border-right: 0; } - #imTextObject_39_01 .text-container {border-width: 0 1px 1px 1px;box-sizing: border-box;width: 100%;} - #imCell_2 { padding-top: 10px; padding-bottom: 10px; padding-left: 6px; padding-right: 6px; } - #imCell_2 { -ms-grid-rows: 100%; grid-template-rows: 100%; } - #imTextObject_39_02 { padding-top: 10px; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; } - #imCellStyleGraphics_2 { left: 6px; right: 6px; } - #imCellStyleBorders_2 { left: 6px; right: 6px; border-top: 0; border-bottom: 0; border-left: 0; border-right: 0; } - #imTextObject_39_02 .text-container {border-width: 0 1px 1px 1px;box-sizing: border-box;width: 100%;} +#imGoToCont { + display: block; + -ms-grid-column: 2; + -ms-grid-column-span: 1; + grid-column: 2 / 3; + -ms-grid-row: 1; + -ms-grid-row-span: 1; + grid-row: 1 / 2; } -@media (max-width: 719.9px) and (min-width: 480.0px) { - #imContent { padding-left: 5px; padding-right:5px; } - .imPageRow { margin-left: -5px; margin-right: -5px; } - #imPgTitle { width: 464px; margin-left: 2px; margin-right: 2px; } - #imCell_1 { padding-top: 10px; padding-bottom: 10px; padding-left: 4px; padding-right: 4px; } - #imCell_1 { -ms-grid-rows: 100%; grid-template-rows: 100%; } - #imTextObject_39_01 { padding-top: 10px; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; } - #imCellStyleGraphics_1 { left: 4px; right: 4px; } - #imCellStyleBorders_1 { left: 4px; right: 4px; border-top: 0; border-bottom: 0; border-left: 0; border-right: 0; } - #imTextObject_39_01 .text-container {border-width: 0 1px 1px 1px;box-sizing: border-box;width: 100%;} - #imCell_2 { padding-top: 10px; padding-bottom: 10px; padding-left: 4px; padding-right: 4px; } - #imCell_2 { -ms-grid-rows: 100%; grid-template-rows: 100%; } - #imTextObject_39_02 { padding-top: 10px; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; } - #imCellStyleGraphics_2 { left: 4px; right: 4px; } - #imCellStyleBorders_2 { left: 4px; right: 4px; border-top: 0; border-bottom: 0; border-left: 0; border-right: 0; } - #imTextObject_39_02 .text-container {border-width: 0 1px 1px 1px;box-sizing: border-box;width: 100%;} +#imPageRow_1 { + display: block; + -ms-grid-column: 2; + -ms-grid-column-span: 24; + grid-column: 2 / 26; + -ms-grid-row: 2; + -ms-grid-row-span: 1; + grid-row: 2 / 3; } -@media (max-width: 479.9px) { - #imPgTitle { width: 100%; margin-left: 0px; margin-right: 0px; } - #imCell_1 { padding-top: 10px; padding-bottom: 10px; padding-left: 5px; padding-right: 5px; } - #imTextObject_39_01 { padding-top: 10px; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; } - #imCell_1 { -ms-grid-rows: 100%; grid-template-rows: 100%; } - #imCellStyleGraphics_1 { top: 10px; bottom: 10px; left: 5px; right: 5px; box-sizing: border-box; } - #imTextObject_39_01 .text-container {border-width: 0 1px 1px 1px;box-sizing: border-box;width: 100%;} - #imCell_2 { padding-top: 10px; padding-bottom: 10px; padding-left: 5px; padding-right: 5px; } - #imTextObject_39_02 { padding-top: 10px; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; } - #imCell_2 { -ms-grid-rows: 100%; grid-template-rows: 100%; } - #imCellStyleGraphics_2 { top: 10px; bottom: 10px; left: 5px; right: 5px; box-sizing: border-box; } - #imTextObject_39_02 .text-container {border-width: 0 1px 1px 1px;box-sizing: border-box;width: 100%;} + +#imPageRow_2 { + display: block; + -ms-grid-column: 2; + -ms-grid-column-span: 24; + grid-column: 2 / 26; + -ms-grid-row: 3; + -ms-grid-row-span: 5; + grid-row: 3 / 8; } -#imTextObject_39_02_tab0 .text-inner { + +#page-title-container { + position: relative; + -ms-grid-row-align: start; + align-self: start; + -ms-grid-column-align: center; + justify-self: center; + max-width: 100%; + box-sizing: border-box; + z-index: 3; + width: 100%; + font-style: normal; + font-weight: normal; + line-height: 28px; +} + +#imCellStyleGraphics_1 { + position: absolute; + top: 10px; + bottom: 10px; + background-color: transparent; +} + +#imCellStyleBorders_1 { + position: absolute; + top: 10px; + bottom: 10px; +} + +#page-title-wrapper .text-inner { + text-align: center; + font-family: 'Marcellus SC', sans-serif; + vertical-align: baseline; + font-size: 36pt; + line-height: 72px; +} + +#page-title-wrapper div { + line-height: 28px; +} + +#page-title-wrapper p { + margin: 0; + padding: 0; +} + +#page-title-wrapper sup { + vertical-align: super; + font-size: smaller; +} + +#page-title-wrapper sub { + vertical-align: sub; + font-size: smaller; +} + +#page-title-wrapper img { + border: none; + margin: 0; + vertical-align: text-bottom; +} + +#page-title-wrapper hr { + border-width: 1px 0 0 0; + border-style: solid; +} + +#page-title-container .text-container { + width: 100%; + margin: 0 auto; + position: relative; + overflow: hidden; + display: -ms-grid; + display: grid; + -ms-grid-template-rows: 1fr; + grid-template-rows: 1fr; + -ms-grid-template-columns: 1fr; + grid-template-columns: 1fr; + background-color: rgba(255, 255, 255, 1); + border-style: solid; + border-color: rgba(169, 169, 169, 1); +} + +#page-title-container .text-container .grid-prop.current-tab { + z-index: 1; + opacity: 1; +} + +#page-title-container .text-container .grid-prop { + -ms-grid-column: 1; + -ms-grid-row: 1; + grid-column: 1; + grid-row: 1; + grid-area: 1 / 1 / 2 / 2; + opacity: 0; + box-sizing: border-box; + position: relative; +} + +#page-title-container .text-container .text-tab-content.detach { + position: absolute; + top: 0; + left: 0; + width: 100%; + display: none; +} + +.page-content-wrapper { + position: relative; + -ms-grid-row-align: start; + align-self: start; + -ms-grid-column-align: center; + justify-self: center; + max-width: 100%; + box-sizing: border-box; + z-index: 3; + width: 100%; + font-style: normal; + font-weight: normal; + line-height: 28px; +} + +#imCellStyleGraphics_2 { + position: absolute; + top: 10px; + bottom: 10px; + background-color: transparent; +} + +#imCellStyleBorders_2 { + position: absolute; + top: 10px; + bottom: 10px; +} + +.page-text-wrapper { + line-height: 28px; +} + +.page-text-wrapper .text-inner { color: rgb(67, 67, 67); vertical-align: baseline; font-size: 12pt; line-height: 24px; - font-family: "Open Sans"; + font-family: "Open Sans", sans-serif; } -#imTextObject_39_02_tab0 .text-inner h2 { + +.page-text-wrapper .text-inner h2 { font-size: 14pt; line-height: 28px; font-weight: 400; } -#imTextObject_39_02_tab0 .text-inner strong { + +.page-text-wrapper .text-inner strong { font-weight: 700; - font-family: "Unica One"; + font-family: "Unica One", sans-serif; color: #000000; +} + +.page-text-wrapper ul { + list-style: disc; + margin: 0; + padding: 0; + overflow: hidden; +} + +.page-text-wrapper ul ul { + list-style: square; + padding: 0 0 0 20px; +} + +.page-text-wrapper ul ul ul { + list-style: circle; +} + +.page-text-wrapper ul li { + margin: 0 0 0 40px; + padding: 0px; +} + +.page-text-wrapper ol { + list-style: decimal; + margin: 0; + padding: 0; +} + +.page-text-wrapper ol ol { + list-style: lower-alpha; + padding: 0 0 0 20px; +} + +.page-text-wrapper ol li { + margin: 0 0 0 40px; + padding: 0px; +} + +.page-text-wrapper blockquote { + margin: 0 0 0 15px; + padding: 0; + border: none; +} + +.page-text-wrapper table { + border: none; + padding: 0; + border-collapse: collapse; +} + +.page-text-wrapper table td { + border: 1px solid black; + word-wrap: break-word; + padding: 4px 3px 4px 3px; + margin: 0; + vertical-align: middle; +} + +.page-text-wrapper p { + margin: 0; + padding: 0; +} + +.page-text-wrapper sup { + vertical-align: super; + font-size: smaller; +} + +.page-text-wrapper sub { + vertical-align: sub; + font-size: smaller; +} + +.page-text-wrapper img { + border: none; + margin: 0; + vertical-align: text-bottom; +} + +.page-text-wrapper hr { + border-width: 1px 0 0 0; + border-style: solid; +} + +.page-text-wrapper .cf1 { + color: rgb(67, 67, 67); +} + +.page-text-wrapper a:link, .page-text-wrapper a { background-color: transparent; color: rgba(255, 0, 0, 1); text-decoration: none; transition: color 0.2s linear, background-color 0.2s linear;} +.page-text-wrapper a:visited { color: rgba(61, 40, 17, 1); } +.page-text-wrapper a:hover, .page-text-wrapper a:active { background-color: transparent; color: rgba(193, 203, 206, 1); text-decoration: underline; } + +@media (min-width: 1150.0px) { + .imPageRow { + margin-left: -5px; + margin-right: -5px; + } + + #imPgTitle { + width: 1134px; + margin-left: 2px; + margin-right: 2px; + } + + #page-title-container { + padding-top: 10px; + padding-bottom: 10px; + padding-left: 10px; + padding-right: 10px; + } + + #imCellStyleGraphics_1 { + left: 10px; + right: 10px; + } + + #imCellStyleBorders_1 { + left: 10px; + right: 10px; + border-top: 0; + border-bottom: 0; + border-left: 0; + border-right: 0; + } + + #page-title-container .text-container { + border-width: 0 1px 1px 1px; + box-sizing: border-box; + width: 100%; + } + + #imCell_2 { + padding-top: 10px; + padding-bottom: 10px; + padding-left: 10px; + padding-right: 10px; + } + + .page-content-wrapper { + padding-top: 10px; + padding-bottom: 10px; + padding-left: 10px; + padding-right: 10px; + } + + #imCellStyleGraphics_2, .textbg-image { + left: 10px; + right: 10px; + } + + #imCellStyleBorders_2 { + left: 10px; + right: 10px; + border-top: 0; + border-bottom: 0; + border-left: 0; + border-right: 0; + } + + .page-content-wrapper .text-container { + border-width: 0 1px 1px 1px; + box-sizing: border-box; + width: 100%; + } +} + +@media (max-width: 1149.9px) and (min-width: 720.0px) { + #imGoToCont { + display: block; + -ms-grid-column: 2; + -ms-grid-column-span: 1; + grid-column: 2 / 3; + -ms-grid-row: 1; + -ms-grid-row-span: 1; + grid-row: 1 / 2; + } + + #imPageRow_2 { + display: block; + -ms-grid-column: 2; + -ms-grid-column-span: 24; + grid-column: 2 / 26; + -ms-grid-row: 3; + -ms-grid-row-span: 5; + grid-row: 3 / 8; + } + + .imPageRow { + margin-left: -5px; + margin-right: -5px; + } + + #imPgTitle { + width: 704px; + margin-left: 2px; + margin-right: 2px; + } + + #page-title-container { + padding-top: 10px; + padding-bottom: 10px; + padding-left: 10px; + padding-right: 10px; + } + + #imCellStyleGraphics_1 { + left: 6px; + right: 6px; + } + + #imCellStyleBorders_1 { + left: 6px; + right: 6px; + border-top: 0; + border-bottom: 0; + border-left: 0; + border-right: 0; + } + + #page-title-container .text-container { + border-width: 0 1px 1px 1px; + box-sizing: border-box; + width: 100%; + } + + #imCell_2 { + padding-top: 10px; + padding-bottom: 10px; + padding-left: 6px; + padding-right: 6px; + } + + .page-content-wrapper { + padding-top: 10px; + padding-bottom: 10px; + padding-left: 10px; + padding-right: 10px; + } + + #imCellStyleGraphics_2, .textbg-image { + left: 6px; + right: 6px; + } + + #imCellStyleBorders_2 { + left: 6px; + right: 6px; + border-top: 0; + border-bottom: 0; + border-left: 0; + border-right: 0; + } + + .page-content-wrapper .text-container { + border-width: 0 1px 1px 1px; + box-sizing: border-box; + width: 100%; + } +} + +@media (max-width: 719.9px) and (min-width: 480.0px) { + #imGoToCont { + display: block; + -ms-grid-column: 2; + -ms-grid-column-span: 1; + grid-column: 2 / 3; + -ms-grid-row: 1; + -ms-grid-row-span: 1; + grid-row: 1 / 2; + } + + #imPageRow_2 { + display: block; + -ms-grid-column: 2; + -ms-grid-column-span: 24; + grid-column: 2 / 26; + -ms-grid-row: 3; + -ms-grid-row-span: 5; + grid-row: 3 / 8; + } + + #imContent { + padding-left: 5px; + padding-right: 5px; + } + + .imPageRow { + margin-left: -5px; + margin-right: -5px; + } + + #imPgTitle { + width: 464px; + margin-left: 2px; + margin-right: 2px; + } + + #page-title-container { + padding-top: 10px; + padding-bottom: 10px; + padding-left: 10px; + padding-right: 10px; + } + + #imCellStyleGraphics_1 { + left: 4px; + right: 4px; + } + + #imCellStyleBorders_1 { + left: 4px; + right: 4px; + border-top: 0; + border-bottom: 0; + border-left: 0; + border-right: 0; + } + + #page-title-container .text-container { + border-width: 0 1px 1px 1px; + box-sizing: border-box; + width: 100%; + } + + #imCell_2 { + padding-top: 10px; + padding-bottom: 10px; + padding-left: 4px; + padding-right: 4px; + } + + .page-content-wrapper { + padding-top: 10px; + padding-bottom: 10px; + padding-left: 10px; + padding-right: 10px; + } + + #imCellStyleGraphics_2, .textbg-image { + left: 4px; + right: 4px; + } + + #imCellStyleBorders_2 { + left: 4px; + right: 4px; + border-top: 0; + border-bottom: 0; + border-left: 0; + border-right: 0; + } + + .page-content-wrapper .text-container { + border-width: 0 1px 1px 1px; + box-sizing: border-box; + width: 100%; + } +} + +@media (max-width: 479.9px) { + #imContent { + display: -ms-grid; + display: grid; + -ms-grid-columns: 5px minmax(0, 1fr) 5px; + grid-template-columns: 5px minmax(0, 1fr) 5px; + -ms-grid-rows: auto auto auto; + grid-template-rows: auto auto auto; + } + + #imContent>header { + display: block; + -ms-grid-column: 2; + -ms-grid-column-span: 24; + grid-column: 2 / 26; + -ms-grid-row: 1; + -ms-grid-row-span: 1; + grid-row: 1 / 2; + } + + #imGoToCont { + display: block; + -ms-grid-column: 2; + -ms-grid-column-span: 1; + grid-column: 2 / 3; + -ms-grid-row: 1; + -ms-grid-row-span: 1; + grid-row: 1 / 2; + } + + #imCell_2 { + display: -ms-grid; + display: grid; + -ms-grid-column: 2; + -ms-grid-column-span: 24; + grid-column: 2 / 26; + -ms-grid-row: 3; + -ms-grid-row-span: 1; + grid-row: 3 / 4; + padding-top: 10px; + padding-bottom: 10px; + padding-left: 5px; + padding-right: 5px; + } + + #imPageRow_2 { + display: block; + -ms-grid-column: 2; + -ms-grid-column-span: 24; + grid-column: 2 / 26; + -ms-grid-row: 3; + -ms-grid-row-span: 1; + grid-row: 3 / 4; + } + + #imPgTitle { + width: 100%; + margin-left: 0px; + margin-right: 0px; + } + + #page-title-container { + padding-top: 10px; + padding-bottom: 10px; + padding-left: 10px; + padding-right: 10px; + } + + #imCellStyleGraphics_1 { + top: 10px; + bottom: 10px; + left: 5px; + right: 5px; + box-sizing: border-box; + } + + #page-title-container .text-container { + border-width: 0 1px 1px 1px; + box-sizing: border-box; + width: 100%; + } + + #page-title-wrapper .text-inner { + font-size: 26pt; + text-align: center; + } + + .page-content-wrapper { + padding-top: 10px; + padding-bottom: 10px; + padding-left: 10px; + padding-right: 10px; + } + + #imCellStyleGraphics_2, .textbg-image { + top: 10px; + bottom: 10px; + left: 5px; + right: 5px; + box-sizing: border-box; + } + + .page-content-wrapper .text-container { + border-width: 0 1px 1px 1px; + box-sizing: border-box; + width: 100%; + } } \ No newline at end of file diff --git a/css/tip.css b/css/tip.css new file mode 100644 index 0000000..8a2227d --- /dev/null +++ b/css/tip.css @@ -0,0 +1,19 @@ +/* Tip */ +.imTip { position: absolute; z-index: 100201; margin: 0 auto; padding: 10px; background-color: rgba(255, 255, 255, 1); border-style: solid; border-width: 1px 1px 1px 1px; border-color: rgba(255, 0, 0, 1) rgba(255, 0, 0, 1) rgba(255, 0, 0, 1) rgba(255, 0, 0, 1); border-top-left-radius: 5px; border-top-right-radius: 5px; border-bottom-left-radius: 5px; border-bottom-right-radius: 5px;border-top-left-radius: 5px; border-top-right-radius: 5px; border-bottom-left-radius: 5px; border-bottom-right-radius: 5px;} +.imTip { opacity: 0; transition: opacity 1s; } +@keyframes imTipTopBounce { 0% { transform: translateY(-200px); } 50% { transform: translateY(0); } 70% { transform: translateY(-20px); } 90% { transform: translateY(0); } 95% { transform: translateY(-3px); } 100% { transform: translateY(0); } }@keyframes imTipBottomBounce { 0% { transform: translateY(200px); } 50% { transform: translateY(0); } 70% { transform: translateY(20px); } 90% { transform: translateY(0); } 95% { transform: translateY(3px); } 100% { transform: translateY(0); } }@keyframes imTipLeftBounce { 0% { transform: translateX(-200px); } 50% { transform: translateX(0); } 70% { transform: translateX(-20px); } 90% { transform: translateX(0); } 95% { transform: translateX(-3px); } 100% { transform: translateX(0); } }@keyframes imTipRightBounce { 0% { transform: translateX(200px); } 50% { transform: translateX(0); } 70% { transform: translateX(20px); } 90% { transform: translateX(0); } 95% { transform: translateX(3px); } 100% { transform: translateX(0); } }.imTip.imTipTop.imTipVisible { opacity: 1; animation: 1s imTipTopBounce; } +.imTip.imTipBottom.imTipVisible { opacity: 1; animation: 1s imTipBottomBounce; } +.imTip.imTipLeft.imTipVisible { opacity: 1; animation: 1s imTipLeftBounce; } +.imTip.imTipRight.imTipVisible { opacity: 1; animation: 1s imTipRightBounce; } +.imTipArrowBorder, .imTipArrow { border-style: solid; height: 0; width: 0; position: absolute; } +.imTip.imTipTop>.imTipArrowBorder { border-color: rgba(255, 0, 0, 1) transparent transparent transparent; border-width: 11px 11px 0px 11px; top: 100%; left: calc(50% - 11px); } +.imTip.imTipTop>.imTipArrow { border-color: rgba(255, 255, 255, 1) transparent transparent transparent; border-width: 10px 10px 0px 10px; top: 100%; left: calc(50% - 10px); } +.imTip.imTipBottom>.imTipArrowBorder { border-color: transparent transparent rgba(255, 0, 0, 1) transparent; border-width: 0px 11px 11px 11px; bottom: 100%; left: calc(50% - 11px); } +.imTip.imTipBottom>.imTipArrow { border-color: transparent transparent rgba(255, 255, 255, 1) transparent; border-width: 0px 10px 10px 10px; bottom: 100%; left: calc(50% - 10px); } +.imTip.imTipLeft>.imTipArrowBorder { border-color: transparent transparent transparent rgba(255, 0, 0, 1); border-width: 11px 0px 11px 11px; left: 100%; top: calc(50% - 11px); } +.imTip.imTipLeft>.imTipArrow { border-color: transparent transparent transparent rgba(255, 255, 255, 1); border-width: 10px 0px 10px 10px; left: 100%; top: calc(50% - 10px); } +.imTip.imTipRight>.imTipArrowBorder { border-color: transparent rgba(255, 0, 0, 1) transparent transparent; border-width: 11px 11px 11px 0px; right: 100%; top: calc(50% - 11px); } +.imTip.imTipRight>.imTipArrow { border-color: transparent rgba(255, 255, 255, 1) transparent transparent; border-width: 10px 10px 10px 0px; right: 100%; top: calc(50% - 10px); } +.imTipContent { width: 100%; font: normal normal normal 13pt 'Open Sans'; color: rgba(67, 67, 67, 1); background-color: rgba(255, 255, 255, 1); text-decoration: none; text-align: center; } +.imTipContent img { margin-bottom: 6px; max-width: 100%; } +.imTip.textLeft .imTipContent { text-align: left; } \ No newline at end of file