html { scroll-behavior: smooth; } .template-pages { padding-top: 0em; } #accordionPanelsStayOpenExample { margin: 0 7%; } .supsearch-youtube { } .ck-content { padding: 0 2%; } .sup-hoz-section { background: url(/supsearch/img/sup-hoz.jpg) 0% 0% / cover; background-size: cover; background-attachment: fixed; height: 36em; margin-top: 4%; position: relative; background-position-y: 20%; width: 100%; padding-top: 10%; position: relative; } .sup-hoz-section .overlay { background: linear-gradient(to right, rgb(78, 84, 200, .5), rgb(143, 148, 251, .5)); background: linear-gradient(to right, rgb(241 71 18 / 75%), rgb(143, 148, 251, .35)); position: absolute; left: 0; right: 0; top: 0; bottom: 0; padding-top: 9%; z-index: 1; } .main-img-tl { position: relative; padding: 10%; margin-bottom: 1.5%; margin-top: -0.6em; background: url(/supsearch/img/hero-image1.jpg); /* background: url(/timeline0/img/2022/hero-image-3gs.jpg); */ background-size: cover; color: #FFF; background-position-y: -10em; padding-bottom: 30%; } .template-breadcrumb-container { margin-top: 2em; padding-left: 1em; position: absolute; z-index: 5; color: #FFF !important; display: none; } p.timeline-intro.aos-init.aos-animate { font-weight: 300; } .accordion-body { padding: 4% 7%; } .sup-red-box { background: #931010; background: #dc3545; background: linear-gradient(to right, rgb(203, 53, 107), rgb(189, 63, 50)); padding: 3% 7% 7% 7%; min-height: 34em; text-align: center; } .sup-blue-box { background: #0a2d60; background: linear-gradient(to right, rgb(0, 92, 151), rgb(54, 55, 149)); padding: 3% 7% 7% 7%; min-height: 34em; text-align: center; } .sup-red-box, .sup-blue-box { color: #FFF; } .sup-red-box li, .sup-blue-box li{ list-style-type: none; padding: 0.5em 0 0; cursor: pointer; transition: .2s; font-size: 1.2em; text-align: left; } .sup-red-box li:hover, .sup-blue-box li:hover { background: rgb(1 7 16 / 40%); } .sup-red-box a, .sup-blue-box a { color: #FFF; margin-bottom: 3%; display: inline-block; font-weight: 300; text-decoration: none; border-bottom: 0.12em #ffc107 solid; } .sup-red-box h3, .sup-blue-box h3 { font-weight: bold; font-size: 2.2em; padding-bottom: 0.5em; border-bottom: 0.09em solid #212121; margin-bottom: 5%; text-transform: uppercase; } a.btn.btn-inline:hover, .btn-1:hover { background: linear-gradient(to right, rgb(131, 58, 180), rgb(253, 29, 29), rgb(252, 176, 69)); } .boldest { font-weight: 900; } .accordion-button:not(.collapsed) { color: #ffffff; background-color: #dc3545; background: linear-gradient(to right, rgb(238, 9, 121), rgb(255, 106, 0)); background: linear-gradient(to right, rgb(131, 58, 180), rgb(253, 29, 29), rgb(252, 176, 69)); box-shadow: inset 0 calc(-1 * var(--bs-accordion-border-width)) 0 var(--bs-accordion-border-color); } .accordion-body { font-weight: 300; font-size: 1.1em; } .containerSupSearch { margin: -2% 14% 4% 14%; } .ideal { margin: 10% auto; position: relative; clear: both; } /* h3, .faqs { text-align: center; margin: 5% 3% 0% 3%; font-size: 3em; font-weight: 900; } */ h3, .faqs { text-align: center; margin: 1.5% 3% 1% 3%; font-size: 3em; font-weight: 600; color: #fff; padding: 0.2em; } /* .g-bkd { background: linear-gradient(to right, rgb(131, 58, 180), rgb(253, 29, 29), rgb(252, 176, 69)); } */ .g-bkd { background: linear-gradient(to right, rgb(131, 58, 180), rgb(253, 29, 29), rgb(252, 176, 69)); margin-top: 37px; } .sup-overlay { position: absolute; /* background: rgb(0 0 255 / 22%); */ /* top: 0; */ bottom: 0; left: 0; right: 0; } .text-overlay { position: absolute; top: 0; bottom: 0; left: 0; right: 0; z-index: 1; padding-top: 14em; } .timeline-search { color: #FFF !important; text-align: center; font-size: 500% !important; z-index: 3; } p.timeline-intro { font-size: 150%; font-weight: normal; margin: 0% 25% 4% 25%; padding: 0; /* background: hsl(0deg 0% 13% / 90%); */ } .template-breadcrumb-container a { color: #FFF; } ol.breadcrumb li { color: #FFF; margin-bottom: 7%; } h2:nth-child(1) { padding: 0 !important; } .off-canvas-menu button.navbar-toggler { margin-top: -3.2em; margin-top: -4.2em; margin-top: -4em !important; } .mscs-template-side-menu { background: #f3f3f3; padding: 1% 0 2% 0; margin: 0 1em; border-top: solid #4d90fe; } .mscs-template-side-menu h2:nth-child(1) { padding: 0em 0em 0em; text-transform: uppercase; color: #343434; font-size: 1.9em; font-weight: bold; margin-bottom: 0; } .mscs-template-side-menu a { color: #403e3e; font-weight: 400; font-size: .92em; text-decoration: none; } .mscs-template-side-menu a:hover { color: #0f4aa3; } .mscs-template-side-menu ul li { list-style-type: none; font-weight: normal; padding: 0.5em 1.5em 0.5em 0; } .template-page-staff-container { width: 70%; margin: 2%; } table { border-collapse: collapse; width: 100%; } th, td { text-align: left; padding: 8px; } tr:nth-child(even) {background-color: #f2f2f2;} @media only screen and (max-width: 1200px) { .containerSupSearch { margin: 0 10% 4% 10%; } p.timeline-intro { font-size: 120%; font-weight: normal; margin: 0% 25% 4% 25%; padding: 0; /* background: hsl(0deg 0% 13% / 90%); */ } .ck-content .table table { width: auto; height: auto; display: block; margin: auto; } figure.table { margin: auto !important; width: auto !important; } } @media only screen and (max-width: 1100px) { .template-pages { padding-top: 0em; } .faqs { /* font-size: 2em; */ font-size: 40px; } } @media only screen and (max-width: 700px) { .template-pages { padding-top: 0em; } .faqs { font-size: 2.5em; } } @media only screen and (max-width: 500px) { .template-pages { padding-top: 0em; } .faqs { font-size: 3em; } } /* CKEDITOR STYLES */ /* * CKEditor 5 (v36.0.1) content styles. * Generated on Wed, 29 Mar 2023 09:49:06 GMT. * For more information, check out https://ckeditor.com/docs/ckeditor5/latest/installation/advanced/content-styles.html */ :root { --ck-color-image-caption-background: hsl(0, 0%, 97%); --ck-color-image-caption-text: hsl(0, 0%, 20%); --ck-color-mention-background: hsla(341, 100%, 30%, 0.1); --ck-color-mention-text: hsl(341, 100%, 30%); --ck-color-table-caption-background: hsl(0, 0%, 97%); --ck-color-table-caption-text: hsl(0, 0%, 20%); --ck-highlight-marker-blue: hsl(201, 97%, 72%); --ck-highlight-marker-green: hsl(120, 93%, 68%); --ck-highlight-marker-pink: hsl(345, 96%, 73%); --ck-highlight-marker-yellow: hsl(60, 97%, 73%); --ck-highlight-pen-green: hsl(112, 100%, 27%); --ck-highlight-pen-red: hsl(0, 85%, 49%); --ck-image-style-spacing: 1.5em; --ck-inline-image-style-spacing: calc(var(--ck-image-style-spacing) / 2); --ck-todo-list-checkmark-size: 16px; } /* @ckeditor/ckeditor5-font/theme/fontsize.css */ .ck-content .text-tiny { font-size: .7em; } /* @ckeditor/ckeditor5-font/theme/fontsize.css */ .ck-content .text-small { font-size: .85em; } /* @ckeditor/ckeditor5-font/theme/fontsize.css */ .ck-content .text-big { font-size: 1.4em; } /* @ckeditor/ckeditor5-font/theme/fontsize.css */ .ck-content .text-huge { font-size: 1.8em; } /* @ckeditor/ckeditor5-block-quote/theme/blockquote.css */ .ck-content blockquote { overflow: hidden; padding-right: 1.5em; padding-left: 1.5em; margin-left: 0; margin-right: 0; font-style: italic; border-left: solid 5px hsl(0, 0%, 80%); } /* @ckeditor/ckeditor5-block-quote/theme/blockquote.css */ .ck-content[dir="rtl"] blockquote { border-left: 0; border-right: solid 5px hsl(0, 0%, 80%); } /* @ckeditor/ckeditor5-basic-styles/theme/code.css */ .ck-content code { background-color: hsla(0, 0%, 78%, 0.3); padding: .15em; border-radius: 2px; } /* @ckeditor/ckeditor5-highlight/theme/highlight.css */ .ck-content .marker-yellow { background-color: var(--ck-highlight-marker-yellow); } /* @ckeditor/ckeditor5-highlight/theme/highlight.css */ .ck-content .marker-green { background-color: var(--ck-highlight-marker-green); } /* @ckeditor/ckeditor5-highlight/theme/highlight.css */ .ck-content .marker-pink { background-color: var(--ck-highlight-marker-pink); } /* @ckeditor/ckeditor5-highlight/theme/highlight.css */ .ck-content .marker-blue { background-color: var(--ck-highlight-marker-blue); } /* @ckeditor/ckeditor5-highlight/theme/highlight.css */ .ck-content .pen-red { color: var(--ck-highlight-pen-red); background-color: transparent; } /* @ckeditor/ckeditor5-highlight/theme/highlight.css */ .ck-content .pen-green { color: var(--ck-highlight-pen-green); background-color: transparent; } /* @ckeditor/ckeditor5-image/theme/imagecaption.css */ .ck-content .image > figcaption { display: table-caption; caption-side: bottom; word-break: break-word; color: var(--ck-color-image-caption-text); background-color: var(--ck-color-image-caption-background); padding: .6em; font-size: .75em; outline-offset: -1px; } /* @ckeditor/ckeditor5-image/theme/imageresize.css */ .ck-content .image.image_resized { max-width: 100%; display: block; box-sizing: border-box; } /* @ckeditor/ckeditor5-image/theme/imageresize.css */ .ck-content .image.image_resized img { width: 100%; } /* @ckeditor/ckeditor5-image/theme/imageresize.css */ .ck-content .image.image_resized > figcaption { display: block; } /* @ckeditor/ckeditor5-image/theme/image.css */ .ck-content .image { display: table; clear: both; text-align: center; margin: 0.9em auto; min-width: 50px; } /* @ckeditor/ckeditor5-image/theme/image.css */ .ck-content .image img { display: block; margin: 0 auto; max-width: 100%; min-width: 100%; } /* @ckeditor/ckeditor5-image/theme/image.css */ .ck-content .image-inline { /* * Normally, the .image-inline would have "display: inline-block" and "img { width: 100% }" (to follow the wrapper while resizing).; * Unfortunately, together with "srcset", it gets automatically stretched up to the width of the editing root. * This strange behavior does not happen with inline-flex. */ display: inline-flex; max-width: 100%; align-items: flex-start; } /* @ckeditor/ckeditor5-image/theme/image.css */ .ck-content .image-inline picture { display: flex; } /* @ckeditor/ckeditor5-image/theme/image.css */ .ck-content .image-inline picture, .ck-content .image-inline img { flex-grow: 1; flex-shrink: 1; max-width: 100%; } /* @ckeditor/ckeditor5-image/theme/imagestyle.css */ .ck-content .image-style-block-align-left, .ck-content .image-style-block-align-right { max-width: calc(100% - var(--ck-image-style-spacing)); } /* @ckeditor/ckeditor5-image/theme/imagestyle.css */ .ck-content .image-style-align-left, .ck-content .image-style-align-right { clear: none; } /* @ckeditor/ckeditor5-image/theme/imagestyle.css */ .ck-content .image-style-side { float: right; margin-left: var(--ck-image-style-spacing); max-width: 50%; } /* @ckeditor/ckeditor5-image/theme/imagestyle.css */ .ck-content .image-style-align-left { float: left; margin-right: var(--ck-image-style-spacing); } /* @ckeditor/ckeditor5-image/theme/imagestyle.css */ .ck-content .image-style-align-center { margin-left: auto; margin-right: auto; } /* @ckeditor/ckeditor5-image/theme/imagestyle.css */ .ck-content .image-style-align-right { float: right; margin-left: var(--ck-image-style-spacing); } /* @ckeditor/ckeditor5-image/theme/imagestyle.css */ .ck-content .image-style-block-align-right { margin-right: 0; margin-left: auto; } /* @ckeditor/ckeditor5-image/theme/imagestyle.css */ .ck-content .image-style-block-align-left { margin-left: 0; margin-right: auto; } /* @ckeditor/ckeditor5-image/theme/imagestyle.css */ .ck-content p + .image-style-align-left, .ck-content p + .image-style-align-right, .ck-content p + .image-style-side { margin-top: 0; } /* @ckeditor/ckeditor5-image/theme/imagestyle.css */ .ck-content .image-inline.image-style-align-left, .ck-content .image-inline.image-style-align-right { margin-top: var(--ck-inline-image-style-spacing); margin-bottom: var(--ck-inline-image-style-spacing); } /* @ckeditor/ckeditor5-image/theme/imagestyle.css */ .ck-content .image-inline.image-style-align-left { margin-right: var(--ck-inline-image-style-spacing); } /* @ckeditor/ckeditor5-image/theme/imagestyle.css */ .ck-content .image-inline.image-style-align-right { margin-left: var(--ck-inline-image-style-spacing); } /* @ckeditor/ckeditor5-language/theme/language.css */ .ck-content span[lang] { font-style: italic; } /* @ckeditor/ckeditor5-list/theme/todolist.css */ .ck-content .todo-list { list-style: none; } /* @ckeditor/ckeditor5-list/theme/todolist.css */ .ck-content .todo-list li { margin-bottom: 5px; } /* @ckeditor/ckeditor5-list/theme/todolist.css */ .ck-content .todo-list li .todo-list { margin-top: 5px; } /* @ckeditor/ckeditor5-list/theme/todolist.css */ .ck-content .todo-list .todo-list__label > input { -webkit-appearance: none; display: inline-block; position: relative; width: var(--ck-todo-list-checkmark-size); height: var(--ck-todo-list-checkmark-size); vertical-align: middle; border: 0; left: -25px; margin-right: -15px; right: 0; margin-left: 0; } /* @ckeditor/ckeditor5-list/theme/todolist.css */ .ck-content .todo-list .todo-list__label > input::before { display: block; position: absolute; box-sizing: border-box; content: ''; width: 100%; height: 100%; border: 1px solid hsl(0, 0%, 20%); border-radius: 2px; transition: 250ms ease-in-out box-shadow, 250ms ease-in-out background, 250ms ease-in-out border; } /* @ckeditor/ckeditor5-list/theme/todolist.css */ .ck-content .todo-list .todo-list__label > input::after { display: block; position: absolute; box-sizing: content-box; pointer-events: none; content: ''; left: calc( var(--ck-todo-list-checkmark-size) / 3 ); top: calc( var(--ck-todo-list-checkmark-size) / 5.3 ); width: calc( var(--ck-todo-list-checkmark-size) / 5.3 ); height: calc( var(--ck-todo-list-checkmark-size) / 2.6 ); border-style: solid; border-color: transparent; border-width: 0 calc( var(--ck-todo-list-checkmark-size) / 8 ) calc( var(--ck-todo-list-checkmark-size) / 8 ) 0; transform: rotate(45deg); } /* @ckeditor/ckeditor5-list/theme/todolist.css */ .ck-content .todo-list .todo-list__label > input[checked]::before { background: hsl(126, 64%, 41%); border-color: hsl(126, 64%, 41%); } /* @ckeditor/ckeditor5-list/theme/todolist.css */ .ck-content .todo-list .todo-list__label > input[checked]::after { border-color: hsl(0, 0%, 100%); } /* @ckeditor/ckeditor5-list/theme/todolist.css */ .ck-content .todo-list .todo-list__label .todo-list__label__description { vertical-align: middle; } /* @ckeditor/ckeditor5-list/theme/list.css */ .ck-content ol { list-style-type: decimal; } /* @ckeditor/ckeditor5-list/theme/list.css */ .ck-content ol ol { list-style-type: lower-latin; } /* @ckeditor/ckeditor5-list/theme/list.css */ .ck-content ol ol ol { list-style-type: lower-roman; } /* @ckeditor/ckeditor5-list/theme/list.css */ .ck-content ol ol ol ol { list-style-type: upper-latin; } /* @ckeditor/ckeditor5-list/theme/list.css */ .ck-content ol ol ol ol ol { list-style-type: upper-roman; } /* @ckeditor/ckeditor5-list/theme/list.css */ .ck-content ul { list-style-type: disc; } /* @ckeditor/ckeditor5-list/theme/list.css */ .ck-content ul ul { list-style-type: circle; } /* @ckeditor/ckeditor5-list/theme/list.css */ .ck-content ul ul ul { list-style-type: square; } /* @ckeditor/ckeditor5-list/theme/list.css */ .ck-content ul ul ul ul { list-style-type: square; } /* @ckeditor/ckeditor5-media-embed/theme/mediaembed.css */ .ck-content .media { clear: both; margin: 0.9em 0; display: block; min-width: 15em; } /* @ckeditor/ckeditor5-page-break/theme/pagebreak.css */ .ck-content .page-break { position: relative; clear: both; padding: 5px 0; display: flex; align-items: center; justify-content: center; } /* @ckeditor/ckeditor5-page-break/theme/pagebreak.css */ .ck-content .page-break::after { content: ''; position: absolute; border-bottom: 2px dashed hsl(0, 0%, 77%); width: 100%; } /* @ckeditor/ckeditor5-page-break/theme/pagebreak.css */ .ck-content .page-break__label { position: relative; z-index: 1; padding: .3em .6em; display: block; text-transform: uppercase; border: 1px solid hsl(0, 0%, 77%); border-radius: 2px; font-family: Helvetica, Arial, Tahoma, Verdana, Sans-Serif; font-size: 0.75em; font-weight: bold; color: hsl(0, 0%, 20%); background: hsl(0, 0%, 100%); box-shadow: 2px 2px 1px hsla(0, 0%, 0%, 0.15); -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } /* @ckeditor/ckeditor5-table/theme/table.css */ .ck-content .table { margin: 0.9em auto; display: table; } /* @ckeditor/ckeditor5-table/theme/table.css */ .ck-content .table table { border-collapse: collapse; border-spacing: 0; width: 100%; height: 100%; border: 1px double hsl(0, 0%, 70%); } /* @ckeditor/ckeditor5-table/theme/table.css */ .ck-content .table table td, .ck-content .table table th { min-width: 2em; padding: .4em; border: 1px solid hsl(0, 0%, 75%); } /* @ckeditor/ckeditor5-table/theme/table.css */ .ck-content .table table th { font-weight: bold; background: hsla(0, 0%, 0%, 5%); } /* @ckeditor/ckeditor5-table/theme/table.css */ .ck-content[dir="rtl"] .table th { text-align: right; } /* @ckeditor/ckeditor5-table/theme/table.css */ .ck-content[dir="ltr"] .table th { text-align: left; } /* @ckeditor/ckeditor5-table/theme/tablecaption.css */ .ck-content .table > figcaption { display: table-caption; caption-side: top; word-break: break-word; text-align: center; color: var(--ck-color-table-caption-text); background-color: var(--ck-color-table-caption-background); padding: .6em; font-size: .75em; outline-offset: -1px; } /* @ckeditor/ckeditor5-table/theme/tablecolumnresize.css */ .ck-content .table .ck-table-resized { table-layout: fixed; } /* @ckeditor/ckeditor5-table/theme/tablecolumnresize.css */ .ck-content .table table { overflow: hidden; } /* @ckeditor/ckeditor5-table/theme/tablecolumnresize.css */ .ck-content .table td, .ck-content .table th { position: relative; } /* @ckeditor/ckeditor5-code-block/theme/codeblock.css */ .ck-content pre { padding: 1em; color: hsl(0, 0%, 20.8%); background: hsla(0, 0%, 78%, 0.3); border: 1px solid hsl(0, 0%, 77%); border-radius: 2px; text-align: left; direction: ltr; tab-size: 4; white-space: pre-wrap; font-style: normal; min-width: 200px; } /* @ckeditor/ckeditor5-code-block/theme/codeblock.css */ .ck-content pre code { background: unset; padding: 0; border-radius: 0; } /* @ckeditor/ckeditor5-horizontal-line/theme/horizontalline.css */ .ck-content hr { margin: 15px 0; height: 4px; background: hsl(0, 0%, 87%); border: 0; } /* @ckeditor/ckeditor5-mention/theme/mention.css */ .ck-content .mention { background: var(--ck-color-mention-background); color: var(--ck-color-mention-text); } @media print { /* @ckeditor/ckeditor5-page-break/theme/pagebreak.css */ .ck-content .page-break { padding: 0; } /* @ckeditor/ckeditor5-page-break/theme/pagebreak.css */ .ck-content .page-break::after { display: none; } } /* CKEDITOR STYLES */ a, span { font-weight: bold; } figure { margin: 0 0 20px; padding: 0; } .center-pic { display: block; margin: auto; } .editor-container { margin-top: 4%; } a.nav-link { /* color: #ffc107 !important; */ } h2:nth-child(1) { padding: 0 0.5em 1em; text-transform: uppercase; color: #343434; font-size: 1.9em; margin-bottom: 0; } /* YOUTUBE */ .supsearch-youtube { margin: 7% 1%; background: #CCC; background: linear-gradient(to right, rgb(55, 59, 68), rgb(66, 134, 244)); padding: 5%; } /* YOUTUBE */ @media only screen and (max-width: 1200px) { .center-pic { width: 100%; } .main-img-tl { position: relative; padding: 10%; margin-bottom: 1.5%; margin-top: -0.6em; background: url(/timeline0/img/2022/hero-image-1.jpg); /* background: url(/timeline0/img/2022/hero-image-3gs.jpg); */ color: #FFF; background-position-y: -10em; min-height: 40em; } } @media only screen and (max-width: 1000px) { } @media only screen and (max-width: 860px) { .containerSupSearch { margin: 4% 0%; } .ck-content { padding: 0 1%; } } @media only screen and (max-width: 767px) { p.timeline-intro { font-size: 100%; margin: 0% 6% 4% 6%; padding: 0; } .text-overlay { padding-top: 24em; } .main-img-tl { /* min-height: 40em; */ position: relative; padding: 10%; margin-bottom: 1.5%; margin-top: -0.6em; background: url(/timeline0/img/2022/hero-image-1.jpg); /* background: url(/timeline0/img/2022/hero-image-3gs.jpg); */ color: #FFF; background-position-y: -2em; background-position-x: center; min-height: 40em; } @media only screen and (max-width: 540px) { .timeline-search { color: #FFF !important; text-align: center; font-size: 300% !important; z-index: 3; } p.timeline-intro { font-size: 100%; margin: 0% 6% 4% 6%; padding: 0; } }