/* HorusPro styles are in App.css */
  --shadow:
    rgba(0, 0, 0, 0.1) 0 10px 15px -3px, rgba(0, 0, 0, 0.05) 0 4px 6px -2px;

  --sans: system-ui, 'Segoe UI', Roboto, sans-serif;
  --heading: system-ui, 'Segoe UI', Roboto, sans-serif;
  --mono: ui-monospace, Consolas, monospace;

  font: 18px/145% var(--sans);
  letter-spacing: 0.18px;
  color-scheme: light dark;
  color: var(--text);
  background: var(--bg);
  font-synthesis: none;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;

  @media (max-width: 1024px) {
    font-size: 16px;
  }
}

@media (prefers-color-scheme: dark) {
  :root {
    --text: #9ca3af;
    --text-h: #f3f4f6;
    --bg: #16171d;
    --border: #2e303a;
    --code-bg: #1f2028;
    --accent: #c084fc;
    --accent-bg: rgba(192, 132, 252, 0.15);
    --accent-border: rgba(192, 132, 252, 0.5);
    --social-bg: rgba(47, 48, 58, 0.5);
    --shadow:
      rgba(0, 0, 0, 0.4) 0 10px 15px -3px, rgba(0, 0, 0, 0.25) 0 4px 6px -2px;
  }

  #social .button-icon {
    filter: invert(1) brightness(2);
  }
}

body {
  margin: 0;
}

#root {
  width: 1126px;
  max-width: 100%;
  margin: 0 auto;
  text-align: center;
  border-inline: 1px solid var(--border);
  min-height: 100svh;
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
}

h1,
h2 {
  font-family: var(--heading);
  font-weight: 500;
  color: var(--text-h);
}

h1 {
  font-size: 56px;
  letter-spacing: -1.68px;
  margin: 32px 0;
  @media (max-width: 1024px) {
    font-size: 36px;
    margin: 20px 0;
  }
}
h2 {
  font-size: 24px;
  line-height: 118%;
  letter-spacing: -0.24px;
  margin: 0 0 8px;
  @media (max-width: 1024px) {
    font-size: 20px;
  }
}
p {
  margin: 0;
}

code,
.counter {
  font-family: var(--mono);
  display: inline-flex;
  border-radius: 4px;
  color: var(--text-h);
}

code {
  font-size: 15px;
  line-height: 135%;
  padding: 4px 8px;
  background: var(--code-bg);
}
/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*
    HORUSPRO REACT REPLICA - MASTER STYLESHEET
    Based on original ASP.NET WebForms theme
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

/* HTML TAGS */
body {
    margin: 0px;
    background-color: #FFFFFF;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 0.7em;
    line-height: 1.4em;
    color: #666666;
}

p {
    margin: 10px 0;
}

p.no-padding-no-margin {
    padding: 0;
    margin: 0;
}

hr {
    color: #E5E5E5;
    background-color: #E5E5E5;
    height: 1px;
    border: 0;
    margin: 15px 0;
}

blockquote {
    padding: 0 0 0 12px;
    margin: 12px 0 0 0;
    background: url(/images/bg-quote.png) no-repeat;
}

blockquote p {
    margin: 2px 0;
}

cite {
    font-size: .85em;
    margin: 0;
    padding: 0 0 0 6px;
}

fieldset {
    padding: 15px;
}

legend {
    color: #333333;
    padding: 5px 3px 10px 3px;
}

/* HEADINGS */
h1, h2, h3, h4, h5, h6 {
    font-size: 1.8em;
    font-family: Tahoma, Arial, Helvetica, sans-serif;
    line-height: 1.1em;
    margin: 5px 0;
}

h1 {
    margin-bottom: 0;
}

h1, h2 {
    margin-top: 0px;
}

h2 {
    font-size: 1.3em;
}

h3 {
    font-size: 1.1em;
}

h3.small {
    font-size: 1.2em;
}

h4 {
    font-size: 1.1em;
}

h5 {
    font-size: 1.1em;
}

h6 {
    font-size: 1em;
}

/* LINKS */
a:link {
    color: #d61719;
    text-decoration: none;
}

a:visited {
    color: #980000;
    text-decoration: none;
}

a:hover {
    text-decoration: none;
}

a:active {
    color: #980000;
}

#content-side-two-column a:link,
#content-side2-three-column a:link,
#content-side1-three-column a:link,
#content-side-two-column a:visited,
#content-side2-three-column a:visited,
#content-side1-three-column a:visited {
    text-decoration: none;
}

#content-side-two-column a:hover,
#content-side2-three-column a:hover,
#content-side1-three-column a:hover {
    text-decoration: underline;
}

/* TOP INFORMATION */
#top-information {
    height: 7.5em;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 3px;
    color: #999999;
    font-size: .85em;
    position: relative;
    width: 760px;
}

#logo-image {
    position: absolute;
    top: 0px;
    left: 15px;
    font-size: 2.6em;
    font-family: Georgia, "Times New Roman", Times, serif;
    height: 2.8em;
    padding: .1em 0 .2em 0;
    font-variant: small-caps;
}

#logo-text {
    position: absolute;
    top: 1em;
    left: 115px;
    font-size: 2.6em;
    font-family: Georgia, "Times New Roman", Times, serif;
    height: 2.8em;
    padding: .1em 0 .2em 0;
    font-variant: small-caps;
}

#logo-text a {
    color: #0bb7ff;
    text-decoration: none;
}

#top-information-home {
    text-align: right;
    border-bottom: 1px dashed #CACACA;
    position: absolute;
    top: 0;
    right: 25.5%;
    height: 2em;
    width: 15%;
    padding: 0 1.5% 0 0;
}

#top-information-phone {
    text-align: center;
    border-left: 1px dashed #CACACA;
    position: absolute;
    top: 0;
    left: 75%;
    height: 100%;
    padding: 0 0 0 2%;
}

#top-information-link {
    text-align: center;
    border-left: 1px dashed #CACACA;
    position: absolute;
    top: 0;
    right: 0;
    height: 2em;
    width: 8.5%;
    padding: 0 0 0 1.5%;
}

#heading {
    text-align: left;
    font-size: 1.4em;
    font-weight: bold;
}

#subheading {
    font-size: 1.1em;
    font-weight: bold;
}

/* MAIN NAV */
#nav-main {
    background: #0bb7ff url(/images/bg-nav.png) no-repeat;
    margin-left: auto;
    margin-right: auto;
    width: 740px;
    padding: .8em 0 1em 20px;
    position: relative;
    font-weight: bold;
}

#nav-main .nav-side-decoration {
    background: #4b6cb5 url(/images/bg-nav-side.png) top right no-repeat;
    width: 25%;
    position: absolute;
    top: 0;
    right: 0;
    padding: .8em 0 1em 0;
}

#nav-main ul {
    margin: 0;
    padding: 0 20% 0 0;
}

#nav-main li {
    display: inline;
    list-style: none;
    padding: 0 1em 0 0;
    background: none;
}

#nav-main a {
    color: #FFFFFF;
    text-decoration: none;
}

#nav-main a:hover {
    color: #D4E7F8;
    text-decoration: underline;
}

#nav-main a:active {
    color: #FFFFFF;
}

#nav-main li.current a,
#nav-main a.active-link {
    text-decoration: underline;
}

#nav-main li.current a:hover,
#nav-main a.active-link:hover {
    color: #D4E7F8;
    text-decoration: underline;
}

/* pagetitle */
#pagetitle {
    margin-top: 2px;
    margin-left: auto;
    margin-right: auto;
    width: 720px;
    background: #0bb7ff;
    position: relative;
    color: #d5e8ff;
    font-size: large;
    padding: .5em 20px .7em 20px;
}

#pagetitle a:link,
#pagetitle a:visited {
    color: #FFFFFF;
    text-decoration: none;
}

#pagetitle a:hover {
    color: #D4E7F8;
    text-decoration: none;
}

/* CONTENT CONTAINER - TWO COLUMN */
#content-container-two-column {
    margin-top: 3px;
    margin-left: auto;
    margin-right: auto;
    padding: 15px;
    width: 728px;
    border: 1px solid #818181;
    background: url(/images/bg-content-side.png) repeat-y right;
    position: relative;
}

#content-main-two-column {
    width: 540px;
    float: left;
}

#content-side-two-column {
    float: right;
    width: 160px;
}

/* CONTENT CONTAINER - THREE COLUMN */
#content-container-three-column {
    margin-top: 3px;
    margin-left: auto;
    margin-right: auto;
    padding: 15px;
    width: 728px;
    border: 1px solid #818181;
    background: url(/images/bg-three-column-main.png) repeat-y;
    position: relative;
}

#content-main-three-column {
    width: 355px;
    float: left;
    margin-left: 25px;
}

#content-side2-three-column,
#content-side1-three-column {
    width: 160px;
    font-size: .9em;
}

#content-side2-three-column {
    float: right;
}

#content-side1-three-column {
    float: left;
}

/* HOME PAGE - THREE COLUMN SECTION */
#three-column-container {
    background: url(/images/bg-three-column-home.png) repeat-y;
    padding: 0;
    margin: 20px 0 10px 0;
}

#three-column-side1 {
    float: left;
    width: 30%;
}

#three-column-side2 {
    float: right;
    width: 30%;
}

#three-column-middle {
    width: 30%;
    margin: 0px 32% 0px 35%;
}

/* POSTER PHOTO */
#poster-photo-container {
    margin-top: 3px;
    margin-left: auto;
    margin-right: auto;
    width: 760px;
    background: #0bb7ff;
    position: relative;
}

.poster-photo-image {
    border-right: 3px solid #FFF;
    display: block;
}

#feature-area-home {
    position: absolute;
    top: 0;
    right: 0;
    width: 21%;
    text-align: center;
    padding: 2%;
    color: #FFFFFF;
    font-size: 1.2em;
    font-weight: bold;
    line-height: 160%;
}

#feature-area-home a:link,
#feature-area-home a:visited {
    color: #dcf2f7;
    text-decoration: underline;
}

#feature-area-home a:hover {
    text-decoration: none;
}

/* LISTS */
ul {
    margin: 0;
    padding: 0;
}

li {
    list-style: none;
    background: url(/images/list-bullet-02.gif) no-repeat 0 .8em;
    padding: .2em 0 .2em 1em;
    margin-left: 0.4em;
}

ul.list-of-links {
    border-bottom: 1px dotted #B2B2B2;
}

#content-side1-three-column ul.list-of-links,
#content-side2-three-column ul.list-of-links {
    margin: 0 0 30px 0px;
}

ul.list-of-links li {
    border-top: 1px dotted #B2B2B2;
    background-image: url(/images/list-bullet-01-link.gif);
}

ul.list-of-links li.current {
    background-color: #E5E5E5;
}

ul.no-lines,
ul.no-lines li {
    border: none;
}

/* IMAGES & PHOTOS */
img {
    border: none;
}

.photo-border {
    border: 1px solid #cecece;
    padding: 4px;
    background: #d9d9d9 url(/images/bg-photo.png) top repeat-x;
    margin-bottom: 5px;
    display: block;
}

.photo-float-left {
    float: left;
    margin-right: 10px;
}

.image-border-none {
    border: none;
}

/* FOOTER */
#footer {
    background: #0bb7ff url(/images/bg-nav.png) bottom left no-repeat;
    margin-top: 3px;
    margin-left: auto;
    margin-right: auto;
    width: 740px;
    padding: .8em 0 1em 20px;
    position: relative;
    color: captiontext;
    font-size: .8em;
}

#footer .footer-side-decoration {
    background: #4b6cb5 url(/images/bg-nav-side.png) bottom right no-repeat;
    width: 25%;
    position: absolute;
    top: 0;
    right: 0;
    padding: .8em 0 1em 0;
}

#footer a:link,
#footer a:visited {
    color: #FFFFFF;
    text-decoration: none;
}

#footer a:hover {
    color: #D4E7F8;
    text-decoration: none;
}

#footer a:active {
    color: #FFFFFF;
}

/* FOOTER-SUB */
#footer-sub {
    margin-top: 1em;
    margin-left: auto;
    margin-right: auto;
    width: 740px;
    text-align: center;
    padding: .1em 0 2em 0;
    position: relative;
    font-size: .8em;
    color: #999999;
}

#footer-sub ul {
    margin: 0;
    padding: 0;
}

#footer-sub li {
    display: inline;
    list-style: none;
    padding: 0 1em 0 0;
    background: none;
}

#footer-sub a:link,
#footer-sub a:visited {
    text-decoration: underline;
    color: #999999;
}

#footer-sub a:hover {
    color: #666666;
    text-decoration: none;
}

/* MISC CLASSES */
.news-date {
    font-size: 0.9em;
    font-style: italic;
    color: #A4A4A4;
}

.arrow {
    vertical-align: middle;
}

input.button-big {
    font-weight: bold;
    padding: .7em 1.5em;
    font-size: 1.1em;
    vertical-align: bottom;
}

input.button-small {
    font-weight: normal;
    padding: .4em 1em;
    font-size: .8em;
    vertical-align: bottom;
}

.clear {
    clear: both;
}

.none {
    display: none;
}

/* App wrapper */
.app-wrapper {
    width: 100%;
}

/* TreeView styles */
.TreeView {
    border-bottom: 1px dotted #B2B2B2;
}

.TreeView div {
    margin-left: 5px;
}

.TreeView table {
    border-top: 1px dotted #B2B2B2;
}

.TreeView div table {
    border-bottom: none;
    border-top: none;
}

.TreeView table td {
    padding: 2px 0;
}

.SelectedNodeStyle {
    background: #E5E5E5;
    display: block;
    padding: 2px 0 2px 3px;
}

/* Feature area */
.feature-area {
    background-color: #6799D1;
}

/* GridView style overrides */
.grid-view {
    border-width: 0;
    border-color: white;
}

.grid-view table {
    border-collapse: collapse;
}

/* Detail view */
.details-view {
    border-width: 0;
    border-color: white;
}