
/*============================================================================*/

:root {
  --secweb-blue: #1874CD;
  --secweb-blue-hov: #B5D9FB;
  --secweb-blue2: #072441;
  --secweb-blue2-hov: #072441;
  --secweb-white: #FFF;
  --secweb-white2: #F8F8FF;
  --secweb-black: #000;
  --secweb-pp-orange: #FEC53B;
  --spacing0: 1.00rem;
  --spacing1: 0.50rem;
  --spacing2: 0.25rem;
}

/* Home Page */

#secweb-home-grid-wrapper {
  display: block;
}

.secweb-home-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-gap: var(--spacing2);
}

.secweb-marquis {

}

.secweb-home-stuff {
  padding: 0.50rem;
}

.secweb-home-grid-item {
  color: var(--secweb-blue2);
  background-color: var(--secweb-white);
  padding: var(--spacing2);
  text-align: center;
  border-radius: var(--spacing2);
}

.secweb-hpi-hed {
  text-transform: uppercase;
  font-weight: bold;
  cursor: pointer;
}

.secweb-hpi-hed:hover {
  outline: 2px solid var(--secweb-blue2);
}

.secweb-hpi-hed a {
  color: var(--secweb-blue2);
}

.secweb-hpi-img-main img {
  height: auto;
  width: auto;
  max-width: 110px;
  max-height: 160px;
}

.secweb-hpi-img-sctn img {
  height: auto;
  width: auto;
  max-width: 103px;
  max-height: 140px;
}

.secweb-hpi-txt {

}

.secweb-hpi-adx {

}

#secweb-display-text {
  text-align: center;
  padding: 1rem;
  min-height: 280px;
}

#secweb-display-text a {
  color: #000;
}

#secweb-welcome-navi {
  display: grid;
  grid-template-columns: repeat(2, 1fr);

  cursor: pointer;
  color: var(--secweb-white);
  background-color: var(--secweb-blue2);
}

#secweb-welcome-navi b {
  text-align: center;
  padding: var(--spacing2);
}
#secweb-welcome-navi a {
  color: #FFF;
}

#secweb-welcome-navi a:hover {
/*
  color: var(--secweb-blue);
*/
  text-decoration: underline;
}

#secweb-welcome-navi b[data-id="welcome"] {
  grid-column-start: 1;
  grid-column-end: 4;
  font-size: 1.2em;
}

#secweb-welcome-navi b[data-id="library"] {
  font-size: 1.4em;
}

#secweb-welcome-navi b[data-id="kiosk"] {
  font-size: 1.4em;
}

/* quote of the minute */
#secweb-qotm {
  margin: 2em 1em .5em 1em;
}

#qotm-txt {
  color: var(--secweb-blue2);
  text-align: center;
}

#qotm-quote {
  color: var(--secweb-black);
  overflow: auto;
  margin: 0px;
  padding: .5em;
  border: 1px solid var(--secweb-blue2);
  border-radius: 5px;
  background: var(--secweb-white2);
  text-align: justify;
  height: 230px;
  overflow: auto;
}

#qotm-ctrl {
  display: block;
  color: var(--secweb-blue2);
}

#qotm-new,
#qotm-stp {
  cursor: pointer;
}

#qotm-new:hover,
#qotm-stp:hover {
  color :var(--secweb-blue);
}

.secweb-welcome {
  cursor: pointer;
}

/* large screen */

@media screen and (min-width: 960px) {

  #secweb-home-grid-wrapper {
    display: grid;
    grid-template-columns: 50% 50%;
  }
}

@media screen and (min-width: 600px) {

}

@media screen and (min-width: 400px) {

  #qotm-ctrl {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
  }

  .secweb-hpi-img-main img {
    width: 110px;
    height: 160px;
  }

  .secweb-hpi-img-sctn img {
    width: 103px;
    height: 140px;
  }
}

/*============================================================================*/
